@effect-app/vue-components 0.15.1 → 0.15.3

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

@@ -12,6 +12,7 @@ declare const _default: <From extends Record<PropertyKey, any>, To extends Recor
             subField: import("@tanstack/vue-form").FieldApi<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | 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").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined>;
             subState: import("@tanstack/vue-form").FieldState<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | 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>;
             index: number;
+            field: import("@tanstack/vue-form").FieldApi<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | undefined, import("@tanstack/vue-form").FieldAsyncValidateOrFn<From, DeepKeys<From>, DeepValue<From, DeepKeys<From>>> | 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").FormAsyncValidateOrFn<From> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<From> | undefined>;
         }) => any;
     } & {
         field?: (props: {

package/dist/vue-components.es13.js

@@ -1,6 +1,6 @@
 import { defineComponent as w, computed as f, onBeforeMount as E, watch as j, createElementBlock as v, openBlock as b, withModifiers as F, createElementVNode as M, unref as c, renderSlot as p, createCommentVNode as k, Fragment as V } from "vue";
 import { useStore as g } from "@tanstack/vue-form";
-import { getOmegaStore as B } from "./vue-components.es24.js";
+import { getOmegaStore as B } from "./vue-components.es25.js";
 import { provideOmegaErrors as C } from "./vue-components.es8.js";
 import { useOmegaForm as I } from "./vue-components.es9.js";
 const $ = ["disabled"], N = /* @__PURE__ */ w({

package/dist/vue-components.es24.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.es27.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.es25.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.es27.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.es26.js

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

package/dist/vue-components.es4.js

@@ -1,6 +1,6 @@
 import { defineComponent as d, inject as f, computed as r, createBlock as n, openBlock as m, resolveDynamicComponent as c, withCtx as l, createCommentVNode as v, mergeProps as y, renderSlot as g, normalizeProps as h, guardReactiveProps as b } from "vue";
 import { generateInputStandardSchemaFromFieldMeta as C } from "./vue-components.es10.js";
-import F from "./vue-components.es25.js";
+import F from "./vue-components.es24.js";
 const P = /* @__PURE__ */ d({
   inheritAttrs: !1,
   __name: "OmegaInput",

package/dist/vue-components.es7.js

@@ -1,5 +1,5 @@
-import { defineComponent as F, computed as l, onMounted as P, provide as $, createElementBlock as s, openBlock as n, Fragment as u, createBlock as d, renderList as M, resolveDynamicComponent as i, withCtx as f, renderSlot as p, mergeProps as k, normalizeProps as A, guardReactiveProps as b } from "vue";
-const B = /* @__PURE__ */ F({
+import { defineComponent as h, computed as s, onMounted as y, provide as F, createBlock as l, openBlock as o, resolveDynamicComponent as u, withCtx as d, createElementBlock as P, renderSlot as i, Fragment as $, renderList as M, mergeProps as k, normalizeProps as A, guardReactiveProps as b } from "vue";
+const C = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "OmegaArray",
   props: {
@@ -8,38 +8,37 @@ const B = /* @__PURE__ */ F({
     defaultItems: {},
     items: {}
   },
-  setup(c) {
-    const r = c, g = r.form.useStore((e) => e.values), m = l(() => r.name.replace(/\[/g, ".").replace(/\]/g, "").split(".").reduce((a, t) => a[t], g.value));
-    P(async () => {
+  setup(f) {
+    const r = f, p = r.form.useStore((e) => e.values), m = s(() => r.name.replace(/\[/g, ".").replace(/\]/g, "").split(".").reduce((a, t) => a[t], p.value));
+    y(async () => {
       r.defaultItems && !m.value && r.form.setFieldValue(r.name, r.defaultItems);
     });
-    const v = l(() => (a) => {
+    const c = s(() => (a) => {
       const t = a.replace(/\[\d+\]/g, "");
       return r.form.meta[t];
     });
-    return $("getMetaFromArray", v), (e, a) => (n(), s(u, null, [
-      (n(!0), s(u, null, M(m.value, (t, o) => (n(), d(i(e.form.Field), {
-        key: `${e.name}[${Number(o)}]`,
-        name: `${e.name}[${Number(o)}]`
-      }, {
-        default: f(({ field: h, state: y }) => [
-          p(e.$slots, "default", k({ ref_for: !0 }, {
-            subField: h,
-            subState: y,
-            index: Number(o)
-          }))
-        ]),
-        _: 2
-      }, 1032, ["name"]))), 128)),
-      (n(), d(i(e.form.Field), { name: e.name }, {
-        default: f(({ field: t }) => [
-          p(e.$slots, "field", A(b({ field: t })))
-        ]),
-        _: 3
-      }, 8, ["name"]))
-    ], 64));
+    return F("getMetaFromArray", c), (e, a) => (o(), l(u(e.form.Field), { name: e.name }, {
+      default: d(({ field: t }) => [
+        (o(!0), P($, null, M(m.value, (z, n) => (o(), l(u(e.form.Field), {
+          key: `${e.name}[${Number(n)}]`,
+          name: `${e.name}[${Number(n)}]`
+        }, {
+          default: d(({ field: g, state: v }) => [
+            i(e.$slots, "default", k({ ref_for: !0 }, {
+              subField: g,
+              subState: v,
+              index: Number(n),
+              field: t
+            }))
+          ]),
+          _: 2
+        }, 1032, ["name"]))), 128)),
+        i(e.$slots, "field", A(b({ field: t })))
+      ]),
+      _: 3
+    }, 8, ["name"]));
   }
 });
 export {
-  B as default
+  C as default
 };

package/package.json

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

package/src/components/OmegaForm/OmegaArray.vue

@@ -1,24 +1,25 @@
 <template>
-  <component
-    :is="form.Field"
-    v-for="(_, i) of items"
-    :key="`${name}[${Number(i)}]`"
-    :name="
-      `${name}[${Number(i)}]` as DeepKeys<From>
-    "
-  >
-    <template #default="{ field: subField, state: subState }">
-      <slot
-        v-bind="{
-          subField,
-          subState,
-          index: Number(i),
-        }"
-      />
-    </template>
-  </component>
   <component :is="form.Field" :name="name">
     <template #default="{ field }">
+      <component
+        :is="form.Field"
+        v-for="(_, i) of items"
+        :key="`${name}[${Number(i)}]`"
+        :name="
+          `${name}[${Number(i)}]` as DeepKeys<From>
+        "
+      >
+        <template #default="{ field: subField, state: subState }">
+          <slot
+            v-bind="{
+              subField,
+              subState,
+              index: Number(i),
+              field,
+            }"
+          />
+        </template>
+      </component>
       <slot name="field" v-bind="{ field }" />
     </template>
   </component>
@@ -32,9 +33,7 @@
   "
 >
 import { computed, onMounted, provide } from "vue"
-import {
-  type OmegaInputProps,
-} from "./OmegaFormStuff"
+import { type OmegaInputProps } from "./OmegaFormStuff"
 import { type DeepValue, type DeepKeys } from "@tanstack/vue-form"
 
 const props = defineProps<
@@ -69,11 +68,11 @@ onMounted(async () => {
 const getMetaFromArray = computed(() => {
   const getMeta = (path: string) => {
     // Transform path like 'a[0].b[11].c' into 'a.b.c'
-    const simplifiedPath = path.replace(/\[\d+\]/g, '')
+    const simplifiedPath = path.replace(/\[\d+\]/g, "")
 
     return props.form.meta[simplifiedPath as keyof typeof props.form.meta]
   }
-  
+
   return getMeta
 })