├── .github ├── FUNDING.yml ├── labels.yml ├── renovate.json └── workflows │ ├── ci.yml │ ├── labels.yml │ └── website.yml ├── .gitignore ├── .pre-commit-config.yaml ├── .prettierignore ├── .prettierrc.json ├── Cargo.lock ├── Cargo.toml ├── LICENSE.md ├── README.md ├── book-examples ├── leptos │ ├── Cargo.toml │ ├── Trunk.toml │ ├── index.html │ ├── main.js │ ├── src │ │ ├── app.rs │ │ ├── default.rs │ │ ├── default │ │ │ ├── alert.rs │ │ │ ├── alert │ │ │ │ ├── alert.rs │ │ │ │ └── alert_destructive.rs │ │ │ ├── badge.rs │ │ │ ├── badge │ │ │ │ ├── badge.rs │ │ │ │ ├── badge_destructive.rs │ │ │ │ ├── badge_outline.rs │ │ │ │ └── badge_secondary.rs │ │ │ ├── button.rs │ │ │ ├── button │ │ │ │ ├── button.rs │ │ │ │ ├── button_as_child.rs │ │ │ │ ├── button_destructive.rs │ │ │ │ ├── button_ghost.rs │ │ │ │ ├── button_icon.rs │ │ │ │ ├── button_link.rs │ │ │ │ ├── button_loading.rs │ │ │ │ ├── button_outline.rs │ │ │ │ ├── button_secondary.rs │ │ │ │ └── button_with_icon.rs │ │ │ ├── card.rs │ │ │ ├── card │ │ │ │ ├── card.rs │ │ │ │ └── card_with_form.rs │ │ │ ├── components.rs │ │ │ └── components │ │ │ │ └── ui.rs │ │ ├── main.rs │ │ ├── new_york.rs │ │ └── new_york │ │ │ ├── alert.rs │ │ │ ├── alert │ │ │ ├── alert.rs │ │ │ └── alert_destructive.rs │ │ │ ├── badge.rs │ │ │ ├── badge │ │ │ ├── badge.rs │ │ │ ├── badge_destructive.rs │ │ │ ├── badge_outline.rs │ │ │ └── badge_secondary.rs │ │ │ ├── button.rs │ │ │ ├── button │ │ │ ├── button.rs │ │ │ ├── button_as_child.rs │ │ │ ├── button_destructive.rs │ │ │ ├── button_ghost.rs │ │ │ ├── button_icon.rs │ │ │ ├── button_link.rs │ │ │ ├── button_loading.rs │ │ │ ├── button_outline.rs │ │ │ ├── button_secondary.rs │ │ │ └── button_with_icon.rs │ │ │ ├── card.rs │ │ │ ├── card │ │ │ ├── card.rs │ │ │ └── card_with_form.rs │ │ │ ├── components.rs │ │ │ └── components │ │ │ └── ui.rs │ ├── style │ │ └── tailwind.css │ └── tailwind.config.js └── yew │ ├── Cargo.toml │ ├── Trunk.toml │ ├── index.html │ ├── main.js │ ├── src │ ├── app.rs │ ├── default.rs │ ├── default │ │ ├── alert.rs │ │ ├── alert │ │ │ ├── alert.rs │ │ │ └── alert_destructive.rs │ │ ├── aspect_ratio.rs │ │ ├── aspect_ratio │ │ │ └── aspect_ratio.rs │ │ ├── avatar.rs │ │ ├── avatar │ │ │ └── avatar.rs │ │ ├── badge.rs │ │ ├── badge │ │ │ ├── badge.rs │ │ │ ├── badge_destructive.rs │ │ │ ├── badge_outline.rs │ │ │ └── badge_secondary.rs │ │ ├── breadcrumb.rs │ │ ├── breadcrumb │ │ │ ├── breadcrumb.rs │ │ │ ├── breadcrumb_dropdown.rs │ │ │ ├── breadcrumb_ellipsis.rs │ │ │ ├── breadcrumb_link.rs │ │ │ ├── breadcrumb_responsive.rs │ │ │ └── breadcrumb_separator.rs │ │ ├── button.rs │ │ ├── button │ │ │ ├── button.rs │ │ │ ├── button_as_child.rs │ │ │ ├── button_destructive.rs │ │ │ ├── button_ghost.rs │ │ │ ├── button_icon.rs │ │ │ ├── button_link.rs │ │ │ ├── button_loading.rs │ │ │ ├── button_outline.rs │ │ │ ├── button_secondary.rs │ │ │ └── button_with_icon.rs │ │ ├── card.rs │ │ ├── card │ │ │ ├── card.rs │ │ │ └── card_with_form.rs │ │ ├── components.rs │ │ ├── components │ │ │ └── ui.rs │ │ ├── input.rs │ │ ├── input │ │ │ ├── input.rs │ │ │ ├── input_disabled.rs │ │ │ ├── input_file.rs │ │ │ ├── input_form.rs │ │ │ ├── input_with_button.rs │ │ │ ├── input_with_label.rs │ │ │ └── input_with_text.rs │ │ ├── label.rs │ │ ├── label │ │ │ └── label.rs │ │ ├── pagination.rs │ │ ├── pagination │ │ │ └── pagination.rs │ │ ├── separator.rs │ │ ├── separator │ │ │ └── separator.rs │ │ ├── skeleton.rs │ │ ├── skeleton │ │ │ ├── skeleton.rs │ │ │ └── skeleton_card.rs │ │ ├── switch.rs │ │ ├── switch │ │ │ ├── switch.rs │ │ │ └── switch_form.rs │ │ ├── table.rs │ │ ├── table │ │ │ └── table.rs │ │ ├── textarea.rs │ │ └── textarea │ │ │ ├── textarea.rs │ │ │ ├── textarea_disabled.rs │ │ │ ├── textarea_form.rs │ │ │ ├── textarea_with_button.rs │ │ │ ├── textarea_with_label.rs │ │ │ └── textarea_with_text.rs │ ├── main.rs │ ├── new_york.rs │ └── new_york │ │ ├── alert.rs │ │ ├── alert │ │ ├── alert.rs │ │ └── alert_destructive.rs │ │ ├── aspect_ratio.rs │ │ ├── aspect_ratio │ │ └── aspect_ratio.rs │ │ ├── avatar.rs │ │ ├── avatar │ │ └── avatar.rs │ │ ├── badge.rs │ │ ├── badge │ │ ├── badge.rs │ │ ├── badge_destructive.rs │ │ ├── badge_outline.rs │ │ └── badge_secondary.rs │ │ ├── breadcrumb.rs │ │ ├── breadcrumb │ │ ├── breadcrumb.rs │ │ ├── breadcrumb_dropdown.rs │ │ ├── breadcrumb_ellipsis.rs │ │ ├── breadcrumb_link.rs │ │ ├── breadcrumb_responsive.rs │ │ └── breadcrumb_separator.rs │ │ ├── button.rs │ │ ├── button │ │ ├── button.rs │ │ ├── button_as_child.rs │ │ ├── button_destructive.rs │ │ ├── button_ghost.rs │ │ ├── button_icon.rs │ │ ├── button_link.rs │ │ ├── button_loading.rs │ │ ├── button_outline.rs │ │ ├── button_secondary.rs │ │ └── button_with_icon.rs │ │ ├── card.rs │ │ ├── card │ │ ├── card.rs │ │ └── card_with_form.rs │ │ ├── components.rs │ │ ├── components │ │ └── ui.rs │ │ ├── input.rs │ │ ├── input │ │ ├── input.rs │ │ ├── input_disabled.rs │ │ ├── input_file.rs │ │ ├── input_form.rs │ │ ├── input_with_button.rs │ │ ├── input_with_label.rs │ │ └── input_with_text.rs │ │ ├── label.rs │ │ ├── label │ │ └── label.rs │ │ ├── pagination.rs │ │ ├── pagination │ │ └── pagination.rs │ │ ├── separator.rs │ │ ├── separator │ │ └── separator.rs │ │ ├── skeleton.rs │ │ ├── skeleton │ │ ├── skeleton.rs │ │ └── skeleton_card.rs │ │ ├── switch.rs │ │ ├── switch │ │ ├── switch.rs │ │ └── switch_form.rs │ │ ├── table.rs │ │ ├── table │ │ └── table.rs │ │ ├── textarea.rs │ │ └── textarea │ │ ├── textarea.rs │ │ ├── textarea_disabled.rs │ │ ├── textarea_form.rs │ │ ├── textarea_with_button.rs │ │ ├── textarea_with_label.rs │ │ └── textarea_with_text.rs │ ├── style │ └── tailwind.css │ └── tailwind.config.js ├── book ├── book.toml ├── src │ ├── SUMMARY.md │ ├── components │ │ ├── README.md │ │ ├── alert.md │ │ ├── aspect-ratio.md │ │ ├── avatar.md │ │ ├── badge.md │ │ ├── breadcrumb.md │ │ ├── button.md │ │ ├── card.md │ │ ├── input.md │ │ ├── label.md │ │ ├── pagination.md │ │ ├── separator.md │ │ ├── skeleton.md │ │ ├── switch.md │ │ ├── table.md │ │ └── textarea.md │ ├── getting-started │ │ └── README.md │ ├── images │ │ └── logo.svg │ └── introduction.md └── theme │ ├── tabs.css │ ├── tabs.js │ ├── theme.css │ ├── theme.js │ ├── trunk.css │ └── trunk.js ├── components.toml ├── logo.svg ├── package-lock.json ├── package.json ├── packages ├── leptos │ ├── alert │ │ ├── Cargo.toml │ │ ├── README.md │ │ └── src │ │ │ ├── default.rs │ │ │ ├── lib.rs │ │ │ └── new_york.rs │ ├── badge │ │ ├── Cargo.toml │ │ ├── README.md │ │ └── src │ │ │ ├── default.rs │ │ │ ├── lib.rs │ │ │ └── new_york.rs │ ├── button │ │ ├── Cargo.toml │ │ ├── README.md │ │ └── src │ │ │ ├── default.rs │ │ │ ├── lib.rs │ │ │ └── new_york.rs │ ├── card │ │ ├── Cargo.toml │ │ ├── README.md │ │ └── src │ │ │ ├── default.rs │ │ │ ├── lib.rs │ │ │ └── new_york.rs │ └── utils │ │ ├── Cargo.toml │ │ ├── README.md │ │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs ├── registry │ ├── Cargo.toml │ └── src │ │ ├── lib.rs │ │ ├── registry_base_colors.rs │ │ ├── registry_blocks.rs │ │ ├── registry_charts.rs │ │ ├── registry_colors.rs │ │ ├── registry_examples.rs │ │ ├── registry_frameworks.rs │ │ ├── registry_hooks.rs │ │ ├── registry_lib.rs │ │ ├── registry_styles.rs │ │ ├── registry_themes.rs │ │ ├── registry_ui.rs │ │ └── schema.rs ├── shadcn │ ├── Cargo.toml │ └── src │ │ ├── bin │ │ └── rust-shadcn.rs │ │ ├── commands.rs │ │ ├── commands │ │ ├── add.rs │ │ ├── diff.rs │ │ └── init.rs │ │ ├── lib.rs │ │ ├── preflights.rs │ │ ├── preflights │ │ └── preflight_init.rs │ │ ├── utils.rs │ │ └── utils │ │ ├── errors.rs │ │ ├── get_project_info.rs │ │ ├── highlighter.rs │ │ ├── logger.rs │ │ └── spinner.rs └── yew │ ├── alert │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── aspect-ratio │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── avatar │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── badge │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── breadcrumb │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── button │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── card │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── input │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── label │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── pagination │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── separator │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── skeleton │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── switch │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ ├── table │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── default.rs │ │ ├── lib.rs │ │ └── new_york.rs │ └── textarea │ ├── Cargo.toml │ ├── README.md │ └── src │ ├── default.rs │ ├── lib.rs │ └── new_york.rs ├── rust-toolchain.toml └── scripts ├── Cargo.toml └── src ├── bin ├── build_registry.rs └── templates │ ├── base_styles.css │ ├── base_styles_with_variables.css │ └── theme_styles_with_variables.css └── lib.rs /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: RustForWeb 2 | open_collective: rustforweb 3 | -------------------------------------------------------------------------------- /.github/renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://docs.renovatebot.com/renovate-schema.json", 3 | "extends": ["github>RustForWeb/.github:renovate-config"] 4 | } 5 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | pull_request: {} 5 | push: 6 | branches: 7 | - main 8 | 9 | env: 10 | RUSTFLAGS: '-Dwarnings' 11 | 12 | jobs: 13 | test: 14 | name: Test 15 | runs-on: ubuntu-latest 16 | 17 | steps: 18 | - name: Checkout 19 | uses: actions/checkout@v4 20 | 21 | - name: Set up Rust toolchain 22 | run: rustup toolchain install nightly --no-self-update --profile default --target wasm32-unknown-unknown 23 | 24 | - name: Set up Rust cache 25 | uses: swatinem/rust-cache@v2 26 | with: 27 | cache-on-failure: true 28 | save-if: ${{ github.ref == 'refs/heads/main' }} 29 | 30 | - name: Check formatting 31 | run: cargo fmt --all --check 32 | 33 | - name: Lint 34 | run: cargo clippy --all-features 35 | 36 | - name: Test 37 | run: cargo test --all-features 38 | -------------------------------------------------------------------------------- /.github/workflows/labels.yml: -------------------------------------------------------------------------------- 1 | name: Labels 2 | 3 | on: 4 | workflow_dispatch: 5 | 6 | jobs: 7 | sync-labels: 8 | name: Sync Labels 9 | runs-on: ubuntu-latest 10 | steps: 11 | - uses: actions/checkout@v4 12 | with: 13 | sparse-checkout: .github/labels.yml 14 | 15 | - uses: EndBug/label-sync@v2 16 | with: 17 | config-file: .github/labels.yml 18 | -------------------------------------------------------------------------------- /.pre-commit-config.yaml: -------------------------------------------------------------------------------- 1 | repos: 2 | - repo: https://github.com/pre-commit/mirrors-prettier 3 | rev: v3.1.0 4 | hooks: 5 | - id: prettier 6 | additional_dependencies: 7 | - prettier@^3.2.5 8 | - prettier-plugin-tailwindcss@^0.5.12 9 | - repo: https://github.com/doublify/pre-commit-rust 10 | rev: v1.0 11 | hooks: 12 | - id: fmt 13 | - id: clippy 14 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .vite/ 2 | target/ 3 | -------------------------------------------------------------------------------- /.prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": ["prettier-plugin-tailwindcss"], 3 | "bracketSpacing": false, 4 | "printWidth": 120, 5 | "singleQuote": true, 6 | "tabWidth": 4, 7 | "trailingComma": "none" 8 | } 9 | -------------------------------------------------------------------------------- /Cargo.toml: -------------------------------------------------------------------------------- 1 | [workspace] 2 | members = [ 3 | "book-examples/*", 4 | "packages/leptos/*", 5 | "packages/registry", 6 | "packages/shadcn", 7 | "packages/yew/*", 8 | "scripts", 9 | ] 10 | resolver = "2" 11 | 12 | [workspace.package] 13 | authors = ["Rust for Web "] 14 | edition = "2024" 15 | license = "MIT" 16 | repository = "https://github.com/RustForWeb/shadcn-ui" 17 | version = "0.0.1" 18 | 19 | [workspace.dependencies] 20 | anyhow = "1.0.89" 21 | console_log = "1.0.0" 22 | console_error_panic_hook = "0.1.7" 23 | env_logger = "0.11.3" 24 | leptos = "0.8.0" 25 | leptos_router = "0.8.0" 26 | leptos-node-ref = "0.2.0" 27 | leptos-struct-component = "0.2.0" 28 | leptos-style = "0.2.0" 29 | log = "0.4.21" 30 | lucide-leptos = "2.0.0" 31 | lucide-yew = "2.0.0" 32 | radix-leptos-icons = { git = "https://github.com/RustForWeb/radix.git" } 33 | radix-yew-icons = "0.0.2" 34 | serde = { version = "1.0.203", features = ["derive"] } 35 | serde_json = "1.0.117" 36 | tailwind_fuse = { version = "0.3.0", features = ["variant"] } 37 | tokio = { version = "1.38.0", features = ["full"] } 38 | web-sys = "0.3.70" 39 | yew = "0.21.0" 40 | yew-router = "0.18.0" 41 | yew-struct-component = "0.1.4" 42 | yew-style = "0.1.4" 43 | 44 | [patch.crates-io] 45 | yew = { git = "https://github.com/RustForWeb/yew.git", branch = "feature/use-composed-ref" } 46 | yew-router = { git = "https://github.com/RustForWeb/yew.git", branch = "feature/use-composed-ref" } 47 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Rust for Web 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 16 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 17 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 18 | IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, 19 | DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR 20 | OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE 21 | OR OTHER DEALINGS IN THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | Rust shadcn/ui Logo 4 | 5 |

