@spartan-ng/cli 0.0.1-alpha.528 → 0.0.1-alpha.529

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.
Files changed (7) hide show
  1. package/package.json +1 -1
  2. package/src/generators/ui/libs/ui-icon-helm/files/index.ts.template +2 -1
  3. package/src/generators/ui/libs/ui-icon-helm/files/lib/hlm-icon.ts.template +1 -1
  4. package/src/generators/ui/libs/ui-select-helm/files/lib/hlm-select-value.ts.template +1 -1
  5. package/src/generators/ui/libs/ui-table-helm/files/index.ts.template +22 -2
  6. package/src/generators/ui/libs/ui-table-helm/files/lib/hlm-table.ts.template +28 -9
  7. package/src/generators/ui/supported-ui-libraries.json +31 -31
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spartan-ng/cli",
3
- "version": "0.0.1-alpha.528",
3
+ "version": "0.0.1-alpha.529",
4
4
  "type": "commonjs",
5
5
  "dependencies": {
6
6
  "@nx/angular": ">=20.0.0",
package/src/generators/ui/libs/ui-icon-helm/files/index.ts.template CHANGED
@@ -1,6 +1,7 @@
1
+ import { NgIcon } from '@ng-icons/core';
1
2
  import { HlmIcon } from './lib/hlm-icon';
2
3
 
3
4
  export * from './lib/hlm-icon';
4
5
  export * from './lib/hlm-icon.token';
5
6
 
6
- export const HlmIconImports = [HlmIcon] as const;
7
+ export const HlmIconImports = [HlmIcon, NgIcon] as const;
package/src/generators/ui/libs/ui-icon-helm/files/lib/hlm-icon.ts.template CHANGED
@@ -4,7 +4,7 @@ import { injectHlmIconConfig } from './hlm-icon.token';
4
4
  export type IconSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | 'none' | (Record<never, never> & string);
5
5
 
6
6
  @Directive({
7
- selector: 'ng-icon[hlm]',
7
+ selector: 'ng-icon[hlmIcon], ng-icon[hlm]',
8
8
  host: {
9
9
  '[style.--ng-icon__size]': '_computedSize()',
10
10
  },
package/src/generators/ui/libs/ui-select-helm/files/lib/hlm-select-value.ts.template CHANGED
@@ -11,6 +11,6 @@ import type { ClassValue } from 'clsx';
11
11
  export class HlmSelectValue {
12
12
  public readonly userClass = input<ClassValue>('', { alias: 'class' });
13
13
  protected readonly _computedClass = computed(() =>
14
- hlm('data-[placeholder]:text-muted-foreground line-clamp-1 flex items-center gap-2', this.userClass()),
14
+ hlm('data-[placeholder]:text-muted-foreground line-clamp-1 flex items-center gap-2 truncate', this.userClass()),
15
15
  );
16
16
  }
package/src/generators/ui/libs/ui-table-helm/files/index.ts.template CHANGED
@@ -1,5 +1,25 @@
1
- import { HlmCaption, HlmTable, HlmTBody, HlmTd, HlmTFoot, HlmTh, HlmTHead, HlmTr } from './lib/hlm-table';
1
+ import {
2
+ HlmCaption,
3
+ HlmTable,
4
+ HlmTableContainer,
5
+ HlmTBody,
6
+ HlmTd,
7
+ HlmTFoot,
8
+ HlmTh,
9
+ HlmTHead,
10
+ HlmTr,
11
+ } from './lib/hlm-table';
2
12
 
3
13
  export * from './lib/hlm-table';
4
14
 
5
- export const HlmTableImports = [HlmCaption, HlmTable, HlmTBody, HlmTd, HlmTFoot, HlmTh, HlmTHead, HlmTr] as const;
15
+ export const HlmTableImports = [
16
+ HlmCaption,
17
+ HlmTableContainer,
18
+ HlmTable,
19
+ HlmTBody,
20
+ HlmTd,
21
+ HlmTFoot,
22
+ HlmTh,
23
+ HlmTHead,
24
+ HlmTr,
25
+ ] as const;
package/src/generators/ui/libs/ui-table-helm/files/lib/hlm-table.ts.template CHANGED
@@ -6,6 +6,7 @@ import type { ClassValue } from 'clsx';
6
6
  // Configuration Interface and InjectionToken
7
7
  export const HlmTableConfigToken = new InjectionToken<HlmTableVariant>('HlmTableConfig');
8
8
  export interface HlmTableVariant {
9
+ tableContainer: string;
9
10
  table: string;
10
11
  thead: string;
11
12
  tbody: string;
@@ -17,13 +18,14 @@ export interface HlmTableVariant {
17
18
  }
18
19
 
19
20
  export const HlmTableVariantDefault: HlmTableVariant = {
21
+ tableContainer: 'relative w-full overflow-x-auto',
20
22
  table: 'w-full caption-bottom text-sm',
21
23
  thead: '[&_tr]:border-b',
22
24
  tbody: '[&_tr:last-child]:border-0',
23
25
  tfoot: 'bg-muted/50 border-t font-medium [&>tr]:last:border-b-0',
24
26
  tr: 'hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors',
25
- th: 'text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
26
- td: 'p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
27
+ th: 'text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0',
28
+ td: 'p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0',
27
29
  caption: 'text-muted-foreground mt-4 text-sm',
28
30
  };
29
31
 
@@ -38,6 +40,22 @@ export function injectHlmTableConfig(): HlmTableVariant {
38
40
  return inject(HlmTableConfigToken, { optional: true }) ?? HlmTableVariantDefault;
39
41
  }
40
42
 
43
+ @Directive({
44
+ selector: 'div[hlmTableContainer]',
45
+ host: {
46
+ '[class]': '_computedClass()',
47
+ 'data-slot': 'table-container',
48
+ },
49
+ })
50
+ export class HlmTableContainer {
51
+ private readonly _globalOrDefaultConfig = injectHlmTableConfig();
52
+ public readonly userClass = input<ClassValue>('', { alias: 'class' });
53
+
54
+ protected readonly _computedClass = computed(() =>
55
+ hlm(this._globalOrDefaultConfig ? this._globalOrDefaultConfig.tableContainer.trim() : '', this.userClass()),
56
+ );
57
+ }
58
+
41
59
  /**
42
60
  * Directive to apply Shadcn-like styling to a <table> element.
43
61
  * It resolves and provides base classes for its child table elements.
@@ -46,9 +64,9 @@ export function injectHlmTableConfig(): HlmTableVariant {
46
64
  */
47
65
  @Directive({
48
66
  selector: 'table[hlmTable]',
49
- standalone: true,
50
67
  host: {
51
68
  '[class]': '_computedClass()',
69
+ 'data-slot': 'table',
52
70
  },
53
71
  })
54
72
  export class HlmTable {
@@ -85,9 +103,9 @@ export class HlmTable {
85
103
  */
86
104
  @Directive({
87
105
  selector: 'thead[hlmTHead]',
88
- standalone: true,
89
106
  host: {
90
107
  '[class]': '_computedClass()',
108
+ 'data-slot': 'table-header',
91
109
  },
92
110
  })
93
111
  export class HlmTHead {
@@ -105,9 +123,9 @@ export class HlmTHead {
105
123
  */
106
124
  @Directive({
107
125
  selector: 'tbody[hlmTBody]',
108
- standalone: true,
109
126
  host: {
110
127
  '[class]': '_computedClass()',
128
+ 'data-slot': 'table-body',
111
129
  },
112
130
  })
113
131
  export class HlmTBody {
@@ -125,9 +143,9 @@ export class HlmTBody {
125
143
  */
126
144
  @Directive({
127
145
  selector: 'tfoot[hlmTFoot]',
128
- standalone: true,
129
146
  host: {
130
147
  '[class]': '_computedClass()',
148
+ 'data-slot': 'table-footer',
131
149
  },
132
150
  })
133
151
  export class HlmTFoot {
@@ -145,9 +163,9 @@ export class HlmTFoot {
145
163
  */
146
164
  @Directive({
147
165
  selector: 'tr[hlmTr]',
148
- standalone: true,
149
166
  host: {
150
167
  '[class]': '_computedClass()',
168
+ 'data-slot': 'table-row',
151
169
  },
152
170
  })
153
171
  export class HlmTr {
@@ -165,9 +183,9 @@ export class HlmTr {
165
183
  */
166
184
  @Directive({
167
185
  selector: 'th[hlmTh]',
168
- standalone: true,
169
186
  host: {
170
187
  '[class]': '_computedClass()',
188
+ 'data-slot': 'table-head',
171
189
  },
172
190
  })
173
191
  export class HlmTh {
@@ -188,6 +206,7 @@ export class HlmTh {
188
206
  standalone: true,
189
207
  host: {
190
208
  '[class]': '_computedClass()',
209
+ 'data-slot': 'table-cell',
191
210
  },
192
211
  })
193
212
  export class HlmTd {
@@ -205,9 +224,9 @@ export class HlmTd {
205
224
  */
206
225
  @Directive({
207
226
  selector: 'caption[hlmCaption]',
208
- standalone: true,
209
227
  host: {
210
228
  '[class]': '_computedClass()',
229
+ 'data-slot': 'table-caption',
211
230
  },
212
231
  })
213
232
  export class HlmCaption {
package/src/generators/ui/supported-ui-libraries.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "internalName": "ui-accordion-helm",
4
4
  "peerDependencies": {
5
5
  "@angular/core": ">=19.0.0",
6
- "@spartan-ng/brain": "0.0.1-alpha.528",
6
+ "@spartan-ng/brain": "0.0.1-alpha.529",
7
7
  "clsx": "^2.1.1",
8
8
  "@ng-icons/core": ">=29.0.0",
9
9
  "@ng-icons/lucide": ">=29.0.0"
@@ -21,7 +21,7 @@
21
21
  "internalName": "ui-alert-dialog-helm",
22
22
  "peerDependencies": {
23
23
  "@angular/core": ">=19.0.0",
24
- "@spartan-ng/brain": "0.0.1-alpha.528",
24
+ "@spartan-ng/brain": "0.0.1-alpha.529",
25
25
  "clsx": "^2.1.1"
26
26
  }
27
27
  },
@@ -38,7 +38,7 @@
38
38
  "peerDependencies": {
39
39
  "@angular/core": ">=19.0.0",
40
40
  "clsx": "^2.1.1",
41
- "@spartan-ng/brain": "0.0.1-alpha.528",
41
+ "@spartan-ng/brain": "0.0.1-alpha.529",
42
42
  "@angular/cdk": ">=19.0.0",
43
43
  "@angular/common": ">=19.0.0",
44
44
  "@angular/forms": ">=19.0.0",
@@ -50,7 +50,7 @@
50
50
  "internalName": "ui-avatar-helm",
51
51
  "peerDependencies": {
52
52
  "@angular/core": ">=19.0.0",
53
- "@spartan-ng/brain": "0.0.1-alpha.528",
53
+ "@spartan-ng/brain": "0.0.1-alpha.529",
54
54
  "clsx": "^2.1.1"
55
55
  }
56
56
  },
@@ -76,7 +76,7 @@
76
76
  "internalName": "ui-button-helm",
77
77
  "peerDependencies": {
78
78
  "@angular/core": ">=19.0.0",
79
- "@spartan-ng/brain": "0.0.1-alpha.528",
79
+ "@spartan-ng/brain": "0.0.1-alpha.529",
80
80
  "class-variance-authority": "^0.7.0",
81
81
  "clsx": "^2.1.1"
82
82
  }
@@ -85,7 +85,7 @@
85
85
  "internalName": "ui-button-group-helm",
86
86
  "peerDependencies": {
87
87
  "@angular/core": ">=19.0.0",
88
- "@spartan-ng/brain": "0.0.1-alpha.528",
88
+ "@spartan-ng/brain": "0.0.1-alpha.529",
89
89
  "clsx": "^2.1.1",
90
90
  "class-variance-authority": "^0.7.0"
91
91
  }
@@ -98,7 +98,7 @@
98
98
  "@angular/core": ">=19.0.0",
99
99
  "@ng-icons/core": ">=29.0.0",
100
100
  "@ng-icons/lucide": ">=29.0.0",
101
- "@spartan-ng/brain": "0.0.1-alpha.528",
101
+ "@spartan-ng/brain": "0.0.1-alpha.529",
102
102
  "clsx": "^2.1.1"
103
103
  }
104
104
  },
@@ -128,7 +128,7 @@
128
128
  "@angular/forms": ">=19.0.0",
129
129
  "@ng-icons/core": ">=29.0.0",
130
130
  "@ng-icons/lucide": ">=29.0.0",
131
- "@spartan-ng/brain": "0.0.1-alpha.528",
131
+ "@spartan-ng/brain": "0.0.1-alpha.529",
132
132
  "clsx": "^2.1.1"
133
133
  }
134
134
  },
@@ -136,7 +136,7 @@
136
136
  "internalName": "ui-command-helm",
137
137
  "peerDependencies": {
138
138
  "@angular/core": ">=19.0.0",
139
- "@spartan-ng/brain": "0.0.1-alpha.528",
139
+ "@spartan-ng/brain": "0.0.1-alpha.529",
140
140
  "clsx": "^2.1.1"
141
141
  }
142
142
  },
@@ -148,7 +148,7 @@
148
148
  "@angular/forms": ">=19.0.0",
149
149
  "@ng-icons/core": ">=29.0.0",
150
150
  "@ng-icons/lucide": ">=29.0.0",
151
- "@spartan-ng/brain": "0.0.1-alpha.528",
151
+ "@spartan-ng/brain": "0.0.1-alpha.529",
152
152
  "clsx": "^2.1.1"
153
153
  }
154
154
  },
@@ -160,7 +160,7 @@
160
160
  "@angular/common": ">=19.0.0",
161
161
  "@ng-icons/core": ">=29.0.0",
162
162
  "@ng-icons/lucide": ">=29.0.0",
163
- "@spartan-ng/brain": "0.0.1-alpha.528",
163
+ "@spartan-ng/brain": "0.0.1-alpha.529",
164
164
  "@angular/cdk": ">=19.0.0"
165
165
  }
166
166
  },
@@ -169,7 +169,7 @@
169
169
  "peerDependencies": {
170
170
  "@angular/core": ">=19.0.0",
171
171
  "@angular/forms": ">=19.0.0",
172
- "@spartan-ng/brain": "0.0.1-alpha.528",
172
+ "@spartan-ng/brain": "0.0.1-alpha.529",
173
173
  "clsx": "^2.1.1"
174
174
  }
175
175
  },
@@ -177,15 +177,15 @@
177
177
  "internalName": "ui-hover-card-helm",
178
178
  "peerDependencies": {
179
179
  "@angular/core": ">=19.0.0",
180
- "@spartan-ng/brain": "0.0.1-alpha.528",
180
+ "@spartan-ng/brain": "0.0.1-alpha.529",
181
181
  "clsx": "^2.1.1"
182
182
  }
183
183
  },
184
184
  "icon": {
185
185
  "internalName": "ui-icon-helm",
186
186
  "peerDependencies": {
187
- "@angular/core": ">=19.0.0",
188
187
  "@ng-icons/core": ">=29.0.0",
188
+ "@angular/core": ">=19.0.0",
189
189
  "@ng-icons/lucide": ">=29.0.0"
190
190
  }
191
191
  },
@@ -194,7 +194,7 @@
194
194
  "peerDependencies": {
195
195
  "@angular/core": ">=19.0.0",
196
196
  "@angular/forms": ">=19.0.0",
197
- "@spartan-ng/brain": "0.0.1-alpha.528",
197
+ "@spartan-ng/brain": "0.0.1-alpha.529",
198
198
  "class-variance-authority": "^0.7.0",
199
199
  "clsx": "^2.1.1"
200
200
  }
@@ -204,7 +204,7 @@
204
204
  "peerDependencies": {
205
205
  "@angular/core": ">=19.0.0",
206
206
  "clsx": "^2.1.1",
207
- "@spartan-ng/brain": "0.0.1-alpha.528"
207
+ "@spartan-ng/brain": "0.0.1-alpha.529"
208
208
  }
209
209
  },
210
210
  "input-otp": {
@@ -215,7 +215,7 @@
215
215
  "@ng-icons/core": ">=29.0.0",
216
216
  "@ng-icons/lucide": ">=29.0.0",
217
217
  "@angular/cdk": ">=19.0.0",
218
- "@spartan-ng/brain": "0.0.1-alpha.528"
218
+ "@spartan-ng/brain": "0.0.1-alpha.529"
219
219
  }
220
220
  },
221
221
  "kbd": {
@@ -229,7 +229,7 @@
229
229
  "internalName": "ui-label-helm",
230
230
  "peerDependencies": {
231
231
  "@angular/core": ">=19.0.0",
232
- "@spartan-ng/brain": "0.0.1-alpha.528",
232
+ "@spartan-ng/brain": "0.0.1-alpha.529",
233
233
  "clsx": "^2.1.1"
234
234
  }
235
235
  },
@@ -237,7 +237,7 @@
237
237
  "internalName": "ui-menu-helm",
238
238
  "peerDependencies": {
239
239
  "@angular/core": ">=19.0.0",
240
- "@spartan-ng/brain": "0.0.1-alpha.528",
240
+ "@spartan-ng/brain": "0.0.1-alpha.529",
241
241
  "clsx": "^2.1.1",
242
242
  "@ng-icons/core": ">=29.0.0",
243
243
  "@ng-icons/lucide": ">=29.0.0",
@@ -251,7 +251,7 @@
251
251
  "@angular/cdk": ">=19.0.0",
252
252
  "@angular/core": ">=19.0.0",
253
253
  "@angular/forms": ">=19.0.0",
254
- "@spartan-ng/brain": "0.0.1-alpha.528",
254
+ "@spartan-ng/brain": "0.0.1-alpha.529",
255
255
  "class-variance-authority": "^0.7.0",
256
256
  "clsx": "^2.1.1",
257
257
  "@ng-icons/core": ">=29.0.0",
@@ -264,14 +264,14 @@
264
264
  "peerDependencies": {
265
265
  "@angular/core": ">=19.0.0",
266
266
  "clsx": "^2.1.1",
267
- "@spartan-ng/brain": "0.0.1-alpha.528"
267
+ "@spartan-ng/brain": "0.0.1-alpha.529"
268
268
  }
269
269
  },
270
270
  "progress": {
271
271
  "internalName": "ui-progress-helm",
272
272
  "peerDependencies": {
273
273
  "@angular/core": ">=19.0.0",
274
- "@spartan-ng/brain": "0.0.1-alpha.528",
274
+ "@spartan-ng/brain": "0.0.1-alpha.529",
275
275
  "clsx": "^2.1.1"
276
276
  }
277
277
  },
@@ -279,7 +279,7 @@
279
279
  "internalName": "ui-radio-group-helm",
280
280
  "peerDependencies": {
281
281
  "@angular/core": ">=19.0.0",
282
- "@spartan-ng/brain": "0.0.1-alpha.528",
282
+ "@spartan-ng/brain": "0.0.1-alpha.529",
283
283
  "clsx": "^2.1.1",
284
284
  "@angular/common": ">=19.0.0"
285
285
  }
@@ -296,7 +296,7 @@
296
296
  "peerDependencies": {
297
297
  "@angular/cdk": ">=19.0.0",
298
298
  "@angular/core": ">=19.0.0",
299
- "@spartan-ng/brain": "0.0.1-alpha.528",
299
+ "@spartan-ng/brain": "0.0.1-alpha.529",
300
300
  "clsx": "^2.1.1",
301
301
  "@ng-icons/core": ">=29.0.0",
302
302
  "@ng-icons/lucide": ">=29.0.0",
@@ -307,7 +307,7 @@
307
307
  "internalName": "ui-separator-helm",
308
308
  "peerDependencies": {
309
309
  "@angular/core": ">=19.0.0",
310
- "@spartan-ng/brain": "0.0.1-alpha.528",
310
+ "@spartan-ng/brain": "0.0.1-alpha.529",
311
311
  "clsx": "^2.1.1"
312
312
  }
313
313
  },
@@ -318,7 +318,7 @@
318
318
  "clsx": "^2.1.1",
319
319
  "@ng-icons/core": ">=29.0.0",
320
320
  "@ng-icons/lucide": ">=29.0.0",
321
- "@spartan-ng/brain": "0.0.1-alpha.528",
321
+ "@spartan-ng/brain": "0.0.1-alpha.529",
322
322
  "class-variance-authority": "^0.7.0"
323
323
  }
324
324
  },
@@ -327,7 +327,7 @@
327
327
  "peerDependencies": {
328
328
  "@angular/core": ">=19.0.0",
329
329
  "clsx": "^2.1.1",
330
- "@spartan-ng/brain": "0.0.1-alpha.528",
330
+ "@spartan-ng/brain": "0.0.1-alpha.529",
331
331
  "class-variance-authority": "^0.7.0",
332
332
  "@ng-icons/core": ">=29.0.0",
333
333
  "@ng-icons/lucide": ">=29.0.0",
@@ -345,7 +345,7 @@
345
345
  "internalName": "ui-slider-helm",
346
346
  "peerDependencies": {
347
347
  "@angular/core": ">=19.0.0",
348
- "@spartan-ng/brain": "0.0.1-alpha.528",
348
+ "@spartan-ng/brain": "0.0.1-alpha.529",
349
349
  "clsx": "^2.1.1"
350
350
  }
351
351
  },
@@ -371,7 +371,7 @@
371
371
  "clsx": "^2.1.1",
372
372
  "@angular/cdk": ">=19.0.0",
373
373
  "@angular/forms": ">=19.0.0",
374
- "@spartan-ng/brain": "0.0.1-alpha.528"
374
+ "@spartan-ng/brain": "0.0.1-alpha.529"
375
375
  }
376
376
  },
377
377
  "table": {
@@ -385,7 +385,7 @@
385
385
  "internalName": "ui-tabs-helm",
386
386
  "peerDependencies": {
387
387
  "@angular/core": ">=19.0.0",
388
- "@spartan-ng/brain": "0.0.1-alpha.528",
388
+ "@spartan-ng/brain": "0.0.1-alpha.529",
389
389
  "clsx": "^2.1.1",
390
390
  "class-variance-authority": "^0.7.0",
391
391
  "@angular/cdk": ">=19.0.0",
@@ -414,7 +414,7 @@
414
414
  "internalName": "ui-tooltip-helm",
415
415
  "peerDependencies": {
416
416
  "@angular/core": ">=19.0.0",
417
- "@spartan-ng/brain": "0.0.1-alpha.528"
417
+ "@spartan-ng/brain": "0.0.1-alpha.529"
418
418
  }
419
419
  },
420
420
  "typography": {