@shival99/z-ui 1.0.1 → 1.0.3

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

@@ -0,0 +1,335 @@
+import * as i0 from '@angular/core';
+import { Pipe, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
+import { zMergeClasses } from '@shival99/z-ui/utils';
+import { cva } from 'class-variance-authority';
+
+const zTimelineVariants = cva(['block relative'], {
+    variants: {
+        zSize: {
+            sm: 'text-sm',
+            default: 'text-base',
+            lg: 'text-lg',
+        },
+        zLayout: {
+            default: '',
+            reversed: '',
+            alternate: 'sm:max-w-4xl sm:mx-auto',
+        },
+    },
+    defaultVariants: {
+        zSize: 'default',
+        zLayout: 'default',
+    },
+});
+const zTimelineItemVariants = cva(['group relative pb-10 last:pb-0'], {
+    variants: {
+        zLayout: {
+            default: 'pl-8 sm:pl-44',
+            reversed: 'pr-8 sm:pr-44 text-right',
+            alternate: 'pl-8 sm:pl-0 sm:grid sm:grid-cols-[1fr_24px_1fr] sm:gap-4',
+        },
+    },
+    defaultVariants: {
+        zLayout: 'default',
+    },
+});
+const zTimelineHeaderVariants = cva([
+    'mb-1 flex flex-col items-start',
+    'before:absolute before:h-full before:-translate-x-1/2 before:translate-y-3 before:self-start before:w-px',
+    'group-last:before:hidden',
+], {
+    variants: {
+        hasIcon: {
+            true: '',
+            false: [
+                'after:absolute after:box-content after:h-2 after:w-2 after:-translate-x-1/2 after:translate-y-1.5 after:rounded-full after:border-4 after:border-primary-foreground/95 after:bg-primary',
+            ],
+        },
+        zColor: {
+            default: '',
+            primary: '',
+            success: '',
+            warning: '',
+            error: '',
+            info: '',
+        },
+        zLineStyle: {
+            solid: 'before:bg-border',
+            dashed: 'before:border-l before:border-dashed before:border-border before:bg-transparent',
+        },
+        zLayout: {
+            default: 'before:left-2 after:left-2 sm:flex-row sm:before:left-0 sm:before:ml-[10rem] sm:after:left-0 sm:after:ml-[10rem]',
+            reversed: 'items-end before:right-2 after:right-2 before:translate-x-1/2 after:translate-x-1/2 sm:flex-row-reverse sm:before:right-0 sm:before:mr-[10rem] sm:after:right-0 sm:after:mr-[10rem]',
+            alternate: 'before:left-2 after:left-2 sm:before:hidden sm:after:hidden',
+        },
+    },
+    compoundVariants: [
+        { hasIcon: false, zColor: 'default', class: 'after:bg-foreground' },
+        { hasIcon: false, zColor: 'primary', class: 'after:bg-primary after:border-primary/20' },
+        { hasIcon: false, zColor: 'success', class: 'after:bg-green-500 after:border-green-500/20' },
+        { hasIcon: false, zColor: 'warning', class: 'after:bg-amber-500 after:border-amber-500/20' },
+        { hasIcon: false, zColor: 'error', class: 'after:bg-destructive after:border-destructive/20' },
+        { hasIcon: false, zColor: 'info', class: 'after:bg-blue-500 after:border-blue-500/20' },
+        { hasIcon: true, zLayout: 'default', class: 'sm:pl-[22px] sm:before:ml-[172px]' },
+        { hasIcon: true, zLayout: 'reversed', class: 'sm:pr-[22px] sm:before:mr-[172px]' },
+    ],
+    defaultVariants: {
+        hasIcon: false,
+        zColor: 'default',
+        zLineStyle: 'solid',
+        zLayout: 'default',
+    },
+});
+const zTimelineDotVariants = cva(['hidden sm:flex relative z-10 flex-col items-center'], {
+    variants: {
+        zLineStyle: {
+            solid: '',
+            dashed: '',
+        },
+    },
+    defaultVariants: {
+        zLineStyle: 'solid',
+    },
+});
+const zTimelineLineVariants = cva(['absolute top-0 -bottom-8 left-1/2 -translate-x-1/2 w-px group-last:hidden'], {
+    variants: {
+        zLineStyle: {
+            solid: 'bg-border',
+            dashed: 'border-l border-dashed border-border',
+        },
+    },
+    defaultVariants: {
+        zLineStyle: 'solid',
+    },
+});
+const zTimelineDotCircleVariants = cva(['h-2 w-2 rounded-full border-4 border-primary-foreground/95 shrink-0 relative z-10 box-content'], {
+    variants: {
+        zColor: {
+            default: 'bg-primary',
+            primary: 'bg-primary border-primary/20',
+            success: 'bg-green-500 border-green-500/20',
+            warning: 'bg-amber-500 border-amber-500/20',
+            error: 'bg-destructive border-destructive/20',
+            info: 'bg-blue-500 border-blue-500/20',
+        },
+    },
+    defaultVariants: {
+        zColor: 'default',
+    },
+});
+const zTimelineIconVariants = cva(['absolute z-10 -translate-x-1/2 translate-y-0.5 flex items-center justify-center rounded-full'], {
+    variants: {
+        zColor: {
+            default: 'text-foreground bg-background',
+            primary: 'bg-primary text-primary-foreground',
+            success: 'bg-green-500 text-white',
+            warning: 'bg-amber-500 text-white',
+            error: 'bg-destructive text-destructive-foreground',
+            info: 'bg-blue-500 text-white',
+        },
+        zIconStyle: {
+            filled: 'size-6',
+            outline: 'size-5 bg-background',
+        },
+        zLayout: {
+            default: 'left-2 sm:left-0 sm:ml-[172px]',
+            reversed: 'right-2 translate-x-1/2 sm:right-0 sm:mr-[172px]',
+            alternate: 'left-2 sm:hidden',
+        },
+    },
+    compoundVariants: [
+        { zIconStyle: 'outline', zColor: 'default', class: '!text-foreground !bg-background !size-7' },
+        { zIconStyle: 'outline', zColor: 'primary', class: '!text-foreground !bg-background !size-7' },
+        { zIconStyle: 'outline', zColor: 'success', class: '!text-green-500 !bg-background !size-7' },
+        { zIconStyle: 'outline', zColor: 'warning', class: '!text-amber-500 !bg-background !size-7' },
+        { zIconStyle: 'outline', zColor: 'error', class: '!text-destructive !bg-background !size-7' },
+        { zIconStyle: 'outline', zColor: 'info', class: '!text-blue-500 !bg-background !size-7' },
+    ],
+    defaultVariants: {
+        zColor: 'default',
+        zIconStyle: 'filled',
+        zLayout: 'default',
+    },
+});
+const zTimelineIconCenterVariants = cva(['flex size-6 items-center justify-center rounded-full shrink-0 relative z-10'], {
+    variants: {
+        zColor: {
+            default: 'text-foreground bg-background border-2 border-foreground',
+            primary: 'bg-primary text-primary-foreground',
+            success: 'bg-green-500 text-white',
+            warning: 'bg-amber-500 text-white',
+            error: 'bg-destructive text-destructive-foreground',
+            info: 'bg-blue-500 text-white',
+        },
+        zIconStyle: {
+            filled: '',
+            outline: 'bg-background',
+        },
+    },
+    compoundVariants: [
+        { zIconStyle: 'outline', zColor: 'default', class: 'text-foreground border-foreground' },
+        { zIconStyle: 'outline', zColor: 'primary', class: 'text-primary border-2 border-primary bg-background' },
+        { zIconStyle: 'outline', zColor: 'success', class: 'text-green-500 border-2 border-green-500 bg-background' },
+        { zIconStyle: 'outline', zColor: 'warning', class: 'text-amber-500 border-2 border-amber-500 bg-background' },
+        { zIconStyle: 'outline', zColor: 'error', class: 'text-destructive border-2 border-destructive bg-background' },
+        { zIconStyle: 'outline', zColor: 'info', class: 'text-blue-500 border-2 border-blue-500 bg-background' },
+    ],
+    defaultVariants: {
+        zColor: 'default',
+        zIconStyle: 'filled',
+    },
+});
+const zTimelineTitleVariants = cva(['font-bold text-primary'], {
+    variants: {
+        zSize: {
+            sm: 'text-base',
+            default: 'text-xl',
+            lg: 'text-2xl',
+        },
+    },
+    defaultVariants: {
+        zSize: 'default',
+    },
+});
+const zTimelineTimeVariants = cva([
+    'inline-flex items-center rounded-[4px] border px-2.5 py-0.5 text-xs font-semibold transition-colors',
+    'focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+    'mb-3 h-6 w-36 translate-y-0.5 justify-center uppercase',
+    'sm:absolute sm:mb-0',
+], {
+    variants: {
+        zVariant: {
+            default: 'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',
+            secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+            outline: 'border-border text-foreground',
+            muted: 'border-transparent bg-muted text-muted-foreground',
+        },
+        zLayout: {
+            default: 'left-0',
+            reversed: 'right-0',
+            alternate: 'sm:static sm:translate-y-0 sm:mb-0',
+        },
+    },
+    defaultVariants: {
+        zVariant: 'default',
+        zLayout: 'default',
+    },
+});
+const zTimelineDescriptionVariants = cva(['text-muted-foreground'], {
+    variants: {
+        zSize: {
+            sm: 'text-xs',
+            default: 'text-sm',
+            lg: 'text-base',
+        },
+    },
+    defaultVariants: {
+        zSize: 'default',
+    },
+});
+const zTimelineContentVariants = cva([''], {
+    variants: {
+        zContentStyle: {
+            simple: '',
+            card: 'rounded-[5px] border border-border bg-card px-3 py-2 shadow-xs',
+        },
+    },
+    defaultVariants: {
+        zContentStyle: 'simple',
+    },
+});
+const zTimelineAlternateSideVariants = cva(['flex'], {
+    variants: {
+        side: {
+            left: 'justify-end text-right',
+            right: 'justify-start text-left',
+        },
+    },
+    defaultVariants: {
+        side: 'left',
+    },
+});
+
+class ZTimelineClassPipe {
+    transform(type, options = {}) {
+        const { item, layout, lineStyle, iconStyle, timeVariant, side } = options;
+        switch (type) {
+            case 'item':
+                return zTimelineItemVariants({ zLayout: layout });
+            case 'header':
+                return zTimelineHeaderVariants({
+                    hasIcon: !!item?.icon,
+                    zColor: item?.color ?? 'default',
+                    zLineStyle: lineStyle,
+                    zLayout: layout,
+                });
+            case 'icon':
+                return zTimelineIconVariants({
+                    zColor: item?.color ?? 'default',
+                    zIconStyle: iconStyle,
+                    zLayout: layout,
+                });
+            case 'iconCenter':
+                return zTimelineIconCenterVariants({
+                    zColor: item?.color ?? 'default',
+                    zIconStyle: iconStyle,
+                });
+            case 'dot':
+                return zTimelineDotVariants({ zLineStyle: lineStyle });
+            case 'line':
+                return zTimelineLineVariants({ zLineStyle: lineStyle });
+            case 'dotCircle':
+                return zTimelineDotCircleVariants({ zColor: item?.color ?? 'default' });
+            case 'time':
+                return zTimelineTimeVariants({ zVariant: timeVariant, zLayout: layout });
+            case 'side':
+                return zTimelineAlternateSideVariants({ side });
+            default:
+                return '';
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTimelineClassPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: ZTimelineClassPipe, isStandalone: true, name: "zTimelineClass" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTimelineClassPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'zTimelineClass', standalone: true }]
+        }] });
+
+class ZTimelineComponent {
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
+    zItems = input([], ...(ngDevMode ? [{ debugName: "zItems" }] : []));
+    zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
+    zTimeVariant = input('default', ...(ngDevMode ? [{ debugName: "zTimeVariant" }] : []));
+    zLineStyle = input('solid', ...(ngDevMode ? [{ debugName: "zLineStyle" }] : []));
+    zIconStyle = input('filled', ...(ngDevMode ? [{ debugName: "zIconStyle" }] : []));
+    zLayout = input('default', ...(ngDevMode ? [{ debugName: "zLayout" }] : []));
+    zContentStyle = input('simple', ...(ngDevMode ? [{ debugName: "zContentStyle" }] : []));
+    // Host classes
+    hostClasses = computed(() => zMergeClasses(zTimelineVariants({ zSize: this.zSize(), zLayout: this.zLayout() }), this.class()), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
+    // Computed classes that don't depend on loop item
+    isAlternate = computed(() => this.zLayout() === 'alternate', ...(ngDevMode ? [{ debugName: "isAlternate" }] : []));
+    itemClasses = computed(() => zTimelineItemVariants({ zLayout: this.zLayout() }), ...(ngDevMode ? [{ debugName: "itemClasses" }] : []));
+    dotClasses = computed(() => zTimelineDotVariants({ zLineStyle: this.zLineStyle() }), ...(ngDevMode ? [{ debugName: "dotClasses" }] : []));
+    lineClasses = computed(() => zTimelineLineVariants({ zLineStyle: this.zLineStyle() }), ...(ngDevMode ? [{ debugName: "lineClasses" }] : []));
+    titleClasses = computed(() => zTimelineTitleVariants({ zSize: this.zSize() }), ...(ngDevMode ? [{ debugName: "titleClasses" }] : []));
+    descriptionClasses = computed(() => zTimelineDescriptionVariants({ zSize: this.zSize() }), ...(ngDevMode ? [{ debugName: "descriptionClasses" }] : []));
+    contentClasses = computed(() => zTimelineContentVariants({ zContentStyle: this.zContentStyle() }), ...(ngDevMode ? [{ debugName: "contentClasses" }] : []));
+    iconSize = computed(() => (this.zIconStyle() === 'outline' ? '18' : '14'), ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTimelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZTimelineComponent, isStandalone: true, selector: "z-timeline", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zItems: { classPropertyName: "zItems", publicName: "zItems", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zTimeVariant: { classPropertyName: "zTimeVariant", publicName: "zTimeVariant", isSignal: true, isRequired: false, transformFunction: null }, zLineStyle: { classPropertyName: "zLineStyle", publicName: "zLineStyle", isSignal: true, isRequired: false, transformFunction: null }, zIconStyle: { classPropertyName: "zIconStyle", publicName: "zIconStyle", isSignal: true, isRequired: false, transformFunction: null }, zLayout: { classPropertyName: "zLayout", publicName: "zLayout", isSignal: true, isRequired: false, transformFunction: null }, zContentStyle: { classPropertyName: "zContentStyle", publicName: "zContentStyle", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: "@for (item of zItems(); track item.id ?? $index; let isEven = $even) {\n  <div [class]=\"itemClasses()\">\n    @if (item.icon) {\n      <div [class]=\"'icon' | zTimelineClass: { item: item, layout: zLayout(), iconStyle: zIconStyle() }\">\n        <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n      </div>\n    }\n\n    @if (isAlternate()) {\n      <div [class]=\"'side' | zTimelineClass: { side: 'left' }\">\n        @if (isEven) {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        } @else {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        }\n      </div>\n\n      <div [class]=\"dotClasses()\">\n        <div [class]=\"lineClasses()\"></div>\n        @if (item.icon) {\n          <div [class]=\"'iconCenter' | zTimelineClass: { item: item, iconStyle: zIconStyle() }\">\n            <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n          </div>\n        } @else {\n          <div [class]=\"'dotCircle' | zTimelineClass: { item: item }\"></div>\n        }\n      </div>\n\n      <div [class]=\"'side' | zTimelineClass: { side: 'right' }\">\n        @if (isEven) {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        } @else {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        }\n      </div>\n    } @else {\n      <div [class]=\"'header' | zTimelineClass: { item: item, layout: zLayout(), lineStyle: zLineStyle() }\">\n        @if (item.time) {\n          <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n            {{ item.time }}\n          </div>\n        }\n        <div [class]=\"contentClasses()\">\n          <div [class]=\"titleClasses()\">{{ item.title }}</div>\n          @if (item.description) {\n            <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "pipe", type: ZTimelineClassPipe, name: "zTimelineClass" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTimelineComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'z-timeline', imports: [ZIconComponent, ZTimelineClassPipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        '[class]': 'hostClasses()',
+                    }, template: "@for (item of zItems(); track item.id ?? $index; let isEven = $even) {\n  <div [class]=\"itemClasses()\">\n    @if (item.icon) {\n      <div [class]=\"'icon' | zTimelineClass: { item: item, layout: zLayout(), iconStyle: zIconStyle() }\">\n        <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n      </div>\n    }\n\n    @if (isAlternate()) {\n      <div [class]=\"'side' | zTimelineClass: { side: 'left' }\">\n        @if (isEven) {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        } @else {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        }\n      </div>\n\n      <div [class]=\"dotClasses()\">\n        <div [class]=\"lineClasses()\"></div>\n        @if (item.icon) {\n          <div [class]=\"'iconCenter' | zTimelineClass: { item: item, iconStyle: zIconStyle() }\">\n            <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n          </div>\n        } @else {\n          <div [class]=\"'dotCircle' | zTimelineClass: { item: item }\"></div>\n        }\n      </div>\n\n      <div [class]=\"'side' | zTimelineClass: { side: 'right' }\">\n        @if (isEven) {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        } @else {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        }\n      </div>\n    } @else {\n      <div [class]=\"'header' | zTimelineClass: { item: item, layout: zLayout(), lineStyle: zLineStyle() }\">\n        @if (item.time) {\n          <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n            {{ item.time }}\n          </div>\n        }\n        <div [class]=\"contentClasses()\">\n          <div [class]=\"titleClasses()\">{{ item.title }}</div>\n          @if (item.description) {\n            <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n" }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "zItems", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zTimeVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTimeVariant", required: false }] }], zLineStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLineStyle", required: false }] }], zIconStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIconStyle", required: false }] }], zLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLayout", required: false }] }], zContentStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zContentStyle", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ZTimelineClassPipe, ZTimelineComponent, zTimelineContentVariants, zTimelineDescriptionVariants, zTimelineHeaderVariants, zTimelineIconVariants, zTimelineItemVariants, zTimelineTimeVariants, zTimelineTitleVariants, zTimelineVariants };
+//# sourceMappingURL=shival99-z-ui-components-z-timeline.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shival99-z-ui-components-z-timeline.mjs","sources":["../../../../libs/core-ui/components/z-timeline/z-timeline.variants.ts","../../../../libs/core-ui/components/z-timeline/pipes/z-timeline-class.pipe.ts","../../../../libs/core-ui/components/z-timeline/z-timeline.component.ts","../../../../libs/core-ui/components/z-timeline/z-timeline.component.html","../../../../libs/core-ui/components/z-timeline/shival99-z-ui-components-z-timeline.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zTimelineVariants = cva(['block relative'], {\n  variants: {\n    zSize: {\n      sm: 'text-sm',\n      default: 'text-base',\n      lg: 'text-lg',\n    },\n    zLayout: {\n      default: '',\n      reversed: '',\n      alternate: 'sm:max-w-4xl sm:mx-auto',\n    },\n  },\n  defaultVariants: {\n    zSize: 'default',\n    zLayout: 'default',\n  },\n});\n\nexport const zTimelineItemVariants = cva(['group relative pb-10 last:pb-0'], {\n  variants: {\n    zLayout: {\n      default: 'pl-8 sm:pl-44',\n      reversed: 'pr-8 sm:pr-44 text-right',\n      alternate: 'pl-8 sm:pl-0 sm:grid sm:grid-cols-[1fr_24px_1fr] sm:gap-4',\n    },\n  },\n  defaultVariants: {\n    zLayout: 'default',\n  },\n});\n\nexport const zTimelineHeaderVariants = cva(\n  [\n    'mb-1 flex flex-col items-start',\n    'before:absolute before:h-full before:-translate-x-1/2 before:translate-y-3 before:self-start before:w-px',\n    'group-last:before:hidden',\n  ],\n  {\n    variants: {\n      hasIcon: {\n        true: '',\n        false: [\n          'after:absolute after:box-content after:h-2 after:w-2 after:-translate-x-1/2 after:translate-y-1.5 after:rounded-full after:border-4 after:border-primary-foreground/95 after:bg-primary',\n        ],\n      },\n      zColor: {\n        default: '',\n        primary: '',\n        success: '',\n        warning: '',\n        error: '',\n        info: '',\n      },\n      zLineStyle: {\n        solid: 'before:bg-border',\n        dashed: 'before:border-l before:border-dashed before:border-border before:bg-transparent',\n      },\n      zLayout: {\n        default:\n          'before:left-2 after:left-2 sm:flex-row sm:before:left-0 sm:before:ml-[10rem] sm:after:left-0 sm:after:ml-[10rem]',\n        reversed:\n          'items-end before:right-2 after:right-2 before:translate-x-1/2 after:translate-x-1/2 sm:flex-row-reverse sm:before:right-0 sm:before:mr-[10rem] sm:after:right-0 sm:after:mr-[10rem]',\n        alternate: 'before:left-2 after:left-2 sm:before:hidden sm:after:hidden',\n      },\n    },\n    compoundVariants: [\n      { hasIcon: false, zColor: 'default', class: 'after:bg-foreground' },\n      { hasIcon: false, zColor: 'primary', class: 'after:bg-primary after:border-primary/20' },\n      { hasIcon: false, zColor: 'success', class: 'after:bg-green-500 after:border-green-500/20' },\n      { hasIcon: false, zColor: 'warning', class: 'after:bg-amber-500 after:border-amber-500/20' },\n      { hasIcon: false, zColor: 'error', class: 'after:bg-destructive after:border-destructive/20' },\n      { hasIcon: false, zColor: 'info', class: 'after:bg-blue-500 after:border-blue-500/20' },\n      { hasIcon: true, zLayout: 'default', class: 'sm:pl-[22px] sm:before:ml-[172px]' },\n      { hasIcon: true, zLayout: 'reversed', class: 'sm:pr-[22px] sm:before:mr-[172px]' },\n    ],\n    defaultVariants: {\n      hasIcon: false,\n      zColor: 'default',\n      zLineStyle: 'solid',\n      zLayout: 'default',\n    },\n  }\n);\n\nexport const zTimelineDotVariants = cva(['hidden sm:flex relative z-10 flex-col items-center'], {\n  variants: {\n    zLineStyle: {\n      solid: '',\n      dashed: '',\n    },\n  },\n  defaultVariants: {\n    zLineStyle: 'solid',\n  },\n});\n\nexport const zTimelineLineVariants = cva(\n  ['absolute top-0 -bottom-8 left-1/2 -translate-x-1/2 w-px group-last:hidden'],\n  {\n    variants: {\n      zLineStyle: {\n        solid: 'bg-border',\n        dashed: 'border-l border-dashed border-border',\n      },\n    },\n    defaultVariants: {\n      zLineStyle: 'solid',\n    },\n  }\n);\n\nexport const zTimelineDotCircleVariants = cva(\n  ['h-2 w-2 rounded-full border-4 border-primary-foreground/95 shrink-0 relative z-10 box-content'],\n  {\n    variants: {\n      zColor: {\n        default: 'bg-primary',\n        primary: 'bg-primary border-primary/20',\n        success: 'bg-green-500 border-green-500/20',\n        warning: 'bg-amber-500 border-amber-500/20',\n        error: 'bg-destructive border-destructive/20',\n        info: 'bg-blue-500 border-blue-500/20',\n      },\n    },\n    defaultVariants: {\n      zColor: 'default',\n    },\n  }\n);\n\nexport const zTimelineIconVariants = cva(\n  ['absolute z-10 -translate-x-1/2 translate-y-0.5 flex items-center justify-center rounded-full'],\n  {\n    variants: {\n      zColor: {\n        default: 'text-foreground bg-background',\n        primary: 'bg-primary text-primary-foreground',\n        success: 'bg-green-500 text-white',\n        warning: 'bg-amber-500 text-white',\n        error: 'bg-destructive text-destructive-foreground',\n        info: 'bg-blue-500 text-white',\n      },\n      zIconStyle: {\n        filled: 'size-6',\n        outline: 'size-5 bg-background',\n      },\n      zLayout: {\n        default: 'left-2 sm:left-0 sm:ml-[172px]',\n        reversed: 'right-2 translate-x-1/2 sm:right-0 sm:mr-[172px]',\n        alternate: 'left-2 sm:hidden',\n      },\n    },\n    compoundVariants: [\n      { zIconStyle: 'outline', zColor: 'default', class: '!text-foreground !bg-background !size-7' },\n      { zIconStyle: 'outline', zColor: 'primary', class: '!text-foreground !bg-background !size-7' },\n      { zIconStyle: 'outline', zColor: 'success', class: '!text-green-500 !bg-background !size-7' },\n      { zIconStyle: 'outline', zColor: 'warning', class: '!text-amber-500 !bg-background !size-7' },\n      { zIconStyle: 'outline', zColor: 'error', class: '!text-destructive !bg-background !size-7' },\n      { zIconStyle: 'outline', zColor: 'info', class: '!text-blue-500 !bg-background !size-7' },\n    ],\n    defaultVariants: {\n      zColor: 'default',\n      zIconStyle: 'filled',\n      zLayout: 'default',\n    },\n  }\n);\n\nexport const zTimelineIconCenterVariants = cva(\n  ['flex size-6 items-center justify-center rounded-full shrink-0 relative z-10'],\n  {\n    variants: {\n      zColor: {\n        default: 'text-foreground bg-background border-2 border-foreground',\n        primary: 'bg-primary text-primary-foreground',\n        success: 'bg-green-500 text-white',\n        warning: 'bg-amber-500 text-white',\n        error: 'bg-destructive text-destructive-foreground',\n        info: 'bg-blue-500 text-white',\n      },\n      zIconStyle: {\n        filled: '',\n        outline: 'bg-background',\n      },\n    },\n    compoundVariants: [\n      { zIconStyle: 'outline', zColor: 'default', class: 'text-foreground border-foreground' },\n      { zIconStyle: 'outline', zColor: 'primary', class: 'text-primary border-2 border-primary bg-background' },\n      { zIconStyle: 'outline', zColor: 'success', class: 'text-green-500 border-2 border-green-500 bg-background' },\n      { zIconStyle: 'outline', zColor: 'warning', class: 'text-amber-500 border-2 border-amber-500 bg-background' },\n      { zIconStyle: 'outline', zColor: 'error', class: 'text-destructive border-2 border-destructive bg-background' },\n      { zIconStyle: 'outline', zColor: 'info', class: 'text-blue-500 border-2 border-blue-500 bg-background' },\n    ],\n    defaultVariants: {\n      zColor: 'default',\n      zIconStyle: 'filled',\n    },\n  }\n);\n\nexport const zTimelineTitleVariants = cva(['font-bold text-primary'], {\n  variants: {\n    zSize: {\n      sm: 'text-base',\n      default: 'text-xl',\n      lg: 'text-2xl',\n    },\n  },\n  defaultVariants: {\n    zSize: 'default',\n  },\n});\n\nexport const zTimelineTimeVariants = cva(\n  [\n    'inline-flex items-center rounded-[4px] border px-2.5 py-0.5 text-xs font-semibold transition-colors',\n    'focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',\n    'mb-3 h-6 w-36 translate-y-0.5 justify-center uppercase',\n    'sm:absolute sm:mb-0',\n  ],\n  {\n    variants: {\n      zVariant: {\n        default: 'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',\n        secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        outline: 'border-border text-foreground',\n        muted: 'border-transparent bg-muted text-muted-foreground',\n      },\n      zLayout: {\n        default: 'left-0',\n        reversed: 'right-0',\n        alternate: 'sm:static sm:translate-y-0 sm:mb-0',\n      },\n    },\n    defaultVariants: {\n      zVariant: 'default',\n      zLayout: 'default',\n    },\n  }\n);\n\nexport const zTimelineDescriptionVariants = cva(['text-muted-foreground'], {\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\nexport const zTimelineContentVariants = cva([''], {\n  variants: {\n    zContentStyle: {\n      simple: '',\n      card: 'rounded-[5px] border border-border bg-card px-3 py-2 shadow-xs',\n    },\n  },\n  defaultVariants: {\n    zContentStyle: 'simple',\n  },\n});\n\nexport const zTimelineAlternateSideVariants = cva(['flex'], {\n  variants: {\n    side: {\n      left: 'justify-end text-right',\n      right: 'justify-start text-left',\n    },\n  },\n  defaultVariants: {\n    side: 'left',\n  },\n});\n\nexport type ZTimelineVariants = VariantProps<typeof zTimelineVariants>;\nexport type ZTimelineItemVariants = VariantProps<typeof zTimelineItemVariants>;\nexport type ZTimelineHeaderVariants = VariantProps<typeof zTimelineHeaderVariants>;\nexport type ZTimelineIconVariants = VariantProps<typeof zTimelineIconVariants>;\nexport type ZTimelineTimeVariants = VariantProps<typeof zTimelineTimeVariants>;\nexport type ZTimelineContentVariants = VariantProps<typeof zTimelineContentVariants>;\n","import { Pipe, PipeTransform } from '@angular/core';\nimport type { ZTimelineClassOptions, ZTimelineClassType } from '../z-timeline.types';\nimport {\n  zTimelineAlternateSideVariants,\n  zTimelineDotCircleVariants,\n  zTimelineDotVariants,\n  zTimelineHeaderVariants,\n  zTimelineIconCenterVariants,\n  zTimelineIconVariants,\n  zTimelineItemVariants,\n  zTimelineLineVariants,\n  zTimelineTimeVariants,\n} from '../z-timeline.variants';\n\n@Pipe({ name: 'zTimelineClass', standalone: true })\nexport class ZTimelineClassPipe implements PipeTransform {\n  transform(type: ZTimelineClassType, options: ZTimelineClassOptions = {}): string {\n    const { item, layout, lineStyle, iconStyle, timeVariant, side } = options;\n\n    switch (type) {\n      case 'item':\n        return zTimelineItemVariants({ zLayout: layout });\n\n      case 'header':\n        return zTimelineHeaderVariants({\n          hasIcon: !!item?.icon,\n          zColor: item?.color ?? 'default',\n          zLineStyle: lineStyle,\n          zLayout: layout,\n        });\n\n      case 'icon':\n        return zTimelineIconVariants({\n          zColor: item?.color ?? 'default',\n          zIconStyle: iconStyle,\n          zLayout: layout,\n        });\n\n      case 'iconCenter':\n        return zTimelineIconCenterVariants({\n          zColor: item?.color ?? 'default',\n          zIconStyle: iconStyle,\n        });\n\n      case 'dot':\n        return zTimelineDotVariants({ zLineStyle: lineStyle });\n\n      case 'line':\n        return zTimelineLineVariants({ zLineStyle: lineStyle });\n\n      case 'dotCircle':\n        return zTimelineDotCircleVariants({ zColor: item?.color ?? 'default' });\n\n      case 'time':\n        return zTimelineTimeVariants({ zVariant: timeVariant, zLayout: layout });\n\n      case 'side':\n        return zTimelineAlternateSideVariants({ side });\n\n      default:\n        return '';\n    }\n  }\n}\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZTimelineClassPipe } from './pipes';\nimport type {\n  ZTimelineContentStyle,\n  ZTimelineIconStyle,\n  ZTimelineItem,\n  ZTimelineLayout,\n  ZTimelineLineStyle,\n  ZTimelineSize,\n} from './z-timeline.types';\nimport {\n  zTimelineContentVariants,\n  zTimelineDescriptionVariants,\n  zTimelineDotVariants,\n  zTimelineItemVariants,\n  zTimelineLineVariants,\n  zTimelineTitleVariants,\n  zTimelineVariants,\n} from './z-timeline.variants';\n\n@Component({\n  selector: 'z-timeline',\n  imports: [ZIconComponent, ZTimelineClassPipe],\n  standalone: true,\n  templateUrl: './z-timeline.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n  },\n})\nexport class ZTimelineComponent {\n  public readonly class = input<ClassValue>('');\n  public readonly zItems = input<ZTimelineItem[]>([]);\n  public readonly zSize = input<ZTimelineSize>('default');\n  public readonly zTimeVariant = input<'default' | 'secondary' | 'outline' | 'muted'>('default');\n  public readonly zLineStyle = input<ZTimelineLineStyle>('solid');\n  public readonly zIconStyle = input<ZTimelineIconStyle>('filled');\n  public readonly zLayout = input<ZTimelineLayout>('default');\n  public readonly zContentStyle = input<ZTimelineContentStyle>('simple');\n\n  // Host classes\n  protected readonly hostClasses = computed(() =>\n    zMergeClasses(zTimelineVariants({ zSize: this.zSize(), zLayout: this.zLayout() }), this.class())\n  );\n\n  // Computed classes that don't depend on loop item\n  protected readonly isAlternate = computed(() => this.zLayout() === 'alternate');\n  protected readonly itemClasses = computed(() => zTimelineItemVariants({ zLayout: this.zLayout() }));\n  protected readonly dotClasses = computed(() => zTimelineDotVariants({ zLineStyle: this.zLineStyle() }));\n  protected readonly lineClasses = computed(() => zTimelineLineVariants({ zLineStyle: this.zLineStyle() }));\n  protected readonly titleClasses = computed(() => zTimelineTitleVariants({ zSize: this.zSize() }));\n  protected readonly descriptionClasses = computed(() => zTimelineDescriptionVariants({ zSize: this.zSize() }));\n  protected readonly contentClasses = computed(() => zTimelineContentVariants({ zContentStyle: this.zContentStyle() }));\n  protected readonly iconSize = computed(() => (this.zIconStyle() === 'outline' ? '18' : '14'));\n}\n","@for (item of zItems(); track item.id ?? $index; let isEven = $even) {\n  <div [class]=\"itemClasses()\">\n    @if (item.icon) {\n      <div [class]=\"'icon' | zTimelineClass: { item: item, layout: zLayout(), iconStyle: zIconStyle() }\">\n        <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n      </div>\n    }\n\n    @if (isAlternate()) {\n      <div [class]=\"'side' | zTimelineClass: { side: 'left' }\">\n        @if (isEven) {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        } @else {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        }\n      </div>\n\n      <div [class]=\"dotClasses()\">\n        <div [class]=\"lineClasses()\"></div>\n        @if (item.icon) {\n          <div [class]=\"'iconCenter' | zTimelineClass: { item: item, iconStyle: zIconStyle() }\">\n            <z-icon [zType]=\"item.icon\" [zSize]=\"iconSize()\" />\n          </div>\n        } @else {\n          <div [class]=\"'dotCircle' | zTimelineClass: { item: item }\"></div>\n        }\n      </div>\n\n      <div [class]=\"'side' | zTimelineClass: { side: 'right' }\">\n        @if (isEven) {\n          <div [class]=\"contentClasses()\">\n            <div [class]=\"titleClasses()\">{{ item.title }}</div>\n            @if (item.description) {\n              <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n            }\n          </div>\n        } @else {\n          @if (item.time) {\n            <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n              {{ item.time }}\n            </div>\n          }\n        }\n      </div>\n    } @else {\n      <div [class]=\"'header' | zTimelineClass: { item: item, layout: zLayout(), lineStyle: zLineStyle() }\">\n        @if (item.time) {\n          <div [class]=\"'time' | zTimelineClass: { layout: zLayout(), timeVariant: zTimeVariant() }\">\n            {{ item.time }}\n          </div>\n        }\n        <div [class]=\"contentClasses()\">\n          <div [class]=\"titleClasses()\">{{ item.title }}</div>\n          @if (item.description) {\n            <div [class]=\"descriptionClasses()\">{{ item.description }}</div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\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-toast.mjs

