@semantic-components/ui 0.65.0 → 0.67.0

package/esm2022/lib/components/toast/toast-stack.js

@@ -0,0 +1,182 @@
+import { ChangeDetectionStrategy, Component, computed, inject, ViewEncapsulation, } from '@angular/core';
+import { cn } from '../../utils';
+import { SiCircleCheckIcon, SiInfoIcon, SiLoaderCircleIcon, SiOctagonXIcon, SiTriangleAlertIcon, SiXIcon, } from '@semantic-icons/lucide-icons';
+import { ScToast } from './toast';
+import { ScToastAction } from './toast-action';
+import { ScToastClose } from './toast-close';
+import { ScToastDescription } from './toast-description';
+import { ScToastTitle } from './toast-title';
+import { ScToaster } from './toaster';
+import * as i0 from "@angular/core";
+export class ScToastStack {
+    toastService = inject(ScToaster);
+    positionClasses = {
+        'top-left': 'fixed top-0 left-0 flex-col-reverse',
+        'top-center': 'fixed top-0 left-1/2 -translate-x-1/2 flex-col-reverse',
+        'top-right': 'fixed top-0 right-0 flex-col-reverse',
+        'bottom-left': 'fixed bottom-0 left-0 flex-col',
+        'bottom-center': 'fixed bottom-0 left-1/2 -translate-x-1/2 flex-col',
+        'bottom-right': 'fixed bottom-0 right-0 flex-col',
+    };
+    class = computed(() => cn('z-100 flex max-h-screen w-full gap-2 p-4 md:max-w-[420px]', this.positionClasses[this.toastService.position()]), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    dismiss(id) {
+        this.toastService.dismiss(id);
+    }
+    onAction(id, onClick) {
+        onClick();
+        this.toastService.dismiss(id);
+    }
+    onAnimationEnd(event, id) {
+        if (event.target !== event.currentTarget)
+            return;
+        const toast = this.toastService.toasts().find((t) => t.id === id);
+        if (toast?.state === 'closed') {
+            this.toastService.remove(id);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastStack, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ScToastStack, isStandalone: true, selector: "sc-toast-stack", host: { attributes: { "data-slot": "toast-stack" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    @for (toast of toastService.toasts(); track toast.id) {
+      <div
+        scToast
+        [variant]="toast.variant ?? 'default'"
+        [position]="toastService.position()"
+        [attr.data-state]="toast.state ?? 'open'"
+        (animationend)="onAnimationEnd($event, toast.id)"
+        (pointerEnter)="toastService.pause(toast.id)"
+        (pointerLeave)="toastService.resume(toast.id)"
+      >
+        @switch (toast.variant) {
+          @case ('success') {
+            <svg
+              siCircleCheckIcon
+              class="size-4 shrink-0 text-green-600 dark:text-green-400"
+            ></svg>
+          }
+          @case ('info') {
+            <svg
+              siInfoIcon
+              class="size-4 shrink-0 text-blue-600 dark:text-blue-400"
+            ></svg>
+          }
+          @case ('warning') {
+            <svg
+              siTriangleAlertIcon
+              class="size-4 shrink-0 text-yellow-600 dark:text-yellow-400"
+            ></svg>
+          }
+          @case ('error') {
+            <svg siOctagonXIcon class="size-4 shrink-0"></svg>
+          }
+          @case ('loading') {
+            <svg siLoaderCircleIcon class="size-4 shrink-0 animate-spin"></svg>
+          }
+        }
+        <div class="grid gap-1">
+          @if (toast.title) {
+            <div scToastTitle>{{ toast.title }}</div>
+          }
+          @if (toast.description) {
+            <div scToastDescription>{{ toast.description }}</div>
+          }
+        </div>
+        @if (toast.action) {
+          <button
+            scToastAction
+            (click)="onAction(toast.id, toast.action.onClick)"
+          >
+            {{ toast.action.label }}
+          </button>
+        }
+        <button scToastClose (close)="dismiss(toast.id)">
+          <svg siXIcon class="size-4"></svg>
+        </button>
+      </div>
+    }
+  `, isInline: true, dependencies: [{ kind: "component", type: SiXIcon, selector: "svg[siXIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: SiCircleCheckIcon, selector: "svg[siCircleCheckIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: SiInfoIcon, selector: "svg[siInfoIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: SiLoaderCircleIcon, selector: "svg[siLoaderCircleIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: SiOctagonXIcon, selector: "svg[siOctagonXIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: SiTriangleAlertIcon, selector: "svg[siTriangleAlertIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }, { kind: "component", type: ScToast, selector: "div[scToast]", inputs: ["class", "variant", "position"], outputs: ["pointerEnter", "pointerLeave"] }, { kind: "directive", type: ScToastTitle, selector: "[scToastTitle]", inputs: ["class"] }, { kind: "directive", type: ScToastDescription, selector: "[scToastDescription]", inputs: ["class"] }, { kind: "directive", type: ScToastClose, selector: "button[scToastClose]", inputs: ["class"], outputs: ["close"] }, { kind: "directive", type: ScToastAction, selector: "button[scToastAction]", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastStack, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sc-toast-stack',
+                    imports: [
+                        SiXIcon,
+                        SiCircleCheckIcon,
+                        SiInfoIcon,
+                        SiLoaderCircleIcon,
+                        SiOctagonXIcon,
+                        SiTriangleAlertIcon,
+                        ScToast,
+                        ScToastTitle,
+                        ScToastDescription,
+                        ScToastClose,
+                        ScToastAction,
+                    ],
+                    template: `
+    @for (toast of toastService.toasts(); track toast.id) {
+      <div
+        scToast
+        [variant]="toast.variant ?? 'default'"
+        [position]="toastService.position()"
+        [attr.data-state]="toast.state ?? 'open'"
+        (animationend)="onAnimationEnd($event, toast.id)"
+        (pointerEnter)="toastService.pause(toast.id)"
+        (pointerLeave)="toastService.resume(toast.id)"
+      >
+        @switch (toast.variant) {
+          @case ('success') {
+            <svg
+              siCircleCheckIcon
+              class="size-4 shrink-0 text-green-600 dark:text-green-400"
+            ></svg>
+          }
+          @case ('info') {
+            <svg
+              siInfoIcon
+              class="size-4 shrink-0 text-blue-600 dark:text-blue-400"
+            ></svg>
+          }
+          @case ('warning') {
+            <svg
+              siTriangleAlertIcon
+              class="size-4 shrink-0 text-yellow-600 dark:text-yellow-400"
+            ></svg>
+          }
+          @case ('error') {
+            <svg siOctagonXIcon class="size-4 shrink-0"></svg>
+          }
+          @case ('loading') {
+            <svg siLoaderCircleIcon class="size-4 shrink-0 animate-spin"></svg>
+          }
+        }
+        <div class="grid gap-1">
+          @if (toast.title) {
+            <div scToastTitle>{{ toast.title }}</div>
+          }
+          @if (toast.description) {
+            <div scToastDescription>{{ toast.description }}</div>
+          }
+        </div>
+        @if (toast.action) {
+          <button
+            scToastAction
+            (click)="onAction(toast.id, toast.action.onClick)"
+          >
+            {{ toast.action.label }}
+          </button>
+        }
+        <button scToastClose (close)="dismiss(toast.id)">
+          <svg siXIcon class="size-4"></svg>
+        </button>
+      </div>
+    }
+  `,
+                    host: {
+                        'data-slot': 'toast-stack',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }] });
+//# sourceMappingURL=toast-stack.js.map

package/esm2022/lib/components/toast/toast-stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-stack.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast-stack.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScToastPosition } from './toast.types';\nimport {\n  SiCircleCheckIcon,\n  SiInfoIcon,\n  SiLoaderCircleIcon,\n  SiOctagonXIcon,\n  SiTriangleAlertIcon,\n  SiXIcon,\n} from '@semantic-icons/lucide-icons';\nimport { ScToast } from './toast';\nimport { ScToastAction } from './toast-action';\nimport { ScToastClose } from './toast-close';\nimport { ScToastDescription } from './toast-description';\nimport { ScToastTitle } from './toast-title';\nimport { ScToaster } from './toaster';\n\n@Component({\n  selector: 'sc-toast-stack',\n  imports: [\n    SiXIcon,\n    SiCircleCheckIcon,\n    SiInfoIcon,\n    SiLoaderCircleIcon,\n    SiOctagonXIcon,\n    SiTriangleAlertIcon,\n    ScToast,\n    ScToastTitle,\n    ScToastDescription,\n    ScToastClose,\n    ScToastAction,\n  ],\n  template: `\n    @for (toast of toastService.toasts(); track toast.id) {\n      <div\n        scToast\n        [variant]=\"toast.variant ?? 'default'\"\n        [position]=\"toastService.position()\"\n        [attr.data-state]=\"toast.state ?? 'open'\"\n        (animationend)=\"onAnimationEnd($event, toast.id)\"\n        (pointerEnter)=\"toastService.pause(toast.id)\"\n        (pointerLeave)=\"toastService.resume(toast.id)\"\n      >\n        @switch (toast.variant) {\n          @case ('success') {\n            <svg\n              siCircleCheckIcon\n              class=\"size-4 shrink-0 text-green-600 dark:text-green-400\"\n            ></svg>\n          }\n          @case ('info') {\n            <svg\n              siInfoIcon\n              class=\"size-4 shrink-0 text-blue-600 dark:text-blue-400\"\n            ></svg>\n          }\n          @case ('warning') {\n            <svg\n              siTriangleAlertIcon\n              class=\"size-4 shrink-0 text-yellow-600 dark:text-yellow-400\"\n            ></svg>\n          }\n          @case ('error') {\n            <svg siOctagonXIcon class=\"size-4 shrink-0\"></svg>\n          }\n          @case ('loading') {\n            <svg siLoaderCircleIcon class=\"size-4 shrink-0 animate-spin\"></svg>\n          }\n        }\n        <div class=\"grid gap-1\">\n          @if (toast.title) {\n            <div scToastTitle>{{ toast.title }}</div>\n          }\n          @if (toast.description) {\n            <div scToastDescription>{{ toast.description }}</div>\n          }\n        </div>\n        @if (toast.action) {\n          <button\n            scToastAction\n            (click)=\"onAction(toast.id, toast.action.onClick)\"\n          >\n            {{ toast.action.label }}\n          </button>\n        }\n        <button scToastClose (close)=\"dismiss(toast.id)\">\n          <svg siXIcon class=\"size-4\"></svg>\n        </button>\n      </div>\n    }\n  `,\n  host: {\n    'data-slot': 'toast-stack',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScToastStack {\n  protected readonly toastService = inject(ScToaster);\n\n  private readonly positionClasses: Record<ScToastPosition, string> = {\n    'top-left': 'fixed top-0 left-0 flex-col-reverse',\n    'top-center': 'fixed top-0 left-1/2 -translate-x-1/2 flex-col-reverse',\n    'top-right': 'fixed top-0 right-0 flex-col-reverse',\n    'bottom-left': 'fixed bottom-0 left-0 flex-col',\n    'bottom-center': 'fixed bottom-0 left-1/2 -translate-x-1/2 flex-col',\n    'bottom-right': 'fixed bottom-0 right-0 flex-col',\n  };\n\n  protected readonly class = computed(() =>\n    cn(\n      'z-100 flex max-h-screen w-full gap-2 p-4 md:max-w-[420px]',\n      this.positionClasses[this.toastService.position()],\n    ),\n  );\n\n  protected dismiss(id: string): void {\n    this.toastService.dismiss(id);\n  }\n\n  protected onAction(id: string, onClick: () => void): void {\n    onClick();\n    this.toastService.dismiss(id);\n  }\n\n  protected onAnimationEnd(event: AnimationEvent, id: string): void {\n    if (event.target !== event.currentTarget) return;\n\n    const toast = this.toastService.toasts().find((t) => t.id === id);\n    if (toast?.state === 'closed') {\n      this.toastService.remove(id);\n    }\n  }\n}\n"]}

package/esm2022/lib/components/toast/toast-title.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScToastTitle {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('text-sm font-semibold', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScToastTitle, isStandalone: true, selector: "[scToastTitle]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "toast-title" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastTitle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scToastTitle]',
+                    host: {
+                        'data-slot': 'toast-title',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=toast-title.js.map

package/esm2022/lib/components/toast/toast-title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-title.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast-title.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,uBAAuB,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDAC/C,CAAC;uGALS,YAAY;2FAAZ,YAAY;;2FAAZ,YAAY;kBAPxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,gBAAgB;oBAC1B,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: '[scToastTitle]',\n  host: {\n    'data-slot': 'toast-title',\n    '[class]': 'class()',\n  },\n})\nexport class ScToastTitle {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('text-sm font-semibold', this.classInput()),\n  );\n}\n"]}

package/esm2022/lib/components/toast/toast.js

@@ -0,0 +1,58 @@
+import { ChangeDetectionStrategy, Component, computed, input, output, ViewEncapsulation, } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScToast {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    position = input('bottom-right', ...(ngDevMode ? [{ debugName: "position" }] : []));
+    /** Emitted when pointer enters the toast (pause auto-dismiss) */
+    pointerEnter = output();
+    /** Emitted when pointer leaves the toast (resume auto-dismiss) */
+    pointerLeave = output();
+    class = computed(() => cn('group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all', 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full', this.position().startsWith('bottom')
+        ? 'data-[state=open]:slide-in-from-bottom-full'
+        : 'data-[state=open]:slide-in-from-top-full', this.variantClass(), this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    variantClass = computed(() => {
+        const variantClasses = {
+            default: 'border-border bg-card text-card-foreground shadow-lg',
+            destructive: 'destructive border-red-200 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-200',
+            success: 'border-green-200 bg-green-50 text-green-800 dark:border-green-800 dark:bg-green-950 dark:text-green-200',
+            info: 'border-blue-200 bg-blue-50 text-blue-800 dark:border-blue-800 dark:bg-blue-950 dark:text-blue-200',
+            warning: 'border-yellow-200 bg-yellow-50 text-yellow-800 dark:border-yellow-800 dark:bg-yellow-950 dark:text-yellow-200',
+            error: 'destructive border-red-200 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-200',
+            loading: 'border-border bg-card text-card-foreground shadow-lg',
+        };
+        return variantClasses[this.variant()];
+    }, ...(ngDevMode ? [{ debugName: "variantClass" }] : []));
+    onPointerEnter() {
+        this.pointerEnter.emit();
+    }
+    onPointerLeave() {
+        this.pointerLeave.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToast, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScToast, isStandalone: true, selector: "div[scToast]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pointerEnter: "pointerEnter", pointerLeave: "pointerLeave" }, host: { attributes: { "data-slot": "toast", "role": "status", "aria-live": "polite", "aria-atomic": "true" }, listeners: { "pointerenter": "onPointerEnter()", "pointerleave": "onPointerLeave()" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToast, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[scToast]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'toast',
+                        role: 'status',
+                        'aria-live': 'polite',
+                        'aria-atomic': 'true',
+                        '[class]': 'class()',
+                        '(pointerenter)': 'onPointerEnter()',
+                        '(pointerleave)': 'onPointerLeave()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], pointerEnter: [{ type: i0.Output, args: ["pointerEnter"] }], pointerLeave: [{ type: i0.Output, args: ["pointerLeave"] }] } });
+//# sourceMappingURL=toast.js.map

package/esm2022/lib/components/toast/toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,MAAM,EACN,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAoBjC,MAAM,OAAO,OAAO;IACT,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,OAAO,GAAG,KAAK,CAAiB,SAAS,mDAAC,CAAC;IAC3C,QAAQ,GAAG,KAAK,CAAkB,cAAc,oDAAC,CAAC;IAE3D,iEAAiE;IACxD,YAAY,GAAG,MAAM,EAAQ,CAAC;IAEvC,kEAAkE;IACzD,YAAY,GAAG,MAAM,EAAQ,CAAC;IAEpB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,uJAAuJ,EACvJ,0IAA0I,EAC1I,IAAI,CAAC,QAAQ,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC;QAClC,CAAC,CAAC,6CAA6C;QAC/C,CAAC,CAAC,0CAA0C,EAC9C,IAAI,CAAC,YAAY,EAAE,EACnB,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEe,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC5C,MAAM,cAAc,GAAmC;YACrD,OAAO,EAAE,sDAAsD;YAC/D,WAAW,EACT,yGAAyG;YAC3G,OAAO,EACL,yGAAyG;YAC3G,IAAI,EAAE,mGAAmG;YACzG,OAAO,EACL,+GAA+G;YACjH,KAAK,EACH,yGAAyG;YAC3G,OAAO,EAAE,sDAAsD;SAChE,CAAC;QACF,OAAO,cAAc,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;IACxC,CAAC,wDAAC,CAAC;IAEO,cAAc;QACtB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAES,cAAc;QACtB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;uGA9CU,OAAO;2FAAP,OAAO,ywBAfR;;GAET;;2FAaU,OAAO;kBAjBnB,SAAS;mBAAC;oBACT,QAAQ,EAAE,cAAc;oBACxB,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,OAAO;wBACpB,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,QAAQ;wBACrB,aAAa,EAAE,MAAM;wBACrB,SAAS,EAAE,SAAS;wBACpB,gBAAgB,EAAE,kBAAkB;wBACpC,gBAAgB,EAAE,kBAAkB;qBACrC;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  output,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScToastPosition, ScToastVariant } from './toast.types';\n\n@Component({\n  selector: 'div[scToast]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'toast',\n    role: 'status',\n    'aria-live': 'polite',\n    'aria-atomic': 'true',\n    '[class]': 'class()',\n    '(pointerenter)': 'onPointerEnter()',\n    '(pointerleave)': 'onPointerLeave()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScToast {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly variant = input<ScToastVariant>('default');\n  readonly position = input<ScToastPosition>('bottom-right');\n\n  /** Emitted when pointer enters the toast (pause auto-dismiss) */\n  readonly pointerEnter = output<void>();\n\n  /** Emitted when pointer leaves the toast (resume auto-dismiss) */\n  readonly pointerLeave = output<void>();\n\n  protected readonly class = computed(() =>\n    cn(\n      'group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all',\n      'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full',\n      this.position().startsWith('bottom')\n        ? 'data-[state=open]:slide-in-from-bottom-full'\n        : 'data-[state=open]:slide-in-from-top-full',\n      this.variantClass(),\n      this.classInput(),\n    ),\n  );\n\n  private readonly variantClass = computed(() => {\n    const variantClasses: Record<ScToastVariant, string> = {\n      default: 'border-border bg-card text-card-foreground shadow-lg',\n      destructive:\n        'destructive border-red-200 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-200',\n      success:\n        'border-green-200 bg-green-50 text-green-800 dark:border-green-800 dark:bg-green-950 dark:text-green-200',\n      info: 'border-blue-200 bg-blue-50 text-blue-800 dark:border-blue-800 dark:bg-blue-950 dark:text-blue-200',\n      warning:\n        'border-yellow-200 bg-yellow-50 text-yellow-800 dark:border-yellow-800 dark:bg-yellow-950 dark:text-yellow-200',\n      error:\n        'destructive border-red-200 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-200',\n      loading: 'border-border bg-card text-card-foreground shadow-lg',\n    };\n    return variantClasses[this.variant()];\n  });\n\n  protected onPointerEnter(): void {\n    this.pointerEnter.emit();\n  }\n\n  protected onPointerLeave(): void {\n    this.pointerLeave.emit();\n  }\n}\n"]}

package/esm2022/lib/components/toast/toast.types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=toast.types.js.map

package/esm2022/lib/components/toast/toast.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.types.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast.types.ts"],"names":[],"mappings":"","sourcesContent":["export type ScToastPosition =\n  | 'top-left'\n  | 'top-center'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-center'\n  | 'bottom-right';\n\nexport type ScToastVariant =\n  | 'default'\n  | 'destructive'\n  | 'success'\n  | 'info'\n  | 'warning'\n  | 'error'\n  | 'loading';\n\nexport interface ScToastData {\n  id: string;\n  title?: string;\n  description?: string;\n  variant?: ScToastVariant;\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  duration?: number;\n  state?: 'open' | 'closed';\n}\n\nexport interface ScToastConfig {\n  title?: string;\n  description?: string;\n  variant?: ScToastVariant;\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  duration?: number;\n}\n"]}

package/esm2022/lib/components/toast/toaster.js

@@ -0,0 +1,149 @@
+import { Overlay } from '@angular/cdk/overlay';
+import { ComponentPortal } from '@angular/cdk/portal';
+import { inject, Injectable, signal } from '@angular/core';
+import { _IdGenerator } from '@angular/cdk/a11y';
+import { ScToastStack } from './toast-stack';
+import * as i0 from "@angular/core";
+export class ScToaster {
+    toastsSignal = signal([], ...(ngDevMode ? [{ debugName: "toastsSignal" }] : []));
+    toasts = this.toastsSignal.asReadonly();
+    positionSignal = signal('bottom-right', ...(ngDevMode ? [{ debugName: "positionSignal" }] : []));
+    position = this.positionSignal.asReadonly();
+    defaultDuration = 5000;
+    maxToasts = 5;
+    timeouts = new Map();
+    timerStartTimes = new Map();
+    timerRemaining = new Map();
+    idGenerator = inject(_IdGenerator);
+    overlay = inject(Overlay);
+    overlayRef = null;
+    /**
+     * Show a new toast notification
+     */
+    setPosition(position) {
+        this.positionSignal.set(position);
+    }
+    show(config) {
+        this.ensureOverlay();
+        const id = this.idGenerator.getId('sc-toast-');
+        const toast = {
+            id,
+            title: config.title,
+            description: config.description,
+            variant: config.variant ?? 'default',
+            action: config.action,
+            duration: config.duration ?? this.defaultDuration,
+        };
+        // Dismiss the oldest toast if the limit is exceeded
+        const current = this.toastsSignal();
+        if (current.length >= this.maxToasts) {
+            const oldest = current.find((t) => t.state !== 'closed');
+            if (oldest)
+                this.dismiss(oldest.id);
+        }
+        this.toastsSignal.update((toasts) => [...toasts, toast]);
+        // Auto-dismiss after duration (if duration > 0)
+        if (toast.duration && toast.duration > 0) {
+            this.startTimer(id, toast.duration);
+        }
+        return id;
+    }
+    /**
+     * Pause the auto-dismiss timer for a toast (e.g. on pointer hover).
+     */
+    pause(id) {
+        const timeout = this.timeouts.get(id);
+        if (!timeout)
+            return;
+        clearTimeout(timeout);
+        this.timeouts.delete(id);
+        const startTime = this.timerStartTimes.get(id);
+        if (startTime !== undefined) {
+            const elapsed = Date.now() - startTime;
+            const remaining = (this.timerRemaining.get(id) ?? 0) - elapsed;
+            this.timerRemaining.set(id, Math.max(0, remaining));
+        }
+    }
+    /**
+     * Resume the auto-dismiss timer for a toast (e.g. on pointer leave).
+     */
+    resume(id) {
+        const remaining = this.timerRemaining.get(id);
+        if (remaining === undefined || remaining <= 0)
+            return;
+        this.startTimer(id, remaining);
+    }
+    startTimer(id, duration) {
+        this.timerRemaining.set(id, duration);
+        this.timerStartTimes.set(id, Date.now());
+        const timeout = setTimeout(() => this.dismiss(id), duration);
+        this.timeouts.set(id, timeout);
+    }
+    success(config) {
+        return this.show({ ...config, variant: 'success' });
+    }
+    info(config) {
+        return this.show({ ...config, variant: 'info' });
+    }
+    warning(config) {
+        return this.show({ ...config, variant: 'warning' });
+    }
+    error(config) {
+        return this.show({ ...config, variant: 'error' });
+    }
+    loading(config) {
+        return this.show({ ...config, variant: 'loading' });
+    }
+    /**
+     * Dismiss a specific toast by ID
+     */
+    dismiss(id) {
+        // Clear auto-dismiss timeout and timer tracking
+        const timeout = this.timeouts.get(id);
+        if (timeout) {
+            clearTimeout(timeout);
+            this.timeouts.delete(id);
+        }
+        this.timerStartTimes.delete(id);
+        this.timerRemaining.delete(id);
+        // Set state to 'closed' to trigger exit animation.
+        // Actual removal happens in toast-stack via (animationend).
+        this.toastsSignal.update((toasts) => toasts.map((t) => (t.id === id ? { ...t, state: 'closed' } : t)));
+    }
+    /**
+     * Called by toast-stack after the exit animation completes.
+     */
+    remove(id) {
+        this.toastsSignal.update((toasts) => toasts.filter((t) => t.id !== id));
+    }
+    /**
+     * Dismiss all toasts
+     */
+    dismissAll() {
+        this.timeouts.forEach((timeout) => clearTimeout(timeout));
+        this.timeouts.clear();
+        this.timerStartTimes.clear();
+        this.timerRemaining.clear();
+        this.toastsSignal.update((toasts) => toasts.map((t) => ({ ...t, state: 'closed' })));
+    }
+    ensureOverlay() {
+        if (this.overlayRef) {
+            return;
+        }
+        this.overlayRef = this.overlay.create({
+            positionStrategy: this.overlay.position().global(),
+            hasBackdrop: false,
+        });
+        const portal = new ComponentPortal(ScToastStack);
+        this.overlayRef.attach(portal);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToaster, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToaster, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToaster, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+//# sourceMappingURL=toaster.js.map

package/esm2022/lib/components/toast/toaster.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toaster.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toaster.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAc,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;;AAK7C,MAAM,OAAO,SAAS;IACH,YAAY,GAAG,MAAM,CAAgB,EAAE,wDAAC,CAAC;IACjD,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;IAEhC,cAAc,GAAG,MAAM,CAAkB,cAAc,0DAAC,CAAC;IACjE,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;IAEpC,eAAe,GAAG,IAAI,CAAC;IACvB,SAAS,GAAG,CAAC,CAAC;IACd,QAAQ,GAAG,IAAI,GAAG,EAAyC,CAAC;IAC5D,eAAe,GAAG,IAAI,GAAG,EAAkB,CAAC;IAC5C,cAAc,GAAG,IAAI,GAAG,EAAkB,CAAC;IAE3C,WAAW,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;IACnC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IAEnC,UAAU,GAAsB,IAAI,CAAC;IAE7C;;OAEG;IACH,WAAW,CAAC,QAAyB;QACnC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACpC,CAAC;IAED,IAAI,CAAC,MAAqB;QACxB,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;QAE/C,MAAM,KAAK,GAAgB;YACzB,EAAE;YACF,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,WAAW,EAAE,MAAM,CAAC,WAAW;YAC/B,OAAO,EAAE,MAAM,CAAC,OAAO,IAAI,SAAS;YACpC,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,IAAI,CAAC,eAAe;SAClD,CAAC;QAEF,oDAAoD;QACpD,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACpC,IAAI,OAAO,CAAC,MAAM,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACrC,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;YACzD,IAAI,MAAM;gBAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACtC,CAAC;QAED,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;QAEzD,gDAAgD;QAChD,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAE,CAAC;YACzC,IAAI,CAAC,UAAU,CAAC,EAAE,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;QACtC,CAAC;QAED,OAAO,EAAE,CAAC;IACZ,CAAC;IAED;;OAEG;IACH,KAAK,CAAC,EAAU;QACd,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACtC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,YAAY,CAAC,OAAO,CAAC,CAAC;QACtB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAEzB,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC/C,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC5B,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS,CAAC;YACvC,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC;YAC/D,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC;QACtD,CAAC;IACH,CAAC;IAED;;OAEG;IACH,MAAM,CAAC,EAAU;QACf,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC9C,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,IAAI,CAAC;YAAE,OAAO;QAEtD,IAAI,CAAC,UAAU,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;IACjC,CAAC;IAEO,UAAU,CAAC,EAAU,EAAE,QAAgB;QAC7C,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QACtC,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;QACzC,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC;QAC7D,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;IACjC,CAAC;IAED,OAAO,CAAC,MAAsC;QAC5C,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC;IACtD,CAAC;IAED,IAAI,CAAC,MAAsC;QACzC,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;IACnD,CAAC;IAED,OAAO,CAAC,MAAsC;QAC5C,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC;IACtD,CAAC;IAED,KAAK,CAAC,MAAsC;QAC1C,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;IACpD,CAAC;IAED,OAAO,CAAC,MAAsC;QAC5C,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC;IACtD,CAAC;IAED;;OAEG;IACH,OAAO,CAAC,EAAU;QAChB,gDAAgD;QAChD,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACtC,IAAI,OAAO,EAAE,CAAC;YACZ,YAAY,CAAC,OAAO,CAAC,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAC3B,CAAC;QACD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAE/B,mDAAmD;QACnD,4DAA4D;QAC5D,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAClC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,QAAiB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAC1E,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,MAAM,CAAC,EAAU;QACf,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;IAC1E,CAAC;IAED;;OAEG;IACH,UAAU;QACR,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1D,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;QACtB,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;QAC7B,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;QAC5B,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAClC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,QAAiB,EAAE,CAAC,CAAC,CACxD,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;YACpC,gBAAgB,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE;YAClD,WAAW,EAAE,KAAK;SACnB,CAAC,CAAC;QAEH,MAAM,MAAM,GAAG,IAAI,eAAe,CAAC,YAAY,CAAC,CAAC;QACjD,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;uGAnKU,SAAS;2GAAT,SAAS,cAFR,MAAM;;2FAEP,SAAS;kBAHrB,UAAU;mBAAC;oBACV,UAAU,EAAE,MAAM;iBACnB","sourcesContent":["import { Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { ComponentPortal } from '@angular/cdk/portal';\nimport { inject, Injectable, signal } from '@angular/core';\nimport { _IdGenerator } from '@angular/cdk/a11y';\nimport { ScToastConfig, ScToastData, ScToastPosition } from './toast.types';\nimport { ScToastStack } from './toast-stack';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class ScToaster {\n  private readonly toastsSignal = signal<ScToastData[]>([]);\n  readonly toasts = this.toastsSignal.asReadonly();\n\n  private readonly positionSignal = signal<ScToastPosition>('bottom-right');\n  readonly position = this.positionSignal.asReadonly();\n\n  private readonly defaultDuration = 5000;\n  private readonly maxToasts = 5;\n  private readonly timeouts = new Map<string, ReturnType<typeof setTimeout>>();\n  private readonly timerStartTimes = new Map<string, number>();\n  private readonly timerRemaining = new Map<string, number>();\n\n  private readonly idGenerator = inject(_IdGenerator);\n  private readonly overlay = inject(Overlay);\n\n  private overlayRef: OverlayRef | null = null;\n\n  /**\n   * Show a new toast notification\n   */\n  setPosition(position: ScToastPosition): void {\n    this.positionSignal.set(position);\n  }\n\n  show(config: ScToastConfig): string {\n    this.ensureOverlay();\n\n    const id = this.idGenerator.getId('sc-toast-');\n\n    const toast: ScToastData = {\n      id,\n      title: config.title,\n      description: config.description,\n      variant: config.variant ?? 'default',\n      action: config.action,\n      duration: config.duration ?? this.defaultDuration,\n    };\n\n    // Dismiss the oldest toast if the limit is exceeded\n    const current = this.toastsSignal();\n    if (current.length >= this.maxToasts) {\n      const oldest = current.find((t) => t.state !== 'closed');\n      if (oldest) this.dismiss(oldest.id);\n    }\n\n    this.toastsSignal.update((toasts) => [...toasts, toast]);\n\n    // Auto-dismiss after duration (if duration > 0)\n    if (toast.duration && toast.duration > 0) {\n      this.startTimer(id, toast.duration);\n    }\n\n    return id;\n  }\n\n  /**\n   * Pause the auto-dismiss timer for a toast (e.g. on pointer hover).\n   */\n  pause(id: string): void {\n    const timeout = this.timeouts.get(id);\n    if (!timeout) return;\n\n    clearTimeout(timeout);\n    this.timeouts.delete(id);\n\n    const startTime = this.timerStartTimes.get(id);\n    if (startTime !== undefined) {\n      const elapsed = Date.now() - startTime;\n      const remaining = (this.timerRemaining.get(id) ?? 0) - elapsed;\n      this.timerRemaining.set(id, Math.max(0, remaining));\n    }\n  }\n\n  /**\n   * Resume the auto-dismiss timer for a toast (e.g. on pointer leave).\n   */\n  resume(id: string): void {\n    const remaining = this.timerRemaining.get(id);\n    if (remaining === undefined || remaining <= 0) return;\n\n    this.startTimer(id, remaining);\n  }\n\n  private startTimer(id: string, duration: number): void {\n    this.timerRemaining.set(id, duration);\n    this.timerStartTimes.set(id, Date.now());\n    const timeout = setTimeout(() => this.dismiss(id), duration);\n    this.timeouts.set(id, timeout);\n  }\n\n  success(config: Omit<ScToastConfig, 'variant'>): string {\n    return this.show({ ...config, variant: 'success' });\n  }\n\n  info(config: Omit<ScToastConfig, 'variant'>): string {\n    return this.show({ ...config, variant: 'info' });\n  }\n\n  warning(config: Omit<ScToastConfig, 'variant'>): string {\n    return this.show({ ...config, variant: 'warning' });\n  }\n\n  error(config: Omit<ScToastConfig, 'variant'>): string {\n    return this.show({ ...config, variant: 'error' });\n  }\n\n  loading(config: Omit<ScToastConfig, 'variant'>): string {\n    return this.show({ ...config, variant: 'loading' });\n  }\n\n  /**\n   * Dismiss a specific toast by ID\n   */\n  dismiss(id: string): void {\n    // Clear auto-dismiss timeout and timer tracking\n    const timeout = this.timeouts.get(id);\n    if (timeout) {\n      clearTimeout(timeout);\n      this.timeouts.delete(id);\n    }\n    this.timerStartTimes.delete(id);\n    this.timerRemaining.delete(id);\n\n    // Set state to 'closed' to trigger exit animation.\n    // Actual removal happens in toast-stack via (animationend).\n    this.toastsSignal.update((toasts) =>\n      toasts.map((t) => (t.id === id ? { ...t, state: 'closed' as const } : t)),\n    );\n  }\n\n  /**\n   * Called by toast-stack after the exit animation completes.\n   */\n  remove(id: string): void {\n    this.toastsSignal.update((toasts) => toasts.filter((t) => t.id !== id));\n  }\n\n  /**\n   * Dismiss all toasts\n   */\n  dismissAll(): void {\n    this.timeouts.forEach((timeout) => clearTimeout(timeout));\n    this.timeouts.clear();\n    this.timerStartTimes.clear();\n    this.timerRemaining.clear();\n    this.toastsSignal.update((toasts) =>\n      toasts.map((t) => ({ ...t, state: 'closed' as const })),\n    );\n  }\n\n  private ensureOverlay(): void {\n    if (this.overlayRef) {\n      return;\n    }\n\n    this.overlayRef = this.overlay.create({\n      positionStrategy: this.overlay.position().global(),\n      hasBackdrop: false,\n    });\n\n    const portal = new ComponentPortal(ScToastStack);\n    this.overlayRef.attach(portal);\n  }\n}\n"]}

package/esm2022/lib/components/toggle/index.js

@@ -0,0 +1,2 @@
+export * from './toggle';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toggle/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC","sourcesContent":["export * from './toggle';\n"]}

package/esm2022/lib/components/toggle/toggle.js

@@ -0,0 +1,52 @@
+import { computed, Directive, input, model } from '@angular/core';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export const toggleVariants = cva("hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[state=on]:bg-muted gap-1 rounded-lg text-sm font-medium transition-all [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-muted inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+    variants: {
+        variant: {
+            default: 'bg-transparent',
+            outline: 'border-input hover:bg-muted border bg-transparent',
+        },
+        size: {
+            default: 'h-8 min-w-8 px-2',
+            sm: 'h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-1.5 text-[0.8rem]',
+            lg: 'h-9 min-w-9 px-2.5',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default',
+    },
+});
+export class ScToggle {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    pressed = model(false, ...(ngDevMode ? [{ debugName: "pressed" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    class = computed(() => cn(toggleVariants({ variant: this.variant(), size: this.size() }), this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    toggle() {
+        if (!this.disabled()) {
+            this.pressed.update((v) => !v);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToggle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScToggle, isStandalone: true, selector: "button[scToggle]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pressed: "pressedChange" }, host: { attributes: { "data-slot": "toggle", "type": "button" }, listeners: { "click": "toggle()" }, properties: { "class": "class()", "attr.aria-pressed": "pressed()", "attr.data-state": "pressed() ? \"on\" : \"off\"", "disabled": "disabled()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToggle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scToggle]',
+                    host: {
+                        'data-slot': 'toggle',
+                        type: 'button',
+                        '[class]': 'class()',
+                        '[attr.aria-pressed]': 'pressed()',
+                        '[attr.data-state]': 'pressed() ? "on" : "off"',
+                        '[disabled]': 'disabled()',
+                        '(click)': 'toggle()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], pressed: [{ type: i0.Input, args: [{ isSignal: true, alias: "pressed", required: false }] }, { type: i0.Output, args: ["pressedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+//# sourceMappingURL=toggle.js.map

package/esm2022/lib/components/toggle/toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toggle/toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAEjC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,qhBAAqhB,EACrhB;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,gBAAgB;YACzB,OAAO,EAAE,mDAAmD;SAC7D;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,kBAAkB;YAC3B,EAAE,EAAE,uEAAuE;YAC3E,EAAE,EAAE,oBAAoB;SACzB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAgBF,MAAM,OAAO,QAAQ;IACV,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,OAAO,GAAG,KAAK,CAAU,KAAK,mDAAC,CAAC;IAChC,QAAQ,GAAG,KAAK,CAAU,KAAK,oDAAC,CAAC;IACjC,OAAO,GAAG,KAAK,CAA8B,SAAS,mDAAC,CAAC;IACxD,IAAI,GAAG,KAAK,CAA2B,SAAS,gDAAC,CAAC;IAExC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,EAC9D,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEQ,MAAM;QACd,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC;YACrB,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC;IACH,CAAC;uGAlBU,QAAQ;2FAAR,QAAQ;;2FAAR,QAAQ;kBAZpB,SAAS;mBAAC;oBACT,QAAQ,EAAE,kBAAkB;oBAC5B,IAAI,EAAE;wBACJ,WAAW,EAAE,QAAQ;wBACrB,IAAI,EAAE,QAAQ;wBACd,SAAS,EAAE,SAAS;wBACpB,qBAAqB,EAAE,WAAW;wBAClC,mBAAmB,EAAE,0BAA0B;wBAC/C,YAAY,EAAE,YAAY;wBAC1B,SAAS,EAAE,UAAU;qBACtB;iBACF","sourcesContent":["import { computed, Directive, input, model } from '@angular/core';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils';\n\nexport const toggleVariants = cva(\n  \"hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[state=on]:bg-muted gap-1 rounded-lg text-sm font-medium transition-all [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-muted inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: 'bg-transparent',\n        outline: 'border-input hover:bg-muted border bg-transparent',\n      },\n      size: {\n        default: 'h-8 min-w-8 px-2',\n        sm: 'h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-1.5 text-[0.8rem]',\n        lg: 'h-9 min-w-9 px-2.5',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nexport type ScToggleVariants = VariantProps<typeof toggleVariants>;\n\n@Directive({\n  selector: 'button[scToggle]',\n  host: {\n    'data-slot': 'toggle',\n    type: 'button',\n    '[class]': 'class()',\n    '[attr.aria-pressed]': 'pressed()',\n    '[attr.data-state]': 'pressed() ? \"on\" : \"off\"',\n    '[disabled]': 'disabled()',\n    '(click)': 'toggle()',\n  },\n})\nexport class ScToggle {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly pressed = model<boolean>(false);\n  readonly disabled = input<boolean>(false);\n  readonly variant = input<ScToggleVariants['variant']>('default');\n  readonly size = input<ScToggleVariants['size']>('default');\n\n  protected readonly class = computed(() =>\n    cn(\n      toggleVariants({ variant: this.variant(), size: this.size() }),\n      this.classInput(),\n    ),\n  );\n\n  protected toggle(): void {\n    if (!this.disabled()) {\n      this.pressed.update((v) => !v);\n    }\n  }\n}\n"]}

package/esm2022/lib/components/toggle-group/index.js

@@ -0,0 +1,3 @@
+export * from './toggle-group';
+export * from './toggle-group-item';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/toggle-group/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toggle-group/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC","sourcesContent":["export * from './toggle-group';\nexport * from './toggle-group-item';\n"]}

package/esm2022/lib/components/toggle-group/toggle-group-item.js

@@ -0,0 +1,45 @@
+import { computed, Directive, inject, input } from '@angular/core';
+import { cn } from '../../utils';
+import { toggleVariants } from '../toggle/toggle';
+import { ScToggleGroup } from './toggle-group';
+import * as i0 from "@angular/core";
+export class ScToggleGroupItem {
+    group = inject(ScToggleGroup);
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    isSelected = computed(() => this.group.isSelected(this.value()), ...(ngDevMode ? [{ debugName: "isSelected" }] : []));
+    isDisabled = computed(() => this.disabled() || this.group.disabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
+    class = computed(() => cn('group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg shrink-0 focus:z-10 focus-visible:z-10 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t', toggleVariants({
+        variant: this.group.variant() || this.variant(),
+        size: this.group.size() || this.size(),
+    }), this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    onClick() {
+        if (!this.isDisabled()) {
+            this.group.toggle(this.value());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToggleGroupItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScToggleGroupItem, isStandalone: true, selector: "button[scToggleGroupItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "toggle-group-item", "type": "button" }, listeners: { "click": "onClick()" }, properties: { "attr.data-variant": "group.variant() || variant()", "attr.data-size": "group.size() || size()", "attr.data-spacing": "group.spacing()", "attr.aria-pressed": "isSelected()", "attr.data-state": "isSelected() ? \"on\" : \"off\"", "disabled": "isDisabled()", "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToggleGroupItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scToggleGroupItem]',
+                    host: {
+                        'data-slot': 'toggle-group-item',
+                        type: 'button',
+                        '[attr.data-variant]': 'group.variant() || variant()',
+                        '[attr.data-size]': 'group.size() || size()',
+                        '[attr.data-spacing]': 'group.spacing()',
+                        '[attr.aria-pressed]': 'isSelected()',
+                        '[attr.data-state]': 'isSelected() ? "on" : "off"',
+                        '[disabled]': 'isDisabled()',
+                        '[class]': 'class()',
+                        '(click)': 'onClick()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+//# sourceMappingURL=toggle-group-item.js.map