@unipin/angular-applet 21.1.2 → 21.3.0

package/fesm2022/unipin-angular-applet-progress-bar.mjs

@@ -4,20 +4,20 @@ import { up } from '@unipin/angular-applet/common';
 
 class UpProgressBarDirective {
     constructor() {
-        this.max = input.required({ ...(ngDevMode ? { debugName: "max" } : {}) });
-        this.progress = input.required({ ...(ngDevMode ? { debugName: "progress" } : {}) });
+        this.max = input.required(...(ngDevMode ? [{ debugName: "max" }] : []));
+        this.progress = input.required(...(ngDevMode ? [{ debugName: "progress" }] : []));
         this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : {}), alias: 'class' });
         this._computedClass = computed(() => {
             return up('block w-full h-2 rounded overflow-hidden relative bg-muted', `before:content-[''] before:absolute before:top-0 before:left-0 before:h-full before:block before:bg-primary before:transition-all before:w-[var(--progress-width)]`, this.inlineClass());
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
         this._progressWidth = computed(() => {
             return `${Math.max(0, Math.min(100, (this.progress() / this.max()) * 100 || 0))}%`;
-        }, { ...(ngDevMode ? { debugName: "_progressWidth" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_progressWidth" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpProgressBarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: UpProgressBarDirective, isStandalone: true, selector: "[upProgressBar]", inputs: { max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: true, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()", "style.--progress-width": "_progressWidth()" } }, exportAs: ["upProgressBar"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpProgressBarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: UpProgressBarDirective, isStandalone: true, selector: "[upProgressBar]", inputs: { max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: true, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()", "style.--progress-width": "_progressWidth()" } }, exportAs: ["upProgressBar"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpProgressBarDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpProgressBarDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

package/fesm2022/unipin-angular-applet-progress-bar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"unipin-angular-applet-progress-bar.mjs","sources":["../../../projects/unipin-angular/progress-bar/progress-bar.directive.ts","../../../projects/unipin-angular/progress-bar/unipin-angular-applet-progress-bar.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\nimport { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Directive({\n  standalone: true,\n  exportAs: 'upProgressBar',\n  selector: '[upProgressBar]',\n  host: {\n    '[class]': '_computedClass()',\n    '[style.--progress-width]': '_progressWidth()',\n  },\n})\nexport class UpProgressBarDirective {\n\n  public readonly max = input.required<number>();\n  public readonly progress = input.required<number>();\n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'block w-full h-2 rounded overflow-hidden relative bg-muted',\n        `before:content-[''] before:absolute before:top-0 before:left-0 before:h-full before:block before:bg-primary before:transition-all before:w-[var(--progress-width)]`,\n        this.inlineClass()\n      );\n    }\n  );\n\n  protected readonly _progressWidth = computed(\n    () => {\n      return `${\n        Math.max(\n          0, \n          Math.min(\n            100, \n            (this.progress() / this.max()) * 100 || 0\n          )\n        )\n      }%`;\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAaa,sBAAsB,CAAA;AATnC,IAAA,WAAA,GAAA;AAWkB,QAAA,IAAA,CAAA,GAAG,GAAG,KAAK,CAAC,QAAQ,gDAAU;AAC9B,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,QAAQ,qDAAU;QACnC,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,wDAAI,KAAK,EAAE,OAAO,EAAA,CAAG;AAEpD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,4DAA4D,EAC5D,CAAA,kKAAA,CAAoK,EACpK,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,4DACF;AAEkB,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;AACH,YAAA,OAAO,CAAA,EACL,IAAI,CAAC,GAAG,CACN,CAAC,EACD,IAAI,CAAC,GAAG,CACN,GAAG,EACH,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC,CAC1C,CAEL,GAAG;AACL,QAAA,CAAC,4DACF;AACF,IAAA;8GA7BY,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,wBAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBATlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,eAAe;AACzB,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,kBAAkB;AAC7B,wBAAA,0BAA0B,EAAE,kBAAkB;AAC/C,qBAAA;AACF,iBAAA;;;ACZD;;AAEG;;;;"}
+{"version":3,"file":"unipin-angular-applet-progress-bar.mjs","sources":["../../../projects/unipin-angular/progress-bar/progress-bar.directive.ts","../../../projects/unipin-angular/progress-bar/unipin-angular-applet-progress-bar.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\nimport { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Directive({\n  standalone: true,\n  exportAs: 'upProgressBar',\n  selector: '[upProgressBar]',\n  host: {\n    '[class]': '_computedClass()',\n    '[style.--progress-width]': '_progressWidth()',\n  },\n})\nexport class UpProgressBarDirective {\n\n  public readonly max = input.required<number>();\n  public readonly progress = input.required<number>();\n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'block w-full h-2 rounded overflow-hidden relative bg-muted',\n        `before:content-[''] before:absolute before:top-0 before:left-0 before:h-full before:block before:bg-primary before:transition-all before:w-[var(--progress-width)]`,\n        this.inlineClass()\n      );\n    }\n  );\n\n  protected readonly _progressWidth = computed(\n    () => {\n      return `${\n        Math.max(\n          0, \n          Math.min(\n            100, \n            (this.progress() / this.max()) * 100 || 0\n          )\n        )\n      }%`;\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAaa,sBAAsB,CAAA;AATnC,IAAA,WAAA,GAAA;AAWkB,QAAA,IAAA,CAAA,GAAG,GAAG,KAAK,CAAC,QAAQ,8CAAU;AAC9B,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,QAAQ,mDAAU;QACnC,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,wDAAI,KAAK,EAAE,OAAO,EAAA,CAAG;AAEpD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,4DAA4D,EAC5D,CAAA,kKAAA,CAAoK,EACpK,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,0DACF;AAEkB,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;AACH,YAAA,OAAO,CAAA,EACL,IAAI,CAAC,GAAG,CACN,CAAC,EACD,IAAI,CAAC,GAAG,CACN,GAAG,EACH,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC,CAC1C,CAEL,GAAG;AACL,QAAA,CAAC,0DACF;AACF,IAAA;8GA7BY,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,wBAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBATlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,eAAe;AACzB,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,kBAAkB;AAC7B,wBAAA,0BAA0B,EAAE,kBAAkB;AAC/C,qBAAA;AACF,iBAAA;;;ACZD;;AAEG;;;;"}

package/fesm2022/unipin-angular-applet-skeleton.mjs

@@ -7,12 +7,12 @@ class UpSkeletonDirective {
         this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : {}), alias: 'class' });
         this._computedClass = computed(() => {
             return up('block animate-pulse rounded-md bg-muted', this.inlineClass());
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSkeletonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: UpSkeletonDirective, isStandalone: true, selector: "[upSkeleton]", inputs: { inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSkeleton"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSkeletonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: UpSkeletonDirective, isStandalone: true, selector: "[upSkeleton]", inputs: { inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSkeleton"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSkeletonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSkeletonDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

package/fesm2022/unipin-angular-applet-skeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"unipin-angular-applet-skeleton.mjs","sources":["../../../projects/unipin-angular/skeleton/skeleton.directive.ts","../../../projects/unipin-angular/skeleton/unipin-angular-applet-skeleton.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\nimport type { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Directive({\n  standalone: true,\n  exportAs: 'upSkeleton',\n  selector: '[upSkeleton]',\n  host: {\n    '[class]': '_computedClass()',\n  }\n})\nexport class UpSkeletonDirective {\n\n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'block animate-pulse rounded-md bg-muted',\n        this.inlineClass(),\n      );\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAYa,mBAAmB,CAAA;AARhC,IAAA,WAAA,GAAA;QAUkB,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,wDAAI,KAAK,EAAE,OAAO,EAAA,CAAG;AAEpD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,yCAAyC,EACzC,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,4DACF;AACF,IAAA;8GAZY,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAnB,mBAAmB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAR/B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,kBAAkB;AAC9B;AACF,iBAAA;;;ACXD;;AAEG;;;;"}
+{"version":3,"file":"unipin-angular-applet-skeleton.mjs","sources":["../../../projects/unipin-angular/skeleton/skeleton.directive.ts","../../../projects/unipin-angular/skeleton/unipin-angular-applet-skeleton.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\nimport type { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Directive({\n  standalone: true,\n  exportAs: 'upSkeleton',\n  selector: '[upSkeleton]',\n  host: {\n    '[class]': '_computedClass()',\n  }\n})\nexport class UpSkeletonDirective {\n\n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'block animate-pulse rounded-md bg-muted',\n        this.inlineClass(),\n      );\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAYa,mBAAmB,CAAA;AARhC,IAAA,WAAA,GAAA;QAUkB,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,wDAAI,KAAK,EAAE,OAAO,EAAA,CAAG;AAEpD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,yCAAyC,EACzC,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,0DACF;AACF,IAAA;8GAZY,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAnB,mBAAmB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAR/B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,kBAAkB;AAC9B;AACF,iBAAA;;;ACXD;;AAEG;;;;"}

package/fesm2022/unipin-angular-applet-spinner.mjs

@@ -5,13 +5,13 @@ import { up } from '@unipin/angular-applet/common';
 class UpSpinnerComponent {
     constructor() {
         this.stokeWidth = input(8, { ...(ngDevMode ? { debugName: "stokeWidth" } : {}), transform: numberAttribute });
-        this.inlineClass = input({ alias: 'class' }, { ...(ngDevMode ? { debugName: "inlineClass" } : {}) });
+        this.inlineClass = input({ alias: 'class' }, ...(ngDevMode ? [{ debugName: "inlineClass" }] : []));
         this._computedClass = computed(() => {
             return up('inline-block size-8 text-primary', this.inlineClass());
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: UpSpinnerComponent, isStandalone: true, selector: "up-spinner", inputs: { stokeWidth: { classPropertyName: "stokeWidth", publicName: "stokeWidth", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "inlineClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: UpSpinnerComponent, isStandalone: true, selector: "up-spinner", inputs: { stokeWidth: { classPropertyName: "stokeWidth", publicName: "stokeWidth", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "inlineClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0, template: `
     <svg
       aria-hidden="true"
       viewBox="0 0 80 80"
@@ -71,7 +71,7 @@ class UpSpinnerComponent {
     </svg>
   `, isInline: true, styles: ["@keyframes lds-ring{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-ring-1{animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;animation-delay:-.45s;transform-origin:50% 50%}.animate-ring-2{animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;animation-delay:-.3s;transform-origin:50% 50%}.animate-ring-3{animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;animation-delay:-.15s;transform-origin:50% 50%}.animate-ring-4{animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;animation-delay:0s;transform-origin:50% 50%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSpinnerComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'up-spinner', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class]': '_computedClass()',

package/fesm2022/unipin-angular-applet-spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"unipin-angular-applet-spinner.mjs","sources":["../../../projects/unipin-angular/spinner/spinner.component.ts","../../../projects/unipin-angular/spinner/unipin-angular-applet-spinner.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, numberAttribute } from '@angular/core';\nimport { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Component({\n  standalone: true,\n  selector: 'up-spinner',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': '_computedClass()',\n  },\n  template: `\n    <svg\n      aria-hidden=\"true\"\n      viewBox=\"0 0 80 80\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-1\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"  \n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-2\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-3\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-4\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n    </svg>\n  `,\n  styles: `\n    @keyframes lds-ring {\n      0% {\n        transform: rotate(0deg);\n      }\n      100% {\n        transform: rotate(360deg);\n      }\n    }\n    \n    .animate-ring-1 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.45s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-2 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.3s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-3 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.15s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-4 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: 0s;\n      transform-origin: 50% 50%;\n    }\n  `\n})\nexport class UpSpinnerComponent {\n  \n  public readonly stokeWidth = input(8, { transform: numberAttribute });\n  public readonly inlineClass = input<ClassValue>({ alias: 'class' });\n  \n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'inline-block size-8 text-primary', \n        this.inlineClass()\n      );\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAyGa,kBAAkB,CAAA;AArG/B,IAAA,WAAA,GAAA;QAuGkB,IAAA,CAAA,UAAU,GAAG,KAAK,CAAC,CAAC,uDAAI,SAAS,EAAE,eAAe,EAAA,CAAG;QACrD,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,KAAK,EAAE,OAAO,EAAE,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,aAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAC;AAEhD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,kCAAkC,EAClC,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,4DACF;AACF,IAAA;8GAbY,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EA9FnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,wiBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAoCU,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBArG9B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,YACN,YAAY,EAAA,eAAA,EACL,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,SAAS,EAAE,kBAAkB;qBAC9B,EAAA,QAAA,EACS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,wiBAAA,CAAA,EAAA;;;ACrEH;;AAEG;;;;"}
+{"version":3,"file":"unipin-angular-applet-spinner.mjs","sources":["../../../projects/unipin-angular/spinner/spinner.component.ts","../../../projects/unipin-angular/spinner/unipin-angular-applet-spinner.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, numberAttribute } from '@angular/core';\nimport { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\n\n@Component({\n  standalone: true,\n  selector: 'up-spinner',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': '_computedClass()',\n  },\n  template: `\n    <svg\n      aria-hidden=\"true\"\n      viewBox=\"0 0 80 80\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dashoffset=\"0\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-1\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"  \n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-2\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-3\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n      \n      <circle\n        r=\"28\"\n        cx=\"40\"\n        cy=\"40\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-dasharray=\"44 132\"\n        class=\"animate-ring-4\"\n        [attr.stroke-width]=\"stokeWidth()\"\n      />\n    </svg>\n  `,\n  styles: `\n    @keyframes lds-ring {\n      0% {\n        transform: rotate(0deg);\n      }\n      100% {\n        transform: rotate(360deg);\n      }\n    }\n    \n    .animate-ring-1 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.45s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-2 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.3s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-3 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: -0.15s;\n      transform-origin: 50% 50%;\n    }\n    \n    .animate-ring-4 {\n      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n      animation-delay: 0s;\n      transform-origin: 50% 50%;\n    }\n  `\n})\nexport class UpSpinnerComponent {\n  \n  public readonly stokeWidth = input(8, { transform: numberAttribute });\n  public readonly inlineClass = input<ClassValue>({ alias: 'class' });\n  \n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'inline-block size-8 text-primary', \n        this.inlineClass()\n      );\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAyGa,kBAAkB,CAAA;AArG/B,IAAA,WAAA,GAAA;QAuGkB,IAAA,CAAA,UAAU,GAAG,KAAK,CAAC,CAAC,uDAAI,SAAS,EAAE,eAAe,EAAA,CAAG;QACrD,IAAA,CAAA,WAAW,GAAG,KAAK,CAAa,EAAE,KAAK,EAAE,OAAO,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAEhD,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAC1C,MAAK;YACH,OAAO,EAAE,CACP,kCAAkC,EAClC,IAAI,CAAC,WAAW,EAAE,CACnB;AACH,QAAA,CAAC,0DACF;AACF,IAAA;8GAbY,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EA9FnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,wiBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAoCU,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBArG9B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,YACN,YAAY,EAAA,eAAA,EACL,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,SAAS,EAAE,kBAAkB;qBAC9B,EAAA,QAAA,EACS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,wiBAAA,CAAA,EAAA;;;ACrEH;;AAEG;;;;"}

package/fesm2022/unipin-angular-applet-stepper.mjs

@@ -0,0 +1,288 @@
+import * as i0 from '@angular/core';
+import { contentChildren, forwardRef, input, computed, signal, effect, ChangeDetectionStrategy, Component, inject, booleanAttribute, Directive } from '@angular/core';
+import { up } from '@unipin/angular-applet/common';
+
+class UpStepperComponent {
+    constructor() {
+        this.stepContents = contentChildren(forwardRef(() => UpStepperContentDirective), { ...(ngDevMode ? { debugName: "stepContents" } : {}), descendants: true });
+        this.initialStep = input(1, ...(ngDevMode ? [{ debugName: "initialStep" }] : []));
+        this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : {}), alias: 'class' });
+        this._computedClass = computed(() => {
+            return up('flex flex-col gap-6', this.inlineClass());
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+        this.activeStep = signal(1, ...(ngDevMode ? [{ debugName: "activeStep" }] : []));
+        this.steps = signal([], ...(ngDevMode ? [{ debugName: "steps" }] : []));
+        this.visibleSteps = computed(() => {
+            const steps = this.steps();
+            const active = this.activeStep() - 1;
+            const start = Math.max(0, Math.min(active - 1, steps.length - 3));
+            const end = Math.min(start + 3, steps.length);
+            return steps.slice(start, end).map((step, i) => {
+                return {
+                    ...step,
+                    index: start + i,
+                };
+            });
+        }, ...(ngDevMode ? [{ debugName: "visibleSteps" }] : []));
+        effect(() => {
+            const initialStep = this.initialStep();
+            const stepContents = this.stepContents();
+            stepContents.forEach((content, index) => {
+                content.index.set(index + 1);
+            });
+            this.steps.set(stepContents.map((content, index) => {
+                return {
+                    label: content.label(),
+                    allowReopen: content.allowReopen(),
+                    status: this.getStepperStatus(index, initialStep)
+                };
+            }));
+        });
+    }
+    ngOnInit() {
+        this.activeStep.set(this.initialStep());
+    }
+    prevStep() {
+        const current = this.activeStep();
+        const target = current - 1;
+        const targetStep = this.steps()[target - 1];
+        if (target < 1 ||
+            !targetStep ||
+            !targetStep.allowReopen) {
+            return;
+        }
+        this.activeStep.set(target);
+    }
+    nextStep() {
+        const current = this.activeStep();
+        if (current >= this.steps().length) {
+            return;
+        }
+        this.steps.update((list) => {
+            return list.map((step, index) => {
+                if (step.status === 'COMPLETED') {
+                    return step;
+                }
+                return {
+                    ...step,
+                    status: index === current - 1 ? 'COMPLETED' : (index === current ? 'PENDING' : step.status)
+                };
+            });
+        });
+        this.activeStep.update((prev) => prev + 1);
+    }
+    getStepperStatus(i, initialStep) {
+        const init = initialStep - 1;
+        if (i < init)
+            return 'COMPLETED';
+        if (i === init)
+            return 'PENDING';
+        return 'DISABLED';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: UpStepperComponent, isStandalone: true, selector: "up-stepper", inputs: { initialStep: { classPropertyName: "initialStep", publicName: "initialStep", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, queries: [{ propertyName: "stepContents", predicate: i0.forwardRef(() => UpStepperContentDirective), descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div class="hidden sm:flex items-center justify-between select-none shrink-0">
+      @for (step of steps(); track $index) {
+        <div class="flex flex-col items-center relative lg:static lg:flex-row lg:gap-2">
+          <div
+            class="size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300"
+            [class.cursor-pointer]="step.allowReopen && step.status !== 'DISABLED'"
+
+            [class.bg-muted]="($index + 1) > activeStep()"
+            [class.bg-primary]="($index + 1) <= activeStep()"
+
+            [class.text-white]="($index + 1) <= activeStep()"
+            [class.text-muted-foreground]="($index + 1) > activeStep()"
+            
+            (click)="step.allowReopen && step.status !== 'DISABLED'? this.activeStep.set($index + 1) : null"
+          >
+            {{ $index + 1 }}
+          </div>
+          
+          <div 
+            class="absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base"
+            [class.hidden]="($index + 1) !== activeStep()"
+          >
+            {{ step.label }}
+          </div>
+        </div>
+        
+        @if (!$last) {
+          <div class="flex-1 h-0.5 min-w-5 mx-2">
+            <div 
+              class="size-full transition-all duration-300"
+              [class.bg-muted]="($index + 1) >= activeStep()"
+              [class.bg-primary]="($index + 1) < activeStep()"
+            >
+            </div>
+          </div>
+        }
+      }
+    </div>
+
+    <div class="flex sm:hidden items-center justify-between select-none shrink-0">
+      @for (step of visibleSteps(); track step.index) {
+        <div class="flex flex-col items-center relative lg:static lg:flex-row lg:gap-2">
+          <div 
+            class="size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300"
+            [class.bg-muted]="(step.index + 1) > activeStep()"
+            [class.bg-primary]="(step.index + 1) <= activeStep()"
+            
+            [class.text-white]="(step.index + 1) <= activeStep()"
+            [class.text-muted-foreground]="(step.index + 1) > activeStep()"
+          >
+            {{ step.index + 1 }}
+          </div>
+          
+          <div 
+            class="absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base"
+            [class.hidden]="(step.index + 1) !== activeStep()"
+          >
+            {{ step.label }}
+          </div>
+        </div>
+        
+        @if (!$last) {
+          <div class="flex-1 h-0.5 mx-2">
+            <div 
+              class="size-full transition-all duration-300"
+              [class.bg-muted]="($index + 1) >= activeStep()"
+              [class.bg-primary]="($index + 1) < activeStep()"
+            >
+            </div>
+          </div>
+        }
+      }
+    </div>
+
+    <!-- stepper content -->
+    <ng-content/>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpStepperComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'up-stepper',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        '[class]': '_computedClass()',
+                    },
+                    template: `
+    <div class="hidden sm:flex items-center justify-between select-none shrink-0">
+      @for (step of steps(); track $index) {
+        <div class="flex flex-col items-center relative lg:static lg:flex-row lg:gap-2">
+          <div
+            class="size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300"
+            [class.cursor-pointer]="step.allowReopen && step.status !== 'DISABLED'"
+
+            [class.bg-muted]="($index + 1) > activeStep()"
+            [class.bg-primary]="($index + 1) <= activeStep()"
+
+            [class.text-white]="($index + 1) <= activeStep()"
+            [class.text-muted-foreground]="($index + 1) > activeStep()"
+            
+            (click)="step.allowReopen && step.status !== 'DISABLED'? this.activeStep.set($index + 1) : null"
+          >
+            {{ $index + 1 }}
+          </div>
+          
+          <div 
+            class="absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base"
+            [class.hidden]="($index + 1) !== activeStep()"
+          >
+            {{ step.label }}
+          </div>
+        </div>
+        
+        @if (!$last) {
+          <div class="flex-1 h-0.5 min-w-5 mx-2">
+            <div 
+              class="size-full transition-all duration-300"
+              [class.bg-muted]="($index + 1) >= activeStep()"
+              [class.bg-primary]="($index + 1) < activeStep()"
+            >
+            </div>
+          </div>
+        }
+      }
+    </div>
+
+    <div class="flex sm:hidden items-center justify-between select-none shrink-0">
+      @for (step of visibleSteps(); track step.index) {
+        <div class="flex flex-col items-center relative lg:static lg:flex-row lg:gap-2">
+          <div 
+            class="size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300"
+            [class.bg-muted]="(step.index + 1) > activeStep()"
+            [class.bg-primary]="(step.index + 1) <= activeStep()"
+            
+            [class.text-white]="(step.index + 1) <= activeStep()"
+            [class.text-muted-foreground]="(step.index + 1) > activeStep()"
+          >
+            {{ step.index + 1 }}
+          </div>
+          
+          <div 
+            class="absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base"
+            [class.hidden]="(step.index + 1) !== activeStep()"
+          >
+            {{ step.label }}
+          </div>
+        </div>
+        
+        @if (!$last) {
+          <div class="flex-1 h-0.5 mx-2">
+            <div 
+              class="size-full transition-all duration-300"
+              [class.bg-muted]="($index + 1) >= activeStep()"
+              [class.bg-primary]="($index + 1) < activeStep()"
+            >
+            </div>
+          </div>
+        }
+      }
+    </div>
+
+    <!-- stepper content -->
+    <ng-content/>
+  `
+                }]
+        }], ctorParameters: () => [], propDecorators: { stepContents: [{ type: i0.ContentChildren, args: [forwardRef(() => UpStepperContentDirective), { ...{
+                            descendants: true
+                        }, isSignal: true }] }], initialStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialStep", required: false }] }], inlineClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+class UpStepperContentDirective {
+    constructor() {
+        this.parent = inject(forwardRef(() => UpStepperComponent));
+        this.label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.allowReopen = input(true, { ...(ngDevMode ? { debugName: "allowReopen" } : {}), transform: booleanAttribute });
+        this.isActive = signal(false, ...(ngDevMode ? [{ debugName: "isActive" }] : []));
+        this.index = signal(null, ...(ngDevMode ? [{ debugName: "index" }] : []));
+        effect(() => {
+            if (!this.parent) {
+                return;
+            }
+            this.isActive.set(this.parent.activeStep() === this.index());
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpStepperContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: UpStepperContentDirective, isStandalone: true, selector: "[upStepperContent]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, allowReopen: { classPropertyName: "allowReopen", publicName: "allowReopen", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "hidden": "!isActive()" } }, exportAs: ["upStepperContent"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpStepperContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    exportAs: 'upStepperContent',
+                    selector: '[upStepperContent]',
+                    host: {
+                        '[hidden]': '!isActive()'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], allowReopen: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowReopen", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { UpStepperComponent, UpStepperContentDirective };
+//# sourceMappingURL=unipin-angular-applet-stepper.mjs.map

package/fesm2022/unipin-angular-applet-stepper.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"unipin-angular-applet-stepper.mjs","sources":["../../../projects/unipin-angular/stepper/stepper.component.ts","../../../projects/unipin-angular/stepper/stepper-content.directive.ts","../../../projects/unipin-angular/stepper/unipin-angular-applet-stepper.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, contentChildren, effect, forwardRef, input, OnInit, signal } from '@angular/core';\nimport { ClassValue } from 'clsx';\nimport { up } from '@unipin/angular-applet/common';\nimport { UpStepperContentDirective } from './stepper-content.directive';\n\n\ntype StepperStep = {\n  label: string;\n  allowReopen: boolean;\n  status: 'PENDING' | 'DISABLED' | 'COMPLETED';\n}\n\n@Component({\n  standalone: true,\n  selector: 'up-stepper',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': '_computedClass()',\n  },\n  template: `\n    <div class=\"hidden sm:flex items-center justify-between select-none shrink-0\">\n      @for (step of steps(); track $index) {\n        <div class=\"flex flex-col items-center relative lg:static lg:flex-row lg:gap-2\">\n          <div\n            class=\"size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300\"\n            [class.cursor-pointer]=\"step.allowReopen && step.status !== 'DISABLED'\"\n\n            [class.bg-muted]=\"($index + 1) > activeStep()\"\n            [class.bg-primary]=\"($index + 1) <= activeStep()\"\n\n            [class.text-white]=\"($index + 1) <= activeStep()\"\n            [class.text-muted-foreground]=\"($index + 1) > activeStep()\"\n            \n            (click)=\"step.allowReopen && step.status !== 'DISABLED'? this.activeStep.set($index + 1) : null\"\n          >\n            {{ $index + 1 }}\n          </div>\n          \n          <div \n            class=\"absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base\"\n            [class.hidden]=\"($index + 1) !== activeStep()\"\n          >\n            {{ step.label }}\n          </div>\n        </div>\n        \n        @if (!$last) {\n          <div class=\"flex-1 h-0.5 min-w-5 mx-2\">\n            <div \n              class=\"size-full transition-all duration-300\"\n              [class.bg-muted]=\"($index + 1) >= activeStep()\"\n              [class.bg-primary]=\"($index + 1) < activeStep()\"\n            >\n            </div>\n          </div>\n        }\n      }\n    </div>\n\n    <div class=\"flex sm:hidden items-center justify-between select-none shrink-0\">\n      @for (step of visibleSteps(); track step.index) {\n        <div class=\"flex flex-col items-center relative lg:static lg:flex-row lg:gap-2\">\n          <div \n            class=\"size-8 rounded-full flex items-center justify-center shrink-0 text-sm font-semibold transition-all duration-300\"\n            [class.bg-muted]=\"(step.index + 1) > activeStep()\"\n            [class.bg-primary]=\"(step.index + 1) <= activeStep()\"\n            \n            [class.text-white]=\"(step.index + 1) <= activeStep()\"\n            [class.text-muted-foreground]=\"(step.index + 1) > activeStep()\"\n          >\n            {{ step.index + 1 }}\n          </div>\n          \n          <div \n            class=\"absolute top-10 text-xs text-primary font-medium whitespace-nowrap transition-opacity duration-300 lg:static lg:text-base\"\n            [class.hidden]=\"(step.index + 1) !== activeStep()\"\n          >\n            {{ step.label }}\n          </div>\n        </div>\n        \n        @if (!$last) {\n          <div class=\"flex-1 h-0.5 mx-2\">\n            <div \n              class=\"size-full transition-all duration-300\"\n              [class.bg-muted]=\"($index + 1) >= activeStep()\"\n              [class.bg-primary]=\"($index + 1) < activeStep()\"\n            >\n            </div>\n          </div>\n        }\n      }\n    </div>\n\n    <!-- stepper content -->\n    <ng-content/>\n  `\n})\nexport class UpStepperComponent implements OnInit {\n  \n  public readonly stepContents = contentChildren(\n    forwardRef(() => UpStepperContentDirective),\n    { \n      descendants: true \n    }\n  );\n\n  public readonly initialStep = input<number>(1); \n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'flex flex-col gap-6',\n        this.inlineClass()\n      );\n    }\n  );\n\n  public readonly activeStep = signal<number>(1);\n  public readonly steps = signal<StepperStep[]>([]);\n\n  public readonly visibleSteps = computed(\n    () => {\n      const steps = this.steps();\n      const active = this.activeStep() - 1;\n\n      const start = Math.max(0, Math.min(active - 1, steps.length - 3));\n      const end = Math.min(start + 3, steps.length);\n\n      return steps.slice(start, end).map(\n        (step, i) => {\n          return {\n            ...step,\n            index: start + i,\n          };\n        }\n      );\n    }\n  );\n\n  constructor() {\n    effect(\n      () => {\n        const initialStep = this.initialStep();\n        const stepContents = this.stepContents();\n\n        stepContents.forEach(\n          (content, index) => {\n            content.index.set(index + 1);\n          }\n        );\n\n        this.steps.set(\n          stepContents.map(\n            (content, index) => {\n              return {\n                label: content.label(),\n                allowReopen: content.allowReopen(),\n                status: this.getStepperStatus(index, initialStep)\n              };\n            }\n          )\n        );\n      }\n    );\n  }\n\n  public ngOnInit(): void{\n    this.activeStep.set(this.initialStep());\n  }\n\n  public prevStep(): void{\n    const current = this.activeStep();\n    const target = current - 1;\n    const targetStep = this.steps()[target - 1];\n\n    if (\n      target < 1 || \n      !targetStep || \n      !targetStep.allowReopen\n    ) {\n      return;\n    }\n    this.activeStep.set(target);\n  }\n\n  public nextStep(): void{\n    const current = this.activeStep();\n    if (current >= this.steps().length) {\n      return;\n    }\n\n    this.steps.update(\n      (list) => {\n        return list.map(\n          (step, index) => {\n            if (step.status === 'COMPLETED') {\n              return step;\n            }\n\n            return {\n              ...step,\n              status: index === current - 1? 'COMPLETED' : (index === current? 'PENDING' : step.status)\n            };\n          }\n        );\n      }\n    );\n    this.activeStep.update((prev) => prev + 1);\n  }\n\n  protected getStepperStatus(i: number, initialStep: number): StepperStep['status']{\n    const init = initialStep - 1;\n    \n    if (i < init) return 'COMPLETED';\n    if (i === init) return 'PENDING';\n    return 'DISABLED';\n  }\n}\n","import { booleanAttribute, Directive, effect, forwardRef, inject, input, signal } from '@angular/core';\nimport { UpStepperComponent } from './stepper.component';\n\n\n@Directive({\n  standalone: true,\n  exportAs: 'upStepperContent',\n  selector: '[upStepperContent]',\n  host: {\n    '[hidden]': '!isActive()'\n  }\n})\nexport class UpStepperContentDirective {\n  \n  public readonly parent = inject(forwardRef(() => UpStepperComponent));\n  \n  public readonly label = input.required<string>();\n  public readonly allowReopen = input(true, { transform: booleanAttribute});\n  \n  public readonly isActive = signal<boolean>(false);\n  public readonly index = signal<number | null>(null);\n\n  constructor() {\n    effect(\n      () => {\n        if (!this.parent) {\n          return;\n        }\n        this.isActive.set(this.parent.activeStep() === this.index());\n      }\n    );\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/unipin-angular-applet-swipeable.mjs

@@ -16,15 +16,15 @@ class UpSwipeableContentDirective {
           select-none
           w-fit h-fit
         `, this.inlineClass());
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     }
     translateX(x) {
         this.element.style.transform = `translateX(${x}px)`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: UpSwipeableContentDirective, isStandalone: true, selector: "[upSwipeableContent]", inputs: { inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableContent"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: UpSwipeableContentDirective, isStandalone: true, selector: "[upSwipeableContent]", inputs: { inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableContent"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableContentDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -38,16 +38,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImpor
 
 class UpSwipeableButtonsDirective {
     constructor() {
-        this.side = input.required({ ...(ngDevMode ? { debugName: "side" } : {}) });
+        this.side = input.required(...(ngDevMode ? [{ debugName: "side" }] : []));
         this.element = inject((ElementRef)).nativeElement;
         this._computedClass = computed(() => {
             return up('absolute top-px bottom-px h-auto w-2/5 flex items-stretch z-0', this.side() === 'left' ? 'left-px flex-row' : 'right-px flex-row-reverse');
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableButtonsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: UpSwipeableButtonsDirective, isStandalone: true, selector: "[upSwipeableButtons]", inputs: { side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableButtons"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableButtonsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: UpSwipeableButtonsDirective, isStandalone: true, selector: "[upSwipeableButtons]", inputs: { side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableButtons"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableButtonsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableButtonsDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -61,20 +61,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImpor
 
 class UpSwipeableDirective {
     constructor() {
-        this.threshold = input(20, { ...(ngDevMode ? { debugName: "threshold" } : {}) });
-        this.overSwipeThreshold = input(75, { ...(ngDevMode ? { debugName: "overSwipeThreshold" } : {}) });
+        this.threshold = input(20, ...(ngDevMode ? [{ debugName: "threshold" }] : []));
+        this.overSwipeThreshold = input(75, ...(ngDevMode ? [{ debugName: "overSwipeThreshold" }] : []));
         this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : {}), alias: 'class' });
         this.clicked = output();
         this.leftSwiped = output();
         this.rightSwiped = output();
-        this.content = contentChild(UpSwipeableContentDirective, { ...(ngDevMode ? { debugName: "content" } : {}) });
-        this.buttonContainers = contentChildren(UpSwipeableButtonsDirective, { ...(ngDevMode ? { debugName: "buttonContainers" } : {}) });
-        this.containerWidth = signal(0, { ...(ngDevMode ? { debugName: "containerWidth" } : {}) });
-        this.buttonWidth = signal({ left: 0, right: 0 }, { ...(ngDevMode ? { debugName: "buttonWidth" } : {}) });
-        this.openSide = signal(null, { ...(ngDevMode ? { debugName: "openSide" } : {}) });
+        this.content = contentChild(UpSwipeableContentDirective, ...(ngDevMode ? [{ debugName: "content" }] : []));
+        this.buttonContainers = contentChildren(UpSwipeableButtonsDirective, ...(ngDevMode ? [{ debugName: "buttonContainers" }] : []));
+        this.containerWidth = signal(0, ...(ngDevMode ? [{ debugName: "containerWidth" }] : []));
+        this.buttonWidth = signal({ left: 0, right: 0 }, ...(ngDevMode ? [{ debugName: "buttonWidth" }] : []));
+        this.openSide = signal(null, ...(ngDevMode ? [{ debugName: "openSide" }] : []));
         this._computedClass = computed(() => {
             return up('relative w-fit overflow-hidden rounded-md touch-pan-y isolate', this.inlineClass());
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
         this.startX = 0;
         this.currentX = 0;
         this.isTouch = false;
@@ -204,10 +204,10 @@ class UpSwipeableDirective {
         }
         this.rightSwiped.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.0.2", type: UpSwipeableDirective, isStandalone: true, selector: "[upSwipeable]", inputs: { threshold: { classPropertyName: "threshold", publicName: "threshold", isSignal: true, isRequired: false, transformFunction: null }, overSwipeThreshold: { classPropertyName: "overSwipeThreshold", publicName: "overSwipeThreshold", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked", leftSwiped: "leftSwiped", rightSwiped: "rightSwiped" }, host: { listeners: { "mousedown": "onMouseDown($event)", "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchmove": "onTouchMove($event)", "touchend": "onTouchEnd($event)" }, properties: { "class": "_computedClass()" } }, queries: [{ propertyName: "content", first: true, predicate: UpSwipeableContentDirective, descendants: true, isSignal: true }, { propertyName: "buttonContainers", predicate: UpSwipeableButtonsDirective, isSignal: true }], exportAs: ["upSwipeable"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.1.5", type: UpSwipeableDirective, isStandalone: true, selector: "[upSwipeable]", inputs: { threshold: { classPropertyName: "threshold", publicName: "threshold", isSignal: true, isRequired: false, transformFunction: null }, overSwipeThreshold: { classPropertyName: "overSwipeThreshold", publicName: "overSwipeThreshold", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked", leftSwiped: "leftSwiped", rightSwiped: "rightSwiped" }, host: { listeners: { "mousedown": "onMouseDown($event)", "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchmove": "onTouchMove($event)", "touchend": "onTouchEnd($event)" }, properties: { "class": "_computedClass()" } }, queries: [{ propertyName: "content", first: true, predicate: UpSwipeableContentDirective, descendants: true, isSignal: true }, { propertyName: "buttonContainers", predicate: UpSwipeableButtonsDirective, isSignal: true }], exportAs: ["upSwipeable"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -245,12 +245,12 @@ class UpSwipeableButtonDirective extends UpButtonDirective {
                 size: this.size(),
                 variant: this.variant(),
             }), this.inlineClass(), 'h-full rounded-none flex-1');
-        }, { ...(ngDevMode ? { debugName: "_computedClass" } : {}) });
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: UpSwipeableButtonDirective, isStandalone: true, selector: "[upSwipeableBtn]", host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableBtn"], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: UpSwipeableButtonDirective, isStandalone: true, selector: "[upSwipeableBtn]", host: { properties: { "class": "_computedClass()" } }, exportAs: ["upSwipeableBtn"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UpSwipeableButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: UpSwipeableButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,