@volverjs/ui-vue 0.0.13-beta.9 → 0.0.14

package/dist/stories/AccordionGroup/AccordionGroupSlots.stories.d.ts

@@ -31,7 +31,7 @@ declare const _default: {
         }) => any) | import("vue").VNodeChild;
     }>, "props"> | undefined;
     subcomponents?: Record<string, Omit<import("vue").ConcreteComponent<any>, "props">> | undefined;
-    play?: import("storybook/internal/csf").PlayFunction<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    play?: import("storybook/internal/csf").PlayFunction<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -186,7 +186,7 @@ declare const _default: {
         };
     })>> | undefined;
     globals?: import("storybook/internal/csf").Globals | undefined;
-    decorators?: import("storybook/internal/csf").DecoratorFunction<import("@storybook/vue3").VueRenderer, {
+    decorators?: import("storybook/internal/csf").DecoratorFunction<import("@storybook/vue3-vite").VueRenderer, {
         modelValue?: string | string[] | undefined;
         collapse?: boolean | undefined;
         modifiers?: string | string[] | undefined;
@@ -213,7 +213,7 @@ declare const _default: {
             expand: (name?: string | string[]) => void;
             collapse: (name?: string | string[]) => void;
         }) => any) | import("vue").VNodeChild;
-    }> | import("storybook/internal/csf").DecoratorFunction<import("@storybook/vue3").VueRenderer, {
+    }> | import("storybook/internal/csf").DecoratorFunction<import("@storybook/vue3-vite").VueRenderer, {
         modelValue?: string | string[] | undefined;
         collapse?: boolean | undefined;
         modifiers?: string | string[] | undefined;
@@ -241,8 +241,8 @@ declare const _default: {
             collapse: (name?: string | string[]) => void;
         }) => any) | import("vue").VNodeChild;
     }>[] | undefined;
-    parameters?: import("@storybook/vue3").Parameters | undefined;
-    args?: Partial<import("@storybook/vue3").ComponentPropsAndSlots<{
+    parameters?: import("@storybook/vue3-vite").Parameters | undefined;
+    args?: Partial<import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -396,7 +396,7 @@ declare const _default: {
             }) => any;
         };
     })>> | undefined;
-    argTypes?: Partial<import("@storybook/vue3").ArgTypes<import("@storybook/vue3").ComponentPropsAndSlots<{
+    argTypes?: Partial<import("@storybook/vue3-vite").ArgTypes<import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -550,7 +550,7 @@ declare const _default: {
             }) => any;
         };
     })>>> | undefined;
-    loaders?: import("storybook/internal/csf").LoaderFunction<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    loaders?: import("storybook/internal/csf").LoaderFunction<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -703,7 +703,7 @@ declare const _default: {
                 collapse: (name?: string | string[]) => void;
             }) => any;
         };
-    })>> | import("storybook/internal/csf").LoaderFunction<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    })>> | import("storybook/internal/csf").LoaderFunction<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -857,7 +857,7 @@ declare const _default: {
             }) => any;
         };
     })>>[] | undefined;
-    beforeEach?: import("storybook/internal/csf").BeforeEach<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    beforeEach?: import("storybook/internal/csf").BeforeEach<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -1010,7 +1010,7 @@ declare const _default: {
                 collapse: (name?: string | string[]) => void;
             }) => any;
         };
-    })>> | import("storybook/internal/csf").BeforeEach<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    })>> | import("storybook/internal/csf").BeforeEach<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -1164,7 +1164,7 @@ declare const _default: {
             }) => any;
         };
     })>>[] | undefined;
-    afterEach?: import("storybook/internal/csf").AfterEach<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    afterEach?: import("storybook/internal/csf").AfterEach<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -1317,7 +1317,7 @@ declare const _default: {
                 collapse: (name?: string | string[]) => void;
             }) => any;
         };
-    })>> | import("storybook/internal/csf").AfterEach<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    })>> | import("storybook/internal/csf").AfterEach<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -1471,7 +1471,7 @@ declare const _default: {
             }) => any;
         };
     })>>[] | undefined;
