@effect-app/vue-components 0.7.5 → 0.7.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  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";
2
2
  import { useStore as g } from "@tanstack/vue-form";
3
- import { getOmegaStore as B } from "./vue-components.es22.js";
3
+ import { getOmegaStore as B } from "./vue-components.es25.js";
4
4
  import { provideOmegaErrors as C } from "./vue-components.es7.js";
5
5
  import { useOmegaForm as I } from "./vue-components.es8.js";
6
6
  const $ = ["disabled"], N = /* @__PURE__ */ w({
@@ -1,4 +1,4 @@
1
- import { isFunction as c } from "./vue-components.es24.js";
1
+ import { isFunction as c } from "./vue-components.es22.js";
2
2
  const s = c, t = (o) => typeof o == "object" && o !== null, i = (o) => t(o) || s(o);
3
3
  export {
4
4
  s as isFunction,
@@ -1,13 +1,4 @@
1
- import { useStore as u } from "@tanstack/vue-form";
2
- import { computed as f } from "vue";
3
- function c(o, t) {
4
- return f(() => t ? u(o.store, (n) => {
5
- const r = {};
6
- for (const e of t)
7
- r[e] = n[e];
8
- return r;
9
- }).value : {});
10
- }
1
+ const o = (n) => typeof n == "function";
11
2
  export {
12
- c as getOmegaStore
3
+ o as isFunction
13
4
  };
@@ -1,101 +1,4 @@
1
- (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)}})();
2
- import { defineComponent as B, getCurrentInstance as L, useId as P, computed as n, watch as w, nextTick as S, onMounted as x, ref as T, watchEffect as z, renderSlot as A, normalizeProps as D, guardReactiveProps as F, createElementVNode as M, normalizeClass as N, createBlock as R, createCommentVNode as U, unref as j, openBlock as G, mergeProps as H } from "vue";
3
- import { useStore as J } from "@tanstack/vue-form";
4
- import { useOmegaErrors as K } from "./vue-components.es7.js";
5
- import Q from "./vue-components.es27.js";
6
-
7
- const te = /* @__PURE__ */ B({
8
- inheritAttrs: !1,
9
- __name: "OmegaInternalInput",
10
- props: {
11
- field: {},
12
- meta: {},
13
- label: {},
14
- options: {},
15
- type: {},
16
- validators: {}
17
- },
18
- setup(C) {
19
- const e = C, o = L(), $ = o == null ? void 0 : o.appContext.components.VTextField, s = P(), u = e.field, a = J(u.store, (t) => t), d = n(() => {
20
- var t, r;
21
- 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";
22
- }), i = n(() => a.value.value), k = n(
23
- () => (
24
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
25
- a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
26
- )
27
- );
28
- w(
29
- () => !!i.value,
30
- (t) => {
31
- var r;
32
- !t && ((r = e.meta) == null ? void 0 : r.type) !== "boolean" && S(() => {
33
- var l;
34
- u.setValue(
35
- ((l = e.meta) == null ? void 0 : l.nullableOrUndefined) === "undefined" ? void 0 : null
36
- );
37
- });
38
- }
39
- ), x(() => {
40
- var t, r;
41
- !i.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
42
- });
43
- const { addError: I, removeError: O, showErrors: _, showErrorsOn: q } = K(), m = T(!1);
44
- z(() => {
45
- (_.value || q === "onChange") && (m.value = !0);
46
- });
47
- const p = () => {
48
- m.value = !0;
49
- };
50
- x(() => {
51
- i.value && p();
52
- });
53
- const c = n(() => !m.value && d.value !== "select" ? [] : k.value);
54
- w(
55
- () => a.value.meta.errors,
56
- () => {
57
- a.value.meta.errors.length ? I({
58
- inputId: s,
59
- errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
60
- label: e.label
61
- }) : O(s);
62
- }
63
- );
64
- const f = n(() => {
65
- var t, r, l, v, g, y, h, b, E, V;
66
- return {
67
- id: s,
68
- required: (t = e.meta) == null ? void 0 : t.required,
69
- minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((l = e.meta) == null ? void 0 : l.minLength),
70
- maxLength: ((v = e.meta) == null ? void 0 : v.type) === "string" && ((g = e.meta) == null ? void 0 : g.maxLength),
71
- max: ((y = e.meta) == null ? void 0 : y.type) === "number" && ((h = e.meta) == null ? void 0 : h.maximum),
72
- min: ((b = e.meta) == null ? void 0 : b.type) === "number" && ((E = e.meta) == null ? void 0 : E.minimum),
73
- name: e.field.name,
74
- modelValue: e.field.state.value,
75
- errorMessages: c.value,
76
- error: !!c.value.length,
77
- field: e.field,
78
- setRealDirty: p,
79
- type: d.value,
80
- label: `${e.label}${(V = e.meta) != null && V.required ? " *" : ""}`,
81
- options: e.options
82
- };
83
- });
84
- return (t, r) => A(t.$slots, "default", D(F(f.value)), () => [
85
- M("div", {
86
- class: N(t.$attrs.class),
87
- onFocusout: p
88
- }, [
89
- j($) ? (G(), R(Q, H({
90
- key: 0,
91
- "input-props": f.value
92
- }, t.$attrs, {
93
- "vuetify-value": f.value.field.state.value
94
- }), null, 16, ["input-props", "vuetify-value"])) : U("", !0)
95
- ], 34)
96
- ]);
97
- }
98
- });
1
+ import f from "./vue-components.es21.js";
99
2
  export {
100
- te as default
3
+ f as default
101
4
  };
