@volverjs/ui-vue 0.0.4 → 0.0.5-beta.2

package/README.md

@@ -96,7 +96,7 @@ Than you can import components and use them in your templates.
    * all components are also available with a dedicated export
    * import VvButton from '@volverjs/ui-vue/vv-button'
    */
-  import { VvButton } from '@volverjs/ui-vue'
+  import { VvButton } from '@volverjs/ui-vue/components'
   /*
    * import the component style
    * for scss support you can import the scss file
@@ -163,12 +163,12 @@ The following features are planned for the next releases:
 - [x] (v0.0.3) `VvTooltip` component and `v-tooltip` directive;
 - [x] (v0.0.3) Redesign of `VvCombobox` for better accessibility and more features;
 - [x] (v0.0.3) Rewrite of `VvDropdown` to get it applicable to any element;
+- [x] (v0.0.5) Input masks for `VvInputText` component;
 - [ ] `VvAvatar` component;
 - [ ] `VvAvatarGroup` component;
 - [ ] Alerts, notifications and toasts with `VvAlert` and `VvToast` component;
 - [ ] Loaders with `VvLoader` and `VvSkeleton`;
 - [ ] Menus, navigation and tabs with `VvNav`;
-- [ ] Input masks for `VvInputText` component;
 - [ ] `VvTable` component with sort, filters, pagination and cell editing;
 - [ ] Multiple uploads, image crop and file previews with `VvInputFile`;
 - [ ] Carousel and galleries with `VvCarousel` component;

package/auto-imports.d.ts

@@ -1,4 +1,7 @@
-// Generated by 'unplugin-auto-import'
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-auto-import
 export {}
 declare global {
   const EffectScope: typeof import('vue')['EffectScope']
@@ -84,7 +87,6 @@ declare global {
   const refWithControl: typeof import('@vueuse/core')['refWithControl']
   const removeFromList: typeof import('./src/utils/ObjectUtilities')['removeFromList']
   const resolveComponent: typeof import('vue')['resolveComponent']
-  const resolveDirective: typeof import('vue')['resolveDirective']
   const resolveFieldData: typeof import('./src/utils/ObjectUtilities')['resolveFieldData']
   const resolveRef: typeof import('@vueuse/core')['resolveRef']
   const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
@@ -114,6 +116,7 @@ declare global {
   const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
   const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
   const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayFindLast: typeof import('@vueuse/core')['useArrayFindLast']
   const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
   const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
   const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
@@ -124,7 +127,6 @@ declare global {
   const useAttrs: typeof import('vue')['useAttrs']
   const useBase64: typeof import('@vueuse/core')['useBase64']
   const useBattery: typeof import('@vueuse/core')['useBattery']
-  const useBemModifiers: typeof import('./src/composables/useModifiers')['useBemModifiers']
   const useBluetooth: typeof import('@vueuse/core')['useBluetooth']
   const useBreakpoints: typeof import('@vueuse/core')['useBreakpoints']
   const useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
@@ -148,6 +150,7 @@ declare global {
   const useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
   const useDebouncedInput: typeof import('./src/composables/useDebouncedInput')['useDebouncedInput']
   const useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+  const useDefaults: typeof import('./src/composables/useDefaults')['useDefaults']
   const useDeviceMotion: typeof import('@vueuse/core')['useDeviceMotion']
   const useDeviceOrientation: typeof import('@vueuse/core')['useDeviceOrientation']
   const useDevicePixelRatio: typeof import('@vueuse/core')['useDevicePixelRatio']
@@ -194,6 +197,7 @@ declare global {
   const useMediaQuery: typeof import('@vueuse/core')['useMediaQuery']
   const useMemoize: typeof import('@vueuse/core')['useMemoize']
   const useMemory: typeof import('@vueuse/core')['useMemory']
+  const useModifiers: typeof import('./src/composables/useModifiers')['useModifiers']
   const useMounted: typeof import('@vueuse/core')['useMounted']
   const useMouse: typeof import('@vueuse/core')['useMouse']
   const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
@@ -291,3 +295,8 @@ declare global {
   const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
   const whenever: typeof import('@vueuse/core')['whenever']
 }
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode } from 'vue'
+}

package/bin/icons.cjs

@@ -1,73 +1 @@
-(function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("fs"), require("yargs"), require("yargs/helpers"), require("@iconify/tools"), require("path"), require("@iconify/utils")) : typeof define === "function" && define.amd ? define(["exports", "fs", "yargs", "yargs/helpers", "@iconify/tools", "path", "@iconify/utils"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global["generate-icons"] = {}, global.fileSystem, global.yargs, global.helpers, global.tools, global.path, global.utils));
-})(this, function(exports2, fileSystem, yargs, helpers, tools, path, utils) {
-  "use strict";
-  function getAllFiles(dirPath, prefix = "iconify", objectFiles = {}) {
-    const files = fileSystem.readdirSync(dirPath);
-    files.forEach(function(file) {
-      if (fileSystem.statSync(dirPath + "/" + file).isDirectory()) {
-        objectFiles = getAllFiles(dirPath + "/" + file, file, objectFiles);
-      } else {
-        if (file.includes(".svg")) {
-          objectFiles[prefix] ? objectFiles[prefix].push(path.join(dirPath, "/", file)) : objectFiles[prefix] = [path.join(dirPath, "/", file)];
-        }
-      }
-    });
-    return objectFiles;
-  }
-  async function generateIcons(prefix, files, destPath2) {
-    const iconSet = tools.blankIconSet(prefix);
-    for (const file of files) {
-      const content = await fileSystem.promises.readFile(file, {
-        encoding: "utf-8"
-      });
-      const svg = new tools.SVG(content);
-      await tools.cleanupSVG(svg);
-      await tools.parseColors(svg, {
-        defaultColor: "currentColor",
-        callback: (attr, colorStr, color) => {
-          return !color || tools.isEmptyColor(color) ? colorStr : "currentColor";
-        }
-      });
-      await tools.runSVGO(svg);
-      const fileName = file.replace(/^.*[\\/]/, "").split(".")[0].replace(/ /g, "-").replace(/[^a-z0-9-]/gi, "");
-      iconSet.fromSVG(fileName, svg);
-    }
-    const iconifyJson = iconSet.export();
-    try {
-      utils.validateIconSet(iconifyJson);
-    } catch (error) {
-      throw new Error(
-        `Icon set is not valid: ${error == null ? void 0 : error.message}`
-      );
-    }
-    fileSystem.writeFileSync(
-      `${destPath2}/${iconifyJson.prefix}.json`,
-      JSON.stringify(iconifyJson)
-    );
-  }
-  function createIconifyJsonFiles(srcPath2, destPath2, prefix) {
-    const objectFiles = getAllFiles(srcPath2, prefix);
-    if (!Object.keys(objectFiles).length) {
-      console.error(`There are no files in ${srcPath2}`);
-    } else {
-      Object.keys(objectFiles).forEach((prefix2) => {
-        generateIcons(prefix2, objectFiles[prefix2], destPath2);
-        console.info(`Icons generated in: ${destPath2}/${prefix2}.json
-`);
-      });
-    }
-  }
-  const argv = yargs(helpers.hideBin(process.argv)).argv;
-  const srcPath = argv.srcPath;
-  const destPath = argv.destPath || srcPath;
-  if (!srcPath || !destPath) {
-    console.error(
-      "Please specify the srcPath and destPath with --srcPath and --destPath"
-    );
-    process.exit();
-  }
-  createIconifyJsonFiles(srcPath, destPath, argv.prefix);
-  exports2.createIconifyJsonFiles = createIconifyJsonFiles;
-  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
-});
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("fs"),require("yargs"),require("yargs/helpers"),require("@iconify/tools"),require("path"),require("@iconify/utils")):"function"==typeof define&&define.amd?define(["exports","fs","yargs","yargs/helpers","@iconify/tools","path","@iconify/utils"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self)["generate-icons"]={},e.fileSystem,e.yargs,e.helpers,e.tools,e.path,e.utils)}(this,(function(e,o,t,r,n,i,s){"use strict";function c(e,t="iconify",r={}){return o.readdirSync(e).forEach((function(n){o.statSync(e+"/"+n).isDirectory()?r=c(e+"/"+n,n,r):n.includes(".svg")&&(r[t]?r[t].push(i.join(e,"/",n)):r[t]=[i.join(e,"/",n)])})),r}function a(e,t,r){const i=c(e,r);Object.keys(i).length?Object.keys(i).forEach((e=>{!async function(e,t,r){const i=n.blankIconSet(e);for(const s of t){const e=await o.promises.readFile(s,{encoding:"utf-8"}),t=new n.SVG(e);await n.cleanupSVG(t),await n.parseColors(t,{defaultColor:"currentColor",callback:(e,o,t)=>!t||n.isEmptyColor(t)?o:"currentColor"}),await n.runSVGO(t);const r=s.replace(/^.*[\\/]/,"").split(".")[0].replace(/ /g,"-").replace(/[^a-z0-9-]/gi,"");i.fromSVG(r,t)}const c=i.export();try{s.validateIconSet(c)}catch(a){throw new Error(`Icon set is not valid: ${null==a?void 0:a.message}`)}o.writeFileSync(`${r}/${c.prefix}.json`,JSON.stringify(c))}(e,i[e],t),console.info(`Icons generated in: ${t}/${e}.json\n`)})):console.error(`There are no files in ${e}`)}const l=t(r.hideBin(process.argv)).argv,f=l.srcPath,u=l.destPath||f;f&&u||(console.error("Please specify the srcPath and destPath with --srcPath and --destPath"),process.exit()),a(f,u,l.prefix),e.createIconifyJsonFiles=a,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));

package/dist/Volver.d.ts

@@ -1,5 +1,5 @@
 import { type IconifyIcon, type IconifyJSON, type PartialIconifyAPIConfig } from '@iconify/vue';
-import type { Component, Directive, Plugin } from 'vue';
+import type { Component, Directive, Plugin, Ref } from 'vue';
 export declare function useDefaultProps(component: Component, defaults?: Record<string, unknown>, name?: string): Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
 export type DefaultOptions = Record<string, Record<string, unknown>>;
 export type VolverOptions = {
@@ -25,7 +25,7 @@ export type VolverOptions = {
      * @see https://docs.iconify.design/icon-components/vue/add-collection.html
      * @default 'vv'
      */
