@spartan-ng/cli 0.0.1-alpha.610 → 0.0.1-alpha.612

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spartan-ng/cli",
-  "version": "0.0.1-alpha.610",
+  "version": "0.0.1-alpha.612",
   "type": "commonjs",
   "dependencies": {
     "@angular/core": ">=19.0.0",

package/src/generators/ui/libs/avatar/files/index.ts.template

@@ -1,9 +1,22 @@
-import { HlmAvatarFallback } from './lib/fallback';
 import { HlmAvatar } from './lib/hlm-avatar';
-import { HlmAvatarImage } from './lib/image';
+import { HlmAvatarBadge } from './lib/hlm-avatar-badge';
+import { HlmAvatarFallback } from './lib/hlm-avatar-fallback';
+import { HlmAvatarGroup } from './lib/hlm-avatar-group';
+import { HlmAvatarGroupCount } from './lib/hlm-avatar-group-count';
+import { HlmAvatarImage } from './lib/hlm-avatar-image';
 
-export * from './lib/fallback';
 export * from './lib/hlm-avatar';
-export * from './lib/image';
+export * from './lib/hlm-avatar-badge';
+export * from './lib/hlm-avatar-fallback';
+export * from './lib/hlm-avatar-group';
+export * from './lib/hlm-avatar-group-count';
+export * from './lib/hlm-avatar-image';
 
-export const HlmAvatarImports = [HlmAvatarFallback, HlmAvatarImage, HlmAvatar] as const;
+export const HlmAvatarImports = [
+	HlmAvatar,
+	HlmAvatarBadge,
+	HlmAvatarFallback,
+	HlmAvatarGroup,
+	HlmAvatarGroupCount,
+	HlmAvatarImage,
+] as const;

package/src/generators/ui/libs/avatar/files/lib/hlm-avatar-badge.ts.template

@@ -0,0 +1,19 @@
+import { Directive } from '@angular/core';
+import { classes } from '<%- importAlias %>/utils';
+
+@Directive({
+	selector: '[hlmAvatarBadge],hlm-avatar-badge',
+	host: {
+		'data-slot': 'avatar-badge',
+	},
+})
+export class HlmAvatarBadge {
+	constructor() {
+		classes(() => [
+			'bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none',
+			'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>ng-icon]:hidden',
+			'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>ng-icon]:text-[0.5rem]',
+			'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>ng-icon]:text-[0.5rem]',
+		]);
+	}
+}

package/src/generators/ui/libs/avatar/files/lib/{fallback/hlm-avatar-fallback.ts.template → hlm-avatar-fallback.ts.template}

@@ -5,14 +5,16 @@ import { classes } from '<%- importAlias %>/utils';
 @Directive({
 	selector: '[hlmAvatarFallback]',
 	exportAs: 'avatarFallback',
-	hostDirectives: [
-		{
-			directive: BrnAvatarFallback,
-		},
-	],
+	hostDirectives: [BrnAvatarFallback],
+	host: {
+		'data-slot': 'avatar-fallback',
+	},
 })
 export class HlmAvatarFallback {
 	constructor() {
-		classes(() => 'bg-muted flex size-full items-center justify-center rounded-full');
+		classes(
+			() =>
+				'bg-muted text-muted-foreground flex size-full items-center justify-center rounded-full text-sm group-data-[size=sm]/avatar:text-xs',
+		);
 	}
 }

package/src/generators/ui/libs/avatar/files/lib/hlm-avatar-group-count.ts.template

@@ -0,0 +1,17 @@
+import { Directive } from '@angular/core';
+import { classes } from '<%- importAlias %>/utils';
+
+@Directive({
+	selector: '[hlmAvatarGroupCount],hlm-avatar-group-count',
+	host: {
+		'data-slot': 'avatar-group-count',
+	},
+})
+export class HlmAvatarGroupCount {
+	constructor() {
+		classes(
+			() =>
+				'bg-muted text-muted-foreground ring-background relative flex size-8 shrink-0 items-center justify-center rounded-full text-sm ring-2 group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>ng-icon]:text-base group-has-data-[size=lg]/avatar-group:[&>ng-icon]:text-xl group-has-data-[size=sm]/avatar-group:[&>ng-icon]:text-xs',
+		);
+	}
+}

package/src/generators/ui/libs/avatar/files/lib/hlm-avatar-group.ts.template

@@ -0,0 +1,16 @@
+import { Directive } from '@angular/core';
+import { classes } from '<%- importAlias %>/utils';
+
+@Directive({
+	selector: '[hlmAvatarGroup],hlm-avatar-group',
+	host: {
+		'data-slot': 'avatar-group',
+	},
+})
+export class HlmAvatarGroup {
+	constructor() {
+		classes(
+			() => '*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2',
+		);
+	}
+}

package/src/generators/ui/libs/avatar/files/lib/{image/hlm-avatar-image.ts.template → hlm-avatar-image.ts.template}

@@ -6,11 +6,14 @@ import { classes } from '<%- importAlias %>/utils';
 	selector: 'img[hlmAvatarImage]',
 	exportAs: 'avatarImage',
 	hostDirectives: [BrnAvatarImage],
+	host: {
+		'data-slot': 'avatar-image',
+	},
 })
 export class HlmAvatarImage {
 	public readonly canShow = inject(BrnAvatarImage).canShow;
 
 	constructor() {
-		classes(() => 'aspect-square size-full');
+		classes(() => 'aspect-square size-full rounded-full object-cover');
 	}
 }

