@sellmate/design-system 1.21.0 → 1.22.0

package/dist/esm/loader.js

@@ -4,7 +4,7 @@ export { s as setNonce } from './index-C7HJ-NfO.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy(JSON.parse("[[\"sd-button_2\",[[512,\"sd-button\",{\"name\":[1],\"label\":[1],\"icon\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1]}],[512,\"sd-icon\",{\"name\":[1],\"size\":[8],\"color\":[1],\"rotate\":[2],\"label\":[1],\"iconStyle\":[16]}]]],[\"sd-key-value-table\",[[772,\"sd-key-value-table\",{\"fields\":[16],\"search\":[4],\"radius\":[1]}]]],[\"sd-table\",[[769,\"sd-table\",{\"tableId\":[513,\"table-id\"],\"columns\":[16],\"rows\":[16],\"selected\":[1040],\"rowKey\":[1,\"row-key\"],\"selectable\":[4],\"resizable\":[4],\"width\":[1],\"height\":[1],\"stickyHeader\":[4,\"sticky-header\"],\"stickyColumn\":[16],\"radius\":[1],\"noDataLabel\":[1,\"no-data-label\"],\"isLoading\":[4,\"is-loading\"],\"pagination\":[16],\"useInternalPagination\":[4,\"use-internal-pagination\"],\"useRowsPerPageSelect\":[4,\"use-rows-per-page-select\"],\"dense\":[4],\"useVirtualScroll\":[4,\"use-virtual-scroll\"],\"rowHeight\":[2,\"row-height\"],\"virtualBuffer\":[2,\"virtual-buffer\"],\"virtualEndThreshold\":[2,\"virtual-end-threshold\"],\"rowsPerPageOption\":[16],\"resolvedNoDataLabel\":[32],\"currentPage\":[32],\"innerRowsPerPage\":[32],\"innerSelected\":[32],\"columnWidths\":[32],\"scrolledLeft\":[32],\"scrolledRight\":[32],\"rowCount\":[32],\"loadingScrollTop\":[32],\"noDataBodyHeight\":[32],\"autoThead\":[32],\"autoTbody\":[32],\"isRowSelected\":[64],\"updateRowSelect\":[64],\"toggleSelectAll\":[64],\"getIsAllChecked\":[64],\"getStickyStyle\":[64],\"setRowCount\":[64],\"getPaginationInfo\":[64]},null,{\"isLoading\":[{\"handleIsLoadingChange\":0}],\"useVirtualScroll\":[{\"handleUseVirtualScrollChange\":0}],\"columns\":[{\"handleColumnsChange\":0}],\"rows\":[{\"handleRowsChange\":0}],\"rowKey\":[{\"handleRowKeyChange\":0}],\"tableId\":[{\"handleTableIdChange\":0}],\"noDataLabel\":[{\"handleNoDataLabelChange\":0}],\"selectable\":[{\"handleConfigChange\":0}],\"resizable\":[{\"handleConfigChange\":0}],\"stickyColumn\":[{\"handleConfigChange\":0}],\"stickyHeader\":[{\"handleConfigChange\":0}],\"dense\":[{\"handleConfigChange\":0}],\"selected\":[{\"handleSelectedChange\":0}],\"pagination\":[{\"handlePaginationChange\":0}]}]]],[\"sd-chip-input\",[[512,\"sd-chip-input\",{\"values\":[1040],\"errors\":[1040],\"disabledChips\":[1040],\"size\":[1],\"disabled\":[4],\"placeholder\":[1],\"name\":[1],\"rules\":[16],\"error\":[1028],\"useReset\":[4,\"use-reset\"],\"maxCount\":[2,\"max-count\"],\"duplicateLabel\":[1,\"duplicate-label\"],\"suggestions\":[1040],\"loadingSuggestions\":[4,\"loading-suggestions\"],\"recommendedItems\":[1040],\"loadingRecommendedItems\":[4,\"loading-recommended-items\"],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"status\":[1],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"internalValues\":[32],\"internalErrors\":[32],\"focused\":[32],\"hovered\":[32],\"inputValue\":[32],\"activeSuggestionIndex\":[32],\"suppressSuggestions\":[32],\"suppressRecommendations\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"values\":[{\"valuesChanged\":0}],\"errors\":[{\"errorsChanged\":0}],\"internalValues\":[{\"internalValuesChanged_validate\":0}],\"suggestions\":[{\"suggestionsChanged\":0}],\"recommendedItems\":[{\"recommendedItemsChanged\":0}]}]]],[\"sd-barcode-input\",[[772,\"sd-barcode-input\",{\"value\":[1032],\"size\":[1],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"clearable\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"inputStyle\":[16],\"name\":[1],\"internalValue\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}]]],[\"sd-modal-container\",[[512,\"sd-modal-container\",{\"autoRemove\":[4,\"auto-remove\"],\"entries\":[32],\"open\":[64],\"openLoading\":[64],\"createCustom\":[64],\"dismissById\":[64],\"update\":[64]}]]],[\"sd-popover\",[[512,\"sd-popover\",{\"show\":[1028],\"placement\":[513],\"color\":[513],\"icon\":[513],\"iconSize\":[514,\"icon-size\"],\"label\":[1],\"name\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1],\"menuTitle\":[1,\"menu-title\"],\"leftLink\":[16],\"button\":[16],\"menuClass\":[1,\"menu-class\"],\"slotContentHTML\":[32]}]]],[\"sd-toast-container\",[[512,\"sd-toast-container\",{\"position\":[1],\"maxVisible\":[2,\"max-visible\"],\"defaultDuration\":[2,\"default-duration\"],\"zIndex\":[2,\"z-index\"],\"toasts\":[32],\"expanded\":[32],\"create\":[64],\"dismiss\":[64],\"dismissAll\":[64]}]]],[\"sd-action-modal\",[[772,\"sd-action-modal\",{\"modalTitle\":[1,\"modal-title\"],\"buttonProps\":[16],\"width\":[8],\"height\":[8]}]]],[\"sd-guide\",[[512,\"sd-guide\",{\"type\":[513],\"label\":[513],\"message\":[1],\"url\":[1],\"popupTitle\":[1,\"popup-title\"],\"popupWidth\":[2,\"popup-width\"],\"popupShow\":[32]}]]],[\"sd-dropdown-button\",[[512,\"sd-dropdown-button\",{\"name\":[1],\"label\":[1],\"items\":[16],\"disabled\":[4],\"split\":[4],\"isOpen\":[32],\"isAnimatingOut\":[32],\"itemIndex\":[32],\"sdOpen\":[64],\"sdClose\":[64]},null,{\"isOpen\":[{\"handleOpenChange\":0}]}]]],[\"sd-popup\",[[772,\"sd-popup\",{\"popupTitle\":[1,\"popup-title\"],\"type\":[1],\"useFooter\":[4,\"use-footer\"],\"submitButtonProps\":[16]}]]],[\"sd-tabs\",[[512,\"sd-tabs\",{\"value\":[1537],\"tabs\":[1040],\"size\":[513],\"isSub\":[516,\"is-sub\"],\"vertical\":[516]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-callout\",[[512,\"sd-callout\",{\"type\":[513],\"message\":[16]}]]],[\"sd-loading-container\",[[512,\"sd-loading-container\",{\"visible\":[32],\"message\":[32],\"show\":[64],\"hide\":[64]}]]],[\"sd-badge\",[[512,\"sd-badge\",{\"color\":[1]}]]],[\"sd-card\",[[772,\"sd-card\",{\"bordered\":[4],\"sdClass\":[1,\"sd-class\"]}]]],[\"sd-date-box\",[[514,\"sd-date-box\",{\"date\":[8],\"disabled\":[4],\"selected\":[4],\"isStartDate\":[4,\"is-start-date\"],\"isEndDate\":[4,\"is-end-date\"],\"isToday\":[4,\"is-today\"],\"inRange\":[4,\"in-range\"],\"type\":[1]}]]],[\"sd-divider\",[[512,\"sd-divider\",{\"vertical\":[516]}]]],[\"sd-form\",[[772,\"sd-form\",{\"formClass\":[1,\"form-class\"],\"sdRegisterField\":[64],\"sdUnregisterField\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidation\":[64]}]]],[\"sd-linear-progress\",[[512,\"sd-linear-progress\",{\"indeterminate\":[516],\"value\":[2],\"type\":[513],\"label\":[1]}]]],[\"sd-radio-button\",[[512,\"sd-radio-button\",{\"value\":[1032],\"options\":[1040],\"size\":[1],\"disabled\":[4],\"name\":[1]}]]],[\"sd-switch\",[[512,\"sd-switch\",{\"value\":[1028],\"label\":[1],\"disabled\":[4]}]]],[\"sd-td\",[[772,\"sd-td\",{\"field\":[1],\"rowKey\":[1,\"row-key\"],\"align\":[1],\"rowspan\":[2],\"colspan\":[2],\"sdClass\":[1,\"sd-class\"],\"dividerLeft\":[4,\"divider-left\"],\"dividerRight\":[4,\"divider-right\"],\"useFrame\":[4,\"use-frame\"]},null,{\"field\":[{\"handleFieldChange\":0}],\"rowKey\":[{\"handleRowKeyChange\":0}],\"rowspan\":[{\"handleSpanChange\":0}],\"colspan\":[{\"handleSpanChange\":0}],\"sdClass\":[{\"handleSdClassChange\":0}],\"dividerLeft\":[{\"handleDividerChange\":0}],\"dividerRight\":[{\"handleDividerChange\":0}],\"useFrame\":[{\"handleUseFrameChange\":0}]}]]],[\"sd-toggle\",[[512,\"sd-toggle\",{\"value\":[1540],\"label\":[1],\"disabled\":[4]}]]],[\"sd-toast\",[[512,\"sd-toast\",{\"icon\":[1],\"message\":[1],\"link\":[1],\"linkLabel\":[1,\"link-label\"],\"buttonLabel\":[1,\"button-label\"],\"useClose\":[4,\"use-close\"],\"type\":[1]}]]],[\"sd-circle-progress\",[[512,\"sd-circle-progress\",{\"indeterminate\":[516],\"value\":[2],\"type\":[513],\"label\":[1]}]]],[\"sd-confirm-modal_2\",[[772,\"sd-confirm-modal\",{\"type\":[1],\"modalTitle\":[1,\"modal-title\"],\"titleClass\":[1,\"title-class\"],\"topMessage\":[16],\"bottomMessage\":[16],\"mainButtonName\":[1,\"main-button-name\"],\"mainButtonLabel\":[1,\"main-button-label\"],\"subButtonLabel\":[1,\"sub-button-label\"],\"tagPreset\":[1,\"tag-preset\"],\"tagLabel\":[1,\"tag-label\"],\"slotLabel\":[1,\"slot-label\"],\"tagContents\":[16],\"hasSlottedContent\":[32]}],[512,\"sd-loading-modal\",{\"state\":[513],\"message\":[1],\"useButton\":[516,\"use-button\"],\"buttonLabel\":[1,\"button-label\"],\"width\":[8],\"height\":[8],\"progress\":[2]}]]],[\"sd-date-range-picker-calendar\",[[512,\"sd-date-range-picker-calendar\",{\"value\":[16],\"selectable\":[16],\"maxRange\":[2,\"max-range\"],\"currentYear\":[32],\"currentMonth\":[32],\"pendingStart\":[32],\"hoverDate\":[32],\"displayValue\":[32]},null,{\"value\":[{\"handleValueChange\":0}]}]]],[\"sd-text-link\",[[512,\"sd-text-link\",{\"label\":[1],\"icon\":[1],\"iconColor\":[1,\"icon-color\"],\"labelClass\":[1,\"label-class\"],\"rightArrow\":[1,\"right-arrow\"],\"underline\":[516],\"disabled\":[516],\"size\":[513]}]]],[\"sd-radio\",[[512,\"sd-radio\",{\"value\":[1032],\"val\":[8],\"disabled\":[4],\"label\":[1]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-ghost-button_3\",[[512,\"sd-ghost-button\",{\"icon\":[1],\"size\":[1],\"intent\":[1],\"ariaLabel\":[1,\"aria-label\"],\"tooltipText\":[1,\"tooltip-text\"],\"disabled\":[4],\"isTooltipOpen\":[32]}],[512,\"sd-tag\",{\"name\":[1],\"label\":[1],\"icon\":[1],\"isLeft\":[4,\"is-left\"]}],[772,\"sd-portal\",{\"to\":[1],\"parentRef\":[16],\"offset\":[16],\"viewportPadding\":[2,\"viewport-padding\"],\"zIndex\":[2,\"z-index\"],\"open\":[4],\"placement\":[1]},[[9,\"scroll\",\"updatePosition\"],[9,\"resize\",\"updatePosition\"],[9,\"mousedown\",\"handleMouseDown\"],[8,\"click\",\"handleWindowClick\"]],{\"open\":[{\"handleOpenChange\":0}]}]]],[\"sd-chip\",[[512,\"sd-chip\",{\"name\":[1],\"value\":[1025],\"error\":[1028],\"disabled\":[4],\"editable\":[4],\"placeholder\":[1],\"rules\":[16],\"internalValue\":[32],\"isEditing\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdResetValidation\":[64],\"sdFocus\":[64],\"sdGetNativeElement\":[64]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-field_3\",[[772,\"sd-field\",{\"name\":[1],\"rules\":[16],\"error\":[1028],\"disabled\":[1028],\"readonly\":[1028],\"hovered\":[1028],\"focused\":[1028],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"size\":[513],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"errorMsg\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidation\":[64],\"sdFocus\":[64]}],[772,\"sd-tooltip\",{\"trigger\":[1],\"placement\":[1],\"color\":[1],\"tooltipType\":[1,\"tooltip-type\"],\"icon\":[1],\"iconSize\":[2,\"icon-size\"],\"label\":[1],\"name\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1],\"useClose\":[4,\"use-close\"],\"sdClass\":[1,\"sd-class\"],\"message\":[16],\"triggerClass\":[1,\"trigger-class\"],\"triggerStyle\":[1,\"trigger-style\"],\"showTooltip\":[32],\"slotContentHTML\":[32],\"show\":[64],\"hide\":[64]}],[772,\"sd-floating-portal\",{\"to\":[1],\"parentRef\":[16],\"offset\":[16],\"zIndex\":[2,\"z-index\"],\"placement\":[1],\"open\":[4]},[[9,\"resize\",\"updatePosition\"],[9,\"mousedown\",\"handleMouseDown\"],[8,\"click\",\"handleWindowClick\"],[8,\"keydown\",\"handleKeydown\"]]]]],[\"sd-pagination_4\",[[512,\"sd-thead\",{\"columns\":[16],\"selectable\":[4],\"resizable\":[4],\"stickyColumn\":[16],\"stickyHeader\":[4,\"sticky-header\"],\"scrolledLeft\":[4,\"scrolled-left\"],\"scrolledRight\":[4,\"scrolled-right\"],\"rows\":[16],\"columnWidths\":[1040],\"tableId\":[32],\"_columns\":[32],\"_selectable\":[32],\"_resizable\":[32],\"_stickyColumn\":[32],\"_stickyHeader\":[32],\"_scrolledLeft\":[32],\"_scrolledRight\":[32],\"refreshConfig\":[64],\"setColumnWidths\":[64],\"refreshSelection\":[64]},null,{\"columns\":[{\"handleColumnsChange\":0}]}],[772,\"sd-tr\",{\"columns\":[16],\"selectable\":[4],\"stickyColumn\":[16],\"rowKey\":[1,\"row-key\"],\"row\":[16],\"separator\":[8],\"tableId\":[32],\"columnWidths\":[32],\"isVisible\":[32],\"spansVersion\":[32],\"_columns\":[32],\"_selectable\":[32],\"_stickyColumn\":[32],\"_scrolledLeft\":[32],\"_scrolledRight\":[32],\"_dense\":[32],\"refreshConfig\":[64],\"bumpSpansVersion\":[64],\"updateVisibility\":[64],\"setColumnWidths\":[64],\"refreshSelection\":[64]}],[512,\"sd-pagination\",{\"currentPage\":[1026,\"current-page\"],\"lastPage\":[2,\"last-page\"],\"simple\":[4]}],[769,\"sd-tbody\",{\"rows\":[16],\"tableId\":[32],\"topSpacerHeight\":[32],\"bottomSpacerHeight\":[32]},null,{\"rows\":[{\"handleRowsChange\":0}]}]]],[\"sd-calendar_2\",[[512,\"sd-calendar\",{\"value\":[1025],\"selectable\":[16],\"events\":[16],\"elevated\":[4],\"currentYear\":[32],\"currentMonth\":[32]},null,{\"value\":[{\"handleValueChange\":0}]}],[512,\"sd-date-picker-trigger\",{\"displayText\":[1,\"display-text\"],\"placeholder\":[1],\"disabled\":[4],\"size\":[1]}]]],[\"sd-date-picker_7\",[[512,\"sd-date-picker\",{\"value\":[1025],\"size\":[513],\"placeholder\":[513],\"selectable\":[16],\"disabled\":[516],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"error\":[1028],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"focused\":[32],\"hovered\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[512,\"sd-date-range-picker\",{\"value\":[1040],\"size\":[513],\"placeholder\":[513],\"selectable\":[16],\"maxRange\":[2,\"max-range\"],\"disabled\":[516],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"error\":[1028],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"focused\":[32],\"hovered\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[512,\"sd-file-picker\",{\"value\":[1040],\"placeholder\":[513],\"disabled\":[516],\"inline\":[516],\"multiple\":[516],\"accept\":[1],\"maxFileSize\":[8,\"max-file-size\"],\"maxTotalSize\":[8,\"max-total-size\"],\"maxFiles\":[8,\"max-files\"],\"name\":[1],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"rules\":[16],\"error\":[1028],\"status\":[1],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"focused\":[1028],\"hovered\":[1028],\"internalValue\":[32],\"showTooltip\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"value\":[{\"valueChanged\":0}]}],[772,\"sd-input\",{\"value\":[1032],\"type\":[1],\"size\":[1],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"clearable\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"autocomplete\":[1],\"maxlength\":[2],\"minlength\":[2],\"inputmode\":[1],\"enterkeyhint\":[1],\"spellcheck\":[4],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"inputStyle\":[16],\"name\":[1],\"internalValue\":[32],\"passwordVisible\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-number-input\",{\"size\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"useButton\":[4,\"use-button\"],\"useDecimal\":[4,\"use-decimal\"],\"value\":[1032],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputPrefix\":[1,\"input-prefix\"],\"inputSuffix\":[1,\"input-suffix\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"inputStyle\":[16],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"name\":[1],\"internalValue\":[32],\"displayValue\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64],\"sdGetNativeElement\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-textarea\",{\"value\":[1025],\"placeholder\":[1],\"disabled\":[4],\"readonly\":[4],\"autoFocus\":[4,\"auto-focus\"],\"textareaClass\":[1,\"textarea-class\"],\"textareaStyle\":[16],\"maxLength\":[2,\"max-length\"],\"rows\":[2],\"spellcheck\":[4],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"rules\":[16],\"error\":[1028],\"status\":[1],\"focused\":[1028],\"hovered\":[1028],\"name\":[1],\"internalValue\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-radio-group\",{\"value\":[1032],\"options\":[1040],\"direction\":[1],\"disabled\":[4],\"groupName\":[1,\"group-name\"]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-checkbox\",[[512,\"sd-checkbox\",{\"value\":[1028],\"val\":[8],\"disabled\":[516],\"inverse\":[516],\"label\":[1],\"isChecked\":[32]},null,{\"value\":[{\"watchValueHandler\":0}]}]]],[\"sd-select-list-item_2\",[[512,\"sd-select-list-item\",{\"option\":[16],\"depth\":[2],\"isSelected\":[4,\"is-selected\"],\"isFocused\":[4,\"is-focused\"],\"useCheckbox\":[4,\"use-checkbox\"],\"countInfo\":[16]}],[512,\"sd-select-list-item-search\",{\"isScrolled\":[4,\"is-scrolled\"],\"searchText\":[32],\"sdFocus\":[64]}]]],[\"sd-select_3\",[[512,\"sd-select\",{\"type\":[1],\"value\":[1032],\"options\":[16],\"placeholder\":[1],\"dropdownWidth\":[1,\"dropdown-width\"],\"maxDropdownWidth\":[1,\"max-dropdown-width\"],\"dropdownHeight\":[1,\"dropdown-height\"],\"disabled\":[4],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"error\":[1028],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"emitValue\":[4,\"emit-value\"],\"width\":[8],\"useSearch\":[4,\"use-search\"],\"allSelectedLabel\":[1,\"all-selected-label\"],\"useSelectAll\":[4,\"use-select-all\"],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"triggerWidth\":[32],\"resolvedDropdownHeight\":[32],\"resolvedMaxDropdownWidth\":[32],\"focused\":[32],\"hovered\":[32],\"sdFocus\":[64],\"sdOpen\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[513,\"sd-select-listbox\",{\"type\":[1],\"options\":[16],\"value\":[8],\"emitValue\":[4,\"emit-value\"],\"useSearch\":[4,\"use-search\"],\"useSelectAll\":[4,\"use-select-all\"],\"triggerWidth\":[1,\"trigger-width\"],\"maxWidth\":[1,\"max-width\"],\"maxHeight\":[1,\"max-height\"],\"searchKeyword\":[32],\"isScrolled\":[32],\"focusedIndex\":[32]},null,{\"searchKeyword\":[{\"resetFocusOnFilter\":0}]}],[512,\"sd-select-trigger\",{\"displayText\":[1,\"display-text\"],\"placeholder\":[1],\"disabled\":[4],\"isOpen\":[4,\"is-open\"],\"sdFocus\":[64]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"sd-button_2\",[[512,\"sd-button\",{\"name\":[1],\"label\":[1],\"icon\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1]}],[512,\"sd-icon\",{\"name\":[1],\"size\":[8],\"color\":[1],\"rotate\":[2],\"label\":[1],\"iconStyle\":[16]}]]],[\"sd-key-value-table\",[[772,\"sd-key-value-table\",{\"fields\":[16],\"search\":[4],\"radius\":[1]}]]],[\"sd-table\",[[769,\"sd-table\",{\"tableId\":[513,\"table-id\"],\"columns\":[16],\"rows\":[16],\"selected\":[1040],\"rowKey\":[1,\"row-key\"],\"selectable\":[4],\"resizable\":[4],\"width\":[1],\"height\":[1],\"stickyHeader\":[4,\"sticky-header\"],\"stickyColumn\":[16],\"radius\":[1],\"noDataLabel\":[1,\"no-data-label\"],\"isLoading\":[4,\"is-loading\"],\"pagination\":[16],\"useInternalPagination\":[4,\"use-internal-pagination\"],\"useRowsPerPageSelect\":[4,\"use-rows-per-page-select\"],\"dense\":[4],\"useVirtualScroll\":[4,\"use-virtual-scroll\"],\"rowHeight\":[2,\"row-height\"],\"virtualBuffer\":[2,\"virtual-buffer\"],\"virtualEndThreshold\":[2,\"virtual-end-threshold\"],\"rowsPerPageOption\":[16],\"resolvedNoDataLabel\":[32],\"currentPage\":[32],\"innerRowsPerPage\":[32],\"innerSelected\":[32],\"columnWidths\":[32],\"scrolledLeft\":[32],\"scrolledRight\":[32],\"rowCount\":[32],\"loadingScrollTop\":[32],\"noDataBodyHeight\":[32],\"autoThead\":[32],\"autoTbody\":[32],\"isRowSelected\":[64],\"updateRowSelect\":[64],\"toggleSelectAll\":[64],\"getIsAllChecked\":[64],\"getStickyStyle\":[64],\"setRowCount\":[64],\"getPaginationInfo\":[64]},null,{\"isLoading\":[{\"handleIsLoadingChange\":0}],\"useVirtualScroll\":[{\"handleUseVirtualScrollChange\":0}],\"columns\":[{\"handleColumnsChange\":0}],\"rows\":[{\"handleRowsChange\":0}],\"rowKey\":[{\"handleRowKeyChange\":0}],\"tableId\":[{\"handleTableIdChange\":0}],\"noDataLabel\":[{\"handleNoDataLabelChange\":0}],\"selectable\":[{\"handleConfigChange\":0}],\"resizable\":[{\"handleConfigChange\":0}],\"stickyColumn\":[{\"handleConfigChange\":0}],\"stickyHeader\":[{\"handleConfigChange\":0}],\"dense\":[{\"handleConfigChange\":0}],\"selected\":[{\"handleSelectedChange\":0}],\"pagination\":[{\"handlePaginationChange\":0}]}]]],[\"sd-chip-input\",[[512,\"sd-chip-input\",{\"values\":[1040],\"errors\":[1040],\"disabledChips\":[1040],\"size\":[1],\"disabled\":[4],\"placeholder\":[1],\"name\":[1],\"rules\":[16],\"error\":[1028],\"useReset\":[4,\"use-reset\"],\"maxCount\":[2,\"max-count\"],\"duplicateLabel\":[1,\"duplicate-label\"],\"suggestions\":[1040],\"loadingSuggestions\":[4,\"loading-suggestions\"],\"recommendedItems\":[1040],\"loadingRecommendedItems\":[4,\"loading-recommended-items\"],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"status\":[1],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"internalValues\":[32],\"internalErrors\":[32],\"focused\":[32],\"hovered\":[32],\"inputValue\":[32],\"activeSuggestionIndex\":[32],\"suppressSuggestions\":[32],\"suppressRecommendations\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"values\":[{\"valuesChanged\":0}],\"errors\":[{\"errorsChanged\":0}],\"internalValues\":[{\"internalValuesChanged_validate\":0}],\"suggestions\":[{\"suggestionsChanged\":0}],\"recommendedItems\":[{\"recommendedItemsChanged\":0}]}]]],[\"sd-barcode-input\",[[772,\"sd-barcode-input\",{\"value\":[1032],\"size\":[1],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"clearable\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"inputStyle\":[16],\"name\":[1],\"internalValue\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}]]],[\"sd-modal-container\",[[512,\"sd-modal-container\",{\"autoRemove\":[4,\"auto-remove\"],\"entries\":[32],\"open\":[64],\"openLoading\":[64],\"createCustom\":[64],\"dismissById\":[64],\"update\":[64]}]]],[\"sd-popover\",[[512,\"sd-popover\",{\"show\":[1028],\"placement\":[513],\"color\":[513],\"icon\":[513],\"iconSize\":[514,\"icon-size\"],\"label\":[1],\"name\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1],\"menuTitle\":[1,\"menu-title\"],\"leftLink\":[16],\"button\":[16],\"menuClass\":[1,\"menu-class\"],\"slotContentHTML\":[32]}]]],[\"sd-toast-container\",[[512,\"sd-toast-container\",{\"position\":[1],\"maxVisible\":[2,\"max-visible\"],\"defaultDuration\":[2,\"default-duration\"],\"zIndex\":[2,\"z-index\"],\"toasts\":[32],\"expanded\":[32],\"create\":[64],\"dismiss\":[64],\"dismissAll\":[64]}]]],[\"sd-action-modal\",[[772,\"sd-action-modal\",{\"modalTitle\":[1,\"modal-title\"],\"buttonProps\":[16],\"width\":[8],\"height\":[8]}]]],[\"sd-guide\",[[512,\"sd-guide\",{\"type\":[513],\"label\":[513],\"message\":[1],\"url\":[1],\"popupTitle\":[1,\"popup-title\"],\"popupWidth\":[2,\"popup-width\"],\"popupShow\":[32]}]]],[\"sd-dropdown-button\",[[512,\"sd-dropdown-button\",{\"name\":[1],\"label\":[1],\"items\":[16],\"disabled\":[4],\"split\":[4],\"isOpen\":[32],\"isAnimatingOut\":[32],\"itemIndex\":[32],\"sdOpen\":[64],\"sdClose\":[64]},null,{\"isOpen\":[{\"handleOpenChange\":0}]}]]],[\"sd-popup\",[[772,\"sd-popup\",{\"popupTitle\":[1,\"popup-title\"],\"type\":[1],\"useFooter\":[4,\"use-footer\"],\"submitButtonProps\":[16]}]]],[\"sd-tabs\",[[512,\"sd-tabs\",{\"value\":[1537],\"tabs\":[1040],\"size\":[513],\"isSub\":[516,\"is-sub\"],\"vertical\":[516]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-callout\",[[512,\"sd-callout\",{\"type\":[513],\"message\":[16]}]]],[\"sd-loading-container\",[[512,\"sd-loading-container\",{\"visible\":[32],\"message\":[32],\"show\":[64],\"hide\":[64]}]]],[\"sd-badge\",[[512,\"sd-badge\",{\"color\":[1]}]]],[\"sd-card\",[[772,\"sd-card\",{\"bordered\":[4],\"sdClass\":[1,\"sd-class\"]}]]],[\"sd-date-box\",[[514,\"sd-date-box\",{\"date\":[8],\"disabled\":[4],\"selected\":[4],\"isStartDate\":[4,\"is-start-date\"],\"isEndDate\":[4,\"is-end-date\"],\"isToday\":[4,\"is-today\"],\"inRange\":[4,\"in-range\"],\"type\":[1]}]]],[\"sd-divider\",[[512,\"sd-divider\",{\"vertical\":[516]}]]],[\"sd-form\",[[772,\"sd-form\",{\"formClass\":[1,\"form-class\"],\"sdRegisterField\":[64],\"sdUnregisterField\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidation\":[64]}]]],[\"sd-linear-progress\",[[512,\"sd-linear-progress\",{\"indeterminate\":[516],\"value\":[2],\"type\":[513],\"label\":[1]}]]],[\"sd-radio-button\",[[512,\"sd-radio-button\",{\"value\":[1032],\"options\":[1040],\"size\":[1],\"disabled\":[4],\"name\":[1]}]]],[\"sd-switch\",[[512,\"sd-switch\",{\"value\":[1028],\"label\":[1],\"disabled\":[4]}]]],[\"sd-td\",[[772,\"sd-td\",{\"field\":[1],\"rowKey\":[1,\"row-key\"],\"align\":[1],\"rowspan\":[2],\"colspan\":[2],\"sdClass\":[1,\"sd-class\"],\"dividerLeft\":[4,\"divider-left\"],\"dividerRight\":[4,\"divider-right\"],\"useFrame\":[4,\"use-frame\"]},null,{\"field\":[{\"handleFieldChange\":0}],\"rowKey\":[{\"handleRowKeyChange\":0}],\"rowspan\":[{\"handleSpanChange\":0}],\"colspan\":[{\"handleSpanChange\":0}],\"sdClass\":[{\"handleSdClassChange\":0}],\"dividerLeft\":[{\"handleDividerChange\":0}],\"dividerRight\":[{\"handleDividerChange\":0}],\"useFrame\":[{\"handleUseFrameChange\":0}]}]]],[\"sd-toggle\",[[512,\"sd-toggle\",{\"value\":[1540],\"label\":[1],\"disabled\":[4]}]]],[\"sd-toast\",[[512,\"sd-toast\",{\"icon\":[1],\"message\":[1],\"link\":[1],\"linkLabel\":[1,\"link-label\"],\"buttonLabel\":[1,\"button-label\"],\"useClose\":[4,\"use-close\"],\"type\":[1]}]]],[\"sd-circle-progress\",[[512,\"sd-circle-progress\",{\"indeterminate\":[516],\"value\":[2],\"type\":[513],\"label\":[1]}]]],[\"sd-confirm-modal_2\",[[772,\"sd-confirm-modal\",{\"type\":[1],\"modalTitle\":[1,\"modal-title\"],\"titleClass\":[1,\"title-class\"],\"topMessage\":[16],\"bottomMessage\":[16],\"mainButtonName\":[1,\"main-button-name\"],\"mainButtonLabel\":[1,\"main-button-label\"],\"subButtonLabel\":[1,\"sub-button-label\"],\"tagPreset\":[1,\"tag-preset\"],\"tagLabel\":[1,\"tag-label\"],\"slotLabel\":[1,\"slot-label\"],\"tagContents\":[16],\"hasSlottedContent\":[32]}],[512,\"sd-loading-modal\",{\"state\":[513],\"message\":[1],\"useButton\":[516,\"use-button\"],\"buttonLabel\":[1,\"button-label\"],\"width\":[8],\"height\":[8],\"progress\":[2]}]]],[\"sd-date-range-picker-calendar\",[[512,\"sd-date-range-picker-calendar\",{\"value\":[16],\"selectable\":[16],\"maxRange\":[2,\"max-range\"],\"currentYear\":[32],\"currentMonth\":[32],\"pendingStart\":[32],\"hoverDate\":[32],\"displayValue\":[32]},null,{\"value\":[{\"handleValueChange\":0}]}]]],[\"sd-text-link\",[[512,\"sd-text-link\",{\"label\":[1],\"icon\":[1],\"iconColor\":[1,\"icon-color\"],\"labelClass\":[1,\"label-class\"],\"rightArrow\":[1,\"right-arrow\"],\"underline\":[516],\"disabled\":[516],\"size\":[513]}]]],[\"sd-radio\",[[512,\"sd-radio\",{\"value\":[1032],\"val\":[8],\"disabled\":[4],\"label\":[1]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-ghost-button_3\",[[512,\"sd-ghost-button\",{\"icon\":[1],\"size\":[1],\"intent\":[1],\"ariaLabel\":[1,\"aria-label\"],\"tooltipText\":[1,\"tooltip-text\"],\"disabled\":[4],\"isTooltipOpen\":[32]}],[512,\"sd-tag\",{\"name\":[1],\"label\":[1],\"icon\":[1],\"isLeft\":[4,\"is-left\"]}],[772,\"sd-portal\",{\"to\":[1],\"parentRef\":[16],\"offset\":[16],\"viewportPadding\":[2,\"viewport-padding\"],\"zIndex\":[2,\"z-index\"],\"open\":[4],\"placement\":[1]},[[9,\"scroll\",\"updatePosition\"],[9,\"resize\",\"updatePosition\"],[9,\"mousedown\",\"handleMouseDown\"],[8,\"click\",\"handleWindowClick\"]],{\"open\":[{\"handleOpenChange\":0}]}]]],[\"sd-chip\",[[512,\"sd-chip\",{\"name\":[1],\"value\":[1025],\"error\":[1028],\"disabled\":[4],\"editable\":[4],\"placeholder\":[1],\"rules\":[16],\"internalValue\":[32],\"isEditing\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdResetValidation\":[64],\"sdFocus\":[64],\"sdGetNativeElement\":[64]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-field_3\",[[772,\"sd-field\",{\"name\":[1],\"rules\":[16],\"error\":[1028],\"disabled\":[1028],\"readonly\":[1028],\"hovered\":[1028],\"focused\":[1028],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"size\":[513],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"errorMsg\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidation\":[64],\"sdFocus\":[64]}],[772,\"sd-tooltip\",{\"trigger\":[1],\"placement\":[1],\"color\":[1],\"tooltipType\":[1,\"tooltip-type\"],\"icon\":[1],\"iconSize\":[2,\"icon-size\"],\"label\":[1],\"name\":[1],\"rightIcon\":[1,\"right-icon\"],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"type\":[1],\"useClose\":[4,\"use-close\"],\"sdClass\":[1,\"sd-class\"],\"message\":[16],\"triggerClass\":[1,\"trigger-class\"],\"triggerStyle\":[1,\"trigger-style\"],\"showTooltip\":[32],\"slotContentHTML\":[32],\"show\":[64],\"hide\":[64]}],[772,\"sd-floating-portal\",{\"to\":[1],\"parentRef\":[16],\"offset\":[16],\"zIndex\":[2,\"z-index\"],\"placement\":[1],\"open\":[4]},[[9,\"resize\",\"updatePosition\"],[9,\"mousedown\",\"handleMouseDown\"],[8,\"click\",\"handleWindowClick\"],[8,\"keydown\",\"handleKeydown\"]]]]],[\"sd-pagination_4\",[[512,\"sd-thead\",{\"columns\":[16],\"selectable\":[4],\"resizable\":[4],\"stickyColumn\":[16],\"stickyHeader\":[4,\"sticky-header\"],\"scrolledLeft\":[4,\"scrolled-left\"],\"scrolledRight\":[4,\"scrolled-right\"],\"rows\":[16],\"columnWidths\":[1040],\"tableId\":[32],\"_columns\":[32],\"_selectable\":[32],\"_resizable\":[32],\"_stickyColumn\":[32],\"_stickyHeader\":[32],\"_scrolledLeft\":[32],\"_scrolledRight\":[32],\"dropdownOpenMap\":[32],\"refreshConfig\":[64],\"setColumnWidths\":[64],\"refreshSelection\":[64]},null,{\"columns\":[{\"handleColumnsChange\":0}]}],[772,\"sd-tr\",{\"columns\":[16],\"selectable\":[4],\"stickyColumn\":[16],\"rowKey\":[1,\"row-key\"],\"row\":[16],\"separator\":[8],\"tableId\":[32],\"columnWidths\":[32],\"isVisible\":[32],\"spansVersion\":[32],\"_columns\":[32],\"_selectable\":[32],\"_stickyColumn\":[32],\"_scrolledLeft\":[32],\"_scrolledRight\":[32],\"_dense\":[32],\"refreshConfig\":[64],\"bumpSpansVersion\":[64],\"updateVisibility\":[64],\"setColumnWidths\":[64],\"refreshSelection\":[64]}],[512,\"sd-pagination\",{\"currentPage\":[1026,\"current-page\"],\"lastPage\":[2,\"last-page\"],\"simple\":[4]}],[769,\"sd-tbody\",{\"rows\":[16],\"tableId\":[32],\"topSpacerHeight\":[32],\"bottomSpacerHeight\":[32]},null,{\"rows\":[{\"handleRowsChange\":0}]}]]],[\"sd-calendar_2\",[[512,\"sd-calendar\",{\"value\":[1025],\"selectable\":[16],\"events\":[16],\"elevated\":[4],\"currentYear\":[32],\"currentMonth\":[32]},null,{\"value\":[{\"handleValueChange\":0}]}],[512,\"sd-date-picker-trigger\",{\"displayText\":[1,\"display-text\"],\"placeholder\":[1],\"disabled\":[4],\"size\":[1]}]]],[\"sd-date-picker_7\",[[512,\"sd-date-picker\",{\"value\":[1025],\"size\":[513],\"placeholder\":[513],\"selectable\":[16],\"disabled\":[516],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"error\":[1028],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"focused\":[32],\"hovered\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[512,\"sd-date-range-picker\",{\"value\":[1040],\"size\":[513],\"placeholder\":[513],\"selectable\":[16],\"maxRange\":[2,\"max-range\"],\"disabled\":[516],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"error\":[1028],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"focused\":[32],\"hovered\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[512,\"sd-file-picker\",{\"value\":[1040],\"placeholder\":[513],\"disabled\":[516],\"inline\":[516],\"multiple\":[516],\"accept\":[1],\"maxFileSize\":[8,\"max-file-size\"],\"maxTotalSize\":[8,\"max-total-size\"],\"maxFiles\":[8,\"max-files\"],\"name\":[1],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"width\":[8],\"rules\":[16],\"error\":[1028],\"status\":[1],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"focused\":[1028],\"hovered\":[1028],\"internalValue\":[32],\"showTooltip\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64]},null,{\"value\":[{\"valueChanged\":0}]}],[772,\"sd-input\",{\"value\":[1032],\"type\":[1],\"size\":[1],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"clearable\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"autocomplete\":[1],\"maxlength\":[2],\"minlength\":[2],\"inputmode\":[1],\"enterkeyhint\":[1],\"spellcheck\":[4],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"inputStyle\":[16],\"name\":[1],\"internalValue\":[32],\"passwordVisible\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-number-input\",{\"size\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"useButton\":[4,\"use-button\"],\"useDecimal\":[4,\"use-decimal\"],\"value\":[1032],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"placeholder\":[1],\"disabled\":[4],\"width\":[8],\"rules\":[16],\"autoFocus\":[4,\"auto-focus\"],\"status\":[1],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"inputPrefix\":[1,\"input-prefix\"],\"inputSuffix\":[1,\"input-suffix\"],\"inputClass\":[1,\"input-class\"],\"readonly\":[4],\"inputStyle\":[16],\"error\":[1028],\"focused\":[1028],\"hovered\":[1028],\"name\":[1],\"internalValue\":[32],\"displayValue\":[32],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64],\"sdGetNativeElement\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-textarea\",{\"value\":[1025],\"placeholder\":[1],\"disabled\":[4],\"readonly\":[4],\"autoFocus\":[4,\"auto-focus\"],\"textareaClass\":[1,\"textarea-class\"],\"textareaStyle\":[16],\"maxLength\":[2,\"max-length\"],\"rows\":[2],\"spellcheck\":[4],\"width\":[8],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"rules\":[16],\"error\":[1028],\"status\":[1],\"focused\":[1028],\"hovered\":[1028],\"name\":[1],\"internalValue\":[32],\"sdGetNativeElement\":[64],\"sdValidate\":[64],\"sdReset\":[64],\"sdResetValidate\":[64],\"sdFocus\":[64]},null,{\"value\":[{\"valueChanged\":0}],\"internalValue\":[{\"internalValueChanged\":0}]}],[512,\"sd-radio-group\",{\"value\":[1032],\"options\":[1040],\"direction\":[1],\"disabled\":[4],\"groupName\":[1,\"group-name\"]},null,{\"value\":[{\"valueChanged\":0}]}]]],[\"sd-checkbox\",[[512,\"sd-checkbox\",{\"value\":[1028],\"val\":[8],\"disabled\":[516],\"inverse\":[516],\"label\":[1],\"isChecked\":[32]},null,{\"value\":[{\"watchValueHandler\":0}]}]]],[\"sd-select-list-item_2\",[[512,\"sd-select-list-item\",{\"option\":[16],\"depth\":[2],\"isSelected\":[4,\"is-selected\"],\"isFocused\":[4,\"is-focused\"],\"useCheckbox\":[4,\"use-checkbox\"],\"countInfo\":[16]}],[512,\"sd-select-list-item-search\",{\"isScrolled\":[4,\"is-scrolled\"],\"searchText\":[32],\"sdFocus\":[64]}]]],[\"sd-select_3\",[[512,\"sd-select\",{\"type\":[1],\"value\":[1032],\"options\":[16],\"placeholder\":[1],\"dropdownWidth\":[1,\"dropdown-width\"],\"maxDropdownWidth\":[1,\"max-dropdown-width\"],\"dropdownHeight\":[1,\"dropdown-height\"],\"disabled\":[4],\"label\":[1],\"labelWidth\":[8,\"label-width\"],\"addonLabel\":[1,\"addon-label\"],\"addonAlign\":[1,\"addon-align\"],\"error\":[1028],\"hint\":[1],\"errorMessage\":[1,\"error-message\"],\"rules\":[16],\"icon\":[16],\"labelTooltip\":[1,\"label-tooltip\"],\"labelTooltipProps\":[16],\"emitValue\":[4,\"emit-value\"],\"width\":[8],\"useSearch\":[4,\"use-search\"],\"allSelectedLabel\":[1,\"all-selected-label\"],\"useSelectAll\":[4,\"use-select-all\"],\"name\":[1],\"isOpen\":[32],\"isAnimatingOut\":[32],\"triggerWidth\":[32],\"resolvedDropdownHeight\":[32],\"resolvedMaxDropdownWidth\":[32],\"focused\":[32],\"hovered\":[32],\"sdFocus\":[64],\"sdOpen\":[64]},null,{\"isOpen\":[{\"watchIsOpen\":0}]}],[513,\"sd-select-listbox\",{\"type\":[1],\"options\":[16],\"value\":[8],\"emitValue\":[4,\"emit-value\"],\"useSearch\":[4,\"use-search\"],\"useSelectAll\":[4,\"use-select-all\"],\"triggerWidth\":[1,\"trigger-width\"],\"maxWidth\":[1,\"max-width\"],\"maxHeight\":[1,\"max-height\"],\"searchKeyword\":[32],\"isScrolled\":[32],\"focusedIndex\":[32]},null,{\"searchKeyword\":[{\"resetFocusOnFilter\":0}]}],[512,\"sd-select-trigger\",{\"displayText\":[1,\"display-text\"],\"placeholder\":[1],\"disabled\":[4],\"isOpen\":[4,\"is-open\"],\"sdFocus\":[64]}]]]]"), options);
 };
 
 export { defineCustomElements };

