@bgscore/react-form 1.0.43 → 1.0.45
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/index.cjs +1 -1
- package/dist/index.d.cts +5 -2
- package/dist/index.d.ts +5 -2
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var fe=require('react'),jsxRuntime=require('react/jsx-runtime'),reactCore=require('@bgscore/react-core'),reactHookForm=require('react-hook-form');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var fe__default=/*#__PURE__*/_interopDefault(fe);var Z=fe.createContext(void 0);function C(){let e=fe.useContext(Z);return e||{}}function G({children:e,controller:a,onSubmit:o,onFieldChange:n=()=>{}}){let d={...a,triggerSubmit:async(t,s)=>{a.setIsSubmit(true);let m=s?await a.formControl.trigger():true,l=a.getData();m&&o&&o({...l,...t},{...a});},onFieldChange:n};return jsxRuntime.jsx(Z.Provider,{value:d,children:e})}var M=new WeakMap;function J(e){return M.has(e)||M.set(e,reactCore.createStore({})),M.get(e)}function B(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let a={};for(let[o,n]of Object.entries(e))if(o.includes(".")){let u=o.split("."),d=a;for(let t=0;t<u.length;t++){let s=u[t];t===u.length-1?d[s]=B(n):((!d[s]||typeof d[s]!="object")&&(d[s]={}),d=d[s]);}}else a[o]=B(n);return a}function k(){return reactCore.createTable({name:"draft",primaryKey:"field_1731131919872_aj29d"})}var X=fe.createContext(void 0);function O(){let e=fe.useContext(X);return e||{}}function Y({children:e,value:a}){return jsxRuntime.jsx(X.Provider,{value:a,children:e})}function L(){let{dbName:e="bgs-react-form"}=O();return reactCore.createDatabase({dbName:e,table:{draft:k()}})}function ee(e){let a=L(),o=reactCore.useDbLiveFlag(a.draft.detail,{key:e}),n=async(t,s)=>{let l={...await d(),...t};Object.keys(l).forEach(c=>{reactCore.isNotEmpty(l[c])||delete l[c];});let r=Object.keys(l);if(r.length===1&&r[0]==="field_1731131919872_aj29d")return u();r.some(c=>c!=="field_1731131919872_aj29d"&&l[c]!==reactCore.getFieldValue(s,c))?await a.draft.put(e,l):await u();},u=async()=>{await a.draft.remove(e);},d=async()=>await a.draft.detail(e);return {isDraft:o,saveDraft:n,removeDraft:u,getDataDraft:d}}var ae=(e={})=>{let a=fe.useMemo(()=>B(e.defaultValues||{}),[]),o=fe.useRef(null),[n,u]=fe.useState(false),d=e?.draftKey,t=d?ee(d):void 0,s=fe.useRef([]),m=fe.useCallback(p=>{let P=s.current.findIndex(D=>D.id===p.id);if(P>-1){let D=[...s.current];D[P]=p,s.current=[...D];}else s.current.push(p);},[s]),l=fe.useCallback(p=>{s.current=s.current.filter(P=>P.id!==p);},[s]),r=reactHookForm.useForm({reValidateMode:"onSubmit",mode:"all",defaultValues:a,...e}),f=fe.useMemo(()=>J(r),[r]),c=fe.useMemo(()=>reactCore.generateUUID(),[]),b=fe.useCallback(p=>p?reactCore.getFieldValue(reactCore.mappingUndefinedtoNull(r.getValues()),p):reactCore.mappingUndefinedtoNull(r.getValues()),[r]),U=fe.useCallback(p=>{p?typeof p=="string"?r.resetField(p,{}):typeof p=="object"&&reactCore.isArray(p,0)&&p.forEach(P=>r.resetField(P)):r.reset();},[r]),x=fe.useCallback((p,P)=>{let D=b();r.reset(B({...D,...p}),P);},[r]),A=fe.useCallback((p,P)=>{r.setValue(p,P);},[r]),y=fe.useCallback(p=>reactHookForm.useFieldArray({control:r.control,name:p}),[reactHookForm.useFieldArray,r]),F=fe.useCallback(p=>reactHookForm.useWatch({control:r.control,name:p}),[reactHookForm.useWatch,r]),v=fe.useCallback(()=>{t?.removeDraft?.();},[t]),i=fe.useCallback(()=>{t?.removeDraft?.(),U();},[t,U]),g=fe.useCallback(p=>f.useStore(P=>reactCore.getFieldValue(P,p)),[f]),h=fe.useCallback(f.setState,[f]),T=fe.useCallback((...p)=>t?.saveDraft?.(...p),[t]),E=fe.useCallback(()=>t?.getDataDraft?.(),[t]),w={...r,setValue:A,ref:o,reset:U,updateData:x,getData:b,formControl:r,useFieldArray:y,useWatch:F,isSubmit:n,formId:c,setIsSubmit:u,useSelected:g,setSelected:h,isDraft:!!t?.isDraft,removeDraft:v,resetDraft:i,saveDraft:T,getDataDraft:E,draftKey:d,registerItem:m,unregisterItem:l,items:s.current,getItems:()=>s.current};return [w,w]};var Ve=({asChild:e,onSubmit:a,onChange:o,onInvalid:n,onFieldChange:u,formData:d,controller:t,children:s,...m})=>{d&&(d=B(d));let l=t??ae({draftKey:m.draftKey}),[r]=fe.useMemo(()=>Array.isArray(l)?l:[l],[l]),f=r.draftKey,c=fe.useRef(true),b=fe.useRef(void 0),{autoSaveDelay:U=.5}=O(),x=async g=>{g.preventDefault(),g.stopPropagation(),r.setIsSubmit(true);let h=await r.formControl.trigger(),T=r.getData();h?a&&a({...T},{...r}):n&&n(r.formControl.formState.errors);},A=async()=>{if(!f)return;let g=await r.getDataDraft();g&&Object.entries(g).forEach(([h,T])=>{h==="field_1731131919872_aj29d"||!reactCore.isNotEmpty(T)||(r.setValue(h,T),r.trigger(h));});},y=()=>{if(d){let g={...d};reactCore.diffJson(b.current||{},g)&&(r.updateData(g),b.current=g,setTimeout(A,0));}};fe.useEffect(()=>{y();},[d,r.formControl.reset]),fe.useEffect(()=>{if(!o)return;let g=r.formControl.watch((h,T)=>o(h,T,r));return ()=>g.unsubscribe()},[]),fe.useEffect(()=>{c.current=true;},[f]),fe.useEffect(()=>{c.current&&r?.isDraft&&(c.current=false,A());},[r.isDraft,f]);let F=fe.useMemo(()=>reactCore.debounce((g,h,T)=>{T?.saveDraft?.({[g]:h},d);},U),[d,U]),v=async(g,h,T)=>{u?.(g,h,T),F(g,h,T);},i={...m};return delete i?.draftKey,jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(G,{controller:{...r,disabled:m?.disabled,readOnly:m?.readOnly},onSubmit:a,onFieldChange:v,children:e?jsxRuntime.jsx("div",{id:r.formId,children:s}):jsxRuntime.jsx("form",{...i,id:r.formId,ref:r.ref,onSubmit:x,children:s})})})},de=Ve;var le=fe.createContext(void 0);function j(){let e=fe.useContext(le);return e||{}}function q({children:e,...a}){return jsxRuntime.jsx(le.Provider,{value:a,children:e})}var ue=e=>{let a=C(),o=reactHookForm.useFieldArray({control:a.control,name:e}),u={formArrayId:fe.useMemo(()=>reactCore.generateUUID(),[]),name:e,...o,...a};return [u,u]};var pe=({defaultData:e,controller:a,children:o,...n})=>{let u=a??ue(n?.name),d=fe.useRef(false),[t]=Array.isArray(u)?u:[u],s=t.name;return fe.useEffect(()=>{d.current||e&&(t.fields.length>0||(typeof e=="boolean"?(t.append({}),d.current=true):typeof e=="number"&&e>0?(t.append([...Array(e).fill(null).map(()=>({}))]),d.current=true):typeof e=="object"&&(t.append(e),d.current=true)));},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:t.fields.map((m,l)=>{let r=`${s}.${l}.`,f={...t,index:l,fieldId:m.id,name:r,countFields:t.fields.length,removeItem:()=>t.remove(l),watchItem:c=>t.watch(c?`${r}${c}`:r.slice(0,-1)),setValueItem:(c,b)=>t.setValue(`${r}${c}`,b),useSelectedItem:c=>t.useSelected(`${r}${c}`)};return jsxRuntime.jsx(fe__default.default.Fragment,{children:jsxRuntime.jsx(q,{...f,children:reactCore.renderChildren(o,f)})},m.id)})})};pe.displayName="BgsFormArray";var Ye=pe;fe__default.default.memo(({children:e,props:a})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:reactCore.renderChildren(e,a)}));var ye=fe.createContext(void 0);function Q(){let e=fe.useContext(ye);return e||{}}function H({children:e,...a}){return jsxRuntime.jsx(ye.Provider,{value:a,children:e})}var he=({children:e,...a})=>{let o=C(),n=fe.useMemo(()=>reactCore.generateUUID(),[]);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(H,{...o,...a,formGroupId:n,children:e})})};he.displayName="BgsFormGroup";var sr=he;var ir=/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;function _({validationRules:e,label:a},o,n){let{formControl:u,getData:d}=o,t=[];return e&&(typeof e=="string"?Te(n,e,true,a,u,d,{}).forEach(s=>t.push(s)):typeof e=="object"&&Object.keys(e).forEach(s=>{let{validate:m}=t.find(r=>r.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let r=e[s],f="";["match","diff"].includes(s)&&typeof r=="object"&&(r=e[s].dataField,f=e[s].label),r!=null&&Te(n,s,r,a,u,d,m,f).forEach(c=>t.push(c));}else if(typeof e[s]=="object"){let r=e[s];t.push({validate:{...m,[s]:f=>r.validation(f)||r.message&&(typeof r.message=="string"?r.message:r.message(a))}});}})),Object.assign({},...t)}var Te=(e,a,o,n,u,d,t,s)=>{let m=[],{required:l,minLength:r,maxLength:f,min:c,max:b,email:U,match:x,diff:A,pattern:y}=e||{},v={required:i=>{if(!o)return true;let g=l?l(n):`${n} is required`;return typeof i=="string"&&!i.trim()||i==null?g:true},minLength:{value:o,message:r?r(n,o):`${n} must be at least ${o} characters long`},maxLength:{value:o,message:f?f(n,o):`${n} cannot be more than ${o} characters long`},min:{value:Number(o),message:c?c(n,o):`${n} should be at least ${o}`},max:{value:Number(o),message:b?b(n,o):`${n} should be at most ${o}`},regexp:(i="")=>i?new RegExp(o.regexp).test(i)||`${n} ${o.message}`:true,email:(i="")=>!o||!i?true:ir.test(i)||(U?U(n):`${n} must be type email`),match:(i="")=>i?i===(d&&d(o))||(x?x(n,s||reactCore.labelFormatter.changeAll(o)):`${n} must be same with ${s||reactCore.labelFormatter.changeAll(o)}`):true,diff:(i="")=>i?i!==(d&&d(o))||(A?A(n,s||reactCore.labelFormatter.changeAll(o)):`${n} must be different with ${s||reactCore.labelFormatter.changeAll(o)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(y?.alphabet?y?.alphabet(n):`${n} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(y?.alphanumber?y?.alphanumber(n):`${n} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(y?.number?y?.number(n):`${n} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(y?.lowercase?y?.lowercase(n):`${n} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(y?.url?y?.url(n):`${n} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(y?.uppercase?y?.uppercase(n):`${n} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(y?.mixedcase?y?.mixedcase(n):`${n} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(y?.specialcharacters?y?.specialcharacters(n):`${n} must contain special characters`)}}[a];if(v){let{validate:i}=m.find(g=>g.validate)||{};typeof v=="function"?m.push({validate:{...i,...t,[a]:v}}):a==="pattern"?m.push({validate:{...i,...t,[`${a}${o}`]:v[o]}}):m.push({[a]:v});}return m};var Mt=e=>{let a=fe.useMemo(()=>reactCore.generateUUID(),[]),o=C(),{validationMessage:n}=O(),{registerItem:u,unregisterItem:d,control:t,disabled:s,readOnly:m,formId:l,setSelected:r,useSelected:f,onFieldChange:c}=o,{name:b,formId:U,...x}=Q(),{name:A,formId:y}=j(),F=fe.useMemo(()=>{let I=e.dataField;return e.disabledHierarchy||(A&&l===y&&(I=`${A}${I}`),b&&l===U&&(I=`${b}${I}`)),I},[A,l,y,e.dataField,b,U,e.disabledHierarchy]),v=fe.useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return reactCore.labelFormatter.changeAll(F)},[e.label,e.noLabel,F]);fe.useEffect(()=>(u({id:a,...e,dataField:F,label:v}),()=>{d(a);}),[a,e,F,v]);let i=fe.useMemo(()=>typeof e.disabled=="boolean"?e.disabled:typeof x.disabled=="boolean"?x.disabled:!!s,[e.disabled,x.disabled,s]),g=fe.useMemo(()=>typeof e.readOnly=="boolean"?e.readOnly:typeof x.readOnly=="boolean"?x.readOnly:!!m,[e.readOnly,x.readOnly,m]),h=fe.useMemo(()=>typeof e.hidden=="boolean"?e.hidden:false,[e.hidden]),T=fe.useMemo(()=>{if(typeof e.required=="boolean"){if(typeof e.validationRules>"u")return {required:e.required};if(typeof e.validationRules=="string"&&e.validationRules==="email")return {email:true,required:e.required};if(typeof e.validationRules=="object")return {...e.validationRules,required:e.required}}return e.validationRules},[e.validationRules,e.required]),E=fe.useMemo(()=>i||g||h?{required:false}:_({validationRules:T,label:v},o,n),[i,g,h,T,v,F,o,n]),w=reactHookForm.useController({name:F,control:t,disabled:i,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:E}),p=w.fieldState.invalid,P=w.fieldState.error?.message,D=reactHookForm.useWatch({name:F,control:t,defaultValue:e.defaultValue}),be=fe.useMemo(()=>reactCore.debounce(I=>r(Re=>({...Re,[F]:I||null}))),[r,F]),ve=f(F),Pe=T?.required;return {...e,setSelectedField:be,label:v,dataField:F,controller:w,invalid:p,messageError:P,selectedField:ve,value:D,required:Pe,onChange:I=>{w.field.onChange(I),c?.(F,I,o);}}};var Vt=()=>{let{formControl:e,items:a}=C(),o=(u,d,t,s=0)=>{let m=[];if(Array.isArray(t))t.forEach((l,r)=>{let f=Object.entries(l||{}).map(([c,b])=>o(`${u}.${r}.${c}`,`${d}[]${c}`,b,t.length>1?r+1:0)).flat();m=[...m,...f];});else if(t&&typeof t=="object"&&!Array.isArray(t)&&!t?.ref)Object.entries(t).map(([l,r])=>{let f=o(`${u}.${l}`,`${u}.${l}`,r);m=[...m,...f];});else {let l=t?.message||"",r=a.find(f=>f.dataField===d)?.label;m.push({label:`${r||""}${s>0?` ${s}`:""}`,message:l,dataField:u});}return m};return Object.entries(e.formState.errors||{}).map(([u,d])=>o(u,u,d)).flat()};function Ht(e){let{watch:a}=C(),o=fe.useMemo(()=>{let t=new Set,s=m=>{if(m)for(let[l,r]of Object.entries(m)){if(l==="and"||l==="or"){r?.forEach(s);continue}r&&typeof r=="object"&&"fromField"in r&&typeof r.fromField=="string"&&t.add(r.fromField);}};return s(e),Array.from(t)},[e]),n=o.length?a(o):[],u=fe.useMemo(()=>{let t={};return o.forEach((s,m)=>{t[s]=n?.[m];}),t},[o,n]),d=fe.useCallback(t=>{if(!t)return t;let s={};for(let[m,l]of Object.entries(t)){if(m==="and"||m==="or"){s[m]=l?.map(r=>d(r))??l;continue}if(l&&typeof l=="object"&&"fromField"in l){let r=l,f={...r},c=r.fromField;c&&c in u?f.value=u[c]:f.value=r.value,delete f.fromField,s[m]=f;}else s[m]=l;}return s},[u]);return fe.useMemo(()=>d(e)??{},[e,d])}var gr=(m=>(m.alphabet="alphabet",m.alphaNumber="alphanumber",m.number="number",m.lowercase="lowercase",m.url="url",m.uppercase="uppercase",m.mixedCase="mixedcase",m.specialCharacters="specialcharacters",m))(gr||{});var Jt=de;exports.BgsFormArray=Ye;exports.BgsFormGroup=sr;exports.BgsReactFormProvider=Y;exports.PatternTypeEnum=gr;exports.default=Jt;exports.useBgsController=Mt;exports.useBgsForm=C;exports.useBgsFormArray=j;exports.useBgsFormArrayInit=ue;exports.useBgsFormGroup=Q;exports.useBgsFormInit=ae;exports.useResolvedQuery=Ht;exports.useSummaryValidation=Vt;
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var ce=require('react'),jsxRuntime=require('react/jsx-runtime'),reactCore=require('@bgscore/react-core'),reactHookForm=require('react-hook-form');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ce__default=/*#__PURE__*/_interopDefault(ce);var J=ce.createContext(void 0);function C(){let e=ce.useContext(J);return e||{}}function M({children:e,controller:a,onSubmit:o,onFieldChange:n=()=>{}}){let u={...a,triggerSubmit:async(t,s)=>{a.setIsSubmit(true);let m=s?await a.formControl.trigger():true,l=a.getData();m&&o&&o({...l,...t},{...a});},onFieldChange:n};return jsxRuntime.jsx(J.Provider,{value:u,children:e})}var k=new WeakMap;function X(e){return k.has(e)||k.set(e,reactCore.createStore({})),k.get(e)}function B(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let a={};for(let[o,n]of Object.entries(e))if(o.includes(".")){let f=o.split("."),u=a;for(let t=0;t<f.length;t++){let s=f[t];t===f.length-1?u[s]=B(n):((!u[s]||typeof u[s]!="object")&&(u[s]={}),u=u[s]);}}else a[o]=B(n);return a}function V(){return reactCore.createTable({name:"draft",primaryKey:"field_1731131919872_aj29d"})}var Y=ce.createContext(void 0);function $(){let e=ce.useContext(Y);return e||{}}function ee({children:e,value:a}){return jsxRuntime.jsx(Y.Provider,{value:a,children:e})}function L(){let{dbName:e="bgs-react-form"}=$();return reactCore.createDatabase({dbName:e,table:{draft:V()}})}function re(e){let a=L(),o=reactCore.useDbLiveFlag(a.draft.detail,{key:e}),n=async(t,s)=>{let l={...await u(),...t};Object.keys(l).forEach(p=>{reactCore.isNotEmpty(l[p])||delete l[p];});let r=Object.keys(l);if(r.length===1&&r[0]==="field_1731131919872_aj29d")return f();r.some(p=>p!=="field_1731131919872_aj29d"&&l[p]!==reactCore.getFieldValue(s,p))?await a.draft.put(e,l):await f();},f=async()=>{await a.draft.remove(e);},u=async()=>await a.draft.detail(e);return {isDraft:o,saveDraft:n,removeDraft:f,getDataDraft:u}}var ie=(e={})=>{let a=ce.useMemo(()=>B(e.defaultValues||{}),[]),o=ce.useRef(null),[n,f]=ce.useState(false),u=e?.draftKey,t=u?re(u):void 0,s=ce.useRef([]),m=ce.useCallback(c=>{let P=s.current.findIndex(S=>S.id===c.id);if(P>-1){let S=[...s.current];S[P]=c,s.current=[...S];}else s.current.push(c);},[s]),l=ce.useCallback(c=>{s.current=s.current.filter(P=>P.id!==c);},[s]),r=reactHookForm.useForm({reValidateMode:"onSubmit",mode:"all",defaultValues:a,...e}),d=ce.useMemo(()=>X(r),[r]),p=ce.useMemo(()=>reactCore.generateUUID(),[]),b=ce.useCallback(c=>c?reactCore.getFieldValue(reactCore.mappingUndefinedtoNull(r.getValues()),c):reactCore.mappingUndefinedtoNull(r.getValues()),[r]),U=ce.useCallback(c=>{c?typeof c=="string"?r.resetField(c,{}):typeof c=="object"&&reactCore.isArray(c,0)&&c.forEach(P=>r.resetField(P)):r.reset();},[r]),R=ce.useCallback((c,P)=>{let S=b(),G=B({...S,...c});r.reset(G,P);},[r]),D=ce.useCallback((c,P)=>{let S=b();r.setValue(c,P),F({[c]:P},S);},[r]),g=ce.useCallback(c=>reactHookForm.useFieldArray({control:r.control,name:c}),[reactHookForm.useFieldArray,r]),T=ce.useCallback(c=>reactHookForm.useWatch({control:r.control,name:c}),[reactHookForm.useWatch,r]),v=ce.useCallback(()=>{t?.removeDraft?.();},[t]),i=ce.useCallback(()=>{t?.removeDraft?.(),U();},[t,U]),A=ce.useCallback(c=>d.useStore(P=>reactCore.getFieldValue(P,c)),[d]),y=ce.useCallback(d.setState,[d]),F=ce.useCallback((...c)=>t?.saveDraft?.(...c),[t]),h=ce.useCallback(()=>t?.getDataDraft?.(),[t]),I={...r,setValue:D,ref:o,reset:U,updateData:R,getData:b,formControl:r,useFieldArray:g,useWatch:T,isSubmit:n,formId:p,setIsSubmit:f,useSelected:A,setSelected:y,isDraft:!!t?.isDraft,removeDraft:v,resetDraft:i,saveDraft:F,getDataDraft:h,draftKey:u,registerItem:m,unregisterItem:l,items:s.current,getItems:()=>s.current};return [I,I]};var Le=({asChild:e,onSubmit:a,onChange:o,onInvalid:n,onFieldChange:f,onValidateDraft:u,formData:t,controller:s,children:m,...l})=>{t&&(t=B(t));let r=s??ie({draftKey:l.draftKey}),[d]=ce.useMemo(()=>Array.isArray(r)?r:[r],[r]),p=d.draftKey,b=ce.useRef(true),U=ce.useRef(void 0),{autoSaveDelay:R=.5}=$(),D=async y=>{y.preventDefault(),y.stopPropagation(),d.setIsSubmit(true);let F=await d.formControl.trigger(),h=d.getData();F?a&&a({...h},{...d}):n&&n(d.formControl.formState.errors);},g=async()=>{if(!p)return;let y=await d.getDataDraft();if(y){if(u&&!await u(y,t))return;Object.entries(y).forEach(([F,h])=>{let I=d.getItems()?.some(c=>c.dataField===F&&c.disabledDraft)??false;F==="field_1731131919872_aj29d"||!reactCore.isNotEmpty(h)||I||(d.setValue(F,h),d.trigger(F));});}},T=()=>{if(t){let y={...t};reactCore.diffJson(U.current||{},y)&&(d.updateData(y),U.current=y,setTimeout(g,0));}};ce.useEffect(()=>{T();},[t,d.formControl.reset]),ce.useEffect(()=>{if(!o)return;let y=d.formControl.watch((F,h)=>o(F,h,d));return ()=>y.unsubscribe()},[]),ce.useEffect(()=>{b.current=true;},[p]),ce.useEffect(()=>{b.current&&d?.isDraft&&(b.current=false,g());},[d.isDraft,p,u]);let v=ce.useMemo(()=>reactCore.debounce((y,F,h)=>{h?.saveDraft?.({[y]:F},t);},R),[t,R]),i=async(y,F,h)=>{f?.(y,F,h),!(h.getItems()?.some(c=>c.dataField===y&&c.disabledDraft)??false)&&v(y,F,h);},A={...l};return delete A?.draftKey,jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(M,{controller:{...d,disabled:l?.disabled,readOnly:l?.readOnly},onSubmit:a,onFieldChange:i,children:e?jsxRuntime.jsx("div",{id:d.formId,children:m}):jsxRuntime.jsx("form",{...A,id:d.formId,ref:d.ref,onSubmit:D,children:m})})})},le=Le;var ue=ce.createContext(void 0);function q(){let e=ce.useContext(ue);return e||{}}function Q({children:e,...a}){return jsxRuntime.jsx(ue.Provider,{value:a,children:e})}var fe=e=>{let a=C(),o=reactHookForm.useFieldArray({control:a.control,name:e}),f={formArrayId:ce.useMemo(()=>reactCore.generateUUID(),[]),name:e,...o,...a};return [f,f]};var ge=({defaultData:e,controller:a,children:o,...n})=>{let f=a??fe(n?.name),u=ce.useRef(false),[t]=Array.isArray(f)?f:[f],s=t.name;return ce.useEffect(()=>{u.current||e&&(t.fields.length>0||(typeof e=="boolean"?(t.append({}),u.current=true):typeof e=="number"&&e>0?(t.append([...Array(e).fill(null).map(()=>({}))]),u.current=true):typeof e=="object"&&(t.append(e),u.current=true)));},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:t.fields.map((m,l)=>{let r=`${s}.${l}.`,d={...t,index:l,fieldId:m.id,name:r,countFields:t.fields.length,removeItem:()=>t.remove(l),watchItem:p=>t.watch(p?`${r}${p}`:r.slice(0,-1)),setValueItem:(p,b)=>t.setValue(`${r}${p}`,b),useSelectedItem:p=>t.useSelected(`${r}${p}`)};return jsxRuntime.jsx(ce__default.default.Fragment,{children:jsxRuntime.jsx(Q,{...d,children:reactCore.renderChildren(o,d)})},m.id)})})};ge.displayName="BgsFormArray";var Ye=ge;ce__default.default.memo(({children:e,props:a})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:reactCore.renderChildren(e,a)}));var Fe=ce.createContext(void 0);function H(){let e=ce.useContext(Fe);return e||{}}function _({children:e,...a}){return jsxRuntime.jsx(Fe.Provider,{value:a,children:e})}var Te=({children:e,...a})=>{let o=C(),n=ce.useMemo(()=>reactCore.generateUUID(),[]);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(_,{...o,...a,formGroupId:n,children:e})})};Te.displayName="BgsFormGroup";var sr=Te;var ir=/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;function z({validationRules:e,label:a},o,n){let{formControl:f,getData:u}=o,t=[];return e&&(typeof e=="string"?he(n,e,true,a,f,u,{}).forEach(s=>t.push(s)):typeof e=="object"&&Object.keys(e).forEach(s=>{let{validate:m}=t.find(r=>r.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let r=e[s],d="";["match","diff"].includes(s)&&typeof r=="object"&&(r=e[s].dataField,d=e[s].label),r!=null&&he(n,s,r,a,f,u,m,d).forEach(p=>t.push(p));}else if(typeof e[s]=="object"){let r=e[s];t.push({validate:{...m,[s]:d=>r.validation(d)||r.message&&(typeof r.message=="string"?r.message:r.message(a))}});}})),Object.assign({},...t)}var he=(e,a,o,n,f,u,t,s)=>{let m=[],{required:l,minLength:r,maxLength:d,min:p,max:b,email:U,match:R,diff:D,pattern:g}=e||{},v={required:i=>{if(!o)return true;let A=l?l(n):`${n} is required`;return typeof i=="string"&&!i.trim()||i==null?A:true},minLength:{value:o,message:r?r(n,o):`${n} must be at least ${o} characters long`},maxLength:{value:o,message:d?d(n,o):`${n} cannot be more than ${o} characters long`},min:{value:Number(o),message:p?p(n,o):`${n} should be at least ${o}`},max:{value:Number(o),message:b?b(n,o):`${n} should be at most ${o}`},regexp:(i="")=>i?new RegExp(o.regexp).test(i)||`${n} ${o.message}`:true,email:(i="")=>!o||!i?true:ir.test(i)||(U?U(n):`${n} must be type email`),match:(i="")=>i?i===(u&&u(o))||(R?R(n,s||reactCore.labelFormatter.changeAll(o)):`${n} must be same with ${s||reactCore.labelFormatter.changeAll(o)}`):true,diff:(i="")=>i?i!==(u&&u(o))||(D?D(n,s||reactCore.labelFormatter.changeAll(o)):`${n} must be different with ${s||reactCore.labelFormatter.changeAll(o)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(g?.alphabet?g?.alphabet(n):`${n} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(g?.alphanumber?g?.alphanumber(n):`${n} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(g?.number?g?.number(n):`${n} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(g?.lowercase?g?.lowercase(n):`${n} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(g?.url?g?.url(n):`${n} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(g?.uppercase?g?.uppercase(n):`${n} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(g?.mixedcase?g?.mixedcase(n):`${n} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(g?.specialcharacters?g?.specialcharacters(n):`${n} must contain special characters`)}}[a];if(v){let{validate:i}=m.find(A=>A.validate)||{};typeof v=="function"?m.push({validate:{...i,...t,[a]:v}}):a==="pattern"?m.push({validate:{...i,...t,[`${a}${o}`]:v[o]}}):m.push({[a]:v});}return m};var Mt=e=>{let a=ce.useMemo(()=>reactCore.generateUUID(),[]),o=C(),{validationMessage:n}=$(),{registerItem:f,unregisterItem:u,control:t,disabled:s,readOnly:m,formId:l,setSelected:r,useSelected:d,onFieldChange:p}=o,{name:b,formId:U,...R}=H(),{name:D,formId:g}=q(),T=ce.useMemo(()=>{let w=e.dataField;return e.disabledHierarchy||(D&&l===g&&(w=`${D}${w}`),b&&l===U&&(w=`${b}${w}`)),w},[D,l,g,e.dataField,b,U,e.disabledHierarchy]),v=ce.useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return reactCore.labelFormatter.changeAll(T)},[e.label,e.noLabel,T]);ce.useEffect(()=>(f({id:a,...e,dataField:T,label:v}),()=>{u(a);}),[a,e,T,v]);let i=ce.useMemo(()=>typeof e.disabled=="boolean"?e.disabled:typeof R.disabled=="boolean"?R.disabled:!!s,[e.disabled,R.disabled,s]),A=ce.useMemo(()=>typeof e.readOnly=="boolean"?e.readOnly:typeof R.readOnly=="boolean"?R.readOnly:!!m,[e.readOnly,R.readOnly,m]),y=ce.useMemo(()=>typeof e.hidden=="boolean"?e.hidden:false,[e.hidden]),F=ce.useMemo(()=>{if(typeof e.required=="boolean"){if(typeof e.validationRules>"u")return {required:e.required};if(typeof e.validationRules=="string"&&e.validationRules==="email")return {email:true,required:e.required};if(typeof e.validationRules=="object")return {...e.validationRules,required:e.required}}return e.validationRules},[e.validationRules,e.required]),h=ce.useMemo(()=>i||A||y?{required:false}:z({validationRules:F,label:v},o,n),[i,A,y,F,v,T,o,n]),I=reactHookForm.useController({name:T,control:t,disabled:i,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:h}),c=I.fieldState.invalid,P=I.fieldState.error?.message,S=reactHookForm.useWatch({name:T,control:t,defaultValue:e.defaultValue}),G=ce.useMemo(()=>reactCore.debounce(w=>r(Re=>({...Re,[T]:w||null}))),[r,T]),ve=d(T),Pe=F?.required;return {...e,setSelectedField:G,label:v,dataField:T,controller:I,invalid:c,messageError:P,selectedField:ve,value:S,required:Pe,onChange:w=>{I.field.onChange(w),p?.(T,w,o);}}};var Lt=()=>{let{formControl:e,items:a}=C(),o=(f,u,t,s=0)=>{let m=[];if(Array.isArray(t))t.forEach((l,r)=>{let d=Object.entries(l||{}).map(([p,b])=>o(`${f}.${r}.${p}`,`${u}[]${p}`,b,t.length>1?r+1:0)).flat();m=[...m,...d];});else if(t&&typeof t=="object"&&!Array.isArray(t)&&!t?.ref)Object.entries(t).map(([l,r])=>{let d=o(`${f}.${l}`,`${f}.${l}`,r);m=[...m,...d];});else {let l=t?.message||"",r=a.find(d=>d.dataField===u)?.label;m.push({label:`${r||""}${s>0?` ${s}`:""}`,message:l,dataField:f});}return m};return Object.entries(e.formState.errors||{}).map(([f,u])=>o(f,f,u)).flat()};function Ht(e){let{watch:a}=C(),o=ce.useMemo(()=>{let t=new Set,s=m=>{if(m)for(let[l,r]of Object.entries(m)){if(l==="and"||l==="or"){r?.forEach(s);continue}r&&typeof r=="object"&&"fromField"in r&&typeof r.fromField=="string"&&t.add(r.fromField);}};return s(e),Array.from(t)},[e]),n=o.length?a(o):[],f=ce.useMemo(()=>{let t={};return o.forEach((s,m)=>{t[s]=n?.[m];}),t},[o,n]),u=ce.useCallback(t=>{if(!t)return t;let s={};for(let[m,l]of Object.entries(t)){if(m==="and"||m==="or"){s[m]=l?.map(r=>u(r))??l;continue}if(l&&typeof l=="object"&&"fromField"in l){let r=l,d={...r},p=r.fromField;p&&p in f?d.value=f[p]:d.value=r.value,delete d.fromField,s[m]=d;}else s[m]=l;}return s},[f]);return ce.useMemo(()=>u(e)??{},[e,u])}var gr=(m=>(m.alphabet="alphabet",m.alphaNumber="alphanumber",m.number="number",m.lowercase="lowercase",m.url="url",m.uppercase="uppercase",m.mixedCase="mixedcase",m.specialCharacters="specialcharacters",m))(gr||{});var Jt=le;exports.BgsFormArray=Ye;exports.BgsFormGroup=sr;exports.BgsReactFormProvider=ee;exports.PatternTypeEnum=gr;exports.default=Jt;exports.useBgsController=Mt;exports.useBgsForm=C;exports.useBgsFormArray=q;exports.useBgsFormArrayInit=fe;exports.useBgsFormGroup=H;exports.useBgsFormInit=ie;exports.useResolvedQuery=Ht;exports.useSummaryValidation=Lt;
|
package/dist/index.d.cts
CHANGED
|
@@ -42,6 +42,7 @@ type FormPropsBase<T> = Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmi
|
|
|
42
42
|
onChange?: OnChange<T>;
|
|
43
43
|
onFieldChange?: OnFieldChange<T>;
|
|
44
44
|
onInvalid?: (errors: FieldErrors) => void;
|
|
45
|
+
onValidateDraft?: OnValidateDraft<T>;
|
|
45
46
|
};
|
|
46
47
|
type FormProps<T = unknown> = (FormPropsBase<T> & {
|
|
47
48
|
controller: UseFormInitReturn<T> | UseFormInitReturn<T>[];
|
|
@@ -53,6 +54,7 @@ type OnChange<T = unknown> = (values: T, event: {
|
|
|
53
54
|
type?: EventType | undefined;
|
|
54
55
|
}, controller: UseFormInitReturn<T>) => void;
|
|
55
56
|
type OnFieldChange<T = unknown> = (dataField: string, value: T, controller: UseFormInitReturn<T>) => void;
|
|
57
|
+
type OnValidateDraft<T = unknown> = (draftData: T, formData: T | undefined) => boolean | Promise<boolean>;
|
|
56
58
|
type SetSelectedFn<T> = (newState: SelectedNested<T> | ((prev: SelectedNested<T>) => SelectedNested<T>)) => void;
|
|
57
59
|
interface UseFormInitReturn<T = unknown> extends FormDefaultProps, Omit<UseFormReturn, "reset" | "watch" | "setValue">, UseDraftReturn<T> {
|
|
58
60
|
reset: <P extends NestedKeyOf<T>>(field?: P | P[]) => void;
|
|
@@ -107,6 +109,7 @@ type ControllerProps<T = unknown> = T & {
|
|
|
107
109
|
shouldUnregister?: boolean;
|
|
108
110
|
required?: boolean;
|
|
109
111
|
disabledHierarchy?: boolean;
|
|
112
|
+
disabledDraft?: boolean;
|
|
110
113
|
};
|
|
111
114
|
type PatternType = "alphabet" | "alphanumber" | "number" | "lowercase" | "url" | "uppercase" | "mixedcase" | "specialcharacters";
|
|
112
115
|
declare enum PatternTypeEnum {
|
|
@@ -182,7 +185,7 @@ type UseController<T, M> = ControllerProps<T> & {
|
|
|
182
185
|
onChange: (value: M) => void;
|
|
183
186
|
};
|
|
184
187
|
|
|
185
|
-
declare const BgsForm: <T>({ asChild, onSubmit, onChange, onInvalid, onFieldChange, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
188
|
+
declare const BgsForm: <T>({ asChild, onSubmit, onChange, onInvalid, onFieldChange, onValidateDraft, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
186
189
|
|
|
187
190
|
declare const FormArray: {
|
|
188
191
|
<T>({ defaultData, controller: controllerProps, children, ...others }: PropsWithChildren<FormArrayProps<T>>): react_jsx_runtime.JSX.Element;
|
|
@@ -263,4 +266,4 @@ type ResolvedQueryCondition<T> = {
|
|
|
263
266
|
};
|
|
264
267
|
declare function useResolvedQuery<T>(condition?: ResolvedQueryCondition<T>): ResolvedQueryCondition<T>;
|
|
265
268
|
|
|
266
|
-
export { type ArrayFormPropsBase, FormArray as BgsFormArray, FormGroup as BgsFormGroup, type BgsFormProviderProps, BgsReactFormProvider, type ControllerProps, type FormArrayProps, type FormGroupProps, type FormProps, type OnChange, type OnFieldChange, type OnSubmit, type OptionsInit, type PatternType, PatternTypeEnum, type ResolvedQueryCondition, type ResolvedQueryFilterOption, type SelectedNested, type TriggerSubmit, type UseBgsForm, type UseController, type UseFormArray, type UseFormArrayInitReturn, type UseFormInitReturn, type UseSelected, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsController, useForm as useBgsForm, useFormArray as useBgsFormArray, useBgsFormArrayInit, useFormGroup as useBgsFormGroup, useBgsFormInit, useResolvedQuery, useSummaryValidation };
|
|
269
|
+
export { type ArrayFormPropsBase, FormArray as BgsFormArray, FormGroup as BgsFormGroup, type BgsFormProviderProps, BgsReactFormProvider, type ControllerProps, type FormArrayProps, type FormGroupProps, type FormProps, type OnChange, type OnFieldChange, type OnSubmit, type OnValidateDraft, type OptionsInit, type PatternType, PatternTypeEnum, type ResolvedQueryCondition, type ResolvedQueryFilterOption, type SelectedNested, type TriggerSubmit, type UseBgsForm, type UseController, type UseFormArray, type UseFormArrayInitReturn, type UseFormInitReturn, type UseSelected, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsController, useForm as useBgsForm, useFormArray as useBgsFormArray, useBgsFormArrayInit, useFormGroup as useBgsFormGroup, useBgsFormInit, useResolvedQuery, useSummaryValidation };
|
package/dist/index.d.ts
CHANGED
|
@@ -42,6 +42,7 @@ type FormPropsBase<T> = Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmi
|
|
|
42
42
|
onChange?: OnChange<T>;
|
|
43
43
|
onFieldChange?: OnFieldChange<T>;
|
|
44
44
|
onInvalid?: (errors: FieldErrors) => void;
|
|
45
|
+
onValidateDraft?: OnValidateDraft<T>;
|
|
45
46
|
};
|
|
46
47
|
type FormProps<T = unknown> = (FormPropsBase<T> & {
|
|
47
48
|
controller: UseFormInitReturn<T> | UseFormInitReturn<T>[];
|
|
@@ -53,6 +54,7 @@ type OnChange<T = unknown> = (values: T, event: {
|
|
|
53
54
|
type?: EventType | undefined;
|
|
54
55
|
}, controller: UseFormInitReturn<T>) => void;
|
|
55
56
|
type OnFieldChange<T = unknown> = (dataField: string, value: T, controller: UseFormInitReturn<T>) => void;
|
|
57
|
+
type OnValidateDraft<T = unknown> = (draftData: T, formData: T | undefined) => boolean | Promise<boolean>;
|
|
56
58
|
type SetSelectedFn<T> = (newState: SelectedNested<T> | ((prev: SelectedNested<T>) => SelectedNested<T>)) => void;
|
|
57
59
|
interface UseFormInitReturn<T = unknown> extends FormDefaultProps, Omit<UseFormReturn, "reset" | "watch" | "setValue">, UseDraftReturn<T> {
|
|
58
60
|
reset: <P extends NestedKeyOf<T>>(field?: P | P[]) => void;
|
|
@@ -107,6 +109,7 @@ type ControllerProps<T = unknown> = T & {
|
|
|
107
109
|
shouldUnregister?: boolean;
|
|
108
110
|
required?: boolean;
|
|
109
111
|
disabledHierarchy?: boolean;
|
|
112
|
+
disabledDraft?: boolean;
|
|
110
113
|
};
|
|
111
114
|
type PatternType = "alphabet" | "alphanumber" | "number" | "lowercase" | "url" | "uppercase" | "mixedcase" | "specialcharacters";
|
|
112
115
|
declare enum PatternTypeEnum {
|
|
@@ -182,7 +185,7 @@ type UseController<T, M> = ControllerProps<T> & {
|
|
|
182
185
|
onChange: (value: M) => void;
|
|
183
186
|
};
|
|
184
187
|
|
|
185
|
-
declare const BgsForm: <T>({ asChild, onSubmit, onChange, onInvalid, onFieldChange, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
188
|
+
declare const BgsForm: <T>({ asChild, onSubmit, onChange, onInvalid, onFieldChange, onValidateDraft, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
186
189
|
|
|
187
190
|
declare const FormArray: {
|
|
188
191
|
<T>({ defaultData, controller: controllerProps, children, ...others }: PropsWithChildren<FormArrayProps<T>>): react_jsx_runtime.JSX.Element;
|
|
@@ -263,4 +266,4 @@ type ResolvedQueryCondition<T> = {
|
|
|
263
266
|
};
|
|
264
267
|
declare function useResolvedQuery<T>(condition?: ResolvedQueryCondition<T>): ResolvedQueryCondition<T>;
|
|
265
268
|
|
|
266
|
-
export { type ArrayFormPropsBase, FormArray as BgsFormArray, FormGroup as BgsFormGroup, type BgsFormProviderProps, BgsReactFormProvider, type ControllerProps, type FormArrayProps, type FormGroupProps, type FormProps, type OnChange, type OnFieldChange, type OnSubmit, type OptionsInit, type PatternType, PatternTypeEnum, type ResolvedQueryCondition, type ResolvedQueryFilterOption, type SelectedNested, type TriggerSubmit, type UseBgsForm, type UseController, type UseFormArray, type UseFormArrayInitReturn, type UseFormInitReturn, type UseSelected, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsController, useForm as useBgsForm, useFormArray as useBgsFormArray, useBgsFormArrayInit, useFormGroup as useBgsFormGroup, useBgsFormInit, useResolvedQuery, useSummaryValidation };
|
|
269
|
+
export { type ArrayFormPropsBase, FormArray as BgsFormArray, FormGroup as BgsFormGroup, type BgsFormProviderProps, BgsReactFormProvider, type ControllerProps, type FormArrayProps, type FormGroupProps, type FormProps, type OnChange, type OnFieldChange, type OnSubmit, type OnValidateDraft, type OptionsInit, type PatternType, PatternTypeEnum, type ResolvedQueryCondition, type ResolvedQueryFilterOption, type SelectedNested, type TriggerSubmit, type UseBgsForm, type UseController, type UseFormArray, type UseFormArrayInitReturn, type UseFormInitReturn, type UseSelected, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsController, useForm as useBgsForm, useFormArray as useBgsFormArray, useBgsFormArrayInit, useFormGroup as useBgsFormGroup, useBgsFormInit, useResolvedQuery, useSummaryValidation };
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import fe,{createContext,useContext,useMemo,useRef,useState,useCallback,useEffect}from'react';import {jsx,Fragment}from'react/jsx-runtime';import {renderChildren,generateUUID,getFieldValue,mappingUndefinedtoNull,isArray,debounce,labelFormatter,isNotEmpty,diffJson,useDbLiveFlag,createStore,createDatabase,createTable}from'@bgscore/react-core';import {useForm,useFieldArray,useWatch,useController}from'react-hook-form';var Z=createContext(void 0);function C(){let e=useContext(Z);return e||{}}function G({children:e,controller:a,onSubmit:o,onFieldChange:n=()=>{}}){let d={...a,triggerSubmit:async(t,s)=>{a.setIsSubmit(true);let m=s?await a.formControl.trigger():true,l=a.getData();m&&o&&o({...l,...t},{...a});},onFieldChange:n};return jsx(Z.Provider,{value:d,children:e})}var M=new WeakMap;function J(e){return M.has(e)||M.set(e,createStore({})),M.get(e)}function B(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let a={};for(let[o,n]of Object.entries(e))if(o.includes(".")){let u=o.split("."),d=a;for(let t=0;t<u.length;t++){let s=u[t];t===u.length-1?d[s]=B(n):((!d[s]||typeof d[s]!="object")&&(d[s]={}),d=d[s]);}}else a[o]=B(n);return a}function k(){return createTable({name:"draft",primaryKey:"field_1731131919872_aj29d"})}var X=createContext(void 0);function O(){let e=useContext(X);return e||{}}function Y({children:e,value:a}){return jsx(X.Provider,{value:a,children:e})}function L(){let{dbName:e="bgs-react-form"}=O();return createDatabase({dbName:e,table:{draft:k()}})}function ee(e){let a=L(),o=useDbLiveFlag(a.draft.detail,{key:e}),n=async(t,s)=>{let l={...await d(),...t};Object.keys(l).forEach(c=>{isNotEmpty(l[c])||delete l[c];});let r=Object.keys(l);if(r.length===1&&r[0]==="field_1731131919872_aj29d")return u();r.some(c=>c!=="field_1731131919872_aj29d"&&l[c]!==getFieldValue(s,c))?await a.draft.put(e,l):await u();},u=async()=>{await a.draft.remove(e);},d=async()=>await a.draft.detail(e);return {isDraft:o,saveDraft:n,removeDraft:u,getDataDraft:d}}var ae=(e={})=>{let a=useMemo(()=>B(e.defaultValues||{}),[]),o=useRef(null),[n,u]=useState(false),d=e?.draftKey,t=d?ee(d):void 0,s=useRef([]),m=useCallback(p=>{let P=s.current.findIndex(D=>D.id===p.id);if(P>-1){let D=[...s.current];D[P]=p,s.current=[...D];}else s.current.push(p);},[s]),l=useCallback(p=>{s.current=s.current.filter(P=>P.id!==p);},[s]),r=useForm({reValidateMode:"onSubmit",mode:"all",defaultValues:a,...e}),f=useMemo(()=>J(r),[r]),c=useMemo(()=>generateUUID(),[]),b=useCallback(p=>p?getFieldValue(mappingUndefinedtoNull(r.getValues()),p):mappingUndefinedtoNull(r.getValues()),[r]),U=useCallback(p=>{p?typeof p=="string"?r.resetField(p,{}):typeof p=="object"&&isArray(p,0)&&p.forEach(P=>r.resetField(P)):r.reset();},[r]),x=useCallback((p,P)=>{let D=b();r.reset(B({...D,...p}),P);},[r]),A=useCallback((p,P)=>{r.setValue(p,P);},[r]),y=useCallback(p=>useFieldArray({control:r.control,name:p}),[useFieldArray,r]),F=useCallback(p=>useWatch({control:r.control,name:p}),[useWatch,r]),v=useCallback(()=>{t?.removeDraft?.();},[t]),i=useCallback(()=>{t?.removeDraft?.(),U();},[t,U]),g=useCallback(p=>f.useStore(P=>getFieldValue(P,p)),[f]),h=useCallback(f.setState,[f]),T=useCallback((...p)=>t?.saveDraft?.(...p),[t]),E=useCallback(()=>t?.getDataDraft?.(),[t]),w={...r,setValue:A,ref:o,reset:U,updateData:x,getData:b,formControl:r,useFieldArray:y,useWatch:F,isSubmit:n,formId:c,setIsSubmit:u,useSelected:g,setSelected:h,isDraft:!!t?.isDraft,removeDraft:v,resetDraft:i,saveDraft:T,getDataDraft:E,draftKey:d,registerItem:m,unregisterItem:l,items:s.current,getItems:()=>s.current};return [w,w]};var Ve=({asChild:e,onSubmit:a,onChange:o,onInvalid:n,onFieldChange:u,formData:d,controller:t,children:s,...m})=>{d&&(d=B(d));let l=t??ae({draftKey:m.draftKey}),[r]=useMemo(()=>Array.isArray(l)?l:[l],[l]),f=r.draftKey,c=useRef(true),b=useRef(void 0),{autoSaveDelay:U=.5}=O(),x=async g=>{g.preventDefault(),g.stopPropagation(),r.setIsSubmit(true);let h=await r.formControl.trigger(),T=r.getData();h?a&&a({...T},{...r}):n&&n(r.formControl.formState.errors);},A=async()=>{if(!f)return;let g=await r.getDataDraft();g&&Object.entries(g).forEach(([h,T])=>{h==="field_1731131919872_aj29d"||!isNotEmpty(T)||(r.setValue(h,T),r.trigger(h));});},y=()=>{if(d){let g={...d};diffJson(b.current||{},g)&&(r.updateData(g),b.current=g,setTimeout(A,0));}};useEffect(()=>{y();},[d,r.formControl.reset]),useEffect(()=>{if(!o)return;let g=r.formControl.watch((h,T)=>o(h,T,r));return ()=>g.unsubscribe()},[]),useEffect(()=>{c.current=true;},[f]),useEffect(()=>{c.current&&r?.isDraft&&(c.current=false,A());},[r.isDraft,f]);let F=useMemo(()=>debounce((g,h,T)=>{T?.saveDraft?.({[g]:h},d);},U),[d,U]),v=async(g,h,T)=>{u?.(g,h,T),F(g,h,T);},i={...m};return delete i?.draftKey,jsx(Fragment,{children:jsx(G,{controller:{...r,disabled:m?.disabled,readOnly:m?.readOnly},onSubmit:a,onFieldChange:v,children:e?jsx("div",{id:r.formId,children:s}):jsx("form",{...i,id:r.formId,ref:r.ref,onSubmit:x,children:s})})})},de=Ve;var le=createContext(void 0);function j(){let e=useContext(le);return e||{}}function q({children:e,...a}){return jsx(le.Provider,{value:a,children:e})}var ue=e=>{let a=C(),o=useFieldArray({control:a.control,name:e}),u={formArrayId:useMemo(()=>generateUUID(),[]),name:e,...o,...a};return [u,u]};var pe=({defaultData:e,controller:a,children:o,...n})=>{let u=a??ue(n?.name),d=useRef(false),[t]=Array.isArray(u)?u:[u],s=t.name;return useEffect(()=>{d.current||e&&(t.fields.length>0||(typeof e=="boolean"?(t.append({}),d.current=true):typeof e=="number"&&e>0?(t.append([...Array(e).fill(null).map(()=>({}))]),d.current=true):typeof e=="object"&&(t.append(e),d.current=true)));},[]),jsx(Fragment,{children:t.fields.map((m,l)=>{let r=`${s}.${l}.`,f={...t,index:l,fieldId:m.id,name:r,countFields:t.fields.length,removeItem:()=>t.remove(l),watchItem:c=>t.watch(c?`${r}${c}`:r.slice(0,-1)),setValueItem:(c,b)=>t.setValue(`${r}${c}`,b),useSelectedItem:c=>t.useSelected(`${r}${c}`)};return jsx(fe.Fragment,{children:jsx(q,{...f,children:renderChildren(o,f)})},m.id)})})};pe.displayName="BgsFormArray";var Ye=pe;fe.memo(({children:e,props:a})=>jsx(Fragment,{children:renderChildren(e,a)}));var ye=createContext(void 0);function Q(){let e=useContext(ye);return e||{}}function H({children:e,...a}){return jsx(ye.Provider,{value:a,children:e})}var he=({children:e,...a})=>{let o=C(),n=useMemo(()=>generateUUID(),[]);return jsx(Fragment,{children:jsx(H,{...o,...a,formGroupId:n,children:e})})};he.displayName="BgsFormGroup";var sr=he;var ir=/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;function _({validationRules:e,label:a},o,n){let{formControl:u,getData:d}=o,t=[];return e&&(typeof e=="string"?Te(n,e,true,a,u,d,{}).forEach(s=>t.push(s)):typeof e=="object"&&Object.keys(e).forEach(s=>{let{validate:m}=t.find(r=>r.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let r=e[s],f="";["match","diff"].includes(s)&&typeof r=="object"&&(r=e[s].dataField,f=e[s].label),r!=null&&Te(n,s,r,a,u,d,m,f).forEach(c=>t.push(c));}else if(typeof e[s]=="object"){let r=e[s];t.push({validate:{...m,[s]:f=>r.validation(f)||r.message&&(typeof r.message=="string"?r.message:r.message(a))}});}})),Object.assign({},...t)}var Te=(e,a,o,n,u,d,t,s)=>{let m=[],{required:l,minLength:r,maxLength:f,min:c,max:b,email:U,match:x,diff:A,pattern:y}=e||{},v={required:i=>{if(!o)return true;let g=l?l(n):`${n} is required`;return typeof i=="string"&&!i.trim()||i==null?g:true},minLength:{value:o,message:r?r(n,o):`${n} must be at least ${o} characters long`},maxLength:{value:o,message:f?f(n,o):`${n} cannot be more than ${o} characters long`},min:{value:Number(o),message:c?c(n,o):`${n} should be at least ${o}`},max:{value:Number(o),message:b?b(n,o):`${n} should be at most ${o}`},regexp:(i="")=>i?new RegExp(o.regexp).test(i)||`${n} ${o.message}`:true,email:(i="")=>!o||!i?true:ir.test(i)||(U?U(n):`${n} must be type email`),match:(i="")=>i?i===(d&&d(o))||(x?x(n,s||labelFormatter.changeAll(o)):`${n} must be same with ${s||labelFormatter.changeAll(o)}`):true,diff:(i="")=>i?i!==(d&&d(o))||(A?A(n,s||labelFormatter.changeAll(o)):`${n} must be different with ${s||labelFormatter.changeAll(o)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(y?.alphabet?y?.alphabet(n):`${n} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(y?.alphanumber?y?.alphanumber(n):`${n} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(y?.number?y?.number(n):`${n} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(y?.lowercase?y?.lowercase(n):`${n} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(y?.url?y?.url(n):`${n} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(y?.uppercase?y?.uppercase(n):`${n} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(y?.mixedcase?y?.mixedcase(n):`${n} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(y?.specialcharacters?y?.specialcharacters(n):`${n} must contain special characters`)}}[a];if(v){let{validate:i}=m.find(g=>g.validate)||{};typeof v=="function"?m.push({validate:{...i,...t,[a]:v}}):a==="pattern"?m.push({validate:{...i,...t,[`${a}${o}`]:v[o]}}):m.push({[a]:v});}return m};var Mt=e=>{let a=useMemo(()=>generateUUID(),[]),o=C(),{validationMessage:n}=O(),{registerItem:u,unregisterItem:d,control:t,disabled:s,readOnly:m,formId:l,setSelected:r,useSelected:f,onFieldChange:c}=o,{name:b,formId:U,...x}=Q(),{name:A,formId:y}=j(),F=useMemo(()=>{let I=e.dataField;return e.disabledHierarchy||(A&&l===y&&(I=`${A}${I}`),b&&l===U&&(I=`${b}${I}`)),I},[A,l,y,e.dataField,b,U,e.disabledHierarchy]),v=useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return labelFormatter.changeAll(F)},[e.label,e.noLabel,F]);useEffect(()=>(u({id:a,...e,dataField:F,label:v}),()=>{d(a);}),[a,e,F,v]);let i=useMemo(()=>typeof e.disabled=="boolean"?e.disabled:typeof x.disabled=="boolean"?x.disabled:!!s,[e.disabled,x.disabled,s]),g=useMemo(()=>typeof e.readOnly=="boolean"?e.readOnly:typeof x.readOnly=="boolean"?x.readOnly:!!m,[e.readOnly,x.readOnly,m]),h=useMemo(()=>typeof e.hidden=="boolean"?e.hidden:false,[e.hidden]),T=useMemo(()=>{if(typeof e.required=="boolean"){if(typeof e.validationRules>"u")return {required:e.required};if(typeof e.validationRules=="string"&&e.validationRules==="email")return {email:true,required:e.required};if(typeof e.validationRules=="object")return {...e.validationRules,required:e.required}}return e.validationRules},[e.validationRules,e.required]),E=useMemo(()=>i||g||h?{required:false}:_({validationRules:T,label:v},o,n),[i,g,h,T,v,F,o,n]),w=useController({name:F,control:t,disabled:i,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:E}),p=w.fieldState.invalid,P=w.fieldState.error?.message,D=useWatch({name:F,control:t,defaultValue:e.defaultValue}),be=useMemo(()=>debounce(I=>r(Re=>({...Re,[F]:I||null}))),[r,F]),ve=f(F),Pe=T?.required;return {...e,setSelectedField:be,label:v,dataField:F,controller:w,invalid:p,messageError:P,selectedField:ve,value:D,required:Pe,onChange:I=>{w.field.onChange(I),c?.(F,I,o);}}};var Vt=()=>{let{formControl:e,items:a}=C(),o=(u,d,t,s=0)=>{let m=[];if(Array.isArray(t))t.forEach((l,r)=>{let f=Object.entries(l||{}).map(([c,b])=>o(`${u}.${r}.${c}`,`${d}[]${c}`,b,t.length>1?r+1:0)).flat();m=[...m,...f];});else if(t&&typeof t=="object"&&!Array.isArray(t)&&!t?.ref)Object.entries(t).map(([l,r])=>{let f=o(`${u}.${l}`,`${u}.${l}`,r);m=[...m,...f];});else {let l=t?.message||"",r=a.find(f=>f.dataField===d)?.label;m.push({label:`${r||""}${s>0?` ${s}`:""}`,message:l,dataField:u});}return m};return Object.entries(e.formState.errors||{}).map(([u,d])=>o(u,u,d)).flat()};function Ht(e){let{watch:a}=C(),o=useMemo(()=>{let t=new Set,s=m=>{if(m)for(let[l,r]of Object.entries(m)){if(l==="and"||l==="or"){r?.forEach(s);continue}r&&typeof r=="object"&&"fromField"in r&&typeof r.fromField=="string"&&t.add(r.fromField);}};return s(e),Array.from(t)},[e]),n=o.length?a(o):[],u=useMemo(()=>{let t={};return o.forEach((s,m)=>{t[s]=n?.[m];}),t},[o,n]),d=useCallback(t=>{if(!t)return t;let s={};for(let[m,l]of Object.entries(t)){if(m==="and"||m==="or"){s[m]=l?.map(r=>d(r))??l;continue}if(l&&typeof l=="object"&&"fromField"in l){let r=l,f={...r},c=r.fromField;c&&c in u?f.value=u[c]:f.value=r.value,delete f.fromField,s[m]=f;}else s[m]=l;}return s},[u]);return useMemo(()=>d(e)??{},[e,d])}var gr=(m=>(m.alphabet="alphabet",m.alphaNumber="alphanumber",m.number="number",m.lowercase="lowercase",m.url="url",m.uppercase="uppercase",m.mixedCase="mixedcase",m.specialCharacters="specialcharacters",m))(gr||{});var Jt=de;export{Ye as BgsFormArray,sr as BgsFormGroup,Y as BgsReactFormProvider,gr as PatternTypeEnum,Jt as default,Mt as useBgsController,C as useBgsForm,j as useBgsFormArray,ue as useBgsFormArrayInit,Q as useBgsFormGroup,ae as useBgsFormInit,Ht as useResolvedQuery,Vt as useSummaryValidation};
|
|
1
|
+
import ce,{createContext,useContext,useMemo,useRef,useState,useCallback,useEffect}from'react';import {jsx,Fragment}from'react/jsx-runtime';import {renderChildren,generateUUID,getFieldValue,mappingUndefinedtoNull,isArray,debounce,labelFormatter,isNotEmpty,diffJson,useDbLiveFlag,createStore,createDatabase,createTable}from'@bgscore/react-core';import {useForm,useFieldArray,useWatch,useController}from'react-hook-form';var J=createContext(void 0);function C(){let e=useContext(J);return e||{}}function M({children:e,controller:a,onSubmit:o,onFieldChange:n=()=>{}}){let u={...a,triggerSubmit:async(t,s)=>{a.setIsSubmit(true);let m=s?await a.formControl.trigger():true,l=a.getData();m&&o&&o({...l,...t},{...a});},onFieldChange:n};return jsx(J.Provider,{value:u,children:e})}var k=new WeakMap;function X(e){return k.has(e)||k.set(e,createStore({})),k.get(e)}function B(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let a={};for(let[o,n]of Object.entries(e))if(o.includes(".")){let f=o.split("."),u=a;for(let t=0;t<f.length;t++){let s=f[t];t===f.length-1?u[s]=B(n):((!u[s]||typeof u[s]!="object")&&(u[s]={}),u=u[s]);}}else a[o]=B(n);return a}function V(){return createTable({name:"draft",primaryKey:"field_1731131919872_aj29d"})}var Y=createContext(void 0);function $(){let e=useContext(Y);return e||{}}function ee({children:e,value:a}){return jsx(Y.Provider,{value:a,children:e})}function L(){let{dbName:e="bgs-react-form"}=$();return createDatabase({dbName:e,table:{draft:V()}})}function re(e){let a=L(),o=useDbLiveFlag(a.draft.detail,{key:e}),n=async(t,s)=>{let l={...await u(),...t};Object.keys(l).forEach(p=>{isNotEmpty(l[p])||delete l[p];});let r=Object.keys(l);if(r.length===1&&r[0]==="field_1731131919872_aj29d")return f();r.some(p=>p!=="field_1731131919872_aj29d"&&l[p]!==getFieldValue(s,p))?await a.draft.put(e,l):await f();},f=async()=>{await a.draft.remove(e);},u=async()=>await a.draft.detail(e);return {isDraft:o,saveDraft:n,removeDraft:f,getDataDraft:u}}var ie=(e={})=>{let a=useMemo(()=>B(e.defaultValues||{}),[]),o=useRef(null),[n,f]=useState(false),u=e?.draftKey,t=u?re(u):void 0,s=useRef([]),m=useCallback(c=>{let P=s.current.findIndex(S=>S.id===c.id);if(P>-1){let S=[...s.current];S[P]=c,s.current=[...S];}else s.current.push(c);},[s]),l=useCallback(c=>{s.current=s.current.filter(P=>P.id!==c);},[s]),r=useForm({reValidateMode:"onSubmit",mode:"all",defaultValues:a,...e}),d=useMemo(()=>X(r),[r]),p=useMemo(()=>generateUUID(),[]),b=useCallback(c=>c?getFieldValue(mappingUndefinedtoNull(r.getValues()),c):mappingUndefinedtoNull(r.getValues()),[r]),U=useCallback(c=>{c?typeof c=="string"?r.resetField(c,{}):typeof c=="object"&&isArray(c,0)&&c.forEach(P=>r.resetField(P)):r.reset();},[r]),R=useCallback((c,P)=>{let S=b(),G=B({...S,...c});r.reset(G,P);},[r]),D=useCallback((c,P)=>{let S=b();r.setValue(c,P),F({[c]:P},S);},[r]),g=useCallback(c=>useFieldArray({control:r.control,name:c}),[useFieldArray,r]),T=useCallback(c=>useWatch({control:r.control,name:c}),[useWatch,r]),v=useCallback(()=>{t?.removeDraft?.();},[t]),i=useCallback(()=>{t?.removeDraft?.(),U();},[t,U]),A=useCallback(c=>d.useStore(P=>getFieldValue(P,c)),[d]),y=useCallback(d.setState,[d]),F=useCallback((...c)=>t?.saveDraft?.(...c),[t]),h=useCallback(()=>t?.getDataDraft?.(),[t]),I={...r,setValue:D,ref:o,reset:U,updateData:R,getData:b,formControl:r,useFieldArray:g,useWatch:T,isSubmit:n,formId:p,setIsSubmit:f,useSelected:A,setSelected:y,isDraft:!!t?.isDraft,removeDraft:v,resetDraft:i,saveDraft:F,getDataDraft:h,draftKey:u,registerItem:m,unregisterItem:l,items:s.current,getItems:()=>s.current};return [I,I]};var Le=({asChild:e,onSubmit:a,onChange:o,onInvalid:n,onFieldChange:f,onValidateDraft:u,formData:t,controller:s,children:m,...l})=>{t&&(t=B(t));let r=s??ie({draftKey:l.draftKey}),[d]=useMemo(()=>Array.isArray(r)?r:[r],[r]),p=d.draftKey,b=useRef(true),U=useRef(void 0),{autoSaveDelay:R=.5}=$(),D=async y=>{y.preventDefault(),y.stopPropagation(),d.setIsSubmit(true);let F=await d.formControl.trigger(),h=d.getData();F?a&&a({...h},{...d}):n&&n(d.formControl.formState.errors);},g=async()=>{if(!p)return;let y=await d.getDataDraft();if(y){if(u&&!await u(y,t))return;Object.entries(y).forEach(([F,h])=>{let I=d.getItems()?.some(c=>c.dataField===F&&c.disabledDraft)??false;F==="field_1731131919872_aj29d"||!isNotEmpty(h)||I||(d.setValue(F,h),d.trigger(F));});}},T=()=>{if(t){let y={...t};diffJson(U.current||{},y)&&(d.updateData(y),U.current=y,setTimeout(g,0));}};useEffect(()=>{T();},[t,d.formControl.reset]),useEffect(()=>{if(!o)return;let y=d.formControl.watch((F,h)=>o(F,h,d));return ()=>y.unsubscribe()},[]),useEffect(()=>{b.current=true;},[p]),useEffect(()=>{b.current&&d?.isDraft&&(b.current=false,g());},[d.isDraft,p,u]);let v=useMemo(()=>debounce((y,F,h)=>{h?.saveDraft?.({[y]:F},t);},R),[t,R]),i=async(y,F,h)=>{f?.(y,F,h),!(h.getItems()?.some(c=>c.dataField===y&&c.disabledDraft)??false)&&v(y,F,h);},A={...l};return delete A?.draftKey,jsx(Fragment,{children:jsx(M,{controller:{...d,disabled:l?.disabled,readOnly:l?.readOnly},onSubmit:a,onFieldChange:i,children:e?jsx("div",{id:d.formId,children:m}):jsx("form",{...A,id:d.formId,ref:d.ref,onSubmit:D,children:m})})})},le=Le;var ue=createContext(void 0);function q(){let e=useContext(ue);return e||{}}function Q({children:e,...a}){return jsx(ue.Provider,{value:a,children:e})}var fe=e=>{let a=C(),o=useFieldArray({control:a.control,name:e}),f={formArrayId:useMemo(()=>generateUUID(),[]),name:e,...o,...a};return [f,f]};var ge=({defaultData:e,controller:a,children:o,...n})=>{let f=a??fe(n?.name),u=useRef(false),[t]=Array.isArray(f)?f:[f],s=t.name;return useEffect(()=>{u.current||e&&(t.fields.length>0||(typeof e=="boolean"?(t.append({}),u.current=true):typeof e=="number"&&e>0?(t.append([...Array(e).fill(null).map(()=>({}))]),u.current=true):typeof e=="object"&&(t.append(e),u.current=true)));},[]),jsx(Fragment,{children:t.fields.map((m,l)=>{let r=`${s}.${l}.`,d={...t,index:l,fieldId:m.id,name:r,countFields:t.fields.length,removeItem:()=>t.remove(l),watchItem:p=>t.watch(p?`${r}${p}`:r.slice(0,-1)),setValueItem:(p,b)=>t.setValue(`${r}${p}`,b),useSelectedItem:p=>t.useSelected(`${r}${p}`)};return jsx(ce.Fragment,{children:jsx(Q,{...d,children:renderChildren(o,d)})},m.id)})})};ge.displayName="BgsFormArray";var Ye=ge;ce.memo(({children:e,props:a})=>jsx(Fragment,{children:renderChildren(e,a)}));var Fe=createContext(void 0);function H(){let e=useContext(Fe);return e||{}}function _({children:e,...a}){return jsx(Fe.Provider,{value:a,children:e})}var Te=({children:e,...a})=>{let o=C(),n=useMemo(()=>generateUUID(),[]);return jsx(Fragment,{children:jsx(_,{...o,...a,formGroupId:n,children:e})})};Te.displayName="BgsFormGroup";var sr=Te;var ir=/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;function z({validationRules:e,label:a},o,n){let{formControl:f,getData:u}=o,t=[];return e&&(typeof e=="string"?he(n,e,true,a,f,u,{}).forEach(s=>t.push(s)):typeof e=="object"&&Object.keys(e).forEach(s=>{let{validate:m}=t.find(r=>r.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let r=e[s],d="";["match","diff"].includes(s)&&typeof r=="object"&&(r=e[s].dataField,d=e[s].label),r!=null&&he(n,s,r,a,f,u,m,d).forEach(p=>t.push(p));}else if(typeof e[s]=="object"){let r=e[s];t.push({validate:{...m,[s]:d=>r.validation(d)||r.message&&(typeof r.message=="string"?r.message:r.message(a))}});}})),Object.assign({},...t)}var he=(e,a,o,n,f,u,t,s)=>{let m=[],{required:l,minLength:r,maxLength:d,min:p,max:b,email:U,match:R,diff:D,pattern:g}=e||{},v={required:i=>{if(!o)return true;let A=l?l(n):`${n} is required`;return typeof i=="string"&&!i.trim()||i==null?A:true},minLength:{value:o,message:r?r(n,o):`${n} must be at least ${o} characters long`},maxLength:{value:o,message:d?d(n,o):`${n} cannot be more than ${o} characters long`},min:{value:Number(o),message:p?p(n,o):`${n} should be at least ${o}`},max:{value:Number(o),message:b?b(n,o):`${n} should be at most ${o}`},regexp:(i="")=>i?new RegExp(o.regexp).test(i)||`${n} ${o.message}`:true,email:(i="")=>!o||!i?true:ir.test(i)||(U?U(n):`${n} must be type email`),match:(i="")=>i?i===(u&&u(o))||(R?R(n,s||labelFormatter.changeAll(o)):`${n} must be same with ${s||labelFormatter.changeAll(o)}`):true,diff:(i="")=>i?i!==(u&&u(o))||(D?D(n,s||labelFormatter.changeAll(o)):`${n} must be different with ${s||labelFormatter.changeAll(o)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(g?.alphabet?g?.alphabet(n):`${n} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(g?.alphanumber?g?.alphanumber(n):`${n} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(g?.number?g?.number(n):`${n} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(g?.lowercase?g?.lowercase(n):`${n} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(g?.url?g?.url(n):`${n} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(g?.uppercase?g?.uppercase(n):`${n} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(g?.mixedcase?g?.mixedcase(n):`${n} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(g?.specialcharacters?g?.specialcharacters(n):`${n} must contain special characters`)}}[a];if(v){let{validate:i}=m.find(A=>A.validate)||{};typeof v=="function"?m.push({validate:{...i,...t,[a]:v}}):a==="pattern"?m.push({validate:{...i,...t,[`${a}${o}`]:v[o]}}):m.push({[a]:v});}return m};var Mt=e=>{let a=useMemo(()=>generateUUID(),[]),o=C(),{validationMessage:n}=$(),{registerItem:f,unregisterItem:u,control:t,disabled:s,readOnly:m,formId:l,setSelected:r,useSelected:d,onFieldChange:p}=o,{name:b,formId:U,...R}=H(),{name:D,formId:g}=q(),T=useMemo(()=>{let w=e.dataField;return e.disabledHierarchy||(D&&l===g&&(w=`${D}${w}`),b&&l===U&&(w=`${b}${w}`)),w},[D,l,g,e.dataField,b,U,e.disabledHierarchy]),v=useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return labelFormatter.changeAll(T)},[e.label,e.noLabel,T]);useEffect(()=>(f({id:a,...e,dataField:T,label:v}),()=>{u(a);}),[a,e,T,v]);let i=useMemo(()=>typeof e.disabled=="boolean"?e.disabled:typeof R.disabled=="boolean"?R.disabled:!!s,[e.disabled,R.disabled,s]),A=useMemo(()=>typeof e.readOnly=="boolean"?e.readOnly:typeof R.readOnly=="boolean"?R.readOnly:!!m,[e.readOnly,R.readOnly,m]),y=useMemo(()=>typeof e.hidden=="boolean"?e.hidden:false,[e.hidden]),F=useMemo(()=>{if(typeof e.required=="boolean"){if(typeof e.validationRules>"u")return {required:e.required};if(typeof e.validationRules=="string"&&e.validationRules==="email")return {email:true,required:e.required};if(typeof e.validationRules=="object")return {...e.validationRules,required:e.required}}return e.validationRules},[e.validationRules,e.required]),h=useMemo(()=>i||A||y?{required:false}:z({validationRules:F,label:v},o,n),[i,A,y,F,v,T,o,n]),I=useController({name:T,control:t,disabled:i,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:h}),c=I.fieldState.invalid,P=I.fieldState.error?.message,S=useWatch({name:T,control:t,defaultValue:e.defaultValue}),G=useMemo(()=>debounce(w=>r(Re=>({...Re,[T]:w||null}))),[r,T]),ve=d(T),Pe=F?.required;return {...e,setSelectedField:G,label:v,dataField:T,controller:I,invalid:c,messageError:P,selectedField:ve,value:S,required:Pe,onChange:w=>{I.field.onChange(w),p?.(T,w,o);}}};var Lt=()=>{let{formControl:e,items:a}=C(),o=(f,u,t,s=0)=>{let m=[];if(Array.isArray(t))t.forEach((l,r)=>{let d=Object.entries(l||{}).map(([p,b])=>o(`${f}.${r}.${p}`,`${u}[]${p}`,b,t.length>1?r+1:0)).flat();m=[...m,...d];});else if(t&&typeof t=="object"&&!Array.isArray(t)&&!t?.ref)Object.entries(t).map(([l,r])=>{let d=o(`${f}.${l}`,`${f}.${l}`,r);m=[...m,...d];});else {let l=t?.message||"",r=a.find(d=>d.dataField===u)?.label;m.push({label:`${r||""}${s>0?` ${s}`:""}`,message:l,dataField:f});}return m};return Object.entries(e.formState.errors||{}).map(([f,u])=>o(f,f,u)).flat()};function Ht(e){let{watch:a}=C(),o=useMemo(()=>{let t=new Set,s=m=>{if(m)for(let[l,r]of Object.entries(m)){if(l==="and"||l==="or"){r?.forEach(s);continue}r&&typeof r=="object"&&"fromField"in r&&typeof r.fromField=="string"&&t.add(r.fromField);}};return s(e),Array.from(t)},[e]),n=o.length?a(o):[],f=useMemo(()=>{let t={};return o.forEach((s,m)=>{t[s]=n?.[m];}),t},[o,n]),u=useCallback(t=>{if(!t)return t;let s={};for(let[m,l]of Object.entries(t)){if(m==="and"||m==="or"){s[m]=l?.map(r=>u(r))??l;continue}if(l&&typeof l=="object"&&"fromField"in l){let r=l,d={...r},p=r.fromField;p&&p in f?d.value=f[p]:d.value=r.value,delete d.fromField,s[m]=d;}else s[m]=l;}return s},[f]);return useMemo(()=>u(e)??{},[e,u])}var gr=(m=>(m.alphabet="alphabet",m.alphaNumber="alphanumber",m.number="number",m.lowercase="lowercase",m.url="url",m.uppercase="uppercase",m.mixedCase="mixedcase",m.specialCharacters="specialcharacters",m))(gr||{});var Jt=le;export{Ye as BgsFormArray,sr as BgsFormGroup,ee as BgsReactFormProvider,gr as PatternTypeEnum,Jt as default,Mt as useBgsController,C as useBgsForm,q as useBgsFormArray,fe as useBgsFormArrayInit,H as useBgsFormGroup,ie as useBgsFormInit,Ht as useResolvedQuery,Lt as useSummaryValidation};
|
package/package.json
CHANGED