@shtabapp/ui-kit 1.74.0 → 1.76.0

package/dist/SSelect-DyngcoP9.cjs

@@ -0,0 +1 @@
+const e=require("./SButton-BCgdXE_B.cjs"),t=require("./useSelectionGroup-NJvi3hNo.cjs"),n=require("./useAriaAttrs-D748yeJ_.cjs"),r=require("./SDropdown-B8Z4oNMk.cjs"),i=require("./SDropdownMenu-k9SxaFVH.cjs"),a=require("./SInput-fT-S-Tko.cjs"),o=require("./SListItem-DMjtJXxV.cjs"),s=require("./SList-Vg9nx1oe.cjs");let c=require("vue"),l=require("@shtabapp/ui-kit-primitives");var u=({listItemScope:e,itemTitle:t,itemSubtitle:n,itemDisabled:r,itemIconLeft:i,listActiveKey:a,isOptionSelected:o})=>{let c=e.item;return{rowKey:e.key,title:s.i(c,t),subtitle:s.i(c,n),disabled:s.n(c,r),iconLeft:s.r(c,i),selected:o,active:a===e.key,revealRight:e.revealRight,tiny:!0}},d=e=>typeof e==`string`||typeof e==`number`,f=(e,t)=>{let n=e[t];if(d(n))return n},p=e=>typeof e==`string`?e:String(e),m=e=>e==null?!1:typeof e==`string`?e.length>0:!0,h=(e,t,n)=>t.find(t=>p(f(t,n)??``)===e),g=e=>typeof e==`object`&&!!e,_=(e,t,n)=>{let r=h(e,t,n);if(r)return f(r,n)},v=function(e){return e.INPUT=`input`,e.CONTENT=`content`,e}({}),y=(e,t,n)=>{if(!e)return!0;let r=e.toLocaleLowerCase(),i=s.i(t,n.itemTitle)?.toLocaleLowerCase()??``,a=p(f(t,n.itemValue)??``).toLocaleLowerCase();return i.includes(r)||a.includes(r)},ee=(e,t,n,r)=>{let i=r??((e,t)=>y(e,t,n));return t?e.filter(e=>i(t,e)):[...e]},b=e=>typeof e==`string`&&m(e),x=e=>typeof e==`number`&&m(e),S=(e,t,n)=>{if(t){if(!g(e))return;let t=f(e,n);return b(t)||x(t)?t:void 0}let r=typeof e==`string`||typeof e==`number`?e:void 0;if(b(r)||x(r))return r},C=(e,t,n)=>e?(Array.isArray(e)?e:[e]).flatMap(e=>{let r=S(e,t,n);return m(r)?[r]:[]}):[],w=(e,t)=>{if(b(t)){e.value=t;return}if(x(t)){e.value=t;return}e.value=void 0},T=(e,t,n)=>t.flatMap(t=>{let r=p(t),i=e.find(e=>p(f(e,n)??``)===r);return i?[i]:[]}),E=({modelValue:e,options:n,itemFields:r,multiple:i,returnObject:a,searchable:o,filterOption:l,isDropdownOpen:u,searchQuery:d})=>{let g=(0,c.computed)(()=>(0,c.toValue)(i)),y=(0,c.computed)(()=>(0,c.toValue)(a)),b=(0,c.computed)(()=>(0,c.toValue)(o)===v.INPUT),x=(0,c.computed)(()=>(0,c.toValue)(o)===v.CONTENT),S=(0,c.computed)(()=>!!(0,c.toValue)(o)),E=(0,c.computed)(()=>{let t=(0,c.toValue)(r);return C(e.value,y.value,t.itemValue)}),te=(0,c.computed)(()=>{let e=(0,c.toValue)(n),t=(0,c.toValue)(r);return ee(e,S.value?d.value:``,t,(0,c.toValue)(l))}),ne=(0,c.computed)(()=>g.value?t.n.MULTIPLE:t.n.SINGLE),D=(t,n,r)=>{if(y.value){e.value=T(n,t,r);return}e.value=t},re=(t,n,r)=>{if(!t){e.value=void 0;return}if(y.value){e.value=h(t,n,r)??void 0;return}w(e,_(t,n,r))},ie=(0,c.computed)({get:()=>{if(g.value)return E.value.map(e=>p(e));let e=E.value[0];if(m(e))return p(e)},set:e=>{let t=(0,c.toValue)(n),i=(0,c.toValue)(r);if(g.value){D((Array.isArray(e)?e:[]).map(e=>_(e,t,i.itemValue)).filter(e=>m(e)),t,i.itemValue);return}re(typeof e==`string`?e:void 0,t,i.itemValue)}}),ae=(0,c.computed)(()=>E.value.length>0),O=(e,t,n)=>{let r=p(t);return e.find(e=>p(f(e,n)??``)===r)},k=(0,c.computed)(()=>{let e=E.value[0];if(!m(e))return``;let t=(0,c.toValue)(r),i=O((0,c.toValue)(n),e,t.itemValue);return i?s.i(i,t.itemTitle)??``:p(e)}),A=(0,c.computed)(()=>{let e=(0,c.toValue)(n),t=(0,c.toValue)(r);return E.value.map(n=>{let r=O(e,n,t.itemValue);return r?s.i(r,t.itemTitle)??``:p(n)})}),oe=(0,c.computed)(()=>A.value.join(`, `)),se=(0,c.computed)(()=>g.value?E.value.length===0:!k.value),j=(0,c.computed)(()=>b.value&&(u.value||g.value)),M=()=>{d.value=``};return(0,c.watch)(u,e=>{e||M()}),(0,c.watch)(()=>(0,c.toValue)(o),()=>{M()}),{searchQuery:d,selectedValues:E,filteredOptions:te,listSelectionMode:ne,listSelectedModel:ie,hasSelectedValues:ae,singleDisplayLabel:k,multipleDisplayLabels:A,multipleDisplayText:oe,showPlaceholder:se,showInputSearchField:j,isSearchableMode:S,isSearchableInputMode:b,isSearchableContentMode:x,isMultipleMode:g,isReturnObjectMode:y,clearSelection:()=>{e.value=void 0,M()},removeSelectedValue:e=>{let t=p(e);D(E.value.filter(e=>p(e)!==t),(0,c.toValue)(n),(0,c.toValue)(r).itemValue)},resetSearchQuery:M,formatSelectListKey:p,resolveValueFromListKey:e=>_(e,(0,c.toValue)(n),(0,c.toValue)(r).itemValue)}},te={key:1,class:`s-ui-select__empty s-ui-typography-body-14-regular`},ne=[`id`,`aria-expanded`,`aria-controls`,`aria-disabled`,`aria-readonly`,`aria-autocomplete`,`tabindex`],D={key:0,class:`s-ui-select__value`},re={key:1,class:`s-ui-select__placeholder`},ie={key:1,class:`s-ui-select__placeholder`},ae={key:2,class:`s-ui-select__value`},O={key:3,class:`s-ui-select__value-suffix`},k=[`name`,`placeholder`,`disabled`,`readonly`],A=20,oe=`100%`,se=20,j=(0,c.defineComponent)({inheritAttrs:!1,__name:`SSelect`,props:(0,c.mergeModels)({options:{},itemValue:{default:`value`},itemTitle:{default:`label`},itemSubtitle:{default:`subtitle`},itemId:{},itemDisabled:{default:`disabled`},itemIconLeft:{default:`iconLeft`},multiple:{type:Boolean,default:!1},returnObject:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},closableOptions:{type:Boolean,default:!1},searchable:{type:[String,Boolean],default:!1},closeOnSelect:{type:Boolean,default:!0},listHeight:{default:320},searchPlaceholder:{default:`Search`},filterOption:{type:Function},fitViewport:{type:Boolean,default:!0},panelWidth:{},surfaceClass:{},canLoadMore:{type:Function},endReachedDistance:{default:0},label:{},labelProps:{},placeholder:{},helpMessages:{},errorMessages:{},bordered:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},iconLeft:{},customize:{default:()=>a.r.NONE},name:{},id:{}},{modelValue:{},modelModifiers:{},searchQuery:{default:``},searchQueryModifiers:{}}),emits:(0,c.mergeModels)([`clear`,`focus`,`blur`,`open`,`close`,`endReached`],[`update:modelValue`,`update:searchQuery`]),setup(t,{expose:d,emit:f}){let p=(0,c.useModel)(t,`modelValue`),h=(0,c.useModel)(t,`searchQuery`),g=f,{t:_}=(0,l.useUiKitI18n)(),v=(0,c.useSlots)(),{getRootAttrs:y,getAriaAttrs:ee,getAriaAttr:b}=n.t(),x=(0,c.useId)(),S=(0,c.useId)(),C=(0,c.useTemplateRef)(`triggerInputRef`),w=(0,c.ref)(``),T=(0,c.useTemplateRef)(`searchInputElementRef`),j=(0,c.useTemplateRef)(`panelSearchInputElementRef`),M=(0,c.useTemplateRef)(`listElementRef`),N=(0,c.ref)(),P=(0,c.ref)(!1),F=(0,c.ref)(!1),ce=(0,c.computed)(()=>t.panelWidth===void 0),le=(0,c.computed)(()=>t.panelWidth??oe),ue=(0,c.computed)(()=>t.itemId??t.itemValue),de=(0,c.computed)(()=>({itemValue:t.itemValue,itemTitle:t.itemTitle,itemSubtitle:t.itemSubtitle,itemId:ue.value})),{selectedValues:I,filteredOptions:L,listSelectionMode:fe,listSelectedModel:R,hasSelectedValues:pe,singleDisplayLabel:me,multipleDisplayLabels:he,multipleDisplayText:z,showPlaceholder:B,showInputSearchField:V,isSearchableMode:ge,isSearchableInputMode:H,isSearchableContentMode:U,isMultipleMode:W,clearSelection:_e,removeSelectedValue:G,resolveValueFromListKey:ve,formatSelectListKey:K}=E({modelValue:p,options:()=>t.options,itemFields:()=>de.value,multiple:()=>t.multiple,returnObject:()=>t.returnObject,searchable:()=>t.searchable,filterOption:()=>t.filterOption,isDropdownOpen:P,searchQuery:h}),ye=(0,c.computed)(()=>({disabled:t.disabled,displayLabel:me.value})),q=(0,c.computed)(()=>L.value.length>se),be=(0,c.computed)(()=>U.value||q.value?t.listHeight:`auto`),xe=(0,c.computed)(()=>{if(!(U.value||q.value))return t.listHeight}),Se=(0,c.computed)(()=>I.value.map(e=>K(e))),Ce=e=>Se.value.includes(e),we=()=>({tiny:!0}),Te=e=>u({listItemScope:e,itemTitle:t.itemTitle,itemSubtitle:t.itemSubtitle,itemDisabled:t.itemDisabled,itemIconLeft:t.itemIconLeft,listActiveKey:N.value,isOptionSelected:Ce(e.key)}),Ee=e=>{let t=ve(e);if(m(t)){if(W.value){G(t);return}p.value=void 0}},J=(0,c.computed)(()=>t.id??x),De=(0,c.computed)(()=>S),Oe=(0,c.computed)(()=>a.n(J.value)),Y=()=>{let e=b(`aria-label`),n=b(`aria-labelledby`);return e||n?{"aria-label":e,"aria-labelledby":n}:t.label||v.label?{"aria-labelledby":Oe.value}:t.placeholder?{"aria-label":t.placeholder}:{}},ke=()=>({...ee(),...Y()}),Ae=(0,c.computed)(()=>C.value?.fieldElementRef??null),je=(0,c.computed)(()=>({labels:he.value,values:I.value,displayText:z.value,disabled:t.disabled||t.readonly,removeValue:G})),Me=(0,c.computed)(()=>{if(!t.disabled&&(t.readonly&&!H.value||!H.value))return 0}),Ne=(0,c.computed)(()=>({"s-ui-select--disabled":t.disabled,"s-ui-select--readonly":t.readonly,"s-ui-select--multiple":W.value,"s-ui-select--open":P.value})),Pe=()=>{if(U.value){j.value?.focus();return}T.value?.focus()},Fe=async()=>{await(0,c.nextTick)(),j.value?.focus()},Ie=async()=>{await(0,c.nextTick)(),await M.value?.focusNavigation()},X=async()=>{if(!(t.disabled||t.readonly)&&!P.value){if(P.value=!0,g(`open`),U.value){await Fe();return}if(H.value){await(0,c.nextTick)(),T.value?.focus();return}await Ie()}},Le=async()=>{t.disabled||t.readonly||P.value||await X()};(0,c.watch)(h,async e=>{H.value&&(t.disabled||t.readonly||e&&(P.value||await X()))});let Z=()=>{P.value&&(P.value=!1,N.value=void 0,g(`close`))},Q=()=>{!t.closeOnSelect||W.value||Z()};(0,c.watch)(p,(e,n)=>{!t.closeOnSelect||W.value||!P.value||!e||e===n||Z()});let Re=e=>{P.value&&e.target instanceof Element&&e.target.closest(`.s-ui-list-item`)&&Q()},ze=async e=>{e.key!==`Enter`&&e.key!==` `&&e.key!==`Spacebar`||P.value&&(await(0,c.nextTick)(),Q())},$=async()=>{if(P.value){Z();return}await X()},Be=async e=>{if(!(t.disabled||t.readonly)&&e.target instanceof HTMLElement){if(e.target.closest(`.s-ui-select__search-input`)){P.value||await X();return}await $()}},Ve=async()=>{t.disabled||t.readonly||await $()},He=async e=>e.key!==`ArrowDown`&&e.key!==`ArrowUp`?!1:(e.preventDefault(),e.stopPropagation(),P.value||await X(),await Ie(),await M.value?.handleKeyboardNavigation(e),!0),Ue=e=>{let t=ve(e);if(t){if(W.value){I.value.some(t=>K(t)===e)?G(t):R.value=[...I.value.map(e=>K(e)),e];return}R.value=e,Q()}},We=async e=>{if(!(t.disabled||t.readonly)&&!await He(e)){if(e.key===`Escape`){e.preventDefault(),Z();return}if(e.key===`Enter`||e.key===` `){if(e.preventDefault(),P.value&&N.value){Ue(N.value);return}await $()}}},Ge=async e=>{if(e.key===`Escape`){e.preventDefault(),Z();return}await He(e)},Ke=Ge,qe=e=>{t.disabled||(F.value||g(`focus`,e),F.value=!0)},Je=e=>{if(!(e.currentTarget instanceof HTMLElement))return;let t=e.relatedTarget;t instanceof Node&&e.currentTarget.contains(t)||(F.value=!1,g(`blur`,e))},Ye=()=>{_e(),g(`clear`)},Xe=e=>{g(`endReached`,e)};return d({open:X,close:Z,toggle:$,focusSearchInput:Pe}),(n,u)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-select`,Ne.value]},(0,c.unref)(y)()),[(0,c.createVNode)((0,c.unref)(r.t),{modelValue:P.value,"onUpdate:modelValue":u[4]||=e=>P.value=e,reference:Ae.value,disabled:t.disabled,"match-reference-width":ce.value,"fit-viewport":t.fitViewport,"surface-class":t.surfaceClass,"content-id":De.value,"dismiss-on-click-outside":!0,"dismiss-on-escape":!0},{content:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-select__menu`,width:le.value},(0,c.createSlots)({default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,{class:`s-ui-select__menu-body`,onClick:Re,onKeydown:ze},[(0,c.unref)(L).length>0?((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(s.t),(0,c.mergeProps)({key:0,ref_key:`listElementRef`,ref:M,modelValue:N.value,"onUpdate:modelValue":u[2]||=e=>N.value=e,selected:(0,c.unref)(R),"onUpdate:selected":u[3]||=e=>(0,c.isRef)(R)?R.value=e:null,items:(0,c.unref)(L),"item-key":ue.value,"title-key":t.itemTitle,"subtitle-key":t.itemSubtitle,"icon-left-key":t.itemIconLeft,"disabled-key":t.itemDisabled,"selection-mode":(0,c.unref)(fe),mandatory:!t.multiple,height:be.value,"max-height":xe.value,virtual:q.value,"item-props":we,"selected-on-top":(0,c.unref)(W),"can-load-more":t.canLoadMore,"end-reached-distance":t.endReachedDistance},Y(),{onEndReached:Xe}),(0,c.createSlots)({_:2},[(0,c.unref)(v).option||(0,c.unref)(v)[`option-icon`]||t.closableOptions||(0,c.unref)(W)?{name:`item`,fn:(0,c.withCtx)(r=>[(0,c.unref)(v).option?(0,c.renderSlot)(n.$slots,`option`,(0,c.normalizeProps)((0,c.mergeProps)({key:0},r))):t.closableOptions?((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(o.t),(0,c.normalizeProps)((0,c.mergeProps)({key:1},Te(r))),(0,c.createSlots)({_:2},[(0,c.unref)(v)[`option-icon`]?{name:`icon-left`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`option-icon`,(0,c.normalizeProps)((0,c.guardReactiveProps)(r)))]),key:`0`}:void 0,Ce(r.key)?{name:`right`,fn:(0,c.withCtx)(t=>[(0,c.createVNode)((0,c.unref)(e.t),{appearance:(0,c.unref)(e.n).BARE,variant:(0,c.unref)(e.i).NEUTRAL,size:(0,c.unref)(e.r).SMALL,icon:`closeMini`,"aria-label":(0,c.unref)(_)(`select.removeOption`),disabled:t.disabled||t.readonly,tabindex:-1,onClick:(0,c.withModifiers)(e=>Ee(r.key),[`stop`])},null,8,[`appearance`,`variant`,`size`,`aria-label`,`disabled`,`onClick`])]),key:`1`}:void 0]),1040)):((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(o.t),(0,c.normalizeProps)((0,c.mergeProps)({key:2},Te(r))),(0,c.createSlots)({_:2},[(0,c.unref)(v)[`option-icon`]?{name:`icon-left`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`option-icon`,(0,c.normalizeProps)((0,c.guardReactiveProps)(r)))]),key:`0`}:void 0]),1040))]),key:`0`}:void 0]),1040,[`modelValue`,`selected`,`items`,`item-key`,`title-key`,`subtitle-key`,`icon-left-key`,`disabled-key`,`selection-mode`,`mandatory`,`height`,`max-height`,`virtual`,`selected-on-top`,`can-load-more`,`end-reached-distance`])):((0,c.openBlock)(),(0,c.createElementBlock)(`div`,te,[(0,c.renderSlot)(n.$slots,`empty`,{},()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(_)(`select.noOptions`)),1)])]))],32)]),_:2},[(0,c.unref)(U)||(0,c.unref)(v)[`panel-header`]?{name:`header`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`panel-header`),(0,c.unref)(U)?((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(a.t),{key:0,ref_key:`panelSearchInputElementRef`,ref:j,modelValue:h.value,"onUpdate:modelValue":u[0]||=e=>h.value=e,placeholder:t.searchPlaceholder,disabled:t.disabled,clearable:!1,"aria-label":t.searchPlaceholder,"icon-left":`search`,onClick:u[1]||=(0,c.withModifiers)(()=>{},[`stop`]),onKeydown:(0,c.unref)(Ke)},null,8,[`modelValue`,`placeholder`,`disabled`,`aria-label`,`onKeydown`])):(0,c.createCommentVNode)(``,!0)]),key:`0`}:void 0,(0,c.unref)(v)[`panel-footer`]?{name:`footer`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`panel-footer`)]),key:`1`}:void 0]),1032,[`width`])]),_:3},8,[`modelValue`,`reference`,`disabled`,`match-reference-width`,`fit-viewport`,`surface-class`,`content-id`]),(0,c.createVNode)((0,c.unref)(a.t),{ref_key:`triggerInputRef`,ref:C,modelValue:w.value,"onUpdate:modelValue":u[7]||=e=>w.value=e,label:t.label,"label-props":t.labelProps,placeholder:t.placeholder,"help-messages":t.helpMessages,"error-messages":t.errorMessages,bordered:t.bordered,disabled:t.disabled,readonly:t.readonly,clearable:t.clearable,"has-value":(0,c.unref)(pe),focused:F.value||P.value,"icon-left":t.iconLeft,customize:t.customize,name:t.name,id:J.value,onClear:Ye,onFocus:qe,onBlur:Je},(0,c.createSlots)({control:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,(0,c.mergeProps)({id:J.value,class:[`s-ui-select__control s-ui-typography-body-14-regular`,{"s-ui-select__control--multiple":(0,c.unref)(W),"s-ui-select__control--empty":(0,c.unref)(W)&&!(0,c.unref)(pe)&&!(0,c.unref)(V),"s-ui-select__control--with-value-suffix":(0,c.unref)(v)[`value-suffix`]&&!(0,c.unref)(W)&&!(0,c.unref)(V)&&!(0,c.unref)(B)}],role:`combobox`,"aria-expanded":P.value,"aria-controls":De.value,"aria-haspopup":`listbox`,"aria-disabled":t.disabled?!0:void 0,"aria-readonly":t.readonly?!0:void 0,"aria-autocomplete":(0,c.unref)(ge)?`list`:void 0},ke(),{tabindex:Me.value,onClick:Be,onKeydown:We}),[(0,c.unref)(W)?(0,c.renderSlot)(n.$slots,`selection`,(0,c.normalizeProps)((0,c.mergeProps)({key:0},je.value)),()=>[(0,c.unref)(z)?((0,c.openBlock)(),(0,c.createElementBlock)(`span`,D,(0,c.toDisplayString)((0,c.unref)(z)),1)):(0,c.unref)(B)&&!(0,c.unref)(V)?((0,c.openBlock)(),(0,c.createElementBlock)(`span`,re,(0,c.toDisplayString)(t.placeholder),1)):(0,c.createCommentVNode)(``,!0)]):(0,c.unref)(B)&&!(0,c.unref)(V)?((0,c.openBlock)(),(0,c.createElementBlock)(`span`,ie,(0,c.toDisplayString)(t.placeholder),1)):(0,c.unref)(V)?(0,c.createCommentVNode)(``,!0):((0,c.openBlock)(),(0,c.createElementBlock)(`span`,ae,(0,c.toDisplayString)((0,c.unref)(me)),1)),(0,c.unref)(v)[`value-suffix`]&&!(0,c.unref)(W)&&!(0,c.unref)(V)&&!(0,c.unref)(B)?((0,c.openBlock)(),(0,c.createElementBlock)(`div`,O,[(0,c.renderSlot)(n.$slots,`value-suffix`,(0,c.normalizeProps)((0,c.guardReactiveProps)(ye.value)))])):(0,c.createCommentVNode)(``,!0),(0,c.unref)(V)?(0,c.withDirectives)(((0,c.openBlock)(),(0,c.createElementBlock)(`input`,(0,c.mergeProps)({key:4,ref_key:`searchInputElementRef`,ref:T,"onUpdate:modelValue":u[5]||=e=>h.value=e,class:`s-ui-select__search-input`,type:`text`,name:t.name,placeholder:t.placeholder,disabled:t.disabled,readonly:t.readonly,autocomplete:`off`},Y(),{onClick:u[6]||=(0,c.withModifiers)(()=>{},[`stop`]),onFocus:Le,onKeydown:Ge}),null,16,k)),[[c.vModelText,h.value]]):(0,c.createCommentVNode)(``,!0)],16,ne)]),action:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(l.SIcon),{name:`chevronMiniDown`,size:A,class:`s-ui-select__chevron`,onClick:Ve})]),_:2},[(0,c.unref)(v).label?{name:`label`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`label`)]),key:`0`}:void 0,(0,c.unref)(v).prefix?{name:`prefix`,fn:(0,c.withCtx)(e=>[(0,c.renderSlot)(n.$slots,`prefix`,(0,c.normalizeProps)((0,c.guardReactiveProps)(e)))]),key:`1`}:void 0,(0,c.unref)(v).prepend?{name:`prepend`,fn:(0,c.withCtx)(e=>[(0,c.renderSlot)(n.$slots,`prepend`,(0,c.normalizeProps)((0,c.guardReactiveProps)(e)))]),key:`2`}:void 0,(0,c.unref)(v).message?{name:`message`,fn:(0,c.withCtx)(()=>[(0,c.renderSlot)(n.$slots,`message`)]),key:`3`}:void 0]),1032,[`modelValue`,`label`,`label-props`,`placeholder`,`help-messages`,`error-messages`,`bordered`,`disabled`,`readonly`,`clearable`,`has-value`,`focused`,`icon-left`,`customize`,`name`,`id`])],16))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return j}});