package/src/generators/ui/libs/avatar/files/lib/hlm-avatar.ts.template

@@ -1,21 +1,31 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
 import { BrnAvatar } from '@spartan-ng/brain/avatar';
 import { classes } from '<%- importAlias %>/utils';
 
 @Component({
 	selector: 'hlm-avatar',
 	changeDetection: ChangeDetectionStrategy.OnPush,
+	host: {
+		'data-slot': 'avatar',
+		'[attr.data-size]': 'size()',
+	},
 	template: `
 		@if (_image()?.canShow()) {
 			<ng-content select="[hlmAvatarImage],[brnAvatarImage]" />
 		} @else {
 			<ng-content select="[hlmAvatarFallback],[brnAvatarFallback]" />
 		}
+		<ng-content />
 	`,
 })
 export class HlmAvatar extends BrnAvatar {
+	public readonly size = input<'default' | 'sm' | 'lg'>('default');
+
 	constructor() {
 		super();
-		classes(() => 'relative flex size-8 shrink-0 overflow-hidden rounded-full');
+		classes(
+			() =>
+				'after:border-border group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten',
+		);
 	}
 }

package/src/generators/ui/libs/badge/files/lib/hlm-badge.ts.template

@@ -3,15 +3,17 @@ import { classes } from '<%- importAlias %>/utils';
 import { type VariantProps, cva } from 'class-variance-authority';
 
 const badgeVariants = cva(
-	'focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-md border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&_ng-icon]:pointer-events-none [&_ng-icon]:size-3',
+	'focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:ring-[3px] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&>ng-icon]:pointer-events-none [&>ng-icon]:text-xs',
 	{
 		variants: {
 			variant: {
-				default: 'bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent',
-				secondary: 'bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent',
+				default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+				secondary: 'bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80',
 				destructive:
-					'bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 border-transparent text-white',
-				outline: 'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
+					'bg-destructive/10 [a]:hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 text-destructive dark:bg-destructive/20',
+				outline: 'border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground',
+				ghost: 'hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50',
+				link: 'text-primary underline-offset-4 hover:underline',
 			},
 		},
 		defaultVariants: {
@@ -23,9 +25,10 @@ const badgeVariants = cva(
 export type BadgeVariants = VariantProps<typeof badgeVariants>;
 
 @Directive({
-	selector: '[hlmBadge]',
+	selector: '[hlmBadge],hlm-badge',
 	host: {
 		'data-slot': 'badge',
+		'[attr.data-variant]': 'variant()',
 	},
 })
 export class HlmBadge {

package/src/generators/ui/libs/button/files/lib/hlm-button.ts.template

@@ -21,10 +21,11 @@ export const buttonVariants = cva(
 			},
 			size: {
 				default: 'h-9 px-4 py-2 has-[>ng-icon]:px-3',
+				xs: `h-6 gap-1 rounded-md px-2 text-xs has-[>ng-icon]:px-1.5 [&_ng-icon:not([class*='text-'])]:text-xs`,
 				sm: 'h-8 gap-1.5 rounded-md px-3 has-[>ng-icon]:px-2.5',
 				lg: 'h-10 rounded-md px-6 has-[>ng-icon]:px-4',
 				icon: 'size-9',
-				'icon-xs': `size-6 [&_ng-icon:not([class*='text-'])]:text-xs`,
+				'icon-xs': `size-6 rounded-md [&_ng-icon:not([class*='text-'])]:text-xs`,
 				'icon-sm': 'size-8',
 				'icon-lg': 'size-10',
 			},

package/src/generators/ui/libs/card/files/index.ts.template

@@ -16,10 +16,10 @@ export * from './lib/hlm-card-title';
 
 export const HlmCardImports = [
 	HlmCard,
-	HlmCardHeader,
+	HlmCardAction,
+	HlmCardContent,
+	HlmCardDescription,
 	HlmCardFooter,
+	HlmCardHeader,
 	HlmCardTitle,
-	HlmCardDescription,
-	HlmCardContent,
-	HlmCardAction,
 ] as const;

package/src/generators/ui/libs/card/files/lib/hlm-card-action.ts.template

@@ -3,6 +3,9 @@ import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
 	selector: '[hlmCardAction]',
+	host: {
+		'data-slot': 'card-action',
+	},
 })
 export class HlmCardAction {
 	constructor() {

package/src/generators/ui/libs/card/files/lib/hlm-card-content.ts.template

@@ -3,9 +3,12 @@ import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
 	selector: '[hlmCardContent]',
+	host: {
+		'data-slot': 'card-content',
+	},
 })
 export class HlmCardContent {
 	constructor() {
-		classes(() => 'px-6');
+		classes(() => 'px-6 group-data-[size=sm]/card:px-4');
 	}
 }

package/src/generators/ui/libs/card/files/lib/hlm-card-description.ts.template

@@ -3,6 +3,9 @@ import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
 	selector: '[hlmCardDescription]',
+	host: {
+		'data-slot': 'card-description',
+	},
 })
 export class HlmCardDescription {
 	constructor() {

package/src/generators/ui/libs/card/files/lib/hlm-card-footer.ts.template

@@ -2,10 +2,16 @@ import { Directive } from '@angular/core';
 import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
-	selector: '[hlmCardFooter]',
+	selector: '[hlmCardFooter],hlm-card-footer',
+	host: {
+		'data-slot': 'card-footer',
+	},
 })
 export class HlmCardFooter {
 	constructor() {
-		classes(() => 'flex items-center px-6 [.border-t]:pt-6');
+		classes(
+			() =>
+				'flex items-center rounded-b-xl px-6 group-data-[size=sm]/card:px-4 [.border-t]:pt-6 group-data-[size=sm]/card:[.border-t]:pt-4',
+		);
 	}
 }

package/src/generators/ui/libs/card/files/lib/hlm-card-header.ts.template

@@ -2,13 +2,16 @@ import { Directive } from '@angular/core';
 import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
-	selector: '[hlmCardHeader]',
+	selector: '[hlmCardHeader],hlm-card-header',
+	host: {
+		'data-slot': 'card-header',
+	},
 })
 export class HlmCardHeader {
 	constructor() {
 		classes(
 			() =>
-				`@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6`,
+				`group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-6 group-data-[size=sm]/card:px-4 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-6 group-data-[size=sm]/card:[.border-b]:pb-4`,
 		);
 	}
 }

