@effect-app/vue-components 0.2.0 → 0.2.2

package/dist/types/components/OmegaForm/OmegaInput.vue.d.ts

@@ -36,6 +36,7 @@ declare const _default: <From, To>(__VLS_props: NonNullable<Awaited<typeof __VLS
                 title: string;
                 value: string;
             }[];
+            onFocusout: () => void;
         }) => any) | undefined;
     };
     emit: {};

package/dist/types/components/OmegaForm/OmegaInputVuetify.vue.d.ts

@@ -1,12 +1,18 @@
 import type { InputProps } from "./InputProps";
 declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onBlur?: ((event: Event) => any) | undefined;
+        readonly onFocus?: ((event: Event) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onBlur" | "onFocus"> & {
         inputProps: InputProps<T>;
     } & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};
-    emit: {};
+    emit: {
+        (e: "focus", event: Event): void;
+        (e: "blur", event: Event): void;
+    };
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/types/components/OmegaForm/OmegaInternalInput.vue.d.ts

@@ -34,6 +34,7 @@ declare const _default: <To>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup
                 title: string;
                 value: string;
             }[];
+            onFocusout: () => void;
         }) => any) | undefined;
     };
     emit: {};

package/dist/vue-components.es11.js

@@ -1,6 +1,6 @@
 import { defineComponent as d, watch as b, createElementBlock as S, openBlock as g, withModifiers as v, unref as a, createElementVNode as h, renderSlot as M } from "vue";
 import { useStore as i } from "@tanstack/vue-form";
