@xbeeant/form-engine-react 0.0.3 → 0.0.4
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/cjs/components/FormController.cjs +1 -1
- package/dist/cjs/components/NexusField.cjs +1 -1
- package/dist/cjs/components/NexusForm.cjs +1 -1
- package/dist/cjs/components/form-controller.cjs +1 -0
- package/dist/cjs/components/nexus-field.cjs +1 -0
- package/dist/cjs/components/nexus-form-provider.cjs +1 -0
- package/dist/cjs/components/nexus-form.cjs +1 -0
- package/dist/cjs/components/nexus-layout.cjs +1 -0
- package/dist/cjs/components/nexus-object.cjs +1 -0
- package/dist/cjs/contexts/field-inherit-context.cjs +1 -0
- package/dist/cjs/contexts/grid-context.cjs +1 -0
- package/dist/cjs/contexts/layout-config-context.cjs +1 -0
- package/dist/cjs/contexts/nexus-context.cjs +1 -0
- package/dist/cjs/hooks/index.cjs +1 -1
- package/dist/cjs/hooks/use-engine.cjs +1 -0
- package/dist/cjs/hooks/use-field-state.cjs +1 -0
- package/dist/cjs/hooks/use-field-validator.cjs +1 -0
- package/dist/cjs/hooks/use-field-value.cjs +1 -0
- package/dist/cjs/hooks/use-form-config.cjs +1 -0
- package/dist/cjs/hooks/use-form-data.cjs +1 -0
- package/dist/cjs/hooks/use-form-submitting.cjs +1 -0
- package/dist/cjs/hooks/use-form.cjs +1 -0
- package/dist/cjs/hooks/use-nexus-context.cjs +1 -0
- package/dist/cjs/hooks/use-watch-all.cjs +1 -0
- package/dist/cjs/hooks/use-watch-multiple.cjs +1 -0
- package/dist/cjs/hooks/use-watch-state.cjs +1 -0
- package/dist/cjs/hooks/use-watch.cjs +1 -0
- package/dist/cjs/hooks/useFormData.cjs +1 -1
- package/dist/cjs/hooks/useFormSubmitting.cjs +1 -0
- package/dist/cjs/index.cjs +1 -1
- package/dist/cjs/styles.css +1 -1
- package/dist/cjs/utils/omit-nil.cjs +1 -0
- package/dist/cjs/utils/omitNil.cjs +1 -0
- package/dist/cjs/utils/persist.cjs +1 -0
- package/dist/cjs/utils/render-tree-node.cjs +1 -0
- package/dist/cjs/utils/resolve-col-span.cjs +1 -0
- package/dist/es/components/FormController.d.ts +73 -19
- package/dist/es/components/FormController.js +222 -71
- package/dist/es/components/NexusField.js +25 -21
- package/dist/es/components/NexusForm.d.ts +33 -3
- package/dist/es/components/NexusForm.js +143 -96
- package/dist/es/components/form-controller.d.ts +129 -0
- package/dist/es/components/form-controller.js +310 -0
- package/dist/es/components/nexus-field.d.ts +9 -0
- package/dist/es/components/nexus-field.js +131 -0
- package/dist/es/components/nexus-form-provider.d.ts +12 -0
- package/dist/es/components/nexus-form-provider.js +18 -0
- package/dist/es/components/nexus-form.d.ts +114 -0
- package/dist/es/components/nexus-form.js +174 -0
- package/dist/es/components/nexus-layout.d.ts +9 -0
- package/dist/es/components/nexus-layout.js +48 -0
- package/dist/es/components/nexus-object.d.ts +16 -0
- package/dist/es/components/nexus-object.js +64 -0
- package/dist/es/contexts/NexusContext.d.ts +2 -0
- package/dist/es/contexts/field-inherit-context.d.ts +18 -0
- package/dist/es/contexts/field-inherit-context.js +5 -0
- package/dist/es/contexts/grid-context.d.ts +5 -0
- package/dist/es/contexts/grid-context.js +5 -0
- package/dist/es/contexts/layout-config-context.d.ts +4 -0
- package/dist/es/contexts/layout-config-context.js +5 -0
- package/dist/es/contexts/nexus-context.d.ts +29 -0
- package/dist/es/contexts/nexus-context.js +12 -0
- package/dist/es/hooks/index.d.ts +12 -11
- package/dist/es/hooks/index.js +20 -18
- package/dist/es/hooks/use-engine.d.ts +2 -0
- package/dist/es/hooks/use-engine.js +8 -0
- package/dist/es/hooks/use-field-state.d.ts +7 -0
- package/dist/es/hooks/use-field-state.js +13 -0
- package/dist/es/hooks/use-field-validator.d.ts +40 -0
- package/dist/es/hooks/use-field-validator.js +35 -0
- package/dist/es/hooks/use-field-value.d.ts +6 -0
- package/dist/es/hooks/use-field-value.js +13 -0
- package/dist/es/hooks/use-form-config.d.ts +5 -0
- package/dist/es/hooks/use-form-config.js +8 -0
- package/dist/es/hooks/use-form-data.d.ts +6 -0
- package/dist/es/hooks/use-form-data.js +13 -0
- package/dist/es/hooks/use-form-submitting.d.ts +7 -0
- package/dist/es/hooks/use-form-submitting.js +11 -0
- package/dist/es/hooks/use-form.d.ts +22 -0
- package/dist/es/hooks/use-form.js +12 -0
- package/dist/es/hooks/use-nexus-context.d.ts +11 -0
- package/dist/es/hooks/use-nexus-context.js +12 -0
- package/dist/es/hooks/use-watch-all.d.ts +19 -0
- package/dist/es/hooks/use-watch-all.js +29 -0
- package/dist/es/hooks/use-watch-multiple.d.ts +20 -0
- package/dist/es/hooks/use-watch-multiple.js +29 -0
- package/dist/es/hooks/use-watch-state.d.ts +18 -0
- package/dist/es/hooks/use-watch-state.js +19 -0
- package/dist/es/hooks/use-watch.d.ts +25 -0
- package/dist/es/hooks/use-watch.js +20 -0
- package/dist/es/hooks/useForm.d.ts +11 -4
- package/dist/es/hooks/useFormData.js +9 -9
- package/dist/es/hooks/useFormSubmitting.d.ts +7 -0
- package/dist/es/hooks/useFormSubmitting.js +11 -0
- package/dist/es/index.d.ts +26 -24
- package/dist/es/index.js +36 -32
- package/dist/es/styles.css +1 -1
- package/dist/es/utils/omit-nil.d.ts +9 -0
- package/dist/es/utils/omit-nil.js +14 -0
- package/dist/es/utils/omitNil.d.ts +9 -0
- package/dist/es/utils/omitNil.js +14 -0
- package/dist/es/utils/persist.d.ts +24 -0
- package/dist/es/utils/persist.js +43 -0
- package/dist/es/utils/render-tree-node.d.ts +6 -0
- package/dist/es/utils/render-tree-node.js +17 -0
- package/dist/es/utils/resolve-col-span.d.ts +5 -0
- package/dist/es/utils/resolve-col-span.js +9 -0
- package/dist/umd/index.css +1 -1
- package/dist/umd/index.umd.cjs +1 -1
- package/package.json +5 -4
- package/src/components/form-controller.ts +584 -0
- package/src/components/{NexusField.tsx → nexus-field.tsx} +57 -6
- package/src/components/{NexusFormProvider.tsx → nexus-form-provider.tsx} +3 -3
- package/src/components/{NexusForm.tsx → nexus-form.tsx} +135 -18
- package/src/components/{NexusLayout.tsx → nexus-layout.tsx} +5 -5
- package/src/components/{NexusObject.tsx → nexus-object.tsx} +3 -3
- package/src/contexts/{NexusContext.ts → nexus-context.ts} +3 -1
- package/src/hooks/index.ts +12 -11
- package/src/hooks/{useEngine.ts → use-engine.ts} +1 -1
- package/src/hooks/{useFieldState.ts → use-field-state.ts} +1 -1
- package/src/hooks/{useFieldValidator.ts → use-field-validator.ts} +1 -1
- package/src/hooks/{useFieldValue.ts → use-field-value.ts} +1 -1
- package/src/hooks/{useFormConfig.ts → use-form-config.ts} +2 -2
- package/src/hooks/{useFormData.ts → use-form-data.ts} +4 -4
- package/src/hooks/use-form-submitting.ts +16 -0
- package/src/hooks/{useForm.ts → use-form.ts} +12 -5
- package/src/hooks/{useNexusContext.ts → use-nexus-context.ts} +2 -2
- package/src/index.ts +26 -24
- package/src/utils/omit-nil.ts +24 -0
- package/src/utils/persist.ts +88 -0
- package/src/utils/{renderTreeNode.tsx → render-tree-node.tsx} +3 -3
- package/src/utils/{resolveColSpan.ts → resolve-col-span.ts} +1 -1
- package/dist/cjs/tailwind.css +0 -1
- package/dist/es/tailwind.css +0 -1
- package/src/components/FormController.ts +0 -278
- /package/src/contexts/{FieldInheritContext.ts → field-inherit-context.ts} +0 -0
- /package/src/contexts/{GridContext.ts → grid-context.ts} +0 -0
- /package/src/contexts/{LayoutConfigContext.ts → layout-config-context.ts} +0 -0
- /package/src/hooks/{useWatchAll.ts → use-watch-all.ts} +0 -0
- /package/src/hooks/{useWatchMultiple.ts → use-watch-multiple.ts} +0 -0
- /package/src/hooks/{useWatchState.ts → use-watch-state.ts} +0 -0
- /package/src/hooks/{useWatch.ts → use-watch.ts} +0 -0
package/dist/umd/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}:root,:host{--color-red-500:oklch(63.7% .237 25.331);--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--font-weight-bold:700;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}.visible{visibility:visible}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.rotate-0{rotate:0deg}.rotate-90{rotate:90deg}.cursor-pointer{cursor:pointer}.gap-1{gap:var(--spacing)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.border-none{--tw-border-style:none;border-style:none}.bg-transparent{background-color:#0000}.p-0{padding:0}.align-middle{vertical-align:middle}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-red-500{color:var(--color-red-500)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.select-none{-webkit-user-select:none;user-select:none}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}
|
|
1
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}:root,:host{--color-red-500:oklch(63.7% .237 25.331);--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--font-weight-bold:700;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}.visible{visibility:visible}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.rotate-0{rotate:0deg}.rotate-90{rotate:90deg}.cursor-pointer{cursor:pointer}.gap-1{gap:var(--spacing)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.border-none{--tw-border-style:none;border-style:none}.bg-transparent{background-color:#0000}.p-0{padding:0}.align-middle{vertical-align:middle}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-red-500{color:var(--color-red-500)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.select-none{-webkit-user-select:none;user-select:none}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}
|
package/dist/umd/index.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(c,x){typeof exports=="object"&&typeof module<"u"?x(exports,require("@xbeeant/form-engine"),require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","@xbeeant/form-engine","react/jsx-runtime","react"],x):(c=typeof globalThis<"u"?globalThis:c||self,x(c.NexusFormEngineReact={},c.formEngine,c.jsxRuntime,c.react))})(this,(function(c,x,a,s){"use strict";class J{engine;formElementRef;getOnFinish;getOnFinishFailed;removeHiddenData=!0;watchers=new Map;globalWatcher=null;constructor(t){this.engine=t??new x.NexusEngine,this.engine.hasPlugin("async-validator")||this.engine.use(new x.AsyncValidatorPlugin(this.engine)),this.formElementRef={current:null},this.getOnFinish=()=>()=>{},this.getOnFinishFailed=()=>()=>{}}_bind(t,i,r){this.formElementRef.current=t,this.getOnFinish=i,this.getOnFinishFailed=r,this.engine.registerOnFieldValueChange((l,n)=>this._onFieldValueChange(l,n))}_syncConfig(t){if(t.removeHiddenData!==void 0&&(this.removeHiddenData=t.removeHiddenData),t.watch){this.watchers.clear(),this.globalWatcher=null;for(const[i,r]of Object.entries(t.watch))i==="#"?this.globalWatcher=r:this.watchers.set(i,r)}}_onFieldValueChange(t,i){const r=this.engine.getFormData(),l=this.removeHiddenData?r:this.engine.getAllFormData();this.globalWatcher&&this.globalWatcher(l,l,t);const n=this.watchers.get(t);n&&n(i,l)}_getEngine(){return this.engine}getEngine(){return this.engine}async submit(){const t=await this.engine.validate();if(t.size>0){this.focusFirstError(t),this.getOnFinishFailed()?.(t);return}const i=this.removeHiddenData?this.engine.getFormData():this.engine.getAllFormData();await this.getOnFinish()?.(i)}focusFirstError(t){const i=this.formElementRef.current;if(!i||t.size===0)return;const r=new Set(t.keys());requestAnimationFrame(()=>{const n=i.querySelectorAll("[data-nexus-field]");for(const o of Array.from(n)){const u=o.getAttribute("data-nexus-field");if(!u||!r.has(u))continue;o.scrollIntoView({behavior:"smooth",block:"center"}),o.querySelector('input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])')?.focus();return}})}resetFields(){this.engine.reset()}setErrorFields(t){this.engine.setErrorFields(t)}setValues(t){this.engine.setFieldValues(t)}setValueByPath(t,i){this.engine.setFieldValue(t,i)}setSchemaByPath(t,i){this.engine.setSchemaByPath(t,i)}setSchema(t){this.engine.setSchema(t)}getValues(t){return this.engine.getFormData(t)}getHiddenValues(){return this.engine.getHiddenValues()}getAllValues(){return this.engine.getAllFormData()}getValueByPath(t){return this.engine.getFieldValue(t)}registerValidator(t,i){this.engine.registerFieldValidator(t,i)}unregisterValidator(t,i){this.engine.unregisterFieldValidator(t,i)}revalidateField(t){this.engine.validateField(t,{trigger:"change"})}getSchema(){return this.engine.getSchema()}removeErrorField(t){this.engine.removeErrorField(t)}scrollToPath(t){this.formElementRef.current?.querySelector(`[data-nexus-field="${t}"]`)?.scrollIntoView({behavior:"smooth",block:"center"})}getFieldError(t){return this.engine.getFieldError(t)}getFieldsError(){return this.engine.getFieldsError()}validateFields(t){return this.engine.validate(t)}getFieldState(t){return this.engine.getFieldState(t)}}const k=s.createContext({}),P=s.createContext(null),j=s.createContext({}),B=s.createContext(null);function V(){const e=s.useContext(B);if(!e)throw new Error("[NexusField] Must be used within <NexusFormProvider>");return e}function I(e,t){if(e!==void 0)return e;if(t&&t.column>0)return Math.max(1,Math.round(t.column/24))}function K({dataPath:e,layoutKey:t}){const{engine:i,config:r,form:l}=V();s.useSyncExternalStore(F=>i.subscribeField(e,F),()=>i.getFieldVersion(e),()=>i.getFieldVersion(e));const n=i.getFieldState(e),o=s.useContext(P),u=s.useContext(j),d=s.useContext(k),f=s.useCallback(F=>{i.setFieldValue(e,F)},[i,e]),b=s.useCallback(F=>{F.currentTarget.contains(F.relatedTarget)||i.validateField(e,{trigger:"blur"})},[i,e]),g=s.useMemo(()=>n?.meta.enum?n.meta.enum.map((F,v)=>({value:F,label:n.meta.enumNames?.[v]??String(F)})):n?.props.options,[n?.meta.enum,n?.meta.enumNames,n?.props.options]),y=s.useMemo(()=>{const F={};if(n?.reactions){for(const v of n.reactions)if(v.dependencies)for(const R of v.dependencies)F[R]=i.getFieldValue(R)}return F},[n?.reactions,i]);if(!n)return i.getSnapshot()>0&&console.warn(`[NexusField] Field not found: ${e}`),null;if(d.visible===!1||!n.visible)return u.removeHidden===!0?null:a.jsx("div",{className:"hidden","data-nexus-hidden":e});const h=r.readOnly||d.readOnly===!0||n.readOnly,E=d.disabled===!0||n.disabled,S=h&&!!n.meta.readOnlyWidget,N=S?n.meta.readOnlyWidget:n.meta.widget;let C=i.getWidget(N);if(!C&&S&&(C=i.getWidget(n.meta.widget)),!C)return a.jsxs("div",{className:"text-xs text-red-500","data-nexus-field":e,children:['⚠️ Widget "',n.meta.widget,'" 未注册 (path: ',e,")"]});const A=n.meta.displayType??r.displayType,D=n.meta.labelWidth??r.labelWidth,M=n.meta.column??r.column,m=I(n.meta.colSpan,o),O={...n.meta.width?{width:n.meta.width,flexShrink:0}:{},...m?{gridColumn:`span ${m}`}:{}},w=i.getFieldWrapper(),$={label:n.meta.label,title:n.meta.title,description:n.meta.description,errors:n.errors,required:n.required,extra:n.meta.extra,width:n.meta.width,displayType:A,labelWidth:D,column:M},W={dataPath:e,path:e,value:n.value,onChange:f,disabled:E,readOnly:h,loading:n.loading,placeholder:n.meta.placeholder,options:g,form:l,dependValues:y,items:n.meta.items,...n.props};let p;return w?p=a.jsx(w,{...$,children:a.jsx(C,{...W})},t):p=a.jsx(C,{...W},t),a.jsx("div",{"data-nexus-field":e,onBlur:b,style:Object.keys(O).length>0?O:void 0,children:p})}function G({node:e}){const{engine:t}=V(),i=t.getLayout(e.type),r=e.children.map((h,E)=>_(h,E)),l=s.useContext(P),n=I(e.props.colSpan,l),o={...n?{gridColumn:`span ${n}`}:{},...e.props.width?{width:e.props.width,flexShrink:0}:{}},u=s.useMemo(()=>({removeHidden:e.props.removeHidden}),[e.props.removeHidden]);if(!i)return a.jsx(j.Provider,{value:u,children:a.jsxs("div",{"data-nexus-layout":e.type,className:"mb-4",style:Object.keys(o).length>0?o:void 0,children:[e.title&&a.jsx("div",{className:"mb-2 font-bold",children:e.title}),r]})});const{displayType:d,labelWidth:f,colSpan:b,width:g,...y}=e.props;return a.jsx(j.Provider,{value:u,children:a.jsx("div",{style:Object.keys(o).length>0?o:void 0,children:a.jsx(i,{...y,node:e,title:e.title,children:r})})})}function z({node:e}){const{engine:t,config:i}=V(),r=s.useContext(k);s.useSyncExternalStore(y=>t.subscribeField(e.dataPath,y),()=>t.getFieldVersion(e.dataPath),()=>t.getFieldVersion(e.dataPath));const l=t.getFieldState(e.dataPath),[n,o]=s.useState(!1),u=(i.column??1)>1,d=u?{gridTemplateColumns:`repeat(${i.column}, 1fr)`}:{},f={disabled:r.disabled??(l?.disabled===!0?!0:void 0),readOnly:r.readOnly??(l?.readOnly===!0?!0:void 0),visible:r.visible===!1||l?.visible===!1?!1:void 0},b=f.visible===!1,g=()=>o(y=>!y);return a.jsx(k.Provider,{value:f,children:a.jsxs("div",{"data-nexus-object":e.dataPath,className:`mb-4 ${b?"hidden":""}`,children:[e.title&&a.jsxs("div",{onClick:g,className:"flex gap-1 mb-2 cursor-pointer select-none border-none bg-transparent p-0 font-bold",children:[a.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:`align-middle transition-transform duration-200 ease-in-out ${n?"rotate-0":"rotate-90"}`,"aria-hidden":"true",children:a.jsx("polyline",{points:"9 18 15 12 9 6"})}),e.title]}),a.jsx("div",{className:`${u?"grid gap-x-4":""} ${n?"hidden":""}`,style:Object.keys(d).length>0?d:void 0,children:e.children.map((y,h)=>_(y,h))})]})})}function _(e,t){return e.type==="field"?a.jsx(K,{dataPath:e.dataPath,layoutKey:e.layoutKey},e.layoutKey||e.dataPath):e.type==="object"?a.jsx(z,{node:e},`object-${e.layoutKey}-${t}`):a.jsx(G,{node:e},`layout-${e.type}-${t}`)}function U({engine:e,config:t,form:i,children:r}){const l=s.useMemo(()=>({engine:e,config:t,form:i}),[e,t,i]);return a.jsx(B.Provider,{value:l,children:r})}function T(){}function ne({form:e,schema:t,initialValues:i,widgets:r,layouts:l,onFinish:n,onFinishFailed:o,onMount:u,footer:d=!1,className:f,style:b,children:g,labelCol:y,labelWidth:h,colon:E,label:S,displayType:N,readOnly:C,column:A,watch:D,removeHiddenData:M=!0}){const m=e._getEngine(),O=s.useRef(null),w=N??t?.displayType??"row",$=S??t?.label??!0,W=E??t?.colon,p=h??t?.labelWidth,F=C??t?.readOnly??!1,v=A??t?.column;s.useEffect(()=>{r&&m.registerWidgets(r),l&&m.registerLayouts(l)},[m,r,l]);const R=s.useRef(!0),ge=s.useRef(i);s.useEffect(()=>{t&&(R.current?(m.init(t,ge.current),R.current=!1):m.init(t,m.getFormData()))},[m,t]);const Q=s.useRef(u);Q.current=u;const X=s.useRef(!1),Y=!t||typeof t=="object"&&Object.keys(t).length===0;s.useEffect(()=>{X.current||Y||(X.current=!0,Q.current?.())},[Y]);const Z=s.useRef(T),ee=s.useRef(T);Z.current=n??T,ee.current=o??T,s.useEffect(()=>{e._bind(O.current,()=>Z.current,()=>ee.current)},[e]),s.useEffect(()=>{e._syncConfig({removeHiddenData:M,watch:D})},[e,M,D]);const he=s.useSyncExternalStore(m.subscribeStore,m.getSnapshot,m.getSnapshot),be=s.useMemo(()=>m.getRenderTree(),[m,he]),ye=s.useCallback(async q=>{q.preventDefault(),await e.submit()},[e]),me=s.useCallback(()=>{e.resetFields()},[e]);let H=null;d===!0?H=a.jsxs("div",{className:"mt-4",children:[a.jsx("button",{type:"submit",children:"提交"})," ",a.jsx("button",{type:"button",onClick:me,children:"重置"})]}):d&&(H=d);const te=s.useMemo(()=>{if(y)return y;if(p)return{style:{width:typeof p=="number"?`${p}px`:p}}},[y,p]),Fe=s.useMemo(()=>({labelCol:te,labelWidth:p,colon:W,label:$,displayType:w,readOnly:F,column:v}),[te,p,W,$,w,F,v]);return a.jsx(U,{engine:m,config:Fe,form:e,children:a.jsxs("form",{ref:O,onSubmit:ye,className:f,style:{...b,...v&&v>1?{display:"grid",gridTemplateColumns:`repeat(${v}, 1fr)`,gap:"0 16px"}:{}},noValidate:!0,children:[be.map((q,pe)=>_(q,pe)),!C&&H,g]})})}function L(){const{engine:e}=V();return e}function ie(e){const{engine:t}=V();return s.useSyncExternalStore(i=>t.subscribeField(e,i),()=>t.getFieldVersion(e),()=>t.getFieldVersion(e)),t.getFieldState(e)}function se(e,t,i,r){const{engine:l}=V(),n=s.useRef(i);n.current=i;const o=s.useRef(r?.dependsOn);o.current=r?.dependsOn;const u=r?.deps;s.useEffect(()=>{if(!e||!t)return;const d=n.current;return e.registerValidator(t,d),()=>{e.unregisterValidator(t,d)}},[e,t,...u??[]]),s.useEffect(()=>{if(!t||!o.current||o.current.length===0)return;const d=l;if(!d)return;const f=t,b=o.current.map(g=>d.subscribeField(g,()=>{e?.revalidateField(f)}));return()=>{for(const g of b)g()}},[l,e,t])}function re(e){const t=L();return s.useSyncExternalStore(i=>t.subscribeField(e,i),()=>t.getFieldVersion(e),()=>t.getFieldVersion(e)),t.getFieldValue(e)}function le(e,t){const i=s.useRef(null);return i.current||(i.current=new J(t??(e?new x.NexusEngine({formId:e}):void 0))),[i.current]}function oe(){const{config:e}=V();return e}function ue(){const e=L(),t=s.useSyncExternalStore(e.subscribeStore,e.getSnapshot,e.getSnapshot);return s.useMemo(()=>e.getFormData(),[e,t])}function ce(e,t,i,r){const{deep:l=!1}=r||{},n=s.useRef(void 0),o=s.useRef(i);return o.current=i,s.useEffect(()=>{if(!e)return;const u=e.getFieldValue(t);n.current===void 0&&(n.current=u),(l?JSON.stringify(u)!==JSON.stringify(n.current):u!==n.current)&&(n.current=u,o.current(u));const f=e.subscribe(t,b=>{const g=b.value;(l?JSON.stringify(g)!==JSON.stringify(n.current):g!==n.current)&&(n.current=g,o.current(g))});return()=>{f()}},[e,t,l]),n.current}function ae(e,t,i){const{deep:r=!1}=i||{},l=s.useRef({}),n=s.useRef({}),o=s.useRef(t);return o.current=t,s.useEffect(()=>{if(!e)return;const u=e.getFormData();l.current=u,n.current=u,o.current(u);const d=e.subscribeAll(f=>{if(r)JSON.stringify(f)!==JSON.stringify(l.current)&&(l.current=f,n.current=f,o.current(f));else{let b=!1;for(const g in f)if(f[g]!==l.current[g]){b=!0;break}b&&(l.current=f,n.current=f,o.current(f))}});return()=>{d()}},[e,r]),n.current}function de(e,t,i,r){const{deep:l=!1}=r||{},n=s.useRef({}),o=s.useRef({}),u=s.useRef(i);u.current=i;const d=s.useRef(t);d.current=t;const f=[...t].sort().join(",");return s.useEffect(()=>{if(!e)return;const b=d.current,g={};for(const h of b)g[h]=e.getFieldValue(h);n.current=g,o.current=g,u.current(g);const y=b.map(h=>e.subscribe(h,E=>{const S=E.value,N=n.current[h];(l?JSON.stringify(S)!==JSON.stringify(N):S!==N)&&(n.current[h]=S,o.current={[h]:S},u.current(o.current))}));return()=>{for(const h of y)h()}},[e,l,f]),o.current}function fe(e,t,i){const r=s.useRef(void 0),l=s.useRef(i);return l.current=i,s.useEffect(()=>{if(!e)return;const n=e.getFieldState(t);r.current=n,n&&l.current(n);const o=e.subscribe(t,u=>{r.current=u,l.current(u)});return()=>{o()}},[e,t]),r.current||{}}c.FieldInheritContext=k,c.FormController=J,c.GridContext=P,c.LayoutConfigContext=j,c.NexusField=K,c.NexusForm=ne,c.NexusFormProvider=U,c.NexusLayout=G,c.NexusObject=z,c.useEngine=L,c.useFieldState=ie,c.useFieldValidator=se,c.useFieldValue=re,c.useForm=le,c.useFormConfig=oe,c.useFormData=ue,c.useWatch=ce,c.useWatchAll=ae,c.useWatchMultiple=de,c.useWatchState=fe,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
|
|
1
|
+
(function(c,W){typeof exports=="object"&&typeof module<"u"?W(exports,require("@xbeeant/form-engine"),require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","@xbeeant/form-engine","react/jsx-runtime","react"],W):(c=typeof globalThis<"u"?globalThis:c||self,W(c.NexusFormEngineReact={},c.formEngine,c.jsxRuntime,c.react))})(this,(function(c,W,d,o){"use strict";function T(t){if(Array.isArray(t))return t.map(e=>T(e));if(t!==null&&typeof t=="object"){const e={};for(const[n,i]of Object.entries(t))i==null||i===""||(e[n]=T(i));return e}return t}const Z=new WeakSet;class ee{engine;submitting=!1;submittingListeners=new Set;views=new Map;instanceBindings=new Map;instanceConfigs=new Map;constructor(e){this.engine=e??new W.NexusEngine,this.engine.hasPlugin("async-validator")||this.engine.use(new W.AsyncValidatorPlugin(this.engine))}_useInstance(e){let n=this.views.get(e);return n||(this.views.size===0&&!Z.has(this.engine)?(Z.add(this.engine),n=this.engine):n=this.engine.instance(e),this.views.set(e,n),this.instanceConfigs.set(e,{removeHiddenData:!0,omitNil:!1,watchers:new Map,globalWatcher:null,onValuesChange:null})),n}resolveViews(){const e=Array.from(this.views.values());return e.length>0?e:[this.engine]}getPrimaryFormEl(){return this.instanceBindings.values().next().value?.formEl??null}_bind(e,n,i,r){this.instanceBindings.set(e,{formEl:n,getOnFinish:i,getOnFinishFailed:r}),this._useInstance(e).registerOnFieldValueChange((l,u)=>this._onFieldValueChange(e,l,u))}_syncConfig(e,n){const i=this.instanceConfigs.get(e)??{removeHiddenData:!0,omitNil:!1,watchers:new Map,globalWatcher:null,onValuesChange:null};if(n.removeHiddenData!==void 0&&(i.removeHiddenData=n.removeHiddenData),n.omitNil!==void 0&&(i.omitNil=n.omitNil),n.onValuesChange!==void 0&&(i.onValuesChange=n.onValuesChange),n.watch){i.watchers.clear(),i.globalWatcher=null;for(const[r,s]of Object.entries(n.watch))r==="#"?i.globalWatcher=s:i.watchers.set(r,s)}this.instanceConfigs.set(e,i)}_onFieldValueChange(e,n,i){const r=this.views.get(e),s=this.instanceConfigs.get(e);if(!r||!s)return;const l=r.getFormData(),u=s.removeHiddenData?l:r.getAllFormData();s.globalWatcher&&s.globalWatcher(u,u,n),s.onValuesChange&&s.onValuesChange(i,u,n);const a=s.watchers.get(n);a&&a(i,u)}_getEngine(){return this.engine}getEngine(){return this.engine}async submit(e){this.setSubmitting(!0);try{await this.runSubmit(e)}finally{this.setSubmitting(!1)}}getSubmitting(){return this.submitting}onSubmittingChange(e){return this.submittingListeners.add(e),()=>{this.submittingListeners.delete(e)}}setSubmitting(e){if(this.submitting!==e){this.submitting=e;for(const n of this.submittingListeners)n()}}async runSubmit(e){const n=this.resolveViews(),i=new Map;let r;for(const s of n){const l=await s.validate(void 0,{validateFirst:e?.validateFirst});if(l.size>0){for(const[u,a]of l)i.set(u,a);r??=this.instanceBindings.get(this.findInstanceId(s))}}if(i.size>0){this.focusFirstError(i,r?.formEl??null),r?.getOnFinishFailed()?.(i);return}for(const s of n){const l=this.findInstanceId(s),u=this.instanceConfigs.get(l)??{removeHiddenData:!0,omitNil:!1},a=u.removeHiddenData?s.getFormData():s.getAllFormData(),m=e?.omitNil??u.omitNil??!1?T(a):a;await s.submit(m)&&await this.instanceBindings.get(l)?.getOnFinish()?.(m)}}findInstanceId(e){for(const[n,i]of this.views)if(i===e)return n;return"default"}focusFirstError(e,n){if(!n||e.size===0)return;const i=new Set(e.keys());requestAnimationFrame(()=>{const s=n.querySelectorAll("[data-nexus-field]");for(const l of Array.from(s)){const u=l.getAttribute("data-nexus-field");if(!u||!i.has(u))continue;typeof l.scrollIntoView=="function"&&l.scrollIntoView({behavior:"smooth",block:"center"}),l.querySelector('input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])')?.focus();return}})}resetFields(){for(const e of this.resolveViews())e.reset()}setErrorFields(e){for(const n of this.resolveViews())n.setErrorFields(e)}setValues(e){for(const n of this.resolveViews())n.setFieldValues(e)}setValueByPath(e,n){for(const i of this.resolveViews())i.setFieldValue(e,n)}setSchemaByPath(e,n){for(const i of this.resolveViews())i.setSchemaByPath(e,n)}setSchema(e){for(const n of this.resolveViews())n.setSchema(e)}getValues(e,n){const i={};for(const r of this.resolveViews()){const s=r.getFormData(e);n?.omitNil?Object.assign(i,T(s)):Object.assign(i,s)}return i}getHiddenValues(){const e={};for(const n of this.resolveViews())Object.assign(e,n.getHiddenValues());return e}getAllValues(){const e={};for(const n of this.resolveViews())Object.assign(e,n.getAllFormData());return e}getValueByPath(e){for(const n of this.resolveViews()){const i=n.getFieldValue(e);if(i!==void 0)return i}}registerValidator(e,n){for(const i of this.resolveViews())i.registerFieldValidator(e,n)}unregisterValidator(e,n){for(const i of this.resolveViews())i.unregisterFieldValidator(e,n)}revalidateField(e){for(const n of this.resolveViews())n.validateField(e,{trigger:"change"})}getSchema(){return this.resolveViews()[0]?.getSchema()??null}removeErrorField(e){for(const n of this.resolveViews())n.removeErrorField(e)}scrollToPath(e){this.getPrimaryFormEl()?.querySelector(`[data-nexus-field="${e}"]`)?.scrollIntoView({behavior:"smooth",block:"center"})}getFieldError(e){for(const n of this.resolveViews()){const i=n.getFieldError(e);if(i.length>0)return i}return[]}getFieldsError(){const e=new Map;for(const n of this.resolveViews())for(const[i,r]of n.getFieldsError())e.set(i,r);return e}validateFields(e,n){const i=this.resolveViews();return i.length===1?i[0].validate(e,n):Promise.all(i.map(r=>r.validate(e,n))).then(r=>{const s=new Map;for(const l of r)for(const[u,a]of l)s.set(u,a);return s})}getFieldState(e){for(const n of this.resolveViews()){const i=n.getFieldState(e);if(i)return i}}reloadRemoteData(e){for(const n of this.resolveViews())n.reloadRemoteData(e)}}const P=o.createContext({}),J=o.createContext(null),B=o.createContext({}),q=o.createContext(null);function R(){const t=o.useContext(q);if(!t)throw new Error("[NexusField] Must be used within <NexusFormProvider>");return t}function te(t,e){if(t!==void 0)return t;if(e&&e.column>0)return Math.max(1,Math.round(e.column/24))}function ne({dataPath:t,layoutKey:e}){const{engine:n,config:i,form:r}=R();o.useSyncExternalStore(b=>n.subscribeField(t,b),()=>n.getFieldVersion(t),()=>n.getFieldVersion(t));const s=n.getFieldState(t),l=o.useContext(J),u=o.useContext(B),a=o.useContext(P),f=o.useCallback(b=>{n.setFieldValue(t,b)},[n,t]),m=o.useCallback(b=>{b.currentTarget.contains(b.relatedTarget)||n.validateField(t,{trigger:"blur"})},[n,t]),g=o.useMemo(()=>s?.meta.enum?s.meta.enum.map((b,V)=>({value:b,label:s.meta.enumNames?.[V]??String(b)})):s?.props.options,[s?.meta.enum,s?.meta.enumNames,s?.props.options]),p=o.useMemo(()=>{const b={};if(s?.reactions){for(const V of s.reactions)if(V.dependencies)for(const E of V.dependencies)b[E]=n.getFieldValue(E)}return b},[s?.reactions,n]),v=o.useMemo(()=>{const b=s?.meta.itemOf,E=!!b?t.match(/\[(\d+)\]/):void 0,H=E?Number(E[1]):void 0;return{get formData(){return r.getValues()},get rootValue(){return r.getValues()},value:s?.value,dataPath:t,path:t,index:H,parentValues:b?r.getValueByPath(b):void 0,getValue:y=>r.getValueByPath(y),setValue:(y,F)=>r.setValueByPath(y,F),onItemChange:(y,F)=>r.setValueByPath(y,F),validate:async y=>{y?await r.validateFields([y]):await r.validateFields([t])},validateFields:async y=>{await r.validateFields(y)},submit:()=>r.submit(),resetFields:()=>r.resetFields(),setSchema:y=>r.setSchema(y),setSchemaByPath:(y,F)=>r.setSchemaByPath(y,F),getSchema:()=>r.getSchema()}},[r,t,s?.value,s?.meta.itemOf]);if(!s)return n.getSnapshot()>0&&console.warn(`[NexusField] Field not found: ${t}`),null;if(a.visible===!1||!s.visible)return u.removeHidden===!0?null:d.jsx("div",{className:"hidden","data-nexus-hidden":t});const C=i.readOnly||a.readOnly===!0||s.readOnly,N=a.disabled===!0||s.disabled,_=C&&!!s.meta.readOnlyWidget,L=_?s.meta.readOnlyWidget:s.meta.widget;let O=n.getWidget(L);if(!O&&_&&(O=n.getWidget(s.meta.widget)),!O)return d.jsxs("div",{className:"text-xs text-red-500","data-nexus-field":t,children:['⚠️ Widget "',s.meta.widget,'" 未注册 (path: ',t,")"]});const Q=s.meta.displayType??i.displayType,I=s.meta.labelWidth??i.labelWidth,$=s.meta.column??i.column,k=te(s.meta.colSpan,l),M={...s.meta.width?{width:s.meta.width,flexShrink:0}:{},...k?{gridColumn:`span ${k}`}:{}},A=n.getFieldWrapper(),j={label:s.meta.label,title:s.meta.title,description:s.meta.description,tooltip:s.meta.tooltip,errors:s.errors,required:s.required,extra:s.meta.extra,displayType:Q,labelWidth:I,column:$},x={dataPath:t,path:t,value:s.value,onChange:f,disabled:N,readOnly:C,loading:s.loading,placeholder:s.meta.placeholder,options:g,form:r,addons:v,dependValues:p,items:s.meta.items,schema:s.meta.schema,remoteVersion:n.getRemoteDataVersion(t),...s.props};let h;return A?h=d.jsx(A,{...j,children:d.jsx(O,{...x})},e):h=d.jsx(O,{...x},e),d.jsx("div",{"data-nexus-field":t,className:C?"nexus-field-readonly":void 0,onBlur:m,style:Object.keys(M).length>0?M:void 0,children:h})}function K(){const{engine:t}=R();return t}function we(t){const{engine:e}=R();return o.useSyncExternalStore(n=>e.subscribeField(t,n),()=>e.getFieldVersion(t),()=>e.getFieldVersion(t)),e.getFieldState(t)}function pe(t,e,n,i){const{engine:r}=R(),s=o.useRef(n);s.current=n;const l=o.useRef(i?.dependsOn);l.current=i?.dependsOn;const u=i?.deps;o.useEffect(()=>{if(!t||!e)return;const a=s.current;return t.registerValidator(e,a),()=>{t.unregisterValidator(e,a)}},[t,e,...u??[]]),o.useEffect(()=>{if(!e||!l.current||l.current.length===0)return;const a=r;if(!a)return;const f=e,m=l.current.map(g=>a.subscribeField(g,()=>{t?.revalidateField(f)}));return()=>{for(const g of m)g()}},[r,t,e])}function Fe(t){const e=K();return o.useSyncExternalStore(n=>e.subscribeField(t,n),()=>e.getFieldVersion(t),()=>e.getFieldVersion(t)),e.getFieldValue(t)}function Se(t,e){const n=o.useRef(null);return n.current||(n.current=new ee(e??(t?new W.NexusEngine({formId:t}):void 0))),[n.current]}function Ve(){const{config:t}=R();return t}function Ce(){const t=K(),e=o.useSyncExternalStore(n=>t.subscribeStore(n),()=>t.getSnapshot(),()=>t.getSnapshot());return o.useMemo(()=>t.getFormData(),[t,e])}function se(t){return o.useSyncExternalStore(e=>t.onSubmittingChange(e),()=>t.getSubmitting(),()=>t.getSubmitting())}function xe(t,e,n,i){const{deep:r=!1}=i||{},s=o.useRef(void 0),l=o.useRef(n);return l.current=n,o.useEffect(()=>{if(!t)return;const u=t.getFieldValue(e);s.current===void 0&&(s.current=u),(r?JSON.stringify(u)!==JSON.stringify(s.current):u!==s.current)&&(s.current=u,l.current(u));const f=t.subscribe(e,m=>{const g=m.value;(r?JSON.stringify(g)!==JSON.stringify(s.current):g!==s.current)&&(s.current=g,l.current(g))});return()=>{f()}},[t,e,r]),s.current}function Ne(t,e,n){const{deep:i=!1}=n||{},r=o.useRef({}),s=o.useRef({}),l=o.useRef(e);return l.current=e,o.useEffect(()=>{if(!t)return;const u=t.getFormData();r.current=u,s.current=u,l.current(u);const a=t.subscribeAll(f=>{if(i)JSON.stringify(f)!==JSON.stringify(r.current)&&(r.current=f,s.current=f,l.current(f));else{let m=!1;for(const g in f)if(f[g]!==r.current[g]){m=!0;break}m&&(r.current=f,s.current=f,l.current(f))}});return()=>{a()}},[t,i]),s.current}function Oe(t,e,n,i){const{deep:r=!1}=i||{},s=o.useRef({}),l=o.useRef({}),u=o.useRef(n);u.current=n;const a=o.useRef(e);a.current=e;const f=[...e].sort().join(",");return o.useEffect(()=>{if(!t)return;const m=a.current,g={};for(const v of m)g[v]=t.getFieldValue(v);s.current=g,l.current=g,u.current(g);const p=m.map(v=>t.subscribe(v,C=>{const N=C.value,_=s.current[v];(r?JSON.stringify(N)!==JSON.stringify(_):N!==_)&&(s.current[v]=N,l.current={[v]:N},u.current(l.current))}));return()=>{for(const v of p)v()}},[t,r,f]),l.current}function Ee(t,e,n){const i=o.useRef(void 0),r=o.useRef(n);return r.current=n,o.useEffect(()=>{if(!t)return;const s=t.getFieldState(e);i.current=s,s&&r.current(s);const l=t.subscribe(e,u=>{i.current=u,r.current(u)});return()=>{l()}},[t,e]),i.current||{}}function z(t){if(!(typeof window>"u"))try{const e=t==="sessionStorage"?window.sessionStorage:window.localStorage;return e.setItem("__nexus_persist_probe__","1"),e.removeItem("__nexus_persist_probe__"),e}catch{return}}function We(t){const e=z(t.storage);if(e)try{const n=e.getItem(t.key);if(!n)return;const i=JSON.parse(n);return typeof i=="object"&&i!==null?i:void 0}catch{return}}function Re(t,e){const n=z(t.storage);if(n)try{n.setItem(t.key,JSON.stringify(e))}catch{}}function _e(t){const e=z(t.storage);if(e)try{e.removeItem(t.key)}catch{}}function ie({node:t}){const{engine:e}=R(),n=e.getLayout(t.type),i=t.children.map((v,C)=>G(v,C)),r=o.useContext(J),s=te(t.props.colSpan,r),l={...s?{gridColumn:`span ${s}`}:{},...t.props.width?{width:t.props.width,flexShrink:0}:{}},u=o.useMemo(()=>({removeHidden:t.props.removeHidden}),[t.props.removeHidden]);if(!n)return d.jsx(B.Provider,{value:u,children:d.jsxs("div",{"data-nexus-layout":t.type,className:"mb-4",style:Object.keys(l).length>0?l:void 0,children:[t.title&&d.jsx("div",{className:"mb-2 font-bold",children:t.title}),i]})});const{displayType:a,labelWidth:f,colSpan:m,width:g,...p}=t.props;return d.jsx(B.Provider,{value:u,children:d.jsx("div",{style:Object.keys(l).length>0?l:void 0,children:d.jsx(n,{...p,node:t,title:t.title,children:i})})})}function re({node:t}){const{engine:e,config:n}=R(),i=o.useContext(P);o.useSyncExternalStore(p=>e.subscribeField(t.dataPath,p),()=>e.getFieldVersion(t.dataPath),()=>e.getFieldVersion(t.dataPath));const r=e.getFieldState(t.dataPath),[s,l]=o.useState(!1),u=(n.column??1)>1,a=u?{gridTemplateColumns:`repeat(${n.column}, 1fr)`}:{},f={disabled:i.disabled??(r?.disabled===!0?!0:void 0),readOnly:i.readOnly??(r?.readOnly===!0?!0:void 0),visible:i.visible===!1||r?.visible===!1?!1:void 0},m=f.visible===!1,g=()=>l(p=>!p);return d.jsx(P.Provider,{value:f,children:d.jsxs("div",{"data-nexus-object":t.dataPath,className:`mb-4 ${m?"hidden":""}`,children:[t.title&&d.jsxs("div",{onClick:g,className:"flex gap-1 mb-2 cursor-pointer select-none border-none bg-transparent p-0 font-bold",children:[d.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:`align-middle transition-transform duration-200 ease-in-out ${s?"rotate-0":"rotate-90"}`,"aria-hidden":"true",children:d.jsx("polyline",{points:"9 18 15 12 9 6"})}),t.title]}),d.jsx("div",{className:`${u?"grid gap-x-4":""} ${s?"hidden":""}`,style:Object.keys(a).length>0?a:void 0,children:t.children.map((p,v)=>G(p,v))})]})})}function G(t,e){return t.type==="field"?d.jsx(ne,{dataPath:t.dataPath,layoutKey:t.layoutKey},t.layoutKey||t.dataPath):t.type==="object"?d.jsx(re,{node:t},`object-${t.layoutKey}-${e}`):d.jsx(ie,{node:t},`layout-${t.type}-${e}`)}function oe({engine:t,config:e,form:n,children:i}){const r=o.useMemo(()=>({engine:t,config:e,form:n}),[t,e,n]);return d.jsx(q.Provider,{value:r,children:i})}function U(){}function je({form:t,schema:e,initialValues:n,widgets:i,layouts:r,fieldWrapper:s,onFinish:l,onFinishFailed:u,onMount:a,footer:f=!1,className:m,style:g,children:p,labelCol:v,labelWidth:C,colon:N,label:_,displayType:L,readOnly:O,column:Q,watch:I,onValuesChange:$,removeHiddenData:k=!0,omitNil:M=!1,locale:A,persist:j}){const x=o.useId(),h=o.useMemo(()=>t._useInstance(x),[t,x]),b=o.useRef(null),V=o.useRef(j);V.current=j;const E=L??e?.displayType??"row",H=_??e?.label??!0,y=N??e?.colon,F=C??e?.labelWidth,le=O??e?.readOnly??!1,D=Q??e?.column,ue=A??e?.locale??h.getLocale();o.useEffect(()=>{i&&h.registerWidgets(i),s&&h.registerFieldWrapper(s),r&&h.registerLayouts(r)},[h,i,r,s]);const ae=o.useRef(!0),ke=o.useRef(n);o.useEffect(()=>{if(e)if(ae.current){const w=V.current?We(V.current):void 0;h.init(e,w??ke.current),ae.current=!1}else h.init(e,h.getFormData())},[h,e]);const ce=j?`${j.storage??"localStorage"}:${j.key}`:null;o.useEffect(()=>{const w=ce?V.current:void 0;if(!w)return;let S=null;const Y=w.debounce??300,Le=h.subscribeStore(()=>{S&&clearTimeout(S),S=setTimeout(()=>{Re(w,h.getFormData())},Y)});return()=>{S&&clearTimeout(S),Le()}},[h,ce]);const de=o.useRef(a);de.current=a;const fe=o.useRef(!1),ge=!e||typeof e=="object"&&Object.keys(e).length===0;o.useEffect(()=>{fe.current||ge||(fe.current=!0,de.current?.())},[ge]);const he=o.useRef(U),me=o.useRef(U);he.current=w=>{const S=V.current;return S&&S.clearOnSubmit!==!1&&_e(S),l?.(w)},me.current=u??U,o.useEffect(()=>{t._bind(x,b.current,()=>he.current,()=>me.current)},[t,x]);const ve=o.useRef($);ve.current=$,o.useEffect(()=>{t._syncConfig(x,{removeHiddenData:k,omitNil:M,watch:I,onValuesChange:(w,S,Y)=>ve.current?.(w,S,Y)})},[t,x,k,M,I]);const Me=o.useSyncExternalStore(w=>h.subscribeRender(w),()=>h.getRenderSnapshot(),()=>h.getRenderSnapshot()),De=o.useMemo(()=>h.getRenderTree(),[h,Me]),Te=o.useCallback(async w=>{w.preventDefault(),await t.submit()},[t]),Pe=o.useCallback(()=>{t.resetFields()},[t]),be=se(t);let X=null;f===!0?X=d.jsxs("div",{className:"mt-4",children:[d.jsx("button",{type:"submit",disabled:be,children:be?"提交中...":"提交"})," ",d.jsx("button",{type:"button",onClick:Pe,children:"重置"})]}):f&&(X=f);const ye=o.useMemo(()=>{if(v)return v;if(F)return{style:{width:typeof F=="number"?`${F}px`:F}}},[v,F]),Be=o.useMemo(()=>({labelCol:ye,labelWidth:F,colon:y,label:H,displayType:E,readOnly:le,column:D,locale:ue}),[ye,F,y,H,E,le,D,ue]);return d.jsx(oe,{engine:h,config:Be,form:t,children:d.jsxs("form",{ref:b,onSubmit:Te,className:m,style:{...g,...D&&D>1?{display:"grid",gridTemplateColumns:`repeat(${D}, 1fr)`,gap:"0 16px"}:{}},noValidate:!0,children:[De.map((w,S)=>G(w,S)),!O&&X,p]})})}c.FieldInheritContext=P,c.FormController=ee,c.GridContext=J,c.LayoutConfigContext=B,c.NexusContext=q,c.NexusField=ne,c.NexusForm=je,c.NexusFormProvider=oe,c.NexusLayout=ie,c.NexusObject=re,c.useEngine=K,c.useFieldState=we,c.useFieldValidator=pe,c.useFieldValue=Fe,c.useForm=Se,c.useFormConfig=Ve,c.useFormData=Ce,c.useFormSubmitting=se,c.useWatch=xe,c.useWatchAll=Ne,c.useWatchMultiple=Oe,c.useWatchState=Ee,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xbeeant/form-engine-react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.4",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public",
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -55,7 +55,8 @@
|
|
|
55
55
|
"build:cjs": "vite build -f cjs",
|
|
56
56
|
"build:umd": "vite build -f umd",
|
|
57
57
|
"lint": "biome check .",
|
|
58
|
-
"lint:fix": "biome check --write ."
|
|
58
|
+
"lint:fix": "biome check --write .",
|
|
59
|
+
"test": "vitest run"
|
|
59
60
|
},
|
|
60
61
|
"peerDependencies": {
|
|
61
62
|
"react": ">=18.0.0",
|
|
@@ -70,7 +71,7 @@
|
|
|
70
71
|
}
|
|
71
72
|
},
|
|
72
73
|
"dependencies": {
|
|
73
|
-
"@xbeeant/form-engine": "^0.0.
|
|
74
|
+
"@xbeeant/form-engine": "^0.0.4"
|
|
74
75
|
},
|
|
75
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "e21b7883779d4623ce1402a1af17b4d35addf4de"
|
|
76
77
|
}
|