(
component_name: &'static str,
variant: ComponentVariantDemoData,
main_variant: bool,
show_install: bool,
)
| 1010 | |
| 1011 | #[component] |
| 1012 | fn BlockComponentVariantHighlight( |
| 1013 | component_name: &'static str, |
| 1014 | variant: ComponentVariantDemoData, |
| 1015 | main_variant: bool, |
| 1016 | show_install: bool, |
| 1017 | ) -> Element { |
| 1018 | let ComponentVariantDemoData { |
| 1019 | name, |
| 1020 | rs_highlighted: highlighted, |
| 1021 | css_highlighted, |
| 1022 | component: _, |
| 1023 | } = variant; |
| 1024 | |
| 1025 | let route_path = Route::ComponentBlockDemo { |
| 1026 | name: component_name.to_string(), |
| 1027 | variant: Some(name.to_string()), |
| 1028 | dark_mode: Route::in_dark_mode(), |
| 1029 | } |
| 1030 | .to_string(); |
| 1031 | |
| 1032 | let iframe_src = match router().prefix() { |
| 1033 | Some(prefix) => format!("{prefix}{route_path}"), |
| 1034 | None => route_path, |
| 1035 | }; |
| 1036 | |
| 1037 | rsx! { |
| 1038 | if !main_variant { |
| 1039 | h3 { class: "dx-component-variant-title", "{name}" } |
| 1040 | } |
| 1041 | Tabs { |
| 1042 | default_value: "Preview", |
| 1043 | border_bottom_left_radius: "0.5rem", |
| 1044 | border_bottom_right_radius: "0.5rem", |
| 1045 | horizontal: true, |
| 1046 | width: "100%", |
| 1047 | variant: TabsVariant::Ghost, |
| 1048 | div { class: "dx-component-tabs-header", |
| 1049 | TabList { |
| 1050 | TabTrigger { value: "Preview", index: 0usize, "PREVIEW" } |
| 1051 | TabTrigger { value: "Code", index: 1usize, "CODE" } |
| 1052 | } |
| 1053 | if show_install { |
| 1054 | ComponentInstallCommand { name: component_name } |
| 1055 | } |
| 1056 | } |
| 1057 | div { |
| 1058 | width: "100%", |
| 1059 | height: "100%", |
| 1060 | display: "flex", |
| 1061 | flex_direction: "column", |
| 1062 | justify_content: "center", |
| 1063 | align_items: "center", |
| 1064 | TabContent { |
| 1065 | index: 0usize, |
| 1066 | id: "component-preview-frame", |
| 1067 | value: "Preview", |
| 1068 | width: "100%", |
| 1069 | position: "relative", |
nothing calls this directly
no outgoing calls
no test coverage detected