@egose/shadcn-theme-ng 0.0.28 → 0.2.0

package/alert-dialog/fesm2022/alert-dialog.mjs

@@ -12,7 +12,7 @@ import { HlmBtn, provideBrnButtonConfig } from '@egose/shadcn-theme-ng/button';
 class HlmAlertDialogOverlay {
     _classSettable = injectCustomClassSettable({ optional: true, host: true });
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
-    _computedClass = computed(() => hlm('data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 isolate bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs', this.userClass()), /* @ts-ignore */
+    _computedClass = computed(() => hlm("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 isolate bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs", this.userClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_computedClass" }] : /* istanbul ignore next */ []));
     constructor() {
         effect(() => {
@@ -20,10 +20,10 @@ class HlmAlertDialogOverlay {
             untracked(() => this._classSettable?.setClassToCustomElement(classValue));
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogOverlay, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogOverlay, isStandalone: true, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: i1.BrnAlertDialogOverlay }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogOverlay, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogOverlay, isStandalone: true, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: i1.BrnAlertDialogOverlay }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogOverlay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogOverlay, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogOverlay],hlm-alert-dialog-overlay',
@@ -32,8 +32,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
         }], ctorParameters: () => [], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
 class HlmAlertDialog extends BrnAlertDialog {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialog, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialog, isStandalone: true, selector: "hlm-alert-dialog", providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialog, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialog, isStandalone: true, selector: "hlm-alert-dialog", providers: [
             {
                 provide: BrnDialog,
                 useExisting: forwardRef(() => HlmAlertDialog),
@@ -46,7 +46,7 @@ class HlmAlertDialog extends BrnAlertDialog {
     <ng-content />
   `, isInline: true, dependencies: [{ kind: "directive", type: HlmAlertDialogOverlay, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialog, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-alert-dialog',
@@ -72,10 +72,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 class HlmAlertDialogAction {
     type = input('button', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogAction, isStandalone: true, selector: "button[hlmAlertDialogAction]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-action" }, properties: { "type": "type()" } }, hostDirectives: [{ directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogAction, isStandalone: true, selector: "button[hlmAlertDialogAction]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-action" }, properties: { "type": "type()" } }, hostDirectives: [{ directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogAction, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmAlertDialogAction]',
@@ -87,10 +87,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 class HlmAlertDialogCancel {
     type = input('button', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogCancel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogCancel, isStandalone: true, selector: "button[hlmAlertDialogCancel]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-cancel" }, properties: { "type": "type()" } }, providers: [provideBrnButtonConfig({ variant: 'outline' })], hostDirectives: [{ directive: i1$2.BrnDialogClose }, { directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogCancel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogCancel, isStandalone: true, selector: "button[hlmAlertDialogCancel]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-cancel" }, properties: { "type": "type()" } }, providers: [provideBrnButtonConfig({ variant: 'outline' })], hostDirectives: [{ directive: i1$2.BrnDialogClose }, { directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogCancel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogCancel, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmAlertDialogCancel]',
@@ -106,12 +106,12 @@ class HlmAlertDialogContent {
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     constructor() {
-        classes(() => 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-6 rounded-xl p-6 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content grid w-full outline-none');
+        classes(() => "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-6 rounded-xl p-6 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content grid w-full outline-none");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogContent, isStandalone: true, selector: "[hlmAlertDialogContent],hlm-alert-dialog-content", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-content" }, properties: { "attr.data-state": "state()", "attr.data-size": "size()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogContent, isStandalone: true, selector: "[hlmAlertDialogContent],hlm-alert-dialog-content", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-content" }, properties: { "attr.data-state": "state()", "attr.data-size": "size()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogContent, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogContent],hlm-alert-dialog-content',
@@ -125,12 +125,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmAlertDialogDescription {
     constructor() {
-        classes(() => 'text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3');
+        classes(() => "text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogDescription, isStandalone: true, selector: "[hlmAlertDialogDescription]", host: { attributes: { "data-slot": "alert-dialog-description" } }, hostDirectives: [{ directive: i1.BrnAlertDialogDescription }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogDescription, isStandalone: true, selector: "[hlmAlertDialogDescription]", host: { attributes: { "data-slot": "alert-dialog-description" } }, hostDirectives: [{ directive: i1.BrnAlertDialogDescription }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogDescription, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogDescription, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogDescription]',
@@ -141,12 +141,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmAlertDialogFooter {
     constructor() {
-        classes(() => 'flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end');
+        classes(() => "flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogFooter, isStandalone: true, selector: "[hlmAlertDialogFooter],hlm-alert-dialog-footer", host: { attributes: { "data-slot": "alert-dialog-footer" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogFooter, isStandalone: true, selector: "[hlmAlertDialogFooter],hlm-alert-dialog-footer", host: { attributes: { "data-slot": "alert-dialog-footer" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogFooter, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogFooter],hlm-alert-dialog-footer',
@@ -156,12 +156,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmAlertDialogHeader {
     constructor() {
-        classes(() => 'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]');
+        classes(() => "grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogHeader, isStandalone: true, selector: "[hlmAlertDialogHeader],hlm-alert-dialog-header", host: { attributes: { "data-slot": "alert-dialog-header" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogHeader, isStandalone: true, selector: "[hlmAlertDialogHeader],hlm-alert-dialog-header", host: { attributes: { "data-slot": "alert-dialog-header" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogHeader, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogHeader],hlm-alert-dialog-header',
@@ -173,10 +173,10 @@ class HlmAlertDialogMedia {
     constructor() {
         classes(() => "bg-muted mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(8)]");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogMedia, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogMedia, isStandalone: true, selector: "[hlmAlertDialogMedia],hlm-alert-dialog-media", host: { attributes: { "data-slot": "alert-dialog-media" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogMedia, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogMedia, isStandalone: true, selector: "[hlmAlertDialogMedia],hlm-alert-dialog-media", host: { attributes: { "data-slot": "alert-dialog-media" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogMedia, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogMedia, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogMedia],hlm-alert-dialog-media',
@@ -185,10 +185,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
         }], ctorParameters: () => [] });
 
 class HlmAlertDialogPortal {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogPortal, isStandalone: true, selector: "[hlmAlertDialogPortal]", hostDirectives: [{ directive: i1.BrnAlertDialogContent, inputs: ["context", "context", "class", "class"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogPortal, isStandalone: true, selector: "[hlmAlertDialogPortal]", hostDirectives: [{ directive: i1.BrnAlertDialogContent, inputs: ["context", "context", "class", "class"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogPortal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogPortal, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogPortal]',
@@ -198,12 +198,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmAlertDialogTitle {
     constructor() {
-        classes(() => 'text-lg font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2');
+        classes(() => "text-lg font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogTitle, isStandalone: true, selector: "[hlmAlertDialogTitle]", host: { attributes: { "data-slot": "alert-dialog-title" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTitle }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogTitle, isStandalone: true, selector: "[hlmAlertDialogTitle]", host: { attributes: { "data-slot": "alert-dialog-title" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTitle }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTitle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTitle, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAlertDialogTitle]',
@@ -213,10 +213,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
         }], ctorParameters: () => [] });
 
 class HlmAlertDialogTrigger {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogTrigger, isStandalone: true, selector: "button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]", host: { attributes: { "data-slot": "alert-dialog-trigger" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTrigger, inputs: ["id", "id", "brnAlertDialogTriggerFor", "hlmAlertDialogTriggerFor", "type", "type"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogTrigger, isStandalone: true, selector: "button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]", host: { attributes: { "data-slot": "alert-dialog-trigger" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTrigger, inputs: ["id", "id", "brnAlertDialogTriggerFor", "hlmAlertDialogTriggerFor", "type", "type"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]',
@@ -245,8 +245,8 @@ const HlmAlertDialogImports = [
     HlmAlertDialogTrigger,
 ];
 class HlmAlertDialogModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, imports: [HlmAlertDialog,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, imports: [HlmAlertDialog,
             HlmAlertDialogAction,
             HlmAlertDialogCancel,
             HlmAlertDialogContent,
@@ -269,9 +269,9 @@ class HlmAlertDialogModule {
             HlmAlertDialogPortal,
             HlmAlertDialogTitle,
             HlmAlertDialogTrigger] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...HlmAlertDialogImports],
@@ -284,4 +284,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { HlmAlertDialog, HlmAlertDialogAction, HlmAlertDialogCancel, HlmAlertDialogContent, HlmAlertDialogDescription, HlmAlertDialogFooter, HlmAlertDialogHeader, HlmAlertDialogImports, HlmAlertDialogMedia, HlmAlertDialogModule, HlmAlertDialogOverlay, HlmAlertDialogPortal, HlmAlertDialogTitle, HlmAlertDialogTrigger };
-//# sourceMappingURL=alert-dialog.mjs.map
+

package/aspect-ratio/README.md

@@ -1,11 +1,278 @@
-# AspectRatio
+# Aspect Ratio (`@egose/shadcn-theme-ng/aspect-ratio`)
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli).
+A layout helper in the shadcn/ui Aspect Ratio style: it forces a box to keep a fixed
+width-to-height proportion (16:9 video embeds, square thumbnails, 4:3 cards) regardless of the
+viewport. Content placed inside simply fills the ratio-locked frame.
 
-## Building
+This is a **standalone utility directive with no brain primitive**. `HlmAspectRatio` writes the
+numeric ratio to a `--ratio` CSS custom property and applies the `aspect-(--ratio)` Tailwind class;
+it accepts plain numbers, coercible values, or `"W/H"` strings such as `"16/9"`.
 
-To build the library, run:
+> **Ships as:** `@egose/shadcn-theme-ng/aspect-ratio` and `@egose/shadcn-theme-ng-tw/aspect-ratio`
+> (the `tw:`-prefixed Tailwind variant). Both expose the identical TypeScript surface; only the
+> emitted Tailwind class strings differ. See the [package README](../../README.md) for install
+> steps, peer dependencies, and Tailwind setup. Do not publish this project directory independently.
+
+## Installation
 
 ```bash
-ng build aspect-ratio
+# Plain Tailwind (no prefix)
+npm install @egose/shadcn-theme-ng
+
+# tw:-prefixed Tailwind variant
+npm install @egose/shadcn-theme-ng-tw
+```
+
+Peer dependencies (Angular core/common) are documented in the
+[package README](../../README.md#peer-dependencies). Runtime styling helper:
+`@egose/shadcn-theme-ng/utils` (`classes()`).
+
+## Imports
+
+All symbols are exported from the subpath root (`projects/aspect-ratio/src/public-api.ts`):
+
+```ts
+import { HlmAspectRatio, HlmAspectRatioImports, HlmAspectRatioModule } from '@egose/shadcn-theme-ng/aspect-ratio';
+// tw variant: replace with '@egose/shadcn-theme-ng-tw/aspect-ratio'
+```
+
+Standalone component — spread the `*Imports` array (single entry):
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-demo',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `...`,
+})
+export class DemoComponent {}
+```
+
+NgModule-based consumer — import the module:
+
+```ts
+import { NgModule } from '@angular/core';
+import { HlmAspectRatioModule } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@NgModule({ imports: [HlmAspectRatioModule] })
+export class DemoModule {}
 ```
+
+You can also import `HlmAspectRatio` itself directly — it is a standalone directive.
+
+## Anatomy / Structure
+
+```html
+<div [hlmAspectRatio]="16 / 9">
+  <img src="hero.jpg" alt="Hero" class="tw:h-full tw:w-full tw:object-cover tw:rounded-md" />
+</div>
+```
+
+Real selector (from source):
+
+| Class            | Selector           | Kind      |
+| ---------------- | ------------------ | --------- |
+| `HlmAspectRatio` | `[hlmAspectRatio]` | Directive |
+
+The host gets `data-slot="aspect-ratio"`, `[style.--ratio]` bound to the coerced value, and the
+`tw:relative tw:aspect-(--ratio)` classes. Anything projected inside lays out against that frame.
+
+## API reference
+
+### `HlmAspectRatio` — `[hlmAspectRatio]`
+
+| Input                                   | Type                    | Default | Description                                                                                                                                                                     |
+| --------------------------------------- | ----------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `hlmAspectRatio` (aliased as `ratio()`) | `number \| NumberInput` | `1`     | Width ÷ height. Accepts numbers (`1.777`), numeric strings (`"1.5"`), or `"W/H"` strings (`"16/9"`, `"4/3"`, `"1/1"`). Values that coerce to `≤ 0` (or `NaN`) fall back to `1`. |
+
+Coercion details (read from source): `"W/H"` strings are split on `/`, each side parsed with
+`parseInt`, then divided; the result passes through `coerceNumberProperty` from
+`@angular/cdk/coercion`. So `[hlmAspectRatio]="'16/9'"` ⇒ `16 / 9 ≈ 1.778`.
+
+No outputs, no methods — purely presentational.
+
+## Examples
+
+### 1. Basic 16:9 embed
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-ratio-basic',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `
+    <div [hlmAspectRatio]="16 / 9" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
+      <img src="https://picsum.photos/800/450" alt="Landscape" class="tw:h-full tw:w-full tw:object-cover" />
+    </div>
+  `,
+})
+export class RatioBasicComponent {}
+```
+
+```html
+<app-ratio-basic />
+```
+
+### 2. String ratios: square, portrait, cinematic
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-ratio-strings',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `
+    <div class="tw:grid tw:grid-cols-3 tw:gap-4">
+      <div hlmAspectRatio="1/1" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
+        <img src="https://picsum.photos/400/400" alt="Square" class="tw:h-full tw:w-full tw:object-cover" />
+      </div>
+      <div hlmAspectRatio="3/4" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
+        <img src="https://picsum.photos/300/400" alt="Portrait" class="tw:h-full tw:w-full tw:object-cover" />
+      </div>
+      <div hlmAspectRatio="21/9" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
+        <img src="https://picsum.photos/630/270" alt="Cinematic" class="tw:h-full tw:w-full tw:object-cover" />
+      </div>
+    </div>
+  `,
+})
+export class RatioStringsComponent {}
+```
+
+### 3. Video / iframe embed
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-ratio-video',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `
+    <div [hlmAspectRatio]="16 / 9" class="tw:overflow-hidden tw:rounded-lg tw:border">
+      <iframe
+        class="tw:absolute tw:inset-0 tw:h-full tw:w-full"
+        src="https://www.youtube.com/embed/dQw4w9WgXcQ"
+        title="Product tour"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+        allowfullscreen
+      ></iframe>
+    </div>
+  `,
+})
+export class RatioVideoComponent {}
+```
+
+(The host is `relative`, so absolute-positioned media pins to the frame.)
+
+### 4. Dynamic ratio from a signal (user-selectable)
+
+```ts
+import { Component, signal } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-ratio-dynamic',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `
+    <div class="tw:mb-3 tw:flex tw:gap-2">
+      @for (preset of presets; track preset.label) {
+        <button (click)="ratio.set(preset.value)" [disabled]="ratio() === preset.value">
+          {{ preset.label }}
+        </button>
+      }
+    </div>
+    <div [hlmAspectRatio]="ratio()" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
+      <img src="https://picsum.photos/800/600" alt="Preview" class="tw:h-full tw:w-full tw:object-cover" />
+    </div>
+  `,
+})
+export class RatioDynamicComponent {
+  readonly presets = [
+    { label: 'Square', value: 1 },
+    { label: '16:9', value: 16 / 9 },
+    { label: '4:3', value: 4 / 3 },
+  ];
+  readonly ratio = signal<number>(16 / 9);
+}
+```
+
+### 5. Card media header with overlay content
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+import { HlmBadge } from '@egose/shadcn-theme-ng/badge';
+
+@Component({
+  selector: 'app-ratio-card',
+  standalone: true,
+  imports: [...HlmAspectRatioImports, HlmBadge],
+  template: `
+    <article class="tw:overflow-hidden tw:rounded-lg tw:border">
+      <div hlmAspectRatio="16/9" class="tw:bg-muted">
+        <img src="https://picsum.photos/640/360" alt="Post cover" class="tw:h-full tw:w-full tw:object-cover" />
+        <span hlmBadge class="tw:absolute tw:top-2 tw:left-2">New</span>
+      </div>
+      <div class="tw:p-4">
+        <h3 class="tw:font-semibold">Ratio-locked covers</h3>
+        <p class="tw:text-sm tw:text-muted-foreground">Every card image lines up, whatever the source size.</p>
+      </div>
+    </article>
+  `,
+})
+export class RatioCardComponent {}
+```
+
+### 6. Invalid values fall back to square
+
+```ts
+import { Component } from '@angular/core';
+import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
+
+@Component({
+  selector: 'app-ratio-fallback',
+  standalone: true,
+  imports: [...HlmAspectRatioImports],
+  template: `
+    <!-- 0, negatives, and NaN coerce to ratio 1 (square) instead of breaking layout -->
+    <div [hlmAspectRatio]="userValue" class="tw:bg-muted tw:rounded-md">
+      <p class="tw:p-4 tw:text-sm">ratio input: {{ userValue }} → renders square</p>
+    </div>
+  `,
+})
+export class RatioFallbackComponent {
+  userValue = 0; // try -2, Number.NaN, or a valid number
+}
+```
+
+## Accessibility notes
+
+- The directive adds no semantics (`data-slot` only) — the _content_ carries meaning. Always give
+  images real `alt` text and iframes a `title`.
+- Do not use aspect-ratio boxes as click targets by themselves; put a real `<button>` or `<a>`
+  inside or around them so keyboard users get a focusable control.
+- Avoid extreme ratios for text content (e.g. `21/9` with paragraphs) — zoomed text can overflow
+  the locked frame. Prefer images/video, or allow the frame to grow with `min-h` utilities.
+
+## Theming / CSS variables
+
+The directive sets one custom property on its host: `--ratio` (unitless number). The frame size
+comes from the `aspect-(--ratio)` utility reading that property. You can read or override
+`--ratio` in your own CSS if you need derived sizing (e.g. `height: calc(100vw / var(--ratio))`).
+
+## Related subpaths
+
+- `@egose/shadcn-theme-ng/avatar` — fixed-size ratio-locked identity images
+- `@egose/shadcn-theme-ng/card` — cards whose media headers use ratio frames
+- `@egose/shadcn-theme-ng/carousel` — slides with consistent media proportions
+- `@egose/shadcn-theme-ng/skeleton` — ratio-shaped loading placeholders

package/aspect-ratio/fesm2022/aspect-ratio.mjs

@@ -21,12 +21,12 @@ class HlmAspectRatio {
             return coerced <= 0 ? 1 : coerced;
         } });
     constructor() {
-        classes(() => 'relative aspect-(--ratio)');
+        classes(() => "relative aspect-(--ratio)");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAspectRatio, isStandalone: true, selector: "[hlmAspectRatio]", inputs: { ratio: { classPropertyName: "ratio", publicName: "hlmAspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "aspect-ratio" }, properties: { "style.--ratio": "ratio()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAspectRatio, isStandalone: true, selector: "[hlmAspectRatio]", inputs: { ratio: { classPropertyName: "ratio", publicName: "hlmAspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "aspect-ratio" }, properties: { "style.--ratio": "ratio()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatio, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmAspectRatio]',
@@ -42,11 +42,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 const HlmAspectRatioImports = [HlmAspectRatio];
 class HlmAspectRatioModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, imports: [HlmAspectRatio], exports: [HlmAspectRatio] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, imports: [HlmAspectRatio], exports: [HlmAspectRatio] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...HlmAspectRatioImports],
@@ -59,4 +59,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { HlmAspectRatio, HlmAspectRatioImports, HlmAspectRatioModule };
-//# sourceMappingURL=aspect-ratio.mjs.map
+