@spartan-ng/cli 0.0.1-alpha.492 → 0.0.1-alpha.494

package/src/generators/ui/libs/ui-table-helm/files/lib/{hlm-table.directive.ts.template → hlm-table.ts.template}

@@ -51,7 +51,7 @@ export function injectHlmTableConfig(): HlmTableVariant {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTableDirective {
+export class HlmTable {
 	/** Input to configure the variant of the table, this input has the highest priority. */
 	public readonly userVariant = input<Partial<HlmTableVariant> | string>({}, { alias: 'hlmTable' });
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
@@ -90,7 +90,7 @@ export class HlmTableDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTHeadDirective {
+export class HlmTHead {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -110,7 +110,7 @@ export class HlmTHeadDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTBodyDirective {
+export class HlmTBody {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -130,7 +130,7 @@ export class HlmTBodyDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTFootDirective {
+export class HlmTFoot {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -150,7 +150,7 @@ export class HlmTFootDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTrDirective {
+export class HlmTr {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -170,7 +170,7 @@ export class HlmTrDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmThDirective {
+export class HlmTh {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -190,7 +190,7 @@ export class HlmThDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTdDirective {
+export class HlmTd {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
@@ -210,7 +210,7 @@ export class HlmTdDirective {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmCaptionDirective {
+export class HlmCaption {
 	private readonly _globalOrDefaultConfig = injectHlmTableConfig();
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 

package/src/generators/ui/libs/ui-tabs-helm/files/index.ts.template

@@ -1,24 +1,18 @@
 import { NgModule } from '@angular/core';
 
-import { HlmTabsContentDirective } from './lib/hlm-tabs-content.directive';
-import { HlmTabsListComponent } from './lib/hlm-tabs-list.component';
-import { HlmTabsPaginatedListComponent } from './lib/hlm-tabs-paginated-list.component';
-import { HlmTabsTriggerDirective } from './lib/hlm-tabs-trigger.directive';
-import { HlmTabsComponent } from './lib/hlm-tabs.component';
+import { HlmTabs } from './lib/hlm-tabs';
+import { HlmTabsContent } from './lib/hlm-tabs-content';
+import { HlmTabsList } from './lib/hlm-tabs-list';
+import { HlmTabsPaginatedList } from './lib/hlm-tabs-paginated-list';
+import { HlmTabsTrigger } from './lib/hlm-tabs-trigger';
 
-export * from './lib/hlm-tabs-content.directive';
-export * from './lib/hlm-tabs-list.component';
-export * from './lib/hlm-tabs-paginated-list.component';
-export * from './lib/hlm-tabs-trigger.directive';
-export * from './lib/hlm-tabs.component';
+export * from './lib/hlm-tabs';
+export * from './lib/hlm-tabs-content';
+export * from './lib/hlm-tabs-list';
+export * from './lib/hlm-tabs-paginated-list';
+export * from './lib/hlm-tabs-trigger';
 
-export const HlmTabsImports = [
-	HlmTabsComponent,
-	HlmTabsListComponent,
-	HlmTabsTriggerDirective,
-	HlmTabsContentDirective,
-	HlmTabsPaginatedListComponent,
-] as const;
+export const HlmTabsImports = [HlmTabs, HlmTabsList, HlmTabsTrigger, HlmTabsContent, HlmTabsPaginatedList] as const;
 
 @NgModule({
 	imports: [...HlmTabsImports],

package/src/generators/ui/libs/ui-tabs-helm/files/lib/{hlm-tabs-content.directive.ts.template → hlm-tabs-content.ts.template}

@@ -1,16 +1,16 @@
 import { Directive, computed, input } from '@angular/core';
 import { hlm } from '@spartan-ng/brain/core';
-import { BrnTabsContentDirective } from '@spartan-ng/brain/tabs';
+import { BrnTabsContent } from '@spartan-ng/brain/tabs';
 import type { ClassValue } from 'clsx';
 
 @Directive({
 	selector: '[hlmTabsContent]',
-	hostDirectives: [{ directive: BrnTabsContentDirective, inputs: ['brnTabsContent: hlmTabsContent'] }],
+	hostDirectives: [{ directive: BrnTabsContent, inputs: ['brnTabsContent: hlmTabsContent'] }],
 	host: {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTabsContentDirective {
+export class HlmTabsContent {
 	public readonly contentFor = input.required<string>({ alias: 'hlmTabsContent' });
 
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/ui-tabs-helm/files/lib/{hlm-tabs-list.component.ts.template → hlm-tabs-list.ts.template}

@@ -1,6 +1,6 @@
 import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 import { hlm } from '@spartan-ng/brain/core';
-import { BrnTabsListDirective } from '@spartan-ng/brain/tabs';
+import { BrnTabsList } from '@spartan-ng/brain/tabs';
 import { type VariantProps, cva } from 'class-variance-authority';
 import type { ClassValue } from 'clsx';
 
@@ -22,14 +22,14 @@ type ListVariants = VariantProps<typeof listVariants>;
 
 @Component({
 	selector: 'hlm-tabs-list',
-	hostDirectives: [BrnTabsListDirective],
+	hostDirectives: [BrnTabsList],
 	template: '<ng-content/>',
 	host: {
 		'[class]': '_computedClass()',
 	},
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class HlmTabsListComponent {
+export class HlmTabsList {
 	public readonly orientation = input<ListVariants['orientation']>('horizontal');
 
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/ui-tabs-helm/files/lib/{hlm-tabs-paginated-list.component.ts.template → hlm-tabs-paginated-list.ts.template}

@@ -12,20 +12,16 @@ import { toObservable } from '@angular/core/rxjs-interop';
 import { NgIcon, provideIcons } from '@ng-icons/core';
 import { lucideChevronLeft, lucideChevronRight } from '@ng-icons/lucide';
 import { hlm } from '@spartan-ng/brain/core';
-import {
-	type BrnPaginatedTabHeaderItem,
-	BrnTabsPaginatedListDirective,
-	BrnTabsTriggerDirective,
-} from '@spartan-ng/brain/tabs';
+import { type BrnPaginatedTabHeaderItem, BrnTabsPaginatedList, BrnTabsTrigger } from '@spartan-ng/brain/tabs';
 import { buttonVariants } from '@spartan-ng/helm/button';
-import { HlmIconDirective } from '@spartan-ng/helm/icon';
+import { HlmIcon } from '@spartan-ng/helm/icon';
 import type { ClassValue } from 'clsx';
 import type { Observable } from 'rxjs';
-import { listVariants } from './hlm-tabs-list.component';
+import { listVariants } from './hlm-tabs-list';
 
 @Component({
 	selector: 'hlm-paginated-tabs-list',
-	imports: [CdkObserveContent, NgIcon, HlmIconDirective],
+	imports: [CdkObserveContent, NgIcon, HlmIcon],
 	providers: [provideIcons({ lucideChevronRight, lucideChevronLeft })],
 	template: `
 		<button
@@ -75,8 +71,8 @@ import { listVariants } from './hlm-tabs-list.component';
 	},
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class HlmTabsPaginatedListComponent extends BrnTabsPaginatedListDirective {
-	public readonly items = contentChildren(BrnTabsTriggerDirective, { descendants: false });
+export class HlmTabsPaginatedList extends BrnTabsPaginatedList {
+	public readonly items = contentChildren(BrnTabsTrigger, { descendants: false });
 	/** Explicitly annotating type to avoid non-portable inferred type */
 	public readonly itemsChanges: Observable<ReadonlyArray<BrnPaginatedTabHeaderItem>> = toObservable(this.items);
 

package/src/generators/ui/libs/ui-tabs-helm/files/lib/{hlm-tabs-trigger.directive.ts.template → hlm-tabs-trigger.ts.template}

@@ -1,16 +1,16 @@
 import { Directive, computed, input } from '@angular/core';
 import { hlm } from '@spartan-ng/brain/core';
-import { BrnTabsTriggerDirective } from '@spartan-ng/brain/tabs';
+import { BrnTabsTrigger } from '@spartan-ng/brain/tabs';
 import type { ClassValue } from 'clsx';
 
 @Directive({
 	selector: '[hlmTabsTrigger]',
-	hostDirectives: [{ directive: BrnTabsTriggerDirective, inputs: ['brnTabsTrigger: hlmTabsTrigger', 'disabled'] }],
+	hostDirectives: [{ directive: BrnTabsTrigger, inputs: ['brnTabsTrigger: hlmTabsTrigger', 'disabled'] }],
 	host: {
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTabsTriggerDirective {
+export class HlmTabsTrigger {
 	public readonly triggerFor = input.required<string>({ alias: 'hlmTabsTrigger' });
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected readonly _computedClass = computed(() =>

package/src/generators/ui/libs/ui-tabs-helm/files/lib/{hlm-tabs.component.ts.template → hlm-tabs.ts.template}

@@ -1,13 +1,13 @@
 import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 import { hlm } from '@spartan-ng/brain/core';
-import { BrnTabsDirective } from '@spartan-ng/brain/tabs';
+import { BrnTabs } from '@spartan-ng/brain/tabs';
 import { ClassValue } from 'clsx';
 
 @Component({
 	selector: 'hlm-tabs',
 	hostDirectives: [
 		{
-			directive: BrnTabsDirective,
+			directive: BrnTabs,
 			inputs: ['orientation', 'direction', 'activationMode', 'brnTabs: tab'],
 			outputs: ['tabActivated'],
 		},
@@ -18,7 +18,7 @@ import { ClassValue } from 'clsx';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmTabsComponent {
+export class HlmTabs {
 	public readonly tab = input.required<string>();
 
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/ui-toggle-group-helm/files/index.ts.template

@@ -1,12 +1,12 @@
 import { NgModule } from '@angular/core';
-import { HlmToggleGroupDirective } from './lib/hlm-toggle-group.directive';
-import { HlmToggleGroupItemDirective } from './lib/hlm-toggle-item.directive';
+import { HlmToggleGroup } from './lib/hlm-toggle-group';
+import { HlmToggleGroupItem } from './lib/hlm-toggle-item';
 
-export * from './lib/hlm-toggle-group.directive';
-export * from './lib/hlm-toggle-item.directive';
+export * from './lib/hlm-toggle-group';
+export * from './lib/hlm-toggle-item';
 
 @NgModule({
-	imports: [HlmToggleGroupItemDirective, HlmToggleGroupDirective],
-	exports: [HlmToggleGroupItemDirective, HlmToggleGroupDirective],
+	imports: [HlmToggleGroupItem, HlmToggleGroup],
+	exports: [HlmToggleGroupItem, HlmToggleGroup],
 })
 export class HlmToggleGroupModule {}

package/src/generators/ui/libs/ui-toggle-group-helm/files/lib/hlm-toggle-group.token.ts.template

@@ -1,12 +1,12 @@
 import { ExistingProvider, InjectionToken, Type, inject } from '@angular/core';
-import type { HlmToggleGroupDirective } from './hlm-toggle-group.directive';
+import type { HlmToggleGroup } from './hlm-toggle-group';
 
-const HlmToggleGroupToken = new InjectionToken<HlmToggleGroupDirective>('HlmToggleGroupToken');
+const HlmToggleGroupToken = new InjectionToken<HlmToggleGroup>('HlmToggleGroupToken');
 
-export function provideHlmToggleGroup(config: Type<HlmToggleGroupDirective>): ExistingProvider {
+export function provideHlmToggleGroup(config: Type<HlmToggleGroup>): ExistingProvider {
 	return { provide: HlmToggleGroupToken, useExisting: config };
 }
 
-export function injectHlmToggleGroup(): HlmToggleGroupDirective {
-	return inject(HlmToggleGroupToken, { optional: true }) as HlmToggleGroupDirective;
+export function injectHlmToggleGroup(): HlmToggleGroup {
+	return inject(HlmToggleGroupToken, { optional: true }) as HlmToggleGroup;
 }

package/src/generators/ui/libs/ui-toggle-group-helm/files/lib/{hlm-toggle-group.directive.ts.template → hlm-toggle-group.ts.template}

@@ -3,7 +3,7 @@ import { hlm } from '@spartan-ng/brain/core';
 import { VariantProps } from 'class-variance-authority';
 import type { ClassValue } from 'clsx';
 import { provideHlmToggleGroup } from './hlm-toggle-group.token';
-import { toggleGroupItemVariants } from './hlm-toggle-item.directive';
+import { toggleGroupItemVariants } from './hlm-toggle-item';
 
 type ToggleGroupItemVariants = VariantProps<typeof toggleGroupItemVariants>;
 
@@ -13,9 +13,9 @@ type ToggleGroupItemVariants = VariantProps<typeof toggleGroupItemVariants>;
 		'[class]': '_computedClass()',
 		'[attr.data-variant]': 'variant()',
 	},
-	providers: [provideHlmToggleGroup(HlmToggleGroupDirective)],
+	providers: [provideHlmToggleGroup(HlmToggleGroup)],
 })
-export class HlmToggleGroupDirective {
+export class HlmToggleGroup {
 	public readonly variant = input<ToggleGroupItemVariants['variant']>('outline');
 	public readonly size = input<ToggleGroupItemVariants['size']>('sm');
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/ui-toggle-group-helm/files/lib/{hlm-toggle-item.directive.ts.template → hlm-toggle-item.ts.template}

@@ -34,7 +34,7 @@ type ToggleGroupItemVariants = VariantProps<typeof toggleGroupItemVariants>;
 		'[attr.data-variant]': 'variant()',
 	},
 })
-export class HlmToggleGroupItemDirective {
+export class HlmToggleGroupItem {
 	private readonly _parentGroup = injectHlmToggleGroup();
 	public readonly variant = input<ToggleGroupItemVariants['variant']>('outline');
 	public readonly size = input<ToggleGroupItemVariants['size']>('sm');

package/src/generators/ui/libs/ui-toggle-helm/files/index.ts.template

@@ -1,9 +1,9 @@
 import { NgModule } from '@angular/core';
-import { HlmToggleDirective } from './lib/hlm-toggle.directive';
+import { HlmToggle } from './lib/hlm-toggle';
 
-export * from './lib/hlm-toggle.directive';
+export * from './lib/hlm-toggle';
 @NgModule({
-	imports: [HlmToggleDirective],
-	exports: [HlmToggleDirective],
+	imports: [HlmToggle],
+	exports: [HlmToggle],
 })
 export class HlmToggleModule {}

package/src/generators/ui/libs/ui-toggle-helm/files/lib/{hlm-toggle.directive.ts.template → hlm-toggle.ts.template}

@@ -31,7 +31,7 @@ export type ToggleVariants = VariantProps<typeof toggleVariants>;
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmToggleDirective {
+export class HlmToggle {
 	public readonly variant = input<ToggleVariants['variant']>('default');
 	public readonly size = input<ToggleVariants['size']>('default');
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/ui-tooltip-helm/files/index.ts.template

@@ -1,11 +1,11 @@
 import { NgModule } from '@angular/core';
-import { HlmTooltipTriggerDirective } from './lib/hlm-tooltip-trigger.directive';
-import { HlmTooltipComponent } from './lib/hlm-tooltip.component';
+import { HlmTooltip } from './lib/hlm-tooltip';
+import { HlmTooltipTrigger } from './lib/hlm-tooltip-trigger';
 
-export * from './lib/hlm-tooltip-trigger.directive';
-export * from './lib/hlm-tooltip.component';
+export * from './lib/hlm-tooltip';
+export * from './lib/hlm-tooltip-trigger';
 
-export const HlmTooltipImports = [HlmTooltipComponent, HlmTooltipTriggerDirective] as const;
+export const HlmTooltipImports = [HlmTooltip, HlmTooltipTrigger] as const;
 
 @NgModule({
 	imports: [...HlmTooltipImports],

package/src/generators/ui/libs/ui-tooltip-helm/files/lib/{hlm-tooltip-trigger.directive.ts.template → hlm-tooltip-trigger.ts.template}

@@ -1,5 +1,5 @@
 import { Directive } from '@angular/core';
-import { BrnTooltipTriggerDirective, provideBrnTooltipDefaultOptions } from '@spartan-ng/brain/tooltip';
+import { BrnTooltipTrigger, provideBrnTooltipDefaultOptions } from '@spartan-ng/brain/tooltip';
 
 const DEFAULT_TOOLTIP_CONTENT_CLASSES =
 	'bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 z-50 w-fit rounded-md px-3 py-1.5 text-xs text-balance';
@@ -20,7 +20,7 @@ const DEFAULT_TOOLTIP_CONTENT_CLASSES =
 	],
 	hostDirectives: [
 		{
-			directive: BrnTooltipTriggerDirective,
+			directive: BrnTooltipTrigger,
 			inputs: [
 				'brnTooltipDisabled: hlmTooltipDisabled',
 				'brnTooltipTrigger: hlmTooltipTrigger',
@@ -35,4 +35,4 @@ const DEFAULT_TOOLTIP_CONTENT_CLASSES =
 		},
 	],
 })
-export class HlmTooltipTriggerDirective {}
+export class HlmTooltipTrigger {}

package/src/generators/ui/libs/ui-tooltip-helm/files/lib/{hlm-tooltip.component.ts.template → hlm-tooltip.ts.template}

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';
-import { BrnTooltipDirective } from '@spartan-ng/brain/tooltip';
+import { BrnTooltip } from '@spartan-ng/brain/tooltip';
 
 @Component({
 	selector: 'hlm-tooltip',
@@ -8,9 +8,9 @@ import { BrnTooltipDirective } from '@spartan-ng/brain/tooltip';
 	host: {
 		'[style]': '{display: "contents"}',
 	},
-	hostDirectives: [BrnTooltipDirective],
+	hostDirectives: [BrnTooltip],
 	template: `
 		<ng-content />
 	`,
 })
-export class HlmTooltipComponent {}
+export class HlmTooltip {}

package/src/generators/ui/libs/ui-typography-helm/files/index.ts.template

@@ -1,12 +1,12 @@
-export * from './lib/hlm-blockquote.directive';
-export * from './lib/hlm-code.directive';
-export * from './lib/hlm-h1.directive';
-export * from './lib/hlm-h2.directive';
-export * from './lib/hlm-h3.directive';
-export * from './lib/hlm-h4.directive';
-export * from './lib/hlm-large.directive';
-export * from './lib/hlm-lead.directive';
-export * from './lib/hlm-muted.directive';
-export * from './lib/hlm-p.directive';
-export * from './lib/hlm-small.directive';
-export * from './lib/hlm-ul.directive';
+export * from './lib/hlm-blockquote';
+export * from './lib/hlm-code';
+export * from './lib/hlm-h1';
+export * from './lib/hlm-h2';
+export * from './lib/hlm-h3';
+export * from './lib/hlm-h4';
+export * from './lib/hlm-large';
+export * from './lib/hlm-lead';
+export * from './lib/hlm-muted';
+export * from './lib/hlm-p';
+export * from './lib/hlm-small';
+export * from './lib/hlm-ul';

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-blockquote.directive.ts.template → hlm-blockquote.ts.template}

@@ -10,7 +10,7 @@ export const hlmBlockquote = 'mt-6 border-border border-l-2 pl-6 italic';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmBlockquoteDirective {
+export class HlmBlockquote {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmBlockquote, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-code.directive.ts.template → hlm-code.ts.template}

@@ -10,7 +10,7 @@ export const hlmCode = 'relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-m
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmCodeDirective {
+export class HlmCode {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmCode, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-h1.directive.ts.template → hlm-h1.ts.template}

@@ -10,7 +10,7 @@ export const hlmH1 = 'scroll-m-20 text-4xl font-extrabold tracking-tight lg:text
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmH1Directive {
+export class HlmH1 {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmH1, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-h2.directive.ts.template → hlm-h2.ts.template}

@@ -11,7 +11,7 @@ export const hlmH2 =
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmH2Directive {
+export class HlmH2 {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmH2, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-h3.directive.ts.template → hlm-h3.ts.template}

@@ -10,7 +10,7 @@ export const hlmH3 = 'scroll-m-20 text-2xl font-semibold tracking-tight';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmH3Directive {
+export class HlmH3 {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmH3, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-h4.directive.ts.template → hlm-h4.ts.template}

@@ -10,7 +10,7 @@ export const hlmH4 = 'scroll-m-20 text-xl font-semibold tracking-tight';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmH4Directive {
+export class HlmH4 {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected readonly _computedClass = computed(() => hlm(hlmH4, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-large.directive.ts.template → hlm-large.ts.template}

@@ -10,7 +10,7 @@ export const hlmLarge = 'text-lg font-semibold';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmLargeDirective {
+export class HlmLarge {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmLarge, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-lead.directive.ts.template → hlm-lead.ts.template}

@@ -10,7 +10,7 @@ export const hlmLead = 'text-xl text-muted-foreground';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmLeadDirective {
+export class HlmLead {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmLead, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-muted.directive.ts.template → hlm-muted.ts.template}

@@ -10,7 +10,7 @@ export const hlmMuted = 'text-sm text-muted-foreground';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmMutedDirective {
+export class HlmMuted {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmMuted, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-p.directive.ts.template → hlm-p.ts.template}

@@ -10,7 +10,7 @@ export const hlmP = 'leading-7 [&:not(:first-child)]:mt-6';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmPDirective {
+export class HlmP {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmP, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-small.directive.ts.template → hlm-small.ts.template}

@@ -10,7 +10,7 @@ export const hlmSmall = 'text-sm font-medium leading-none';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmSmallDirective {
+export class HlmSmall {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmSmall, this.userClass()));
 }

package/src/generators/ui/libs/ui-typography-helm/files/lib/{hlm-ul.directive.ts.template → hlm-ul.ts.template}

@@ -10,7 +10,7 @@ export const hlmUl = 'my-6 ml-6 list-disc [&>li]:mt-2';
 		'[class]': '_computedClass()',
 	},
 })
-export class HlmUlDirective {
+export class HlmUl {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected _computedClass = computed(() => hlm(hlmUl, this.userClass()));
 }