@sellmate/design-system 1.0.75 → 1.0.77

package/dist/cjs/sd-popover.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
-var tooltipArrow = require('./tooltipArrow-DuANjCfc.js');
+var index = require('./index-CaGGRpd8.js');
+var tooltipArrow = require('./tooltipArrow-BEff0q3z.js');
 
 const popover = {
 	bg: "#07284A"};

package/dist/cjs/sd-portal.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 const SdPortal = class {
     constructor(hostRef) {
@@ -227,7 +227,7 @@ const SdPortal = class {
         this.close.emit();
     }
     render() {
-        return index.h("slot", { key: '6fa44238ddbc26c355ddde102d2639db7dd50b94' });
+        return index.h("slot", { key: '28858d6833d8ff7f86295f7e445d51ffc84db99a' });
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/sd-radio-button.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 const radioButton = {
 	xs: {
@@ -110,6 +110,11 @@ const SdRadioButton = class {
     disabled = false;
     name;
     change;
+    componentWillLoad() {
+        this.size ??= 'sm';
+        this.options ??= [];
+        this.disabled ??= false;
+    }
     handleRadioChange = (optionValue, optionDisabled) => {
         if (this.disabled || optionDisabled)
             return;
@@ -170,7 +175,7 @@ const SdRadioButton = class {
             '--sd-radio-button-content-select': RADIO_BUTTON_COLORS.content.select,
             '--sd-radio-button-content-disabled': RADIO_BUTTON_COLORS.content.disabled,
         };
-        return (index.h("div", { key: '67c8e7ad03fb6ee4cabd06591e3e11e5d38914f0', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
+        return (index.h("div", { key: 'fbc0246d9cf615956121295e29bf8c702ee73edc', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
             const isSelected = this.isOptionSelected(option);
             const isDisabled = this.isOptionDisabled(option);
             return (index.h("label", { key: `radio-${option.value}`, class: this.getButtonClasses(option), "aria-label": option.label || 'radio option', "data-label": option.label }, index.h("input", { type: "radio", name: this.groupName, value: option.value.toString(), checked: isSelected, disabled: isDisabled, onInput: () => this.handleRadioChange(option.value, option.disabled) }), option.label && index.h("span", { class: "sd-radio-button__label" }, option.label)));

package/dist/cjs/sd-radio-group.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 const sdRadioGroupCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:var(--sd-radio-dot-size);height:var(--sd-radio-dot-size);border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}`;
 

package/dist/cjs/sd-radio.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 const radio = {
 	size: "16",

package/dist/cjs/{sd-select-v2-list-item_4.cjs.entry.js → sd-select-list-item_4.cjs.entry.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 const select = {
 	paddingX: "12",
@@ -166,9 +166,9 @@ function filterTree(options, keyword) {
     }, []);
 }
 
-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--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:var(--list-item-font-weight-selected);color:var(--list-item-color-selected)}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:0 1 auto;min-width:0;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--group.sd-select-v2-list-item--focused .sd-select-v2-list-item__count{color:#ffffff}sd-select-v2-list-item .sd-select-v2-list-item__checkbox{flex-shrink:0}`;
+const sdSelectListItemCss = () => `sd-select-list-item{display:block}sd-select-list-item .sd-select-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-list-item .sd-select-list-item--selectable{cursor:pointer}sd-select-list-item .sd-select-list-item--depth1-group{border-top:var(--list-item-border-top);font-weight:700}sd-select-list-item .sd-select-list-item--depth2-group{font-weight:500}sd-select-list-item .sd-select-list-item--focused.sd-select-list-item--selectable:not(.sd-select-list-item--disabled){background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-list-item .sd-select-list-item--selected:not(.sd-select-list-item--group){font-weight:var(--list-item-font-weight-selected);color:var(--list-item-color-selected)}sd-select-list-item .sd-select-list-item--selected.sd-select-list-item--focused{color:var(--list-item-color-hover)}sd-select-list-item .sd-select-list-item--disabled{color:var(--list-item-color-disabled);cursor:not-allowed}sd-select-list-item .sd-select-list-item__label{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-list-item .sd-select-list-item__count{flex-shrink:0;font-weight:500;color:var(--list-item-color-disabled)}sd-select-list-item .sd-select-list-item--group.sd-select-list-item--focused .sd-select-list-item__count{color:#ffffff}sd-select-list-item .sd-select-list-item__checkbox{flex-shrink:0}`;
 
-const SdSelectV2ListItem = class {
+const SdSelectListItem = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.listItemClick = index.createEvent(this, "sdListItemClick", 7);
@@ -238,24 +238,24 @@ const SdSelectV2ListItem = class {
         if (isDepth1Group) {
             cssVars['--list-item-border-top'] = `${LIST_ITEM_COLORS.depth1.borderWidth}px solid ${LIST_ITEM_COLORS.depth1.border}`;
         }
-        return (index.h("div", { key: '62974a8d1442730ca752b3fc11f151c4a5be4ad1', class: {
-                'sd-select-v2-list-item': true,
-                'sd-select-v2-list-item--group': isGroup,
-                'sd-select-v2-list-item--depth1-group': isDepth1Group,
-                'sd-select-v2-list-item--depth2-group': isDepth2Group,
-                'sd-select-v2-list-item--selected': this.isSelected === true,
-                'sd-select-v2-list-item--indeterminate': this.isSelected === null,
-                '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 && (index.h("sd-checkbox", { key: 'cf29df3617e45f3b9415b8da1beed7ba5918b8cd', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), index.h("span", { key: '478e566c74c0078ef72b90d836f67156e905bbac', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (index.h("span", { key: '0cde990cb1fff4898581c8c7d321c8669dfac226', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
+        return (index.h("div", { key: 'c6f959e9290213c9003914dbdd696c3c339cce51', class: {
+                'sd-select-list-item': true,
+                'sd-select-list-item--group': isGroup,
+                'sd-select-list-item--depth1-group': isDepth1Group,
+                'sd-select-list-item--depth2-group': isDepth2Group,
+                'sd-select-list-item--selected': this.isSelected === true,
+                'sd-select-list-item--indeterminate': this.isSelected === null,
+                'sd-select-list-item--focused': this.isFocused,
+                'sd-select-list-item--selectable': this.isSelectable && !this.option.disabled,
+                'sd-select-list-item--disabled': !!this.option.disabled,
+            }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (index.h("sd-checkbox", { key: 'a884bd82722cd45efc19abd2139d08596f7eda86', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), index.h("span", { key: '9aacbeca13e591406454ef7e1c7be40a56a2926b', class: "sd-select-list-item__label" }, this.option.label), this.countInfo && (index.h("span", { key: '76be4eda3799cfa329016c2ea636feaf624e5025', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
     }
 };
-SdSelectV2ListItem.style = sdSelectV2ListItemCss();
+SdSelectListItem.style = sdSelectListItemCss();
 
-const sdSelectV2ListItemSearchCss = () => `sd-select-v2-list-item-search{display:block}sd-select-v2-list-item-search .sd-select-v2-list-item-search{padding:4px 8px;position:sticky;top:0;z-index:1;background:white}sd-select-v2-list-item-search .sd-select-v2-list-item-search--scrolled{box-shadow:0 2px 4px rgba(0, 0, 0, 0.08)}sd-select-v2-list-item-search .sd-select-v2-list-item-search__inner{display:flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid #CCCCCC;border-radius:4px;background:white}sd-select-v2-list-item-search .sd-select-v2-list-item-search__inner:focus-within{border-color:#0075FF}sd-select-v2-list-item-search .sd-select-v2-list-item-search__icon{flex-shrink:0}sd-select-v2-list-item-search .sd-select-v2-list-item-search__input{flex:1;border:none;outline:none;font-size:12px;line-height:20px;color:#222222;background:transparent;min-width:0}sd-select-v2-list-item-search .sd-select-v2-list-item-search__input::placeholder{color:#AAAAAA}sd-select-v2-list-item-search .sd-select-v2-list-item-search__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:2px;border:none;background:transparent;cursor:pointer;border-radius:2px}sd-select-v2-list-item-search .sd-select-v2-list-item-search__clear:hover{background:#F0F0F0}sd-select-v2-list-item-search .sd-select-v2-list-item-search__clear--hidden{visibility:hidden;pointer-events:none}`;
+const sdSelectListItemSearchCss = () => `sd-select-list-item-search{display:block}sd-select-list-item-search .sd-select-list-item-search{padding:4px 8px;position:sticky;top:0;z-index:1;background:white}sd-select-list-item-search .sd-select-list-item-search--scrolled{box-shadow:0 2px 4px rgba(0, 0, 0, 0.08)}sd-select-list-item-search .sd-select-list-item-search__inner{display:flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid #CCCCCC;border-radius:4px;background:white}sd-select-list-item-search .sd-select-list-item-search__inner:focus-within{border-color:#0075FF}sd-select-list-item-search .sd-select-list-item-search__icon{flex-shrink:0}sd-select-list-item-search .sd-select-list-item-search__input{flex:1;border:none;outline:none;font-size:12px;line-height:20px;color:#222222;background:transparent;min-width:0}sd-select-list-item-search .sd-select-list-item-search__input::placeholder{color:#AAAAAA}sd-select-list-item-search .sd-select-list-item-search__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:2px;border:none;background:transparent;cursor:pointer;border-radius:2px}sd-select-list-item-search .sd-select-list-item-search__clear:hover{background:#F0F0F0}sd-select-list-item-search .sd-select-list-item-search__clear--hidden{visibility:hidden;pointer-events:none}`;
 
-const SdSelectV2ListItemSearch = class {
+const SdSelectListItemSearch = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.searchFilter = index.createEvent(this, "sdSearchFilter", 7);
@@ -301,22 +301,22 @@ const SdSelectV2ListItemSearch = class {
             clearTimeout(this.debounceTimer);
     }
     render() {
-        return (index.h("div", { key: '75c6b01fbe256bca732553a27711fa7197535688', class: {
-                'sd-select-v2-list-item-search': true,
-                'sd-select-v2-list-item-search--scrolled': this.isScrolled,
-            } }, index.h("div", { key: 'b66cd053b89942f3de55feecdd0eee79b863eb0d', class: "sd-select-v2-list-item-search__inner" }, index.h("sd-icon", { key: 'bed6f00452187d1087b6bb4653c04e8babeaa277', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), index.h("input", { key: '4c29192547fcf9ec2563b7d843b8e77a3eb900b1', ref: el => {
+        return (index.h("div", { key: '139aa74cb44baef15a5a75008dd291f11ad2965b', class: {
+                'sd-select-list-item-search': true,
+                'sd-select-list-item-search--scrolled': this.isScrolled,
+            } }, index.h("div", { key: '2df6559c3a0e769e50e72ef06828adcf595fc433', class: "sd-select-list-item-search__inner" }, index.h("sd-icon", { key: '20dfe4a309c7879bcdd1e5890f183a9e1eb98fae', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), index.h("input", { key: '825724eedf71693ce39a21f413c5a4eb6f1495e3', 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, onFocus: () => this.searchFocus.emit() }), index.h("button", { key: '55f94ce6eb29cec10897259b894c3460d766268e', type: "button", class: {
-                'sd-select-v2-list-item-search__clear': true,
-                'sd-select-v2-list-item-search__clear--hidden': !this.searchText,
-            }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, index.h("sd-icon", { key: 'a7332ec5ecebf522797bb6db1fdc385c0dfa1abe', name: "close", size: 12, color: "#888888" })))));
+            }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), index.h("button", { key: '20fb0c745d423b008f482a2e33e7e711ea40b5df', type: "button", class: {
+                'sd-select-list-item-search__clear': true,
+                'sd-select-list-item-search__clear--hidden': !this.searchText,
+            }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, index.h("sd-icon", { key: 'ce6e4f9b5281ebb767d6542a223e425660ec01c9', name: "close", size: 12, color: "#888888" })))));
     }
 };
-SdSelectV2ListItemSearch.style = sdSelectV2ListItemSearchCss();
+SdSelectListItemSearch.style = sdSelectListItemSearchCss();
 
-const sdSelectV2ListboxCss = () => `:host{display:block}:host .sd-select-v2-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}:host .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}:host .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
+const sdSelectListboxCss = () => `:host{display:block}:host .sd-select-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}:host .sd-select-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}:host .sd-select-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
 
-const SdSelectV2Listbox = class {
+const SdSelectListbox = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.optionSelect = index.createEvent(this, "sdOptionSelect", 7);
@@ -325,6 +325,8 @@ const SdSelectV2Listbox = class {
     options = [];
     value = null;
     emitValue = false;
+    useSearch = false;
+    useSelectAll = false;
     triggerWidth = '200px';
     maxWidth = '640px';
     maxHeight = '260px';
@@ -342,7 +344,40 @@ const SdSelectV2Listbox = class {
     get isMulti() {
         return this.type === 'multi' || this.type === 'multi_depth';
     }
+    static SELECT_ALL_OPTION = {
+        value: '__select_all__',
+        label: '전체',
+    };
+    get showSelectAll() {
+        return this.useSelectAll && this.isMulti;
+    }
+    getAllNonDisabledLeaves() {
+        const collect = (opts) => opts.flatMap(o => {
+            if (o.disabled)
+                return [];
+            if (o.children)
+                return collect(o.children);
+            return [o];
+        });
+        return collect(this.options);
+    }
+    get selectAllState() {
+        if (!this.showSelectAll)
+            return false;
+        const allLeaves = this.getAllNonDisabledLeaves();
+        if (allLeaves.length === 0)
+            return false;
+        const selectedValues = this.getSelectedValues();
+        const selectedCount = allLeaves.filter(l => selectedValues.has(l.value)).length;
+        if (selectedCount === 0)
+            return false;
+        if (selectedCount === allLeaves.length)
+            return true;
+        return null;
+    }
     get showSearch() {
+        if (!this.useSearch)
+            return false;
         const count = this.isDepth ? countLeaves(this.options) : this.options.length;
         return count >= SEARCH_THRESHOLD;
     }
@@ -444,6 +479,9 @@ const SdSelectV2Listbox = class {
     }
     get navigableOptions() {
         const items = [];
+        if (this.showSelectAll) {
+            items.push(SdSelectListbox.SELECT_ALL_OPTION);
+        }
         const walk = (opts) => {
             for (const opt of opts) {
                 const isGroup = !!opt.children;
@@ -457,6 +495,22 @@ const SdSelectV2Listbox = class {
         walk(this.filteredOptions);
         return items;
     }
+    isSelectAllOption(option) {
+        return this.showSelectAll && option.value === SdSelectListbox.SELECT_ALL_OPTION.value;
+    }
+    emitSelectAll() {
+        if (!this.showSelectAll)
+            return;
+        const allLeaves = this.getAllNonDisabledLeaves();
+        this.optionSelect.emit({
+            option: { ...SdSelectListbox.SELECT_ALL_OPTION, children: allLeaves },
+            leaves: allLeaves,
+        });
+    }
+    handleSelectAllClick = (e) => {
+        e.stopPropagation();
+        this.emitSelectAll();
+    };
     isOptionFocused(option) {
         if (this.focusedIndex < 0)
             return false;
@@ -529,7 +583,13 @@ const SdSelectV2Listbox = class {
                 return;
             e.preventDefault();
             e.stopPropagation();
-            this.emitOptionSelect(items[this.focusedIndex]);
+            const focused = items[this.focusedIndex];
+            if (this.isSelectAllOption(focused)) {
+                this.emitSelectAll();
+            }
+            else {
+                this.emitOptionSelect(focused);
+            }
         }
     };
     /**
@@ -550,7 +610,7 @@ const SdSelectV2Listbox = class {
      */
     scrollFocusedIntoView() {
         const list = this.listEl;
-        const focusedEl = list?.querySelector('.sd-select-v2-list-item--focused');
+        const focusedEl = list?.querySelector('.sd-select-list-item--focused');
         if (!list || !focusedEl)
             return;
         const listRect = list.getBoundingClientRect();
@@ -596,7 +656,7 @@ const SdSelectV2Listbox = class {
         return options.map(option => {
             const isGroup = !!option.children;
             return [
-                index.h("sd-select-v2-list-item", { option: option, depth: depth, isSelected: isGroup ? this.getGroupSelectionState(option) : this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, countInfo: this.getCountInfo(option), onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) }),
+                index.h("sd-select-list-item", { option: option, depth: depth, isSelected: isGroup ? this.getGroupSelectionState(option) : this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, countInfo: this.getCountInfo(option), onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) }),
                 isGroup && option.children ? this.renderOptions(option.children, depth + 1) : null,
             ];
         });
@@ -608,9 +668,9 @@ const SdSelectV2Listbox = class {
             '--listbox-max-height': this.maxHeight,
             '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
         };
-        return (index.h("div", { key: 'd4d80ebd565436cd929961a2f9ce50adf92c124b', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (index.h("sd-select-v2-list-item-search", { key: 'bd549975fe6187aa7e77e718c8d2ba4a6d6e33de', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), index.h("div", { key: '4ac6a1512781942fef3e42d6ca32762962df1836', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll, ref: el => {
+        return (index.h("div", { key: 'c1582b1bc6058b78a8581511854f0878e7f39a94', class: "sd-select-listbox", style: cssVars }, this.showSearch && (index.h("sd-select-list-item-search", { key: '4fd2099bf8069f258596479123053a34a41c528d', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), index.h("div", { key: 'ff8643a308b07dbaebf627c7082a37efa6b72a10', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
                 this.listEl = el;
-            } }, this.isEmpty ? (index.h("div", { class: "sd-select-v2-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (index.h("sd-select-v2-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
+            } }, this.showSelectAll && (index.h("sd-select-list-item", { key: '30f0cfbc24304af8c704db33d0e51236971226ee', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (index.h("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (index.h("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
     }
     static get watchers() { return {
         "searchKeyword": [{
@@ -618,11 +678,11 @@ const SdSelectV2Listbox = class {
             }]
     }; }
 };
-SdSelectV2Listbox.style = sdSelectV2ListboxCss();
+SdSelectListbox.style = sdSelectListboxCss();
 
-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 sdSelectTriggerCss = () => `sd-select-trigger{display:block;width:100%;height:100%}sd-select-trigger .sd-select-trigger{display:flex;width:100%;height:100%;cursor:pointer;user-select:none;overflow:hidden;border-radius:3px}sd-select-trigger .sd-select-trigger--disabled{cursor:not-allowed}sd-select-trigger .sd-select-trigger__content{display:flex;align-items:center;gap:var(--trigger-gap);flex:1;padding:0 var(--trigger-padding-x);min-width:0}sd-select-trigger .sd-select-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-trigger .sd-select-trigger__icon{flex-shrink:0;transition:transform 0.2s ease}sd-select-trigger .sd-select-trigger__icon--open{transform:rotate(180deg)}`;
 
-const SdSelectV2Trigger = class {
+const SdSelectTrigger = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.triggerClick = index.createEvent(this, "sdTriggerClick", 7);
@@ -670,21 +730,21 @@ const SdSelectV2Trigger = class {
                 ? SELECT_COLORS.icon.disabled
                 : SELECT_COLORS.icon.default,
         };
-        return (index.h("div", { key: '7c4f60c972c17b5954cbf0d0cc7ee38c8e6c16a3', ref: el => {
+        return (index.h("div", { key: 'dddccfd47738e104a9c715a0c93df1882d28d704', ref: el => {
                 this.triggerEl = el;
             }, tabindex: this.disabled ? -1 : 0, 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, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: 'de5f5a44626fce29c5a83cf0a14dd03352d40b57', class: "sd-select-v2-trigger__content" }, index.h("span", { key: 'a36a013e9ef359160c2b9d24b42ee6f228aca302', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), index.h("sd-icon", { key: '4bfcfce96fbe2008517ee26d7802d4492292faa5', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
-                'sd-select-v2-trigger__icon': true,
-                'sd-select-v2-trigger__icon--open': this.isOpen,
+                'sd-select-trigger': true,
+                'sd-select-trigger--open': this.isOpen,
+                'sd-select-trigger--disabled': this.disabled,
+            }, style: cssVars, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: '9f8572c4ec3fa02c9f94bb94a8a10358c4d6b3ae', class: "sd-select-trigger__content" }, index.h("span", { key: 'a4b5b27fc3a84adbd2e24981742ca45402993afb', class: "sd-select-trigger__text" }, hasValue ? this.displayText : this.placeholder), index.h("sd-icon", { key: '97bbcda656bae2248ca83fb2bd56373b2dd8dd41', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
+                'sd-select-trigger__icon': true,
+                'sd-select-trigger__icon--open': this.isOpen,
             } }))));
     }
 };
-SdSelectV2Trigger.style = sdSelectV2TriggerCss();
+SdSelectTrigger.style = sdSelectTriggerCss();
 
-exports.sd_select_v2_list_item = SdSelectV2ListItem;
-exports.sd_select_v2_list_item_search = SdSelectV2ListItemSearch;
-exports.sd_select_v2_listbox = SdSelectV2Listbox;
-exports.sd_select_v2_trigger = SdSelectV2Trigger;
+exports.sd_select_list_item = SdSelectListItem;
+exports.sd_select_list_item_search = SdSelectListItemSearch;
+exports.sd_select_listbox = SdSelectListbox;
+exports.sd_select_trigger = SdSelectTrigger;

package/dist/cjs/sd-switch.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Dptupbm0.js');
+var index = require('./index-CaGGRpd8.js');
 
 var switchTokens = {
 	"switch": {
@@ -102,7 +102,7 @@ const SdSwitch = class {
             '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
             '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
         };
-        return (index.h("label", { key: 'ac6a35d06ddd04bc94369014ff586766dd745bbb', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, index.h("input", { key: '9ebc810e93c9dfa3bf7407f279dadbada579196e', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), index.h("div", { key: '7add76be99645d6434e95305f6318fac7da0de57', class: "sd-switch__track" }, index.h("div", { key: 'ed90778aa4dcd6f0853029579c36cfdb8640afcf', class: "sd-switch__knob" })), this.label && index.h("span", { key: '70e3ddf819e77da4c693a4853ddb7f392381964e', class: "sd-switch__label" }, this.label)));
+        return (index.h("label", { key: '54ebe92b29a80537e2e4380ffe096a252f883d10', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, index.h("input", { key: 'd18abbbf293434f07ae7dfa18b983b47cac1b774', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), index.h("div", { key: '76fef910e632b541c0b33c508e6001529df5614f', class: "sd-switch__track" }, index.h("div", { key: 'a66f4ecca5787f00febe19216a93ec62916e0541', class: "sd-switch__knob" })), this.label && index.h("span", { key: '948d2b7afc6e171ee329752cb85f8e361f6bbed8', class: "sd-switch__label" }, this.label)));
     }
 };
 SdSwitch.style = sdSwitchCss();