@semantic-components/ui 0.65.0 → 0.67.0

package/esm2022/lib/components/time-picker/time-picker-minutes-input.js

@@ -0,0 +1,57 @@
+import { computed, Directive, inject } from '@angular/core';
+import { ScTimePickerInput } from './time-picker-input';
+import * as i0 from "@angular/core";
+export class ScTimePickerMinutesInput {
+    input = inject(ScTimePickerInput);
+    timePicker = this.input.timePicker;
+    displayValue = computed(() => {
+        const val = this.timePicker.value();
+        if (!val)
+            return '00';
+        return val.minutes.toString().padStart(2, '0');
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : []));
+    onInput(event) {
+        const el = event.target;
+        const value = el.value.replace(/\D/g, '');
+        const num = parseInt(value, 10);
+        if (!isNaN(num)) {
+            this.timePicker.setMinutes(Math.min(num, 59));
+        }
+    }
+    onBlur() {
+        this.input.focused.set(false);
+    }
+    onFocus(event) {
+        this.input.focused.set(true);
+        event.target.select();
+    }
+    onKeydown(event) {
+        if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            const val = this.timePicker.value() || { hours: 0, minutes: 0 };
+            this.timePicker.setMinutes(val.minutes >= 59 ? 0 : val.minutes + 1);
+        }
+        else if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            const val = this.timePicker.value() || { hours: 0, minutes: 0 };
+            this.timePicker.setMinutes(val.minutes <= 0 ? 59 : val.minutes - 1);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerMinutesInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ScTimePickerMinutesInput, isStandalone: true, selector: "input[scTimePickerMinutesInput]", host: { listeners: { "input": "onInput($event)", "blur": "onBlur()", "keydown": "onKeydown($event)", "focus": "onFocus($event)" }, properties: { "value": "displayValue()", "attr.aria-label": "\"Minutes\"" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerMinutesInput, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'input[scTimePickerMinutesInput]',
+                    host: {
+                        '[value]': 'displayValue()',
+                        '[attr.aria-label]': '"Minutes"',
+                        '(input)': 'onInput($event)',
+                        '(blur)': 'onBlur()',
+                        '(keydown)': 'onKeydown($event)',
+                        '(focus)': 'onFocus($event)',
+                    },
+                }]
+        }] });
+//# sourceMappingURL=time-picker-minutes-input.js.map