-    provider?: string;
+    iconsProvider?: string;
     /**
      * Components to install
      */
@@ -66,16 +66,16 @@ export interface VolverInterface {
      */
     addIcon(name: string, data: IconifyIcon): boolean;
     /**
-     * Add custom config for provider
+     * Add custom config for icons provider
      * @param {String} provider
      * @param {PartialIconifyAPIConfig} customConfig
      * @returns {Boolean} true on success, false if something is wrong with data
      */
-    addAPIProvider(provider: string, customConfig: PartialIconifyAPIConfig): boolean;
+    addIconsAPIProvider(provider: string, customConfig: PartialIconifyAPIConfig): boolean;
     /**
      * Current provider
      */
-    provider: string;
+    iconsProvider: string;
     /**
      * Array of installed iconify collections
      * @see https://docs.iconify.design/types/iconify-json.html
@@ -85,16 +85,24 @@ export interface VolverInterface {
      * Set true inside nuxt
      */
     nuxt: boolean;
+    /**
+     * Components defaults options
+     */
+    defaults: Ref<DefaultOptions>;
 }
 export declare class Volver implements VolverInterface {
-    fetchOptions: RequestInit;
-    nuxt: boolean;
-    iconsCollections: IconifyJSON[];
-    provider: string;
-    constructor({ fetchWithCredentials, fetchOptions, provider, nuxt, iconsCollections, }?: VolverOptions);
+    private _fetchOptions;
+    private _iconsCollections;
+    private _iconsProvider;
+    private _nuxt;
+    defaults: Ref<DefaultOptions>;
+    constructor({ fetchWithCredentials, fetchOptions, iconsProvider, nuxt, iconsCollections, defaults, }?: VolverOptions);
+    get nuxt(): boolean;
+    get iconsProvider(): string;
+    get iconsCollections(): IconifyJSON[];
     addCollection(collection: IconifyJSON, providerName?: string): boolean;
     addIcon(name: string, data: IconifyIcon): boolean;
-    addAPIProvider(provider: string, customConfig: PartialIconifyAPIConfig): boolean;
+    addIconsAPIProvider(provider: string, customConfig: PartialIconifyAPIConfig): boolean;
     fetchIcon(src: string, options?: RequestInit): Promise<string | undefined>;
 }
 declare const VolverPlugin: Plugin;

