@simplysm/angular 14.0.26 → 14.0.28

package/dist/ui/form/input/{sd-textfield.control.js → sd-textfield.js}

@@ -2,12 +2,12 @@ import { booleanAttribute, ChangeDetectionStrategy, Component, computed, input,
 import { setupInvalid } from "../../../core/utils/setups/setupInvalid";
 import { textfieldTypeHandlers, } from "./sd-textfield-type-handlers";
 import * as i0 from "@angular/core";
-function SdTextfieldControl_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function SdTextfield_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementStart(0, "span", 0);
     i0.ɵɵtext(1, "****");
     i0.ɵɵdomElementEnd();
 } }
-function SdTextfieldControl_Conditional_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+function SdTextfield_Conditional_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementStart(0, "pre");
     i0.ɵɵtext(1);
     i0.ɵɵdomElementEnd();
@@ -16,7 +16,7 @@ function SdTextfieldControl_Conditional_2_Conditional_0_Template(rf, ctx) { if (
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1("", ctx_r0.controlValueText() ?? ctx_r0.controlValue(), " ");
 } }
-function SdTextfieldControl_Conditional_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function SdTextfield_Conditional_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementStart(0, "span", 2);
     i0.ɵɵtext(1);
     i0.ɵɵdomElementEnd();
@@ -25,21 +25,21 @@ function SdTextfieldControl_Conditional_2_Conditional_1_Template(rf, ctx) { if (
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(ctx_r0.placeholder());
 } }
-function SdTextfieldControl_Conditional_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+function SdTextfield_Conditional_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementStart(0, "span");
     i0.ɵɵtext(1, "\u00A0");
     i0.ɵɵdomElementEnd();
 } }
-function SdTextfieldControl_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, SdTextfieldControl_Conditional_2_Conditional_0_Template, 2, 1, "pre")(1, SdTextfieldControl_Conditional_2_Conditional_1_Template, 2, 1, "span", 2)(2, SdTextfieldControl_Conditional_2_Conditional_2_Template, 2, 0, "span");
+function SdTextfield_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, SdTextfield_Conditional_2_Conditional_0_Template, 2, 1, "pre")(1, SdTextfield_Conditional_2_Conditional_1_Template, 2, 1, "span", 2)(2, SdTextfield_Conditional_2_Conditional_2_Template, 2, 0, "span");
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵconditional(ctx_r0.controlValue() ? 0 : ctx_r0.placeholder() ? 1 : 2);
 } }
-function SdTextfieldControl_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+function SdTextfield_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
     i0.ɵɵdomElementStart(0, "input", 3);
-    i0.ɵɵdomListener("input", function SdTextfieldControl_Conditional_3_Template_input_input_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onInput($event)); })("paste", function SdTextfieldControl_Conditional_3_Template_input_paste_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onInputPaste($event)); });
+    i0.ɵɵdomListener("input", function SdTextfield_Conditional_3_Template_input_input_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onInput($event)); })("paste", function SdTextfield_Conditional_3_Template_input_paste_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onInputPaste($event)); });
     i0.ɵɵdomElementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -48,7 +48,7 @@ function SdTextfieldControl_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomProperty("type", ctx_r0.controlType())("value", ctx_r0.controlValue());
     i0.ɵɵattribute("title", ctx_r0.title() ?? ctx_r0.placeholder())("placeholder", ctx_r0.placeholder())("min", ctx_r0.min())("max", ctx_r0.max())("inputmode", ctx_r0.type() === "number" ? "numeric" : undefined)("autocomplete", ctx_r0.autocomplete())("step", ctx_r0.controlStep());
 } }
-export class SdTextfieldControl {
+export class SdTextfield {
     value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
     type = input.required(...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
     placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
@@ -142,14 +142,14 @@ export class SdTextfieldControl {
         }
         this.value.set(parsed);
     }
-    static ɵfac = function SdTextfieldControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTextfieldControl)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTextfieldControl, selectors: [["sd-textfield"]], hostVars: 7, hostBindings: function SdTextfieldControl_HostBindings(rf, ctx) { if (rf & 2) {
+    static ɵfac = function SdTextfield_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTextfield)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTextfield, selectors: [["sd-textfield"]], hostVars: 7, hostBindings: function SdTextfield_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵattribute("data-sd-type", ctx.controlType())("data-sd-disabled", ctx.disabled())("data-sd-readonly", ctx.readonly())("data-sd-inline", ctx.inline())("data-sd-inset", ctx.inset())("data-sd-size", ctx.size())("data-sd-theme", ctx.theme());
-        } }, inputs: { value: [1, "value"], type: [1, "type"], placeholder: [1, "placeholder"], title: [1, "title"], inputStyle: [1, "inputStyle"], inputClass: [1, "inputClass"], disabled: [1, "disabled"], readonly: [1, "readonly"], required: [1, "required"], min: [1, "min"], max: [1, "max"], minlength: [1, "minlength"], maxlength: [1, "maxlength"], pattern: [1, "pattern"], validatorFn: [1, "validatorFn"], format: [1, "format"], step: [1, "step"], autocomplete: [1, "autocomplete"], useNumberComma: [1, "useNumberComma"], minDigits: [1, "minDigits"], inline: [1, "inline"], inset: [1, "inset"], size: [1, "size"], theme: [1, "theme"] }, outputs: { value: "valueChange" }, decls: 4, vars: 9, consts: [[1, "tx-trans-light"], [3, "style", "class", "type", "value"], [1, "tx-trans-lighter"], [3, "input", "paste", "type", "value"]], template: function SdTextfieldControl_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { value: [1, "value"], type: [1, "type"], placeholder: [1, "placeholder"], title: [1, "title"], inputStyle: [1, "inputStyle"], inputClass: [1, "inputClass"], disabled: [1, "disabled"], readonly: [1, "readonly"], required: [1, "required"], min: [1, "min"], max: [1, "max"], minlength: [1, "minlength"], maxlength: [1, "maxlength"], pattern: [1, "pattern"], validatorFn: [1, "validatorFn"], format: [1, "format"], step: [1, "step"], autocomplete: [1, "autocomplete"], useNumberComma: [1, "useNumberComma"], minDigits: [1, "minDigits"], inline: [1, "inline"], inset: [1, "inset"], size: [1, "size"], theme: [1, "theme"] }, outputs: { value: "valueChange" }, decls: 4, vars: 9, consts: [[1, "tx-trans-light"], [3, "style", "class", "type", "value"], [1, "tx-trans-lighter"], [3, "input", "paste", "type", "value"]], template: function SdTextfield_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵdomElementStart(0, "div");
-            i0.ɵɵconditionalCreate(1, SdTextfieldControl_Conditional_1_Template, 2, 0, "span", 0)(2, SdTextfieldControl_Conditional_2_Template, 3, 1);
+            i0.ɵɵconditionalCreate(1, SdTextfield_Conditional_1_Template, 2, 0, "span", 0)(2, SdTextfield_Conditional_2_Template, 3, 1);
             i0.ɵɵdomElementEnd();
-            i0.ɵɵconditionalCreate(3, SdTextfieldControl_Conditional_3_Template, 1, 13, "input", 1);
+            i0.ɵɵconditionalCreate(3, SdTextfield_Conditional_3_Template, 1, 13, "input", 1);
         } if (rf & 2) {
             i0.ɵɵstyleMap(ctx.inputStyle());
             i0.ɵɵclassMap(ctx.inputClass() ? "_contents " + ctx.inputClass() : "_contents");
@@ -161,7 +161,7 @@ export class SdTextfieldControl {
             i0.ɵɵconditional(!ctx.readonly() && !ctx.disabled() ? 3 : -1);
         } }, styles: ["sd-textfield {\n  display: block;\n  position: relative;\n}\nsd-textfield > input,\nsd-textfield > ._contents {\n  display: block;\n  padding: var(--gap-sm) var(--gap-default);\n  border: 1px solid transparent;\n  font-size: var(--font-size-default);\n  font-family: var(--font-family);\n  font-variant-numeric: tabular-nums;\n  line-height: var(--line-height);\n  color: var(--text-trans-default);\n  overflow: auto;\n  width: 100%;\n  border: 1px solid var(--trans-lighter);\n  border-radius: var(--border-radius-default);\n  background: var(--theme-secondary-lightest);\n}\nsd-textfield > input:focus,\nsd-textfield > ._contents:focus {\n  outline: none;\n  border-color: var(--theme-secondary-default);\n}\nsd-textfield > input[type=date], sd-textfield > input[type=month], sd-textfield > input[type=datetime-local],\nsd-textfield > ._contents[type=date],\nsd-textfield > ._contents[type=month],\nsd-textfield > ._contents[type=datetime-local] {\n  padding-top: calc(var(--gap-sm) - 1px);\n  padding-bottom: calc(var(--gap-sm) - 1px);\n}\nsd-textfield > input::-webkit-scrollbar,\nsd-textfield > ._contents::-webkit-scrollbar {\n  display: none;\n}\nsd-textfield > input::-webkit-input-placeholder,\nsd-textfield > ._contents::-webkit-input-placeholder {\n  color: var(--text-trans-lighter);\n}\nsd-textfield > input::-webkit-outer-spin-button, sd-textfield > input::-webkit-inner-spin-button,\nsd-textfield > ._contents::-webkit-outer-spin-button,\nsd-textfield > ._contents::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\nsd-textfield > input::-webkit-calendar-picker-indicator,\nsd-textfield > ._contents::-webkit-calendar-picker-indicator {\n  cursor: pointer;\n  margin: auto;\n}\nsd-textfield > ._contents {\n  display: none;\n}\nsd-textfield[data-sd-type=number] > input,\nsd-textfield[data-sd-type=number] > ._contents {\n  text-align: right;\n}\nsd-textfield[data-sd-theme=gray] > input,\nsd-textfield[data-sd-theme=gray] > ._contents {\n  background: var(--theme-gray-lightest);\n}\nsd-textfield[data-sd-theme=blue-gray] > input,\nsd-textfield[data-sd-theme=blue-gray] > ._contents {\n  background: var(--theme-blue-gray-lightest);\n}\nsd-textfield[data-sd-theme=primary] > input,\nsd-textfield[data-sd-theme=primary] > ._contents {\n  background: var(--theme-primary-lightest);\n}\nsd-textfield[data-sd-theme=secondary] > input,\nsd-textfield[data-sd-theme=secondary] > ._contents {\n  background: var(--theme-secondary-lightest);\n}\nsd-textfield[data-sd-theme=info] > input,\nsd-textfield[data-sd-theme=info] > ._contents {\n  background: var(--theme-info-lightest);\n}\nsd-textfield[data-sd-theme=success] > input,\nsd-textfield[data-sd-theme=success] > ._contents {\n  background: var(--theme-success-lightest);\n}\nsd-textfield[data-sd-theme=warning] > input,\nsd-textfield[data-sd-theme=warning] > ._contents {\n  background: var(--theme-warning-lightest);\n}\nsd-textfield[data-sd-theme=danger] > input,\nsd-textfield[data-sd-theme=danger] > ._contents {\n  background: var(--theme-danger-lightest);\n}\nsd-textfield[data-sd-size=sm] > input,\nsd-textfield[data-sd-size=sm] > ._contents {\n  padding: var(--gap-xs) var(--gap-sm);\n}\nsd-textfield[data-sd-size=sm] > input[type=date], sd-textfield[data-sd-size=sm] > input[type=month], sd-textfield[data-sd-size=sm] > input[type=datetime-local], sd-textfield[data-sd-size=sm] > input[type=color],\nsd-textfield[data-sd-size=sm] > ._contents[type=date],\nsd-textfield[data-sd-size=sm] > ._contents[type=month],\nsd-textfield[data-sd-size=sm] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=sm] > ._contents[type=color] {\n  padding-top: calc(var(--gap-xs) - 1px);\n  padding-bottom: calc(var(--gap-xs) - 1px);\n}\nsd-textfield[data-sd-size=lg] > input,\nsd-textfield[data-sd-size=lg] > ._contents {\n  padding: var(--gap-default) var(--gap-lg);\n}\nsd-textfield[data-sd-size=lg] > input[type=date], sd-textfield[data-sd-size=lg] > input[type=month], sd-textfield[data-sd-size=lg] > input[type=datetime-local], sd-textfield[data-sd-size=lg] > input[type=color],\nsd-textfield[data-sd-size=lg] > ._contents[type=date],\nsd-textfield[data-sd-size=lg] > ._contents[type=month],\nsd-textfield[data-sd-size=lg] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=lg] > ._contents[type=color] {\n  padding-top: calc(var(--gap-default) - 1px);\n  padding-bottom: calc(var(--gap-default) - 1px);\n}\nsd-textfield[data-sd-inline=true] {\n  display: inline-block;\n  vertical-align: top;\n}\nsd-textfield[data-sd-inline=true] > input,\nsd-textfield[data-sd-inline=true] > ._contents {\n  width: auto;\n  vertical-align: top;\n}\nsd-textfield[data-sd-inset=true] > ._contents {\n  display: block;\n}\nsd-textfield[data-sd-inset=true] > input {\n  position: absolute;\n  top: 0;\n  left: 0;\n}\nsd-textfield[data-sd-inset=true] > input,\nsd-textfield[data-sd-inset=true] > ._contents {\n  width: 100%;\n  border: none;\n  border-radius: 0;\n}\nsd-textfield[data-sd-inset=true] > input:focus {\n  outline: 1px solid var(--theme-primary-default);\n  outline-offset: -1px;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=month] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=month] > ._contents {\n  width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=date] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=date] > ._contents {\n  width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > ._contents {\n  width: 14em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=year] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=year] > ._contents {\n  width: 4em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-sm) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-xs) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-default) * 2);\n}\nsd-textfield[data-sd-disabled=true] > ._contents {\n  display: block;\n  background: var(--theme-gray-lightest);\n  color: var(--text-trans-light);\n}\nsd-textfield[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n  background: var(--control-color);\n  color: var(--text-trans-default);\n}\nsd-textfield[data-sd-readonly=true] > ._contents {\n  display: block;\n}"], encapsulation: 2, changeDetection: 0 });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTextfieldControl, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTextfield, [{
         type: Component,
         args: [{ selector: "sd-textfield", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
     <div
@@ -209,4 +209,4 @@ export class SdTextfieldControl {
                     "[attr.data-sd-theme]": "theme()",
                 }, styles: ["sd-textfield {\n  display: block;\n  position: relative;\n}\nsd-textfield > input,\nsd-textfield > ._contents {\n  display: block;\n  padding: var(--gap-sm) var(--gap-default);\n  border: 1px solid transparent;\n  font-size: var(--font-size-default);\n  font-family: var(--font-family);\n  font-variant-numeric: tabular-nums;\n  line-height: var(--line-height);\n  color: var(--text-trans-default);\n  overflow: auto;\n  width: 100%;\n  border: 1px solid var(--trans-lighter);\n  border-radius: var(--border-radius-default);\n  background: var(--theme-secondary-lightest);\n}\nsd-textfield > input:focus,\nsd-textfield > ._contents:focus {\n  outline: none;\n  border-color: var(--theme-secondary-default);\n}\nsd-textfield > input[type=date], sd-textfield > input[type=month], sd-textfield > input[type=datetime-local],\nsd-textfield > ._contents[type=date],\nsd-textfield > ._contents[type=month],\nsd-textfield > ._contents[type=datetime-local] {\n  padding-top: calc(var(--gap-sm) - 1px);\n  padding-bottom: calc(var(--gap-sm) - 1px);\n}\nsd-textfield > input::-webkit-scrollbar,\nsd-textfield > ._contents::-webkit-scrollbar {\n  display: none;\n}\nsd-textfield > input::-webkit-input-placeholder,\nsd-textfield > ._contents::-webkit-input-placeholder {\n  color: var(--text-trans-lighter);\n}\nsd-textfield > input::-webkit-outer-spin-button, sd-textfield > input::-webkit-inner-spin-button,\nsd-textfield > ._contents::-webkit-outer-spin-button,\nsd-textfield > ._contents::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\nsd-textfield > input::-webkit-calendar-picker-indicator,\nsd-textfield > ._contents::-webkit-calendar-picker-indicator {\n  cursor: pointer;\n  margin: auto;\n}\nsd-textfield > ._contents {\n  display: none;\n}\nsd-textfield[data-sd-type=number] > input,\nsd-textfield[data-sd-type=number] > ._contents {\n  text-align: right;\n}\nsd-textfield[data-sd-theme=gray] > input,\nsd-textfield[data-sd-theme=gray] > ._contents {\n  background: var(--theme-gray-lightest);\n}\nsd-textfield[data-sd-theme=blue-gray] > input,\nsd-textfield[data-sd-theme=blue-gray] > ._contents {\n  background: var(--theme-blue-gray-lightest);\n}\nsd-textfield[data-sd-theme=primary] > input,\nsd-textfield[data-sd-theme=primary] > ._contents {\n  background: var(--theme-primary-lightest);\n}\nsd-textfield[data-sd-theme=secondary] > input,\nsd-textfield[data-sd-theme=secondary] > ._contents {\n  background: var(--theme-secondary-lightest);\n}\nsd-textfield[data-sd-theme=info] > input,\nsd-textfield[data-sd-theme=info] > ._contents {\n  background: var(--theme-info-lightest);\n}\nsd-textfield[data-sd-theme=success] > input,\nsd-textfield[data-sd-theme=success] > ._contents {\n  background: var(--theme-success-lightest);\n}\nsd-textfield[data-sd-theme=warning] > input,\nsd-textfield[data-sd-theme=warning] > ._contents {\n  background: var(--theme-warning-lightest);\n}\nsd-textfield[data-sd-theme=danger] > input,\nsd-textfield[data-sd-theme=danger] > ._contents {\n  background: var(--theme-danger-lightest);\n}\nsd-textfield[data-sd-size=sm] > input,\nsd-textfield[data-sd-size=sm] > ._contents {\n  padding: var(--gap-xs) var(--gap-sm);\n}\nsd-textfield[data-sd-size=sm] > input[type=date], sd-textfield[data-sd-size=sm] > input[type=month], sd-textfield[data-sd-size=sm] > input[type=datetime-local], sd-textfield[data-sd-size=sm] > input[type=color],\nsd-textfield[data-sd-size=sm] > ._contents[type=date],\nsd-textfield[data-sd-size=sm] > ._contents[type=month],\nsd-textfield[data-sd-size=sm] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=sm] > ._contents[type=color] {\n  padding-top: calc(var(--gap-xs) - 1px);\n  padding-bottom: calc(var(--gap-xs) - 1px);\n}\nsd-textfield[data-sd-size=lg] > input,\nsd-textfield[data-sd-size=lg] > ._contents {\n  padding: var(--gap-default) var(--gap-lg);\n}\nsd-textfield[data-sd-size=lg] > input[type=date], sd-textfield[data-sd-size=lg] > input[type=month], sd-textfield[data-sd-size=lg] > input[type=datetime-local], sd-textfield[data-sd-size=lg] > input[type=color],\nsd-textfield[data-sd-size=lg] > ._contents[type=date],\nsd-textfield[data-sd-size=lg] > ._contents[type=month],\nsd-textfield[data-sd-size=lg] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=lg] > ._contents[type=color] {\n  padding-top: calc(var(--gap-default) - 1px);\n  padding-bottom: calc(var(--gap-default) - 1px);\n}\nsd-textfield[data-sd-inline=true] {\n  display: inline-block;\n  vertical-align: top;\n}\nsd-textfield[data-sd-inline=true] > input,\nsd-textfield[data-sd-inline=true] > ._contents {\n  width: auto;\n  vertical-align: top;\n}\nsd-textfield[data-sd-inset=true] > ._contents {\n  display: block;\n}\nsd-textfield[data-sd-inset=true] > input {\n  position: absolute;\n  top: 0;\n  left: 0;\n}\nsd-textfield[data-sd-inset=true] > input,\nsd-textfield[data-sd-inset=true] > ._contents {\n  width: 100%;\n  border: none;\n  border-radius: 0;\n}\nsd-textfield[data-sd-inset=true] > input:focus {\n  outline: 1px solid var(--theme-primary-default);\n  outline-offset: -1px;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=month] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=month] > ._contents {\n  width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=date] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=date] > ._contents {\n  width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > ._contents {\n  width: 14em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=year] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=year] > ._contents {\n  width: 4em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-sm) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-xs) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > ._contents {\n  height: calc(var(--font-size-default) * var(--line-height-strip-unit) + var(--gap-default) * 2);\n}\nsd-textfield[data-sd-disabled=true] > ._contents {\n  display: block;\n  background: var(--theme-gray-lightest);\n  color: var(--text-trans-light);\n}\nsd-textfield[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n  background: var(--control-color);\n  color: var(--text-trans-default);\n}\nsd-textfield[data-sd-readonly=true] > ._contents {\n  display: block;\n}"] }]
     }], () => [], { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], inputStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputStyle", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], minlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minlength", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], pattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "pattern", required: false }] }], validatorFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "validatorFn", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], useNumberComma: [{ type: i0.Input, args: [{ isSignal: true, alias: "useNumberComma", required: false }] }], minDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDigits", required: false }] }], inline: [{ type: i0.Input, args: [{ isSignal: true, alias: "inline", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTextfieldControl, { className: "SdTextfieldControl", filePath: "packages/angular/src/ui/form/input/sd-textfield.control.ts", lineNumber: 286, forbidOrphanRendering: true }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTextfield, { className: "SdTextfield", filePath: "packages/angular/src/ui/form/input/sd-textfield.ts", lineNumber: 286, forbidOrphanRendering: true }); })();

package/dist/ui/form/{sd-form.control.d.ts → sd-form.d.ts}

@@ -1,13 +1,13 @@
 import { ElementRef } from "@angular/core";
 import * as i0 from "@angular/core";
-export declare class SdFormControl {
+export declare class SdForm {
     formElRef: import("@angular/core").Signal<ElementRef<HTMLFormElement>>;
     get formEl(): HTMLFormElement;
     formSubmit: import("@angular/core").OutputEmitterRef<SubmitEvent>;
     formInvalid: import("@angular/core").OutputEmitterRef<void>;
     requestSubmit(): void;
     handleSubmit(event: SubmitEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdFormControl, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SdFormControl, "sd-form", never, {}, { "formSubmit": "formSubmit"; "formInvalid": "formInvalid"; }, never, ["*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdForm, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdForm, "sd-form", never, {}, { "formSubmit": "formSubmit"; "formInvalid": "formInvalid"; }, never, ["*"], true, never>;
 }
-//# sourceMappingURL=sd-form.control.d.ts.map
+//# sourceMappingURL=sd-form.d.ts.map

package/dist/ui/form/sd-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-form.d.ts","sourceRoot":"","sources":["../../../src/ui/form/sd-form.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,UAAU,EAIX,MAAM,eAAe,CAAC;;AAEvB,qBAaa,MAAM;IACjB,SAAS,8DAEN;IAEH,IAAI,MAAM,oBAET;IAED,UAAU,wDAAyB;IACnC,WAAW,iDAAY;IAEvB,aAAa;IAIb,YAAY,CAAC,KAAK,EAAE,WAAW;yCAhBpB,MAAM;2CAAN,MAAM;CA6BlB"}

package/dist/ui/form/{sd-form.control.js → sd-form.js}

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, ElementRef, output, viewChild, View
 import * as i0 from "@angular/core";
 const _c0 = ["formEl"];
 const _c1 = ["*"];
-export class SdFormControl {
+export class SdForm {
     formElRef = viewChild.required("formEl", {
         read: ElementRef,
     });
@@ -25,21 +25,21 @@ export class SdFormControl {
         this.formEl.reportValidity();
         this.formInvalid.emit();
     }
-    static ɵfac = function SdFormControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdFormControl)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdFormControl, selectors: [["sd-form"]], viewQuery: function SdFormControl_Query(rf, ctx) { if (rf & 1) {
+    static ɵfac = function SdForm_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdForm)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdForm, selectors: [["sd-form"]], viewQuery: function SdForm_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuerySignal(ctx.formElRef, _c0, 5, ElementRef);
         } if (rf & 2) {
             i0.ɵɵqueryAdvance();
-        } }, outputs: { formSubmit: "formSubmit", formInvalid: "formInvalid" }, ngContentSelectors: _c1, decls: 4, vars: 0, consts: [["formEl", ""], ["novalidate", "", 3, "submit"], ["hidden", "", "type", "submit"]], template: function SdFormControl_Template(rf, ctx) { if (rf & 1) {
+        } }, outputs: { formSubmit: "formSubmit", formInvalid: "formInvalid" }, ngContentSelectors: _c1, decls: 4, vars: 0, consts: [["formEl", ""], ["novalidate", "", 3, "submit"], ["hidden", "", "type", "submit"]], template: function SdForm_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵdomElementStart(0, "form", 1, 0);
-            i0.ɵɵdomListener("submit", function SdFormControl_Template_form_submit_0_listener($event) { return ctx.handleSubmit($event); });
+            i0.ɵɵdomListener("submit", function SdForm_Template_form_submit_0_listener($event) { return ctx.handleSubmit($event); });
             i0.ɵɵprojection(2);
             i0.ɵɵdomElement(3, "button", 2);
             i0.ɵɵdomElementEnd();
         } }, encapsulation: 2, changeDetection: 0 });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdFormControl, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdForm, [{
         type: Component,
         args: [{
                 selector: "sd-form",
@@ -57,4 +57,4 @@ export class SdFormControl {
     }], null, { formElRef: [{ type: i0.ViewChild, args: ["formEl", { ...{
                         read: ElementRef,
                     }, isSignal: true }] }], formSubmit: [{ type: i0.Output, args: ["formSubmit"] }], formInvalid: [{ type: i0.Output, args: ["formInvalid"] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdFormControl, { className: "SdFormControl", filePath: "packages/angular/src/ui/form/sd-form.control.ts", lineNumber: 23, forbidOrphanRendering: true }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdForm, { className: "SdForm", filePath: "packages/angular/src/ui/form/sd-form.ts", lineNumber: 23, forbidOrphanRendering: true }); })();

package/dist/ui/form/select/sd-select-button.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class SdSelectButton {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSelectButton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSelectButton, "sd-select-button", never, {}, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-select-button.d.ts.map

package/dist/ui/form/select/sd-select-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-select-button.d.ts","sourceRoot":"","sources":["../../../../src/ui/form/select/sd-select-button.ts"],"names":[],"mappings":";AAOA,qBA+Ba,cAAc;;yCAAd,cAAc;2CAAd,cAAc;CAI1B"}

package/dist/ui/form/select/{sd-select-button.control.js → sd-select-button.js}

@@ -2,19 +2,19 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation, } from "@angular
 import { setupRipple } from "../../../core/utils/setups/setupRipple";
 import * as i0 from "@angular/core";
 const _c0 = ["*"];
-export class SdSelectButtonControl {
+export class SdSelectButton {
     constructor() {
         setupRipple(() => true);
     }
-    static ɵfac = function SdSelectButtonControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSelectButtonControl)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSelectButtonControl, selectors: [["sd-select-button"]], hostVars: 1, hostBindings: function SdSelectButtonControl_HostBindings(rf, ctx) { if (rf & 2) {
+    static ɵfac = function SdSelectButton_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSelectButton)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSelectButton, selectors: [["sd-select-button"]], hostVars: 1, hostBindings: function SdSelectButton_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵattribute("tabindex", 0);
-        } }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSelectButtonControl_Template(rf, ctx) { if (rf & 1) {
+        } }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSelectButton_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, styles: ["sd-select-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  border-left: 1px solid var(--trans-lighter);\n  position: relative;\n  overflow: hidden;\n}\nsd-select-button:hover {\n  background: var(--trans-lighter);\n}"], encapsulation: 2, changeDetection: 0 });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectButtonControl, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectButton, [{
         type: Component,
         args: [{ selector: "sd-select-button", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
     <ng-content />
@@ -22,4 +22,4 @@ export class SdSelectButtonControl {
                     "[attr.tabindex]": "0",
                 }, styles: ["sd-select-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  border-left: 1px solid var(--trans-lighter);\n  position: relative;\n  overflow: hidden;\n}\nsd-select-button:hover {\n  background: var(--trans-lighter);\n}"] }]
     }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelectButtonControl, { className: "SdSelectButtonControl", filePath: "packages/angular/src/ui/form/select/sd-select-button.control.ts", lineNumber: 39, forbidOrphanRendering: true }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelectButton, { className: "SdSelectButton", filePath: "packages/angular/src/ui/form/select/sd-select-button.ts", lineNumber: 39, forbidOrphanRendering: true }); })();

package/dist/ui/form/select/sd-select-item.d.ts

@@ -0,0 +1,18 @@
+import { SdSelect } from "./sd-select";
+import * as i0 from "@angular/core";
+export declare class SdSelectItem<T> {
+    protected readonly _parentControl: SdSelect<any, T>;
+    private readonly _elRef;
+    private readonly _destroyRef;
+    value: import("@angular/core").InputSignal<T>;
+    disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    hidden: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    contentHTML: import("@angular/core").WritableSignal<string>;
+    isSelected: import("@angular/core").Signal<boolean>;
+    constructor();
+    onClick(): void;
+    onKeydown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSelectItem<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSelectItem<any>, "sd-select-item", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-select-item.d.ts.map

package/dist/ui/form/select/sd-select-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-select-item.d.ts","sourceRoot":"","sources":["../../../../src/ui/form/select/sd-select-item.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;;AAIvC,qBA6Da,YAAY,CAAC,CAAC;IACzB,SAAS,CAAC,QAAQ,CAAC,cAAc,mBAE/B;IACF,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAmC;IAC1D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAsB;IAElD,KAAK,yCAAuB;IAC5B,QAAQ,qEAAiD;IACzD,MAAM,qEAAiD;IAEvD,WAAW,iDAAc;IAEzB,UAAU,0CAQP;;IAkBH,OAAO,IAAI,IAAI;IAKf,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;yCA5C1B,YAAY;2CAAZ,YAAY;CA+DxB"}

package/dist/ui/form/select/{sd-select-item.control.js → sd-select-item.js}

@@ -1,10 +1,10 @@
 import { afterNextRender, booleanAttribute, ChangeDetectionStrategy, Component, computed, DestroyRef, ElementRef, forwardRef, inject, input, signal, ViewEncapsulation, } from "@angular/core";
-import { SdSelectControl } from "./sd-select.control";
-import { SdCheckboxControl } from "../checkbox/sd-checkbox.control";
-import { SdGapControl } from "../../layout/sd-gap.control";
+import { SdSelect } from "./sd-select";
+import { SdCheckbox } from "../checkbox/sd-checkbox";
+import { SdGap } from "../../layout/sd-gap";
 import * as i0 from "@angular/core";
 const _c0 = ["*"];
-function SdSelectItemControl_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function SdSelectItem_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "sd-checkbox", 1)(1, "sd-gap", 2);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -12,8 +12,8 @@ function SdSelectItemControl_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵproperty("width", "sm");
 } }