package/esm2022/lib/components/time-picker/time-picker-minutes-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-minutes-input.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-minutes-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAaxD,MAAM,OAAO,wBAAwB;IAClB,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAElC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;IAEjC,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC9C,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACpC,IAAI,CAAC,GAAG;YAAE,OAAO,IAAI,CAAC;QACtB,OAAO,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACjD,CAAC,wDAAC,CAAC;IAEO,OAAO,CAAC,KAAY;QAC5B,MAAM,EAAE,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC5C,MAAM,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QAC1C,MAAM,GAAG,GAAG,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QAEhC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC;YAChB,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;QAChD,CAAC;IACH,CAAC;IAES,MAAM;QACd,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC;IAES,OAAO,CAAC,KAAiB;QACjC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAC5B,KAAK,CAAC,MAA2B,CAAC,MAAM,EAAE,CAAC;IAC9C,CAAC;IAES,SAAS,CAAC,KAAoB;QACtC,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE,CAAC;YAC5B,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;YAChE,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC;QACtE,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;YACrC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;YAChE,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC;QACtE,CAAC;IACH,CAAC;uGAxCU,wBAAwB;2FAAxB,wBAAwB;;2FAAxB,wBAAwB;kBAXpC,SAAS;mBAAC;oBACT,QAAQ,EAAE,iCAAiC;oBAC3C,IAAI,EAAE;wBACJ,SAAS,EAAE,gBAAgB;wBAC3B,mBAAmB,EAAE,WAAW;wBAChC,SAAS,EAAE,iBAAiB;wBAC5B,QAAQ,EAAE,UAAU;wBACpB,WAAW,EAAE,mBAAmB;wBAChC,SAAS,EAAE,iBAAiB;qBAC7B;iBACF","sourcesContent":["import { computed, Directive, inject } from '@angular/core';\nimport { ScTimePickerInput } from './time-picker-input';\n\n@Directive({\n  selector: 'input[scTimePickerMinutesInput]',\n  host: {\n    '[value]': 'displayValue()',\n    '[attr.aria-label]': '\"Minutes\"',\n    '(input)': 'onInput($event)',\n    '(blur)': 'onBlur()',\n    '(keydown)': 'onKeydown($event)',\n    '(focus)': 'onFocus($event)',\n  },\n})\nexport class ScTimePickerMinutesInput {\n  private readonly input = inject(ScTimePickerInput);\n\n  private readonly timePicker = this.input.timePicker;\n\n  protected readonly displayValue = computed(() => {\n    const val = this.timePicker.value();\n    if (!val) return '00';\n    return val.minutes.toString().padStart(2, '0');\n  });\n\n  protected onInput(event: Event): void {\n    const el = event.target as HTMLInputElement;\n    const value = el.value.replace(/\\D/g, '');\n    const num = parseInt(value, 10);\n\n    if (!isNaN(num)) {\n      this.timePicker.setMinutes(Math.min(num, 59));\n    }\n  }\n\n  protected onBlur(): void {\n    this.input.focused.set(false);\n  }\n\n  protected onFocus(event: FocusEvent): void {\n    this.input.focused.set(true);\n    (event.target as HTMLInputElement).select();\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      const val = this.timePicker.value() || { hours: 0, minutes: 0 };\n      this.timePicker.setMinutes(val.minutes >= 59 ? 0 : val.minutes + 1);\n    } else if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      const val = this.timePicker.value() || { hours: 0, minutes: 0 };\n      this.timePicker.setMinutes(val.minutes <= 0 ? 59 : val.minutes - 1);\n    }\n  }\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker-period-am.js

@@ -0,0 +1,26 @@
+import { computed, Directive, inject } from '@angular/core';
+import { cn } from '../../utils';
+import { ScTimePickerPeriod } from './time-picker-period';
+import * as i0 from "@angular/core";
+export class ScTimePickerPeriodAM {
+    period = inject(ScTimePickerPeriod);
+    class = computed(() => cn('rounded-md px-2 py-1.5 text-sm font-medium transition-colors', this.period.isAM()
+        ? 'bg-primary text-primary-foreground'
+        : 'text-muted-foreground hover:bg-accent'), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriodAM, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ScTimePickerPeriodAM, isStandalone: true, selector: "button[scTimePickerPeriodAM]", host: { attributes: { "data-slot": "time-picker-period-am", "type": "button" }, listeners: { "click": "period.selectAM()" }, properties: { "class": "class()", "disabled": "period.timePicker.disabled()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriodAM, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scTimePickerPeriodAM]',
+                    host: {
+                        'data-slot': 'time-picker-period-am',
+                        type: 'button',
+                        '[class]': 'class()',
+                        '[disabled]': 'period.timePicker.disabled()',
+                        '(click)': 'period.selectAM()',
+                    },
+                }]
+        }] });
+//# sourceMappingURL=time-picker-period-am.js.map

