vexip-ui/lib/components/collapse/collapse.vue2.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const t=require("vue"),v=require("@vexip-ui/config"),q=require("@vexip-ui/hooks"),m=require("@vexip-ui/utils"),T=require("./props.cjs"),C=require("./symbol.cjs"),k=t.defineComponent({name:"Collapse",__name:"collapse",props:T.collapseProps,emits:["update:expanded"],setup(g,{expose:x,emit:y}){const E=g,n=v.useProps("collapse",E,{expanded:{default:null,static:!0},card:!1,accordion:!1,arrowType:{default:"right",validator:e=>["right","left","none"].includes(e)},ghost:!1}),b=y,s=v.useNameHelper("collapse"),l=t.reactive(new Set),a=t.ref([]),{target:i}=q.useModifier({passive:!1,onKeyDown:(e,r)=>{if(r.left||r.right){if(!i.value||![...l].find(({tab:c})=>c===e.target))return;const o=Array.from(i.value.querySelectorAll(s.cbe("header")));if(o.length<1)return;e.preventDefault(),e.stopPropagation();const d=document.activeElement?o.findIndex(c=>c===document.activeElement):-1;if(~d){const c=o[(d+(r.left?-1:1)+o.length)%o.length];c==null||c.focus()}}else r.escape&&(e.preventDefault(),e.stopPropagation(),_())}}),w=t.computed(()=>[s.b(),s.bs("vars"),s.bm(`arrow-${n.arrowType}`),{[s.bm("inherit")]:n.inherit,[s.bm("card")]:n.card,[s.bm("ghost")]:!n.card&&n.ghost}]),p=m.debounceMinor(()=>{if(Array.from(l.values()).forEach((e,r)=>{m.isNull(e.label)&&(e.label=r+1)}),l.size)for(const e of l)a.value.includes(e.label)?e.expanded=!0:e.expanded&&f(e.label,!0)});t.provide(C.COLLAPSE_STATE,t.reactive({arrowType:t.toRef(n,"arrowType"),registerPanel:A,unregisterPanel:S,expandPanel:f,refreshLabels:p})),t.watchEffect(()=>{const e=n.expanded,r=n.accordion&&Array.isArray(e)?e[0]:e||e===0?e:[];a.value=Array.isArray(r)?Array.from(r):[r]}),t.onMounted(()=>{t.nextTick(u),t.watch(a,(e,r)=>{P(e,r)||u()})}),x({currentExpanded:a,wrapper:i});function A(e){l.add(e),p()}function S(e){l.delete(e),f(e.label,!1),p()}function P(e,r){const o=new Set(e);return o.size!==new Set(r).size?!1:r.every(d=>o.has(d))}function f(e,r){!e&&e!==0||(n.accordion?a.value=r?[e]:[]:r?a.value.push(e):m.removeArrayItem(a.value,e),h(),u())}function _(){a.value.length&&(a.value=[],h(),u())}function h(){b("update:expanded",a.value),v.emitEvent(n.onChange,a.value)}function u(){l.forEach(e=>{e.setExpanded(a.value.includes(e.label))})}return(e,r)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"wrapper",ref:i,class:t.normalizeClass(w.value),role:"tablist",tabindex:"-1"},[t.renderSlot(e.$slots,"default")],2))}});module.exports=k;
//# sourceMappingURL=collapse.vue2.cjs.map