Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/app.py
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
from app.export import export_site

app = rx.App(
enable_state=False,
# enable_state=False,
head_components=[
rx.el.script(src="/fuse/fuse-init.js", type="module"),
rx.el.script(src="/fuse/searchFunction.js"),
Expand Down
134 changes: 88 additions & 46 deletions app/examples/components.py
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,7 @@
from components.ui.button import button
from components.ui.checkbox import checkbox
from components.ui.input import input
from components.ui.input_group import (
input_with_addons,
textarea_with_footer,
)
from components.ui.input_group import input_group
from components.ui.metric import metric
from components.ui.slider import slider
from components.ui.switch import switch
Expand Down Expand Up @@ -42,11 +39,16 @@ def card_one() -> rx.Component:
class_name="w-full grid grid-cols-3 items-center gap-x-2",
),
rx.el.div(
input(placeholder="name", class_name="!bg-secondary"),
textarea_with_footer(
placeholder="Enter your message",
footer_text="120 characters left",
class_name="!bg-secondary",
input(placeholder="name"),
input_group.root(
input_group.textarea(
id="block-end-textarea",
placeholder="Write a comment...",
),
input_group.addon(
input_group.text("0/280"),
align="block-end",
),
),
class_name="flex flex-col gap-y-2",
),
Expand Down Expand Up @@ -358,11 +360,16 @@ def card_five() -> rx.Component:
"Amount to Transfer",
class_name="text-sm font-semibold text-foreground",
),
input_with_addons(
placeholder="1,200.00",
class_name="!bg-secondary px-1",
prefix="$",
suffix="USD",
input_group.root(
input_group.addon(
input_group.text("$"),
align="inline-start",
),
input_group.input(placeholder="0.00"),
input_group.addon(
input_group.text("USD"),
align="inline-end",
),
),
class_name="w-full flex flex-col gap-y-2 relative",
),
Expand Down Expand Up @@ -732,12 +739,15 @@ def card_ten() -> rx.Component:
field["label"],
class_name="text-sm font-semibold text-foreground",
),
input_with_addons(
placeholder=field["placeholder"],
prefix=hi(
field["icon"], class_name="size-4 text-muted-foreground"
input_group.root(
input_group.input(
id="inline-start-input",
placeholder=field["placeholder"],
),
input_group.addon(
hi(field["icon"], class_name="text-muted-foreground"),
align="inline-start",
),
class_name="!bg-secondary pl-2",
),
class_name="w-full flex flex-col gap-y-2",
)
Expand Down Expand Up @@ -830,14 +840,20 @@ def local_panel() -> rx.Component:
tabs.panel(
rx.el.div(
rx.el.div(
input_with_addons(
value="https://github.com/LineIndent/ui.git",
placeholder="",
suffix=hi(
"Copy01Icon",
class_name="size-4 text-muted-foreground cursor-pointer",
input_group.root(
input_group.input(
placeholder="https://github.com/LineIndent/ui.git",
read_only=True,
),
input_group.addon(
input_group.button(
hi("Copy01Icon"),
aria_label="Copy",
title="Copy",
size="icon-xs",
),
align="inline-end",
),
class_name="!bg-secondary text-xs pr-2",
),
rx.el.p(
"Clone using the web URL.",
Expand All @@ -853,14 +869,20 @@ def local_panel() -> rx.Component:
# SSH panel
tabs.panel(
rx.el.div(
input_with_addons(
value="git@github.com:LineIndent/ui.git",
placeholder="",
suffix=hi(
"Copy01Icon",
class_name="size-4 text-muted-foreground cursor-pointer",
input_group.root(
input_group.input(
placeholder="git@github.com:LineIndent/ui.git",
read_only=True,
),
input_group.addon(
input_group.button(
hi("Copy01Icon"),
aria_label="Copy",
title="Copy",
size="icon-xs",
),
align="inline-end",
),
class_name="!bg-secondary text-xs pr-2",
),
class_name="w-full pt-3",
),
Expand All @@ -870,14 +892,20 @@ def local_panel() -> rx.Component:
# GitHub CLI panel
tabs.panel(
rx.el.div(
input_with_addons(
value="gh repo clone LineIndent/ui",
placeholder="",
suffix=hi(
"Copy01Icon",
class_name="size-4 text-muted-foreground cursor-pointer",
input_group.root(
input_group.input(
placeholder="gh repo clone LineIndent/ui",
read_only=True,
),
input_group.addon(
input_group.button(
hi("Copy01Icon"),
aria_label="Copy",
title="Copy",
size="icon-xs",
),
align="inline-end",
),
class_name="!bg-secondary text-xs pr-2",
),
class_name="w-full pt-3",
),
Expand Down Expand Up @@ -1017,7 +1045,7 @@ def card_twelve() -> rx.Component:
),
class_name="flex flex-col gap-y-0.5 flex-1",
),
switch(default_checked=row["default"]),
switch.root(switch.thumb(), default_checked=row["default"]),
class_name="w-full flex flex-row items-start justify-between gap-x-4 py-3 border-b border-input last:border-b-0",
)
for row in toggle_rows
Expand Down Expand Up @@ -1335,9 +1363,20 @@ def member_row(member: dict) -> rx.Component:
"Or share invite link",
class_name="text-sm font-semibold text-foreground",
),
input_with_addons(
default_value="https://app.co/invite/x8f2k",
suffix=hi("Copy01Icon", class_name="size-4 text-muted-foreground mr-2"),
input_group.root(
input_group.input(
placeholder="https://app.co/invite/x8f2k",
read_only=True,
),
input_group.addon(
input_group.button(
hi("Copy01Icon"),
aria_label="Copy",
title="Copy",
size="icon-xs",
),
align="inline-end",
),
),
class_name="w-full flex flex-col gap-y-2",
),
Expand Down Expand Up @@ -1366,8 +1405,11 @@ def card_seventeen() -> rx.Component:
),
# Search input
rx.el.div(
input_with_addons(
placeholder="example.com",
input_group.root(
input_group.input(
placeholder="example.com",
read_only=True,
),
),
class_name="w-full max-w-md mx-auto",
),
Expand Down
12 changes: 5 additions & 7 deletions app/pages/blocks.py
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
from app.www.library.blocks.line_chart_02 import line_chart_02
from app.www.library.blocks.line_chart_03 import line_chart_03
from app.www.library.blocks.line_chart_04 import line_chart_04
from components.ui.button import BUTTON_VARIANTS, button
from components.ui.button import button

BLOCKS = [
{"name": "All", "value": "all"},
Expand All @@ -38,15 +38,13 @@ def blocks_page():
return rx.el.div(
rx.el.div(
*[
button(
rx.el.button(
item["name"],
size="sm",
on_click=selected_blocks_category.set_value(item["value"]),
class_name="transition-none "
+ rx.cond(
class_name=rx.cond(
selected_blocks_category.value == item["value"],
BUTTON_VARIANTS["variant"]["default"],
BUTTON_VARIANTS["variant"]["outline"],
"text-foreground font-medium cursor-pointer",
"text-muted-foreground font-normal hover:text-foreground cursor-pointer",
).to(str),
)
for item in BLOCKS
Expand Down
44 changes: 20 additions & 24 deletions app/pages/charts.py
Original file line number Diff line number Diff line change
Expand Up @@ -15,16 +15,7 @@
from app.www.library.charts.scatter.v1 import scatterchart_v1
from components.ui.button import button

GRID_LAYOUT = " ".join(
[
"grid grid-cols-1 lg:grid-cols-3",
"divide-y lg:divide-y-0",
"lg:divide-x",
"[&>div]:p-7",
"divide-input/40",
"border-x border-input/40",
]
)
GRID_LAYOUT = " ".join(["grid grid-cols-1 lg:grid-cols-3", "gap-10 sm:gap-7"])


@layout_decorator(
Expand All @@ -39,26 +30,31 @@
)
def chart_page():
return rx.el.div(
rx.el.div(areachart_v5(), class_name="w-full p-7"),
rx.el.hr(class_name="border border-input/40"),
rx.el.div(areachart_v5(), class_name="w-full"),
rx.el.div(
barchart_v1(),
areachart_v9(),
doughnutchart_v1(),
class_name=GRID_LAYOUT,
),
rx.el.div(barchart_v5(), class_name="w-full"),
rx.el.div(
linechart_v8(), barchart_v1(), doughnutchart_v1(), class_name=GRID_LAYOUT
linechart_v8(),
barchart_v9(),
scatterchart_v1(),
class_name=GRID_LAYOUT,
),
rx.el.hr(class_name="border border-input/40"),
rx.el.div(barchart_v5(), class_name="w-full p-7"),
rx.el.hr(class_name="border border-input/40"),
rx.el.div(linechart_v7(), class_name="w-full"),
rx.el.div(
areachart_v9(), radar_v6(), scatterchart_v1(), class_name=GRID_LAYOUT
linechart_v5(),
radar_v6(),
piechart_v1(),
class_name=GRID_LAYOUT,
),
rx.el.hr(class_name="border border-input/40"),
rx.el.div(linechart_v7(), class_name="w-full p-7"),
rx.el.hr(class_name="border border-input/40"),
rx.el.div(linechart_v5(), barchart_v9(), piechart_v1(), class_name=GRID_LAYOUT),
rx.el.hr(class_name="border border-input/40"),
class_name=" ".join(
[
"max-w-[96rem] mx-auto px-0 md:px-8",
"py-6 space-y-10",
"flex flex-col max-w-[96rem] mx-auto px-4 md:px-8",
"py-6 gap-10 sm:gap-7",
]
),
)
2 changes: 1 addition & 1 deletion app/pages/components.py
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ def components_page():
class_name=" ".join(
[
"grid",
"grid-cols-1",
"grid-cols-2",
"sm:grid-cols-2",
"md:grid-cols-3",
"lg:grid-cols-4",
Expand Down
10 changes: 9 additions & 1 deletion app/registry/components.py
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,10 @@
"files": ["components/ui/button.py"],
"dependencies": ["others_icons", "component"],
},
"button_group": {
"files": ["components/ui/button_group.py"],
"dependencies": ["separator", "component", "base_ui"],
},
"card": {
"files": ["components/ui/card.py"],
"dependencies": ["component"],
Expand All @@ -79,7 +83,7 @@
},
"context_menu": {
"files": ["components/ui/context_menu.py"],
"dependencies": ["twmerge", "base_ui", "button"],
"dependencies": ["twmerge", "base_ui", "component", "hugeicon"],
},
"dialog": {
"files": ["components/ui/dialog.py"],
Expand Down Expand Up @@ -137,6 +141,10 @@
"files": ["components/ui/scroll_area.py"],
"dependencies": ["twmerge", "base_ui"],
},
"separator": {
"files": ["components/ui/separator.py"],
"dependencies": ["base_ui"],
},
"select": {
"files": ["components/ui/select.py"],
"dependencies": ["hugeicon", "others_icons", "twmerge", "base_ui", "button"],
Expand Down
Loading
Loading