package/dist/STab-BkQzKaLY.cjs

@@ -0,0 +1 @@
+const e=require("./useSelectionGroup-NJvi3hNo.cjs"),t=require("./useSelectLink-DZIAhQ2J.cjs"),n=require("./useLink-1LLWpdDZ.cjs");let r=require("vue"),i=require("@shtabapp/ui-kit-primitives");var a=Symbol(`STabs`),o=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e}({}),s=function(e){return e.SMALL=`small`,e.LARGE=`large`,e}({}),c={class:`s-ui-tab__content`},l={key:0,class:`s-ui-tab__icon-wrap`},u={class:`s-ui-tab__icon`},ee={key:0,class:`s-ui-tab__icon-badge`,"aria-hidden":`true`},d={key:1,class:`s-ui-tab__label-wrap`},f={key:0,class:`s-ui-tab__caret`,"aria-hidden":`true`},p={key:3,class:`s-ui-tab__caret`,"aria-hidden":`true`},m=[`placeholder`,`disabled`],h={key:2,class:`s-ui-tab__right`},g=`Delete`,_=(0,r.defineComponent)({inheritAttrs:!1,__name:`STab`,props:(0,r.mergeModels)({appearance:{},size:{},disabled:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},icon:{},iconOnly:{type:Boolean,default:!1},billing:{type:Boolean,default:!1},placeholder:{type:Boolean,default:!1},placeholderText:{},editableStaticDisplay:{type:Boolean,default:!1},iconBadge:{},value:{},link:{},exact:{type:Boolean,default:!1},replace:{type:Boolean,default:!1},closable:{type:Boolean,default:!1}},{modelValue:{default:``},modelModifiers:{}}),emits:(0,r.mergeModels)([`click`,`rename`,`close`],[`update:modelValue`]),setup(_,{expose:v,emit:y}){let b=(0,r.inject)(a,null),{t:te}=(0,i.useUiKitI18n)(),x=(0,r.computed)(()=>_.placeholderText??te(`tab.placeholder`)),S=(0,r.useAttrs)(),C=(0,r.useSlots)(),w=(0,r.computed)(()=>e.a(_.appearance,b?(0,r.toValue)(b.appearance):void 0,o.PRIMARY)),T=(0,r.computed)(()=>e.a(_.size,b?(0,r.toValue)(b.size):void 0,s.LARGE)),E=(0,r.computed)(()=>_.disabled||!!(b&&(0,r.toValue)(b.disabled))),D=(0,r.useTemplateRef)(`tabRootRef`),O=t.n({group:()=>b,value:()=>_.value,el:D,disabled:E}),k=n.t(()=>_.link,()=>_.exact,()=>_.replace);t.t({isRouterLink:k.isRouterLink,isActive:k.isActive,group:()=>b,value:()=>_.value});let A=(0,r.computed)(()=>k.isRouterLink.value?k.isActive.value:O.isInGroup.value?O.isActive.value:_.selected),j=(0,r.useModel)(_,`modelValue`),M=y,N=(0,r.useTemplateRef)(`renameInputRef`),P=(0,r.ref)(!1),F=(0,r.ref)(``),I=k.linkPresentation,L=(0,r.computed)(()=>I.value.mode===`none`),R=(0,r.computed)(()=>{let e=I.value;return e.mode===`none`?`button`:e.rootTag}),z=(0,r.computed)(()=>n.n(I.value,{replace:_.replace})),B=(0,r.computed)(()=>{let e=O.tabIndex.value;return{...z.value,...e===void 0?{}:{tabindex:e},...S}}),V=[`Delete`,`Backspace`],H=(0,r.computed)(()=>T.value===s.LARGE?20:16),U=(0,r.computed)(()=>T.value===s.LARGE?20:16),W=(0,r.computed)(()=>T.value===s.LARGE?`s-ui-typography-label-16-medium`:`s-ui-typography-label-14-medium`),G=(0,r.computed)(()=>!!(_.icon||C.icon)),K=(0,r.computed)(()=>_.editableStaticDisplay&&_.placeholder&&!j.value.length),q=(0,r.computed)(()=>_.editableStaticDisplay&&!_.placeholder),J=(0,r.computed)(()=>P.value?F.value:j.value),Y=(0,r.computed)(()=>!C.default&&_.placeholder&&!j.value.length),X=(0,r.computed)(()=>_.editableStaticDisplay&&_.placeholder&&!j.value.length),Z=(0,r.computed)(()=>_.editableStaticDisplay&&!_.placeholder&&j.value.length>0),Q=(0,r.computed)(()=>_.iconOnly?!1:C.default||_.editableStaticDisplay||P.value||j.value.length>0||Y.value),ne=(0,r.computed)(()=>_.iconOnly?!1:!!C.right),$=(0,r.computed)(()=>P.value||_.editableStaticDisplay),re=(0,r.computed)(()=>_.placeholder&&!J.value.length&&($.value||Y.value)),ie=(0,r.computed)(()=>[`s-ui-tab--appearance-${w.value}`,`s-ui-tab--size-${T.value}`,{"s-ui-tab--selected":A.value,"s-ui-tab--disabled":E.value,"s-ui-tab--icon-only":_.iconOnly,"s-ui-tab--billing":_.billing,"s-ui-tab--editable":$.value,"s-ui-tab--editable-placeholder":re.value,"s-ui-tab--editable-value":!_.placeholder&&$.value,"s-ui-tab--link":n.r(_.link),"s-ui-tab--closable":_.closable}]),ae=()=>{let e=N.value;if(!e)return;e.focus();let t=F.value.length;e.setSelectionRange(t,t)},oe=async()=>{E.value||_.editableStaticDisplay||_.iconOnly||(F.value=j.value,P.value=!0,await(0,r.nextTick)(),ae())},se=()=>{if(_.editableStaticDisplay||!P.value)return;let e=F.value;P.value=!1,j.value=e,M(`rename`,e)},ce=()=>{_.editableStaticDisplay||!P.value||(P.value=!1)},le=()=>{P.value&&ce()},ue=e=>{e.stopPropagation(),e.key===`Enter`&&(e.preventDefault(),se(),N.value?.blur())},de=e=>{E.value||M(`close`,e)},fe=e=>!_.closable||E.value||!V.includes(e.key)?!1:(e.preventDefault(),M(`close`,e),!0),pe=e=>{if(!fe(e)){if(k.isRouterLink.value&&(e.key===`Enter`||e.key===` `||e.key===`Spacebar`)){e.preventDefault(),k.navigate();return}O.handleKeydown(e)}},me=e=>{if(E.value){e.preventDefault(),e.stopPropagation();return}if(k.isRouterLink.value){M(`click`,e);return}O.handleClick(),M(`click`,e)};return v({edit:oe}),(e,t)=>((0,r.openBlock)(),(0,r.createBlock)((0,r.resolveDynamicComponent)(R.value),(0,r.mergeProps)({ref_key:`tabRootRef`,ref:D,class:[`s-ui-tab`,ie.value],type:L.value?`button`:void 0,role:`tab`,"aria-selected":!!A.value,"aria-disabled":E.value?!0:void 0,disabled:L.value&&E.value?!0:void 0,"aria-keyshortcuts":_.closable?g:void 0},B.value,{onClick:me,onKeydown:pe}),{default:(0,r.withCtx)(()=>[(0,r.createElementVNode)(`span`,c,[G.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,l,[(0,r.createElementVNode)(`span`,u,[(0,r.renderSlot)(e.$slots,`icon`,{},()=>[_.icon?((0,r.openBlock)(),(0,r.createBlock)((0,r.unref)(i.SIcon),{key:0,name:_.icon,size:U.value,billing:_.billing},null,8,[`name`,`size`,`billing`])):(0,r.createCommentVNode)(``,!0)])]),_.iconBadge?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,ee,[(0,r.createVNode)((0,r.unref)(i.SIcon),{class:`s-ui-tab__icon-badge-icon`,name:_.iconBadge},null,8,[`name`])])):(0,r.createCommentVNode)(``,!0)])):(0,r.createCommentVNode)(``,!0),Q.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,d,[_.editableStaticDisplay?((0,r.openBlock)(),(0,r.createElementBlock)(r.Fragment,{key:0},[K.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,f)):(0,r.createCommentVNode)(``,!0),X.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,{key:1,class:(0,r.normalizeClass)([`s-ui-tab__label`,W.value])},(0,r.toDisplayString)(x.value),3)):(0,r.createCommentVNode)(``,!0),Z.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,{key:2,class:(0,r.normalizeClass)([`s-ui-tab__label`,W.value])},(0,r.toDisplayString)(j.value),3)):(0,r.createCommentVNode)(``,!0),q.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,p)):(0,r.createCommentVNode)(``,!0)],64)):P.value?(0,r.withDirectives)(((0,r.openBlock)(),(0,r.createElementBlock)(`input`,{key:1,ref_key:`renameInputRef`,ref:N,"onUpdate:modelValue":t[0]||=e=>F.value=e,class:(0,r.normalizeClass)([`s-ui-tab__input`,W.value]),type:`text`,placeholder:_.placeholder&&!J.value.length?x.value:void 0,disabled:E.value?!0:void 0,onBlur:le,onClick:t[1]||=(0,r.withModifiers)(()=>{},[`stop`]),onKeydown:ue},null,42,m)),[[r.vModelText,F.value]]):((0,r.openBlock)(),(0,r.createElementBlock)(`span`,{key:2,class:(0,r.normalizeClass)([`s-ui-tab__label`,W.value])},[(0,r.unref)(C).default?(0,r.renderSlot)(e.$slots,`default`,{key:0}):((0,r.openBlock)(),(0,r.createElementBlock)(r.Fragment,{key:1},[(0,r.createTextVNode)((0,r.toDisplayString)(j.value||(_.placeholder?x.value:``)),1)],64))],2))])):(0,r.createCommentVNode)(``,!0),ne.value?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,h,[(0,r.renderSlot)(e.$slots,`right`)])):(0,r.createCommentVNode)(``,!0),_.closable?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,{key:3,class:`s-ui-tab__close`,"aria-hidden":`true`,onClick:(0,r.withModifiers)(de,[`stop`])},[(0,r.createVNode)((0,r.unref)(i.SIcon),{name:`closeMini`,size:H.value},null,8,[`size`])])):(0,r.createCommentVNode)(``,!0)])]),_:3},16,[`class`,`type`,`aria-selected`,`aria-disabled`,`disabled`,`aria-keyshortcuts`]))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return _}});