-    render?: import("storybook/internal/csf").ArgsStoryFn<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    render?: import("storybook/internal/csf").ArgsStoryFn<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;
@@ -1626,7 +1626,7 @@ declare const _default: {
         };
     })>> | undefined;
     tags?: import("storybook/internal/csf").Tag[];
-    mount?: ((context: import("storybook/internal/csf").StoryContext<import("@storybook/vue3").VueRenderer, import("@storybook/vue3").ComponentPropsAndSlots<{
+    mount?: ((context: import("storybook/internal/csf").StoryContext<import("@storybook/vue3-vite").VueRenderer, import("@storybook/vue3-vite").ComponentPropsAndSlots<{
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
             modelValue: {
                 type: PropType<string | string[] | undefined>;

package/dist/stories/CheckboxGroup/CheckboxGroup.settings.d.ts

@@ -9,4 +9,4 @@ export declare const defaultArgs: {
     valid: boolean;
     tabindex: number;
 };
-export declare const argTypes: import("@storybook/vue3").ArgTypes<import("@storybook/vue3").Args>;
+export declare const argTypes: import("@storybook/vue3-vite").ArgTypes<import("@storybook/vue3-vite").Args>;

package/dist/stories/Radio/Radio.settings.d.ts

@@ -9,4 +9,4 @@ export declare const defaultArgs: {
     valid: boolean;
     indeterminate: boolean;
 };
-export declare const argTypes: import("@storybook/vue3").ArgTypes<import("@storybook/vue3").Args>;
+export declare const argTypes: import("@storybook/vue3-vite").ArgTypes<import("@storybook/vue3-vite").Args>;

package/dist/stories/RadioGroup/RadioGroup.settings.d.ts

@@ -9,4 +9,4 @@ export declare const defaultArgs: {
     valid: boolean;
     tabindex: number;
 };
-export declare const argTypes: import("@storybook/vue3").ArgTypes<import("@storybook/vue3").Args>;
+export declare const argTypes: import("@storybook/vue3-vite").ArgTypes<import("@storybook/vue3-vite").Args>;

package/dist/types/floating-ui.d.ts

@@ -1,6 +1,15 @@
 import type { autoPlacement, flip, offset, shift, size } from '@floating-ui/vue';
-export type AutoPlacementOptions = Parameters<typeof autoPlacement>[0];
-export type FlipOptions = Parameters<typeof flip>[0];
-export type ShiftOptions = Parameters<typeof shift>[0];
-export type OffsetOptions = Parameters<typeof offset>[0];
-export type SizeOptions = Parameters<typeof size>[0];
+export type { MiddlewareState } from '@floating-ui/core';
+export type { Middleware } from '@floating-ui/vue';
+/**
+ * Drop the `Derivable` (callback) variant from a floating-ui option type.
+ * The components only ever pass plain option objects, and keeping the
+ * callback variant leaks non-portable floating-ui internals
+ * (`Derivable`, `MiddlewareState`) into the emitted declaration files.
+ */
+type NonDerivable<T> = Exclude<T, (...args: never[]) => unknown>;
+export type AutoPlacementOptions = NonDerivable<Parameters<typeof autoPlacement>[0]>;
+export type FlipOptions = NonDerivable<Parameters<typeof flip>[0]>;
+export type ShiftOptions = NonDerivable<Parameters<typeof shift>[0]>;
+export type OffsetOptions = NonDerivable<Parameters<typeof offset>[0]>;
+export type SizeOptions = NonDerivable<Parameters<typeof size>[0]>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@volverjs/ui-vue",
   "type": "module",
-  "version": "0.0.13-beta.9",
+  "version": "0.0.14",
   "description": "@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.",
   "author": "8 wave S.r.l.",
   "license": "MIT",
@@ -248,9 +248,10 @@
       "default": "./dist/components/VvAccordion/VvAccordion.umd.js"
     }
   },
-  "main": "./dist/Volver.umd.js",
-  "module": "./dist/Volver.es.js",
+  "main": "./dist/index.umd.js",
+  "module": "./dist/index.es.js",
   "types": "./dist/index.d.ts",
+  "sideEffects": false,
   "typesVersions": {
     "*": {
       "*": [
@@ -392,11 +393,12 @@
   },
   "files": [
     "bin",
-    "dist"
+    "dist",
+    "src"
   ],
   "peerDependencies": {
-    "@json-render/core": ">=0.16.0",
-    "@json-render/vue": ">=0.16.0",
+    "@json-render/core": ">=0.19.0",
+    "@json-render/vue": ">=0.19.0",
     "@volverjs/style": ">=0",
     "@vueuse/core": ">=14",
     "vue": ">=3",
@@ -414,84 +416,88 @@
     }
   },
   "dependencies": {
-    "@floating-ui/vue": "^1.1.11",
-    "@iconify/vue": "^5.0.0",
-    "@tanstack/vue-virtual": "^3.13.23",
+    "@floating-ui/core": "^1.7.5",
+    "@floating-ui/dom": "^1.7.6",
+    "@floating-ui/vue": "^2.0.0",
+    "@iconify/vue": "^5.0.1",
+    "@tanstack/vue-virtual": "^3.13.28",
     "blurhash": "^2.0.5",
     "comlink": "^4.4.2",
     "dot-prop": "^10.1.0",
+    "imask": "^7.6.1",
     "mitt": "^3.0.1",
-    "pica": "^9.0.1",
+    "pica": "^10.0.1",
     "vue-imask": "^7.6.1",
     "vuedraggable": "^4.1.0"
   },
   "optionalDependencies": {
-    "@iconify/tools": "^5.0.11",
-    "@iconify/utils": "^3.1.0",
+    "@iconify/tools": "^5.0.12",
+    "@iconify/utils": "^3.1.3",
     "chokidar": "^5.0.0",
     "yargs": "^18.0.0"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "8.1.0",
-    "@babel/core": "^7.29.0",
-    "@babel/preset-env": "^7.29.2",
-    "@babel/preset-typescript": "^7.28.5",
+    "@antfu/eslint-config": "9.0.0",
+    "@babel/core": "^7.29.7",
+    "@babel/preset-env": "^7.29.7",
+    "@babel/preset-typescript": "^7.29.7",
     "@iconify/types": "^2.0.0",
-    "@json-render/core": "^0.16.0",
-    "@json-render/vue": "^0.16.0",
+    "@json-render/core": "^0.19.0",
+    "@json-render/vue": "^0.19.0",
     "@nabla/vite-plugin-eslint": "^3.0.1",
-    "@storybook/addon-a11y": "^10.3.5",
-    "@storybook/addon-docs": "^10.3.5",
-    "@storybook/addon-links": "^10.3.5",
-    "@storybook/addon-themes": "^10.3.5",
-    "@storybook/addon-vitest": "^10.3.5",
-    "@storybook/cli": "^10.3.5",
-    "@storybook/vue3-vite": "^10.3.5",
+    "@storybook/addon-a11y": "^10.4.5",
+    "@storybook/addon-docs": "^10.4.5",
+    "@storybook/addon-links": "^10.4.5",
+    "@storybook/addon-themes": "^10.4.5",
+    "@storybook/addon-vitest": "^10.4.5",
+    "@storybook/cli": "^10.4.5",
+    "@storybook/vue3-vite": "^10.4.5",
     "@tsconfig/node18": "^18.2.6",
     "@types/jest-axe": "^3.5.9",
-    "@types/node": "^25.5.2",
+    "@types/node": "^25.9.3",
     "@types/pica": "^9.0.5",
     "@types/yargs": "^17.0.35",
-    "@vitejs/plugin-vue": "^6.0.5",
-    "@vitest/browser": "^4.1.3",
-    "@vitest/browser-playwright": "^4.1.3",
-    "@volverjs/style": "0.1.24-beta.3",
-    "@vue/compiler-sfc": "^3.5.32",
-    "@vue/eslint-config-typescript": "^14.7.0",
-    "@vue/test-utils": "^2.4.6",
+    "@vitejs/plugin-vue": "^6.0.7",
+    "@vitest/browser": "^4.1.9",
+    "@vitest/browser-playwright": "^4.1.9",
+    "@volverjs/style": "0.1.24",
+    "@vue/compiler-sfc": "^3.5.38",
+    "@vue/eslint-config-typescript": "^14.8.0",
+    "@vue/test-utils": "^2.4.11",
     "@vue/tsconfig": "^0.9.1",
-    "@vueless/storybook-dark-mode": "^10.0.7",
-    "@vueuse/core": "^14.2.1",
-    "baseline-browser-mapping": "^2.10.16",
+    "@vueless/storybook-dark-mode": "^10.0.8",
+    "@vueuse/core": "^14.3.0",
+    "baseline-browser-mapping": "^2.10.37",
     "change-case": "^5.4.4",
-    "eslint": "^10.2.0",
+    "eslint": "^10.5.0",
     "glob": "^13.0.6",
     "jest-axe": "^10.0.0",
     "npm-run-all": "^4.1.5",
-    "playwright": "^1.59.1",
-    "prettier": "^3.8.1",
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4",
+    "playwright": "^1.61.0",
+    "prettier": "^3.8.4",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
     "remark": "^15.0.1",
-    "sass-embedded": "1.99.0",
-    "storybook": "^10.3.5",
+    "sass-embedded": "1.100.0",
+    "storybook": "^10.4.5",
     "storybook-addon-markdown-docs": "^2.0.0",
-    "terser": "^5.46.1",
+    "terser": "^5.48.0",
     "ts-node": "^10.9.2",
-    "typescript": "~6.0.2",
+    "typescript": "~6.0.3",
     "unplugin-auto-import": "^21.0.0",
-    "unplugin-vue-components": "^32.0.0",
-    "vite": "^8.0.7",
+    "unplugin-vue-components": "^32.1.0",
+    "vite": "^8.0.16",
     "vite-plugin-externalize-deps": "^0.10.0",
-    "vitest": "^4.1.3",
-    "vue": "^3.5.32",
-    "vue-tsc": "^3.2.6",
-    "zod": "^4.3.6"
+    "vitest": "^4.1.9",
+    "vue": "^3.5.38",
+    "vue-tsc": "^3.3.5",
+    "zod": "^4.4.3"
   },
   "scripts": {
     "dev": "storybook dev -p 6006",
     "styleguide": "storybook build",
-    "build": "npm run generate-icons && npm run generate-tsd && node ./scripts/build.js",
+    "build": "npm run clean && npm run generate-icons && npm run generate-tsd && node ./scripts/build.js",
+    "clean": "node ./scripts/clean.js",
     "hot": "node ./scripts/build.js --hot",
     "type-check": "vue-tsc --noEmit",
     "lint": "eslint .",

package/src/Volver.ts

@@ -0,0 +1,326 @@
+import type { IconifyIcon, IconifyJSON, PartialIconifyAPIConfig } from '@iconify/vue'
+import type { App, Component, Directive, Plugin, Ref } from 'vue'
+import {
+    addAPIProvider,
+    addCollection,
+    addIcon,
+
+} from '@iconify/vue'
+import { kebabCase } from 'change-case'
+import { DEFAULT_ICONIFY_PROVIDER, INJECTION_KEY_VOLVER } from './constants'
+
+export function useDefaultProps(
+    component: Component,
+    defaults?: Record<string, unknown>,
+    name?: string,
+) {
+    const componentName = name || component.name
+
+    if (!componentName) {
+        return component
+    }
+
+    const componentDefaults = defaults?.[componentName] as Record<
+        string,
+        unknown
+    >
+    const props = (component as Record<string, unknown>).props as Record<
+        string,
+        unknown
+    >
+
+    if (!componentDefaults || !props) {
+        return { ...component, name: componentName }
+    }
+
+    return {
+        ...component,
+        name: componentName,
+        props: Object.keys(props).reduce(
+            (acc, key) => {
+                if (!(key in componentDefaults)) {
+                    acc[key] = props[key]
+                    return acc
+                }
+                const customDefault = componentDefaults[key]
+                if (
+                    typeof props[key] === 'function'
+                    || Array.isArray(props[key])
+                ) {
+                    acc[key] = {
+                        type: props[key],
+                        default: customDefault,
+                    }
+                    return acc
+                }
+                acc[key] = {
+                    ...(props[key] as Record<string, unknown>),
+                    default: customDefault,
+                }
+                return acc
+            },
+            {} as Record<string, unknown>,
+        ),
+    }
+}
+
+export type DefaultOptions = Record<string, Record<string, unknown>>
+
+export type VolverExperimentalFeatures = {
+    /**
+     * Force suggestions in `VvInputText` and `VvTextarea` component
+     */
+    forceInputSuggestions?: boolean
+}
+
+export type VolverOptions = {
+    /**
+     * If true set "fetchOptions" with credentials: 'include'
+     */
+    fetchWithCredentials?: boolean
+    /**
+     * Optional fetch params
+     */
+    fetchOptions?: RequestInit
+    /**
+     * Array of iconify collections that will be added during plugin install
+     * @see https://docs.iconify.design/types/iconify-json.html
+     */
+    iconsCollections?: IconifyJSON[]
+    /**
+     * Set true inside nuxt
+     */
+    nuxt?: boolean
+    /**
+     * Default iconify provider
+     * @see https://docs.iconify.design/icon-components/vue/add-collection.html
+     * @default 'vv'
+     */
+    iconsProvider?: string
+    /**
+     * Components to install
+     */
+    components?: Record<string, Component>
+    /**
+     * Alias to install
+     */
+    aliases?: Record<string, Component>
+    /**
+     * Directives to install
+     */
+    directives?: Record<string, Directive>
+    /**
+     * Default props for components
+     */
+    defaults?: DefaultOptions
+    /**
+     * Experimental features
+     */
+    experimentalFeatures?: VolverExperimentalFeatures
+}
+
+export interface VolverInterface {
+    /**
+     * @param {string} src Icon source path (url)
+     * @param {RequestInit} options
+     * @returns {Promise<string | undefined>} String SVG if exist
+     */
+    fetchIcon: (src: string, options?: RequestInit) => Promise<string | undefined>
+    /**
+     * Add iconify collection to library
+     * @see https://docs.iconify.design/icon-components/vue/add-collection.html
+     * @param {IconifyJSON} collection
+     * @param {string} providerName Optional provider name
+     */
+    addCollection: (collection: IconifyJSON, providerName?: string) => boolean
+    /**
+     * Add icon to collection
+     * @see https://docs.iconify.design/icon-components/vue/add-icon.html
+     * @param {string} name
+     * @param {IconifyIcon} data
+     * @returns {boolean} true on success, false if something is wrong with data
+     */
+    addIcon: (name: string, data: IconifyIcon) => boolean
+    /**
+     * Add custom config for icons provider
+     * @param {string} provider
+     * @param {PartialIconifyAPIConfig} customConfig
+     * @returns {boolean} true on success, false if something is wrong with data
+     */
+    addIconsAPIProvider: (
+        provider: string,
+        customConfig: PartialIconifyAPIConfig,
+    ) => boolean
+    /**
+     * Current provider
+     */
+    iconsProvider: string
+    /**
+     * Array of installed iconify collections
+     * @see https://docs.iconify.design/types/iconify-json.html
+     */
+    iconsCollections: IconifyJSON[]
+    /**
+     * Set true inside nuxt
+     */
+    nuxt: boolean
+    /**
+     * Components defaults options
+     */
+    defaults: Ref<DefaultOptions>
+}
+
+export class Volver implements VolverInterface {
+    private _fetchOptions: RequestInit = {}
+    private _iconsCollections: IconifyJSON[] = []
+    private _iconsProvider = DEFAULT_ICONIFY_PROVIDER
+    private _nuxt = false
+    private _experimentalFeatures: VolverExperimentalFeatures = {}
+
+    defaults: Ref<DefaultOptions> = ref({})
+
+    constructor({
+        fetchWithCredentials,
+        fetchOptions,
+        iconsProvider,
+        nuxt,
+        iconsCollections,
+        defaults,
+        experimentalFeatures,
+    }: VolverOptions = {}) {
+        // fetch options
+        if (fetchOptions) {
+            this._fetchOptions = fetchOptions
+        }
+        // fetch with credentials sugar syntax
+        if (fetchWithCredentials) {
+            this._fetchOptions = {
+                ...this._fetchOptions,
+                credentials: 'include',
+            }
+        }
+        // default iconify provider
+        if (iconsProvider) {
+            this._iconsProvider = iconsProvider
+        }
+        // enable nuxt mode
+        if (nuxt) {
+            this._nuxt = nuxt
+        }
+        // add iconify collections
+        if (iconsCollections && Array.isArray(iconsCollections)) {
+            iconsCollections.forEach((iconsCollection) => {
+                this.addCollection(iconsCollection, this._iconsProvider)
+            })
+        }
+        // set defaults
+        if (defaults) {
+            this.defaults.value = defaults
+        }
+        // experimental features
+        if (experimentalFeatures) {
+            this._experimentalFeatures = experimentalFeatures
+        }
+    }
+
+    get nuxt() {
+        return this._nuxt
+    }
+
+    get iconsProvider() {
+        return this._iconsProvider
+    }
+
+    get iconsCollections() {
+        return this._iconsCollections
+    }
+
+    get experimentalFeatures() {
+        return this._experimentalFeatures
+    }
+
+    addCollection(
+        collection: IconifyJSON,
+        providerName: string = this._iconsProvider,
+    ): boolean {
+        this._iconsCollections.push(collection)
+        return addCollection(collection, providerName)
+    }
+
+    addIcon(name: string, data: IconifyIcon): boolean {
+        return addIcon(name, data)
+    }
+
+    addIconsAPIProvider(
+        provider: string,
+        customConfig: PartialIconifyAPIConfig,
+    ): boolean {
+        return addAPIProvider(provider, customConfig)
+    }
+
+    async fetchIcon(
+        src: string,
+        options: RequestInit = { cache: 'force-cache' },
+    ): Promise<string | undefined> {
+        const response = await fetch(src, {
+            ...this._fetchOptions,
+            ...options,
+        })
+        if (!response.ok) {
+            throw new Error(
+                `Cannot fetch icon "${src}": ${response.status} ${response.statusText}`,
+            )
+        }
+        return response.text()
+    }
+}
+
+const VolverPlugin: Plugin = {
+    /**
+     * Vue.use() hook
+     * @param {App} app
+     * @param {object} options
+     */
+    install(app: App, options: VolverOptions = {}) {
+        const volver = new Volver(options)
+
+        // register global methods
+        app.config.globalProperties.$vv = volver
+
+        // register components
+        if (options.components) {
+            Object.entries(options.components).forEach(([name, component]) => {
+                app.component(
+                    name,
+                    useDefaultProps(component, options.defaults),
+                )
+            })
+        }
+
+        // register aliases
+        if (options.aliases) {
+            Object.entries(options.aliases).forEach(([name, component]) => {
+                app.component(
+                    name,
+                    useDefaultProps(component, options.defaults, name),
+                )
+            })
+        }
+
+        // register directives
+        if (options.directives) {
+            Object.entries(options.directives).forEach(([name, directive]) => {
+                const kebabName = kebabCase(name)
+                if (kebabName.startsWith('v-')) {
+                    name = kebabName.substring(2).toLocaleLowerCase()
+                }
+                app.directive(name, directive)
+            })
+        }
+
+        // provide volver to components
+        app.provide(INJECTION_KEY_VOLVER, volver)
+    },
+}
+
+export default VolverPlugin