@v-c/collapse 0.0.2 → 0.0.3

package/dist/Panel.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),o=require("@v-c/util"),m=require("@v-c/util/dist/KeyCode"),O=require("@v-c/util/dist/omit.ts"),R=require("./PanelContent.cjs"),B={showArrow:!0,classNames:{},styles:{}},j=e.defineComponent({props:e.mergeDefaults({id:{type:String,required:!1},header:{type:null,required:!1},prefixCls:{type:String,required:!1},headerClass:{type:String,required:!1},showArrow:{type:Boolean,required:!1},class:{type:String,required:!1},classNames:{type:Object,required:!1},style:{type:Object,required:!1},styles:{type:Object,required:!1},isActive:{type:Boolean,required:!1},openMotion:{type:null,required:!1},destroyOnHidden:{type:Boolean,required:!1},accordion:{type:Boolean,required:!1},forceRender:{type:Boolean,required:!1},extra:{type:null,required:!1},onItemClick:{type:Function,required:!1},expandIcon:{type:Function,required:!1},panelKey:{type:[String,Number],required:!1},role:{type:String,required:!1},collapsible:{type:String,required:!1},children:{type:null,required:!1}},B),name:"CollapsePanel",inheritAttrs:!1,setup(a,{attrs:q,expose:N}){const d=e.computed(()=>a.collapsible==="disabled"),u=e.ref(),h=e.computed(()=>a.extra!==null&&a.extra!==void 0&&typeof a.extra!="boolean"),c=e.computed(()=>({onClick:()=>{a.onItemClick?.(a.panelKey)},onKeydown:l=>{(l.key==="Enter"||l.keyCode===m.ENTER||l.which===m.ENTER)&&a.onItemClick?.(a.panelKey)},role:a.accordion?"tab":"button","aria-expanded":a.isActive,"aria-disabled":d.value,tabIndex:d.value?-1:0}));return N({ref:u}),()=>{const{extra:l,prefixCls:s,isActive:r,class:v,expandIcon:f,forceRender:C,headerClass:b,collapsible:t,accordion:x,openMotion:g={},onItemClick:M,classNames:n={},showArrow:P=!0,destroyOnHidden:w,styles:i={},header:S,panelKey:T,children:$,...A}=a,I=o.classNames(`${s}-item`,{[`${s}-item-active`]:r,[`${s}-item-disabled`]:d.value},v),V={class:o.classNames(b,`${s}-header`,{[`${s}-collapsible-${t}`]:!!t},n.header),style:i.header,...["header","icon"].includes(t)?{}:c.value},p=typeof f=="function"?f(a):e.createVNode("i",{class:"arrow"},null),k=p&&e.createVNode("div",e.mergeProps({class:o.classNames(`${s}-expand-icon`,n?.icon),style:i?.icon},["header","icon"].includes(t)?c.value:{}),[p]),y=e.withDirectives(e.createVNode(R.default,{prefixCls:s,classNames:n,styles:i,isActive:r,forceRender:C,role:x?"tabpanel":void 0},{default:()=>$}),[[e.vShow,r]]),E={appear:!1,"leave-to-class":`${s}-panel-hidden`,...g},K={...A,...O(q,["class"])};return e.createVNode("div",e.mergeProps(K,{ref:u,class:I}),[e.createVNode("div",V,[P&&k,e.createVNode("span",e.mergeProps({class:o.classNames(`${s}-title`,n?.title),style:i?.title},t==="header"?c.value:{}),[S]),h.value&&e.createVNode("div",{class:`${s}-extra`},[l])]),e.createVNode(e.Transition,E,{default:()=>[w?r?y:null:y]})])}}});exports.default=j;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),o=require("@v-c/util"),y=require("@v-c/util/dist/KeyCode"),O=require("@v-c/util/dist/omit"),R=require("./PanelContent.cjs"),B={showArrow:!0,classNames:{},styles:{}},j=e.defineComponent({props:e.mergeDefaults({id:{type:String,required:!1},header:{type:null,required:!1},prefixCls:{type:String,required:!1},headerClass:{type:String,required:!1},showArrow:{type:Boolean,required:!1},class:{type:String,required:!1},classNames:{type:Object,required:!1},style:{type:Object,required:!1},styles:{type:Object,required:!1},isActive:{type:Boolean,required:!1},openMotion:{type:null,required:!1},destroyOnHidden:{type:Boolean,required:!1},accordion:{type:Boolean,required:!1},forceRender:{type:Boolean,required:!1},extra:{type:null,required:!1},onItemClick:{type:Function,required:!1},expandIcon:{type:Function,required:!1},panelKey:{type:[String,Number],required:!1},role:{type:String,required:!1},collapsible:{type:String,required:!1},children:{type:null,required:!1}},B),name:"CollapsePanel",inheritAttrs:!1,setup(a,{attrs:m,expose:q}){const d=e.computed(()=>a.collapsible==="disabled"),u=e.ref(),N=e.computed(()=>a.extra!==null&&a.extra!==void 0&&typeof a.extra!="boolean"),c=e.computed(()=>({onClick:()=>{a.onItemClick?.(a.panelKey)},onKeydown:l=>{(l.key==="Enter"||l.keyCode===y.ENTER||l.which===y.ENTER)&&a.onItemClick?.(a.panelKey)},role:a.accordion?"tab":"button","aria-expanded":a.isActive,"aria-disabled":d.value,tabIndex:d.value?-1:0}));return q({ref:u}),()=>{const{extra:l,prefixCls:s,isActive:r,class:h,expandIcon:f,forceRender:v,headerClass:C,collapsible:t,accordion:b,openMotion:x={},onItemClick:M,classNames:n={},showArrow:g=!0,destroyOnHidden:P,styles:i={},header:w,panelKey:T,children:S,...$}=a,A=o.classNames(`${s}-item`,{[`${s}-item-active`]:r,[`${s}-item-disabled`]:d.value},h),I={class:o.classNames(C,`${s}-header`,{[`${s}-collapsible-${t}`]:!!t},n.header),style:i.header,...["header","icon"].includes(t)?{}:c.value},p=typeof f=="function"?f(a):e.createVNode("i",{class:"arrow"},null),V=p&&e.createVNode("div",e.mergeProps({class:o.classNames(`${s}-expand-icon`,n?.icon),style:i?.icon},["header","icon"].includes(t)?c.value:{}),[p]),k=e.withDirectives(e.createVNode(R.default,{prefixCls:s,classNames:n,styles:i,isActive:r,forceRender:v,role:b?"tabpanel":void 0},{default:()=>S}),[[e.vShow,r]]),E={appear:!1,"leave-to-class":`${s}-panel-hidden`,...x},K={...$,...O(m,["class"])};return e.createVNode("div",e.mergeProps(K,{ref:u,class:A}),[e.createVNode("div",I,[g&&V,e.createVNode("span",e.mergeProps({class:o.classNames(`${s}-title`,n?.title),style:i?.title},t==="header"?c.value:{}),[w]),N.value&&e.createVNode("div",{class:`${s}-extra`},[l])]),e.createVNode(e.Transition,E,{default:()=>[!P||r?k:null]})])}}});exports.default=j;

