@schemx/vue 0.2.3 → 1.0.0-next.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/README.md +290 -229
- package/dist/analyze.html +1 -1
- package/dist/components/FormGroup/index.d.ts +3 -4
- package/dist/components/FormGroup/index.d.ts.map +1 -1
- package/dist/components/FormItem/index.d.ts +3 -4
- package/dist/components/FormItem/index.d.ts.map +1 -1
- package/dist/config/appConfig.d.ts +19 -0
- package/dist/config/appConfig.d.ts.map +1 -0
- package/dist/config/index.d.ts +2 -0
- package/dist/config/index.d.ts.map +1 -0
- package/dist/form.d.ts +11 -8
- package/dist/form.d.ts.map +1 -1
- package/dist/hocs/withRemoteOptions.d.ts +3 -29
- package/dist/hocs/withRemoteOptions.d.ts.map +1 -1
- package/dist/hooks/index.d.ts +2 -2
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/provideFieldContext.d.ts +1 -2
- package/dist/hooks/provideFormConfigContext.d.ts +24 -19
- package/dist/hooks/provideFormConfigContext.d.ts.map +1 -1
- package/dist/hooks/provideFormContext.d.ts +0 -1
- package/dist/hooks/useDictionary.d.ts +13 -8
- package/dist/hooks/useDictionary.d.ts.map +1 -1
- package/dist/hooks/useEffect.d.ts +0 -1
- package/dist/hooks/useField.d.ts +1 -2
- package/dist/hooks/useField.d.ts.map +1 -1
- package/dist/hooks/useForm.d.ts +2 -3
- package/dist/hooks/useForm.d.ts.map +1 -1
- package/dist/hooks/useStableRef.d.ts +2 -3
- package/dist/hooks/useStableRef.d.ts.map +1 -1
- package/dist/hooks/useViewSchemas.d.ts +16 -2
- package/dist/hooks/useViewSchemas.d.ts.map +1 -1
- package/dist/hooks/useWatch.d.ts +64 -13
- package/dist/hooks/useWatch.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +195 -82
- package/dist/index.mjs.map +1 -1
- package/dist/types/dictionary.d.ts +18 -18
- package/dist/types/dictionary.d.ts.map +1 -1
- package/dist/types/field.d.ts +20 -11
- package/dist/types/field.d.ts.map +1 -1
- package/dist/types/form.d.ts +41 -4
- package/dist/types/form.d.ts.map +1 -1
- package/dist/types/index.d.ts +15 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/utils/diff.d.ts +2 -2
- package/dist/utils/diff.d.ts.map +1 -1
- package/dist/utils/dynamic.d.ts +13 -14
- package/dist/utils/dynamic.d.ts.map +1 -1
- package/dist/utils/equal.d.ts.map +1 -1
- package/dist/utils/helpers.d.ts +5 -6
- package/dist/utils/helpers.d.ts.map +1 -1
- package/dist/utils/rendererProvider.d.ts +2 -3
- package/dist/utils/rendererProvider.d.ts.map +1 -1
- package/dist/utils/rulesProvider.d.ts +5 -6
- package/dist/utils/rulesProvider.d.ts.map +1 -1
- package/dist/utils/slot.d.ts.map +1 -1
- package/dist/utils/validation.d.ts +0 -1
- package/package.json +6 -5
package/dist/hooks/useWatch.d.ts
CHANGED
|
@@ -1,65 +1,116 @@
|
|
|
1
1
|
import { NamePath, Values, CreateWatchOptions, WatchAllCallback, WatchFieldCallback, WatchFieldsCallback } from '@schemx/core';
|
|
2
|
-
|
|
3
2
|
/**
|
|
4
3
|
* 监听所有字段变化
|
|
5
4
|
*
|
|
6
|
-
* @
|
|
5
|
+
* @typeParam TValues - 表单值类型。
|
|
6
|
+
* @param callback - 全局变化回调;payload 为 `{ changedPaths, changedValues, prevValues }`
|
|
7
7
|
* @param options - 监听选项
|
|
8
8
|
* @returns 取消监听函数
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```ts
|
|
12
|
+
* const dispose = useWatch((values, payload) => {
|
|
13
|
+
* const { changedPaths, changedValues, prevValues } = payload
|
|
14
|
+
* console.log(changedPaths, changedValues, prevValues, values)
|
|
15
|
+
* })
|
|
16
|
+
* ```
|
|
9
17
|
*/
|
|
10
|
-
export declare function useWatch<
|
|
18
|
+
export declare function useWatch<TValues extends Values>(callback: WatchAllCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
11
19
|
/**
|
|
12
20
|
* 监听单个字段变化
|
|
13
21
|
*
|
|
22
|
+
* @typeParam TValues - 表单值类型。
|
|
14
23
|
* @param name - 字段路径
|
|
15
|
-
* @param callback -
|
|
24
|
+
* @param callback - 单字段变化回调;payload 为 `{ value, prevValue }`
|
|
16
25
|
* @param options - 监听选项
|
|
17
26
|
* @returns 取消监听函数
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```ts
|
|
30
|
+
* useWatch("email", (_values, payload) => {
|
|
31
|
+
* console.log(payload.prevValue, payload.value)
|
|
32
|
+
* })
|
|
33
|
+
* ```
|
|
18
34
|
*/
|
|
19
|
-
export declare function useWatch<
|
|
35
|
+
export declare function useWatch<TValues extends Values>(name: NamePath<TValues>, callback: WatchFieldCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
20
36
|
/**
|
|
21
37
|
* 监听多个字段变化
|
|
22
38
|
*
|
|
39
|
+
* @typeParam TValues - 表单值类型。
|
|
23
40
|
* @param names - 字段路径数组
|
|
24
|
-
* @param callback -
|
|
41
|
+
* @param callback - 多字段变化回调;payload 为 `{ changedPaths, changedValues, prevValues }`
|
|
25
42
|
* @param options - 监听选项
|
|
26
43
|
* @returns 取消监听函数
|
|
44
|
+
*
|
|
45
|
+
* @example
|
|
46
|
+
* ```ts
|
|
47
|
+
* useWatch(["firstName", "lastName"], (_values, payload) => {
|
|
48
|
+
* console.log(payload.changedPaths, payload.changedValues, payload.prevValues)
|
|
49
|
+
* })
|
|
50
|
+
* ```
|
|
27
51
|
*/
|
|
28
|
-
export declare function useWatch<
|
|
52
|
+
export declare function useWatch<TValues extends Values>(names: NamePath<TValues>[], callback: WatchFieldsCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
29
53
|
/**
|
|
30
54
|
* 监听单个字段变化的便捷方法
|
|
31
55
|
*
|
|
32
56
|
* 等价于 `useWatch(name, callback, options)`,语义更明确。
|
|
33
57
|
* 自动绑定 formContext 并在组件卸载时取消监听。
|
|
34
58
|
*
|
|
59
|
+
* @typeParam TValues - 表单值类型。
|
|
35
60
|
* @param name - 要监听的字段路径
|
|
36
|
-
* @param callback -
|
|
61
|
+
* @param callback - 字段变化回调;payload 为 `{ value, prevValue }`
|
|
37
62
|
* @param options - 可选配置
|
|
38
63
|
* @returns 取消监听函数
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* ```ts
|
|
67
|
+
* useWatchField("email", (_values, payload) => {
|
|
68
|
+
* const { value, prevValue } = payload
|
|
69
|
+
* console.log(prevValue, value)
|
|
70
|
+
* })
|
|
71
|
+
* ```
|
|
39
72
|
*/
|
|
40
|
-
export declare function useWatchField<
|
|
73
|
+
export declare function useWatchField<TValues extends Values = Values>(name: NamePath<TValues>, callback: WatchFieldCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
41
74
|
/**
|
|
42
75
|
* 监听多个字段变化的便捷方法
|
|
43
76
|
*
|
|
44
77
|
* 等价于 `useWatch(names, callback, options)`,语义更明确。
|
|
45
78
|
* 自动绑定 formContext 并在组件卸载时取消监听。
|
|
46
79
|
*
|
|
80
|
+
* @typeParam TValues - 表单值类型。
|
|
47
81
|
* @param names - 要监听的字段路径数组
|
|
48
|
-
* @param callback -
|
|
82
|
+
* @param callback - 字段变化回调;payload 为 `{ changedPaths, changedValues, prevValues }`
|
|
49
83
|
* @param options - 可选配置
|
|
50
84
|
* @returns 取消监听函数
|
|
85
|
+
*
|
|
86
|
+
* @example
|
|
87
|
+
* ```ts
|
|
88
|
+
* useWatchFields(["firstName", "lastName"], (_values, payload) => {
|
|
89
|
+
* const { changedPaths, changedValues, prevValues } = payload
|
|
90
|
+
* console.log(changedPaths, changedValues, prevValues)
|
|
91
|
+
* })
|
|
92
|
+
* ```
|
|
51
93
|
*/
|
|
52
|
-
export declare function useWatchFields<
|
|
94
|
+
export declare function useWatchFields<TValues extends Values>(names: NamePath<TValues>[], callback: WatchFieldsCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
53
95
|
/**
|
|
54
96
|
* 监听所有字段变化的便捷方法
|
|
55
97
|
*
|
|
56
98
|
* 等价于 `useWatch(callback, options)`,语义更明确。
|
|
57
99
|
* 自动绑定 formContext 并在组件卸载时取消监听。
|
|
58
100
|
*
|
|
59
|
-
* @
|
|
101
|
+
* @typeParam TValues - 表单值类型。
|
|
102
|
+
* @param callback - 全局变化回调;payload 为 `{ changedPaths, changedValues, prevValues }`
|
|
60
103
|
* @param options - 可选配置
|
|
61
104
|
* @returns 取消监听函数
|
|
105
|
+
*
|
|
106
|
+
* @example
|
|
107
|
+
* ```ts
|
|
108
|
+
* useWatchAll((_values, payload) => {
|
|
109
|
+
* const { changedPaths, changedValues, prevValues } = payload
|
|
110
|
+
* console.log(changedPaths, changedValues, prevValues)
|
|
111
|
+
* })
|
|
112
|
+
* ```
|
|
62
113
|
*/
|
|
63
|
-
export declare function useWatchAll<
|
|
114
|
+
export declare function useWatchAll<TValues extends Values = Values>(callback: WatchAllCallback<TValues>, options?: CreateWatchOptions): () => void;
|
|
64
115
|
export default useWatch;
|
|
65
116
|
//# sourceMappingURL=useWatch.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWatch.d.ts","sourceRoot":"","sources":["../../src/hooks/useWatch.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AAQH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACpD,OAAO,KAAK,EACV,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,cAAc,CAAA;AAErB
|
|
1
|
+
{"version":3,"file":"useWatch.d.ts","sourceRoot":"","sources":["../../src/hooks/useWatch.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AAQH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACpD,OAAO,KAAK,EACV,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,cAAc,CAAA;AAErB;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,OAAO,SAAS,MAAM,EAC7C,QAAQ,EAAE,gBAAgB,CAAC,OAAO,CAAC,EACnC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAAA;AACb;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,OAAO,SAAS,MAAM,EAC7C,IAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,EACvB,QAAQ,EAAE,kBAAkB,CAAC,OAAO,CAAC,EACrC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAAA;AACb;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,OAAO,SAAS,MAAM,EAC7C,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,EAC1B,QAAQ,EAAE,mBAAmB,CAAC,OAAO,CAAC,EACtC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAAA;AA2Bb;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,aAAa,CAAC,OAAO,SAAS,MAAM,GAAG,MAAM,EAC3D,IAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,EACvB,QAAQ,EAAE,kBAAkB,CAAC,OAAO,CAAC,EACrC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAEZ;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,OAAO,SAAS,MAAM,EACnD,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,EAC1B,QAAQ,EAAE,mBAAmB,CAAC,OAAO,CAAC,EACtC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAEZ;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,WAAW,CAAC,OAAO,SAAS,MAAM,GAAG,MAAM,EACzD,QAAQ,EAAE,gBAAgB,CAAC,OAAO,CAAC,EACnC,OAAO,CAAC,EAAE,kBAAkB,GAC3B,MAAM,IAAI,CAEZ;AAED,eAAe,QAAQ,CAAA"}
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),t=require("classnames"),r=require("@schemx/core"),n=require("es-toolkit"),o=r.createRendererRegistry("input"),s=r.createValidatorsRegistry();function l(t={}){const n={...t,rendererRegistry:t.rendererRegistry??o,validatorRegistry:t.validatorRegistry??s},l=r.createForm(n);return e.onScopeDispose(()=>{l.destroy()}),l}const a=Symbol("schemx:instance");function i(t){e.provide(a,t)}function c(){const t=e.inject(a,null);if(!t)throw new Error("[schemx] useFormContext() must be called inside a <SchemxForm> descendant. Ensure createFormContext(form) is called synchronously during setup().");return t}const u=new WeakMap;const d=t=>{const n=c(),o=t;let s=u.get(n);s||(s=new Map,u.set(n,s));const l=s.get(o);let a;if(l)l.refCount++,a=l;else{const{result:l,dispose:i}=function(t,n){const o=r.createField(t,n),s=e.shallowRef(o.getValue()),l=e.shallowRef(o.getError()),a=e.shallowRef(o.isPending()),i=o.effect(()=>{s.value=o.getValue(),l.value=o.getError(),a.value=o.isPending()}),c=e.computed(()=>l.value),u=e.computed(()=>(s.value,o.isTouched())),d=e.computed(()=>a.value);return{result:{name:n,value:s,error:c,dirty:u,pending:d,...o,getValue:()=>s.value},dispose:i}}(n,t);a={refCount:1,result:l,dispose:i},s.set(o,a)}return e.onUnmounted(()=>{--a.refCount<=0&&(a.dispose(),s.delete(o))}),a.result},m=Symbol("schemx:field");function p(t){e.provide(m,t)}function h(){const t=e.inject(m);if(!t)throw new Error("[schemx] useFieldContext() must be called inside a component tree where createFieldContext(field) has been called.");return t}function f(t,n,o){const s=c(),l=r.createWatch(s,t,n,o);return e.onUnmounted(l),l}function y(e,t,r){return f(e,t,r)}function v(e){return e instanceof Error?e:new Error(String(e))}const g=(t,r)=>{var n;const o=c(),s=e.ref([]),l=e.ref(!1),a=e.ref(void 0);let i=0;const u=async()=>{try{const e=o.getFieldsValue();if("function"==typeof t.shouldFetch&&!t.shouldFetch(e))return s.value=[],void(l.value=!1);l.value=!0,a.value=void 0;const r=++i,n=await(async e=>{const r=t.retryCount??0,n=t.retryInterval??1e3;let s=new Error("Unknown error");for(let a=0;a<=r;a++)try{return await t.api(e,o)}catch(l){s=v(l),a<r&&await new Promise(e=>setTimeout(e,n))}throw s})(e);if(r!==i)return;const c=await(async e=>"function"==typeof(null==t?void 0:t.formatter)?await t.formatter(e,o):e)(n);if(r!==i)return;s.value=c,a.value=void 0,"function"==typeof t.onSuccess&&t.onSuccess(c,o),l.value=!1}catch(e){const r=v(e);a.value=r,s.value=[],l.value=!1,"function"==typeof t.onError&&t.onError(r,o)}};(null==(n=t.dependsOn)?void 0:n.length)&&y(t.dependsOn,(e,n)=>{"function"==typeof t.onDepsChange&&t.onDepsChange(e,o),t.resetOnDepsChange&&r&&o.setFieldValue(r,void 0),u()});const d=t.immediate??!0;return e.onMounted(()=>{d&&u()}),{list:s,loading:l,error:a,loadDict:u,refresh:()=>u(),mutate:e=>{s.value=e}}},x=Symbol("schemx:form-config"),b=["form","modelValue","rendererRegistry","validatorRegistry","defaultRendererType","onFinish","onFinishFailed","onValuesChange","onFieldsChange"],F=t=>{e.provide(x,t)};function C(){const t=e.inject(x);if(!t)throw new Error("[schemx] useFormConfigContext() must be called inside a <SchemxForm> descendant. Ensure createFormConfigContext(props) is called synchronously during setup().");return t}function w(t){const r=e.shallowRef({});return e.watchEffect(()=>{const e=t();((e,t)=>{const r=Object.keys(e),n=Object.keys(t);return r.length===n.length&&r.every(r=>e[r]===t[r])})(r.value,e)||(r.value=e)}),r}function V(t){const r=e.shallowRef(t.getViewSchemas()),n=t.subscribeViewSchemas(e=>{r.value=e});return e.onScopeDispose(n),r}function S(e){return void 0!==e&&(!Array.isArray(e)||0!==e.length)}function R(e,t){if(!t)return!1;return(Array.isArray(t)?t:[t]).some(t=>function(e){return{onBlur:"blur",onChange:"change",onSubmit:"submit",blur:"blur",change:"change",submit:"submit"}[e]??"submit"}(t)===e)}const _=e=>/[A-Z]/.test(e),k=e=>e.includes("-"),E=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),A=e=>e.replace(/-([a-z])/g,(e,t)=>t.toUpperCase()),O=(e,t)=>{if(e[t])return e[t];const r=_(t)?E(t):k(t)?A(t):void 0;return r&&e[r]?e[r]:void 0},j=(e,t)=>{const r={},n=(o=String(e),(k(o)?A(o):o)+":");var o;const s=(e=>_(e)?E(e):e)(String(e))+":";for(const[l,a]of Object.entries(t))l.startsWith(n)?r[l.slice(n.length)]=a:l.startsWith(s)&&s!==n&&(r[l.slice(s.length)]=a);return r},B=e.defineComponent((r,{slots:n})=>{const o=e.ref(Boolean(r.schema.defaultCollapsed)),s=()=>{r.schema.collapsible&&(o.value=!o.value)};return()=>{const l=r.schema,a=Boolean(l.collapsible);return e.createVNode("div",{class:t("schemx-group",{"schemx-group--collapsed":o.value},l.class),style:l.style,"data-key":l.key},[l.label&&e.createVNode("div",{role:a?"button":void 0,tabindex:a?0:void 0,class:t("schemx-group__header",{"schemx-group__header--clickable":a}),onClick:s,onKeydown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),s())}},[e.createVNode("span",{class:"schemx-group__title"},[l.label]),a&&e.createVNode("span",{class:t("schemx-group__arrow",{"schemx-group__arrow--down":!o.value})},null)]),!o.value&&e.createVNode("div",{class:"schemx-group__body"},[l.children.map(t=>e.createVNode(N,{key:t.key,schema:t},n))])])}},{name:"SchemxGroup",props:{schema:{type:Object,required:!0}}}),N=e.defineComponent({name:"SchemxItem",props:{schema:{type:Object,required:!0}},setup:(t,{slots:r})=>()=>{const n=t.schema;return T(n)?e.h(B,{schema:n},r):e.h(P,{schema:n},r)}}),P=e.defineComponent({name:"SchemxFieldItem",props:{schema:{type:Object,required:!0}},setup(r,{slots:n}){const o=e.toRef(r,"schema"),s=c(),l=C(),a=()=>o.value,i=d(a().name);p(i);const u=e.computed(()=>{return e=a().validationTrigger,t=l.validationTrigger,r="onChange",S(e)?e:S(t)?t:r;var e,t,r}),m=e.computed(()=>{const e=a().visible&&!a().readonly&&!a().disabled,t=a().rules,r=Array.isArray(t)?(null==t?void 0:t.length)>0:!!a().rules;return e&&r}),h=e=>{var t,r;i.setValue(e),null==(r=null==(t=a().componentProps)?void 0:t.onChange)||r.call(t,e),m.value&&R("change",u.value)&&i.validate()},f=e=>{var t,r;null==(r=null==(t=a().componentProps)?void 0:t.onBlur)||r.call(t,e),m.value&&R("blur",u.value)&&i.validate()},y=w(()=>{const e=a();return{...e.componentProps,readonly:e.readonly,disabled:e.disabled,placeholder:e.placeholder,formItemProps:e,value:i.getValue(),onChange:h,onBlur:f,"onUpdate:value":e=>i.setValue(e)}}),v=()=>{const t=O(n,`${a().name}Label`);if(t)return t(a());const r=a().labelAlign||l.labelAlign,o=a().labelWidth||l.labelWidth,s=a().colon??l.colon;return e.createVNode("label",{class:"schemx-item__label",style:{width:o,textAlign:r}},[!a().required||a().disabled||a().readonly?null:e.createVNode("span",{class:"schemx-item__required"},[e.createTextVNode("*")]),e.createVNode("span",{class:"schemx-item__label-text"},[a().label,s?":":""])])},g=()=>{const t=s.getRenderer(a().componentType);if(!t)throw new Error(`[schemx] Can not find component renderer of "${a().componentType}".`);const r=j(W(a().name),n),o=e.h(t,y.value,r),l=O(n,`${a().name}Content`);return l?l({...a(),columnElement:o}):e.createVNode("div",{class:"schemx-item__control"},[o])},x=()=>{const t=O(n,`${a().name}Error`);return t?t({...a(),errors:i.error.value}):Array.isArray(i.error.value)&&0!==i.error.value.length?e.createVNode("div",{class:"schemx-item__error"},[i.error.value[0]]):null};return()=>{if(!a().visible)return null;const r=O(n,W(a().name));if(r)return r(a());const o=a().labelPosition||l.labelPosition;return e.createVNode("div",{class:t("schemx-item-wrapper"),style:a().style},[e.createVNode("div",{class:t("schemx-item",`schemx-item--label-${o}`,a().class,{"is-readonly":a().readonly,"is-disabled":a().disabled}),style:{...a().style??{}}},[v(),e.createVNode("div",{class:"schemx-item__content"},[g(),x()])])])}}}),T=e=>"group"===e.componentType,W=e=>Array.isArray(e)?e.map(e=>String(e)).join("."):String(e);function q(e){return!(!e||"group"===e.componentType||"visible"in e&&!1===e.visible)}function D(e,t,r){for(let n=t+r;n>=0&&n<e.length;n+=r)if(q(e[n]))return e[n]}const $=e.defineComponent({name:"SchemxForm",__name:"form",props:{class:{default:""},style:{type:[Boolean,null,String,Object,Array],default:()=>({})},required:{type:Boolean},readonly:{type:Boolean},disabled:{type:Boolean},visible:{type:Boolean,default:!0},labelIcon:{},labelAlign:{},labelPosition:{},labelWidth:{},contentAlign:{},validationTrigger:{},colon:{type:Boolean},modelValue:{default:()=>({})},initialValues:{default:()=>({})},schemas:{default:()=>[]},form:{default:void 0},rendererRegistry:{default:void 0},defaultRendererType:{},validatorRegistry:{default:void 0},onFinish:{type:Function,default:void 0},onFinishFailed:{type:Function,default:void 0},onValuesChange:{type:Function,default:void 0},onFieldsChange:{type:Function,default:void 0}},emits:["update:modelValue"],setup(t,{expose:o,emit:s}){const a=t,c=s;F(n.omit(a,b));const u=a.form?a.form:l({schemas:a.schemas,initialValues:Object.keys(a.modelValue).length>0?a.modelValue:a.initialValues,rendererRegistry:a.rendererRegistry,defaultRendererType:a.defaultRendererType,validatorRegistry:a.validatorRegistry,readonly:a.readonly,disabled:a.disabled,onFinish:async e=>{var t;null==(t=a.onFinish)||t.call(a,e)},onFinishFailed:async e=>{var t;null==(t=a.onFinishFailed)||t.call(a,e)},onValuesChange:(e,t)=>{var r;null==(r=a.onValuesChange)||r.call(a,e,t)},onFieldsChange:(e,t)=>{var r;null==(r=a.onFieldsChange)||r.call(a,e,t)}});i(u);let d=!1;e.watch(()=>a.modelValue,e=>{d=!0,u.setFieldsValue(e),d=!1});const m=r.createWatch(u,e=>{d||c("update:modelValue",e)});e.onUnmounted(m),e.watch(()=>a.schemas,e=>{u.setSchemas(e)},{deep:!1,immediate:!!a.form});const p=V(u),h=e=>{const{isFirst:t,isLast:r}=function(e,t){const r=e.findIndex(e=>e.key===t);return-1===r?{found:!1,isFirst:!1,isLast:!1}:q(e[r])?{found:!0,isFirst:!D(e,r,-1),isLast:!D(e,r,1)}:{found:!0,isFirst:!1,isLast:!1}}(p.value,e.key);return{"schemx-item-wrapper--first":t,"schemx-item-wrapper--last":r}};return e.watchEffect(()=>{u.updateDefaultProps(a)}),o({...u}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["schemx",a.class]),style:e.normalizeStyle(a.style)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),r=>(e.openBlock(),e.createBlock(e.unref(N),{key:r.key,schema:r,class:e.normalizeClass(h(r))},e.createSlots({_:2},[e.renderList(t.$slots,(r,n)=>({name:n,fn:e.withCtx(r=>[e.renderSlot(t.$slots,n,e.mergeProps({ref_for:!0},r??{}))])}))]),1032,["schema","class"]))),128))],6))}});const I=(L=$,U={install(e,t){e.component("SchemxForm",$)},FormItem:N},Object.assign(L,U));var L,U;exports.FormGroup=B,exports.FormItem=N,exports.WithRemoteOptions=function(t){return e.defineComponent({name:`WithRemoteOptions(${t.name||"Anonymous"})`,inheritAttrs:!1,props:{dict:{type:Object,default:void 0},fieldName:{type:[String,Array],default:void 0}},setup(r,{attrs:n,slots:o}){const s=r.fieldName??(r.dict?h().name:void 0),l=r.dict?g(r.dict,s):null,a=e.computed(()=>({...n,dict:r.dict,options:r.dict?null==l?void 0:l.list.value:n.options,loading:r.dict?null==l?void 0:l.loading.value:n.loading}));return()=>e.h(t,a.value,o)}})},exports.createFieldContext=p,exports.createFormConfigContext=F,exports.createFormContext=i,exports.default=I,exports.formConfigContextOmitKey=b,exports.rendererRegistry=o,exports.schemxForm=I,exports.useDictionary=g,exports.useEffect=function(t){const n=r.createEffect(t);return e.onUnmounted(n),n},exports.useField=d,exports.useFieldContext=h,exports.useForm=l,exports.useFormConfigContext=C,exports.useFormContext=c,exports.useStableRef=w,exports.useViewSchemas=V,exports.useWatch=f,exports.useWatchAll=function(e,t){return f(e,t)},exports.useWatchField=function(e,t,r){return f(e,t,r)},exports.useWatchFields=y,exports.validatorRegistry=s,Object.keys(r).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>r[e]})});
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),t=require("classnames"),r=require("@schemx/core"),n=require("es-toolkit"),o=Symbol("schemx:app-config"),a=Object.freeze({schemaConfig:Object.freeze({}),validatorAdapters:Object.freeze([])});function s(e,t={}){const r=function(e){const t=Object.freeze({...e.schemaConfig??{}}),r=Object.freeze([...e.validatorAdapters??[]]);return Object.freeze({schemaConfig:t,validatorAdapters:r,defaultRendererType:e.defaultRendererType,rendererRegistry:e.rendererRegistry,validationRuleRegistry:e.validationRuleRegistry})}(t);e.provide(o,r)}const l=r.createRendererRegistry("input"),i=r.createValidationRuleRegistry();function c(t={}){const n=r.mergeSchemxConfig(function(e){const{schemaConfig:t={},validatorAdapters:r=[],defaultRendererType:n,rendererRegistry:o,validationRuleRegistry:a,...s}=e;return{schemaConfig:t,defaultRendererType:n,rendererRegistry:o,validationRuleRegistry:a,validatorAdapters:r}}(t),null===e.getCurrentInstance()?a:e.inject(o,a),{rendererRegistry:l,validationRuleRegistry:i}),s={...t,...n},c=r.createForm(s);return e.onScopeDispose(()=>{c.destroy()}),c}const d=Symbol("schemx:instance");function u(t){e.provide(d,t)}function m(){const t=e.inject(d,null);if(!t)throw new Error("[schemx] useFormContext() must be called inside a <SchemxForm> descendant. Ensure createFormContext(form) is called synchronously during setup().");return t}const p=new WeakMap;const h=t=>{const n=m(),o=t;let a=p.get(n);a||(a=new Map,p.set(n,a));const s=a.get(o);let l;if(s)s.refCount++,l=s;else{const{result:s,dispose:i}=function(t,n){const o=r.createField(t,n),a=e.shallowRef(o.getValue()),s=e.shallowRef(o.getErrors()),l=e.shallowRef(o.isPending()),i=o.effect(()=>{a.value=o.getValue(),s.value=o.getErrors(),l.value=o.isPending()}),c=e.computed(()=>s.value),d=e.computed(()=>(a.value,o.isTouched())),u=e.computed(()=>l.value);return{result:{name:n,value:a,errors:c,dirty:d,pending:u,...o,getValue:()=>a.value},dispose:i}}(n,t);l={refCount:1,result:s,dispose:i},a.set(o,l)}return e.onUnmounted(()=>{--l.refCount<=0&&(l.dispose(),a.delete(o))}),l.result},f=Symbol("schemx:field");function v(t){e.provide(f,t)}function y(){const t=e.inject(f);if(!t)throw new Error("[schemx] useFieldContext() must be called inside a component tree where createFieldContext(field) has been called.");return t}function g(t,n,o){const a=m(),s=r.createWatch(a,t,n,o);return e.onUnmounted(s),s}function b(e,t,r){return g(e,t,r)}function x(e){return e instanceof Error?e:new Error(String(e))}const C=(t,r)=>{var n;const o=m(),a=e.shallowRef([]),s=e.ref(!1),l=e.ref(void 0);let i=0;const c=async()=>{try{const e=o.getFieldsValue();if("function"==typeof t.shouldFetch&&!t.shouldFetch(e))return a.value=[],void(s.value=!1);s.value=!0,l.value=void 0;const r=++i,n=await(async e=>{const r=t.retryCount??0,n=t.retryInterval??1e3;let a=new Error("Unknown error");for(let l=0;l<=r;l++)try{return await t.api(e,o)}catch(s){a=x(s),l<r&&await new Promise(e=>setTimeout(e,n))}throw a})(e);if(r!==i)return;const c=await(async e=>{if("function"==typeof(null==t?void 0:t.formatter))return await t.formatter(e,o);if(!Array.isArray(e))throw new Error("[schemx] Dictionary api must return an array when formatter is not provided.");return e})(n);if(r!==i)return;a.value=c,l.value=void 0,"function"==typeof t.onSuccess&&t.onSuccess(c,o),s.value=!1}catch(e){const r=x(e);l.value=r,a.value=[],s.value=!1,"function"==typeof t.onError&&t.onError(r,o)}};(null==(n=t.dependsOn)?void 0:n.length)&&b(t.dependsOn,(e,n)=>{"function"==typeof t.onDepsChange&&t.onDepsChange(e,o),t.resetOnDepsChange&&r&&o.setFieldValue(r,void 0),c()});const d=t.immediate??!0;return e.onMounted(()=>{d&&c()}),{list:a,loading:s,error:l,loadDict:c,refresh:()=>c(),mutate:e=>{a.value=e}}},F=Symbol("schemx:form-config"),R=t=>{e.provide(F,t)};function w(){const t=e.inject(F);if(!t)throw new Error("[schemx] useFormConfigContext() must be called inside a <SchemxForm> descendant. Ensure createFormConfigContext(props) is called synchronously during setup().");return t}function V(t){const r=e.shallowRef({});return e.watchEffect(()=>{const e=t();((e,t)=>{const r=Object.keys(e),n=Object.keys(t);return r.length===n.length&&r.every(r=>e[r]===t[r])})(r.value,e)||(r.value=e)}),r}function S(t){const r=e.shallowRef(t.getViewSchemas()),n=t.subscribeViewSchemas(e=>{r.value=e});return e.onScopeDispose(n),r}function A(e){return void 0!==e&&(!Array.isArray(e)||0!==e.length)}function _(e,t){if(!t)return!1;return(Array.isArray(t)?t:[t]).some(t=>function(e){return{onBlur:"blur",onChange:"change",onSubmit:"submit",blur:"blur",change:"change",submit:"submit"}[e]??"submit"}(t)===e)}const k=e=>/[A-Z]/.test(e),O=e=>e.includes("-"),j=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),E=e=>e.replace(/-([a-z])/g,(e,t)=>t.toUpperCase()),B=(e,t)=>{if(e[t])return e[t];const r=k(t)?j(t):O(t)?E(t):void 0;return r&&e[r]?e[r]:void 0},N=(e,t)=>{const r={},n=(o=String(e),(O(o)?E(o):o)+":");var o;const a=(e=>k(e)?j(e):e)(String(e))+":";for(const[s,l]of Object.entries(t))s.startsWith(n)?r[s.slice(n.length)]=l:s.startsWith(a)&&a!==n&&(r[s.slice(a.length)]=l);return r},T=e.defineComponent((r,{slots:n})=>{var o;const a=e.ref(Boolean(r.schema.defaultCollapsed)),s=e.computed(()=>r.schema.collapsed??a.value),l=(null==(o=e.getCurrentInstance())?void 0:o.uid)??0;e.watch(()=>r.schema.collapsed,(e,t)=>{void 0!==e?a.value=e:void 0!==t&&(a.value=t)});const i=()=>{var e,t;if(!r.schema.collapsible||r.schema.disabled)return;const n=!s.value;void 0===r.schema.collapsed&&(a.value=n),null==(t=(e=r.schema).onCollapsedChange)||t.call(e,n)};return()=>{var o;const a=r.schema;if(!1===a.visible)return null;const c=Boolean(a.collapsible),d=s.value,u=a.destroyOnCollapse??!0,m=`schemx-group-${(null==(o=a.debug)?void 0:o.runtimeNodeId)??`local-${l}`}-${P(a.key)}`,p=`${m}-header`,h=`${m}-body`,f=e.createVNode("div",{id:h,role:"group","aria-labelledby":a.label?p:void 0,"aria-hidden":d||void 0,class:"schemx-group__body",style:!u&&d?{display:"none"}:void 0},[a.children.map(t=>e.createVNode(W,{key:t.key,schema:t},n))]);return e.createVNode("div",{class:t("schemx-group",{"schemx-group--collapsed":d,"is-readonly":a.readonly,"is-disabled":a.disabled},a.class),style:a.style,"data-key":a.key,"aria-disabled":a.disabled||void 0},[a.label&&e.createVNode("div",{id:p,role:c?"button":void 0,tabindex:c?a.disabled?-1:0:void 0,"aria-expanded":c?!d:void 0,"aria-controls":c?h:void 0,"aria-disabled":c&&a.disabled||void 0,class:t("schemx-group__header",{"schemx-group__header--clickable":c&&!a.disabled}),onClick:i,onKeydown:e=>{a.disabled||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),i())}},[e.createVNode("span",{class:"schemx-group__title"},[a.label]),c&&e.createVNode("span",{class:t("schemx-group__arrow",{"schemx-group__arrow--down":!d})},null)]),u?!d&&f:f])}},{name:"SchemxGroup",props:{schema:{type:Object,required:!0}}}),P=e=>String(e).replace(/[^a-zA-Z0-9_-]/g,"-"),W=e.defineComponent({name:"SchemxItem",props:{schema:{type:Object,required:!0}},setup:(t,{slots:r})=>()=>{const n=t.schema;return q(n)?e.h(T,{schema:n},r):e.h($,{schema:n},r)}}),$=e.defineComponent({name:"SchemxFieldItem",props:{schema:{type:Object,required:!0}},setup(r,{slots:n}){const o=e.toRef(r,"schema"),a=m(),s=w(),l=()=>o.value,i=h(l().name);v(i);const c=e.computed(()=>{return e=l().validationTrigger,t=s.schemaConfig.validationTrigger,r="onChange",A(e)?e:A(t)?t:r;var e,t,r}),d=e.computed(()=>{const e=l().visible&&!l().readonly&&!l().disabled,t=l().rules,r=Array.isArray(t)?(null==t?void 0:t.length)>0:!!l().rules;return e&&(Boolean(l().required)||r)}),u=e=>{var t,r;i.setValue(e),null==(r=null==(t=l().componentProps)?void 0:t.onChange)||r.call(t,e),d.value&&_("change",c.value)&&i.validate()},p=e=>{var t,r;null==(r=null==(t=l().componentProps)?void 0:t.onBlur)||r.call(t,e),d.value&&_("blur",c.value)&&i.validate()},f=V(()=>{const e=l();return{...e.componentProps,readonly:e.readonly,disabled:e.disabled,placeholder:e.placeholder,formItemProps:e,value:i.getValue(),onChange:u,onBlur:p,"onUpdate:value":e=>i.setValue(e)}}),y=()=>{const t=B(n,`${l().name}Label`);if(t)return t(l());const r=l().labelAlign||s.schemaConfig.labelAlign,o=l().labelWidth||s.schemaConfig.labelWidth,a=l().colon??s.schemaConfig.colon;return e.createVNode("label",{class:"schemx-item__label",style:{width:o,textAlign:r}},[!(l().showRequiredMark??Boolean(l().required))||l().disabled||l().readonly?null:e.createVNode("span",{class:"schemx-item__required"},[e.createTextVNode("*")]),e.createVNode("span",{class:"schemx-item__label-text"},[l().label,a?":":""])])},g=()=>{const t=a.getRenderer(l().componentType);if(!t)throw new Error(`[schemx] Can not find component renderer of "${l().componentType}".`);const r=N(z(l().name),n),o=e.h(t,f.value,r),s=B(n,`${l().name}Content`);return s?s({...l(),columnElement:o}):e.createVNode("div",{class:"schemx-item__control"},[o])},b=()=>{const t=B(n,`${l().name}Error`);return t?t({...l(),errors:i.errors.value}):0===i.errors.value.length?null:e.createVNode("div",{class:"schemx-item__error"},[i.errors.value[0]])};return()=>{if(!l().visible)return null;const r=B(n,z(l().name));if(r)return r(l());const o=l().labelPosition||s.schemaConfig.labelPosition;return e.createVNode("div",{class:t("schemx-item-wrapper"),style:l().style},[e.createVNode("div",{class:t("schemx-item",`schemx-item--label-${o}`,l().class,{"is-readonly":l().readonly,"is-disabled":l().disabled}),style:{...l().style??{}}},[y(),e.createVNode("div",{class:"schemx-item__content"},[g(),b()])])])}}}),q=e=>"children"in e,z=e=>Array.isArray(e)?e.map(e=>String(e)).join("."):String(e);function I(e){return!!e&&"children"in e}function D(e){return!!e&&!I(e)&&!1!==e.visible}function L(e,t,r){for(let n=t+r;n>=0&&n<e.length;n+=r){const t=e[n];if(!1!==t.visible){if(I(t))return!1;if(D(t))return!0}}return!1}const M=e.defineComponent({name:"SchemxForm",__name:"form",props:{schemas:{default:()=>[]},initialValues:{default:()=>({})},modelValue:{default:()=>({})},form:{default:void 0},class:{default:""},style:{type:[Boolean,null,String,Object,Array],default:()=>({})},validatorAdapters:{},defaultRendererType:{},rendererRegistry:{default:void 0},validationRuleRegistry:{default:void 0},onRuleError:{},onFinish:{type:Function,default:void 0},onFinishFailed:{type:Function,default:void 0},onValuesChange:{type:Function,default:void 0},onFieldsChange:{type:Function,default:void 0},lifecycleHooks:{},required:{type:[Boolean,Object]},readonly:{type:Boolean},disabled:{type:Boolean},visible:{type:Boolean,default:!0},labelIcon:{},labelAlign:{},labelPosition:{},labelWidth:{},contentAlign:{},validationTrigger:{},colon:{type:Boolean},showRequiredMark:{type:Boolean}},emits:["update:modelValue"],setup(t,{expose:o,emit:a}){const s=t,l=a,i=()=>n.pick(s,r.defaultSchemxConfigKeys),d=e.reactive(i());R({schemaConfig:d});const m=s.form?s.form:c({schemas:s.schemas,schemaConfig:i(),initialValues:Object.keys(s.modelValue).length>0?s.modelValue:s.initialValues,rendererRegistry:s.rendererRegistry,defaultRendererType:s.defaultRendererType,validationRuleRegistry:s.validationRuleRegistry,validatorAdapters:s.validatorAdapters,onFinish:async e=>{var t;null==(t=s.onFinish)||t.call(s,e)},onFinishFailed:async e=>{var t;null==(t=s.onFinishFailed)||t.call(s,e)},onValuesChange:(e,t)=>{var r;null==(r=s.onValuesChange)||r.call(s,e,t)},onFieldsChange:(e,t)=>{var r;null==(r=s.onFieldsChange)||r.call(s,e,t)}});u(m);let p=!1;e.watch(()=>s.modelValue,e=>{p=!0,m.setFieldsValue(e),p=!1});const h=r.createWatch(m,e=>{p||l("update:modelValue",e)});e.onUnmounted(h),e.watch(()=>s.schemas,e=>{r.isSchemxSchemas(e)||m.setSchemas(e)},{deep:!1,immediate:!!s.form});const f=S(m),v=e=>{const{isFirst:t,isLast:r}=function(e,t){const r=e.findIndex(e=>e.key===t);return-1===r?{found:!1,isFirst:!1,isLast:!1}:D(e[r])?{found:!0,isFirst:!L(e,r,-1),isLast:!L(e,r,1)}:{found:!0,isFirst:!1,isLast:!1}}(f.value,e.key);return{"schemx-item-wrapper--first":t,"schemx-item-wrapper--last":r}};return e.watchEffect(()=>{const e=i();Object.assign(d,e),m.updateSchemaConfig(e)}),o({...m}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["schemx",s.class]),style:e.normalizeStyle(s.style)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(f),r=>(e.openBlock(),e.createBlock(e.unref(W),{key:r.key,schema:r,class:e.normalizeClass(v(r))},e.createSlots({_:2},[e.renderList(t.$slots,(r,n)=>({name:n,fn:e.withCtx(r=>[e.renderSlot(t.$slots,n,e.mergeProps({ref_for:!0},r??{}))])}))]),1032,["schema","class"]))),128))],6))}});const U=(Z=M,G={install(e,t={}){s(e,t),e.component("SchemxForm",M)},FormItem:W},Object.assign(Z,G));var Z,G;exports.FormGroup=T,exports.FormItem=W,exports.WithRemoteOptions=function(t){return e.defineComponent({name:`WithRemoteOptions(${t.name||"Anonymous"})`,inheritAttrs:!1,props:{dict:{type:Object,default:void 0},fieldName:{type:[String,Array],default:void 0}},setup(r,{attrs:n,slots:o}){const a=r.fieldName??(r.dict?y().name:void 0),s=r.dict?C(r.dict,a):null,l=e.computed(()=>({...n,dict:r.dict,options:r.dict?null==s?void 0:s.list.value:n.options,loading:r.dict?null==s?void 0:s.loading.value:n.loading}));return()=>e.h(t,l.value,o)}})},exports.createFieldContext=v,exports.createFormConfigContext=R,exports.createFormContext=u,exports.default=U,exports.rendererRegistry=l,exports.schemxForm=U,exports.useDictionary=C,exports.useEffect=function(t){const n=r.createEffect(t);return e.onUnmounted(n),n},exports.useField=h,exports.useFieldContext=y,exports.useForm=c,exports.useFormConfigContext=w,exports.useFormContext=m,exports.useStableRef=V,exports.useViewSchemas=S,exports.useWatch=g,exports.useWatchAll=function(e,t){return g(e,t)},exports.useWatchField=function(e,t,r){return g(e,t,r)},exports.useWatchFields=b,exports.validationRuleRegistry=i,Object.keys(r).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>r[e]})});
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|