@j3m-quantum/ui 0.7.4 → 0.7.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -24
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +8 -40
package/README.md
CHANGED
|
@@ -4,20 +4,20 @@ J3M Quantum UI - A themed component library based on shadcn/ui with J3M design t
|
|
|
4
4
|
|
|
5
5
|
## Features
|
|
6
6
|
|
|
7
|
-
-
|
|
8
|
-
-
|
|
9
|
-
-
|
|
10
|
-
-
|
|
11
|
-
-
|
|
12
|
-
-
|
|
7
|
+
- **J3M Design Tokens** - Orange primary, neutral grays, pill-shaped buttons
|
|
8
|
+
- **Dark Mode** - Full dark theme support via `.dark` class
|
|
9
|
+
- **Glass Mode** - Frosted glass effects via `.theme-glass` class
|
|
10
|
+
- **55+ Components** - All shadcn/ui components with J3M styling
|
|
11
|
+
- **All-in-One** - Everything bundled, just install and use
|
|
12
|
+
- **Smooth Animations** - Powered by tw-animate-css
|
|
13
13
|
|
|
14
14
|
## Installation
|
|
15
15
|
|
|
16
16
|
```bash
|
|
17
|
-
npm install @j3m-quantum/ui tw-animate-css
|
|
17
|
+
npm install @j3m-quantum/ui tw-animate-css
|
|
18
18
|
```
|
|
19
19
|
|
|
20
|
-
That's it! All Radix UI
|
|
20
|
+
That's it! All dependencies (Radix UI, lucide-react, etc.) are bundled with the package.
|
|
21
21
|
|
|
22
22
|
## Quick Start
|
|
23
23
|
|
|
@@ -52,7 +52,7 @@ export default defineConfig({
|
|
|
52
52
|
@import "@j3m-quantum/ui/styles"; /* J3M theme and tokens */
|
|
53
53
|
```
|
|
54
54
|
|
|
55
|
-
|
|
55
|
+
**Order matters!** Import `tw-animate-css` before `@j3m-quantum/ui/styles` to ensure animations work correctly on Dialog, Sheet, Select, Popover, and other overlay components.
|
|
56
56
|
|
|
57
57
|
### 4. Use Components
|
|
58
58
|
|
|
@@ -117,21 +117,21 @@ Combine with dark mode:
|
|
|
117
117
|
| `--destructive` | #FB3748 | #D00416 |
|
|
118
118
|
| `--radius` | 12px | 12px |
|
|
119
119
|
|
|
120
|
-
##
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
120
|
+
## Included Dependencies
|
|
121
|
+
|
|
122
|
+
All of these are bundled and ready to use:
|
|
123
|
+
|
|
124
|
+
- All Radix UI primitives
|
|
125
|
+
- lucide-react (icons)
|
|
126
|
+
- cmdk (Command palette)
|
|
127
|
+
- vaul (Drawer)
|
|
128
|
+
- sonner (Toast notifications)
|
|
129
|
+
- recharts (Charts)
|
|
130
|
+
- react-day-picker + date-fns (Calendar)
|
|
131
|
+
- embla-carousel-react (Carousel)
|
|
132
|
+
- input-otp (OTP input)
|
|
133
|
+
- react-resizable-panels (Resizable)
|
|
134
|
+
- react-hook-form (Form handling)
|
|
135
135
|
|
|
136
136
|
## Exports
|
|
137
137
|
|
package/dist/index.cjs
CHANGED
|
@@ -2670,7 +2670,7 @@ function Progress({
|
|
|
2670
2670
|
{
|
|
2671
2671
|
"data-slot": "progress",
|
|
2672
2672
|
className: cn(
|
|
2673
|
-
"bg-
|
|
2673
|
+
"bg-secondary relative h-4 w-full overflow-hidden rounded-full",
|
|
2674
2674
|
className
|
|
2675
2675
|
),
|
|
2676
2676
|
...props,
|