package/dist/Panel.js

@@ -1,7 +1,7 @@
 import { defineComponent as j, mergeDefaults as T, computed as u, ref as D, createVNode as l, mergeProps as f, withDirectives as F, vShow as H, Transition as M } from "vue";
 import { classNames as o } from "@v-c/util";
-import q from "@v-c/util/dist/KeyCode";
-import z from "@v-c/util/dist/omit.ts";
+import h from "@v-c/util/dist/KeyCode";
+import z from "@v-c/util/dist/omit";
 import V from "./PanelContent.js";
 const W = {
   showArrow: !0,
@@ -97,85 +97,85 @@ const W = {
   name: "CollapsePanel",
   inheritAttrs: !1,
   setup(e, {
-    attrs: C,
-    expose: v
+    attrs: q,
+    expose: C
   }) {
-    const d = u(() => e.collapsible === "disabled"), p = D(), b = u(() => e.extra !== null && e.extra !== void 0 && typeof e.extra != "boolean"), c = u(() => ({
+    const d = u(() => e.collapsible === "disabled"), p = D(), v = u(() => e.extra !== null && e.extra !== void 0 && typeof e.extra != "boolean"), c = u(() => ({
       onClick: () => {
         e.onItemClick?.(e.panelKey);
       },
       onKeydown: (s) => {
-        (s.key === "Enter" || s.keyCode === q.ENTER || s.which === q.ENTER) && e.onItemClick?.(e.panelKey);
+        (s.key === "Enter" || s.keyCode === h.ENTER || s.which === h.ENTER) && e.onItemClick?.(e.panelKey);
       },
       role: e.accordion ? "tab" : "button",
       "aria-expanded": e.isActive,
       "aria-disabled": d.value,
       tabIndex: d.value ? -1 : 0
     }));
-    return v({
+    return C({
       ref: p
     }), () => {
       const {
         extra: s,
         prefixCls: a,
         isActive: t,
-        class: x,
+        class: b,
         expandIcon: y,
-        forceRender: N,
-        headerClass: w,
+        forceRender: x,
+        headerClass: N,
         collapsible: r,
-        accordion: g,
-        openMotion: P = {},
+        accordion: w,
+        openMotion: g = {},
         onItemClick: G,
         classNames: n = {},
-        showArrow: $ = !0,
-        destroyOnHidden: A,
+        showArrow: P = !0,
+        destroyOnHidden: $,
         styles: i = {},
-        header: I,
+        header: A,
         panelKey: J,
-        children: S,
-        ...k
-      } = e, E = o(`${a}-item`, {
+        children: I,
+        ...S
+      } = e, k = o(`${a}-item`, {
         [`${a}-item-active`]: t,
         [`${a}-item-disabled`]: d.value
-      }, x), K = {
-        class: o(w, `${a}-header`, {
+      }, b), E = {
+        class: o(N, `${a}-header`, {
           [`${a}-collapsible-${r}`]: !!r
         }, n.header),
         style: i.header,
         ...["header", "icon"].includes(r) ? {} : c.value
       }, m = typeof y == "function" ? y(e) : l("i", {
         class: "arrow"
-      }, null), R = m && l("div", f({
+      }, null), K = m && l("div", f({
         class: o(`${a}-expand-icon`, n?.icon),
         style: i?.icon
-      }, ["header", "icon"].includes(r) ? c.value : {}), [m]), h = F(l(V, {
+      }, ["header", "icon"].includes(r) ? c.value : {}), [m]), R = F(l(V, {
         prefixCls: a,
         classNames: n,
         styles: i,
         isActive: t,
-        forceRender: N,
-        role: g ? "tabpanel" : void 0
+        forceRender: x,
+        role: w ? "tabpanel" : void 0
       }, {
-        default: () => S
+        default: () => I
       }), [[H, t]]), B = {
         appear: !1,
         "leave-to-class": `${a}-panel-hidden`,
-        ...P
+        ...g
       }, O = {
-        ...k,
-        ...z(C, ["class"])
+        ...S,
+        ...z(q, ["class"])
       };
       return l("div", f(O, {
         ref: p,
-        class: E
-      }), [l("div", K, [$ && R, l("span", f({
+        class: k
+      }), [l("div", E, [P && K, l("span", f({
         class: o(`${a}-title`, n?.title),
         style: i?.title
-      }, r === "header" ? c.value : {}), [I]), b.value && l("div", {
+      }, r === "header" ? c.value : {}), [A]), v.value && l("div", {
         class: `${a}-extra`
       }, [s])]), l(M, B, {
-        default: () => [A ? t ? h : null : h]
+        default: () => [!$ || t ? R : null]
       })]);
     };
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@v-c/collapse",
   "type": "module",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "publishConfig": {
     "access": "public"
   },

package/src/Panel.tsx

@@ -2,7 +2,7 @@ import type { HTMLAttributes } from 'vue'
 import type { CollapsePanelProps } from './interface'
 import { classNames as classnames } from '@v-c/util'
 import KeyCode from '@v-c/util/dist/KeyCode'
-import omit from '@v-c/util/dist/omit.ts'
+import omit from '@v-c/util/dist/omit'
 import { computed, defineComponent, ref, Transition } from 'vue'
 import PanelContent from './PanelContent'
 
@@ -167,7 +167,7 @@ const CollapsePanel = defineComponent<CollapsePanelProps>({
           </div>
 
           <Transition {...transitionProps}>
-            { !destroyOnHidden ? panelContent : (isActive ? panelContent : null) }
+            { !destroyOnHidden || isActive ? panelContent : null}
           </Transition>
         </div>
       )