@dinachi/cli 0.4.0 → 0.5.1
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 +27 -5
- package/dist/index.js +1037 -567
- package/package.json +6 -5
- package/templates/autocomplete/autocomplete.tsx +197 -0
- package/templates/autocomplete/index.ts +17 -0
- package/templates/combobox/combobox.tsx +202 -0
- package/templates/combobox/index.ts +17 -0
- package/templates/context-menu/context-menu.tsx +104 -39
- package/templates/drawer/drawer.tsx +109 -0
- package/templates/drawer/index.ts +12 -0
- package/templates/fieldset/fieldset.tsx +32 -0
- package/templates/fieldset/index.ts +1 -0
- package/templates/menu/index.ts +17 -0
- package/templates/menu/menu.tsx +282 -0
- package/templates/menubar/menubar.tsx +7 -7
- package/templates/meter/index.ts +1 -0
- package/templates/meter/meter.tsx +64 -0
- package/templates/number-field/index.ts +9 -0
- package/templates/number-field/number-field.tsx +114 -0
- package/templates/popover/index.ts +12 -0
- package/templates/popover/popover.tsx +137 -0
- package/templates/preview-card/preview-card.tsx +4 -5
- package/templates/progress/index.ts +7 -0
- package/templates/progress/progress.tsx +64 -0
- package/templates/radio/index.ts +1 -0
- package/templates/radio/radio.tsx +39 -0
- package/templates/scroll-area/index.ts +8 -0
- package/templates/scroll-area/scroll-area.tsx +94 -0
- package/templates/separator/index.ts +1 -0
- package/templates/separator/separator.tsx +25 -0
- package/templates/switch/index.ts +1 -0
- package/templates/switch/switch.tsx +42 -0
- package/templates/toggle-group/index.ts +1 -0
- package/templates/toggle-group/toggle-group.tsx +67 -0
- package/templates/tooltip/tooltip.tsx +2 -2
package/README.md
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
A CLI for adding Dinachi UI components to your project. Just like shadcn/ui, this tool copies component source code directly into your project, giving you full ownership and control.
|
|
4
4
|
|
|
5
|
+
Best fit: React projects using Tailwind CSS (Next.js, Vite, Remix, CRA, and similar layouts).
|
|
6
|
+
|
|
5
7
|
## Installation
|
|
6
8
|
|
|
7
9
|
```bash
|
|
@@ -48,7 +50,7 @@ This will:
|
|
|
48
50
|
- Set up the project configuration
|
|
49
51
|
- Install required dependencies
|
|
50
52
|
- Create utility functions
|
|
51
|
-
- Generate a `components.json` config file
|
|
53
|
+
- Generate a `components.json` config file with normalized project paths
|
|
52
54
|
|
|
53
55
|
### Add components
|
|
54
56
|
|
|
@@ -61,36 +63,53 @@ npx @dinachi/cli add button
|
|
|
61
63
|
This will:
|
|
62
64
|
- Copy the button component source code to your project
|
|
63
65
|
- Place it in your configured components directory
|
|
64
|
-
-
|
|
66
|
+
- Install any missing dependencies (or print them when using `--skip-install`)
|
|
65
67
|
|
|
66
68
|
### Available Commands
|
|
67
69
|
|
|
68
70
|
- `dinachi init` - Initialize Dinachi UI in your project
|
|
71
|
+
- `dinachi init --skip-install` - Initialize without package installation
|
|
69
72
|
- `dinachi add <component>` - Add a component to your project
|
|
70
73
|
- `dinachi add <component> --overwrite` - Overwrite existing component files
|
|
74
|
+
- `dinachi add --all` - Install all registered components
|
|
75
|
+
- `dinachi add <component> --skip-install` - Add files without installing packages
|
|
71
76
|
|
|
72
77
|
### Available Components
|
|
73
78
|
|
|
74
79
|
- `accordion` - Collapsible content sections
|
|
75
80
|
- `alert-dialog` - Modal dialogs for important actions
|
|
81
|
+
- `autocomplete` - Text input with dynamic suggestions
|
|
76
82
|
- `avatar` - User profile images with fallbacks
|
|
77
83
|
- `button` - Clickable buttons with variants
|
|
78
84
|
- `checkbox` - Checkbox inputs
|
|
79
85
|
- `checkbox-group` - Grouped checkboxes
|
|
80
86
|
- `collapsible` - Collapsible content panels
|
|
87
|
+
- `combobox` - Input + dropdown selection
|
|
81
88
|
- `context-menu` - Right-click context menus
|
|
82
89
|
- `dialog` - Modal dialogs
|
|
90
|
+
- `drawer` - Edge-anchored slide-in panel
|
|
83
91
|
- `field` - Form field wrapper
|
|
92
|
+
- `fieldset` - Group related form controls
|
|
84
93
|
- `form` - Form component with validation
|
|
85
94
|
- `input` - Text input fields
|
|
95
|
+
- `menu` - Button-triggered action menu
|
|
86
96
|
- `menubar` - Desktop-style menu bars
|
|
97
|
+
- `meter` - Scalar measurement indicator
|
|
87
98
|
- `navigation-menu` - Navigation menu systems
|
|
99
|
+
- `number-field` - Numeric input with steppers
|
|
100
|
+
- `popover` - Anchored floating panel
|
|
88
101
|
- `preview-card` - Hover preview cards
|
|
102
|
+
- `progress` - Task completion indicator
|
|
103
|
+
- `radio` - Single-select radio controls
|
|
104
|
+
- `scroll-area` - Custom scroll container
|
|
89
105
|
- `select` - Dropdown select inputs
|
|
106
|
+
- `separator` - Visual content divider
|
|
90
107
|
- `slider` - Range slider inputs
|
|
108
|
+
- `switch` - On/off toggle control
|
|
91
109
|
- `tabs` - Tabbed interfaces
|
|
92
110
|
- `toast` - Notification toasts
|
|
93
111
|
- `toggle` - Toggle switches
|
|
112
|
+
- `toggle-group` - Grouped toggles
|
|
94
113
|
- `toolbar` - Tool button groups
|
|
95
114
|
- `tooltip` - Hover tooltips
|
|
96
115
|
|
|
@@ -99,7 +118,7 @@ This will:
|
|
|
99
118
|
Unlike traditional component libraries, Dinachi UI copies the actual source code into your project. This means:
|
|
100
119
|
|
|
101
120
|
✅ **Full ownership** - The code is yours to modify
|
|
102
|
-
✅ **
|
|
121
|
+
✅ **Dependencies stay in your app** - Required packages are installed directly into your project
|
|
103
122
|
✅ **Complete customization** - Change variants, styles, and behavior as needed
|
|
104
123
|
✅ **Zero abstractions** - See exactly how components work
|
|
105
124
|
|
|
@@ -119,8 +138,11 @@ After running `dinachi init`, you'll have a `components.json` file:
|
|
|
119
138
|
"cssVariables": true
|
|
120
139
|
},
|
|
121
140
|
"aliases": {
|
|
122
|
-
"components": "./src/components
|
|
123
|
-
"utils": "./src/lib/utils"
|
|
141
|
+
"components": "./src/components",
|
|
142
|
+
"utils": "./src/lib/utils",
|
|
143
|
+
"ui": "./src/components/ui",
|
|
144
|
+
"lib": "./src/lib",
|
|
145
|
+
"hooks": "./src/hooks"
|
|
124
146
|
}
|
|
125
147
|
}
|
|
126
148
|
```
|