@apparently/formular
Version:
Form library for SolidJS
2 lines (1 loc) • 4.58 kB
JavaScript
;import{createMemo as v,onCleanup as z,batch as G}from"solid-js";import{createStore as B,unwrap as J}from"solid-js/store";import _ from"stable-hash";export function required(n){return async a=>{if(typeof a!="number"&&!a||a?.length==0)return n}}function q(n){return n.split(".").map(a=>({value:a,arrayIndex:!isNaN(Number(a))}))}function Q(n,a,e){let o=n;for(let i=0;i<a.length;i++){const s=a[i];if(o.hasOwnProperty(s.value)||(a[i+1]?.arrayIndex?o[s.value]=[]:o[s.value]={}),i!=a.length-1){o=o[s.value];continue}o[s.value]=e}}export function FinalValue(n){return()=>n}function R(n,a,e=""){for(const o in n){const i=n[o];if(typeof i>"u"||i==null)continue;if((typeof i=="object"||Array.isArray(i))&&typeof i!="function"){R(i,a,e+o+".");continue}const s=e+o;if(typeof i=="function"){a(s,i());continue}a(s,i)}}export function createArrayController(n,a,e=[]){const{errors:o,invalid:i,value:s,change:y}=createController(n,a,e,[]);function b(c){y([...s(),c])}function F(c){y(s().filter((g,u)=>u!=c))}function P(c,g){y(s().map((u,T)=>T==c?g:u))}function m(c){y(c)}function w(c,g){let u=s().concat();u[c]=s()[g],u[g]=s()[c],y(u)}return{errors:o,invalid:i,items:s,add:b,update:P,set:m,remove:F,swap:w}}export function createController(n,a,e=[],o=""){const{data:i,addField:s,focus:y,isFieldDirty:b,addError:F,setField:P,setFieldRef:m,touch:w,validate:c,clearErrors:g}=a;s(n,e,o);function u(E,r=!0,t=!0){P(n,E,t),r&&c(n)}function T(){y(n)}function V(){w(n)}function A(){c(n)}function j(){c(n)}function D(){g(n)}function k(E){m(n,E)}function O(E,r=!1){F(n,E,r)}const C=v(()=>i[n]?.value??""),N=v(()=>i[n]?.errors??[]),I=v(()=>i[n]?.touched??!1),M=v(()=>b(n)),L=v(()=>N().length>0);return{value:C,ref:k,touched:I,dirty:M,errors:N,change:u,onFocus:V,onBlur:A,focus:T,invalid:L,trigger:j,addError:O,clearErrors:D}}export function createForm(){const[n,a]=B({}),[e,o]=B({});function i(){for(const r in e){const t=e[r];if(t.errors.length>0||t.validators.length>0&&!t.touched)return!1}return!0}function s(r){if(!e.hasOwnProperty(r))return!1;const t=e[r].value;return n.hasOwnProperty(r)?_(n[r])!==_(t):t!=""}const y=v(()=>{let r={};for(const t in e)r[t]=s(t);return r}),b=v(()=>{for(const r of Object.values(y()))if(r)return console.log(y()),!0;return!1});function F(r){let t={};for(const l in e)Q(t,e[l].path,e[l][r]);return t}const P=v(()=>F("value")),m=v(()=>F("touched")),w=v(()=>F("errors")),c=v(()=>i());function g(r){if(!r||Array.isArray(r)&&r.length==0){for(const t in e)o(t,"errors",[]);return}if(Array.isArray(r)){for(const t of r)o(t,"errors",[]);return}o(r,"errors",[])}async function u(r,t=!1){async function l(p,d){let x=!0,S=!1;for(const H of p)!await u(H,!1)&&x&&(x=!1,!S&&e[H].ref&&d&&(e[H].ref.focus(),S=!0));return x}if(!r||r.length==0)return await l(Object.keys(e),t);if(Array.isArray(r))return await l(r,t);if(!e.hasOwnProperty(r))return!1;const f=e[r].validators;let h=[];for(const p of f){const d=await p(e[r].value,P());d!==void 0&&h.push(d)}return h.length>0&&t&&e[r].ref?.focus(),o(r,"errors",h),h.length==0}function T(r,t=[]){function l(d){const x=d.target;k(r,x.type=="checkbox"?d.target.checked:d.target.value,!1),u(r)}function f(d){V(r)}function h(d){u(r)}function p(d){O(r,t,"",d),z(()=>I(r))}return{onInput:l,onFocus:f,onBlur:h,name:r,ref:p}}function V(r){!e.hasOwnProperty(r)||o(r,"touched",!0)}function A(r){!e.hasOwnProperty(r)||e[r].ref?.focus()}function j(r,t){!e.hasOwnProperty(r)||o(r,"ref",t)}function D(r,t,l=!1){!e.hasOwnProperty(r)||(o(r,"errors",f=>[...f,t]),l&&e[r].ref&&e[r].ref?.focus())}function k(r,t,l=!0){!e.hasOwnProperty(r)||(G(()=>{o(r,"value",t),o(r,"touched",!0)}),l&&e[r].ref&&(e[r].ref.value=t))}function O(r,t,l,f){const h=q(r);let p=l;e?.hasOwnProperty(r)&&(p=e[r].value,f&&(f.value=e[r].value)),l&&a({[r]:l}),o(r,{ref:f,errors:[],value:p,touched:!1,validators:t,path:h})}function C(r){R(r,(t,l)=>{if(J(e)[t]!=null){o(t,"value",l);return}o(t,{value:l,errors:[],path:q(t),touched:!1,validators:[]})})}function N(r){const t=b();R(r,(l,f)=>{a(l,f)}),!t&&C(r)}function I(r){o(t=>{const{[r]:l,...f}=t;return f})}function M(r){return async t=>{t.preventDefault(),await u(void 0,!0)&&r(F("value"))}}function L(){if(Object.keys(n).length>0){for(const r in n)o(r,"value",n[r]);u();return}for(const r in e)o(r,"value","");g()}return{reset:L,handleSubmit:M,control:{data:e,addField:O,focus:A,isFieldDirty:s,removeField:I,touch:V,validate:u,clearErrors:g,addError:D,setField:k,setFieldRef:j},focus:A,field:T,addError:D,setValues:C,setInitialValues:N,setField:k,trigger:u,clearErrors:g,values:P,isValid:c,isDirty:b,touched:m,dirty:y,errors:w}}