@gilav21/shadcn-angular 0.0.8 → 0.0.9
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 +107 -0
- package/package.json +2 -2
package/README.md
ADDED
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
# @gilav21/shadcn-angular
|
|
2
|
+
|
|
3
|
+
An Angular port of [shadcn/ui](https://ui.shadcn.com/) - beautifully designed components that you can copy and paste into your apps.
|
|
4
|
+
|
|
5
|
+
This CLI tool helps you easily add components to your Angular project.
|
|
6
|
+
|
|
7
|
+
## Prerequisites
|
|
8
|
+
|
|
9
|
+
- Angular v17+
|
|
10
|
+
- Tailwind CSS installed and configured
|
|
11
|
+
|
|
12
|
+
## Installation
|
|
13
|
+
|
|
14
|
+
Run the `init` command to set up your project:
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npx @gilav21/shadcn-angular init
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
This will:
|
|
21
|
+
1. Configure your `tailwind.config.ts`.
|
|
22
|
+
2. Add CSS variables to your global styles.
|
|
23
|
+
3. Add a `cn` utility for class merging.
|
|
24
|
+
4. Create a `components.json` configuration file.
|
|
25
|
+
|
|
26
|
+
## Usage
|
|
27
|
+
|
|
28
|
+
Use the `add` command to add components to your project:
|
|
29
|
+
|
|
30
|
+
```bash
|
|
31
|
+
npx @gilav21/shadcn-angular add [component]
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
Example:
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
npx @gilav21/shadcn-angular add button
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
You can also run the command without arguments to select from a list:
|
|
41
|
+
|
|
42
|
+
```bash
|
|
43
|
+
npx @gilav21/shadcn-angular add
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
## Available Components
|
|
47
|
+
|
|
48
|
+
- Accordion
|
|
49
|
+
- Alert
|
|
50
|
+
- Alert Dialog
|
|
51
|
+
- Aspect Ratio
|
|
52
|
+
- Avatar
|
|
53
|
+
- Badge
|
|
54
|
+
- Breadcrumb
|
|
55
|
+
- Button
|
|
56
|
+
- Button Group
|
|
57
|
+
- Calendar
|
|
58
|
+
- Card
|
|
59
|
+
- Carousel
|
|
60
|
+
- Checkbox
|
|
61
|
+
- Chip List
|
|
62
|
+
- Collapsible
|
|
63
|
+
- Command
|
|
64
|
+
- Context Menu
|
|
65
|
+
- Date Picker
|
|
66
|
+
- Dialog
|
|
67
|
+
- Drawer
|
|
68
|
+
- Dropdown Menu
|
|
69
|
+
- Emoji Picker
|
|
70
|
+
- Empty State
|
|
71
|
+
- Field
|
|
72
|
+
- Hover Card
|
|
73
|
+
- Input
|
|
74
|
+
- Input Group
|
|
75
|
+
- Input OTP
|
|
76
|
+
- Kbd (Keyboard Key)
|
|
77
|
+
- Label
|
|
78
|
+
- Menubar
|
|
79
|
+
- Native Select
|
|
80
|
+
- Navigation Menu
|
|
81
|
+
- Pagination
|
|
82
|
+
- Popover
|
|
83
|
+
- Progress
|
|
84
|
+
- Radio Group
|
|
85
|
+
- Resizable
|
|
86
|
+
- Rich Text Editor
|
|
87
|
+
- Scroll Area
|
|
88
|
+
- Select
|
|
89
|
+
- Separator
|
|
90
|
+
- Sheet
|
|
91
|
+
- Sidebar
|
|
92
|
+
- Skeleton
|
|
93
|
+
- Slider
|
|
94
|
+
- Speed Dial
|
|
95
|
+
- Spinner
|
|
96
|
+
- Switch
|
|
97
|
+
- Table
|
|
98
|
+
- Tabs
|
|
99
|
+
- Textarea
|
|
100
|
+
- Toast
|
|
101
|
+
- Toggle
|
|
102
|
+
- Toggle Group
|
|
103
|
+
- Tooltip
|
|
104
|
+
|
|
105
|
+
## Documentation
|
|
106
|
+
|
|
107
|
+
For full documentation and examples, verify usage in your local development environment or check the original [shadcn/ui documentation](https://ui.shadcn.com/docs).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gilav21/shadcn-angular",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.9",
|
|
4
4
|
"description": "CLI for adding shadcn-angular components to your project",
|
|
5
5
|
"bin": {
|
|
6
6
|
"shadcn-angular": "./dist/index.js"
|
|
@@ -32,4 +32,4 @@
|
|
|
32
32
|
"@types/prompts": "^2.4.9",
|
|
33
33
|
"typescript": "^5.5.0"
|
|
34
34
|
}
|
|
35
|
-
}
|
|
35
|
+
}
|