package/esm2022/lib/components/time-picker/time-picker-period-am.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-period-am.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-period-am.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;;AAY1D,MAAM,OAAO,oBAAoB;IACZ,MAAM,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAEpC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,8DAA8D,EAC9D,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;QAChB,CAAC,CAAC,oCAAoC;QACtC,CAAC,CAAC,uCAAuC,CAC5C,iDACF,CAAC;uGAVS,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBAVhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,IAAI,EAAE;wBACJ,WAAW,EAAE,uBAAuB;wBACpC,IAAI,EAAE,QAAQ;wBACd,SAAS,EAAE,SAAS;wBACpB,YAAY,EAAE,8BAA8B;wBAC5C,SAAS,EAAE,mBAAmB;qBAC/B;iBACF","sourcesContent":["import { computed, Directive, inject } from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScTimePickerPeriod } from './time-picker-period';\n\n@Directive({\n  selector: 'button[scTimePickerPeriodAM]',\n  host: {\n    'data-slot': 'time-picker-period-am',\n    type: 'button',\n    '[class]': 'class()',\n    '[disabled]': 'period.timePicker.disabled()',\n    '(click)': 'period.selectAM()',\n  },\n})\nexport class ScTimePickerPeriodAM {\n  protected readonly period = inject(ScTimePickerPeriod);\n\n  protected readonly class = computed(() =>\n    cn(\n      'rounded-md px-2 py-1.5 text-sm font-medium transition-colors',\n      this.period.isAM()\n        ? 'bg-primary text-primary-foreground'\n        : 'text-muted-foreground hover:bg-accent',\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker-period-pm.js

@@ -0,0 +1,26 @@
+import { computed, Directive, inject } from '@angular/core';
+import { cn } from '../../utils';
+import { ScTimePickerPeriod } from './time-picker-period';
+import * as i0 from "@angular/core";
+export class ScTimePickerPeriodPM {
+    period = inject(ScTimePickerPeriod);
+    class = computed(() => cn('rounded-md px-2 py-1.5 text-sm font-medium transition-colors', this.period.isPM()
+        ? 'bg-primary text-primary-foreground'
+        : 'text-muted-foreground hover:bg-accent'), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriodPM, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ScTimePickerPeriodPM, isStandalone: true, selector: "button[scTimePickerPeriodPM]", host: { attributes: { "data-slot": "time-picker-period-pm", "type": "button" }, listeners: { "click": "period.selectPM()" }, properties: { "class": "class()", "disabled": "period.timePicker.disabled()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriodPM, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scTimePickerPeriodPM]',
+                    host: {
+                        'data-slot': 'time-picker-period-pm',
+                        type: 'button',
+                        '[class]': 'class()',
+                        '[disabled]': 'period.timePicker.disabled()',
+                        '(click)': 'period.selectPM()',
+                    },
+                }]
+        }] });
+//# sourceMappingURL=time-picker-period-pm.js.map

package/esm2022/lib/components/time-picker/time-picker-period-pm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-period-pm.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-period-pm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;;AAY1D,MAAM,OAAO,oBAAoB;IACZ,MAAM,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAEpC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,8DAA8D,EAC9D,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;QAChB,CAAC,CAAC,oCAAoC;QACtC,CAAC,CAAC,uCAAuC,CAC5C,iDACF,CAAC;uGAVS,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBAVhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,IAAI,EAAE;wBACJ,WAAW,EAAE,uBAAuB;wBACpC,IAAI,EAAE,QAAQ;wBACd,SAAS,EAAE,SAAS;wBACpB,YAAY,EAAE,8BAA8B;wBAC5C,SAAS,EAAE,mBAAmB;qBAC/B;iBACF","sourcesContent":["import { computed, Directive, inject } from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScTimePickerPeriod } from './time-picker-period';\n\n@Directive({\n  selector: 'button[scTimePickerPeriodPM]',\n  host: {\n    'data-slot': 'time-picker-period-pm',\n    type: 'button',\n    '[class]': 'class()',\n    '[disabled]': 'period.timePicker.disabled()',\n    '(click)': 'period.selectPM()',\n  },\n})\nexport class ScTimePickerPeriodPM {\n  protected readonly period = inject(ScTimePickerPeriod);\n\n  protected readonly class = computed(() =>\n    cn(\n      'rounded-md px-2 py-1.5 text-sm font-medium transition-colors',\n      this.period.isPM()\n        ? 'bg-primary text-primary-foreground'\n        : 'text-muted-foreground hover:bg-accent',\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker-period.js

@@ -0,0 +1,46 @@
+import { computed, Directive, inject, input } from '@angular/core';
+import { cn } from '../../utils';
+import { SC_TIME_PICKER } from './time-picker';
+import * as i0 from "@angular/core";
+export class ScTimePickerPeriod {
+    timePicker = inject(SC_TIME_PICKER);
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('ml-2 inline-flex rounded-md border border-input bg-background p-0.5', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    isAM = computed(() => {
+        const val = this.timePicker.value();
+        return val?.period === 'AM' || (!val?.period && (val?.hours ?? 0) < 12);
+    }, ...(ngDevMode ? [{ debugName: "isAM" }] : []));
+    isPM = computed(() => {
+        const val = this.timePicker.value();
+        return val?.period === 'PM' || (!val?.period && (val?.hours ?? 0) >= 12);
+    }, ...(ngDevMode ? [{ debugName: "isPM" }] : []));
+    selectAM() {
+        this.timePicker.setPeriod('AM');
+        const val = this.timePicker.value();
+        if (val && val.hours >= 12) {
+            this.timePicker.setHours(val.hours - 12);
+        }
+    }
+    selectPM() {
+        this.timePicker.setPeriod('PM');
+        const val = this.timePicker.value();
+        if (val && val.hours < 12) {
+            this.timePicker.setHours(val.hours + 12);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriod, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScTimePickerPeriod, isStandalone: true, selector: "[scTimePickerPeriod]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "time-picker-period", "role": "group" }, properties: { "class": "class()", "attr.aria-label": "\"Select AM or PM\"" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerPeriod, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scTimePickerPeriod]',
+                    host: {
+                        'data-slot': 'time-picker-period',
+                        '[class]': 'class()',
+                        role: 'group',
+                        '[attr.aria-label]': '"Select AM or PM"',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=time-picker-period.js.map

package/esm2022/lib/components/time-picker/time-picker-period.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-period.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-period.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;;AAW/C,MAAM,OAAO,kBAAkB;IACpB,UAAU,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;IAEpC,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,qEAAqE,EACrE,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEO,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC5B,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACpC,OAAO,GAAG,EAAE,MAAM,KAAK,IAAI,IAAI,CAAC,CAAC,GAAG,EAAE,MAAM,IAAI,CAAC,GAAG,EAAE,KAAK,IAAI,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC;IAC1E,CAAC,gDAAC,CAAC;IAEM,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC5B,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACpC,OAAO,GAAG,EAAE,MAAM,KAAK,IAAI,IAAI,CAAC,CAAC,GAAG,EAAE,MAAM,IAAI,CAAC,GAAG,EAAE,KAAK,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3E,CAAC,gDAAC,CAAC;IAEH,QAAQ;QACN,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAChC,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACpC,IAAI,GAAG,IAAI,GAAG,CAAC,KAAK,IAAI,EAAE,EAAE,CAAC;YAC3B,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAChC,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACpC,IAAI,GAAG,IAAI,GAAG,CAAC,KAAK,GAAG,EAAE,EAAE,CAAC;YAC1B,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC;uGApCU,kBAAkB;2FAAlB,kBAAkB;;2FAAlB,kBAAkB;kBAT9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,IAAI,EAAE;wBACJ,WAAW,EAAE,oBAAoB;wBACjC,SAAS,EAAE,SAAS;wBACpB,IAAI,EAAE,OAAO;wBACb,mBAAmB,EAAE,mBAAmB;qBACzC;iBACF","sourcesContent":["import { computed, Directive, inject, input } from '@angular/core';\nimport { cn } from '../../utils';\nimport { SC_TIME_PICKER } from './time-picker';\n\n@Directive({\n  selector: '[scTimePickerPeriod]',\n  host: {\n    'data-slot': 'time-picker-period',\n    '[class]': 'class()',\n    role: 'group',\n    '[attr.aria-label]': '\"Select AM or PM\"',\n  },\n})\nexport class ScTimePickerPeriod {\n  readonly timePicker = inject(SC_TIME_PICKER);\n\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'ml-2 inline-flex rounded-md border border-input bg-background p-0.5',\n      this.classInput(),\n    ),\n  );\n\n  readonly isAM = computed(() => {\n    const val = this.timePicker.value();\n    return val?.period === 'AM' || (!val?.period && (val?.hours ?? 0) < 12);\n  });\n\n  readonly isPM = computed(() => {\n    const val = this.timePicker.value();\n    return val?.period === 'PM' || (!val?.period && (val?.hours ?? 0) >= 12);\n  });\n\n  selectAM(): void {\n    this.timePicker.setPeriod('AM');\n    const val = this.timePicker.value();\n    if (val && val.hours >= 12) {\n      this.timePicker.setHours(val.hours - 12);\n    }\n  }\n\n  selectPM(): void {\n    this.timePicker.setPeriod('PM');\n    const val = this.timePicker.value();\n    if (val && val.hours < 12) {\n      this.timePicker.setHours(val.hours + 12);\n    }\n  }\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker-seconds-input.js

@@ -0,0 +1,57 @@
+import { computed, Directive, inject } from '@angular/core';
+import { ScTimePickerInput } from './time-picker-input';
+import * as i0 from "@angular/core";
+export class ScTimePickerSecondsInput {
+    input = inject(ScTimePickerInput);
+    timePicker = this.input.timePicker;
+    displayValue = computed(() => {
+        const val = this.timePicker.value();
+        if (!val)
+            return '00';
+        return (val.seconds ?? 0).toString().padStart(2, '0');
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : []));
+    onInput(event) {
+        const el = event.target;
+        const value = el.value.replace(/\D/g, '');
+        const num = parseInt(value, 10);
+        if (!isNaN(num)) {
+            this.timePicker.setSeconds(Math.min(num, 59));
+        }
+    }
+    onBlur() {
+        this.input.focused.set(false);
+    }
+    onFocus(event) {
+        this.input.focused.set(true);
+        event.target.select();
+    }
+    onKeydown(event) {
+        if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            const val = this.timePicker.value() || { hours: 0, minutes: 0 };
+            this.timePicker.setSeconds((val.seconds ?? 0) >= 59 ? 0 : (val.seconds ?? 0) + 1);
+        }
+        else if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            const val = this.timePicker.value() || { hours: 0, minutes: 0 };
+            this.timePicker.setSeconds((val.seconds ?? 0) <= 0 ? 59 : (val.seconds ?? 0) - 1);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerSecondsInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ScTimePickerSecondsInput, isStandalone: true, selector: "input[scTimePickerSecondsInput]", host: { listeners: { "input": "onInput($event)", "blur": "onBlur()", "keydown": "onKeydown($event)", "focus": "onFocus($event)" }, properties: { "value": "displayValue()", "attr.aria-label": "\"Seconds\"" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePickerSecondsInput, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'input[scTimePickerSecondsInput]',
+                    host: {
+                        '[value]': 'displayValue()',
+                        '[attr.aria-label]': '"Seconds"',
+                        '(input)': 'onInput($event)',
+                        '(blur)': 'onBlur()',
+                        '(keydown)': 'onKeydown($event)',
+                        '(focus)': 'onFocus($event)',
+                    },
+                }]
+        }] });
+//# sourceMappingURL=time-picker-seconds-input.js.map

package/esm2022/lib/components/time-picker/time-picker-seconds-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-seconds-input.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-seconds-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { computed, Directive, inject } from '@angular/core';\nimport { ScTimePickerInput } from './time-picker-input';\n\n@Directive({\n  selector: 'input[scTimePickerSecondsInput]',\n  host: {\n    '[value]': 'displayValue()',\n    '[attr.aria-label]': '\"Seconds\"',\n    '(input)': 'onInput($event)',\n    '(blur)': 'onBlur()',\n    '(keydown)': 'onKeydown($event)',\n    '(focus)': 'onFocus($event)',\n  },\n})\nexport class ScTimePickerSecondsInput {\n  private readonly input = inject(ScTimePickerInput);\n\n  private readonly timePicker = this.input.timePicker;\n\n  protected readonly displayValue = computed(() => {\n    const val = this.timePicker.value();\n    if (!val) return '00';\n    return (val.seconds ?? 0).toString().padStart(2, '0');\n  });\n\n  protected onInput(event: Event): void {\n    const el = event.target as HTMLInputElement;\n    const value = el.value.replace(/\\D/g, '');\n    const num = parseInt(value, 10);\n\n    if (!isNaN(num)) {\n      this.timePicker.setSeconds(Math.min(num, 59));\n    }\n  }\n\n  protected onBlur(): void {\n    this.input.focused.set(false);\n  }\n\n  protected onFocus(event: FocusEvent): void {\n    this.input.focused.set(true);\n    (event.target as HTMLInputElement).select();\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      const val = this.timePicker.value() || { hours: 0, minutes: 0 };\n      this.timePicker.setSeconds(\n        (val.seconds ?? 0) >= 59 ? 0 : (val.seconds ?? 0) + 1,\n      );\n    } else if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      const val = this.timePicker.value() || { hours: 0, minutes: 0 };\n      this.timePicker.setSeconds(\n        (val.seconds ?? 0) <= 0 ? 59 : (val.seconds ?? 0) - 1,\n      );\n    }\n  }\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker-separator.js

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

package/esm2022/lib/components/time-picker/time-picker-separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-separator.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker-separator.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,qBAAqB;IACvB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,2CAA2C,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDACnE,CAAC;uGALS,qBAAqB;2FAArB,qBAAqB;;2FAArB,qBAAqB;kBAPjC,SAAS;mBAAC;oBACT,QAAQ,EAAE,yBAAyB;oBACnC,IAAI,EAAE;wBACJ,WAAW,EAAE,uBAAuB;wBACpC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: '[scTimePickerSeparator]',\n  host: {\n    'data-slot': 'time-picker-separator',\n    '[class]': 'class()',\n  },\n})\nexport class ScTimePickerSeparator {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('text-lg font-medium text-muted-foreground', this.classInput()),\n  );\n}\n"]}

