Move core components to radix namespace (#2506)
This commit is contained in:
Nikhil Rao
GitHub
parent
8a3cec11cd
commit
05d1be2182
@ -5,7 +5,7 @@ branch = true
|
||||
[report]
|
||||
show_missing = true
|
||||
# TODO bump back to 79
|
||||
fail_under = 70
|
||||
fail_under = 69
|
||||
precision = 2
|
||||
|
||||
# Regexes for lines to exclude from consideration
|
||||
@ -28,4 +28,4 @@ exclude_also =
|
||||
ignore_errors = True
|
||||
|
||||
[html]
|
||||
directory = coverage_html_report
|
||||
directory = coverage_html_report
|
||||
|
||||
@ -59,11 +59,11 @@ def BackgroundTask():
|
||||
|
||||
def index() -> rx.Component:
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="token", value=State.router.session.client_token, is_read_only=True
|
||||
),
|
||||
rx.heading(State.counter, id="counter"),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="iterations",
|
||||
placeholder="Iterations",
|
||||
value=State.iterations.to_string(), # type: ignore
|
||||
|
||||
@ -142,17 +142,17 @@ def CallScript():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=CallScriptState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=CallScriptState.inline_counter.to(str), # type: ignore
|
||||
id="inline_counter",
|
||||
is_read_only=True,
|
||||
),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=CallScriptState.external_counter.to(str), # type: ignore
|
||||
id="external_counter",
|
||||
is_read_only=True,
|
||||
|
||||
@ -55,18 +55,18 @@ def ClientSide():
|
||||
|
||||
def index():
|
||||
return rx.fragment(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=ClientSideState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
placeholder="state var",
|
||||
value=ClientSideState.state_var,
|
||||
on_change=ClientSideState.set_state_var, # type: ignore
|
||||
id="state_var",
|
||||
),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
placeholder="input value",
|
||||
value=ClientSideState.input_value,
|
||||
on_change=ClientSideState.set_input_value, # type: ignore
|
||||
|
||||
@ -35,13 +35,15 @@ def DynamicRoute():
|
||||
|
||||
def index():
|
||||
return rx.fragment(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=DynamicState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
),
|
||||
rx.input(value=DynamicState.page_id, is_read_only=True, id="page_id"),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=DynamicState.page_id, is_read_only=True, id="page_id"
|
||||
),
|
||||
rx.chakra.input(
|
||||
value=DynamicState.router.page.raw_path,
|
||||
is_read_only=True,
|
||||
id="raw_path",
|
||||
@ -52,8 +54,8 @@ def DynamicRoute():
|
||||
"next", href="/page/" + DynamicState.next_page, id="link_page_next" # type: ignore
|
||||
),
|
||||
rx.link("missing", href="/missing", id="link_missing"),
|
||||
rx.list(
|
||||
rx.foreach(DynamicState.order, lambda i: rx.list_item(rx.text(i))), # type: ignore
|
||||
rx.chakra.list(
|
||||
rx.foreach(DynamicState.order, lambda i: rx.chakra.list_item(rx.text(i))), # type: ignore
|
||||
),
|
||||
)
|
||||
|
||||
|
||||
@ -42,7 +42,7 @@ def TestEventAction():
|
||||
|
||||
def index():
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=EventActionState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
@ -121,10 +121,10 @@ def TestEventAction():
|
||||
"custom-prevent-default"
|
||||
).prevent_default,
|
||||
),
|
||||
rx.list(
|
||||
rx.chakra.list(
|
||||
rx.foreach(
|
||||
EventActionState.order, # type: ignore
|
||||
rx.list_item,
|
||||
rx.chakra.list_item,
|
||||
),
|
||||
),
|
||||
on_click=EventActionState.on_click("outer"), # type: ignore
|
||||
|
||||
@ -124,7 +124,7 @@ def EventChain():
|
||||
|
||||
app = rx.App(state=rx.State)
|
||||
|
||||
token_input = rx.input(
|
||||
token_input = rx.chakra.input(
|
||||
value=State.router.session.client_token, is_read_only=True, id="token"
|
||||
)
|
||||
|
||||
@ -132,7 +132,9 @@ def EventChain():
|
||||
def index():
|
||||
return rx.fragment(
|
||||
token_input,
|
||||
rx.input(value=State.interim_value, is_read_only=True, id="interim_value"),
|
||||
rx.chakra.input(
|
||||
value=State.interim_value, is_read_only=True, id="interim_value"
|
||||
),
|
||||
rx.button(
|
||||
"Return Event",
|
||||
id="return_event",
|
||||
|
||||
@ -27,28 +27,28 @@ def FormSubmit():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=FormState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
),
|
||||
rx.form(
|
||||
rx.form.root(
|
||||
rx.vstack(
|
||||
rx.input(id="name_input"),
|
||||
rx.hstack(rx.pin_input(length=4, id="pin_input")),
|
||||
rx.number_input(id="number_input"),
|
||||
rx.chakra.input(id="name_input"),
|
||||
rx.hstack(rx.chakra.pin_input(length=4, id="pin_input")),
|
||||
rx.chakra.number_input(id="number_input"),
|
||||
rx.checkbox(id="bool_input"),
|
||||
rx.switch(id="bool_input2"),
|
||||
rx.checkbox(id="bool_input3"),
|
||||
rx.switch(id="bool_input4"),
|
||||
rx.slider(id="slider_input"),
|
||||
rx.range_slider(id="range_input"),
|
||||
rx.slider(id="slider_input", default_value=[50], width="100%"),
|
||||
rx.chakra.range_slider(id="range_input"),
|
||||
rx.radio_group(["option1", "option2"], id="radio_input"),
|
||||
rx.radio_group(FormState.var_options, id="radio_input_var"),
|
||||
rx.select(["option1", "option2"], id="select_input"),
|
||||
rx.select(FormState.var_options, id="select_input_var"),
|
||||
rx.chakra.select(["option1", "option2"], id="select_input"),
|
||||
rx.chakra.select(FormState.var_options, id="select_input_var"),
|
||||
rx.text_area(id="text_area_input"),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="debounce_input",
|
||||
debounce_timeout=0,
|
||||
on_change=rx.console_log,
|
||||
@ -80,37 +80,41 @@ def FormSubmitName():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=FormState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
),
|
||||
rx.form(
|
||||
rx.form.root(
|
||||
rx.vstack(
|
||||
rx.input(name="name_input"),
|
||||
rx.hstack(rx.pin_input(length=4, name="pin_input")),
|
||||
rx.number_input(name="number_input"),
|
||||
rx.chakra.input(name="name_input"),
|
||||
rx.hstack(rx.chakra.pin_input(length=4, name="pin_input")),
|
||||
rx.chakra.number_input(name="number_input"),
|
||||
rx.checkbox(name="bool_input"),
|
||||
rx.switch(name="bool_input2"),
|
||||
rx.checkbox(name="bool_input3"),
|
||||
rx.switch(name="bool_input4"),
|
||||
rx.slider(name="slider_input"),
|
||||
rx.range_slider(name="range_input"),
|
||||
rx.slider(name="slider_input", default_value=[50], width="100%"),
|
||||
rx.chakra.range_slider(name="range_input"),
|
||||
rx.radio_group(FormState.options, name="radio_input"),
|
||||
rx.select(FormState.options, name="select_input"),
|
||||
rx.select(
|
||||
FormState.options,
|
||||
name="select_input",
|
||||
default_value=FormState.options[0],
|
||||
),
|
||||
rx.text_area(name="text_area_input"),
|
||||
rx.input_group(
|
||||
rx.input_left_element(rx.icon(tag="chevron_right")),
|
||||
rx.input(
|
||||
rx.chakra.input_group(
|
||||
rx.chakra.input_left_element(rx.icon(tag="chevron_right")),
|
||||
rx.chakra.input(
|
||||
name="debounce_input",
|
||||
debounce_timeout=0,
|
||||
on_change=rx.console_log,
|
||||
),
|
||||
rx.input_right_element(rx.icon(tag="chevron_left")),
|
||||
rx.chakra.input_right_element(rx.icon(tag="chevron_left")),
|
||||
),
|
||||
rx.button_group(
|
||||
rx.chakra.button_group(
|
||||
rx.button("Submit", type_="submit"),
|
||||
rx.icon_button(FormState.val, icon=rx.icon(tag="add")),
|
||||
rx.icon_button(FormState.val, icon=rx.icon(tag="plus")),
|
||||
variant="outline",
|
||||
is_attached=True,
|
||||
),
|
||||
@ -194,16 +198,16 @@ async def test_submit(driver, form_submit: AppHarness):
|
||||
for _ in range(3):
|
||||
buttons[1].click()
|
||||
|
||||
checkbox_input = driver.find_element(By.CLASS_NAME, "chakra-checkbox__control")
|
||||
checkbox_input = driver.find_element(By.XPATH, "//button[@role='checkbox']")
|
||||
checkbox_input.click()
|
||||
|
||||
switch_input = driver.find_element(By.CLASS_NAME, "chakra-switch__track")
|
||||
switch_input = driver.find_element(By.XPATH, "//button[@role='switch']")
|
||||
switch_input.click()
|
||||
|
||||
radio_buttons = driver.find_elements(By.CLASS_NAME, "chakra-radio__control")
|
||||
radio_buttons = driver.find_elements(By.XPATH, "//button[@role='radio']")
|
||||
radio_buttons[1].click()
|
||||
|
||||
textarea_input = driver.find_element(By.CLASS_NAME, "chakra-textarea")
|
||||
textarea_input = driver.find_element(By.TAG_NAME, "textarea")
|
||||
textarea_input.send_keys("Some", Keys.ENTER, "Text")
|
||||
|
||||
debounce_input = driver.find_element(by, "debounce_input")
|
||||
@ -213,7 +217,7 @@ async def test_submit(driver, form_submit: AppHarness):
|
||||
|
||||
prev_url = driver.current_url
|
||||
|
||||
submit_input = driver.find_element(By.CLASS_NAME, "chakra-button")
|
||||
submit_input = driver.find_element(By.CLASS_NAME, "rt-Button")
|
||||
submit_input.click()
|
||||
|
||||
async def get_form_data():
|
||||
|
||||
@ -21,16 +21,16 @@ def FullyControlledInput():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.fragment(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=State.router.session.client_token, is_read_only=True, id="token"
|
||||
),
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="debounce_input_input",
|
||||
on_change=State.set_text, # type: ignore
|
||||
value=State.text,
|
||||
),
|
||||
rx.input(value=State.text, id="value_input", is_read_only=True),
|
||||
rx.input(on_change=State.set_text, id="on_change_input"), # type: ignore
|
||||
rx.chakra.input(value=State.text, id="value_input", is_read_only=True),
|
||||
rx.chakra.input(on_change=State.set_text, id="on_change_input"), # type: ignore
|
||||
rx.el.input(
|
||||
value=State.text,
|
||||
id="plain_value_input",
|
||||
|
||||
@ -28,7 +28,7 @@ def LoginSample():
|
||||
yield rx.redirect("/")
|
||||
|
||||
def index():
|
||||
return rx.Cond.create(
|
||||
return rx.cond(
|
||||
State.is_hydrated & State.auth_token, # type: ignore
|
||||
rx.vstack(
|
||||
rx.heading(State.auth_token, id="auth-token"),
|
||||
|
||||
@ -38,12 +38,12 @@ def ServerSideEvent():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.fragment(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="token", value=SSState.router.session.client_token, is_read_only=True
|
||||
),
|
||||
rx.input(default_value="a", id="a"),
|
||||
rx.input(default_value="b", id="b"),
|
||||
rx.input(default_value="c", id="c"),
|
||||
rx.chakra.input(default_value="a", id="a"),
|
||||
rx.chakra.input(default_value="b", id="b"),
|
||||
rx.chakra.input(default_value="c", id="c"),
|
||||
rx.button(
|
||||
"Clear Immediate",
|
||||
id="clear_immediate",
|
||||
|
||||
@ -62,7 +62,7 @@ def StateInheritance():
|
||||
|
||||
def index() -> rx.Component:
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="token", value=Base1.router.session.client_token, is_read_only=True
|
||||
),
|
||||
rx.heading(Base1.computed_mixin, id="base1-computed_mixin"),
|
||||
|
||||
@ -31,13 +31,13 @@ def Table():
|
||||
@app.add_page
|
||||
def index():
|
||||
return rx.center(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
id="token",
|
||||
value=TableState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
),
|
||||
rx.table_container(
|
||||
rx.table(
|
||||
rx.chakra.table_container(
|
||||
rx.chakra.table(
|
||||
headers=TableState.headers,
|
||||
rows=TableState.rows,
|
||||
footers=TableState.footers,
|
||||
@ -52,36 +52,36 @@ def Table():
|
||||
@app.add_page
|
||||
def another():
|
||||
return rx.center(
|
||||
rx.table_container(
|
||||
rx.table( # type: ignore
|
||||
rx.thead( # type: ignore
|
||||
rx.tr( # type: ignore
|
||||
rx.th("Name"),
|
||||
rx.th("Age"),
|
||||
rx.th("Location"),
|
||||
rx.chakra.table_container(
|
||||
rx.chakra.table( # type: ignore
|
||||
rx.chakra.thead( # type: ignore
|
||||
rx.chakra.tr( # type: ignore
|
||||
rx.chakra.th("Name"),
|
||||
rx.chakra.th("Age"),
|
||||
rx.chakra.th("Location"),
|
||||
)
|
||||
),
|
||||
rx.tbody( # type: ignore
|
||||
rx.tr( # type: ignore
|
||||
rx.td("John"),
|
||||
rx.td(30),
|
||||
rx.td("New York"),
|
||||
rx.chakra.tbody( # type: ignore
|
||||
rx.chakra.tr( # type: ignore
|
||||
rx.chakra.td("John"),
|
||||
rx.chakra.td(30),
|
||||
rx.chakra.td("New York"),
|
||||
),
|
||||
rx.tr( # type: ignore
|
||||
rx.td("Jane"),
|
||||
rx.td(31),
|
||||
rx.td("San Francisco"),
|
||||
rx.chakra.tr( # type: ignore
|
||||
rx.chakra.td("Jane"),
|
||||
rx.chakra.td(31),
|
||||
rx.chakra.td("San Francisco"),
|
||||
),
|
||||
rx.tr( # type: ignore
|
||||
rx.td("Joe"),
|
||||
rx.td(32),
|
||||
rx.td("Los Angeles"),
|
||||
rx.chakra.tr( # type: ignore
|
||||
rx.chakra.td("Joe"),
|
||||
rx.chakra.td(32),
|
||||
rx.chakra.td("Los Angeles"),
|
||||
),
|
||||
),
|
||||
rx.tfoot( # type: ignore
|
||||
rx.tr(rx.td("footer1"), rx.td("footer2"), rx.td("footer3")) # type: ignore
|
||||
rx.chakra.tfoot( # type: ignore
|
||||
rx.chakra.tr(rx.chakra.td("footer1"), rx.chakra.td("footer2"), rx.chakra.td("footer3")) # type: ignore
|
||||
),
|
||||
rx.table_caption("random caption"),
|
||||
rx.chakra.table_caption("random caption"),
|
||||
variant="striped",
|
||||
color_scheme="teal",
|
||||
)
|
||||
|
||||
@ -30,7 +30,7 @@ def TailwindApp(
|
||||
|
||||
def index():
|
||||
return rx.el.div(
|
||||
rx.text(paragraph_text, class_name=paragraph_class_name),
|
||||
rx.chakra.text(paragraph_text, class_name=paragraph_class_name),
|
||||
rx.el.p(paragraph_text, class_name=paragraph_class_name),
|
||||
rdxt.text(paragraph_text, as_="p", class_name=paragraph_class_name),
|
||||
id="p-content",
|
||||
|
||||
@ -41,7 +41,7 @@ def UploadFile():
|
||||
|
||||
def index():
|
||||
return rx.vstack(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
value=UploadState.router.session.client_token,
|
||||
is_read_only=True,
|
||||
id="token",
|
||||
@ -61,7 +61,7 @@ def UploadFile():
|
||||
rx.box(
|
||||
rx.foreach(
|
||||
rx.selected_files,
|
||||
lambda f: rx.text(f),
|
||||
lambda f: rx.text(f, as_="p"),
|
||||
),
|
||||
id="selected_files",
|
||||
),
|
||||
@ -91,7 +91,7 @@ def UploadFile():
|
||||
rx.box(
|
||||
rx.foreach(
|
||||
rx.selected_files("secondary"),
|
||||
lambda f: rx.text(f),
|
||||
lambda f: rx.text(f, as_="p"),
|
||||
),
|
||||
id="selected_files_secondary",
|
||||
),
|
||||
|
||||
@ -532,7 +532,7 @@ def VarOperations():
|
||||
VarOperationState.html_str,
|
||||
id="html_str",
|
||||
),
|
||||
rx.highlight(
|
||||
rx.chakra.highlight(
|
||||
"second",
|
||||
query=[VarOperationState.str_var2],
|
||||
),
|
||||
@ -542,14 +542,15 @@ def VarOperations():
|
||||
rx.text(rx.Var.range(0, 3).join(","), id="list_join_range4"),
|
||||
rx.box(
|
||||
rx.foreach(
|
||||
rx.Var.range(0, 2), lambda x: rx.text(VarOperationState.list1[x])
|
||||
rx.Var.range(0, 2),
|
||||
lambda x: rx.text(VarOperationState.list1[x], as_="p"),
|
||||
),
|
||||
id="foreach_list_arg",
|
||||
),
|
||||
rx.box(
|
||||
rx.foreach(
|
||||
rx.Var.range(0, 2),
|
||||
lambda x, ix: rx.text(VarOperationState.list1[ix]),
|
||||
lambda x, ix: rx.text(VarOperationState.list1[ix], as_="p"),
|
||||
),
|
||||
id="foreach_list_ix",
|
||||
),
|
||||
@ -558,7 +559,7 @@ def VarOperations():
|
||||
rx.Var.create_safe(list(range(0, 3))).to(list[int]),
|
||||
lambda x: rx.foreach(
|
||||
rx.Var.range(x),
|
||||
lambda y: rx.text(VarOperationState.list1[y]),
|
||||
lambda y: rx.text(VarOperationState.list1[y], as_="p"),
|
||||
),
|
||||
),
|
||||
id="foreach_list_nested",
|
||||
|
||||
@ -594,7 +594,12 @@ export const getRefValue = (ref) => {
|
||||
return;
|
||||
}
|
||||
if (ref.current.type == "checkbox") {
|
||||
return ref.current.checked;
|
||||
return ref.current.checked; // chakra
|
||||
} else if (ref.current.className.includes("rt-CheckboxButton") || ref.current.className.includes("rt-SwitchButton")) {
|
||||
return ref.current.ariaChecked == "true"; // radix
|
||||
} else if (ref.current.className.includes("rt-SliderRoot")) {
|
||||
// find the actual slider
|
||||
return ref.current.querySelector(".rt-SliderThumb").ariaValueNow;
|
||||
} else {
|
||||
//querySelector(":checked") is needed to get value from radio_group
|
||||
return ref.current.value || (ref.current.querySelector(':checked') && ref.current.querySelector(':checked').value);
|
||||
|
||||
@ -15,235 +15,93 @@ from reflex.utils import console
|
||||
from reflex.utils.format import to_snake_case
|
||||
|
||||
_ALL_COMPONENTS = [
|
||||
"Accordion",
|
||||
"AccordionButton",
|
||||
"AccordionIcon",
|
||||
"AccordionItem",
|
||||
"AccordionPanel",
|
||||
"Alert",
|
||||
"AlertDescription",
|
||||
"AlertDialog",
|
||||
"AlertDialogBody",
|
||||
"AlertDialogContent",
|
||||
"AlertDialogFooter",
|
||||
"AlertDialogHeader",
|
||||
"AlertDialogOverlay",
|
||||
"AlertIcon",
|
||||
"AlertTitle",
|
||||
"AspectRatio",
|
||||
"Audio",
|
||||
"Avatar",
|
||||
"AvatarBadge",
|
||||
"AvatarGroup",
|
||||
"Badge",
|
||||
"Box",
|
||||
"Breadcrumb",
|
||||
"BreadcrumbItem",
|
||||
"BreadcrumbLink",
|
||||
"BreadcrumbSeparator",
|
||||
"Button",
|
||||
"ButtonGroup",
|
||||
"Card",
|
||||
"CardBody",
|
||||
"CardFooter",
|
||||
"CardHeader",
|
||||
"Center",
|
||||
"Checkbox",
|
||||
"CheckboxGroup",
|
||||
"CircularProgress",
|
||||
"CircularProgressLabel",
|
||||
"Circle",
|
||||
"Code",
|
||||
"CodeBlock",
|
||||
"Collapse",
|
||||
"ColorModeButton",
|
||||
"ColorModeIcon",
|
||||
"ColorModeSwitch",
|
||||
"Component",
|
||||
"Cond",
|
||||
"ConnectionBanner",
|
||||
"ConnectionModal",
|
||||
"Container",
|
||||
"DataTable",
|
||||
"DataEditor",
|
||||
"DataEditorTheme",
|
||||
"DatePicker",
|
||||
"DateTimePicker",
|
||||
"DebounceInput",
|
||||
"Divider",
|
||||
"Drawer",
|
||||
"DrawerBody",
|
||||
"DrawerCloseButton",
|
||||
"DrawerContent",
|
||||
"DrawerFooter",
|
||||
"DrawerHeader",
|
||||
"DrawerOverlay",
|
||||
"Editable",
|
||||
"EditableInput",
|
||||
"EditablePreview",
|
||||
"EditableTextarea",
|
||||
"Editor",
|
||||
"Email",
|
||||
"Fade",
|
||||
"Flex",
|
||||
"Foreach",
|
||||
"Form",
|
||||
"FormControl",
|
||||
"FormErrorMessage",
|
||||
"FormHelperText",
|
||||
"FormLabel",
|
||||
"Fragment",
|
||||
"Grid",
|
||||
"GridItem",
|
||||
"Heading",
|
||||
"Highlight",
|
||||
"Hstack",
|
||||
"Html",
|
||||
"Icon",
|
||||
"IconButton",
|
||||
"Image",
|
||||
"Input",
|
||||
"InputGroup",
|
||||
"InputLeftAddon",
|
||||
"InputLeftElement",
|
||||
"InputRightAddon",
|
||||
"InputRightElement",
|
||||
"Kbd",
|
||||
"Link",
|
||||
"LinkBox",
|
||||
"LinkOverlay",
|
||||
"List",
|
||||
"ListItem",
|
||||
"Markdown",
|
||||
"Match",
|
||||
"Menu",
|
||||
"MenuButton",
|
||||
"MenuDivider",
|
||||
"MenuGroup",
|
||||
"MenuItem",
|
||||
"MenuItemOption",
|
||||
"MenuList",
|
||||
"MenuOptionGroup",
|
||||
"Modal",
|
||||
"ModalBody",
|
||||
"ModalCloseButton",
|
||||
"ModalContent",
|
||||
"ModalFooter",
|
||||
"ModalHeader",
|
||||
"ModalOverlay",
|
||||
"Moment",
|
||||
"MultiSelect",
|
||||
"MultiSelectOption",
|
||||
"NextLink",
|
||||
"NumberDecrementStepper",
|
||||
"NumberIncrementStepper",
|
||||
"NumberInput",
|
||||
"NumberInputField",
|
||||
"NumberInputStepper",
|
||||
"Option",
|
||||
"OrderedList",
|
||||
"Password",
|
||||
"PinInput",
|
||||
"PinInputField",
|
||||
"Plotly",
|
||||
"Popover",
|
||||
"PopoverAnchor",
|
||||
"PopoverArrow",
|
||||
"PopoverBody",
|
||||
"PopoverCloseButton",
|
||||
"PopoverContent",
|
||||
"PopoverFooter",
|
||||
"PopoverHeader",
|
||||
"PopoverTrigger",
|
||||
"Progress",
|
||||
"Radio",
|
||||
"RadioGroup",
|
||||
"RangeSlider",
|
||||
"RangeSliderFilledTrack",
|
||||
"RangeSliderThumb",
|
||||
"RangeSliderTrack",
|
||||
"ResponsiveGrid",
|
||||
"ScaleFade",
|
||||
"Script",
|
||||
"Select",
|
||||
"Skeleton",
|
||||
"SkeletonCircle",
|
||||
"SkeletonText",
|
||||
"Slide",
|
||||
"SlideFade",
|
||||
"Slider",
|
||||
"SliderFilledTrack",
|
||||
"SliderMark",
|
||||
"SliderThumb",
|
||||
"SliderTrack",
|
||||
"Spacer",
|
||||
"Span",
|
||||
"Spinner",
|
||||
"Square",
|
||||
"Stack",
|
||||
"Stat",
|
||||
"StatArrow",
|
||||
"StatGroup",
|
||||
"StatHelpText",
|
||||
"StatLabel",
|
||||
"StatNumber",
|
||||
"Step",
|
||||
"StepDescription",
|
||||
"StepIcon",
|
||||
"StepIndicator",
|
||||
"StepNumber",
|
||||
"StepSeparator",
|
||||
"StepStatus",
|
||||
"StepTitle",
|
||||
"Stepper",
|
||||
"Switch",
|
||||
"Tab",
|
||||
"TabList",
|
||||
"TabPanel",
|
||||
"TabPanels",
|
||||
"Table",
|
||||
"TableCaption",
|
||||
"TableContainer",
|
||||
"Tabs",
|
||||
"Tag",
|
||||
"TagCloseButton",
|
||||
"TagLabel",
|
||||
"TagLeftIcon",
|
||||
"TagRightIcon",
|
||||
"Tbody",
|
||||
"Td",
|
||||
"Text",
|
||||
"TextArea",
|
||||
"Tfoot",
|
||||
"Th",
|
||||
"Thead",
|
||||
"TimePicker",
|
||||
"Tooltip",
|
||||
"Tr",
|
||||
"UnorderedList",
|
||||
"Upload",
|
||||
"Video",
|
||||
"VisuallyHidden",
|
||||
"Vstack",
|
||||
"Wrap",
|
||||
"WrapItem",
|
||||
]
|
||||
|
||||
_ALL_COMPONENTS += [to_snake_case(component) for component in _ALL_COMPONENTS]
|
||||
_ALL_COMPONENTS += [
|
||||
"cancel_upload",
|
||||
"components",
|
||||
"color_mode_cond",
|
||||
# Core
|
||||
"cond",
|
||||
"foreach",
|
||||
"html",
|
||||
"match",
|
||||
# "color_mode_cond",
|
||||
"connection_banner",
|
||||
"connection_modal",
|
||||
"debounce_input",
|
||||
# Base
|
||||
"fragment",
|
||||
"image",
|
||||
"script",
|
||||
# Responsive
|
||||
"desktop_only",
|
||||
"mobile_only",
|
||||
"tablet_only",
|
||||
"mobile_and_tablet",
|
||||
"mobile_only",
|
||||
"tablet_and_desktop",
|
||||
"selected_files",
|
||||
"tablet_only",
|
||||
# Upload
|
||||
"cancel_upload",
|
||||
"clear_selected_files",
|
||||
"selected_files",
|
||||
"upload",
|
||||
# Radix
|
||||
"accordion",
|
||||
"alert_dialog",
|
||||
"aspect_ratio",
|
||||
"avatar",
|
||||
"badge",
|
||||
"blockquote",
|
||||
"box",
|
||||
"button",
|
||||
"callout",
|
||||
"card",
|
||||
"center",
|
||||
"checkbox",
|
||||
"code",
|
||||
"container",
|
||||
"context_menu",
|
||||
"dialog",
|
||||
"drawer",
|
||||
"dropdown_menu",
|
||||
# "bold" (em)
|
||||
"flex",
|
||||
"form",
|
||||
"grid",
|
||||
"heading",
|
||||
"hover_card",
|
||||
"hstack",
|
||||
# "icon" (lucide)
|
||||
"icon_button",
|
||||
"inset",
|
||||
"kbd",
|
||||
"link",
|
||||
"popover",
|
||||
"progress",
|
||||
# "quote",
|
||||
"radio_group",
|
||||
"scroll_area",
|
||||
"section",
|
||||
"select",
|
||||
"separator",
|
||||
# "separator" (divider?),
|
||||
"slider",
|
||||
"spacer",
|
||||
# "strong" (bold?)
|
||||
"switch",
|
||||
"table",
|
||||
"tabs",
|
||||
"text",
|
||||
"text_area",
|
||||
# "text_field" (input)
|
||||
"theme",
|
||||
"theme_panel",
|
||||
"tooltip",
|
||||
"vstack",
|
||||
# Other
|
||||
"data_editor",
|
||||
"data_editor_theme",
|
||||
"plotly",
|
||||
"audio",
|
||||
"video",
|
||||
"editor",
|
||||
"EditorButtonList",
|
||||
"EditorOptions",
|
||||
"NoSSRComponent",
|
||||
"icon",
|
||||
]
|
||||
|
||||
_MAPPING = {
|
||||
@ -252,10 +110,10 @@ _MAPPING = {
|
||||
"reflex.base": ["base", "Base"],
|
||||
"reflex.compiler": ["compiler"],
|
||||
"reflex.compiler.utils": ["get_asset_path"],
|
||||
"reflex.components": _ALL_COMPONENTS + ["chakra", "next"],
|
||||
"reflex.components.component": ["memo"],
|
||||
"reflex.components": _ALL_COMPONENTS,
|
||||
"reflex.components.component": ["Component", "NoSSRComponent", "memo"],
|
||||
"reflex.components.chakra": ["chakra"],
|
||||
"reflex.components.el": ["el"],
|
||||
"reflex.components.lucide": ["lucide"],
|
||||
"reflex.components.radix": ["radix"],
|
||||
"reflex.components.recharts": ["recharts"],
|
||||
"reflex.components.moment.moment": ["MomentDelta"],
|
||||
|
||||
@ -7,448 +7,85 @@ from reflex import base as base
|
||||
from reflex.base import Base as Base
|
||||
from reflex import compiler as compiler
|
||||
from reflex.compiler.utils import get_asset_path as get_asset_path
|
||||
from reflex.components import Accordion as Accordion
|
||||
from reflex.components import AccordionButton as AccordionButton
|
||||
from reflex.components import AccordionIcon as AccordionIcon
|
||||
from reflex.components import AccordionItem as AccordionItem
|
||||
from reflex.components import AccordionPanel as AccordionPanel
|
||||
from reflex.components import Alert as Alert
|
||||
from reflex.components import AlertDescription as AlertDescription
|
||||
from reflex.components import AlertDialog as AlertDialog
|
||||
from reflex.components import AlertDialogBody as AlertDialogBody
|
||||
from reflex.components import AlertDialogContent as AlertDialogContent
|
||||
from reflex.components import AlertDialogFooter as AlertDialogFooter
|
||||
from reflex.components import AlertDialogHeader as AlertDialogHeader
|
||||
from reflex.components import AlertDialogOverlay as AlertDialogOverlay
|
||||
from reflex.components import AlertIcon as AlertIcon
|
||||
from reflex.components import AlertTitle as AlertTitle
|
||||
from reflex.components import AspectRatio as AspectRatio
|
||||
from reflex.components import Audio as Audio
|
||||
from reflex.components import Avatar as Avatar
|
||||
from reflex.components import AvatarBadge as AvatarBadge
|
||||
from reflex.components import AvatarGroup as AvatarGroup
|
||||
from reflex.components import Badge as Badge
|
||||
from reflex.components import Box as Box
|
||||
from reflex.components import Breadcrumb as Breadcrumb
|
||||
from reflex.components import BreadcrumbItem as BreadcrumbItem
|
||||
from reflex.components import BreadcrumbLink as BreadcrumbLink
|
||||
from reflex.components import BreadcrumbSeparator as BreadcrumbSeparator
|
||||
from reflex.components import Button as Button
|
||||
from reflex.components import ButtonGroup as ButtonGroup
|
||||
from reflex.components import Card as Card
|
||||
from reflex.components import CardBody as CardBody
|
||||
from reflex.components import CardFooter as CardFooter
|
||||
from reflex.components import CardHeader as CardHeader
|
||||
from reflex.components import Center as Center
|
||||
from reflex.components import Checkbox as Checkbox
|
||||
from reflex.components import CheckboxGroup as CheckboxGroup
|
||||
from reflex.components import CircularProgress as CircularProgress
|
||||
from reflex.components import CircularProgressLabel as CircularProgressLabel
|
||||
from reflex.components import Circle as Circle
|
||||
from reflex.components import Code as Code
|
||||
from reflex.components import CodeBlock as CodeBlock
|
||||
from reflex.components import Collapse as Collapse
|
||||
from reflex.components import ColorModeButton as ColorModeButton
|
||||
from reflex.components import ColorModeIcon as ColorModeIcon
|
||||
from reflex.components import ColorModeSwitch as ColorModeSwitch
|
||||
from reflex.components import Component as Component
|
||||
from reflex.components import Cond as Cond
|
||||
from reflex.components import ConnectionBanner as ConnectionBanner
|
||||
from reflex.components import ConnectionModal as ConnectionModal
|
||||
from reflex.components import Container as Container
|
||||
from reflex.components import DataTable as DataTable
|
||||
from reflex.components import DataEditor as DataEditor
|
||||
from reflex.components import DataEditorTheme as DataEditorTheme
|
||||
from reflex.components import DatePicker as DatePicker
|
||||
from reflex.components import DateTimePicker as DateTimePicker
|
||||
from reflex.components import DebounceInput as DebounceInput
|
||||
from reflex.components import Divider as Divider
|
||||
from reflex.components import Drawer as Drawer
|
||||
from reflex.components import DrawerBody as DrawerBody
|
||||
from reflex.components import DrawerCloseButton as DrawerCloseButton
|
||||
from reflex.components import DrawerContent as DrawerContent
|
||||
from reflex.components import DrawerFooter as DrawerFooter
|
||||
from reflex.components import DrawerHeader as DrawerHeader
|
||||
from reflex.components import DrawerOverlay as DrawerOverlay
|
||||
from reflex.components import Editable as Editable
|
||||
from reflex.components import EditableInput as EditableInput
|
||||
from reflex.components import EditablePreview as EditablePreview
|
||||
from reflex.components import EditableTextarea as EditableTextarea
|
||||
from reflex.components import Editor as Editor
|
||||
from reflex.components import Email as Email
|
||||
from reflex.components import Fade as Fade
|
||||
from reflex.components import Flex as Flex
|
||||
from reflex.components import Foreach as Foreach
|
||||
from reflex.components import Form as Form
|
||||
from reflex.components import FormControl as FormControl
|
||||
from reflex.components import FormErrorMessage as FormErrorMessage
|
||||
from reflex.components import FormHelperText as FormHelperText
|
||||
from reflex.components import FormLabel as FormLabel
|
||||
from reflex.components import Fragment as Fragment
|
||||
from reflex.components import Grid as Grid
|
||||
from reflex.components import GridItem as GridItem
|
||||
from reflex.components import Heading as Heading
|
||||
from reflex.components import Highlight as Highlight
|
||||
from reflex.components import Hstack as Hstack
|
||||
from reflex.components import Html as Html
|
||||
from reflex.components import Icon as Icon
|
||||
from reflex.components import IconButton as IconButton
|
||||
from reflex.components import Image as Image
|
||||
from reflex.components import Input as Input
|
||||
from reflex.components import InputGroup as InputGroup
|
||||
from reflex.components import InputLeftAddon as InputLeftAddon
|
||||
from reflex.components import InputLeftElement as InputLeftElement
|
||||
from reflex.components import InputRightAddon as InputRightAddon
|
||||
from reflex.components import InputRightElement as InputRightElement
|
||||
from reflex.components import Kbd as Kbd
|
||||
from reflex.components import Link as Link
|
||||
from reflex.components import LinkBox as LinkBox
|
||||
from reflex.components import LinkOverlay as LinkOverlay
|
||||
from reflex.components import List as List
|
||||
from reflex.components import ListItem as ListItem
|
||||
from reflex.components import Markdown as Markdown
|
||||
from reflex.components import Match as Match
|
||||
from reflex.components import Menu as Menu
|
||||
from reflex.components import MenuButton as MenuButton
|
||||
from reflex.components import MenuDivider as MenuDivider
|
||||
from reflex.components import MenuGroup as MenuGroup
|
||||
from reflex.components import MenuItem as MenuItem
|
||||
from reflex.components import MenuItemOption as MenuItemOption
|
||||
from reflex.components import MenuList as MenuList
|
||||
from reflex.components import MenuOptionGroup as MenuOptionGroup
|
||||
from reflex.components import Modal as Modal
|
||||
from reflex.components import ModalBody as ModalBody
|
||||
from reflex.components import ModalCloseButton as ModalCloseButton
|
||||
from reflex.components import ModalContent as ModalContent
|
||||
from reflex.components import ModalFooter as ModalFooter
|
||||
from reflex.components import ModalHeader as ModalHeader
|
||||
from reflex.components import ModalOverlay as ModalOverlay
|
||||
from reflex.components import Moment as Moment
|
||||
from reflex.components import MultiSelect as MultiSelect
|
||||
from reflex.components import MultiSelectOption as MultiSelectOption
|
||||
from reflex.components import NextLink as NextLink
|
||||
from reflex.components import NumberDecrementStepper as NumberDecrementStepper
|
||||
from reflex.components import NumberIncrementStepper as NumberIncrementStepper
|
||||
from reflex.components import NumberInput as NumberInput
|
||||
from reflex.components import NumberInputField as NumberInputField
|
||||
from reflex.components import NumberInputStepper as NumberInputStepper
|
||||
from reflex.components import Option as Option
|
||||
from reflex.components import OrderedList as OrderedList
|
||||
from reflex.components import Password as Password
|
||||
from reflex.components import PinInput as PinInput
|
||||
from reflex.components import PinInputField as PinInputField
|
||||
from reflex.components import Plotly as Plotly
|
||||
from reflex.components import Popover as Popover
|
||||
from reflex.components import PopoverAnchor as PopoverAnchor
|
||||
from reflex.components import PopoverArrow as PopoverArrow
|
||||
from reflex.components import PopoverBody as PopoverBody
|
||||
from reflex.components import PopoverCloseButton as PopoverCloseButton
|
||||
from reflex.components import PopoverContent as PopoverContent
|
||||
from reflex.components import PopoverFooter as PopoverFooter
|
||||
from reflex.components import PopoverHeader as PopoverHeader
|
||||
from reflex.components import PopoverTrigger as PopoverTrigger
|
||||
from reflex.components import Progress as Progress
|
||||
from reflex.components import Radio as Radio
|
||||
from reflex.components import RadioGroup as RadioGroup
|
||||
from reflex.components import RangeSlider as RangeSlider
|
||||
from reflex.components import RangeSliderFilledTrack as RangeSliderFilledTrack
|
||||
from reflex.components import RangeSliderThumb as RangeSliderThumb
|
||||
from reflex.components import RangeSliderTrack as RangeSliderTrack
|
||||
from reflex.components import ResponsiveGrid as ResponsiveGrid
|
||||
from reflex.components import ScaleFade as ScaleFade
|
||||
from reflex.components import Script as Script
|
||||
from reflex.components import Select as Select
|
||||
from reflex.components import Skeleton as Skeleton
|
||||
from reflex.components import SkeletonCircle as SkeletonCircle
|
||||
from reflex.components import SkeletonText as SkeletonText
|
||||
from reflex.components import Slide as Slide
|
||||
from reflex.components import SlideFade as SlideFade
|
||||
from reflex.components import Slider as Slider
|
||||
from reflex.components import SliderFilledTrack as SliderFilledTrack
|
||||
from reflex.components import SliderMark as SliderMark
|
||||
from reflex.components import SliderThumb as SliderThumb
|
||||
from reflex.components import SliderTrack as SliderTrack
|
||||
from reflex.components import Spacer as Spacer
|
||||
from reflex.components import Span as Span
|
||||
from reflex.components import Spinner as Spinner
|
||||
from reflex.components import Square as Square
|
||||
from reflex.components import Stack as Stack
|
||||
from reflex.components import Stat as Stat
|
||||
from reflex.components import StatArrow as StatArrow
|
||||
from reflex.components import StatGroup as StatGroup
|
||||
from reflex.components import StatHelpText as StatHelpText
|
||||
from reflex.components import StatLabel as StatLabel
|
||||
from reflex.components import StatNumber as StatNumber
|
||||
from reflex.components import Step as Step
|
||||
from reflex.components import StepDescription as StepDescription
|
||||
from reflex.components import StepIcon as StepIcon
|
||||
from reflex.components import StepIndicator as StepIndicator
|
||||
from reflex.components import StepNumber as StepNumber
|
||||
from reflex.components import StepSeparator as StepSeparator
|
||||
from reflex.components import StepStatus as StepStatus
|
||||
from reflex.components import StepTitle as StepTitle
|
||||
from reflex.components import Stepper as Stepper
|
||||
from reflex.components import Switch as Switch
|
||||
from reflex.components import Tab as Tab
|
||||
from reflex.components import TabList as TabList
|
||||
from reflex.components import TabPanel as TabPanel
|
||||
from reflex.components import TabPanels as TabPanels
|
||||
from reflex.components import Table as Table
|
||||
from reflex.components import TableCaption as TableCaption
|
||||
from reflex.components import TableContainer as TableContainer
|
||||
from reflex.components import Tabs as Tabs
|
||||
from reflex.components import Tag as Tag
|
||||
from reflex.components import TagCloseButton as TagCloseButton
|
||||
from reflex.components import TagLabel as TagLabel
|
||||
from reflex.components import TagLeftIcon as TagLeftIcon
|
||||
from reflex.components import TagRightIcon as TagRightIcon
|
||||
from reflex.components import Tbody as Tbody
|
||||
from reflex.components import Td as Td
|
||||
from reflex.components import Text as Text
|
||||
from reflex.components import TextArea as TextArea
|
||||
from reflex.components import Tfoot as Tfoot
|
||||
from reflex.components import Th as Th
|
||||
from reflex.components import Thead as Thead
|
||||
from reflex.components import TimePicker as TimePicker
|
||||
from reflex.components import Tooltip as Tooltip
|
||||
from reflex.components import Tr as Tr
|
||||
from reflex.components import UnorderedList as UnorderedList
|
||||
from reflex.components import Upload as Upload
|
||||
from reflex.components import Video as Video
|
||||
from reflex.components import VisuallyHidden as VisuallyHidden
|
||||
from reflex.components import Vstack as Vstack
|
||||
from reflex.components import Wrap as Wrap
|
||||
from reflex.components import WrapItem as WrapItem
|
||||
from reflex.components import accordion as accordion
|
||||
from reflex.components import accordion_button as accordion_button
|
||||
from reflex.components import accordion_icon as accordion_icon
|
||||
from reflex.components import accordion_item as accordion_item
|
||||
from reflex.components import accordion_panel as accordion_panel
|
||||
from reflex.components import alert as alert
|
||||
from reflex.components import alert_description as alert_description
|
||||
from reflex.components import alert_dialog as alert_dialog
|
||||
from reflex.components import alert_dialog_body as alert_dialog_body
|
||||
from reflex.components import alert_dialog_content as alert_dialog_content
|
||||
from reflex.components import alert_dialog_footer as alert_dialog_footer
|
||||
from reflex.components import alert_dialog_header as alert_dialog_header
|
||||
from reflex.components import alert_dialog_overlay as alert_dialog_overlay
|
||||
from reflex.components import alert_icon as alert_icon
|
||||
from reflex.components import alert_title as alert_title
|
||||
from reflex.components import aspect_ratio as aspect_ratio
|
||||
from reflex.components import audio as audio
|
||||
from reflex.components import avatar as avatar
|
||||
from reflex.components import avatar_badge as avatar_badge
|
||||
from reflex.components import avatar_group as avatar_group
|
||||
from reflex.components import badge as badge
|
||||
from reflex.components import box as box
|
||||
from reflex.components import breadcrumb as breadcrumb
|
||||
from reflex.components import breadcrumb_item as breadcrumb_item
|
||||
from reflex.components import breadcrumb_link as breadcrumb_link
|
||||
from reflex.components import breadcrumb_separator as breadcrumb_separator
|
||||
from reflex.components import button as button
|
||||
from reflex.components import button_group as button_group
|
||||
from reflex.components import card as card
|
||||
from reflex.components import card_body as card_body
|
||||
from reflex.components import card_footer as card_footer
|
||||
from reflex.components import card_header as card_header
|
||||
from reflex.components import center as center
|
||||
from reflex.components import checkbox as checkbox
|
||||
from reflex.components import checkbox_group as checkbox_group
|
||||
from reflex.components import circular_progress as circular_progress
|
||||
from reflex.components import circular_progress_label as circular_progress_label
|
||||
from reflex.components import circle as circle
|
||||
from reflex.components import code as code
|
||||
from reflex.components import code_block as code_block
|
||||
from reflex.components import collapse as collapse
|
||||
from reflex.components import color_mode_button as color_mode_button
|
||||
from reflex.components import color_mode_icon as color_mode_icon
|
||||
from reflex.components import color_mode_switch as color_mode_switch
|
||||
from reflex.components import component as component
|
||||
from reflex.components import cond as cond
|
||||
from reflex.components import foreach as foreach
|
||||
from reflex.components import html as html
|
||||
from reflex.components import match as match
|
||||
from reflex.components import connection_banner as connection_banner
|
||||
from reflex.components import connection_modal as connection_modal
|
||||
from reflex.components import container as container
|
||||
from reflex.components import data_table as data_table
|
||||
from reflex.components import data_editor as data_editor
|
||||
from reflex.components import data_editor_theme as data_editor_theme
|
||||
from reflex.components import date_picker as date_picker
|
||||
from reflex.components import date_time_picker as date_time_picker
|
||||
from reflex.components import debounce_input as debounce_input
|
||||
from reflex.components import divider as divider
|
||||
from reflex.components import drawer as drawer
|
||||
from reflex.components import drawer_body as drawer_body
|
||||
from reflex.components import drawer_close_button as drawer_close_button
|
||||
from reflex.components import drawer_content as drawer_content
|
||||
from reflex.components import drawer_footer as drawer_footer
|
||||
from reflex.components import drawer_header as drawer_header
|
||||
from reflex.components import drawer_overlay as drawer_overlay
|
||||
from reflex.components import editable as editable
|
||||
from reflex.components import editable_input as editable_input
|
||||
from reflex.components import editable_preview as editable_preview
|
||||
from reflex.components import editable_textarea as editable_textarea
|
||||
from reflex.components import editor as editor
|
||||
from reflex.components import email as email
|
||||
from reflex.components import fade as fade
|
||||
from reflex.components import flex as flex
|
||||
from reflex.components import foreach as foreach
|
||||
from reflex.components import form as form
|
||||
from reflex.components import form_control as form_control
|
||||
from reflex.components import form_error_message as form_error_message
|
||||
from reflex.components import form_helper_text as form_helper_text
|
||||
from reflex.components import form_label as form_label
|
||||
from reflex.components import fragment as fragment
|
||||
from reflex.components import grid as grid
|
||||
from reflex.components import grid_item as grid_item
|
||||
from reflex.components import heading as heading
|
||||
from reflex.components import highlight as highlight
|
||||
from reflex.components import hstack as hstack
|
||||
from reflex.components import html as html
|
||||
from reflex.components import icon as icon
|
||||
from reflex.components import icon_button as icon_button
|
||||
from reflex.components import image as image
|
||||
from reflex.components import input as input
|
||||
from reflex.components import input_group as input_group
|
||||
from reflex.components import input_left_addon as input_left_addon
|
||||
from reflex.components import input_left_element as input_left_element
|
||||
from reflex.components import input_right_addon as input_right_addon
|
||||
from reflex.components import input_right_element as input_right_element
|
||||
from reflex.components import script as script
|
||||
from reflex.components import desktop_only as desktop_only
|
||||
from reflex.components import mobile_and_tablet as mobile_and_tablet
|
||||
from reflex.components import mobile_only as mobile_only
|
||||
from reflex.components import tablet_and_desktop as tablet_and_desktop
|
||||
from reflex.components import tablet_only as tablet_only
|
||||
from reflex.components import cancel_upload as cancel_upload
|
||||
from reflex.components import clear_selected_files as clear_selected_files
|
||||
from reflex.components import selected_files as selected_files
|
||||
from reflex.components import upload as upload
|
||||
from reflex.components import accordion as accordion
|
||||
from reflex.components import alert_dialog as alert_dialog
|
||||
from reflex.components import aspect_ratio as aspect_ratio
|
||||
from reflex.components import avatar as avatar
|
||||
from reflex.components import badge as badge
|
||||
from reflex.components import blockquote as blockquote
|
||||
from reflex.components import box as box
|
||||
from reflex.components import button as button
|
||||
from reflex.components import callout as callout
|
||||
from reflex.components import card as card
|
||||
from reflex.components import center as center
|
||||
from reflex.components import checkbox as checkbox
|
||||
from reflex.components import code as code
|
||||
from reflex.components import container as container
|
||||
from reflex.components import context_menu as context_menu
|
||||
from reflex.components import dialog as dialog
|
||||
from reflex.components import drawer as drawer
|
||||
from reflex.components import dropdown_menu as dropdown_menu
|
||||
from reflex.components import flex as flex
|
||||
from reflex.components import form as form
|
||||
from reflex.components import grid as grid
|
||||
from reflex.components import heading as heading
|
||||
from reflex.components import hover_card as hover_card
|
||||
from reflex.components import hstack as hstack
|
||||
from reflex.components import icon_button as icon_button
|
||||
from reflex.components import inset as inset
|
||||
from reflex.components import kbd as kbd
|
||||
from reflex.components import link as link
|
||||
from reflex.components import link_box as link_box
|
||||
from reflex.components import link_overlay as link_overlay
|
||||
from reflex.components import list as list
|
||||
from reflex.components import list_item as list_item
|
||||
from reflex.components import markdown as markdown
|
||||
from reflex.components import match as match
|
||||
from reflex.components import menu as menu
|
||||
from reflex.components import menu_button as menu_button
|
||||
from reflex.components import menu_divider as menu_divider
|
||||
from reflex.components import menu_group as menu_group
|
||||
from reflex.components import menu_item as menu_item
|
||||
from reflex.components import menu_item_option as menu_item_option
|
||||
from reflex.components import menu_list as menu_list
|
||||
from reflex.components import menu_option_group as menu_option_group
|
||||
from reflex.components import modal as modal
|
||||
from reflex.components import modal_body as modal_body
|
||||
from reflex.components import modal_close_button as modal_close_button
|
||||
from reflex.components import modal_content as modal_content
|
||||
from reflex.components import modal_footer as modal_footer
|
||||
from reflex.components import modal_header as modal_header
|
||||
from reflex.components import modal_overlay as modal_overlay
|
||||
from reflex.components import moment as moment
|
||||
from reflex.components import multi_select as multi_select
|
||||
from reflex.components import multi_select_option as multi_select_option
|
||||
from reflex.components import next_link as next_link
|
||||
from reflex.components import number_decrement_stepper as number_decrement_stepper
|
||||
from reflex.components import number_increment_stepper as number_increment_stepper
|
||||
from reflex.components import number_input as number_input
|
||||
from reflex.components import number_input_field as number_input_field
|
||||
from reflex.components import number_input_stepper as number_input_stepper
|
||||
from reflex.components import option as option
|
||||
from reflex.components import ordered_list as ordered_list
|
||||
from reflex.components import password as password
|
||||
from reflex.components import pin_input as pin_input
|
||||
from reflex.components import pin_input_field as pin_input_field
|
||||
from reflex.components import plotly as plotly
|
||||
from reflex.components import popover as popover
|
||||
from reflex.components import popover_anchor as popover_anchor
|
||||
from reflex.components import popover_arrow as popover_arrow
|
||||
from reflex.components import popover_body as popover_body
|
||||
from reflex.components import popover_close_button as popover_close_button
|
||||
from reflex.components import popover_content as popover_content
|
||||
from reflex.components import popover_footer as popover_footer
|
||||
from reflex.components import popover_header as popover_header
|
||||
from reflex.components import popover_trigger as popover_trigger
|
||||
from reflex.components import progress as progress
|
||||
from reflex.components import radio as radio
|
||||
from reflex.components import radio_group as radio_group
|
||||
from reflex.components import range_slider as range_slider
|
||||
from reflex.components import range_slider_filled_track as range_slider_filled_track
|
||||
from reflex.components import range_slider_thumb as range_slider_thumb
|
||||
from reflex.components import range_slider_track as range_slider_track
|
||||
from reflex.components import responsive_grid as responsive_grid
|
||||
from reflex.components import scale_fade as scale_fade
|
||||
from reflex.components import script as script
|
||||
from reflex.components import scroll_area as scroll_area
|
||||
from reflex.components import section as section
|
||||
from reflex.components import select as select
|
||||
from reflex.components import skeleton as skeleton
|
||||
from reflex.components import skeleton_circle as skeleton_circle
|
||||
from reflex.components import skeleton_text as skeleton_text
|
||||
from reflex.components import slide as slide
|
||||
from reflex.components import slide_fade as slide_fade
|
||||
from reflex.components import separator as separator
|
||||
from reflex.components import slider as slider
|
||||
from reflex.components import slider_filled_track as slider_filled_track
|
||||
from reflex.components import slider_mark as slider_mark
|
||||
from reflex.components import slider_thumb as slider_thumb
|
||||
from reflex.components import slider_track as slider_track
|
||||
from reflex.components import spacer as spacer
|
||||
from reflex.components import span as span
|
||||
from reflex.components import spinner as spinner
|
||||
from reflex.components import square as square
|
||||
from reflex.components import stack as stack
|
||||
from reflex.components import stat as stat
|
||||
from reflex.components import stat_arrow as stat_arrow
|
||||
from reflex.components import stat_group as stat_group
|
||||
from reflex.components import stat_help_text as stat_help_text
|
||||
from reflex.components import stat_label as stat_label
|
||||
from reflex.components import stat_number as stat_number
|
||||
from reflex.components import step as step
|
||||
from reflex.components import step_description as step_description
|
||||
from reflex.components import step_icon as step_icon
|
||||
from reflex.components import step_indicator as step_indicator
|
||||
from reflex.components import step_number as step_number
|
||||
from reflex.components import step_separator as step_separator
|
||||
from reflex.components import step_status as step_status
|
||||
from reflex.components import step_title as step_title
|
||||
from reflex.components import stepper as stepper
|
||||
from reflex.components import switch as switch
|
||||
from reflex.components import tab as tab
|
||||
from reflex.components import tab_list as tab_list
|
||||
from reflex.components import tab_panel as tab_panel
|
||||
from reflex.components import tab_panels as tab_panels
|
||||
from reflex.components import table as table
|
||||
from reflex.components import table_caption as table_caption
|
||||
from reflex.components import table_container as table_container
|
||||
from reflex.components import tabs as tabs
|
||||
from reflex.components import tag as tag
|
||||
from reflex.components import tag_close_button as tag_close_button
|
||||
from reflex.components import tag_label as tag_label
|
||||
from reflex.components import tag_left_icon as tag_left_icon
|
||||
from reflex.components import tag_right_icon as tag_right_icon
|
||||
from reflex.components import tbody as tbody
|
||||
from reflex.components import td as td
|
||||
from reflex.components import text as text
|
||||
from reflex.components import text_area as text_area
|
||||
from reflex.components import tfoot as tfoot
|
||||
from reflex.components import th as th
|
||||
from reflex.components import thead as thead
|
||||
from reflex.components import time_picker as time_picker
|
||||
from reflex.components import theme as theme
|
||||
from reflex.components import theme_panel as theme_panel
|
||||
from reflex.components import tooltip as tooltip
|
||||
from reflex.components import tr as tr
|
||||
from reflex.components import unordered_list as unordered_list
|
||||
from reflex.components import upload as upload
|
||||
from reflex.components import video as video
|
||||
from reflex.components import visually_hidden as visually_hidden
|
||||
from reflex.components import vstack as vstack
|
||||
from reflex.components import wrap as wrap
|
||||
from reflex.components import wrap_item as wrap_item
|
||||
from reflex.components import cancel_upload as cancel_upload
|
||||
from reflex import components as components
|
||||
from reflex.components import color_mode_cond as color_mode_cond
|
||||
from reflex.components import desktop_only as desktop_only
|
||||
from reflex.components import mobile_only as mobile_only
|
||||
from reflex.components import tablet_only as tablet_only
|
||||
from reflex.components import mobile_and_tablet as mobile_and_tablet
|
||||
from reflex.components import tablet_and_desktop as tablet_and_desktop
|
||||
from reflex.components import selected_files as selected_files
|
||||
from reflex.components import clear_selected_files as clear_selected_files
|
||||
from reflex.components import data_editor as data_editor
|
||||
from reflex.components import data_editor_theme as data_editor_theme
|
||||
from reflex.components import plotly as plotly
|
||||
from reflex.components import audio as audio
|
||||
from reflex.components import video as video
|
||||
from reflex.components import editor as editor
|
||||
from reflex.components import EditorButtonList as EditorButtonList
|
||||
from reflex.components import EditorOptions as EditorOptions
|
||||
from reflex.components import NoSSRComponent as NoSSRComponent
|
||||
from reflex.components import chakra as chakra
|
||||
from reflex.components import next as next
|
||||
from reflex.components import icon as icon
|
||||
from reflex.components.component import Component as Component
|
||||
from reflex.components.component import NoSSRComponent as NoSSRComponent
|
||||
from reflex.components.component import memo as memo
|
||||
from reflex.components import chakra as chakra
|
||||
from reflex.components import el as el
|
||||
from reflex.components import lucide as lucide
|
||||
from reflex.components import radix as radix
|
||||
from reflex.components import recharts as recharts
|
||||
from reflex.components.moment.moment import MomentDelta as MomentDelta
|
||||
|
||||
@ -2,15 +2,16 @@
|
||||
from __future__ import annotations
|
||||
|
||||
from .base import Fragment, Script, fragment, script
|
||||
from .chakra import *
|
||||
from .component import Component
|
||||
from .component import NoSSRComponent as NoSSRComponent
|
||||
from .core import *
|
||||
from .datadisplay import *
|
||||
from .gridjs import *
|
||||
from .lucide import icon
|
||||
from .markdown import *
|
||||
from .moment import *
|
||||
from .next import NextLink, next_link
|
||||
from .next import NextLink, image, next_link
|
||||
from .plotly import *
|
||||
from .radix import *
|
||||
from .react_player import *
|
||||
from .suneditor import *
|
||||
|
||||
@ -83,7 +83,6 @@ grid_item = GridItem.create
|
||||
heading = Heading.create
|
||||
highlight = Highlight.create
|
||||
hstack = Hstack.create
|
||||
html = Html.create
|
||||
icon = Icon.create
|
||||
icon_button = IconButton.create
|
||||
image = Image.create
|
||||
|
||||
@ -7,7 +7,6 @@ from .center import Center, Circle, Square
|
||||
from .container import Container
|
||||
from .flex import Flex
|
||||
from .grid import Grid, GridItem, ResponsiveGrid
|
||||
from .html import Html
|
||||
from .spacer import Spacer
|
||||
from .stack import Hstack, Stack, Vstack
|
||||
from .wrap import Wrap, WrapItem
|
||||
|
||||
@ -5,6 +5,7 @@ from .banner import ConnectionBanner, ConnectionModal
|
||||
from .cond import Cond, cond
|
||||
from .debounce import DebounceInput
|
||||
from .foreach import Foreach
|
||||
from .html import Html
|
||||
from .match import Match
|
||||
from .responsive import (
|
||||
desktop_only,
|
||||
@ -19,5 +20,6 @@ connection_banner = ConnectionBanner.create
|
||||
connection_modal = ConnectionModal.create
|
||||
debounce_input = DebounceInput.create
|
||||
foreach = Foreach.create
|
||||
html = Html.create
|
||||
match = Match.create
|
||||
upload = Upload.create
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
"""A html component."""
|
||||
from typing import Dict
|
||||
|
||||
from reflex.components.chakra.layout.box import Box
|
||||
from reflex.components.el.elements.typography import Div
|
||||
from reflex.vars import Var
|
||||
|
||||
|
||||
class Html(Box):
|
||||
class Html(Div):
|
||||
"""Render the html.
|
||||
|
||||
Returns:
|
||||
@ -1,4 +1,4 @@
|
||||
"""Stub file for reflex/components/chakra/layout/html.py"""
|
||||
"""Stub file for reflex/components/core/html.py"""
|
||||
# ------------------- DO NOT EDIT ----------------------
|
||||
# This file was generated by `scripts/pyi_generator.py`!
|
||||
# ------------------------------------------------------
|
||||
@ -8,10 +8,10 @@ from reflex.vars import Var, BaseVar, ComputedVar
|
||||
from reflex.event import EventChain, EventHandler, EventSpec
|
||||
from reflex.style import Style
|
||||
from typing import Dict
|
||||
from reflex.components.chakra.layout.box import Box
|
||||
from reflex.components.el.elements.typography import Div
|
||||
from reflex.vars import Var
|
||||
|
||||
class Html(Box):
|
||||
class Html(Div):
|
||||
@overload
|
||||
@classmethod
|
||||
def create( # type: ignore
|
||||
@ -20,9 +20,49 @@ class Html(Box):
|
||||
dangerouslySetInnerHTML: Optional[
|
||||
Union[Var[Dict[str, str]], Dict[str, str]]
|
||||
] = None,
|
||||
element: Optional[Union[Var[str], str]] = None,
|
||||
src: Optional[Union[Var[str], str]] = None,
|
||||
alt: Optional[Union[Var[str], str]] = None,
|
||||
access_key: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
auto_capitalize: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
content_editable: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
context_menu: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
dir: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
|
||||
draggable: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
enter_key_hint: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
hidden: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
input_mode: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
item_prop: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
lang: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
|
||||
role: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
|
||||
slot: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
|
||||
spell_check: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
tab_index: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
title: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
translate: Optional[
|
||||
Union[Var[Union[str, int, bool]], Union[str, int, bool]]
|
||||
] = None,
|
||||
style: Optional[Style] = None,
|
||||
key: Optional[Any] = None,
|
||||
id: Optional[Any] = None,
|
||||
@ -82,9 +122,23 @@ class Html(Box):
|
||||
Args:
|
||||
*children: The children of the component.
|
||||
dangerouslySetInnerHTML: The HTML to render.
|
||||
element: The type element to render. You can specify an image, video, or any other HTML element such as iframe.
|
||||
src: The source of the content.
|
||||
alt: The alt text of the content.
|
||||
access_key: Provides a hint for generating a keyboard shortcut for the current element.
|
||||
auto_capitalize: Controls whether and how text input is automatically capitalized as it is entered/edited by the user.
|
||||
content_editable: Indicates whether the element's content is editable.
|
||||
context_menu: Defines the ID of a <menu> element which will serve as the element's context menu.
|
||||
dir: Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)
|
||||
draggable: Defines whether the element can be dragged.
|
||||
enter_key_hint: Hints what media types the media element is able to play.
|
||||
hidden: Defines whether the element is hidden.
|
||||
input_mode: Defines the type of the element.
|
||||
item_prop: Defines the name of the element for metadata purposes.
|
||||
lang: Defines the language used in the element.
|
||||
role: Defines the role of the element.
|
||||
slot: Assigns a slot in a shadow DOM shadow tree to an element.
|
||||
spell_check: Defines whether the element may be checked for spelling errors.
|
||||
tab_index: Defines the position of the current element in the tabbing order.
|
||||
title: Defines a tooltip for the element.
|
||||
translate: Specifies whether the content of an element should be translated or not.
|
||||
style: The style of the component.
|
||||
key: A unique key for the component.
|
||||
id: The id for the component.
|
||||
@ -43,7 +43,7 @@ class S(BaseState):
|
||||
def test_render_child_props():
|
||||
"""DebounceInput should render props from child component."""
|
||||
tag = rx.debounce_input(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
foo="bar",
|
||||
baz="quuc",
|
||||
value="real",
|
||||
@ -71,7 +71,7 @@ def test_render_child_props_recursive():
|
||||
rx.debounce_input(
|
||||
rx.debounce_input(
|
||||
rx.debounce_input(
|
||||
rx.input(
|
||||
rx.chakra.input(
|
||||
foo="bar",
|
||||
baz="quuc",
|
||||
value="real",
|
||||
@ -103,7 +103,7 @@ def test_render_child_props_recursive():
|
||||
|
||||
def test_full_control_implicit_debounce():
|
||||
"""DebounceInput is used when value and on_change are used together."""
|
||||
tag = rx.input(
|
||||
tag = rx.chakra.input(
|
||||
value=S.value,
|
||||
on_change=S.on_change,
|
||||
)._render()
|
||||
|
||||
@ -72,10 +72,10 @@ def test_upload_component_render(upload_component):
|
||||
assert input["name"] == "Input"
|
||||
assert input["props"] == ["type={`file`}", "{...getInputProps()}"]
|
||||
|
||||
assert button["name"] == "Button"
|
||||
assert button["name"] == "RadixThemesButton"
|
||||
assert button["children"][0]["contents"] == "{`select file`}"
|
||||
|
||||
assert text["name"] == "Text"
|
||||
assert text["name"] == "RadixThemesText"
|
||||
assert (
|
||||
text["children"][0]["contents"]
|
||||
== "{`Drag and drop files here or click to select files`}"
|
||||
|
||||
@ -43,7 +43,7 @@ def test_match_components():
|
||||
assert match_cases[0][0]._var_name == "1"
|
||||
assert match_cases[0][0]._var_type == int
|
||||
first_return_value_render = match_cases[0][1].render()
|
||||
assert first_return_value_render["name"] == "Text"
|
||||
assert first_return_value_render["name"] == "RadixThemesText"
|
||||
assert first_return_value_render["children"][0]["contents"] == "{`first value`}"
|
||||
|
||||
assert match_cases[1][0]._var_name == "2"
|
||||
@ -51,36 +51,36 @@ def test_match_components():
|
||||
assert match_cases[1][1]._var_name == "3"
|
||||
assert match_cases[1][1]._var_type == int
|
||||
second_return_value_render = match_cases[1][2].render()
|
||||
assert second_return_value_render["name"] == "Text"
|
||||
assert second_return_value_render["name"] == "RadixThemesText"
|
||||
assert second_return_value_render["children"][0]["contents"] == "{`second value`}"
|
||||
|
||||
assert match_cases[2][0]._var_name == "[1, 2]"
|
||||
assert match_cases[2][0]._var_type == list
|
||||
third_return_value_render = match_cases[2][1].render()
|
||||
assert third_return_value_render["name"] == "Text"
|
||||
assert third_return_value_render["name"] == "RadixThemesText"
|
||||
assert third_return_value_render["children"][0]["contents"] == "{`third value`}"
|
||||
|
||||
assert match_cases[3][0]._var_name == "random"
|
||||
assert match_cases[3][0]._var_type == str
|
||||
fourth_return_value_render = match_cases[3][1].render()
|
||||
assert fourth_return_value_render["name"] == "Text"
|
||||
assert fourth_return_value_render["name"] == "RadixThemesText"
|
||||
assert fourth_return_value_render["children"][0]["contents"] == "{`fourth value`}"
|
||||
|
||||
assert match_cases[4][0]._var_name == '{"foo": "bar"}'
|
||||
assert match_cases[4][0]._var_type == dict
|
||||
fifth_return_value_render = match_cases[4][1].render()
|
||||
assert fifth_return_value_render["name"] == "Text"
|
||||
assert fifth_return_value_render["name"] == "RadixThemesText"
|
||||
assert fifth_return_value_render["children"][0]["contents"] == "{`fifth value`}"
|
||||
|
||||
assert match_cases[5][0]._var_name == "(match_state.num + 1)"
|
||||
assert match_cases[5][0]._var_type == int
|
||||
fifth_return_value_render = match_cases[5][1].render()
|
||||
assert fifth_return_value_render["name"] == "Text"
|
||||
assert fifth_return_value_render["name"] == "RadixThemesText"
|
||||
assert fifth_return_value_render["children"][0]["contents"] == "{`sixth value`}"
|
||||
|
||||
default = match_child["default"].render()
|
||||
|
||||
assert default["name"] == "Text"
|
||||
assert default["name"] == "RadixThemesText"
|
||||
assert default["children"][0]["contents"] == "{`default value`}"
|
||||
|
||||
|
||||
@ -143,6 +143,8 @@ def test_match_on_component_without_default():
|
||||
"""Test that matching cases with return values as components returns a Fragment
|
||||
as the default case if not provided.
|
||||
"""
|
||||
from reflex.components.base.fragment import Fragment
|
||||
|
||||
match_case_tuples = (
|
||||
(1, rx.text("first value")),
|
||||
(2, 3, rx.text("second value")),
|
||||
@ -151,7 +153,7 @@ def test_match_on_component_without_default():
|
||||
match_comp = Match.create(MatchState.value, *match_case_tuples)
|
||||
default = match_comp.render()["children"][0]["default"] # type: ignore
|
||||
|
||||
assert isinstance(default, rx.Fragment)
|
||||
assert isinstance(default, Fragment)
|
||||
|
||||
|
||||
def test_match_on_var_no_default():
|
||||
@ -258,8 +260,8 @@ def test_match_case_tuple_elements(match_case):
|
||||
([1, 2], rx.text("third value")),
|
||||
rx.text("default value"),
|
||||
),
|
||||
"Match cases should have the same return types. Case 3 with return value `<Text> {`first value`} </Text>` "
|
||||
"of type <class 'reflex.components.chakra.typography.text.Text'> is not <class 'reflex.vars.BaseVar'>",
|
||||
"Match cases should have the same return types. Case 3 with return value `<RadixThemesText> {`first value`} </RadixThemesText>` "
|
||||
"of type <class 'reflex.components.radix.themes.typography.text.Text'> is not <class 'reflex.vars.BaseVar'>",
|
||||
),
|
||||
],
|
||||
)
|
||||
|
||||
@ -488,12 +488,14 @@ def test_custom_component_wrapper():
|
||||
color=color,
|
||||
)
|
||||
|
||||
from reflex.components.radix.themes.typography.text import Text
|
||||
|
||||
ccomponent = my_component(
|
||||
rx.text("child"), width=Var.create(1), color=Var.create("red")
|
||||
)
|
||||
assert isinstance(ccomponent, CustomComponent)
|
||||
assert len(ccomponent.children) == 1
|
||||
assert isinstance(ccomponent.children[0], rx.Text)
|
||||
assert isinstance(ccomponent.children[0], Text)
|
||||
|
||||
component = ccomponent.get_component(ccomponent)
|
||||
assert isinstance(component, Box)
|
||||
@ -595,7 +597,7 @@ def test_unsupported_parent_components(component5):
|
||||
component5: component with valid parent of "Text" only
|
||||
"""
|
||||
with pytest.raises(ValueError) as err:
|
||||
rx.Box(children=[component5.create()])
|
||||
rx.box(component5.create())
|
||||
assert (
|
||||
err.value.args[0]
|
||||
== f"The component `{component5.__name__}` can only be a child of the components: `{component5._valid_parents[0]}`. Got `Box` instead."
|
||||
@ -625,10 +627,10 @@ def test_component_with_only_valid_children(fixture, request):
|
||||
@pytest.mark.parametrize(
|
||||
"component,rendered",
|
||||
[
|
||||
(rx.text("hi"), "<Text>\n {`hi`}\n</Text>"),
|
||||
(rx.text("hi"), "<RadixThemesText>\n {`hi`}\n</RadixThemesText>"),
|
||||
(
|
||||
rx.box(rx.heading("test", size="md")),
|
||||
"<Box>\n <Heading size={`md`}>\n {`test`}\n</Heading>\n</Box>",
|
||||
rx.box(rx.chakra.heading("test", size="md")),
|
||||
"<RadixThemesBox>\n <Heading size={`md`}>\n {`test`}\n</Heading>\n</RadixThemesBox>",
|
||||
),
|
||||
],
|
||||
)
|
||||
|
||||
@ -37,7 +37,7 @@ def test_set_component_map():
|
||||
"""Test setting the component map."""
|
||||
component_map = {
|
||||
"h1": lambda value: rx.box(
|
||||
rx.heading(value, as_="h1", size="2xl"), padding="1em"
|
||||
rx.chakra.heading(value, as_="h1", size="2xl"), padding="1em"
|
||||
),
|
||||
"p": lambda value: rx.box(rx.text(value), padding="1em"),
|
||||
}
|
||||
|
||||
@ -15,7 +15,7 @@ from starlette_admin.auth import AuthProvider
|
||||
from starlette_admin.contrib.sqla.admin import Admin
|
||||
from starlette_admin.contrib.sqla.view import ModelView
|
||||
|
||||
import reflex.components.radix.themes as rdxt
|
||||
import reflex as rx
|
||||
from reflex import AdminDash, constants
|
||||
from reflex.app import (
|
||||
App,
|
||||
@ -24,7 +24,8 @@ from reflex.app import (
|
||||
process,
|
||||
upload,
|
||||
)
|
||||
from reflex.components import Box, Component, Cond, Fragment, Text
|
||||
from reflex.components import Component, Cond, Fragment
|
||||
from reflex.components.radix.themes.typography.text import Text
|
||||
from reflex.event import Event
|
||||
from reflex.middleware import HydrateMiddleware
|
||||
from reflex.model import Model
|
||||
@ -58,7 +59,7 @@ def index_page():
|
||||
"""
|
||||
|
||||
def index():
|
||||
return Box.create("Index")
|
||||
return rx.box("Index")
|
||||
|
||||
return index
|
||||
|
||||
@ -72,7 +73,7 @@ def about_page():
|
||||
"""
|
||||
|
||||
def about():
|
||||
return Box.create("About")
|
||||
return rx.box("About")
|
||||
|
||||
return about
|
||||
|
||||
@ -1172,7 +1173,7 @@ def test_overlay_component(
|
||||
exp_page_child,
|
||||
)
|
||||
|
||||
app.add_page(Box.create("Index"), route="/test")
|
||||
app.add_page(rx.box("Index"), route="/test")
|
||||
page = app.pages["test"]
|
||||
if exp_page_child is not None:
|
||||
assert len(page.children) == 3
|
||||
@ -1212,7 +1213,7 @@ def test_app_wrap_compile_theme(compilable_app):
|
||||
compilable_app: compilable_app fixture.
|
||||
"""
|
||||
app, web_dir = compilable_app
|
||||
app.theme = rdxt.theme(accent_color="plum")
|
||||
app.theme = rx.theme(accent_color="plum")
|
||||
app.compile_()
|
||||
app_js_contents = (web_dir / "pages" / "_app.js").read_text()
|
||||
app_js_lines = [
|
||||
@ -1245,13 +1246,13 @@ def test_app_wrap_priority(compilable_app):
|
||||
tag = "Fragment1"
|
||||
|
||||
def _get_app_wrap_components(self) -> dict[tuple[int, str], Component]:
|
||||
return {(99, "Box"): Box.create()}
|
||||
return {(99, "Box"): rx.chakra.box()}
|
||||
|
||||
class Fragment2(Component):
|
||||
tag = "Fragment2"
|
||||
|
||||
def _get_app_wrap_components(self) -> dict[tuple[int, str], Component]:
|
||||
return {(50, "Text"): Text.create()}
|
||||
return {(50, "Text"): rx.chakra.text()}
|
||||
|
||||
class Fragment3(Component):
|
||||
tag = "Fragment3"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user