-import { getOmegaStore as y } from "./vue-components.es16.js";
+import { getOmegaStore as y } from "./vue-components.es15.js";
 import { provideOmegaErrors as O } from "./vue-components.es4.js";
 import { useOmegaForm as F } from "./vue-components.es5.js";
 const I = ["disabled"], A = /* @__PURE__ */ d({

package/dist/vue-components.es15.js

@@ -1,87 +1,13 @@
-(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 A, getCurrentInstance as B, useId as C, computed as n, watch as _, onMounted as L, ref as O, watchEffect as P, useAttrs as S, renderSlot as D, normalizeProps as M, guardReactiveProps as R, createBlock as T, createCommentVNode as U, unref as z, openBlock as F, mergeProps as N } from "vue";
-import { useStore as j } from "@tanstack/vue-form";
-import { useOmegaErrors as G } from "./vue-components.es4.js";
-import H from "./vue-components.es18.js";
-
-const Y = /* @__PURE__ */ A({
-  inheritAttrs: !1,
-  __name: "OmegaInternalInput",
-  props: {
-    field: {},
-    meta: {},
-    label: {},
-    options: {},
-    type: {},
-    validators: {}
-  },
-  setup(q) {
-    const e = q, l = B(), E = l == null ? void 0 : l.appContext.components.VTextField, o = C(), u = e.field, a = j(u.store, (t) => t), i = 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";
-    }), s = n(() => a.value.value), p = n(
-      () => (
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
-      )
-    );
-    _(
-      () => [!!s.value],
-      () => {
-        var t, r;
-        p.value.length && !s.value && !((t = e.meta) != null && t.required) && u.setValue(
-          ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "undefined" ? void 0 : null
-        );
-      }
-    ), L(() => {
-      var t, r;
-      !s.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
-    });
-    const m = O(!1), I = () => {
-      m.value = !0;
-    }, { addError: $, formSubmissionAttempts: k, removeError: w } = G();
-    P(() => {
-      k.value > 0 && (m.value = !0);
-    });
-    const f = n(() => !m.value && i.value !== "select" ? [] : p.value);
-    _(
-      () => a.value.meta.errors,
-      () => {
-        a.value.meta.errors.length ? $({
-          inputId: o,
-          errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
-          label: e.label
-        }) : w(o);
-      }
-    ), S();
-    const d = n(() => {
-      var t, r, c, v, g, y, h, b, x, V;
-      return {
-        id: o,
-        required: (t = e.meta) == null ? void 0 : t.required,
-        minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((c = e.meta) == null ? void 0 : c.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" && ((x = e.meta) == null ? void 0 : x.minimum),
-        name: e.field.name,
-        modelValue: e.field.state.value,
-        errorMessages: f.value,
-        error: !!f.value.length,
-        field: e.field,
-        setRealDirty: I,
-        type: i.value,
-        label: `${e.label}${(V = e.meta) != null && V.required ? " *" : ""}`,
-        options: e.options
-      };
-    });
-    return (t, r) => D(t.$slots, "default", M(R(d.value)), () => [
-      z(E) ? (F(), T(H, N({
-        key: 0,
-        "input-props": d.value
-      }, t.$attrs), null, 16, ["input-props"])) : U("", !0)
-    ]);
-  }
-});
+import { useStore as u } from "@tanstack/vue-form";
+import { computed as f } from "vue";
+function c(o, t) {
+  return f(() => t ? u(o.store, (n) => {
+    const r = {};
+    for (const e of t)
+      r[e] = n[e];
+    return r;
+  }).value : {});
+}
 export {
-  Y as default
+  c as getOmegaStore
 };

package/dist/vue-components.es16.js

@@ -1,13 +1,87 @@
-import { useStore as u } from "@tanstack/vue-form";
-import { computed as f } from "vue";
-function c(o, t) {
-  return f(() => t ? u(o.store, (n) => {
-    const r = {};
-    for (const e of t)
-      r[e] = n[e];
-    return r;
-  }).value : {});
-}
+(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 C, getCurrentInstance as L, useId as O, computed as n, watch as q, onMounted as S, ref as A, watchEffect as D, renderSlot as F, mergeProps as E, createBlock as M, createCommentVNode as P, unref as T, openBlock as U } from "vue";
+import { useStore as N } from "@tanstack/vue-form";
+import { useOmegaErrors as R } from "./vue-components.es4.js";
+import j from "./vue-components.es18.js";
+
+const Q = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "OmegaInternalInput",
+  props: {
+    field: {},
+    meta: {},
+    label: {},
+    options: {},
+    type: {},
+    validators: {}
+  },
+  setup(I) {
+    const e = I, l = L(), $ = l == null ? void 0 : l.appContext.components.VTextField, o = O(), u = e.field, a = N(u.store, (t) => t), i = 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";
+    }), m = n(() => a.value.value), p = n(
+      () => (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
+      )
+    );
+    q(
+      () => [!!m.value],
+      () => {
+        var t, r;
+        p.value.length && !m.value && !((t = e.meta) != null && t.required) && u.setValue(
+          ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "undefined" ? void 0 : null
+        );
+      }
+    ), S(() => {
+      var t, r;
+      !m.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
+    });
+    const s = A(!1), f = () => {
+      s.value = !0;
+    }, { addError: k, formSubmissionAttempts: w, removeError: B } = R();
+    D(() => {
+      w.value > 0 && (s.value = !0);
+    });
+    const d = n(() => !s.value && i.value !== "select" ? [] : p.value);
+    q(
+      () => a.value.meta.errors,
+      () => {
+        a.value.meta.errors.length ? k({
+          inputId: o,
+          errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
+          label: e.label
+        }) : B(o);
+      }
+    );
+    const c = n(() => {
+      var t, r, v, g, y, h, b, x, V, _;
+      return {
+        id: o,
+        required: (t = e.meta) == null ? void 0 : t.required,
+        minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((v = e.meta) == null ? void 0 : v.minLength),
+        maxLength: ((g = e.meta) == null ? void 0 : g.type) === "string" && ((y = e.meta) == null ? void 0 : y.maxLength),
+        max: ((h = e.meta) == null ? void 0 : h.type) === "number" && ((b = e.meta) == null ? void 0 : b.maximum),
+        min: ((x = e.meta) == null ? void 0 : x.type) === "number" && ((V = e.meta) == null ? void 0 : V.minimum),
+        name: e.field.name,
+        modelValue: e.field.state.value,
+        errorMessages: d.value,
+        error: !!d.value.length,
+        field: e.field,
+        setRealDirty: f,
+        type: i.value,
+        label: `${e.label}${(_ = e.meta) != null && _.required ? " *" : ""}`,
+        options: e.options
+      };
+    });
+    return (t, r) => F(t.$slots, "default", E(c.value, { onFocusout: f }), () => [
+      T($) ? (U(), M(j, E({
+        key: 0,
+        "input-props": c.value
+      }, t.$attrs), null, 16, ["input-props"])) : P("", !0)
+    ]);
+  }
+});
 export {
-  c as getOmegaStore
+  Q as default
 };

package/dist/vue-components.es17.js

@@ -1,4 +1,4 @@
-import f from "./vue-components.es15.js";
+import f from "./vue-components.es16.js";
 export {
   f as default
 };

package/dist/vue-components.es18.js

