@a-drowned-fish/rox-v 1.0.24 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/es/tab/index.js
CHANGED
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`inputmode`,`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`},type:{default:`number`}},emits:[`update:modelValue`,`complete`,`enter`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=a.type===`text`?t.replace(/[^\dA-Za-z]/g,``):t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){a.modelValue.length>=a.length&&o(`enter`)}function p(){s.value?.focus()}function m(e){return e===c.value.length}function h(e){return e<c.value.length}return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:p},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:a.type===`text`?`text`:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onKeyup:(0,t.withKeys)(f,[`enter`]),onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:m(n)},{[a.hasFilledItemClass]:h(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-e8da3c38`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:300},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0},top:{default:`0px`},left:{default:`0px`},right:{default:`0px`},bottom:{default:`0px`},zIndex:{default:50}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`,`center`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"--duration":`${i.duration}ms`,backgroundColor:i.bg,top:i.top,left:i.left,right:i.right,bottom:i.bottom,zIndex:i.zIndex}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-f6d3cf05`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`},enableDisabledClick:{type:Boolean,default:!1}},emits:[`click`],setup(e,{emit:n}){let r=n,i=e,a=e=>{(!i.disabled||i.enableDisabledClick)&&r(`click`,e)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{onClick:a,class:(0,t.normalizeClass)([`button-container`,{block:i.block,disabled:i.disabled}]),type:i.type,style:(0,t.normalizeStyle)({padding:i.padding,border:i.border,borderRadius:i.radius,"--bg":i.bg,"--disabled-bg":i.disabledBg})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],14,d))}}),[[`__scopeId`,`data-v-f38282d0`]]);f.install=e=>(f.name&&e.component(f.name,f),e);var p=f,m=o((0,t.defineComponent)({name:`Collapse`,__name:`collapse`,props:{open:{type:Boolean,default:!1},maxHeight:{default:`100dvh`},duration:{default:300}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`collapse`},{default:(0,t.withCtx)(()=>[n.open?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`collapse-content`,style:(0,t.normalizeStyle)({"--max-height":n.maxHeight,"--duration":n.duration+`ms`})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],4)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),[[`__scopeId`,`data-v-cc071022`]]);m.install=e=>(m.name&&e.component(m.name,m),e);var h=m,g={class:`input-box`},_=[`type`,`placeholder`],v=[`src`],y=o((0,t.defineComponent)({name:`Input`,__name:`input`,props:(0,t.mergeModels)({placeholder:{default:``},type:{default:`text`},iconVisible:{type:Boolean,default:!1},icon:{default:``}},{modelValue:{type:String,default:``},modelModifiers:{}}),emits:(0,t.mergeModels)([`click`,`enter`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useTemplateRef)(`input`),a=(0,t.useModel)(e,`modelValue`),o=e,s=()=>{r(`click`),i.value?.focus?.(),setTimeout(()=>{let e=a.value.length;i.value?.setSelectionRange?.(e,e)},0)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,g,[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{type:o.type,"onUpdate:modelValue":n[0]||=e=>a.value=e,ref:`input`,placeholder:o.placeholder,onKeyup:n[1]||=(0,t.withKeys)(t=>e.$emit(`enter`),[`enter`])},null,40,_),[[t.vModelDynamic,a.value]]),o.icon?(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:o.icon,alt:`icon`,onClick:s},null,8,v)),[[t.vShow,o.iconVisible]]):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-56cf72b9`]]);y.install=e=>(y.name&&e.component(y.name,y),e);var b=y,x={class:`menu-label`},S=[`src`],C=[`src`],w=(0,t.defineComponent)({name:`MenuItem`,__name:`menu-item`,props:(0,t.mergeModels)({checkedIcon:{},checkedIconClass:{},suffixIcon:{},suffixIconClass:{},itemContainerClass:{},itemGap:{},activeItemClass:{},subMenuContainerClass:{},deep:{},item:{},parentValue:{}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useModel)(e,`modelValue`),r=e,i=(0,t.ref)(!1),a=()=>i.value=!0,o=()=>i.value=!1,s=()=>{r.item.children?.length||(n.value=[...r.parentValue,r.item.value])};return(c,l)=>{let u=(0,t.resolveComponent)(`MenuItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`div`,{onMouseenter:a,onMouseleave:o,style:{padding:`0 8px`}},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-inner`,[r.itemContainerClass,{active:n.value?.[r.deep]===e.item.value},{[r.activeItemClass]:n.value?.[r.deep]===e.item.value}]]),onClick:s},[(0,t.createElementVNode)(`div`,x,(0,t.toDisplayString)(e.item.label),1),e.suffixIcon&&e.item.children?.length?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:r.suffixIcon,class:(0,t.normalizeClass)([`suffix-icon`,r.suffixIconClass]),alt:`suffix-icon`},null,10,S)):(0,t.createCommentVNode)(``,!0),e.checkedIcon&&!e.item.children?.length&&n.value?.[r.deep]===e.item.value?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:1,src:r.checkedIcon,class:(0,t.normalizeClass)([`checked-icon`,r.checkedIconClass]),alt:`checked-icon`},null,10,C)):(0,t.createCommentVNode)(``,!0)],2),e.item.children?.length?((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{key:0,name:`fade`},{default:(0,t.withCtx)(()=>[i.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`sub-menu-box list-box`,e.subMenuContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.item.children,(i,a)=>((0,t.openBlock)(),(0,t.createBlock)(u,{key:a,modelValue:n.value,"onUpdate:modelValue":l[0]||=e=>n.value=e,item:i,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":e.itemGap,deep:r.deep+1,"active-item-class":r.activeItemClass,"parent-value":r.parentValue.concat(e.item.value)},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`deep`,`active-item-class`,`parent-value`]))),128))],2)):(0,t.createCommentVNode)(``,!0)]),_:1})):(0,t.createCommentVNode)(``,!0)],32)}}}),T={key:0,class:`menu-list-box`},E=o((0,t.defineComponent)({name:`Menu`,__name:`menu`,props:(0,t.mergeModels)({duration:{default:100},items:{default:()=>[]},suffixIcon:{},suffixIconClass:{},checkedIcon:{},checkedIconClass:{},listContainerClass:{default:``},subMenuContainerClass:{default:``},defaultContainerClass:{default:``},itemContainerClass:{},itemGap:{default:`4px`},activeItemClass:{default:``}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:(0,t.mergeModels)([`open`,`close`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.ref)(!1),s=()=>o.value=!0,c=()=>o.value=!1;return(0,t.watch)(i,()=>{o.value=!1}),(0,t.watch)(o,e=>{r(e?`open`:`close`)}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`menu-box`,style:(0,t.normalizeStyle)({"--duration":a.duration+`ms`})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`default-box`,a.defaultContainerClass]),onMouseenter:s,onMouseleave:c},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0),(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[o.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,T,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-box`,a.listContainerClass]),style:(0,t.normalizeStyle)({"--gap":a.itemGap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:o,class:`menu-item`},[(0,t.createVNode)(w,{modelValue:i.value,"onUpdate:modelValue":r[0]||=e=>i.value=e,item:n,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":a.itemGap,deep:0,"active-item-class":a.activeItemClass,"sub-menu-container-class":a.subMenuContainerClass,"parent-value":[]},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`active-item-class`,`sub-menu-container-class`])]))),128))],6)])):(0,t.createCommentVNode)(``,!0)]),_:1})],34)],4))}}),[[`__scopeId`,`data-v-b7084c6e`]]);E.install=e=>(E.name&&e.component(E.name,E),e);var D=E,O={class:`tab-list-container-inner`},k=[`onClick`],A=o((0,t.defineComponent)({name:`Tab`,__name:`tab`,props:(0,t.mergeModels)({items:{default:()=>[]},gap:{default:`10px`},tabContainerClass:{default:``},tabItemClass:{default:``},panelContainerClass:{default:``},panelItemClass:{default:``},activeLineClass:{default:``}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useTemplateRef)(`item`),r=(0,t.ref)(!0),i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.reactive)({left:0,width:0}),s=()=>{if(!n.value)return;let e=n.value[i.value];if(!e)return;let{offsetWidth:t,offsetLeft:r}=e;o.left=r||0,o.width=t||0};return(0,t.watch)(i,()=>{r.value&&=!1,s()}),(0,t.onMounted)(async()=>{s()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`tab-box-container`,style:(0,t.normalizeStyle)({"--gap":a.gap})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`tab-list-container`,a.tabContainerClass])},[(0,t.createElementVNode)(`div`,O,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`tab-item-box`,a.tabItemClass]),onClick:e=>i.value=r,ref_for:!0,ref:`item`},[(0,t.renderSlot)(e.$slots,`default`,{item:n,index:r,active:i.value===r},void 0,!0)],10,k))),128)),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`active-tab-item-box`,[{initial:r.value},a.activeLineClass]]),style:(0,t.normalizeStyle)({left:o.left+`px`,width:o.width+`px`})},null,6)])],2),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`panel-list-container`,a.panelContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`panel-item-box`,a.panelItemClass])},[(0,t.renderSlot)(e.$slots,`panel`,{item:n,index:r,active:i.value===r},void 0,!0)],2)),[[t.vShow,i.value===r]])),128))],2)],4))}}),[[`__scopeId`,`data-v-8429c380`]]);A.install=e=>(A.name&&e.component(A.name,A),e);var j=A,M=r({Button:()=>p,Collapse:()=>h,Input:()=>b,InputOtp:()=>c,Menu:()=>D,Popup:()=>u,Tab:()=>j}),N=e=>(Object.keys(M).forEach(t=>{let n=M[t];n.install&&e.use(n)}),e),P={install:N};e.Button=p,e.Collapse=h,e.Input=b,e.InputOtp=c,e.Menu=D,e.Popup=u,e.Tab=j,e.default=P,e.install=N});
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`inputmode`,`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`},type:{default:`number`}},emits:[`update:modelValue`,`complete`,`enter`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=a.type===`text`?t.replace(/[^\dA-Za-z]/g,``):t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){a.modelValue.length>=a.length&&o(`enter`)}function p(){s.value?.focus()}function m(e){return e===c.value.length}function h(e){return e<c.value.length}return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:p},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:a.type===`text`?`text`:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onKeyup:(0,t.withKeys)(f,[`enter`]),onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:m(n)},{[a.hasFilledItemClass]:h(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-e8da3c38`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:300},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0},top:{default:`0px`},left:{default:`0px`},right:{default:`0px`},bottom:{default:`0px`},zIndex:{default:50}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`,`center`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"--duration":`${i.duration}ms`,backgroundColor:i.bg,top:i.top,left:i.left,right:i.right,bottom:i.bottom,zIndex:i.zIndex}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-f6d3cf05`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`},enableDisabledClick:{type:Boolean,default:!1}},emits:[`click`],setup(e,{emit:n}){let r=n,i=e,a=e=>{(!i.disabled||i.enableDisabledClick)&&r(`click`,e)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{onClick:a,class:(0,t.normalizeClass)([`button-container`,{block:i.block,disabled:i.disabled}]),type:i.type,style:(0,t.normalizeStyle)({padding:i.padding,border:i.border,borderRadius:i.radius,"--bg":i.bg,"--disabled-bg":i.disabledBg})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],14,d))}}),[[`__scopeId`,`data-v-f38282d0`]]);f.install=e=>(f.name&&e.component(f.name,f),e);var p=f,m=o((0,t.defineComponent)({name:`Collapse`,__name:`collapse`,props:{open:{type:Boolean,default:!1},maxHeight:{default:`100dvh`},duration:{default:300}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`collapse`},{default:(0,t.withCtx)(()=>[n.open?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`collapse-content`,style:(0,t.normalizeStyle)({"--max-height":n.maxHeight,"--duration":n.duration+`ms`})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],4)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),[[`__scopeId`,`data-v-cc071022`]]);m.install=e=>(m.name&&e.component(m.name,m),e);var h=m,g={class:`input-box`},_=[`type`,`placeholder`],v=[`src`],y=o((0,t.defineComponent)({name:`Input`,__name:`input`,props:(0,t.mergeModels)({placeholder:{default:``},type:{default:`text`},iconVisible:{type:Boolean,default:!1},icon:{default:``}},{modelValue:{type:String,default:``},modelModifiers:{}}),emits:(0,t.mergeModels)([`click`,`enter`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useTemplateRef)(`input`),a=(0,t.useModel)(e,`modelValue`),o=e,s=()=>{r(`click`),i.value?.focus?.(),setTimeout(()=>{let e=a.value.length;i.value?.setSelectionRange?.(e,e)},0)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,g,[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{type:o.type,"onUpdate:modelValue":n[0]||=e=>a.value=e,ref:`input`,placeholder:o.placeholder,onKeyup:n[1]||=(0,t.withKeys)(t=>e.$emit(`enter`),[`enter`])},null,40,_),[[t.vModelDynamic,a.value]]),o.icon?(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:o.icon,alt:`icon`,onClick:s},null,8,v)),[[t.vShow,o.iconVisible]]):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-56cf72b9`]]);y.install=e=>(y.name&&e.component(y.name,y),e);var b=y,x={class:`menu-label`},S=[`src`],C=[`src`],w=(0,t.defineComponent)({name:`MenuItem`,__name:`menu-item`,props:(0,t.mergeModels)({checkedIcon:{},checkedIconClass:{},suffixIcon:{},suffixIconClass:{},itemContainerClass:{},itemGap:{},activeItemClass:{},subMenuContainerClass:{},deep:{},item:{},parentValue:{}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useModel)(e,`modelValue`),r=e,i=(0,t.ref)(!1),a=()=>i.value=!0,o=()=>i.value=!1,s=()=>{r.item.children?.length||(n.value=[...r.parentValue,r.item.value])};return(c,l)=>{let u=(0,t.resolveComponent)(`MenuItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`div`,{onMouseenter:a,onMouseleave:o,style:{padding:`0 8px`}},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-inner`,[r.itemContainerClass,{active:n.value?.[r.deep]===e.item.value},{[r.activeItemClass]:n.value?.[r.deep]===e.item.value}]]),onClick:s},[(0,t.createElementVNode)(`div`,x,(0,t.toDisplayString)(e.item.label),1),e.suffixIcon&&e.item.children?.length?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:r.suffixIcon,class:(0,t.normalizeClass)([`suffix-icon`,r.suffixIconClass]),alt:`suffix-icon`},null,10,S)):(0,t.createCommentVNode)(``,!0),e.checkedIcon&&!e.item.children?.length&&n.value?.[r.deep]===e.item.value?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:1,src:r.checkedIcon,class:(0,t.normalizeClass)([`checked-icon`,r.checkedIconClass]),alt:`checked-icon`},null,10,C)):(0,t.createCommentVNode)(``,!0)],2),e.item.children?.length?((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{key:0,name:`fade`},{default:(0,t.withCtx)(()=>[i.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`sub-menu-box list-box`,e.subMenuContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.item.children,(i,a)=>((0,t.openBlock)(),(0,t.createBlock)(u,{key:a,modelValue:n.value,"onUpdate:modelValue":l[0]||=e=>n.value=e,item:i,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":e.itemGap,deep:r.deep+1,"active-item-class":r.activeItemClass,"parent-value":r.parentValue.concat(e.item.value)},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`deep`,`active-item-class`,`parent-value`]))),128))],2)):(0,t.createCommentVNode)(``,!0)]),_:1})):(0,t.createCommentVNode)(``,!0)],32)}}}),T={key:0,class:`menu-list-box`},E=o((0,t.defineComponent)({name:`Menu`,__name:`menu`,props:(0,t.mergeModels)({duration:{default:100},items:{default:()=>[]},suffixIcon:{},suffixIconClass:{},checkedIcon:{},checkedIconClass:{},listContainerClass:{default:``},subMenuContainerClass:{default:``},defaultContainerClass:{default:``},itemContainerClass:{},itemGap:{default:`4px`},activeItemClass:{default:``}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:(0,t.mergeModels)([`open`,`close`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.ref)(!1),s=()=>o.value=!0,c=()=>o.value=!1;return(0,t.watch)(i,()=>{o.value=!1}),(0,t.watch)(o,e=>{r(e?`open`:`close`)}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`menu-box`,style:(0,t.normalizeStyle)({"--duration":a.duration+`ms`})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`default-box`,a.defaultContainerClass]),onMouseenter:s,onMouseleave:c},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0),(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[o.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,T,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-box`,a.listContainerClass]),style:(0,t.normalizeStyle)({"--gap":a.itemGap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:o,class:`menu-item`},[(0,t.createVNode)(w,{modelValue:i.value,"onUpdate:modelValue":r[0]||=e=>i.value=e,item:n,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":a.itemGap,deep:0,"active-item-class":a.activeItemClass,"sub-menu-container-class":a.subMenuContainerClass,"parent-value":[]},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`active-item-class`,`sub-menu-container-class`])]))),128))],6)])):(0,t.createCommentVNode)(``,!0)]),_:1})],34)],4))}}),[[`__scopeId`,`data-v-b7084c6e`]]);E.install=e=>(E.name&&e.component(E.name,E),e);var D=E,O={class:`tab-list-container-inner`},k=[`onClick`],A=o((0,t.defineComponent)({name:`Tab`,__name:`tab`,props:(0,t.mergeModels)({items:{default:()=>[]},gap:{default:`10px`},tabContainerClass:{default:``},tabItemClass:{default:``},panelContainerClass:{default:``},panelItemClass:{default:``},activeLineClass:{default:``}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useTemplateRef)(`item`),r=(0,t.ref)(!0),i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.reactive)({left:0,width:0}),s=()=>{if(!n.value)return;let e=n.value[i.value];if(!e)return;let{offsetWidth:t,offsetLeft:r}=e;o.left=r||0,o.width=t||0};return(0,t.watch)(i,()=>{r.value&&=!1,s()}),(0,t.onMounted)(async()=>{s()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`tab-box-container`,style:(0,t.normalizeStyle)({"--gap":a.gap})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`tab-list-container`,a.tabContainerClass])},[(0,t.createElementVNode)(`div`,O,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`tab-item-box`,a.tabItemClass]),onClick:e=>i.value=r,ref_for:!0,ref:`item`},[(0,t.renderSlot)(e.$slots,`default`,{item:n,index:r,active:i.value===r},void 0,!0)],10,k))),128)),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`active-tab-item-box`,[{initial:r.value},a.activeLineClass]]),style:(0,t.normalizeStyle)({left:o.left+`px`,width:o.width+`px`})},null,6)])],2),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`panel-list-container`,a.panelContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`panel-item-box`,a.panelItemClass])},[(0,t.renderSlot)(e.$slots,`panel`,{item:n,index:r,active:i.value===r},void 0,!0)],2)),[[t.vShow,i.value===r]])),128))],2)],4))}}),[[`__scopeId`,`data-v-8429c380`]]);A.install=e=>(A.name&&e.component(A.name,A),e);var j=r({Button:()=>p,Collapse:()=>h,Input:()=>b,InputOtp:()=>c,Menu:()=>D,Popup:()=>u,Tab:()=>A}),M=e=>(Object.keys(j).forEach(t=>{let n=j[t];n.install&&e.use(n)}),e),N={install:M};e.Button=p,e.Collapse=h,e.Input=b,e.InputOtp=c,e.Menu=D,e.Popup=u,e.Tab=A,e.default=N,e.install=M});
|
package/dist/lib/tab/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`./tab.js`);require(`./style.css`)
|
|
1
|
+
const e=require(`./tab.js`);require(`./style.css`);var t=e.default;t.install=e=>(t.name&&e.component(t.name,t),e),exports.default=t;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@a-drowned-fish/rox-v",
|
|
3
|
-
"version": "1.0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "1.0.25",
|
|
4
|
+
"description": "vue3 组件库,提供常用的 ui 组件,如按钮、输入框、下拉选择框、选项卡等",
|
|
5
5
|
"main": "dist/lib/index.js",
|
|
6
6
|
"module": "dist/es/index.js",
|
|
7
7
|
"types": "dist/types/components/index.d.ts",
|