Skip to main content

dioxus_ui_system/
lib.rs

1//! Dioxus UI System
2//!
3//! A pure Rust design system for Dioxus with Atomic Design principles.
4//!
5//! ## Features
6//!
7//! - **Atomic Design Architecture**: Components organized as Atoms, Molecules, and Organisms
8//! - **Type-Safe Theming**: Comprehensive theme system with light/dark/brand modes
9//! - **Pure Rust Styling**: No CSS files - all styles generated in Rust
10//! - **Tailwind-like API**: Fluent style builder for rapid UI development
11//! - **Multi-Platform**: Works on Web (WASM), Desktop, and Mobile
12//!
13//! ## Quick Start
14//!
15//! ```rust,ignore
16//! use dioxus_ui_system::prelude::*;
17//!
18//! fn App() -> Element {
19//!     rsx! {
20//!         ThemeProvider {
21//!             Card {
22//!                 CardHeader { title: "Welcome" }
23//!                 CardContent {
24//!                     Button {
25//!                         variant: ButtonVariant::Primary,
26//!                         "Click me"
27//!                     }
28//!                 }
29//!             }
30//!         }
31//!     }
32//! }
33//! ```
34
35pub mod atoms;
36pub mod config;
37pub mod molecules;
38pub mod organisms;
39pub mod styles;
40pub mod theme;
41
42/// Prelude module for convenient imports
43pub mod prelude {
44    //! Convenient re-exports for common types
45
46    // Config
47    pub use crate::config::{
48        global_config, set_global_config, ComponentConfig, Config, ConfigBuilder,
49    };
50
51    // Theme
52    pub use crate::theme::{
53        use_style, use_theme, Color, ColorScale, RadiusScale, SpacingScale, ThemeContext,
54        ThemeMode, ThemeProvider, ThemeSelector, ThemeToggle, ThemeTokens, Typography,
55        TypographyScale,
56    };
57
58    // Styles
59    pub use crate::styles::Style;
60    pub use crate::{cx, style_if};
61
62    // Atoms
63    pub use crate::atoms::{
64        AlignItems,
65        AutoResizeTextArea,
66        AutoResizeTextAreaProps,
67        BackgroundColor,
68        BorderWidth,
69        Box,
70        BoxDisplay,
71        BoxProps,
72        Button,
73        ButtonProps,
74        ButtonSize,
75        ButtonType,
76        ButtonVariant,
77        Center,
78        Checkbox,
79        CheckboxProps,
80        DatePicker,
81        DatePickerProps,
82        // New atoms
83        Divider,
84        DividerOrientation,
85        DividerProps,
86        DividerVariant,
87        FlexDirection,
88        FlexWrap,
89        HStack,
90        Heading,
91        HeadingLevel,
92        Icon,
93        IconBtn as IconButton2,
94        IconButton,
95        IconColor,
96        IconProps,
97        IconSize,
98        Input,
99        InputProps,
100        InputTag,
101        InputTagProps,
102        InputType,
103        JustifyContent,
104        Label,
105        LabelElement,
106        LabelProps,
107        MultiSelect,
108        MultiSelectProps,
109        MutedText,
110        Overflow,
111        Position,
112        Progress,
113        ProgressProps,
114        ProgressSize,
115        ProgressVariant,
116        Radio,
117        RadioDirection,
118        RadioGroup,
119        RadioGroupProps,
120        RadioProps,
121        RadiusSize,
122        Rating,
123        RatingProps,
124        Select,
125        SelectOption,
126        SelectProps,
127        ShadowSize,
128        Skeleton,
129        SkeletonAnimation,
130        SkeletonCard as AtomSkeletonCard,
131        SkeletonCardProps as AtomSkeletonCardProps,
132        SkeletonProps,
133        SkeletonShape,
134        SkeletonText as AtomSkeletonText,
135        SkeletonTextProps as AtomSkeletonTextProps,
136        Slider,
137        SliderMark,
138        SliderProps,
139        SpacingSize,
140        Spinner,
141        SpinnerProps,
142        SpinnerSize,
143        SpinnerVariant,
144        Switch,
145        SwitchProps,
146        SwitchSize,
147        Tag,
148        TagData,
149        TagGroup,
150        TagProps,
151        TagSize,
152        TagVariant,
153        TextArea,
154        TextAreaProps,
155        TextColor,
156        TextSize,
157        TextWeight,
158        VStack,
159    };
160
161    // Molecules
162    pub use crate::molecules::{
163        use_toast,
164        ActionListItem,
165        ActionListItemProps,
166        Alert,
167        AlertDialog,
168        AlertDialogProps,
169        AlertProps,
170        AlertVariant,
171        Avatar,
172        AvatarGroup,
173        AvatarGroupProps,
174        AvatarProps,
175        AvatarSize,
176        Badge,
177        BadgeProps,
178        BadgeSize,
179        BadgeVariant,
180        Breadcrumb,
181        BreadcrumbItem,
182        BreadcrumbProps,
183        Card,
184        CardContent,
185        CardContentProps,
186        CardFooter,
187        CardFooterJustify,
188        CardFooterProps,
189        CardHeader,
190        CardHeaderProps,
191        CardProps,
192        CardVariant,
193        Combobox,
194        ComboboxOption,
195        ComboboxProps,
196        // Command palette
197        Command,
198        CommandEmpty,
199        CommandEmptyProps,
200        CommandGroup,
201        CommandGroupProps,
202        CommandInput,
203        CommandInputProps,
204        CommandItem,
205        CommandItemProps,
206        CommandList,
207        CommandListProps,
208        CommandLoading,
209        CommandProps,
210        CommandSeparator,
211        CommandShortcut,
212        CommandShortcutProps,
213        Comment,
214        CommentProps,
215        // Context Menu
216        ContextMenu,
217        ContextMenuCheckboxItem,
218        ContextMenuCheckboxItemProps,
219        ContextMenuContent,
220        ContextMenuContentProps,
221        ContextMenuItem,
222        ContextMenuItemProps,
223        ContextMenuLabel,
224        ContextMenuLabelProps,
225        ContextMenuProps,
226        ContextMenuSeparator,
227        ContextMenuSub,
228        ContextMenuSubProps,
229        ContextMenuSubTrigger,
230        ContextMenuSubTriggerProps,
231        ContextMenuTrigger,
232        ContextMenuTriggerProps,
233        Dialog,
234        DialogFooter,
235        DialogFooterAlign,
236        DialogFooterProps,
237        DialogProps,
238        DropdownAlign,
239        DropdownMenu,
240        DropdownMenuItem,
241        DropdownMenuLabel,
242        DropdownMenuLabelProps,
243        DropdownMenuProps,
244        DropdownMenuSeparator,
245        ExpandableListItem,
246        ExpandableListItemProps,
247        InputGroup,
248        ListGroup,
249        ListGroupProps,
250        ListItem,
251        ListItemProps,
252        ListItemVariant,
253        MediaContent,
254        MediaContentProps,
255        MediaObject,
256        MediaObjectProps,
257        MultiCombobox,
258        MultiComboboxProps,
259        // OTP Input
260        OtpInput,
261        OtpInputProps,
262        PageSizeSelector,
263        PageSizeSelectorProps,
264        Pagination,
265        PaginationInfo,
266        PaginationInfoProps,
267        PaginationProps,
268        PaginationSize,
269        Popover,
270        PopoverFooter,
271        PopoverFooterProps,
272        PopoverHeader,
273        PopoverHeaderProps,
274        PopoverPlacement,
275        PopoverProps,
276        Separator,
277        SeparatorOrientation,
278        SeparatorProps,
279        // Sheet
280        Sheet,
281        SheetFooter,
282        SheetFooterAlign,
283        SheetFooterProps,
284        SheetProps,
285        SheetSide,
286        SimpleTooltip,
287        SimpleTooltipProps,
288        SkeletonCard,
289        SkeletonCardProps,
290        SkeletonCircle,
291        SkeletonCircleProps,
292        SkeletonMolecule,
293        SkeletonMoleculeProps,
294        SkeletonText,
295        SkeletonTextProps,
296        StatusBadge,
297        StatusBadgeProps,
298        StatusType,
299        TimeInput,
300        TimeInputProps,
301        // Time Picker
302        TimePicker,
303        TimePickerProps,
304        // New molecules
305        Toast,
306        ToastManager,
307        ToastProps,
308        ToastProvider,
309        ToastProviderProps,
310        ToastVariant,
311        Tooltip,
312        TooltipPlacement,
313        TooltipProps,
314    };
315
316    // Organisms
317    pub use crate::organisms::{
318        Accordion, AccordionItem, AccordionItem2, AccordionItem2Props, AccordionProps, Calendar,
319        CalendarMode, CalendarProps, ColumnAlign, DataTable, DataTableProps, FilterOption,
320        FullRichText, FullRichTextProps, Header, HeaderNavLink, HeaderProps, Layout, LayoutNavItem,
321        LayoutProps, LayoutType, MinimalRichText, MinimalRichTextProps, MobileMenuToggle, NavItem,
322        RichTextEditor, RichTextEditorProps, RichTextFeatures, SimpleRichText, SimpleRichTextProps,
323        TabItem, TabPanel, TabPanelProps, TableColumn, TableFilter, TablePagination,
324        TablePaginationProps, Tabs, TabsProps, TabsVariant, UserMenu, UserMenuItem, UserMenuProps,
325        VerticalTabs, VerticalTabsProps,
326    };
327
328    // Charts
329    pub use crate::organisms::charts::{
330        calculate_nice_ticks, format_compact_number, format_currency, format_percentage, palettes,
331        utils, AnimationEasing, BarChart, BarChartProps, BarChartVariant, ChartAnimation,
332        ChartAxis, ChartDataPoint, ChartMargin, ChartSeries, ChartTooltip, DonutChart, GaugeChart,
333        LegendPosition, LineChart, LineChartProps, LineChartVariant, PieChart, PieChartProps,
334        PieChartVariant, Sparkline, SparklineProps, SparklineVariant, TrendIndicator,
335    };
336}
337
338// Re-export at crate root for convenience
339pub use config::*;
340pub use styles::*;
341pub use theme::*;