@@ -1,15 +1,21 @@
-import { defineComponent as k, resolveComponent as n, createElementBlock as m, openBlock as r, createBlock as l, createCommentVNode as p, mergeProps as i, normalizeClass as y, createVNode as u, unref as t, withCtx as v } from "vue";
+import { defineComponent as k, resolveComponent as i, createElementBlock as m, openBlock as p, createBlock as l, createCommentVNode as n, mergeProps as s, normalizeClass as v, createVNode as u, unref as t, withCtx as y } from "vue";
 import { mdiRefresh as a } from "@mdi/js";
-const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
+const U = /* @__PURE__ */ k({
+  inheritAttrs: !1,
   __name: "OmegaInputVuetify",
   props: {
     inputProps: {}
   },
-  setup(q) {
-    return (e, o) => {
-      const h = n("v-checkbox"), d = n("v-text-field"), b = n("v-textarea"), f = n("v-select"), P = n("v-icon"), g = n("v-btn"), V = n("v-autocomplete");
-      return r(), m("div", C, [
-        e.inputProps.type === "boolean" ? (r(), l(h, i({
+  emits: ["focus", "blur"],
+  setup(C) {
+    return (e, r) => {
+      const b = i("v-checkbox"), d = i("v-text-field"), h = i("v-textarea"), f = i("v-select"), P = i("v-icon"), g = i("v-btn"), V = i("v-autocomplete");
+      return p(), m("div", {
+        class: "omega-input",
+        onFocusout: r[4] || (r[4] = (o) => e.$emit("blur", o)),
+        onFocusin: r[5] || (r[5] = (o) => e.$emit("focus", o))
+      }, [
+        e.inputProps.type === "boolean" ? (p(), l(b, s({
           key: 0,
           id: e.inputProps.id,
           name: e.inputProps.name,
@@ -19,10 +25,9 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
           error: e.inputProps.error
         }, e.$attrs, {
           ripple: "",
-          onChange: o[0] || (o[0] = (s) => e.inputProps.field.handleChange(s.target.checked)),
-          onBlur: e.inputProps.setRealDirty
-        }), null, 16, ["id", "name", "label", "model-value", "error-messages", "error", "onBlur"])) : p("", !0),
-        e.inputProps.type === "email" || e.inputProps.type === "string" ? (r(), l(d, i({
+          onChange: r[0] || (r[0] = (o) => e.inputProps.field.handleChange(o.target.checked))
+        }), null, 16, ["id", "name", "label", "model-value", "error-messages", "error"])) : n("", !0),
+        e.inputProps.type === "email" || e.inputProps.type === "string" ? (p(), l(d, s({
           key: 1,
           id: e.inputProps.id,
           required: e.inputProps.required,
@@ -35,10 +40,9 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
           "error-messages": e.inputProps.errorMessages,
           error: e.inputProps.error
         }, e.$attrs, {
-          "onUpdate:modelValue": e.inputProps.field.handleChange,
-          onBlur: e.inputProps.setRealDirty
-        }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "model-value", "error-messages", "error", "onUpdate:modelValue", "onBlur"])) : p("", !0),
-        e.inputProps.type === "text" ? (r(), l(b, i({ key: 2 }, e.$attrs, {
+          "onUpdate:modelValue": e.inputProps.field.handleChange
+        }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "model-value", "error-messages", "error", "onUpdate:modelValue"])) : n("", !0),
+        e.inputProps.type === "text" ? (p(), l(h, s({ key: 2 }, e.$attrs, {
           id: e.inputProps.id,
           required: e.inputProps.required,
           "min-length": e.inputProps.minLength,
@@ -49,10 +53,9 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
           "model-value": e.inputProps.modelValue,
           "error-messages": e.inputProps.errorMessages,
           error: e.inputProps.error,
-          "onUpdate:modelValue": e.inputProps.field.handleChange,
-          onBlur: e.inputProps.setRealDirty
-        }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "model-value", "error-messages", "error", "onUpdate:modelValue", "onBlur"])) : p("", !0),
-        e.inputProps.type === "number" ? (r(), l(d, i({
+          "onUpdate:modelValue": e.inputProps.field.handleChange
+        }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "model-value", "error-messages", "error", "onUpdate:modelValue"])) : n("", !0),
+        e.inputProps.type === "number" ? (p(), l(d, s({
           key: 3,
           id: e.inputProps.id,
           required: e.inputProps.required,
@@ -65,16 +68,15 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
           "error-messages": e.inputProps.errorMessages,
           error: e.inputProps.error
         }, e.$attrs, {
-          "onUpdate:modelValue": o[1] || (o[1] = (s) => {
-            e.inputProps.field.handleChange(Number(s));
-          }),
-          onBlur: e.inputProps.setRealDirty
-        }), null, 16, ["id", "required", "min", "max", "type", "name", "label", "model-value", "error-messages", "error", "onBlur"])) : p("", !0),
-        e.inputProps.type === "select" || e.inputProps.type === "multiple" ? (r(), m("div", {
+          "onUpdate:modelValue": r[1] || (r[1] = (o) => {
+            e.inputProps.field.handleChange(Number(o));
+          })
+        }), null, 16, ["id", "required", "min", "max", "type", "name", "label", "model-value", "error-messages", "error"])) : n("", !0),
+        e.inputProps.type === "select" || e.inputProps.type === "multiple" ? (p(), m("div", {
           key: 4,
-          class: y(e.inputProps.type !== "multiple" && "d-flex")
+          class: v(e.inputProps.type !== "multiple" && "d-flex")
         }, [
-          u(f, i({
+          u(f, s({
             id: e.inputProps.id,
             required: e.inputProps.required,
             multiple: e.inputProps.type === "multiple",
@@ -86,28 +88,27 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
             "error-messages": e.inputProps.errorMessages,
             error: e.inputProps.error
           }, e.$attrs, {
-            "onUpdate:modelValue": e.inputProps.field.handleChange,
-            onBlur: e.inputProps.setRealDirty
-          }), null, 16, ["id", "required", "multiple", "chips", "name", "model-value", "label", "items", "error-messages", "error", "onUpdate:modelValue", "onBlur"]),
-          e.inputProps.type === "select" ? (r(), l(g, {
+            "onUpdate:modelValue": e.inputProps.field.handleChange
+          }), null, 16, ["id", "required", "multiple", "chips", "name", "model-value", "label", "items", "error-messages", "error", "onUpdate:modelValue"]),
+          e.inputProps.type === "select" ? (p(), l(g, {
             key: 0,
             "variant-btn": "secondary",
             "variant-icon": t(a),
             class: "mr-2",
             title: "Reset",
-            onClick: o[2] || (o[2] = (s) => e.inputProps.field.handleChange(void 0))
+            onClick: r[2] || (r[2] = (o) => e.inputProps.field.handleChange(void 0))
           }, {
-            default: v(() => [
+            default: y(() => [
               u(P, { icon: t(a) }, null, 8, ["icon"])
             ]),
             _: 1
-          }, 8, ["variant-icon"])) : p("", !0)
-        ], 2)) : p("", !0),
-        e.inputProps.type === "autocomplete" || e.inputProps.type === "autocompletemultiple" ? (r(), m("div", {
+          }, 8, ["variant-icon"])) : n("", !0)
+        ], 2)) : n("", !0),
+        e.inputProps.type === "autocomplete" || e.inputProps.type === "autocompletemultiple" ? (p(), m("div", {
           key: 5,
-          class: y(e.inputProps.type !== "autocompletemultiple" && "d-flex")
+          class: v(e.inputProps.type !== "autocompletemultiple" && "d-flex")
         }, [
-          u(V, i({
+          u(V, s({
             id: e.inputProps.id,
             multiple: e.inputProps.type === "autocompletemultiple",
             required: e.inputProps.required,
@@ -119,24 +120,23 @@ const C = { class: "omega-input" }, U = /* @__PURE__ */ k({
             error: e.inputProps.error,
             chips: e.inputProps.type === "autocompletemultiple"
           }, e.$attrs, {
-            "onUpdate:modelValue": e.inputProps.field.handleChange,
-            onBlur: e.inputProps.setRealDirty
-          }), null, 16, ["id", "multiple", "required", "name", "model-value", "label", "items", "error-messages", "error", "chips", "onUpdate:modelValue", "onBlur"]),
-          e.inputProps.type === "autocomplete" ? (r(), l(g, {
+            "onUpdate:modelValue": e.inputProps.field.handleChange
+          }), null, 16, ["id", "multiple", "required", "name", "model-value", "label", "items", "error-messages", "error", "chips", "onUpdate:modelValue"]),
+          e.inputProps.type === "autocomplete" ? (p(), l(g, {
             key: 0,
             "variant-btn": "secondary",
             "variant-icon": t(a),
             class: "mr-2",
             title: "Reset",
-            onClick: o[3] || (o[3] = (s) => e.inputProps.field.handleChange(void 0))
+            onClick: r[3] || (r[3] = (o) => e.inputProps.field.handleChange(void 0))
           }, {
-            default: v(() => [
+            default: y(() => [
               u(P, { icon: t(a) }, null, 8, ["icon"])
             ]),
             _: 1
-          }, 8, ["variant-icon"])) : p("", !0)
-        ], 2)) : p("", !0)
-      ]);
+          }, 8, ["variant-icon"])) : n("", !0)
+        ], 2)) : n("", !0)
+      ], 32);
     };
   }
 });

package/dist/vue-components.es8.js

@@ -1,6 +1,6 @@
 import { defineComponent as i, computed as t, createBlock as p, openBlock as d, resolveDynamicComponent as u, withCtx as r, createVNode as f, mergeProps as c, renderSlot as v, normalizeProps as h, guardReactiveProps as g } from "vue";
 import { generateInputStandardSchemaFromFieldMeta as y } from "./vue-components.es6.js";
-import b from "./vue-components.es15.js";
+import b from "./vue-components.es16.js";
 const S = /* @__PURE__ */ i({
   inheritAttrs: !1,
   __name: "OmegaInput",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effect-app/vue-components",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "peerDependencies": {
     "@mdi/js": "^7.4.47",
     "@tanstack/vue-form": "^1.2.4",
@@ -43,8 +43,8 @@
     "./dist/vue-components.css": "./dist/vue-components.css"
   },
   "dependencies": {
-    "@effect-app/vue": "2.39.9",
-    "effect-app": "2.38.5"
+    "@effect-app/vue": "2.40.0",
+    "effect-app": "2.39.0"
   },
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",

package/src/components/OmegaForm/OmegaInputVuetify.vue

@@ -1,5 +1,9 @@
 <template>
-  <div class="omega-input">
+  <div
+    class="omega-input"
+    @focusout="$emit('blur', $event)"
+    @focusin="$emit('focus', $event)"
+  >
     <v-checkbox
       v-if="inputProps.type === 'boolean'"
       :id="inputProps.id"
@@ -11,7 +15,6 @@
       v-bind="$attrs"
       ripple
       @change="(e: any) => inputProps.field.handleChange(e.target.checked)"
-      @blur="inputProps.setRealDirty"
     />
     <v-text-field
       v-if="inputProps.type === 'email' || inputProps.type === 'string'"
@@ -27,7 +30,6 @@
       :error="inputProps.error"
       v-bind="$attrs"
       @update:model-value="inputProps.field.handleChange"
-      @blur="inputProps.setRealDirty"
     />
     <v-textarea
       v-if="inputProps.type === 'text'"
@@ -43,7 +45,6 @@
       :error-messages="inputProps.errorMessages"
       :error="inputProps.error"
       @update:model-value="inputProps.field.handleChange"
-      @blur="inputProps.setRealDirty"
     />
     <v-text-field
       v-if="inputProps.type === 'number'"
@@ -63,7 +64,6 @@
           inputProps.field.handleChange(Number(e))
         }
       "
-      @blur="inputProps.setRealDirty"
     />
     <div
       v-if="inputProps.type === 'select' || inputProps.type === 'multiple'"
@@ -82,7 +82,6 @@
         :error="inputProps.error"
         v-bind="$attrs"
         @update:model-value="inputProps.field.handleChange"
-        @blur="inputProps.setRealDirty"
       />
       <v-btn
         v-if="inputProps.type === 'select'"
@@ -116,7 +115,6 @@
         :chips="inputProps.type === 'autocompletemultiple'"
         v-bind="$attrs"
         @update:model-value="inputProps.field.handleChange"
-        @blur="inputProps.setRealDirty"
       />
       <v-btn
         v-if="inputProps.type === 'autocomplete'"
@@ -139,6 +137,15 @@ import type { InputProps } from "./InputProps"
 defineProps<{
   inputProps: InputProps<T>
 }>()
+
+defineEmits<{
+  (e: "focus", event: Event): void
+  (e: "blur", event: Event): void
+}>()
+
+defineOptions({
+  inheritAttrs: false,
+})
 </script>
 
 <style>

package/src/components/OmegaForm/OmegaInternalInput.vue

@@ -1,5 +1,5 @@
 <template>
-  <slot v-bind="inputProps">
+  <slot v-bind="inputProps" @focusout="setRealDirty">
     <OmegaInputVuetify
       v-if="vuetified"
       :input-props="inputProps"
@@ -11,7 +11,6 @@
 <script setup lang="ts" generic="To">
 import { useStore } from "@tanstack/vue-form"
 import {
-  useAttrs,
   useId,
   computed,
   watch,
@@ -128,8 +127,6 @@ watch(
   },
 )
 
-const otherAttrs = useAttrs()
-
 const inputProps: ComputedRef<InputProps<To>> = computed(() => ({
   id,
   required: props.meta?.required,