@sellmate/design-system 1.18.0 → 1.19.0

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

@@ -1 +0,0 @@
-import{r as i,c as t,a as s,h as e}from"./p-CAxodB5I.js";import{n}from"./p-CCwNgVmC.js";import{s as h}from"./p-BJfiMC9H.js";import{l as d,a as p}from"./p-U8VaRj9c.js";import{C as o,a,b as r}from"./p-DDj5KTBF.js";var l={minHeight:"36",paddingX:"12",paddingY:"6",radius:"4",typography:{fontFamily:"Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",fontWeight:"400",fontSize:"12",lineHeight:"20"}},c={minHeight:"40",paddingX:"16",paddingY:"8",radius:"6",typography:{fontFamily:"Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",fontWeight:"400",fontSize:"14",lineHeight:"24"}},u={placeholder:"#AAAAAA"};const g={sm:{minHeight:l.minHeight,paddingX:l.paddingX,paddingY:l.paddingY,radius:l.radius,fontSize:l.typography.fontSize,lineHeight:l.typography.lineHeight,fontWeight:l.typography.fontWeight,fontFamily:l.typography.fontFamily},md:{minHeight:c.minHeight,paddingX:c.paddingX,paddingY:c.paddingY,radius:c.radius,fontSize:c.typography.fontSize,lineHeight:c.typography.lineHeight,fontWeight:c.typography.fontWeight,fontFamily:c.typography.fontFamily}},f={text:{placeholder:u.placeholder}},m={chipGap:`${{gap:"8"}.gap}px`},v=h.typography.feedback.sm.regular,b={fontSize:`${v.fontSize}px`,fontWeight:`${v.fontWeight}`,color:u.placeholder},y=p.listItem,x={radius:`${d.listBox.radius}px`,maxHeight:"260px",itemPaddingY:`${y.paddingY}px`,itemPaddingX:`${y.paddingLeft.depth1}px`,itemPaddingRight:`${y.paddingRight}px`,itemGap:`${y.gap}px`,itemFontSize:`${y.typography.default.fontSize}px`,itemFontWeight:y.typography.default.fontWeight,itemFontWeightSelected:y.typography.selected.fontWeight,itemLineHeight:`${y.typography.default.lineHeight}px`,itemFontFamily:y.typography.default.fontFamily,itemColor:y.content.default,itemColorHover:y.content.hover,itemBgHover:y.bg.hover,emptyColor:"#888888",emptyFontSize:"12px",emptyLineHeight:"20px"},w=class{constructor(s){i(this,s),this.update=t(this,"sdUpdate",7),this.focusEvent=t(this,"sdFocus",7),this.blurEvent=t(this,"sdBlur",7),this.inputEvent=t(this,"sdInput",7)}static SUGGESTIONS_VIEWPORT_PADDING=8;get host(){return s(this)}values=[];errors=[];disabledChips=[];size="sm";disabled=!1;placeholder="입력해 주세요.";name=n();rules=[];error=!1;useReset=!1;maxCount;suggestions=[];loadingSuggestions=!1;recommendedItems=[];loadingRecommendedItems=!1;label="";labelWidth="";hint="";errorMessage="";width="";status;icon=void 0;labelTooltip="";labelTooltipProps=null;internalValues=[];internalErrors=[];focused=!1;hovered=!1;inputValue="";activeSuggestionIndex=-1;suppressSuggestions=!1;suppressRecommendations=!1;inputEl;formField;chipInputRef;get value(){return this.internalValues}valuesChanged(i){this.internalValues=Array.isArray(i)?[...i]:[]}errorsChanged(i){Array.isArray(i)&&(this.internalErrors=[...i])}suggestionsChanged(i){Array.isArray(i)||(this.suggestions=[]),this.activeSuggestionIndex=-1,this.suppressSuggestions=!1}recommendedItemsChanged(i){Array.isArray(i)||(this.recommendedItems=[]),this.activeSuggestionIndex=-1}componentWillLoad(){this.internalValues=Array.isArray(this.values)?[...this.values]:[],Array.isArray(this.errors)&&(this.internalErrors=[...this.errors]),this.inputValue=this.inputValue??""}getChipError(i){return"function"==typeof this.errors?this.errors(this.internalValues?.[i]??""):this.internalErrors?.[i]??!1}getChipDisabled(i){return!!this.disabled||("function"==typeof this.disabledChips?this.disabledChips(this.internalValues?.[i]??""):this.disabledChips?.[i]??!1)}update;focusEvent;blurEvent;inputEvent;async sdValidate(){return this.formField?.sdValidate()}async sdReset(){return this.formField?.sdReset()}async sdResetValidate(){return this.formField?.sdResetValidation()}async sdFocus(){return this.formField?.sdFocus()}addChip=i=>{if(null!=this.maxCount&&this.internalValues.length>=this.maxCount)return;const t=[...this.internalValues,i];if(this.internalValues=t,this.values=t,Array.isArray(this.errors)){const i=[...this.internalErrors,!1];this.internalErrors=i,this.errors=i}Array.isArray(this.disabledChips)&&(this.disabledChips=[...this.disabledChips,!1]),null!=this.inputEl&&(this.inputEl.value=""),this.inputValue="",this.activeSuggestionIndex=-1,this.suppressSuggestions=!0,this.update.emit(t),this.inputEvent.emit(""),this.inputEl?.focus(),this.suppressRecommendations=!0};handleChipRemove=i=>{const t=this.internalValues.filter(((t,s)=>s!==i));if(this.internalValues=t,this.values=t,Array.isArray(this.errors)){const t=this.internalErrors.filter(((t,s)=>s!==i));this.internalErrors=t,this.errors=t}Array.isArray(this.disabledChips)&&(this.disabledChips=this.disabledChips.filter(((t,s)=>s!==i))),this.update.emit(t),this.inputEl?.focus(),this.suppressRecommendations=!0};handleKeyDown=i=>{const t=i.target,s=this.suggestions??[],e=this.recommendedItems??[],n=this.focused&&""!==this.inputValue&&!this.suppressSuggestions&&(s.length>0||this.loadingSuggestions),h=this.focused&&""===this.inputValue&&!this.suppressRecommendations&&(e.length>0||this.loadingRecommendedItems),d=n?s:e;if(n||h){if("ArrowDown"===i.key)return i.preventDefault(),void(this.activeSuggestionIndex=Math.min(this.activeSuggestionIndex+1,d.length-1));if("ArrowUp"===i.key)return i.preventDefault(),void(this.activeSuggestionIndex=Math.max(this.activeSuggestionIndex-1,-1));if("Escape"===i.key)return n&&(this.suppressSuggestions=!0),h&&(this.suppressRecommendations=!0),void(this.activeSuggestionIndex=-1);if("Enter"===i.key&&this.activeSuggestionIndex>=0)return i.preventDefault(),void this.addChip(d[this.activeSuggestionIndex])}if("Enter"!==i.key||i.isComposing||""===t.value.trim()){if("Backspace"===i.key&&""===t.value&&this.internalValues.length>0){if(this.getChipDisabled(this.internalValues.length-1))return;i.preventDefault();const t=this.internalValues.slice(0,-1);if(this.internalValues=t,this.values=t,Array.isArray(this.errors)){const i=this.internalErrors.slice(0,-1);this.internalErrors=i,this.errors=i}Array.isArray(this.disabledChips)&&(this.disabledChips=this.disabledChips.slice(0,-1)),this.update.emit(t)}}else{if(null!=this.maxCount&&this.internalValues.length>=this.maxCount)return;i.preventDefault(),this.addChip(t.value.trim())}};handleInput=i=>{const t=i.target.value,s=""===t;""===this.inputValue!==s&&(this.activeSuggestionIndex=-1,s&&(this.suppressRecommendations=!1)),this.inputValue=t,this.suppressSuggestions=!1,this.inputEvent.emit(t)};handleFocus=()=>{this.focused=!0,this.suppressRecommendations=!1,this.focusEvent.emit()};handleBlur=()=>{this.focused=!1,this.activeSuggestionIndex=-1,this.blurEvent.emit()};closeSuggestions=()=>{this.focused=!1,this.activeSuggestionIndex=-1,this.suppressSuggestions=!0,this.suppressRecommendations=!0};handleContainerClick=()=>{this.disabled||this.inputEl?.focus()};handleResetInput=()=>{const i=this.internalValues.reduce(((i,t,s)=>(this.getChipDisabled(s)&&i.push(s),i)),[]),t=i.map((i=>this.internalValues[i]));if(this.internalValues=t,this.values=t,Array.isArray(this.errors)){const t=i.map((i=>this.internalErrors[i]??!1));this.internalErrors=t,this.errors=t}else this.internalErrors=[];if(Array.isArray(this.disabledChips)){const t=this.disabledChips;this.disabledChips=i.map((i=>t[i]))}this.update.emit(t),this.inputEl?.focus()};render(){const i=g[this.size]??g.sm,t={[`--sd-system-size-field-${this.size}-height`]:"auto",[`--sd-system-radius-field-${this.size}`]:`${i.radius}px`,"--sd-chip-input-min-height":`${i.minHeight}px`,"--sd-chip-input-padding-x":`${i.paddingX}px`,"--sd-chip-input-padding-y":`${i.paddingY}px`,"--sd-chip-input-font-size":`${i.fontSize}px`,"--sd-chip-input-line-height":`${i.lineHeight}px`,"--sd-chip-input-font-weight":i.fontWeight,"--sd-chip-input-font-family":i.fontFamily,"--sd-chip-input-chip-gap":m.chipGap,"--sd-chip-input-placeholder-color":f.text.placeholder,"--sd-chip-input-reset-gap":m.chipGap,"--sd-chip-input-divider-color":"#E1E1E1","--sd-chip-input-field-height":r.height,"--sd-chip-input-field-padding-x":r.paddingX,"--sd-chip-input-field-radius":r.radius,"--sd-chip-input-field-border-width":r.borderWidth,"--sd-chip-input-field-bg":a.bg.default,"--sd-chip-input-field-border-color":"transparent","--sd-chip-input-field-content":a.content.focus,"--sd-chip-input-field-font-size":o.focus.fontSize,"--sd-chip-input-field-font-weight":o.focus.fontWeight,"--sd-chip-input-field-line-height":o.focus.lineHeight,"--sd-chip-input-field-font-family":o.focus.fontFamily,"--sd-chip-input-max-count-font-size":b.fontSize,"--sd-chip-input-max-count-font-weight":b.fontWeight,"--sd-chip-input-max-count-color":b.color,"--sd-chip-input-suggestions-radius":x.radius,"--sd-chip-input-suggestions-max-height":x.maxHeight,"--sd-chip-input-suggestion-padding-y":x.itemPaddingY,"--sd-chip-input-suggestion-padding-x":x.itemPaddingX,"--sd-chip-input-suggestion-padding-right":x.itemPaddingRight,"--sd-chip-input-suggestion-gap":x.itemGap,"--sd-chip-input-suggestion-font-size":x.itemFontSize,"--sd-chip-input-suggestion-font-weight":x.itemFontWeight,"--sd-chip-input-suggestion-font-weight-selected":x.itemFontWeightSelected,"--sd-chip-input-suggestion-line-height":x.itemLineHeight,"--sd-chip-input-suggestion-font-family":x.itemFontFamily,"--sd-chip-input-suggestion-color":x.itemColor,"--sd-chip-input-suggestion-color-hover":x.itemColorHover,"--sd-chip-input-suggestion-bg-hover":x.itemBgHover,"--sd-chip-input-suggestions-empty-color":x.emptyColor,"--sd-chip-input-suggestions-empty-font-size":x.emptyFontSize,"--sd-chip-input-suggestions-empty-line-height":x.emptyLineHeight},s=null!=this.maxCount&&this.internalValues.length>=this.maxCount,n=this.useReset&&this.internalValues.length>0||null!=this.maxCount,h=this.suggestions??[],d=this.recommendedItems??[],p=this.focused&&""!==this.inputValue&&!this.suppressSuggestions&&(h.length>0||this.loadingSuggestions),l=p||this.focused&&""===this.inputValue&&!this.suppressRecommendations&&(d.length>0||this.loadingRecommendedItems),c=p?h:d,u=p?this.loadingSuggestions&&0===h.length:this.loadingRecommendedItems&&0===d.length,v={width:`${this.chipInputRef?.offsetWidth??0}px`,display:"flex",flexDirection:"column",boxSizing:"border-box",background:"#FFFFFF",borderRadius:x.radius,boxShadow:"2px 2px 12px 2px rgba(0, 0, 0, 0.1)",maxHeight:x.maxHeight,minHeight:"0",overflowY:"auto",overflowX:"hidden",outline:"none"},y={display:"flex",alignItems:"center",gap:x.itemGap,padding:`${x.itemPaddingY} ${x.itemPaddingRight} ${x.itemPaddingY} ${x.itemPaddingX}`,fontSize:x.itemFontSize,lineHeight:x.itemLineHeight,fontWeight:x.itemFontWeight,fontFamily:x.itemFontFamily,color:x.itemColor,cursor:"pointer",userSelect:"none",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},_={padding:"12px",textAlign:"center",fontSize:x.emptyFontSize,lineHeight:x.emptyLineHeight,fontFamily:x.itemFontFamily,color:x.emptyColor};return e("sd-field",{key:"6ff0688cd9a076cd81693364bfeb6a98b5bf018e",name:this.name,label:this.label,labelWidth:this.labelWidth,hint:this.hint,errorMessage:this.errorMessage,rules: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:i=>this.formField=i,style:t,onMouseEnter:()=>this.hovered=!0,onMouseLeave:()=>this.hovered=!1},e("div",{key:"0c6ae92de4dcb44ed4fbcd12f1dddef93cec12db",class:"sd-chip-input",ref:i=>this.chipInputRef=i,onClick:this.handleContainerClick},(this.internalValues??[]).map(((i,t)=>e("sd-chip",{key:t,value:i,error:this.getChipError(t),disabled:this.getChipDisabled(t),editable:!1,onSdRemove:()=>this.handleChipRemove(t)}))),!s&&e("div",{key:"df111f3110b444ed296db8c6b7f00d9209f858af",class:{"sd-chip-input__field":!0,"sd-chip-input__field--filled":""!==this.inputValue,"sd-chip-input__field--empty":""===this.inputValue&&this.internalValues.length>0&&!this.focused},"data-value":""!==this.inputValue?this.inputValue:0===this.internalValues.length?this.placeholder:""},e("input",{key:"8e170c84cedab36edbdd0a84e7e2e1ac0fba9632",ref:i=>this.inputEl=i,class:"sd-chip-input__input",placeholder:0===this.internalValues.length?this.placeholder:"",disabled:this.disabled,size:1,onInput:this.handleInput,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur})),n&&e("div",{key:"5b30bb4f89c9d3c9b18870acccad22bd97e1d748",class:"sd-chip-input__reset"},""===this.inputValue&&e("span",{key:"6fbf74a5a77b70789a609d28f5c4b6dd2aab57ef",class:"sd-chip-input__divider"}),null!=this.maxCount&&e("span",{key:"fbb21a27bdd2aa38870cfd8d16b7e5293769eaf3",class:"sd-chip-input__max-count"},"최대 ",this.maxCount,"개"),this.useReset&&this.internalValues.length>0&&e("sd-text-link",{key:"83626145602b13d7a00ef955a6db59f41c152529",icon:"reset",iconColor:"#888888",label:"입력 초기화",underline:!0,disabled:this.disabled,style:{"--sd-text-link-color":"#555555"},onSdClick:this.handleResetInput})),l&&e("sd-portal",{key:"1682a89b513098f192f776af782aa9ee432574e8",open:l,parentRef:this.chipInputRef??null,viewportPadding:w.SUGGESTIONS_VIEWPORT_PADDING,onSdClose:this.closeSuggestions},e("div",{key:"3efb484bd5616e411824f7014a759a34a9e93d8b",class:"sd-chip-input__suggestions",role:"listbox",style:v},u&&e("div",{key:"b5b1d5e6db03f6fe60864b6c19e9b2c753468447",class:"sd-chip-input__suggestions-empty",style:_},"불러오는 중..."),c.map(((i,t)=>e("div",{key:i,class:{"sd-chip-input__suggestion-item":!0,"sd-chip-input__suggestion-item--active":t===this.activeSuggestionIndex},role:"option",tabIndex:-1,"aria-selected":t===this.activeSuggestionIndex,style:t===this.activeSuggestionIndex?{...y,background:x.itemBgHover,color:x.itemColorHover,fontWeight:x.itemFontWeightSelected}:y,onMouseDown:t=>{t.preventDefault(),this.addChip(i)}},i)))))))}static get watchers(){return{values:[{valuesChanged:0}],errors:[{errorsChanged:0}],suggestions:[{suggestionsChanged:0}],recommendedItems:[{recommendedItemsChanged:0}]}}};w.style="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;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)}";export{w as sd_chip_input}

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

