@sonny-ui/core 0.1.0-alpha.16 → 0.1.0-alpha.17

package/fesm2022/sonny-ui-core.mjs

@@ -5606,7 +5606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                 }]
         }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const sizeMap = { sm: 48, md: 72, lg: 96 };
+const sizeMap$1 = { sm: 48, md: 72, lg: 96 };
 const variantColorMap = {
     default: 'stroke-primary',
     success: 'stroke-green-600 dark:stroke-green-500',
@@ -5620,7 +5620,7 @@ class SnyRadialProgressComponent {
     thickness = input(4, ...(ngDevMode ? [{ debugName: "thickness" }] : /* istanbul ignore next */ []));
     variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     class = input('', ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    svgSize = computed(() => sizeMap[this.size()], ...(ngDevMode ? [{ debugName: "svgSize" }] : /* istanbul ignore next */ []));
+    svgSize = computed(() => sizeMap$1[this.size()], ...(ngDevMode ? [{ debugName: "svgSize" }] : /* istanbul ignore next */ []));
     radius = computed(() => (this.svgSize() - this.thickness()) / 2, ...(ngDevMode ? [{ debugName: "radius" }] : /* istanbul ignore next */ []));
     circumference = computed(() => 2 * Math.PI * this.radius(), ...(ngDevMode ? [{ debugName: "circumference" }] : /* istanbul ignore next */ []));
     offset = computed(() => this.circumference() - (this.value() / 100) * this.circumference(), ...(ngDevMode ? [{ debugName: "offset" }] : /* istanbul ignore next */ []));
@@ -8237,6 +8237,602 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
             args: [{ providedIn: 'root' }]
         }] });
 