@@ -0,0 +1,93 @@
+import * as i0 from '@angular/core';
+import { input, computed, inject, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable } from '@angular/core';
+import { ZThemeService } from '@shival99/z-ui/services';
+import { zMergeClasses } from '@shival99/z-ui/utils';
+import { NgxSonnerToaster, toast } from 'ngx-sonner';
+import { cva } from 'class-variance-authority';
+
+const zToastVariants = cva('group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg', {
+    variants: {
+        zVariant: {
+            default: 'group-[.toaster]:bg-background group-[.toaster]:text-foreground',
+            success: 'group-[.toaster]:bg-green-50 group-[.toaster]:text-green-800 group-[.toaster]:border-green-200 dark:group-[.toaster]:bg-green-950 dark:group-[.toaster]:text-green-200 dark:group-[.toaster]:border-green-800',
+            error: 'group-[.toaster]:bg-red-50 group-[.toaster]:text-red-800 group-[.toaster]:border-red-200 dark:group-[.toaster]:bg-red-950 dark:group-[.toaster]:text-red-200 dark:group-[.toaster]:border-red-800',
+            warning: 'group-[.toaster]:bg-amber-50 group-[.toaster]:text-amber-800 group-[.toaster]:border-amber-200 dark:group-[.toaster]:bg-amber-950 dark:group-[.toaster]:text-amber-200 dark:group-[.toaster]:border-amber-800',
+            info: 'group-[.toaster]:bg-blue-50 group-[.toaster]:text-blue-800 group-[.toaster]:border-blue-200 dark:group-[.toaster]:bg-blue-950 dark:group-[.toaster]:text-blue-200 dark:group-[.toaster]:border-blue-800',
+        },
+    },
+    defaultVariants: {
+        zVariant: 'default',
+    },
+});
+
+class ZToastComponent {
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
+    zVariant = input('default', ...(ngDevMode ? [{ debugName: "zVariant" }] : []));
+    zTheme = input('system', ...(ngDevMode ? [{ debugName: "zTheme" }] : []));
+    zPosition = input('bottom-right', ...(ngDevMode ? [{ debugName: "zPosition" }] : []));
+    zRichColors = input(true, ...(ngDevMode ? [{ debugName: "zRichColors" }] : []));
+    zExpand = input(false, ...(ngDevMode ? [{ debugName: "zExpand" }] : []));
+    zDuration = input(2500, ...(ngDevMode ? [{ debugName: "zDuration" }] : []));
+    zVisibleToasts = input(3, ...(ngDevMode ? [{ debugName: "zVisibleToasts" }] : []));
+    zCloseButton = input(false, ...(ngDevMode ? [{ debugName: "zCloseButton" }] : []));
+    zToastOptions = input({}, ...(ngDevMode ? [{ debugName: "zToastOptions" }] : []));
+    zDir = input('auto', ...(ngDevMode ? [{ debugName: "zDir" }] : []));
+    zClasses = computed(() => zMergeClasses('toaster group', zToastVariants({ zVariant: this.zVariant() }), this.class()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
+    detectTheme = computed(() => {
+        const theme = this.zTheme();
+        if (theme !== 'system') {
+            return theme;
+        }
+        return this._themeService.isDark() ? 'dark' : 'light';
+    }, ...(ngDevMode ? [{ debugName: "detectTheme" }] : []));
+    _themeService = inject(ZThemeService);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: ZToastComponent, isStandalone: true, selector: "z-toast, z-toaster", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zVariant: { classPropertyName: "zVariant", publicName: "zVariant", isSignal: true, isRequired: false, transformFunction: null }, zTheme: { classPropertyName: "zTheme", publicName: "zTheme", isSignal: true, isRequired: false, transformFunction: null }, zPosition: { classPropertyName: "zPosition", publicName: "zPosition", isSignal: true, isRequired: false, transformFunction: null }, zRichColors: { classPropertyName: "zRichColors", publicName: "zRichColors", isSignal: true, isRequired: false, transformFunction: null }, zExpand: { classPropertyName: "zExpand", publicName: "zExpand", isSignal: true, isRequired: false, transformFunction: null }, zDuration: { classPropertyName: "zDuration", publicName: "zDuration", isSignal: true, isRequired: false, transformFunction: null }, zVisibleToasts: { classPropertyName: "zVisibleToasts", publicName: "zVisibleToasts", isSignal: true, isRequired: false, transformFunction: null }, zCloseButton: { classPropertyName: "zCloseButton", publicName: "zCloseButton", isSignal: true, isRequired: false, transformFunction: null }, zToastOptions: { classPropertyName: "zToastOptions", publicName: "zToastOptions", isSignal: true, isRequired: false, transformFunction: null }, zDir: { classPropertyName: "zDir", publicName: "zDir", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["zToast"], ngImport: i0, template: "<ngx-sonner-toaster\n  [theme]=\"detectTheme()\"\n  [class]=\"zClasses()\"\n  [position]=\"zPosition()\"\n  [richColors]=\"zRichColors()\"\n  [expand]=\"zExpand()\"\n  [duration]=\"zDuration()\"\n  [visibleToasts]=\"zVisibleToasts()\"\n  [closeButton]=\"zCloseButton()\"\n  [toastOptions]=\"zToastOptions()\"\n  [dir]=\"zDir()\" />\n", dependencies: [{ kind: "component", type: NgxSonnerToaster, selector: "ngx-sonner-toaster", inputs: ["invert", "theme", "position", "hotKey", "richColors", "expand", "duration", "visibleToasts", "closeButton", "toastOptions", "offset", "dir", "class", "style"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZToastComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'z-toast, z-toaster', imports: [NgxSonnerToaster], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'zToast', template: "<ngx-sonner-toaster\n  [theme]=\"detectTheme()\"\n  [class]=\"zClasses()\"\n  [position]=\"zPosition()\"\n  [richColors]=\"zRichColors()\"\n  [expand]=\"zExpand()\"\n  [duration]=\"zDuration()\"\n  [visibleToasts]=\"zVisibleToasts()\"\n  [closeButton]=\"zCloseButton()\"\n  [toastOptions]=\"zToastOptions()\"\n  [dir]=\"zDir()\" />\n" }]
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVariant", required: false }] }], zTheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTheme", required: false }] }], zPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPosition", required: false }] }], zRichColors: [{ type: i0.Input, args: [{ isSignal: true, alias: "zRichColors", required: false }] }], zExpand: [{ type: i0.Input, args: [{ isSignal: true, alias: "zExpand", required: false }] }], zDuration: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDuration", required: false }] }], zVisibleToasts: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVisibleToasts", required: false }] }], zCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCloseButton", required: false }] }], zToastOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "zToastOptions", required: false }] }], zDir: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDir", required: false }] }] } });
+
+class ZToastService {
+    show(message, options) {
+        return toast(message, options);
+    }
+    success(message, options) {
+        return toast.success(message, options);
+    }
+    error(message, options) {
+        return toast.error(message, options);
+    }
+    warning(message, options) {
+        return toast.warning(message, options);
+    }
+    info(message, options) {
+        return toast.info(message, options);
+    }
+    loading(message, options) {
+        return toast.loading(message, options);
+    }
+    promise(promise, messages) {
+        return toast.promise(promise, messages);
+    }
+    dismiss(toastId) {
+        toast.dismiss(toastId);
+    }
+    dismissAll() {
+        toast.dismiss();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZToastService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZToastService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ZToastComponent, ZToastService, zToastVariants };
+//# sourceMappingURL=shival99-z-ui-components-z-toast.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shival99-z-ui-components-z-toast.mjs","sources":["../../../../libs/core-ui/components/z-toast/z-toast.variants.ts","../../../../libs/core-ui/components/z-toast/z-toast.component.ts","../../../../libs/core-ui/components/z-toast/z-toast.component.html","../../../../libs/core-ui/components/z-toast/z-toast.service.ts","../../../../libs/core-ui/components/z-toast/shival99-z-ui-components-z-toast.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zToastVariants = cva(\n  'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n  {\n    variants: {\n      zVariant: {\n        default: 'group-[.toaster]:bg-background group-[.toaster]:text-foreground',\n        success:\n          'group-[.toaster]:bg-green-50 group-[.toaster]:text-green-800 group-[.toaster]:border-green-200 dark:group-[.toaster]:bg-green-950 dark:group-[.toaster]:text-green-200 dark:group-[.toaster]:border-green-800',\n        error:\n          'group-[.toaster]:bg-red-50 group-[.toaster]:text-red-800 group-[.toaster]:border-red-200 dark:group-[.toaster]:bg-red-950 dark:group-[.toaster]:text-red-200 dark:group-[.toaster]:border-red-800',\n        warning:\n          'group-[.toaster]:bg-amber-50 group-[.toaster]:text-amber-800 group-[.toaster]:border-amber-200 dark:group-[.toaster]:bg-amber-950 dark:group-[.toaster]:text-amber-200 dark:group-[.toaster]:border-amber-800',\n        info: 'group-[.toaster]:bg-blue-50 group-[.toaster]:text-blue-800 group-[.toaster]:border-blue-200 dark:group-[.toaster]:bg-blue-950 dark:group-[.toaster]:text-blue-200 dark:group-[.toaster]:border-blue-800',\n      },\n    },\n    defaultVariants: {\n      zVariant: 'default',\n    },\n  }\n);\n\nexport type ZToastVariants = VariantProps<typeof zToastVariants>;\n","import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation } from '@angular/core';\nimport { ZThemeService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { NgxSonnerToaster } from 'ngx-sonner';\nimport type { ZToastDir, ZToastPosition, ZToastTheme, ZToastOptions } from './z-toast.types';\nimport { zToastVariants, type ZToastVariants } from './z-toast.variants';\n\n@Component({\n  selector: 'z-toast, z-toaster',\n  imports: [NgxSonnerToaster],\n  standalone: true,\n  templateUrl: './z-toast.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  exportAs: 'zToast',\n})\nexport class ZToastComponent {\n  public readonly class = input<ClassValue>('');\n  public readonly zVariant = input<ZToastVariants['zVariant']>('default');\n  public readonly zTheme = input<ZToastTheme>('system');\n  public readonly zPosition = input<ZToastPosition>('bottom-right');\n  public readonly zRichColors = input<boolean>(true);\n  public readonly zExpand = input<boolean>(false);\n  public readonly zDuration = input<number>(2500);\n  public readonly zVisibleToasts = input<number>(3);\n  public readonly zCloseButton = input<boolean>(false);\n  public readonly zToastOptions = input<ZToastOptions>({});\n  public readonly zDir = input<ZToastDir>('auto');\n\n  protected readonly zClasses = computed(() =>\n    zMergeClasses('toaster group', zToastVariants({ zVariant: this.zVariant() }), this.class())\n  );\n\n  protected readonly detectTheme = computed(() => {\n    const theme = this.zTheme();\n    if (theme !== 'system') {\n      return theme;\n    }\n\n    return this._themeService.isDark() ? 'dark' : 'light';\n  });\n\n  private readonly _themeService = inject(ZThemeService);\n}\n","<ngx-sonner-toaster\n  [theme]=\"detectTheme()\"\n  [class]=\"zClasses()\"\n  [position]=\"zPosition()\"\n  [richColors]=\"zRichColors()\"\n  [expand]=\"zExpand()\"\n  [duration]=\"zDuration()\"\n  [visibleToasts]=\"zVisibleToasts()\"\n  [closeButton]=\"zCloseButton()\"\n  [toastOptions]=\"zToastOptions()\"\n  [dir]=\"zDir()\" />\n","import { Injectable } from '@angular/core';\nimport { toast } from 'ngx-sonner';\nimport type { ZToastOptions, ZToastPromiseMessages } from './z-toast.types';\n\n@Injectable({ providedIn: 'root' })\nexport class ZToastService {\n  public show(message: string, options?: ZToastOptions): string | number {\n    return toast(message, options);\n  }\n\n  public success(message: string, options?: ZToastOptions): string | number {\n    return toast.success(message, options);\n  }\n\n  public error(message: string, options?: ZToastOptions): string | number {\n    return toast.error(message, options);\n  }\n\n  public warning(message: string, options?: ZToastOptions): string | number {\n    return toast.warning(message, options);\n  }\n\n  public info(message: string, options?: ZToastOptions): string | number {\n    return toast.info(message, options);\n  }\n\n  public loading(message: string, options?: ZToastOptions): string | number {\n    return toast.loading(message, options);\n  }\n\n  public promise<T>(promise: Promise<T>, messages: ZToastPromiseMessages<T>): string | number | undefined {\n    return toast.promise(promise, messages);\n  }\n\n  public dismiss(toastId?: string | number): void {\n    toast.dismiss(toastId);\n  }\n\n  public dismissAll(): void {\n    toast.dismiss();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}