@bgscore/react-form 1.0.8 → 1.0.9
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 +1 -1
- package/dist/index.d.ts +1 -1
- 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 J=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 J__default=/*#__PURE__*/_interopDefault(J);var M=J.createContext(void 0);function F(){let e=J.useContext(M);return e||{}}function v({children:e,controller:r,onSubmit:t,onFieldChange:f=()=>{}}){let i=J.useRef([]),n=J.useCallback(l=>{let d=i.current.findIndex(a=>a.id===l.id);if(d>-1){let a=[...i.current];a[d]=l,i.current=[...a];}else i.current.push(l);},[i]),m=J.useCallback(l=>{i.current=i.current.filter(d=>d.id!==l);},[]),u=async(l,d)=>{r.setIsSubmit(true);let a=d?await r.formControl.trigger():true,p=r.getData();a&&t&&t({...p,...l},{...r});},o={...r,registerItem:n,unregisterItem:m,items:i.current,triggerSubmit:u,onFieldChange:f};return jsxRuntime.jsx(M.Provider,{value:o,children:e})}var w=new WeakMap;function N(e){return w.has(e)||w.set(e,reactCore.createStore({})),w.get(e)}function A(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let r={};for(let[t,f]of Object.entries(e))if(t.includes(".")){let i=t.split("."),n=r;for(let m=0;m<i.length;m++){let u=i[m];m===i.length-1?n[u]=A(f):((!n[u]||typeof n[u]!="object")&&(n[u]={}),n=n[u]);}}else r[t]=A(f);return r}var D=(e,r)=>{e||(e={}),e=A(e);let t=J.useRef(null),[f,i]=J.useState(false),n=reactHookForm.useForm({...r,reValidateMode:"onSubmit",mode:"all",defaultValues:e}),m=N(n),u=J.useMemo(()=>reactCore.generateUUID(),[]),o=a=>a?reactCore.getFieldValue(reactCore.mappingUndefinedtoNull(n.getValues()),a):reactCore.mappingUndefinedtoNull(n.getValues()),d={...n,ref:t,reset:a=>{a?typeof a=="string"?n.resetField(a,{}):typeof a=="object"&&reactCore.isArray(a,0)&&a.forEach(p=>n.resetField(p)):n.reset();},updateData:a=>{let p=o();n.reset(A({...p,...a}));},getData:o,formControl:n,useFieldArray:a=>reactHookForm.useFieldArray({control:n.control,name:a}),useWatch:a=>reactHookForm.useWatch({control:n.control,name:a}),isSubmit:f,formId:u,setIsSubmit:i,useSelected:a=>m.useStore(p=>reactCore.getFieldValue(p,a)),setSelected:m.setState};return [d,d]};var $e=({onSubmit:e,onChange:r,onInvalid:t,formData:f,controller:i,children:n,...m})=>{f&&(f=A(f));let u=i??D(),[o]=Array.isArray(u)?u:[u],l=J.useRef(void 0),d=async a=>{a.preventDefault(),a.stopPropagation(),o.setIsSubmit(true);let p=await o.formControl.trigger(),g=o.getData();p?e&&e({...g},{...o}):t&&t(o.formControl.formState.errors);};return J.useEffect(()=>{f&&reactCore.diffJson(l.current||{},f)&&(o.formControl.reset(f),l.current=f);},[f,o.formControl.reset]),J.useEffect(()=>{if(!r)return;let a=o.formControl.watch((p,g)=>r(p,g,o));return ()=>a.unsubscribe()},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(v,{controller:{...o,disabled:m?.disabled,readOnly:m?.readOnly},onSubmit:e,children:jsxRuntime.jsx("form",{...m,id:o.formId,ref:o.ref,onSubmit:d,children:n})})})},z=$e;var j=J.createContext(void 0);function O(){let e=J.useContext(j);return e||{}}function G({children:e,...r}){return jsxRuntime.jsx(j.Provider,{value:r,children:e})}var Z=e=>{let r=F(),t=reactHookForm.useFieldArray({control:r.control,name:e}),i={formArrayId:J.useMemo(()=>reactCore.generateUUID(),[]),...t,...r};return [i,i]};var X=({name:e,defaultData:r,controller:t,children:f})=>{let i=t??Z(e),[n]=Array.isArray(i)?i:[i];return J.useEffect(()=>{typeof r=="boolean"&&r?n.append({}):typeof r=="number"&&r>0?n.append([...Array(r).fill(null).map(()=>({}))]):typeof r=="object"&&r&&n.append(r);},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:n.fields.map((m,u)=>{let o=`${e}.${u}.`,l={...n,index:u,fieldId:m.id,name:o,countFields:n.fields.length,removeItem:()=>n.remove(u),watchItem:d=>n.watch(d?`${o}${d}`:o.slice(0,-1)),setValueItem:(d,a)=>n.setValue(`${o}${d}`,a),useSelectedItem:d=>n.useSelected(`${o}${d}`)};return jsxRuntime.jsx(J__default.default.Fragment,{children:jsxRuntime.jsx(G,{...l,children:reactCore.renderChildren(f,l)})},m.id)})})};X.displayName="BgsFormArray";var Le=X;J__default.default.memo(({children:e,props:r})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:reactCore.renderChildren(e,r)}));var Q=J.createContext(void 0);function W(){let e=J.useContext(Q);return e||{}}function E({children:e,...r}){return jsxRuntime.jsx(Q.Provider,{value:r,children:e})}var ee=({children:e,...r})=>{let t=F(),f=J.useMemo(()=>reactCore.generateUUID(),[]);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(E,{...t,...r,formGroupId:f,children:e})})};ee.displayName="BgsFormGroup";var He=ee;var re=J.createContext(void 0);function te(){let e=J.useContext(re);return e||{}}function oe({children:e,...r}){return jsxRuntime.jsx(re.Provider,{value:r,children:e})}var Ve=/^(([^<>()[\]\\.,;:\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 k({validationRules:e,label:r}){let{formControl:t,getData:f}=F(),i=[];return e&&(typeof e=="string"?ne(e,true,r,t,f,{}).forEach(n=>i.push(n)):typeof e=="object"&&Object.keys(e).forEach(n=>{let{validate:m}=i.find(o=>o.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(n)){let o=e[n],l="";["match","diff"].includes(n)&&typeof o=="object"&&(o=e[n].dataField,l=e[n].label),o!=null&&ne(n,o,r,t,f,m,l).forEach(d=>i.push(d));}else if(typeof e[n]=="object"){let o=e[n];i.push({validate:{...m,[n]:l=>o.validation(l)||o.message&&(typeof o.message=="string"?o.message:o.message(r))}});}})),Object.assign({},...i)}var ne=(e,r,t,f,i,n,m)=>{let u=[],{validationMessage:o}=te(),{required:l,minLength:d,maxLength:a,min:p,max:g,email:b,match:T,diff:U,pattern:c}=o||{},y={required:s=>{if(!r)return true;let x=l?l(t):`${t} is required`;return typeof s=="string"&&!s.trim()||s==null?x:true},minLength:{value:r,message:d?d(t,r):`${t} must be at least ${r} characters long`},maxLength:{value:r,message:a?a(t,r):`${t} cannot be more than ${r} characters long`},min:{value:Number(r),message:p?p(t,r):`${t} should be at least ${r}`},max:{value:Number(r),message:g?g(t,r):`${t} should be at most ${r}`},regexp:(s="")=>s?new RegExp(r.regexp).test(s)||`${t} ${r.message}`:true,email:(s="")=>!r||!s?true:Ve.test(s)||(b?b(t):`${t} must be type email`),match:(s="")=>s?s===(i&&i(r))||(T?T(t,m||reactCore.labelFormatter.changeAll(r)):`${t} must be same with ${m||reactCore.labelFormatter.changeAll(r)}`):true,diff:(s="")=>s?s!==(i&&i(r))||(U?U(t,m||reactCore.labelFormatter.changeAll(r)):`${t} must be different with ${m||reactCore.labelFormatter.changeAll(r)}`):true,pattern:{alphabet:(s="")=>!!s&&new RegExp("^[A-Za-z ]*$").test(s)||(c?.alphabet?c?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(s="")=>!!s&&new RegExp("^[A-Za-z0-9 ]*$").test(s)||(c?.alphanumber?c?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(s="")=>!!s&&new RegExp("^[0-9]*$").test(s)||(c?.number?c?.number(t):`${t} must be format Number`),lowercase:(s="")=>!!s&&new RegExp("^[a-z0-9 ]*$").test(s)||(c?.lowercase?c?.lowercase(t):`${t} must be format Lowercase`),url:(s="")=>!!s&&/^(ftp|http|https):\/\/[^ "]+$/.test(s)||(c?.url?c?.url(t):`${t} must be a valid URL`),uppercase:(s="")=>!!s&&new RegExp("^[A-Z0-9 ]*$").test(s)||(c?.uppercase?c?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(s="")=>!!s&&/[a-z]/.test(s)&&/[A-Z]/.test(s)||(c?.mixedcase?c?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(s="")=>!!s&&/[^a-zA-Z0-9\s]/.test(s)||(c?.specialcharacters?c?.specialcharacters(t):`${t} must contain special characters`)}}[e];if(y){let{validate:s}=u.find(x=>x.validate)||{};typeof y=="function"?u.push({validate:{...s,...n,[e]:y}}):e==="pattern"?u.push({validate:{...s,...n,[`${e}${r}`]:y[r]}}):u.push({[e]:y});}return u};var gt=e=>{let r=J.useMemo(()=>reactCore.generateUUID(),[]),t=F(),{registerItem:f,unregisterItem:i,control:n,disabled:m,readOnly:u,formId:o,setSelected:l,useSelected:d,onFieldChange:a}=t,{name:p,formId:g,...b}=W(),{name:T,formId:U}=O(),c=J.useMemo(()=>{let h=e.dataField;return e.disabledHierarchy||(T&&o===U&&(h=`${T}${h}`),p&&o===g&&(h=`${p}${h}`)),h},[T,o,U,e.dataField,p,g,e.disabledHierarchy]),C=J.useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return reactCore.labelFormatter.changeAll(c)},[e.label,e.noLabel,c]);J.useEffect(()=>(f({id:r,...e,dataField:c,label:C}),()=>{i(r);}),[r,e,c,C]);let y=false;typeof e.disabled=="boolean"?y=e.disabled:typeof b.disabled=="boolean"?y=b.disabled:y=!!m;let s=false;typeof e.readOnly=="boolean"?s=e.readOnly:typeof b.readOnly=="boolean"?s=b.readOnly:s=!!u;let x=false;typeof e.hidden=="boolean"&&(x=e.hidden);let R=e.validationRules;typeof e.required=="boolean"&&(typeof e.validationRules>"u"?R={required:e.required}:typeof e.validationRules=="string"&&e.validationRules==="email"?R={email:true,required:e.required}:typeof e.validationRules=="object"&&(R={...e.validationRules,required:e.required}));let se=y||s||x?{required:false}:k({...e,validationRules:R,label:C}),I=reactHookForm.useController({name:c,control:n,disabled:y,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:se}),ie=I.fieldState.invalid,ae=I.fieldState.error?.message,me=reactHookForm.useWatch({name:c,control:n,defaultValue:e.defaultValue}),le=J.useMemo(()=>reactCore.debounce(h=>l(fe=>({...fe,[c]:h||null}))),[l,c]),de=d(c),ue=R?.required,ce=I.field.onChange;return I.field.onChange=h=>{ce(h),a?.(c,h,t);},{...e,setSelectedField:le,label:C,dataField:c,controller:I,invalid:ie,messageError:ae,selectedField:de,value:me,required:ue}};var ht=()=>{let{formControl:e,items:r}=F(),t=(i,n,m,u=0)=>{let o=[];if(Array.isArray(m))m.forEach((l,d)=>{let a=Object.entries(l||{}).map(([p,g])=>t(`${i}.${d}.${p}`,`${n}[]${p}`,g,m.length>1?d+1:0)).flat();o=[...o,...a];});else if(m&&typeof m=="object"&&!Array.isArray(m)&&!m?.ref)Object.entries(m).map(([l,d])=>{let a=t(`${i}.${l}`,`${i}.${l}`,d);o=[...o,...a];});else {let l=m?.message||"",d=r.find(a=>a.dataField===n)?.label;o.push({label:`${d||""}${u>0?` ${u}`:""}`,message:l,dataField:i});}return o};return Object.entries(e.formState.errors||{}).map(([i,n])=>t(i,i,n)).flat()};var tr=(o=>(o.alphabet="alphabet",o.alphaNumber="alphanumber",o.number="number",o.lowercase="lowercase",o.url="url",o.uppercase="uppercase",o.mixedCase="mixedcase",o.specialCharacters="specialcharacters",o))(tr||{});var Tt=z;exports.BgsFormArray=Le;exports.BgsFormGroup=He;exports.BgsReactFormProvider=oe;exports.PatternTypeEnum=tr;exports.default=Tt;exports.useBgsController=gt;exports.useBgsForm=F;exports.useBgsFormArray=O;exports.useBgsFormArrayInit=Z;exports.useBgsFormGroup=W;exports.useBgsFormInit=D;exports.useSummaryValidation=ht;
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var J=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 J__default=/*#__PURE__*/_interopDefault(J);var M=J.createContext(void 0);function h(){let e=J.useContext(M);return e||{}}function v({children:e,controller:r,onSubmit:t,onFieldChange:p=()=>{}}){let n=J.useRef([]),o=J.useCallback(a=>{let d=n.current.findIndex(m=>m.id===a.id);if(d>-1){let m=[...n.current];m[d]=a,n.current=[...m];}else n.current.push(a);},[n]),l=J.useCallback(a=>{n.current=n.current.filter(d=>d.id!==a);},[]),u=async(a,d)=>{r.setIsSubmit(true);let m=d?await r.formControl.trigger():true,f=r.getData();m&&t&&t({...f,...a},{...r});},s={...r,registerItem:o,unregisterItem:l,items:n.current,triggerSubmit:u,onFieldChange:p};return jsxRuntime.jsx(M.Provider,{value:s,children:e})}var w=new WeakMap;function N(e){return w.has(e)||w.set(e,reactCore.createStore({})),w.get(e)}function A(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let r={};for(let[t,p]of Object.entries(e))if(t.includes(".")){let n=t.split("."),o=r;for(let l=0;l<n.length;l++){let u=n[l];l===n.length-1?o[u]=A(p):((!o[u]||typeof o[u]!="object")&&(o[u]={}),o=o[u]);}}else r[t]=A(p);return r}var D=(e,r)=>{e||(e={}),e=A(e);let t=J.useRef(null),[p,n]=J.useState(false),o=reactHookForm.useForm({...r,reValidateMode:"onSubmit",mode:"all",defaultValues:e}),l=N(o),u=J.useMemo(()=>reactCore.generateUUID(),[]),s=m=>m?reactCore.getFieldValue(reactCore.mappingUndefinedtoNull(o.getValues()),m):reactCore.mappingUndefinedtoNull(o.getValues()),d={...o,ref:t,reset:m=>{m?typeof m=="string"?o.resetField(m,{}):typeof m=="object"&&reactCore.isArray(m,0)&&m.forEach(f=>o.resetField(f)):o.reset();},updateData:m=>{let f=s();o.reset(A({...f,...m}));},getData:s,formControl:o,useFieldArray:m=>reactHookForm.useFieldArray({control:o.control,name:m}),useWatch:m=>reactHookForm.useWatch({control:o.control,name:m}),isSubmit:p,formId:u,setIsSubmit:n,useSelected:m=>l.useStore(f=>reactCore.getFieldValue(f,m)),setSelected:l.setState};return [d,d]};var $e=({onSubmit:e,onChange:r,onInvalid:t,onFieldChange:p,formData:n,controller:o,children:l,...u})=>{n&&(n=A(n));let s=o??D(),[a]=Array.isArray(s)?s:[s],d=J.useRef(void 0),m=async f=>{f.preventDefault(),f.stopPropagation(),a.setIsSubmit(true);let g=await a.formControl.trigger(),y=a.getData();g?e&&e({...y},{...a}):t&&t(a.formControl.formState.errors);};return J.useEffect(()=>{n&&reactCore.diffJson(d.current||{},n)&&(a.formControl.reset(n),d.current=n);},[n,a.formControl.reset]),J.useEffect(()=>{if(!r)return;let f=a.formControl.watch((g,y)=>r(g,y,a));return ()=>f.unsubscribe()},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(v,{controller:{...a,disabled:u?.disabled,readOnly:u?.readOnly},onSubmit:e,onFieldChange:p,children:jsxRuntime.jsx("form",{...u,id:a.formId,ref:a.ref,onSubmit:m,children:l})})})},z=$e;var j=J.createContext(void 0);function O(){let e=J.useContext(j);return e||{}}function G({children:e,...r}){return jsxRuntime.jsx(j.Provider,{value:r,children:e})}var Z=e=>{let r=h(),t=reactHookForm.useFieldArray({control:r.control,name:e}),n={formArrayId:J.useMemo(()=>reactCore.generateUUID(),[]),...t,...r};return [n,n]};var X=({name:e,defaultData:r,controller:t,children:p})=>{let n=t??Z(e),[o]=Array.isArray(n)?n:[n];return J.useEffect(()=>{typeof r=="boolean"&&r?o.append({}):typeof r=="number"&&r>0?o.append([...Array(r).fill(null).map(()=>({}))]):typeof r=="object"&&r&&o.append(r);},[]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:o.fields.map((l,u)=>{let s=`${e}.${u}.`,a={...o,index:u,fieldId:l.id,name:s,countFields:o.fields.length,removeItem:()=>o.remove(u),watchItem:d=>o.watch(d?`${s}${d}`:s.slice(0,-1)),setValueItem:(d,m)=>o.setValue(`${s}${d}`,m),useSelectedItem:d=>o.useSelected(`${s}${d}`)};return jsxRuntime.jsx(J__default.default.Fragment,{children:jsxRuntime.jsx(G,{...a,children:reactCore.renderChildren(p,a)})},l.id)})})};X.displayName="BgsFormArray";var Le=X;J__default.default.memo(({children:e,props:r})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:reactCore.renderChildren(e,r)}));var Q=J.createContext(void 0);function W(){let e=J.useContext(Q);return e||{}}function E({children:e,...r}){return jsxRuntime.jsx(Q.Provider,{value:r,children:e})}var ee=({children:e,...r})=>{let t=h(),p=J.useMemo(()=>reactCore.generateUUID(),[]);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx(E,{...t,...r,formGroupId:p,children:e})})};ee.displayName="BgsFormGroup";var He=ee;var re=J.createContext(void 0);function te(){let e=J.useContext(re);return e||{}}function oe({children:e,...r}){return jsxRuntime.jsx(re.Provider,{value:r,children:e})}var Ve=/^(([^<>()[\]\\.,;:\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 k({validationRules:e,label:r}){let{formControl:t,getData:p}=h(),n=[];return e&&(typeof e=="string"?ne(e,true,r,t,p,{}).forEach(o=>n.push(o)):typeof e=="object"&&Object.keys(e).forEach(o=>{let{validate:l}=n.find(s=>s.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(o)){let s=e[o],a="";["match","diff"].includes(o)&&typeof s=="object"&&(s=e[o].dataField,a=e[o].label),s!=null&&ne(o,s,r,t,p,l,a).forEach(d=>n.push(d));}else if(typeof e[o]=="object"){let s=e[o];n.push({validate:{...l,[o]:a=>s.validation(a)||s.message&&(typeof s.message=="string"?s.message:s.message(r))}});}})),Object.assign({},...n)}var ne=(e,r,t,p,n,o,l)=>{let u=[],{validationMessage:s}=te(),{required:a,minLength:d,maxLength:m,min:f,max:g,email:y,match:T,diff:U,pattern:c}=s||{},F={required:i=>{if(!r)return true;let x=a?a(t):`${t} is required`;return typeof i=="string"&&!i.trim()||i==null?x:true},minLength:{value:r,message:d?d(t,r):`${t} must be at least ${r} characters long`},maxLength:{value:r,message:m?m(t,r):`${t} cannot be more than ${r} characters long`},min:{value:Number(r),message:f?f(t,r):`${t} should be at least ${r}`},max:{value:Number(r),message:g?g(t,r):`${t} should be at most ${r}`},regexp:(i="")=>i?new RegExp(r.regexp).test(i)||`${t} ${r.message}`:true,email:(i="")=>!r||!i?true:Ve.test(i)||(y?y(t):`${t} must be type email`),match:(i="")=>i?i===(n&&n(r))||(T?T(t,l||reactCore.labelFormatter.changeAll(r)):`${t} must be same with ${l||reactCore.labelFormatter.changeAll(r)}`):true,diff:(i="")=>i?i!==(n&&n(r))||(U?U(t,l||reactCore.labelFormatter.changeAll(r)):`${t} must be different with ${l||reactCore.labelFormatter.changeAll(r)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(c?.alphabet?c?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(c?.alphanumber?c?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(c?.number?c?.number(t):`${t} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(c?.lowercase?c?.lowercase(t):`${t} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(c?.url?c?.url(t):`${t} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(c?.uppercase?c?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(c?.mixedcase?c?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(c?.specialcharacters?c?.specialcharacters(t):`${t} must contain special characters`)}}[e];if(F){let{validate:i}=u.find(x=>x.validate)||{};typeof F=="function"?u.push({validate:{...i,...o,[e]:F}}):e==="pattern"?u.push({validate:{...i,...o,[`${e}${r}`]:F[r]}}):u.push({[e]:F});}return u};var gt=e=>{let r=J.useMemo(()=>reactCore.generateUUID(),[]),t=h(),{registerItem:p,unregisterItem:n,control:o,disabled:l,readOnly:u,formId:s,setSelected:a,useSelected:d,onFieldChange:m}=t,{name:f,formId:g,...y}=W(),{name:T,formId:U}=O(),c=J.useMemo(()=>{let b=e.dataField;return e.disabledHierarchy||(T&&s===U&&(b=`${T}${b}`),f&&s===g&&(b=`${f}${b}`)),b},[T,s,U,e.dataField,f,g,e.disabledHierarchy]),C=J.useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return reactCore.labelFormatter.changeAll(c)},[e.label,e.noLabel,c]);J.useEffect(()=>(p({id:r,...e,dataField:c,label:C}),()=>{n(r);}),[r,e,c,C]);let F=false;typeof e.disabled=="boolean"?F=e.disabled:typeof y.disabled=="boolean"?F=y.disabled:F=!!l;let i=false;typeof e.readOnly=="boolean"?i=e.readOnly:typeof y.readOnly=="boolean"?i=y.readOnly:i=!!u;let x=false;typeof e.hidden=="boolean"&&(x=e.hidden);let R=e.validationRules;typeof e.required=="boolean"&&(typeof e.validationRules>"u"?R={required:e.required}:typeof e.validationRules=="string"&&e.validationRules==="email"?R={email:true,required:e.required}:typeof e.validationRules=="object"&&(R={...e.validationRules,required:e.required}));let se=F||i||x?{required:false}:k({...e,validationRules:R,label:C}),I=reactHookForm.useController({name:c,control:o,disabled:F,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:se}),ie=I.fieldState.invalid,ae=I.fieldState.error?.message,me=reactHookForm.useWatch({name:c,control:o,defaultValue:e.defaultValue}),le=J.useMemo(()=>reactCore.debounce(b=>a(fe=>({...fe,[c]:b||null}))),[a,c]),de=d(c),ue=R?.required,ce=I.field.onChange;return I.field.onChange=b=>{ce(b),m?.(c,b,t);},{...e,setSelectedField:le,label:C,dataField:c,controller:I,invalid:ie,messageError:ae,selectedField:de,value:me,required:ue}};var ht=()=>{let{formControl:e,items:r}=h(),t=(n,o,l,u=0)=>{let s=[];if(Array.isArray(l))l.forEach((a,d)=>{let m=Object.entries(a||{}).map(([f,g])=>t(`${n}.${d}.${f}`,`${o}[]${f}`,g,l.length>1?d+1:0)).flat();s=[...s,...m];});else if(l&&typeof l=="object"&&!Array.isArray(l)&&!l?.ref)Object.entries(l).map(([a,d])=>{let m=t(`${n}.${a}`,`${n}.${a}`,d);s=[...s,...m];});else {let a=l?.message||"",d=r.find(m=>m.dataField===o)?.label;s.push({label:`${d||""}${u>0?` ${u}`:""}`,message:a,dataField:n});}return s};return Object.entries(e.formState.errors||{}).map(([n,o])=>t(n,n,o)).flat()};var tr=(s=>(s.alphabet="alphabet",s.alphaNumber="alphanumber",s.number="number",s.lowercase="lowercase",s.url="url",s.uppercase="uppercase",s.mixedCase="mixedcase",s.specialCharacters="specialcharacters",s))(tr||{});var Tt=z;exports.BgsFormArray=Le;exports.BgsFormGroup=He;exports.BgsReactFormProvider=oe;exports.PatternTypeEnum=tr;exports.default=Tt;exports.useBgsController=gt;exports.useBgsForm=h;exports.useBgsFormArray=O;exports.useBgsFormArrayInit=Z;exports.useBgsFormGroup=W;exports.useBgsFormInit=D;exports.useSummaryValidation=ht;
|
package/dist/index.d.cts
CHANGED
|
@@ -156,7 +156,7 @@ type UseController = ControllerProps & {
|
|
|
156
156
|
selectedField: any;
|
|
157
157
|
};
|
|
158
158
|
|
|
159
|
-
declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
159
|
+
declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, onFieldChange, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
160
160
|
|
|
161
161
|
declare const FormArray: {
|
|
162
162
|
<T>({ name, defaultData, controller: controllerProps, children }: PropsWithChildren<FormArrayProps<T>>): react_jsx_runtime.JSX.Element;
|
package/dist/index.d.ts
CHANGED
|
@@ -156,7 +156,7 @@ type UseController = ControllerProps & {
|
|
|
156
156
|
selectedField: any;
|
|
157
157
|
};
|
|
158
158
|
|
|
159
|
-
declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
159
|
+
declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, onFieldChange, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
|
|
160
160
|
|
|
161
161
|
declare const FormArray: {
|
|
162
162
|
<T>({ name, defaultData, controller: controllerProps, children }: PropsWithChildren<FormArrayProps<T>>): react_jsx_runtime.JSX.Element;
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import J,{createContext,useContext,useRef,useState,useMemo,useEffect,useCallback}from'react';import {jsx,Fragment}from'react/jsx-runtime';import {renderChildren,generateUUID,getFieldValue,mappingUndefinedtoNull,diffJson,labelFormatter,debounce,isArray,createStore}from'@bgscore/react-core';import {useForm,useWatch,useFieldArray,useController}from'react-hook-form';var M=createContext(void 0);function F(){let e=useContext(M);return e||{}}function v({children:e,controller:r,onSubmit:t,onFieldChange:f=()=>{}}){let i=useRef([]),n=useCallback(l=>{let d=i.current.findIndex(a=>a.id===l.id);if(d>-1){let a=[...i.current];a[d]=l,i.current=[...a];}else i.current.push(l);},[i]),m=useCallback(l=>{i.current=i.current.filter(d=>d.id!==l);},[]),u=async(l,d)=>{r.setIsSubmit(true);let a=d?await r.formControl.trigger():true,p=r.getData();a&&t&&t({...p,...l},{...r});},o={...r,registerItem:n,unregisterItem:m,items:i.current,triggerSubmit:u,onFieldChange:f};return jsx(M.Provider,{value:o,children:e})}var w=new WeakMap;function N(e){return w.has(e)||w.set(e,createStore({})),w.get(e)}function A(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let r={};for(let[t,f]of Object.entries(e))if(t.includes(".")){let i=t.split("."),n=r;for(let m=0;m<i.length;m++){let u=i[m];m===i.length-1?n[u]=A(f):((!n[u]||typeof n[u]!="object")&&(n[u]={}),n=n[u]);}}else r[t]=A(f);return r}var D=(e,r)=>{e||(e={}),e=A(e);let t=useRef(null),[f,i]=useState(false),n=useForm({...r,reValidateMode:"onSubmit",mode:"all",defaultValues:e}),m=N(n),u=useMemo(()=>generateUUID(),[]),o=a=>a?getFieldValue(mappingUndefinedtoNull(n.getValues()),a):mappingUndefinedtoNull(n.getValues()),d={...n,ref:t,reset:a=>{a?typeof a=="string"?n.resetField(a,{}):typeof a=="object"&&isArray(a,0)&&a.forEach(p=>n.resetField(p)):n.reset();},updateData:a=>{let p=o();n.reset(A({...p,...a}));},getData:o,formControl:n,useFieldArray:a=>useFieldArray({control:n.control,name:a}),useWatch:a=>useWatch({control:n.control,name:a}),isSubmit:f,formId:u,setIsSubmit:i,useSelected:a=>m.useStore(p=>getFieldValue(p,a)),setSelected:m.setState};return [d,d]};var $e=({onSubmit:e,onChange:r,onInvalid:t,formData:f,controller:i,children:n,...m})=>{f&&(f=A(f));let u=i??D(),[o]=Array.isArray(u)?u:[u],l=useRef(void 0),d=async a=>{a.preventDefault(),a.stopPropagation(),o.setIsSubmit(true);let p=await o.formControl.trigger(),g=o.getData();p?e&&e({...g},{...o}):t&&t(o.formControl.formState.errors);};return useEffect(()=>{f&&diffJson(l.current||{},f)&&(o.formControl.reset(f),l.current=f);},[f,o.formControl.reset]),useEffect(()=>{if(!r)return;let a=o.formControl.watch((p,g)=>r(p,g,o));return ()=>a.unsubscribe()},[]),jsx(Fragment,{children:jsx(v,{controller:{...o,disabled:m?.disabled,readOnly:m?.readOnly},onSubmit:e,children:jsx("form",{...m,id:o.formId,ref:o.ref,onSubmit:d,children:n})})})},z=$e;var j=createContext(void 0);function O(){let e=useContext(j);return e||{}}function G({children:e,...r}){return jsx(j.Provider,{value:r,children:e})}var Z=e=>{let r=F(),t=useFieldArray({control:r.control,name:e}),i={formArrayId:useMemo(()=>generateUUID(),[]),...t,...r};return [i,i]};var X=({name:e,defaultData:r,controller:t,children:f})=>{let i=t??Z(e),[n]=Array.isArray(i)?i:[i];return useEffect(()=>{typeof r=="boolean"&&r?n.append({}):typeof r=="number"&&r>0?n.append([...Array(r).fill(null).map(()=>({}))]):typeof r=="object"&&r&&n.append(r);},[]),jsx(Fragment,{children:n.fields.map((m,u)=>{let o=`${e}.${u}.`,l={...n,index:u,fieldId:m.id,name:o,countFields:n.fields.length,removeItem:()=>n.remove(u),watchItem:d=>n.watch(d?`${o}${d}`:o.slice(0,-1)),setValueItem:(d,a)=>n.setValue(`${o}${d}`,a),useSelectedItem:d=>n.useSelected(`${o}${d}`)};return jsx(J.Fragment,{children:jsx(G,{...l,children:renderChildren(f,l)})},m.id)})})};X.displayName="BgsFormArray";var Le=X;J.memo(({children:e,props:r})=>jsx(Fragment,{children:renderChildren(e,r)}));var Q=createContext(void 0);function W(){let e=useContext(Q);return e||{}}function E({children:e,...r}){return jsx(Q.Provider,{value:r,children:e})}var ee=({children:e,...r})=>{let t=F(),f=useMemo(()=>generateUUID(),[]);return jsx(Fragment,{children:jsx(E,{...t,...r,formGroupId:f,children:e})})};ee.displayName="BgsFormGroup";var He=ee;var re=createContext(void 0);function te(){let e=useContext(re);return e||{}}function oe({children:e,...r}){return jsx(re.Provider,{value:r,children:e})}var Ve=/^(([^<>()[\]\\.,;:\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 k({validationRules:e,label:r}){let{formControl:t,getData:f}=F(),i=[];return e&&(typeof e=="string"?ne(e,true,r,t,f,{}).forEach(n=>i.push(n)):typeof e=="object"&&Object.keys(e).forEach(n=>{let{validate:m}=i.find(o=>o.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(n)){let o=e[n],l="";["match","diff"].includes(n)&&typeof o=="object"&&(o=e[n].dataField,l=e[n].label),o!=null&&ne(n,o,r,t,f,m,l).forEach(d=>i.push(d));}else if(typeof e[n]=="object"){let o=e[n];i.push({validate:{...m,[n]:l=>o.validation(l)||o.message&&(typeof o.message=="string"?o.message:o.message(r))}});}})),Object.assign({},...i)}var ne=(e,r,t,f,i,n,m)=>{let u=[],{validationMessage:o}=te(),{required:l,minLength:d,maxLength:a,min:p,max:g,email:b,match:T,diff:U,pattern:c}=o||{},y={required:s=>{if(!r)return true;let x=l?l(t):`${t} is required`;return typeof s=="string"&&!s.trim()||s==null?x:true},minLength:{value:r,message:d?d(t,r):`${t} must be at least ${r} characters long`},maxLength:{value:r,message:a?a(t,r):`${t} cannot be more than ${r} characters long`},min:{value:Number(r),message:p?p(t,r):`${t} should be at least ${r}`},max:{value:Number(r),message:g?g(t,r):`${t} should be at most ${r}`},regexp:(s="")=>s?new RegExp(r.regexp).test(s)||`${t} ${r.message}`:true,email:(s="")=>!r||!s?true:Ve.test(s)||(b?b(t):`${t} must be type email`),match:(s="")=>s?s===(i&&i(r))||(T?T(t,m||labelFormatter.changeAll(r)):`${t} must be same with ${m||labelFormatter.changeAll(r)}`):true,diff:(s="")=>s?s!==(i&&i(r))||(U?U(t,m||labelFormatter.changeAll(r)):`${t} must be different with ${m||labelFormatter.changeAll(r)}`):true,pattern:{alphabet:(s="")=>!!s&&new RegExp("^[A-Za-z ]*$").test(s)||(c?.alphabet?c?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(s="")=>!!s&&new RegExp("^[A-Za-z0-9 ]*$").test(s)||(c?.alphanumber?c?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(s="")=>!!s&&new RegExp("^[0-9]*$").test(s)||(c?.number?c?.number(t):`${t} must be format Number`),lowercase:(s="")=>!!s&&new RegExp("^[a-z0-9 ]*$").test(s)||(c?.lowercase?c?.lowercase(t):`${t} must be format Lowercase`),url:(s="")=>!!s&&/^(ftp|http|https):\/\/[^ "]+$/.test(s)||(c?.url?c?.url(t):`${t} must be a valid URL`),uppercase:(s="")=>!!s&&new RegExp("^[A-Z0-9 ]*$").test(s)||(c?.uppercase?c?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(s="")=>!!s&&/[a-z]/.test(s)&&/[A-Z]/.test(s)||(c?.mixedcase?c?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(s="")=>!!s&&/[^a-zA-Z0-9\s]/.test(s)||(c?.specialcharacters?c?.specialcharacters(t):`${t} must contain special characters`)}}[e];if(y){let{validate:s}=u.find(x=>x.validate)||{};typeof y=="function"?u.push({validate:{...s,...n,[e]:y}}):e==="pattern"?u.push({validate:{...s,...n,[`${e}${r}`]:y[r]}}):u.push({[e]:y});}return u};var gt=e=>{let r=useMemo(()=>generateUUID(),[]),t=F(),{registerItem:f,unregisterItem:i,control:n,disabled:m,readOnly:u,formId:o,setSelected:l,useSelected:d,onFieldChange:a}=t,{name:p,formId:g,...b}=W(),{name:T,formId:U}=O(),c=useMemo(()=>{let h=e.dataField;return e.disabledHierarchy||(T&&o===U&&(h=`${T}${h}`),p&&o===g&&(h=`${p}${h}`)),h},[T,o,U,e.dataField,p,g,e.disabledHierarchy]),C=useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return labelFormatter.changeAll(c)},[e.label,e.noLabel,c]);useEffect(()=>(f({id:r,...e,dataField:c,label:C}),()=>{i(r);}),[r,e,c,C]);let y=false;typeof e.disabled=="boolean"?y=e.disabled:typeof b.disabled=="boolean"?y=b.disabled:y=!!m;let s=false;typeof e.readOnly=="boolean"?s=e.readOnly:typeof b.readOnly=="boolean"?s=b.readOnly:s=!!u;let x=false;typeof e.hidden=="boolean"&&(x=e.hidden);let R=e.validationRules;typeof e.required=="boolean"&&(typeof e.validationRules>"u"?R={required:e.required}:typeof e.validationRules=="string"&&e.validationRules==="email"?R={email:true,required:e.required}:typeof e.validationRules=="object"&&(R={...e.validationRules,required:e.required}));let se=y||s||x?{required:false}:k({...e,validationRules:R,label:C}),I=useController({name:c,control:n,disabled:y,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:se}),ie=I.fieldState.invalid,ae=I.fieldState.error?.message,me=useWatch({name:c,control:n,defaultValue:e.defaultValue}),le=useMemo(()=>debounce(h=>l(fe=>({...fe,[c]:h||null}))),[l,c]),de=d(c),ue=R?.required,ce=I.field.onChange;return I.field.onChange=h=>{ce(h),a?.(c,h,t);},{...e,setSelectedField:le,label:C,dataField:c,controller:I,invalid:ie,messageError:ae,selectedField:de,value:me,required:ue}};var ht=()=>{let{formControl:e,items:r}=F(),t=(i,n,m,u=0)=>{let o=[];if(Array.isArray(m))m.forEach((l,d)=>{let a=Object.entries(l||{}).map(([p,g])=>t(`${i}.${d}.${p}`,`${n}[]${p}`,g,m.length>1?d+1:0)).flat();o=[...o,...a];});else if(m&&typeof m=="object"&&!Array.isArray(m)&&!m?.ref)Object.entries(m).map(([l,d])=>{let a=t(`${i}.${l}`,`${i}.${l}`,d);o=[...o,...a];});else {let l=m?.message||"",d=r.find(a=>a.dataField===n)?.label;o.push({label:`${d||""}${u>0?` ${u}`:""}`,message:l,dataField:i});}return o};return Object.entries(e.formState.errors||{}).map(([i,n])=>t(i,i,n)).flat()};var tr=(o=>(o.alphabet="alphabet",o.alphaNumber="alphanumber",o.number="number",o.lowercase="lowercase",o.url="url",o.uppercase="uppercase",o.mixedCase="mixedcase",o.specialCharacters="specialcharacters",o))(tr||{});var Tt=z;export{Le as BgsFormArray,He as BgsFormGroup,oe as BgsReactFormProvider,tr as PatternTypeEnum,Tt as default,gt as useBgsController,F as useBgsForm,O as useBgsFormArray,Z as useBgsFormArrayInit,W as useBgsFormGroup,D as useBgsFormInit,ht as useSummaryValidation};
|
|
1
|
+
import J,{createContext,useContext,useRef,useState,useMemo,useEffect,useCallback}from'react';import {jsx,Fragment}from'react/jsx-runtime';import {renderChildren,generateUUID,getFieldValue,mappingUndefinedtoNull,diffJson,labelFormatter,debounce,isArray,createStore}from'@bgscore/react-core';import {useForm,useWatch,useFieldArray,useController}from'react-hook-form';var M=createContext(void 0);function h(){let e=useContext(M);return e||{}}function v({children:e,controller:r,onSubmit:t,onFieldChange:p=()=>{}}){let n=useRef([]),o=useCallback(a=>{let d=n.current.findIndex(m=>m.id===a.id);if(d>-1){let m=[...n.current];m[d]=a,n.current=[...m];}else n.current.push(a);},[n]),l=useCallback(a=>{n.current=n.current.filter(d=>d.id!==a);},[]),u=async(a,d)=>{r.setIsSubmit(true);let m=d?await r.formControl.trigger():true,f=r.getData();m&&t&&t({...f,...a},{...r});},s={...r,registerItem:o,unregisterItem:l,items:n.current,triggerSubmit:u,onFieldChange:p};return jsx(M.Provider,{value:s,children:e})}var w=new WeakMap;function N(e){return w.has(e)||w.set(e,createStore({})),w.get(e)}function A(e){if(typeof e!="object"||e===null||Array.isArray(e))return e;let r={};for(let[t,p]of Object.entries(e))if(t.includes(".")){let n=t.split("."),o=r;for(let l=0;l<n.length;l++){let u=n[l];l===n.length-1?o[u]=A(p):((!o[u]||typeof o[u]!="object")&&(o[u]={}),o=o[u]);}}else r[t]=A(p);return r}var D=(e,r)=>{e||(e={}),e=A(e);let t=useRef(null),[p,n]=useState(false),o=useForm({...r,reValidateMode:"onSubmit",mode:"all",defaultValues:e}),l=N(o),u=useMemo(()=>generateUUID(),[]),s=m=>m?getFieldValue(mappingUndefinedtoNull(o.getValues()),m):mappingUndefinedtoNull(o.getValues()),d={...o,ref:t,reset:m=>{m?typeof m=="string"?o.resetField(m,{}):typeof m=="object"&&isArray(m,0)&&m.forEach(f=>o.resetField(f)):o.reset();},updateData:m=>{let f=s();o.reset(A({...f,...m}));},getData:s,formControl:o,useFieldArray:m=>useFieldArray({control:o.control,name:m}),useWatch:m=>useWatch({control:o.control,name:m}),isSubmit:p,formId:u,setIsSubmit:n,useSelected:m=>l.useStore(f=>getFieldValue(f,m)),setSelected:l.setState};return [d,d]};var $e=({onSubmit:e,onChange:r,onInvalid:t,onFieldChange:p,formData:n,controller:o,children:l,...u})=>{n&&(n=A(n));let s=o??D(),[a]=Array.isArray(s)?s:[s],d=useRef(void 0),m=async f=>{f.preventDefault(),f.stopPropagation(),a.setIsSubmit(true);let g=await a.formControl.trigger(),y=a.getData();g?e&&e({...y},{...a}):t&&t(a.formControl.formState.errors);};return useEffect(()=>{n&&diffJson(d.current||{},n)&&(a.formControl.reset(n),d.current=n);},[n,a.formControl.reset]),useEffect(()=>{if(!r)return;let f=a.formControl.watch((g,y)=>r(g,y,a));return ()=>f.unsubscribe()},[]),jsx(Fragment,{children:jsx(v,{controller:{...a,disabled:u?.disabled,readOnly:u?.readOnly},onSubmit:e,onFieldChange:p,children:jsx("form",{...u,id:a.formId,ref:a.ref,onSubmit:m,children:l})})})},z=$e;var j=createContext(void 0);function O(){let e=useContext(j);return e||{}}function G({children:e,...r}){return jsx(j.Provider,{value:r,children:e})}var Z=e=>{let r=h(),t=useFieldArray({control:r.control,name:e}),n={formArrayId:useMemo(()=>generateUUID(),[]),...t,...r};return [n,n]};var X=({name:e,defaultData:r,controller:t,children:p})=>{let n=t??Z(e),[o]=Array.isArray(n)?n:[n];return useEffect(()=>{typeof r=="boolean"&&r?o.append({}):typeof r=="number"&&r>0?o.append([...Array(r).fill(null).map(()=>({}))]):typeof r=="object"&&r&&o.append(r);},[]),jsx(Fragment,{children:o.fields.map((l,u)=>{let s=`${e}.${u}.`,a={...o,index:u,fieldId:l.id,name:s,countFields:o.fields.length,removeItem:()=>o.remove(u),watchItem:d=>o.watch(d?`${s}${d}`:s.slice(0,-1)),setValueItem:(d,m)=>o.setValue(`${s}${d}`,m),useSelectedItem:d=>o.useSelected(`${s}${d}`)};return jsx(J.Fragment,{children:jsx(G,{...a,children:renderChildren(p,a)})},l.id)})})};X.displayName="BgsFormArray";var Le=X;J.memo(({children:e,props:r})=>jsx(Fragment,{children:renderChildren(e,r)}));var Q=createContext(void 0);function W(){let e=useContext(Q);return e||{}}function E({children:e,...r}){return jsx(Q.Provider,{value:r,children:e})}var ee=({children:e,...r})=>{let t=h(),p=useMemo(()=>generateUUID(),[]);return jsx(Fragment,{children:jsx(E,{...t,...r,formGroupId:p,children:e})})};ee.displayName="BgsFormGroup";var He=ee;var re=createContext(void 0);function te(){let e=useContext(re);return e||{}}function oe({children:e,...r}){return jsx(re.Provider,{value:r,children:e})}var Ve=/^(([^<>()[\]\\.,;:\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 k({validationRules:e,label:r}){let{formControl:t,getData:p}=h(),n=[];return e&&(typeof e=="string"?ne(e,true,r,t,p,{}).forEach(o=>n.push(o)):typeof e=="object"&&Object.keys(e).forEach(o=>{let{validate:l}=n.find(s=>s.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(o)){let s=e[o],a="";["match","diff"].includes(o)&&typeof s=="object"&&(s=e[o].dataField,a=e[o].label),s!=null&&ne(o,s,r,t,p,l,a).forEach(d=>n.push(d));}else if(typeof e[o]=="object"){let s=e[o];n.push({validate:{...l,[o]:a=>s.validation(a)||s.message&&(typeof s.message=="string"?s.message:s.message(r))}});}})),Object.assign({},...n)}var ne=(e,r,t,p,n,o,l)=>{let u=[],{validationMessage:s}=te(),{required:a,minLength:d,maxLength:m,min:f,max:g,email:y,match:T,diff:U,pattern:c}=s||{},F={required:i=>{if(!r)return true;let x=a?a(t):`${t} is required`;return typeof i=="string"&&!i.trim()||i==null?x:true},minLength:{value:r,message:d?d(t,r):`${t} must be at least ${r} characters long`},maxLength:{value:r,message:m?m(t,r):`${t} cannot be more than ${r} characters long`},min:{value:Number(r),message:f?f(t,r):`${t} should be at least ${r}`},max:{value:Number(r),message:g?g(t,r):`${t} should be at most ${r}`},regexp:(i="")=>i?new RegExp(r.regexp).test(i)||`${t} ${r.message}`:true,email:(i="")=>!r||!i?true:Ve.test(i)||(y?y(t):`${t} must be type email`),match:(i="")=>i?i===(n&&n(r))||(T?T(t,l||labelFormatter.changeAll(r)):`${t} must be same with ${l||labelFormatter.changeAll(r)}`):true,diff:(i="")=>i?i!==(n&&n(r))||(U?U(t,l||labelFormatter.changeAll(r)):`${t} must be different with ${l||labelFormatter.changeAll(r)}`):true,pattern:{alphabet:(i="")=>!!i&&new RegExp("^[A-Za-z ]*$").test(i)||(c?.alphabet?c?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(i="")=>!!i&&new RegExp("^[A-Za-z0-9 ]*$").test(i)||(c?.alphanumber?c?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(i="")=>!!i&&new RegExp("^[0-9]*$").test(i)||(c?.number?c?.number(t):`${t} must be format Number`),lowercase:(i="")=>!!i&&new RegExp("^[a-z0-9 ]*$").test(i)||(c?.lowercase?c?.lowercase(t):`${t} must be format Lowercase`),url:(i="")=>!!i&&/^(ftp|http|https):\/\/[^ "]+$/.test(i)||(c?.url?c?.url(t):`${t} must be a valid URL`),uppercase:(i="")=>!!i&&new RegExp("^[A-Z0-9 ]*$").test(i)||(c?.uppercase?c?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(i="")=>!!i&&/[a-z]/.test(i)&&/[A-Z]/.test(i)||(c?.mixedcase?c?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(i="")=>!!i&&/[^a-zA-Z0-9\s]/.test(i)||(c?.specialcharacters?c?.specialcharacters(t):`${t} must contain special characters`)}}[e];if(F){let{validate:i}=u.find(x=>x.validate)||{};typeof F=="function"?u.push({validate:{...i,...o,[e]:F}}):e==="pattern"?u.push({validate:{...i,...o,[`${e}${r}`]:F[r]}}):u.push({[e]:F});}return u};var gt=e=>{let r=useMemo(()=>generateUUID(),[]),t=h(),{registerItem:p,unregisterItem:n,control:o,disabled:l,readOnly:u,formId:s,setSelected:a,useSelected:d,onFieldChange:m}=t,{name:f,formId:g,...y}=W(),{name:T,formId:U}=O(),c=useMemo(()=>{let b=e.dataField;return e.disabledHierarchy||(T&&s===U&&(b=`${T}${b}`),f&&s===g&&(b=`${f}${b}`)),b},[T,s,U,e.dataField,f,g,e.disabledHierarchy]),C=useMemo(()=>{if(e.label)return e.label;if(!e.noLabel)return labelFormatter.changeAll(c)},[e.label,e.noLabel,c]);useEffect(()=>(p({id:r,...e,dataField:c,label:C}),()=>{n(r);}),[r,e,c,C]);let F=false;typeof e.disabled=="boolean"?F=e.disabled:typeof y.disabled=="boolean"?F=y.disabled:F=!!l;let i=false;typeof e.readOnly=="boolean"?i=e.readOnly:typeof y.readOnly=="boolean"?i=y.readOnly:i=!!u;let x=false;typeof e.hidden=="boolean"&&(x=e.hidden);let R=e.validationRules;typeof e.required=="boolean"&&(typeof e.validationRules>"u"?R={required:e.required}:typeof e.validationRules=="string"&&e.validationRules==="email"?R={email:true,required:e.required}:typeof e.validationRules=="object"&&(R={...e.validationRules,required:e.required}));let se=F||i||x?{required:false}:k({...e,validationRules:R,label:C}),I=useController({name:c,control:o,disabled:F,defaultValue:e.defaultValue,shouldUnregister:e.shouldUnregister,rules:se}),ie=I.fieldState.invalid,ae=I.fieldState.error?.message,me=useWatch({name:c,control:o,defaultValue:e.defaultValue}),le=useMemo(()=>debounce(b=>a(fe=>({...fe,[c]:b||null}))),[a,c]),de=d(c),ue=R?.required,ce=I.field.onChange;return I.field.onChange=b=>{ce(b),m?.(c,b,t);},{...e,setSelectedField:le,label:C,dataField:c,controller:I,invalid:ie,messageError:ae,selectedField:de,value:me,required:ue}};var ht=()=>{let{formControl:e,items:r}=h(),t=(n,o,l,u=0)=>{let s=[];if(Array.isArray(l))l.forEach((a,d)=>{let m=Object.entries(a||{}).map(([f,g])=>t(`${n}.${d}.${f}`,`${o}[]${f}`,g,l.length>1?d+1:0)).flat();s=[...s,...m];});else if(l&&typeof l=="object"&&!Array.isArray(l)&&!l?.ref)Object.entries(l).map(([a,d])=>{let m=t(`${n}.${a}`,`${n}.${a}`,d);s=[...s,...m];});else {let a=l?.message||"",d=r.find(m=>m.dataField===o)?.label;s.push({label:`${d||""}${u>0?` ${u}`:""}`,message:a,dataField:n});}return s};return Object.entries(e.formState.errors||{}).map(([n,o])=>t(n,n,o)).flat()};var tr=(s=>(s.alphabet="alphabet",s.alphaNumber="alphanumber",s.number="number",s.lowercase="lowercase",s.url="url",s.uppercase="uppercase",s.mixedCase="mixedcase",s.specialCharacters="specialcharacters",s))(tr||{});var Tt=z;export{Le as BgsFormArray,He as BgsFormGroup,oe as BgsReactFormProvider,tr as PatternTypeEnum,Tt as default,gt as useBgsController,h as useBgsForm,O as useBgsFormArray,Z as useBgsFormArrayInit,W as useBgsFormGroup,D as useBgsFormInit,ht as useSummaryValidation};
|
package/package.json
CHANGED