eco-vue-js 0.5.22 → 0.5.24
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Form/WForm.vue.d.ts +1 -1
- package/dist/components/Form/WFormValidator.vue.d.ts.map +1 -1
- package/dist/components/Form/WFormValidator.vue.js +20 -1
- package/dist/components/Form/models/utils.d.ts +1 -0
- package/dist/components/Form/models/utils.d.ts.map +1 -1
- package/dist/components/Form/models/utils.js +19 -1
- package/dist/components/Form/use/useFormValidateMap.d.ts +4 -1
- package/dist/components/Form/use/useFormValidateMap.d.ts.map +1 -1
- package/dist/components/Form/use/useFormValidateMap.js +10 -2
- package/dist/components/Input/WInputSuggest.vue.js +1 -1
- package/dist/components/Modal/WModalWrapper.vue.js +1 -1
- package/dist/components/Tabs/WTabs.vue.d.ts +3 -1
- package/dist/components/Tabs/WTabs.vue.d.ts.map +1 -1
- package/dist/components/Tabs/WTabs.vue.js +4 -12
- package/dist/components/Tabs/use/useIsInsideTab.d.ts +4 -0
- package/dist/components/Tabs/use/useIsInsideTab.d.ts.map +1 -0
- package/dist/components/Tabs/use/useIsInsideTab.js +11 -0
- package/package.json +1 -1
@@ -3,7 +3,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
3
3
|
title?: string | undefined;
|
4
4
|
}>, {
|
5
5
|
isValid: import("vue").ComputedRef<boolean>;
|
6
|
-
validate: (silent?: boolean | undefined) => string | undefined;
|
6
|
+
validate: (silent?: boolean | undefined, path?: import("./use/useFormValidateMap").ValidatePath | undefined) => string | undefined;
|
7
7
|
invalidate: (payload: {
|
8
8
|
[x: string]: string | string[];
|
9
9
|
}) => void;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"WFormValidator.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Form/WFormValidator.vue"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"WFormValidator.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Form/WFormValidator.vue"],"names":[],"mappings":"AAWA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiWA,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}
|
@@ -1,5 +1,8 @@
|
|
1
1
|
import { defineComponent, inject, useSlots, computed, ref, watch, onBeforeMount, onBeforeUnmount, openBlock, createBlock, resolveDynamicComponent } from 'vue';
|
2
2
|
import { wFormTitleUpdater, wFormErrorMessageUpdater, wFormHasChangesUpdater, wFormValidateUpdater, wFormInvalidateUpdater, wFormInitModelUpdater, wFormUnlistener } from './models/injection.js';
|
3
|
+
import { useTabActiveListener } from '../Tabs/use/useTabActiveListener.js';
|
4
|
+
import { scrollToValidator } from './models/utils.js';
|
5
|
+
import { useIsInsideTab } from '../Tabs/use/useIsInsideTab.js';
|
3
6
|
|
4
7
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
5
8
|
__name: "WFormValidator",
|
@@ -22,8 +25,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
22
25
|
const invalidateUpdater = inject(wFormInvalidateUpdater, void 0);
|
23
26
|
const initModelUpdater = inject(wFormInitModelUpdater, void 0);
|
24
27
|
const unlistener = inject(wFormUnlistener, void 0);
|
28
|
+
const { isInsideTab } = useIsInsideTab();
|
25
29
|
const slots = useSlots();
|
26
30
|
const component = computed(() => slots.default?.()[0]);
|
31
|
+
const componentRef = ref();
|
27
32
|
const modelValue = computed(() => {
|
28
33
|
const props2 = component.value?.props;
|
29
34
|
if (!props2)
|
@@ -123,11 +128,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
123
128
|
newValue.splice(index, 1);
|
124
129
|
validateOnUpdate(newValue);
|
125
130
|
};
|
126
|
-
const doValidate = (silent) => {
|
131
|
+
const doValidate = (silent, path) => {
|
132
|
+
if (props.name && path && !path[props.name])
|
133
|
+
return;
|
127
134
|
const message = _validate(modelValue.value);
|
128
135
|
if (!silent) {
|
129
136
|
errorMessage.value = message;
|
130
137
|
hasBeenValidated.value = true;
|
138
|
+
if (!isInsideTab)
|
139
|
+
scrollTo();
|
131
140
|
}
|
132
141
|
return message;
|
133
142
|
};
|
@@ -144,6 +153,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
144
153
|
initModelValue.value = modelValue.value;
|
145
154
|
hasChanges.value = false;
|
146
155
|
};
|
156
|
+
const scrollTo = () => {
|
157
|
+
if (!errorMessage.value)
|
158
|
+
return;
|
159
|
+
const element = componentRef.value.$el;
|
160
|
+
if (element instanceof HTMLDivElement)
|
161
|
+
scrollToValidator(element);
|
162
|
+
};
|
163
|
+
useTabActiveListener(scrollTo);
|
147
164
|
watch(errorMessage, (value) => {
|
148
165
|
if (value === null)
|
149
166
|
return;
|
@@ -191,6 +208,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
191
208
|
});
|
192
209
|
return (_ctx, _cache) => {
|
193
210
|
return openBlock(), createBlock(resolveDynamicComponent(component.value), {
|
211
|
+
ref_key: "componentRef",
|
212
|
+
ref: componentRef,
|
194
213
|
"error-message": errorMessage.value,
|
195
214
|
"has-changes": _ctx.noChanges ? void 0 : hasChanges.value,
|
196
215
|
"onUpdate:modelValue": _validateOnUpdate,
|
@@ -1,3 +1,4 @@
|
|
1
1
|
export declare const removeKey: <T extends Record<string, unknown>>(entity: T, key: string) => T;
|
2
2
|
export declare const compileMessage: (title: string | undefined, message: string | undefined) => string | undefined;
|
3
|
+
export declare const scrollToValidator: (element: HTMLElement) => void;
|
3
4
|
//# sourceMappingURL=utils.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/models/utils.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/models/utils.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,8CAA+C,CAAC,OAAO,MAAM,KAAG,CAMrF,CAAA;AAKD,eAAO,MAAM,cAAc,UAAW,MAAM,GAAG,SAAS,WAAW,MAAM,GAAG,SAAS,KAAG,MAAM,GAAG,SAShG,CAAA;AAED,eAAO,MAAM,iBAAiB,YAAsB,WAAW,KAAG,IAM3D,CAAA"}
|
@@ -1,3 +1,14 @@
|
|
1
|
+
import 'vue';
|
2
|
+
import '../../Button/WButtonAction.vue.js';
|
3
|
+
import '../../Button/WButton.vue.js';
|
4
|
+
import { throttle } from '../../../utils/utils.js';
|
5
|
+
import '../../../utils/supportsPassive.js';
|
6
|
+
import '../../Dropdown/utils/DropdownStyle.js';
|
7
|
+
import 'vue-router';
|
8
|
+
import '../../../utils/Modal.js';
|
9
|
+
import '../../Link/WLink.vue.js';
|
10
|
+
import '@tanstack/vue-query';
|
11
|
+
|
1
12
|
const removeKey = (entity, key) => {
|
2
13
|
const result = { ...entity };
|
3
14
|
delete result[key];
|
@@ -17,5 +28,12 @@ ${message}`;
|
|
17
28
|
return `${fieldMessageStart}${title}: ${message}`;
|
18
29
|
}
|
19
30
|
};
|
31
|
+
const scrollToValidator = throttle((element) => {
|
32
|
+
element.scrollIntoView({
|
33
|
+
behavior: "smooth",
|
34
|
+
block: "center",
|
35
|
+
inline: "nearest"
|
36
|
+
});
|
37
|
+
}, 300);
|
20
38
|
|
21
|
-
export { compileMessage, removeKey };
|
39
|
+
export { compileMessage, removeKey, scrollToValidator };
|
@@ -1,6 +1,9 @@
|
|
1
1
|
import { type Ref } from 'vue';
|
2
|
+
export type ValidatePath = {
|
3
|
+
[Key in string]: boolean | ValidatePath;
|
4
|
+
};
|
2
5
|
export declare const useFormValidateMap: (name: Ref<string | undefined>, titleGetter: (key: string) => string, emitIsValid: (value: boolean) => void) => {
|
3
6
|
validateMapUnlistener: (key: string) => void;
|
4
|
-
validate: (silent?: boolean) => string | undefined;
|
7
|
+
validate: (silent?: boolean, path?: ValidatePath) => string | undefined;
|
5
8
|
};
|
6
9
|
//# sourceMappingURL=useFormValidateMap.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useFormValidateMap.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/use/useFormValidateMap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,GAAG,EAAC,MAAM,KAAK,CAAA;AAIjE,eAAO,MAAM,kBAAkB,SAAU,IAAI,MAAM,GAAG,SAAS,CAAC,qBAAqB,MAAM,KAAK,MAAM,uBAAuB,OAAO,KAAK,IAAI;iCAOvG,MAAM;wBAIf,OAAO,KAAG,MAAM,GAAG,SAAS;
|
1
|
+
{"version":3,"file":"useFormValidateMap.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/use/useFormValidateMap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,GAAG,EAAC,MAAM,KAAK,CAAA;AAIjE,MAAM,MAAM,YAAY,GAAG;KACxB,GAAG,IAAI,MAAM,GAAG,OAAO,GAAG,YAAY;CACxC,CAAA;AAED,eAAO,MAAM,kBAAkB,SAAU,IAAI,MAAM,GAAG,SAAS,CAAC,qBAAqB,MAAM,KAAK,MAAM,uBAAuB,OAAO,KAAK,IAAI;iCAOvG,MAAM;wBAIf,OAAO,SAAS,YAAY,KAAG,MAAM,GAAG,SAAS;CAoC7E,CAAA"}
|
@@ -10,8 +10,16 @@ const useFormValidateMap = (name, titleGetter, emitIsValid) => {
|
|
10
10
|
const validateMapUnlistener = (key) => {
|
11
11
|
validateMap.value = removeKey(validateMap.value, key);
|
12
12
|
};
|
13
|
-
const validate = (silent) => {
|
14
|
-
const messages = Object.keys(validateMap.value).map((key) =>
|
13
|
+
const validate = (silent, path) => {
|
14
|
+
const messages = Object.keys(validateMap.value).map((key) => {
|
15
|
+
return compileMessage(
|
16
|
+
titleGetter(key),
|
17
|
+
validateMap.value[key](
|
18
|
+
silent,
|
19
|
+
path?.[key] instanceof Object ? path[key] : path?.[key] === true ? void 0 : path
|
20
|
+
)
|
21
|
+
);
|
22
|
+
}).filter((item) => item);
|
15
23
|
if (!silent)
|
16
24
|
emitIsValid(messages.length === 0);
|
17
25
|
return messages.length === 0 ? void 0 : messages.join("\n");
|
@@ -163,7 +163,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
163
163
|
class: normalizeClass(["bg-default dark:bg-default-dark w-full", {
|
164
164
|
"pb-[50vh]": unref(isMobile),
|
165
165
|
"rounded-xl max-h-[inherit] shadow-md overflow-x-hidden overflow-y-overlay overscroll-contain dark:border dark:border-solid dark:border-gray-800": !unref(isMobile),
|
166
|
-
"mt-
|
166
|
+
"mt-5": "istop" in contentScope && contentScope.istop === false && (_ctx.errorMessage || _ctx.maxLength)
|
167
167
|
}])
|
168
168
|
}, [
|
169
169
|
_ctx.$slots.content?.().length ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.$slots.content?.(), (slot, index) => {
|
@@ -25,7 +25,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
25
25
|
renderSlot(_ctx.$slots, "default")
|
26
26
|
]),
|
27
27
|
createElementVNode("div", {
|
28
|
-
class: normalizeClass(["sticky bottom-0 flex justify-center p-[var(--modal-wrapper-padding,2rem)] gap-[var(--modal-wrapper-padding,2rem)] w-full bg-default dark:bg-default-dark", {
|
28
|
+
class: normalizeClass(["sticky bottom-0 z-[1] flex justify-center p-[var(--modal-wrapper-padding,2rem)] gap-[var(--modal-wrapper-padding,2rem)] w-full bg-default dark:bg-default-dark", {
|
29
29
|
"sm-not:flex-col": !_ctx.maximized
|
30
30
|
}])
|
31
31
|
}, [
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import { type VNode } from 'vue';
|
2
2
|
declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
|
3
3
|
names?: string[] | Record<number, string> | undefined;
|
4
|
+
namesFrom?: string[] | Record<number, string> | undefined;
|
4
5
|
icons?: SVGComponent[] | Record<number, SVGComponent> | undefined;
|
5
6
|
slots?: VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
6
7
|
[key: string]: any;
|
@@ -11,7 +12,7 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimePr
|
|
11
12
|
updateIndex: (value: number) => void;
|
12
13
|
next: () => void;
|
13
14
|
previous: () => void;
|
14
|
-
validate: (index: number, silent?: boolean | undefined) => string | undefined;
|
15
|
+
validate: (index: number, silent?: boolean | undefined, path?: import("../Form/use/useFormValidateMap").ValidatePath | undefined) => string | undefined;
|
15
16
|
invalidate: (index: number, payload: {
|
16
17
|
[x: string]: string | string[];
|
17
18
|
}) => void;
|
@@ -21,6 +22,7 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimePr
|
|
21
22
|
"update:has-changes": (value: boolean) => void;
|
22
23
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
|
23
24
|
names?: string[] | Record<number, string> | undefined;
|
25
|
+
namesFrom?: string[] | Record<number, string> | undefined;
|
24
26
|
icons?: SVGComponent[] | Record<number, SVGComponent> | undefined;
|
25
27
|
slots?: VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
26
28
|
[key: string]: any;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"WTabs.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/WTabs.vue"],"names":[],"mappings":"AA2FA;AAEA,OAAO,EAAkC,KAAK,KAAK,EAAoD,MAAM,KAAK,CAAA
|
1
|
+
{"version":3,"file":"WTabs.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/WTabs.vue"],"names":[],"mappings":"AA2FA;AAEA,OAAO,EAAkC,KAAK,KAAK,EAAoD,MAAM,KAAK,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqZlH,wBAeG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC"}
|
@@ -15,6 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
15
15
|
__name: "WTabs",
|
16
16
|
props: {
|
17
17
|
names: {},
|
18
|
+
namesFrom: {},
|
18
19
|
icons: {},
|
19
20
|
slots: {},
|
20
21
|
lessTransitions: { type: Boolean },
|
@@ -37,21 +38,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
37
38
|
const hasChangesMap = reactive({});
|
38
39
|
const hasChanges = computed(() => Object.values(hasChangesMap).includes(true));
|
39
40
|
const updateIsValidMap = (index, value) => {
|
40
|
-
|
41
|
-
isValidMap[index] = value;
|
42
|
-
else
|
43
|
-
delete isValidMap[index];
|
41
|
+
isValidMap[index] = value;
|
44
42
|
nextTick().then(() => {
|
45
43
|
if (value === false && isValidMap[current.value] !== false)
|
46
44
|
switchTab(index);
|
47
45
|
});
|
48
46
|
};
|
49
|
-
const updateHasChangesMap = (index, value) => {
|
50
|
-
if (value !== void 0)
|
51
|
-
hasChangesMap[index] = value;
|
52
|
-
else
|
53
|
-
delete hasChangesMap[index];
|
54
|
-
};
|
55
47
|
const switchTab = throttle((index) => {
|
56
48
|
if (current.value === index)
|
57
49
|
return;
|
@@ -201,10 +193,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
201
193
|
ref_for: true,
|
202
194
|
ref_key: "form",
|
203
195
|
ref: form,
|
204
|
-
name: index.toString(),
|
196
|
+
name: _ctx.namesFrom?.[index] ?? index.toString(),
|
205
197
|
title: _ctx.names?.[index],
|
206
198
|
"onUpdate:isValid": ($event) => updateIsValidMap(index, $event),
|
207
|
-
"onUpdate:hasChanges": ($event) =>
|
199
|
+
"onUpdate:hasChanges": ($event) => hasChangesMap[index] = $event
|
208
200
|
}, {
|
209
201
|
default: withCtx(() => [
|
210
202
|
(openBlock(), createBlock(resolveDynamicComponent(slot)))
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useIsInsideTab.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/use/useIsInsideTab.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc;;CAM1B,CAAA"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { inject } from 'vue';
|
2
|
+
import { wTabItemListener } from '../models/injection.js';
|
3
|
+
|
4
|
+
const useIsInsideTab = () => {
|
5
|
+
const tabItemListenerInjected = inject(wTabItemListener, null);
|
6
|
+
return {
|
7
|
+
isInsideTab: tabItemListenerInjected !== null
|
8
|
+
};
|
9
|
+
};
|
10
|
+
|
11
|
+
export { useIsInsideTab };
|