package/dist/STab-D7SATMfv.js

@@ -0,0 +1,242 @@
+import { a as e } from "./useSelectionGroup-BCAmPf3R.js";
+import { n as t, t as n } from "./useSelectLink-2aCIYmF6.js";
+import { n as ee, r as te, t as ne } from "./useLink-Com5VhOk.js";
+import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as re, createVNode as l, defineComponent as u, inject as d, mergeModels as f, mergeProps as p, nextTick as ie, normalizeClass as m, openBlock as h, ref as g, renderSlot as _, resolveDynamicComponent as ae, toDisplayString as v, toValue as y, unref as b, useAttrs as oe, useModel as se, useSlots as ce, useTemplateRef as x, vModelText as le, withCtx as ue, withDirectives as de, withModifiers as S } from "vue";
+import { SIcon as C, useUiKitI18n as fe } from "@shtabapp/ui-kit-primitives";
+//#region src/components/STabs/utils/context.ts
+var w = Symbol("STabs"), T = /* @__PURE__ */ function(e) {
+	return e.PRIMARY = "primary", e.SECONDARY = "secondary", e;
+}({}), E = /* @__PURE__ */ function(e) {
+	return e.SMALL = "small", e.LARGE = "large", e;
+}({}), pe = { class: "s-ui-tab__content" }, me = {
+	key: 0,
+	class: "s-ui-tab__icon-wrap"
+}, he = { class: "s-ui-tab__icon" }, ge = {
+	key: 0,
+	class: "s-ui-tab__icon-badge",
+	"aria-hidden": "true"
+}, _e = {
+	key: 1,
+	class: "s-ui-tab__label-wrap"
+}, ve = {
+	key: 0,
+	class: "s-ui-tab__caret",
+	"aria-hidden": "true"
+}, ye = {
+	key: 3,
+	class: "s-ui-tab__caret",
+	"aria-hidden": "true"
+}, D = ["placeholder", "disabled"], O = {
+	key: 2,
+	class: "s-ui-tab__right"
+}, k = "Delete", A = /* @__PURE__ */ u({
+	inheritAttrs: !1,
+	__name: "STab",
+	props: /*@__PURE__*/ f({
+		appearance: {},
+		size: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		selected: {
+			type: Boolean,
+			default: !1
+		},
+		icon: {},
+		iconOnly: {
+			type: Boolean,
+			default: !1
+		},
+		billing: {
+			type: Boolean,
+			default: !1
+		},
+		placeholder: {
+			type: Boolean,
+			default: !1
+		},
+		placeholderText: {},
+		editableStaticDisplay: {
+			type: Boolean,
+			default: !1
+		},
+		iconBadge: {},
+		value: {},
+		link: {},
+		exact: {
+			type: Boolean,
+			default: !1
+		},
+		replace: {
+			type: Boolean,
+			default: !1
+		},
+		closable: {
+			type: Boolean,
+			default: !1
+		}
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ f([
+		"click",
+		"rename",
+		"close"
+	], ["update:modelValue"]),
+	setup(u, { expose: f, emit: A }) {
+		let j = d(w, null), { t: M } = fe(), N = i(() => u.placeholderText ?? M("tab.placeholder")), P = oe(), F = ce(), be = i(() => e(u.appearance, j ? y(j.appearance) : void 0, T.PRIMARY)), I = i(() => e(u.size, j ? y(j.size) : void 0, E.LARGE)), L = i(() => u.disabled || !!(j && y(j.disabled))), R = x("tabRootRef"), z = t({
+			group: () => j,
+			value: () => u.value,
+			el: R,
+			disabled: L
+		}), B = ne(() => u.link, () => u.exact, () => u.replace);
+		n({
+			isRouterLink: B.isRouterLink,
+			isActive: B.isActive,
+			group: () => j,
+			value: () => u.value
+		});
+		let V = i(() => B.isRouterLink.value ? B.isActive.value : z.isInGroup.value ? z.isActive.value : u.selected), H = se(u, "modelValue"), U = A, W = x("renameInputRef"), G = g(!1), K = g(""), q = B.linkPresentation, J = i(() => q.value.mode === "none"), xe = i(() => {
+			let e = q.value;
+			return e.mode === "none" ? "button" : e.rootTag;
+		}), Se = i(() => ee(q.value, { replace: u.replace })), Ce = i(() => {
+			let e = z.tabIndex.value;
+			return {
+				...Se.value,
+				...e === void 0 ? {} : { tabindex: e },
+				...P
+			};
+		}), we = ["Delete", "Backspace"], Te = i(() => I.value === E.LARGE ? 20 : 16), Ee = i(() => I.value === E.LARGE ? 20 : 16), Y = i(() => I.value === E.LARGE ? "s-ui-typography-label-16-medium" : "s-ui-typography-label-14-medium"), De = i(() => !!(u.icon || F.icon)), Oe = i(() => u.editableStaticDisplay && u.placeholder && !H.value.length), ke = i(() => u.editableStaticDisplay && !u.placeholder), X = i(() => G.value ? K.value : H.value), Z = i(() => !F.default && u.placeholder && !H.value.length), Ae = i(() => u.editableStaticDisplay && u.placeholder && !H.value.length), je = i(() => u.editableStaticDisplay && !u.placeholder && H.value.length > 0), Me = i(() => u.iconOnly ? !1 : F.default || u.editableStaticDisplay || G.value || H.value.length > 0 || Z.value), Ne = i(() => u.iconOnly ? !1 : !!F.right), Q = i(() => G.value || u.editableStaticDisplay), Pe = i(() => u.placeholder && !X.value.length && (Q.value || Z.value)), $ = i(() => [
+			`s-ui-tab--appearance-${be.value}`,
+			`s-ui-tab--size-${I.value}`,
+			{
+				"s-ui-tab--selected": V.value,
+				"s-ui-tab--disabled": L.value,
+				"s-ui-tab--icon-only": u.iconOnly,
+				"s-ui-tab--billing": u.billing,
+				"s-ui-tab--editable": Q.value,
+				"s-ui-tab--editable-placeholder": Pe.value,
+				"s-ui-tab--editable-value": !u.placeholder && Q.value,
+				"s-ui-tab--link": te(u.link),
+				"s-ui-tab--closable": u.closable
+			}
+		]), Fe = () => {
+			let e = W.value;
+			if (!e) return;
+			e.focus();
+			let t = K.value.length;
+			e.setSelectionRange(t, t);
+		}, Ie = async () => {
+			L.value || u.editableStaticDisplay || u.iconOnly || (K.value = H.value, G.value = !0, await ie(), Fe());
+		}, Le = () => {
+			if (u.editableStaticDisplay || !G.value) return;
+			let e = K.value;
+			G.value = !1, H.value = e, U("rename", e);
+		}, Re = () => {
+			u.editableStaticDisplay || !G.value || (G.value = !1);
+		}, ze = () => {
+			G.value && Re();
+		}, Be = (e) => {
+			e.stopPropagation(), e.key === "Enter" && (e.preventDefault(), Le(), W.value?.blur());
+		}, Ve = (e) => {
+			L.value || U("close", e);
+		}, He = (e) => !u.closable || L.value || !we.includes(e.key) ? !1 : (e.preventDefault(), U("close", e), !0), Ue = (e) => {
+			if (!He(e)) {
+				if (B.isRouterLink.value && (e.key === "Enter" || e.key === " " || e.key === "Spacebar")) {
+					e.preventDefault(), B.navigate();
+					return;
+				}
+				z.handleKeydown(e);
+			}
+		}, We = (e) => {
+			if (L.value) {
+				e.preventDefault(), e.stopPropagation();
+				return;
+			}
+			if (B.isRouterLink.value) {
+				U("click", e);
+				return;
+			}
+			z.handleClick(), U("click", e);
+		};
+		return f({ edit: Ie }), (e, t) => (h(), a(ae(xe.value), p({
+			ref_key: "tabRootRef",
+			ref: R,
+			class: ["s-ui-tab", $.value],
+			type: J.value ? "button" : void 0,
+			role: "tab",
+			"aria-selected": !!V.value,
+			"aria-disabled": L.value ? !0 : void 0,
+			disabled: J.value && L.value ? !0 : void 0,
+			"aria-keyshortcuts": u.closable ? k : void 0
+		}, Ce.value, {
+			onClick: We,
+			onKeydown: Ue
+		}), {
+			default: ue(() => [c("span", pe, [
+				De.value ? (h(), s("span", me, [c("span", he, [_(e.$slots, "icon", {}, () => [u.icon ? (h(), a(b(C), {
+					key: 0,
+					name: u.icon,
+					size: Ee.value,
+					billing: u.billing
+				}, null, 8, [
+					"name",
+					"size",
+					"billing"
+				])) : o("", !0)])]), u.iconBadge ? (h(), s("span", ge, [l(b(C), {
+					class: "s-ui-tab__icon-badge-icon",
+					name: u.iconBadge
+				}, null, 8, ["name"])])) : o("", !0)])) : o("", !0),
+				Me.value ? (h(), s("span", _e, [u.editableStaticDisplay ? (h(), s(r, { key: 0 }, [
+					Oe.value ? (h(), s("span", ve)) : o("", !0),
+					Ae.value ? (h(), s("span", {
+						key: 1,
+						class: m(["s-ui-tab__label", Y.value])
+					}, v(N.value), 3)) : o("", !0),
+					je.value ? (h(), s("span", {
+						key: 2,
+						class: m(["s-ui-tab__label", Y.value])
+					}, v(H.value), 3)) : o("", !0),
+					ke.value ? (h(), s("span", ye)) : o("", !0)
+				], 64)) : G.value ? de((h(), s("input", {
+					key: 1,
+					ref_key: "renameInputRef",
+					ref: W,
+					"onUpdate:modelValue": t[0] ||= (e) => K.value = e,
+					class: m(["s-ui-tab__input", Y.value]),
+					type: "text",
+					placeholder: u.placeholder && !X.value.length ? N.value : void 0,
+					disabled: L.value ? !0 : void 0,
+					onBlur: ze,
+					onClick: t[1] ||= S(() => {}, ["stop"]),
+					onKeydown: Be
+				}, null, 42, D)), [[le, K.value]]) : (h(), s("span", {
+					key: 2,
+					class: m(["s-ui-tab__label", Y.value])
+				}, [b(F).default ? _(e.$slots, "default", { key: 0 }) : (h(), s(r, { key: 1 }, [re(v(H.value || (u.placeholder ? N.value : "")), 1)], 64))], 2))])) : o("", !0),
+				Ne.value ? (h(), s("span", O, [_(e.$slots, "right")])) : o("", !0),
+				u.closable ? (h(), s("span", {
+					key: 3,
+					class: "s-ui-tab__close",
+					"aria-hidden": "true",
+					onClick: S(Ve, ["stop"])
+				}, [l(b(C), {
+					name: "closeMini",
+					size: Te.value
+				}, null, 8, ["size"])])) : o("", !0)
+			])]),
+			_: 3
+		}, 16, [
+			"class",
+			"type",
+			"aria-selected",
+			"aria-disabled",
+			"disabled",
+			"aria-keyshortcuts"
+		]));
+	}
+});
+//#endregion
+export { w as i, T as n, E as r, A as t };