package/esm2022/lib/components/time-picker/time-picker.js

@@ -0,0 +1,58 @@
+import { computed, Directive, InjectionToken, input, model, } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export const SC_TIME_PICKER = new InjectionToken('SC_TIME_PICKER');
+export class ScTimePicker {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    format = input('12h', ...(ngDevMode ? [{ debugName: "format" }] : []));
+    showSeconds = input(false, ...(ngDevMode ? [{ debugName: "showSeconds" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    class = computed(() => cn('inline-flex items-center gap-1', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    formattedTime = computed(() => {
+        const val = this.value();
+        if (!val)
+            return '';
+        const hours = this.format() === '12h' ? val.hours % 12 || 12 : val.hours;
+        const hoursStr = hours.toString().padStart(2, '0');
+        const minutesStr = val.minutes.toString().padStart(2, '0');
+        let time = `${hoursStr}:${minutesStr}`;
+        if (this.showSeconds() && val.seconds !== undefined) {
+            time += `:${val.seconds.toString().padStart(2, '0')}`;
+        }
+        if (this.format() === '12h' && val.period) {
+            time += ` ${val.period}`;
+        }
+        return time;
+    }, ...(ngDevMode ? [{ debugName: "formattedTime" }] : []));
+    setHours(hours) {
+        const current = this.value() || { hours: 0, minutes: 0 };
+        this.value.set({ ...current, hours });
+    }
+    setMinutes(minutes) {
+        const current = this.value() || { hours: 0, minutes: 0 };
+        this.value.set({ ...current, minutes });
+    }
+    setSeconds(seconds) {
+        const current = this.value() || { hours: 0, minutes: 0 };
+        this.value.set({ ...current, seconds });
+    }
+    setPeriod(period) {
+        const current = this.value() || { hours: 0, minutes: 0 };
+        this.value.set({ ...current, period });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScTimePicker, isStandalone: true, selector: "[scTimePicker]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "data-slot": "time-picker" }, properties: { "class": "class()" } }, providers: [{ provide: SC_TIME_PICKER, useExisting: ScTimePicker }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScTimePicker, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scTimePicker]',
+                    providers: [{ provide: SC_TIME_PICKER, useExisting: ScTimePicker }],
+                    host: {
+                        'data-slot': 'time-picker',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], showSeconds: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeconds", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
+//# sourceMappingURL=time-picker.js.map

package/esm2022/lib/components/time-picker/time-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/time-picker/time-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  computed,\n  Directive,\n  InjectionToken,\n  input,\n  model,\n} from '@angular/core';\nimport { cn } from '../../utils';\n\nexport type ScTimeFormat = '12h' | '24h';\nexport type ScTimePeriod = 'AM' | 'PM';\n\nexport interface ScTimeValue {\n  hours: number;\n  minutes: number;\n  seconds?: number;\n  period?: ScTimePeriod;\n}\n\nexport const SC_TIME_PICKER = new InjectionToken<ScTimePicker>(\n  'SC_TIME_PICKER',\n);\n\n@Directive({\n  selector: '[scTimePicker]',\n  providers: [{ provide: SC_TIME_PICKER, useExisting: ScTimePicker }],\n  host: {\n    'data-slot': 'time-picker',\n    '[class]': 'class()',\n  },\n})\nexport class ScTimePicker {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly format = input<ScTimeFormat>('12h');\n  readonly showSeconds = input<boolean>(false);\n  readonly disabled = input<boolean>(false);\n  readonly value = model<ScTimeValue | null>(null);\n\n  protected readonly class = computed(() =>\n    cn('inline-flex items-center gap-1', this.classInput()),\n  );\n\n  readonly formattedTime = computed(() => {\n    const val = this.value();\n    if (!val) return '';\n\n    const hours = this.format() === '12h' ? val.hours % 12 || 12 : val.hours;\n    const hoursStr = hours.toString().padStart(2, '0');\n    const minutesStr = val.minutes.toString().padStart(2, '0');\n\n    let time = `${hoursStr}:${minutesStr}`;\n\n    if (this.showSeconds() && val.seconds !== undefined) {\n      time += `:${val.seconds.toString().padStart(2, '0')}`;\n    }\n\n    if (this.format() === '12h' && val.period) {\n      time += ` ${val.period}`;\n    }\n\n    return time;\n  });\n\n  setHours(hours: number): void {\n    const current = this.value() || { hours: 0, minutes: 0 };\n    this.value.set({ ...current, hours });\n  }\n\n  setMinutes(minutes: number): void {\n    const current = this.value() || { hours: 0, minutes: 0 };\n    this.value.set({ ...current, minutes });\n  }\n\n  setSeconds(seconds: number): void {\n    const current = this.value() || { hours: 0, minutes: 0 };\n    this.value.set({ ...current, seconds });\n  }\n\n  setPeriod(period: ScTimePeriod): void {\n    const current = this.value() || { hours: 0, minutes: 0 };\n    this.value.set({ ...current, period });\n  }\n}\n"]}

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

@@ -0,0 +1,7 @@
+export { ScToast } from './toast';
+export { ScToastAction } from './toast-action';
+export { ScToastClose } from './toast-close';
+export { ScToastDescription } from './toast-description';
+export { ScToastTitle } from './toast-title';
+export { ScToaster } from './toaster';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC","sourcesContent":["export { ScToast } from './toast';\nexport { ScToastAction } from './toast-action';\nexport { ScToastClose } from './toast-close';\nexport { ScToastDescription } from './toast-description';\nexport { ScToastTitle } from './toast-title';\nexport { ScToaster } from './toaster';\nexport type {\n  ScToastConfig,\n  ScToastData,\n  ScToastPosition,\n  ScToastVariant,\n} from './toast.types';\n"]}

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

@@ -0,0 +1,21 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScToastAction {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3', 'text-sm font-medium transition-colors', 'hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring', 'disabled:pointer-events-none disabled:opacity-50', 'group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30', 'group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground', 'group-[.destructive]:focus:ring-destructive', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScToastAction, isStandalone: true, selector: "button[scToastAction]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "toast-action", "type": "button" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastAction, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scToastAction]',
+                    host: {
+                        'data-slot': 'toast-action',
+                        type: 'button',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=toast-action.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"toast-action.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast-action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAUjC,MAAM,OAAO,aAAa;IACf,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,4FAA4F,EAC5F,uCAAuC,EACvC,oEAAoE,EACpE,kDAAkD,EAClD,uFAAuF,EACvF,kGAAkG,EAClG,6CAA6C,EAC7C,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAdS,aAAa;2FAAb,aAAa;;2FAAb,aAAa;kBARzB,SAAS;mBAAC;oBACT,QAAQ,EAAE,uBAAuB;oBACjC,IAAI,EAAE;wBACJ,WAAW,EAAE,cAAc;wBAC3B,IAAI,EAAE,QAAQ;wBACd,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'button[scToastAction]',\n  host: {\n    'data-slot': 'toast-action',\n    type: 'button',\n    '[class]': 'class()',\n  },\n})\nexport class ScToastAction {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3',\n      'text-sm font-medium transition-colors',\n      'hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring',\n      'disabled:pointer-events-none disabled:opacity-50',\n      'group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30',\n      'group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground',\n      'group-[.destructive]:focus:ring-destructive',\n      this.classInput(),\n    ),\n  );\n}\n"]}

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

@@ -0,0 +1,25 @@
+import { computed, Directive, input, output } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScToastClose {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    /** Emitted when close button is clicked */
+    close = output();
+    class = computed(() => cn('absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity', 'hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100', 'group-[.destructive]:text-red-800/50 group-[.destructive]:hover:text-red-800', 'group-[.destructive]:focus:ring-red-400', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastClose, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScToastClose, isStandalone: true, selector: "button[scToastClose]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close" }, host: { attributes: { "data-slot": "toast-close", "type": "button", "aria-label": "Close" }, listeners: { "click": "close.emit()" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScToastClose, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[scToastClose]',
+                    host: {
+                        'data-slot': 'toast-close',
+                        type: 'button',
+                        '[class]': 'class()',
+                        'aria-label': 'Close',
+                        '(click)': 'close.emit()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], close: [{ type: i0.Output, args: ["close"] }] } });
+//# sourceMappingURL=toast-close.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"toast-close.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast-close.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAYjC,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAE5D,2CAA2C;IAClC,KAAK,GAAG,MAAM,EAAQ,CAAC;IAEb,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,uFAAuF,EACvF,iGAAiG,EACjG,8EAA8E,EAC9E,yCAAyC,EACzC,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAdS,YAAY;2FAAZ,YAAY;;2FAAZ,YAAY;kBAVxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,IAAI,EAAE,QAAQ;wBACd,SAAS,EAAE,SAAS;wBACpB,YAAY,EAAE,OAAO;wBACrB,SAAS,EAAE,cAAc;qBAC1B;iBACF","sourcesContent":["import { computed, Directive, input, output } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'button[scToastClose]',\n  host: {\n    'data-slot': 'toast-close',\n    type: 'button',\n    '[class]': 'class()',\n    'aria-label': 'Close',\n    '(click)': 'close.emit()',\n  },\n})\nexport class ScToastClose {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  /** Emitted when close button is clicked */\n  readonly close = output<void>();\n\n  protected readonly class = computed(() =>\n    cn(\n      'absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity',\n      'hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100',\n      'group-[.destructive]:text-red-800/50 group-[.destructive]:hover:text-red-800',\n      'group-[.destructive]:focus:ring-red-400',\n      this.classInput(),\n    ),\n  );\n}\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"toast-description.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/toast/toast-description.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,kBAAkB;IACpB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,oBAAoB,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDAC5C,CAAC;uGALS,kBAAkB;2FAAlB,kBAAkB;;2FAAlB,kBAAkB;kBAP9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,IAAI,EAAE;wBACJ,WAAW,EAAE,mBAAmB;wBAChC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: '[scToastDescription]',\n  host: {\n    'data-slot': 'toast-description',\n    '[class]': 'class()',\n  },\n})\nexport class ScToastDescription {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('text-sm opacity-90', this.classInput()),\n  );\n}\n"]}