@volverjs/ui-vue 0.0.1-beta.6 → 0.0.1-beta.8

package/dist/components/VvRadioGroup/vv-radio-group.es.js

@@ -1,22 +1,22 @@
-import { isRef as x, provide as z, computed as f, toRefs as E, unref as C, inject as Z, toRef as T, watch as U, defineComponent as I, useAttrs as M, ref as W, openBlock as b, createElementBlock as R, mergeProps as B, createElementVNode as F, renderSlot as P, createTextVNode as J, toDisplayString as D, h as K, useSlots as Q, normalizeClass as X, createCommentVNode as Y, Fragment as L, renderList as ee, createBlock as te, createVNode as ne } from "vue";
-import { useFocus as re, useVModel as se } from "@vueuse/core";
-const G = {
+import { isRef as z, provide as Z, computed as f, toRefs as j, unref as O, inject as M, toRef as T, watch as U, defineComponent as F, useAttrs as W, ref as J, openBlock as V, createElementBlock as E, mergeProps as S, createElementVNode as P, renderSlot as D, createTextVNode as K, toDisplayString as G, h as Q, useSlots as X, normalizeClass as Y, createCommentVNode as L, Fragment as ee, renderList as te, createBlock as re, createVNode as ne } from "vue";
+import { useFocus as se, toReactive as oe, useVModel as ue } from "@vueuse/core";
+const $ = {
   valid: Boolean,
   validLabel: [String, Array]
-}, $ = {
+}, q = {
   error: Boolean,
   errorLabel: [String, Array]
-}, oe = {
+}, ae = {
   hintLabel: { type: String, default: "" }
-}, ue = {
+}, le = {
   options: { type: Array, default: () => [] },
   optionLabel: { type: [String, Function], default: () => "label" },
   optionValue: { type: [String, Function], default: () => "value" }
-}, le = ["update:modelValue"], ae = {
-  ...G,
+}, ie = ["update:modelValue"], ce = {
   ...$,
-  ...ue,
-  ...oe,
+  ...q,
+  ...le,
+  ...ae,
   modelValue: null,
   label: { type: String, default: "" },
   name: { type: String, default: "", required: !0 },
@@ -24,62 +24,62 @@ const G = {
   readonly: { type: Boolean, default: !1 },
   vertical: { type: Boolean, default: !1 }
 };
-function ie(e) {
+function fe(e) {
   if (Object.keys(e).some(
-    (t) => t !== "key" && !x(e[t])
+    (t) => t !== "key" && !z(e[t])
   ))
     throw Error("One or more groupState props aren't ref.");
-  console.log("PRovide - ", e), z(
+  console.log("PRovide - ", e), Z(
     e.key,
     f(() => e)
   );
 }
-function ce(e) {
-  const { options: t, optionLabel: n, optionValue: s } = E(e);
+function de(e) {
+  const { options: t, optionLabel: r, optionValue: s } = j(e);
   return {
     options: t,
-    getOptionLabel: (o) => typeof o != "object" && o !== null ? o : typeof n.value == "function" ? n.value(o) : o[n.value],
+    getOptionLabel: (o) => typeof o != "object" && o !== null ? o : typeof r.value == "function" ? r.value(o) : o[r.value],
     getOptionValue: (o) => typeof o != "object" && o !== null ? o : typeof s.value == "function" ? s.value(o) : o[s.value]
   };
 }
-const g = {
-  equals(e, t, n) {
-    return n ? this.resolveFieldData(e, n) === this.resolveFieldData(t, n) : this.deepEquals(e, t);
+const h = {
+  equals(e, t, r) {
+    return r ? this.resolveFieldData(e, r) === this.resolveFieldData(t, r) : this.deepEquals(e, t);
   },
   deepEquals(e, t) {
     if (e === t)
       return !0;
     if (e && t && typeof e == "object" && typeof t == "object") {
-      const n = Array.isArray(e), s = Array.isArray(t);
-      let r, l, o;
-      if (n && s) {
-        if (l = e.length, l != t.length)
+      const r = Array.isArray(e), s = Array.isArray(t);
+      let n, a, o;
+      if (r && s) {
+        if (a = e.length, a != t.length)
           return !1;
-        for (r = l; r-- !== 0; )
-          if (!this.deepEquals(e[r], t[r]))
+        for (n = a; n-- !== 0; )
+          if (!this.deepEquals(e[n], t[n]))
             return !1;
         return !0;
       }
-      if (n != s)
+      if (r != s)
         return !1;
-      const u = e instanceof Date, i = t instanceof Date;
-      if (u != i)
+      const l = e instanceof Date, u = t instanceof Date;
+      if (l != u)
         return !1;
-      if (u && i)
+      if (l && u)
         return e.getTime() == t.getTime();
-      const c = e instanceof RegExp, p = t instanceof RegExp;
-      if (c != p)
+      const p = e instanceof RegExp, y = t instanceof RegExp;
+      if (p != y)
         return !1;
-      if (c && p)
+      if (p && y)
         return e.toString() == t.toString();
-      const d = Object.keys(e);
-      if (l = d.length, l !== Object.keys(t).length)
+      const c = Object.keys(e);
+      if (a = c.length, a !== Object.keys(t).length)
         return !1;
-      for (r = l; r-- !== 0; )
-        if (!Object.prototype.hasOwnProperty.call(t, d[r]))
+      for (n = a; n-- !== 0; )
+        if (!Object.prototype.hasOwnProperty.call(t, c[n]))
           return !1;
-      for (r = l; r-- !== 0; )
-        if (o = d[r], !this.deepEquals(e[o], t[o]))
+      for (n = a; n-- !== 0; )
+        if (o = c[n], !this.deepEquals(e[o], t[o]))
           return !1;
       return !0;
     }
@@ -90,12 +90,12 @@ const g = {
       if (t.indexOf(".") === -1)
         return e[t];
       {
-        const n = t.split(".");
+        const r = t.split(".");
         let s = e;
-        for (let r = 0, l = n.length; r < l; ++r) {
+        for (let n = 0, a = r.length; n < a; ++n) {
           if (e == null)
             return null;
-          s = s[n[r]];
+          s = s[r[n]];
         }
         return s;
       }
@@ -106,20 +106,20 @@ const g = {
     return !!(e && e.constructor && e.call && e.apply);
   },
   findIndexInList(e, t) {
-    let n = -1;
+    let r = -1;
     if (t) {
       for (let s = 0; s < t.length; s++)
         if (this.equals(t[s], e)) {
-          n = s;
+          r = s;
           break;
         }
     }
-    return n;
+    return r;
   },
   contains(e, t) {
     if (e != null && t && t.length) {
-      for (const n of t)
-        if (this.equals(e, n))
+      for (const r of t)
+        if (this.equals(e, r))
           return !0;
     }
     return !1;
@@ -132,52 +132,52 @@ const g = {
   },
   pickBy(e, t) {
     return Object.fromEntries(
-      Object.entries(e).filter(([n]) => t(n))
+      Object.entries(e).filter(([r]) => t(r))
     );
   },
   removeFromList(e, t) {
-    const n = this.findIndexInList(e, t);
-    return n > -1 ? t.filter((s, r) => r !== n) : t;
+    const r = this.findIndexInList(e, t);
+    return r > -1 ? t.filter((s, n) => n !== r) : t;
   },
   isString(e) {
     return typeof e == "string" || e instanceof String;
   },
   propsToObject(e) {
-    return Object.keys(e).reduce((t, n) => {
-      var s, r, l, o, u;
-      return this.isFunction(e[n]) ? t[n] = e[n]() : Array.isArray(e[n]) ? t[n] = e[n][0]() : (s = e[n]) != null && s.type && (Array.isArray(e[n].type) ? t[n] = ((r = e[n]) == null ? void 0 : r.default) || ((l = e[n]) == null ? void 0 : l.type[0]()) : t[n] = ((o = e[n]) == null ? void 0 : o.default) || ((u = e[n]) == null ? void 0 : u.type())), t;
+    return Object.keys(e).reduce((t, r) => {
+      var s, n, a, o, l;
+      return this.isFunction(e[r]) ? t[r] = e[r]() : Array.isArray(e[r]) ? t[r] = e[r][0]() : (s = e[r]) != null && s.type && (Array.isArray(e[r].type) ? t[r] = ((n = e[r]) == null ? void 0 : n.default) || ((a = e[r]) == null ? void 0 : a.type[0]()) : t[r] = ((o = e[r]) == null ? void 0 : o.default) || ((l = e[r]) == null ? void 0 : l.type())), t;
     }, {});
   },
-  filterArray(e, t, n) {
-    return e.filter((s) => t.some((r) => typeof r == "string" ? s[n] == r : this.equals(
-      s[n],
-      r[n]
+  filterArray(e, t, r) {
+    return e.filter((s) => t.some((n) => typeof n == "string" ? s[r] == n : this.equals(
+      s[r],
+      n[r]
     )));
   },
   kebabCase(e) {
-    var t, n;
+    var t, r;
     if (e)
-      return (n = (t = e.match(
+      return (r = (t = e.match(
         /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
-      )) == null ? void 0 : t.join("-")) == null ? void 0 : n.toLowerCase();
+      )) == null ? void 0 : t.join("-")) == null ? void 0 : r.toLowerCase();
   }
 };
-function S(e, t) {
-  const n = { [`${e}`]: !0 };
+function I(e, t) {
+  const r = { [`${e}`]: !0 };
   return {
-    bemCssClasses: f(() => Object.keys(t).reduce((r, l) => {
-      const o = C(t[l]) || !1;
+    bemCssClasses: f(() => Object.keys(t).reduce((n, a) => {
+      const o = O(t[a]) || !1;
       if (!o)
-        return r;
-      if (l === "modifiers") {
-        const u = Array.isArray(o) ? o : [o];
+        return n;
+      if (a === "modifiers") {
+        const l = Array.isArray(o) ? o : [o];
         return {
-          ...r,
-          ...u.reduce(
-            (i, c) => ({
-              ...i,
-              [`${e}--${g.kebabCase(
-                c
+          ...n,
+          ...l.reduce(
+            (u, p) => ({
+              ...u,
+              [`${e}--${h.kebabCase(
+                p
               )}`]: !0
             }),
             {}
@@ -185,236 +185,254 @@ function S(e, t) {
         };
       } else
         return {
-          ...r,
-          [`${e}--${g.kebabCase(l)}`]: o
+          ...n,
+          [`${e}--${h.kebabCase(a)}`]: o
         };
-    }, n) || {})
+    }, r) || {})
   };
 }
-const q = Symbol("VV_RADIO_GROUP"), fe = {
-  ...G,
+const w = Symbol("VV_RADIO_GROUP"), pe = {
   ...$,
+  ...q,
   value: null,
   modelValue: { type: [Object, Number, Boolean, String] },
   label: { type: String, default: "" },
   disabled: Boolean,
   readonly: Boolean
-}, de = [
+}, ye = [
   "click",
   "update:modelValue",
   "change",
   "focus",
   "blur"
 ];
-function pe(e) {
-  const t = Z(e, void 0);
+function ve(e) {
+  const t = M(e, void 0);
   console.log("Inject - ", t);
-  const n = f(() => g.isNotEmpty(t));
-  function s(r, l, o) {
+  const r = f(() => h.isNotEmpty(t));
+  function s(n, a, o) {
     if (t != null && t.value) {
-      const u = C(t.value)[r];
+      const l = O(t.value)[n];
       return f({
         get() {
-          return u == null ? void 0 : u.value;
+          return l == null ? void 0 : l.value;
         },
-        set(i) {
-          u.value = i;
+        set(u) {
+          l.value = u;
         }
       });
     } else {
-      const u = T(l, r);
+      const l = T(a, n);
       return f({
         get() {
-          return u.value;
+          return l.value;
         },
-        set(i) {
-          o && o(`update:${r}`, i);
+        set(u) {
+          o && o(`update:${n}`, u);
         }
       });
     }
   }
   return {
     group: t,
-    isInGroup: n,
+    isInGroup: r,
     getGroupOrLocalRef: s
   };
 }
-function ye(e, t) {
-  const { group: n, isInGroup: s, getGroupOrLocalRef: r } = pe(q), { valid: l, error: o } = E(e), u = r("modelValue", e, t), i = r("readonly", e), c = r("disabled", e);
+function me(e, t) {
+  const { group: r, isInGroup: s, getGroupOrLocalRef: n } = ve(w), { valid: a, error: o } = j(e), l = n("modelValue", e, t), u = n("readonly", e), p = n("disabled", e);
   return {
-    group: n,
+    group: r,
     isInGroup: s,
-    valid: l,
+    valid: a,
     error: o,
-    modelValue: u,
-    readonly: i,
-    disabled: c
+    modelValue: l,
+    readonly: u,
+    disabled: p
   };
 }
-function ve(e, t) {
-  const { focused: n } = re(e);
-  return U(n, (s) => {
+function ge(e, t) {
+  const { focused: r } = se(e);
+  return U(r, (s) => {
     t(s ? "focus" : "blur", e.value);
   }), {
-    focused: n
+    focused: r
   };
 }
-const me = {
+const he = {
   inheritAttrs: !1
-}, ge = /* @__PURE__ */ I({
-  ...me,
+}, Ae = /* @__PURE__ */ F({
+  ...he,
   __name: "VvRadio",
-  props: fe,
-  emits: de,
+  props: pe,
+  emits: ye,
   setup(e, { emit: t }) {
-    const n = e, s = M(), { disabled: r, readonly: l, modelValue: o, valid: u, error: i } = ye(
-      n,
+    const r = e, s = W(), { disabled: n, readonly: a, modelValue: o, valid: l, error: u } = me(
+      r,
       t
-    ), c = W(), p = f(() => Array.isArray(o.value) ? g.contains(n.value, o.value) : g.equals(n.value, o.value)), { focused: d } = ve(c, t), { bemCssClasses: a } = S("vv-input-radio", {
-      valid: u,
-      invalid: i
-    }), { bemCssClasses: y } = S(
+    ), p = J(), y = f(() => Array.isArray(o.value) ? h.contains(r.value, o.value) : h.equals(r.value, o.value)), { focused: c } = ge(p, t), { bemCssClasses: A } = I("vv-input-radio", {
+      valid: l,
+      invalid: u
+    }), { bemCssClasses: i } = I(
       "vv-input-radio__input",
       {
-        checked: p,
-        disabled: r,
-        readonly: l
+        checked: y,
+        disabled: n,
+        readonly: a
       }
-    ), h = f(() => {
+    ), d = f(() => {
       const { class: m } = s;
       return {
         class: m,
-        ...a.value
+        ...A.value
       };
-    }), _ = f(() => ({
-      "focus-visible": d.value,
-      ...y.value
+    }), g = f(() => ({
+      "focus-visible": c.value,
+      ...i.value
     })), v = f(() => {
-      const { id: m, name: k, style: j } = s, N = g.pickBy(
+      const { id: m, name: k, style: B } = s, N = h.pickBy(
         s,
-        (w) => w.startsWith("data-")
+        (x) => x.startsWith("data-")
       );
       return {
         for: m || k,
-        style: j,
+        style: B,
         ...N
       };
-    }), O = f(() => {
+    }), b = f(() => {
       const { id: m = "", name: k = "" } = s;
       return {
         type: "radio",
         id: m || k,
         name: k,
-        value: n.value,
-        disabled: r.value,
-        readonly: l.value,
-        checked: p.value,
-        ...V.value
+        value: r.value,
+        disabled: n.value,
+        readonly: a.value,
+        checked: y.value,
+        ..._.value
       };
-    }), V = f(() => {
-      const { name: m } = s, k = g.pickBy(
+    }), _ = f(() => {
+      const { name: m } = s, k = h.pickBy(
         s,
-        (j) => j.startsWith("aria-")
+        (B) => B.startsWith("aria-")
       );
       return {
         "aria-label": m,
-        "aria-checked": p.value,
+        "aria-checked": y.value,
         ...k
       };
     });
-    function A() {
-      p.value || t("change", n.value), o.value = n.value;
+    function C() {
+      y.value || t("change", r.value), o.value = r.value;
     }
     function H(m) {
-      r.value || (t("click", m), d.value = !0);
+      n.value || (t("click", m), c.value = !0);
     }
-    return (m, k) => (b(), R("label", B({ class: C(h) }, C(v), { onClick: H }), [
-      F("input", B({
+    return (m, k) => (V(), E("label", S({ class: O(d) }, O(v), { onClick: H }), [
+      P("input", S({
         ref_key: "input",
-        ref: c,
-        class: C(_)
-      }, C(O), { onInput: A }), null, 16),
-      P(m.$slots, "default", { value: C(o) }, () => [
-        J(D(m.label), 1)
+        ref: p,
+        class: O(g)
+      }, O(b), { onInput: C }), null, 16),
+      D(m.$slots, "default", { value: O(o) }, () => [
+        K(G(m.label), 1)
       ])
     ], 16));
   }
 });
-function he(e) {
-  return Array.isArray(e) ? e.filter((t) => g.isString(t)).reduce((t, n) => t.length > 0 ? t + `
-` + n : n, "") : e;
+function R(e) {
+  return Array.isArray(e) ? e.filter((t) => h.isString(t)).reduce((t, r) => t.length > 0 ? t + `
+` + r : r, "") : e;
 }
-function Ae(e, t) {
+function Ce(e, t) {
   return {
     name: "HintSlot",
-    setup() {
-      const n = E(e), {
-        error: s,
-        valid: r,
-        hint: l,
-        loading: o
+    props: {
+      params: { type: Object, default: () => {
+      } }
+    },
+    setup(r) {
+      const s = j(e), {
+        error: n,
+        valid: a,
+        hint: o,
+        loading: l
       } = t, {
         hintLabel: u,
-        modelValue: i,
-        valid: c,
-        validLabel: p,
-        error: d,
-        errorLabel: a
-      } = n, y = g.resolveFieldData(n, "loading"), h = g.resolveFieldData(
-        n,
+        modelValue: p,
+        valid: y,
+        validLabel: c,
+        error: A,
+        errorLabel: i
+      } = s, d = h.resolveFieldData(s, "loading"), g = h.resolveFieldData(
+        s,
         "loadingLabel"
-      ), _ = f(() => d.value ? !!(d.value && s || (a == null ? void 0 : a.value) && Array.isArray(a.value) && a.value.length > 0 || (a == null ? void 0 : a.value) && g.isNotEmpty(a.value)) : !1), v = f(() => !!(u && u.value || l || r || p && p.value || _.value || (y == null ? void 0 : y.value) && o || (y == null ? void 0 : y.value) && (h == null ? void 0 : h.value))), O = f(() => Array.isArray(a == null ? void 0 : a.value) ? he((a == null ? void 0 : a.value) || "") : a == null ? void 0 : a.value), V = f(() => {
-        const A = { modelValue: i, error: d, valid: c };
-        return d != null && d.value ? (s == null ? void 0 : s(A)) || (O == null ? void 0 : O.value) || (u == null ? void 0 : u.value) : c != null && c.value ? (r == null ? void 0 : r(A)) || (p == null ? void 0 : p.value) || (u == null ? void 0 : u.value) : y != null && y.value ? (o == null ? void 0 : o(A)) || (h == null ? void 0 : h.value) || (u == null ? void 0 : u.value) : (l == null ? void 0 : l(A)) || (u == null ? void 0 : u.value) || (u == null ? void 0 : u.value);
+      ), v = f(() => A.value ? !!(A.value && n || (i == null ? void 0 : i.value) && Array.isArray(i.value) && i.value.length > 0 || (i == null ? void 0 : i.value) && h.isNotEmpty(i.value)) : !1), b = f(() => !!(u && u.value || o || a || c && c.value || v.value || (d == null ? void 0 : d.value) && l || (d == null ? void 0 : d.value) && (g == null ? void 0 : g.value))), _ = f(() => {
+        const C = oe({
+          hintLabel: u,
+          modelValue: p,
+          valid: y,
+          validLabel: c,
+          error: A,
+          errorLabel: i,
+          loading: d,
+          loadingLabel: g,
+          ...r.params
+        });
+        return A != null && A.value ? (n == null ? void 0 : n(C)) || R(i == null ? void 0 : i.value) || (u == null ? void 0 : u.value) : y != null && y.value ? (a == null ? void 0 : a(C)) || R(c == null ? void 0 : c.value) || (u == null ? void 0 : u.value) : d != null && d.value ? (l == null ? void 0 : l(C)) || R(g == null ? void 0 : g.value) || (u == null ? void 0 : u.value) : (o == null ? void 0 : o(C)) || R(u == null ? void 0 : u.value) || (u == null ? void 0 : u.value);
       });
       return {
-        hasHint: v,
-        hintContent: V
+        hasHint: b,
+        hintContent: _
       };
     },
     render() {
       if (this.hasHint)
-        return K("span", null, this.hintContent);
+        return Q(
+          "pre",
+          { style: { "white-space": "pre" } },
+          this.hintContent
+        );
     }
   };
 }
-const Ce = ["textContent"], Oe = { class: "vv-input-radio-group__wrapper" }, Ve = /* @__PURE__ */ I({
+const Oe = ["textContent"], ke = { class: "vv-input-radio-group__wrapper" }, Ve = /* @__PURE__ */ F({
   __name: "VvRadioGroup",
-  props: ae,
-  emits: le,
+  props: ce,
+  emits: ie,
   setup(e, { emit: t }) {
-    const n = e, s = Q(), r = se(n, "modelValue", t), { disabled: l, readonly: o, vertical: u, valid: i, error: c } = E(n);
-    ie({
-      key: q,
-      modelValue: r,
-      disabled: l,
+    const r = e, s = X(), n = ue(r, "modelValue", t), { disabled: a, readonly: o, vertical: l, valid: u, error: p } = j(r);
+    fe({
+      key: w,
+      modelValue: n,
+      disabled: a,
       readonly: o
     });
-    const { getOptionLabel: d, getOptionValue: a } = ce(n), { bemCssClasses: y } = S("vv-input-radio-group", {
-      horizontal: f(() => !u.value),
-      valid: i,
-      invalid: c
+    const { getOptionLabel: c, getOptionValue: A } = de(r), { bemCssClasses: i } = I("vv-input-radio-group", {
+      horizontal: f(() => !l.value),
+      valid: u,
+      invalid: p
     });
-    function h(v, O) {
+    function d(v, b) {
       return {
-        id: `${n.name}_opt${O}`,
-        name: n.name,
-        label: d(v),
-        value: a(v)
+        id: `${r.name}_opt${b}`,
+        name: r.name,
+        label: c(v),
+        value: A(v)
       };
     }
-    const _ = Ae(n, s);
-    return (v, O) => (b(), R("fieldset", {
-      class: X(C(y))
+    const g = Ce(r, s);
+    return (v, b) => (V(), E("fieldset", {
+      class: Y(O(i))
     }, [
-      v.label ? (b(), R("legend", {
+      v.label ? (V(), E("legend", {
         key: 0,
-        textContent: D(v.label)
-      }, null, 8, Ce)) : Y("", !0),
-      F("div", Oe, [
-        v.options.length > 0 ? (b(!0), R(L, { key: 0 }, ee(v.options, (V, A) => (b(), te(ge, B({ key: A }, h(V, A)), null, 16))), 128)) : P(v.$slots, "default", { key: 1 })
+        textContent: G(v.label)
+      }, null, 8, Oe)) : L("", !0),
+      P("div", ke, [
+        v.options.length > 0 ? (V(!0), E(ee, { key: 0 }, te(v.options, (_, C) => (V(), re(Ae, S({ key: C }, d(_, C)), null, 16))), 128)) : D(v.$slots, "default", { key: 1 })
       ]),
-      ne(C(_), { class: "vv-input-radio-group__hint" })
+      ne(O(g), { class: "vv-input-radio-group__hint" })
     ], 2));
   }
 });