Skip to content

Commit bad958b

Browse files
eadwinCodeeadwinCode
committed
Added Component and LazyComponent, refactor NodeContext and BuildContext and fixed component dynamic loading
1 parent dad8df0 commit bad958b

File tree

10 files changed

+443
-366
lines changed

10 files changed

+443
-366
lines changed

‎bootstrap_exercise.py

Lines changed: 99 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
from py_html.contrib.bootstrap.main import BootstrapHTML
12
from py_html.el.base import render_component
23
from starlette.responses import HTMLResponse
34

@@ -19,31 +20,11 @@
1920

2021
router = ModuleRouter("/example")
2122

23+
2224
@router.get("/", response=HTMLResponse)
2325
def template():
24-
content = el.Html(
25-
content=(
26-
el.Head(
27-
content=lambda ctx: el.Fragment(
28-
el.Title(page_title="Bootstrap Example"),
29-
el.Meta(charset="utf-8"),
30-
el.Meta(name="viewport", content="width=device-width, initial-scale=1"),
31-
# Latest compiled and minified CSS
32-
el.Link(
33-
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css",
34-
rel="stylesheet"
35-
),
36-
el.Link(
37-
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css",
38-
rel="stylesheet"
39-
),
40-
# Latest compiled JavaScript
41-
el.Script(
42-
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
43-
),
44-
*(ctx.get('root_styles', []))
45-
)
46-
),
26+
content = BootstrapHTML(
27+
content=[
4728
el.Body(
4829
content=lambda ctx: el.Fragment(
4930
"""
@@ -80,116 +61,116 @@ def template():
8061
el.P(content="This is some text.")
8162
)
8263
),
83-
BContainer(
84-
class_name=f"p-5 my-5 border",
85-
content=(
86-
el.H1(content="Avatars Examples"),
87-
el.Div(class_name="mt-2", content=(
88-
BAvatar(text="Foo", class_name="mx-2", size="72px"),
89-
BAvatar(icon="people-fill", class_name="mx-2", size="72px"),
90-
BAvatar(
91-
icon="people-fill",
92-
class_name="mx-2",
93-
size="45px",
94-
badge='100',
95-
variant="primary",
96-
badge_variant="dark"
97-
),
98-
BAvatar(
99-
icon="people-fill",
100-
class_name="mx-2",
101-
size="45px",
102-
badge=BIcon(icon_name="exclamation-circle-fill",variant="warning"),
103-
variant="danger",
104-
badge_variant="danger",
105-
badge_position="bottom-left"
106-
),
107-
)),
108-
el.Hr(),
109-
el.H1(content="Avatars Group Examples"),
110-
el.Div(class_name="mt-2", content=(
111-
BAvatarGroup(
112-
size="4rem",
113-
over_lap=0.2,
114-
content=(
115-
BAvatar(text="Foo", size="72px"),
116-
BAvatar(icon="people-fill", size="72px"),
117-
BAvatar(
118-
icon="people-fill",
119-
size="45px",
120-
badge='100',
121-
variant="primary",
122-
badge_variant="dark"
123-
),
124-
BAvatar(
125-
icon="people-fill",
126-
size="45px",
127-
badge=BIcon(icon_name="exclamation-circle-fill", variant="warning"),
128-
variant="danger",
129-
badge_variant="danger",
130-
badge_position="bottom-left"
131-
),
64+
BContainer(
65+
class_name=f"p-5 my-5 border",
66+
content=(
67+
el.H1(content="Avatars Examples"),
68+
el.Div(class_name="mt-2", content=(
69+
BAvatar(text="Foo", class_name="mx-2", size="72px"),
70+
BAvatar(icon="people-fill", class_name="mx-2", size="72px"),
71+
BAvatar(
72+
icon="people-fill",
73+
class_name="mx-2",
74+
size="45px",
75+
badge='100',
76+
variant="primary",
77+
badge_variant="dark"
78+
),
79+
BAvatar(
80+
icon="people-fill",
81+
class_name="mx-2",
82+
size="45px",
83+
badge=BIcon(icon_name="exclamation-circle-fill",variant="warning"),
84+
variant="danger",
85+
badge_variant="danger",
86+
badge_position="bottom-left"
87+
),
88+
)),
89+
el.Hr(),
90+
el.H1(content="Avatars Group Examples"),
91+
el.Div(class_name="mt-2", content=(
92+
BAvatarGroup(
93+
size=f"{i+1 * 2}rem",
94+
over_lap=0.2,
95+
content=(
96+
BAvatar(text="Foo", size="72px"),
97+
BAvatar(icon="people-fill", size="72px"),
98+
BAvatar(
99+
icon="people-fill",
100+
size="45px",
101+
badge='100',
102+
variant="primary",
103+
badge_variant="dark"
104+
),
105+
BAvatar(
106+
icon="people-fill",
107+
size="45px",
108+
badge=BIcon(icon_name="exclamation-circle-fill", variant="warning"),
109+
variant="danger",
110+
badge_variant="danger",
111+
badge_position="bottom-right"
112+
),
113+
)
132114
)
133-
)
134-
)),
115+
for i in range(5)
116+
)),
135117

136-
)
137-
),
138-
BContainer(
139-
class_name="p-5 my-5 border",
140-
content=el.Div(
141-
class_name="h2 mb-0",
142-
content=(
143-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1", variant="success"),
144-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="warning"),
145-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="info"),
146-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="danger"),
147-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="primary"),
148-
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="secondary"),
149-
BIcon(icon_name="exclamation-circle", class_name="mx-1 bg-info",variant="dark",),
150-
BIcon(icon_name="bell-fill", class_name="border rounded p-2 mx-1", variant="dark"),
151118
)
152-
)
153-
),
154-
el.Fragment(ctx.get('root_styles', [])),
155-
BContainer(
156-
class_name="p-5 my-5 bg-primary text-white",
157-
content=el.Fragment(
158-
BRow(
159-
class_name="justify-content-md-center",
160-
content=[
161-
BCol(col=True, lg=2, content="1 of 3", style=StyleCSS(background_color="red")),
162-
BCol(cols="12", md="auto", content="Variable width content",
163-
style=StyleCSS(background_color="yellow")),
164-
BCol(col=True, lg=2, content="Variable width content",
165-
style=StyleCSS(background_color="pink")),
166-
]
167-
),
168-
BRow(
169-
content=[
170-
BCol(content="1 of 3", style=StyleCSS(background_color="orange")),
171-
BCol(cols="12", md="auto", content="Variable width content",
172-
style=StyleCSS(background_color="gray")),
173-
BCol(col=True, lg=2, content="Variable width content",
174-
style=StyleCSS(background_color="smoke")),
175-
]
119+
),
120+
BContainer(
121+
class_name="p-5 my-5 border",
122+
content=el.Div(
123+
class_name="h2 mb-0",
124+
content=(
125+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1", variant="success"),
126+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="warning"),
127+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="info"),
128+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="danger"),
129+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="primary"),
130+
BIcon(icon_name="exclamation-circle-fill", class_name="mx-1",variant="secondary"),
131+
BIcon(icon_name="exclamation-circle", class_name="mx-1 bg-info",variant="dark",),
132+
BIcon(icon_name="bell-fill", class_name="border rounded p-2 mx-1", variant="dark"),
133+
)
176134
)
177-
)
178-
),
135+
),
136+
BContainer(
137+
class_name="p-5 my-5 bg-primary text-white",
138+
content=el.Fragment(
139+
BRow(
140+
class_name="justify-content-md-center",
141+
content=[
142+
BCol(col=True, lg=2, content="1 of 3", style=StyleCSS(background_color="red")),
143+
BCol(cols="12", md="auto", content="Variable width content",
144+
style=StyleCSS(background_color="yellow")),
145+
BCol(col=True, lg=2, content="Variable width content",
146+
style=StyleCSS(background_color="pink")),
147+
]
148+
),
149+
BRow(
150+
content=[
151+
BCol(content="1 of 3", style=StyleCSS(background_color="orange")),
152+
BCol(cols="12", md="auto", content="Variable width content",
153+
style=StyleCSS(background_color="gray")),
154+
BCol(col=True, lg=2, content="Variable width content",
155+
style=StyleCSS(background_color="smoke")),
156+
]
157+
)
158+
)
159+
),
179160
)
180161
)
181-
)
162+
]
182163
)
183164

184165
return render_component(content, {})
185166

167+
186168
def bootstrap():
187169
application = AppFactory.create_app(routers=[router])
188170
return application
189171

190172

191173
cli = create_ellar_cli("bootstrap_exercise:bootstrap")
192174

193-
194175
if __name__ == "__main__":
195-
cli()
176+
cli()

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy