@sellmate/design-system 1.0.38 → 1.0.39

package/dist/esm/sd-select-option-group.entry.js

@@ -46,7 +46,7 @@ const SdSelectOptionGroup = class {
         }
     };
     render() {
-        return (h("div", { key: '7581caff61d1257d653b6f58b8d76c21225b3cc5', class: {
+        return (h("div", { key: '70ab9a558faf068cfc4eb0a5f6a29453ceedc6ec', class: {
                 'sd-select__option-group': true,
                 'sd-select__option-group--selected': !!this.isSelected,
                 'sd-select__option-group--disabled': !!this.option.disabled,
@@ -55,10 +55,10 @@ const SdSelectOptionGroup = class {
                 'sd-select__option-group--group': this.option.type === 'group',
                 'sd-select__option-group--subgroup': this.option.type === 'subgroup',
                 'sd-select__option-group--item': this.option.type === 'item',
-            }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, h("div", { key: 'ddb33f6afaa6bc6d6dd3dc494f6ec74b9c023a42', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (h("sd-checkbox", { key: '14f2c7fc347718d2909e5006bf2500a9a51b0a66', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
+            }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, h("div", { key: 'ca5dc0033231ab204a8688f98453742cdbde7d26', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (h("sd-checkbox", { key: 'bba6cb9fe649f6eda82ba287f73d0142e02c53c2', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
                 e.preventDefault();
                 this.handleClick(this.option, this.isSelected, e);
-            } })), h("span", { key: '99415ed662cc2f8f29d31e3811eb4496f8fcac47', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (h("span", { key: 'a3c7dc6455a94ecd4587f8b13b4d1f10e3b58819', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
+            } })), h("span", { key: '7d03c080b7f5b92881389bfec787015a6ac55fa1', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (h("span", { key: '7066453f92eac7549569db6854e3dc32515d80b9', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
     }
 };
 SdSelectOptionGroup.style = sdSelectOptionGroupCss();

package/dist/esm/sd-select-v2-list-item_2.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-B8tGP77V.js';
-import { e as LIST_ITEM_LAYOUT, g as LIST_ITEM_COLORS, h as LIST_ITEM_TYPOGRAPHY, i as SEARCH_DEBOUNCE_MS } from './sd-select-v2.config-BXY0UBNx.js';
+import { e as LIST_ITEM_LAYOUT, g as LIST_ITEM_COLORS, h as LIST_ITEM_TYPOGRAPHY, i as SEARCH_DEBOUNCE_MS } from './sd-select-v2.config-BOmBg3kj.js';
 
 const sdSelectV2ListItemCss = () => `sd-select-v2-list-item{display:block}sd-select-v2-list-item .sd-select-v2-list-item{display:flex;align-items:center;gap:var(--list-item-gap);padding:var(--list-item-padding-y) var(--list-item-padding-right) var(--list-item-padding-y) var(--list-item-padding-left);font-size:var(--list-item-font-size);line-height:var(--list-item-line-height);font-weight:var(--list-item-font-weight);background:var(--list-item-bg);color:var(--list-item-color);cursor:default;user-select:none}sd-select-v2-list-item .sd-select-v2-list-item--selectable{cursor:pointer}sd-select-v2-list-item .sd-select-v2-list-item--depth1-group{border-top:var(--list-item-border-top);font-weight:700}sd-select-v2-list-item .sd-select-v2-list-item--depth2-group{font-weight:500}sd-select-v2-list-item .sd-select-v2-list-item--selectable:not(.sd-select-v2-list-item--disabled):hover{background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--focused.sd-select-v2-list-item--selectable:not(.sd-select-v2-list-item--disabled){background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--selected:not(.sd-select-v2-list-item--group){font-weight:700;color:var(--list-item-bg-hover)}sd-select-v2-list-item .sd-select-v2-list-item--selected:hover,sd-select-v2-list-item .sd-select-v2-list-item--selected.sd-select-v2-list-item--focused{color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--disabled{color:var(--list-item-color-disabled);cursor:not-allowed}sd-select-v2-list-item .sd-select-v2-list-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-v2-list-item .sd-select-v2-list-item__count{flex-shrink:0;font-weight:500;color:var(--list-item-color-disabled)}sd-select-v2-list-item .sd-select-v2-list-item__checkbox{flex-shrink:0}`;
 
@@ -71,7 +71,7 @@ const SdSelectV2ListItem = class {
         if (isDepth1Group) {
             cssVars['--list-item-border-top'] = `${LIST_ITEM_COLORS.depth1.borderWidth}px solid ${LIST_ITEM_COLORS.depth1.border}`;
         }
-        return (h("div", { key: '0abaaaf9e87dd7faa5ca7566d54367fc1a883d6e', class: {
+        return (h("div", { key: '1e828b28202b9d22cc02dff0550e37e506167f90', class: {
                 'sd-select-v2-list-item': true,
                 'sd-select-v2-list-item--group': isGroup,
                 'sd-select-v2-list-item--depth1-group': isDepth1Group,
@@ -81,7 +81,7 @@ const SdSelectV2ListItem = class {
                 'sd-select-v2-list-item--focused': this.isFocused,
                 'sd-select-v2-list-item--selectable': this.isSelectable && !this.option.disabled,
                 'sd-select-v2-list-item--disabled': !!this.option.disabled,
-            }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: 'd2b00059ae0792d7d162e8ea7c8f35640ab6086f', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), h("span", { key: '588434f01076bc963ca733eabf62a74795788c07', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (h("span", { key: '6238cac7c3da53813eb8e65f98167874947625af', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
+            }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: '7f49b89aff1a269944551664bc8a51447b5b2f7e', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), h("span", { key: '51aad2d06ecdf11968f3f13c632081a663a3d200', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (h("span", { key: '1c1f5cd51460863ce41c8980dcc65cd2bb7bfee5', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
     }
 };
 SdSelectV2ListItem.style = sdSelectV2ListItemCss();
@@ -143,12 +143,12 @@ const SdSelectV2ListItemSearch = class {
             clearTimeout(this.debounceTimer);
     }
     render() {
-        return (h("div", { key: '0b97d37d739a22f488b313cfcc6e210c19cd3b7f', class: {
+        return (h("div", { key: 'e7bd315d17d554aa63346f44eb8b2661994b49aa', class: {
                 'sd-select-v2-list-item-search': true,
                 'sd-select-v2-list-item-search--scrolled': this.isScrolled,
-            } }, h("div", { key: 'c0667cb553c481507149baa6da6b07cdc3ed69c4', class: "sd-select-v2-list-item-search__inner" }, h("sd-icon", { key: '0a9f76e5f8bb9a202ca921d076552f7ca8868528', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), h("input", { key: 'ac3dffc2b22f14ed356c92f64f8d1d46e57040f7', ref: el => {
+            } }, h("div", { key: 'ee332050907bc7e9004ff27e3f79cf816e7a44e7', class: "sd-select-v2-list-item-search__inner" }, h("sd-icon", { key: 'ccd929d161ba92ef4e8b008cee8866815c21f430', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), h("input", { key: 'b10e1dcf4bee6df78e917c9e4c31563e0466f38e', ref: el => {
                 this.inputEl = el;
-            }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: () => this.searchFocus.emit() }), this.searchText && (h("button", { key: 'c81a0a057ad862603c3ccb627102182898fd004f', type: "button", class: "sd-select-v2-list-item-search__clear", onClick: this.handleClear }, h("sd-icon", { key: 'b65fcc15d27b3feafba27944dada2c9ed844b870', name: "close", size: 12, color: "#888888" }))))));
+            }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: () => this.searchFocus.emit() }), this.searchText && (h("button", { key: 'fa2ee3033cff6b707a409ada6982ed596492c81d', type: "button", class: "sd-select-v2-list-item-search__clear", onClick: this.handleClear }, h("sd-icon", { key: '0e2cab7ca1a11c1ce60e74ac435dc55fbc375438', name: "close", size: 12, color: "#888888" }))))));
     }
 };
 SdSelectV2ListItemSearch.style = sdSelectV2ListItemSearchCss();

package/dist/esm/sd-select-v2-listbox_2.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-B8tGP77V.js';
-import { c as countLeaves, S as SEARCH_THRESHOLD, f as filterTree, E as EMPTY_MESSAGE, L as LIST_BOX_LAYOUT, a as SELECT_COLORS, b as SELECT_TYPOGRAPHY, d as SELECT_LAYOUT } from './sd-select-v2.config-BXY0UBNx.js';
+import { c as countLeaves, S as SEARCH_THRESHOLD, f as filterTree, E as EMPTY_MESSAGE, L as LIST_BOX_LAYOUT, a as SELECT_COLORS, b as SELECT_TYPOGRAPHY, d as SELECT_LAYOUT } from './sd-select-v2.config-BOmBg3kj.js';
 
 const sdSelectV2ListboxCss = () => `sd-select-v2-listbox{display:block}sd-select-v2-listbox .sd-select-v2-listbox{display:flex;flex-direction:column;min-width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);width:fit-content;border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden}sd-select-v2-listbox .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:var(--listbox-padding-bottom)}sd-select-v2-listbox .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
 
@@ -130,12 +130,12 @@ const SdSelectV2Listbox = class {
             '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
             '--listbox-padding-bottom': `${LIST_BOX_LAYOUT.paddingBottom}px`,
         };
-        return (h("div", { key: '0f92a96e763d00ee241cdca62b3b7ccad90c811a', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (h("sd-select-v2-list-item-search", { key: '7c85122be46cc77db8c28c8b3cf072bfd445d56d', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), h("div", { key: '08a4a00208e70bc77cddec12f6ad71ed8cad0071', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll }, this.isEmpty ? (h("div", { class: "sd-select-v2-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (h("sd-select-v2-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick })))))));
+        return (h("div", { key: 'b64bc66e7f9a356e3f0cf752cba3a3c9de1928c5', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (h("sd-select-v2-list-item-search", { key: '2444bdda4e2a83008d175ba9867ecad01da5ed25', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), h("div", { key: '6307a0fd5480c006248dee44c4e1b54dd5749895', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll }, this.isEmpty ? (h("div", { class: "sd-select-v2-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (h("sd-select-v2-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick })))))));
     }
 };
 SdSelectV2Listbox.style = sdSelectV2ListboxCss();
 
-const sdSelectV2TriggerCss = () => `sd-select-v2-trigger{display:block;width:100%;height:100%}sd-select-v2-trigger .sd-select-v2-trigger{display:flex;width:100%;height:100%;cursor:pointer;user-select:none;overflow:hidden;border-radius:3px}sd-select-v2-trigger .sd-select-v2-trigger--disabled{cursor:not-allowed}sd-select-v2-trigger .sd-select-v2-trigger__addon{display:flex;align-items:center;padding:0 var(--trigger-padding-x);background:var(--trigger-addon-bg);border-right:1px solid var(--trigger-addon-border-color);font-size:var(--trigger-font-size);line-height:var(--trigger-line-height);font-weight:var(--trigger-font-weight);color:var(--trigger-color);white-space:nowrap}sd-select-v2-trigger .sd-select-v2-trigger__content{display:flex;align-items:center;gap:var(--trigger-gap);flex:1;padding:0 var(--trigger-padding-x);min-width:0}sd-select-v2-trigger .sd-select-v2-trigger__text{flex:1;font-size:var(--trigger-font-size);line-height:var(--trigger-line-height);font-weight:var(--trigger-font-weight);color:var(--trigger-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-v2-trigger .sd-select-v2-trigger__icon{flex-shrink:0;transition:transform 0.2s ease}sd-select-v2-trigger .sd-select-v2-trigger__icon--open{transform:rotate(180deg)}`;
+const sdSelectV2TriggerCss = () => `sd-select-v2-trigger{display:block;width:100%;height:100%}sd-select-v2-trigger .sd-select-v2-trigger{display:flex;width:100%;height:100%;cursor:pointer;user-select:none;overflow:hidden;border-radius:3px}sd-select-v2-trigger .sd-select-v2-trigger--disabled{cursor:not-allowed}sd-select-v2-trigger .sd-select-v2-trigger__content{display:flex;align-items:center;gap:var(--trigger-gap);flex:1;padding:0 var(--trigger-padding-x);min-width:0}sd-select-v2-trigger .sd-select-v2-trigger__text{flex:1;font-size:var(--trigger-font-size);line-height:var(--trigger-line-height);font-weight:var(--trigger-font-weight);color:var(--trigger-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-v2-trigger .sd-select-v2-trigger__icon{flex-shrink:0;transition:transform 0.2s ease}sd-select-v2-trigger .sd-select-v2-trigger__icon--open{transform:rotate(180deg)}`;
 
 const SdSelectV2Trigger = class {
     constructor(hostRef) {
@@ -146,7 +146,6 @@ const SdSelectV2Trigger = class {
     placeholder = '선택';
     disabled = false;
     isOpen = false;
-    addonLabel = '';
     triggerClick;
     handleClick = () => {
         if (this.disabled)
@@ -167,16 +166,12 @@ const SdSelectV2Trigger = class {
                     ? SELECT_COLORS.text.default
                     : SELECT_COLORS.icon.default,
             '--trigger-icon-color': this.disabled ? SELECT_COLORS.icon.disabled : SELECT_COLORS.icon.default,
-            '--trigger-addon-bg': SELECT_COLORS.addonLabel.bg,
-            '--trigger-addon-border-color': this.disabled
-                ? SELECT_COLORS.addonLabel.border.disabled
-                : SELECT_COLORS.addonLabel.border.default,
         };
-        return (h("div", { key: '00f76c08c517d52499f1c75315ba1d9b0f7f6a06', class: {
+        return (h("div", { key: '4fe2634aee7071ed48348b19dc367b1af88fd6d9', class: {
                 'sd-select-v2-trigger': true,
                 'sd-select-v2-trigger--open': this.isOpen,
                 'sd-select-v2-trigger--disabled': this.disabled,
-            }, style: cssVars, onClick: this.handleClick }, this.addonLabel && (h("div", { key: 'bca73972b68ae98abc92cb882f65ef5622fc6d49', class: "sd-select-v2-trigger__addon" }, this.addonLabel)), h("div", { key: 'ae66f445590c28064b8cdf0d4048c1c009759291', class: "sd-select-v2-trigger__content" }, h("span", { key: 'e08841d7f17a24142f652d3929017786c37ad486', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), h("sd-icon", { key: '5e4ea15d1ec3e066daff92ecf012087789ba7b87', name: "arrowDown", size: 12, color: "var(--trigger-icon-color)", class: {
+            }, style: cssVars, onClick: this.handleClick }, h("div", { key: 'e0f71cdd91c6e04ebe5543fb2bc87d7331735da6', class: "sd-select-v2-trigger__content" }, h("span", { key: '3abfbc0541569c68870addc16a7d3439d7189ab5', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), h("sd-icon", { key: '8fcb187f67be75cf03c0f0bde42121cba0b16a47', name: "arrowDown", size: 12, color: "var(--trigger-icon-color)", class: {
                 'sd-select-v2-trigger__icon': true,
                 'sd-select-v2-trigger__icon--open': this.isOpen,
             } }))));

package/dist/esm/{sd-select-v2.config-BXY0UBNx.js → sd-select-v2.config-BOmBg3kj.js}

@@ -12,13 +12,6 @@ const select = {
 	text: {
 		"default": "#222222",
 		disabled: "#888888"
-	},
-	addonLabel: {
-		bg: "#F6F6F6",
-		border: {
-			"default": "#AAAAAA",
-			disabled: "#CCCCCC"
-		}
 	}};
 var selectTokens = {
 	select: select
@@ -85,13 +78,6 @@ const SELECT_COLORS = {
         default: selectTokens.select.text.default,
         disabled: selectTokens.select.text.disabled,
     },
-    addonLabel: {
-        bg: selectTokens.select.addonLabel.bg,
-        border: {
-            default: selectTokens.select.addonLabel.border.default,
-            disabled: selectTokens.select.addonLabel.border.disabled,
-        },
-    },
 };
 // ── ListItem Tokens ──
 const LIST_ITEM_LAYOUT = {

package/dist/esm/sd-select-v2.entry.js

@@ -75,7 +75,7 @@ const SdSelectV2 = class {
         return found?.label ?? '';
     }
     flattenOptions(options) {
-        return options.flatMap(o => o.children ? this.flattenOptions(o.children) : [o]);
+        return options.flatMap(o => (o.children ? this.flattenOptions(o.children) : [o]));
     }
     collectLeaves(option) {
         if (!option.children)
@@ -158,8 +158,8 @@ const SdSelectV2 = class {
             this.isOpen = true;
         }
     };
-    emitUpdate(value, option) {
-        this.update.emit(this.emitValue ? value : { value, option });
+    emitUpdate(value) {
+        this.update.emit(value);
     }
     handleOptionSelect = (option) => {
         if (this.isMulti) {
@@ -167,7 +167,7 @@ const SdSelectV2 = class {
         }
         else {
             this.value = this.emitValue ? option.value : option;
-            this.emitUpdate(this.value, option);
+            this.emitUpdate(this.value);
             this.closeDropdown();
         }
     };
@@ -189,7 +189,7 @@ const SdSelectV2 = class {
                 newSelected = [...selected, ...toAdd];
             }
             this.value = this.toMultiValue(newSelected);
-            this.emitUpdate(this.value, newSelected);
+            this.emitUpdate(this.value);
         }
         else {
             const exists = selected.some(s => s.value === option.value);
@@ -197,7 +197,7 @@ const SdSelectV2 = class {
                 ? selected.filter(s => s.value !== option.value)
                 : [...selected, option];
             this.value = this.toMultiValue(newSelected);
-            this.emitUpdate(this.value, newSelected);
+            this.emitUpdate(this.value);
         }
     }
     connectedCallback() {
@@ -213,9 +213,20 @@ const SdSelectV2 = class {
             open: this.isOpen,
             parentRef: this.triggerRef,
             viewportPadding: SdSelectV2.VIEWPORT_PADDING,
-            onSdClose: () => { this.closeDropdown(); },
+            onSdClose: () => {
+                this.closeDropdown();
+            },
         };
-        return (h("sd-field", { key: 'e87b15f9a6698de2ea29104540c8864f3cdb2b3c', name: this.fieldName || this.internalName, label: this.label, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => { this.hovered = true; }, onMouseLeave: () => { this.hovered = false; }, style: { width: /^\d+$/.test(this.width) ? `${this.width}px` : this.width, minWidth: '80px' } }, h("div", { key: '06762f1ec63d1a7a5a52a3fb80bdd22deb2d5447', class: "sd-select-v2", ref: el => { this.triggerRef = el; } }, h("sd-select-v2-trigger", { key: 'ec9a3721ff4f6fb3c762728f7ee339caab3486ab', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, addonLabel: this.addonLabel, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '57c0e77f7f55b98c0df60028aa7fc52bb0575925', ...portalProps }, h("sd-select-v2-listbox", { key: 'acc04cc0ed76920a7bbb95f3b61936cd0b415c61', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
+        return (h("sd-field", { key: '4e3e1aa95a4e566948bf63526763cf0125fc6564', name: this.fieldName || this.internalName, label: this.label, addonLabel: this.addonLabel, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
+                this.hovered = true;
+            }, onMouseLeave: () => {
+                this.hovered = false;
+            }, style: {
+                width: /^\d+$/.test(this.width) ? `${this.width}px` : this.width,
+                minWidth: '80px',
+            } }, h("div", { key: '661fd9580419ef011386750aa1356b4ab1f19fed', class: "sd-select-v2", ref: el => {
+                this.triggerRef = el;
+            } }, h("sd-select-v2-trigger", { key: '5d267da7bc6c0b2cf0031416f541dad3cd1cf861', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: 'd5a8edf2cc94d9271bc4369022ffe3801650dbd4', ...portalProps }, h("sd-select-v2-listbox", { key: 'c1051423145b1a9aaea420635b3ae596d5983011', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
     }
     static get watchers() { return {
         "isOpen": [{

package/dist/esm/system-CS6ohqwt.js

@@ -0,0 +1,18 @@
+const size = {
+	field: {
+		icon: "12"}
+};
+const color = {
+	bg: {
+		accent: {
+			"default": "#0075FF"}},
+	content: {
+		secondary: "#555555",
+		inverse: "#FFFFFF"
+	}};
+var systemTokens = {
+	size: size,
+	color: color
+};
+
+export { systemTokens as s };

package/dist/types/components/sd-confirm-modal/sd-confirm-modal.d.ts

@@ -13,7 +13,7 @@ export declare class SdConfirmModal {
     mainButtonName?: ConfirmModalMainButton;
     mainButtonLabel: string;
     subButtonLabel: string;
-    tagPreset?: TagName;
+    tagPreset: TagName;
     tagLabel: string;
     slotLabel: string;
     tagContents?: HTMLElement;

package/dist/types/components/sd-field/sd-field.d.ts

@@ -11,7 +11,7 @@ export declare class SdField implements ValidatableField {
     focused?: boolean;
     status?: 'default' | 'pass' | 'error';
     label: string;
-    insideLabel: boolean;
+    addonLabel: string;
     icon?: IconProps;
     labelTooltip: string;
     labelTooltipProps: SdTooltipProps | null;

package/dist/types/components/sd-input/sd-input.config.d.ts

@@ -0,0 +1,38 @@
+export type InputSize = 'sm' | 'md';
+export declare const INPUT_SIZE_MAP: Record<InputSize, {
+    height: string;
+    paddingX: string;
+    gap: string;
+    radius: string;
+    fontSize: string;
+    lineHeight: string;
+    fontWeight: string;
+}>;
+export declare const INPUT_COLORS: {
+    border: {
+        default: string;
+        focus: string;
+        danger: string;
+        success: string;
+        disabled: string;
+    };
+    bg: {
+        default: string;
+        disabled: string;
+        barcode: string;
+    };
+    text: {
+        default: string;
+        placeholder: string;
+        disabled: string;
+        hint: string;
+        errorMessage: string;
+    };
+    icon: {
+        default: string;
+    };
+};
+export declare const INPUT_ICON: {
+    frameSize: number;
+    iconSize: number;
+};

package/dist/types/components/sd-input/sd-input.d.ts

@@ -1,16 +1,17 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { Rule } from '../../types/form';
 import { SdTooltipProps } from '../sd-tooltip/sd-tooltip.config';
+import { type InputSize } from './sd-input.config';
 export declare class SdInput {
     host: HTMLElement;
     value?: string | number | null;
     type: 'text' | 'password' | 'email';
-    insideLabel: boolean;
+    size: InputSize;
+    addonLabel: string;
     placeholder: string;
     disabled: boolean;
     clearable: boolean;
-    width?: number | string;
-    barcode?: boolean;
+    width: string;
     rules?: Rule[];
     autoFocus: boolean;
     status?: 'default' | 'pass' | 'error';

package/dist/types/components/sd-number-input/sd-number-input.d.ts

@@ -9,7 +9,7 @@ export declare class SdNumberInput {
     useDecimal: boolean;
     value?: string | number | null;
     label?: string;
-    insideLabel: boolean;
+    addonLabel: string;
     placeholder: string;
     disabled: boolean;
     width?: number | string;

package/dist/types/components/sd-select/sd-select.d.ts

@@ -57,7 +57,7 @@ export declare class SdSelect extends BaseDropdownEvent {
     clearable: boolean;
     searchable: boolean;
     label: string;
-    insideLabel: boolean;
+    addonLabel: string;
     icon?: IconProps;
     labelTooltip: string;
     labelTooltipProps: SdTooltipProps | null;

package/dist/types/components/sd-select-group/sd-select-group.d.ts

@@ -19,7 +19,7 @@ export declare class SdSelectGroup extends BaseDropdownEvent {
     clearable: boolean;
     searchable: boolean;
     label: string;
-    insideLabel: boolean;
+    addonLabel: string;
     icon?: IconProps;
     labelTooltip: string;
     labelTooltipProps: SdTooltipProps | null;

package/dist/types/components/sd-select-v2/sd-select-v2-trigger/sd-select-v2-trigger.d.ts

@@ -4,7 +4,6 @@ export declare class SdSelectV2Trigger {
     placeholder: string;
     disabled: boolean;
     isOpen: boolean;
-    addonLabel: string;
     triggerClick: EventEmitter<void>;
     private handleClick;
     render(): any;

package/dist/types/components/sd-select-v2/sd-select-v2.config.d.ts

@@ -42,14 +42,6 @@ export declare const SELECT_COLORS: {
         default: string;
         disabled: string;
     };
-    addonLabel: {
-        bg: string;
-        paddingX: string;
-        border: {
-            default: string;
-            disabled: string;
-        };
-    };
 };
 export declare const LIST_ITEM_LAYOUT: {
     paddingY: string;

package/dist/types/components/sd-select-v2/sd-select-v2.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import type { SelectV2Option, SelectV2Name, SelectV2Value, SelectV2UpdateDetail } from './sd-select-v2.config';
+import type { SelectV2Option, SelectV2Name, SelectV2Value } from './sd-select-v2.config';
 import type { Rule } from '../../types/form';
 import type { SdTooltipProps } from '../sd-tooltip/sd-tooltip.config';
 export declare class SdSelectV2 {
@@ -31,7 +31,7 @@ export declare class SdSelectV2 {
     private resolvedMaxDropdownWidth;
     private focused;
     private hovered;
-    update: EventEmitter<SelectV2UpdateDetail | SelectV2Value>;
+    update: EventEmitter<SelectV2Value>;
     dropDownShow: EventEmitter<{
         isOpen: boolean;
     }>;