@effect-app/vue-components 0.7.6 → 0.7.7

package/dist/vue-components.es24.js

@@ -1,10 +1,10 @@
 (function(){"use strict";try{if(typeof document<"u"){var n=document.createElement("style");if(n.appendChild(document.createTextNode(".omega-input .v-input__details:has(.v-messages:empty){grid-template-rows:0fr;transition:all .2s}.omega-input .v-messages:empty{min-height:0}.omega-input .v-input__details:has(.v-messages){transition:all .2s;overflow:hidden;min-height:0;display:grid;grid-template-rows:1fr}.omega-input .v-messages{transition:all .2s}.omega-input .v-messages>*{transition-duration:0s!important}.omega-input [role=alert]:has(.v-messages:empty){padding:0}.omega-input .v-btn{cursor:pointer;width:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;display:block;min-width:auto;height:auto;padding:.5em .5em .5em 1em}")),document.head.appendChild(n),window.customElements){const e=window.customElements.define;window.customElements.define=function(o,t){const a=t.prototype.connectedCallback;return t.prototype.connectedCallback=function(){if(a&&a.call(this),this.shadowRoot){const i=document.createElement("style");i.appendChild(document.createTextNode(".omega-input .v-input__details:has(.v-messages:empty){grid-template-rows:0fr;transition:all .2s}.omega-input .v-messages:empty{min-height:0}.omega-input .v-input__details:has(.v-messages){transition:all .2s;overflow:hidden;min-height:0;display:grid;grid-template-rows:1fr}.omega-input .v-messages{transition:all .2s}.omega-input .v-messages>*{transition-duration:0s!important}.omega-input [role=alert]:has(.v-messages:empty){padding:0}.omega-input .v-btn{cursor:pointer;width:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;display:block;min-width:auto;height:auto;padding:.5em .5em .5em 1em}")),this.shadowRoot.appendChild(i)}},e.call(window.customElements,o,t)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-import { defineComponent as B, getCurrentInstance as L, useId as P, computed as n, watch as w, nextTick as S, onMounted as x, ref as T, watchEffect as z, renderSlot as A, normalizeProps as D, guardReactiveProps as F, createElementVNode as M, normalizeClass as N, createBlock as R, createCommentVNode as U, unref as j, openBlock as G, mergeProps as H } from "vue";
+import { defineComponent as q, getCurrentInstance as L, useId as P, computed as l, watch as w, nextTick as F, onMounted as x, ref as S, watchEffect as T, renderSlot as z, normalizeProps as A, guardReactiveProps as D, createElementVNode as M, normalizeClass as R, createBlock as U, createCommentVNode as Z, unref as j, openBlock as G, mergeProps as H } from "vue";
 import { useStore as J } from "@tanstack/vue-form";
 import { useOmegaErrors as K } from "./vue-components.es7.js";
 import Q from "./vue-components.es27.js";
 
-const te = /* @__PURE__ */ B({
+const re = /* @__PURE__ */ q({
   inheritAttrs: !1,
   __name: "OmegaInternalInput",
   props: {
@@ -16,33 +16,33 @@ const te = /* @__PURE__ */ B({
     validators: {}
   },
   setup(C) {
-    const e = C, o = L(), $ = o == null ? void 0 : o.appContext.components.VTextField, s = P(), u = e.field, a = J(u.store, (t) => t), d = n(() => {
-      var t, r;
-      return e.type ? e.type : ((t = e.meta) == null ? void 0 : t.type) === "string" ? e.meta.format === "email" ? "email" : "string" : ((r = e.meta) == null ? void 0 : r.type) || "unknown";
-    }), i = n(() => a.value.value), k = n(
+    const t = C, o = L(), N = o == null ? void 0 : o.appContext.components.VTextField, s = P(), u = t.field, a = J(u.store, (e) => e), d = l(() => {
+      var e, r;
+      return t.type ? t.type : ((e = t.meta) == null ? void 0 : e.type) === "string" ? t.meta.format === "email" ? "email" : "string" : ((r = t.meta) == null ? void 0 : r.type) || "unknown";
+    }), i = l(() => a.value.value), $ = l(
       () => (
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
+        a.value.meta.errors.map((e) => e == null ? void 0 : e.message).filter(Boolean)
       )
-    );
+    ), k = (e) => e == null || e === !1 || e === "" || Number.isNaN(e);
     w(
       () => !!i.value,
-      (t) => {
+      (e) => {
         var r;
-        !t && ((r = e.meta) == null ? void 0 : r.type) !== "boolean" && S(() => {
-          var l;
+        k(e) && ((r = t.meta) == null ? void 0 : r.type) !== "boolean" && F(() => {
+          var n;
           u.setValue(
-            ((l = e.meta) == null ? void 0 : l.nullableOrUndefined) === "undefined" ? void 0 : null
+            ((n = t.meta) == null ? void 0 : n.nullableOrUndefined) === "undefined" ? void 0 : null
           );
         });
       }
     ), x(() => {
-      var t, r;
-      !i.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
+      var e, r;
+      !i.value && !((e = t.meta) != null && e.required) && ((r = t.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
     });
-    const { addError: I, removeError: O, showErrors: _, showErrorsOn: q } = K(), m = T(!1);
-    z(() => {
-      (_.value || q === "onChange") && (m.value = !0);
+    const { addError: B, removeError: I, showErrors: O, showErrorsOn: _ } = K(), m = S(!1);
+    T(() => {
+      (O.value || _ === "onChange") && (m.value = !0);
     });
     const p = () => {
       m.value = !0;
@@ -50,52 +50,52 @@ const te = /* @__PURE__ */ B({
     x(() => {
       i.value && p();
     });
-    const c = n(() => !m.value && d.value !== "select" ? [] : k.value);
+    const c = l(() => !m.value && d.value !== "select" ? [] : $.value);
     w(
       () => a.value.meta.errors,
       () => {
-        a.value.meta.errors.length ? I({
+        a.value.meta.errors.length ? B({
           inputId: s,
-          errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
-          label: e.label
-        }) : O(s);
+          errors: a.value.meta.errors.map((e) => e.message).filter(Boolean),
+          label: t.label
+        }) : I(s);
       }
     );
-    const f = n(() => {
-      var t, r, l, v, g, y, h, b, E, V;
+    const f = l(() => {
+      var e, r, n, v, g, y, h, b, E, V;
       return {
         id: s,
-        required: (t = e.meta) == null ? void 0 : t.required,
-        minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((l = e.meta) == null ? void 0 : l.minLength),
-        maxLength: ((v = e.meta) == null ? void 0 : v.type) === "string" && ((g = e.meta) == null ? void 0 : g.maxLength),
-        max: ((y = e.meta) == null ? void 0 : y.type) === "number" && ((h = e.meta) == null ? void 0 : h.maximum),
-        min: ((b = e.meta) == null ? void 0 : b.type) === "number" && ((E = e.meta) == null ? void 0 : E.minimum),
-        name: e.field.name,
-        modelValue: e.field.state.value,
+        required: (e = t.meta) == null ? void 0 : e.required,
+        minLength: ((r = t.meta) == null ? void 0 : r.type) === "string" && ((n = t.meta) == null ? void 0 : n.minLength),
+        maxLength: ((v = t.meta) == null ? void 0 : v.type) === "string" && ((g = t.meta) == null ? void 0 : g.maxLength),
+        max: ((y = t.meta) == null ? void 0 : y.type) === "number" && ((h = t.meta) == null ? void 0 : h.maximum),
+        min: ((b = t.meta) == null ? void 0 : b.type) === "number" && ((E = t.meta) == null ? void 0 : E.minimum),
+        name: t.field.name,
+        modelValue: t.field.state.value,
         errorMessages: c.value,
         error: !!c.value.length,
-        field: e.field,
+        field: t.field,
         setRealDirty: p,
         type: d.value,
-        label: `${e.label}${(V = e.meta) != null && V.required ? " *" : ""}`,
-        options: e.options
+        label: `${t.label}${(V = t.meta) != null && V.required ? " *" : ""}`,
+        options: t.options
       };
     });
-    return (t, r) => A(t.$slots, "default", D(F(f.value)), () => [
+    return (e, r) => z(e.$slots, "default", A(D(f.value)), () => [
       M("div", {
-        class: N(t.$attrs.class),
+        class: R(e.$attrs.class),
         onFocusout: p
       }, [
-        j($) ? (G(), R(Q, H({
+        j(N) ? (G(), U(Q, H({
           key: 0,
           "input-props": f.value
-        }, t.$attrs, {
+        }, e.$attrs, {
           "vuetify-value": f.value.field.state.value
-        }), null, 16, ["input-props", "vuetify-value"])) : U("", !0)
+        }), null, 16, ["input-props", "vuetify-value"])) : Z("", !0)
       ], 34)
     ]);
   }
 });
 export {
-  te as default
+  re as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effect-app/vue-components",
-  "version": "0.7.6",
+  "version": "0.7.7",
   "peerDependencies": {
     "@mdi/js": "^7.4.47",
     "@tanstack/vue-form": "^1.2.4",

package/src/components/OmegaForm/OmegaInternalInput.vue

@@ -71,12 +71,16 @@ const errors = computed(() =>
   fieldState.value.meta.errors.map((e: any) => e?.message).filter(Boolean),
 )
 
+const isFalsyButNotZero = (value: unknown): boolean => {
+  return value == null || value === false || value === "" || Number.isNaN(value)
+}
+
 // we remove value and errors when the field is empty and not required
 //watchEffect will trigger infinite times with both free fieldValue and errors, so bet to watch a stupid boolean
 watch(
   () => !!fieldValue.value,
   value => {
-    if (!value && props.meta?.type !== "boolean") {
+    if (isFalsyButNotZero(value) && props.meta?.type !== "boolean") {
       nextTick(() => {
         fieldApi.setValue(
           props.meta?.nullableOrUndefined === "undefined" ? undefined : null,