@shival99/z-ui 2.5.11 → 2.6.0

package/fesm2022/shival99-z-ui-components-z-switch.mjs

@@ -9,8 +9,8 @@ import { cva } from 'class-variance-authority';
 const Z_SWITCH_INNER_TEXT_MAX_LENGTH = 8;
 
 const zSwitchVariants = cva([
-    'relative inline-flex shrink-0 cursor-pointer items-center rounded-(--radius-pill)',
-    'transition-colors duration-200',
+    'group relative inline-flex shrink-0 cursor-pointer items-center rounded-(--radius-pill)',
+    'transition-colors duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',
     'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
     'disabled:cursor-not-allowed disabled:opacity-50',
     'bg-input',
@@ -40,8 +40,9 @@ const zSwitchVariants = cva([
 });
 const zSwitchThumbVariants = cva([
     'pointer-events-none flex items-center justify-center rounded-(--radius-pill) bg-white ring-0',
-    'shadow-[0_2px_4px_rgba(0,0,0,0.2)] transition-all duration-200',
+    'shadow-[0_2px_4px_rgba(0,0,0,0.2)] transition-all duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',
     'absolute top-1/2 -translate-y-1/2 z-10',
+    'group-active:scale-[0.9]',
 ], {
     variants: {
         zSize: {
@@ -79,6 +80,21 @@ const zSwitchThumbVariants = cva([
         zMode: 'default',
     },
 });
+const zSwitchDotVariants = cva([
+    'pointer-events-none rounded-(--radius-pill) bg-destructive transition-colors duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',
+    'data-[state=checked]:bg-primary',
+], {
+    variants: {
+        zSize: {
+            sm: 'size-1.5',
+            default: 'size-2',
+            lg: 'size-2.5',
+        },
+    },
+    defaultVariants: {
+        zSize: 'default',
+    },
+});
 const zSwitchLabelVariants = cva('select-none cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70', {
     variants: {
         zSize: {
@@ -139,6 +155,8 @@ class ZSwitchComponent {
     ...(ngDevMode ? [{ debugName: "zSize" }] : /* istanbul ignore next */ []));
     zMode = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "zMode" }] : /* istanbul ignore next */ []));
+    zVariant = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zVariant" }] : /* istanbul ignore next */ []));
     zLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "zLabel" }] : /* istanbul ignore next */ []));
     zText = input('', /* @ts-ignore */
@@ -160,6 +178,8 @@ class ZSwitchComponent {
     ...(ngDevMode ? [{ debugName: "zChecked" }] : /* istanbul ignore next */ []));
     isInnerMode = computed(() => this.zMode() === 'inner', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isInnerMode" }] : /* istanbul ignore next */ []));
+    isDotVariant = computed(() => this.zVariant() === 'dot', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDotVariant" }] : /* istanbul ignore next */ []));
     _disabled = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_disabled" }] : /* istanbul ignore next */ []));
     isDisabled = computed(() => this.zDisabled() || this._disabled() || this.zLoading(), /* @ts-ignore */
@@ -176,6 +196,8 @@ class ZSwitchComponent {
     ...(ngDevMode ? [{ debugName: "switchClasses" }] : /* istanbul ignore next */ []));
     thumbClasses = computed(() => zMergeClasses(zSwitchThumbVariants({ zSize: this.zSize(), zMode: this.zMode() }), this.zThumbClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "thumbClasses" }] : /* istanbul ignore next */ []));
+    dotClasses = computed(() => zSwitchDotVariants({ zSize: this.zSize() }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dotClasses" }] : /* istanbul ignore next */ []));
     labelClasses = computed(() => zSwitchLabelVariants({ zSize: this.zSize() }), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "labelClasses" }] : /* istanbul ignore next */ []));
     switchState = computed(() => (this.zChecked() ? 'checked' : 'unchecked'), /* @ts-ignore */
@@ -275,13 +297,13 @@ class ZSwitchComponent {
         waveEl.addEventListener('animationend', onWaveAnimationEnd);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ZSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ZSwitchComponent, isStandalone: true, selector: "z-switch", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zSwitchClass: { classPropertyName: "zSwitchClass", publicName: "zSwitchClass", isSignal: true, isRequired: false, transformFunction: null }, zThumbClass: { classPropertyName: "zThumbClass", publicName: "zThumbClass", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zMode: { classPropertyName: "zMode", publicName: "zMode", isSignal: true, isRequired: false, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zText: { classPropertyName: "zText", publicName: "zText", isSignal: true, isRequired: false, transformFunction: null }, zCheckedText: { classPropertyName: "zCheckedText", publicName: "zCheckedText", isSignal: true, isRequired: false, transformFunction: null }, zUncheckedText: { classPropertyName: "zUncheckedText", publicName: "zUncheckedText", isSignal: true, isRequired: false, transformFunction: null }, zCheckedIcon: { classPropertyName: "zCheckedIcon", publicName: "zCheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, zUncheckedIcon: { classPropertyName: "zUncheckedIcon", publicName: "zUncheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zLoading: { classPropertyName: "zLoading", publicName: "zLoading", isSignal: true, isRequired: false, transformFunction: null }, zTextPosition: { classPropertyName: "zTextPosition", publicName: "zTextPosition", isSignal: true, isRequired: false, transformFunction: null }, zWave: { classPropertyName: "zWave", publicName: "zWave", isSignal: true, isRequired: false, transformFunction: null }, zChecked: { classPropertyName: "zChecked", publicName: "zChecked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zChange: "zChange", zOnBlur: "zOnBlur", zOnFocus: "zOnFocus", zEvent: "zEvent", zChecked: "zCheckedChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ZSwitchComponent, isStandalone: true, selector: "z-switch", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zSwitchClass: { classPropertyName: "zSwitchClass", publicName: "zSwitchClass", isSignal: true, isRequired: false, transformFunction: null }, zThumbClass: { classPropertyName: "zThumbClass", publicName: "zThumbClass", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zMode: { classPropertyName: "zMode", publicName: "zMode", isSignal: true, isRequired: false, transformFunction: null }, zVariant: { classPropertyName: "zVariant", publicName: "zVariant", isSignal: true, isRequired: false, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zText: { classPropertyName: "zText", publicName: "zText", isSignal: true, isRequired: false, transformFunction: null }, zCheckedText: { classPropertyName: "zCheckedText", publicName: "zCheckedText", isSignal: true, isRequired: false, transformFunction: null }, zUncheckedText: { classPropertyName: "zUncheckedText", publicName: "zUncheckedText", isSignal: true, isRequired: false, transformFunction: null }, zCheckedIcon: { classPropertyName: "zCheckedIcon", publicName: "zCheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, zUncheckedIcon: { classPropertyName: "zUncheckedIcon", publicName: "zUncheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zLoading: { classPropertyName: "zLoading", publicName: "zLoading", isSignal: true, isRequired: false, transformFunction: null }, zTextPosition: { classPropertyName: "zTextPosition", publicName: "zTextPosition", isSignal: true, isRequired: false, transformFunction: null }, zWave: { classPropertyName: "zWave", publicName: "zWave", isSignal: true, isRequired: false, transformFunction: null }, zChecked: { classPropertyName: "zChecked", publicName: "zChecked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zChange: "zChange", zOnBlur: "zOnBlur", zOnFocus: "zOnFocus", zEvent: "zEvent", zChecked: "zCheckedChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ZSwitchComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n", dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], ngImport: i0, template: "<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n      @if (!zLoading() && !currentThumbIcon() && isDotVariant()) {\n        <span [class]=\"dotClasses()\" [attr.data-state]=\"switchState()\"></span>\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n", dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ZSwitchComponent, decorators: [{
             type: Component,
@@ -293,8 +315,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
                         },
                     ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'hostClasses()',
-                    }, template: "<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n" }]
-        }], propDecorators: { zChange: [{ type: i0.Output, args: ["zChange"] }], zOnBlur: [{ type: i0.Output, args: ["zOnBlur"] }], zOnFocus: [{ type: i0.Output, args: ["zOnFocus"] }], zEvent: [{ type: i0.Output, args: ["zEvent"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zSwitchClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSwitchClass", required: false }] }], zThumbClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zThumbClass", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMode", required: false }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zText", required: false }] }], zCheckedText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCheckedText", required: false }] }], zUncheckedText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUncheckedText", required: false }] }], zCheckedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCheckedIcon", required: false }] }], zUncheckedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUncheckedIcon", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoading", required: false }] }], zTextPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTextPosition", required: false }] }], zWave: [{ type: i0.Input, args: [{ isSignal: true, alias: "zWave", required: false }] }], zChecked: [{ type: i0.Input, args: [{ isSignal: true, alias: "zChecked", required: false }] }, { type: i0.Output, args: ["zCheckedChange"] }] } });
+                    }, template: "<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n      @if (!zLoading() && !currentThumbIcon() && isDotVariant()) {\n        <span [class]=\"dotClasses()\" [attr.data-state]=\"switchState()\"></span>\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n" }]
+        }], propDecorators: { zChange: [{ type: i0.Output, args: ["zChange"] }], zOnBlur: [{ type: i0.Output, args: ["zOnBlur"] }], zOnFocus: [{ type: i0.Output, args: ["zOnFocus"] }], zEvent: [{ type: i0.Output, args: ["zEvent"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zSwitchClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSwitchClass", required: false }] }], zThumbClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zThumbClass", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMode", required: false }] }], zVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVariant", required: false }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zText", required: false }] }], zCheckedText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCheckedText", required: false }] }], zUncheckedText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUncheckedText", required: false }] }], zCheckedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCheckedIcon", required: false }] }], zUncheckedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUncheckedIcon", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoading", required: false }] }], zTextPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTextPosition", required: false }] }], zWave: [{ type: i0.Input, args: [{ isSignal: true, alias: "zWave", required: false }] }], zChecked: [{ type: i0.Input, args: [{ isSignal: true, alias: "zChecked", required: false }] }, { type: i0.Output, args: ["zCheckedChange"] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/shival99-z-ui-components-z-switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"shival99-z-ui-components-z-switch.mjs","sources":["../../../../libs/core-ui/components/z-switch/z-switch.define.ts","../../../../libs/core-ui/components/z-switch/z-switch.variants.ts","../../../../libs/core-ui/components/z-switch/z-switch.component.ts","../../../../libs/core-ui/components/z-switch/z-switch.component.html","../../../../libs/core-ui/components/z-switch/shival99-z-ui-components-z-switch.ts"],"sourcesContent":["/** Maximum character length for inner text */\nexport const Z_SWITCH_INNER_TEXT_MAX_LENGTH = 8;\n","import { cva } from 'class-variance-authority';\n\nexport const zSwitchVariants = cva(\n  [\n    'relative inline-flex shrink-0 cursor-pointer items-center rounded-(--radius-pill)',\n    'transition-colors duration-200',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n    'bg-input',\n    'data-[state=checked]:bg-primary',\n    '[--z-wave-color:var(--color-primary)]',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'h-5 w-9',\n        default: 'h-6 w-11',\n        lg: 'h-7 w-14',\n      },\n      zMode: {\n        default: '',\n        inner: 'overflow-hidden',\n      },\n    },\n    compoundVariants: [\n      { zMode: 'inner', zSize: 'sm', class: 'min-w-[2.875rem] h-[1.375rem]' },\n      { zMode: 'inner', zSize: 'default', class: 'min-w-[3.375rem] h-[1.625rem]' },\n      { zMode: 'inner', zSize: 'lg', class: 'min-w-[3.875rem] h-[1.875rem]' },\n    ],\n    defaultVariants: {\n      zSize: 'default',\n      zMode: 'default',\n    },\n  }\n);\n\nexport const zSwitchThumbVariants = cva(\n  [\n    'pointer-events-none flex items-center justify-center rounded-(--radius-pill) bg-white ring-0',\n    'shadow-[0_2px_4px_rgba(0,0,0,0.2)] transition-all duration-200',\n    'absolute top-1/2 -translate-y-1/2 z-10',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'size-4',\n        default: 'size-5',\n        lg: 'size-6',\n      },\n      zMode: {\n        default: '',\n        inner: '',\n      },\n    },\n    compoundVariants: [\n      { zMode: 'default', zSize: 'sm', class: 'left-0.5 data-[state=checked]:translate-x-4' },\n      { zMode: 'default', zSize: 'default', class: 'left-0.5 data-[state=checked]:translate-x-5' },\n      { zMode: 'default', zSize: 'lg', class: 'left-0.5 data-[state=checked]:translate-x-7' },\n      {\n        zMode: 'inner',\n        zSize: 'sm',\n        class: 'size-[1.125rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.25rem)]',\n      },\n      {\n        zMode: 'inner',\n        zSize: 'default',\n        class: 'size-[1.375rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.5rem)]',\n      },\n      {\n        zMode: 'inner',\n        zSize: 'lg',\n        class: 'size-[1.625rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.75rem)]',\n      },\n    ],\n    defaultVariants: {\n      zSize: 'default',\n      zMode: 'default',\n    },\n  }\n);\n\nexport const zSwitchLabelVariants = cva(\n  'select-none cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n  {\n    variants: {\n      zSize: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n\n// Text hiển thị bên TRÁI (khi checked, thumb ở phải)\nexport const zSwitchInnerLeftVariants = cva(\n  [\n    'absolute left-0 top-1/2 -translate-y-1/2 text-white font-medium select-none',\n    'truncate transition-opacity duration-200',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'text-[0.5625rem] pl-[0.3125rem] max-w-[calc(100%-1.375rem)]',\n        default: 'text-[0.625rem] pl-[0.375rem] max-w-[calc(100%-1.625rem)]',\n        lg: 'text-[0.6875rem] pl-[0.4375rem] max-w-[calc(100%-1.875rem)]',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n\n// Text hiển thị bên PHẢI (khi unchecked, thumb ở trái)\nexport const zSwitchInnerRightVariants = cva(\n  [\n    'absolute right-0 top-1/2 -translate-y-1/2 text-white font-medium select-none',\n    'truncate transition-opacity duration-200',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'text-[0.5625rem] pr-[0.3125rem] max-w-[calc(100%-1.375rem)]',\n        default: 'text-[0.625rem] pr-[0.375rem] max-w-[calc(100%-1.625rem)]',\n        lg: 'text-[0.6875rem] pr-[0.4375rem] max-w-[calc(100%-1.875rem)]',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  forwardRef,\n  input,\n  model,\n  output,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport type { ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform, zCreateEvent, type ZEvent } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { Z_SWITCH_INNER_TEXT_MAX_LENGTH } from './z-switch.define';\nimport { ZSwitchMode, ZSwitchSize } from './z-switch.types';\nimport {\n  zSwitchLabelVariants,\n  zSwitchThumbVariants,\n  zSwitchVariants,\n  zSwitchInnerLeftVariants,\n  zSwitchInnerRightVariants,\n} from './z-switch.variants';\n\n@Component({\n  selector: 'z-switch',\n  imports: [ZIconComponent],\n  standalone: true,\n  templateUrl: './z-switch.component.html',\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ZSwitchComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n  },\n})\nexport class ZSwitchComponent implements ControlValueAccessor {\n  public readonly zChange = output<boolean>();\n  public readonly zOnBlur = output<FocusEvent>();\n  public readonly zOnFocus = output<FocusEvent>();\n  public readonly zEvent = output<ZEvent>();\n\n  public readonly class = input<ClassValue>('');\n  public readonly zSwitchClass = input<ClassValue>('');\n  public readonly zThumbClass = input<ClassValue>('');\n  public readonly zSize = input<ZSwitchSize>('default');\n  public readonly zMode = input<ZSwitchMode>('default');\n  public readonly zLabel = input<string>('');\n  public readonly zText = input<string>('');\n  public readonly zCheckedText = input<string>('ON');\n  public readonly zUncheckedText = input<string>('OFF');\n  public readonly zCheckedIcon = input<ZIcon | null>(null);\n  public readonly zUncheckedIcon = input<ZIcon | null>(null);\n  public readonly zDisabled = input(false, { transform: zTransform });\n  public readonly zLoading = input(false, { transform: zTransform });\n  public readonly zTextPosition = input<'left' | 'right'>('right');\n  public readonly zWave = input(true, { transform: zTransform });\n\n  public readonly zChecked = model<boolean>(false);\n\n  protected readonly isInnerMode = computed(() => this.zMode() === 'inner');\n\n  private readonly _disabled = signal(false);\n  protected readonly isDisabled = computed(() => this.zDisabled() || this._disabled() || this.zLoading());\n\n  protected readonly hostClasses = computed(() => {\n    const hasLabel = !!this.zLabel();\n    if (hasLabel) {\n      return zMergeClasses('flex flex-col gap-2', this.class());\n    }\n    return zMergeClasses('inline-flex items-center gap-3', this.class());\n  });\n\n  protected readonly switchClasses = computed(() =>\n    zMergeClasses(zSwitchVariants({ zSize: this.zSize(), zMode: this.zMode() }), this.zSwitchClass())\n  );\n\n  protected readonly thumbClasses = computed(() =>\n    zMergeClasses(zSwitchThumbVariants({ zSize: this.zSize(), zMode: this.zMode() }), this.zThumbClass())\n  );\n\n  protected readonly labelClasses = computed(() => zSwitchLabelVariants({ zSize: this.zSize() }));\n  protected readonly switchState = computed(() => (this.zChecked() ? 'checked' : 'unchecked'));\n  protected readonly innerLeftClasses = computed(() => zSwitchInnerLeftVariants({ zSize: this.zSize() }));\n  protected readonly innerRightClasses = computed(() => zSwitchInnerRightVariants({ zSize: this.zSize() }));\n  protected readonly currentThumbIcon = computed(() => {\n    if (this.zChecked()) {\n      return this.zCheckedIcon();\n    }\n\n    return this.zUncheckedIcon();\n  });\n\n  protected readonly displayCheckedText = computed(() => {\n    const text = this.zCheckedText();\n    if (text.length > Z_SWITCH_INNER_TEXT_MAX_LENGTH) {\n      return text.slice(0, Z_SWITCH_INNER_TEXT_MAX_LENGTH - 1) + '…';\n    }\n    return text;\n  });\n\n  protected readonly displayUncheckedText = computed(() => {\n    const text = this.zUncheckedText();\n    if (text.length > Z_SWITCH_INNER_TEXT_MAX_LENGTH) {\n      return text.slice(0, Z_SWITCH_INNER_TEXT_MAX_LENGTH - 1) + '…';\n    }\n    return text;\n  });\n\n  protected readonly loadingIconSize = computed(() => {\n    const size = this.zSize();\n    if (size === 'sm') {\n      return '10';\n    }\n    if (size === 'lg') {\n      return '16';\n    }\n    return '12';\n  });\n\n  private _onChange: (value: boolean) => void = () => {};\n  private _onTouched: () => void = () => {};\n\n  public writeValue(value: boolean | null): void {\n    this.zChecked.set(!!value);\n  }\n\n  public registerOnChange(fn: (value: boolean) => void): void {\n    this._onChange = fn;\n  }\n\n  public registerOnTouched(fn: () => void): void {\n    this._onTouched = fn;\n  }\n\n  public setDisabledState(isDisabled: boolean): void {\n    this._disabled.set(isDisabled);\n  }\n\n  protected onFocus(event: FocusEvent): void {\n    this.zOnFocus.emit(event);\n    this.zEvent.emit(zCreateEvent('focus', event));\n  }\n\n  protected onBlur(event: FocusEvent): void {\n    this.zOnBlur.emit(event);\n    this.zEvent.emit(zCreateEvent('blur', event));\n    this._onTouched();\n  }\n\n  protected onSwitchClick(event: MouseEvent): void {\n    if (this.isDisabled()) {\n      return;\n    }\n\n    const newValue = !this.zChecked();\n    this.zChecked.set(newValue);\n    this.zChange.emit(newValue);\n    this._onChange(newValue);\n    this._onTouched();\n\n    // Wave effect\n    if (this.zWave()) {\n      const target = event.currentTarget as HTMLElement;\n      const button = target.tagName === 'BUTTON' ? target : target.closest('button');\n      if (button) {\n        this._triggerWaveEffect(button as HTMLElement);\n      }\n    }\n  }\n\n  private _triggerWaveEffect(el: HTMLElement): void {\n    const waveEl = document.createElement('span');\n    waveEl.className = 'z-animate-wave';\n    el.appendChild(waveEl);\n    el.classList.add('z-wave-active');\n    const onWaveAnimationEnd = (event: AnimationEvent): void => {\n      if (event.animationName !== 'z-fade-effect') {\n        return;\n      }\n\n      waveEl.remove();\n      el.classList.remove('z-wave-active');\n      waveEl.removeEventListener('animationend', onWaveAnimationEnd);\n    };\n\n    waveEl.addEventListener('animationend', onWaveAnimationEnd);\n  }\n}\n","<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;AACO,MAAM,8BAA8B,GAAG;;ACCvC,MAAM,eAAe,GAAG,GAAG,CAChC;IACE,mFAAmF;IACnF,gCAAgC;IAChC,qGAAqG;IACrG,iDAAiD;IACjD,UAAU;IACV,iCAAiC;IACjC,uCAAuC;CACxC,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,EAAE,EAAE,UAAU;AACf,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,EAAE;AACX,YAAA,KAAK,EAAE,iBAAiB;AACzB,SAAA;AACF,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,+BAA+B,EAAE;QACvE,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,+BAA+B,EAAE;QAC5E,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,+BAA+B,EAAE;AACxE,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;AAGI,MAAM,oBAAoB,GAAG,GAAG,CACrC;IACE,8FAA8F;IAC9F,gEAAgE;IAChE,wCAAwC;CACzC,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,QAAQ;AACZ,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,EAAE,EAAE,QAAQ;AACb,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,EAAE;AACX,YAAA,KAAK,EAAE,EAAE;AACV,SAAA;AACF,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,6CAA6C,EAAE;QACvF,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,6CAA6C,EAAE;QAC5F,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,6CAA6C,EAAE;AACvF,QAAA;AACE,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,KAAK,EAAE,gFAAgF;AACxF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,+EAA+E;AACvF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,KAAK,EAAE,gFAAgF;AACxF,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;AAGI,MAAM,oBAAoB,GAAG,GAAG,CACrC,sFAAsF,EACtF;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,EAAE,EAAE,WAAW;AAChB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;AAGH;AACO,MAAM,wBAAwB,GAAG,GAAG,CACzC;IACE,6EAA6E;IAC7E,0CAA0C;CAC3C,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,6DAA6D;AACjE,YAAA,OAAO,EAAE,2DAA2D;AACpE,YAAA,EAAE,EAAE,6DAA6D;AAClE,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;AAGH;AACO,MAAM,yBAAyB,GAAG,GAAG,CAC1C;IACE,8EAA8E;IAC9E,0CAA0C;CAC3C,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,6DAA6D;AACjE,YAAA,OAAO,EAAE,2DAA2D;AACpE,YAAA,EAAE,EAAE,6DAA6D;AAClE,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;;MC1FU,gBAAgB,CAAA;IACX,OAAO,GAAG,MAAM,EAAW;IAC3B,OAAO,GAAG,MAAM,EAAc;IAC9B,QAAQ,GAAG,MAAM,EAAc;IAC/B,MAAM,GAAG,MAAM,EAAU;IAEzB,KAAK,GAAG,KAAK,CAAa,EAAE;8EAAC;IAC7B,YAAY,GAAG,KAAK,CAAa,EAAE;qFAAC;IACpC,WAAW,GAAG,KAAK,CAAa,EAAE;oFAAC;IACnC,KAAK,GAAG,KAAK,CAAc,SAAS;8EAAC;IACrC,KAAK,GAAG,KAAK,CAAc,SAAS;8EAAC;IACrC,MAAM,GAAG,KAAK,CAAS,EAAE;+EAAC;IAC1B,KAAK,GAAG,KAAK,CAAS,EAAE;8EAAC;IACzB,YAAY,GAAG,KAAK,CAAS,IAAI;qFAAC;IAClC,cAAc,GAAG,KAAK,CAAS,KAAK;uFAAC;IACrC,YAAY,GAAG,KAAK,CAAe,IAAI;qFAAC;IACxC,cAAc,GAAG,KAAK,CAAe,IAAI;uFAAC;IAC1C,SAAS,GAAG,KAAK,CAAC,KAAK,iFAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IACnD,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IAClD,aAAa,GAAG,KAAK,CAAmB,OAAO;sFAAC;IAChD,KAAK,GAAG,KAAK,CAAC,IAAI,6EAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IAE9C,QAAQ,GAAG,KAAK,CAAU,KAAK;iFAAC;IAE7B,WAAW,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,KAAK,OAAO;oFAAC;IAExD,SAAS,GAAG,MAAM,CAAC,KAAK;kFAAC;AACvB,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE;mFAAC;AAEpF,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;QAC7C,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE;QAChC,IAAI,QAAQ,EAAE;YACZ,OAAO,aAAa,CAAC,qBAAqB,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;QAC3D;QACA,OAAO,aAAa,CAAC,gCAAgC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;IACtE,CAAC;oFAAC;AAEiB,IAAA,aAAa,GAAG,QAAQ,CAAC,MAC1C,aAAa,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC;sFAClG;AAEkB,IAAA,YAAY,GAAG,QAAQ,CAAC,MACzC,aAAa,CAAC,oBAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC;qFACtG;AAEkB,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAM,oBAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;qFAAC;AAC5E,IAAA,WAAW,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE,GAAG,SAAS,GAAG,WAAW,CAAC;oFAAC;AACzE,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAM,wBAAwB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;yFAAC;AACpF,IAAA,iBAAiB,GAAG,QAAQ,CAAC,MAAM,yBAAyB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;0FAAC;AACtF,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAK;AAClD,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,IAAI,CAAC,YAAY,EAAE;QAC5B;AAEA,QAAA,OAAO,IAAI,CAAC,cAAc,EAAE;IAC9B,CAAC;yFAAC;AAEiB,IAAA,kBAAkB,GAAG,QAAQ,CAAC,MAAK;AACpD,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE;AAChC,QAAA,IAAI,IAAI,CAAC,MAAM,GAAG,8BAA8B,EAAE;AAChD,YAAA,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,8BAA8B,GAAG,CAAC,CAAC,GAAG,GAAG;QAChE;AACA,QAAA,OAAO,IAAI;IACb,CAAC;2FAAC;AAEiB,IAAA,oBAAoB,GAAG,QAAQ,CAAC,MAAK;AACtD,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE;AAClC,QAAA,IAAI,IAAI,CAAC,MAAM,GAAG,8BAA8B,EAAE;AAChD,YAAA,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,8BAA8B,GAAG,CAAC,CAAC,GAAG,GAAG;QAChE;AACA,QAAA,OAAO,IAAI;IACb,CAAC;6FAAC;AAEiB,IAAA,eAAe,GAAG,QAAQ,CAAC,MAAK;AACjD,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE;AACzB,QAAA,IAAI,IAAI,KAAK,IAAI,EAAE;AACjB,YAAA,OAAO,IAAI;QACb;AACA,QAAA,IAAI,IAAI,KAAK,IAAI,EAAE;AACjB,YAAA,OAAO,IAAI;QACb;AACA,QAAA,OAAO,IAAI;IACb,CAAC;wFAAC;AAEM,IAAA,SAAS,GAA6B,MAAK,EAAE,CAAC;AAC9C,IAAA,UAAU,GAAe,MAAK,EAAE,CAAC;AAElC,IAAA,UAAU,CAAC,KAAqB,EAAA;QACrC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;IAC5B;AAEO,IAAA,gBAAgB,CAAC,EAA4B,EAAA;AAClD,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEO,IAAA,iBAAiB,CAAC,EAAc,EAAA;AACrC,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AAEO,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AACzC,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;IAChC;AAEU,IAAA,OAAO,CAAC,KAAiB,EAAA;AACjC,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAChD;AAEU,IAAA,MAAM,CAAC,KAAiB,EAAA;AAChC,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;AACxB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;QAC7C,IAAI,CAAC,UAAU,EAAE;IACnB;AAEU,IAAA,aAAa,CAAC,KAAiB,EAAA;AACvC,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;YACrB;QACF;AAEA,QAAA,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE;AACjC,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC;AAC3B,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC3B,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC;QACxB,IAAI,CAAC,UAAU,EAAE;;AAGjB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE;AAChB,YAAA,MAAM,MAAM,GAAG,KAAK,CAAC,aAA4B;YACjD,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC;YAC9E,IAAI,MAAM,EAAE;AACV,gBAAA,IAAI,CAAC,kBAAkB,CAAC,MAAqB,CAAC;YAChD;QACF;IACF;AAEQ,IAAA,kBAAkB,CAAC,EAAe,EAAA;QACxC,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;AAC7C,QAAA,MAAM,CAAC,SAAS,GAAG,gBAAgB;AACnC,QAAA,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC;AACtB,QAAA,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC;AACjC,QAAA,MAAM,kBAAkB,GAAG,CAAC,KAAqB,KAAU;AACzD,YAAA,IAAI,KAAK,CAAC,aAAa,KAAK,eAAe,EAAE;gBAC3C;YACF;YAEA,MAAM,CAAC,MAAM,EAAE;AACf,YAAA,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC;AACpC,YAAA,MAAM,CAAC,mBAAmB,CAAC,cAAc,EAAE,kBAAkB,CAAC;AAChE,QAAA,CAAC;AAED,QAAA,MAAM,CAAC,gBAAgB,CAAC,cAAc,EAAE,kBAAkB,CAAC;IAC7D;uGAvJW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,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,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,SAAA,EAbhB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,gBAAgB,CAAC;AAC/C,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;SACF,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECrCH,81DA+CA,4CDnBY,cAAc,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,eAAA,EAAA,UAAA,EAAA,mBAAA,EAAA,OAAA,EAAA,cAAA,EAAA,MAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAgBb,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAlB5B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,UAAU,WACX,CAAC,cAAc,CAAC,EAAA,UAAA,EACb,IAAI,EAAA,SAAA,EAEL;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,sBAAsB,CAAC;AAC/C,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACF,qBAAA,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,SAAS,EAAE,eAAe;AAC3B,qBAAA,EAAA,QAAA,EAAA,81DAAA,EAAA;;;AE1CH;;AAEG;;"}
+{"version":3,"file":"shival99-z-ui-components-z-switch.mjs","sources":["../../../../libs/core-ui/components/z-switch/z-switch.define.ts","../../../../libs/core-ui/components/z-switch/z-switch.variants.ts","../../../../libs/core-ui/components/z-switch/z-switch.component.ts","../../../../libs/core-ui/components/z-switch/z-switch.component.html","../../../../libs/core-ui/components/z-switch/shival99-z-ui-components-z-switch.ts"],"sourcesContent":["/** Maximum character length for inner text */\nexport const Z_SWITCH_INNER_TEXT_MAX_LENGTH = 8;\n","import { cva } from 'class-variance-authority';\n\nexport const zSwitchVariants = cva(\n  [\n    'group relative inline-flex shrink-0 cursor-pointer items-center rounded-(--radius-pill)',\n    'transition-colors duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n    'bg-input',\n    'data-[state=checked]:bg-primary',\n    '[--z-wave-color:var(--color-primary)]',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'h-5 w-9',\n        default: 'h-6 w-11',\n        lg: 'h-7 w-14',\n      },\n      zMode: {\n        default: '',\n        inner: 'overflow-hidden',\n      },\n    },\n    compoundVariants: [\n      { zMode: 'inner', zSize: 'sm', class: 'min-w-[2.875rem] h-[1.375rem]' },\n      { zMode: 'inner', zSize: 'default', class: 'min-w-[3.375rem] h-[1.625rem]' },\n      { zMode: 'inner', zSize: 'lg', class: 'min-w-[3.875rem] h-[1.875rem]' },\n    ],\n    defaultVariants: {\n      zSize: 'default',\n      zMode: 'default',\n    },\n  }\n);\n\nexport const zSwitchThumbVariants = cva(\n  [\n    'pointer-events-none flex items-center justify-center rounded-(--radius-pill) bg-white ring-0',\n    'shadow-[0_2px_4px_rgba(0,0,0,0.2)] transition-all duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',\n    'absolute top-1/2 -translate-y-1/2 z-10',\n    'group-active:scale-[0.9]',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'size-4',\n        default: 'size-5',\n        lg: 'size-6',\n      },\n      zMode: {\n        default: '',\n        inner: '',\n      },\n    },\n    compoundVariants: [\n      { zMode: 'default', zSize: 'sm', class: 'left-0.5 data-[state=checked]:translate-x-4' },\n      { zMode: 'default', zSize: 'default', class: 'left-0.5 data-[state=checked]:translate-x-5' },\n      { zMode: 'default', zSize: 'lg', class: 'left-0.5 data-[state=checked]:translate-x-7' },\n      {\n        zMode: 'inner',\n        zSize: 'sm',\n        class: 'size-[1.125rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.25rem)]',\n      },\n      {\n        zMode: 'inner',\n        zSize: 'default',\n        class: 'size-[1.375rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.5rem)]',\n      },\n      {\n        zMode: 'inner',\n        zSize: 'lg',\n        class: 'size-[1.625rem] left-[0.125rem] data-[state=checked]:left-[calc(100%-1.75rem)]',\n      },\n    ],\n    defaultVariants: {\n      zSize: 'default',\n      zMode: 'default',\n    },\n  }\n);\n\nexport const zSwitchDotVariants = cva(\n  [\n    'pointer-events-none rounded-(--radius-pill) bg-destructive transition-colors duration-[250ms] ease-[cubic-bezier(0.22,1,0.36,1)]',\n    'data-[state=checked]:bg-primary',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'size-1.5',\n        default: 'size-2',\n        lg: 'size-2.5',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n\nexport const zSwitchLabelVariants = cva(\n  'select-none cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n  {\n    variants: {\n      zSize: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n\n// Text hiển thị bên TRÁI (khi checked, thumb ở phải)\nexport const zSwitchInnerLeftVariants = cva(\n  [\n    'absolute left-0 top-1/2 -translate-y-1/2 text-white font-medium select-none',\n    'truncate transition-opacity duration-200',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'text-[0.5625rem] pl-[0.3125rem] max-w-[calc(100%-1.375rem)]',\n        default: 'text-[0.625rem] pl-[0.375rem] max-w-[calc(100%-1.625rem)]',\n        lg: 'text-[0.6875rem] pl-[0.4375rem] max-w-[calc(100%-1.875rem)]',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n\n// Text hiển thị bên PHẢI (khi unchecked, thumb ở trái)\nexport const zSwitchInnerRightVariants = cva(\n  [\n    'absolute right-0 top-1/2 -translate-y-1/2 text-white font-medium select-none',\n    'truncate transition-opacity duration-200',\n  ],\n  {\n    variants: {\n      zSize: {\n        sm: 'text-[0.5625rem] pr-[0.3125rem] max-w-[calc(100%-1.375rem)]',\n        default: 'text-[0.625rem] pr-[0.375rem] max-w-[calc(100%-1.625rem)]',\n        lg: 'text-[0.6875rem] pr-[0.4375rem] max-w-[calc(100%-1.875rem)]',\n      },\n    },\n    defaultVariants: {\n      zSize: 'default',\n    },\n  }\n);\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  forwardRef,\n  input,\n  model,\n  output,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport type { ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform, zCreateEvent, type ZEvent } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { Z_SWITCH_INNER_TEXT_MAX_LENGTH } from './z-switch.define';\nimport { ZSwitchMode, ZSwitchSize, ZSwitchVariant } from './z-switch.types';\nimport {\n  zSwitchLabelVariants,\n  zSwitchThumbVariants,\n  zSwitchVariants,\n  zSwitchDotVariants,\n  zSwitchInnerLeftVariants,\n  zSwitchInnerRightVariants,\n} from './z-switch.variants';\n\n@Component({\n  selector: 'z-switch',\n  imports: [ZIconComponent],\n  standalone: true,\n  templateUrl: './z-switch.component.html',\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ZSwitchComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n  },\n})\nexport class ZSwitchComponent implements ControlValueAccessor {\n  public readonly zChange = output<boolean>();\n  public readonly zOnBlur = output<FocusEvent>();\n  public readonly zOnFocus = output<FocusEvent>();\n  public readonly zEvent = output<ZEvent>();\n\n  public readonly class = input<ClassValue>('');\n  public readonly zSwitchClass = input<ClassValue>('');\n  public readonly zThumbClass = input<ClassValue>('');\n  public readonly zSize = input<ZSwitchSize>('default');\n  public readonly zMode = input<ZSwitchMode>('default');\n  public readonly zVariant = input<ZSwitchVariant>('default');\n  public readonly zLabel = input<string>('');\n  public readonly zText = input<string>('');\n  public readonly zCheckedText = input<string>('ON');\n  public readonly zUncheckedText = input<string>('OFF');\n  public readonly zCheckedIcon = input<ZIcon | null>(null);\n  public readonly zUncheckedIcon = input<ZIcon | null>(null);\n  public readonly zDisabled = input(false, { transform: zTransform });\n  public readonly zLoading = input(false, { transform: zTransform });\n  public readonly zTextPosition = input<'left' | 'right'>('right');\n  public readonly zWave = input(true, { transform: zTransform });\n\n  public readonly zChecked = model<boolean>(false);\n\n  protected readonly isInnerMode = computed(() => this.zMode() === 'inner');\n  protected readonly isDotVariant = computed(() => this.zVariant() === 'dot');\n\n  private readonly _disabled = signal(false);\n  protected readonly isDisabled = computed(() => this.zDisabled() || this._disabled() || this.zLoading());\n\n  protected readonly hostClasses = computed(() => {\n    const hasLabel = !!this.zLabel();\n    if (hasLabel) {\n      return zMergeClasses('flex flex-col gap-2', this.class());\n    }\n    return zMergeClasses('inline-flex items-center gap-3', this.class());\n  });\n\n  protected readonly switchClasses = computed(() =>\n    zMergeClasses(zSwitchVariants({ zSize: this.zSize(), zMode: this.zMode() }), this.zSwitchClass())\n  );\n\n  protected readonly thumbClasses = computed(() =>\n    zMergeClasses(zSwitchThumbVariants({ zSize: this.zSize(), zMode: this.zMode() }), this.zThumbClass())\n  );\n\n  protected readonly dotClasses = computed(() => zSwitchDotVariants({ zSize: this.zSize() }));\n\n  protected readonly labelClasses = computed(() => zSwitchLabelVariants({ zSize: this.zSize() }));\n  protected readonly switchState = computed(() => (this.zChecked() ? 'checked' : 'unchecked'));\n  protected readonly innerLeftClasses = computed(() => zSwitchInnerLeftVariants({ zSize: this.zSize() }));\n  protected readonly innerRightClasses = computed(() => zSwitchInnerRightVariants({ zSize: this.zSize() }));\n  protected readonly currentThumbIcon = computed(() => {\n    if (this.zChecked()) {\n      return this.zCheckedIcon();\n    }\n\n    return this.zUncheckedIcon();\n  });\n\n  protected readonly displayCheckedText = computed(() => {\n    const text = this.zCheckedText();\n    if (text.length > Z_SWITCH_INNER_TEXT_MAX_LENGTH) {\n      return text.slice(0, Z_SWITCH_INNER_TEXT_MAX_LENGTH - 1) + '…';\n    }\n    return text;\n  });\n\n  protected readonly displayUncheckedText = computed(() => {\n    const text = this.zUncheckedText();\n    if (text.length > Z_SWITCH_INNER_TEXT_MAX_LENGTH) {\n      return text.slice(0, Z_SWITCH_INNER_TEXT_MAX_LENGTH - 1) + '…';\n    }\n    return text;\n  });\n\n  protected readonly loadingIconSize = computed(() => {\n    const size = this.zSize();\n    if (size === 'sm') {\n      return '10';\n    }\n    if (size === 'lg') {\n      return '16';\n    }\n    return '12';\n  });\n\n  private _onChange: (value: boolean) => void = () => {};\n  private _onTouched: () => void = () => {};\n\n  public writeValue(value: boolean | null): void {\n    this.zChecked.set(!!value);\n  }\n\n  public registerOnChange(fn: (value: boolean) => void): void {\n    this._onChange = fn;\n  }\n\n  public registerOnTouched(fn: () => void): void {\n    this._onTouched = fn;\n  }\n\n  public setDisabledState(isDisabled: boolean): void {\n    this._disabled.set(isDisabled);\n  }\n\n  protected onFocus(event: FocusEvent): void {\n    this.zOnFocus.emit(event);\n    this.zEvent.emit(zCreateEvent('focus', event));\n  }\n\n  protected onBlur(event: FocusEvent): void {\n    this.zOnBlur.emit(event);\n    this.zEvent.emit(zCreateEvent('blur', event));\n    this._onTouched();\n  }\n\n  protected onSwitchClick(event: MouseEvent): void {\n    if (this.isDisabled()) {\n      return;\n    }\n\n    const newValue = !this.zChecked();\n    this.zChecked.set(newValue);\n    this.zChange.emit(newValue);\n    this._onChange(newValue);\n    this._onTouched();\n\n    // Wave effect\n    if (this.zWave()) {\n      const target = event.currentTarget as HTMLElement;\n      const button = target.tagName === 'BUTTON' ? target : target.closest('button');\n      if (button) {\n        this._triggerWaveEffect(button as HTMLElement);\n      }\n    }\n  }\n\n  private _triggerWaveEffect(el: HTMLElement): void {\n    const waveEl = document.createElement('span');\n    waveEl.className = 'z-animate-wave';\n    el.appendChild(waveEl);\n    el.classList.add('z-wave-active');\n    const onWaveAnimationEnd = (event: AnimationEvent): void => {\n      if (event.animationName !== 'z-fade-effect') {\n        return;\n      }\n\n      waveEl.remove();\n      el.classList.remove('z-wave-active');\n      waveEl.removeEventListener('animationend', onWaveAnimationEnd);\n    };\n\n    waveEl.addEventListener('animationend', onWaveAnimationEnd);\n  }\n}\n","<!-- Label above -->\n@if (zLabel()) {\n  <label class=\"text-xs leading-none font-medium\">{{ zLabel() }}</label>\n}\n\n<div class=\"inline-flex items-center gap-3\">\n  @if (zText() && zTextPosition() === 'left') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n\n  <button\n    type=\"button\"\n    role=\"switch\"\n    [class]=\"switchClasses()\"\n    [attr.aria-checked]=\"zChecked()\"\n    [attr.data-state]=\"switchState()\"\n    [attr.data-loading]=\"zLoading()\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"onSwitchClick($event)\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onBlur($event)\">\n    <!-- Thumb (handle) -->\n    <span [class]=\"thumbClasses()\" [attr.data-state]=\"switchState()\" [attr.data-loading]=\"zLoading()\">\n      @if (zLoading()) {\n        <z-icon zType=\"lucideLoader2\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground animate-spin\" />\n      }\n      @if (!zLoading() && currentThumbIcon(); as thumbIcon) {\n        <z-icon [zType]=\"thumbIcon\" [zSize]=\"loadingIconSize()\" class=\"text-muted-foreground\" />\n      }\n      @if (!zLoading() && !currentThumbIcon() && isDotVariant()) {\n        <span [class]=\"dotClasses()\" [attr.data-state]=\"switchState()\"></span>\n      }\n    </span>\n    <!-- Inner text mode -->\n    @if (isInnerMode()) {\n      <!-- Checked text: LEFT side (visible when checked, thumb is on right) -->\n      <span [class]=\"innerLeftClasses()\" [class.opacity-100]=\"zChecked()\" [class.opacity-0]=\"!zChecked()\">\n        {{ displayCheckedText() }}\n      </span>\n      <!-- Unchecked text: RIGHT side (visible when unchecked, thumb is on left) -->\n      <span [class]=\"innerRightClasses()\" [class.opacity-100]=\"!zChecked()\" [class.opacity-0]=\"zChecked()\">\n        {{ displayUncheckedText() }}\n      </span>\n    }\n  </button>\n\n  @if (zText() && zTextPosition() === 'right') {\n    <label [class]=\"labelClasses()\" (click)=\"onSwitchClick($event)\">{{ zText() }}</label>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/shival99-z-ui-components-z-table.mjs

@@ -1873,7 +1873,7 @@ class ZTableEditCellComponent {
         />
       }
     }
-  `, isInline: true, styles: [":host{display:block;width:100%;min-width:0}:host>z-input,:host>z-select,:host>z-autocomplete,:host>z-calendar{display:block;width:100%;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZInputComponent, selector: "z-input", inputs: ["class", "zType", "zSize", "zAlign", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zPrefix", "zSuffix", "zMin", "zMax", "zStep", "zShowArrows", "zMask", "zDecimalPlaces", "zAllowNegative", "zThousandSeparator", "zDecimalMarker", "zValidators", "zAsyncValidators", "zAsyncDebounce", "zAsyncValidateOn", "zShowPasswordToggle", "zSearch", "zDebounce", "zAutofocus", "zAutoComplete", "zAllowClear", "zAutoSizeContent", "zRows", "zResize", "zMaxLength", "zAutoSuggest", "zColorConfig"], outputs: ["zOnSearch", "zOnChange", "zOnBlur", "zOnFocus", "zOnKeydown", "zOnEnter", "zOnColorCollapse", "zControl", "zEvent"], exportAs: ["zInput"] }, { kind: "component", type: ZSelectComponent, selector: "z-select", inputs: ["class", "zClassSelect", "zMode", "zSize", "zVariant", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zPrefix", "zAllowClear", "zShowCheck", "zWrap", "zShowSearch", "zPlaceholderSearch", "zDebounce", "zNotFoundText", "zEmptyText", "zEmptyIcon", "zMaxTagCount", "zTagWidth", "zDropdownMaxHeight", "zDropdownWidth", "zOptionHeight", "zVirtualScroll", "zDynamicSize", "zShowAction", "zOptions", "zConfig", "zTranslateLabels", "zKey", "zSearchServer", "zLoadingMore", "zEnableLoadMore", "zScrollDistance", "zMaxVisible", "zScrollClose", "zSticky", "zPosition", "zTree", "zTreeRootLabel", "zSelectedTemplate", "zOptionTemplate", "zActionTemplate", "zAsyncValidators", "zAsyncDebounce", "zAsyncValidateOn", "zValidators"], outputs: ["zOnSearch", "zOnLoadMore", "zOnBlur", "zOnFocus", "zControl", "zEvent"], exportAs: ["zSelect"] }, { kind: "component", type: ZCalendarComponent, selector: "z-calendar", inputs: ["class", "zMode", "zSize", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zShowTime", "zTimeFormat", "zShowHour", "zShowMinute", "zShowSecond", "zQuickSelect", "zAllowEdit", "zShortTime", "zAllowClear", "zFormat", "zMinDate", "zMaxDate", "zValueType", "zValidators", "zShowOk", "zOkText", "zShowCancel", "zCancelText", "zDisabledDate", "zScrollClose", "zDefaultTime", "zRangeDefaultTime"], outputs: ["zControl", "zChange", "zOnBlur", "zOnFocus", "zEvent"], exportAs: ["zCalendar"] }, { kind: "component", type: ZCheckboxComponent, selector: "z-checkbox", inputs: ["class", "zType", "zSize", "zLabel", "zText", "zDisabled", "zIndeterminate", "zValue", "zOptions", "zOrientation", "zCheckAll", "zCheckAllText", "zChecked", "zGroupValue"], outputs: ["zChange", "zGroupChange", "zOnBlur", "zOnFocus", "zControl", "zEvent", "zCheckedChange", "zGroupValueChange"] }, { kind: "component", type: ZSwitchComponent, selector: "z-switch", inputs: ["class", "zSwitchClass", "zThumbClass", "zSize", "zMode", "zLabel", "zText", "zCheckedText", "zUncheckedText", "zCheckedIcon", "zUncheckedIcon", "zDisabled", "zLoading", "zTextPosition", "zWave", "zChecked"], outputs: ["zChange", "zOnBlur", "zOnFocus", "zEvent", "zCheckedChange"] }, { kind: "component", type: ZAutocompleteComponent, selector: "z-autocomplete", inputs: ["class", "zOptions", "zConfig", "zSize", "zType", "zLabel", "zLabelClass", "zPlaceholder", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zRequired", "zPrefix", "zSuffix", "zAllowClear", "zVirtualScroll", "zDynamicSize", "zOptionHeight", "zDropdownMaxHeight", "zHeightExpand", "zMaxVisible", "zResetOnSelect", "zEmptyText", "zEmptyIcon", "zNoDataText", "zNoDataIcon", "zAllowCustomValue", "zOpenOnFocus", "zDebounceTime", "zLoadingMore", "zEnableLoadMore", "zScrollDistance", "zKey", "zOptionTemplate"], outputs: ["zOnSearch", "zOnLoadMore", "zOnSelect", "zOnEnter", "zOnCommit", "zValueChange", "zOnBlur", "zOnFocus", "zControl", "zEvent"], exportAs: ["zAutocomplete"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [":host{display:block;width:100%;min-width:0}:host>z-input,:host>z-select,:host>z-autocomplete,:host>z-calendar{display:block;width:100%;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZInputComponent, selector: "z-input", inputs: ["class", "zType", "zSize", "zAlign", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zPrefix", "zSuffix", "zMin", "zMax", "zStep", "zShowArrows", "zMask", "zDecimalPlaces", "zAllowNegative", "zThousandSeparator", "zDecimalMarker", "zValidators", "zAsyncValidators", "zAsyncDebounce", "zAsyncValidateOn", "zShowPasswordToggle", "zSearch", "zDebounce", "zAutofocus", "zAutoComplete", "zAllowClear", "zAutoSizeContent", "zRows", "zResize", "zMaxLength", "zAutoSuggest", "zColorConfig"], outputs: ["zOnSearch", "zOnChange", "zOnBlur", "zOnFocus", "zOnKeydown", "zOnEnter", "zOnColorCollapse", "zControl", "zEvent"], exportAs: ["zInput"] }, { kind: "component", type: ZSelectComponent, selector: "z-select", inputs: ["class", "zClassSelect", "zMode", "zSize", "zVariant", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zPrefix", "zAllowClear", "zShowCheck", "zWrap", "zShowSearch", "zPlaceholderSearch", "zDebounce", "zNotFoundText", "zEmptyText", "zEmptyIcon", "zMaxTagCount", "zTagWidth", "zDropdownMaxHeight", "zDropdownWidth", "zOptionHeight", "zVirtualScroll", "zDynamicSize", "zShowAction", "zOptions", "zConfig", "zTranslateLabels", "zKey", "zSearchServer", "zLoadingMore", "zEnableLoadMore", "zScrollDistance", "zMaxVisible", "zScrollClose", "zSticky", "zPosition", "zTree", "zTreeRootLabel", "zSelectedTemplate", "zOptionTemplate", "zActionTemplate", "zAsyncValidators", "zAsyncDebounce", "zAsyncValidateOn", "zValidators"], outputs: ["zOnSearch", "zOnLoadMore", "zOnBlur", "zOnFocus", "zControl", "zEvent"], exportAs: ["zSelect"] }, { kind: "component", type: ZCalendarComponent, selector: "z-calendar", inputs: ["class", "zMode", "zSize", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zShowTime", "zTimeFormat", "zShowHour", "zShowMinute", "zShowSecond", "zQuickSelect", "zAllowEdit", "zShortTime", "zAllowClear", "zFormat", "zMinDate", "zMaxDate", "zValueType", "zValidators", "zShowOk", "zOkText", "zShowCancel", "zCancelText", "zDisabledDate", "zScrollClose", "zDefaultTime", "zRangeDefaultTime"], outputs: ["zControl", "zChange", "zOnBlur", "zOnFocus", "zEvent"], exportAs: ["zCalendar"] }, { kind: "component", type: ZCheckboxComponent, selector: "z-checkbox", inputs: ["class", "zType", "zSize", "zLabel", "zText", "zDisabled", "zIndeterminate", "zValue", "zOptions", "zOrientation", "zCheckAll", "zCheckAllText", "zChecked", "zGroupValue"], outputs: ["zChange", "zGroupChange", "zOnBlur", "zOnFocus", "zControl", "zEvent", "zCheckedChange", "zGroupValueChange"] }, { kind: "component", type: ZSwitchComponent, selector: "z-switch", inputs: ["class", "zSwitchClass", "zThumbClass", "zSize", "zMode", "zVariant", "zLabel", "zText", "zCheckedText", "zUncheckedText", "zCheckedIcon", "zUncheckedIcon", "zDisabled", "zLoading", "zTextPosition", "zWave", "zChecked"], outputs: ["zChange", "zOnBlur", "zOnFocus", "zEvent", "zCheckedChange"] }, { kind: "component", type: ZAutocompleteComponent, selector: "z-autocomplete", inputs: ["class", "zOptions", "zConfig", "zSize", "zType", "zLabel", "zLabelClass", "zPlaceholder", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zRequired", "zPrefix", "zSuffix", "zAllowClear", "zVirtualScroll", "zDynamicSize", "zOptionHeight", "zDropdownMaxHeight", "zHeightExpand", "zMaxVisible", "zResetOnSelect", "zEmptyText", "zEmptyIcon", "zNoDataText", "zNoDataIcon", "zAllowCustomValue", "zOpenOnFocus", "zDebounceTime", "zLoadingMore", "zEnableLoadMore", "zScrollDistance", "zKey", "zOptionTemplate"], outputs: ["zOnSearch", "zOnLoadMore", "zOnSelect", "zOnEnter", "zOnCommit", "zValueChange", "zOnBlur", "zOnFocus", "zControl", "zEvent"], exportAs: ["zAutocomplete"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ZTableEditCellComponent, decorators: [{
             type: Component,