package/src/generators/ui/libs/card/files/lib/hlm-card-title.ts.template

@@ -3,9 +3,12 @@ import { classes } from '<%- importAlias %>/utils';
 
 @Directive({
 	selector: '[hlmCardTitle]',
+	host: {
+		'data-slot': 'card-title',
+	},
 })
 export class HlmCardTitle {
 	constructor() {
-		classes(() => 'leading-none font-semibold');
+		classes(() => 'text-base leading-normal font-medium group-data-[size=sm]/card:text-sm');
 	}
 }

package/src/generators/ui/libs/card/files/lib/hlm-card.ts.template

@@ -1,18 +1,20 @@
-import { Directive } from '@angular/core';
+import { Directive, input } from '@angular/core';
 import { classes } from '<%- importAlias %>/utils';
-import { type VariantProps, cva } from 'class-variance-authority';
-
-export const cardVariants = cva('bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm', {
-	variants: {},
-	defaultVariants: {},
-});
-export type CardVariants = VariantProps<typeof cardVariants>;
 
 @Directive({
-	selector: '[hlmCard]',
+	selector: '[hlmCard],hlm-card',
+	host: {
+		'data-slot': 'card',
+		'[attr.data-size]': 'size()',
+	},
 })
 export class HlmCard {
+	public readonly size = input<'sm' | 'default'>('default');
+
 	constructor() {
-		classes(() => cardVariants());
+		classes(
+			() =>
+				'group/card ring-foreground/10 bg-card text-card-foreground flex flex-col gap-6 overflow-hidden rounded-xl py-6 text-sm shadow-xs ring-1 has-[>img:first-child]:pt-0 data-[size=sm]:gap-4 data-[size=sm]:py-4 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl',
+		);
 	}
 }

