use-state-validate
Advanced tools
Comparing version 3.0.0 to 3.0.1
@@ -28,3 +28,3 @@ import type { DependencyList, ReactNode } from "react"; | ||
export declare type IFieldValidationConfig<T, P = {}> = P & IFieldValidationConfigBase<T>; | ||
declare const useStateValidate: <T, P extends IFieldValidationConfigBase<T>>(initial: T, config: P) => IFieldObject<T, P>; | ||
export declare const useStateValidate: <T, P extends IFieldValidationConfigBase<T>>(initial: T, config: P) => IFieldObject<T, P>; | ||
export declare const fieldBagChanged: <T, P = {}>(fieldBag: object) => boolean; | ||
@@ -31,0 +31,0 @@ export declare const fieldBagValid: <T, P = {}>(fieldBag: object) => boolean; |
@@ -1,1 +0,1 @@ | ||
"use strict";var __rest=this&&this.__rest||function(e,r){var t={};for(u in e)Object.prototype.hasOwnProperty.call(e,u)&&r.indexOf(u)<0&&(t[u]=e[u]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var l=0,u=Object.getOwnPropertySymbols(e);l<u.length;l++)r.indexOf(u[l])<0&&Object.prototype.propertyIsEnumerable.call(e,u[l])&&(t[u[l]]=e[u[l]]);return t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.defineConfig=exports.ruleZip=exports.rulePhone=exports.ruleNumeric=exports.ruleMatch=exports.ruleLength=exports.ruleEnum=exports.ruleEmail=exports.fieldBagTraverse=exports.fieldBagReduceToValues=exports.fieldBagValid=exports.fieldBagChanged=void 0;const react_1=require("react"),useStateValidate=(t,l)=>{const[e,r]=(0,react_1.useState)(deriveFieldObject(t,t,l)),u=(0,react_1.useRef)(e),a=(0,react_1.useRef)(!1);let i=(0,react_1.useRef)();const s=()=>clearTimeout(i.current),c=e=>{u.current=Object.assign(Object.assign({},u.current),e),r(u.current)},n=()=>c(deriveFieldObject(t,t,l)),d=e=>{s(),c({cue:e,cueInvalid:e&&!u.current.valid})};return(0,react_1.useEffect)(()=>{a.current&&c(deriveFieldObject(t,e.value,l,u.current.cue))},l.deps||[]),(0,react_1.useEffect)(()=>(a.current&&n(),a.current=!0,s),[t]),Object.assign(Object.assign({},e),{restore:n,setCue:d,setValue:e=>{s();let r=u.current["cue"];0===l.cueDelay?r=!0:l.cueDelay&&(r=!1,i.current=setTimeout(()=>{d(!0)},l.cueDelay)),c(deriveFieldObject(t,e,l,r))}})},deriveFieldObject=(e,r,t,l)=>{var{label:u,required:a,rules:i}=t,t=__rest(t,["cueDelay","deps","label","required","rules"]),i=(void 0===l&&(l=!1),validate(r,{label:u,required:a,rules:i})),s=0===i.length;return Object.assign({changed:e!==r,cue:l,cueInvalid:l&&!s,errors:i,label:u||"",required:!!a,valid:s,value:r},t)},validate=(t,r)=>{const l=r.label||"Field";return[[e=>!r.required||0===e||!!e,"boolean"!=typeof r.required&&r.required||l+" is required"],...r.rules||[]].map(([e,r])=>!e(t)&&(r||l+" is invalid")).filter(Boolean)},fieldBagChanged=e=>Object.values(e).every(({changed:e})=>e),fieldBagValid=(exports.fieldBagChanged=fieldBagChanged,e=>Object.values(e).every(({valid:e})=>e)),fieldBagReduceToValues=(exports.fieldBagValid=fieldBagValid,e=>Object.entries(e).reduce((e,[r,t])=>(e[r]=t.value,e),{})),fieldBagTraverse=(exports.fieldBagReduceToValues=fieldBagReduceToValues,(e,r)=>Object.values(e).forEach(r)),ruleEmail=(exports.fieldBagTraverse=fieldBagTraverse,()=>e=>/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(e)),ruleEnum=(exports.ruleEmail=ruleEmail,r=>e=>-1<r.indexOf(e)),ruleLength=(exports.ruleEnum=ruleEnum,({min:r,max:t})=>e=>(r||0)<=e.length&&e.length<=(t||Number.MIN_VALUE)),ruleMatch=(exports.ruleLength=ruleLength,r=>e=>r.test(e)),ruleNumeric=(exports.ruleMatch=ruleMatch,()=>e=>!isNaN(e)),rulePhone=(exports.ruleNumeric=ruleNumeric,()=>(0,exports.ruleMatch)(/^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/)),ruleZip=(exports.rulePhone=rulePhone,()=>(0,exports.ruleMatch)(/^[0-9]{5}(?:-[0-9]{4})?$/)),defineConfig=(exports.ruleZip=ruleZip,e=>e);exports.defineConfig=defineConfig,exports.default=useStateValidate; | ||
"use strict";var __rest=this&&this.__rest||function(e,r){var t={};for(a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var l=0,a=Object.getOwnPropertySymbols(e);l<a.length;l++)r.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(t[a[l]]=e[a[l]]);return t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.defineConfig=exports.ruleZip=exports.rulePhone=exports.ruleNumeric=exports.ruleMatch=exports.ruleLength=exports.ruleEnum=exports.ruleEmail=exports.fieldBagTraverse=exports.fieldBagReduceToValues=exports.fieldBagValid=exports.fieldBagChanged=exports.useStateValidate=void 0;const react_1=require("react"),useStateValidate=(t,l)=>{const[e,r]=(0,react_1.useState)(deriveFieldObject(t,t,l)),a=(0,react_1.useRef)(e),u=(0,react_1.useRef)(!1);let i=(0,react_1.useRef)();const s=()=>clearTimeout(i.current),c=e=>{a.current=Object.assign(Object.assign({},a.current),e),r(a.current)},d=()=>{s(),c(deriveFieldObject(t,t,l))},o=e=>{s(),c({cue:e,cueInvalid:e&&!a.current.valid})};return(0,react_1.useEffect)(()=>{u.current&&c(deriveFieldObject(t,e.value,l,a.current.cue))},l.deps||[]),(0,react_1.useEffect)(()=>(u.current&&d(),u.current=!0,s),[t]),Object.assign(Object.assign({},e),{restore:d,setCue:o,setValue:e=>{s();let r=a.current["cue"];0===l.cueDelay?r=!0:l.cueDelay&&(r=!1,i.current=setTimeout(()=>{o(!0)},l.cueDelay)),c(deriveFieldObject(t,e,l,r))}})},deriveFieldObject=(exports.useStateValidate=useStateValidate,(e,r,t,l)=>{var{label:a,required:u,rules:i}=t,t=__rest(t,["cueDelay","deps","label","required","rules"]),i=(void 0===l&&(l=!1),validate(r,{label:a,required:u,rules:i})),s=0===i.length;return Object.assign({changed:e!==r,cue:l,cueInvalid:l&&!s,errors:i,label:a||"",required:!!u,valid:s,value:r},t)}),validate=(t,r)=>{const l=r.label||"Field";return[[e=>!r.required||0===e||!!e,"boolean"!=typeof r.required&&r.required||l+" is required"],...r.rules||[]].map(([e,r])=>!e(t)&&(r||l+" is invalid")).filter(Boolean)},fieldBagChanged=e=>Object.values(e).every(({changed:e})=>e),fieldBagValid=(exports.fieldBagChanged=fieldBagChanged,e=>Object.values(e).every(({valid:e})=>e)),fieldBagReduceToValues=(exports.fieldBagValid=fieldBagValid,e=>Object.entries(e).reduce((e,[r,t])=>(e[r]=t.value,e),{})),fieldBagTraverse=(exports.fieldBagReduceToValues=fieldBagReduceToValues,(e,r)=>Object.values(e).forEach(r)),ruleEmail=(exports.fieldBagTraverse=fieldBagTraverse,()=>e=>/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(e)),ruleEnum=(exports.ruleEmail=ruleEmail,r=>e=>-1<r.indexOf(e)),ruleLength=(exports.ruleEnum=ruleEnum,({min:r,max:t})=>e=>(r||0)<=e.length&&e.length<=(t||Number.MAX_SAFE_INTEGER)),ruleMatch=(exports.ruleLength=ruleLength,r=>e=>r.test(e)),ruleNumeric=(exports.ruleMatch=ruleMatch,()=>e=>!isNaN(e)),rulePhone=(exports.ruleNumeric=ruleNumeric,()=>(0,exports.ruleMatch)(/^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/)),ruleZip=(exports.rulePhone=rulePhone,()=>(0,exports.ruleMatch)(/^[0-9]{5}(?:-[0-9]{4})?$/)),defineConfig=(exports.ruleZip=ruleZip,e=>e);exports.defineConfig=defineConfig,exports.default=exports.useStateValidate; |
@@ -28,3 +28,3 @@ import type { DependencyList, ReactNode } from "react"; | ||
export declare type IFieldValidationConfig<T, P = {}> = P & IFieldValidationConfigBase<T>; | ||
declare const useStateValidate: <T, P extends IFieldValidationConfigBase<T>>(initial: T, config: P) => IFieldObject<T, P>; | ||
export declare const useStateValidate: <T, P extends IFieldValidationConfigBase<T>>(initial: T, config: P) => IFieldObject<T, P>; | ||
export declare const fieldBagChanged: <T, P = {}>(fieldBag: object) => boolean; | ||
@@ -31,0 +31,0 @@ export declare const fieldBagValid: <T, P = {}>(fieldBag: object) => boolean; |
@@ -1,1 +0,1 @@ | ||
import{useEffect,useRef,useState}from"react";const useStateValidate=(u,l)=>{const[e,r]=useState(deriveFieldObject(u,u,l)),t=useRef(e),a=useRef(!1);let i=useRef();const c=()=>clearTimeout(i.current),d=e=>{t.current={...t.current,...e},r(t.current)},n=()=>d(deriveFieldObject(u,u,l)),s=e=>{c(),d({cue:e,cueInvalid:e&&!t.current.valid})};return useEffect(()=>{a.current&&d(deriveFieldObject(u,e.value,l,t.current.cue))},l.deps||[]),useEffect(()=>(a.current&&n(),a.current=!0,c),[u]),{...e,restore:n,setCue:s,setValue:e=>{c();let r=t.current["cue"];0===l.cueDelay?r=!0:l.cueDelay&&(r=!1,i.current=setTimeout(()=>{s(!0)},l.cueDelay)),d(deriveFieldObject(u,e,l,r))}}},deriveFieldObject=(e,r,{cueDelay:u,deps:l,label:t,required:a,rules:i,...c},d=!1)=>{var i=validate(r,{label:t,required:a,rules:i}),n=0===i.length;return{changed:e!==r,cue:d,cueInvalid:d&&!n,errors:i,label:t||"",required:!!a,valid:n,value:r,...c}},validate=(u,r)=>{const l=r.label||"Field";return[[e=>!r.required||0===e||!!e,"boolean"!=typeof r.required&&r.required||l+" is required"],...r.rules||[]].map(([e,r])=>!e(u)&&(r||l+" is invalid")).filter(Boolean)},fieldBagChanged=e=>Object.values(e).every(({changed:e})=>e),fieldBagValid=e=>Object.values(e).every(({valid:e})=>e),fieldBagReduceToValues=e=>Object.entries(e).reduce((e,[r,u])=>(e[r]=u.value,e),{}),fieldBagTraverse=(e,r)=>Object.values(e).forEach(r),ruleEmail=()=>e=>/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(e),ruleEnum=r=>e=>-1<r.indexOf(e),ruleLength=({min:r,max:u})=>e=>(r||0)<=e.length&&e.length<=(u||Number.MIN_VALUE),ruleMatch=r=>e=>r.test(e),ruleNumeric=()=>e=>!isNaN(e),rulePhone=()=>ruleMatch(/^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/),ruleZip=()=>ruleMatch(/^[0-9]{5}(?:-[0-9]{4})?$/),defineConfig=e=>e;export default useStateValidate;export{fieldBagChanged,fieldBagValid,fieldBagReduceToValues,fieldBagTraverse,ruleEmail,ruleEnum,ruleLength,ruleMatch,ruleNumeric,rulePhone,ruleZip,defineConfig}; | ||
import{useEffect,useRef,useState}from"react";const useStateValidate=(u,l)=>{const[e,r]=useState(deriveFieldObject(u,u,l)),t=useRef(e),a=useRef(!1);let i=useRef();const d=()=>clearTimeout(i.current),c=e=>{t.current={...t.current,...e},r(t.current)},n=()=>{d(),c(deriveFieldObject(u,u,l))},s=e=>{d(),c({cue:e,cueInvalid:e&&!t.current.valid})};return useEffect(()=>{a.current&&c(deriveFieldObject(u,e.value,l,t.current.cue))},l.deps||[]),useEffect(()=>(a.current&&n(),a.current=!0,d),[u]),{...e,restore:n,setCue:s,setValue:e=>{d();let r=t.current["cue"];0===l.cueDelay?r=!0:l.cueDelay&&(r=!1,i.current=setTimeout(()=>{s(!0)},l.cueDelay)),c(deriveFieldObject(u,e,l,r))}}},deriveFieldObject=(e,r,{cueDelay:u,deps:l,label:t,required:a,rules:i,...d},c=!1)=>{var i=validate(r,{label:t,required:a,rules:i}),n=0===i.length;return{changed:e!==r,cue:c,cueInvalid:c&&!n,errors:i,label:t||"",required:!!a,valid:n,value:r,...d}},validate=(u,r)=>{const l=r.label||"Field";return[[e=>!r.required||0===e||!!e,"boolean"!=typeof r.required&&r.required||l+" is required"],...r.rules||[]].map(([e,r])=>!e(u)&&(r||l+" is invalid")).filter(Boolean)},fieldBagChanged=e=>Object.values(e).every(({changed:e})=>e),fieldBagValid=e=>Object.values(e).every(({valid:e})=>e),fieldBagReduceToValues=e=>Object.entries(e).reduce((e,[r,u])=>(e[r]=u.value,e),{}),fieldBagTraverse=(e,r)=>Object.values(e).forEach(r),ruleEmail=()=>e=>/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(e),ruleEnum=r=>e=>-1<r.indexOf(e),ruleLength=({min:r,max:u})=>e=>(r||0)<=e.length&&e.length<=(u||Number.MAX_SAFE_INTEGER),ruleMatch=r=>e=>r.test(e),ruleNumeric=()=>e=>!isNaN(e),rulePhone=()=>ruleMatch(/^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/),ruleZip=()=>ruleMatch(/^[0-9]{5}(?:-[0-9]{4})?$/),defineConfig=e=>e;export default useStateValidate;export{useStateValidate,fieldBagChanged,fieldBagValid,fieldBagReduceToValues,fieldBagTraverse,ruleEmail,ruleEnum,ruleLength,ruleMatch,ruleNumeric,rulePhone,ruleZip,defineConfig}; |
{ | ||
"name": "use-state-validate", | ||
"version": "3.0.0", | ||
"version": "3.0.1", | ||
"description": "Clean featherweight state validation", | ||
@@ -5,0 +5,0 @@ "sideEffects": false, |
@@ -53,3 +53,3 @@ # use-state-validate | ||
value={field.value} | ||
onChange={(e: any) => field.setValue(e.target.value)} | ||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => field.setValue(e.target.value)} | ||
/> | ||
@@ -68,2 +68,3 @@ {field.cueInvalid && <div aria-live="polite">{field.errors[0]}</div>} | ||
### Changelog | ||
* v3.0.1 - Fixes ruleLength bug on min logic. | ||
* v3.0.0 - Overhaul, leans heavy on cuing concepts for smooth UX. Lib made leaner and more flexible. | ||
@@ -70,0 +71,0 @@ * v2.5.4 - Bugfix - required, message type |
15187
82