+const numberInputVariants = cva('inline-flex items-center border border-border rounded-md bg-background transition-colors focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2', {
+    variants: {
+        size: {
+            sm: 'h-9 text-xs',
+            md: 'h-10 text-sm',
+            lg: 'h-11 text-base',
+        },
+    },
+    defaultVariants: { size: 'md' },
+});
+
+class SnyNumberInputComponent {
+    value = model(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    min = input(null, ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    step = input(1, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    inputValue = signal('0', ...(ngDevMode ? [{ debugName: "inputValue" }] : /* istanbul ignore next */ []));
+    _disabledByCva = signal(false, ...(ngDevMode ? [{ debugName: "_disabledByCva" }] : /* istanbul ignore next */ []));
+    isDisabled = computed(() => this.disabled() || this._disabledByCva(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+    atMin = computed(() => this.min() !== null && this.value() <= this.min(), ...(ngDevMode ? [{ debugName: "atMin" }] : /* istanbul ignore next */ []));
+    atMax = computed(() => this.max() !== null && this.value() >= this.max(), ...(ngDevMode ? [{ debugName: "atMax" }] : /* istanbul ignore next */ []));
+    containerClass = computed(() => cn(numberInputVariants({ size: this.size() }), this.isDisabled() && 'opacity-50', this.class()), ...(ngDevMode ? [{ debugName: "containerClass" }] : /* istanbul ignore next */ []));
+    _onChange = () => { };
+    _onTouched = () => { };
+    constructor() {
+        effect(() => {
+            const val = this.value();
+            untracked(() => this.inputValue.set(String(val)));
+        });
+    }
+    writeValue(val) {
+        this.value.set(val ?? 0);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._disabledByCva.set(isDisabled);
+    }
+    increment() {
+        this.setValue(this.value() + this.step());
+    }
+    decrement() {
+        this.setValue(this.value() - this.step());
+    }
+    onInput(event) {
+        this.inputValue.set(event.target.value);
+    }
+    commitValue() {
+        const parsed = parseFloat(this.inputValue());
+        if (isNaN(parsed)) {
+            this.inputValue.set(String(this.value()));
+        }
+        else {
+            this.setValue(parsed);
+        }
+        this._onTouched();
+    }
+    onKeydown(event) {
+        switch (event.key) {
+            case 'ArrowUp':
+                event.preventDefault();
+                this.increment();
+                break;
+            case 'ArrowDown':
+                event.preventDefault();
+                this.decrement();
+                break;
+        }
+    }
+    setValue(raw) {
+        let clamped = raw;
+        if (this.min() !== null)
+            clamped = Math.max(this.min(), clamped);
+        if (this.max() !== null)
+            clamped = Math.min(this.max(), clamped);
+        const rounded = parseFloat(clamped.toFixed(10));
+        this.value.set(rounded);
+        this._onChange(rounded);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: SnyNumberInputComponent, isStandalone: true, selector: "sny-number-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
+            { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SnyNumberInputComponent), multi: true },
+        ], ngImport: i0, template: `
+    <div [class]="containerClass()">
+      <button
+        type="button"
+        class="px-2.5 hover:bg-accent transition-colors border-r border-border disabled:opacity-40 disabled:cursor-not-allowed"
+        [disabled]="isDisabled() || atMin()"
+        (click)="decrement()"
+        aria-label="Decrease"
+      >
+        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/></svg>
+      </button>
+      <input
+        #inputEl
+        type="text"
+        inputmode="decimal"
+        class="flex-1 w-14 text-center outline-none bg-transparent font-medium"
+        [value]="inputValue()"
+        [disabled]="isDisabled()"
+        [placeholder]="placeholder()"
+        [attr.aria-label]="'Number input'"
+        [attr.aria-valuemin]="min() ?? null"
+        [attr.aria-valuemax]="max() ?? null"
+        [attr.aria-valuenow]="value()"
+        role="spinbutton"
+        (input)="onInput($event)"
+        (blur)="commitValue()"
+        (keydown)="onKeydown($event)"
+      />
+      <button
+        type="button"
+        class="px-2.5 hover:bg-accent transition-colors border-l border-border disabled:opacity-40 disabled:cursor-not-allowed"
+        [disabled]="isDisabled() || atMax()"
+        (click)="increment()"
+        aria-label="Increase"
+      >
+        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
+      </button>
+    </div>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyNumberInputComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sny-number-input',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [
+                        { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SnyNumberInputComponent), multi: true },
+                    ],
+                    template: `
+    <div [class]="containerClass()">
+      <button
+        type="button"
+        class="px-2.5 hover:bg-accent transition-colors border-r border-border disabled:opacity-40 disabled:cursor-not-allowed"
+        [disabled]="isDisabled() || atMin()"
+        (click)="decrement()"
+        aria-label="Decrease"
+      >
+        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/></svg>
+      </button>
+      <input
+        #inputEl
+        type="text"
+        inputmode="decimal"
+        class="flex-1 w-14 text-center outline-none bg-transparent font-medium"
+        [value]="inputValue()"
+        [disabled]="isDisabled()"
+        [placeholder]="placeholder()"
+        [attr.aria-label]="'Number input'"
+        [attr.aria-valuemin]="min() ?? null"
+        [attr.aria-valuemax]="max() ?? null"
+        [attr.aria-valuenow]="value()"
+        role="spinbutton"
+        (input)="onInput($event)"
+        (blur)="commitValue()"
+        (keydown)="onKeydown($event)"
+      />
+      <button
+        type="button"
+        class="px-2.5 hover:bg-accent transition-colors border-l border-border disabled:opacity-40 disabled:cursor-not-allowed"
+        [disabled]="isDisabled() || atMax()"
+        (click)="increment()"
+        aria-label="Increase"
+      >
+        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
+      </button>
+    </div>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
+const sizeMap = {
+    sm: { avatar: 'h-7 w-7 text-xs', counter: 'h-7 w-7 text-[10px]' },
+    md: { avatar: 'h-9 w-9 text-sm', counter: 'h-9 w-9 text-xs' },
+    lg: { avatar: 'h-11 w-11 text-base', counter: 'h-11 w-11 text-sm' },
+};
+const spacingMap = {
+    tight: '-space-x-3',
+    normal: '-space-x-2',
+};
+class SnyAvatarGroupComponent {
+    items = input.required(...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    max = input(3, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    spacing = input('normal', ...(ngDevMode ? [{ debugName: "spacing" }] : /* istanbul ignore next */ []));
+    visibleItems = computed(() => this.items().slice(0, this.max()), ...(ngDevMode ? [{ debugName: "visibleItems" }] : /* istanbul ignore next */ []));
+    overflowCount = computed(() => Math.max(0, this.items().length - this.max()), ...(ngDevMode ? [{ debugName: "overflowCount" }] : /* istanbul ignore next */ []));
+    containerClass = computed(() => cn('flex items-center', spacingMap[this.spacing()]), ...(ngDevMode ? [{ debugName: "containerClass" }] : /* istanbul ignore next */ []));
+    avatarClass = computed(() => cn('inline-block rounded-full object-cover ring-2 ring-background', sizeMap[this.size()].avatar), ...(ngDevMode ? [{ debugName: "avatarClass" }] : /* istanbul ignore next */ []));
+    fallbackClass = computed(() => cn('inline-flex items-center justify-center rounded-full bg-muted text-muted-foreground font-medium ring-2 ring-background', sizeMap[this.size()].avatar), ...(ngDevMode ? [{ debugName: "fallbackClass" }] : /* istanbul ignore next */ []));
+    counterClass = computed(() => cn('inline-flex items-center justify-center rounded-full bg-muted text-muted-foreground font-semibold ring-2 ring-background', sizeMap[this.size()].counter), ...(ngDevMode ? [{ debugName: "counterClass" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyAvatarGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: SnyAvatarGroupComponent, isStandalone: true, selector: "sny-avatar-group", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div [class]="containerClass()" role="group" [attr.aria-label]="'Group of ' + items().length + ' users'">
+      @for (item of visibleItems(); track $index) {
+        @if (item.src) {
+          <img
+            [src]="item.src"
+            [alt]="item.alt ?? ''"
+            [class]="avatarClass()"
+          />
+        } @else {
+          <div [class]="fallbackClass()">
+            {{ item.fallback ?? '?' }}
+          </div>
+        }
+      }
+      @if (overflowCount() > 0) {
+        <div [class]="counterClass()" [title]="overflowCount() + ' more'">
+          +{{ overflowCount() }}
+        </div>
+      }
+    </div>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyAvatarGroupComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sny-avatar-group',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <div [class]="containerClass()" role="group" [attr.aria-label]="'Group of ' + items().length + ' users'">
+      @for (item of visibleItems(); track $index) {
+        @if (item.src) {
+          <img
+            [src]="item.src"
+            [alt]="item.alt ?? ''"
+            [class]="avatarClass()"
+          />
+        } @else {
+          <div [class]="fallbackClass()">
+            {{ item.fallback ?? '?' }}
+          </div>
+        }
+      }
+      @if (overflowCount() > 0) {
+        <div [class]="counterClass()" [title]="overflowCount() + ' more'">
+          +{{ overflowCount() }}
+        </div>
+      }
+    </div>
+  `,
+                }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }] } });
+
+const tagInputContainerVariants = cva('flex flex-wrap gap-1.5 border border-border rounded-md bg-background px-2 cursor-text transition-colors focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2', {
+    variants: {
+        size: {
+            sm: 'min-h-[36px] py-1 text-xs',
+            md: 'min-h-[40px] py-1.5 text-sm',
+            lg: 'min-h-[44px] py-2 text-base',
+        },
+    },
+    defaultVariants: { size: 'md' },
+});
+const tagVariants = cva('inline-flex items-center gap-1 rounded-md font-medium', {
+    variants: {
+        size: {
+            sm: 'px-1.5 py-0.5 text-xs',
+            md: 'px-2 py-0.5 text-sm',
+            lg: 'px-2.5 py-1 text-sm',
+        },
+    },
+    defaultVariants: { size: 'md' },
+});
+
+class SnyTagInputComponent {
+    value = model([], ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    placeholder = input('Add tag...', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    maxTags = input(null, ...(ngDevMode ? [{ debugName: "maxTags" }] : /* istanbul ignore next */ []));
+    allowDuplicates = input(false, ...(ngDevMode ? [{ debugName: "allowDuplicates" }] : /* istanbul ignore next */ []));
+    removable = input(true, ...(ngDevMode ? [{ debugName: "removable" }] : /* istanbul ignore next */ []));
+    addOnBlur = input(true, ...(ngDevMode ? [{ debugName: "addOnBlur" }] : /* istanbul ignore next */ []));
+    separators = input(['Enter', ','], ...(ngDevMode ? [{ debugName: "separators" }] : /* istanbul ignore next */ []));
+    validate = input(null, ...(ngDevMode ? [{ debugName: "validate" }] : /* istanbul ignore next */ []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    tagAdded = output();
+    tagRemoved = output();
+    inputValue = signal('', ...(ngDevMode ? [{ debugName: "inputValue" }] : /* istanbul ignore next */ []));
+    _disabledByCva = signal(false, ...(ngDevMode ? [{ debugName: "_disabledByCva" }] : /* istanbul ignore next */ []));
+    isDisabled = computed(() => this.disabled() || this._disabledByCva(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+    atMax = computed(() => this.maxTags() !== null && this.value().length >= this.maxTags(), ...(ngDevMode ? [{ debugName: "atMax" }] : /* istanbul ignore next */ []));
+    containerClass = computed(() => cn(tagInputContainerVariants({ size: this.size() }), this.isDisabled() && 'opacity-50 cursor-not-allowed', this.class()), ...(ngDevMode ? [{ debugName: "containerClass" }] : /* istanbul ignore next */ []));
+    tagClass = computed(() => cn(tagVariants({ size: this.size() }), 'bg-secondary text-secondary-foreground'), ...(ngDevMode ? [{ debugName: "tagClass" }] : /* istanbul ignore next */ []));
+    inputRef = viewChild('inputEl', ...(ngDevMode ? [{ debugName: "inputRef" }] : /* istanbul ignore next */ []));
+    _onChange = () => { };
+    _onTouched = () => { };
+    writeValue(val) {
+        this.value.set(val ?? []);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._disabledByCva.set(isDisabled);
+    }
+    focusInput() {
+        this.inputRef()?.nativeElement.focus();
+    }
+    onInput(event) {
+        const val = event.target.value;
+        // Check if separator character was typed (e.g. comma)
+        const seps = this.separators().filter((s) => s.length === 1);
+        for (const sep of seps) {
+            if (val.includes(sep)) {
+                const parts = val.split(sep);
+                for (const part of parts) {
+                    this.addTag(part);
+                }
+                this.inputValue.set('');
+                return;
+            }
+        }
+        this.inputValue.set(val);
+    }
+    onKeydown(event) {
+        if (this.separators().includes(event.key) && event.key !== ',') {
+            event.preventDefault();
+            this.addTag(this.inputValue());
+            this.inputValue.set('');
+            return;
+        }
+        if (event.key === 'Backspace' && this.inputValue() === '') {
+            const tags = this.value();
+            if (tags.length > 0) {
+                this.removeTag(tags.length - 1);
+            }
+        }
+    }
+    onBlur() {
+        if (this.addOnBlur() && this.inputValue().trim()) {
+            this.addTag(this.inputValue());
+            this.inputValue.set('');
+        }
+        this._onTouched();
+    }
+    addTag(raw) {
+        const tag = raw.trim();
+        if (!tag)
+            return;
+        if (this.atMax())
+            return;
+        if (!this.allowDuplicates() && this.value().includes(tag))
+            return;
+        const validateFn = this.validate();
+        if (validateFn && !validateFn(tag))
+            return;
+        this.value.update((tags) => [...tags, tag]);
+        this._onChange(this.value());
+        this.tagAdded.emit(tag);
+    }
+    removeTag(index) {
+        const removed = this.value()[index];
+        this.value.update((tags) => tags.filter((_, i) => i !== index));
+        this._onChange(this.value());
+        this.tagRemoved.emit(removed);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyTagInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: SnyTagInputComponent, isStandalone: true, selector: "sny-tag-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, maxTags: { classPropertyName: "maxTags", publicName: "maxTags", isSignal: true, isRequired: false, transformFunction: null }, allowDuplicates: { classPropertyName: "allowDuplicates", publicName: "allowDuplicates", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, addOnBlur: { classPropertyName: "addOnBlur", publicName: "addOnBlur", isSignal: true, isRequired: false, transformFunction: null }, separators: { classPropertyName: "separators", publicName: "separators", isSignal: true, isRequired: false, transformFunction: null }, validate: { classPropertyName: "validate", publicName: "validate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", tagAdded: "tagAdded", tagRemoved: "tagRemoved" }, providers: [
+            { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SnyTagInputComponent), multi: true },
+        ], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div [class]="containerClass()" (click)="focusInput()">
+      @for (tag of value(); track tag; let i = $index) {
+        <span [class]="tagClass()">
+          {{ tag }}
+          @if (removable() && !isDisabled()) {
+            <button
+              type="button"
+              class="hover:text-destructive transition-colors leading-none"
+              (click)="removeTag(i); $event.stopPropagation()"
+              [attr.aria-label]="'Remove ' + tag"
+            >
+              <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
+            </button>
+          }
+        </span>
+      }
+      @if (!atMax()) {
+        <input
+          #inputEl
+          type="text"
+          class="flex-1 min-w-[80px] outline-none bg-transparent"
+          [placeholder]="value().length === 0 ? placeholder() : ''"
+          [disabled]="isDisabled()"
+          [value]="inputValue()"
+          (input)="onInput($event)"
+          (keydown)="onKeydown($event)"
+          (blur)="onBlur()"
+          [attr.aria-label]="'Add tag'"
+        />
+      }
+    </div>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyTagInputComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sny-tag-input',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [
+                        { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SnyTagInputComponent), multi: true },
+                    ],
+                    template: `
+    <div [class]="containerClass()" (click)="focusInput()">
+      @for (tag of value(); track tag; let i = $index) {
+        <span [class]="tagClass()">
+          {{ tag }}
+          @if (removable() && !isDisabled()) {
+            <button
+              type="button"
+              class="hover:text-destructive transition-colors leading-none"
+              (click)="removeTag(i); $event.stopPropagation()"
+              [attr.aria-label]="'Remove ' + tag"
+            >
+              <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
+            </button>
+          }
+        </span>
+      }
+      @if (!atMax()) {
+        <input
+          #inputEl
+          type="text"
+          class="flex-1 min-w-[80px] outline-none bg-transparent"
+          [placeholder]="value().length === 0 ? placeholder() : ''"
+          [disabled]="isDisabled()"
+          [value]="inputValue()"
+          (input)="onInput($event)"
+          (keydown)="onKeydown($event)"
+          (blur)="onBlur()"
+          [attr.aria-label]="'Add tag'"
+        />
+      }
+    </div>
+  `,
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], maxTags: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxTags", required: false }] }], allowDuplicates: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDuplicates", required: false }] }], removable: [{ type: i0.Input, args: [{ isSignal: true, alias: "removable", required: false }] }], addOnBlur: [{ type: i0.Input, args: [{ isSignal: true, alias: "addOnBlur", required: false }] }], separators: [{ type: i0.Input, args: [{ isSignal: true, alias: "separators", required: false }] }], validate: [{ type: i0.Input, args: [{ isSignal: true, alias: "validate", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], tagAdded: [{ type: i0.Output, args: ["tagAdded"] }], tagRemoved: [{ type: i0.Output, args: ["tagRemoved"] }], inputRef: [{ type: i0.ViewChild, args: ['inputEl', { isSignal: true }] }] } });
+
+const SNY_POPOVER = new InjectionToken('SnyPopover');
+class SnyPopoverDirective {
+    elRef = inject(ElementRef);
+    matchWidth = input(false, ...(ngDevMode ? [{ debugName: "matchWidth" }] : /* istanbul ignore next */ []));
+    offset = input(4, ...(ngDevMode ? [{ debugName: "offset" }] : /* istanbul ignore next */ []));
+    closeOnOutside = input(true, ...(ngDevMode ? [{ debugName: "closeOnOutside" }] : /* istanbul ignore next */ []));
+    closeOnEscape = input(true, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    triggerEl = signal(null, ...(ngDevMode ? [{ debugName: "triggerEl" }] : /* istanbul ignore next */ []));
+    panelEl = signal(null, ...(ngDevMode ? [{ debugName: "panelEl" }] : /* istanbul ignore next */ []));
+    scrollHandler = null;
+    resizeHandler = null;
+    toggle() {
+        if (this.isOpen()) {
+            this.close();
+        }
+        else {
+            this.open();
+        }
+    }
+    open() {
+        this.isOpen.set(true);
+        this.addListeners();
+        setTimeout(() => this.updatePosition());
+    }
+    close() {
+        this.isOpen.set(false);
+        this.removeListeners();
+    }
+    updatePosition() {
+        const trigger = this.triggerEl();
+        const panel = this.panelEl();
+        if (!trigger || !panel)
+            return;
+        const rect = trigger.getBoundingClientRect();
+        panel.style.top = `${rect.bottom + this.offset()}px`;
+        panel.style.left = `${rect.left}px`;
+        if (this.matchWidth()) {
+            panel.style.width = `${rect.width}px`;
+        }
+    }
+    addListeners() {
+        this.removeListeners();
+        this.scrollHandler = () => {
+            requestAnimationFrame(() => this.updatePosition());
+        };
+        this.resizeHandler = () => {
+            requestAnimationFrame(() => this.updatePosition());
+        };
+        document.addEventListener('scroll', this.scrollHandler, { capture: true, passive: true });
+        window.addEventListener('resize', this.resizeHandler, { passive: true });
+    }
+    removeListeners() {
+        if (this.scrollHandler) {
+            document.removeEventListener('scroll', this.scrollHandler, { capture: true });
+            this.scrollHandler = null;
+        }
+        if (this.resizeHandler) {
+            window.removeEventListener('resize', this.resizeHandler);
+            this.resizeHandler = null;
+        }
+    }
+    onDocumentClick(event) {
+        if (this.closeOnOutside() && this.isOpen() && !this.elRef.nativeElement.contains(event.target)) {
+            this.close();
+        }
+    }
+    onEscape() {
+        if (this.closeOnEscape() && this.isOpen()) {
+            this.close();
+        }
+    }
+    ngOnDestroy() {
+        this.removeListeners();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: SnyPopoverDirective, isStandalone: true, selector: "[snyPopover]", inputs: { matchWidth: { classPropertyName: "matchWidth", publicName: "matchWidth", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutside: { classPropertyName: "closeOnOutside", publicName: "closeOnOutside", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "onDocumentClick($event)", "keydown.escape": "onEscape()" }, properties: { "class": "\"relative inline-block\"" } }, providers: [{ provide: SNY_POPOVER, useExisting: SnyPopoverDirective }], exportAs: ["snyPopover"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[snyPopover]',
+                    standalone: true,
+                    exportAs: 'snyPopover',
+                    providers: [{ provide: SNY_POPOVER, useExisting: SnyPopoverDirective }],
+                    host: {
+                        '[class]': '"relative inline-block"',
+                    },
+                }]
+        }], propDecorators: { matchWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "matchWidth", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }], closeOnOutside: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnOutside", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], onDocumentClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }], onEscape: [{
+                type: HostListener,
+                args: ['keydown.escape']
+            }] } });
+class SnyPopoverTriggerDirective {
+    popover = inject(SNY_POPOVER);
+    elRef = inject(ElementRef);
+    constructor() {
+        this.popover.triggerEl.set(this.elRef.nativeElement);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: SnyPopoverTriggerDirective, isStandalone: true, selector: "[snyPopoverTrigger]", host: { attributes: { "aria-haspopup": "dialog" }, listeners: { "click": "popover.toggle()" }, properties: { "attr.aria-expanded": "popover.isOpen()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[snyPopoverTrigger]',
+                    standalone: true,
+                    host: {
+                        '(click)': 'popover.toggle()',
+                        '[attr.aria-expanded]': 'popover.isOpen()',
+                        'aria-haspopup': 'dialog',
+                    },
+                }]
+        }], ctorParameters: () => [] });
+class SnyPopoverContentDirective {
+    popover = inject(SNY_POPOVER);
+    elRef = inject(ElementRef);
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    computedClass = computed(() => cn('fixed z-50 rounded-md border border-border bg-popover text-popover-foreground shadow-lg animate-in fade-in-0 zoom-in-95', this.class()), ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
+    constructor() {
+        this.popover.panelEl.set(this.elRef.nativeElement);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: SnyPopoverContentDirective, isStandalone: true, selector: "[snyPopoverContent]", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "dialog" }, properties: { "style.display": "popover.isOpen() ? \"\" : \"none\"", "class": "computedClass()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: SnyPopoverContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[snyPopoverContent]',
+                    standalone: true,
+                    host: {
+                        'role': 'dialog',
+                        '[style.display]': 'popover.isOpen() ? "" : "none"',
+                        '[class]': 'computedClass()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
 class SnyValidatorDirective {
     control = input(null, ...(ngDevMode ? [{ debugName: "control" }] : /* istanbul ignore next */ []));
     state = input('default', ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
@@ -8296,5 +8892,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { SNY_ACCORDION, SNY_ACCORDION_ITEM, SNY_CAROUSEL, SNY_CHAT_BUBBLE, SNY_CONFIG, SNY_DIALOG_DATA, SNY_DRAWER, SNY_DROPDOWN, SNY_FAB, SNY_SHEET_DATA, SNY_STEPS, SNY_TABLE, SNY_TABS, SNY_TIMELINE, SnyAccordionContentDirective, SnyAccordionDirective, SnyAccordionItemDirective, SnyAccordionTriggerDirective, SnyAlertDescriptionDirective, SnyAlertDirective, SnyAlertTitleDirective, SnyAvatarComponent, SnyBadgeDirective, SnyBreadcrumbDirective, SnyBreadcrumbItemDirective, SnyBreadcrumbLinkDirective, SnyBreadcrumbListDirective, SnyBreadcrumbPageDirective, SnyBreadcrumbSeparatorDirective, SnyBulkActionsDefDirective, SnyButtonDirective, SnyButtonGroupDirective, SnyCalendarComponent, SnyCardContentDirective, SnyCardDescriptionDirective, SnyCardDirective, SnyCardFooterDirective, SnyCardHeaderDirective, SnyCardTitleDirective, SnyCarouselContentDirective, SnyCarouselDirective, SnyCarouselItemDirective, SnyCarouselNextDirective, SnyCarouselPrevDirective, SnyCellDefDirective, SnyChatBubbleAvatarDirective, SnyChatBubbleBodyDirective, SnyChatBubbleContentDirective, SnyChatBubbleDirective, SnyChatBubbleFooterDirective, SnyChatBubbleHeaderDirective, SnyCheckboxDirective, SnyColorPickerComponent, SnyComboboxComponent, SnyCommandPaletteComponent, SnyCommandPaletteService, SnyDataTableComponent, SnyDatePickerComponent, SnyDateRangePickerComponent, SnyDialogCloseDirective, SnyDialogContentDirective, SnyDialogDescriptionDirective, SnyDialogFooterDirective, SnyDialogHeaderDirective, SnyDialogRef, SnyDialogService, SnyDialogTitleDirective, SnyDiffComponent, SnyDividerComponent, SnyDockDirective, SnyDockItemDirective, SnyDrawerContentDirective, SnyDrawerLayoutComponent, SnyDrawerLayoutDirective, SnyDrawerSideDirective, SnyDropdownContentDirective, SnyDropdownDirective, SnyDropdownTriggerDirective, SnyFabActionDirective, SnyFabDirective, SnyFabTriggerDirective, SnyFieldsetContentDirective, SnyFieldsetDirective, SnyFieldsetLegendDirective, SnyFileInputComponent, SnyHeaderCellDefDirective, SnyIndicatorBadgeDirective, SnyIndicatorDirective, SnyInputDirective, SnyKbdDirective, SnyLabelDirective, SnyLinkDirective, SnyListDirective, SnyListItemActionDirective, SnyListItemContentDirective, SnyListItemDirective, SnyListItemIconDirective, SnyLoaderComponent, SnyMenuContentDirective, SnyMenuItemDirective, SnyMenuLabelDirective, SnyMenuSeparatorDirective, SnyNavbarBrandDirective, SnyNavbarContentDirective, SnyNavbarDirective, SnyNavbarEndDirective, SnyOtpInputComponent, SnyPaginationComponent, SnyProgressComponent, SnyRadialProgressComponent, SnyRadioDirective, SnyRatingComponent, SnyRowExpandDefDirective, SnySelectComponent, SnySheetCloseDirective, SnySheetContentDirective, SnySheetDescriptionDirective, SnySheetHeaderDirective, SnySheetRef, SnySheetService, SnySheetTitleDirective, SnySkeletonDirective, SnySliderComponent, SnyStatDescriptionDirective, SnyStatDirective, SnyStatFigureDirective, SnyStatTitleDirective, SnyStatValueDirective, SnyStatusDirective, SnyStepDirective, SnyStepsDirective, SnySwitchComponent, SnyTableBodyDirective, SnyTableCaptionDirective, SnyTableCellDirective, SnyTableDirective, SnyTableFooterDirective, SnyTableHeadDirective, SnyTableHeaderDirective, SnyTableRowDirective, SnyTabsContentDirective, SnyTabsDirective, SnyTabsListDirective, SnyTabsTriggerDirective, SnyTextareaDirective, SnyTimelineDirective, SnyTimelineEndDirective, SnyTimelineItemDirective, SnyTimelineMiddleDirective, SnyTimelineStartDirective, SnyToastService, SnyToasterComponent, SnyToggleDirective, SnyTooltipDirective, SnyValidatorDirective, SnyValidatorHintDirective, ThemeService, alertVariants, avatarVariants, badgeVariants, buttonGroupVariants, buttonVariants, cardVariants, checkboxVariants, cn, colorPickerTriggerVariants, comboboxTriggerVariants, datePickerTriggerVariants, dividerVariants, dropdownContentVariants, dropdownItemVariants, fieldsetVariants, fileInputVariants, formatColor, hexToRgb, hslToRgb, hsvToRgb, inputVariants, isValidColor, kbdVariants, labelVariants, linkVariants, loaderVariants, otpCellVariants, paginationItemVariants, parseColor, progressBarVariants, progressTrackVariants, provideSonnyUI, radioVariants, ratingVariants, rgbToHex, rgbToHsl, rgbToHsv, selectTriggerVariants, skeletonVariants, sliderTrackVariants, statusVariants, switchTrackVariants, tableCellVariants, tableVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, toastVariants, toggleVariants, tooltipVariants };
+export { SNY_ACCORDION, SNY_ACCORDION_ITEM, SNY_CAROUSEL, SNY_CHAT_BUBBLE, SNY_CONFIG, SNY_DIALOG_DATA, SNY_DRAWER, SNY_DROPDOWN, SNY_FAB, SNY_POPOVER, SNY_SHEET_DATA, SNY_STEPS, SNY_TABLE, SNY_TABS, SNY_TIMELINE, SnyAccordionContentDirective, SnyAccordionDirective, SnyAccordionItemDirective, SnyAccordionTriggerDirective, SnyAlertDescriptionDirective, SnyAlertDirective, SnyAlertTitleDirective, SnyAvatarComponent, SnyAvatarGroupComponent, SnyBadgeDirective, SnyBreadcrumbDirective, SnyBreadcrumbItemDirective, SnyBreadcrumbLinkDirective, SnyBreadcrumbListDirective, SnyBreadcrumbPageDirective, SnyBreadcrumbSeparatorDirective, SnyBulkActionsDefDirective, SnyButtonDirective, SnyButtonGroupDirective, SnyCalendarComponent, SnyCardContentDirective, SnyCardDescriptionDirective, SnyCardDirective, SnyCardFooterDirective, SnyCardHeaderDirective, SnyCardTitleDirective, SnyCarouselContentDirective, SnyCarouselDirective, SnyCarouselItemDirective, SnyCarouselNextDirective, SnyCarouselPrevDirective, SnyCellDefDirective, SnyChatBubbleAvatarDirective, SnyChatBubbleBodyDirective, SnyChatBubbleContentDirective, SnyChatBubbleDirective, SnyChatBubbleFooterDirective, SnyChatBubbleHeaderDirective, SnyCheckboxDirective, SnyColorPickerComponent, SnyComboboxComponent, SnyCommandPaletteComponent, SnyCommandPaletteService, SnyDataTableComponent, SnyDatePickerComponent, SnyDateRangePickerComponent, SnyDialogCloseDirective, SnyDialogContentDirective, SnyDialogDescriptionDirective, SnyDialogFooterDirective, SnyDialogHeaderDirective, SnyDialogRef, SnyDialogService, SnyDialogTitleDirective, SnyDiffComponent, SnyDividerComponent, SnyDockDirective, SnyDockItemDirective, SnyDrawerContentDirective, SnyDrawerLayoutComponent, SnyDrawerLayoutDirective, SnyDrawerSideDirective, SnyDropdownContentDirective, SnyDropdownDirective, SnyDropdownTriggerDirective, SnyFabActionDirective, SnyFabDirective, SnyFabTriggerDirective, SnyFieldsetContentDirective, SnyFieldsetDirective, SnyFieldsetLegendDirective, SnyFileInputComponent, SnyHeaderCellDefDirective, SnyIndicatorBadgeDirective, SnyIndicatorDirective, SnyInputDirective, SnyKbdDirective, SnyLabelDirective, SnyLinkDirective, SnyListDirective, SnyListItemActionDirective, SnyListItemContentDirective, SnyListItemDirective, SnyListItemIconDirective, SnyLoaderComponent, SnyMenuContentDirective, SnyMenuItemDirective, SnyMenuLabelDirective, SnyMenuSeparatorDirective, SnyNavbarBrandDirective, SnyNavbarContentDirective, SnyNavbarDirective, SnyNavbarEndDirective, SnyNumberInputComponent, SnyOtpInputComponent, SnyPaginationComponent, SnyPopoverContentDirective, SnyPopoverDirective, SnyPopoverTriggerDirective, SnyProgressComponent, SnyRadialProgressComponent, SnyRadioDirective, SnyRatingComponent, SnyRowExpandDefDirective, SnySelectComponent, SnySheetCloseDirective, SnySheetContentDirective, SnySheetDescriptionDirective, SnySheetHeaderDirective, SnySheetRef, SnySheetService, SnySheetTitleDirective, SnySkeletonDirective, SnySliderComponent, SnyStatDescriptionDirective, SnyStatDirective, SnyStatFigureDirective, SnyStatTitleDirective, SnyStatValueDirective, SnyStatusDirective, SnyStepDirective, SnyStepsDirective, SnySwitchComponent, SnyTableBodyDirective, SnyTableCaptionDirective, SnyTableCellDirective, SnyTableDirective, SnyTableFooterDirective, SnyTableHeadDirective, SnyTableHeaderDirective, SnyTableRowDirective, SnyTabsContentDirective, SnyTabsDirective, SnyTabsListDirective, SnyTabsTriggerDirective, SnyTagInputComponent, SnyTextareaDirective, SnyTimelineDirective, SnyTimelineEndDirective, SnyTimelineItemDirective, SnyTimelineMiddleDirective, SnyTimelineStartDirective, SnyToastService, SnyToasterComponent, SnyToggleDirective, SnyTooltipDirective, SnyValidatorDirective, SnyValidatorHintDirective, ThemeService, alertVariants, avatarVariants, badgeVariants, buttonGroupVariants, buttonVariants, cardVariants, checkboxVariants, cn, colorPickerTriggerVariants, comboboxTriggerVariants, datePickerTriggerVariants, dividerVariants, dropdownContentVariants, dropdownItemVariants, fieldsetVariants, fileInputVariants, formatColor, hexToRgb, hslToRgb, hsvToRgb, inputVariants, isValidColor, kbdVariants, labelVariants, linkVariants, loaderVariants, numberInputVariants, otpCellVariants, paginationItemVariants, parseColor, progressBarVariants, progressTrackVariants, provideSonnyUI, radioVariants, ratingVariants, rgbToHex, rgbToHsl, rgbToHsv, selectTriggerVariants, skeletonVariants, sliderTrackVariants, statusVariants, switchTrackVariants, tableCellVariants, tableVariants, tabsListVariants, tabsTriggerVariants, tagInputContainerVariants, tagVariants, textareaVariants, toastVariants, toggleVariants, tooltipVariants };
 //# sourceMappingURL=sonny-ui-core.mjs.map