@volverjs/ui-vue 0.0.3-beta.4 → 0.0.4

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

@@ -1,3 +1,4 @@
+import type { PropType } from 'vue';
 export declare const VvComboboxEvents: string[];
 export declare const VvComboboxProps: {
     /**
@@ -8,13 +9,44 @@ export declare const VvComboboxProps: {
         default: undefined;
     };
     /**
-     * Select input label
+     * Label for no search results
      */
-    label: StringConstructor;
+    noResultsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Label for no options	available
+     */
+    noOptionsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
-     * Label of "no results" options
+     * Label for selected option hint
      */
-    labelNoResults: {
+    selectedHintLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Label for deselect action button
+     */
+    deselectActionLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Label for select option hint
+     */
+    selectHintLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Label for deselected option hint
+     */
+    deselectHintLabel: {
         type: StringConstructor;
         default: string;
     };
@@ -29,7 +61,10 @@ export declare const VvComboboxProps: {
     /**
      * On searchable select is the input search placeholder
      */
-    searchPlaceholder: StringConstructor;
+    searchPlaceholder: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
      * The input search debounce time in ms
      */
@@ -56,6 +91,92 @@ export declare const VvComboboxProps: {
      * Show native select
      */
     native: BooleanConstructor;
+    /**
+     * Show badges
+     */
+    badges: BooleanConstructor;
+    /**
+     * Badge modifiers
+     */
+    badgeModifiers: {
+        type: PropType<string | string[]>;
+        default: string;
+    };
+    /**
+     * Set dropdown width to the same as the trigger
+     */
+    triggerWidth: {
+        default: boolean;
+        type: BooleanConstructor;
+    };
+    /**
+     * Dropdown modifiers
+     */
+    dropdownModifiers: {
+        type: PropType<string | string[]>;
+    };
+    /**
+     * Open dropdown on focus
+     */
+    autoOpen: BooleanConstructor;
+    /**
+     * Close dropdown on select (not multiple)
+     */
+    autoClose: BooleanConstructor;
+    label: (StringConstructor | NumberConstructor)[];
+    placement: {
+        type: PropType<import("../../constants").Side | import("../../constants").Placement>;
+        default: import("../../constants").Side;
+        validator: (value: never) => boolean;
+    };
+    transitionName: {
+        type: StringConstructor;
+    };
+    offset: {
+        type: PropType<string | import("@floating-ui/core").OffsetOptions | undefined>;
+        default: number;
+    };
+    shift: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").ShiftOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    flip: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").FlipOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    size: {
+        type: PropType<boolean | Partial<Omit<import("@floating-ui/core").SizeOptions, "apply"> & {
+            apply(args: Omit<import("@floating-ui/core").MiddlewareArguments, "elements"> & {
+                elements: import("@floating-ui/dom").Elements;
+            } & {
+                availableWidth: number;
+                availableHeight: number;
+            }): void | Promise<void>;
+        } & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: () => {
+            padding: number;
+        };
+    };
+    autoPlacement: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").AutoPlacementOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    arrow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autofocusFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     unselectable: {
         type: BooleanConstructor;
         default: boolean;
@@ -65,12 +186,12 @@ export declare const VvComboboxProps: {
         type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
-        type: import("vue").PropType<import("@/props").IconPosition>;
-        validation: (value: import("@/props").IconPosition) => boolean;
-        default: "right";
+        type: PropType<import("../../constants").Position>;
+        default: import("../../constants").Position;
+        validation: (value: import("../../constants").Position) => boolean;
     };
     options: {
-        type: import("vue").PropType<(string | import("../../types/generic").Option)[]>;
+        type: PropType<(string | import("../../types/generic").Option)[]>;
         default: () => never[];
     };
     labelKey: {
@@ -80,14 +201,19 @@ export declare const VvComboboxProps: {
     valueKey: {
         type: (StringConstructor | FunctionConstructor)[];
         default: string;
-    }; /**
-     * The input search debounce time in ms
-     */
-    modifiers: import("vue").PropType<string | string[]>;
+    };
+    disabledKey: {
+        type: (StringConstructor | FunctionConstructor)[];
+        default: string;
+    };
+    modifiers: PropType<string | string[]>;
     readonly: BooleanConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     hintLabel: {
         type: StringConstructor;
         default: string;
@@ -100,9 +226,9 @@ export declare const VvComboboxProps: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
     };
-    id: (StringConstructor | NumberConstructor)[];
     name: {
         type: StringConstructor;
         required: boolean;
     };
+    id: (StringConstructor | NumberConstructor)[];
 };

package/dist/components/VvDialog/VvDialog.es.js

@@ -1,158 +1,324 @@
-import { defineComponent as y, unref as i, openBlock as f, createBlock as V, mergeProps as w, createCommentVNode as _, Transition as b, toHandlers as D, withCtx as k, withDirectives as B, createElementVNode as u, createElementBlock as $, renderSlot as S, createTextVNode as F, toDisplayString as N, withModifiers as E, createVNode as I, vShow as P } from "vue";
-import { iconExists as p, Icon as M, addIcon as z } from "@iconify/vue";
-const O = "ds", L = {
+import { inject as D, computed as d, unref as i, defineComponent as E, ref as S, toRefs as F, openBlock as g, createBlock as C, mergeProps as _, createCommentVNode as $, Transition as I, toHandlers as P, withCtx as z, withDirectives as L, createElementVNode as f, createElementBlock as V, renderSlot as y, createTextVNode as M, toDisplayString as A, createVNode as q, vShow as H } from "vue";
+import { iconExists as v, Icon as R, addIcon as W } from "@iconify/vue";
+import { useVModel as J, onClickOutside as K, onKeyStroke as Y } from "@vueuse/core";
+const G = {
+  /**
+   * Color
+   */
   color: String,
+  /**
+   * Width
+   */
   width: {
     type: [String, Number]
   },
+  /**
+   * Height
+   */
   height: {
     type: [String, Number]
   },
+  /**
+   * Icon name
+   * Can be the full composition of iconify name "@{provider}:{prefix}:{name}" or "{prefix}:{name}" or "{name}"
+   * https://docs.iconify.design/api/providers.html#provider-in-icon-name
+   */
   name: {
     type: String,
     required: !0
   },
+  /**
+   * By default 'vv'
+   * If custom collection is not added with "addCollection" DS class method, this prop could not be used
+   * Icon provider: https://docs.iconify.design/api/providers.html#provider-in-icon-name
+   */
   provider: {
     type: String
   },
+  /**
+   * The name of icon set.
+   * Icon default options prefix: simple | normal | detailed
+   */
   prefix: {
     type: String,
     default: "normal"
   },
+  /**
+   * Url remote SVG icon
+   */
   src: String,
+  /**
+   * Horizontal flip
+   */
   horizontalFlip: Boolean,
+  /**
+   * Vertical flip
+   */
   verticalFlip: Boolean,
+  /**
+   * String alternative to "horizontalFlip" and "verticalFlip".
+   * Example: https://docs.iconify.design/icon-components/vue/transform.html
+   */
   flip: String,
+  /**
+   * Icon render mode
+   * 'style' = 'bg' or 'mask', depending on icon content
+   * 'bg' = span with style using `background`
+   * 'mask' = span with style using `mask`
+   * 'svg' = svg
+   * Iconify doc: https://docs.iconify.design/iconify-icon/modes.html
+   */
   mode: String,
+  /**
+   * Toggles inline or block mode
+   * Example https://docs.iconify.design/icon-components/vue/inline.html
+   */
   inline: Boolean,
+  /**
+   * rotates icon
+   * Example https://docs.iconify.design/icon-components/vue/transform.html
+   */
   rotate: [Number, String],
+  /**
+   * A callback that is called when icon data has been loaded
+   */
   onLoad: Function,
+  /**
+   * SVG icon string
+   */
   svg: String,
+  /**
+   * Icon modifiers: vv-icon css helper classes, value/s are concatened with prefix 'vv-icon--'
+   * @values string | Array<string>
+   */
   modifiers: {
     type: [String, Array]
   }
-}, q = {
+};
+var w = /* @__PURE__ */ ((e) => (e.left = "left", e.right = "right", e.top = "top", e.bottom = "bottom", e))(w || {}), N = /* @__PURE__ */ ((e) => (e.topStart = "top-start", e.topEnd = "top-end", e.bottomStart = "bottom-start", e.bottomEnd = "bottom-end", e.leftStart = "left-start", e.leftEnd = "left-end", e.rightStart = "right-start", e.rightEnd = "right-end", e))(N || {}), B = /* @__PURE__ */ ((e) => (e.before = "before", e.after = "after", e))(B || {}), O = /* @__PURE__ */ ((e) => (e.button = "button", e.submit = "submit", e.reset = "reset", e))(O || {}), j = /* @__PURE__ */ ((e) => (e._blank = "_blank", e._self = "_self", e._parent = "_parent", e._top = "_top", e))(j || {});
+const Q = Symbol.for("volver");
+function T() {
+  return D(Q);
+}
+function U(e, r, a) {
+  return d(() => {
+    const n = {
+      [e]: !0
+    }, l = typeof (r == null ? void 0 : r.value) == "string" ? r.value.split(" ") : r == null ? void 0 : r.value;
+    return l && Array.isArray(l) && l.forEach((s) => {
+      n[`${e}--${s}`] = !0;
+    }), a && Object.keys(a.value).forEach((s) => {
+      n[`${e}--${s}`] = i(a.value[s]);
+    }), n;
+  });
+}
+const X = {
   name: "VvIcon"
-}, T = /* @__PURE__ */ y({
-  ...q,
-  props: L,
-  setup(v) {
-    const t = v, r = ref(!0), { modifiers: a } = toRefs(t), n = inject(O), { bemCssClasses: c } = useBemModifiers("vv-icon", {
-      modifiers: a
-    }), s = computed(() => t.provider || (n == null ? void 0 : n.provider)), g = computed(() => {
-      const e = t.name ?? "", o = `@${s.value}:${t.prefix}:${t.name}`;
-      return p(e) ? e : p(o) ? o : (n == null ? void 0 : n.iconsCollections.find((l) => {
-        const h = `@${s.value}:${l.prefix}:${e}`;
-        if (p(h))
-          return h;
-      })) || e;
+}, Z = /* @__PURE__ */ E({
+  ...X,
+  props: G,
+  setup(e) {
+    const r = e, a = S(!0), n = T(), { modifiers: l } = F(r), s = U("vv-icon", l), u = d(() => r.provider || (n == null ? void 0 : n.provider)), m = d(() => {
+      const t = r.name ?? "", o = `@${u.value}:${r.prefix}:${r.name}`;
+      return v(t) ? t : v(o) ? o : (n == null ? void 0 : n.iconsCollections.find(
+        (c) => {
+          const h = `@${u.value}:${c.prefix}:${t}`;
+          if (v(h))
+            return h;
+        }
+      )) || t;
     });
-    function m(e) {
+    function b(t) {
       let o = null;
       if (typeof window > "u") {
-        const { JSDOM: C } = require("jsdom");
-        o = new C().window;
+        const { JSDOM: k } = require("jsdom");
+        o = new k().window;
       }
-      return (o ? new o.DOMParser() : new window.DOMParser()).parseFromString(e, "text/html").querySelector("svg");
+      return (o ? new o.DOMParser() : new window.DOMParser()).parseFromString(t, "text/html").querySelector("svg");
     }
-    function d(e) {
-      const o = m(e), l = (o == null ? void 0 : o.innerHTML.trim()) || "";
-      o && l && z(`@${s.value}:${t.prefix}:${t.name}`, {
-        body: l,
+    function p(t) {
+      const o = b(t), c = (o == null ? void 0 : o.innerHTML.trim()) || "";
+      o && c && W(`@${u.value}:${r.prefix}:${r.name}`, {
+        body: c,
+        // Set height and width from svg content
         height: o.viewBox.baseVal.height,
         width: o.viewBox.baseVal.width
       });
     }
-    return n && (t.src && !p(`@${s.value}:${t.prefix}:${t.name}`) ? (r.value = !1, n.fetchIcon(t.src).then((e) => {
-      e && (d(e), r.value = !0);
-    }).catch((e) => {
-      throw new Error(`During fetch icon: ${e == null ? void 0 : e.message}`);
-    })) : t.svg && d(t.svg)), (e, o) => i(r) ? (f(), V(i(M), w({
+    return n && (r.src && !v(`@${u.value}:${r.prefix}:${r.name}`) ? (a.value = !1, n.fetchIcon(r.src).then((t) => {
+      t && (p(t), a.value = !0);
+    }).catch((t) => {
+      throw new Error(`During fetch icon: ${t == null ? void 0 : t.message}`);
+    })) : r.svg && p(r.svg)), (t, o) => i(a) ? (g(), C(i(R), _({
       key: 0,
-      class: i(c)
+      class: i(s)
     }, {
-      inline: e.inline,
-      width: e.width,
-      height: e.height,
-      horizontalFlip: e.horizontalFlip,
-      verticalFlip: e.verticalFlip,
-      flip: e.flip,
-      rotate: e.rotate,
-      color: e.color,
-      onLoad: e.onLoad,
-      icon: i(g)
-    }), null, 16, ["class"])) : _("", !0);
+      inline: t.inline,
+      width: t.width,
+      height: t.height,
+      horizontalFlip: t.horizontalFlip,
+      verticalFlip: t.verticalFlip,
+      flip: t.flip,
+      rotate: t.rotate,
+      color: t.color,
+      onLoad: t.onLoad,
+      icon: i(m)
+    }), null, 16, ["class"])) : $("", !0);
   }
-}), A = ["open", "close", "update:modelValue"], H = {
-  id: { type: String, required: !0 },
+}), x = {
+  /**
+   * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
+   * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
+   */
+  to: {
+    type: [String, Object]
+  },
+  /**
+   * Anchor href
+   */
+  href: String,
+  /**
+   * Anchor target
+   */
+  target: {
+    type: String,
+    validator: (e) => Object.values(j).includes(e)
+  },
+  /**
+   * Anchor rel
+   */
+  rel: {
+    type: String,
+    default: "noopener noreferrer"
+  }
+}, ee = {
+  /**
+   * Whether the form control is disabled
+   */
+  disabled: Boolean
+}, te = {
+  /**
+   * Whether the item is active
+   */
+  active: Boolean
+}, oe = {
+  /**
+   * Whether the item is pressed
+   */
+  pressed: Boolean
+}, re = {
+  /**
+   * The item label
+   */
+  label: [String, Number]
+};
+B.before;
+const ne = {
+  /**
+   * Global attribute id
+   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
+   */
+  id: [String, Number]
+};
+w.bottom;
+({
+  ...ee,
+  ...re,
+  ...oe,
+  ...te,
+  ...x,
+  /**
+   * Button type
+   */
+  type: O.button
+});
+const ae = ["open", "close", "update:modelValue"], le = {
+  ...ne,
+  /**
+   * Dialog title
+   */
   title: String,
+  /**
+   * Show / hide dialog programmatically
+   */
   modelValue: Boolean,
+  /**
+   * Dialog transition
+   */
   transition: { type: String, default: "fade-block" },
+  /**
+   * Dialog size
+   */
   size: String,
+  /**
+   * Close dialog on click outside
+   */
   autoClose: { type: Boolean, default: !0 }
-}, R = {
+}, se = {
   key: 0,
   class: "vv-dialog__header"
-}, W = ["onClick"], j = { class: "vv-dialog__content" }, J = {
+}, ie = { class: "vv-dialog__content" }, ue = {
   key: 1,
   class: "vv-dialog__footer"
-}, X = {
+}, ce = {
   name: "VvDialog"
-}, U = /* @__PURE__ */ y({
-  ...X,
-  props: H,
-  emits: A,
-  setup(v, { emit: t }) {
-    const r = v, a = useVModel(r, "modelValue", t), n = ref(!0), c = ref(null), s = computed(() => {
-      const { id: o } = r;
+}, ge = /* @__PURE__ */ E({
+  ...ce,
+  props: le,
+  emits: ae,
+  setup(e, { emit: r }) {
+    const a = e, n = J(a, "modelValue", r), l = S(!0), s = S(null), u = d(() => {
+      const { id: o } = a;
       return {
         id: o,
-        open: n.value
+        open: l.value
       };
-    }), g = computed(() => r.size ? ["vv-dialog", `vv-dialog--${r.size}`] : "vv-dialog"), m = computed(() => `vv-dialog--${r.transition}`), d = {
+    }), m = d(() => a.size ? ["vv-dialog", `vv-dialog--${a.size}`] : "vv-dialog"), b = d(() => `vv-dialog--${a.transition}`), p = {
       "before-enter": () => {
-        n.value = !0, t("open");
+        l.value = !0, r("open");
       },
       "after-leave": () => {
-        n.value = !1, t("close");
+        l.value = !1, r("close");
       }
     };
-    onClickOutside(c, () => {
-      r.autoClose && (a.value = !1);
+    K(s, () => {
+      a.autoClose && (n.value = !1);
     });
-    function e() {
-      a.value = !1;
+    function t() {
+      n.value = !1;
     }
-    return (o, l) => (f(), V(b, w({ name: i(m) }, D(d)), {
-      default: k(() => [
-        B(u("dialog", w(i(s), { class: i(g) }), [
-          u("article", {
+    return Y("Escape", (o) => {
+      n.value && (o.preventDefault(), t());
+    }), (o, c) => (g(), C(I, _({ name: i(b) }, P(p)), {
+      default: z(() => [
+        L(f("dialog", _(i(u), { class: i(m) }), [
+          f("article", {
             ref_key: "modalWrapper",
-            ref: c,
+            ref: s,
             class: "vv-dialog__wrapper"
           }, [
-            o.$slots.header || o.title ? (f(), $("header", R, [
-              S(o.$slots, "header", {}, () => [
-                F(N(o.title) + " ", 1),
-                u("button", {
+            o.$slots.header || o.title ? (g(), V("header", se, [
+              y(o.$slots, "header", {}, () => [
+                M(A(o.title) + " ", 1),
+                f("button", {
                   type: "button",
                   "aria-label": "Close",
                   class: "vv-dialog__close",
-                  onClick: E(e, ["prevent"])
+                  onClickPassive: t
                 }, [
-                  I(T, { name: "close" })
-                ], 8, W)
+                  q(Z, { name: "close" })
+                ], 32)
               ])
-            ])) : _("", !0),
-            u("div", j, [
-              S(o.$slots, "default")
+            ])) : $("", !0),
+            f("div", ie, [
+              y(o.$slots, "default")
             ]),
-            o.$slots.footer ? (f(), $("footer", J, [
-              S(o.$slots, "footer")
-            ])) : _("", !0)
+            o.$slots.footer ? (g(), V("footer", ue, [
+              y(o.$slots, "footer")
+            ])) : $("", !0)
           ], 512)
         ], 16), [
-          [P, i(a)]
+          [H, i(n)]
         ])
       ]),
       _: 3
@@ -160,5 +326,5 @@ const O = "ds", L = {
   }
 });
 export {
-  U as default
+  ge as default
 };

package/dist/components/VvDialog/VvDialog.umd.js

@@ -1 +1 @@
-(function(e,i){typeof exports=="object"&&typeof module<"u"?module.exports=i(require("vue"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","@iconify/vue"],i):(e=typeof globalThis<"u"?globalThis:e||self,e.VvDialog=i(e.vue,e.vue$1))})(this,function(e,i){"use strict";const h="ds",S={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}},w={name:"VvIcon"},_=e.defineComponent({...w,props:S,setup(p){const n=p,s=ref(!0),{modifiers:c}=toRefs(n),r=inject(h),{bemCssClasses:d}=useBemModifiers("vv-icon",{modifiers:c}),l=computed(()=>n.provider||(r==null?void 0:r.provider)),m=computed(()=>{const o=n.name??"",t=`@${l.value}:${n.prefix}:${n.name}`;return i.iconExists(o)?o:i.iconExists(t)?t:(r==null?void 0:r.iconsCollections.find(a=>{const u=`@${l.value}:${a.prefix}:${o}`;if(i.iconExists(u))return u}))||o});function g(o){let t=null;if(typeof window>"u"){const{JSDOM:E}=require("jsdom");t=new E().window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(o,"text/html").querySelector("svg")}function f(o){const t=g(o),a=(t==null?void 0:t.innerHTML.trim())||"";t&&a&&i.addIcon(`@${l.value}:${n.prefix}:${n.name}`,{body:a,height:t.viewBox.baseVal.height,width:t.viewBox.baseVal.width})}return r&&(n.src&&!i.iconExists(`@${l.value}:${n.prefix}:${n.name}`)?(s.value=!1,r.fetchIcon(n.src).then(o=>{o&&(f(o),s.value=!0)}).catch(o=>{throw new Error(`During fetch icon: ${o==null?void 0:o.message}`)})):n.svg&&f(n.svg)),(o,t)=>e.unref(s)?(e.openBlock(),e.createBlock(e.unref(i.Icon),e.mergeProps({key:0,class:e.unref(d)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:o.rotate,color:o.color,onLoad:o.onLoad,icon:e.unref(m)}),null,16,["class"])):e.createCommentVNode("",!0)}}),v=["open","close","update:modelValue"],y={id:{type:String,required:!0},title:String,modelValue:Boolean,transition:{type:String,default:"fade-block"},size:String,autoClose:{type:Boolean,default:!0}},V={key:0,class:"vv-dialog__header"},$=["onClick"],C={class:"vv-dialog__content"},k={key:1,class:"vv-dialog__footer"},B={name:"VvDialog"};return e.defineComponent({...B,props:y,emits:v,setup(p,{emit:n}){const s=p,c=useVModel(s,"modelValue",n),r=ref(!0),d=ref(null),l=computed(()=>{const{id:t}=s;return{id:t,open:r.value}}),m=computed(()=>s.size?["vv-dialog",`vv-dialog--${s.size}`]:"vv-dialog"),g=computed(()=>`vv-dialog--${s.transition}`),f={"before-enter":()=>{r.value=!0,n("open")},"after-leave":()=>{r.value=!1,n("close")}};onClickOutside(d,()=>{s.autoClose&&(c.value=!1)});function o(){c.value=!1}return(t,a)=>(e.openBlock(),e.createBlock(e.Transition,e.mergeProps({name:e.unref(g)},e.toHandlers(f)),{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("dialog",e.mergeProps(e.unref(l),{class:e.unref(m)}),[e.createElementVNode("article",{ref_key:"modalWrapper",ref:d,class:"vv-dialog__wrapper"},[t.$slots.header||t.title?(e.openBlock(),e.createElementBlock("header",V,[e.renderSlot(t.$slots,"header",{},()=>[e.createTextVNode(e.toDisplayString(t.title)+" ",1),e.createElementVNode("button",{type:"button","aria-label":"Close",class:"vv-dialog__close",onClick:e.withModifiers(o,["prevent"])},[e.createVNode(_,{name:"close"})],8,$)])])):e.createCommentVNode("",!0),e.createElementVNode("div",C,[e.renderSlot(t.$slots,"default")]),t.$slots.footer?(e.openBlock(),e.createElementBlock("footer",k,[e.renderSlot(t.$slots,"footer")])):e.createCommentVNode("",!0)],512)],16),[[e.vShow,e.unref(c)]])]),_:3},16,["name"]))}})});
+(function(e,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("vue"),require("@iconify/vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["vue","@iconify/vue","@vueuse/core"],s):(e=typeof globalThis<"u"?globalThis:e||self,e.VvDialog=s(e.vue,e.vue$1,e.core))})(this,function(e,s,u){"use strict";const B={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}};var g=(t=>(t.left="left",t.right="right",t.top="top",t.bottom="bottom",t))(g||{}),v=(t=>(t.topStart="top-start",t.topEnd="top-end",t.bottomStart="bottom-start",t.bottomEnd="bottom-end",t.leftStart="left-start",t.leftEnd="left-end",t.rightStart="right-start",t.rightEnd="right-end",t))(v||{}),m=(t=>(t.before="before",t.after="after",t))(m||{}),b=(t=>(t.button="button",t.submit="submit",t.reset="reset",t))(b||{}),_=(t=>(t._blank="_blank",t._self="_self",t._parent="_parent",t._top="_top",t))(_||{});const V=Symbol.for("volver");function w(){return e.inject(V)}function E(t,r,a){return e.computed(()=>{const i={[t]:!0},l=typeof(r==null?void 0:r.value)=="string"?r.value.split(" "):r==null?void 0:r.value;return l&&Array.isArray(l)&&l.forEach(c=>{i[`${t}--${c}`]=!0}),a&&Object.keys(a.value).forEach(c=>{i[`${t}--${c}`]=e.unref(a.value[c])}),i})}const $={name:"VvIcon"},N=e.defineComponent({...$,props:B,setup(t){const r=t,a=e.ref(!0),i=w(),{modifiers:l}=e.toRefs(r),c=E("vv-icon",l),d=e.computed(()=>r.provider||(i==null?void 0:i.provider)),h=e.computed(()=>{const o=r.name??"",n=`@${d.value}:${r.prefix}:${r.name}`;return s.iconExists(o)?o:s.iconExists(n)?n:(i==null?void 0:i.iconsCollections.find(f=>{const S=`@${d.value}:${f.prefix}:${o}`;if(s.iconExists(S))return S}))||o});function y(o){let n=null;if(typeof window>"u"){const{JSDOM:A}=require("jsdom");n=new A().window}return(n?new n.DOMParser:new window.DOMParser).parseFromString(o,"text/html").querySelector("svg")}function p(o){const n=y(o),f=(n==null?void 0:n.innerHTML.trim())||"";n&&f&&s.addIcon(`@${d.value}:${r.prefix}:${r.name}`,{body:f,height:n.viewBox.baseVal.height,width:n.viewBox.baseVal.width})}return i&&(r.src&&!s.iconExists(`@${d.value}:${r.prefix}:${r.name}`)?(a.value=!1,i.fetchIcon(r.src).then(o=>{o&&(p(o),a.value=!0)}).catch(o=>{throw new Error(`During fetch icon: ${o==null?void 0:o.message}`)})):r.svg&&p(r.svg)),(o,n)=>e.unref(a)?(e.openBlock(),e.createBlock(e.unref(s.Icon),e.mergeProps({key:0,class:e.unref(c)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:o.rotate,color:o.color,onLoad:o.onLoad,icon:e.unref(h)}),null,16,["class"])):e.createCommentVNode("",!0)}}),O={to:{type:[String,Object]},href:String,target:{type:String,validator:t=>Object.values(_).includes(t)},rel:{type:String,default:"noopener noreferrer"}},k={disabled:Boolean},C={active:Boolean},j={pressed:Boolean},D={label:[String,Number]};m.before;const P={id:[String,Number]};g.bottom,{...k,...D,...j,...C,...O,type:b.button};const F=["open","close","update:modelValue"],I={...P,title:String,modelValue:Boolean,transition:{type:String,default:"fade-block"},size:String,autoClose:{type:Boolean,default:!0}},z={key:0,class:"vv-dialog__header"},L={class:"vv-dialog__content"},q={key:1,class:"vv-dialog__footer"},M={name:"VvDialog"};return e.defineComponent({...M,props:I,emits:F,setup(t,{emit:r}){const a=t,i=u.useVModel(a,"modelValue",r),l=e.ref(!0),c=e.ref(null),d=e.computed(()=>{const{id:n}=a;return{id:n,open:l.value}}),h=e.computed(()=>a.size?["vv-dialog",`vv-dialog--${a.size}`]:"vv-dialog"),y=e.computed(()=>`vv-dialog--${a.transition}`),p={"before-enter":()=>{l.value=!0,r("open")},"after-leave":()=>{l.value=!1,r("close")}};u.onClickOutside(c,()=>{a.autoClose&&(i.value=!1)});function o(){i.value=!1}return u.onKeyStroke("Escape",n=>{i.value&&(n.preventDefault(),o())}),(n,f)=>(e.openBlock(),e.createBlock(e.Transition,e.mergeProps({name:e.unref(y)},e.toHandlers(p)),{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("dialog",e.mergeProps(e.unref(d),{class:e.unref(h)}),[e.createElementVNode("article",{ref_key:"modalWrapper",ref:c,class:"vv-dialog__wrapper"},[n.$slots.header||n.title?(e.openBlock(),e.createElementBlock("header",z,[e.renderSlot(n.$slots,"header",{},()=>[e.createTextVNode(e.toDisplayString(n.title)+" ",1),e.createElementVNode("button",{type:"button","aria-label":"Close",class:"vv-dialog__close",onClickPassive:o},[e.createVNode(N,{name:"close"})],32)])])):e.createCommentVNode("",!0),e.createElementVNode("div",L,[e.renderSlot(n.$slots,"default")]),n.$slots.footer?(e.openBlock(),e.createElementBlock("footer",q,[e.renderSlot(n.$slots,"footer")])):e.createCommentVNode("",!0)],512)],16),[[e.vShow,e.unref(i)]])]),_:3},16,["name"]))}})});