freyr/lib.rs
1//! # Freyr UI Components Library for Dioxus.
2//!
3//! This crate provides a set of customizable UI components for use in Dioxus projects.
4//! It allows developers to easily integrate and style components such as navbars, carousels and buttons,
5//! with flexible configuration options for color schemes and layouts. Just make it your own!
6//!
7//! ## Why the name Freyr?
8//!
9//! Freyr is the norse god of fertility and prosperity and is known for his beauty. Your Dioxus web app should also look good.
10//!
11//! > ### **Warning:**
12//! > **_New components will be added, and some features that already exist may change._**
13//! > **Freyr was created out of fun to help me reuse the components I had already used in other project, while I was learning _Rust_ and Dioxus. So I also hope it's going to help you too.**
14//!
15//! ### **Features**
16//! - [x] Buttons
17//! - [x] Tabs
18//! - [x] Navbar
19//! - [x] Accordion
20//! - [x] Carousel
21//! - [x] Dropdown
22//! - [x] Dialog
23//! - [x] Spinner
24//! - [x] Card
25//!
26//! All those components have more features than you think. For more information about them please chack them [here](https://docs.rs/freyr/latest/freyr/#functions).
27//! ## Key Features
28//! - Full customization of colors, sizes, and layouts using configuration structs and enums.
29//! - Easy integration into Dioxus web projects.
30//!
31//! ## Example Usage
32//!
33//! ```rust
34//! #![allow(non_snake_case)]
35//! use dioxus::prelude::*;
36//! use freyr::prelude::*;
37//!
38//! #[derive(Clone, Routable, Debug, PartialEq)]
39//! enum Route {
40//! #[layout(Navigation)]
41//! #[route("/")]
42//! Home {},
43//! }
44//!
45//!
46//! #[component]
47//! fn Navigation() -> Element {
48//! let navbar_config = NavbarConfig {
49//! background_color: ColorScheme::Dark,
50//! nav_header: Some(String::from("Freyr")),
51//! orientation: Some(Orientation::Center),
52//! header_color: HeaderColor::Light,
53//! nav_items: vec!["Home".to_string(), "About".to_string(), "Contact".to_string()],
54//! nav_links: vec!["/".to_string(), "/about".to_string(), "/contact".to_string()],
55//! nav_item_color: NavItemsColor::Custom("#990000"),
56//! icon_color: IconColor::Custom("#99cc00"), // Sets the color for both the hamburger SVG and the cross SVG.
57//! };
58//!
59//! rsx! {
60//! Navbar { navbar_config }
61//! Outlet::<Route> {}
62//! }
63//! }
64//!
65//! #[component]
66//! fn Home() -> Element {
67//! rsx! {
68//! div {
69//! BasicButton { color: ButtonColor::Freyr, label: String::from("Go Home"), link: ButtonUrl { url: "/".to_string() } }
70//! BasicButton { color: ButtonColor::Primary, label: String::from("Go to About"), link: ButtonUrl { url: "/about".to_string() } }
71//! // Here the routing is made optional
72//! BasicButton { color: ButtonColor::Freyr, label: String::from("Hello") }
73//!
74//! }
75//! }
76//! }
77//!
78//! #[component]
79//! fn Dropdown() -> Element {
80//! let dropdown_items = vec![
81//! DropdownItem { label: String::from("Freyr"), url: String::from("/") },
82//! DropdownItem { label: "See freyr's components".to_string(), url: "/components".to_string() },
83//! DropdownItem { label: "Learn about dioxus".to_string(), url: "/learn-dioxus".to_string() },
84//! ];
85//!
86//! let config_dropdown = DropdownConfig {
87//! title: String::from("Menu"),
88//! label: dropdown_items,
89//! background_color: DropdownColorScheme::Freyr,
90//! title_color: DropdownTitleColor::Light,
91//! labels_color: DropdownLabelsColor::Dark,
92//! hover_color: DropdownHoverColor::Custom("#03346E"),
93//! };
94//! rsx! {
95//! div {
96//! DropdownMenu { config_dropdown }
97//! }
98//! }
99//! }
100//! ```
101//!
102//! For more documentation about the actual components, please go to the [functions](https://docs.rs/freyr/latest/freyr/#functions).
103mod accordion;
104mod assets;
105mod basic_button;
106mod carousel;
107mod dialog;
108mod dropdown;
109mod enums;
110mod nav_bar;
111mod navbar_with_logo;
112pub mod prelude;
113mod scripts;
114mod spinner;
115mod tabs;
116mod card;
117
118pub use crate::accordion::*;
119pub use crate::basic_button::*;
120pub use crate::carousel::*;
121pub use crate::dialog::*;
122pub use crate::dropdown::*;
123pub use crate::enums::accordion_enums::*;
124pub use crate::enums::basic_button_enums::*;
125pub use crate::enums::carousel_simple_enums::*;
126pub use crate::enums::dialog_enums::*;
127pub use crate::enums::dropdown_enums::*;
128pub use crate::enums::navbar_enums::*;
129pub use crate::enums::tabs_enums::*;
130pub use crate::nav_bar::*;
131pub use crate::spinner::*;
132pub use crate::navbar_with_logo::*;
133pub use crate::tabs::*;
134pub use crate::card::*;