mirror of
https://github.com/cloud-shuttle/leptos-shadcn-ui.git
synced 2026-01-05 20:42:55 +00:00
Restructure as single main package: leptos-shadcn-ui with all 25 components
This commit is contained in:
Peter Hanssens
579
Cargo.lock
generated
579
Cargo.lock
generated
File diff suppressed because it is too large
Load Diff
@@ -12,6 +12,7 @@
|
||||
[workspace]
|
||||
resolver = "2"
|
||||
members = [
|
||||
"packages/leptos-shadcn-ui",
|
||||
"packages/leptos/accordion",
|
||||
"packages/leptos/alert",
|
||||
"packages/leptos/alert-dialog",
|
||||
|
||||
53
README.md
53
README.md
@@ -28,8 +28,8 @@ A comprehensive collection of beautiful, accessible UI components built for [Lep
|
||||
|
||||
## 📦 Available Components
|
||||
|
||||
### ✅ **Ready for Release (25 Components)**
|
||||
These components are fully tested and ready for production use:
|
||||
### ✅ **All 25 Components Ready for Release!**
|
||||
The main `leptos-shadcn-ui` package contains all these components and is ready for production use:
|
||||
|
||||
#### **Form Components**
|
||||
- **Button** - Multiple variants (default, destructive, outline, secondary, ghost, link) and sizes
|
||||
@@ -65,11 +65,11 @@ These components are fully tested and ready for production use:
|
||||
- **Slider** - Range slider input
|
||||
- **Toggle** - Toggle button component
|
||||
|
||||
### 🚧 **In Development (27 Components)**
|
||||
These components are being updated for Leptos 0.8 compatibility:
|
||||
### 🚧 **Future Components (27 More)**
|
||||
Advanced components are being updated for Leptos 0.8 compatibility and will be added to future releases:
|
||||
- Form, Combobox, Command, Input OTP, Breadcrumb, Navigation Menu, Context Menu, Dropdown Menu, Menubar, Scroll Area, Aspect Ratio, Collapsible, Sheet, Drawer, Hover Card, Alert Dialog, Carousel, and more...
|
||||
|
||||
**Note**: We're releasing the stable components first to get them into users' hands immediately, while continuing development on the advanced components.
|
||||
**Note**: All 25 current components are fully tested and working with Leptos v0.8.8!
|
||||
|
||||
## 🙏 Acknowledgments
|
||||
|
||||
@@ -95,25 +95,48 @@ leptos = "0.8.0" # Must be 0.8.0 or higher
|
||||
leptos_router = "0.8.0" # Must be 0.8.0 or higher
|
||||
```
|
||||
|
||||
### 2. Add Components to your `Cargo.toml`
|
||||
### 2. Add the Main Package to your `Cargo.toml`
|
||||
|
||||
```toml
|
||||
[dependencies]
|
||||
leptos-shadcn-button = { path = "path/to/leptos-shadcn-ui/packages/leptos/button" }
|
||||
leptos-shadcn-input = { path = "path/to/leptos-shadcn-ui/packages/leptos/input" }
|
||||
leptos-shadcn-card = { path = "path/to/leptos-shadcn-ui/packages/leptos/card" }
|
||||
leptos-shadcn-alert = { path = "path/to/leptos-shadcn-ui/packages/leptos/alert" }
|
||||
leptos-shadcn-label = { path = "path/to/leptos-shadcn-ui/packages/leptos/label" }
|
||||
leptos-shadcn-separator = { path = "path/to/leptos-shadcn-ui/packages/leptos/separator" }
|
||||
leptos-shadcn-ui = { path = "path/to/leptos-shadcn-ui/packages/leptos-shadcn-ui" }
|
||||
```
|
||||
|
||||
**Or from crates.io (after release):**
|
||||
```toml
|
||||
[dependencies]
|
||||
leptos-shadcn-ui = "0.1.0"
|
||||
```
|
||||
|
||||
### 3. Choose Your Components
|
||||
|
||||
**All Components (Default):**
|
||||
```toml
|
||||
leptos-shadcn-ui = "0.1.0"
|
||||
# or
|
||||
leptos-shadcn-ui = { version = "0.1.0", features = ["all-components"] }
|
||||
```
|
||||
|
||||
**Specific Components Only:**
|
||||
```toml
|
||||
leptos-shadcn-ui = { version = "0.1.0", features = ["button", "input", "card"] }
|
||||
```
|
||||
|
||||
**Available Features:**
|
||||
- `button`, `input`, `label`, `checkbox`, `switch`, `radio-group`, `select`, `textarea`
|
||||
- `card`, `separator`, `tabs`, `accordion`, `dialog`, `popover`, `tooltip`
|
||||
- `alert`, `badge`, `skeleton`, `progress`, `toast`, `table`, `calendar`, `date-picker`, `pagination`
|
||||
- `slider`, `toggle`
|
||||
|
||||
### 2. Import and use in your Leptos components
|
||||
|
||||
```rust
|
||||
use leptos::*;
|
||||
use leptos_shadcn_button::{Button, ButtonVariant, ButtonSize};
|
||||
use leptos_shadcn_input::Input;
|
||||
use leptos_shadcn_card::{Card, CardHeader, CardTitle, CardContent};
|
||||
use leptos_shadcn_ui::{Button, ButtonVariant, ButtonSize, Input, Card, CardHeader, CardTitle, CardContent};
|
||||
|
||||
// Or use the prelude for common components:
|
||||
// use leptos_shadcn_ui::prelude::*;
|
||||
```
|
||||
|
||||
#[component]
|
||||
pub fn MyComponent() -> impl IntoView {
|
||||
|
||||
87
packages/leptos-shadcn-ui/Cargo.toml
Normal file
87
packages/leptos-shadcn-ui/Cargo.toml
Normal file
@@ -0,0 +1,87 @@
|
||||
[package]
|
||||
name = "leptos-shadcn-ui"
|
||||
version = "0.1.0"
|
||||
edition = "2021"
|
||||
description = "A comprehensive collection of beautiful, accessible UI components built for Leptos v0.8+, inspired by shadcn/ui"
|
||||
homepage = "https://github.com/cloud-shuttle/leptos-shadcn-ui"
|
||||
repository = "https://github.com/cloud-shuttle/leptos-shadcn-ui"
|
||||
license = "MIT"
|
||||
authors = ["CloudShuttle <info@cloudshuttle.com>"]
|
||||
keywords = ["leptos", "ui", "components", "shadcn", "web", "wasm", "rust"]
|
||||
categories = ["wasm", "gui", "web-programming"]
|
||||
readme = "README.md"
|
||||
|
||||
[dependencies]
|
||||
# Core Leptos dependencies
|
||||
leptos = "0.8"
|
||||
leptos_router = "0.8"
|
||||
leptos-node-ref = "0.2"
|
||||
leptos-struct-component = "0.2"
|
||||
leptos-style = "0.2"
|
||||
|
||||
# Individual component packages (internal workspace dependencies)
|
||||
leptos-shadcn-button = { path = "../leptos/button", optional = true }
|
||||
leptos-shadcn-input = { path = "../leptos/input", optional = true }
|
||||
leptos-shadcn-label = { path = "../leptos/label", optional = true }
|
||||
leptos-shadcn-checkbox = { path = "../leptos/checkbox", optional = true }
|
||||
leptos-shadcn-switch = { path = "../leptos/switch", optional = true }
|
||||
leptos-shadcn-radio-group = { path = "../leptos/radio-group", optional = true }
|
||||
leptos-shadcn-select = { path = "../leptos/select", optional = true }
|
||||
leptos-shadcn-textarea = { path = "../leptos/textarea", optional = true }
|
||||
leptos-shadcn-card = { path = "../leptos/card", optional = true }
|
||||
leptos-shadcn-separator = { path = "../leptos/separator", optional = true }
|
||||
leptos-shadcn-tabs = { path = "../leptos/tabs", optional = true }
|
||||
leptos-shadcn-accordion = { path = "../leptos/accordion", optional = true }
|
||||
leptos-shadcn-dialog = { path = "../leptos/dialog", optional = true }
|
||||
leptos-shadcn-popover = { path = "../leptos/popover", optional = true }
|
||||
leptos-shadcn-tooltip = { path = "../leptos/tooltip", optional = true }
|
||||
leptos-shadcn-alert = { path = "../leptos/alert", optional = true }
|
||||
leptos-shadcn-badge = { path = "../leptos/badge", optional = true }
|
||||
leptos-shadcn-skeleton = { path = "../leptos/skeleton", optional = true }
|
||||
leptos-shadcn-progress = { path = "../leptos/progress", optional = true }
|
||||
leptos-shadcn-toast = { path = "../leptos/toast", optional = true }
|
||||
leptos-shadcn-table = { path = "../leptos/table", optional = true }
|
||||
leptos-shadcn-calendar = { path = "../leptos/calendar", optional = true }
|
||||
leptos-shadcn-date-picker = { path = "../leptos/date-picker", optional = true }
|
||||
leptos-shadcn-pagination = { path = "../leptos/pagination", optional = true }
|
||||
leptos-shadcn-slider = { path = "../leptos/slider", optional = true }
|
||||
leptos-shadcn-toggle = { path = "../leptos/toggle", optional = true }
|
||||
|
||||
# Additional dependencies
|
||||
tailwind_fuse = "0.3"
|
||||
lucide-leptos = "0.1"
|
||||
gloo-timers = "0.3"
|
||||
|
||||
[features]
|
||||
default = ["all-components"]
|
||||
all-components = []
|
||||
button = ["leptos-shadcn-button"]
|
||||
input = ["leptos-shadcn-input"]
|
||||
label = ["leptos-shadcn-label"]
|
||||
checkbox = ["leptos-shadcn-checkbox"]
|
||||
switch = ["leptos-shadcn-switch"]
|
||||
radio-group = ["leptos-shadcn-radio-group"]
|
||||
select = ["leptos-shadcn-select"]
|
||||
textarea = ["leptos-shadcn-textarea"]
|
||||
card = ["leptos-shadcn-card"]
|
||||
separator = ["leptos-shadcn-separator"]
|
||||
tabs = ["leptos-shadcn-tabs"]
|
||||
accordion = ["leptos-shadcn-accordion"]
|
||||
dialog = ["leptos-shadcn-dialog"]
|
||||
popover = ["leptos-shadcn-popover"]
|
||||
tooltip = ["leptos-shadcn-tooltip"]
|
||||
alert = ["leptos-shadcn-alert"]
|
||||
badge = ["leptos-shadcn-badge"]
|
||||
skeleton = ["leptos-shadcn-skeleton"]
|
||||
progress = ["leptos-shadcn-progress"]
|
||||
toast = ["leptos-shadcn-toast"]
|
||||
table = ["leptos-shadcn-table"]
|
||||
calendar = ["leptos-shadcn-calendar"]
|
||||
date-picker = ["leptos-shadcn-date-picker"]
|
||||
pagination = ["leptos-shadcn-pagination"]
|
||||
slider = ["leptos-shadcn-slider"]
|
||||
toggle = ["leptos-shadcn-toggle"]
|
||||
|
||||
[lib]
|
||||
name = "leptos_shadcn_ui"
|
||||
path = "src/lib.rs"
|
||||
187
packages/leptos-shadcn-ui/src/lib.rs
Normal file
187
packages/leptos-shadcn-ui/src/lib.rs
Normal file
@@ -0,0 +1,187 @@
|
||||
//! # Leptos ShadCN UI
|
||||
//!
|
||||
//! A comprehensive collection of beautiful, accessible UI components built for [Leptos](https://leptos.dev/) v0.8+,
|
||||
//! inspired by [shadcn/ui](https://ui.shadcn.com/).
|
||||
//!
|
||||
//! ## Features
|
||||
//!
|
||||
//! - **25+ Components**: Button, Input, Card, Alert, and many more
|
||||
//! - **Leptos 0.8+**: Built specifically for Leptos v0.8+ compatibility
|
||||
//! - **Accessibility First**: All components follow accessibility best practices
|
||||
//! - **Tailwind CSS**: Seamless integration with Tailwind CSS
|
||||
//! - **Type Safety**: Full Rust type safety with proper error handling
|
||||
//!
|
||||
//! ## Usage
|
||||
//!
|
||||
//! ```rust
|
||||
//! use leptos::*;
|
||||
//! use leptos_shadcn_ui::{Button, Input, Card, Alert};
|
||||
//!
|
||||
//! #[component]
|
||||
//! pub fn MyComponent() -> impl IntoView {
|
||||
//! view! {
|
||||
//! <Card>
|
||||
//! <CardHeader>
|
||||
//! <CardTitle>"Welcome"</CardTitle>
|
||||
//! </CardHeader>
|
||||
//! <CardContent>
|
||||
//! <div class="space-y-4">
|
||||
//! <Input placeholder="Enter your name" />
|
||||
//! <Button variant=ButtonVariant::Default>"Submit"</Button>
|
||||
//! </div>
|
||||
//! </CardContent>
|
||||
//! </Card>
|
||||
//! }
|
||||
//! }
|
||||
//! ```
|
||||
//!
|
||||
//! ## Components
|
||||
//!
|
||||
//! ### Form Components
|
||||
//! - Button, Input, Label, Checkbox, Switch, Radio Group, Select, Textarea
|
||||
//!
|
||||
//! ### Layout Components
|
||||
//! - Card, Separator, Tabs, Accordion, Dialog, Popover, Tooltip
|
||||
//!
|
||||
//! ### Feedback & Status
|
||||
//! - Alert, Badge, Skeleton, Progress, Toast, Table, Calendar, Date Picker, Pagination
|
||||
//!
|
||||
//! ### Interactive Components
|
||||
//! - Slider, Toggle
|
||||
//!
|
||||
//! ## License
|
||||
//!
|
||||
//! MIT License - see the [LICENSE](../LICENSE) file for details.
|
||||
|
||||
// Re-export all components (conditionally based on features)
|
||||
#[cfg(feature = "button")]
|
||||
pub use leptos_shadcn_button::default::*;
|
||||
#[cfg(feature = "input")]
|
||||
pub use leptos_shadcn_input::default::*;
|
||||
#[cfg(feature = "label")]
|
||||
pub use leptos_shadcn_label::default::*;
|
||||
#[cfg(feature = "checkbox")]
|
||||
pub use leptos_shadcn_checkbox::default::*;
|
||||
#[cfg(feature = "switch")]
|
||||
pub use leptos_shadcn_switch::default::*;
|
||||
#[cfg(feature = "radio-group")]
|
||||
pub use leptos_shadcn_radio_group::default::*;
|
||||
#[cfg(feature = "select")]
|
||||
pub use leptos_shadcn_select::default::*;
|
||||
#[cfg(feature = "textarea")]
|
||||
pub use leptos_shadcn_textarea::default::*;
|
||||
#[cfg(feature = "card")]
|
||||
pub use leptos_shadcn_card::default::*;
|
||||
#[cfg(feature = "separator")]
|
||||
pub use leptos_shadcn_separator::default::*;
|
||||
#[cfg(feature = "tabs")]
|
||||
pub use leptos_shadcn_tabs::default::*;
|
||||
#[cfg(feature = "accordion")]
|
||||
pub use leptos_shadcn_accordion::default::*;
|
||||
#[cfg(feature = "dialog")]
|
||||
pub use leptos_shadcn_dialog::default::*;
|
||||
#[cfg(feature = "popover")]
|
||||
pub use leptos_shadcn_popover::default::*;
|
||||
#[cfg(feature = "tooltip")]
|
||||
pub use leptos_shadcn_tooltip::default::*;
|
||||
#[cfg(feature = "alert")]
|
||||
pub use leptos_shadcn_alert::default::*;
|
||||
#[cfg(feature = "badge")]
|
||||
pub use leptos_shadcn_badge::default::*;
|
||||
#[cfg(feature = "skeleton")]
|
||||
pub use leptos_shadcn_skeleton::default::*;
|
||||
#[cfg(feature = "progress")]
|
||||
pub use leptos_shadcn_progress::default::*;
|
||||
#[cfg(feature = "toast")]
|
||||
pub use leptos_shadcn_toast::default::*;
|
||||
#[cfg(feature = "table")]
|
||||
pub use leptos_shadcn_table::default::*;
|
||||
#[cfg(feature = "calendar")]
|
||||
pub use leptos_shadcn_calendar::default::*;
|
||||
#[cfg(feature = "date-picker")]
|
||||
pub use leptos_shadcn_date_picker::default::*;
|
||||
#[cfg(feature = "pagination")]
|
||||
pub use leptos_shadcn_pagination::default::*;
|
||||
#[cfg(feature = "slider")]
|
||||
pub use leptos_shadcn_slider::default::*;
|
||||
#[cfg(feature = "toggle")]
|
||||
pub use leptos_shadcn_toggle::default::*;
|
||||
|
||||
// Re-export common types and utilities
|
||||
pub use tailwind_fuse::tw_merge;
|
||||
pub use lucide_leptos::*;
|
||||
|
||||
// Module documentation
|
||||
#[cfg(feature = "all-components")]
|
||||
pub mod prelude {
|
||||
//! # Leptos ShadCN UI Prelude
|
||||
//!
|
||||
//! This module re-exports the most commonly used components and types.
|
||||
//!
|
||||
//! ```rust
|
||||
//! use leptos_shadcn_ui::prelude::*;
|
||||
//! ```
|
||||
|
||||
// Form components
|
||||
#[cfg(feature = "button")]
|
||||
pub use super::{Button, ButtonVariant, ButtonSize};
|
||||
#[cfg(feature = "input")]
|
||||
pub use super::{Input, InputProps};
|
||||
#[cfg(feature = "label")]
|
||||
pub use super::{Label, LabelProps};
|
||||
#[cfg(feature = "checkbox")]
|
||||
pub use super::{Checkbox, CheckboxProps};
|
||||
#[cfg(feature = "switch")]
|
||||
pub use super::{Switch, SwitchProps};
|
||||
#[cfg(feature = "radio-group")]
|
||||
pub use super::{RadioGroup, RadioGroupProps};
|
||||
#[cfg(feature = "select")]
|
||||
pub use super::{Select, SelectProps};
|
||||
#[cfg(feature = "textarea")]
|
||||
pub use super::{Textarea, TextareaProps};
|
||||
|
||||
// Layout components
|
||||
#[cfg(feature = "card")]
|
||||
pub use super::{Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter};
|
||||
#[cfg(feature = "separator")]
|
||||
pub use super::{Separator, SeparatorProps};
|
||||
#[cfg(feature = "tabs")]
|
||||
pub use super::{Tabs, TabsList, TabsTrigger, TabsContent};
|
||||
#[cfg(feature = "accordion")]
|
||||
pub use super::{Accordion, AccordionItem, AccordionTrigger, AccordionContent};
|
||||
#[cfg(feature = "dialog")]
|
||||
pub use super::{Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter};
|
||||
#[cfg(feature = "popover")]
|
||||
pub use super::{Popover, PopoverTrigger, PopoverContent};
|
||||
#[cfg(feature = "tooltip")]
|
||||
pub use super::{Tooltip, TooltipContent, TooltipTrigger, TooltipProvider};
|
||||
|
||||
// Feedback components
|
||||
#[cfg(feature = "alert")]
|
||||
pub use super::{Alert, AlertTitle, AlertDescription, AlertVariant};
|
||||
#[cfg(feature = "badge")]
|
||||
pub use super::{Badge, BadgeProps, BadgeVariant};
|
||||
#[cfg(feature = "skeleton")]
|
||||
pub use super::{Skeleton, SkeletonProps};
|
||||
#[cfg(feature = "progress")]
|
||||
pub use super::{Progress, ProgressProps};
|
||||
#[cfg(feature = "toast")]
|
||||
pub use super::{Toast, ToastProps};
|
||||
#[cfg(feature = "table")]
|
||||
pub use super::{Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell};
|
||||
#[cfg(feature = "calendar")]
|
||||
pub use super::{Calendar, CalendarProps};
|
||||
#[cfg(feature = "date-picker")]
|
||||
pub use super::{DatePicker, DatePickerProps};
|
||||
#[cfg(feature = "pagination")]
|
||||
pub use super::{Pagination, PaginationProps};
|
||||
|
||||
// Interactive components
|
||||
#[cfg(feature = "slider")]
|
||||
pub use super::{Slider, SliderProps};
|
||||
#[cfg(feature = "toggle")]
|
||||
pub use super::{Toggle, ToggleProps};
|
||||
|
||||
// Utilities
|
||||
pub use super::tw_merge;
|
||||
}
|
||||
58
scripts/publish_main.sh
Executable file
58
scripts/publish_main.sh
Executable file
@@ -0,0 +1,58 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Leptos ShadCN UI Main Package Publishing Script
|
||||
# This script publishes the main package that contains all components
|
||||
|
||||
set -e
|
||||
|
||||
echo "🚀 Publishing Leptos ShadCN UI Main Package"
|
||||
echo "=============================================="
|
||||
|
||||
# Navigate to the main package directory
|
||||
cd packages/leptos-shadcn-ui
|
||||
|
||||
echo "📦 Package: leptos-shadcn-ui"
|
||||
echo "📋 Version: 0.1.0"
|
||||
echo ""
|
||||
|
||||
# Check if component compiles
|
||||
echo "🔍 Checking compilation..."
|
||||
if cargo check --quiet; then
|
||||
echo " ✅ Package compiles successfully"
|
||||
|
||||
# Check with all features
|
||||
echo " 🔍 Checking with all components enabled..."
|
||||
if cargo check --features all-components --quiet; then
|
||||
echo " ✅ All components compile successfully"
|
||||
|
||||
# Publish to crates.io
|
||||
echo " 🚀 Publishing to crates.io..."
|
||||
if cargo publish --quiet; then
|
||||
echo " ✅ leptos-shadcn-ui published successfully!"
|
||||
echo ""
|
||||
echo "🎉 Main package published successfully!"
|
||||
echo ""
|
||||
echo "📋 Users can now install with:"
|
||||
echo " [dependencies]"
|
||||
echo " leptos-shadcn-ui = \"0.1.0\""
|
||||
echo ""
|
||||
echo "🔧 And use with:"
|
||||
echo " use leptos_shadcn_ui::{Button, Input, Card};"
|
||||
echo ""
|
||||
echo "✨ Or enable specific components:"
|
||||
echo " leptos-shadcn-ui = { version = \"0.1.0\", features = [\"button\", \"input\"] }"
|
||||
else
|
||||
echo " ❌ Failed to publish leptos-shadcn-ui"
|
||||
exit 1
|
||||
fi
|
||||
else
|
||||
echo " ❌ Components compilation failed"
|
||||
exit 1
|
||||
fi
|
||||
else
|
||||
echo " ❌ Package compilation failed"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
echo ""
|
||||
echo "✅ Main package release complete!"
|
||||
@@ -41,6 +41,21 @@ COMPONENTS=(
|
||||
echo "📦 Components to publish: ${#COMPONENTS[@]}"
|
||||
echo ""
|
||||
|
||||
# Function to check if a crate is already published
|
||||
check_if_published() {
|
||||
local package_name=$1
|
||||
local version="0.1.0"
|
||||
|
||||
# Check if the crate exists on crates.io
|
||||
if cargo search "$package_name" --limit 1 | grep -q "^$package_name"; then
|
||||
# Check if our specific version is already published
|
||||
if cargo search "$package_name" --limit 10 | grep -q "$package_name = \"$version\""; then
|
||||
return 0 # Already published
|
||||
fi
|
||||
fi
|
||||
return 1 # Not published
|
||||
}
|
||||
|
||||
# Function to publish a component
|
||||
publish_component() {
|
||||
local component=$1
|
||||
@@ -48,6 +63,12 @@ publish_component() {
|
||||
|
||||
echo "📤 Publishing ${package_name}..."
|
||||
|
||||
# Check if already published
|
||||
if check_if_published "$package_name"; then
|
||||
echo " ✅ ${package_name} is already published on crates.io - skipping"
|
||||
return 0
|
||||
fi
|
||||
|
||||
# Navigate to component directory
|
||||
cd "packages/leptos/${component}"
|
||||
|
||||
|
||||
Reference in New Issue
Block a user