@bgscore/react-form 0.0.12 → 0.0.13

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _react = require('react');var _jsxruntime = require('react/jsx-runtime');var k=_react.createContext.call(void 0, void 0);function F(){let r=_react.useContext.call(void 0, k);return r||{}}function $({children:r,...e}){let t=_react.useRef.call(void 0, []),l=_react.useCallback.call(void 0, m=>{let u=t.current.findIndex(i=>i.id===m.id);if(u>-1){let i=[...t.current];i[u]=m,t.current=[...i]}else t.current.push(m)},[t]),p=_react.useCallback.call(void 0, m=>{t.current=t.current.filter(u=>u.id!==m)},[]),s={...e,registerItem:l,unregisterItem:p,items:t.current};return _jsxruntime.jsx.call(void 0, k.Provider,{value:s,children:r})}function C(){let r=()=>Math.random()*16%16|0;return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>(e==="x"?r():r()&3|8).toString(16))}function A(r,e){return typeof r=="function"?r(e):r}var h={camelCase:(r="")=>(r=r.split(".").map(e=>(e=e.charAt(0).toUpperCase()+e.slice(1),e)).join(" "),r=r.replace(/([a-z0-9])([A-Z])/g,"$1 $2"),r.charAt(0).toUpperCase()+r.slice(1)),snackCase:(r="")=>{let t=r.replace(/_([a-z])/g,(l,p)=>p.toUpperCase()).replace(/([A-Z])/g," $1");return t=t.charAt(0).toUpperCase()+t.slice(1),t},changeAll:(r="",e=!1)=>{let t="";try{r=_optionalChain([r, 'optionalAccess', _2 => _2.split, 'call', _3 => _3("."), 'access', _4 => _4[_optionalChain([r, 'optionalAccess', _5 => _5.split, 'call', _6 => _6("."), 'optionalAccess', _7 => _7.length])-1]]),r=_optionalChain([r, 'optionalAccess', _8 => _8.split, 'call', _9 => _9("[]"), 'access', _10 => _10[_optionalChain([r, 'optionalAccess', _11 => _11.split, 'call', _12 => _12("[]"), 'optionalAccess', _13 => _13.length])-1]]),t=h.snackCase(h.camelCase(r)),e&&(t=_optionalChain([t, 'optionalAccess', _14 => _14.split, 'call', _15 => _15(" "), 'optionalAccess', _16 => _16.map, 'call', _17 => _17(l=>_optionalChain([l, 'optionalAccess', _18 => _18.length])<=3?_optionalChain([l, 'optionalAccess', _19 => _19.toUpperCase, 'call', _20 => _20()]):l), 'optionalAccess', _21 => _21.join, 'call', _22 => _22(" ")]))}catch (e2){}return t}};function N(r,e){try{return JSON.stringify(r)!==JSON.stringify(e)}catch (e3){return!1}}var I=r=>(Object.keys(r).forEach(e=>{r[e]===void 0&&(r[e]=null)}),r),G=(r,e)=>r?e.includes(".")?G(r[e.substring(0,e.indexOf("."))],e.substring(e.indexOf(".")+1)):r?r[e]:null:"";function S(r,e){let t=!1;return r&&typeof r=="object"&&Array.isArray(r)&&(typeof e=="number"?r.length>e&&(t=!0):t=!0),t}var _reacthookform = require('react-hook-form');var gr=_react.forwardRef.call(void 0, ({children:r,className:e,formData:t,onChange:l=()=>{},onSubmit:p},s)=>{t||(t={});let m=_react.useRef.call(void 0, void 0),u=_react.useRef.call(void 0, null),[i,x]=_react.useState.call(void 0, !1),n=_reacthookform.useForm.call(void 0, {reValidateMode:"onSubmit",mode:"all",defaultValues:t}),c=_react.useMemo.call(void 0, ()=>C(),[]);_react.useEffect.call(void 0, ()=>{t&&N(m.current||{},t)&&(n.reset(t),m.current=t)},[t,n.reset]),_react.useEffect.call(void 0, ()=>{let a=n.watch(l);return()=>a.unsubscribe()},[]);let d=async(a,f,U)=>{let{validate:y=!0,...o}=U||{};a&&(a.preventDefault(),a.stopPropagation()),x(!0);let R=y?await n.trigger():!0,tr=g();R&&p&&p({...tr,...f},{...B,...o,validate:y})},g=a=>a?G(I(n.getValues()),a):I(n.getValues()),B={...n,reset:a=>{a?typeof a=="string"?n.resetField(a,{}):typeof a=="object"&&S(a,0)&&a.forEach(f=>n.resetField(f)):n.reset()},updateData:a=>{let f=g();n.reset({...f,...a})},getData:g,triggerSubmit:(a,f)=>d(void 0,a,f),formControl:n,useFieldArray:a=>_reacthookform.useFieldArray.call(void 0, {control:n.control,name:a}),useWatch:a=>_reacthookform.useWatch.call(void 0, {control:n.control,name:a}),isSubmit:i,formId:c};return _react.useImperativeHandle.call(void 0, s,()=>B),_jsxruntime.jsx.call(void 0, $,{...B,children:_jsxruntime.jsx.call(void 0, "form",{id:c,className:e,ref:u,onSubmit:d,children:A(r,B)})})}),Z=gr;var q=_react.createContext.call(void 0, void 0);function Fr(){let r=_react.useContext.call(void 0, q);return r||{}}function w({children:r,...e}){return _jsxruntime.jsx.call(void 0, q.Provider,{value:e,children:r})}var j=_react.createContext.call(void 0, void 0);function O(){let r=_react.useContext.call(void 0, j);return r||{}}function E({children:r,...e}){return _jsxruntime.jsx.call(void 0, j.Provider,{value:e,children:r})}var H=_react.createContext.call(void 0, void 0);function K(){let r=_react.useContext.call(void 0, H);return r||{}}function J({children:r,...e}){return _jsxruntime.jsx.call(void 0, H.Provider,{value:e,children:r})}function W({validationRules:r,label:e}){let{formControl:t,getData:l}=F(),p=[];return r&&(typeof r=="string"?_(r,!0,e,t,l,{}).forEach(s=>p.push(s)):typeof r=="object"&&Object.keys(r).forEach(s=>{let{validate:m}=p.find(i=>i.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let i=r[s],x="";if(s==="email"&&!i)return;["match","diff"].includes(s)&&typeof i=="object"&&(i=r[s].dataField,x=r[s].label),i!=null&&_(s,i,e,t,l,m,x).forEach(n=>p.push(n))}else if(typeof r[s]=="object"){let i=r[s];p.push({validate:{...m,[s]:x=>i.validation(x)||i.message&&(typeof i.message=="string"?i.message:i.message(e))}})}})),Object.assign({},...p)}var _=(r,e,t,l,p,s,m)=>{let u=[],{validationMessage:i}=K(),{required:x,minLength:n,maxLength:c,min:d,max:g,email:b,match:B,diff:a,pattern:f}=i||{},y={required:{value:!!e,message:x?x(t):`${t} is required`},minLength:{value:e,message:n?n(t,e):`${t} must be at least ${e} characters long`},maxLength:{value:e,message:c?c(t,e):`${t} cannot be more than ${e} characters long`},min:{value:Number(e),message:d?d(t,e):`${t} should be at least ${e}`},max:{value:Number(e),message:g?g(t,e):`${t} should be at most ${e}`},regexp:(o="")=>o?new RegExp(e.regexp).test(o)||`${t} ${e.message}`:!0,email:(o="")=>o?o.match(/^(([^<>()[\]\\.,;:\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,}))$/)||(b?b(t):`${t} must be type email`):!0,match:(o="")=>o?o===(p&&p(e))||(B?B(t,m||h.changeAll(e)):`${t} must be same with ${m||h.changeAll(e)}`):!0,diff:(o="")=>o?o!==(p&&p(e))||(a?a(t,m||h.changeAll(e)):`${t} must be different with ${m||h.changeAll(e)}`):!0,pattern:{alphabet:(o="")=>!!o&&new RegExp("^[A-Za-z ]*$").test(o)||(_optionalChain([f, 'optionalAccess', _23 => _23.alphabet])?_optionalChain([f, 'optionalAccess', _24 => _24.alphabet, 'call', _25 => _25(t)]):`${t} must be format Alphabet`),alphanumber:(o="")=>!!o&&new RegExp("^[A-Za-z0-9 ]*$").test(o)||(_optionalChain([f, 'optionalAccess', _26 => _26.alphanumber])?_optionalChain([f, 'optionalAccess', _27 => _27.alphanumber, 'call', _28 => _28(t)]):`${t} must be format Alphabet or Number`),number:(o="")=>!!o&&new RegExp("^[0-9]*$").test(o)||(_optionalChain([f, 'optionalAccess', _29 => _29.number])?_optionalChain([f, 'optionalAccess', _30 => _30.number, 'call', _31 => _31(t)]):`${t} must be format Number`),lowercase:(o="")=>!!o&&new RegExp("^[a-z0-9 ]*$").test(o)||(_optionalChain([f, 'optionalAccess', _32 => _32.lowercase])?_optionalChain([f, 'optionalAccess', _33 => _33.lowercase, 'call', _34 => _34(t)]):`${t} must be format Lowercase`),url:(o="")=>!!o&&/^(ftp|http|https):\/\/[^ "]+$/.test(o)||(_optionalChain([f, 'optionalAccess', _35 => _35.url])?_optionalChain([f, 'optionalAccess', _36 => _36.url, 'call', _37 => _37(t)]):`${t} must be a valid URL`),uppercase:(o="")=>!!o&&new RegExp("^[A-Z0-9 ]*$").test(o)||(_optionalChain([f, 'optionalAccess', _38 => _38.uppercase])?_optionalChain([f, 'optionalAccess', _39 => _39.uppercase, 'call', _40 => _40(t)]):`${t} must be format Uppercase`),mixedcase:(o="")=>!!o&&/[a-z]/.test(o)&&/[A-Z]/.test(o)||(_optionalChain([f, 'optionalAccess', _41 => _41.mixedcase])?_optionalChain([f, 'optionalAccess', _42 => _42.mixedcase, 'call', _43 => _43(t)]):`${t} must be mixed case`),specialcharacters:(o="")=>!!o&&/[^a-zA-Z0-9\s]/.test(o)||(_optionalChain([f, 'optionalAccess', _44 => _44.specialcharacters])?_optionalChain([f, 'optionalAccess', _45 => _45.specialcharacters, 'call', _46 => _46(t)]):`${t} must contain special characters`)}}[r];if(y){let{validate:o}=u.find(R=>R.validate)||{};typeof y=="function"?u.push({validate:{...o,...s,[r]:y}}):r==="pattern"?u.push({validate:{...o,...s,[`${r}${e}`]:y[e]}}):u.push({[r]:y})}return u};function X({children:r,...e}){let t=_react.useMemo.call(void 0, ()=>C(),[]),{registerItem:l,unregisterItem:p,formControl:s,disabled:m,readOnly:u}=F(),{name:i,formId:x,...n}=O();_react.useEffect.call(void 0, ()=>(l({id:t,...e}),()=>{p(t)}),[t,e]),!e.label&&!e.noLabel&&(e.label=h.changeAll(e.dataField));let c=!1;typeof e.disabled=="boolean"?c=e.disabled:typeof n.disabled=="boolean"?c=n.disabled:c=!!m;let d=!1;typeof e.readOnly=="boolean"?d=e.readOnly:typeof n.readOnly=="boolean"?d=n.readOnly:d=!!u;let g=!1;return typeof e.hidden=="boolean"&&(g=e.hidden),_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:s.control&&_jsxruntime.jsx.call(void 0, _reacthookform.Controller,{name:e.dataField,control:s.control,rules:c||d||g?{required:!1}:W(e),render:b=>_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:_jsxruntime.jsx.call(void 0, w,{...e,controller:b,children:r})})})})}var Y=_react.createContext.call(void 0, void 0);function Er(r){let e=_react.useContext.call(void 0, Y);if(r){let t=F(),l=_reacthookform.useFieldArray.call(void 0, {control:_optionalChain([t, 'optionalAccess', _47 => _47.formControl, 'access', _48 => _48.control]),name:r});return{formArrayId:"",name:r,index:-1,...l,...t,countFields:l.fields.length,removeItem:()=>{},watchItem:()=>({}),setValueItem:()=>{}}}return e||{}}function D({children:r,...e}){return _jsxruntime.jsx.call(void 0, Y.Provider,{value:e,children:r})}var V=_react.forwardRef.call(void 0, ({name:r,className:e="",defaultData:t,children:l},p)=>{let s=F(),m=_reacthookform.useFieldArray.call(void 0, {control:s.control,name:r});_react.useEffect.call(void 0, ()=>{typeof t=="boolean"&&t?m.append({}):typeof t=="number"&&t>0?m.append([...Array(t).fill(null).map(()=>({}))]):typeof t=="object"&&t&&m.append(t)},[]);let i={formArrayId:_react.useMemo.call(void 0, ()=>C(),[]),...m,...s};return _react.useImperativeHandle.call(void 0, p,()=>i),_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:m.fields.map((x,n)=>{let c=`${r}.${n}.`,d={...i,index:n,name:c,countFields:m.fields.length,removeItem:()=>m.remove(n),watchItem:g=>s.watch(g?`${c}${g}`:c.slice(0,-1)),setValueItem:(g,b)=>s.setValue(`${c}${g}`,b)};return _jsxruntime.jsx.call(void 0, "div",{className:e,children:_jsxruntime.jsx.call(void 0, D,{...d,children:A(l,d)})},x.id)})})});V.displayName="BgsFormArray";var Nr=V;var er=({children:r,...e})=>{let t=F(),l=_react.useMemo.call(void 0, ()=>C(),[]);return _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:_jsxruntime.jsx.call(void 0, E,{...t,...e,formGroupId:l,children:r})})};er.displayName="BgsFormGroup";var vr=er;var tt=Z;exports.BgsArrayForm = Nr; exports.BgsController = X; exports.BgsGroupForm = vr; exports.BgsReactFormProvider = J; exports.default = tt; exports.useBgsArrayForm = Er; exports.useBgsControllerForm = Fr; exports.useBgsForm = F; exports.useBgsGroupForm = O;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _react = require('react');var _jsxruntime = require('react/jsx-runtime');var S=_react.createContext.call(void 0, void 0);function x(){let r=_react.useContext.call(void 0, S);return r||{}}function B({children:r,controller:e,onSubmit:t}){let m=_react.useRef.call(void 0, []),u=_react.useCallback.call(void 0, o=>{let l=m.current.findIndex(i=>i.id===o.id);if(l>-1){let i=[...m.current];i[l]=o,m.current=[...i]}else m.current.push(o)},[m]),s=_react.useCallback.call(void 0, o=>{m.current=m.current.filter(l=>l.id!==o)},[]),f=async(o,l)=>{e.setIsSubmit(!0);let i=l?await e.formControl.trigger():!0,a=e.getData();i&&t&&t({...a,...o},{...e})},p={...e,registerItem:u,unregisterItem:s,items:m.current,triggerSubmit:f};return _jsxruntime.jsx.call(void 0, S.Provider,{value:p,children:r})}function h(){let r=()=>Math.random()*16%16|0;return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>(e==="x"?r():r()&3|8).toString(16))}function k(r,e){return typeof r=="function"?r(e):r}var F={camelCase:(r="")=>(r=r.split(".").map(e=>(e=e.charAt(0).toUpperCase()+e.slice(1),e)).join(" "),r=r.replace(/([a-z0-9])([A-Z])/g,"$1 $2"),r.charAt(0).toUpperCase()+r.slice(1)),snackCase:(r="")=>{let t=r.replace(/_([a-z])/g,(m,u)=>u.toUpperCase()).replace(/([A-Z])/g," $1");return t=t.charAt(0).toUpperCase()+t.slice(1),t},changeAll:(r="",e=!1)=>{let t="";try{r=_optionalChain([r, 'optionalAccess', _2 => _2.split, 'call', _3 => _3("."), 'access', _4 => _4[_optionalChain([r, 'optionalAccess', _5 => _5.split, 'call', _6 => _6("."), 'optionalAccess', _7 => _7.length])-1]]),r=_optionalChain([r, 'optionalAccess', _8 => _8.split, 'call', _9 => _9("[]"), 'access', _10 => _10[_optionalChain([r, 'optionalAccess', _11 => _11.split, 'call', _12 => _12("[]"), 'optionalAccess', _13 => _13.length])-1]]),t=F.snackCase(F.camelCase(r)),e&&(t=_optionalChain([t, 'optionalAccess', _14 => _14.split, 'call', _15 => _15(" "), 'optionalAccess', _16 => _16.map, 'call', _17 => _17(m=>_optionalChain([m, 'optionalAccess', _18 => _18.length])<=3?_optionalChain([m, 'optionalAccess', _19 => _19.toUpperCase, 'call', _20 => _20()]):m), 'optionalAccess', _21 => _21.join, 'call', _22 => _22(" ")]))}catch (e2){}return t}};function E(r,e){try{return JSON.stringify(r)!==JSON.stringify(e)}catch (e3){return!1}}var P=r=>(Object.keys(r).forEach(e=>{r[e]===void 0&&(r[e]=null)}),r),A=(r,e)=>r?e.includes(".")?A(r[e.substring(0,e.indexOf("."))],e.substring(e.indexOf(".")+1)):r?r[e]:null:"";function L(r,e){let t=!1;return r&&typeof r=="object"&&Array.isArray(r)&&(typeof e=="number"?r.length>e&&(t=!0):t=!0),t}var _reacthookform = require('react-hook-form');var v=(r,e)=>{r||(r={});let t=_react.useRef.call(void 0, null),[m,u]=_react.useState.call(void 0, !1),s=_reacthookform.useForm.call(void 0, {...e,reValidateMode:"onSubmit",mode:"all",defaultValues:r}),f=_react.useMemo.call(void 0, ()=>h(),[]),p=i=>i?A(P(s.getValues()),i):P(s.getValues()),l={...s,ref:t,reset:i=>{i?typeof i=="string"?s.resetField(i,{}):typeof i=="object"&&L(i,0)&&i.forEach(a=>s.resetField(a)):s.reset()},updateData:i=>{let a=p();s.reset({...a,...i})},getData:p,formControl:s,useFieldArray:i=>_reacthookform.useFieldArray.call(void 0, {control:s.control,name:i}),useWatch:i=>_reacthookform.useWatch.call(void 0, {control:s.control,name:i}),isSubmit:m,formId:f,setIsSubmit:u};return[l,l]};var pr=({onSubmit:r,onChange:e=()=>{},onInvalid:t=()=>{},formData:m,controller:u,children:s,...f})=>{let p=_nullishCoalesce(u, () => (v())),[o]=Array.isArray(p)?p:[p],l=_react.useRef.call(void 0, void 0),i=async a=>{a.preventDefault(),a.stopPropagation(),o.setIsSubmit(!0);let c=await o.formControl.trigger(),d=o.getData();c?r&&r({...d},{...o}):t(o.formControl.formState.errors)};return _react.useEffect.call(void 0, ()=>{m&&E(l.current||{},m)&&(o.formControl.reset(m),l.current=m)},[m,o.formControl.reset]),_react.useEffect.call(void 0, ()=>{if(!e)return;let a=o.formControl.watch(e);return()=>a.unsubscribe()},[]),_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:_jsxruntime.jsx.call(void 0, B,{controller:o,onSubmit:r,children:_jsxruntime.jsx.call(void 0, "form",{...f,id:o.formId,ref:o.ref,onSubmit:i,children:s})})})},M=pr;var z=_react.createContext.call(void 0, void 0);function xr(){let r=_react.useContext.call(void 0, z);return r||{}}function $({children:r,...e}){return _jsxruntime.jsx.call(void 0, z.Provider,{value:e,children:r})}var Z=_react.createContext.call(void 0, void 0);function T(){let r=_react.useContext.call(void 0, Z);return r||{}}function I({children:r,...e}){return _jsxruntime.jsx.call(void 0, Z.Provider,{value:e,children:r})}var q=_react.createContext.call(void 0, void 0);function j(){let r=_react.useContext.call(void 0, q);return r||{}}function H({children:r,...e}){return _jsxruntime.jsx.call(void 0, q.Provider,{value:e,children:r})}function w({validationRules:r,label:e}){let{formControl:t,getData:m}=x(),u=[];return r&&(typeof r=="string"?K(r,!0,e,t,m,{}).forEach(s=>u.push(s)):typeof r=="object"&&Object.keys(r).forEach(s=>{let{validate:f}=u.find(o=>o.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let o=r[s],l="";if(s==="email"&&!o)return;["match","diff"].includes(s)&&typeof o=="object"&&(o=r[s].dataField,l=r[s].label),o!=null&&K(s,o,e,t,m,f,l).forEach(i=>u.push(i))}else if(typeof r[s]=="object"){let o=r[s];u.push({validate:{...f,[s]:l=>o.validation(l)||o.message&&(typeof o.message=="string"?o.message:o.message(e))}})}})),Object.assign({},...u)}var K=(r,e,t,m,u,s,f)=>{let p=[],{validationMessage:o}=j(),{required:l,minLength:i,maxLength:a,min:c,max:d,email:y,match:U,diff:O,pattern:g}=o||{},C={required:{value:!!e,message:l?l(t):`${t} is required`},minLength:{value:e,message:i?i(t,e):`${t} must be at least ${e} characters long`},maxLength:{value:e,message:a?a(t,e):`${t} cannot be more than ${e} characters long`},min:{value:Number(e),message:c?c(t,e):`${t} should be at least ${e}`},max:{value:Number(e),message:d?d(t,e):`${t} should be at most ${e}`},regexp:(n="")=>n?new RegExp(e.regexp).test(n)||`${t} ${e.message}`:!0,email:(n="")=>n?n.match(/^(([^<>()[\]\\.,;:\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,}))$/)||(y?y(t):`${t} must be type email`):!0,match:(n="")=>n?n===(u&&u(e))||(U?U(t,f||F.changeAll(e)):`${t} must be same with ${f||F.changeAll(e)}`):!0,diff:(n="")=>n?n!==(u&&u(e))||(O?O(t,f||F.changeAll(e)):`${t} must be different with ${f||F.changeAll(e)}`):!0,pattern:{alphabet:(n="")=>!!n&&new RegExp("^[A-Za-z ]*$").test(n)||(_optionalChain([g, 'optionalAccess', _23 => _23.alphabet])?_optionalChain([g, 'optionalAccess', _24 => _24.alphabet, 'call', _25 => _25(t)]):`${t} must be format Alphabet`),alphanumber:(n="")=>!!n&&new RegExp("^[A-Za-z0-9 ]*$").test(n)||(_optionalChain([g, 'optionalAccess', _26 => _26.alphanumber])?_optionalChain([g, 'optionalAccess', _27 => _27.alphanumber, 'call', _28 => _28(t)]):`${t} must be format Alphabet or Number`),number:(n="")=>!!n&&new RegExp("^[0-9]*$").test(n)||(_optionalChain([g, 'optionalAccess', _29 => _29.number])?_optionalChain([g, 'optionalAccess', _30 => _30.number, 'call', _31 => _31(t)]):`${t} must be format Number`),lowercase:(n="")=>!!n&&new RegExp("^[a-z0-9 ]*$").test(n)||(_optionalChain([g, 'optionalAccess', _32 => _32.lowercase])?_optionalChain([g, 'optionalAccess', _33 => _33.lowercase, 'call', _34 => _34(t)]):`${t} must be format Lowercase`),url:(n="")=>!!n&&/^(ftp|http|https):\/\/[^ "]+$/.test(n)||(_optionalChain([g, 'optionalAccess', _35 => _35.url])?_optionalChain([g, 'optionalAccess', _36 => _36.url, 'call', _37 => _37(t)]):`${t} must be a valid URL`),uppercase:(n="")=>!!n&&new RegExp("^[A-Z0-9 ]*$").test(n)||(_optionalChain([g, 'optionalAccess', _38 => _38.uppercase])?_optionalChain([g, 'optionalAccess', _39 => _39.uppercase, 'call', _40 => _40(t)]):`${t} must be format Uppercase`),mixedcase:(n="")=>!!n&&/[a-z]/.test(n)&&/[A-Z]/.test(n)||(_optionalChain([g, 'optionalAccess', _41 => _41.mixedcase])?_optionalChain([g, 'optionalAccess', _42 => _42.mixedcase, 'call', _43 => _43(t)]):`${t} must be mixed case`),specialcharacters:(n="")=>!!n&&/[^a-zA-Z0-9\s]/.test(n)||(_optionalChain([g, 'optionalAccess', _44 => _44.specialcharacters])?_optionalChain([g, 'optionalAccess', _45 => _45.specialcharacters, 'call', _46 => _46(t)]):`${t} must contain special characters`)}}[r];if(C){let{validate:n}=p.find(rr=>rr.validate)||{};typeof C=="function"?p.push({validate:{...n,...s,[r]:C}}):r==="pattern"?p.push({validate:{...n,...s,[`${r}${e}`]:C[e]}}):p.push({[r]:C})}return p};function _({children:r,...e}){let t=_react.useMemo.call(void 0, ()=>h(),[]),{registerItem:m,unregisterItem:u,formControl:s,disabled:f,readOnly:p}=x(),{name:o,formId:l,...i}=T();_react.useEffect.call(void 0, ()=>(m({id:t,...e}),()=>{u(t)}),[t,e]),!e.label&&!e.noLabel&&(e.label=F.changeAll(e.dataField));let a=!1;typeof e.disabled=="boolean"?a=e.disabled:typeof i.disabled=="boolean"?a=i.disabled:a=!!f;let c=!1;typeof e.readOnly=="boolean"?c=e.readOnly:typeof i.readOnly=="boolean"?c=i.readOnly:c=!!p;let d=!1;return typeof e.hidden=="boolean"&&(d=e.hidden),_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:s.control&&_jsxruntime.jsx.call(void 0, _reacthookform.Controller,{name:e.dataField,control:s.control,rules:a||c||d?{required:!1}:w(e),render:y=>_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:_jsxruntime.jsx.call(void 0, $,{...e,controller:y,children:r})})})})}var Q=_react.createContext.call(void 0, void 0);function Gr(r){let e=_react.useContext.call(void 0, Q);if(r){let t=x(),m=_reacthookform.useFieldArray.call(void 0, {control:_optionalChain([t, 'optionalAccess', _47 => _47.formControl, 'access', _48 => _48.control]),name:r});return{formArrayId:"",name:r,index:-1,...m,...t,countFields:m.fields.length,removeItem:()=>{},watchItem:()=>({}),setValueItem:()=>{}}}return e||{}}function G({children:r,...e}){return _jsxruntime.jsx.call(void 0, Q.Provider,{value:e,children:r})}var X=_react.forwardRef.call(void 0, ({name:r,className:e="",defaultData:t,children:m},u)=>{let s=x(),f=_reacthookform.useFieldArray.call(void 0, {control:s.control,name:r});_react.useEffect.call(void 0, ()=>{typeof t=="boolean"&&t?f.append({}):typeof t=="number"&&t>0?f.append([...Array(t).fill(null).map(()=>({}))]):typeof t=="object"&&t&&f.append(t)},[]);let o={formArrayId:_react.useMemo.call(void 0, ()=>h(),[]),...f,...s};return _react.useImperativeHandle.call(void 0, u,()=>o),_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:f.fields.map((l,i)=>{let a=`${r}.${i}.`,c={...o,index:i,name:a,countFields:f.fields.length,removeItem:()=>f.remove(i),watchItem:d=>s.watch(d?`${a}${d}`:a.slice(0,-1)),setValueItem:(d,y)=>s.setValue(`${a}${d}`,y)};return _jsxruntime.jsx.call(void 0, "div",{className:e,children:_jsxruntime.jsx.call(void 0, G,{...c,children:k(m,c)})},l.id)})})});X.displayName="BgsFormArray";var Er=X;var V=({children:r,...e})=>{let t=x(),m=_react.useMemo.call(void 0, ()=>h(),[]);return _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:_jsxruntime.jsx.call(void 0, I,{...t,...e,formGroupId:m,children:r})})};V.displayName="BgsFormGroup";var Nr=V;var it=M;exports.BgsArrayForm = Er; exports.BgsController = _; exports.BgsGroupForm = Nr; exports.BgsReactFormProvider = H; exports.default = it; exports.useBgsArrayForm = Gr; exports.useBgsControllerForm = xr; exports.useBgsForm = x; exports.useBgsFormController = v; exports.useBgsGroupForm = T;