package/dist/components/VvAccordion/VvAccordion.es.js

@@ -1,41 +1,43 @@
-import { unref as r, inject as E, computed as i, toRef as S, toRefs as $, defineComponent as I, useAttrs as V, ref as j, openBlock as k, createElementBlock as B, normalizeClass as N, withModifiers as P, createElementVNode as g, renderSlot as A, normalizeProps as b, guardReactiveProps as C, createTextVNode as G, toDisplayString as O } from "vue";
-import { nanoid as D } from "nanoid";
-import { useToggle as M } from "@vueuse/core";
-const T = Symbol.for("accordionGroup");
-function z(o) {
-  return ((e) => e == null || e === "" || Array.isArray(e) && e.length === 0 || !(e instanceof Date) && typeof e == "object" && Object.keys(e).length === 0)(r(o));
+import { unref, inject, computed, toRef, toRefs, defineComponent, useAttrs, ref, openBlock, createElementBlock, normalizeClass, createElementVNode, withModifiers, renderSlot, normalizeProps, guardReactiveProps, createTextVNode, toDisplayString } from "vue";
+import { nanoid } from "nanoid";
+import { useToggle } from "@vueuse/core";
+const INJECTION_KEY_ACCORDION_GROUP = Symbol.for("accordionGroup");
+function isEmpty(value) {
+  return ((value2) => value2 === null || value2 === void 0 || value2 === "" || Array.isArray(value2) && value2.length === 0 || !(value2 instanceof Date) && typeof value2 === "object" && Object.keys(value2).length === 0)(unref(value));
 }
-function L(o) {
-  const e = E(o, void 0), l = i(() => !z(e));
-  function a(t, s, d) {
-    if (e != null && e.value) {
-      const u = r(e.value)[t];
-      return i({
+function useInjectedGroupState(groupKey) {
+  const group = inject(groupKey, void 0);
+  const isInGroup = computed(() => !isEmpty(group));
+  function getGroupOrLocalRef(propName, props, emit) {
+    if (group == null ? void 0 : group.value) {
+      const groupPropValue = unref(group.value)[propName];
+      return computed({
         get() {
-          return u == null ? void 0 : u.value;
+          return groupPropValue == null ? void 0 : groupPropValue.value;
         },
-        set(v) {
-          u.value = v;
+        set(value) {
+          groupPropValue.value = value;
         }
       });
     }
-    const p = S(s, t);
-    return i({
+    const propRef = toRef(props, propName);
+    return computed({
       get() {
-        return p.value;
+        return propRef.value;
       },
-      set(u) {
-        d && d(`update:${t}`, u);
+      set(value) {
+        if (emit)
+          emit(`update:${propName}`, value);
       }
     });
   }
   return {
-    group: e,
-    isInGroup: l,
-    getGroupOrLocalRef: a
+    group,
+    isInGroup,
+    getGroupOrLocalRef
   };
 }
-const x = {
+const VvAccordionProps = {
   /**
    * Accordion name
    */
@@ -62,110 +64,167 @@ const x = {
   /**
    * If true, the accordion will be disabled
    */
-  disabled: Boolean
-}, J = ["update:modelValue"];
-function K(o, e) {
-  const { group: l, isInGroup: a, getGroupOrLocalRef: t } = L(
-    T
-  ), { title: s, content: d } = $(o), p = t("modelValue", o, e), u = t("disabled", o), v = t("collapse", o), n = t("modifiers", o);
+  disabled: Boolean,
+  /**
+   * If true, the accordion will be opened by default
+   */
+  not: Boolean
+};
+const VvAccordionEvents = ["update:modelValue"];
+function useGroupProps(props, emit) {
+  const { group, isInGroup, getGroupOrLocalRef } = useInjectedGroupState(
+    INJECTION_KEY_ACCORDION_GROUP
+  );
+  const { title, content } = toRefs(props);
+  const modelValue = getGroupOrLocalRef("modelValue", props, emit);
+  const not = getGroupOrLocalRef("not", props);
+  const collapse = getGroupOrLocalRef("collapse", props);
+  const modifiers = getGroupOrLocalRef("modifiers", props);
+  const disabled = computed(
+    () => {
+      var _a;
+      return Boolean(props.disabled || ((_a = group == null ? void 0 : group.value) == null ? void 0 : _a.disabled.value));
+    }
+  );
   return {
     // group props
-    modelValue: p,
-    disabled: u,
-    isInGroup: a,
-    group: l,
-    collapse: v,
-    modifiers: n,
+    modelValue,
+    not,
+    isInGroup,
+    group,
+    collapse,
+    modifiers,
+    disabled,
     // local props
-    title: s,
-    content: d
+    title,
+    content
   };
 }
-function U(o, e, l) {
-  return i(() => {
-    const a = {
-      [o]: !0
-    }, t = typeof (e == null ? void 0 : e.value) == "string" ? e.value.split(" ") : e == null ? void 0 : e.value;
-    return t && Array.isArray(t) && t.forEach((s) => {
-      a[`${o}--${s}`] = !0;
-    }), l && Object.keys(l.value).forEach((s) => {
-      a[`${o}--${s}`] = r(l.value[s]);
-    }), a;
+function useModifiers(prefix, modifiers, others) {
+  return computed(() => {
+    const toReturn = {
+      [prefix]: true
+    };
+    const modifiersArray = typeof (modifiers == null ? void 0 : modifiers.value) === "string" ? modifiers.value.split(" ") : modifiers == null ? void 0 : modifiers.value;
+    if (modifiersArray) {
+      if (Array.isArray(modifiersArray)) {
+        modifiersArray.forEach((modifier) => {
+          if (modifier) {
+            toReturn[`${prefix}--${modifier}`] = true;
+          }
+        });
+      }
+    }
+    if (others) {
+      Object.keys(others.value).forEach((key) => {
+        toReturn[`${prefix}--${key}`] = unref(others.value[key]);
+      });
+    }
+    return toReturn;
   });
 }
-const Y = ["id", "open"], q = ["aria-controls", "aria-expanded"], F = ["aria-hidden"], H = {
+const _hoisted_1 = ["id", "open"];
+const _hoisted_2 = ["aria-controls", "aria-expanded"];
+const _hoisted_3 = ["aria-hidden"];
+const __default__ = {
   name: "VvAccordion"
-}, w = /* @__PURE__ */ I({
-  ...H,
-  props: x,
-  emits: J,
-  setup(o, { emit: e }) {
-    const l = o, a = V(), t = i(
-      () => l.name || (a == null ? void 0 : a.id) || D()
-    ), {
-      modifiers: s,
-      title: d,
-      content: p,
-      disabled: u,
-      collapse: v,
-      modelValue: n,
-      isInGroup: y
-    } = K(l, e), _ = j(!1), f = i({
-      get: () => y.value ? v.value && Array.isArray(n.value) ? n.value.includes(t.value) : n.value === t.value : n.value === void 0 ? _.value : n.value,
-      set: (c) => {
-        if (y.value) {
-          if (v.value && Array.isArray(n.value)) {
-            if (c) {
-              n.value.push(t.value);
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: VvAccordionProps,
+  emits: VvAccordionEvents,
+  setup(__props, { emit }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const accordionName = computed(
+      () => props.name || (attrs == null ? void 0 : attrs.id) || nanoid()
+    );
+    const {
+      modifiers,
+      title,
+      content,
+      disabled,
+      collapse,
+      modelValue,
+      isInGroup,
+      not
+    } = useGroupProps(props, emit);
+    const localModelValue = ref(false);
+    const isOpen = computed({
+      get: () => {
+        let toReturn = modelValue.value;
+        if (isInGroup.value) {
+          if (collapse.value && Array.isArray(modelValue.value)) {
+            toReturn = modelValue.value.includes(accordionName.value);
+          } else {
+            toReturn = modelValue.value === accordionName.value;
+          }
+        } else if (modelValue.value === void 0) {
+          toReturn = localModelValue.value;
+        }
+        return not.value ? !toReturn : toReturn;
+      },
+      set: (newValue) => {
+        if (not.value) {
+          newValue = !newValue;
+        }
+        if (isInGroup.value) {
+          if (collapse.value && Array.isArray(modelValue.value)) {
+            if (newValue) {
+              modelValue.value.push(accordionName.value);
               return;
             }
-            n.value = n.value.filter(
-              (m) => m !== t.value
+            modelValue.value = modelValue.value.filter(
+              (name) => name !== accordionName.value
             );
             return;
           }
-          n.value = c ? t.value : null;
+          modelValue.value = newValue ? accordionName.value : null;
           return;
         }
-        if (n.value === void 0 && typeof c == "boolean") {
-          _.value = c;
+        if (modelValue.value === void 0 && typeof newValue === "boolean") {
+          localModelValue.value = newValue;
           return;
         }
-        n.value = c;
+        modelValue.value = newValue;
       }
-    }), R = U(
+    });
+    const bemCssClasses = useModifiers(
       "vv-accordion",
-      s,
-      i(() => ({
-        disabled: u.value
+      modifiers,
+      computed(() => ({
+        disabled: disabled.value
       }))
-    ), h = M(f);
-    return (c, m) => (k(), B("details", {
-      id: r(t),
-      class: N(r(R)),
-      open: r(f),
-      onClick: m[0] || (m[0] = P((Q) => r(h)(), ["prevent"]))
-    }, [
-      g("summary", {
-        "aria-controls": r(t),
-        "aria-expanded": r(f),
-        class: "vv-collapse__summary"
-      }, [
-        A(c.$slots, "summary", b(C({ open: r(f) })), () => [
-          G(O(r(d)), 1)
-        ])
-      ], 8, q),
-      g("div", {
-        "aria-hidden": !r(f),
-        class: "vv-collapse__content"
+    );
+    const onClick = useToggle(isOpen);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("details", {
+        id: unref(accordionName),
+        class: normalizeClass(unref(bemCssClasses)),
+        open: unref(isOpen)
       }, [
-        A(c.$slots, "details", b(C({ open: r(f) })), () => [
-          G(O(r(p)), 1)
-        ])
-      ], 8, F)
-    ], 10, Y));
+        createElementVNode("summary", {
+          "aria-controls": unref(accordionName),
+          "aria-expanded": unref(isOpen),
+          class: "vv-accordion__summary",
+          onClick: _cache[0] || (_cache[0] = withModifiers(($event) => unref(onClick)(), ["prevent"]))
+        }, [
+          renderSlot(_ctx.$slots, "summary", normalizeProps(guardReactiveProps({ open: unref(isOpen) })), () => [
+            createTextVNode(toDisplayString(unref(title)), 1)
+          ])
+        ], 8, _hoisted_2),
+        createElementVNode("div", {
+          "aria-hidden": !unref(isOpen),
+          class: "vv-accordion__content"
+        }, [
+          renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ open: unref(isOpen) })), () => [
+            createTextVNode(toDisplayString(unref(content)), 1)
+          ])
+        ], 8, _hoisted_3)
+      ], 10, _hoisted_1);
+    };
   }
 });
 export {
-  w as default
+  _sfc_main as default
 };

package/dist/components/VvAccordion/VvAccordion.umd.js

@@ -1 +1 @@
-(function(e,p){typeof exports=="object"&&typeof module<"u"?module.exports=p(require("vue"),require("nanoid"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["vue","nanoid","@vueuse/core"],p):(e=typeof globalThis<"u"?globalThis:e||self,e.VvAccordion=p(e.vue,e.nanoid,e.core))})(this,function(e,p,g){"use strict";const h=Symbol.for("accordionGroup");function v(o){return(n=>n==null||n===""||Array.isArray(n)&&n.length===0||!(n instanceof Date)&&typeof n=="object"&&Object.keys(n).length===0)(e.unref(o))}function R(o){const n=e.inject(o,void 0),s=e.computed(()=>!v(n));function a(t,i,u){if(n!=null&&n.value){const c=e.unref(n.value)[t];return e.computed({get(){return c==null?void 0:c.value},set(d){c.value=d}})}const m=e.toRef(i,t);return e.computed({get(){return m.value},set(c){u&&u(`update:${t}`,c)}})}return{group:n,isInGroup:s,getGroupOrLocalRef:a}}const S={name:String,title:String,content:String,modelValue:{type:Boolean,default:void 0},modifiers:[String,Array],disabled:Boolean},b=["update:modelValue"];function C(o,n){const{group:s,isInGroup:a,getGroupOrLocalRef:t}=R(h),{title:i,content:u}=e.toRefs(o),m=t("modelValue",o,n),c=t("disabled",o),d=t("collapse",o),r=t("modifiers",o);return{modelValue:m,disabled:c,isInGroup:a,group:s,collapse:d,modifiers:r,title:i,content:u}}function E(o,n,s){return e.computed(()=>{const a={[o]:!0},t=typeof(n==null?void 0:n.value)=="string"?n.value.split(" "):n==null?void 0:n.value;return t&&Array.isArray(t)&&t.forEach(i=>{a[`${o}--${i}`]=!0}),s&&Object.keys(s.value).forEach(i=>{a[`${o}--${i}`]=e.unref(s.value[i])}),a})}const G=["id","open"],O=["aria-controls","aria-expanded"],V=["aria-hidden"],$={name:"VvAccordion"};return e.defineComponent({...$,props:S,emits:b,setup(o,{emit:n}){const s=o,a=e.useAttrs(),t=e.computed(()=>s.name||(a==null?void 0:a.id)||p.nanoid()),{modifiers:i,title:u,content:m,disabled:c,collapse:d,modelValue:r,isInGroup:_}=C(s,n),A=e.ref(!1),f=e.computed({get:()=>_.value?d.value&&Array.isArray(r.value)?r.value.includes(t.value):r.value===t.value:r.value===void 0?A.value:r.value,set:l=>{if(_.value){if(d.value&&Array.isArray(r.value)){if(l){r.value.push(t.value);return}r.value=r.value.filter(y=>y!==t.value);return}r.value=l?t.value:null;return}if(r.value===void 0&&typeof l=="boolean"){A.value=l;return}r.value=l}}),I=E("vv-accordion",i,e.computed(()=>({disabled:c.value}))),j=g.useToggle(f);return(l,y)=>(e.openBlock(),e.createElementBlock("details",{id:e.unref(t),class:e.normalizeClass(e.unref(I)),open:e.unref(f),onClick:y[0]||(y[0]=e.withModifiers(P=>e.unref(j)(),["prevent"]))},[e.createElementVNode("summary",{"aria-controls":e.unref(t),"aria-expanded":e.unref(f),class:"vv-collapse__summary"},[e.renderSlot(l.$slots,"summary",e.normalizeProps(e.guardReactiveProps({open:e.unref(f)})),()=>[e.createTextVNode(e.toDisplayString(e.unref(u)),1)])],8,O),e.createElementVNode("div",{"aria-hidden":!e.unref(f),class:"vv-collapse__content"},[e.renderSlot(l.$slots,"details",e.normalizeProps(e.guardReactiveProps({open:e.unref(f)})),()=>[e.createTextVNode(e.toDisplayString(e.unref(m)),1)])],8,V)],10,G))}})});
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("vue"),require("nanoid"),require("@vueuse/core")):"function"==typeof define&&define.amd?define(["vue","nanoid","@vueuse/core"],o):(e="undefined"!=typeof globalThis?globalThis:e||self).VvAccordion=o(e.vue,e.nanoid,e.core)}(this,(function(e,o,n){"use strict";const r=Symbol.for("accordionGroup");function t(o){const n=e.inject(o,void 0),r=e.computed((()=>{return o=n,!(null==(r=e.unref(o))||""===r||Array.isArray(r)&&0===r.length||!(r instanceof Date)&&"object"==typeof r&&0===Object.keys(r).length);var o,r}));return{group:n,isInGroup:r,getGroupOrLocalRef:function(o,r,t){if(null==n?void 0:n.value){const r=e.unref(n.value)[o];return e.computed({get:()=>null==r?void 0:r.value,set(e){r.value=e}})}const u=e.toRef(r,o);return e.computed({get:()=>u.value,set(e){t&&t(`update:${o}`,e)}})}}}const u={name:String,title:String,content:String,modelValue:{type:Boolean,default:void 0},modifiers:[String,Array],disabled:Boolean,not:Boolean};const a=["id","open"],l=["aria-controls","aria-expanded"],i=["aria-hidden"];return e.defineComponent({name:"VvAccordion",props:u,emits:["update:modelValue"],setup(u,{emit:d}){const s=u,c=e.useAttrs(),v=e.computed((()=>s.name||(null==c?void 0:c.id)||o.nanoid())),{modifiers:f,title:p,content:m,disabled:y,collapse:g,modelValue:b,isInGroup:A,not:h}=function(o,n){const{group:u,isInGroup:a,getGroupOrLocalRef:l}=t(r),{title:i,content:d}=e.toRefs(o),s=l("modelValue",o,n),c=l("not",o),v=l("collapse",o),f=l("modifiers",o),p=e.computed((()=>{var e;return Boolean(o.disabled||(null==(e=null==u?void 0:u.value)?void 0:e.disabled.value))}));return{modelValue:s,not:c,isInGroup:a,group:u,collapse:v,modifiers:f,disabled:p,title:i,content:d}}(s,d),V=e.ref(!1),S=e.computed({get:()=>{let e=b.value;return A.value?e=g.value&&Array.isArray(b.value)?b.value.includes(v.value):b.value===v.value:void 0===b.value&&(e=V.value),h.value?!e:e},set:e=>{if(h.value&&(e=!e),A.value)return g.value&&Array.isArray(b.value)?e?void b.value.push(v.value):void(b.value=b.value.filter((e=>e!==v.value))):void(b.value=e?v.value:null);void 0!==b.value||"boolean"!=typeof e?b.value=e:V.value=e}}),G=function(o,n,r){return e.computed((()=>{const t={[o]:!0},u="string"==typeof(null==n?void 0:n.value)?n.value.split(" "):null==n?void 0:n.value;return u&&Array.isArray(u)&&u.forEach((e=>{e&&(t[`${o}--${e}`]=!0)})),r&&Object.keys(r.value).forEach((n=>{t[`${o}--${n}`]=e.unref(r.value[n])})),t}))}("vv-accordion",f,e.computed((()=>({disabled:y.value})))),$=n.useToggle(S);return(o,n)=>(e.openBlock(),e.createElementBlock("details",{id:e.unref(v),class:e.normalizeClass(e.unref(G)),open:e.unref(S)},[e.createElementVNode("summary",{"aria-controls":e.unref(v),"aria-expanded":e.unref(S),class:"vv-accordion__summary",onClick:n[0]||(n[0]=e.withModifiers((o=>e.unref($)()),["prevent"]))},[e.renderSlot(o.$slots,"summary",e.normalizeProps(e.guardReactiveProps({open:e.unref(S)})),(()=>[e.createTextVNode(e.toDisplayString(e.unref(p)),1)]))],8,l),e.createElementVNode("div",{"aria-hidden":!e.unref(S),class:"vv-accordion__content"},[e.renderSlot(o.$slots,"default",e.normalizeProps(e.guardReactiveProps({open:e.unref(S)})),(()=>[e.createTextVNode(e.toDisplayString(e.unref(m)),1)]))],8,i)],10,a))}})}));

package/dist/components/VvAccordion/VvAccordion.vue.d.ts

@@ -8,6 +8,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     modifiers: (StringConstructor | ArrayConstructor)[];
     disabled: BooleanConstructor;
+    not: BooleanConstructor;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     name: StringConstructor;
     title: StringConstructor;
@@ -18,16 +19,18 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     modifiers: (StringConstructor | ArrayConstructor)[];
     disabled: BooleanConstructor;
+    not: BooleanConstructor;
 }>> & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     modelValue: boolean;
     disabled: boolean;
+    not: boolean;
 }>, {
     summary: (_: {
         open: boolean;
     }) => any;
-    details: (_: {
+    default: (_: {
         open: boolean;
     }) => any;
 }>;

package/dist/components/VvAccordion/index.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPropTypes, Ref } from 'vue';
-import type { AccordionGroupState } from '@/types/group';
+import type { AccordionGroupState } from '../../types/group';
 export declare const VvAccordionProps: {
     /**
      * Accordion name
@@ -28,6 +28,10 @@ export declare const VvAccordionProps: {
      * If true, the accordion will be disabled
      */
     disabled: BooleanConstructor;
+    /**
+     * If true, the accordion will be opened by default
+     */
+    not: BooleanConstructor;
 };
 export declare const VvAccordionEvents: string[];
 export type VvAccordionPropsTypes = ExtractPropTypes<typeof VvAccordionProps>;
@@ -36,11 +40,12 @@ export type VvAccordionPropsTypes = ExtractPropTypes<typeof VvAccordionProps>;
  */
 export declare function useGroupProps(props: VvAccordionPropsTypes, emit: (event: string, value: unknown) => void): {
     modelValue: import("vue").WritableComputedRef<unknown>;
-    disabled: Ref<boolean>;
-    isInGroup: import("vue").ComputedRef<boolean>;
+    not: Ref<boolean>;
+    isInGroup: globalThis.ComputedRef<boolean>;
     group: Ref<AccordionGroupState> | undefined;
     collapse: Ref<boolean>;
     modifiers: Ref<string | string[]>;
+    disabled: globalThis.ComputedRef<boolean>;
     title: Ref<string | undefined> | undefined;
     content: Ref<string | undefined> | undefined;
 };