@sellmate/design-system 1.0.21 → 1.0.23

package/dist/design-system/p-fc0e636b.entry.js

@@ -1 +0,0 @@
-import{r as e,c as t,a as s,h as i}from"./p-C_an1PQ3.js";import{B as l,n as o,S as n}from"./p-D8-D-mJX.js";const r=class extends l{constructor(s){super(),e(this,s),this.update=t(this,"sdUpdate"),this.dropDownShow=t(this,"sdDropDownShow")}get el(){return s(this)}value=null;options=[];placeholder="선택";optionPlaceholder="선택지가 없습니다.";width="200px";dropdownHeight="260px";autoFocus=!1;disabled=!1;clearable=!1;searchable=!1;useAll=!1;useCheckbox=!1;label="";useLabelRequired=!1;labelTooltip="";labelTooltipProps=null;rules=[];error=!1;optionRenderer;isOpen=!1;itemIndex=-1;isScrolled=!1;update;dropDownShow;selectRef;triggerRef;formField;filteredOptions=this.options;dropDownWidth=this.width;name=o();async sdOpen(){this.isOpen=!0}async sdValidate(){this.formField?.sdValidate()}async sdReset(){this.formField?.sdReset()}async sdResetValidate(){this.formField?.sdResetValidation()}async sdFocus(){this.formField?.sdFocus()}async isOpenChanged(){this.onDropdownToggle(this.isOpen),this.dropDownShow?.emit({isOpen:this.isOpen}),!1===this.isOpen&&await(this.formField?.sdValidate())}componentWillLoad(){this.initializeEvent()}componentDidLoad(){this.autoFocus&&this.selectRef?.focus()}componentDidRender(){const e=this.triggerRef,t=e?.getBoundingClientRect();this.dropDownWidth=t?.width?`${t.width}px`:this.width}disconnectedCallback(){this.cleanupEvent()}handleDocumentClick(e){this.selectRef?.contains(e.target)||(this.isOpen=!1)}handleDocumentKeydown(e){if(e.stopPropagation(),["ArrowDown","ArrowUp","Enter","Escape"].includes(e.key))switch(e.preventDefault(),e.key){case"ArrowDown":case"ArrowUp":const t=new n(this.searchable,this.filteredOptions).getNextIndex(this.itemIndex,e.key);this.itemIndex=t;break;case"Enter":const s=this.filteredOptions[this.itemIndex];s&&!s.disabled&&this.handleOptionSelection(s);break;case"Escape":this.isOpen=!1}}handleOptionSelection=e=>{if(!e||e.disabled)return;const t=this.value?.some((t=>t.value===e.value));this.value=t?this.value?.filter((t=>t.value!==e.value))||null:[...this.value||[],e],this.update?.emit(this.value)};getSelectedOption(){return this.options.filter((e=>this.value?.includes(e)))}closeDropdown(){this.isOpen=!1}handleTriggerClick=e=>{e.stopPropagation(),this.disabled||(this.isOpen=!this.isOpen,this.dropDownShow?.emit({isOpen:this.isOpen}))};handleOptionClick=e=>{const{option:t,event:s}=e;s.stopPropagation(),this.handleOptionSelection(t)};render(){return i("sd-field",{key:"e445d2c3f80d78be0e74b1f54371eb27d9c316e8",label:this.label,name:this.name,rules:this.rules,error:this.error,disabled:this.disabled,useLabelRequired:this.useLabelRequired,labelTooltip:this.labelTooltip,labelTooltipProps:this.labelTooltipProps,ref:e=>this.formField=e},i("div",{key:"9fad0ed744cafb9e1e5f16ee413f36edd8f2c1f3",class:{"sd-select-multiple":!0,"sd-select-multiple--open":this.isOpen,"sd-select-multiple--disabled":this.disabled,"sd-select-multiple--error":!!this.error},ref:e=>this.selectRef=e},this.renderTrigger(),this.renderDropdown()))}renderTrigger(){const e=this.getSelectedOption();return i("div",{class:"sd-select-multiple__trigger",tabindex:this.disabled?-1:0,onClick:this.handleTriggerClick,ref:e=>this.triggerRef=e},i("span",{class:"sd-select-multiple__value"},e&&0!==e.length?e.map((e=>e.label)).join(", "):this.placeholder),this.clearable&&e?.length>0&&!this.disabled&&i("sd-icon",{key:"close-icon",name:"close",size:10,color:"#888",class:"sd-select-multiple__clear",onClick:async e=>{e.stopPropagation(),this.value=null,await(this.formField?.sdValidate())}}),i("sd-icon",{key:"arrow-icon",name:"arrowDown",color:"#888",class:{"sd-select-multiple__arrow":!0,"sd-select-multiple__arrow--open":this.isOpen}}))}renderDropdown(){if(!1===this.isOpen)return null;const e=this.selectRef?.querySelector(".sd-select-multiple__trigger")||this.selectRef;return i("sd-portal",{open:this.isOpen,parentRef:e,onSdClose:this.closeDropdown},i("sd-select-dropdown",{value:this.value,options:this.options,itemIndex:this.itemIndex,width:this.dropDownWidth,dropdownHeight:this.dropdownHeight,searchable:this.searchable,optionPlaceholder:this.optionPlaceholder,useCheckbox:this.useCheckbox,useAll:this.useAll,onSdOptionClick:({detail:e})=>this.handleOptionClick(e),onSdOptionFiltered:({detail:e})=>this.filteredOptions=e}))}static get watchers(){return{isOpen:[{isOpenChanged:0}]}}};r.style="sd-select-multiple{display:inline-flex;flex-flow:column nowrap;height:fit-content}sd-select-multiple *:focus,sd-select-multiple *:focus-visible,sd-select-multiple *:focus-within{outline:none !important}sd-select-multiple .sd-select-multiple{width:100%}sd-select-multiple .sd-select-multiple .sd-select-multiple__trigger{padding:4px 28px 4px 12px;display:flex;width:100%;align-items:center}sd-select-multiple .sd-select-multiple .sd-select-multiple__trigger .sd-select-multiple__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}sd-select-multiple .sd-select-multiple .sd-select-multiple__trigger .sd-select-multiple__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}sd-select-multiple .sd-select-multiple__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease;margin-left:8px}sd-select-multiple .sd-select-multiple__arrow--open{transform:rotate(180deg)}";export{r as sd_select_multiple}