6 | 7 |

Rust shadcn/ui

8 | 9 | Rust port of [shadcn/ui](https://ui.shadcn.com/). 10 | 11 | [shadcn/ui](https://ui.shadcn.com/) is a library of beautifully designed components that you can copy and paste into your apps. 12 | 13 | ## Frameworks 14 | 15 | Rust shadcn/ui is available for these Rust frameworks: 16 | 17 | - [Leptos](./packages/leptos) 18 | - [Yew](https://yew.rs/) 19 | 20 | The following frameworks are under consideration: 21 | 22 | - [Dioxus](https://dioxuslabs.com/) 23 | 24 | See [the Rust shadcn/ui book](https://shadcn-ui.rustforweb.org/introduction.html#frameworks) for more information. 25 | 26 | ## Documentation 27 | 28 | See [the Rust shadcn/ui book](https://shadcn-ui.rustforweb.org). 29 | 30 | ## Credits 31 | 32 | The logo is a combination of the [shadcn/ui logo](https://github.com/shadcn-ui/ui/blob/main/apps/www/components/icons.tsx) and [Ferris the Rustacean](https://rustacean.net/). 33 | 34 | ## License 35 | 36 | This project is available under the [MIT license](LICENSE.md). 37 | 38 | ## Rust for Web 39 | 40 | The Rust shadcn/ui project is part of [Rust for Web](https://github.com/RustForWeb). 41 | 42 | [Rust for Web](https://github.com/RustForWeb) creates and ports web UI libraries for Rust. All projects are free and open source. 43 | -------------------------------------------------------------------------------- /book-examples/leptos/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "shadcn-ui-leptos-book" 3 | description = "Book examples for shadcn/ui Leptos." 4 | publish = false 5 | 6 | authors.workspace = true 7 | edition.workspace = true 8 | license.workspace = true 9 | repository.workspace = true 10 | version.workspace = true 11 | 12 | [dependencies] 13 | console_error_panic_hook.workspace = true 14 | console_log.workspace = true 15 | leptos = { workspace = true, features = ["csr"] } 16 | leptos_router.workspace = true 17 | lucide-leptos = { workspace = true, optional = true } 18 | log.workspace = true 19 | radix-leptos-icons = { workspace = true, optional = true } 20 | shadcn-ui-leptos-alert = { path = "../../packages/leptos/alert", optional = true } 21 | shadcn-ui-leptos-badge = { path = "../../packages/leptos/badge", optional = true } 22 | shadcn-ui-leptos-button = { path = "../../packages/leptos/button", optional = true } 23 | shadcn-ui-leptos-card = { path = "../../packages/leptos/card", optional = true } 24 | 25 | [features] 26 | default = ["alert", "badge", "button", "card"] 27 | alert = [ 28 | "dep:lucide-leptos", 29 | "dep:radix-leptos-icons", 30 | "dep:shadcn-ui-leptos-alert", 31 | "lucide-leptos/development", 32 | "lucide-leptos/notifications", 33 | ] 34 | badge = ["dep:shadcn-ui-leptos-badge"] 35 | button = [ 36 | "dep:lucide-leptos", 37 | "dep:radix-leptos-icons", 38 | "dep:shadcn-ui-leptos-button", 39 | "lucide-leptos/layout", 40 | "lucide-leptos/mail", 41 | "lucide-leptos/navigation", 42 | ] 43 | card = [ 44 | "dep:lucide-leptos", 45 | "dep:shadcn-ui-leptos-button", 46 | "dep:shadcn-ui-leptos-card", 47 | "lucide-leptos/notifications", 48 | ] 49 | -------------------------------------------------------------------------------- /book-examples/leptos/Trunk.toml: -------------------------------------------------------------------------------- 1 | [[hooks]] 2 | stage = "pre_build" 3 | command = "sh" 4 | command_arguments = [ 5 | "-c", 6 | "npx tailwindcss -i style/tailwind.css -o style/tailwind.output.css", 7 | ] 8 | -------------------------------------------------------------------------------- /book-examples/leptos/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /book-examples/leptos/main.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('DOMContentLoaded', () => { 2 | const resizeObserver = new ResizeObserver(() => { 3 | if (window.top) { 4 | window.top.postMessage({ 5 | mdbookTrunk: { 6 | width: document.body.scrollWidth, 7 | height: document.body.scrollHeight 8 | } 9 | }); 10 | } 11 | }); 12 | resizeObserver.observe(document.body); 13 | }); 14 | -------------------------------------------------------------------------------- /book-examples/leptos/src/app.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use leptos_router::components::{Router, Routes}; 3 | 4 | use crate::{default::Default, new_york::NewYork}; 5 | 6 | #[component] 7 | pub fn App() -> impl IntoView { 8 | view! { 9 |
10 | // TODO: HashRouter 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | } 19 | } 20 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default.rs: -------------------------------------------------------------------------------- 1 | mod components; 2 | 3 | #[cfg(feature = "alert")] 4 | mod alert; 5 | #[cfg(feature = "badge")] 6 | mod badge; 7 | #[cfg(feature = "button")] 8 | mod button; 9 | #[cfg(feature = "card")] 10 | mod card; 11 | 12 | use leptos::prelude::*; 13 | use leptos_router::{ 14 | MatchNestedRoutes, 15 | components::{Outlet, ParentRoute}, 16 | path, 17 | }; 18 | 19 | #[component(transparent)] 20 | pub fn Default() -> impl MatchNestedRoutes + Clone { 21 | let children = ( 22 | #[cfg(feature = "alert")] 23 | { 24 | component_view(self::alert::AlertRoutes, ()) 25 | }, 26 | #[cfg(feature = "badge")] 27 | { 28 | component_view(self::badge::BadgeRoutes, ()) 29 | }, 30 | #[cfg(feature = "button")] 31 | { 32 | component_view(self::button::ButtonRoutes, ()) 33 | }, 34 | #[cfg(feature = "card")] 35 | { 36 | component_view(self::card::CardRoutes, ()) 37 | }, 38 | ); 39 | 40 | view! { 41 | 42 | } 43 | .into_inner() 44 | } 45 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/alert.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod alert; 3 | mod alert_destructive; 4 | 5 | use leptos::prelude::*; 6 | use leptos_router::{ 7 | MatchNestedRoutes, 8 | components::{Outlet, ParentRoute, Route}, 9 | path, 10 | }; 11 | 12 | #[component(transparent)] 13 | pub fn AlertRoutes() -> impl MatchNestedRoutes + Clone { 14 | view! { 15 | 16 | 17 | 18 | 19 | } 20 | .into_inner() 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/alert/alert.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::Terminal; 3 | 4 | use crate::default::components::ui::alert::{Alert, AlertDescription, AlertTitle}; 5 | 6 | #[component] 7 | pub fn AlertDemo() -> impl IntoView { 8 | view! { 9 | 10 | 11 | "Heads up!" 12 | 13 | "You can add components to your app using the cli." 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/alert/alert_destructive.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::CircleAlert; 3 | 4 | use crate::default::components::ui::alert::{Alert, AlertDescription, AlertTitle, AlertVariant}; 5 | 6 | #[component] 7 | pub fn AlertDestructive() -> impl IntoView { 8 | view! { 9 | 10 | 11 | "Error" 12 | 13 | "Your session has expired. Please log in again." 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/badge.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod badge; 3 | mod badge_destructive; 4 | mod badge_outline; 5 | mod badge_secondary; 6 | 7 | use leptos::prelude::*; 8 | use leptos_router::{ 9 | MatchNestedRoutes, 10 | components::{Outlet, ParentRoute, Route}, 11 | path, 12 | }; 13 | 14 | #[component(transparent)] 15 | pub fn BadgeRoutes() -> impl MatchNestedRoutes + Clone { 16 | view! { 17 | 18 | 19 | 20 | 21 | 22 | 23 | } 24 | .into_inner() 25 | } 26 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/badge/badge.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::badge::Badge; 4 | 5 | #[component] 6 | pub fn BadgeDemo() -> impl IntoView { 7 | view! { 8 | {"Badge"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/badge/badge_destructive.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeDestructive() -> impl IntoView { 7 | view! { 8 | {"Destructive"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/badge/badge_outline.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeOutline() -> impl IntoView { 7 | view! { 8 | {"Outline"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/badge/badge_secondary.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeSecondary() -> impl IntoView { 7 | view! { 8 | {"Secondary"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod button; 3 | mod button_as_child; 4 | mod button_destructive; 5 | mod button_ghost; 6 | mod button_icon; 7 | mod button_link; 8 | mod button_loading; 9 | mod button_outline; 10 | mod button_secondary; 11 | mod button_with_icon; 12 | 13 | use leptos::prelude::*; 14 | use leptos_router::{ 15 | MatchNestedRoutes, 16 | components::{Outlet, ParentRoute, Route}, 17 | path, 18 | }; 19 | 20 | #[component(transparent)] 21 | pub fn ButtonRoutes() -> impl MatchNestedRoutes + Clone { 22 | view! { 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | } 36 | .into_inner() 37 | } 38 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::Button; 4 | 5 | #[component] 6 | pub fn ButtonDemo() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_as_child.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonChildProps}; 4 | 5 | #[component] 6 | pub fn ButtonAsChild() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_ghost.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonGhost() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_icon.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::ChevronRight; 3 | 4 | use crate::default::components::ui::button::{Button, ButtonSize, ButtonVariant}; 5 | 6 | #[component] 7 | pub fn ButtonIcon() -> impl IntoView { 8 | view! { 9 | 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_link.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonLink() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_loading.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::LoaderCircle; 3 | 4 | use crate::default::components::ui::button::Button; 5 | 6 | #[component] 7 | pub fn ButtonLoading() -> impl IntoView { 8 | view! { 9 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_outline.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonOutline() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_secondary.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonSecondary() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/button/button_with_icon.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::default::components::ui::button::Button; 4 | 5 | #[component] 6 | pub fn ButtonWithIcon() -> impl IntoView { 7 | view! { 8 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/card.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod card; 3 | mod card_with_form; 4 | 5 | use leptos::prelude::*; 6 | use leptos_router::{ 7 | MatchNestedRoutes, 8 | components::{Outlet, ParentRoute, Route}, 9 | path, 10 | }; 11 | 12 | #[component(transparent)] 13 | pub fn CardRoutes() -> impl MatchNestedRoutes + Clone { 14 | view! { 15 | 16 | 17 | 18 | 19 | } 20 | .into_inner() 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/components.rs: -------------------------------------------------------------------------------- 1 | pub mod ui; 2 | -------------------------------------------------------------------------------- /book-examples/leptos/src/default/components/ui.rs: -------------------------------------------------------------------------------- 1 | // In actual projects this module would contain the copied components, but this example uses the local workspace packages. 2 | 3 | #[cfg(feature = "alert")] 4 | pub use shadcn_ui_leptos_alert::default as alert; 5 | #[cfg(feature = "badge")] 6 | pub use shadcn_ui_leptos_badge::default as badge; 7 | #[cfg(any(feature = "button", feature = "card"))] 8 | pub use shadcn_ui_leptos_button::default as button; 9 | #[cfg(feature = "card")] 10 | pub use shadcn_ui_leptos_card::default as card; 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/main.rs: -------------------------------------------------------------------------------- 1 | mod app; 2 | mod default; 3 | mod new_york; 4 | 5 | use leptos::prelude::*; 6 | 7 | use crate::app::App; 8 | 9 | pub fn main() { 10 | _ = console_log::init_with_level(log::Level::Debug); 11 | console_error_panic_hook::set_once(); 12 | 13 | mount_to_body(App); 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york.rs: -------------------------------------------------------------------------------- 1 | mod components; 2 | 3 | #[cfg(feature = "alert")] 4 | mod alert; 5 | #[cfg(feature = "badge")] 6 | mod badge; 7 | #[cfg(feature = "button")] 8 | mod button; 9 | #[cfg(feature = "card")] 10 | mod card; 11 | 12 | use leptos::prelude::*; 13 | use leptos_router::{ 14 | MatchNestedRoutes, 15 | components::{Outlet, ParentRoute}, 16 | path, 17 | }; 18 | 19 | #[component(transparent)] 20 | pub fn NewYork() -> impl MatchNestedRoutes + Clone { 21 | let children = ( 22 | #[cfg(feature = "alert")] 23 | { 24 | component_view(self::alert::AlertRoutes, ()) 25 | }, 26 | #[cfg(feature = "badge")] 27 | { 28 | component_view(self::badge::BadgeRoutes, ()) 29 | }, 30 | #[cfg(feature = "button")] 31 | { 32 | component_view(self::button::ButtonRoutes, ()) 33 | }, 34 | #[cfg(feature = "card")] 35 | { 36 | component_view(self::card::CardRoutes, ()) 37 | }, 38 | ); 39 | 40 | view! { 41 | 42 | } 43 | .into_inner() 44 | } 45 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/alert.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod alert; 3 | mod alert_destructive; 4 | 5 | use leptos::prelude::*; 6 | use leptos_router::{ 7 | MatchNestedRoutes, 8 | components::{Outlet, ParentRoute, Route}, 9 | path, 10 | }; 11 | 12 | #[component(transparent)] 13 | pub fn AlertRoutes() -> impl MatchNestedRoutes + Clone { 14 | view! { 15 | 16 | 17 | 18 | 19 | } 20 | .into_inner() 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/alert/alert.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::Terminal; 3 | 4 | use crate::new_york::components::ui::alert::{Alert, AlertDescription, AlertTitle}; 5 | 6 | #[component] 7 | pub fn AlertDemo() -> impl IntoView { 8 | view! { 9 | 10 | 11 | "Heads up!" 12 | 13 | "You can add components to your app using the cli." 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/alert/alert_destructive.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use lucide_leptos::CircleAlert; 3 | 4 | use crate::new_york::components::ui::alert::{Alert, AlertDescription, AlertTitle, AlertVariant}; 5 | 6 | #[component] 7 | pub fn AlertDestructive() -> impl IntoView { 8 | view! { 9 | 10 | 11 | "Error" 12 | 13 | "Your session has expired. Please log in again." 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/badge.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod badge; 3 | mod badge_destructive; 4 | mod badge_outline; 5 | mod badge_secondary; 6 | 7 | use leptos::prelude::*; 8 | use leptos_router::{ 9 | MatchNestedRoutes, 10 | components::{Outlet, ParentRoute, Route}, 11 | path, 12 | }; 13 | 14 | #[component(transparent)] 15 | pub fn BadgeRoutes() -> impl MatchNestedRoutes + Clone { 16 | view! { 17 | 18 | 19 | 20 | 21 | 22 | 23 | } 24 | .into_inner() 25 | } 26 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/badge/badge.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::badge::Badge; 4 | 5 | #[component] 6 | pub fn BadgeDemo() -> impl IntoView { 7 | view! { 8 | {"Badge"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/badge/badge_destructive.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeDestructive() -> impl IntoView { 7 | view! { 8 | {"Destructive"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/badge/badge_outline.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeOutline() -> impl IntoView { 7 | view! { 8 | {"Outline"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/badge/badge_secondary.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[component] 6 | pub fn BadgeSecondary() -> impl IntoView { 7 | view! { 8 | {"Secondary"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod button; 3 | mod button_as_child; 4 | mod button_destructive; 5 | mod button_ghost; 6 | mod button_icon; 7 | mod button_link; 8 | mod button_loading; 9 | mod button_outline; 10 | mod button_secondary; 11 | mod button_with_icon; 12 | 13 | use leptos::prelude::*; 14 | use leptos_router::{ 15 | MatchNestedRoutes, 16 | components::{Outlet, ParentRoute, Route}, 17 | path, 18 | }; 19 | 20 | #[component(transparent)] 21 | pub fn ButtonRoutes() -> impl MatchNestedRoutes + Clone { 22 | view! { 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | } 36 | .into_inner() 37 | } 38 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::Button; 4 | 5 | #[component] 6 | pub fn ButtonDemo() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_as_child.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::{Button, ButtonChildProps}; 4 | 5 | #[component] 6 | pub fn ButtonAsChild() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_ghost.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonGhost() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_icon.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | // use radix_leptos_icons::ChevronRightIcon; 3 | 4 | use crate::new_york::components::ui::button::{Button, ButtonSize, ButtonVariant}; 5 | 6 | #[component] 7 | pub fn ButtonIcon() -> impl IntoView { 8 | view! { 9 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_link.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonLink() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_loading.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | // use radix_leptos_icons::ReloadIcon; 3 | 4 | use crate::new_york::components::ui::button::Button; 5 | 6 | #[component] 7 | pub fn ButtonLoading() -> impl IntoView { 8 | view! { 9 | 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_outline.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonOutline() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_secondary.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | 3 | use crate::new_york::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[component] 6 | pub fn ButtonSecondary() -> impl IntoView { 7 | view! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/button/button_with_icon.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | // use radix_leptos_icons::EnvelopeOpenIcon; 3 | 4 | use crate::new_york::components::ui::button::Button; 5 | 6 | #[component] 7 | pub fn ButtonWithIcon() -> impl IntoView { 8 | view! { 9 | 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/card.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod card; 3 | mod card_with_form; 4 | 5 | use leptos::prelude::*; 6 | use leptos_router::{ 7 | MatchNestedRoutes, 8 | components::{Outlet, ParentRoute, Route}, 9 | path, 10 | }; 11 | 12 | #[component(transparent)] 13 | pub fn CardRoutes() -> impl MatchNestedRoutes + Clone { 14 | view! { 15 | 16 | 17 | 18 | 19 | } 20 | .into_inner() 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/components.rs: -------------------------------------------------------------------------------- 1 | pub mod ui; 2 | -------------------------------------------------------------------------------- /book-examples/leptos/src/new_york/components/ui.rs: -------------------------------------------------------------------------------- 1 | // In actual projects this module would contain the copied components, but this example uses the local workspace packages. 2 | 3 | #[cfg(feature = "alert")] 4 | pub use shadcn_ui_leptos_alert::new_york as alert; 5 | #[cfg(feature = "badge")] 6 | pub use shadcn_ui_leptos_badge::new_york as badge; 7 | #[cfg(any(feature = "button", feature = "card"))] 8 | pub use shadcn_ui_leptos_button::new_york as button; 9 | #[cfg(feature = "card")] 10 | pub use shadcn_ui_leptos_card::new_york as card; 11 | -------------------------------------------------------------------------------- /book-examples/yew/Trunk.toml: -------------------------------------------------------------------------------- 1 | [[hooks]] 2 | stage = "pre_build" 3 | command = "sh" 4 | command_arguments = [ 5 | "-c", 6 | "npx tailwindcss -i style/tailwind.css -o style/tailwind.output.css", 7 | ] 8 | -------------------------------------------------------------------------------- /book-examples/yew/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /book-examples/yew/main.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('DOMContentLoaded', () => { 2 | const resizeObserver = new ResizeObserver(() => { 3 | if (window.top) { 4 | window.top.postMessage({ 5 | mdbookTrunk: { 6 | width: document.body.scrollWidth, 7 | height: document.body.scrollHeight 8 | } 9 | }); 10 | } 11 | }); 12 | resizeObserver.observe(document.body); 13 | }); 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/app.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | use yew_router::prelude::*; 3 | 4 | #[derive(Clone, PartialEq, Routable)] 5 | pub enum StyleRoute { 6 | #[at("/default")] 7 | DefaultRoot, 8 | #[at("/default/*")] 9 | Default, 10 | #[at("/new-york")] 11 | NewYorkRoot, 12 | #[at("/new-york/*")] 13 | NewYork, 14 | } 15 | 16 | fn render_style(route: StyleRoute) -> Html { 17 | match route { 18 | StyleRoute::DefaultRoot | StyleRoute::Default => crate::default::render(), 19 | StyleRoute::NewYorkRoot | StyleRoute::NewYork => crate::new_york::render(), 20 | } 21 | } 22 | 23 | #[function_component] 24 | pub fn App() -> Html { 25 | html! { 26 |
27 | 28 | render={render_style} /> 29 | 30 |
31 | } 32 | } 33 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/alert.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod alert; 3 | mod alert_destructive; 4 | 5 | use yew::prelude::*; 6 | use yew_router::prelude::*; 7 | 8 | #[derive(Clone, PartialEq, Routable)] 9 | pub enum AlertRoute { 10 | #[at("/default/")] 11 | Root, 12 | #[at("/default/destructive")] 13 | Destructive, 14 | } 15 | 16 | pub fn render(route: AlertRoute) -> Html { 17 | match route { 18 | AlertRoute::Root => html! { }, 19 | AlertRoute::Destructive => html! { }, 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/alert/alert.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::Terminal; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::alert::{Alert, AlertDescription, AlertTitle}; 5 | 6 | #[function_component] 7 | pub fn AlertDemo() -> Html { 8 | html! { 9 | 10 | 11 | {"Heads up!"} 12 | 13 | {"You can add components to your app using the cli."} 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/alert/alert_destructive.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::CircleAlert; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::alert::{Alert, AlertDescription, AlertTitle, AlertVariant}; 5 | 6 | #[function_component] 7 | pub fn AlertDestructive() -> Html { 8 | html! { 9 | 10 | 11 | {"Error"} 12 | 13 | {"Your session has expired. Please log in again."} 14 | 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/aspect_ratio.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod aspect_ratio; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum AspectRatioRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: AspectRatioRoute) -> Html { 14 | match route { 15 | AspectRatioRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/aspect_ratio/aspect_ratio.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::aspect_ratio::AspectRatio; 4 | 5 | #[function_component] 6 | pub fn AspectRatioDemo() -> Html { 7 | html! { 8 | 9 | Photo by Drew Beamer 14 | 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/avatar.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod avatar; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum AvatarRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: AvatarRoute) -> Html { 14 | match route { 15 | AvatarRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/avatar/avatar.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::avatar::{Avatar, AvatarFallback, AvatarImage}; 4 | 5 | #[function_component] 6 | pub fn AvatarDemo() -> Html { 7 | html! { 8 | 9 | 10 | {"CN"} 11 | 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/badge.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod badge; 3 | mod badge_destructive; 4 | mod badge_outline; 5 | mod badge_secondary; 6 | 7 | use yew::prelude::*; 8 | use yew_router::prelude::*; 9 | 10 | #[derive(Clone, PartialEq, Routable)] 11 | pub enum BadgeRoute { 12 | #[at("/default/")] 13 | Root, 14 | #[at("/default/destructive")] 15 | Destructive, 16 | #[at("/default/outline")] 17 | Outline, 18 | #[at("/default/secondary")] 19 | Secondary, 20 | } 21 | 22 | pub fn render(route: BadgeRoute) -> Html { 23 | match route { 24 | BadgeRoute::Root => html! { }, 25 | BadgeRoute::Destructive => html! { }, 26 | BadgeRoute::Outline => html! { }, 27 | BadgeRoute::Secondary => html! { }, 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/badge/badge.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::badge::Badge; 4 | 5 | #[function_component] 6 | pub fn BadgeDemo() -> Html { 7 | html! { 8 | {"Badge"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/badge/badge_destructive.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[function_component] 6 | pub fn BadgeDestructive() -> Html { 7 | html! { 8 | {"Destructive"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/badge/badge_outline.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[function_component] 6 | pub fn BadgeOutline() -> Html { 7 | html! { 8 | {"Outline"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/badge/badge_secondary.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::badge::{Badge, BadgeVariant}; 4 | 5 | #[function_component] 6 | pub fn BadgeSecondary() -> Html { 7 | html! { 8 | {"Secondary"} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod breadcrumb; 3 | mod breadcrumb_dropdown; 4 | mod breadcrumb_ellipsis; 5 | mod breadcrumb_link; 6 | mod breadcrumb_responsive; 7 | mod breadcrumb_separator; 8 | 9 | use yew::prelude::*; 10 | use yew_router::prelude::*; 11 | 12 | #[derive(Clone, PartialEq, Routable)] 13 | pub enum BreadcrumbRoute { 14 | #[at("/default/")] 15 | Root, 16 | #[at("/default/dropdown")] 17 | Dropdown, 18 | #[at("/default/ellipsis")] 19 | Ellipsis, 20 | #[at("/default/link")] 21 | Link, 22 | #[at("/default/responsive")] 23 | Responsive, 24 | #[at("/default/separator")] 25 | Separator, 26 | } 27 | 28 | pub fn render(route: BreadcrumbRoute) -> Html { 29 | match route { 30 | BreadcrumbRoute::Root => html! { }, 31 | BreadcrumbRoute::Dropdown => html! { }, 32 | BreadcrumbRoute::Ellipsis => html! { }, 33 | BreadcrumbRoute::Link => html! { }, 34 | BreadcrumbRoute::Responsive => html! { }, 35 | BreadcrumbRoute::Separator => html! { }, 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb/breadcrumb_dropdown.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::{ChevronDown, Slash}; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::breadcrumb::{ 5 | Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, 6 | }; 7 | 8 | #[function_component] 9 | pub fn BreadcrumbDropdown() -> Html { 10 | html! { 11 | 12 | 13 | 14 | {"Home"} 15 | 16 | 17 | 18 | 19 | 20 | // TODO 21 | // 22 | // 23 | // {"Components"} 24 | // 25 | // 26 | // 27 | // {"Documentation"} 28 | // {"Themes"} 29 | // {"GitHub"} 30 | // 31 | // 32 | {"Components"} 33 | 34 | 35 | 36 | 37 | 38 | 39 | {"Breadcrumb"} 40 | 41 | 42 | 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb/breadcrumb_ellipsis.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | use yew_router::prelude::*; 3 | 4 | use crate::default::components::ui::breadcrumb::{ 5 | Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbLinkChildProps, 6 | BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, 7 | }; 8 | 9 | #[derive(Clone, PartialEq, Routable)] 10 | enum Route { 11 | #[at("/")] 12 | Home, 13 | #[at("/docs/components")] 14 | Components, 15 | } 16 | 17 | #[function_component] 18 | pub fn BreadcrumbEllipsisDemo() -> Html { 19 | html! { 20 | 21 | 22 | 23 | classes={classes!(class)} to={Route::Home}>{"Home"}> 26 | })} 27 | /> 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | classes={classes!(class)} to={Route::Home}>{"Components"}> 38 | })} 39 | /> 40 | 41 | 42 | 43 | {"Breadcrumb"} 44 | 45 | 46 | 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb/breadcrumb_link.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | use yew_router::prelude::*; 3 | 4 | use crate::default::components::ui::breadcrumb::{ 5 | Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbLinkChildProps, BreadcrumbList, 6 | BreadcrumbPage, BreadcrumbSeparator, 7 | }; 8 | 9 | #[derive(Clone, PartialEq, Routable)] 10 | enum Route { 11 | #[at("/")] 12 | Home, 13 | #[at("/components")] 14 | Components, 15 | } 16 | 17 | #[function_component] 18 | pub fn BreadcrumbLinkDemo() -> Html { 19 | html! { 20 | 21 | 22 | 23 | classes={classes!(class)} to={Route::Home}>{"Home"}> 26 | })} 27 | /> 28 | 29 | 30 | 31 | classes={classes!(class)} to={Route::Home}>{"Components"}> 34 | })} 35 | /> 36 | 37 | 38 | 39 | {"Breadcrumb"} 40 | 41 | 42 | 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb/breadcrumb_responsive.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | // use crate::default::components::ui::breadcrumb::{ 4 | // Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, 5 | // BreadcrumbSeparator, 6 | // }; 7 | 8 | #[function_component] 9 | pub fn BreadcrumbResponsive() -> Html { 10 | html! { 11 | // TODO 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/breadcrumb/breadcrumb_separator.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::Slash; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::breadcrumb::{ 5 | Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, 6 | }; 7 | 8 | #[function_component] 9 | pub fn BreadcrumbSeparatorDemo() -> Html { 10 | html! { 11 | 12 | 13 | 14 | {"Home"} 15 | 16 | 17 | 18 | 19 | 20 | {"Components"} 21 | 22 | 23 | 24 | 25 | 26 | {"Breadcrumb"} 27 | 28 | 29 | 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod button; 3 | mod button_as_child; 4 | mod button_destructive; 5 | mod button_ghost; 6 | mod button_icon; 7 | mod button_link; 8 | mod button_loading; 9 | mod button_outline; 10 | mod button_secondary; 11 | mod button_with_icon; 12 | 13 | use yew::prelude::*; 14 | use yew_router::prelude::*; 15 | 16 | #[derive(Clone, PartialEq, Routable)] 17 | pub enum ButtonRoute { 18 | #[at("/default/")] 19 | Root, 20 | #[at("/default/as-child")] 21 | AsChild, 22 | #[at("/default/destructive")] 23 | Destructive, 24 | #[at("/default/ghost")] 25 | Ghost, 26 | #[at("/default/icon")] 27 | Icon, 28 | #[at("/default/link")] 29 | Link, 30 | #[at("/default/loading")] 31 | Loading, 32 | #[at("/default/outline")] 33 | Outline, 34 | #[at("/default/secondary")] 35 | Secondary, 36 | #[at("/default/with-icon")] 37 | WithIcon, 38 | } 39 | 40 | pub fn render(route: ButtonRoute) -> Html { 41 | match route { 42 | ButtonRoute::Root => html! { }, 43 | ButtonRoute::AsChild => html! { }, 44 | ButtonRoute::Destructive => html! { }, 45 | ButtonRoute::Ghost => html! { }, 46 | ButtonRoute::Icon => html! { }, 47 | ButtonRoute::Link => html! { }, 48 | ButtonRoute::Loading => html! { }, 49 | ButtonRoute::Outline => html! { }, 50 | ButtonRoute::Secondary => html! { }, 51 | ButtonRoute::WithIcon => html! { }, 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::Button; 4 | 5 | #[function_component] 6 | pub fn ButtonDemo() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_as_child.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonChildProps}; 4 | 5 | #[function_component] 6 | pub fn ButtonAsChild() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_ghost.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[function_component] 6 | pub fn ButtonGhost() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_icon.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::ChevronRight; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::button::{Button, ButtonSize, ButtonVariant}; 5 | 6 | #[function_component] 7 | pub fn ButtonIcon() -> Html { 8 | html! { 9 | 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_link.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[function_component] 6 | pub fn ButtonLink() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_loading.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::LoaderCircle; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::button::Button; 5 | 6 | #[function_component] 7 | pub fn ButtonLoading() -> Html { 8 | html! { 9 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_outline.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[function_component] 6 | pub fn ButtonOutline() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_secondary.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::button::{Button, ButtonVariant}; 4 | 5 | #[function_component] 6 | pub fn ButtonSecondary() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/button/button_with_icon.rs: -------------------------------------------------------------------------------- 1 | use lucide_yew::Mail; 2 | use yew::prelude::*; 3 | 4 | use crate::default::components::ui::button::Button; 5 | 6 | #[function_component] 7 | pub fn ButtonWithIcon() -> Html { 8 | html! { 9 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/card.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod card; 3 | mod card_with_form; 4 | 5 | use yew::prelude::*; 6 | use yew_router::prelude::*; 7 | 8 | #[derive(Clone, PartialEq, Routable)] 9 | pub enum CardRoute { 10 | #[at("/default/")] 11 | Root, 12 | #[at("/default/with-form")] 13 | WithForm, 14 | } 15 | 16 | pub fn render(route: CardRoute) -> Html { 17 | match route { 18 | CardRoute::Root => html! { }, 19 | CardRoute::WithForm => html! { }, 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/components.rs: -------------------------------------------------------------------------------- 1 | pub mod ui; 2 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/components/ui.rs: -------------------------------------------------------------------------------- 1 | // In actual projects this module would contain the copied components, but this example uses the local workspace packages. 2 | 3 | #[cfg(feature = "alert")] 4 | pub use shadcn_ui_yew_alert::default as alert; 5 | #[cfg(feature = "aspect-ratio")] 6 | pub use shadcn_ui_yew_aspect_ratio::default as aspect_ratio; 7 | #[cfg(feature = "avatar")] 8 | pub use shadcn_ui_yew_avatar::default as avatar; 9 | #[cfg(feature = "badge")] 10 | pub use shadcn_ui_yew_badge::default as badge; 11 | #[cfg(feature = "breadcrumb")] 12 | pub use shadcn_ui_yew_breadcrumb::default as breadcrumb; 13 | #[cfg(any( 14 | feature = "button", 15 | feature = "card", 16 | feature = "input", 17 | feature = "textarea" 18 | ))] 19 | pub use shadcn_ui_yew_button::default as button; 20 | #[cfg(feature = "card")] 21 | pub use shadcn_ui_yew_card::default as card; 22 | #[cfg(any(feature = "input", feature = "card"))] 23 | pub use shadcn_ui_yew_input::default as input; 24 | #[cfg(any( 25 | feature = "label", 26 | feature = "card", 27 | feature = "input", 28 | feature = "switch", 29 | feature = "textarea" 30 | ))] 31 | pub use shadcn_ui_yew_label::default as label; 32 | #[cfg(feature = "pagination")] 33 | pub use shadcn_ui_yew_pagination::default as pagination; 34 | #[cfg(feature = "separator")] 35 | pub use shadcn_ui_yew_separator::default as separator; 36 | #[cfg(feature = "skeleton")] 37 | pub use shadcn_ui_yew_skeleton::default as skeleton; 38 | #[cfg(any(feature = "switch", feature = "card"))] 39 | pub use shadcn_ui_yew_switch::default as switch; 40 | #[cfg(feature = "table")] 41 | pub use shadcn_ui_yew_table::default as table; 42 | #[cfg(feature = "textarea")] 43 | pub use shadcn_ui_yew_textarea::default as textarea; 44 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod input; 3 | mod input_disabled; 4 | mod input_file; 5 | mod input_form; 6 | mod input_with_button; 7 | mod input_with_label; 8 | mod input_with_text; 9 | 10 | use yew::prelude::*; 11 | use yew_router::prelude::*; 12 | 13 | #[derive(Clone, PartialEq, Routable)] 14 | pub enum InputRoute { 15 | #[at("/default/")] 16 | Root, 17 | #[at("/default/disabled")] 18 | Disabled, 19 | #[at("/default/file")] 20 | File, 21 | #[at("/default/form")] 22 | Form, 23 | #[at("/default/with-button")] 24 | WithButton, 25 | #[at("/default/with-label")] 26 | WithLabel, 27 | #[at("/default/with-text")] 28 | WithText, 29 | } 30 | 31 | pub fn render(route: InputRoute) -> Html { 32 | match route { 33 | InputRoute::Root => html! { }, 34 | InputRoute::Disabled => html! { }, 35 | InputRoute::File => html! { }, 36 | InputRoute::Form => html! { }, 37 | InputRoute::WithButton => html! { }, 38 | InputRoute::WithLabel => html! { }, 39 | InputRoute::WithText => html! { }, 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::input::Input; 4 | 5 | #[function_component] 6 | pub fn InputDemo() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_disabled.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::input::Input; 4 | 5 | #[function_component] 6 | pub fn InputDisabled() -> Html { 7 | html! { 8 | 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_file.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::{input::Input, label::Label}; 4 | 5 | #[function_component] 6 | pub fn InputFile() -> Html { 7 | html! { 8 |
9 | 10 | 11 |
12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_form.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | // use crate::default::components::ui::input::Input; 4 | 5 | #[function_component] 6 | pub fn InputForm() -> Html { 7 | html! { 8 | // TODO 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_with_button.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::{button::Button, input::Input}; 4 | 5 | #[function_component] 6 | pub fn InputWithButton() -> Html { 7 | html! { 8 |
9 | 10 | 11 |
12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_with_label.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::{input::Input, label::Label}; 4 | 5 | #[function_component] 6 | pub fn InputWithLabel() -> Html { 7 | html! { 8 |
9 | 10 | 11 |
12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/input/input_with_text.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::{input::Input, label::Label}; 4 | 5 | #[function_component] 6 | pub fn InputWithText() -> Html { 7 | html! { 8 |
9 | 10 | 11 |