package/src/generators/ui/libs/radio-group/files/lib/hlm-radio.ts.template

@@ -56,7 +56,7 @@ export class HlmRadio<T = unknown> {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 	protected readonly _computedClass = computed(() =>
 		hlm(
-			'group flex items-center gap-x-3',
+			'group relative flex items-center gap-x-3',
 			'data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50',
 			this.userClass(),
 		),

package/src/generators/ui/libs/resizable/files/lib/hlm-resizable-panel.ts.template

@@ -1,8 +1,9 @@
-import { Directive } from '@angular/core';
+import { Directive, inject } from '@angular/core';
 import { BrnResizablePanel } from '@spartan-ng/brain/resizable';
 
 @Directive({
 	selector: '[hlmResizablePanel],hlm-resizable-panel',
+	exportAs: 'hlmResizablePanel',
 	hostDirectives: [
 		{
 			directive: BrnResizablePanel,
@@ -13,4 +14,10 @@ import { BrnResizablePanel } from '@spartan-ng/brain/resizable';
 		'data-slot': 'resizable-panel',
 	},
 })
-export class HlmResizablePanel {}
+export class HlmResizablePanel {
+	private readonly _resizablePanel = inject(BrnResizablePanel);
+
+	public setSize(size: number) {
+		this._resizablePanel.setSize(size);
+	}
+}

package/src/generators/ui/supported-ui-libraries.json

@@ -3,7 +3,7 @@
 		"name": "accordion",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0"
 		}
@@ -19,7 +19,7 @@
 		"name": "alert-dialog",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -34,7 +34,7 @@
 		"name": "autocomplete",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0"
@@ -44,7 +44,7 @@
 		"name": "avatar",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"badge": {
@@ -68,7 +68,7 @@
 		"name": "button",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1"
 		}
@@ -77,7 +77,7 @@
 		"name": "button-group",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0"
 		}
 	},
