@effect-app/vue-components 0.13.0 → 0.13.2
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.
- package/dist/types/components/OmegaForm/useOmegaForm.d.ts +25 -3
- package/dist/vue-components.es13.js +1 -1
- package/dist/vue-components.es22.js +1 -1
- package/dist/vue-components.es23.js +2 -90
- package/dist/vue-components.es24.js +90 -11
- package/dist/vue-components.es25.js +11 -2
- package/dist/vue-components.es26.js +1 -1
- package/dist/vue-components.es4.js +1 -1
- package/package.json +3 -3
- package/src/components/OmegaForm/useOmegaForm.ts +28 -2
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { DeepKeys } from "@tanstack/vue-form";
|
|
2
2
|
import { type Record, S } from "effect-app";
|
|
3
|
-
import { type NestedKeyOf, type FilterItems, type FormProps, type MetaRecord, type OmegaFormApi } from "./OmegaFormStuff";
|
|
3
|
+
import { type NestedKeyOf, type FilterItems, type FormProps, type MetaRecord, type OmegaFormApi, TypeOverride, FieldValidators } from "./OmegaFormStuff";
|
|
4
4
|
import { type InjectionKey } from "vue";
|
|
5
|
-
import
|
|
5
|
+
import { InputProps } from "./InputProps";
|
|
6
6
|
type keysRule<T> = {
|
|
7
7
|
keys?: NestedKeyOf<T>[];
|
|
8
8
|
banKeys?: "You should only use one of banKeys or keys, not both, moron";
|
|
@@ -27,8 +27,30 @@ interface OF<From, To> extends OmegaFormApi<From, To> {
|
|
|
27
27
|
clear: () => void;
|
|
28
28
|
}
|
|
29
29
|
export declare const OmegaFormKey: InjectionKey<OF<any, any>>;
|
|
30
|
+
type __VLS_PrettifyLocal<T> = {
|
|
31
|
+
[K in keyof T]: T[K];
|
|
32
|
+
} & {};
|
|
30
33
|
export interface OmegaFormReturn<From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>> extends OF<From, To> {
|
|
31
|
-
Input:
|
|
34
|
+
Input: <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<{
|
|
35
|
+
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
|
|
36
|
+
name: Name;
|
|
37
|
+
label: string;
|
|
38
|
+
validators?: FieldValidators<From>;
|
|
39
|
+
options?: {
|
|
40
|
+
title: string;
|
|
41
|
+
value: string;
|
|
42
|
+
}[];
|
|
43
|
+
type?: TypeOverride;
|
|
44
|
+
} & Partial<{}>> & import("vue").PublicProps;
|
|
45
|
+
expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
|
|
46
|
+
attrs: any;
|
|
47
|
+
slots: {
|
|
48
|
+
default(props: InputProps<From, Name>): void;
|
|
49
|
+
};
|
|
50
|
+
emit: {};
|
|
51
|
+
}>) => import("vue").VNode & {
|
|
52
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
53
|
+
};
|
|
32
54
|
}
|
|
33
55
|
export declare const useOmegaForm: <From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>>(schema: S.Schema<To, From, never>, tanstackFormOptions?: NoInfer<FormProps<From, To>>, omegaConfig?: OmegaConfig<To>) => OmegaFormReturn<From, To>;
|
|
34
56
|
export {};
|
|
@@ -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.
|
|
3
|
+
import { getOmegaStore as B } from "./vue-components.es25.js";
|
|
4
4
|
import { provideOmegaErrors as C } from "./vue-components.es8.js";
|
|
5
5
|
import { useOmegaForm as I } from "./vue-components.es9.js";
|
|
6
6
|
const $ = ["disabled"], N = /* @__PURE__ */ w({
|
|
@@ -1,92 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
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";
|
|
3
|
-
import { useStore as z } from "@tanstack/vue-form";
|
|
4
|
-
import { useOmegaErrors as A } from "./vue-components.es8.js";
|
|
5
|
-
import D from "./vue-components.es27.js";
|
|
6
|
-
|
|
7
|
-
const J = /* @__PURE__ */ w({
|
|
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, 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(
|
|
20
|
-
() => (
|
|
21
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
22
|
-
r.value.meta.errors.map((t) => t?.message).filter(Boolean)
|
|
23
|
-
)
|
|
24
|
-
), y = (t) => t == null || t === !1 || t === "" || Number.isNaN(t);
|
|
25
|
-
f(
|
|
26
|
-
() => !!n.value,
|
|
27
|
-
() => {
|
|
28
|
-
y(n.value) && e.meta?.type !== "boolean" && N(() => {
|
|
29
|
-
o.setValue(
|
|
30
|
-
e.meta?.nullableOrUndefined === "undefined" ? void 0 : null
|
|
31
|
-
);
|
|
32
|
-
});
|
|
33
|
-
}
|
|
34
|
-
), d(() => {
|
|
35
|
-
!n.value && !e.meta?.required && e.meta?.nullableOrUndefined === "null" && o.setValue(null);
|
|
36
|
-
});
|
|
37
|
-
const { addError: h, removeError: b, showErrors: E, showErrorsOn: V } = A(), s = $(!1);
|
|
38
|
-
k(() => {
|
|
39
|
-
(E.value || V === "onChange") && (s.value = !0);
|
|
40
|
-
});
|
|
41
|
-
const u = () => {
|
|
42
|
-
s.value = !0;
|
|
43
|
-
};
|
|
44
|
-
d(() => {
|
|
45
|
-
n.value && u();
|
|
46
|
-
});
|
|
47
|
-
const p = a(() => !s.value && m.value !== "select" ? [] : g.value);
|
|
48
|
-
f(
|
|
49
|
-
() => r.value.meta.errors,
|
|
50
|
-
() => {
|
|
51
|
-
r.value.meta.errors.length ? h({
|
|
52
|
-
inputId: l,
|
|
53
|
-
errors: r.value.meta.errors.map((t) => t.message).filter(Boolean),
|
|
54
|
-
label: e.label
|
|
55
|
-
}) : b(l);
|
|
56
|
-
}
|
|
57
|
-
);
|
|
58
|
-
const i = a(() => ({
|
|
59
|
-
id: l,
|
|
60
|
-
required: e.meta?.required,
|
|
61
|
-
minLength: e.meta?.type === "string" && e.meta?.minLength,
|
|
62
|
-
maxLength: e.meta?.type === "string" && e.meta?.maxLength,
|
|
63
|
-
max: e.meta?.type === "number" && e.meta?.maximum,
|
|
64
|
-
min: e.meta?.type === "number" && e.meta?.minimum,
|
|
65
|
-
name: e.field.name,
|
|
66
|
-
modelValue: e.field.state.value,
|
|
67
|
-
errorMessages: p.value,
|
|
68
|
-
error: !!p.value.length,
|
|
69
|
-
field: e.field,
|
|
70
|
-
setRealDirty: u,
|
|
71
|
-
type: m.value,
|
|
72
|
-
label: `${e.label}${e.meta?.required ? " *" : ""}`,
|
|
73
|
-
options: e.options
|
|
74
|
-
}));
|
|
75
|
-
return (t, R) => B(t.$slots, "default", I(O(i.value)), () => [
|
|
76
|
-
_("div", {
|
|
77
|
-
class: q(t.$attrs.class),
|
|
78
|
-
onFocusout: u
|
|
79
|
-
}, [
|
|
80
|
-
F(v) ? (S(), L(D, T({
|
|
81
|
-
key: 0,
|
|
82
|
-
"input-props": i.value
|
|
83
|
-
}, t.$attrs, {
|
|
84
|
-
"vuetify-value": i.value.field.state.value
|
|
85
|
-
}), null, 16, ["input-props", "vuetify-value"])) : P("", !0)
|
|
86
|
-
], 34)
|
|
87
|
-
]);
|
|
88
|
-
}
|
|
89
|
-
});
|
|
1
|
+
const o = (n) => typeof n == "function";
|
|
90
2
|
export {
|
|
91
|
-
|
|
3
|
+
o as isFunction
|
|
92
4
|
};
|
|
@@ -1,13 +1,92 @@
|
|
|
1
|
-
|
|
2
|
-
import { computed as f } from "vue";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
(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)}})();
|
|
2
|
+
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";
|
|
3
|
+
import { useStore as z } from "@tanstack/vue-form";
|
|
4
|
+
import { useOmegaErrors as A } from "./vue-components.es8.js";
|
|
5
|
+
import D from "./vue-components.es27.js";
|
|
6
|
+
|
|
7
|
+
const J = /* @__PURE__ */ w({
|
|
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, 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(
|
|
20
|
+
() => (
|
|
21
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
22
|
+
r.value.meta.errors.map((t) => t?.message).filter(Boolean)
|
|
23
|
+
)
|
|
24
|
+
), y = (t) => t == null || t === !1 || t === "" || Number.isNaN(t);
|
|
25
|
+
f(
|
|
26
|
+
() => !!n.value,
|
|
27
|
+
() => {
|
|
28
|
+
y(n.value) && e.meta?.type !== "boolean" && N(() => {
|
|
29
|
+
o.setValue(
|
|
30
|
+
e.meta?.nullableOrUndefined === "undefined" ? void 0 : null
|
|
31
|
+
);
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
), d(() => {
|
|
35
|
+
!n.value && !e.meta?.required && e.meta?.nullableOrUndefined === "null" && o.setValue(null);
|
|
36
|
+
});
|
|
37
|
+
const { addError: h, removeError: b, showErrors: E, showErrorsOn: V } = A(), s = $(!1);
|
|
38
|
+
k(() => {
|
|
39
|
+
(E.value || V === "onChange") && (s.value = !0);
|
|
40
|
+
});
|
|
41
|
+
const u = () => {
|
|
42
|
+
s.value = !0;
|
|
43
|
+
};
|
|
44
|
+
d(() => {
|
|
45
|
+
n.value && u();
|
|
46
|
+
});
|
|
47
|
+
const p = a(() => !s.value && m.value !== "select" ? [] : g.value);
|
|
48
|
+
f(
|
|
49
|
+
() => r.value.meta.errors,
|
|
50
|
+
() => {
|
|
51
|
+
r.value.meta.errors.length ? h({
|
|
52
|
+
inputId: l,
|
|
53
|
+
errors: r.value.meta.errors.map((t) => t.message).filter(Boolean),
|
|
54
|
+
label: e.label
|
|
55
|
+
}) : b(l);
|
|
56
|
+
}
|
|
57
|
+
);
|
|
58
|
+
const i = a(() => ({
|
|
59
|
+
id: l,
|
|
60
|
+
required: e.meta?.required,
|
|
61
|
+
minLength: e.meta?.type === "string" && e.meta?.minLength,
|
|
62
|
+
maxLength: e.meta?.type === "string" && e.meta?.maxLength,
|
|
63
|
+
max: e.meta?.type === "number" && e.meta?.maximum,
|
|
64
|
+
min: e.meta?.type === "number" && e.meta?.minimum,
|
|
65
|
+
name: e.field.name,
|
|
66
|
+
modelValue: e.field.state.value,
|
|
67
|
+
errorMessages: p.value,
|
|
68
|
+
error: !!p.value.length,
|
|
69
|
+
field: e.field,
|
|
70
|
+
setRealDirty: u,
|
|
71
|
+
type: m.value,
|
|
72
|
+
label: `${e.label}${e.meta?.required ? " *" : ""}`,
|
|
73
|
+
options: e.options
|
|
74
|
+
}));
|
|
75
|
+
return (t, R) => B(t.$slots, "default", I(O(i.value)), () => [
|
|
76
|
+
_("div", {
|
|
77
|
+
class: q(t.$attrs.class),
|
|
78
|
+
onFocusout: u
|
|
79
|
+
}, [
|
|
80
|
+
F(v) ? (S(), L(D, T({
|
|
81
|
+
key: 0,
|
|
82
|
+
"input-props": i.value
|
|
83
|
+
}, t.$attrs, {
|
|
84
|
+
"vuetify-value": i.value.field.state.value
|
|
85
|
+
}), null, 16, ["input-props", "vuetify-value"])) : P("", !0)
|
|
86
|
+
], 34)
|
|
87
|
+
]);
|
|
88
|
+
}
|
|
89
|
+
});
|
|
11
90
|
export {
|
|
12
|
-
|
|
91
|
+
J as default
|
|
13
92
|
};
|
|
@@ -1,4 +1,13 @@
|
|
|
1
|
-
|
|
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
|
-
|
|
12
|
+
c as getOmegaStore
|
|
4
13
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent as d, inject as f, computed as o, createBlock as n, openBlock as m, resolveDynamicComponent as v, withCtx as l, createCommentVNode as c, mergeProps as y, renderSlot as g, normalizeProps as h, guardReactiveProps as C } from "vue";
|
|
2
2
|
import { generateInputStandardSchemaFromFieldMeta as F } from "./vue-components.es10.js";
|
|
3
|
-
import b from "./vue-components.
|
|
3
|
+
import b from "./vue-components.es24.js";
|
|
4
4
|
const P = /* @__PURE__ */ d({
|
|
5
5
|
inheritAttrs: !1,
|
|
6
6
|
__name: "OmegaInput",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@effect-app/vue-components",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.2",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@mdi/js": "^7.4.47",
|
|
6
6
|
"@tanstack/vue-form": "^1.2.4",
|
|
@@ -50,8 +50,8 @@
|
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"highlight.js": "^11.11.1",
|
|
52
52
|
"vue3-highlightjs": "^1.0.5",
|
|
53
|
-
"
|
|
54
|
-
"effect-app": "
|
|
53
|
+
"effect-app": "3.0.10",
|
|
54
|
+
"@effect-app/vue": "2.51.11"
|
|
55
55
|
},
|
|
56
56
|
"scripts": {
|
|
57
57
|
"build": "pnpm build:run",
|
|
@@ -14,6 +14,8 @@ import {
|
|
|
14
14
|
type FormProps,
|
|
15
15
|
type MetaRecord,
|
|
16
16
|
type OmegaFormApi,
|
|
17
|
+
TypeOverride,
|
|
18
|
+
FieldValidators,
|
|
17
19
|
} from "./OmegaFormStuff"
|
|
18
20
|
import {
|
|
19
21
|
computed,
|
|
@@ -25,7 +27,7 @@ import {
|
|
|
25
27
|
} from "vue"
|
|
26
28
|
import { isObject } from "effect/Predicate"
|
|
27
29
|
import OmegaFormInput from "./OmegaFormInput.vue"
|
|
28
|
-
import { OmegaFieldInternalApi } from "./InputProps"
|
|
30
|
+
import { InputProps, OmegaFieldInternalApi } from "./InputProps"
|
|
29
31
|
|
|
30
32
|
type keysRule<T> =
|
|
31
33
|
| {
|
|
@@ -57,8 +59,32 @@ interface OF<From, To> extends OmegaFormApi<From, To> {
|
|
|
57
59
|
|
|
58
60
|
export const OmegaFormKey = Symbol("OmegaForm") as InjectionKey<OF<any, any>>
|
|
59
61
|
|
|
62
|
+
type __VLS_PrettifyLocal<T> = {
|
|
63
|
+
[K in keyof T]: T[K];
|
|
64
|
+
} & {};
|
|
65
|
+
|
|
60
66
|
export interface OmegaFormReturn<From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>> extends OF<From, To> {
|
|
61
|
-
|
|
67
|
+
// this crazy thing here is copied from the OmegaFormInput.vue.d.ts, with `From` removed as Generic, instead closed over from the From generic above..
|
|
68
|
+
Input: <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<{
|
|
69
|
+
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
|
|
70
|
+
name: Name;
|
|
71
|
+
label: string;
|
|
72
|
+
validators?: FieldValidators<From>;
|
|
73
|
+
options?: {
|
|
74
|
+
title: string;
|
|
75
|
+
value: string;
|
|
76
|
+
}[];
|
|
77
|
+
type?: TypeOverride;
|
|
78
|
+
} & Partial<{}>> & import("vue").PublicProps;
|
|
79
|
+
expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
|
|
80
|
+
attrs: any;
|
|
81
|
+
slots: {
|
|
82
|
+
default(props: InputProps<From, Name>): void;
|
|
83
|
+
};
|
|
84
|
+
emit: {};
|
|
85
|
+
}>) => import("vue").VNode & {
|
|
86
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
87
|
+
};
|
|
62
88
|
}
|
|
63
89
|
|
|
64
90
|
export const useOmegaForm = <
|