@gilav21/shadcn-angular 0.0.2 → 0.0.4

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.
@@ -120,7 +120,55 @@ export async function init(options) {
120
120
  spinner.text = 'Created components directory';
121
121
  // Install dependencies
122
122
  spinner.text = 'Installing dependencies...';
123
- await execa('npm', ['install', 'clsx', 'tailwind-merge', 'class-variance-authority', '@angular/cdk', 'lucide-angular'], { cwd });
123
+ const dependencies = [
124
+ 'clsx',
125
+ 'tailwind-merge',
126
+ 'class-variance-authority',
127
+ '@angular/cdk',
128
+ 'lucide-angular',
129
+ 'tailwindcss',
130
+ 'postcss',
131
+ '@tailwindcss/postcss'
132
+ ];
133
+ await execa('npm', ['install', ...dependencies], { cwd });
134
+ // Setup PostCSS
135
+ spinner.text = 'Configuring PostCSS...';
136
+ const postcssConfigPath = path.join(cwd, 'postcss.config.js');
137
+ const postcssConfigMjsPath = path.join(cwd, 'postcss.config.mjs');
138
+ if (await fs.pathExists(postcssConfigMjsPath)) {
139
+ // Check mjs config
140
+ const content = await fs.readFile(postcssConfigMjsPath, 'utf-8');
141
+ if (!content.includes('@tailwindcss/postcss')) {
142
+ // Very basic append attempt for mjs, safest is to warn or skip complex types
143
+ // But user asked to try.
144
+ // If it's a simple export default { plugins: {} }, we can try to inject.
145
+ // For now, let's just log a warning if we can't safely inject
146
+ console.log(chalk.yellow('\nComputed postcss.config.mjs found. Please manually add "@tailwindcss/postcss" to your plugins.'));
147
+ }
148
+ }
149
+ else if (await fs.pathExists(postcssConfigPath)) {
150
+ let content = await fs.readFile(postcssConfigPath, 'utf-8');
151
+ if (!content.includes('@tailwindcss/postcss')) {
152
+ // Try to inject into plugins object
153
+ if (content.includes('plugins: {')) {
154
+ content = content.replace('plugins: {', 'plugins: {\n \'@tailwindcss/postcss\': {},');
155
+ await fs.writeFile(postcssConfigPath, content);
156
+ }
157
+ else {
158
+ console.log(chalk.yellow('\nExisting postcss.config.js found but structure not recognized. Please manually add "@tailwindcss/postcss" to your plugins.'));
159
+ }
160
+ }
161
+ }
162
+ else {
163
+ // Create new config
164
+ const configContent = `module.exports = {
165
+ plugins: {
166
+ '@tailwindcss/postcss': {},
167
+ },
168
+ }
169
+ `;
170
+ await fs.writeFile(postcssConfigPath, configContent);
171
+ }
124
172
  spinner.succeed(chalk.green('Project initialized successfully!'));
125
173
  console.log('\n' + chalk.bold('Next steps:'));
126
174
  console.log(chalk.dim(' 1. Add components: ') + chalk.cyan('npx shadcn-angular add button'));
@@ -14,7 +14,6 @@ export const registry = {
14
14
  'alert-dialog': {
15
15
  name: 'alert-dialog',
16
16
  files: ['alert-dialog.component.ts'],
17
- dependencies: ['button'],
18
17
  },
19
18
  'aspect-ratio': {
20
19
  name: 'aspect-ratio',
@@ -39,12 +38,10 @@ export const registry = {
39
38
  'button-group': {
40
39
  name: 'button-group',
41
40
  files: ['button-group.component.ts'],
42
- dependencies: ['button', 'separator'],
43
41
  },
44
42
  calendar: {
45
43
  name: 'calendar',
46
44
  files: ['calendar.component.ts'],
47
- dependencies: ['button'],
48
45
  },
49
46
  card: {
50
47
  name: 'card',
@@ -53,7 +50,6 @@ export const registry = {
53
50
  carousel: {
54
51
  name: 'carousel',
55
52
  files: ['carousel.component.ts'],
56
- dependencies: ['button'],
57
53
  },
58
54
  checkbox: {
59
55
  name: 'checkbox',
@@ -66,7 +62,7 @@ export const registry = {
66
62
  command: {
67
63
  name: 'command',
68
64
  files: ['command.component.ts'],
69
- dependencies: ['dialog', 'separator'],
65
+ dependencies: ['dialog'],
70
66
  },
71
67
  'context-menu': {
72
68
  name: 'context-menu',
@@ -75,7 +71,7 @@ export const registry = {
75
71
  'date-picker': {
76
72
  name: 'date-picker',
77
73
  files: ['date-picker.component.ts'],
78
- dependencies: ['calendar', 'popover', 'button'],
74
+ dependencies: ['calendar'],
79
75
  },
80
76
  dialog: {
81
77
  name: 'dialog',
@@ -108,7 +104,6 @@ export const registry = {
108
104
  'input-group': {
109
105
  name: 'input-group',
110
106
  files: ['input-group.component.ts'],
111
- dependencies: ['input', 'button'],
112
107
  },
113
108
  'input-otp': {
114
109
  name: 'input-otp',
@@ -137,7 +132,6 @@ export const registry = {
137
132
  pagination: {
138
133
  name: 'pagination',
139
134
  files: ['pagination.component.ts'],
140
- dependencies: ['button'],
141
135
  },
142
136
  popover: {
143
137
  name: 'popover',
@@ -174,7 +168,6 @@ export const registry = {
174
168
  sidebar: {
175
169
  name: 'sidebar',
176
170
  files: ['sidebar.component.ts'],
177
- dependencies: ['button', 'sheet', 'separator', 'tooltip', 'input', 'skeleton'],
178
171
  },
179
172
  skeleton: {
180
173
  name: 'skeleton',
@@ -214,8 +207,7 @@ export const registry = {
214
207
  },
215
208
  'toggle-group': {
216
209
  name: 'toggle-group',
217
- files: ['toggle-group.component.ts'],
218
- dependencies: ['toggle'],
210
+ files: ['toggle-group.component.ts']
219
211
  },
220
212
  tooltip: {
221
213
  name: 'tooltip',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gilav21/shadcn-angular",
3
- "version": "0.0.2",
3
+ "version": "0.0.4",
4
4
  "description": "CLI for adding shadcn-angular components to your project",
5
5
  "bin": {
6
6
  "shadcn-angular": "./dist/index.js"
@@ -138,7 +138,54 @@ export async function init(options: InitOptions) {
138
138
 
139
139
  // Install dependencies
140
140
  spinner.text = 'Installing dependencies...';
141
- await execa('npm', ['install', 'clsx', 'tailwind-merge', 'class-variance-authority', '@angular/cdk', 'lucide-angular'], { cwd });
141
+ const dependencies = [
142
+ 'clsx',
143
+ 'tailwind-merge',
144
+ 'class-variance-authority',
145
+ '@angular/cdk',
146
+ 'lucide-angular',
147
+ 'tailwindcss',
148
+ 'postcss',
149
+ '@tailwindcss/postcss'
150
+ ];
151
+ await execa('npm', ['install', ...dependencies], { cwd });
152
+
153
+ // Setup PostCSS
154
+ spinner.text = 'Configuring PostCSS...';
155
+ const postcssConfigPath = path.join(cwd, 'postcss.config.js');
156
+ const postcssConfigMjsPath = path.join(cwd, 'postcss.config.mjs');
157
+
158
+ if (await fs.pathExists(postcssConfigMjsPath)) {
159
+ // Check mjs config
160
+ const content = await fs.readFile(postcssConfigMjsPath, 'utf-8');
161
+ if (!content.includes('@tailwindcss/postcss')) {
162
+ // Very basic append attempt for mjs, safest is to warn or skip complex types
163
+ // But user asked to try.
164
+ // If it's a simple export default { plugins: {} }, we can try to inject.
165
+ // For now, let's just log a warning if we can't safely inject
166
+ console.log(chalk.yellow('\nComputed postcss.config.mjs found. Please manually add "@tailwindcss/postcss" to your plugins.'));
167
+ }
168
+ } else if (await fs.pathExists(postcssConfigPath)) {
169
+ let content = await fs.readFile(postcssConfigPath, 'utf-8');
170
+ if (!content.includes('@tailwindcss/postcss')) {
171
+ // Try to inject into plugins object
172
+ if (content.includes('plugins: {')) {
173
+ content = content.replace('plugins: {', 'plugins: {\n \'@tailwindcss/postcss\': {},');
174
+ await fs.writeFile(postcssConfigPath, content);
175
+ } else {
176
+ console.log(chalk.yellow('\nExisting postcss.config.js found but structure not recognized. Please manually add "@tailwindcss/postcss" to your plugins.'));
177
+ }
178
+ }
179
+ } else {
180
+ // Create new config
181
+ const configContent = `module.exports = {
182
+ plugins: {
183
+ '@tailwindcss/postcss': {},
184
+ },
185
+ }
186
+ `;
187
+ await fs.writeFile(postcssConfigPath, configContent);
188
+ }
142
189
 
143
190
  spinner.succeed(chalk.green('Project initialized successfully!'));
144
191
 
@@ -23,7 +23,6 @@ export const registry: Record<string, ComponentDefinition> = {
23
23
  'alert-dialog': {
24
24
  name: 'alert-dialog',
25
25
  files: ['alert-dialog.component.ts'],
26
- dependencies: ['button'],
27
26
  },
28
27
  'aspect-ratio': {
29
28
  name: 'aspect-ratio',
@@ -48,12 +47,10 @@ export const registry: Record<string, ComponentDefinition> = {
48
47
  'button-group': {
49
48
  name: 'button-group',
50
49
  files: ['button-group.component.ts'],
51
- dependencies: ['button', 'separator'],
52
50
  },
53
51
  calendar: {
54
52
  name: 'calendar',
55
53
  files: ['calendar.component.ts'],
56
- dependencies: ['button'],
57
54
  },
58
55
  card: {
59
56
  name: 'card',
@@ -62,7 +59,6 @@ export const registry: Record<string, ComponentDefinition> = {
62
59
  carousel: {
63
60
  name: 'carousel',
64
61
  files: ['carousel.component.ts'],
65
- dependencies: ['button'],
66
62
  },
67
63
  checkbox: {
68
64
  name: 'checkbox',
@@ -75,7 +71,7 @@ export const registry: Record<string, ComponentDefinition> = {
75
71
  command: {
76
72
  name: 'command',
77
73
  files: ['command.component.ts'],
78
- dependencies: ['dialog', 'separator'],
74
+ dependencies: ['dialog'],
79
75
  },
80
76
  'context-menu': {
81
77
  name: 'context-menu',
@@ -84,7 +80,7 @@ export const registry: Record<string, ComponentDefinition> = {
84
80
  'date-picker': {
85
81
  name: 'date-picker',
86
82
  files: ['date-picker.component.ts'],
87
- dependencies: ['calendar', 'popover', 'button'],
83
+ dependencies: ['calendar'],
88
84
  },
89
85
  dialog: {
90
86
  name: 'dialog',
@@ -117,7 +113,6 @@ export const registry: Record<string, ComponentDefinition> = {
117
113
  'input-group': {
118
114
  name: 'input-group',
119
115
  files: ['input-group.component.ts'],
120
- dependencies: ['input', 'button'],
121
116
  },
122
117
  'input-otp': {
123
118
  name: 'input-otp',
@@ -146,7 +141,6 @@ export const registry: Record<string, ComponentDefinition> = {
146
141
  pagination: {
147
142
  name: 'pagination',
148
143
  files: ['pagination.component.ts'],
149
- dependencies: ['button'],
150
144
  },
151
145
  popover: {
152
146
  name: 'popover',
@@ -183,7 +177,6 @@ export const registry: Record<string, ComponentDefinition> = {
183
177
  sidebar: {
184
178
  name: 'sidebar',
185
179
  files: ['sidebar.component.ts'],
186
- dependencies: ['button', 'sheet', 'separator', 'tooltip', 'input', 'skeleton'],
187
180
  },
188
181
  skeleton: {
189
182
  name: 'skeleton',
@@ -223,8 +216,7 @@ export const registry: Record<string, ComponentDefinition> = {
223
216
  },
224
217
  'toggle-group': {
225
218
  name: 'toggle-group',
226
- files: ['toggle-group.component.ts'],
227
- dependencies: ['toggle'],
219
+ files: ['toggle-group.component.ts']
228
220
  },
229
221
  tooltip: {
230
222
  name: 'tooltip',