@@ -89,15 +89,14 @@
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"clsx": "^2.1.1"
 		}
 	},
 	"card": {
 		"name": "card",
 		"peerDependencies": {
-			"@angular/core": ">=20.0.0 <22.0.0",
-			"class-variance-authority": "^0.7.0"
+			"@angular/core": ">=20.0.0 <22.0.0"
 		}
 	},
 	"carousel": {
@@ -118,7 +117,7 @@
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -126,14 +125,14 @@
 		"name": "collapsible",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"combobox": {
 		"name": "combobox",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
@@ -144,14 +143,14 @@
 		"name": "command",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"context-menu": {
 		"name": "context-menu",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"rxjs": "^7.8.0"
 		}
@@ -164,7 +163,7 @@
 			"@angular/forms": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -172,7 +171,7 @@
 		"name": "dialog",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@angular/common": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
@@ -188,7 +187,7 @@
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"rxjs": "^7.8.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"empty": {
@@ -211,14 +210,14 @@
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/forms": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"hover-card": {
 		"name": "hover-card",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"icon": {
@@ -234,7 +233,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/forms": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1"
 		}
@@ -253,7 +252,7 @@
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"item": {
@@ -261,7 +260,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"class-variance-authority": "^0.7.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"kbd": {
@@ -274,14 +273,14 @@
 		"name": "label",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"menubar": {
 		"name": "menubar",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"rxjs": "^7.8.0"
 		}
@@ -290,7 +289,7 @@
 		"name": "navigation-menu",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"pagination": {
@@ -299,7 +298,7 @@
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/forms": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
 			"@angular/router": ">=20.0.0 <22.0.0"
@@ -309,21 +308,21 @@
 		"name": "popover",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"progress": {
 		"name": "progress",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"radio-group": {
 		"name": "radio-group",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@angular/common": ">=20.0.0 <22.0.0",
 			"clsx": "^2.1.1"
@@ -333,7 +332,7 @@
 		"name": "resizable",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"scroll-area": {
@@ -347,7 +346,7 @@
 		"peerDependencies": {
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
 			"class-variance-authority": "^0.7.0",
@@ -358,14 +357,14 @@
 		"name": "separator",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"sheet": {
 		"name": "sheet",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
 			"class-variance-authority": "^0.7.0",
@@ -377,7 +376,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
 			"@ng-icons/lucide": ">=32.0.0 <34.0.0",
@@ -395,7 +394,7 @@
 		"name": "slider",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"sonner": {
@@ -420,7 +419,7 @@
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@angular/forms": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"clsx": "^2.1.1"
 		}
 	},
@@ -434,7 +433,7 @@
 		"name": "tabs",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0",
 			"@angular/cdk": ">=20.0.0 <22.0.0",
 			"@ng-icons/core": ">=32.0.0 <34.0.0",
@@ -448,7 +447,7 @@
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
 			"@angular/forms": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0",
 			"clsx": "^2.1.1"
 		}
@@ -457,7 +456,7 @@
 		"name": "toggle",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"class-variance-authority": "^0.7.0"
 		}
 	},
@@ -465,7 +464,7 @@
 		"name": "toggle-group",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610",
+			"@spartan-ng/brain": "0.0.1-alpha.612",
 			"@angular/cdk": ">=20.0.0 <22.0.0"
 		}
 	},
@@ -473,7 +472,7 @@
 		"name": "tooltip",
 		"peerDependencies": {
 			"@angular/core": ">=20.0.0 <22.0.0",
-			"@spartan-ng/brain": "0.0.1-alpha.610"
+			"@spartan-ng/brain": "0.0.1-alpha.612"
 		}
 	},
 	"typography": {

package/src/generators/ui/libs/avatar/files/lib/fallback/index.ts.template

@@ -1 +0,0 @@
-export * from './hlm-avatar-fallback';

package/src/generators/ui/libs/avatar/files/lib/image/index.ts.template

@@ -1 +0,0 @@
-export * from './hlm-avatar-image';