@effect-app/vue-components 0.6.2 → 0.6.3

package/dist/types/components/OmegaForm/OmegaFormStuff.d.ts

@@ -15,7 +15,7 @@ export type OmegaInputProps<From, To> = {
     }[];
     type?: TypeOverride;
 };
-export type TypeOverride = "string" | "text" | "number" | "select" | "multiple" | "boolean" | "autocomplete" | "autocompletemultiple";
+export type TypeOverride = "string" | "text" | "number" | "select" | "multiple" | "boolean" | "autocomplete" | "autocompletemultiple" | "switch";
 export interface OmegaError {
     label: string;
     inputId: string;

package/dist/vue-components.es11.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.es23.js";
+import { getOmegaStore as B } from "./vue-components.es22.js";
 import { provideOmegaErrors as C } from "./vue-components.es6.js";
 import { useOmegaForm as I } from "./vue-components.es7.js";
 const $ = ["disabled"], N = /* @__PURE__ */ w({

package/dist/vue-components.es22.js

@@ -1,100 +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 B, getCurrentInstance as L, useId as P, computed as l, 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";
-import { useStore as J } from "@tanstack/vue-form";
-import { useOmegaErrors as K } from "./vue-components.es6.js";
-import Q from "./vue-components.es25.js";
-
-const te = /* @__PURE__ */ B({
-  inheritAttrs: !1,
-  __name: "OmegaInternalInput",
-  props: {
-    field: {},
-    meta: {},
-    label: {},
-    options: {},
-    type: {},
-    validators: {}
-  },
-  setup(C) {
-    const e = C, n = L(), $ = n == null ? void 0 : n.appContext.components.VTextField, o = P(), s = e.field, a = J(s.store, (t) => t), f = l(() => {
-      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";
-    }), u = l(() => a.value.value), k = l(
-      () => (
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
-      )
-    );
-    w(
-      () => !!u.value,
-      (t) => {
-        t || S(() => {
-          var r;
-          s.setValue(
-            ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "undefined" ? void 0 : null
-          );
-        });
-      }
-    ), x(() => {
-      var t, r;
-      !u.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && s.setValue(null);
-    });
-    const { addError: I, removeError: O, showErrors: _, showErrorsOn: q } = K(), i = T(!1);
-    z(() => {
-      (_.value || q === "onChange") && (i.value = !0);
-    });
-    const m = () => {
-      i.value = !0;
-    };
-    x(() => {
-      u.value && m();
-    });
-    const d = l(() => !i.value && f.value !== "select" ? [] : k.value);
-    w(
-      () => a.value.meta.errors,
-      () => {
-        a.value.meta.errors.length ? I({
-          inputId: o,
-          errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
-          label: e.label
-        }) : O(o);
-      }
-    );
-    const p = l(() => {
-      var t, r, c, v, g, y, h, b, E, 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" && ((E = e.meta) == null ? void 0 : E.minimum),
-        name: e.field.name,
-        modelValue: e.field.state.value,
-        errorMessages: d.value,
-        error: !!d.value.length,
-        field: e.field,
-        setRealDirty: m,
-        type: f.value,
-        label: `${e.label}${(V = e.meta) != null && V.required ? " *" : ""}`,
-        options: e.options
-      };
-    });
-    return (t, r) => A(t.$slots, "default", D(F(p.value)), () => [
-      M("div", {
-        class: N(t.$attrs.class),
-        onFocusout: m
-      }, [
-        j($) ? (G(), R(Q, H({
-          key: 0,
-          "input-props": p.value
-        }, t.$attrs, {
-          "vuetify-value": p.value.field.state.value
-        }), null, 16, ["input-props", "vuetify-value"])) : U("", !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 {
-  te as default
+  c as getOmegaStore
 };

package/dist/vue-components.es23.js

@@ -1,13 +1,101 @@
-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 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";
+import { useStore as J } from "@tanstack/vue-form";
+import { useOmegaErrors as K } from "./vue-components.es6.js";
+import Q from "./vue-components.es25.js";
+
+const te = /* @__PURE__ */ B({
+  inheritAttrs: !1,
+  __name: "OmegaInternalInput",
+  props: {
+    field: {},
+    meta: {},
+    label: {},
+    options: {},
+    type: {},
+    validators: {}
+  },
+  setup(C) {
+    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(() => {
+      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";
+    }), i = n(() => a.value.value), k = n(
+      () => (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        a.value.meta.errors.map((t) => t == null ? void 0 : t.message).filter(Boolean)
+      )
+    );
+    w(
+      () => !!i.value,
+      (t) => {
+        var r;
+        !t && ((r = e.meta) == null ? void 0 : r.type) !== "boolean" && S(() => {
+          var l;
+          u.setValue(
+            ((l = e.meta) == null ? void 0 : l.nullableOrUndefined) === "undefined" ? void 0 : null
+          );
+        });
+      }
+    ), x(() => {
+      var t, r;
+      !i.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
+    });
+    const { addError: I, removeError: O, showErrors: _, showErrorsOn: q } = K(), m = T(!1);
+    z(() => {
+      (_.value || q === "onChange") && (m.value = !0);
+    });
+    const p = () => {
+      m.value = !0;
+    };
+    x(() => {
+      i.value && p();
+    });
+    const c = n(() => !m.value && d.value !== "select" ? [] : k.value);
+    w(
+      () => a.value.meta.errors,
+      () => {
+        a.value.meta.errors.length ? I({
+          inputId: s,
+          errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
+          label: e.label
+        }) : O(s);
+      }
+    );
+    const f = n(() => {
+      var t, r, l, v, g, y, h, b, E, V;
+      return {
+        id: s,
+        required: (t = e.meta) == null ? void 0 : t.required,
+        minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((l = e.meta) == null ? void 0 : l.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" && ((E = e.meta) == null ? void 0 : E.minimum),
+        name: e.field.name,
+        modelValue: e.field.state.value,
+        errorMessages: c.value,
+        error: !!c.value.length,
+        field: e.field,
+        setRealDirty: p,
+        type: d.value,
+        label: `${e.label}${(V = e.meta) != null && V.required ? " *" : ""}`,
+        options: e.options
+      };
+    });
+    return (t, r) => A(t.$slots, "default", D(F(f.value)), () => [
+      M("div", {
+        class: N(t.$attrs.class),
+        onFocusout: p
+      }, [
+        j($) ? (G(), R(Q, H({
+          key: 0,
+          "input-props": f.value
+        }, t.$attrs, {
+          "vuetify-value": f.value.field.state.value
+        }), null, 16, ["input-props", "vuetify-value"])) : U("", !0)
+      ], 34)
+    ]);
+  }
+});
 export {
-  c as getOmegaStore
+  te as default
 };

package/dist/vue-components.es24.js

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

package/dist/vue-components.es25.js

@@ -1,5 +1,5 @@
-import { defineComponent as P, resolveComponent as i, createElementBlock as g, openBlock as o, createBlock as n, createCommentVNode as l, mergeProps as s } from "vue";
-const b = /* @__PURE__ */ P({
+import { defineComponent as d, resolveComponent as s, createElementBlock as P, openBlock as o, createBlock as n, createCommentVNode as l, resolveDynamicComponent as g, mergeProps as i } from "vue";
+const b = /* @__PURE__ */ d({
   inheritAttrs: !1,
   __name: "OmegaInputVuetify",
   props: {
@@ -9,13 +9,13 @@ const b = /* @__PURE__ */ P({
   emits: ["focus", "blur"],
   setup(y) {
     return (e, r) => {
-      const a = i("v-checkbox"), u = i("v-text-field"), t = i("v-textarea"), m = i("v-select"), d = i("v-autocomplete");
-      return o(), g("div", {
+      const u = s("v-text-field"), a = s("v-textarea"), t = s("v-select"), m = s("v-autocomplete");
+      return o(), P("div", {
         class: "omega-input",
         onFocusout: r[4] || (r[4] = (p) => e.$emit("blur", p)),
         onFocusin: r[5] || (r[5] = (p) => e.$emit("focus", p))
       }, [
-        e.inputProps.type === "boolean" ? (o(), n(a, s({
+        e.inputProps.type === "boolean" || e.inputProps.type === "switch" ? (o(), n(g(e.inputProps.type === "boolean" ? "v-checkbox" : "v-switch"), i({
           key: 0,
           id: e.inputProps.id,
           name: e.inputProps.name,
@@ -27,7 +27,7 @@ const b = /* @__PURE__ */ P({
           "model-value": e.vuetifyValue,
           onChange: r[0] || (r[0] = (p) => e.inputProps.field.handleChange(p.target.checked))
         }), null, 16, ["id", "name", "label", "error-messages", "error", "model-value"])) : l("", !0),
-        e.inputProps.type === "email" || e.inputProps.type === "string" ? (o(), n(u, s({
+        e.inputProps.type === "email" || e.inputProps.type === "string" ? (o(), n(u, i({
           key: 1,
           id: e.inputProps.id,
           required: e.inputProps.required,
@@ -42,7 +42,7 @@ const b = /* @__PURE__ */ P({
           "model-value": e.vuetifyValue,
           "onUpdate:modelValue": e.inputProps.field.handleChange
         }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "error-messages", "error", "model-value", "onUpdate:modelValue"])) : l("", !0),
-        e.inputProps.type === "text" ? (o(), n(t, s({
+        e.inputProps.type === "text" ? (o(), n(a, i({
           key: 2,
           id: e.inputProps.id,
           required: e.inputProps.required,
@@ -57,7 +57,7 @@ const b = /* @__PURE__ */ P({
           "model-value": e.vuetifyValue,
           "onUpdate:modelValue": e.inputProps.field.handleChange
         }), null, 16, ["id", "required", "min-length", "max-length", "type", "name", "label", "error-messages", "error", "model-value", "onUpdate:modelValue"])) : l("", !0),
-        e.inputProps.type === "number" ? (o(), n(u, s({
+        e.inputProps.type === "number" ? (o(), n(u, i({
           key: 3,
           id: e.inputProps.id,
           required: e.inputProps.required,
@@ -74,7 +74,7 @@ const b = /* @__PURE__ */ P({
             e.inputProps.field.handleChange(Number(p));
           })
         }), null, 16, ["id", "required", "min", "max", "type", "name", "label", "error-messages", "error", "model-value"])) : l("", !0),
-        e.inputProps.type === "select" || e.inputProps.type === "multiple" ? (o(), n(m, s({
+        e.inputProps.type === "select" || e.inputProps.type === "multiple" ? (o(), n(t, i({
           key: 4,
           id: e.inputProps.id,
           clearable: e.inputProps.type === "select",
@@ -91,7 +91,7 @@ const b = /* @__PURE__ */ P({
           onClear: r[2] || (r[2] = (p) => e.inputProps.field.handleChange(void 0)),
           "onUpdate:modelValue": e.inputProps.field.handleChange
         }), null, 16, ["id", "clearable", "required", "multiple", "chips", "name", "label", "items", "error-messages", "error", "model-value", "onUpdate:modelValue"])) : l("", !0),
-        e.inputProps.type === "autocomplete" || e.inputProps.type === "autocompletemultiple" ? (o(), n(d, s({
+        e.inputProps.type === "autocomplete" || e.inputProps.type === "autocompletemultiple" ? (o(), n(m, i({
           key: 5,
           id: e.inputProps.id,
           clearable: e.inputProps.type === "autocomplete",

package/dist/vue-components.es4.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.es8.js";
-import b from "./vue-components.es22.js";
+import b from "./vue-components.es23.js";
 const S = /* @__PURE__ */ i({
   inheritAttrs: !1,
   __name: "OmegaInput",

package/package.json

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

package/src/components/OmegaForm/OmegaFormStuff.ts

@@ -38,6 +38,7 @@ export type TypeOverride =
   | "boolean"
   | "autocomplete"
   | "autocompletemultiple"
+  | "switch"
 
 export interface OmegaError {
   label: string

package/src/components/OmegaForm/OmegaInputVuetify.vue

@@ -4,8 +4,9 @@
     @focusout="$emit('blur', $event)"
     @focusin="$emit('focus', $event)"
   >
-    <v-checkbox
-      v-if="inputProps.type === 'boolean'"
+    <component
+      :is="inputProps.type === 'boolean' ? 'v-checkbox' : 'v-switch'"
+      v-if="inputProps.type === 'boolean' || inputProps.type === 'switch'"
       :id="inputProps.id"
       :name="inputProps.name"
       :label="inputProps.label"

package/src/components/OmegaForm/OmegaInternalInput.vue

@@ -76,7 +76,7 @@ const errors = computed(() =>
 watch(
   () => !!fieldValue.value,
   value => {
-    if (!value) {
+    if (!value && props.meta?.type !== "boolean") {
       nextTick(() => {
         fieldApi.setValue(
           props.meta?.nullableOrUndefined === "undefined" ? undefined : null,