package/dist/index.d.cts

@@ -1,33 +1,35 @@
-import React$1, { ReactNode, PropsWithChildren } from 'react';
-import { UseFormReturn, UseFieldArrayReturn, DeepPartialSkipArrayKey, EventType, UseFieldArraySwap, UseFieldArrayMove, UseFieldArrayPrepend, UseFieldArrayAppend, UseFieldArrayRemove, UseFieldArrayInsert, UseFieldArrayUpdate, UseFieldArrayReplace, FieldArrayWithId, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn } from 'react-hook-form';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import React$1, { ReactNode, PropsWithChildren } from 'react';
+import { UseFormReturn, UseFieldArrayReturn, DeepPartialSkipArrayKey, EventType, FieldErrors, UseFieldArraySwap, UseFieldArrayMove, UseFieldArrayPrepend, UseFieldArrayAppend, UseFieldArrayRemove, UseFieldArrayInsert, UseFieldArrayUpdate, UseFieldArrayReplace, FieldArrayWithId, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn, UseFormProps } from 'react-hook-form';
 
 interface FormDefaultProps {
     disabled?: boolean;
     readOnly?: boolean;
     name?: string;
 }
-interface FormProps<T = unknown> extends FormDefaultProps {
-    children?: Children;
-    formData?: Partial<T>;
+type FormProps<T = unknown> = Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit" | "onChange"> & FormDefaultProps & {
+    formData?: Partial<T> | null;
+    controller?: FormRef<T> | FormRef<T>[];
     onSubmit?: OnSubmit<T>;
-    className?: string;
     onChange?: (values: T, event: {
         name?: string | undefined;
         type?: EventType | undefined;
     }) => void;
-}
+    onInvalid?: (errors: FieldErrors) => void;
+};
+type TriggerSubmit<T = unknown> = (addValues?: T, validate?: boolean) => void;
 interface FormRef<T = unknown> extends FormDefaultProps, Omit<UseFormReturn, "reset"> {
     reset: (field?: string | string[]) => void;
     updateData: (values: Partial<T>) => void;
     getData: (field?: string) => T;
-    triggerSubmit: (addValues?: T, options?: OptionsSubmit) => void;
     formControl: UseFormReturn;
     useFieldArray: (name: string) => UseFieldArrayReturn;
     useWatch: UseWatch<T>;
     isSubmit: boolean;
+    setIsSubmit: React.Dispatch<React.SetStateAction<boolean>>;
     formId: string;
     name?: string;
+    ref: React.RefObject<HTMLFormElement | null>;
 }
 interface ControllerProps {
     dataField: string;
@@ -79,9 +81,7 @@ interface Controller$1 {
 interface OptionsSubmit {
     validate?: boolean;
 }
-interface OnSubmitOptions<T = any> extends FormRef<T>, OptionsSubmit {
-}
-type OnSubmit<T = any> = (values: T, options: OnSubmitOptions) => void;
+type OnSubmit<T = any> = (values: T, options: FormRef<T>) => void;
 type UseWatch<T = any> = (name: string) => DeepPartialSkipArrayKey<T>;
 interface FormArrayProps<T = any> {
     name: string;
@@ -116,7 +116,7 @@ interface FormGroupProps {
     readOnly?: boolean;
 }
 
-declare const BgsForm: BgsFormType;
+declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
 
 declare function Controller({ children, ...props }: PropsWithChildren<ControllerProps>): react_jsx_runtime.JSX.Element;
 
@@ -155,12 +155,13 @@ declare function BgsReactFormProvider({ children, ...value }: PropsWithChildren<
 type ControllerWithKey = ControllerProps & {
     id: string;
 };
-interface BgsFormContextData<T = any> extends FormRef<T> {
+type BgsFormProviderReturn<T = unknown> = FormRef<T> & {
     registerItem: (ref: ControllerWithKey) => void;
     unregisterItem: (id: string) => void;
     items: ControllerWithKey[];
-}
-declare function useBgsForm(): BgsFormContextData;
+    triggerSubmit: TriggerSubmit<T>;
+};
+declare function useBgsForm<T = unknown>(): BgsFormProviderReturn<T>;
 
 interface BgsFormArrayContextData extends FormArrayItem {
 }
@@ -174,6 +175,8 @@ declare function useBgsFormGroup(): BgsFormGroupData;
 interface BgsFormControllerContextData extends ControllerProps {
     controller: Controller$1;
 }
-declare function useBgsFormController<T = unknown>(): BgsFormControllerContextData & T;
+declare function useBgsFormController$1<T = unknown>(): BgsFormControllerContextData & T;
+
+declare const useBgsFormController: <T = unknown>(defaultValues?: Partial<T> | undefined, options?: UseFormProps) => FormRef<T>[];
 
-export { FormArray as BgsArrayForm, Controller as BgsController, type BgsFormType, FormGroup as BgsGroupForm, BgsReactFormProvider, type Children, type Controller$1 as Controller, type ControllerProps, type FormArrayItem, type FormArrayProps, type FormArrayRef, type FormGroupProps, type FormProps, type FormRef, type OnSubmit, type OptionsSubmit, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsFormArray as useBgsArrayForm, useBgsFormController as useBgsControllerForm, useBgsForm, useBgsFormGroup as useBgsGroupForm };
+export { FormArray as BgsArrayForm, Controller as BgsController, type BgsFormType, FormGroup as BgsGroupForm, BgsReactFormProvider, type Children, type Controller$1 as Controller, type ControllerProps, type FormArrayItem, type FormArrayProps, type FormArrayRef, type FormGroupProps, type FormProps, type FormRef, type OnSubmit, type OptionsSubmit, type TriggerSubmit, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsFormArray as useBgsArrayForm, useBgsFormController$1 as useBgsControllerForm, useBgsForm, useBgsFormController, useBgsFormGroup as useBgsGroupForm };

package/dist/index.d.ts

@@ -1,33 +1,35 @@
-import React$1, { ReactNode, PropsWithChildren } from 'react';
-import { UseFormReturn, UseFieldArrayReturn, DeepPartialSkipArrayKey, EventType, UseFieldArraySwap, UseFieldArrayMove, UseFieldArrayPrepend, UseFieldArrayAppend, UseFieldArrayRemove, UseFieldArrayInsert, UseFieldArrayUpdate, UseFieldArrayReplace, FieldArrayWithId, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn } from 'react-hook-form';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import React$1, { ReactNode, PropsWithChildren } from 'react';
+import { UseFormReturn, UseFieldArrayReturn, DeepPartialSkipArrayKey, EventType, FieldErrors, UseFieldArraySwap, UseFieldArrayMove, UseFieldArrayPrepend, UseFieldArrayAppend, UseFieldArrayRemove, UseFieldArrayInsert, UseFieldArrayUpdate, UseFieldArrayReplace, FieldArrayWithId, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn, UseFormProps } from 'react-hook-form';
 
 interface FormDefaultProps {
     disabled?: boolean;
     readOnly?: boolean;
     name?: string;
 }
-interface FormProps<T = unknown> extends FormDefaultProps {
-    children?: Children;
-    formData?: Partial<T>;
+type FormProps<T = unknown> = Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit" | "onChange"> & FormDefaultProps & {
+    formData?: Partial<T> | null;
+    controller?: FormRef<T> | FormRef<T>[];
     onSubmit?: OnSubmit<T>;
-    className?: string;
     onChange?: (values: T, event: {
         name?: string | undefined;
         type?: EventType | undefined;
     }) => void;
-}
+    onInvalid?: (errors: FieldErrors) => void;
+};
+type TriggerSubmit<T = unknown> = (addValues?: T, validate?: boolean) => void;
 interface FormRef<T = unknown> extends FormDefaultProps, Omit<UseFormReturn, "reset"> {
     reset: (field?: string | string[]) => void;
     updateData: (values: Partial<T>) => void;
     getData: (field?: string) => T;
-    triggerSubmit: (addValues?: T, options?: OptionsSubmit) => void;
     formControl: UseFormReturn;
     useFieldArray: (name: string) => UseFieldArrayReturn;
     useWatch: UseWatch<T>;
     isSubmit: boolean;
+    setIsSubmit: React.Dispatch<React.SetStateAction<boolean>>;
     formId: string;
     name?: string;
+    ref: React.RefObject<HTMLFormElement | null>;
 }
 interface ControllerProps {
     dataField: string;
@@ -79,9 +81,7 @@ interface Controller$1 {
 interface OptionsSubmit {
     validate?: boolean;
 }
-interface OnSubmitOptions<T = any> extends FormRef<T>, OptionsSubmit {
-}
-type OnSubmit<T = any> = (values: T, options: OnSubmitOptions) => void;
+type OnSubmit<T = any> = (values: T, options: FormRef<T>) => void;
 type UseWatch<T = any> = (name: string) => DeepPartialSkipArrayKey<T>;
 interface FormArrayProps<T = any> {
     name: string;
@@ -116,7 +116,7 @@ interface FormGroupProps {
     readOnly?: boolean;
 }
 
-declare const BgsForm: BgsFormType;
+declare const BgsForm: <T>({ onSubmit, onChange, onInvalid, formData, controller: controllerProps, children, ...others }: PropsWithChildren<FormProps<T>>) => react_jsx_runtime.JSX.Element;
 
 declare function Controller({ children, ...props }: PropsWithChildren<ControllerProps>): react_jsx_runtime.JSX.Element;
 
@@ -155,12 +155,13 @@ declare function BgsReactFormProvider({ children, ...value }: PropsWithChildren<
 type ControllerWithKey = ControllerProps & {
     id: string;
 };
-interface BgsFormContextData<T = any> extends FormRef<T> {
+type BgsFormProviderReturn<T = unknown> = FormRef<T> & {
     registerItem: (ref: ControllerWithKey) => void;
     unregisterItem: (id: string) => void;
     items: ControllerWithKey[];
-}
-declare function useBgsForm(): BgsFormContextData;
+    triggerSubmit: TriggerSubmit<T>;
+};
+declare function useBgsForm<T = unknown>(): BgsFormProviderReturn<T>;
 
 interface BgsFormArrayContextData extends FormArrayItem {
 }
@@ -174,6 +175,8 @@ declare function useBgsFormGroup(): BgsFormGroupData;
 interface BgsFormControllerContextData extends ControllerProps {
     controller: Controller$1;
 }
-declare function useBgsFormController<T = unknown>(): BgsFormControllerContextData & T;
+declare function useBgsFormController$1<T = unknown>(): BgsFormControllerContextData & T;
+
+declare const useBgsFormController: <T = unknown>(defaultValues?: Partial<T> | undefined, options?: UseFormProps) => FormRef<T>[];
 
-export { FormArray as BgsArrayForm, Controller as BgsController, type BgsFormType, FormGroup as BgsGroupForm, BgsReactFormProvider, type Children, type Controller$1 as Controller, type ControllerProps, type FormArrayItem, type FormArrayProps, type FormArrayRef, type FormGroupProps, type FormProps, type FormRef, type OnSubmit, type OptionsSubmit, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsFormArray as useBgsArrayForm, useBgsFormController as useBgsControllerForm, useBgsForm, useBgsFormGroup as useBgsGroupForm };
+export { FormArray as BgsArrayForm, Controller as BgsController, type BgsFormType, FormGroup as BgsGroupForm, BgsReactFormProvider, type Children, type Controller$1 as Controller, type ControllerProps, type FormArrayItem, type FormArrayProps, type FormArrayRef, type FormGroupProps, type FormProps, type FormRef, type OnSubmit, type OptionsSubmit, type TriggerSubmit, type ValidationCallback, type ValidationOptions, type ValidationRules, BgsForm as default, useBgsFormArray as useBgsArrayForm, useBgsFormController$1 as useBgsControllerForm, useBgsForm, useBgsFormController, useBgsFormGroup as useBgsGroupForm };

package/dist/index.js

@@ -1 +1 @@
-import{forwardRef as ar,useEffect as M,useImperativeHandle as mr,useMemo as fr,useRef as v,useState as lr}from"react";import{createContext as or,useCallback as L,useContext as nr,useRef as sr}from"react";import{jsx as ir}from"react/jsx-runtime";var k=or(void 0);function F(){let r=nr(k);return r||{}}function $({children:r,...e}){let t=sr([]),l=L(m=>{let u=t.current.findIndex(i=>i.id===m.id);if(u>-1){let i=[...t.current];i[u]=m,t.current=[...i]}else t.current.push(m)},[t]),p=L(m=>{t.current=t.current.filter(u=>u.id!==m)},[]),s={...e,registerItem:l,unregisterItem:p,items:t.current};return ir(k.Provider,{value:s,children:r})}function C(){let r=()=>Math.random()*16%16|0;return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>(e==="x"?r():r()&3|8).toString(16))}function A(r,e){return typeof r=="function"?r(e):r}var h={camelCase:(r="")=>(r=r.split(".").map(e=>(e=e.charAt(0).toUpperCase()+e.slice(1),e)).join(" "),r=r.replace(/([a-z0-9])([A-Z])/g,"$1 $2"),r.charAt(0).toUpperCase()+r.slice(1)),snackCase:(r="")=>{let t=r.replace(/_([a-z])/g,(l,p)=>p.toUpperCase()).replace(/([A-Z])/g," $1");return t=t.charAt(0).toUpperCase()+t.slice(1),t},changeAll:(r="",e=!1)=>{let t="";try{r=r?.split(".")[r?.split(".")?.length-1],r=r?.split("[]")[r?.split("[]")?.length-1],t=h.snackCase(h.camelCase(r)),e&&(t=t?.split(" ")?.map(l=>l?.length<=3?l?.toUpperCase():l)?.join(" "))}catch{}return t}};function N(r,e){try{return JSON.stringify(r)!==JSON.stringify(e)}catch{return!1}}var I=r=>(Object.keys(r).forEach(e=>{r[e]===void 0&&(r[e]=null)}),r),G=(r,e)=>r?e.includes(".")?G(r[e.substring(0,e.indexOf("."))],e.substring(e.indexOf(".")+1)):r?r[e]:null:"";function S(r,e){let t=!1;return r&&typeof r=="object"&&Array.isArray(r)&&(typeof e=="number"?r.length>e&&(t=!0):t=!0),t}import{useFieldArray as pr,useForm as ur,useWatch as cr}from"react-hook-form";import{jsx as z}from"react/jsx-runtime";var gr=ar(({children:r,className:e,formData:t,onChange:l=()=>{},onSubmit:p},s)=>{t||(t={});let m=v(void 0),u=v(null),[i,x]=lr(!1),n=ur({reValidateMode:"onSubmit",mode:"all",defaultValues:t}),c=fr(()=>C(),[]);M(()=>{t&&N(m.current||{},t)&&(n.reset(t),m.current=t)},[t,n.reset]),M(()=>{let a=n.watch(l);return()=>a.unsubscribe()},[]);let d=async(a,f,U)=>{let{validate:y=!0,...o}=U||{};a&&(a.preventDefault(),a.stopPropagation()),x(!0);let R=y?await n.trigger():!0,tr=g();R&&p&&p({...tr,...f},{...B,...o,validate:y})},g=a=>a?G(I(n.getValues()),a):I(n.getValues()),B={...n,reset:a=>{a?typeof a=="string"?n.resetField(a,{}):typeof a=="object"&&S(a,0)&&a.forEach(f=>n.resetField(f)):n.reset()},updateData:a=>{let f=g();n.reset({...f,...a})},getData:g,triggerSubmit:(a,f)=>d(void 0,a,f),formControl:n,useFieldArray:a=>pr({control:n.control,name:a}),useWatch:a=>cr({control:n.control,name:a}),isSubmit:i,formId:c};return mr(s,()=>B),z($,{...B,children:z("form",{id:c,className:e,ref:u,onSubmit:d,children:A(r,B)})})}),Z=gr;import{useEffect as Rr,useMemo as $r}from"react";import{createContext as dr,useContext as xr}from"react";import{jsx as hr}from"react/jsx-runtime";var q=dr(void 0);function Fr(){let r=xr(q);return r||{}}function w({children:r,...e}){return hr(q.Provider,{value:e,children:r})}import{Controller as Ir}from"react-hook-form";import{createContext as yr,useContext as Cr}from"react";import{jsx as br}from"react/jsx-runtime";var j=yr(void 0);function O(){let r=Cr(j);return r||{}}function E({children:r,...e}){return br(j.Provider,{value:e,children:r})}import{createContext as Br,useContext as Ar}from"react";import{jsx as Pr}from"react/jsx-runtime";var H=Br(void 0);function K(){let r=Ar(H);return r||{}}function J({children:r,...e}){return Pr(H.Provider,{value:e,children:r})}function W({validationRules:r,label:e}){let{formControl:t,getData:l}=F(),p=[];return r&&(typeof r=="string"?_(r,!0,e,t,l,{}).forEach(s=>p.push(s)):typeof r=="object"&&Object.keys(r).forEach(s=>{let{validate:m}=p.find(i=>i.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let i=r[s],x="";if(s==="email"&&!i)return;["match","diff"].includes(s)&&typeof i=="object"&&(i=r[s].dataField,x=r[s].label),i!=null&&_(s,i,e,t,l,m,x).forEach(n=>p.push(n))}else if(typeof r[s]=="object"){let i=r[s];p.push({validate:{...m,[s]:x=>i.validation(x)||i.message&&(typeof i.message=="string"?i.message:i.message(e))}})}})),Object.assign({},...p)}var _=(r,e,t,l,p,s,m)=>{let u=[],{validationMessage:i}=K(),{required:x,minLength:n,maxLength:c,min:d,max:g,email:b,match:B,diff:a,pattern:f}=i||{},y={required:{value:!!e,message:x?x(t):`${t} is required`},minLength:{value:e,message:n?n(t,e):`${t} must be at least ${e} characters long`},maxLength:{value:e,message:c?c(t,e):`${t} cannot be more than ${e} characters long`},min:{value:Number(e),message:d?d(t,e):`${t} should be at least ${e}`},max:{value:Number(e),message:g?g(t,e):`${t} should be at most ${e}`},regexp:(o="")=>o?new RegExp(e.regexp).test(o)||`${t} ${e.message}`:!0,email:(o="")=>o?o.match(/^(([^<>()[\]\\.,;:\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,}))$/)||(b?b(t):`${t} must be type email`):!0,match:(o="")=>o?o===(p&&p(e))||(B?B(t,m||h.changeAll(e)):`${t} must be same with ${m||h.changeAll(e)}`):!0,diff:(o="")=>o?o!==(p&&p(e))||(a?a(t,m||h.changeAll(e)):`${t} must be different with ${m||h.changeAll(e)}`):!0,pattern:{alphabet:(o="")=>!!o&&new RegExp("^[A-Za-z ]*$").test(o)||(f?.alphabet?f?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(o="")=>!!o&&new RegExp("^[A-Za-z0-9 ]*$").test(o)||(f?.alphanumber?f?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(o="")=>!!o&&new RegExp("^[0-9]*$").test(o)||(f?.number?f?.number(t):`${t} must be format Number`),lowercase:(o="")=>!!o&&new RegExp("^[a-z0-9 ]*$").test(o)||(f?.lowercase?f?.lowercase(t):`${t} must be format Lowercase`),url:(o="")=>!!o&&/^(ftp|http|https):\/\/[^ "]+$/.test(o)||(f?.url?f?.url(t):`${t} must be a valid URL`),uppercase:(o="")=>!!o&&new RegExp("^[A-Z0-9 ]*$").test(o)||(f?.uppercase?f?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(o="")=>!!o&&/[a-z]/.test(o)&&/[A-Z]/.test(o)||(f?.mixedcase?f?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(o="")=>!!o&&/[^a-zA-Z0-9\s]/.test(o)||(f?.specialcharacters?f?.specialcharacters(t):`${t} must contain special characters`)}}[r];if(y){let{validate:o}=u.find(R=>R.validate)||{};typeof y=="function"?u.push({validate:{...o,...s,[r]:y}}):r==="pattern"?u.push({validate:{...o,...s,[`${r}${e}`]:y[e]}}):u.push({[r]:y})}return u};import{Fragment as Q,jsx as P}from"react/jsx-runtime";function X({children:r,...e}){let t=$r(()=>C(),[]),{registerItem:l,unregisterItem:p,formControl:s,disabled:m,readOnly:u}=F(),{name:i,formId:x,...n}=O();Rr(()=>(l({id:t,...e}),()=>{p(t)}),[t,e]),!e.label&&!e.noLabel&&(e.label=h.changeAll(e.dataField));let c=!1;typeof e.disabled=="boolean"?c=e.disabled:typeof n.disabled=="boolean"?c=n.disabled:c=!!m;let d=!1;typeof e.readOnly=="boolean"?d=e.readOnly:typeof n.readOnly=="boolean"?d=n.readOnly:d=!!u;let g=!1;return typeof e.hidden=="boolean"&&(g=e.hidden),P(Q,{children:s.control&&P(Ir,{name:e.dataField,control:s.control,rules:c||d||g?{required:!1}:W(e),render:b=>P(Q,{children:P(w,{...e,controller:b,children:r})})})})}import{forwardRef as Dr,useEffect as Tr,useImperativeHandle as Ur,useMemo as Lr}from"react";import{useFieldArray as kr}from"react-hook-form";import{createContext as Gr,useContext as wr}from"react";import{useFieldArray as Or}from"react-hook-form";import{jsx as Wr}from"react/jsx-runtime";var Y=Gr(void 0);function Er(r){let e=wr(Y);if(r){let t=F(),l=Or({control:t?.formControl.control,name:r});return{formArrayId:"",name:r,index:-1,...l,...t,countFields:l.fields.length,removeItem:()=>{},watchItem:()=>({}),setValueItem:()=>{}}}return e||{}}function D({children:r,...e}){return Wr(Y.Provider,{value:e,children:r})}import{Fragment as Sr,jsx as T}from"react/jsx-runtime";var V=Dr(({name:r,className:e="",defaultData:t,children:l},p)=>{let s=F(),m=kr({control:s.control,name:r});Tr(()=>{typeof t=="boolean"&&t?m.append({}):typeof t=="number"&&t>0?m.append([...Array(t).fill(null).map(()=>({}))]):typeof t=="object"&&t&&m.append(t)},[]);let i={formArrayId:Lr(()=>C(),[]),...m,...s};return Ur(p,()=>i),T(Sr,{children:m.fields.map((x,n)=>{let c=`${r}.${n}.`,d={...i,index:n,name:c,countFields:m.fields.length,removeItem:()=>m.remove(n),watchItem:g=>s.watch(g?`${c}${g}`:c.slice(0,-1)),setValueItem:(g,b)=>s.setValue(`${c}${g}`,b)};return T("div",{className:e,children:T(D,{...d,children:A(l,d)})},x.id)})})});V.displayName="BgsFormArray";var Nr=V;import{useMemo as Mr}from"react";import{Fragment as zr,jsx as rr}from"react/jsx-runtime";var er=({children:r,...e})=>{let t=F(),l=Mr(()=>C(),[]);return rr(zr,{children:rr(E,{...t,...e,formGroupId:l,children:r})})};er.displayName="BgsFormGroup";var vr=er;var tt=Z;export{Nr as BgsArrayForm,X as BgsController,vr as BgsGroupForm,J as BgsReactFormProvider,tt as default,Er as useBgsArrayForm,Fr as useBgsControllerForm,F as useBgsForm,O as useBgsGroupForm};
+import{useEffect as N,useRef as ur}from"react";import{createContext as er,useCallback as D,useContext as tr,useRef as or}from"react";import{jsx as nr}from"react/jsx-runtime";var S=er(void 0);function x(){let r=tr(S);return r||{}}function B({children:r,controller:e,onSubmit:t}){let m=or([]),u=D(o=>{let l=m.current.findIndex(i=>i.id===o.id);if(l>-1){let i=[...m.current];i[l]=o,m.current=[...i]}else m.current.push(o)},[m]),s=D(o=>{m.current=m.current.filter(l=>l.id!==o)},[]),f=async(o,l)=>{e.setIsSubmit(!0);let i=l?await e.formControl.trigger():!0,a=e.getData();i&&t&&t({...a,...o},{...e})},p={...e,registerItem:u,unregisterItem:s,items:m.current,triggerSubmit:f};return nr(S.Provider,{value:p,children:r})}function h(){let r=()=>Math.random()*16%16|0;return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>(e==="x"?r():r()&3|8).toString(16))}function k(r,e){return typeof r=="function"?r(e):r}var F={camelCase:(r="")=>(r=r.split(".").map(e=>(e=e.charAt(0).toUpperCase()+e.slice(1),e)).join(" "),r=r.replace(/([a-z0-9])([A-Z])/g,"$1 $2"),r.charAt(0).toUpperCase()+r.slice(1)),snackCase:(r="")=>{let t=r.replace(/_([a-z])/g,(m,u)=>u.toUpperCase()).replace(/([A-Z])/g," $1");return t=t.charAt(0).toUpperCase()+t.slice(1),t},changeAll:(r="",e=!1)=>{let t="";try{r=r?.split(".")[r?.split(".")?.length-1],r=r?.split("[]")[r?.split("[]")?.length-1],t=F.snackCase(F.camelCase(r)),e&&(t=t?.split(" ")?.map(m=>m?.length<=3?m?.toUpperCase():m)?.join(" "))}catch{}return t}};function E(r,e){try{return JSON.stringify(r)!==JSON.stringify(e)}catch{return!1}}var P=r=>(Object.keys(r).forEach(e=>{r[e]===void 0&&(r[e]=null)}),r),A=(r,e)=>r?e.includes(".")?A(r[e.substring(0,e.indexOf("."))],e.substring(e.indexOf(".")+1)):r?r[e]:null:"";function L(r,e){let t=!1;return r&&typeof r=="object"&&Array.isArray(r)&&(typeof e=="number"?r.length>e&&(t=!0):t=!0),t}import{useFieldArray as sr,useForm as ir,useWatch as mr}from"react-hook-form";import{useMemo as ar,useRef as fr,useState as lr}from"react";var v=(r,e)=>{r||(r={});let t=fr(null),[m,u]=lr(!1),s=ir({...e,reValidateMode:"onSubmit",mode:"all",defaultValues:r}),f=ar(()=>h(),[]),p=i=>i?A(P(s.getValues()),i):P(s.getValues()),l={...s,ref:t,reset:i=>{i?typeof i=="string"?s.resetField(i,{}):typeof i=="object"&&L(i,0)&&i.forEach(a=>s.resetField(a)):s.reset()},updateData:i=>{let a=p();s.reset({...a,...i})},getData:p,formControl:s,useFieldArray:i=>sr({control:s.control,name:i}),useWatch:i=>mr({control:s.control,name:i}),isSubmit:m,formId:f,setIsSubmit:u};return[l,l]};import{Fragment as gr,jsx as R}from"react/jsx-runtime";var pr=({onSubmit:r,onChange:e=()=>{},onInvalid:t=()=>{},formData:m,controller:u,children:s,...f})=>{let p=u??v(),[o]=Array.isArray(p)?p:[p],l=ur(void 0),i=async a=>{a.preventDefault(),a.stopPropagation(),o.setIsSubmit(!0);let c=await o.formControl.trigger(),d=o.getData();c?r&&r({...d},{...o}):t(o.formControl.formState.errors)};return N(()=>{m&&E(l.current||{},m)&&(o.formControl.reset(m),l.current=m)},[m,o.formControl.reset]),N(()=>{if(!e)return;let a=o.formControl.watch(e);return()=>a.unsubscribe()},[]),R(gr,{children:R(B,{controller:o,onSubmit:r,children:R("form",{...f,id:o.formId,ref:o.ref,onSubmit:i,children:s})})})},M=pr;import{useEffect as Ar,useMemo as Rr}from"react";import{createContext as cr,useContext as dr}from"react";import{jsx as Fr}from"react/jsx-runtime";var z=cr(void 0);function xr(){let r=dr(z);return r||{}}function $({children:r,...e}){return Fr(z.Provider,{value:e,children:r})}import{Controller as $r}from"react-hook-form";import{createContext as hr,useContext as yr}from"react";import{jsx as Cr}from"react/jsx-runtime";var Z=hr(void 0);function T(){let r=yr(Z);return r||{}}function I({children:r,...e}){return Cr(Z.Provider,{value:e,children:r})}import{createContext as br,useContext as Br}from"react";import{jsx as Pr}from"react/jsx-runtime";var q=br(void 0);function j(){let r=Br(q);return r||{}}function H({children:r,...e}){return Pr(q.Provider,{value:e,children:r})}function w({validationRules:r,label:e}){let{formControl:t,getData:m}=x(),u=[];return r&&(typeof r=="string"?K(r,!0,e,t,m,{}).forEach(s=>u.push(s)):typeof r=="object"&&Object.keys(r).forEach(s=>{let{validate:f}=u.find(o=>o.validate)||{};if(["minLength","maxLength","min","max","match","diff","regexp","pattern","required","email"].includes(s)){let o=r[s],l="";if(s==="email"&&!o)return;["match","diff"].includes(s)&&typeof o=="object"&&(o=r[s].dataField,l=r[s].label),o!=null&&K(s,o,e,t,m,f,l).forEach(i=>u.push(i))}else if(typeof r[s]=="object"){let o=r[s];u.push({validate:{...f,[s]:l=>o.validation(l)||o.message&&(typeof o.message=="string"?o.message:o.message(e))}})}})),Object.assign({},...u)}var K=(r,e,t,m,u,s,f)=>{let p=[],{validationMessage:o}=j(),{required:l,minLength:i,maxLength:a,min:c,max:d,email:y,match:U,diff:O,pattern:g}=o||{},C={required:{value:!!e,message:l?l(t):`${t} is required`},minLength:{value:e,message:i?i(t,e):`${t} must be at least ${e} characters long`},maxLength:{value:e,message:a?a(t,e):`${t} cannot be more than ${e} characters long`},min:{value:Number(e),message:c?c(t,e):`${t} should be at least ${e}`},max:{value:Number(e),message:d?d(t,e):`${t} should be at most ${e}`},regexp:(n="")=>n?new RegExp(e.regexp).test(n)||`${t} ${e.message}`:!0,email:(n="")=>n?n.match(/^(([^<>()[\]\\.,;:\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,}))$/)||(y?y(t):`${t} must be type email`):!0,match:(n="")=>n?n===(u&&u(e))||(U?U(t,f||F.changeAll(e)):`${t} must be same with ${f||F.changeAll(e)}`):!0,diff:(n="")=>n?n!==(u&&u(e))||(O?O(t,f||F.changeAll(e)):`${t} must be different with ${f||F.changeAll(e)}`):!0,pattern:{alphabet:(n="")=>!!n&&new RegExp("^[A-Za-z ]*$").test(n)||(g?.alphabet?g?.alphabet(t):`${t} must be format Alphabet`),alphanumber:(n="")=>!!n&&new RegExp("^[A-Za-z0-9 ]*$").test(n)||(g?.alphanumber?g?.alphanumber(t):`${t} must be format Alphabet or Number`),number:(n="")=>!!n&&new RegExp("^[0-9]*$").test(n)||(g?.number?g?.number(t):`${t} must be format Number`),lowercase:(n="")=>!!n&&new RegExp("^[a-z0-9 ]*$").test(n)||(g?.lowercase?g?.lowercase(t):`${t} must be format Lowercase`),url:(n="")=>!!n&&/^(ftp|http|https):\/\/[^ "]+$/.test(n)||(g?.url?g?.url(t):`${t} must be a valid URL`),uppercase:(n="")=>!!n&&new RegExp("^[A-Z0-9 ]*$").test(n)||(g?.uppercase?g?.uppercase(t):`${t} must be format Uppercase`),mixedcase:(n="")=>!!n&&/[a-z]/.test(n)&&/[A-Z]/.test(n)||(g?.mixedcase?g?.mixedcase(t):`${t} must be mixed case`),specialcharacters:(n="")=>!!n&&/[^a-zA-Z0-9\s]/.test(n)||(g?.specialcharacters?g?.specialcharacters(t):`${t} must contain special characters`)}}[r];if(C){let{validate:n}=p.find(rr=>rr.validate)||{};typeof C=="function"?p.push({validate:{...n,...s,[r]:C}}):r==="pattern"?p.push({validate:{...n,...s,[`${r}${e}`]:C[e]}}):p.push({[r]:C})}return p};import{Fragment as J,jsx as b}from"react/jsx-runtime";function _({children:r,...e}){let t=Rr(()=>h(),[]),{registerItem:m,unregisterItem:u,formControl:s,disabled:f,readOnly:p}=x(),{name:o,formId:l,...i}=T();Ar(()=>(m({id:t,...e}),()=>{u(t)}),[t,e]),!e.label&&!e.noLabel&&(e.label=F.changeAll(e.dataField));let a=!1;typeof e.disabled=="boolean"?a=e.disabled:typeof i.disabled=="boolean"?a=i.disabled:a=!!f;let c=!1;typeof e.readOnly=="boolean"?c=e.readOnly:typeof i.readOnly=="boolean"?c=i.readOnly:c=!!p;let d=!1;return typeof e.hidden=="boolean"&&(d=e.hidden),b(J,{children:s.control&&b($r,{name:e.dataField,control:s.control,rules:a||c||d?{required:!1}:w(e),render:y=>b(J,{children:b($,{...e,controller:y,children:r})})})})}import{forwardRef as Ur,useEffect as Or,useImperativeHandle as Dr,useMemo as Sr}from"react";import{useFieldArray as kr}from"react-hook-form";import{createContext as Tr,useContext as Ir}from"react";import{useFieldArray as wr}from"react-hook-form";import{jsx as Wr}from"react/jsx-runtime";var Q=Tr(void 0);function Gr(r){let e=Ir(Q);if(r){let t=x(),m=wr({control:t?.formControl.control,name:r});return{formArrayId:"",name:r,index:-1,...m,...t,countFields:m.fields.length,removeItem:()=>{},watchItem:()=>({}),setValueItem:()=>{}}}return e||{}}function G({children:r,...e}){return Wr(Q.Provider,{value:e,children:r})}import{Fragment as Lr,jsx as W}from"react/jsx-runtime";var X=Ur(({name:r,className:e="",defaultData:t,children:m},u)=>{let s=x(),f=kr({control:s.control,name:r});Or(()=>{typeof t=="boolean"&&t?f.append({}):typeof t=="number"&&t>0?f.append([...Array(t).fill(null).map(()=>({}))]):typeof t=="object"&&t&&f.append(t)},[]);let o={formArrayId:Sr(()=>h(),[]),...f,...s};return Dr(u,()=>o),W(Lr,{children:f.fields.map((l,i)=>{let a=`${r}.${i}.`,c={...o,index:i,name:a,countFields:f.fields.length,removeItem:()=>f.remove(i),watchItem:d=>s.watch(d?`${a}${d}`:a.slice(0,-1)),setValueItem:(d,y)=>s.setValue(`${a}${d}`,y)};return W("div",{className:e,children:W(G,{...c,children:k(m,c)})},l.id)})})});X.displayName="BgsFormArray";var Er=X;import{useMemo as vr}from"react";import{Fragment as Mr,jsx as Y}from"react/jsx-runtime";var V=({children:r,...e})=>{let t=x(),m=vr(()=>h(),[]);return Y(Mr,{children:Y(I,{...t,...e,formGroupId:m,children:r})})};V.displayName="BgsFormGroup";var Nr=V;var it=M;export{Er as BgsArrayForm,_ as BgsController,Nr as BgsGroupForm,H as BgsReactFormProvider,it as default,Gr as useBgsArrayForm,xr as useBgsControllerForm,x as useBgsForm,v as useBgsFormController,T as useBgsGroupForm};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@bgscore/react-form",
-    "version": "0.0.12",
+    "version": "0.0.13",
     "description": "React form component library using context and react-hook-form with dynamic arrays, groups, and validations.",
     "main": "dist/index.cjs",
     "module": "dist/index.js",