@v-c/collapse 0.0.3 → 0.0.4

package/dist/Collapse.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("vue"),N=require("@v-c/util"),x=require("@v-c/util/dist/hooks/useMergedState"),O=require("@v-c/util/dist/pickAttrs"),h=require("./hooks/useItems.cjs");function I(t){let r=t;if(!Array.isArray(r)){const a=typeof r;r=a==="number"||a==="string"?[r]:[]}return r.map(a=>String(a))}const M={prefixCls:"vc-collapse"},j=i.defineComponent({props:i.mergeDefaults({prefixCls:{type:String,required:!1},activeKey:{type:[String,Number,Array],required:!1},defaultActiveKey:{type:[String,Number,Array],required:!1},openMotion:{type:null,required:!1},onChange:{type:Function,required:!1},accordion:{type:Boolean,required:!1},className:{type:String,required:!1},style:{type:Object,required:!1},destroyOnHidden:{type:Boolean,required:!1},expandIcon:{type:Function,required:!1},collapsible:{type:String,required:!1},items:{type:Array,required:!1},classNames:{type:Object,required:!1},styles:{type:Object,required:!1}},M),name:"VcCollapse",inheritAttrs:!1,setup(t,{attrs:r,expose:a,slots:d}){const n=i.ref(),[s,f]=x([],{value:i.toRef(t,"activeKey"),onChange:e=>t.onChange?.(e),defaultValue:t.defaultActiveKey,postState:I}),y=e=>t.accordion?s.value[0]===e?[]:[e]:s.value.indexOf(e)>-1?s.value.filter(l=>l!==e):[...s.value,e],p=e=>{s.value=y(e),f(s.value)};return a({ref:n}),()=>{const{prefixCls:e="vc-collapse",className:c,style:u,openMotion:l,expandIcon:v,collapsible:m,accordion:o,classNames:g,styles:q,items:A,destroyOnHidden:C}=t,b=N.classNames(e,c),K={...t,...r},S=h.useItems(A,d.default,{prefixCls:e,accordion:o,openMotion:l,expandIcon:v,collapsible:m,onItemClick:p,activeKey:s.value,destroyOnHidden:C,classNames:g,styles:q});return i.createVNode("div",i.mergeProps({ref:n,class:b,style:u,role:o?"tablist":void 0},O(K,{aria:!0,data:!0})),[S])}}});exports.default=j;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("vue"),b=require("@v-c/util"),S=require("@v-c/util/dist/hooks/useMergedState"),x=require("@v-c/util/dist/omit"),N=require("@v-c/util/dist/pickAttrs"),O=require("./hooks/useItems.cjs");function h(r){let t=r;if(!Array.isArray(t)){const a=typeof t;t=a==="number"||a==="string"?[t]:[]}return t.map(a=>String(a))}const I={prefixCls:"vc-collapse"},M=i.defineComponent({props:i.mergeDefaults({prefixCls:{type:String,required:!1},activeKey:{type:[String,Number,Array],required:!1},defaultActiveKey:{type:[String,Number,Array],required:!1},openMotion:{type:null,required:!1},onChange:{type:Function,required:!1},accordion:{type:Boolean,required:!1},destroyOnHidden:{type:Boolean,required:!1},expandIcon:{type:Function,required:!1},collapsible:{type:String,required:!1},items:{type:Array,required:!1},classNames:{type:Object,required:!1},styles:{type:Object,required:!1}},I),name:"VcCollapse",inheritAttrs:!1,setup(r,{attrs:t,expose:a,slots:d}){const l=i.ref(),[s,f]=S([],{value:i.toRef(r,"activeKey"),onChange:e=>r.onChange?.(e),defaultValue:r.defaultActiveKey,postState:h}),y=e=>r.accordion?s.value[0]===e?[]:[e]:s.value.indexOf(e)>-1?s.value.filter(n=>n!==e):[...s.value,e],p=e=>{s.value=y(e),f(s.value)};return a({ref:l}),()=>{const{prefixCls:e="vc-collapse",openMotion:c,expandIcon:o,collapsible:n,accordion:u,classNames:v,styles:m,items:g,destroyOnHidden:q}=r,A=b.classNames(e,t.class),C={...r,...x(t,["class","style"])},K=O.useItems(g,d.default,{prefixCls:e,accordion:u,openMotion:c,expandIcon:o,collapsible:n,onItemClick:p,activeKey:s.value,destroyOnHidden:q,classNames:v,styles:m});return i.createVNode("div",i.mergeProps({ref:l,class:A,style:t.style,role:u?"tablist":void 0},N(C,{aria:!0,data:!0})),[K])}}});exports.default=M;