-export class SdSelectItemControl {
-    _parentControl = inject(forwardRef(() => SdSelectControl));
+export class SdSelectItem {
+    _parentControl = inject(forwardRef(() => SdSelect));
     _elRef = inject((ElementRef));
     _destroyRef = inject(DestroyRef);
     value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -69,24 +69,24 @@ export class SdSelectItemControl {
             }
         }
     }
-    static ɵfac = function SdSelectItemControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSelectItemControl)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSelectItemControl, selectors: [["sd-select-item"]], hostVars: 3, hostBindings: function SdSelectItemControl_HostBindings(rf, ctx) { if (rf & 2) {
+    static ɵfac = function SdSelectItem_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSelectItem)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSelectItem, selectors: [["sd-select-item"]], hostVars: 3, hostBindings: function SdSelectItem_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵattribute("data-sd-selected", ctx.isSelected())("data-sd-disabled", ctx.disabled())("data-sd-hidden", ctx.hidden());
-        } }, inputs: { value: [1, "value"], disabled: [1, "disabled"], hidden: [1, "hidden"] }, ngContentSelectors: _c0, decls: 3, vars: 1, consts: [["tabindex", "0", 1, "_content", 3, "click", "keydown"], [3, "value", "inline"], [3, "width"]], template: function SdSelectItemControl_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { value: [1, "value"], disabled: [1, "disabled"], hidden: [1, "hidden"] }, ngContentSelectors: _c0, decls: 3, vars: 1, consts: [["tabindex", "0", 1, "_content", 3, "click", "keydown"], [3, "value", "inline"], [3, "width"]], template: function SdSelectItem_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵlistener("click", function SdSelectItemControl_Template_div_click_0_listener() { return ctx.onClick(); })("keydown", function SdSelectItemControl_Template_div_keydown_0_listener($event) { return ctx.onKeydown($event); });
-            i0.ɵɵconditionalCreate(1, SdSelectItemControl_Conditional_1_Template, 2, 3);
+            i0.ɵɵlistener("click", function SdSelectItem_Template_div_click_0_listener() { return ctx.onClick(); })("keydown", function SdSelectItem_Template_div_keydown_0_listener($event) { return ctx.onKeydown($event); });
+            i0.ɵɵconditionalCreate(1, SdSelectItem_Conditional_1_Template, 2, 3);
             i0.ɵɵprojection(2);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx._parentControl.selectMode() === "multi" ? 1 : -1);
