@wikicasa-dev/components 1.7.55 → 1.8.0

package/dist/BaseInput.js

@@ -1,4 +1,4 @@
-import { defineComponent as N, mergeModels as M, useModel as O, ref as p, watch as $, useAttrs as j, openBlock as s, createElementBlock as d, normalizeClass as m, unref as o, renderSlot as v, createElementVNode as c, withModifiers as g, withKeys as D, createBlock as G, createCommentVNode as w, Fragment as C, renderList as B } from "vue";
+import { defineComponent as N, mergeModels as M, useModel as O, ref as p, watch as c, useAttrs as j, openBlock as s, createElementBlock as d, normalizeClass as m, unref as o, renderSlot as v, createElementVNode as h, withModifiers as g, withKeys as D, createBlock as G, createCommentVNode as w, Fragment as C, renderList as B } from "vue";
 import J from "./BaseFloatingLabel.js";
 import { useFloatingLabel as Q } from "./useFloatingLabel.js";
 import { _ as R } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
@@ -19,66 +19,66 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ M(["click", "keydownEnterPressed", "focusin", "focusout", "keydown"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ M(["click", "keydownEnterPressed", "focusin", "focusout", "keydown", "keyup"], ["update:modelValue"]),
   setup(y, { expose: E, emit: H }) {
-    const t = y, r = O(y, "modelValue"), l = p(""), f = H, {
-      labelState: u,
+    const a = y, u = O(y, "modelValue"), l = p(""), k = H, {
+      labelState: r,
       handleFocusIn: P,
       handleFocusOut: V,
       setInlineLabel: F,
       setFloatingLabel: L
-    } = Q(f), n = p("text"), k = p({}), b = p(null), q = () => {
-      t.feedback && (k.value = t.feedback, t.feedback.valid && typeof t.feedback.valid == "string" && (k.value.valid = [t.feedback.valid]), t.feedback.invalid && typeof t.feedback.invalid == "string" && (k.value.invalid = [t.feedback.invalid]));
+    } = Q(k), n = p("text"), f = p({}), b = p(null), q = () => {
+      a.feedback && (f.value = a.feedback, a.feedback.valid && typeof a.feedback.valid == "string" && (f.value.valid = [a.feedback.valid]), a.feedback.invalid && typeof a.feedback.invalid == "string" && (f.value.invalid = [a.feedback.invalid]));
     }, T = (e, i) => {
-      if (!t.formatter || !t.formatter.formatFn)
+      if (!a.formatter || !a.formatter.formatFn)
         return l.value = e, "";
-      const a = e.length ? t.formatter.formatFn(e) : e;
-      return i && (i.value = a), l.value = a, a;
+      const t = e.length ? a.formatter.formatFn(e) : e;
+      return i && (i.value = t), l.value = t, t;
     }, I = (e, i = !0) => {
-      if (i && (!t.formatter || !t.formatter.unFormatFn))
-        return r.value = e, "";
-      if (!i || !t.formatter || !t.formatter.unFormatFn)
+      if (i && (!a.formatter || !a.formatter.unFormatFn))
+        return u.value = e, "";
+      if (!i || !a.formatter || !a.formatter.unFormatFn)
         return;
-      const a = t.formatter.unFormatFn(e);
-      return r.value = a ?? "", a;
+      const t = a.formatter.unFormatFn(e);
+      return u.value = t ?? "", t;
     }, z = ({ target: e }) => {
-      const i = e, a = I(i.value);
+      const i = e, t = I(i.value);
       T(
-        `${a}`,
-        a === r.value ? i : void 0
+        `${t}`,
+        t === u.value ? i : void 0
       );
+    }, K = () => {
+      u.value = "", F();
     }, S = () => {
-      r.value = "", F();
-    }, A = () => {
       n.value === "password" ? n.value = "text" : n.value === "text" && (n.value = "password");
     };
-    $(
-      () => t.feedback,
+    c(
+      () => a.feedback,
       () => {
         q();
       },
       {
         immediate: !0
       }
-    ), $(
-      r,
+    ), c(
+      u,
       (e) => {
         T(
           `${e}`,
           I(`${e}`, !1) === e ? b.value : void 0
-        ), l.value != null && l.value.length > 0 && u.value !== "floating-label" ? L() : !l.value && document && document.activeElement !== b.value && F();
+        ), l.value != null && l.value.length > 0 && r.value !== "floating-label" ? L() : !l.value && document && document.activeElement !== b.value && F();
       },
       {
         immediate: !0
       }
-    ), $(
-      () => t.keepFloatingLabel,
+    ), c(
+      () => a.keepFloatingLabel,
       (e) => {
-        e ? L() : V(r.value);
+        e ? L() : V(u.value);
       }
     );
-    const K = j();
-    return n.value = K.type || "text", E({
+    const A = j();
+    return n.value = A.type || "text", E({
       select: () => {
         b.value?.select();
       }
@@ -87,7 +87,7 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
         e.$attrs.class,
         { "uikit-h-12": e.labelText },
         { "floating-label": e.labelText },
-        o(u) === "floating-label" ? "floating-state" : "inline-state",
+        o(r) === "floating-label" ? "floating-state" : "inline-state",
         {
           "has-right-icon": e.$attrs["with-right-icon"] !== void 0 ? e.$attrs["with-right-icon"] : !!e.$slots.righticon
         },
@@ -99,11 +99,11 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
     }, [
       v(e.$slots, "leftIcon", {}, void 0, !0),
       v(e.$slots, "righticon", {
-        handleClean: S,
-        handleShowPasswd: A,
+        handleClean: K,
+        handleShowPasswd: S,
         curType: n.value
       }, void 0, !0),
-      c("input", {
+      h("input", {
         id: e.$attrs.id,
         ref_key: "baseInputEl",
         ref: b,
@@ -134,17 +134,18 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
         maxlength: e.$attrs.maxlength,
         inputmode: e.$attrs.inputmode,
         placeholder: e.$attrs.placeholder,
-        onClick: i[0] || (i[0] = (a) => f("click", a)),
+        onClick: i[0] || (i[0] = (t) => k("click", t)),
         onFocusin: i[1] || (i[1] = g(() => e.labelText && o(P)(), ["stop"])),
-        onFocusout: i[2] || (i[2] = g((a) => e.labelText && !e.keepFloatingLabel && o(V)(l.value), ["stop"])),
+        onFocusout: i[2] || (i[2] = g((t) => e.labelText && !e.keepFloatingLabel && o(V)(l.value), ["stop"])),
         onInput: g(z, ["stop"]),
         value: l.value,
         onKeydown: [
-          i[3] || (i[3] = D(() => f("keydownEnterPressed"), ["enter"])),
-          i[4] || (i[4] = (a) => f("keydown", a))
-        ]
+          i[3] || (i[3] = D(() => k("keydownEnterPressed"), ["enter"])),
+          i[4] || (i[4] = (t) => k("keydown", t))
+        ],
+        onKeyup: i[5] || (i[5] = (t) => k("keyup", t))
       }, null, 42, W),
-      c("fieldset", {
+      h("fieldset", {
         class: m(["uikit-pointer-events-none uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-m-0 uikit-box-border uikit-h-12 uikit-overflow-hidden uikit-rounded-xs uikit-border uikit-border-solid uikit-px-2 uikit-py-0 uikit-text-left uikit-transition-[border] uikit-duration-100 uikit-ease-out peer-focus:uikit-border-2 peer-focus:uikit-border-w-primary peer-focus:[&.is-invalid]:uikit-border-w-danger", [
           e.$attrs.disabled ? "uikit-bg-w-cultured" : "uikit-bg-white",
           {
@@ -156,15 +157,15 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
           e.$attrs["fieldset-classes"]
         ]])
       }, [
-        c("legend", X, [
-          c("span", {
+        h("legend", X, [
+          h("span", {
             class: m(["visible-label uikit-opacity-0", [
               { "uikit-mx-5px": e.labelText },
               {
-                "uikit-visible uikit-inline-block": o(u) === "floating-label"
+                "uikit-visible uikit-inline-block": o(r) === "floating-label"
               },
               {
-                "uikit-invisible uikit-hidden": o(u) === "inline-label"
+                "uikit-invisible uikit-hidden": o(r) === "inline-label"
               }
             ]]),
             innerHTML: e.labelText
@@ -175,24 +176,24 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
         key: 0,
         for: e.$attrs.id,
         "label-text": e.labelText,
-        "label-state": o(u),
+        "label-state": o(r),
         "is-valid": e.isValid,
         required: e.$attrs.required,
         disabled: e.$attrs.disabled,
         "label-classes": [
-          o(u) === "floating-label" ? "!-uikit-top-1" : "!uikit-top-4",
+          o(r) === "floating-label" ? "!-uikit-top-1" : "!uikit-top-4",
           e.$attrs["label-classes"]
         ]
       }, null, 8, ["for", "label-text", "label-state", "is-valid", "required", "disabled", "label-classes"])) : w("", !0),
       v(e.$slots, "feedback", {}, () => [
-        e.isValid === !1 ? (s(!0), d(C, { key: 0 }, B(k.value.invalid, (a, h) => (s(), d("div", {
-          key: `${e.$attrs.id}_invalid_${h}`,
+        e.isValid === !1 ? (s(!0), d(C, { key: 0 }, B(f.value.invalid, (t, $) => (s(), d("div", {
+          key: `${e.$attrs.id}_invalid_${$}`,
           class: "uikit-mt-1 uikit-text-12 uikit-text-w-danger",
-          innerHTML: a
-        }, null, 8, Z))), 128)) : e.isValid === !0 ? (s(!0), d(C, { key: 1 }, B(k.value.valid, (a, h) => (s(), d("div", {
-          key: `${e.$attrs.id}_valid_${h}`,
+          innerHTML: t
+        }, null, 8, Z))), 128)) : e.isValid === !0 ? (s(!0), d(C, { key: 1 }, B(f.value.valid, (t, $) => (s(), d("div", {
+          key: `${e.$attrs.id}_valid_${$}`,
           class: "uikit-mt-1 uikit-text-12 uikit-text-w-primary",
-          innerHTML: a
+          innerHTML: t
         }, null, 8, U))), 128)) : w("", !0)
       ], !0),
       e.$slots["under-label"] ? (s(), d("div", x, [
@@ -200,7 +201,7 @@ import './assets/BaseInput.css';const W = ["id", "data-cy", "name", "autocomplet
       ])) : w("", !0)
     ], 2));
   }
-}), ne = /* @__PURE__ */ R(_, [["__scopeId", "data-v-4a4fc4c7"]]);
+}), ne = /* @__PURE__ */ R(_, [["__scopeId", "data-v-190ac5fd"]]);
 export {
   ne as default
 };

package/dist/UIKit/BaseInput.vue.d.ts

@@ -45,6 +45,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
     focusin: () => void;
     focusout: () => void;
     keydown: (args_0: KeyboardEvent) => void;
+    keyup: (args_0: KeyboardEvent) => void;
     keydownEnterPressed: () => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     modelValue: import('vue').PropType<string | number | undefined>;
@@ -78,6 +79,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
     onFocusin?: (() => any) | undefined;
     onFocusout?: (() => any) | undefined;
     onKeydown?: ((args_0: KeyboardEvent) => any) | undefined;
+    onKeyup?: ((args_0: KeyboardEvent) => any) | undefined;
     onClick?: ((args_0: MouseEvent) => any) | undefined;
     onKeydownEnterPressed?: (() => any) | undefined;
 }, {

package/dist/assets/BaseInput.css

@@ -1 +1 @@
-.input-wrapper[data-v-4a4fc4c7]{--icon-default-size: 44px}.invalid-bg[data-v-4a4fc4c7]{--invalid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMicgZmlsbD0nbm9uZScgc3Ryb2tlPScjRkE0RjY0Jz48Y2lyY2xlIGN4PSc2JyBjeT0nNicgcj0nNC41Jy8+PHBhdGggc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgZD0nTTUuOCAzLjZoLjRMNiA2LjV6Jy8+PGNpcmNsZSBjeD0nNicgY3k9JzguMicgcj0nLjYnIGZpbGw9JyNGQTRGNjQnIHN0cm9rZT0nbm9uZScvPjwvc3ZnPg==);background-image:var(--invalid-img)}.valid-bg[data-v-4a4fc4c7]{--valid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGZpbGw9JyMyQjVERkYnIGQ9J00yLjMgNi43My42IDQuNTNjLS40LTEuMDQuNDYtMS40IDEuMS0uOGwxLjEgMS40IDMuNC0zLjhjLjYtLjYzIDEuNi0uMjcgMS4yLjdsLTQgNC42Yy0uNDMuNS0uOC40LTEuMS4xeicvPjwvc3ZnPg==);background-image:var(--valid-img)}.invalid-bg[data-v-4a4fc4c7],.valid-bg[data-v-4a4fc4c7]{background-position:top 17px right 12px;background-size:20px}.has-right-icon[data-v-4a4fc4c7]>label.inline-label{right:var(--icon-default-size)}.has-left-icon[data-v-4a4fc4c7]>label.inline-label{left:var(--icon-default-size)}[data-v-4a4fc4c7] .text-input-icon{position:absolute;z-index:20;box-sizing:border-box;--icon-size-sm: 16px;--icon-size-md: 20px;--icon-size-lg: 25px}[data-v-4a4fc4c7] .text-input-icon.left{left:5px}[data-v-4a4fc4c7] .text-input-icon.right{right:5px}[data-v-4a4fc4c7] .text-input-icon{--icon-top: 5px;--icon-size: var(--icon-size-sm);width:var(--icon-default-size);height:var(--icon-default-size);padding:calc((var(--icon-default-size) - var(--icon-size)) / 2);top:var(--icon-top)}[data-v-4a4fc4c7] .text-input-icon.md{--icon-size: var(--icon-size-md)}[data-v-4a4fc4c7] .text-input-icon.lg{--icon-top: 0;--icon-size: var(--icon-size-lg)}.under-label[data-v-4a4fc4c7]{left:4px;font-style:italic}
+.input-wrapper[data-v-190ac5fd]{--icon-default-size: 44px}.invalid-bg[data-v-190ac5fd]{--invalid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMicgZmlsbD0nbm9uZScgc3Ryb2tlPScjRkE0RjY0Jz48Y2lyY2xlIGN4PSc2JyBjeT0nNicgcj0nNC41Jy8+PHBhdGggc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgZD0nTTUuOCAzLjZoLjRMNiA2LjV6Jy8+PGNpcmNsZSBjeD0nNicgY3k9JzguMicgcj0nLjYnIGZpbGw9JyNGQTRGNjQnIHN0cm9rZT0nbm9uZScvPjwvc3ZnPg==);background-image:var(--invalid-img)}.valid-bg[data-v-190ac5fd]{--valid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGZpbGw9JyMyQjVERkYnIGQ9J00yLjMgNi43My42IDQuNTNjLS40LTEuMDQuNDYtMS40IDEuMS0uOGwxLjEgMS40IDMuNC0zLjhjLjYtLjYzIDEuNi0uMjcgMS4yLjdsLTQgNC42Yy0uNDMuNS0uOC40LTEuMS4xeicvPjwvc3ZnPg==);background-image:var(--valid-img)}.invalid-bg[data-v-190ac5fd],.valid-bg[data-v-190ac5fd]{background-position:top 17px right 12px;background-size:20px}.has-right-icon[data-v-190ac5fd]>label.inline-label{right:var(--icon-default-size)}.has-left-icon[data-v-190ac5fd]>label.inline-label{left:var(--icon-default-size)}[data-v-190ac5fd] .text-input-icon{position:absolute;z-index:20;box-sizing:border-box;--icon-size-sm: 16px;--icon-size-md: 20px;--icon-size-lg: 25px}[data-v-190ac5fd] .text-input-icon.left{left:5px}[data-v-190ac5fd] .text-input-icon.right{right:5px}[data-v-190ac5fd] .text-input-icon{--icon-top: 5px;--icon-size: var(--icon-size-sm);width:var(--icon-default-size);height:var(--icon-default-size);padding:calc((var(--icon-default-size) - var(--icon-size)) / 2);top:var(--icon-top)}[data-v-190ac5fd] .text-input-icon.md{--icon-size: var(--icon-size-md)}[data-v-190ac5fd] .text-input-icon.lg{--icon-top: 0;--icon-size: var(--icon-size-lg)}.under-label[data-v-190ac5fd]{left:4px;font-style:italic}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wikicasa-dev/components",
-  "version": "1.7.55",
+  "version": "1.8.0",
   "description": "Wikicasa frontend components",
   "type": "module",
   "main": "./dist/index.js",