@@ -1 +0,0 @@
-import{r as e,c as t,h as l}from"./p-CAxodB5I.js";import{s as a}from"./p-BJfiMC9H.js";import{t as d}from"./p-D6GUzecR.js";const s=d.table,r=Number(s.keyValue.height),i=Number(s.radius),n=Number(s.keyValue.body.padding),o=Number(s.header.gap),u=Number(s.content.gap),v=Number(s.border.width),b=Number(s.keyValue.search.paddingX),k={border:s.border.color,thBg:s.header.bg,thLabel:a.color.fg.primary,required:a.color.fg.accent,helpIcon:a.color.fg.success,tdBg:a.color.bg.frame,tdText:a.color.fg.primary,searchBg:s.keyValue.search.bg},h={labelFontFamily:s.header.typography.fontFamily,labelFontSize:Number(s.header.typography.fontSize),labelFontWeight:700,labelLineHeight:Number(s.header.typography.lineHeight),tdFontFamily:s.body.typography.fontFamily,tdFontSize:Number(s.body.typography.fontSize),tdFontWeight:Number(s.body.typography.fontWeight),tdLineHeight:Number(s.body.typography.lineHeight)},c=class{constructor(l){e(this,l),this.change=t(this,"sdChange",7),this.searchEvent=t(this,"sdSearch",7)}fields=[];search=!1;useTop=!1;change;searchEvent;emit=(e,t)=>{this.change.emit({name:e,value:t})};handleSearchClick=()=>{this.searchEvent.emit()};renderField(e){const t=t=>this.emit(e.name,t.detail);switch(e.type){case"input":return l("sd-input",{width:"100%",...e.options??{},onSdUpdate:t});case"textarea":return l("sd-textarea",{width:"100%",...e.options??{},onSdUpdate:t});case"number-input":return l("sd-number-input",{width:"100%",...e.options??{},onSdUpdate:t});case"select":return l("sd-select",{width:"100%",...e.options??{},onSdUpdate:t});case"radio":{const{value:a,direction:d,...s}=e.options??{};return l("sd-radio-group",{...s,value:a,direction:d??"horizontal",onSdUpdate:t})}case"checkbox":{const{value:a,...d}=e.options??{};return l("sd-checkbox",{...d,value:a,onSdUpdate:t})}case"date-picker":return l("sd-date-picker",{width:"100%",...e.options??{},onSdUpdate:t});case"date-range-picker":return l("sd-date-range-picker",{width:"100%",...e.options??{},onSdUpdate:t});case"file-picker":return l("sd-file-picker",{width:"100%",...e.options??{},onSdUpdate:t});default:return l("span",{class:"sd-key-value-table__text"},e.options?.value??"")}}renderHelpIcon(e){return l("span",{class:"sd-key-value-table__help"},l("sd-tooltip",{icon:"helpOutline",iconSize:16,color:k.helpIcon,trigger:"hover"},e))}computeAutoSkipTh(){const e=this.fields.map((e=>e.map((()=>!1))));return this.fields.forEach(((t,l)=>{t.forEach(((t,a)=>{const d=null!=t.thRowSpan&&t.thRowSpan>1?t.thRowSpan:1;if(!(d<=1))for(let t=1;t<d;t++){const d=e[l+t];d&&a<d.length&&(d[a]=!0)}}))})),e}computeMaxCols(e){let t=0;return this.fields.forEach(((l,a)=>{let d=0;l.forEach(((t,l)=>{let s;s=t.hideTh?0:e[a]?.[l]?1:null!=t.thColSpan&&t.thColSpan>1?t.thColSpan:1,d+=s+(null!=t.tdColSpan&&t.tdColSpan>1?t.tdColSpan:1)})),d>t&&(t=d)})),t}buildThStyle(e){const t={...e};return null!=e.color&&(t["--sd-kvt-th-color"]=e.color),null!=e.background&&(t["--sd-kvt-th-bg"]=e.background),null!=e.backgroundColor&&(t["--sd-kvt-th-bg"]=e.backgroundColor),null!=e.fontFamily&&(t["--sd-kvt-label-font-family"]=e.fontFamily),null!=e.fontSize&&(t["--sd-kvt-label-font-size"]=e.fontSize),null!=e.fontWeight&&(t["--sd-kvt-label-font-weight"]=e.fontWeight),null!=e.lineHeight&&(t["--sd-kvt-label-line-height"]=e.lineHeight),t}renderTh(e,t,a){const d=null!=e.thRowSpan&&e.thRowSpan>1?e.thRowSpan:void 0,s=null!=e.thColSpan&&e.thColSpan>1?e.thColSpan:void 0,r={"sd-key-value-table__th":!0};"string"==typeof e.thClass?r[e.thClass]=!0:Array.isArray(e.thClass)&&e.thClass.forEach((e=>r[e]=!0));const i=null!=e.thStyle?this.buildThStyle(e.thStyle):void 0;return l("th",{key:`th-${t}-${a}`,class:r,style:i,scope:"row",rowSpan:d,colSpan:s},l("div",{class:"sd-key-value-table__th-inner"},l("span",{class:"sd-key-value-table__label"},e.label,e.required&&l("sd-icon",{class:"sd-key-value-table__required",name:"star",size:12,color:k.required,label:"required"})),e.helpText&&this.renderHelpIcon(e.helpText)))}renderTd(e,t,a){return l("td",{key:`td-${t}-${a}`,class:"sd-key-value-table__td",rowSpan:null!=e.tdRowSpan&&e.tdRowSpan>1?e.tdRowSpan:void 0,colSpan:null!=e.tdColSpan&&e.tdColSpan>1?e.tdColSpan:void 0},l("div",{class:"sd-key-value-table__td-inner"},l("slot",{name:`field-${e.name}`},this.renderField(e))))}warnDuplicateNames(){const e=new Set,t=new Set;this.fields.forEach((l=>l.forEach((l=>{e.has(l.name)?t.add(l.name):e.add(l.name)})))),t.size>0&&console.warn(`[sd-key-value-table] Duplicate field name(s) detected: ${[...t].join(", ")}. Slot names ("field-{name}") and sdChange events rely on unique names.`)}render(){if(0===this.fields.length)return null;const e={"--sd-kvt-row-height":`${r}px`,"--sd-kvt-th-width":"120px","--sd-kvt-radius":`${i}px`,"--sd-kvt-padding":`${n}px`,"--sd-kvt-gap":`${o}px`,"--sd-kvt-label-gap":`${u}px`,"--sd-kvt-border-width":`${v}px`,"--sd-kvt-border-color":k.border,"--sd-kvt-th-bg":k.thBg,"--sd-kvt-th-color":k.thLabel,"--sd-kvt-required-color":k.required,"--sd-kvt-td-bg":k.tdBg,"--sd-kvt-td-color":k.tdText,"--sd-kvt-label-font-family":h.labelFontFamily,"--sd-kvt-label-font-size":`${h.labelFontSize}px`,"--sd-kvt-label-font-weight":`${h.labelFontWeight}`,"--sd-kvt-label-line-height":`${h.labelLineHeight}px`,"--sd-kvt-td-font-family":h.tdFontFamily,"--sd-kvt-td-font-size":`${h.tdFontSize}px`,"--sd-kvt-td-font-weight":`${h.tdFontWeight}`,"--sd-kvt-td-line-height":`${h.tdLineHeight}px`,"--sd-kvt-search-bg":k.searchBg,"--sd-kvt-search-padding-x":`${b}px`};this.warnDuplicateNames();const t=this.computeAutoSkipTh(),a=this.computeMaxCols(t),d=l("table",{class:{"sd-key-value-table":!0,"sd-key-value-table--use-top":this.useTop},style:e},l("colgroup",null,Array.from({length:a},((e,t)=>{if(t%2!=0)return l("col",{key:`col-${t}`});const a=t/2,d=this.fields.reduce(((e,t)=>null!=e?e:t[a]?.thWidth),void 0);return l("col",{key:`col-${t}`,style:{width:null!=d?"number"==typeof d?`${d}px`:d:"120px"}})}))),l("tbody",null,this.fields.map(((e,a)=>l("tr",{class:"sd-key-value-table__row",key:`row-${a}`},e.map(((e,l)=>[e.hideTh||t[a][l]?null:this.renderTh(e,a,l),this.renderTd(e,a,l)])))))));return this.search?l("div",{class:{"sd-key-value-table__wrapper":!0,"sd-key-value-table__wrapper--use-top":this.useTop},style:e},d,l("div",{class:"sd-key-value-table__search-panel"},l("sd-button",{label:"검색",name:"neutral_outline_md",onSdClick:this.handleSearchClick}))):d}};c.style="sd-key-value-table{display:block}sd-key-value-table .sd-key-value-table__wrapper{display:flex;align-items:stretch;width:100%;border:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color);border-radius:var(--sd-kvt-radius);overflow:hidden}sd-key-value-table .sd-key-value-table__wrapper .sd-key-value-table{flex:1 1 auto;border:0;border-radius:0}sd-key-value-table .sd-key-value-table__wrapper.sd-key-value-table__wrapper--use-top{border-top-left-radius:0;border-top-right-radius:0}sd-key-value-table .sd-key-value-table__search-panel{display:flex;align-items:center;justify-content:center;flex:0 0 auto;padding:var(--sd-kvt-padding) var(--sd-kvt-search-padding-x);background:var(--sd-kvt-search-bg);border-left:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color)}sd-key-value-table .sd-key-value-table{width:100%;table-layout:fixed;border:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color);border-radius:var(--sd-kvt-radius);border-collapse:separate;border-spacing:0;overflow:hidden}sd-key-value-table .sd-key-value-table.sd-key-value-table--use-top{border-top-left-radius:0;border-top-right-radius:0}sd-key-value-table .sd-key-value-table__th,sd-key-value-table .sd-key-value-table__td{height:var(--sd-kvt-row-height);padding:var(--sd-kvt-padding);box-sizing:border-box;vertical-align:middle;text-align:left;font-weight:normal;border-top:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color)}sd-key-value-table .sd-key-value-table tbody>tr:first-child>.sd-key-value-table__th,sd-key-value-table .sd-key-value-table tbody>tr:first-child>.sd-key-value-table__td{border-top:0}sd-key-value-table .sd-key-value-table__th{width:var(--sd-kvt-th-width);background:var(--sd-kvt-th-bg);color:var(--sd-kvt-th-color)}sd-key-value-table .sd-key-value-table__th-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sd-kvt-gap);width:100%;height:100%}sd-key-value-table .sd-key-value-table__label{display:inline-flex;align-items:center;gap:var(--sd-kvt-label-gap);font-family:var(--sd-kvt-label-font-family);font-size:var(--sd-kvt-label-font-size);font-weight:var(--sd-kvt-label-font-weight);line-height:var(--sd-kvt-label-line-height);color:var(--sd-kvt-th-color)}sd-key-value-table .sd-key-value-table__required{display:inline-flex;align-items:center;flex-shrink:0}sd-key-value-table .sd-key-value-table__help{display:inline-flex;align-items:center;flex-shrink:0}sd-key-value-table .sd-key-value-table__td{background:var(--sd-kvt-td-bg);color:var(--sd-kvt-td-color)}sd-key-value-table .sd-key-value-table__td-inner{display:flex;align-items:center;width:100%;height:100%}sd-key-value-table .sd-key-value-table__td-inner>slot{display:block;flex:1 1 auto;min-width:0}sd-key-value-table .sd-key-value-table__td-inner sd-input,sd-key-value-table .sd-key-value-table__td-inner sd-textarea,sd-key-value-table .sd-key-value-table__td-inner sd-number-input,sd-key-value-table .sd-key-value-table__td-inner sd-select,sd-key-value-table .sd-key-value-table__td-inner sd-date-picker,sd-key-value-table .sd-key-value-table__td-inner sd-date-range-picker,sd-key-value-table .sd-key-value-table__td-inner sd-file-picker{width:100%}sd-key-value-table .sd-key-value-table__text{font-family:var(--sd-kvt-td-font-family);font-size:var(--sd-kvt-td-font-size);font-weight:var(--sd-kvt-td-font-weight);line-height:var(--sd-kvt-td-line-height);color:var(--sd-kvt-td-color)}";export{c as sd_key_value_table}