@effect-app/vue-components 0.23.0 → 0.23.1

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

@@ -14,10 +14,18 @@ declare const _default: <From extends Record<PropertyKey, any>, To extends Recor
         schema: S.Schema<To, From, never>;
     }) & ({
         isLoading: boolean;
-        onSubmit: (value: To, meta: any, formApi: import("./OmegaFormStuff").OmegaFormParams<From, To>) => void;
+        onSubmit: (value: To, extra: Pick<{
+            formApi: import("./OmegaFormStuff").OmegaFormParams<From, To>;
+            meta: any;
+            value: To;
+        }, "formApi" | "meta">) => void;
     } | {
         isLoading?: undefined;
-        onSubmit?: (value: To, meta: any, formApi: import("./OmegaFormStuff").OmegaFormParams<From, To>) => ReturnType<(props: {
+        onSubmit?: (value: To, extra: Pick<{
+            formApi: import("./OmegaFormStuff").OmegaFormParams<From, To>;
+            meta: any;
+            value: To;
+        }, "formApi" | "meta">) => ReturnType<(props: {
             formApi: import("./OmegaFormStuff").OmegaFormParams<From, To>;
             meta: any;
             value: To;

package/dist/vue-components.es12.js

@@ -1,8 +1,8 @@
-(function(){"use strict";try{if(typeof document<"u"){var n=document.createElement("style");if(n.appendChild(document.createTextNode("fieldset[data-v-b77e8ae3]{display:contents}fieldset[disabled][data-v-b77e8ae3]>*{pointer-events:none}")),document.head.appendChild(n),window.customElements){const e=window.customElements.define;window.customElements.define=function(i,t){const d=t.prototype.connectedCallback;return t.prototype.connectedCallback=function(){if(d&&d.call(this),this.shadowRoot){const o=document.createElement("style");o.appendChild(document.createTextNode("fieldset[data-v-b77e8ae3]{display:contents}fieldset[disabled][data-v-b77e8ae3]>*{pointer-events:none}")),this.shadowRoot.appendChild(o)}},e.call(window.customElements,i,t)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+(function(){"use strict";try{if(typeof document<"u"){var n=document.createElement("style");if(n.appendChild(document.createTextNode("fieldset[data-v-d1710c8c]{display:contents}fieldset[disabled][data-v-d1710c8c]>*{pointer-events:none}")),document.head.appendChild(n),window.customElements){const e=window.customElements.define;window.customElements.define=function(c,t){const d=t.prototype.connectedCallback;return t.prototype.connectedCallback=function(){if(d&&d.call(this),this.shadowRoot){const o=document.createElement("style");o.appendChild(document.createTextNode("fieldset[data-v-d1710c8c]{display:contents}fieldset[disabled][data-v-d1710c8c]>*{pointer-events:none}")),this.shadowRoot.appendChild(o)}},e.call(window.customElements,c,t)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
 import o from "./vue-components.es20.js";
 
 import r from "./vue-components.es17.js";
-const t = /* @__PURE__ */ r(o, [["__scopeId", "data-v-b77e8ae3"]]);
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d1710c8c"]]);
 export {
-  t as default
+  m as default
 };

package/dist/vue-components.es20.js

@@ -1,6 +1,6 @@
-import { defineComponent as B, getCurrentInstance as F, computed as l, onBeforeMount as L, watch as S, createElementBlock as O, openBlock as h, withModifiers as C, createElementVNode as V, unref as m, renderSlot as b, createCommentVNode as k, Fragment as _ } from "vue";
+import { defineComponent as B, getCurrentInstance as F, computed as u, onBeforeMount as L, watch as S, createElementBlock as O, openBlock as h, withModifiers as C, createElementVNode as V, unref as m, renderSlot as p, createCommentVNode as k, Fragment as _ } from "vue";
 import { useStore as y } from "@tanstack/vue-form";
-import { getOmegaStore as $ } from "./vue-components.es27.js";
+import { getOmegaStore as $ } from "./vue-components.es26.js";
 import { provideOmegaErrors as A } from "./vue-components.es8.js";
 import { useOmegaForm as K } from "./vue-components.es9.js";
 const P = ["disabled"], H = /* @__PURE__ */ B({
@@ -27,19 +27,19 @@ const P = ["disabled"], H = /* @__PURE__ */ B({
     onSubmit: {}
   },
   setup(w) {
-    const o = w, E = F(), j = (e, r, n) => new Promise((t) => {
-      E.emit("submit", e, r, n);
-      const i = S(() => o.isLoading, (u) => {
-        u || (t(), i.stop());
+    const o = w, E = F(), j = (e, r) => new Promise((n) => {
+      E.emit("submit", e, r);
+      const t = S(() => o.isLoading, (i) => {
+        i || (n(), t.stop());
       });
-    }), v = typeof o.isLoading < "u" ? l(() => j) : typeof o.onSubmit < "u" ? l(() => o.onSubmit) : void 0, f = v?.value ? ({ formApi: e, meta: r, value: n }) => v.value(n, r, e) : void 0, c = o.form || !o.schema ? void 0 : K(
+    }), b = typeof o.isLoading < "u" ? u(() => j) : typeof o.onSubmit < "u" ? u(() => o.onSubmit) : void 0, l = b?.value ? ({ formApi: e, meta: r, value: n }) => b.value(n, { meta: r, formApi: e }) : void 0, f = o.form || !o.schema ? void 0 : K(
       o.schema,
       {
         ...o,
-        onSubmit: f
+        onSubmit: l
       },
       o.omegaConfig
-    ), s = l(() => o.form ?? c);
+    ), s = u(() => o.form ?? f);
     L(() => {
       if (!o.form) return;
       const e = Object.keys(o.form.options || {}), r = /* @__PURE__ */ new Set([
@@ -51,7 +51,7 @@ const P = ["disabled"], H = /* @__PURE__ */ B({
         "schema"
       ]), n = Object.fromEntries(
         Object.entries(o).filter(
-          ([a, p]) => a === "isLoading" ? !1 : !r.has(a) && p !== void 0
+          ([a, d]) => a === "isLoading" ? !1 : !r.has(a) && d !== void 0
         )
       ), t = Object.keys(n), i = e.filter(
         (a) => t.includes(a) && n[a] !== void 0
@@ -64,31 +64,31 @@ ${i.join(
         )}.
 Props will overwrite existing form options. This might indicate a configuration issue.`
       );
-      const u = {
+      const g = {
         ...s.value.options,
         ...n
       };
-      f && (u.onSubmit = f), s.value.options = Object.fromEntries(
+      l && (g.onSubmit = l), s.value.options = Object.fromEntries(
         // TODO
-        Object.entries(u).filter(
-          ([a, p]) => p !== void 0
+        Object.entries(g).filter(
+          ([a, d]) => d !== void 0
         )
       );
     });
     const I = y(
       s.value.store,
       (e) => e.isSubmitting
-    ), g = $(
+    ), v = $(
       s.value,
       o.subscribe
     ), M = y(
       s.value.store,
       (e) => e.submissionAttempts
-    ), d = l(() => s.value.useStore((e) => e.errors));
+    ), c = u(() => s.value.useStore((e) => e.errors));
     return S(
-      () => [s.value.filterItems, d.value.value],
+      () => [s.value.filterItems, c.value.value],
       () => {
-        const e = s.value.filterItems, r = d.value.value;
+        const e = s.value.filterItems, r = c.value.value;
         return e ? r ? (Object.values(r).filter(
           (t) => !!t
         ).flatMap(
@@ -105,18 +105,18 @@ Props will overwrite existing form options. This might indicate a configuration
           });
         }), {}) : {} : {};
       }
-    ), A(M, d.value, o.showErrorsOn), (e, r) => (h(), O("form", {
+    ), A(M, c.value, o.showErrorsOn), (e, r) => (h(), O("form", {
       novalidate: "",
       onSubmit: r[0] || (r[0] = C((n) => s.value.handleSubmit(), ["prevent", "stop"]))
     }, [
       V("fieldset", { disabled: m(I) }, [
         o.form ? (h(), O(_, { key: 0 }, [
-          b(e.$slots, "externalForm", { subscribedValues: m(g) }, void 0, !0),
-          b(e.$slots, "default", {}, void 0, !0)
-        ], 64)) : m(c) ? b(e.$slots, "internalForm", {
+          p(e.$slots, "externalForm", { subscribedValues: m(v) }, void 0, !0),
+          p(e.$slots, "default", {}, void 0, !0)
+        ], 64)) : m(f) ? p(e.$slots, "internalForm", {
           key: 1,
-          form: m(c),
-          subscribedValues: m(g)
+          form: m(f),
+          subscribedValues: m(v)
         }, void 0, !0) : k("", !0)
       ], 8, P)
     ], 32));

package/dist/vue-components.es26.js

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

package/dist/vue-components.es27.js

@@ -1,13 +1,92 @@
-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 i=document.createElement("style");if(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;appearance:none;box-shadow:none;display:block;min-width:auto;height:auto;padding:.5em .5em .5em 1em}")),document.head.appendChild(i),window.customElements){const e=window.customElements.define;window.customElements.define=function(s,t){const n=t.prototype.connectedCallback;return t.prototype.connectedCallback=function(){if(n&&n.call(this),this.shadowRoot){const a=document.createElement("style");a.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;appearance:none;box-shadow:none;display:block;min-width:auto;height:auto;padding:.5em .5em .5em 1em}")),this.shadowRoot.appendChild(a)}},e.call(window.customElements,s,t)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+import { defineComponent as w, getCurrentInstance as x, useId as C, computed as a, watch as f, nextTick as N, onMounted as d, ref as $, watchEffect as k, renderSlot as B, normalizeProps as I, guardReactiveProps as O, createElementVNode as _, normalizeClass as q, createBlock as L, createCommentVNode as P, unref as F, openBlock as S, mergeProps as T } from "vue";
+import { useStore as z } from "@tanstack/vue-form";
+import { useOmegaErrors as A } from "./vue-components.es8.js";
+import D from "./vue-components.es48.js";
+
+const J = /* @__PURE__ */ w({
+  inheritAttrs: !1,
+  __name: "OmegaInternalInput",
+  props: {
+    field: {},
+    meta: {},
+    label: {},
+    options: {},
+    type: {},
+    validators: {}
+  },
+  setup(c) {
+    const e = c, v = x()?.appContext.components.VTextField, l = C(), o = e.field, r = z(o.store, (t) => t), m = a(() => e.type ? e.type : e.meta?.type === "string" ? e.meta.format === "email" ? "email" : "string" : e.meta?.type || "unknown"), n = a(() => r.value.value), g = a(
+      () => (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        r.value.meta.errors.map((t) => t?.message).filter(Boolean)
+      )
+    ), y = (t) => t == null || t === !1 || t === "" || Number.isNaN(t);
+    f(
+      () => !!n.value,
+      () => {
+        y(n.value) && e.meta?.type !== "boolean" && N(() => {
+          o.setValue(
+            e.meta?.nullableOrUndefined === "undefined" ? void 0 : null
+          );
+        });
+      }
+    ), d(() => {
+      !n.value && !e.meta?.required && e.meta?.nullableOrUndefined === "null" && o.setValue(null);
+    });
+    const { addError: h, removeError: b, showErrors: E, showErrorsOn: V } = A(), s = $(!1);
+    k(() => {
+      (E.value || V === "onChange") && (s.value = !0);
+    });
+    const u = () => {
+      s.value = !0;
+    };
+    d(() => {
+      n.value && u();
+    });
+    const p = a(() => !s.value && m.value !== "select" ? [] : g.value);
+    f(
+      () => r.value.meta.errors,
+      () => {
+        r.value.meta.errors.length ? h({
+          inputId: l,
+          errors: r.value.meta.errors.map((t) => t.message).filter(Boolean),
+          label: e.label
+        }) : b(l);
+      }
+    );
+    const i = a(() => ({
+      id: l,
+      required: e.meta?.required,
+      minLength: e.meta?.type === "string" && e.meta?.minLength,
+      maxLength: e.meta?.type === "string" && e.meta?.maxLength,
+      max: e.meta?.type === "number" && e.meta?.maximum,
+      min: e.meta?.type === "number" && e.meta?.minimum,
+      name: e.field.name,
+      modelValue: e.field.state.value,
+      errorMessages: p.value,
+      error: !!p.value.length,
+      field: e.field,
+      setRealDirty: u,
+      type: m.value,
+      label: `${e.label}${e.meta?.required ? " *" : ""}`,
+      options: e.options
+    }));
+    return (t, R) => B(t.$slots, "default", I(O(i.value)), () => [
+      _("div", {
+        class: q(t.$attrs.class),
+        onFocusout: u
+      }, [
+        F(v) ? (S(), L(D, T({
+          key: 0,
+          "input-props": i.value
+        }, t.$attrs, {
+          "vuetify-value": i.value.field.state.value
+        }), null, 16, ["input-props", "vuetify-value"])) : P("", !0)
+      ], 34)
+    ]);
+  }
+});
 export {
-  c as getOmegaStore
+  J as default
 };

package/dist/vue-components.es41.js

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

package/dist/vue-components.es7.js

@@ -1,6 +1,6 @@
 import { defineComponent as y, inject as h, computed as l, createBlock as s, openBlock as i, resolveDynamicComponent as M, withCtx as p, createCommentVNode as $, mergeProps as b, renderSlot as C, normalizeProps as k, guardReactiveProps as F } from "vue";
 import { generateInputStandardSchemaFromFieldMeta as A } from "./vue-components.es10.js";
-import w from "./vue-components.es26.js";
+import w from "./vue-components.es27.js";
 import { useIntl as I } from "./vue-components.es3.js";
 const z = /* @__PURE__ */ y({
   inheritAttrs: !1,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effect-app/vue-components",
-  "version": "0.23.0",
+  "version": "0.23.1",
   "peerDependencies": {
     "@mdi/js": "^7.4.47",
     "effect": "^3.17.13",
@@ -48,8 +48,8 @@
     "@tanstack/vue-form": "^1.19.5",
     "highlight.js": "^11.11.1",
     "vue3-highlightjs": "^1.0.5",
-    "@effect-app/vue": "2.65.0",
-    "effect-app": "3.3.7"
+    "effect-app": "3.3.7",
+    "@effect-app/vue": "2.65.0"
   },
   "scripts": {
     "build": "pnpm build:run",

package/src/components/OmegaForm/OmegaWrapper.vue

@@ -73,8 +73,8 @@ import { type OmegaConfig, type OmegaFormReturn, useOmegaForm } from "./useOmega
 
 type OnSubmit = NonNullable<FormProps<From, To>["onSubmit"]>
 type OnSubmitArg = Parameters<OnSubmit>[0]
-  type OnSubmitEmit = (value: To, meta: OnSubmitArg["meta"], formApi: OnSubmitArg["formApi"]) => void
-  type OnSubmitAwaitable = (value: To, meta: OnSubmitArg["meta"], formApi: OnSubmitArg["formApi"]) => ReturnType<OnSubmit>
+  type OnSubmitEmit = (value: To, extra: Pick<OnSubmitArg, "formApi" | "meta">) => void
+  type OnSubmitAwaitable = (value: To, extra: Pick<OnSubmitArg, "formApi" | "meta">) => ReturnType<OnSubmit>
 
 type OmegaWrapperProps =
   & {
@@ -113,9 +113,9 @@ const instance = getCurrentInstance()
 // we prefer to use the standard abstraction in Vue which separates props (going down) and event emits (going back up)
 // so if isLoading + @submit are provided, we wrap them into a Promise, so that TanStack Form can properly track the submitting state.
 // we use this approach because it means we can keep relying on the built-in beaviour of TanStack Form, and we dont have to re-implement/keep in sync/break any internals.
-const eventOnSubmit: OnSubmitAwaitable = (value, meta, formApi) =>
+const eventOnSubmit: OnSubmitAwaitable = (value, extra) =>
   new Promise<void>((resolve) => {
-    instance!.emit("submit", value, meta, formApi)
+    instance!.emit("submit", value, extra)
     // even if the emit would be immediately handled, prop changes are not published/received immediately.
     // so we have to wait for the prop to change to true, and back to false again.
     const handle = watch(() => props.isLoading, (v) => {
@@ -133,7 +133,7 @@ const onSubmit_ = typeof props.isLoading !== "undefined"
   ? computed(() => props.onSubmit)
   : undefined
 
-const onSubmitHandler = onSubmit_?.value ? ({formApi, meta, value }: OnSubmitArg) => onSubmit_!.value!(value, meta, formApi) : undefined
+const onSubmitHandler = onSubmit_?.value ? ({formApi, meta, value }: OnSubmitArg) => onSubmit_!.value!(value, { meta, formApi }) : undefined
 
 const localForm = props.form || !props.schema
   ? undefined