package/dist/esm/sd-button_2.entry.js

@@ -88,22 +88,22 @@ const CancelOutline = (props) => {
 
 const CaretDown = (props) => {
     const { size = 24, ...rest } = props;
-    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M11.8033 17.754L2.72757 6.40942C2.59557 6.24442 2.71304 6 2.92435 6H21.0757C21.287 6 21.4045 6.24442 21.2725 6.40942L12.1968 17.754C12.0959 17.8801 11.9041 17.8801 11.8033 17.754Z", fill: "currentColor", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" })));
+    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M19.2188 8.25C19.9555 8.25 20.2813 9.44246 19.7061 10.0342L12.4874 17.46C12.2028 17.7526 11.7974 17.7526 11.5127 17.46L4.294 10.0342C3.71879 9.44247 4.04461 8.25 4.7813 8.25H19.2188Z", fill: "currentColor" })));
 };
 
 const CaretLeft = (props) => {
     const { size = 24, ...rest } = props;
-    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M6.24594 12.1968L17.5905 21.2725C17.7555 21.4045 18 21.287 18 21.0757V2.92435C18 2.71304 17.7555 2.59557 17.5905 2.72757L6.24594 11.8033C6.11984 11.9041 6.11984 12.0959 6.24594 12.1968Z", fill: "currentColor", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" })));
+    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M14.1423 4.29416C14.7698 3.71888 16.0358 4.04475 16.0358 4.78146V19.219C16.0358 19.9557 14.7698 20.2815 14.1423 19.7063L6.26827 12.4865C5.95813 12.2019 5.95791 11.7975 6.26827 11.5129L14.1423 4.29416Z", fill: "currentColor" })));
 };
 
 const CaretRight = (props) => {
     const { size = 24, ...rest } = props;
-    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M17.754 12.1968L6.40942 21.2725C6.24442 21.4045 6 21.287 6 21.0757L6 2.92435C6 2.71304 6.24442 2.59557 6.40942 2.72757L17.754 11.8033C17.8801 11.9041 17.8801 12.0959 17.754 12.1968Z", fill: "currentColor", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" })));
+    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M8.25 4.78127C8.25 4.04456 9.44248 3.71871 10.0342 4.29397L17.46 11.5127C17.7526 11.7973 17.7526 12.2027 17.46 12.4873L10.0342 19.7061C9.44249 20.2814 8.25 19.9555 8.25 19.2188V4.78127Z", fill: "currentColor" })));
 };
 
 const CaretUp = (props) => {
     const { size = 24, ...rest } = props;
-    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M11.8033 6.24594L2.72757 17.5905C2.59557 17.7555 2.71304 18 2.92435 18H21.0757C21.287 18 21.4045 17.7555 21.2725 17.5905L12.1968 6.24594C12.0959 6.11984 11.9041 6.11984 11.8033 6.24594Z", fill: "currentColor", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" })));
+    return (h("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest }, h("path", { d: "M11.6252 6.44362C11.8583 6.27919 12.1422 6.27906 12.3752 6.44362L12.4865 6.5403L19.7063 13.9651C20.2815 14.5568 19.9557 15.7503 19.219 15.7503H4.78146C4.04475 15.7503 3.71888 14.5568 4.29416 13.9651L11.5129 6.5403L11.6252 6.44362Z", fill: "currentColor" })));
 };
 
 const Check = (props) => {

package/dist/esm/sd-chip-input.entry.js

@@ -103,7 +103,7 @@ const CHIP_INPUT_SUGGESTIONS = {
     emptyLineHeight: '20px',
 };
 
-const sdChipInputCss = () => `sd-chip-input{display:inline-flex}sd-chip-input .sd-chip-input{position:relative;width:100%;isolation:isolate;min-height:var(--sd-chip-input-min-height);display:flex;flex-flow:row wrap;align-items:center;gap:var(--sd-chip-input-chip-gap);padding:var(--sd-chip-input-padding-y) var(--sd-chip-input-padding-x);cursor:text}sd-chip-input .sd-chip-input__reset{display:inline-flex;align-items:center;gap:var(--sd-chip-input-reset-gap);flex-shrink:0}sd-chip-input .sd-chip-input__divider{display:inline-block;width:1px;height:12px;background-color:var(--sd-chip-input-divider-color);flex-shrink:0}sd-chip-input .sd-chip-input__max-count{font-size:var(--sd-chip-input-max-count-font-size);font-weight:var(--sd-chip-input-max-count-font-weight);color:var(--sd-chip-input-max-count-color);white-space:nowrap;flex-shrink:0}sd-chip-input .sd-chip-input__field{flex:0 0 auto;display:inline-grid;grid-template-columns:minmax(0, max-content);align-items:center;min-width:1ch;max-width:100%;height:var(--sd-chip-input-field-height);box-sizing:border-box;padding:0;border:none;border-radius:0;background:transparent;overflow:hidden}sd-chip-input .sd-chip-input__field::after{content:attr(data-value);grid-area:1/1;visibility:hidden;white-space:pre;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family)}sd-chip-input .sd-chip-input__field--filled{padding:0 var(--sd-chip-input-field-padding-x);border:var(--sd-chip-input-field-border-width) solid var(--sd-chip-input-field-border-color);border-radius:var(--sd-chip-input-field-radius);background:var(--sd-chip-input-field-bg)}sd-chip-input .sd-chip-input__field--empty{position:absolute;top:0;left:0;width:0;height:0;min-width:0;overflow:hidden}sd-chip-input .sd-chip-input__input{grid-area:1/1;width:100%;min-width:1ch;height:var(--sd-chip-input-field-height);margin:0;padding:0;border:none;outline:none;overflow:hidden;text-overflow:ellipsis;background:transparent;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family);color:var(--sd-chip-input-field-content)}sd-chip-input .sd-chip-input__input[disabled]{cursor:not-allowed;pointer-events:none}sd-chip-input .sd-chip-input__input::placeholder{color:var(--sd-chip-input-placeholder-color)}sd-chip-input .sd-chip-input__suggestions{display:flex;flex-direction:column;box-sizing:border-box;background:white;border-radius:var(--sd-chip-input-suggestions-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);max-height:var(--sd-chip-input-suggestions-max-height);min-height:0;overflow-y:auto;overflow-x:hidden;outline:none}sd-chip-input .sd-chip-input__suggestion-item{display:flex;flex-shrink:0;align-items:center;gap:var(--sd-chip-input-suggestion-gap);padding:var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-right) var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-x);font-size:var(--sd-chip-input-suggestion-font-size);line-height:var(--sd-chip-input-suggestion-line-height);font-weight:var(--sd-chip-input-suggestion-font-weight);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestion-color);cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-chip-input .sd-chip-input__suggestion-item--active{background:var(--sd-chip-input-suggestion-bg-hover);color:var(--sd-chip-input-suggestion-color-hover);font-weight:var(--sd-chip-input-suggestion-font-weight-selected)}sd-chip-input .sd-chip-input__suggestions-empty{padding:12px;text-align:center;font-size:var(--sd-chip-input-suggestions-empty-font-size);line-height:var(--sd-chip-input-suggestions-empty-line-height);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestions-empty-color)}`;
+const sdChipInputCss = () => `sd-chip-input{display:inline-flex}sd-chip-input .sd-chip-input{position:relative;width:100%;isolation:isolate;min-height:var(--sd-chip-input-min-height);display:flex;flex-flow:row wrap;align-items:center;gap:var(--sd-chip-input-chip-gap);padding:var(--sd-chip-input-padding-y) var(--sd-chip-input-padding-x);cursor:text}sd-chip-input .sd-chip-input__reset{display:inline-flex;align-items:center;gap:var(--sd-chip-input-reset-gap);flex-shrink:0}sd-chip-input .sd-chip-input__divider{display:inline-block;width:1px;height:12px;background-color:var(--sd-chip-input-divider-color);flex-shrink:0}sd-chip-input .sd-chip-input__max-count{font-size:var(--sd-chip-input-max-count-font-size);font-weight:var(--sd-chip-input-max-count-font-weight);color:var(--sd-chip-input-max-count-color);white-space:nowrap;flex-shrink:0}sd-chip-input .sd-chip-input__field{flex:0 0 auto;display:inline-grid;grid-template-columns:minmax(0, max-content);align-items:center;min-width:1ch;max-width:100%;height:var(--sd-chip-input-field-height);box-sizing:border-box;padding:0;border:none;border-radius:0;background:transparent;overflow:hidden}sd-chip-input .sd-chip-input__field::after{content:attr(data-value);grid-area:1/1;visibility:hidden;white-space:pre;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family)}sd-chip-input .sd-chip-input__field--filled{padding:0 var(--sd-chip-input-field-padding-x);border:var(--sd-chip-input-field-border-width) solid var(--sd-chip-input-field-border-color);border-radius:var(--sd-chip-input-field-radius);background:var(--sd-chip-input-field-bg)}sd-chip-input .sd-chip-input__field--empty{position:absolute;top:0;left:0;width:0;height:0;min-width:0;overflow:hidden}sd-chip-input .sd-chip-input__input{grid-area:1/1;width:100%;min-width:1ch;height:var(--sd-chip-input-field-height);margin:0;padding:0;border:none;outline:none;overflow:hidden;text-overflow:ellipsis;background:transparent;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family);color:var(--sd-chip-input-field-content)}sd-chip-input .sd-chip-input__input[disabled]{cursor:not-allowed;pointer-events:none}sd-chip-input .sd-chip-input__input::placeholder{color:var(--sd-chip-input-placeholder-color)}sd-chip-input .sd-chip-input__suggestions{display:flex;flex-direction:column;box-sizing:border-box;background:white;border-radius:var(--sd-chip-input-suggestions-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);max-height:var(--sd-chip-input-suggestions-max-height);min-height:0;overflow-y:auto;overflow-x:hidden;outline:none}sd-chip-input .sd-chip-input__suggestion-item{display:flex;flex-shrink:0;align-items:center;gap:var(--sd-chip-input-suggestion-gap);padding:var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-right) var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-x);font-size:var(--sd-chip-input-suggestion-font-size);line-height:var(--sd-chip-input-suggestion-line-height);font-weight:var(--sd-chip-input-suggestion-font-weight);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestion-color);cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-chip-input .sd-chip-input__suggestion-item--active{background:var(--sd-chip-input-suggestion-bg-hover);color:var(--sd-chip-input-suggestion-color-hover);font-weight:var(--sd-chip-input-suggestion-font-weight-selected)}sd-chip-input .sd-chip-input__suggestion-item--selected{cursor:default;overflow:visible;text-overflow:unset}sd-chip-input .sd-chip-input__suggestions-empty{padding:12px;text-align:center;font-size:var(--sd-chip-input-suggestions-empty-font-size);line-height:var(--sd-chip-input-suggestions-empty-line-height);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestions-empty-color)}`;
 
 const SdChipInput = class {
     constructor(hostRef) {
@@ -332,7 +332,9 @@ const SdChipInput = class {
             }
             if (event.key === 'Enter' && this.activeSuggestionIndex >= 0) {
                 event.preventDefault();
-                this.addChip(activeItems[this.activeSuggestionIndex]);
+                const selectedItem = activeItems[this.activeSuggestionIndex];
+                if (!(this.internalValues ?? []).includes(selectedItem))
+                    this.addChip(selectedItem);
                 return;
             }
         }
@@ -392,6 +394,10 @@ const SdChipInput = class {
     };
     handleContainerClick = () => {
         if (!this.disabled) {
+            // 이미 포커스된 상태에서 재클릭 시 handleFocus가 다시 실행되지 않으므로
+            // suppress 플래그를 여기서 직접 해제한다.
+            this.suppressRecommendations = false;
+            this.suppressSuggestions = false;
             this.inputEl?.focus();
         }
     };
@@ -536,7 +542,7 @@ const SdChipInput = class {
             fontFamily: CHIP_INPUT_SUGGESTIONS.itemFontFamily,
             color: CHIP_INPUT_SUGGESTIONS.emptyColor,
         };
-        return (h("sd-field", { key: '7135f3f1fe7c76276bcd780ba2cfdf391925a57b', name: this.name, label: this.label, labelWidth: this.labelWidth, hint: this.hint, errorMessage: this.errorMessage, rules: [this.duplicateRule, ...(this.rules ?? [])], error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, width: this.width, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: cssVars, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, h("div", { key: '8566ae7bc3bedaf6be95f29267587c49c090e73f', class: "sd-chip-input", ref: el => (this.chipInputRef = el), onClick: this.handleContainerClick }, (this.internalValues ?? []).map((value, i) => (h("sd-chip", { key: i, value: value, error: this.getChipError(i), disabled: this.getChipDisabled(i), editable: false, onSdRemove: () => this.handleChipRemove(i) }))), !isMaxReached && (h("div", { key: '00d9946c93d2e961466fa8baf617fc4ddc12d701', class: {
+        return (h("sd-field", { key: 'b72e33b6f204ebdf6791cc2f20d01bbb74a4203a', name: this.name, label: this.label, labelWidth: this.labelWidth, hint: this.hint, errorMessage: this.errorMessage, rules: [this.duplicateRule, ...(this.rules ?? [])], error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, width: this.width, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: cssVars, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, h("div", { key: '499114d06f4d375fed5575edd394c501f4d72691', class: "sd-chip-input", ref: el => (this.chipInputRef = el), onClick: this.handleContainerClick }, (this.internalValues ?? []).map((value, i) => (h("sd-chip", { key: i, value: value, error: this.getChipError(i), disabled: this.getChipDisabled(i), editable: false, onSdRemove: () => this.handleChipRemove(i) }))), !isMaxReached && (h("div", { key: '5910a2d0e0e9cbc472baa1d9c9c3fa07e89fbdcb', class: {
                 'sd-chip-input__field': true,
                 'sd-chip-input__field--filled': this.inputValue !== '',
                 'sd-chip-input__field--empty': this.inputValue === '' && this.internalValues.length > 0 && !this.focused,
@@ -544,20 +550,38 @@ const SdChipInput = class {
                 ? this.inputValue
                 : this.internalValues.length === 0
                     ? this.placeholder
-                    : '' }, h("input", { key: '2845394a5eaec2d5f37876a0e8938fa9d3f38263', ref: el => (this.inputEl = el), class: "sd-chip-input__input", placeholder: this.internalValues.length === 0 ? this.placeholder : '', disabled: this.disabled, size: 1, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }))), showResetArea && (h("div", { key: '7cec3884a4cace3d688e80006d6240d321ac60f3', class: "sd-chip-input__reset" }, this.inputValue === '' && h("span", { key: '761539e242437841a2703d95903f9d6b5fe3d69f', class: "sd-chip-input__divider" }), this.maxCount != null && (h("span", { key: '1b448973ba3573c94ae09b74cd24720c8ea011d3', class: "sd-chip-input__max-count" }, "\uCD5C\uB300 ", this.maxCount, "\uAC1C")), this.useReset && this.internalValues.length > 0 && (h("sd-text-link", { key: '90d7582f35b8e7a8ee3c1dba717fa87c13c1de19', icon: "reset", iconColor: CHIP_INPUT_RESET.iconColor, label: "\uC785\uB825 \uCD08\uAE30\uD654", underline: true, disabled: this.disabled, style: { '--sd-text-link-color': CHIP_INPUT_RESET.labelColor }, onSdClick: this.handleResetInput })))), showDropdown && (h("sd-portal", { key: '9495c87a4916829fe955f054a8c97d2b3fa04914', open: showDropdown, parentRef: this.chipInputRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, h("div", { key: 'ac4afd8511316f0b4b957c312a051b02fc72f20e', class: "sd-chip-input__suggestions", role: "listbox", style: suggestionBoxStyle }, isDropdownLoading && (h("div", { key: '3b6855a7ad2ef48415160544a19014d59ca38ec1', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), dropdownItems.map((item, i) => (h("div", { key: item, class: {
-                'sd-chip-input__suggestion-item': true,
-                'sd-chip-input__suggestion-item--active': i === this.activeSuggestionIndex,
-            }, role: "option", tabIndex: -1, "aria-selected": i === this.activeSuggestionIndex, style: i === this.activeSuggestionIndex
-                ? {
-                    ...suggestionItemStyle,
-                    background: CHIP_INPUT_SUGGESTIONS.itemBgHover,
-                    color: CHIP_INPUT_SUGGESTIONS.itemColorHover,
-                    fontWeight: CHIP_INPUT_SUGGESTIONS.itemFontWeightSelected,
-                }
-                : suggestionItemStyle, onMouseDown: e => {
-                e.preventDefault();
-                this.addChip(item);
-            } }, item)))))))));
+                    : '' }, h("input", { key: '3c1e75d691332b67a500a2d17030d5db191bdeb9', ref: el => (this.inputEl = el), class: "sd-chip-input__input", placeholder: this.internalValues.length === 0 ? this.placeholder : '', disabled: this.disabled, size: 1, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }))), showResetArea && (
+        // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+        h("div", { key: '4aa212280a928b88b85dffa3d453ea8f563e1fe0', class: "sd-chip-input__reset",
+            // 리셋 버튼 클릭 시 input blur → portal unmount → refocus → 새 portal mount로
+            // 두 wrapper가 body에 잠깐 겹치는 타이밍 이슈를 방지한다.
+            onMouseDown: e => e.preventDefault() }, this.inputValue === '' && h("span", { key: 'f7faa45b57d8e38dda8cc98119357f92d914fee4', class: "sd-chip-input__divider" }), this.maxCount != null && (h("span", { key: 'dfde4ea82558414614fb2d817f7bfa1fb5d4bf5f', class: "sd-chip-input__max-count" }, "\uCD5C\uB300 ", this.maxCount, "\uAC1C")), this.useReset && this.internalValues.length > 0 && (h("sd-text-link", { key: '9b43c82c1a5d425e5b187e92b4259e7d919491e3', icon: "reset", iconColor: CHIP_INPUT_RESET.iconColor, label: "\uC785\uB825 \uCD08\uAE30\uD654", underline: true, disabled: this.disabled, style: { '--sd-text-link-color': CHIP_INPUT_RESET.labelColor }, onSdClick: this.handleResetInput })))), showDropdown && (h("sd-portal", { key: 'aa205aacbbafcd8c3d9855268637e6da956d4a74', open: showDropdown, parentRef: this.chipInputRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, h("div", { key: '26814734f202da3a13e695ae1d0c913ea430b888', class: "sd-chip-input__suggestions", role: "listbox", style: suggestionBoxStyle }, isDropdownLoading && (h("div", { key: 'df80d11b79f67dc6cfe6503b258528efa3752265', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), dropdownItems.map((item, i) => {
+            const isSelected = (this.internalValues ?? []).includes(item);
+            const isActive = i === this.activeSuggestionIndex && !isSelected;
+            return (h("div", { key: item, class: {
+                    'sd-chip-input__suggestion-item': true,
+                    'sd-chip-input__suggestion-item--active': isActive,
+                    'sd-chip-input__suggestion-item--selected': isSelected,
+                }, role: "option", tabIndex: -1, "aria-selected": isSelected || isActive, "aria-disabled": isSelected ? 'true' : undefined, style: isSelected
+                    ? {
+                        ...suggestionItemStyle,
+                        color: '#0075FF',
+                        fontWeight: CHIP_INPUT_SUGGESTIONS.itemFontWeightSelected,
+                        cursor: 'default',
+                    }
+                    : isActive
+                        ? {
+                            ...suggestionItemStyle,
+                            background: CHIP_INPUT_SUGGESTIONS.itemBgHover,
+                            color: CHIP_INPUT_SUGGESTIONS.itemColorHover,
+                            fontWeight: CHIP_INPUT_SUGGESTIONS.itemFontWeightSelected,
+                        }
+                        : suggestionItemStyle, onMouseDown: e => {
+                    e.preventDefault();
+                    if (!isSelected)
+                        this.addChip(item);
+                } }, h("span", { style: { flex: '1' } }, item), isSelected && (h("sd-icon", { name: "check", size: "12", style: { color: '#0075FF', flexShrink: '0' } }))));
+        })))))));
     }
     static get watchers() { return {
         "values": [{

package/dist/esm/sd-pagination_4.entry.js

@@ -232,7 +232,7 @@ const SdTbody = class {
 };
 SdTbody.style = sdTbodyCss();
 
-const sdTheadCss = () => `sd-thead{display:contents}sd-thead *{box-sizing:border-box}.thead{display:table-header-group;height:var(--table-header-height, 36px)}.thead--sticky{position:sticky;top:0;z-index:120}.tr{display:table-row;width:100%}.th{display:table-cell;background:var(--table-header-bg, #F5FAFF);height:var(--table-header-height, 36px);padding:0 var(--table-header-padding-x, 16px);font-family:var(--table-header-font-family, inherit);font-weight:var(--table-header-font-weight, 500);font-size:var(--table-header-font-size, 12px);line-height:var(--table-header-line-height, 20px);text-decoration:var(--table-header-text-decoration, none);vertical-align:middle;border-bottom:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th--selected{position:relative;width:var(--table-selectable-width, 48px) !important;max-width:var(--table-selectable-width, 48px) !important;min-width:var(--table-selectable-width, 48px) !important;text-align:center}.th--selected sd-checkbox label{position:relative}.th--selected sd-checkbox label:before{content:"";position:absolute;inset:-6px}.th.sticky-left{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;left:var(--sticky-left-offset, 0)}.th.sticky-right{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;right:var(--sticky-right-offset, 0)}.th.sticky-left-edge:after{content:"";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.th.sticky-right-edge:after{content:"";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.th.sticky-left-edge.is-scrolled-left{overflow:visible}.th.sticky-left-edge.is-scrolled-left:after{opacity:1}.th.sticky-right-edge.is-scrolled-right{overflow:visible}.th.sticky-right-edge.is-scrolled-right:after{opacity:1}.th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--table-header-gap, 4px)}.th__content--left{justify-content:flex-start}.th__content--center{justify-content:center}.th__content--right{justify-content:flex-end}.th__content--label{white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th__bar{position:absolute;top:50%;right:0;transform:translateY(-50%);width:var(--table-border-width, 1px);height:var(--table-header-resizer-height, 16px);z-index:3;background-color:var(--table-header-resizer-color, #CCCCCC)}.th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:var(--table-header-resizer-height, 16px);cursor:col-resize;z-index:3;border-left:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC);border-right:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC)}.th__resizer--left{right:auto;left:0}`;
+const sdTheadCss = () => `sd-thead{display:contents}sd-thead *{box-sizing:border-box}.thead{display:table-header-group;height:var(--table-header-height, 36px)}.thead--sticky{position:sticky;top:0;z-index:120}.tr{display:table-row;width:100%}.th{display:table-cell;background:var(--table-header-bg, #F5FAFF);height:var(--table-header-height, 36px);padding:0 var(--table-header-padding-x, 16px);font-family:var(--table-header-font-family, inherit);font-weight:var(--table-header-font-weight, 500);font-size:var(--table-header-font-size, 12px);line-height:var(--table-header-line-height, 20px);text-decoration:var(--table-header-text-decoration, none);vertical-align:middle;border-bottom:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th--selected{position:relative;width:var(--table-selectable-width, 48px) !important;max-width:var(--table-selectable-width, 48px) !important;min-width:var(--table-selectable-width, 48px) !important;text-align:center}.th--selected sd-checkbox label{position:relative}.th--selected sd-checkbox label:before{content:"";position:absolute;inset:-6px}.th.sticky-left{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;left:var(--sticky-left-offset, 0)}.th.sticky-right{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;right:var(--sticky-right-offset, 0)}.th.sticky-left-edge:after{content:"";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.th.sticky-right-edge:after{content:"";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.th.sticky-left-edge.is-scrolled-left{overflow:visible}.th.sticky-left-edge.is-scrolled-left:after{opacity:1}.th.sticky-right-edge.is-scrolled-right{overflow:visible}.th.sticky-right-edge.is-scrolled-right:after{opacity:1}.th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--table-header-gap, 4px)}.th__content--left{justify-content:flex-start}.th__content--center{justify-content:center}.th__content--right{justify-content:flex-end}.th__content--label{white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th__bar{position:absolute;top:50%;right:0;transform:translateY(-50%);width:var(--table-border-width, 1px);height:var(--table-header-resizer-height, 16px);z-index:3;background-color:var(--table-header-resizer-color, #CCCCCC)}.th__dropdown-trigger{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;padding:0;border:none;background:transparent;cursor:pointer;color:inherit;border-radius:2px}.th__dropdown-trigger sd-icon{transition:transform 0.15s ease}.th__dropdown-trigger--open sd-icon{transform:rotate(180deg)}.th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:var(--table-header-resizer-height, 16px);cursor:col-resize;z-index:3;border-left:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC);border-right:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC)}.th__resizer--left{right:auto;left:0}`;
 
 const SdThead = class {
     constructor(hostRef) {
@@ -268,14 +268,29 @@ const SdThead = class {
     _stickyHeader = false;
     _scrolledLeft = false;
     _scrolledRight = false;
+    dropdownOpenMap = {};
     tableEl = null;
+    dropdownRefs = {};
+    dropdownThRefs = {};
+    dropdownPortals = {};
     handleColumnsChange(newCols) {
         if (Array.isArray(newCols) && (this.columnWidths ?? []).length === 0) {
             this.columnWidths = newCols.map(c => (c.autoWidth ? 0 : parseInt(c.width || '120', 10)));
         }
     }
+    disconnectedCallback() {
+        const portals = this.dropdownPortals ?? {};
+        Object.values(portals).forEach(portal => {
+            if (portal?.parentNode != null)
+                portal.parentNode.removeChild(portal);
+        });
+    }
     componentWillLoad() {
         this.syncTableContext();
+        this.dropdownOpenMap = this.dropdownOpenMap ?? {};
+        this.dropdownRefs = this.dropdownRefs ?? {};
+        this.dropdownThRefs = this.dropdownThRefs ?? {};
+        this.dropdownPortals = this.dropdownPortals ?? {};
         this.columnWidths = Array.isArray(this.columnWidths) ? this.columnWidths : [];
         this.resolveConfig();
         if ((this.columnWidths ?? []).length === 0) {
@@ -285,6 +300,36 @@ const SdThead = class {
     componentDidLoad() {
         this.syncTableContext();
         this.resolveConfig();
+        this.initDropdownPortals();
+    }
+    // sd-portal을 body에 붙여 CSS transform 영향 없이 정확한 위치에 패널을 표시한다.
+    // <slot>을 render에 두지 않고 직접 DOM 이동(slot 속성 제거)으로 Stencil 슬롯 에뮬레이션 충돌을 피한다.
+    initDropdownPortals() {
+        const cols = this._columns ?? [];
+        const hasDropdownCols = cols.filter(c => c.hasDropdown === true);
+        if (hasDropdownCols.length === 0)
+            return;
+        for (const col of hasDropdownCols) {
+            const colName = col.name;
+            // 이미 포탈이 생성된 컬럼은 건너뜀 (refreshConfig 재호출 대비)
+            if ((this.dropdownPortals ?? {})[colName] != null)
+                continue;
+            const slotContent = this.el.querySelector(`[slot="dropdown-${colName}"]`);
+            if (slotContent == null)
+                continue;
+            // slot 속성 제거: Stencil 슬롯 에뮬레이션이 재배포하지 못하게 한다
+            slotContent.removeAttribute('slot');
+            const portal = document.createElement('sd-portal');
+            portal.parentRef = this.dropdownThRefs[colName] ?? null;
+            portal.open = false;
+            // 첫 open 전까지 포탈 호스트 자체를 숨긴다.
+            // moveSlotContent()가 open=true 시 children을 독립 wrapper div로 이동하므로 이후 동작에 영향 없음.
+            portal.style.display = 'none';
+            portal.addEventListener('sdClose', () => this.closeDropdown(colName));
+            portal.appendChild(slotContent);
+            document.body.appendChild(portal);
+            this.dropdownPortals[colName] = portal;
+        }
     }
     syncTableContext() {
         // sd-table이 shadow:true이므로 fallback content로 렌더되면 closest가 경계를 못 넘는다.
@@ -327,6 +372,7 @@ const SdThead = class {
     /** 테이블 설정을 다시 불러옵니다. */
     async refreshConfig() {
         this.resolveConfig();
+        this.initDropdownPortals();
     }
     /** 컬럼 너비를 업데이트합니다. */
     async setColumnWidths(widths) {
@@ -371,6 +417,28 @@ const SdThead = class {
     handleColumnSort = (col) => {
         this.sdColumnSort.emit({ column: col });
     };
+    toggleDropdown(name) {
+        const isOpen = this.dropdownOpenMap[name] !== true;
+        const portals = this.dropdownPortals ?? {};
+        const newMap = { ...this.dropdownOpenMap };
+        // _columns 기준으로 순회: portals가 비어도 dropdownOpenMap은 항상 갱신됨
+        for (const col of (this._columns ?? []).filter(c => c.hasDropdown === true)) {
+            const shouldBeOpen = col.name === name ? isOpen : false;
+            newMap[col.name] = shouldBeOpen;
+            const portal = portals[col.name];
+            if (portal != null)
+                portal.open = shouldBeOpen;
+        }
+        this.dropdownOpenMap = newMap;
+    }
+    closeDropdown(name) {
+        if (this.dropdownOpenMap[name] !== true)
+            return;
+        this.dropdownOpenMap = { ...this.dropdownOpenMap, [name]: false };
+        const portal = (this.dropdownPortals ?? {})[name];
+        if (portal != null)
+            portal.open = false;
+    }
     handleSelectAll(checked) {
         const nextChecked = !!checked;
         const safeRows = Array.isArray(this.rows) ? this.rows : [];
@@ -387,6 +455,8 @@ const SdThead = class {
     }
     render() {
         const safeRows = Array.isArray(this.rows) ? this.rows : [];
+        const dropdownOpenMap = this.dropdownOpenMap ?? {};
+        const dropdownRefs = this.dropdownRefs ?? {};
         const stickyLeftCount = this._stickyColumn.left || 0;
         const stickyRightCount = this._stickyColumn.right || 0;
         const stickyLeftCols = this.visibleColumns.slice(0, stickyLeftCount);
@@ -408,22 +478,25 @@ const SdThead = class {
             '--table-border-color': TABLE_BORDER.color,
             '--table-border-width': `${TABLE_BORDER.width}px`,
         };
-        return (h(Host, { key: '26981191de95775401cad61e80fbf1e22cb0250b', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: 'a53d430f1b71a45b98de2912b563d3f17cd20b24', class: {
+        return (h(Host, { key: '947f5e5b0e59e7e6f8a73e4fd44dbfa646cb630a', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: '2e0ffbfe9d96528c6e0082d4883fa462a18831d6', class: {
                 'thead': true,
                 'thead--sticky': this._stickyHeader,
-            } }, h("tr", { key: '27ce13b70bfda4b210b36eb746fb60d369d9f5be', class: "tr" }, this._selectable && (h("th", { key: 'e353b00c7a02b82781e5107b1fd73dc556427edf', class: {
+            } }, h("tr", { key: '5843a18e1548bc6546e447d4c9213375116af0e9', class: "tr" }, this._selectable && (h("th", { key: '914024ca35874747e39f1819337cd4ad1cbe733d', class: {
                 'th': true,
                 'th--selected': true,
                 'sticky-left': true,
                 'sticky-left-edge': stickyLeftCount === 0,
                 'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
-            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '18eeabbcc4fc10196d6448bd9d0493b55778f9f1', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: '1a5a0561fc94be53a8244827ac9ae4f98fa766c2', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
+            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: 'e07232f1f5fa02589573ddaae53ebdadbdb97674', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: '08b504cfd4f420e76e91d649eed28c7068517044', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
                 'th': true,
                 [`${col.thClass}`]: Boolean(col.thClass),
                 'sticky-left': true,
                 'sticky-left-edge': idx === stickyLeftCount - 1,
                 'is-scrolled-left': idx === stickyLeftCount - 1 && this._scrolledLeft,
-            }, style: { ...col.thStyle, ...this.getStickyStyle(idx) } }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this._resizable && idx !== lastColIdx && (
+            }, style: { ...col.thStyle, ...this.getStickyStyle(idx) }, ref: col.hasDropdown === true ? (el => { this.dropdownThRefs[col.name] = el; }) : undefined }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text)))))), col.hasDropdown === true && (h("button", { class: {
+                'th__dropdown-trigger': true,
+                'th__dropdown-trigger--open': dropdownOpenMap[col.name] === true,
+            }, ref: el => { dropdownRefs[col.name] = el; }, onClick: () => this.toggleDropdown(col.name), "aria-haspopup": "listbox", "aria-expanded": dropdownOpenMap[col.name] === true ? 'true' : 'false' }, h("sd-icon", { name: "chevronDown", size: "12" })))), this._resizable && idx !== lastColIdx && (
         // column resize 는 마우스 드래그 전용 인터랙션이라 키보드 핸들러를 두지 않는다.
         // eslint-disable-next-line jsx-a11y/no-static-element-interactions
         h("div", { class: "th__resizer", onMouseDown: (evt) => this.handleResize(idx, evt) }))))), middleCols.map((col, relativeIdx) => {
@@ -431,7 +504,10 @@ const SdThead = class {
             return (h("th", { key: col.name, class: {
                     th: true,
                     [`${col.thClass}`]: Boolean(col.thClass),
-                }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) } }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this._resizable && actualColIdx !== lastColIdx && (
+                }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) }, ref: col.hasDropdown === true ? (el => { this.dropdownThRefs[col.name] = el; }) : undefined }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text)))))), col.hasDropdown === true && (h("button", { class: {
+                    'th__dropdown-trigger': true,
+                    'th__dropdown-trigger--open': this.dropdownOpenMap[col.name] === true,
+                }, ref: el => { this.dropdownRefs[col.name] = el; }, onClick: () => this.toggleDropdown(col.name), "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpenMap[col.name] === true ? 'true' : 'false' }, h("sd-icon", { name: "chevronDown", size: "12" })))), this._resizable && actualColIdx !== lastColIdx && (
             // column resize 는 마우스 드래그 전용 인터랙션이라 키보드 핸들러를 두지 않는다.
             // eslint-disable-next-line jsx-a11y/no-static-element-interactions
             h("div", { class: "th__resizer", onMouseDown: (evt) => this.handleResize(actualColIdx, evt) }))));
@@ -443,7 +519,10 @@ const SdThead = class {
                     'sticky-right': true,
                     'sticky-right-edge': relativeIdx === 0,
                     'is-scrolled-right': relativeIdx === 0 && this._scrolledRight,
-                }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) } }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this._resizable && (
+                }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) }, ref: col.hasDropdown === true ? (el => { this.dropdownThRefs[col.name] = el; }) : undefined }, h("div", { class: `th__content th__content--${col.align || 'left'}` }, h("div", { class: "th__content--label" }, col.label), col.icon && (h("sd-icon", { name: col.icon, size: "12", color: resolveTableIconColor(col.icon, col.iconColor) })), col.sort && (h("sd-icon", { name: resolveSortIconName(col.sort), size: "12", color: resolveTableIconColor(resolveSortIconName(col.sort), col.iconColor), onClick: () => this.handleColumnSort(col), style: { cursor: 'pointer' } })), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text)))))), col.hasDropdown === true && (h("button", { class: {
+                    'th__dropdown-trigger': true,
+                    'th__dropdown-trigger--open': this.dropdownOpenMap[col.name] === true,
+                }, ref: el => { this.dropdownRefs[col.name] = el; }, onClick: () => this.toggleDropdown(col.name), "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpenMap[col.name] === true ? 'true' : 'false' }, h("sd-icon", { name: "chevronDown", size: "12" })))), this._resizable && (
             // column resize 는 마우스 드래그 전용 인터랙션이라 키보드 핸들러를 두지 않는다.
             // eslint-disable-next-line jsx-a11y/no-static-element-interactions
             h("div", { class: "th__resizer th__resizer--left", onMouseDown: (evt) => this.handleResize(actualColIdx, evt, true) }))));

package/dist/types/components/sd-table/constants.d.ts

@@ -19,6 +19,7 @@ export interface SdTableColumn {
     maxWidth?: number;
     thStyle?: Record<string, any>;
     thClass?: string;
+    hasDropdown?: boolean;
 }
 export interface Row {
     [key: string]: any;

package/dist/types/components/sd-table/sd-table.stories.helpers.d.ts

@@ -25,5 +25,15 @@ export declare class StoryVirtualTable extends LitElement {
 declare global {
     interface HTMLElementTagNameMap {
         'story-virtual-table': StoryVirtualTable;
+        'story-dropdown-table': StoryDropdownTable;
     }
 }
+export declare class StoryDropdownTable extends LitElement {
+    createRenderRoot(): this;
+    private roleFilter;
+    private statusFilter;
+    constructor();
+    private get displayRows();
+    private itemStyle;
+    render(): TemplateResult<1>;
+}

package/dist/types/components/sd-table/sd-thead/sd-thead.d.ts

@@ -32,10 +32,16 @@ export declare class SdThead {
     private _stickyHeader;
     private _scrolledLeft;
     private _scrolledRight;
+    private dropdownOpenMap;
     private tableEl;
+    private dropdownRefs;
+    private dropdownThRefs;
+    private dropdownPortals;
     handleColumnsChange(newCols?: SdTableColumn[]): void;
+    disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    private initDropdownPortals;
     private syncTableContext;
     private resolveConfig;
     /** 테이블 설정을 다시 불러옵니다. */
@@ -48,6 +54,8 @@ export declare class SdThead {
     private getStickyStyle;
     private handleResize;
     private handleColumnSort;
+    private toggleDropdown;
+    private closeDropdown;
     private handleSelectAll;
     private getIsAllChecked;
     render(): any;