{"Enter your email address."}

12 |
13 | } 14 | } 15 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/label.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod label; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum LabelRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: LabelRoute) -> Html { 14 | match route { 15 | LabelRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/label/label.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::label::Label; 4 | 5 | #[function_component] 6 | pub fn LabelDemo() -> Html { 7 | html! { 8 |
9 |
10 | // TODO 11 | // 12 | 13 |
14 |
15 | } 16 | } 17 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/pagination.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod pagination; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum PaginationRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: PaginationRoute) -> Html { 14 | match route { 15 | PaginationRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/pagination/pagination.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::pagination::{ 4 | Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, 5 | PaginationNext, PaginationPrevious, 6 | }; 7 | 8 | #[function_component] 9 | pub fn PaginationDemo() -> Html { 10 | html! { 11 | 12 | 13 | 14 | 15 | 16 | 17 | {"1"} 18 | 19 | 20 | 21 | {"2"} 22 | 23 | 24 | 25 | {"3"} 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/separator.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod separator; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum SeparatorRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: SeparatorRoute) -> Html { 14 | match route { 15 | SeparatorRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/separator/separator.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::separator::{Orientation, Separator}; 4 | 5 | #[function_component] 6 | pub fn SeparatorDemo() -> Html { 7 | html! { 8 |
9 |
10 |

{"Radix Primitives"}

11 |

12 | {"An open-source UI component library."} 13 |

14 |
15 | 16 |
17 |
{"Blog"}
18 | 19 |
{"Docs"}
20 | 21 |
{"Source"}
22 |
23 |
24 | } 25 | } 26 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/skeleton.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod skeleton; 3 | mod skeleton_card; 4 | 5 | use yew::prelude::*; 6 | use yew_router::prelude::*; 7 | 8 | #[derive(Clone, PartialEq, Routable)] 9 | pub enum SkeletonRoute { 10 | #[at("/default/")] 11 | Root, 12 | #[at("/default/card")] 13 | Card, 14 | } 15 | 16 | pub fn render(route: SkeletonRoute) -> Html { 17 | match route { 18 | SkeletonRoute::Root => html! { }, 19 | SkeletonRoute::Card => html! { }, 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/skeleton/skeleton.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::skeleton::Skeleton; 4 | 5 | #[function_component] 6 | pub fn SkeletonDemo() -> Html { 7 | html! { 8 |
9 | 10 |
11 | 12 | 13 |
14 |
15 | } 16 | } 17 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/skeleton/skeleton_card.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::skeleton::Skeleton; 4 | 5 | #[function_component] 6 | pub fn SkeletonCard() -> Html { 7 | html! { 8 |
9 | 10 |
11 | 12 | 13 |
14 |
15 | } 16 | } 17 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/switch.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod switch; 3 | mod switch_form; 4 | 5 | use yew::prelude::*; 6 | use yew_router::prelude::*; 7 | 8 | #[derive(Clone, PartialEq, Routable)] 9 | pub enum SwitchRoute { 10 | #[at("/default/")] 11 | Root, 12 | #[at("/default/form")] 13 | Form, 14 | } 15 | 16 | pub fn render(route: SwitchRoute) -> Html { 17 | match route { 18 | SwitchRoute::Root => html! { }, 19 | SwitchRoute::Form => html! { }, 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/switch/switch.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::{label::Label, switch::Switch}; 4 | 5 | #[function_component] 6 | pub fn SwitchDemo() -> Html { 7 | html! { 8 |
9 | 10 | 11 |
12 | } 13 | } 14 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/switch/switch_form.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | // use crate::default::components::ui::switch::Switch; 4 | 5 | #[function_component] 6 | pub fn SwitchForm() -> Html { 7 | html! { 8 | // TODO 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/table.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod table; 3 | 4 | use yew::prelude::*; 5 | use yew_router::prelude::*; 6 | 7 | #[derive(Clone, PartialEq, Routable)] 8 | pub enum TableRoute { 9 | #[at("/default/")] 10 | Root, 11 | } 12 | 13 | pub fn render(route: TableRoute) -> Html { 14 | match route { 15 | TableRoute::Root => html! { }, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/textarea.rs: -------------------------------------------------------------------------------- 1 | #[allow(clippy::module_inception)] 2 | mod textarea; 3 | mod textarea_disabled; 4 | mod textarea_form; 5 | mod textarea_with_button; 6 | mod textarea_with_label; 7 | mod textarea_with_text; 8 | 9 | use yew::prelude::*; 10 | use yew_router::prelude::*; 11 | 12 | #[derive(Clone, PartialEq, Routable)] 13 | pub enum TextareaRoute { 14 | #[at("/default/")] 15 | Root, 16 | #[at("/default/disabled")] 17 | Disabled, 18 | #[at("/default/form")] 19 | Form, 20 | #[at("/default/with-button")] 21 | WithButton, 22 | #[at("/default/with-label")] 23 | WithLabel, 24 | #[at("/default/with-text")] 25 | WithText, 26 | } 27 | 28 | pub fn render(route: TextareaRoute) -> Html { 29 | match route { 30 | TextareaRoute::Root => html! { }, 31 | TextareaRoute::Disabled => html! { }, 32 | TextareaRoute::Form => html! { }, 33 | TextareaRoute::WithButton => html! { }, 34 | TextareaRoute::WithLabel => html! { }, 35 | TextareaRoute::WithText => html! { }, 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /book-examples/yew/src/default/textarea/textarea.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use crate::default::components::ui::textarea::Textarea; 4 | 5 | #[function_component] 6 | pub fn TextareaDemo() -> Html { 7 | html! { 8 |