@effect-app/vue-components 2.7.2 → 2.7.4

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

@@ -13,17 +13,17 @@ declare const __VLS_export: <From extends Record<PropertyKey, any>, To extends R
     attrs: any;
     slots: {
         [x: string]: ((props: {
-            field: import("./InputProps").OmegaFieldInternalApi<From, any>;
-            state: NonNullable<import("@tanstack/vue-form").DeepValue<From, any>>;
+            field: import("./InputProps").OmegaFieldInternalApi<From, `${NonNullable<Name>}._tag` | "_tag">;
+            state: NonNullable<import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">>;
         }) => any) | undefined;
         [x: number]: ((props: {
-            field: import("./InputProps").OmegaFieldInternalApi<From, any>;
-            state: NonNullable<import("@tanstack/vue-form").DeepValue<From, any>>;
+            field: import("./InputProps").OmegaFieldInternalApi<From, `${NonNullable<Name>}._tag` | "_tag">;
+            state: NonNullable<import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">>;
         }) => any) | undefined;
     } & {
         OmegaCustomInput?: (props: {
-            field: import("@tanstack/vue-form").FieldApi<From, any, import("@tanstack/vue-form").DeepValue<From, any>, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").StandardSchemaV1<From, To>, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, Record<string, any> | undefined>;
-            state: import("@tanstack/vue-form").FieldState<From, any, import("@tanstack/vue-form").DeepValue<From, any>, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, any, import("@tanstack/vue-form").DeepValue<From, any>> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").StandardSchemaV1<From, To>, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined>;
+            field: import("@tanstack/vue-form").FieldApi<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").StandardSchemaV1<From, To>, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, Record<string, any> | undefined>;
+            state: import("@tanstack/vue-form").FieldState<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, `${NonNullable<Name>}._tag` | "_tag", import("@tanstack/vue-form").DeepValue<From, `${NonNullable<Name>}._tag` | "_tag">> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").StandardSchemaV1<From, To>, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined>;
         }) => any;
     } & {
         default?: (props: {}) => any;

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

@@ -1,10 +1,12 @@
 import { type DeepKeys, type DeepValue } from "@tanstack/vue-form";
 import { type OmegaFieldInternalApi } from "./InputProps";
+import { type useOmegaForm } from "./useOmegaForm";
 declare const __VLS_export: <From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>, Name extends DeepKeys<From>>(__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<{
         state: DeepValue<From, Name>;
         field: OmegaFieldInternalApi<From, Name>;
         name?: DeepKeys<From>;
+        form: ReturnType<typeof useOmegaForm<From, To>>;
     }> & import("vue").PublicProps;
     expose: (exposed: {}) => void;
     attrs: any;

package/dist/vue-components.es10.js

@@ -1,5 +1,5 @@
 import { useForm as Y } from "@tanstack/vue-form";
-import { Data as C, S as v, Effect as S, Fiber as j, Option as V, Array as A } from "effect-app";
+import { Data as C, S as v, Effect as S, Array as g, Fiber as j, Option as V } from "effect-app";
 import { runtimeFiberAsPromise as ee } from "./vue-components.es16.js";
 import { isObject as te } from "./vue-components.es17.js";
 import { computed as I, onUnmounted as J, onMounted as re, onBeforeUnmount as ne, watch as K, ref as se, h as Z } from "vue";
@@ -37,8 +37,8 @@ const k = (f) => {
       const u = d.type;
       let m = u;
       if (u._tag === "TypeLiteral" || u._tag === "Union" || u._tag === "Transformation") {
-        const E = v.make(u);
-        m = k(E).ast;
+        const A = v.make(u);
+        m = k(A).ast;
       }
       return {
         ...d,
@@ -67,8 +67,8 @@ const D = (f) => function(o) {
 }, me = (f) => function(o) {
   return {
     setup() {
-      const { fieldMap: p, form: d } = f, u = d.useStore((y) => y.errors), m = d.useStore((y) => y.fieldMeta), E = d.useStore((y) => y.errorMap), b = I(() => {
-        const y = A.filterMap(
+      const { fieldMap: p, form: d } = f, u = d.useStore((y) => y.errors), m = d.useStore((y) => y.fieldMeta), A = d.useStore((y) => y.errorMap), b = I(() => {
+        const y = g.filterMap(
           Object.entries(m.value),
           ([U, h]) => {
             const _ = h.errors ?? [];
@@ -82,12 +82,12 @@ const D = (f) => function(o) {
             }) : V.none();
           }
         ), F = [];
-        if (E.value.onSubmit) {
-          for (const [U, h] of Object.entries(E.value.onSubmit))
-            if (A.isArray(h) && h.length)
+        if (A.value.onSubmit) {
+          for (const [U, h] of Object.entries(A.value.onSubmit))
+            if (g.isArray(h) && h.length)
               for (const _ of h) {
                 const i = _;
-                if (i?.path && A.isArray(i.path) && i.path.length) {
+                if (i?.path && g.isArray(i.path) && i.path.length) {
                   const M = i.path.join(".");
                   if (!p.value.has(M)) {
                     F.push({
@@ -122,7 +122,7 @@ const D = (f) => function(o) {
       return o.persistency.id;
     const e = window.location.pathname, t = Object.keys(u);
     return `${e}-${t.join("-")}`;
-  }), E = () => {
+  }), A = () => {
     const e = new URLSearchParams(window.location.search);
     e.delete(m.value);
     const t = new URL(window.location.href);
@@ -130,13 +130,13 @@ const D = (f) => function(o) {
   };
   function b(e, t) {
     for (const r in t)
-      t[r] && te(t[r]) ? (e[r] || (e[r] = {}), b(e[r], t[r])) : e[r] = t[r];
+      g.isArray(t[r]) ? e[r] = t[r] : t[r] && te(t[r]) ? (e[r] || (e[r] = {}), b(e[r], t[r])) : e[r] = t[r];
     return e;
   }
   const y = (e) => {
     if (!e) return;
-    const t = { ...e }, r = (s, a) => a.split(".").reduce((l, g) => l?.[g], s), n = (s, a, l) => {
-      const g = a.split("."), N = g.pop(), X = g.reduce((L, O) => (L[O] || (L[O] = {}), L[O]), s);
+    const t = { ...e }, r = (s, a) => a.split(".").reduce((l, E) => l?.[E], s), n = (s, a, l) => {
+      const E = a.split("."), N = E.pop(), X = E.reduce((L, O) => (L[O] || (L[O] = {}), L[O]), s);
       X[N] = l;
     };
     for (const s in u) {
@@ -152,11 +152,11 @@ const D = (f) => function(o) {
       } catch {
       }
     const r = e?.members || (e?.ast?._tag === "Union" && e.ast.types ? e.ast.types.map((n) => v.make(n)) : null);
-    if (r && A.isArray(r)) {
+    if (r && g.isArray(r)) {
       for (const n of r) {
         const s = F(n);
         if (Object.keys(s).length > 0 && n?.fields && Object.entries(n.fields).some(
-          ([l, g]) => l === "_tag" || l === "type" || l === "kind" ? g?.ast?.defaultValue !== void 0 : !1
+          ([l, E]) => l === "_tag" || l === "type" || l === "kind" ? E?.ast?.defaultValue !== void 0 : !1
         ))
           return s;
       }
@@ -210,7 +210,7 @@ const D = (f) => function(o) {
     if (t?.policies && t.policies.includes("querystring"))
       try {
         const n = new URLSearchParams(window.location.search).get(m.value);
-        E(), n && (e = b(e || {}, JSON.parse(n)));
+        A(), n && (e = b(e || {}, JSON.parse(n)));
       } catch (r) {
         console.error(r);
       }
@@ -250,9 +250,9 @@ const D = (f) => function(o) {
     return n.reduce((s, a, l) => (l === n.length - 1 ? s[a] = i.getFieldValue(r) : s[a] = s[a] ?? {}, s[a]), t), t;
   }, {}), R = (e) => {
     if (e) {
-      if (A.isArray(e.keys))
+      if (g.isArray(e.keys))
         return $(e.keys);
-      if (A.isArray(e.banKeys)) {
+      if (g.isArray(e.banKeys)) {
         const t = Object.keys(u).filter((r) => e.banKeys?.includes(r));
         return $(t);
       }

package/dist/vue-components.es8.js

@@ -1,4 +1,4 @@
-import { defineComponent as d, createBlock as u, openBlock as g, unref as l, withCtx as o, renderSlot as n, createVNode as r, createCommentVNode as c, normalizeProps as s, guardReactiveProps as f, createSlots as $, renderList as y } from "vue";
+import { defineComponent as d, createBlock as u, openBlock as g, unref as l, withCtx as o, renderSlot as n, createVNode as f, createCommentVNode as c, normalizeProps as r, guardReactiveProps as s, createSlots as $, renderList as y } from "vue";
 import C from "./vue-components.es9.js";
 const h = /* @__PURE__ */ d({
   __name: "OmegaTaggedUnion",
@@ -14,8 +14,8 @@ const h = /* @__PURE__ */ d({
       name: e.name ? `${e.name}._tag` : "_tag"
     }, {
       default: o((t) => [
-        n(a.$slots, "OmegaCustomInput", s(f(t)), () => [
-          r(l(e.form).Input, {
+        n(a.$slots, "OmegaCustomInput", r(s(t)), () => [
+          f(l(e.form).Input, {
             name: e.name ? `${e.name}._tag` : "_tag",
             label: e.label,
             type: e.type ?? "select",
@@ -23,18 +23,19 @@ const h = /* @__PURE__ */ d({
           }, null, 8, ["name", "label", "type", "options"])
         ]),
         n(a.$slots, "default"),
-        r(C, {
+        f(C, {
           field: t.field,
           state: t.state.value,
-          name: e.name
+          name: e.name,
+          form: e.form
         }, $({ _: 2 }, [
           y(a.$slots, (k, m) => ({
             name: m,
             fn: o((i) => [
-              n(a.$slots, m, s(f(i)))
+              n(a.$slots, m, r(s(i)))
             ])
           }))
-        ]), 1032, ["field", "state", "name"]),
+        ]), 1032, ["field", "state", "name", "form"]),
         t.state.value ? n(a.$slots, "OmegaCommon", { key: 0 }) : c("", !0)
       ]),
       _: 3

package/dist/vue-components.es9.js

@@ -1,20 +1,21 @@
-import { defineComponent as l, watch as i, renderSlot as m, createCommentVNode as s, normalizeProps as o, mergeProps as r } from "vue";
-const f = /* @__PURE__ */ l({
+import { defineComponent as s, watch as m, renderSlot as o, createCommentVNode as r, normalizeProps as f, mergeProps as i } from "vue";
+const d = /* @__PURE__ */ s({
   __name: "OmegaTaggedUnionInternal",
   props: {
     state: {},
     field: {},
-    name: {}
+    name: {},
+    form: {}
   },
   setup(e) {
-    const a = e;
-    return i(() => a.state, (t, n) => {
-      t === null && a.field.setValue(null), t !== n && setTimeout(() => {
+    const a = e, l = a.form.useStore(({ values: t }) => t);
+    return m(() => a.state, (t, n) => {
+      t === null && a.field.setValue(null), t !== n && (a.form.reset(l.value), setTimeout(() => {
         a.field.validate("change");
-      }, 0);
-    }), (t, n) => e.state ? m(t.$slots, `${e.name ? `${e.name}.` : ""}${e.state}`, o(r({ key: 0 }, { field: e.field, state: e.state }))) : s("", !0);
+      }, 0));
+    }), (t, n) => e.state ? o(t.$slots, `${e.name ? `${e.name}.` : ""}${e.state}`, f(i({ key: 0 }, { field: e.field, state: e.state }))) : r("", !0);
   }
 });
 export {
-  f as default
+  d as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effect-app/vue-components",
-  "version": "2.7.2",
+  "version": "2.7.4",
   "peerDependencies": {
     "@mdi/js": "^7.4.47",
     "effect": "^3.18.0",
@@ -53,8 +53,8 @@
     "highlight.js": "^11.11.1",
     "mitt": "^3.0.1",
     "vue3-highlightjs": "^1.0.5",
-    "@effect-app/vue": "2.92.2",
-    "effect-app": "3.12.0"
+    "effect-app": "3.12.0",
+    "@effect-app/vue": "2.92.2"
   },
   "scripts": {
     "build": "pnpm build:run",

package/src/components/OmegaForm/OmegaTaggedUnion.vue

@@ -23,7 +23,7 @@ defineProps<{
 </script>
 
 <template>
-  <form.Field :name="(name ? `${name}._tag` : '_tag') as any">
+  <form.Field :name="name ? `${name}._tag` : '_tag'">
     <template #default="inputProps">
       <slot
         name="OmegaCustomInput"
@@ -41,6 +41,7 @@ defineProps<{
         :field="inputProps.field as any"
         :state="inputProps.state.value"
         :name="name"
+        :form="form"
       >
         <template
           v-for="(_, slotname) in $slots"

package/src/components/OmegaForm/OmegaTaggedUnionInternal.vue

@@ -18,19 +18,24 @@
 import { type DeepKeys, type DeepValue } from "@tanstack/vue-form"
 import { watch } from "vue"
 import { type OmegaFieldInternalApi } from "./InputProps"
+import { type useOmegaForm } from "./useOmegaForm"
 
 const props = defineProps<{
   state: DeepValue<From, Name>
   field: OmegaFieldInternalApi<From, Name>
   name?: DeepKeys<From>
+  form: ReturnType<typeof useOmegaForm<From, To>>
 }>()
 
+const values = props.form.useStore(({ values }) => values)
+
 // Watch for _tag changes
 watch(() => props.state, (newTag, oldTag) => {
   if (newTag === null) {
     props.field.setValue(null as DeepValue<From, Name>)
   }
   if (newTag !== oldTag) {
+    props.form.reset(values.value)
     setTimeout(() => {
       props.field.validate("change")
     }, 0)

package/src/components/OmegaForm/useOmegaForm.ts

@@ -743,7 +743,10 @@ export const useOmegaForm = <
 
   function deepMerge(target: any, source: any) {
     for (const key in source) {
-      if (source[key] && isObject(source[key])) {
+      if (Array.isArray(source[key])) {
+        // Arrays should be copied directly, not deep merged
+        target[key] = source[key]
+      } else if (source[key] && isObject(source[key])) {
         if (!target[key]) {
           target[key] = {}
         }