npm - @semantic-components/ui - Versions diffs - 0.68.0 → 0.69.0 - Mend

@semantic-components/ui 0.68.0 → 0.69.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (274) hide show

package/esm2022/lib/components/popover/popover-trigger.js CHANGED Viewed

@@ -12,10 +12,10 @@ export class ScPopoverTrigger {
     togglePopover() {
         this.popover.open.update((v) => !v);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScPopoverTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScPopoverTrigger, isStandalone: true, selector: "button[scPopoverTrigger]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "popover-trigger" }, listeners: { "click": "togglePopover()" }, properties: { "class": "class()", "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "popover.open()" } }, hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScPopoverTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScPopoverTrigger, isStandalone: true, selector: "button[scPopoverTrigger]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "popover-trigger" }, listeners: { "click": "togglePopover()" }, properties: { "class": "class()", "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "popover.open()" } }, hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScPopoverTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScPopoverTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[scPopoverTrigger]',

package/esm2022/lib/components/popover/popover.js CHANGED Viewed

@@ -22,12 +22,12 @@ export class ScPopover {
             this.popover.onPopoverAnimationComplete();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScPopover, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScPopover, isStandalone: true, selector: "div[scPopover]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "dialog", "data-slot": "popover" }, listeners: { "animationend": "onAnimationEnd($event)" }, properties: { "class": "class()", "attr.data-open": "state() === \"open\" ? true : null", "attr.data-closed": "state() === \"closed\" ? true : null", "attr.data-side": "popover.side()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScPopover, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScPopover, isStandalone: true, selector: "div[scPopover]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "dialog", "data-slot": "popover" }, listeners: { "animationend": "onAnimationEnd($event)" }, properties: { "class": "class()", "attr.data-open": "state() === \"open\" ? true : null", "attr.data-closed": "state() === \"closed\" ? true : null", "attr.data-side": "popover.side()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScPopover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScPopover, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scPopover]',

package/esm2022/lib/components/progress/progress-indicator.js CHANGED Viewed

@@ -6,10 +6,10 @@ export class ScProgressIndicator {
     progress = inject(ScProgress);
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('bg-primary size-full flex-1 transition-all', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScProgressIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScProgressIndicator, isStandalone: true, selector: "[scProgressIndicator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "progress-indicator" }, properties: { "class": "class()", "style.transform": "\"translateX(-\" + (100 - progress.percentage()) + \"%)\"" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScProgressIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScProgressIndicator, isStandalone: true, selector: "[scProgressIndicator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "progress-indicator" }, properties: { "class": "class()", "style.transform": "\"translateX(-\" + (100 - progress.percentage()) + \"%)\"" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScProgressIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScProgressIndicator, decorators: [{
             type: Component,
             args: [{
                     selector: '[scProgressIndicator]',

package/esm2022/lib/components/progress/progress.js CHANGED Viewed

@@ -21,12 +21,12 @@ export class ScProgress {
         return val >= maxVal ? 'complete' : 'loading';
     }, ...(ngDevMode ? [{ debugName: "state" }] : []));
     class = computed(() => cn('bg-muted relative flex h-1 w-full items-center overflow-x-hidden rounded-full', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScProgress, isStandalone: true, selector: "[scProgress]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "progressbar", "data-slot": "progress" }, properties: { "class": "class()", "attr.aria-valuemin": "0", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "value()", "attr.data-state": "state()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScProgress, isStandalone: true, selector: "[scProgress]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "progressbar", "data-slot": "progress" }, properties: { "class": "class()", "attr.aria-valuemin": "0", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "value()", "attr.data-state": "state()" } }, ngImport: i0, template: `
     <div scProgressIndicator></div>
   `, isInline: true, dependencies: [{ kind: "component", type: ScProgressIndicator, selector: "[scProgressIndicator]", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScProgress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScProgress, decorators: [{
             type: Component,
             args: [{
                     selector: '[scProgress]',

package/esm2022/lib/components/radio-group/radio-field.js CHANGED Viewed

@@ -12,12 +12,12 @@ export class ScRadioField {
         return tagName === 'LABEL' ? null : 'group';
     }, ...(ngDevMode ? [{ debugName: "role" }] : []));
     class = computed(() => cn('relative inline-flex items-start gap-2', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadioField, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScRadioField, isStandalone: true, selector: "div[scRadioField], label[scRadioField]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio-field" }, properties: { "attr.role": "role()", "class": "class()" } }, providers: [{ provide: SC_FIELD, useExisting: ScRadioField }], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadioField, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScRadioField, isStandalone: true, selector: "div[scRadioField], label[scRadioField]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio-field" }, properties: { "attr.role": "role()", "class": "class()" } }, providers: [{ provide: SC_FIELD, useExisting: ScRadioField }], ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadioField, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadioField, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scRadioField], label[scRadioField]',

package/esm2022/lib/components/radio-group/radio-group.js CHANGED Viewed

@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
 export class ScRadioGroup {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('grid gap-2', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScRadioGroup, isStandalone: true, selector: "div[scRadioGroup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio-group", "role": "radiogroup" }, properties: { "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScRadioGroup, isStandalone: true, selector: "div[scRadioGroup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio-group", "role": "radiogroup" }, properties: { "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadioGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadioGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: 'div[scRadioGroup]',

package/esm2022/lib/components/radio-group/radio.js CHANGED Viewed

@@ -5,10 +5,10 @@ export const SC_RADIO = 'SC_RADIO';
 export class ScRadio {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('relative', 'appearance-none', 'aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50', "[&::before]:content-['']", '[&::before]:absolute [&::before]:top-1/2 [&::before]:left-1/2 [&::before]:-translate-x-1/2 [&::before]:-translate-y-1/2 [&::before]:size-2.5 [&::before]:rounded-full [&::before]:bg-primary [&::before]:opacity-0 [&::before]:transform [&::before]:scale-0 [&::before]:transition-all [&::before]:duration-200', 'checked:[&::before]:opacity-100 checked:[&::before]:scale-100', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScRadio, isStandalone: true, selector: "input[type=\"radio\"][scRadio]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio" }, properties: { "class": "class()" } }, exportAs: ["SC_RADIO"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScRadio, isStandalone: true, selector: "input[type=\"radio\"][scRadio]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "radio" }, properties: { "class": "class()" } }, exportAs: ["SC_RADIO"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRadio, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[type="radio"][scRadio]',

package/esm2022/lib/components/range-slider/range-slider-max.js CHANGED Viewed

@@ -16,10 +16,10 @@ export class ScRangeSliderMax {
             el.value = String(clamped);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSliderMax, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScRangeSliderMax, isStandalone: true, selector: "input[scRangeSliderMax]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "range" }, listeners: { "input": "onInput($event)" }, properties: { "min": "rangeSlider.min()", "max": "rangeSlider.max()", "step": "rangeSlider.step()", "disabled": "rangeSlider.disabled()", "value": "rangeSlider.maxValue()", "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSliderMax, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScRangeSliderMax, isStandalone: true, selector: "input[scRangeSliderMax]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "range" }, listeners: { "input": "onInput($event)" }, properties: { "min": "rangeSlider.min()", "max": "rangeSlider.max()", "step": "rangeSlider.step()", "disabled": "rangeSlider.disabled()", "value": "rangeSlider.maxValue()", "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSliderMax, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSliderMax, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[scRangeSliderMax]',

package/esm2022/lib/components/range-slider/range-slider-min.js CHANGED Viewed

@@ -16,10 +16,10 @@ export class ScRangeSliderMin {
             el.value = String(clamped);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSliderMin, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScRangeSliderMin, isStandalone: true, selector: "input[scRangeSliderMin]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "range" }, listeners: { "input": "onInput($event)" }, properties: { "min": "rangeSlider.min()", "max": "rangeSlider.max()", "step": "rangeSlider.step()", "disabled": "rangeSlider.disabled()", "value": "rangeSlider.minValue()", "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSliderMin, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScRangeSliderMin, isStandalone: true, selector: "input[scRangeSliderMin]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "range" }, listeners: { "input": "onInput($event)" }, properties: { "min": "rangeSlider.min()", "max": "rangeSlider.max()", "step": "rangeSlider.step()", "disabled": "rangeSlider.disabled()", "value": "rangeSlider.minValue()", "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSliderMin, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSliderMin, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[scRangeSliderMin]',

package/esm2022/lib/components/range-slider/range-slider.js CHANGED Viewed

@@ -44,10 +44,10 @@ export class ScRangeSlider {
     clampMax(val) {
         return Math.max(val, this.minValue());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSlider, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScRangeSlider, isStandalone: true, selector: "div[scRangeSlider]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", 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 } }, outputs: { minValue: "minValueChange", maxValue: "maxValueChange" }, host: { listeners: { "pointerdown": "onPointerDown($event)" }, properties: { "class": "class()", "style.--min-percent": "minPercentCss()", "style.--max-percent": "maxPercentCss()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSlider, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScRangeSlider, isStandalone: true, selector: "div[scRangeSlider]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", 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 } }, outputs: { minValue: "minValueChange", maxValue: "maxValueChange" }, host: { listeners: { "pointerdown": "onPointerDown($event)" }, properties: { "class": "class()", "style.--min-percent": "minPercentCss()", "style.--max-percent": "maxPercentCss()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScRangeSlider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScRangeSlider, decorators: [{
             type: Directive,
             args: [{
                     selector: 'div[scRangeSlider]',

package/esm2022/lib/components/scroll-area/scroll-area.js CHANGED Viewed

@@ -4,12 +4,12 @@ import * as i0 from "@angular/core";
 export class ScScrollArea {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('overflow-auto', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScScrollArea, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScScrollArea, isStandalone: true, selector: "div[scScrollArea]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "scroll-area" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScScrollArea, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScScrollArea, isStandalone: true, selector: "div[scScrollArea]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "scroll-area" }, properties: { "class": "class()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, styles: ["[data-slot=scroll-area]{scrollbar-width:thin;scrollbar-color:transparent transparent}[data-slot=scroll-area]:hover{scrollbar-color:var(--color-border) transparent}[data-slot=scroll-area]::-webkit-scrollbar{width:8px;height:8px}[data-slot=scroll-area]::-webkit-scrollbar-thumb{background-color:transparent;border-radius:9999px}[data-slot=scroll-area]:hover::-webkit-scrollbar-thumb{background-color:var(--color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScScrollArea, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScScrollArea, decorators: [{
             type: Component,
             args: [{ selector: 'div[scScrollArea]', host: {
                         'data-slot': 'scroll-area',

package/esm2022/lib/components/select/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 export { ScSelect } from './select';
 export { ScSelectItemIcon } from './select-item-icon';
 export { ScSelectTrigger } from './select-trigger';
-export { ScSelectValue } from './select-value';
+export { ScSelectLabel } from './select-label';
 export { ScSelectPortal } from './select-portal';
 export { ScSelectPopup } from './select-popup';
 export { ScSelectList } from './select-list';

package/esm2022/lib/components/select/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { ScSelect } from './select';\nexport { ScSelectItemIcon } from './select-item-icon';\nexport { ScSelectTrigger } from './select-trigger';\nexport { ~~ScSelectValue~~ } from './select-~~value~~';\nexport { ScSelectPortal } from './select-portal';\nexport { ScSelectPopup } from './select-popup';\nexport { ScSelectList } from './select-list';\nexport { ScSelectItem } from './select-item';\nexport { ScSelectGroup } from './select-group';\nexport { ScSelectGroupLabel } from './select-group-label';\nexport { ScSelectSeparator } from './select-separator';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { ScSelect } from './select';\nexport { ScSelectItemIcon } from './select-item-icon';\nexport { ScSelectTrigger } from './select-trigger';\nexport { ScSelectLabel } from './select-label';\nexport { ScSelectPortal } from './select-portal';\nexport { ScSelectPopup } from './select-popup';\nexport { ScSelectList } from './select-list';\nexport { ScSelectItem } from './select-item';\nexport { ScSelectGroup } from './select-group';\nexport { ScSelectGroupLabel } from './select-group-label';\nexport { ScSelectSeparator } from './select-separator';\n"]}

package/esm2022/lib/components/select/select-group-label.js CHANGED Viewed

@@ -4,12 +4,12 @@ import * as i0 from "@angular/core";
 export class ScSelectGroupLabel {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('text-muted-foreground px-2 py-1.5 text-xs font-medium', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectGroupLabel, isStandalone: true, selector: "div[scSelectGroupLabel]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-group-label" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectGroupLabel, isStandalone: true, selector: "div[scSelectGroupLabel]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-group-label" }, properties: { "class": "class()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectGroupLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectGroupLabel, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scSelectGroupLabel]',

package/esm2022/lib/components/select/select-group.js CHANGED Viewed

@@ -4,12 +4,12 @@ import * as i0 from "@angular/core";
 export class ScSelectGroup {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('flex flex-col', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectGroup, isStandalone: true, selector: "div[scSelectGroup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-group" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectGroup, isStandalone: true, selector: "div[scSelectGroup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-group" }, properties: { "class": "class()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scSelectGroup]',

package/esm2022/lib/components/select/select-input.js CHANGED Viewed

@@ -6,10 +6,10 @@ import * as i1 from "@angular/aria/combobox";
 export class ScSelectInput {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('absolute inset-0 h-full w-full cursor-pointer border-none bg-transparent opacity-0 outline-none', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectInput, isStandalone: true, selector: "input[scSelectInput]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-input" }, properties: { "class": "class()" } }, hostDirectives: [{ directive: i1.ComboboxInput }], ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectInput, isStandalone: true, selector: "input[scSelectInput]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-input" }, properties: { "class": "class()" } }, hostDirectives: [{ directive: i1.ComboboxInput }], ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'input[scSelectInput]',

package/esm2022/lib/components/select/select-item-icon.js CHANGED Viewed

@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
 export class ScSelectItemIcon {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('text-muted-foreground size-4 shrink-0', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItemIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectItemIcon, isStandalone: true, selector: "svg[scSelectItemIcon]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item-icon", "aria-hidden": "true" }, properties: { "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItemIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectItemIcon, isStandalone: true, selector: "svg[scSelectItemIcon]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item-icon", "aria-hidden": "true" }, properties: { "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItemIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItemIcon, decorators: [{
             type: Directive,
             args: [{
                     selector: 'svg[scSelectItemIcon]',

package/esm2022/lib/components/select/select-item-indicator.js CHANGED Viewed

@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
 export class ScSelectItemIndicator {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('pointer-events-none absolute right-2 flex size-4 items-center justify-center opacity-0 [[aria-selected=true]>&]:opacity-100', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectItemIndicator, isStandalone: true, selector: "svg[scSelectItemIndicator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item-indicator" }, properties: { "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectItemIndicator, isStandalone: true, selector: "svg[scSelectItemIndicator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item-indicator" }, properties: { "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItemIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItemIndicator, decorators: [{
             type: Directive,
             args: [{
                     selector: 'svg[scSelectItemIndicator]',

package/esm2022/lib/components/select/select-item.js CHANGED Viewed

@@ -9,6 +9,8 @@ export class ScSelectItem {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     option = inject(Option);
     elementRef = inject(ElementRef);
+    itemValue = computed(() => this.option.value(), ...(ngDevMode ? [{ debugName: "itemValue" }] : []));
+    itemLabel = computed(() => this.option.label() || '', ...(ngDevMode ? [{ debugName: "itemLabel" }] : []));
     constructor() {
         effect(() => {
             if (this.option.active()) {
@@ -17,13 +19,13 @@ export class ScSelectItem {
         });
     }
     class = computed(() => cn('relative flex w-full cursor-default select-none items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden', 'data-[active=true]:bg-accent data-[active=true]:text-accent-foreground', 'aria-selected:bg-accent/50 aria-selected:text-accent-foreground', 'data-disabled:pointer-events-none data-disabled:opacity-50', '[&_svg:not([class*=size-])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectItem, isStandalone: true, selector: "div[scSelectItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item" }, properties: { "class": "class()" } }, hostDirectives: [{ directive: i1.Option, inputs: ["value", "value", "label", "label"] }], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectItem, isStandalone: true, selector: "div[scSelectItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-item" }, properties: { "class": "class()" } }, hostDirectives: [{ directive: i1.Option, inputs: ["value", "value", "label", "label"] }], ngImport: i0, template: `
     <ng-content />
     <svg scSelectItemIndicator siCheckIcon aria-hidden="true"></svg>
-  `, isInline: true, dependencies: [{ kind: "directive", type: ScSelectItemIndicator, selector: "svg[scSelectItemIndicator]", inputs: ["class"] }, { kind: "component", type: SiCheckIcon, selector: "svg[siCheckIcon]", inputs: ["width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, dependencies: [{ kind: "directive", type: ScSelectItemIndicator, selector: "svg[scSelectItemIndicator]", inputs: ["class"] }, { kind: "component", type: SiCheckIcon, selector: "svg[siCheckIcon]", inputs: ["ariaHidden", "width", "height", "viewBox", "fill", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scSelectItem]',

package/esm2022/lib/components/select/select-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-item.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/select-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;;;AAsBhE,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAE3C,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACxB,UAAU,GAAG,MAAM,CAA0B,UAAU,CAAC,CAAC;~~IAE1E~~;QACE,MAAM,CAAC,GAAG,EAAE;YACV,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC;gBACzB,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;YACrE,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAEkB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,yHAAyH,EACzH,wEAAwE,EACxE,iEAAiE,EACjE,4DAA4D,EAC5D,iFAAiF,EACjF,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;~~uGAvBS~~,YAAY;2FAAZ,YAAY,+YAjBb;;;GAGT,4DAJS,qBAAqB,0FAAE,WAAW;;2FAkBjC,YAAY;kBApBxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,OAAO,EAAE,CAAC,qBAAqB,EAAE,WAAW,CAAC;oBAC7C,QAAQ,EAAE;;;GAGT;oBACD,cAAc,EAAE;wBACd;4BACE,SAAS,EAAE,MAAM;4BACjB,MAAM,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;yBAC3B;qBACF;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import { Option } from '@angular/aria/listbox';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n ElementRef,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { SiCheckIcon } from '@semantic-icons/lucide-icons';\nimport { cn } from '../../utils';\n\nimport { ScSelectItemIndicator } from './select-item-indicator';\n\n@Component({\n selector: 'div[scSelectItem]',\n imports: [ScSelectItemIndicator, SiCheckIcon],\n template: `\n <ng-content />\n <svg scSelectItemIndicator siCheckIcon aria-hidden=\"true\"></svg>\n `,\n hostDirectives: [\n {\n directive: Option,\n inputs: ['value', 'label'],\n },\n ],\n host: {\n 'data-slot': 'select-item',\n '[class]': 'class()',\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScSelectItem {\n readonly classInput = input<string>('', { alias: 'class' });\n\n private readonly option = inject(Option);\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n constructor() {\n effect(() => {\n if (this.option.active()) {\n this.elementRef.nativeElement.scrollIntoView({ block: 'nearest' });\n }\n });\n }\n\n protected readonly class = computed(() =>\n cn(\n 'relative flex w-full cursor-default select-none items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden',\n 'data-[active=true]:bg-accent data-[active=true]:text-accent-foreground',\n 'aria-selected:bg-accent/50 aria-selected:text-accent-foreground',\n 'data-disabled:pointer-events-none data-disabled:opacity-50',\n '[&_svg:not([class*=size-])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0',\n this.classInput(),\n ),\n );\n}\n"]}
1	+ {"version":3,"file":"select-item.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/select-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;;;AAsBhE,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAE3C,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACxB,UAAU,GAAG,MAAM,CAA0B,UAAU,CAAC,CAAC;IAEjE,SAAS,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,qDAAC,CAAC;IAChD,SAAS,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,EAAE,qDAAC,CAAC;IAE/D;QACE,MAAM,CAAC,GAAG,EAAE;YACV,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC;gBACzB,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;YACrE,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAEkB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,yHAAyH,EACzH,wEAAwE,EACxE,iEAAiE,EACjE,4DAA4D,EAC5D,iFAAiF,EACjF,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGA1BS,YAAY;2FAAZ,YAAY,+YAjBb;;;GAGT,4DAJS,qBAAqB,0FAAE,WAAW;;2FAkBjC,YAAY;kBApBxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,OAAO,EAAE,CAAC,qBAAqB,EAAE,WAAW,CAAC;oBAC7C,QAAQ,EAAE;;;GAGT;oBACD,cAAc,EAAE;wBACd;4BACE,SAAS,EAAE,MAAM;4BACjB,MAAM,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;yBAC3B;qBACF;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import { Option } from '@angular/aria/listbox';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n ElementRef,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { SiCheckIcon } from '@semantic-icons/lucide-icons';\nimport { cn } from '../../utils';\n\nimport { ScSelectItemIndicator } from './select-item-indicator';\n\n@Component({\n selector: 'div[scSelectItem]',\n imports: [ScSelectItemIndicator, SiCheckIcon],\n template: `\n <ng-content />\n <svg scSelectItemIndicator siCheckIcon aria-hidden=\"true\"></svg>\n `,\n hostDirectives: [\n {\n directive: Option,\n inputs: ['value', 'label'],\n },\n ],\n host: {\n 'data-slot': 'select-item',\n '[class]': 'class()',\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScSelectItem {\n readonly classInput = input<string>('', { alias: 'class' });\n\n private readonly option = inject(Option);\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n readonly itemValue = computed(() => this.option.value());\n readonly itemLabel = computed(() => this.option.label() \|\| '');\n\n constructor() {\n effect(() => {\n if (this.option.active()) {\n this.elementRef.nativeElement.scrollIntoView({ block: 'nearest' });\n }\n });\n }\n\n protected readonly class = computed(() =>\n cn(\n 'relative flex w-full cursor-default select-none items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden',\n 'data-[active=true]:bg-accent data-[active=true]:text-accent-foreground',\n 'aria-selected:bg-accent/50 aria-selected:text-accent-foreground',\n 'data-disabled:pointer-events-none data-disabled:opacity-50',\n '[&_svg:not([class*=size-])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0',\n this.classInput(),\n ),\n );\n}\n"]}

package/esm2022/lib/components/select/{select-value.js → select-label.js} RENAMED Viewed

@@ -1,28 +1,28 @@
 import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
 import { cn } from '../../utils';
 import * as i0 from "@angular/core";
-export class ScSelectValue {
+export class ScSelectLabel {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('pointer-events-none', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectValue, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectValue, isStandalone: true, selector: "span[scSelectValue]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-value" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectLabel, isStandalone: true, selector: "span[scSelectLabel], div[scSelectLabel]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-label" }, properties: { "class": "class()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectValue, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectLabel, decorators: [{
             type: Component,
             args: [{
-                    selector: 'span[scSelectValue]',
+                    selector: 'span[scSelectLabel], div[scSelectLabel]',
                     imports: [],
                     template: `
     <ng-content />
   `,
                     host: {
-                        'data-slot': 'select-value',
+                        'data-slot': 'select-label',
                         '[class]': 'class()',
                     },
                     encapsulation: ViewEncapsulation.None,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
-//# sourceMappingURL=select-value.js.map
+//# sourceMappingURL=select-label.js.map

package/esm2022/lib/components/select/select-label.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select-label.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/select-label.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAejC,MAAM,OAAO,aAAa;IACf,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,qBAAqB,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDAC7C,CAAC;uGALS,aAAa;2FAAb,aAAa,4UAVd;;GAET;;2FAQU,aAAa;kBAbzB,SAAS;mBAAC;oBACT,QAAQ,EAAE,yCAAyC;oBACnD,OAAO,EAAE,EAAE;oBACX,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,cAAc;wBAC3B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\n\n@Component({\n selector: 'span[scSelectLabel], div[scSelectLabel]',\n imports: [],\n template: `\n <ng-content />\n `,\n host: {\n 'data-slot': 'select-label',\n '[class]': 'class()',\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScSelectLabel {\n readonly classInput = input<string>('', { alias: 'class' });\n\n protected readonly class = computed(() =>\n cn('pointer-events-none', this.classInput()),\n );\n}\n"]}

package/esm2022/lib/components/select/select-list.js CHANGED Viewed

@@ -1,19 +1,25 @@
 import { Listbox } from '@angular/aria/listbox';
-import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation, } from '@angular/core';
+import { ChangeDetectionStrategy, Component, computed, contentChildren, inject, input, ViewEncapsulation, } from '@angular/core';
 import { cn } from '../../utils';
+import { ScSelectItem } from './select-item';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/aria/listbox";
 export class ScSelectList {
     listbox = inject(Listbox);
+    items = contentChildren(ScSelectItem, { ...(ngDevMode ? { debugName: "items" } : {}), descendants: true });
     values = computed(() => this.listbox.values(), ...(ngDevMode ? [{ debugName: "values" }] : []));
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    labelForValue(value) {
+        const item = this.items().find((i) => i.itemValue() === value);
+        return item?.itemLabel() ?? '';
+    }
     class = computed(() => cn('flex h-full flex-col overflow-x-hidden overflow-y-auto', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectList, isStandalone: true, selector: "div[scSelectList]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-list" }, properties: { "class": "class()" } }, hostDirectives: [{ directive: i1.Listbox }], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectList, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.0", type: ScSelectList, isStandalone: true, selector: "div[scSelectList]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-list" }, properties: { "class": "class()" } }, queries: [{ propertyName: "items", predicate: ScSelectItem, descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.Listbox }], ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectList, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scSelectList]',
@@ -29,5 +35,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
                     encapsulation: ViewEncapsulation.None,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+        }], propDecorators: { items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ScSelectItem), { ...{ descendants: true }, isSignal: true }] }], classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 //# sourceMappingURL=select-list.js.map

package/esm2022/lib/components/select/select-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-list.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/select-list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;;~~AAgBjC~~,MAAM,OAAO,YAAY;IACN,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;~~IAClC~~,MAAM,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,kDAAC,CAAC;IAC/C,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;~~IAEzC~~,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,wDAAwD,EACxD,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;~~uGAVS~~,YAAY;2FAAZ,YAAY,~~kWAXb~~;;GAET;;2FASU,YAAY;kBAdxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,OAAO,EAAE,EAAE;oBACX,QAAQ,EAAE;;GAET;oBACD,cAAc,EAAE,CAAC,OAAO,CAAC;oBACzB,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import { Listbox } from '@angular/aria/listbox';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\n\n@Component({\n selector: 'div[scSelectList]',\n imports: [],\n template: `\n <ng-content />\n `,\n hostDirectives: [Listbox],\n host: {\n 'data-slot': 'select-list',\n '[class]': 'class()',\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScSelectList {\n private readonly listbox = inject(Listbox);\n readonly values = computed(() => this.listbox.values());\n readonly classInput = input<string>('', { alias: 'class' });\n\n protected readonly class = computed(() =>\n cn(\n 'flex h-full flex-col overflow-x-hidden overflow-y-auto',\n this.classInput(),\n ),\n );\n}\n"]}
1	+ {"version":3,"file":"select-list.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/select/select-list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,eAAe,EACf,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;;;AAgB7C,MAAM,OAAO,YAAY;IACN,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IAC1B,KAAK,GAAG,eAAe,CAAC,YAAY,kDAAI,WAAW,EAAE,IAAI,GAAG,CAAC;IACrE,MAAM,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,kDAAC,CAAC;IAC/C,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAE5D,aAAa,CAAC,KAAc;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,KAAK,CAAC,CAAC;QAC/D,OAAO,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACjC,CAAC;IAEkB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,wDAAwD,EACxD,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAhBS,YAAY;2FAAZ,YAAY,2UAEkB,YAAY,6GAb3C;;GAET;;2FASU,YAAY;kBAdxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,OAAO,EAAE,EAAE;oBACX,QAAQ,EAAE;;GAET;oBACD,cAAc,EAAE,CAAC,OAAO,CAAC;oBACzB,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;6FAG0C,YAAY,QAAE,EAAE,WAAW,EAAE,IAAI,EAAE","sourcesContent":["import { Listbox } from '@angular/aria/listbox';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChildren,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScSelectItem } from './select-item';\n\n@Component({\n selector: 'div[scSelectList]',\n imports: [],\n template: `\n <ng-content />\n `,\n hostDirectives: [Listbox],\n host: {\n 'data-slot': 'select-list',\n '[class]': 'class()',\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScSelectList {\n private readonly listbox = inject(Listbox);\n private readonly items = contentChildren(ScSelectItem, { descendants: true });\n readonly values = computed(() => this.listbox.values());\n readonly classInput = input<string>('', { alias: 'class' });\n\n labelForValue(value: unknown): string {\n const item = this.items().find((i) => i.itemValue() === value);\n return item?.itemLabel() ?? '';\n }\n\n protected readonly class = computed(() =>\n cn(\n 'flex h-full flex-col overflow-x-hidden overflow-y-auto',\n this.classInput(),\n ),\n );\n}\n"]}

package/esm2022/lib/components/select/select-popup.js CHANGED Viewed

@@ -8,12 +8,12 @@ export class ScSelectPopup {
     class = computed(() => cn('bg-popover text-popover-foreground ring-foreground/10 relative z-50 mt-1 flex w-full max-h-44 min-w-36 flex-col rounded-lg p-1 shadow-md ring-1', this.combobox.expanded()
         ? 'opacity-100 visible transition-[max-height,opacity,visibility] duration-150 ease-out'
         : 'max-h-0 opacity-0 invisible transition-[max-height,opacity,visibility] duration-150 ease-in [transition-delay:0s,0s,150ms]', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectPopup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectPopup, isStandalone: true, selector: "div[scSelectPopup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-popup" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectPopup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectPopup, isStandalone: true, selector: "div[scSelectPopup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-popup" }, properties: { "class": "class()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectPopup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectPopup, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[scSelectPopup]',

package/esm2022/lib/components/select/select-portal.js CHANGED Viewed

@@ -2,10 +2,10 @@ import { Directive, inject, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 export class ScSelectPortal {
     templateRef = inject(TemplateRef);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ScSelectPortal, isStandalone: true, selector: "ng-template[scSelectPortal]", ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: ScSelectPortal, isStandalone: true, selector: "ng-template[scSelectPortal]", ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectPortal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectPortal, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[scSelectPortal]',

package/esm2022/lib/components/select/select-separator.js CHANGED Viewed

@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
 export class ScSelectSeparator {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     class = computed(() => cn('bg-border -mx-1 my-1 h-px', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectSeparator, isStandalone: true, selector: "[scSelectSeparator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-separator", "role": "separator", "aria-orientation": "horizontal" }, properties: { "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectSeparator, isStandalone: true, selector: "[scSelectSeparator]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-separator", "role": "separator", "aria-orientation": "horizontal" }, properties: { "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectSeparator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[scSelectSeparator]',

package/esm2022/lib/components/select/select-trigger-icon.js CHANGED Viewed

@@ -6,10 +6,10 @@ export class ScSelectTriggerIcon {
     classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
     combobox = inject(Combobox);
     class = computed(() => cn('text-muted-foreground pointer-events-none size-4 shrink-0 transition-transform duration-150', this.combobox.expanded() && 'rotate-180', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectTriggerIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScSelectTriggerIcon, isStandalone: true, selector: "svg[scSelectTriggerIcon]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-trigger-icon" }, properties: { "class": "class()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectTriggerIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: ScSelectTriggerIcon, isStandalone: true, selector: "svg[scSelectTriggerIcon]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "select-trigger-icon" }, properties: { "class": "class()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScSelectTriggerIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ScSelectTriggerIcon, decorators: [{
             type: Directive,
             args: [{
                     selector: 'svg[scSelectTriggerIcon]',