@effect-app/vue-components 0.2.7 → 0.3.0
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/OmegaErrors.vue.d.ts +2 -2
- package/dist/types/components/OmegaForm/OmegaErrorsContext.d.ts +8 -5
- package/dist/types/components/OmegaForm/OmegaFormStuff.d.ts +1 -0
- package/dist/types/components/OmegaForm/OmegaInput.vue.d.ts +0 -1
- package/dist/types/components/OmegaForm/OmegaInternalInput.vue.d.ts +0 -1
- package/dist/types/components/OmegaForm/OmegaWrapper.vue.d.ts +8 -14
- package/dist/types/components/OmegaForm/getOmegaStore.d.ts +1 -1
- package/dist/types/components/OmegaForm/index.d.ts +5 -4
- package/dist/types/components/OmegaForm/useOmegaForm.d.ts +20 -3
- package/dist/vue-components.es11.js +27 -24
- package/dist/vue-components.es14.js +29 -29
- package/dist/vue-components.es15.js +4 -87
- package/dist/vue-components.es16.js +93 -11
- package/dist/vue-components.es17.js +11 -2
- package/dist/vue-components.es18.js +2 -115
- package/dist/vue-components.es19.js +117 -0
- package/dist/{vue-components.es20.js → vue-components.es21.js} +1 -1
- package/dist/vue-components.es4.js +29 -21
- package/dist/vue-components.es5.js +82 -16
- package/dist/vue-components.es7.js +2 -2
- package/dist/vue-components.es8.js +1 -1
- package/dist/vue-components.es9.js +2 -2
- package/package.json +11 -2
- package/src/components/OmegaForm/OmegaErrors.vue +2 -5
- package/src/components/OmegaForm/OmegaErrorsContext.ts +16 -3
- package/src/components/OmegaForm/OmegaFormStuff.ts +2 -0
- package/src/components/OmegaForm/OmegaInternalInput.vue +20 -12
- package/src/components/OmegaForm/OmegaWrapper.vue +13 -9
- package/src/components/OmegaForm/getOmegaStore.ts +1 -1
- package/src/components/OmegaForm/useOmegaForm.ts +133 -11
- package/src/stories/OmegaForm/ComplexForm.vue +81 -0
- package/src/stories/OmegaForm/EmailForm.vue +48 -0
- package/src/stories/OmegaForm/PersistencyForm.vue +65 -0
- package/src/stories/OmegaForm/SimpleForm.vue +30 -0
- package/src/stories/OmegaForm/SimpleFormVuetifyDefault.vue +15 -0
- package/src/stories/OmegaForm/SumExample.vue +39 -0
- package/src/stories/OmegaForm.stories.ts +83 -0
- package/src/stories/README.md +29 -0
- package/src/stories/tsconfig.json +4 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { mdiLink } from "@mdi/js";
|
|
2
2
|
declare const vuetified: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | undefined;
|
|
3
|
-
declare const errors: import("vue").Ref<readonly import("./OmegaFormStuff").OmegaError[], readonly import("./OmegaFormStuff").OmegaError[]>,
|
|
3
|
+
declare const errors: import("vue").Ref<readonly import("./OmegaFormStuff").OmegaError[], readonly import("./OmegaFormStuff").OmegaError[]>, showErrors: import("vue").Ref<boolean, boolean>;
|
|
4
4
|
declare const trans: (id: string, values?: Record<string, import("intl-messageformat").PrimitiveType | import("intl-messageformat").FormatXMLElementFn<string, string>>) => string;
|
|
5
5
|
declare const showedGeneralErrors: import("vue").ComputedRef<string[]>;
|
|
6
6
|
declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
|
|
@@ -15,7 +15,7 @@ declare const __VLS_self: import("vue").DefineComponent<{}, {
|
|
|
15
15
|
mdiLink: typeof mdiLink;
|
|
16
16
|
vuetified: typeof vuetified;
|
|
17
17
|
errors: typeof errors;
|
|
18
|
-
|
|
18
|
+
showErrors: typeof showErrors;
|
|
19
19
|
trans: typeof trans;
|
|
20
20
|
showedGeneralErrors: typeof showedGeneralErrors;
|
|
21
21
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import { type InjectionKey, type Ref } from "vue";
|
|
2
|
-
import type
|
|
2
|
+
import { type OmegaError, type ShowErrorsOn } from "./OmegaFormStuff";
|
|
3
3
|
import type { StandardSchemaV1Issue } from "@tanstack/vue-form";
|
|
4
4
|
export declare const OmegaErrorsKey: InjectionKey<{
|
|
5
5
|
errors: Ref<readonly OmegaError[]>;
|
|
6
6
|
addError: (error: OmegaError) => void;
|
|
7
7
|
removeError: (inputId: string) => void;
|
|
8
8
|
clearErrors: () => void;
|
|
9
|
-
|
|
9
|
+
showErrors: Ref<boolean>;
|
|
10
|
+
showErrorsOn: ShowErrorsOn;
|
|
10
11
|
generalErrors: Ref<(Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined>;
|
|
11
12
|
}>;
|
|
12
|
-
export declare function provideOmegaErrors(formSubmissionAttempts: Ref<number>, generalErrors: Ref<(Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined
|
|
13
|
+
export declare function provideOmegaErrors(formSubmissionAttempts: Ref<number>, generalErrors: Ref<(Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined>, showErrorsOn?: ShowErrorsOn): {
|
|
13
14
|
errors: Readonly<Ref<readonly {
|
|
14
15
|
readonly label: string;
|
|
15
16
|
readonly inputId: string;
|
|
@@ -22,14 +23,16 @@ export declare function provideOmegaErrors(formSubmissionAttempts: Ref<number>,
|
|
|
22
23
|
addError: (error: OmegaError) => void;
|
|
23
24
|
removeError: (inputId: string) => void;
|
|
24
25
|
clearErrors: () => void;
|
|
25
|
-
|
|
26
|
+
showErrors: import("vue").ComputedRef<boolean>;
|
|
26
27
|
generalErrors: Ref<(Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined, (Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined>;
|
|
28
|
+
showErrorsOn: ShowErrorsOn;
|
|
27
29
|
};
|
|
28
30
|
export declare function useOmegaErrors(): {
|
|
29
31
|
errors: Ref<readonly OmegaError[]>;
|
|
30
32
|
addError: (error: OmegaError) => void;
|
|
31
33
|
removeError: (inputId: string) => void;
|
|
32
34
|
clearErrors: () => void;
|
|
33
|
-
|
|
35
|
+
showErrors: Ref<boolean>;
|
|
36
|
+
showErrorsOn: ShowErrorsOn;
|
|
34
37
|
generalErrors: Ref<(Record<string, StandardSchemaV1Issue[]> | undefined)[] | undefined>;
|
|
35
38
|
};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { S, type Effect } from "effect-app";
|
|
2
2
|
import { type FormAsyncValidateOrFn, type FormValidateOrFn, type StandardSchemaV1, type FormApi, type VueFormApi, type FieldComponent, type FormOptions, type DeepKeys, type FieldValidateOrFn, type FieldAsyncValidateOrFn, type FormState } from "@tanstack/vue-form";
|
|
3
3
|
import type { Component } from "vue";
|
|
4
|
+
export type ShowErrorsOn = "onChange" | "onBlur" | "onSubmit";
|
|
4
5
|
export type TypeOverride = "string" | "text" | "number" | "select" | "multiple" | "boolean" | "autocomplete" | "autocompletemultiple";
|
|
5
6
|
export interface OmegaError {
|
|
6
7
|
label: string;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { type S } from "effect-app";
|
|
2
|
-
import { type
|
|
2
|
+
import { type OmegaFormState, type ShowErrorsOn } from "./OmegaFormStuff";
|
|
3
|
+
import { type OmegaConfig, type OmegaFormReturn } from "./useOmegaForm";
|
|
3
4
|
declare const _default: <From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>, K extends keyof OmegaFormState<To, From> = keyof OmegaFormState<To, 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<{
|
|
4
5
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & ({
|
|
6
|
+
omegaConfig?: OmegaConfig<From>;
|
|
5
7
|
subscribe?: K[];
|
|
8
|
+
showErrorsOn?: ShowErrorsOn;
|
|
6
9
|
} & ({
|
|
7
|
-
form:
|
|
8
|
-
meta: MetaRecord<To>;
|
|
9
|
-
filterItems?: FilterItems;
|
|
10
|
-
};
|
|
10
|
+
form: OmegaFormReturn<To, From>;
|
|
11
11
|
schema?: undefined;
|
|
12
12
|
} | (Omit<import("@tanstack/vue-form").FormOptions<To, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").StandardSchemaV1<To, From>, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined>, "onSubmit"> & {
|
|
13
13
|
onSubmit?: ((props: {
|
|
@@ -19,18 +19,12 @@ declare const _default: <From extends Record<PropertyKey, any>, To extends Recor
|
|
|
19
19
|
form?: undefined;
|
|
20
20
|
schema: S.Schema<From, To, never>;
|
|
21
21
|
}))) & Partial<{}>> & import("vue").PublicProps;
|
|
22
|
-
expose(exposed: import("vue").ShallowUnwrapRef<
|
|
23
|
-
meta: MetaRecord<To>;
|
|
24
|
-
filterItems?: FilterItems;
|
|
25
|
-
}>): void;
|
|
22
|
+
expose(exposed: import("vue").ShallowUnwrapRef<OmegaFormReturn<To, From>>): void;
|
|
26
23
|
attrs: any;
|
|
27
24
|
slots: {
|
|
28
25
|
default?: ((props: {
|
|
29
|
-
form:
|
|
30
|
-
|
|
31
|
-
filterItems?: FilterItems;
|
|
32
|
-
};
|
|
33
|
-
subscribedValues: Pick<OmegaFormState<To, From>, K>;
|
|
26
|
+
form: OmegaFormReturn<To, From>;
|
|
27
|
+
subscribedValues: K[] extends undefined[] ? Record<string, never> : Pick<OmegaFormState<To, From>, K>;
|
|
34
28
|
}) => any) | undefined;
|
|
35
29
|
};
|
|
36
30
|
emit: {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { type Ref } from "vue";
|
|
2
2
|
import type { OmegaFormState, OmegaFormApi } from "./OmegaFormStuff";
|
|
3
|
-
export declare function getOmegaStore<To, From, K extends keyof OmegaFormState<To, From> = keyof OmegaFormState<To, From>>(form: OmegaFormApi<To, From>, subscribe?: K[]): Ref<K[] extends undefined ? Record<string, never> : Pick<OmegaFormState<To, From>, K>>;
|
|
3
|
+
export declare function getOmegaStore<To, From, K extends keyof OmegaFormState<To, From> = keyof OmegaFormState<To, From>>(form: OmegaFormApi<To, From>, subscribe?: K[]): Ref<K[] extends undefined[] ? Record<string, never> : Pick<OmegaFormState<To, From>, K>>;
|
|
@@ -7,14 +7,15 @@ export { useOmegaForm } from "./useOmegaForm";
|
|
|
7
7
|
export { default } from "./OmegaWrapper.vue";
|
|
8
8
|
export { OmegaForm, OmegaInput, OmegaErrors };
|
|
9
9
|
declare const OmegaFormCE: new <From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>, K extends keyof import("./OmegaFormStuff").OmegaFormState<To, From> = keyof import("./OmegaFormStuff").OmegaFormState<To, From>>(initialProps?: Record<string, any>) => import("vue").VueElement & ((({
|
|
10
|
+
omegaConfig?: import("./useOmegaForm").OmegaConfig<From> | undefined;
|
|
10
11
|
subscribe?: K[] | undefined;
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
filterItems?: import("./OmegaFormStuff").FilterItems;
|
|
14
|
-
};
|
|
12
|
+
showErrorsOn?: import("./OmegaFormStuff").ShowErrorsOn | undefined;
|
|
13
|
+
form: import("./useOmegaForm").OmegaFormReturn<To, From>;
|
|
15
14
|
schema?: undefined | undefined;
|
|
16
15
|
} | {
|
|
16
|
+
omegaConfig?: import("./useOmegaForm").OmegaConfig<From> | undefined;
|
|
17
17
|
subscribe?: K[] | undefined;
|
|
18
|
+
showErrorsOn?: import("./OmegaFormStuff").ShowErrorsOn | undefined;
|
|
18
19
|
defaultValues?: To | undefined;
|
|
19
20
|
defaultState?: Partial<import("@tanstack/vue-form").FormState<To, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").StandardSchemaV1<To, From>, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined, import("@tanstack/vue-form").FormAsyncValidateOrFn<To> | undefined>> | undefined;
|
|
20
21
|
asyncAlways?: boolean | undefined;
|
|
@@ -1,6 +1,23 @@
|
|
|
1
1
|
import { S } from "effect-app";
|
|
2
|
-
import { type FilterItems, type FormProps, type MetaRecord, type OmegaFormApi } from "./OmegaFormStuff";
|
|
3
|
-
|
|
2
|
+
import { type NestedKeyOf, type FilterItems, type FormProps, type MetaRecord, type OmegaFormApi } from "./OmegaFormStuff";
|
|
3
|
+
type keysRule<T> = {
|
|
4
|
+
keys?: NestedKeyOf<T>[];
|
|
5
|
+
banKeys?: "You should only use one of banKeys or keys, not both, moron";
|
|
6
|
+
} | {
|
|
7
|
+
keys?: "You should only use one of banKeys or keys, not both, moron";
|
|
8
|
+
banKeys?: NestedKeyOf<T>[];
|
|
9
|
+
};
|
|
10
|
+
export type OmegaConfig<T> = {
|
|
11
|
+
persistency?: {
|
|
12
|
+
method?: "session" | "local" | "none";
|
|
13
|
+
overrideDefaultValues?: boolean;
|
|
14
|
+
id?: string;
|
|
15
|
+
} & keysRule<T>;
|
|
16
|
+
};
|
|
17
|
+
export interface OmegaFormReturn<To, From> extends OmegaFormApi<To, From> {
|
|
4
18
|
meta: MetaRecord<To>;
|
|
5
19
|
filterItems?: FilterItems;
|
|
6
|
-
|
|
20
|
+
clear: () => void;
|
|
21
|
+
}
|
|
22
|
+
export declare const useOmegaForm: <From extends Record<PropertyKey, any>, To extends Record<PropertyKey, any>>(schema: S.Schema<From, To, never>, tanstackFormOptions?: NoInfer<FormProps<To, From>>, omegaConfig?: OmegaConfig<From>) => OmegaFormReturn<To, From>;
|
|
23
|
+
export {};
|
|
@@ -1,12 +1,14 @@
|
|
|
1
|
-
import { defineComponent as d, watch as b, createElementBlock as
|
|
1
|
+
import { defineComponent as d, watch as b, createElementBlock as g, openBlock as S, withModifiers as v, unref as n, createElementVNode as h, renderSlot as O } from "vue";
|
|
2
2
|
import { useStore as i } from "@tanstack/vue-form";
|
|
3
|
-
import { getOmegaStore as
|
|
4
|
-
import { provideOmegaErrors as
|
|
5
|
-
import { useOmegaForm as
|
|
6
|
-
const
|
|
3
|
+
import { getOmegaStore as M } from "./vue-components.es17.js";
|
|
4
|
+
import { provideOmegaErrors as y } from "./vue-components.es4.js";
|
|
5
|
+
import { useOmegaForm as E } from "./vue-components.es5.js";
|
|
6
|
+
const w = ["disabled"], A = /* @__PURE__ */ d({
|
|
7
7
|
__name: "OmegaWrapper",
|
|
8
8
|
props: {
|
|
9
|
+
omegaConfig: {},
|
|
9
10
|
subscribe: {},
|
|
11
|
+
showErrorsOn: {},
|
|
10
12
|
form: {},
|
|
11
13
|
schema: {},
|
|
12
14
|
defaultValues: {},
|
|
@@ -20,42 +22,43 @@ const I = ["disabled"], A = /* @__PURE__ */ d({
|
|
|
20
22
|
onSubmit: { type: Function }
|
|
21
23
|
},
|
|
22
24
|
setup(u, { expose: l }) {
|
|
23
|
-
const r = u, t = r.form ??
|
|
25
|
+
const r = u, t = r.form ?? E(r.schema, r, r.omegaConfig), f = i(t.store, (e) => e.isSubmitting);
|
|
24
26
|
l(t);
|
|
25
|
-
const c =
|
|
27
|
+
const c = M(
|
|
26
28
|
t,
|
|
27
29
|
r.subscribe
|
|
28
30
|
), p = i(
|
|
29
31
|
t.store,
|
|
30
32
|
(e) => e.submissionAttempts
|
|
31
|
-
),
|
|
33
|
+
), s = t.useStore((e) => e.errors);
|
|
32
34
|
return b(
|
|
33
|
-
() => [t.filterItems,
|
|
35
|
+
() => [t.filterItems, s.value],
|
|
34
36
|
() => {
|
|
35
37
|
const e = t.filterItems;
|
|
36
|
-
return e ?
|
|
37
|
-
(
|
|
38
|
+
return e ? s.value ? (Object.values(s.value).filter(
|
|
39
|
+
(o) => !!o
|
|
38
40
|
).flatMap(
|
|
39
|
-
(
|
|
40
|
-
).some((
|
|
41
|
-
const
|
|
42
|
-
t.setFieldMeta(
|
|
43
|
-
...
|
|
41
|
+
(o) => Object.values(o).flat().map((m) => m.message)
|
|
42
|
+
).some((o) => o === e.message) && e.items.forEach((o) => {
|
|
43
|
+
const m = t.getFieldMeta(o);
|
|
44
|
+
t.setFieldMeta(o, {
|
|
45
|
+
...m,
|
|
44
46
|
errorMap: {
|
|
45
|
-
onSubmit: [{ path: [
|
|
47
|
+
onSubmit: [{ path: [o], message: e.message }]
|
|
46
48
|
}
|
|
47
49
|
});
|
|
48
50
|
}), {}) : {} : {};
|
|
49
51
|
}
|
|
50
|
-
),
|
|
51
|
-
|
|
52
|
+
), y(p, s, r.showErrorsOn), (e, a) => (S(), g("form", {
|
|
53
|
+
novalidate: "",
|
|
54
|
+
onSubmit: a[0] || (a[0] = v((o) => n(t).handleSubmit(), ["prevent", "stop"]))
|
|
52
55
|
}, [
|
|
53
|
-
h("fieldset", { disabled:
|
|
54
|
-
|
|
55
|
-
form:
|
|
56
|
-
subscribedValues:
|
|
56
|
+
h("fieldset", { disabled: n(f) }, [
|
|
57
|
+
O(e.$slots, "default", {
|
|
58
|
+
form: n(t),
|
|
59
|
+
subscribedValues: n(c)
|
|
57
60
|
}, void 0, !0)
|
|
58
|
-
], 8,
|
|
61
|
+
], 8, w)
|
|
59
62
|
], 32));
|
|
60
63
|
}
|
|
61
64
|
});
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useOmegaErrors as
|
|
3
|
-
import { mdiLink as
|
|
4
|
-
import { useIntl as
|
|
5
|
-
const
|
|
1
|
+
import { defineComponent as C, getCurrentInstance as x, computed as B, createBlock as o, openBlock as t, Transition as b, withCtx as l, createElementBlock as c, createCommentVNode as w, unref as e, renderSlot as I, normalizeProps as V, guardReactiveProps as N, resolveDynamicComponent as s, normalizeClass as O, createElementVNode as d, toDisplayString as u, Fragment as g, renderList as k, createTextVNode as y } from "vue";
|
|
2
|
+
import { useOmegaErrors as z } from "./vue-components.es4.js";
|
|
3
|
+
import { mdiLink as D } from "@mdi/js";
|
|
4
|
+
import { useIntl as G } from "./vue-components.es3.js";
|
|
5
|
+
const L = {
|
|
6
6
|
key: 0,
|
|
7
7
|
class: "error-alert"
|
|
8
|
-
},
|
|
8
|
+
}, M = { class: "text-h6 mb-3" }, P = { class: "font-weight-medium" }, S = { class: "error-message" }, T = ["href"], $ = { key: 1 }, H = /* @__PURE__ */ C({
|
|
9
9
|
__name: "OmegaErrors",
|
|
10
|
-
setup(
|
|
11
|
-
const
|
|
10
|
+
setup(j) {
|
|
11
|
+
const m = x(), f = m == null ? void 0 : m.appContext.components.VAlert, { errors: n, generalErrors: _, showErrors: E } = z(), { trans: h } = G(), p = B(() => _.value ? _.value.filter(
|
|
12
12
|
(i) => !!i
|
|
13
13
|
).flatMap(
|
|
14
|
-
(i) => Object.values(i).filter((
|
|
15
|
-
(
|
|
14
|
+
(i) => Object.values(i).filter((a) => !!a).flatMap(
|
|
15
|
+
(a) => a.filter(
|
|
16
16
|
(r) => !!(r != null && r.message)
|
|
17
17
|
).map((r) => r.message)
|
|
18
18
|
)
|
|
19
19
|
) : []);
|
|
20
|
-
return (i,
|
|
20
|
+
return (i, a) => (t(), o(b, null, {
|
|
21
21
|
default: l(() => [
|
|
22
|
-
e(
|
|
22
|
+
e(E) && (e(n).length || p.value.length) ? (t(), c("div", L, [
|
|
23
23
|
I(i.$slots, "default", V(N({ errors: e(n), showedGeneralErrors: p.value })), () => [
|
|
24
|
-
(t(), o(
|
|
24
|
+
(t(), o(s(e(f) ? "v-alert" : "div"), {
|
|
25
25
|
class: O([e(f) ? "mb-4" : "error-alert-content", "mb-4"]),
|
|
26
26
|
type: "error",
|
|
27
27
|
variant: "tonal",
|
|
@@ -29,24 +29,24 @@ const D = {
|
|
|
29
29
|
"aria-live": "polite"
|
|
30
30
|
}, {
|
|
31
31
|
default: l(() => [
|
|
32
|
-
|
|
33
|
-
e(n).length ? (t(), o(
|
|
32
|
+
d("div", M, u(e(h)("form.includes_error")) + ":", 1),
|
|
33
|
+
e(n).length ? (t(), o(s(e(n).length > 1 ? "ul" : "div"), {
|
|
34
34
|
key: 0,
|
|
35
35
|
class: "error-list"
|
|
36
36
|
}, {
|
|
37
37
|
default: l(() => [
|
|
38
|
-
(t(!0),
|
|
38
|
+
(t(!0), c(g, null, k(e(n), (r) => (t(), o(s(e(n).length > 1 ? "li" : "div"), {
|
|
39
39
|
key: r.inputId,
|
|
40
40
|
class: "error-item"
|
|
41
41
|
}, {
|
|
42
42
|
default: l(() => [
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
(t(), o(
|
|
43
|
+
d("div", P, u(r.label), 1),
|
|
44
|
+
d("div", S, [
|
|
45
|
+
(t(), o(s(r.errors.length > 1 ? "ul" : "div"), { class: "error-list" }, {
|
|
46
46
|
default: l(() => [
|
|
47
|
-
(t(!0),
|
|
47
|
+
(t(!0), c(g, null, k(r.errors, (v) => (t(), o(s(r.errors.length > 1 ? "li" : "span"), { key: v }, {
|
|
48
48
|
default: l(() => [
|
|
49
|
-
y(
|
|
49
|
+
y(u(v), 1)
|
|
50
50
|
]),
|
|
51
51
|
_: 2
|
|
52
52
|
}, 1024))), 128))
|
|
@@ -54,27 +54,27 @@ const D = {
|
|
|
54
54
|
_: 2
|
|
55
55
|
}, 1024))
|
|
56
56
|
]),
|
|
57
|
-
|
|
57
|
+
d("a", {
|
|
58
58
|
href: `#${r.inputId}`,
|
|
59
59
|
class: "error-link"
|
|
60
60
|
}, [
|
|
61
|
-
(t(), o(
|
|
62
|
-
icon: e(
|
|
61
|
+
(t(), o(s(e(f) ? "v-icon" : "i"), {
|
|
62
|
+
icon: e(D),
|
|
63
63
|
"aria-hidden": "true"
|
|
64
64
|
}, {
|
|
65
|
-
default: l(() =>
|
|
66
|
-
|
|
65
|
+
default: l(() => a[0] || (a[0] = [
|
|
66
|
+
d("i", null, "🔗", -1)
|
|
67
67
|
])),
|
|
68
68
|
_: 1
|
|
69
69
|
}, 8, ["icon"])),
|
|
70
|
-
y(" " +
|
|
71
|
-
], 8,
|
|
70
|
+
y(" " + u(e(h)("form.fix_input")), 1)
|
|
71
|
+
], 8, T)
|
|
72
72
|
]),
|
|
73
73
|
_: 2
|
|
74
74
|
}, 1024))), 128))
|
|
75
75
|
]),
|
|
76
76
|
_: 1
|
|
77
|
-
})) : (t(),
|
|
77
|
+
})) : (t(), c("span", $, u(p.value[0]), 1))
|
|
78
78
|
]),
|
|
79
79
|
_: 1
|
|
80
80
|
}, 8, ["class"]))
|
|
@@ -1,89 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
import { defineComponent as C, getCurrentInstance as L, useId as O, computed as l, watch as q, onMounted as S, ref as A, watchEffect as D, renderSlot as F, mergeProps as E, createBlock as M, createCommentVNode as P, unref as T, openBlock as U } from "vue";
|
|
3
|
-
import { useStore as N } from "@tanstack/vue-form";
|
|
4
|
-
import { useOmegaErrors as R } from "./vue-components.es4.js";
|
|
5
|
-
import j from "./vue-components.es18.js";
|
|
6
|
-
|
|
7
|
-
const Q = /* @__PURE__ */ C({
|
|
8
|
-
inheritAttrs: !1,
|
|
9
|
-
__name: "OmegaInternalInput",
|
|
10
|
-
props: {
|
|
11
|
-
field: {},
|
|
12
|
-
meta: {},
|
|
13
|
-
label: {},
|
|
14
|
-
options: {},
|
|
15
|
-
type: {},
|
|
16
|
-
validators: {}
|
|
17
|
-
},
|
|
18
|
-
setup(I) {
|
|
19
|
-
const e = I, n = L(), $ = n == null ? void 0 : n.appContext.components.VTextField, o = O(), u = e.field, a = N(u.store, (t) => t), p = l(() => {
|
|
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
|
-
}), s = l(() => a.value.value), f = l(
|
|
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
|
-
q(
|
|
29
|
-
() => [!!s.value],
|
|
30
|
-
() => {
|
|
31
|
-
var t, r;
|
|
32
|
-
f.value.length && !s.value && !((t = e.meta) != null && t.required) && u.setValue(
|
|
33
|
-
((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "undefined" ? void 0 : null
|
|
34
|
-
);
|
|
35
|
-
}
|
|
36
|
-
), S(() => {
|
|
37
|
-
var t, r;
|
|
38
|
-
!s.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && u.setValue(null);
|
|
39
|
-
});
|
|
40
|
-
const i = A(!1), d = () => {
|
|
41
|
-
i.value = !0;
|
|
42
|
-
}, { addError: k, formSubmissionAttempts: w, removeError: B } = R();
|
|
43
|
-
D(() => {
|
|
44
|
-
w.value > 0 && (i.value = !0);
|
|
45
|
-
});
|
|
46
|
-
const v = l(() => !i.value && p.value !== "select" ? [] : f.value);
|
|
47
|
-
q(
|
|
48
|
-
() => a.value.meta.errors,
|
|
49
|
-
() => {
|
|
50
|
-
a.value.meta.errors.length ? k({
|
|
51
|
-
inputId: o,
|
|
52
|
-
errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
|
|
53
|
-
label: e.label
|
|
54
|
-
}) : B(o);
|
|
55
|
-
}
|
|
56
|
-
);
|
|
57
|
-
const m = l(() => {
|
|
58
|
-
var t, r, c, g, y, h, b, x, V, _;
|
|
59
|
-
return {
|
|
60
|
-
id: o,
|
|
61
|
-
required: (t = e.meta) == null ? void 0 : t.required,
|
|
62
|
-
minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((c = e.meta) == null ? void 0 : c.minLength),
|
|
63
|
-
maxLength: ((g = e.meta) == null ? void 0 : g.type) === "string" && ((y = e.meta) == null ? void 0 : y.maxLength),
|
|
64
|
-
max: ((h = e.meta) == null ? void 0 : h.type) === "number" && ((b = e.meta) == null ? void 0 : b.maximum),
|
|
65
|
-
min: ((x = e.meta) == null ? void 0 : x.type) === "number" && ((V = e.meta) == null ? void 0 : V.minimum),
|
|
66
|
-
name: e.field.name,
|
|
67
|
-
modelValue: e.field.state.value,
|
|
68
|
-
errorMessages: v.value,
|
|
69
|
-
error: !!v.value.length,
|
|
70
|
-
field: e.field,
|
|
71
|
-
setRealDirty: d,
|
|
72
|
-
type: p.value,
|
|
73
|
-
label: `${e.label}${(_ = e.meta) != null && _.required ? " *" : ""}`,
|
|
74
|
-
options: e.options
|
|
75
|
-
};
|
|
76
|
-
});
|
|
77
|
-
return (t, r) => F(t.$slots, "default", E(m.value, { onFocusout: d }), () => [
|
|
78
|
-
T($) ? (U(), M(j, E({
|
|
79
|
-
key: 0,
|
|
80
|
-
"input-props": m.value
|
|
81
|
-
}, t.$attrs, {
|
|
82
|
-
"vuetify-value": m.value.field.state.value
|
|
83
|
-
}), null, 16, ["input-props", "vuetify-value"])) : P("", !0)
|
|
84
|
-
]);
|
|
85
|
-
}
|
|
86
|
-
});
|
|
1
|
+
const o = (n) => () => n, t = /* @__PURE__ */ o(void 0), c = t;
|
|
87
2
|
export {
|
|
88
|
-
|
|
3
|
+
t as constUndefined,
|
|
4
|
+
c as constVoid,
|
|
5
|
+
o as constant
|
|
89
6
|
};
|
|
@@ -1,13 +1,95 @@
|
|
|
1
|
-
|
|
2
|
-
import { computed as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
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 x, onMounted as _, ref as S, watchEffect as A, renderSlot as D, normalizeProps as F, guardReactiveProps as M, createElementVNode as N, createBlock as R, createCommentVNode as T, unref as U, openBlock as z, mergeProps as j } from "vue";
|
|
3
|
+
import { useStore as G } from "@tanstack/vue-form";
|
|
4
|
+
import { useOmegaErrors as H } from "./vue-components.es4.js";
|
|
5
|
+
import J from "./vue-components.es19.js";
|
|
6
|
+
|
|
7
|
+
const Z = /* @__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(q) {
|
|
19
|
+
const e = q, o = L(), C = o == null ? void 0 : o.appContext.components.VTextField, u = P(), s = e.field, a = G(s.store, (t) => t), f = 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
|
+
}), l = n(() => a.value.value), d = 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
|
+
x(
|
|
29
|
+
() => [!!l.value],
|
|
30
|
+
() => {
|
|
31
|
+
var t, r;
|
|
32
|
+
d.value.length && !l.value && !((t = e.meta) != null && t.required) && s.setValue(
|
|
33
|
+
((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "undefined" ? void 0 : null
|
|
34
|
+
);
|
|
35
|
+
}
|
|
36
|
+
), _(() => {
|
|
37
|
+
var t, r;
|
|
38
|
+
!l.value && !((t = e.meta) != null && t.required) && ((r = e.meta) == null ? void 0 : r.nullableOrUndefined) === "null" && s.setValue(null);
|
|
39
|
+
});
|
|
40
|
+
const { addError: I, removeError: O, showErrors: $, showErrorsOn: k } = H(), i = S(!1);
|
|
41
|
+
A(() => {
|
|
42
|
+
($.value || k === "onChange") && (i.value = !0);
|
|
43
|
+
});
|
|
44
|
+
const m = () => {
|
|
45
|
+
i.value = !0;
|
|
46
|
+
};
|
|
47
|
+
_(() => {
|
|
48
|
+
l.value && m();
|
|
49
|
+
});
|
|
50
|
+
const v = n(() => !i.value && f.value !== "select" ? [] : d.value);
|
|
51
|
+
x(
|
|
52
|
+
() => a.value.meta.errors,
|
|
53
|
+
() => {
|
|
54
|
+
a.value.meta.errors.length ? I({
|
|
55
|
+
inputId: u,
|
|
56
|
+
errors: a.value.meta.errors.map((t) => t.message).filter(Boolean),
|
|
57
|
+
label: e.label
|
|
58
|
+
}) : O(u);
|
|
59
|
+
}
|
|
60
|
+
);
|
|
61
|
+
const p = n(() => {
|
|
62
|
+
var t, r, c, g, y, h, b, E, V, w;
|
|
63
|
+
return {
|
|
64
|
+
id: u,
|
|
65
|
+
required: (t = e.meta) == null ? void 0 : t.required,
|
|
66
|
+
minLength: ((r = e.meta) == null ? void 0 : r.type) === "string" && ((c = e.meta) == null ? void 0 : c.minLength),
|
|
67
|
+
maxLength: ((g = e.meta) == null ? void 0 : g.type) === "string" && ((y = e.meta) == null ? void 0 : y.maxLength),
|
|
68
|
+
max: ((h = e.meta) == null ? void 0 : h.type) === "number" && ((b = e.meta) == null ? void 0 : b.maximum),
|
|
69
|
+
min: ((E = e.meta) == null ? void 0 : E.type) === "number" && ((V = e.meta) == null ? void 0 : V.minimum),
|
|
70
|
+
name: e.field.name,
|
|
71
|
+
modelValue: e.field.state.value,
|
|
72
|
+
errorMessages: v.value,
|
|
73
|
+
error: !!v.value.length,
|
|
74
|
+
field: e.field,
|
|
75
|
+
setRealDirty: m,
|
|
76
|
+
type: f.value,
|
|
77
|
+
label: `${e.label}${(w = e.meta) != null && w.required ? " *" : ""}`,
|
|
78
|
+
options: e.options
|
|
79
|
+
};
|
|
80
|
+
});
|
|
81
|
+
return (t, r) => D(t.$slots, "default", F(M(p.value)), () => [
|
|
82
|
+
N("div", { onFocusout: m }, [
|
|
83
|
+
U(C) ? (z(), R(J, j({
|
|
84
|
+
key: 0,
|
|
85
|
+
"input-props": p.value
|
|
86
|
+
}, t.$attrs, {
|
|
87
|
+
"vuetify-value": p.value.field.state.value
|
|
88
|
+
}), null, 16, ["input-props", "vuetify-value"])) : T("", !0)
|
|
89
|
+
], 32)
|
|
90
|
+
]);
|
|
91
|
+
}
|
|
92
|
+
});
|
|
11
93
|
export {
|
|
12
|
-
|
|
94
|
+
Z as default
|
|
13
95
|
};
|
|
@@ -1,4 +1,13 @@
|
|
|
1
|
-
import
|
|
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
|
};
|