@@ -1,4 +1,101 @@
1
- const o = (n) => typeof n == "function";
1
+ (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)}})();
2
+ import { defineComponent as q, getCurrentInstance as L, useId as P, computed as l, watch as w, nextTick as F, onMounted as x, ref as S, watchEffect as T, renderSlot as z, normalizeProps as A, guardReactiveProps as D, createElementVNode as M, normalizeClass as R, createBlock as U, createCommentVNode as Z, unref as j, openBlock as G, mergeProps as H } from "vue";
3
+ import { useStore as J } from "@tanstack/vue-form";
4
+ import { useOmegaErrors as K } from "./vue-components.es7.js";
5
+ import Q from "./vue-components.es27.js";
6
+
7
+ const re = /* @__PURE__ */ q({
8
+ inheritAttrs: !1,
9
+ __name: "OmegaInternalInput",
10
+ props: {
11
+ field: {},
12
+ meta: {},
13
+ label: {},
14
+ options: {},
15
+ type: {},
16
+ validators: {}
17
+ },
18
+ setup(C) {
19
+ const t = C, o = L(), N = o == null ? void 0 : o.appContext.components.VTextField, s = P(), u = t.field, a = J(u.store, (e) => e), d = l(() => {
20
+ var e, r;
21
+ return t.type ? t.type : ((e = t.meta) == null ? void 0 : e.type) === "string" ? t.meta.format === "email" ? "email" : "string" : ((r = t.meta) == null ? void 0 : r.type) || "unknown";
22
+ }), i = l(() => a.value.value), $ = l(
23
+ () => (
24
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
25
+ a.value.meta.errors.map((e) => e == null ? void 0 : e.message).filter(Boolean)
26
+ )
27
+ ), k = (e) => e == null || e === !1 || e === "" || Number.isNaN(e);
28
+ w(
29
+ () => !!i.value,
30
+ (e) => {
31
+ var r;
32
+ k(e) && ((r = t.meta) == null ? void 0 : r.type) !== "boolean" && F(() => {
33
+ var n;
34
+ u.setValue(
35
+ ((n = t.meta) == null ? void 0 : n.nullableOrUndefined) === "undefined" ? void 0 : null
36
+ );
37
+ });
38
+ }
39
+ ), x(() => {
40
+ var e, r;
41
+ !i.value && !((e = t.meta) != null && e.required) && ((r = t.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
42
+ });
43
+ const { addError: B, removeError: I, showErrors: O, showErrorsOn: _ } = K(), m = S(!1);
44
+ T(() => {
45
+ (O.value || _ === "onChange") && (m.value = !0);
46
+ });
47
+ const p = () => {
48
+ m.value = !0;
49
+ };
50
+ x(() => {
51
+ i.value && p();
52
+ });
53
+ const c = l(() => !m.value && d.value !== "select" ? [] : $.value);
54
+ w(
55
+ () => a.value.meta.errors,
56
+ () => {
57
+ a.value.meta.errors.length ? B({
58
+ inputId: s,
59
+ errors: a.value.meta.errors.map((e) => e.message).filter(Boolean),
60
+ label: t.label
61
+ }) : I(s);
62
+ }
63
+ );
64
+ const f = l(() => {
65
+ var e, r, n, v, g, y, h, b, E, V;
66
+ return {
67
+ id: s,
68
+ required: (e = t.meta) == null ? void 0 : e.required,
69
+ minLength: ((r = t.meta) == null ? void 0 : r.type) === "string" && ((n = t.meta) == null ? void 0 : n.minLength),
70
+ maxLength: ((v = t.meta) == null ? void 0 : v.type) === "string" && ((g = t.meta) == null ? void 0 : g.maxLength),
71
+ max: ((y = t.meta) == null ? void 0 : y.type) === "number" && ((h = t.meta) == null ? void 0 : h.maximum),
72
+ min: ((b = t.meta) == null ? void 0 : b.type) === "number" && ((E = t.meta) == null ? void 0 : E.minimum),
73
+ name: t.field.name,
74
+ modelValue: t.field.state.value,
75
+ errorMessages: c.value,
76
+ error: !!c.value.length,
77
+ field: t.field,
78
+ setRealDirty: p,
79
+ type: d.value,
80
+ label: `${t.label}${(V = t.meta) != null && V.required ? " *" : ""}`,
81
+ options: t.options
82
+ };
83
+ });
84
+ return (e, r) => z(e.$slots, "default", A(D(f.value)), () => [
85
+ M("div", {
86
+ class: R(e.$attrs.class),
87
+ onFocusout: p
88
+ }, [
89
+ j(N) ? (G(), U(Q, H({
90
+ key: 0,
91
+ "input-props": f.value
92
+ }, e.$attrs, {
93
+ "vuetify-value": f.value.field.state.value
94
+ }), null, 16, ["input-props", "vuetify-value"])) : Z("", !0)
95
+ ], 34)
96
+ ]);
97
+ }
98
+ });
2
99
  export {
3
- o as isFunction
100
+ re as default
4
101
  };
@@ -1,4 +1,13 @@
1
- import f from "./vue-components.es21.js";
1
+ import { useStore as u } from "@tanstack/vue-form";
2
+ import { computed as f } from "vue";
3
+ function c(o, t) {
4
+ return f(() => t ? u(o.store, (n) => {
5
+ const r = {};
6
+ for (const e of t)
7
+ r[e] = n[e];
8
+ return r;
9
+ }).value : {});
10
+ }
2
11
  export {
3
- f as default
12
+ c as getOmegaStore
4
13
  };
@@ -1,4 +1,4 @@
1
- import f from "./vue-components.es23.js";
1
+ import f from "./vue-components.es24.js";
2
2
  export {
3
3
  f as default
4
4
  };
@@ -1,6 +1,6 @@
1
1
  import { defineComponent as d, inject as f, computed as r, createBlock as n, openBlock as l, resolveDynamicComponent as v, withCtx as m, createCommentVNode as c, mergeProps as h, renderSlot as y, normalizeProps as g, guardReactiveProps as C } from "vue";
2
2
  import { generateInputStandardSchemaFromFieldMeta as b } from "./vue-components.es9.js";
3
- import k from "./vue-components.es23.js";
3
+ import k from "./vue-components.es24.js";
4
4
  const $ = /* @__PURE__ */ d({
5
5
  inheritAttrs: !1,
6
6
  __name: "OmegaInput",
@@ -1,6 +1,6 @@
1
- import { defineComponent as c, onMounted as g, watch as M, computed as F, provide as h, createBlock as p, openBlock as m, resolveDynamicComponent as i, withCtx as l, createElementBlock as _, renderSlot as u, Fragment as k, renderList as v, mergeProps as A, normalizeProps as S, guardReactiveProps as $ } from "vue";
2
- import { createMeta as B } from "./vue-components.es9.js";
3
- const w = /* @__PURE__ */ c({
1
+ import { defineComponent as g, onMounted as c, computed as M, provide as F, createBlock as p, openBlock as m, resolveDynamicComponent as i, withCtx as l, createElementBlock as _, renderSlot as u, Fragment as h, renderList as k, mergeProps as v, normalizeProps as A, guardReactiveProps as S } from "vue";
2
+ import { createMeta as $ } from "./vue-components.es9.js";
3
+ const P = /* @__PURE__ */ g({
4
4
  inheritAttrs: !1,
5
5
  __name: "OmegaArray",
6
6
  props: {
@@ -9,59 +9,54 @@ const w = /* @__PURE__ */ c({
9
9
  items: {}
10
10
  },
11
11
  setup(f) {
12
- const r = f;
13
- g(() => {
14
- r.items && r.form.setFieldValue(r.name, r.items);
15
- }), M(
16
- () => r.items,
17
- async (e) => {
18
- e && r.form.setFieldValue(r.name, e);
19
- }
20
- );
21
- const d = F(() => {
22
- const e = r.form.meta[r.name];
12
+ const n = f;
13
+ c(() => {
14
+ n.items && n.form.setFieldValue(n.name, n.items);
15
+ });
16
+ const d = M(() => {
17
+ const e = n.form.meta[n.name];
23
18
  if (e && e.type === "multiple") {
24
- const o = e.rest.reduce((t, a) => a.type._tag === "TypeLiteral" ? {
19
+ const o = e.rest.reduce((t, r) => r.type._tag === "TypeLiteral" ? {
25
20
  ...t,
26
21
  propertySignatures: [
27
22
  ...t.propertySignatures || [],
28
- ...a.type.propertySignatures
23
+ ...r.type.propertySignatures
29
24
  ]
30
25
  } : {
31
26
  ...t,
32
- property: a.type
33
- }, {}), n = B({ ...o, meta: e });
27
+ property: r.type
28
+ }, {}), a = $({ ...o, meta: e });
34
29
  return (t) => {
35
- if (t.endsWith("]")) return n;
36
- const a = t.split("]."), s = a[a.length - 1];
37
- return n[s];
30
+ if (t.endsWith("]")) return a;
31
+ const r = t.split("]."), s = r[r.length - 1];
32
+ return a[s];
38
33
  };
39
34
  }
40
35
  return (o) => {
41
36
  };
42
37
  });
43
- return h("getMetaFromArray", d), (e, o) => (m(), p(i(e.form.Field), { name: e.name }, {
44
- default: l(({ field: n }) => [
45
- (m(!0), _(k, null, v(n.state.value, (y, t) => (m(), p(i(e.form.Field), {
38
+ return F("getMetaFromArray", d), (e, o) => (m(), p(i(e.form.Field), { name: e.name }, {
39
+ default: l(({ field: a }) => [
40
+ (m(!0), _(h, null, k(a.state.value, (y, t) => (m(), p(i(e.form.Field), {
46
41
  key: t,
47
42
  name: `${e.name}[${t}]`
48
43
  }, {
49
- default: l(({ field: a, state: s }) => [
50
- u(e.$slots, "default", A({ ref_for: !0 }, {
51
- field: n,
52
- subField: a,
44
+ default: l(({ field: r, state: s }) => [
45
+ u(e.$slots, "default", v({ ref_for: !0 }, {
46
+ field: a,
47
+ subField: r,
53
48
  subState: s,
54
49
  index: t
55
50
  }))
56
51
  ]),
57
52
  _: 2
58
53
  }, 1032, ["name"]))), 128)),
59
- u(e.$slots, "field", S($({ field: n })))
54
+ u(e.$slots, "field", A(S({ field: a })))
60
55
  ]),
61
56
  _: 3
62
57
  }, 8, ["name"]));
63
58
  }
64
59
  });
65
60
  export {
66
- w as default
61
+ P as default
67
62
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@effect-app/vue-components",
3
- "version": "0.7.5",
3
+ "version": "0.7.7",
4
4
  "peerDependencies": {
5
5
  "@mdi/js": "^7.4.47",
6
6
  "@tanstack/vue-form": "^1.2.4",
@@ -24,7 +24,7 @@
24
24
  </template>
25
25
 
26
26
  <script setup lang="ts" generic="From, To">
27
- import { computed, onMounted, provide, watch } from "vue"
27
+ import { computed, onMounted, provide } from "vue"
28
28
  import {
29
29
  type CreateMeta,
30
30
  type OmegaInputProps,
@@ -51,15 +51,6 @@ onMounted(() => {
51
51
  }
52
52
  })
53
53
 
54
- watch(
55
- () => props.items,
56
- async items => {
57
- if (items) {
58
- props.form.setFieldValue(props.name as any, items)
59
- }
60
- },
61
- )
62
-
63
54
  const getMetaFromArray = computed(() => {
64
55
  const inputMeta = props.form.meta[props.name]
65
56
  if (inputMeta && inputMeta.type === "multiple") {
@@ -71,12 +71,16 @@ const errors = computed(() =>
71
71
  fieldState.value.meta.errors.map((e: any) => e?.message).filter(Boolean),
72
72
  )
73
73
 
74
+ const isFalsyButNotZero = (value: unknown): boolean => {
75
+ return value == null || value === false || value === "" || Number.isNaN(value)
76
+ }
77
+
74
78
  // we remove value and errors when the field is empty and not required
75
79
  //watchEffect will trigger infinite times with both free fieldValue and errors, so bet to watch a stupid boolean
76
80
  watch(
77
81
  () => !!fieldValue.value,
78
82
  value => {
79
- if (!value && props.meta?.type !== "boolean") {
83
+ if (isFalsyButNotZero(value) && props.meta?.type !== "boolean") {
80
84
  nextTick(() => {
81
85
  fieldApi.setValue(
82
86
  props.meta?.nullableOrUndefined === "undefined" ? undefined : null,