form-atoms
Version:
Form primitives for Jotai
2 lines (1 loc) • 11.7 kB
JavaScript
;var ne=Object.create;var D=Object.defineProperty;var re=Object.getOwnPropertyDescriptor;var ue=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,me=Object.prototype.hasOwnProperty;var Fe=(t,e)=>{for(var l in e)D(t,l,{get:e[l],enumerable:!0})},$=(t,e,l,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of ue(e))!me.call(t,a)&&a!==l&&D(t,a,{get:()=>e[a],enumerable:!(i=re(e,a))||i.enumerable});return t};var pe=(t,e,l)=>(l=t!=null?ne(de(t)):{},$(e||!t||!t.__esModule?D(l,"default",{value:t,enumerable:!0}):l,t)),ce=t=>$(D({},"__esModule",{value:!0}),t);var Le={};Fe(Le,{Field:()=>Te,Form:()=>Ve,InputField:()=>xe,Provider:()=>oe.Provider,RESET:()=>T.RESET,SelectField:()=>ve,TextareaField:()=>Ae,fieldAtom:()=>he,formAtom:()=>Se,useField:()=>N,useFieldActions:()=>Q,useFieldErrors:()=>Ce,useFieldInitialValue:()=>K,useFieldState:()=>te,useFieldValue:()=>Oe,useForm:()=>z,useFormActions:()=>Ue,useFormErrors:()=>Ee,useFormState:()=>be,useFormStatus:()=>ge,useFormSubmit:()=>Re,useFormValues:()=>Me,useInputField:()=>se,useInputFieldProps:()=>k,useSelectField:()=>ie,useSelectFieldProps:()=>ee,useTextareaField:()=>ae,useTextareaFieldProps:()=>Z,walkFields:()=>M});module.exports=ce(Le);var y=pe(require("react")),s=require("jotai"),T=require("jotai/utils");function L(t,e,l){if(e.length===1)return t[e[0]]=l,t;let i=t;for(let a=0;a<e.length;a++){let r=e[a];if(a===e.length-1)i[r]=l;else{let d=i[r];i=i[r]=d!=null?d:isNaN(e[a+1])?{}:[]}}}function q(t,e){let l=t.toISOString();return e==="datetime-local"?l.slice(0,16):e==="month"?l.slice(0,7):e==="week"?ye(t):e==="time"?l.slice(11,19):(t=B(t),t.toISOString().slice(0,10))}function ye(t){t=B(t),t=new Date(Date.UTC(t.getFullYear(),t.getMonth(),t.getDate())),t.setUTCDate(t.getUTCDate()+4-(t.getUTCDay()||7));let e=t.getUTCFullYear(),l=new Date(Date.UTC(t.getUTCFullYear(),0,1)).getTime(),i=t.getTime(),a=Math.ceil(((i-l)/Y+1)/7);if(a===0){let r=e-1,d=new Date(Date.UTC(r,0,1)).getTime();a=Math.ceil(((i-d)/Y+1+(e%4||!(e%100)&&e%400?365:366))/7),e=r}return e+"-W"+(""+a).padStart(2,"0")}var Y=864e5;function B(t){return new Date(t.getTime()+new Date().getTimezoneOffset()*60*1e3)}var oe=require("jotai");function Ve(t){return y.createElement(s.Provider,{store:t.store},y.createElement(fe,{...t}))}function fe(t){let e=z(t.atom);return"render"in t?t.render(e):y.createElement(t.component,e)}function xe(t){let e=se(t.atom,t);return W(t,e)}function ve(t){let e=ie(t.atom,t);return W(t,e)}function Ae(t){let e=ae(t.atom,t);return W(t,e)}function W(t,e){return"render"in t?t.render(e.props,e.state,e.actions):y.createElement(t.component,e.props)}function Te(t){let{state:e,actions:l}=N(t.atom,t);return"render"in t?t.render(e,l):y.createElement(t.component,{state:e,actions:l})}function Se(t){let e=(0,T.atomWithReset)(t),l=(0,s.atom)(u=>{let o=u(e),n={};return M(o,(p,V)=>{if(p){let A=u(p);L(n,V,u(A.value))}else L(n,V,[])},{includeEmptyArrays:!0}),n});async function i(u,o,n){let p=u(e),V=[];M(p,A=>{async function R(h){var J,X;let x=u(h),g=u(x.value),H=u(x.dirty),O=u(x._validateCount)+1;o(x._validateCount,O),(n==="user"||n==="submit")&&o(x.touched,!0);let C=(J=x._validateCallback)==null?void 0:J.call(x,{get:u,set:o,value:g,dirty:H,touched:u(x.touched),event:n}),I;return _(C)?(o(x.validateStatus,"validating"),I=(X=await C)!=null?X:u(x.errors)):I=C!=null?C:u(x.errors),O===u(x._validateCount)&&(o(x.errors,I),o(x.validateStatus,I.length>0?"invalid":"valid")),!(I&&I.length)}V.push(R(A))}),await Promise.all(V)}let a=(0,s.atom)(u=>{let o=u(e),n="valid";return M(o,p=>{let V=u(p),A=u(V.validateStatus);if(A==="validating")return n="validating",!1;if(A==="invalid")return n="invalid",!1}),n}),r=(0,s.atom)(null,(u,o,n="user")=>{n&&i(u,o,n)}),d=(0,s.atom)(u=>{let o=u(e),n={};return M(o,(p,V)=>{let A=u(p);L(n,V,u(A.errors))}),n}),m=(0,s.atom)(0),F=(0,s.atom)(0),c=(0,s.atom)("idle"),f=(0,s.atom)(null,(u,o,n)=>{async function p(){let V=u(F)+1;if(o(F,V),o(m,h=>++h),await i(u,o,"submit"),u(a)==="invalid")return V===u(F)&&o(c,"idle");let R=n(u(l));try{_(R)&&(V===u(F)&&o(c,"submitting"),await R)}catch(h){}finally{V===u(F)&&o(c,"submitted")}}p()}),S=(0,s.atom)(u=>{let o=u(e),n=!1;return M(o,p=>{let V=u(p);if(n=u(V.dirty),n)return!1}),n}),U=(0,s.atom)(u=>{let o=u(e),n={};return M(o,(p,V)=>{let A=u(p);L(n,V,u(A.touched))}),n}),E=(0,s.atom)(null,(u,o)=>{o(e,T.RESET),M(u(e),n=>{let p=u(n);o(p.reset)}),o(F,n=>++n),o(c,"idle")}),b={fields:e,values:l,errors:d,dirty:S,touchedFields:U,validate:r,validateStatus:a,submit:f,submitStatus:c,submitCount:m,reset:E,_validateFields:i},v=(0,s.atom)(b);return typeof process!="undefined"&&process.env.NODE_ENV!=="production"&&(v.debugLabel=`form/${v}`,Object.entries(b).map(([u,o])=>{w(o)&&(o.debugLabel=`${v.debugLabel}/${u}`)})),v}function z(t,e){let l=(0,s.useAtomValue)(t,e),i=(0,s.useAtomValue)(l.fields,e),a=(0,s.useSetAtom)(l.reset,e),r=(0,s.useSetAtom)(l.validate,e),d=(0,s.useSetAtom)(l.submit,e),[,m]=P();return y.useMemo(()=>({fieldAtoms:i,validate(){m(()=>{r("user")})},reset(F){F==null||F.preventDefault(),m(()=>{a()})},submit(F){return c=>{c==null||c.preventDefault(),m(()=>{d(F)})}}}),[i,r,a,d])}function be(t,e){let l=(0,s.useAtomValue)(t,e),i=(0,s.useAtomValue)(l.fields,e),a=(0,s.useAtomValue)(l.submitCount,e),r=(0,s.useAtomValue)(l.submitStatus,e),d=(0,s.useAtomValue)(l.validateStatus,e),m=(0,s.useAtomValue)(l.values,e),F=(0,s.useAtomValue)(l.errors,e),c=(0,s.useAtomValue)(l.dirty,e),f=(0,s.useAtomValue)(l.touchedFields,e);return y.useMemo(()=>({fieldAtoms:i,values:m,errors:F,dirty:c,touchedFields:f,submitCount:a,submitStatus:r,validateStatus:d}),[i,m,F,c,f,a,r,d])}function Ue(t,e){let l=(0,s.useAtomValue)(t,e),i=(0,s.useSetAtom)(l.fields,e),a=(0,s.useSetAtom)(l.reset,e),r=(0,s.useSetAtom)(l.validate,e),d=(0,s.useSetAtom)(l.submit,e),m=y.useCallback(c=>f=>{f==null||f.preventDefault(),d(c)},[d]),[,F]=P();return y.useMemo(()=>({updateFields:i,reset:a,validate(){F(()=>{r("user")})},submit:m}),[i,a,r,m])}function Ee(t,e){let l=(0,s.useAtomValue)(t,e);return(0,s.useAtomValue)(l.errors,e)}function Me(t,e){let l=(0,s.useAtomValue)(t,e);return(0,s.useAtomValue)(l.values,e)}function ge(t,e){let l=(0,s.useAtomValue)(t),i=(0,s.useAtomValue)(l.submitStatus,e),a=(0,s.useAtomValue)(l.validateStatus,e);return y.useMemo(()=>({submitStatus:i,validateStatus:a}),[i,a])}function Re(t,e){let[,l]=P(),i=(0,s.useAtomValue)(t,e),a=(0,s.useSetAtom)(i.submit,e);return y.useCallback(r=>d=>{d==null||d.preventDefault(),l(()=>{a(r)})},[a])}function he(t){var v,u;let e=(0,T.atomWithReset)(t.name),l=(0,T.atomWithReset)(void 0),i=(0,T.atomWithReset)(t.value),a=(0,s.atom)(o=>o(i),(o,n,p)=>t.preprocess&&p!==T.RESET?n(i,t.preprocess(p)):n(i,p)),r=(0,T.atomWithReset)((v=t.touched)!=null?v:!1),d=(0,s.atom)(o=>{var p;let n=(p=o(l))!=null?p:t.value;return o(a)!==n}),m=(0,s.atom)([]),F=(0,s.atom)(0),c=(0,s.atom)("valid"),f=(0,s.atom)(null,(o,n,p="user")=>{async function V(){var H,O;if(!p)return;let A=o(F)+1;n(F,A);let R=o(d),h=o(a);(p==="user"||p==="submit")&&n(r,!0);let x=[],g=(H=t.validate)==null?void 0:H.call(t,{get:o,set:n,dirty:R,touched:o(r),value:h,event:p});_(g)?(A===o(F)&&n(c,"validating"),x=(O=await g)!=null?O:o(m)):x=g!=null?g:o(m),A===o(F)&&(n(m,x),n(c,x.length>0?"invalid":"valid"))}V()}),S=(0,s.atom)(null),U=(0,s.atom)(null,(o,n)=>{var p;n(m,[]),n(r,T.RESET),n(a,(p=o(l))!=null?p:t.value),n(F,V=>++V),n(c,"valid")}),E={name:e,value:a,touched:r,dirty:d,validate:f,validateStatus:c,errors:m,reset:U,ref:S,_initialValue:l,_validateCount:F,_validateCallback:t.validate},b=(0,s.atom)(E);return typeof process!="undefined"&&process.env.NODE_ENV!=="production"&&(b.debugLabel=`field/${(u=t.name)!=null?u:`${b}`}`,Object.entries(E).map(([o,n])=>{w(n)&&(n.debugLabel=`${b.debugLabel}/${o}`)}),i.debugPrivate=!0),b}function Q(t,e){let l=(0,s.useAtomValue)(t,e),i=(0,s.useSetAtom)(l.value,e),a=(0,s.useSetAtom)(l.touched,e),r=(0,s.useSetAtom)(l.errors,e),d=(0,s.useSetAtom)(l.validate,e),m=(0,s.useSetAtom)(l.reset,e),F=(0,s.useAtomValue)(l.ref,e),[,c]=P();return y.useMemo(()=>({validate(){c(()=>{d("user")})},setValue(f){i(f),c(()=>{d("change")})},setTouched(f){a(f),f&&c(()=>{d("touch")})},setErrors:r,focus(){F==null||F.focus()},reset:m}),[r,m,d,i,a,F])}function k(t,e={}){let l=(0,s.useAtomValue)(t,e),i=(0,s.useAtomValue)(l.name,e),[a,r]=(0,s.useAtom)(l.value,e),d=(0,s.useSetAtom)(l.touched,e),m=(0,s.useAtomValue)(l.validateStatus,e),F=(0,s.useSetAtom)(l.validate,e),c=(0,s.useSetAtom)(l.ref,e),[,f]=P(),{type:S="text"}=e;return y.useMemo(()=>({name:i,value:G.has(S)?void 0:a===null?"":Array.isArray(a)?a.map(U=>U+""):a instanceof Date?q(a,S):a,"aria-invalid":m==="invalid",type:S,ref:c,onBlur(){d(!0),f(()=>{F("blur")})},onChange(U){let E=U.currentTarget,b=r,v=S;b(v==="datetime-local"?new Date(E.valueAsNumber):E[G.has(v)?"files":Pe.has(v)?"valueAsDate":Ie.has(v)?"valueAsNumber":"value"]),f(()=>{F("change")})}}),[i,a,m,c,d,F,r,S])}var Ie=new Set(["number","range"]),Pe=new Set(["date","datetime-local","month","week","time"]),G=new Set(["file"]);function Z(t,e={}){let l=k(t,e);return y.useMemo(()=>{let{type:i,...a}=l;return a},[l])}function ee(t,e={}){let l=(0,s.useAtomValue)(t,e),i=(0,s.useSetAtom)(l.value,e),a=(0,s.useSetAtom)(l.validate,e),[,r]=P(),{multiple:d}=e,m=k(t,e);return y.useMemo(()=>{let{type:F,onChange:c,...f}=m;return{...f,multiple:d,onChange(S){if(d){let U=S.currentTarget.options,E=[];for(let b in U){let v=U[b];v.selected&&E.push(v.value)}i(E)}else i(S.currentTarget.value);r(()=>{a("change")})}}},[m,a,r,i,d])}function te(t,e){let l=(0,s.useAtomValue)(t,e),i=(0,s.useAtomValue)(l.value,e),a=(0,s.useAtomValue)(l.touched,e),r=(0,s.useAtomValue)(l.dirty,e),d=(0,s.useAtomValue)(l.validateStatus,e),m=(0,s.useAtomValue)(l.errors,e);return y.useMemo(()=>({value:i,touched:a,dirty:r,validateStatus:d,errors:m}),[i,a,r,d,m])}function Oe(t,e){let l=(0,s.useAtomValue)(t,e);return(0,s.useAtomValue)(l.value,e)}function Ce(t,e){let l=(0,s.useAtomValue)(t,e);return(0,s.useAtomValue)(l.errors,e)}function K(t,e,l){let i=(0,s.useAtomValue)(t,l),a=(0,s.useStore)(l);(0,T.useHydrateAtoms)(e?[[i._initialValue,e],[i.value,e]]:[],l),y.useEffect(()=>{let r=l&&l.areEqual||le;e!==void 0&&(!a.get(i.dirty)&&!r(e,a.get(i.value))&&a.set(i.value,e),r(e,a.get(i._initialValue))||a.set(i._initialValue,e))})}function le(t,e){return Array.isArray(t)&&Array.isArray(e)?t.length===e.length&&(Object.is(t,e)||t.every((l,i)=>le(l,e[i]))):Object.is(t,e)}function N(t,e){K(t,e==null?void 0:e.initialValue,e);let l=Q(t,e),i=te(t,e);return y.useMemo(()=>({actions:l,state:i}),[l,i])}function se(t,e){let l=k(t,e);return j(t,l,e)}function ie(t,e){let l=ee(t,e);return j(t,l,e)}function ae(t,e){let l=Z(t,e);return j(t,l,e)}function j(t,e,l){let i=N(t,l);return K(t,l==null?void 0:l.initialValue,l),y.useMemo(()=>({props:e,...i}),[e,i])}var P=typeof y.useTransition=="function"?y.useTransition:()=>[!1,t=>t()];function _(t){return typeof t=="object"&&typeof t.then=="function"}function w(t){return t!==null&&typeof t=="object"&&(typeof t.read=="function"||typeof t.write=="function")}function M(t,e,l={},i=[]){for(let a in t){i.push(a);let r=t[a];if(w(r)){if(e(r,i)===!1)return}else if(Array.isArray(r))if(!r.length&&l.includeEmptyArrays)e(null,i);else for(let d in r){i.push(d);let m=r[d];if(w(m)){if(e(m,i)===!1)return}else M(m,e,l,i);i.pop()}else typeof r=="object"&&M(r,e,l,i);i.pop()}}0&&(module.exports={Field,Form,InputField,Provider,RESET,SelectField,TextareaField,fieldAtom,formAtom,useField,useFieldActions,useFieldErrors,useFieldInitialValue,useFieldState,useFieldValue,useForm,useFormActions,useFormErrors,useFormState,useFormStatus,useFormSubmit,useFormValues,useInputField,useInputFieldProps,useSelectField,useSelectFieldProps,useTextareaField,useTextareaFieldProps,walkFields});