-        } }, dependencies: [SdCheckboxControl, SdGapControl], styles: ["sd-select-item {\n  display: block;\n}\nsd-select-item > ._content {\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n}\nsd-select-item > ._content:hover {\n  background: var(--trans-lighter);\n}\nsd-select-item > ._content:focus {\n  outline: none;\n  background: var(--trans-lighter);\n}\nsd-select-item[data-sd-selected=true] > ._content {\n  background: var(--trans-lighter);\n  font-weight: bold;\n}\nsd-select-item[data-sd-disabled=true] > ._content {\n  opacity: 0.3;\n  cursor: default;\n  pointer-events: none;\n}\nsd-select-item[data-sd-hidden=true] {\n  display: none;\n}"], encapsulation: 2, changeDetection: 0 });
+        } }, dependencies: [SdCheckbox, SdGap], styles: ["sd-select-item {\n  display: block;\n}\nsd-select-item > ._content {\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n}\nsd-select-item > ._content:hover {\n  background: var(--trans-lighter);\n}\nsd-select-item > ._content:focus {\n  outline: none;\n  background: var(--trans-lighter);\n}\nsd-select-item[data-sd-selected=true] > ._content {\n  background: var(--trans-lighter);\n  font-weight: bold;\n}\nsd-select-item[data-sd-disabled=true] > ._content {\n  opacity: 0.3;\n  cursor: default;\n  pointer-events: none;\n}\nsd-select-item[data-sd-hidden=true] {\n  display: none;\n}"], encapsulation: 2, changeDetection: 0 });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectItemControl, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectItem, [{
         type: Component,
-        args: [{ selector: "sd-select-item", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdCheckboxControl, SdGapControl], template: `
+        args: [{ selector: "sd-select-item", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdCheckbox, SdGap], template: `
     <div class="_content" tabindex="0" (click)="onClick()" (keydown)="onKeydown($event)">
       @if (_parentControl.selectMode() === "multi") {
         <sd-checkbox [value]="isSelected()" [inline]="true" />
@@ -100,4 +100,4 @@ export class SdSelectItemControl {
                     "[attr.data-sd-hidden]": "hidden()",
                 }, styles: ["sd-select-item {\n  display: block;\n}\nsd-select-item > ._content {\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n}\nsd-select-item > ._content:hover {\n  background: var(--trans-lighter);\n}\nsd-select-item > ._content:focus {\n  outline: none;\n  background: var(--trans-lighter);\n}\nsd-select-item[data-sd-selected=true] > ._content {\n  background: var(--trans-lighter);\n  font-weight: bold;\n}\nsd-select-item[data-sd-disabled=true] > ._content {\n  opacity: 0.3;\n  cursor: default;\n  pointer-events: none;\n}\nsd-select-item[data-sd-hidden=true] {\n  display: none;\n}"] }]
     }], () => [], { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "hidden", required: false }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelectItemControl, { className: "SdSelectItemControl", filePath: "packages/angular/src/ui/form/select/sd-select-item.control.ts", lineNumber: 80, forbidOrphanRendering: true }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelectItem, { className: "SdSelectItem", filePath: "packages/angular/src/ui/form/select/sd-select-item.ts", lineNumber: 80, forbidOrphanRendering: true }); })();