package/dist/Collapse.js

@@ -1,19 +1,20 @@
-import { defineComponent as b, mergeDefaults as x, ref as S, toRef as O, createVNode as h, mergeProps as I } from "vue";
-import { classNames as j } from "@v-c/util";
-import M from "@v-c/util/dist/hooks/useMergedState";
+import { defineComponent as K, mergeDefaults as x, ref as N, toRef as b, createVNode as S, mergeProps as h } from "vue";
+import { classNames as O } from "@v-c/util";
+import I from "@v-c/util/dist/hooks/useMergedState";
+import M from "@v-c/util/dist/omit";
 import V from "@v-c/util/dist/pickAttrs";
-import { useItems as B } from "./hooks/useItems.js";
-function F(t) {
-  let r = t;
-  if (!Array.isArray(r)) {
-    const s = typeof r;
-    r = s === "number" || s === "string" ? [r] : [];
+import { useItems as j } from "./hooks/useItems.js";
+function B(r) {
+  let t = r;
+  if (!Array.isArray(t)) {
+    const a = typeof t;
+    t = a === "number" || a === "string" ? [t] : [];
   }
-  return r.map((s) => String(s));
+  return t.map((a) => String(a));
 }
-const H = {
+const F = {
   prefixCls: "vc-collapse"
-}, $ = /* @__PURE__ */ b({
+}, $ = /* @__PURE__ */ K({
   props: /* @__PURE__ */ x({
     prefixCls: {
       type: String,
@@ -39,14 +40,6 @@ const H = {
       type: Boolean,
       required: !1
     },
-    className: {
-      type: String,
-      required: !1
-    },
-    style: {
-      type: Object,
-      required: !1
-    },
     destroyOnHidden: {
       type: Boolean,
       required: !1
@@ -71,61 +64,59 @@ const H = {
       type: Object,
       required: !1
     }
-  }, H),
+  }, F),
   name: "VcCollapse",
   inheritAttrs: !1,
-  setup(t, {
-    attrs: r,
-    expose: s,
+  setup(r, {
+    attrs: t,
+    expose: a,
     slots: u
   }) {
-    const l = S(), [a, d] = M([], {
-      value: O(t, "activeKey"),
-      onChange: (e) => t.onChange?.(e),
-      defaultValue: t.defaultActiveKey,
-      postState: F
-    }), f = (e) => t.accordion ? a.value[0] === e ? [] : [e] : a.value.indexOf(e) > -1 ? a.value.filter((i) => i !== e) : [...a.value, e], p = (e) => {
-      a.value = f(e), d(a.value);
+    const l = N(), [s, f] = I([], {
+      value: b(r, "activeKey"),
+      onChange: (e) => r.onChange?.(e),
+      defaultValue: r.defaultActiveKey,
+      postState: B
+    }), d = (e) => r.accordion ? s.value[0] === e ? [] : [e] : s.value.indexOf(e) > -1 ? s.value.filter((i) => i !== e) : [...s.value, e], p = (e) => {
+      s.value = d(e), f(s.value);
     };
-    return s({
+    return a({
       ref: l
     }), () => {
       const {
         prefixCls: e = "vc-collapse",
-        className: n,
-        style: o,
-        openMotion: i,
-        expandIcon: y,
-        collapsible: m,
+        openMotion: n,
+        expandIcon: o,
+        collapsible: i,
         accordion: c,
-        classNames: v,
-        styles: g,
-        items: A,
-        destroyOnHidden: q
-      } = t, C = j(e, n), K = {
-        ...t,
-        ...r
-      }, N = B(A, u.default, {
+        classNames: y,
+        styles: m,
+        items: v,
+        destroyOnHidden: g
+      } = r, A = O(e, t.class), q = {
+        ...r,
+        ...M(t, ["class", "style"])
+      }, C = j(v, u.default, {
         prefixCls: e,
         accordion: c,
-        openMotion: i,
-        expandIcon: y,
-        collapsible: m,
+        openMotion: n,
+        expandIcon: o,
+        collapsible: i,
         onItemClick: p,
-        activeKey: a.value,
-        destroyOnHidden: q,
-        classNames: v,
-        styles: g
+        activeKey: s.value,
+        destroyOnHidden: g,
+        classNames: y,
+        styles: m
       });
-      return h("div", I({
+      return S("div", h({
         ref: l,
-        class: C,
-        style: o,
+        class: A,
+        style: t.style,
         role: c ? "tablist" : void 0
-      }, V(K, {
+      }, V(q, {
         aria: !0,
         data: !0
-      })), [N]);
+      })), [C]);
     };
   }
 });

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { default as Collapse } from './Collapse';
 import { default as Panel } from './Panel';
-export type { CollapsePanelProps, CollapseProps } from './interface';
+export type { CollapsePanelProps, CollapseProps, ItemType } from './interface';
 export default Collapse;
 export { Panel };

package/dist/interface.d.ts

@@ -37,8 +37,6 @@ export interface CollapseProps {
     openMotion?: TransitionProps;
     onChange?: (key: Key[]) => void;
     accordion?: boolean;
-    className?: string;
-    style?: object;
     destroyOnHidden?: boolean;
     expandIcon?: (props: object) => any;
     collapsible?: CollapsibleType;

package/package.json

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

package/src/Collapse.tsx

@@ -2,6 +2,7 @@ import type { Ref } from 'vue'
 import type { CollapseProps, Key } from './interface'
 import { classNames as classnames } from '@v-c/util'
 import useMergedState from '@v-c/util/dist/hooks/useMergedState'
+import omit from '@v-c/util/dist/omit'
 import pickAttrs from '@v-c/util/dist/pickAttrs'
 import { defineComponent, ref, toRef } from 'vue'
 import { useItems } from './hooks/useItems'
@@ -63,8 +64,6 @@ const Collapse = defineComponent<CollapseProps>({
     return () => {
       const {
         prefixCls = 'vc-collapse',
-        className,
-        style,
         openMotion,
         expandIcon,
         collapsible,
@@ -75,9 +74,9 @@ const Collapse = defineComponent<CollapseProps>({
         destroyOnHidden,
       } = props
 
-      const collapseClassName = classnames(prefixCls, className)
+      const collapseClassName = classnames(prefixCls, (attrs as any).class)
 
-      const mergedProps = { ...props, ...attrs }
+      const mergedProps = { ...props, ...omit(attrs, ['class', 'style']) }
 
       const mergedChildren = useItems(items, slots.default, {
         prefixCls,
@@ -96,7 +95,7 @@ const Collapse = defineComponent<CollapseProps>({
         <div
           ref={refWrapper}
           class={collapseClassName}
-          style={style as any}
+          style={(attrs as any).style}
           role={accordion ? 'tablist' : undefined}
           {...pickAttrs(mergedProps, { aria: true, data: true })}
         >

package/src/index.ts

@@ -1,7 +1,7 @@
 import Collapse from './Collapse'
 import Panel from './Panel'
 
-export type { CollapsePanelProps, CollapseProps } from './interface'
+export type { CollapsePanelProps, CollapseProps, ItemType } from './interface'
 
 export default Collapse
 

package/src/interface.ts

@@ -56,8 +56,6 @@ export interface CollapseProps {
   openMotion?: TransitionProps
   onChange?: (key: Key[]) => void
   accordion?: boolean
-  className?: string
-  style?: object
   destroyOnHidden?: boolean
   expandIcon?: (props: object) => any
   collapsible?: CollapsibleType