package/dist/ui/form/select/{sd-select.control.d.ts → sd-select.d.ts}

@@ -1,13 +1,13 @@
 import { TemplateRef } from "@angular/core";
-import { SdSelectItemControl } from "./sd-select-item.control";
+import { SdSelectItem } from "./sd-select-item";
 import * as i0 from "@angular/core";
-export type TSelectModeValue<T> = {
+export type SelectModeValue<T> = {
     multi: T[];
     single: T;
 };
-export declare class SdSelectControl<M extends "single" | "multi", T> {
+export declare class SdSelect<M extends "single" | "multi", T> {
     selectMode: import("@angular/core").InputSignal<M>;
-    value: import("@angular/core").ModelSignal<TSelectModeValue<any>[M] | undefined>;
+    value: import("@angular/core").ModelSignal<SelectModeValue<any>[M] | undefined>;
     placeholder: import("@angular/core").InputSignal<string | undefined>;
     disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     inline: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
@@ -22,7 +22,7 @@ export declare class SdSelectControl<M extends "single" | "multi", T> {
     contentStyle: import("@angular/core").InputSignal<string | undefined>;
     dropdownOpen: import("@angular/core").WritableSignal<boolean>;
     protected readonly tablerCaretDown = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"></path><path d=\"M6 10l6 6l6 -6h-12\"></path></svg>";
-    _itemControls: import("@angular/core").Signal<readonly SdSelectItemControl<any>[]>;
+    _itemControls: import("@angular/core").Signal<readonly SdSelectItem<any>[]>;
     private readonly _dropdownControl;
     private readonly _dropdownElRef;
     _headerTpl: import("@angular/core").Signal<TemplateRef<void> | undefined>;
@@ -42,7 +42,7 @@ export declare class SdSelectControl<M extends "single" | "multi", T> {
     onDeselectAll(): void;
     closeDropdown(): void;
     openDropdown(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdSelectControl<any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SdSelectControl<any, any>, "sd-select", never, { "selectMode": { "alias": "selectMode"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "inset": { "alias": "inset"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hideSelectAll": { "alias": "hideSelectAll"; "required": false; "isSignal": true; }; "multiSelectionDisplayDirection": { "alias": "multiSelectionDisplayDirection"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "getChildrenFn": { "alias": "getChildrenFn"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; "contentStyle": { "alias": "contentStyle"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["_itemControls", "_headerTpl", "_beforeTpl", "_itemOfTpl"], ["sd-select-button", "*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSelect<any, any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSelect<any, any>, "sd-select", never, { "selectMode": { "alias": "selectMode"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "inset": { "alias": "inset"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hideSelectAll": { "alias": "hideSelectAll"; "required": false; "isSignal": true; }; "multiSelectionDisplayDirection": { "alias": "multiSelectionDisplayDirection"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "getChildrenFn": { "alias": "getChildrenFn"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; "contentStyle": { "alias": "contentStyle"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["_itemControls", "_headerTpl", "_beforeTpl", "_itemOfTpl"], ["sd-select-button", "*"], true, never>;
 }
-//# sourceMappingURL=sd-select.control.d.ts.map
+//# sourceMappingURL=sd-select.d.ts.map

package/dist/ui/form/select/sd-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-select.d.ts","sourceRoot":"","sources":["../../../../src/ui/form/select/sd-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAYL,WAAW,EAIZ,MAAM,eAAe,CAAC;AAIvB,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;;AAUhD,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,MAAM,EAAE,CAAC,CAAC;CACX,CAAC;AAEF,qBAmJa,QAAQ,CAAC,CAAC,SAAS,QAAQ,GAAG,OAAO,EAAE,CAAC;IACnD,UAAU,yCAAwB;IAClC,KAAK,2EAAoC;IACzC,WAAW,0DAAmB;IAC9B,QAAQ,qEAAiD;IACzD,MAAM,qEAAiD;IACvD,KAAK,qEAAiD;IACtD,IAAI,+DAAwB;IAC5B,QAAQ,qEAAiD;IAEzD,aAAa,qEAAiD;IAC9D,8BAA8B,8DAAuB;IAErD,KAAK,uDAAgB;IACrB,aAAa,8CAAgB,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,eAAI;IAEtD,YAAY,0DAAmB;IAC/B,YAAY,0DAAmB;IAE/B,YAAY,kDAAiB;IAE7B,SAAS,CAAC,QAAQ,CAAC,eAAe,iUAAmB;IAErD,aAAa,+DAAiC;IAC9C,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAkC;IACnE,OAAO,CAAC,QAAQ,CAAC,cAAc,CAG7B;IAEF,UAAU,gEAAgD;IAC1D,UAAU,gEAAgD;IAC1D,UAAU,+DAAyD;IAEnE,wBAAwB,6DAAyC;IAEjE,UAAU;cAIY,CAAC;eAAS,MAAM;eAAS,MAAM;SAelD;;IAkIH,UAAU,CAAC,SAAS,EAAE,CAAC,GAAG,IAAI;IAO9B,UAAU,CAAC,SAAS,EAAE,CAAC,GAAG,IAAI;IAI9B,OAAO,CAAC,YAAY;IAepB,WAAW,IAAI,IAAI;IAQnB,aAAa,IAAI,IAAI;IAIrB,aAAa,IAAI,IAAI;IAIrB,YAAY,IAAI,IAAI;yCAnOT,QAAQ;2CAAR,QAAQ;CAuOpB"}