gform-react 1.0.0

package/README.md

@@ -0,0 +1,298 @@
+# GForm
+![npm bundle size](https://img.shields.io/bundlephobia/min/gform-react)
+![npm peer dependency version](https://img.shields.io/npm/dependency-version/gform-react/peer/react)
+![npm peer dependency version](https://img.shields.io/npm/dependency-version/gform-react/peer/react-dom)
+![NPM](https://img.shields.io/npm/l/gform-react)
+
+#### A generic form builder for react-based applications.
+it doesn't matter which UI library you're using,
+it only cares about the form and the inputs inside.
+
+## Installation
+npm:
+```shell
+npm install gform-react
+```
+
+yarn:
+```shell
+yarn add gform-react
+```
+
+#### NOTE:
+react >=16.7.0, react-dom >=16.7.0 are peer dependecies
+
+
+## Quickstart - Native
+
+```tsx
+import { GForm, GInput, IForm } from "gform-react";
+
+//the interface that represents a form
+interface SignInForm extends IForm {
+    email: GInputState<string>;
+    password: GInputState<string>;
+}
+
+const App: FC = () => {
+    const onSubmit = (formState) => {
+        console.log(formState);
+    };
+
+    return (
+        <div>
+            ...
+            <GForm<SignInForm> className='some-class' onSubmit={onSubmit}>
+                <div className='some-formgroup'>
+                    <GInput formKey='email' required/>
+                </div>
+                <div className='some-formgroup'>
+                    <GInput formKey='password' required type='password'/>
+                </div>
+                <button>Submit</button>
+            </GForm>
+        </div>
+    );
+};
+
+```
+
+## Quickstart - Prime React
+
+```tsx
+import { InputText } from "primereact/inputtext";
+import { Button } from 'primereact/button';
+import { GForm, GInput, IForm } from "gform-react";
+
+type SignInForm = IForm<{
+    email: GInputState<string>;
+    password: GInputState<string>;
+}>;
+
+const App: FC = () => {
+    return (
+        <div>
+            ...
+            <GForm className='some-class'>
+                <GInput formKey={'email'} required minLength={7}
+                        element={(input, props) => <div>
+                                                        <label htmlFor="email">Email</label>
+                                                        <InputText {...props} id="email" aria-describedby="email-help" className={input.error ? "p-invalid" : ''} />
+                                                        {input.error && <small id="email-help" className="p-error">{input.errorText}</small>}
+                                                    </div>}
+                        />
+
+                <GInput formKey={'password'} required 
+                        element={(input, props) => <div>
+                                                        <label htmlFor="password">Password</label>
+                                                        <InputText {...props} id="password" aria-describedby="password-help" className={input.error ? "p-invalid" : ''} />
+                                                        {input.error && <small id="password-help" className="p-error">{input.errorText}</small>}
+                                                    </div>}
+                />
+
+                <Button label="Submit" aria-label="Submit" />
+            </GForm>
+        </div>
+    );
+};
+
+```
+
+## Quickstart - MUI
+
+```tsx
+import { Button, TextField } from '@mui/material';
+import { GForm, GInput, IForm } from "gform-react";
+
+interface SignInForm extends IForm {
+    email: GInputState<string>;
+    password: GInputState<string>;
+}
+
+const App: FC = () => {
+    return (
+        <div>
+            ...
+            <GForm<SignInForm> className='some-class'>
+                <GInput type='text' formKey={'email'}
+                        element={(input, props) => <div>
+                                                        <TextField inputProps={props} variant='filled' label='first name' error={input.error} helperText={input.errorText} />
+                                                   </div>}
+                />
+                <GInput formKey={'password'} required minLength={4}
+                        element={(input, props) => <div>
+                                                        <TextField inputProps={props} variant='filled' label='first name' error={input.error} helperText={input.errorText} />
+                                                   </div>}
+                />
+
+                <Button variant='contained' type='submit'>submit</Button>
+            </GForm>
+        </div>
+    );
+};
+
+```
+
+# Form State
+
+`GForm` will expose the current form state on the following cases:
+#### 1 - the form is valid and submited
+```tsx
+    <GForm<SignInForm>>onSubmit={(formState, e) => {}}
+        <GInput formKey='email' required minLength={5}/>
+        <GInput formKey='password' required type='password'/>
+        <button>submit</button>
+    </GForm>
+```
+
+#### 2 - pass a children function
+```tsx
+    <GForm<SignInForm>>
+        {
+            (formState) => <>
+                    <div className='some-formgroup'>
+                        <GInput formKey='email' required minLength={5}/>
+                    </div>
+                    <div className='some-formgroup'>
+                        <GInput formKey='password' required type='password'/>
+                    </div>
+                <button disabled={formState.isInvalid}>submit</button>
+            </>
+        }
+    </GForm>
+```
+
+### Form State Object
+the `GFormState<T>` is a generic type and the argument is the form interface (the shape of the form)
+
+on the examples above the arguemnt is `SignInForm` (`<GForm<SignInForm>>`)
+
+the state is simple object:
+```typescript
+export type GFormState<T extends IForm<T>> = T
+    &
+    {
+        isValid: boolean;
+        isInvalid: boolean;
+        loading: boolean;
+        toRawData: () => RawData<T>;
+        toFormData: (options?: ToFormDataOptions<T>) => FormData;
+        toURLSearchParams: (options?: ToURLSearchParamsOptions<T>) => URLSearchParams;
+        setLoading: Dispatch<SetStateAction<boolean>>;
+        updateValidity: () => void;
+    };
+```
+
+# Constraint Validation API & Custom validations
+> **Note:** There are several errors that will prevent the form from being submitted, including: badInput, patternMismatch, rangeOverflow or rangeUnderflow, stepMismatch, tooLong or tooShort, typeMismatch, valueMissing, or a customError.
+
+`GForm` is based on the native [Constraint Validation API](https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation)
+
+which includes `required`, `minLength`, `maxLength`, `min`, `max`, `step` ... [see all here](https://developer.mozilla.org/en-US/docs/Web/API/ValidityState)
+
+While you can also add __any__ custom validation(s) you need
+
+
+## Example - Constraint Validation
+```tsx
+const validators: GValidators<SignInForm> = {
+    email: new GValidator().withRequiredMessage('this field is required')
+                           .withMinLengthMessage((input) => `${input.formKey} must contain atleast ${input.minLength} chars`),
+
+    password: new GValidator().withRequiredMessage('this field is required')
+};
+
+...
+
+<GForm<SignInForm> validators={validators}>
+    <div className='some-formgroup'>
+        <GInput formKey='email' required minLength={5}/>
+    </div>
+    <div className='some-formgroup'>
+        <GInput formKey='password' required type='password'/>
+    </div>
+    <button>Submit</button>
+</GForm>
+```
+
+#### you can also refer to another input validator (with prop `validatorKey`, see code below)
+```tsx
+const validators: GValidators<SignInForm> = {
+    email: new GValidator().withRequiredMessage('this field is required')
+};
+
+...
+
+<GForm<SignInForm> validators={validators}>
+    <GInput formKey='email' required minLength={5}/>
+    <GInput formKey='password' validatorKey='email' required type='password'/>
+    <button>Submit</button>
+</GForm>
+```
+
+#### you can also extend validators
+```tsx
+
+const baseValidator = new GValidator().withRequiredMessage('this field is required')
+
+const validators: GValidators<SignInForm> = {
+    email: new GValidator(baseValidator).withMinLengthMessage('...'),
+    password: baseValidator
+};
+
+...
+
+<GForm<SignInForm> validators={validators}>
+    <GInput formKey='email' required minLength={5}/>
+    <GInput formKey='password' required type='password'/>
+    <button>Submit</button>
+</GForm>
+```
+
+## Example - Adding Custom Validations
+```tsx
+const validators: GValidators<SignUpForm> = {
+    email: new GValidator()
+            .withRequiredMessage('this field is required')
+            .withMinLengthMessage((input) => `${input.formKey} must contain atleast ${input.minLength} chars`),
+    password: new GValidator()
+                .withRequiredMessage('this field is required')
+                .withCustomValidation((input) => {
+                    input.errorText = `${input.formKey} must contain special char`; // the message that will be displayed if the test has failed
+                    return /[^a-zA-Z0-9]+/; // the test
+                })
+                .withCustomValidation((input, validityKey, fields) => {
+                    fields.confirmPassword.checkValidity(); // update the confirmPassword field in case of match
+
+                    input.errorText = `the password and confirm password doesnt match`; // the message that will be displayed if the test has failed
+                    return fields.confirmPassword.value !== fields.password.value; // the test
+                }),
+    confirmPassword: new GValidator()
+                        .withCustomValidation((input, validityKey, fields) => {
+                            fields.password.checkValidity(); // update the password field in case of match
+
+                            input.errorText = `the password and confirm password doesnt match`; // the message that will be displayed if the test has failed
+                            return fields.confirmPassword.value !== fields.password.value; // the test
+                        })
+};
+
+...
+
+<GForm<SignUpForm> validators={validators}>
+    <div className='some-formgroup'>
+        <GInput formKey='email' required minLength={5}/>
+    </div>
+    <div className='some-formgroup'>
+        <GInput formKey='password' required type='password'/>
+    </div>
+    <div className='some-formgroup'>
+        <GInput formKey='confirmPassword' type='password'/>
+    </div>
+    <button>Submit</button>
+</GForm>
+```
+
+# Next
+* Nested forms
+
+

package/dist/index.d.ts

@@ -0,0 +1,171 @@
+import type { ReactNode, MutableRefObject, HTMLAttributes, FormEvent, ChangeEvent, FC, Dispatch, SetStateAction } from "react";
+
+type BaseForm = {
+    [key: string]: GInputState;
+};
+export type IForm<T extends BaseForm = BaseForm> = {
+    [key in keyof T]: T[key];
+};
+type BaseFormEvent = {
+    target: {
+        value?: string;
+    };
+};
+type GFormEvent = FormEvent<HTMLInputElement | HTMLTextAreaElement | HTMLFormElement | unknown>;
+type GFormChangeEvent = ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLFormElement | unknown>;
+
+type ToURLSearchParamsOptions<T extends IForm> = {
+    exclude?: (keyof T)[];
+    include?: (keyof T)[];
+};
+type ToFormDataOptions<T extends IForm> = ToURLSearchParamsOptions<T>;
+
+type BaseGenericFieldProps = {
+    formKey: string;
+    validatorKey?: string;
+    type?: 'text' | 'password' | 'email' | 'tel' | 'checkbox' | 'number' | 'range' | 'color' | 'file' | 'date' | 'month' | 'week' | 'time' | 'search' | 'select';
+};
+type FieldWithError<T extends BaseGenericFieldProps = GInputState> = T & {
+    error: boolean;
+    errorText: string;
+    checkValidity: () => boolean;
+};
+
+export type GConstraintValidatorHandler = (input: FieldWithError<GInputState>) => string;
+export type GValidatorHandler<F extends IForm = IForm> = RegExp | ((input: FieldWithError<GInputState>, validityKey: keyof ValidityState | undefined, fields: F) => RegExp | boolean);
+export type GValidators<T extends IForm> = {
+    [key in keyof T]?: GValidator | GValidatorHandler<T>[];
+};
+export declare class GValidator {
+    readonly handlers: GValidatorHandler[];
+    constructor(baseValidator?: GValidator);
+    withRequiredMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withMaxLengthMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withMinLengthMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withPatternMismatchMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withBadInputMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withRangeUnderflowMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withRangeOverflowMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withTypeMismatchMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withStepMismatchMessage(message: string | GConstraintValidatorHandler): GValidator;
+    withCustomValidation(handler: GValidatorHandler): GValidator;
+    private __addConstraintValidationHandler;
+}
+
+export type ToRawDataSetter<T = GInputState['value']> = (field: GInputState) => T;
+export type RawData<T> = {
+    [key in keyof T]: string | number | boolean;
+};
+export type GFormState<T extends IForm<T>> = T & {
+    isValid: boolean;
+    isInvalid: boolean;
+    loading: boolean;
+    toRawData: () => RawData<T>;
+    toFormData: (options?: ToFormDataOptions<T>) => FormData;
+    toURLSearchParams: (options?: ToURLSearchParamsOptions<T>) => URLSearchParams;
+    setLoading: Dispatch<SetStateAction<boolean>>;
+    updateValidity: () => void;
+};
+
+type GElementProps = {
+    name: string;
+};
+export type GInputState<T extends string | number | boolean = string | number | boolean> = FieldWithError<BaseGenericFieldProps & {
+    checkValidity: () => boolean;
+    rows: number;
+    value: T;
+    required?: boolean;
+}>;
+type NonNativeHandlers = {
+    onChange: (e: {
+        target: {
+            value?: string;
+        };
+    } | ChangeEvent<unknown>) => void;
+};
+type GInputInitialProps = BaseGenericFieldProps & {
+    required?: boolean;
+} & ({
+    type?: 'text' | 'password' | 'email' | 'tel' | 'url' | 'search';
+    minLength?: number;
+    maxLength?: number;
+    pattern?: string;
+    defaultValue?: string;
+    element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+} | {
+    type: 'checkbox';
+    defaultChecked?: boolean;
+    element?: (input: GInputState<boolean>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+} | {
+    type: 'color';
+    defaultValue?: string;
+    element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+} | {
+    type: 'number' | 'range' | 'date' | 'time' | 'week';
+    defaultValue?: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    element?: (input: GInputState<number>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+} | {
+    type: 'file';
+    defaultValue?: string;
+    element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+} | {
+    type: 'select';
+    defaultValue?: string;
+    element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;
+});
+export declare const GInput: FC<GInputInitialProps>;
+
+export type GFormProps<T extends IForm> = Omit<HTMLAttributes<HTMLFormElement>, 'children' | 'onSubmit' | 'onChange'> & {
+    loader?: ReactNode;
+    stateRef?: MutableRefObject<GFormState<T> | undefined>;
+    onSubmit?: (state: GFormState<T>, e: FormEvent<HTMLFormElement>) => void;
+    children?: JSX.Element | JSX.Element[] | ((state: GFormState<T>) => JSX.Element | JSX.Element[]);
+    validators?: GValidators<T>;
+};
+/**
+ * build dynammic forms with validations.
+ *
+ * @example
+ * import { InputText } from "primereact/inputtext";
+ * import { Button } from 'primereact/button';
+ * import { GForm, GInput, IForm } from "gform-react";
+ *
+ * type SignInForm = IForm<{
+ *     email: GInputState<string>;
+ *     password: GInputState<string>;
+ * }>;
+ *
+ * const App: FC = () => {
+ *    return (
+ *        <div>
+ *            ...
+ *            <GForm className='some-class'>
+ *                <GInput formKey={'email'} required minLength={7}
+ *                        element={(input, props) =>  <div>
+ *                                                        <label htmlFor="email">Email</label>
+ *                                                        <InputText {...props} id="email" aria-describedby="email-help" className={input.error ? "p-invalid" : ''} />
+ *                                                        {input.error && <small id="email-help" className="p-error">{input.errorText}</small>}
+ *                                                    </div>}
+ *                        />
+  
+ *                <GInput formKey={'password'} required
+ *                        element={(input, props) =>  <div>
+ *                                                        <label htmlFor="password">Password</label>
+ *                                                        <InputText {...props} id="password" aria-describedby="password-help" className={input.error ? "p-invalid" : ''} />
+ *                                                        {input.error && <small id="password-help" className="p-error">{input.errorText}</small>}
+ *                                                    </div>}
+ *                />
+  
+ *                <Button label="Submit" aria-label="Submit" />
+ *            </GForm>
+ *        </div>
+ *    );
+ * };
+ *
+ * @param validators - for handling validations (optional).
+ * @param loader - a component to display while loading (optional).
+ */
+export declare const GForm: <T extends IForm>({ loader, stateRef, onSubmit, children, validators, ...rest }: GFormProps<T>) => JSX.Element;

package/dist/index.js

@@ -0,0 +1,2 @@
+!function(n,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"));else if("function"==typeof define&&define.amd)define(["react"],t);else{var e="object"==typeof exports?t(require("react")):t(n.React);for(var i in e)("object"==typeof exports?exports:n)[i]=e[i]}}(self,(n=>{return t={292:function(n,t,e){var i=this&&this.t||function(){return i=Object.assign||function(n){for(var t,e=1,i=arguments.length;e<i;e++)for(var r in t=arguments[e])Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n},i.apply(this,arguments)},r=this&&this.i||(Object.create?function(n,t,e,i){void 0===i&&(i=e);var r=Object.getOwnPropertyDescriptor(t,e);r&&!("get"in r?!t.u:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(n,i,r)}:function(n,t,e,i){void 0===i&&(i=e),n[i]=t[e]}),u=this&&this.o||(Object.create?function(n,t){Object.defineProperty(n,"default",{enumerable:!0,value:t})}:function(n,t){n.default=t}),o=this&&this.l||function(n){if(n&&n.u)return n;var t={};if(null!=n)for(var e in n)"default"!==e&&Object.prototype.hasOwnProperty.call(n,e)&&r(t,n,e);return u(t,n),t},a=this&&this.v||function(n,t){var e={};for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&t.indexOf(i)<0&&(e[i]=n[i]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(i=Object.getOwnPropertySymbols(n);r<i.length;r++)t.indexOf(i[r])<0&&Object.prototype.propertyIsEnumerable.call(n,i[r])&&(e[i[r]]=n[i[r]])}return e};Object.defineProperty(t,"u",{value:!0}),t.GForm=void 0;var c=o(e(244)),f=e(464),l=e(886),v=e(173);t.GForm=function(n){var t=n.loader,e=void 0===t?c.default.createElement("div",null,"loading"):t,r=n.stateRef,u=n.onSubmit,o=n.children,s=n.validators,d=a(n,["loader","stateRef","onSubmit","children","validators"]),h=(0,c.useRef)(null),b=(0,c.useMemo)((function(){return(0,l.buildFormInitialValues)("function"==typeof o?o({}):o)}),[]),j=(0,f.useForm)(b,s),O=j.fields,p=j.updateInputHandler,m=j.validateInputHandler,y=(0,c.useState)(!1),g=y[0],_=y[1],M=(0,c.useMemo)((function(){var n=(0,l.isFormValid)(O),t=i(i({},O),{isValid:n,isInvalid:!n,loading:g,toRawData:function(n){return(0,l.toRawData)(O,n)},toFormData:function(){return(0,l.toFormData)(h.current)},toURLSearchParams:l.toURLSearchParams,updateValidity:function(){var n;this.isValid=(null===(n=h.current)||void 0===n?void 0:n.checkValidity())||!1,this.isInvalid=!this.isValid},setLoading:_});return r&&(r.current=t),t}),[O]),I=(0,c.useMemo)((function(){return c.default.createElement("form",i({},d,{ref:h,onChange:function(n){return p(n.target.name,n)},onBlur:function(n){return m(O[n.target.name],n)},onInvalid:function(n){n.preventDefault(),m(O[n.target.name],n)},onSubmit:function(n){n.preventDefault(),null==u||u(M,n)}}),"function"==typeof o?o(M):o)}),[M]);return c.default.createElement(v.GFormContext.Provider,{value:j},g?e:I)}},173:(n,t,e)=>{Object.defineProperty(t,"u",{value:!0}),t.useGenericFormContext=t.GFormContext=void 0;var i=e(244);t.GFormContext=(0,i.createContext)({fields:{},updateInputHandler:function(){return null},validateInputHandler:function(){return null}}),t.useGenericFormContext=function(){return(0,i.useContext)(t.GFormContext)}},100:function(n,t,e){var i=this&&this.t||function(){return i=Object.assign||function(n){for(var t,e=1,i=arguments.length;e<i;e++)for(var r in t=arguments[e])Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n},i.apply(this,arguments)},r=this&&this.i||(Object.create?function(n,t,e,i){void 0===i&&(i=e);var r=Object.getOwnPropertyDescriptor(t,e);r&&!("get"in r?!t.u:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(n,i,r)}:function(n,t,e,i){void 0===i&&(i=e),n[i]=t[e]}),u=this&&this.o||(Object.create?function(n,t){Object.defineProperty(n,"default",{enumerable:!0,value:t})}:function(n,t){n.default=t}),o=this&&this.l||function(n){if(n&&n.u)return n;var t={};if(null!=n)for(var e in n)"default"!==e&&Object.prototype.hasOwnProperty.call(n,e)&&r(t,n,e);return u(t,n),t},a=this&&this.v||function(n,t){var e={};for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&t.indexOf(i)<0&&(e[i]=n[i]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(i=Object.getOwnPropertySymbols(n);r<i.length;r++)t.indexOf(i[r])<0&&Object.prototype.propertyIsEnumerable.call(n,i[r])&&(e[i[r]]=n[i[r]])}return e};Object.defineProperty(t,"u",{value:!0}),t.GInput=void 0;var c=o(e(244)),f=e(173);t.GInput=function(n){var t=n.formKey,e=n.element,r=n.type,u=void 0===r?"text":r,o=(n.validatorKey,a(n,["formKey","element","type","validatorKey"])),l=(0,f.useGenericFormContext)(),v=l.fields,s=l.updateInputHandler,d=v[t];return(0,c.useMemo)((function(){var n=i(i({},o),{type:u,name:t});return e?e(d,n,{onChange:function(n){s(t,n)}}):c.default.createElement("input",i({},n))}),[d.value,d.error,d.errorText])}},107:function(n,t,e){var i=this&&this.i||(Object.create?function(n,t,e,i){void 0===i&&(i=e);var r=Object.getOwnPropertyDescriptor(t,e);r&&!("get"in r?!t.u:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(n,i,r)}:function(n,t,e,i){void 0===i&&(i=e),n[i]=t[e]}),r=this&&this.h||function(n,t){for(var e in n)"default"===e||Object.prototype.hasOwnProperty.call(t,e)||i(t,n,e)};Object.defineProperty(t,"u",{value:!0}),r(e(100),t)},217:(n,t)=>{Object.defineProperty(t,"u",{value:!0})},886:function(n,t){var e=this&&this.t||function(){return e=Object.assign||function(n){for(var t,e=1,i=arguments.length;e<i;e++)for(var r in t=arguments[e])Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n},e.apply(this,arguments)};Object.defineProperty(t,"u",{value:!0}),t.toURLSearchParams=t.toFormData=t.toRawData=t.isFormValid=t.findValidityKey=t.buildFormInitialValues=t.isGFInput=void 0;var i={text:{value:""},file:{value:""},datepicker:{value:""},checkbox:{value:!1}};t.isGFInput=function(n){return Boolean(n.formKey)},t.buildFormInitialValues=function(n){void 0===n&&(n=[]);var t={};return Array.isArray(n)||(n=[n]),console.log("[buildFormInitialValues] -","building initial values for ",n),n.forEach((function(n){var u=r(n);u&&u.forEach((function(n){console.log("[buildFormInitialValues] -","building input","(".concat(n.formKey,")"),n),t[n.formKey]&&console.warn("[Duplicate Keys].\nfield with key '".concat(n.formKey,"' has already been defined."));var r=i[n.type||"text"]||i.text,u=n.defaultValue||r.value;t[n.formKey]=e(e(e({},r),n),{value:u}),delete t[n.formKey].element}))})),t};var r=function(n,t){var e,i;return void 0===t&&(t=[]),n?Array.isArray(n)?(n.forEach((function(n){return r(n,t)})),t):(null===(e=n.props)||void 0===e?void 0:e.formKey)?(console.log("[findInputs] -","input config found","(".concat(n.props.formKey,")")),t.push(n.props),t):r(null===(i=n.props)||void 0===i?void 0:i.children,t):t};t.findValidityKey=function(n){for(var t in n)if("valid"!==t&&n[t])return console.log("[findValidityKey] -","found validity key:",t),t},t.isFormValid=function(n){for(var t in n)if(n[t].error)return!1;return!0},t.toRawData=function(n,t){void 0===t&&(t=function(n){return n.value});var e={};for(var i in n)e[i]=t(n[i]);return e},t.toFormData=function(n,t){if(!n)return new FormData;if(t){var e,i=t.exclude,r=t.include;if(r)return e=new FormData,r.forEach((function(t){return e.set(t,n[t].value)})),e;if(i)return e=new FormData(n),i.forEach((function(n){return e.delete(n)})),e}return new FormData(n)},t.toURLSearchParams=function(n){var t=this;if(n){var e,i=n.exclude,r=n.include;return r?(e={},r.forEach((function(n){return e[n]=t[n].value}))):(e=this.toRawData(),null==i||i.forEach((function(n){return delete e[n]}))),new URLSearchParams(e)}return new URLSearchParams(this.toRawData())}},820:function(n,t,e){var i=this&&this.i||(Object.create?function(n,t,e,i){void 0===i&&(i=e);var r=Object.getOwnPropertyDescriptor(t,e);r&&!("get"in r?!t.u:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(n,i,r)}:function(n,t,e,i){void 0===i&&(i=e),n[i]=t[e]}),r=this&&this.h||function(n,t){for(var e in n)"default"===e||Object.prototype.hasOwnProperty.call(t,e)||i(t,n,e)};Object.defineProperty(t,"u",{value:!0}),r(e(292),t),r(e(217),t),r(e(929),t),r(e(107),t),r(e(351),t)},929:(n,t)=>{Object.defineProperty(t,"u",{value:!0})},464:function(n,t,e){var i=this&&this.t||function(){return i=Object.assign||function(n){for(var t,e=1,i=arguments.length;e<i;e++)for(var r in t=arguments[e])Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n},i.apply(this,arguments)};Object.defineProperty(t,"u",{value:!0}),t.useForm=void 0;var r=e(244),u=e(886),o=e(841);t.useForm=function(n,t){void 0===t&&(t={});var e=(0,r.useState)(n),a=e[0],c=e[1],f=function(n,t){if(n)if(n.checkValidity||(n.checkValidity=function(){return t.target.checkValidity()}),t.target instanceof HTMLInputElement||t.target instanceof HTMLTextAreaElement||t.target instanceof HTMLSelectElement){t.target.setCustomValidity("");var e=t.target.validity,i=(0,u.findValidityKey)(e);l(n,i),!i&&n.error&&t.target.setCustomValidity("GFCustomValidation")}else console.log("[validateInputHandler] -","the input '".concat(n.formKey,"' is not a native element\nevent:"),t),l(n,n.required&&!n.value?"valueMissing":void 0)},l=function(n,e){var r,u=t[n.validatorKey||n.formKey],f=u instanceof o.GValidator?u.handlers:u;console.log("[validateInput] -","validating input:",n.formKey,"(".concat(e||"custom",")")),s(n,f,e),c(i(i({},a),((r={})[n.formKey]=n,r)))},v=function(n,t){a[n].value=t},s=function(n,t,e){var i=function(){n.error=Boolean(e)};if(!t)return i();try{console.log("[_validateInput] -","validating input with handlers:",t),n.error=t.some((function(t,i){var r="function"==typeof t?t(n,e,a):t,u="boolean"==typeof r?r:!r.test(String(n.value));return console.log("[_validateInput] -","validation results for handler (".concat(i,"):\n"),t,"\n\nvalidator result:",r,"\nviolation:",u,"(".concat(u?"failed":"passed",")")),u})),n.error||(n.errorText="")}catch(n){i()}};return{fields:a,updateInputHandler:function(n,t){var e="checkbox"===a[n].type?t.target.checked:t.target.value;v(n,e),f(a[n],t)},validateInputHandler:f}}},841:(n,t)=>{Object.defineProperty(t,"u",{value:!0}),t.GValidator=void 0;var e=function(){function n(n){var t=(null==n?void 0:n.handlers)||[];this.handlers=(new Array).concat(t)}return n.prototype.withRequiredMessage=function(n){return this.j("valueMissing",n)},n.prototype.withMaxLengthMessage=function(n){return this.j("tooLong",n)},n.prototype.withMinLengthMessage=function(n){return this.j("tooShort",n)},n.prototype.withPatternMismatchMessage=function(n){return this.j("patternMismatch",n)},n.prototype.withBadInputMessage=function(n){return this.j("badInput",n)},n.prototype.withRangeUnderflowMessage=function(n){return this.j("rangeUnderflow",n)},n.prototype.withRangeOverflowMessage=function(n){return this.j("rangeOverflow",n)},n.prototype.withTypeMismatchMessage=function(n){return this.j("typeMismatch",n)},n.prototype.withStepMismatchMessage=function(n){return this.j("stepMismatch",n)},n.prototype.withCustomValidation=function(n){return this.handlers.push(n),this},n.prototype.j=function(n,t){return this.handlers.push((function(e,i){return i===n&&(e.errorText="string"==typeof t?t:t(e),!0)})),this},n}();t.GValidator=e},351:function(n,t,e){var i=this&&this.i||(Object.create?function(n,t,e,i){void 0===i&&(i=e);var r=Object.getOwnPropertyDescriptor(t,e);r&&!("get"in r?!t.u:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(n,i,r)}:function(n,t,e,i){void 0===i&&(i=e),n[i]=t[e]}),r=this&&this.h||function(n,t){for(var e in n)"default"===e||Object.prototype.hasOwnProperty.call(t,e)||i(t,n,e)};Object.defineProperty(t,"u",{value:!0}),r(e(841),t)},244:t=>{t.exports=n}},e={},function n(i){var r=e[i];if(void 0!==r)return r.exports;var u=e[i]={exports:{}};return t[i].call(u.exports,u,u.exports,n),u.exports}(820);var t,e}));
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","mappings":"CAAA,SAA2CA,EAAMC,GAChD,GAAsB,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,EAAQG,QAAQ,eAC7B,GAAqB,mBAAXC,QAAyBA,OAAOC,IAC9CD,OAAO,CAAC,SAAUJ,OACd,CACJ,IAAIM,EAAuB,iBAAZL,QAAuBD,EAAQG,QAAQ,UAAYH,EAAQD,EAAY,OACtF,IAAI,IAAIQ,KAAKD,GAAuB,iBAAZL,QAAuBA,QAAUF,GAAMQ,GAAKD,EAAEC,EACvE,CACA,CATD,CASGC,MAAOC,IACV,O,ktCCVA,gBAEA,SACA,SACA,SAyDaR,EAAAA,MAAQ,SAAkBS,GACnC,QAAAC,OAAAA,OAAM,IAAG,EAAAC,EAAAA,QAAAA,cAAAA,MAAAA,KAAAA,WAAkB,EAC3BC,EAAQ,WACRC,EAAQ,WACRC,EAAQ,WACRC,EAAU,aACPC,EAAI,IAN4B,0DAQ7BC,GAAU,IAAAC,QAAwB,MAClCC,GAAgB,IAAAC,UAAQ,WAAM,WAAAC,wBAA8C,mBAAbP,EAA0BA,EAAS,CAAC,GAAsBA,EAA3F,GAAsG,IACpIQ,GAAS,IAAAC,SAAQJ,EAAeJ,GAC9BS,EAAqDF,EAAM,OAAnDG,EAA6CH,EAAM,mBAA/BI,EAAyBJ,EAAM,qBAC7D,GAAwB,IAAAK,WAAS,GAAhCC,EAAO,KAAEC,EAAU,KAEpBC,GAAY,IAAAV,UAAQ,WACtB,IAAMW,GAAe,IAAAC,aAAYR,GAE3BM,EAAS,OACRN,GAAM,CACTS,QAASF,EACTG,WAAYH,EACZH,QAAO,EACPO,UAAW,SAACC,GAA6B,WAAAD,WAAUX,EAAQY,EAAlB,EACzCC,WAAY,WAAM,WAAAA,YAAWpB,EAAQqB,QAAnB,EAClBC,kBAAmBC,EAAAA,kBACnBC,eAAgB,W,MACZC,KAAKT,SAAyB,QAAf,EAAAhB,EAAQqB,eAAO,eAAEK,mBAAmB,EACnDD,KAAKR,WAAaQ,KAAKT,OAC3B,EACAJ,WAAU,IAKd,OAFIjB,IAAUA,EAAS0B,QAAUR,GAE1BA,CACX,GAAG,CAACN,IAEEoB,GAAO,IAAAxB,UAAQ,WAAM,2CAAUJ,EAAI,CAAE6B,IAAK5B,EAC5C6B,SAAU,SAACC,GAAoC,OAAAtB,EAAmBsB,EAAEC,OAAOC,KAAMF,EAAlC,EAC/CG,OAAQ,SAACH,GAAM,OAAArB,EAAqBF,EAAOuB,EAAEC,OAAOC,MAAOF,EAA5C,EACfI,UAAW,SAACJ,GACRA,EAAEK,iBACF1B,EAAqBF,EAAOuB,EAAEC,OAAOC,MAAOF,EAChD,EACAlC,SAAU,SAACkC,GACPA,EAAEK,iBACFvC,SAAAA,EAAWiB,EAAWiB,EAC1B,IACqB,mBAAbjC,EAA0BA,EAASgB,GAAahB,EAXjC,GAYlB,CAACgB,IAEV,OACInB,EAAAA,QAAAA,cAAC0C,EAAAA,aAAaC,SAAQ,CAACC,MAAOjC,GAEtBM,EAEIlB,EAEAkC,EAIpB,C,sGC3HA,aAMa5C,EAAAA,cAAe,IAAAwD,eACxB,CACIhC,OAAQ,CAAC,EACTC,mBAAoB,WAAM,aAC1BC,qBAAsB,WAAM,eAIvB1B,EAAAA,sBAAwB,WAAM,WAAAyD,YAA4BzD,EAAAA,aAA5B,C,ktCCd3C,gBACA,SAgEaA,EAAAA,OAAiC,SAACS,GAAE,IAAAiD,EAAO,UAAEC,EAAO,UAAEC,EAAAA,EAAAA,KAAAC,OAAI,IAAG,SAAM,EAAmB7C,GAAL,eAAS,IAAxD,8CACrC,GAAiC,IAAA8C,yBAA/BtC,EAAM,SAAEC,EAAkB,qBAC5BsC,EAAavC,EAAOkC,GAuB1B,OArBiB,IAAAtC,UAAQ,WACrB,IAAM4C,EAAS,EAAH,KACLhD,GAAI,CACP6C,KAAI,EACJZ,KAAMS,IAGV,OAAIC,EAMQA,EAAmGI,EAAYC,EAL1E,CACzClB,SAAU,SAACC,GACPtB,EAAmBiC,EAASX,EAChC,IAMJpC,EAAAA,QAAAA,cAAAA,QAAAA,EAAAA,CAAAA,EAAWqD,GAEnB,GAAG,CAACD,EAAWR,MAAOQ,EAAWE,MAAOF,EAAWG,WAGvD,C,gdCzFAC,EAAAA,EAAAA,KAAAA,E,4cCWA,IAAMC,EAA2E,CAC7EC,KAAM,CAAEd,MAAO,IACfe,KAAM,CAAEf,MAAO,IACfgB,WAAY,CACRhB,MAAO,IAEXiB,SAAU,CAAEjB,OAAO,IAGVvD,EAAAA,UAAY,SAACyE,GAAkF,OAAAC,QAAQD,EAAMf,QAAd,EAE/F1D,EAAAA,uBAAyB,SAAkB2E,QAAA,IAAAA,IAAAA,EAAAA,IACpD,IAAMC,EAAe,CAAC,EAkCtB,OAhCKC,MAAMC,QAAQH,KAAOA,EAAO,CAACA,IAG9BI,QAAQC,IAAI,6BAA8B,+BAAgCL,GAG9EA,EAAKM,SAAQ,SAAAC,GACT,IAAMC,EAAeC,EAAWF,GAE5BC,GACAA,EAAaF,SAAQ,SAAAI,GAEbN,QAAQC,IAAI,6BAA8B,iBAAkB,WAAIK,EAAO3B,QAAO,KAAI2B,GAGlFT,EAAaS,EAAO3B,UACpBqB,QAAQO,KAAK,6CAAsCD,EAAO3B,QAAO,gCAGrE,IAAM6B,EAAenB,EAAkBiB,EAAOxB,MAAQ,SAAWO,EAAkBC,KAC7EmB,EAAaH,EAAOI,cAAgBF,EAAahC,MAEvDqB,EAAaS,EAAO3B,SAAW,EAAH,OACrB6B,GACAF,GAAM,CACT9B,MAAOiC,WAGJZ,EAAaS,EAAO3B,SAASC,OACxC,GAER,IACOiB,CACX,EAEA,IAAMQ,EAAa,SAACtF,EAAoC4F,G,QACpD,YADoD,IAAAA,IAAAA,EAAAA,IAC/C5F,EAED+E,MAAMC,QAAQhF,IACdA,EAAKmF,SAAQ,SAAAtB,GAAW,OAAAyB,EAAWzB,EAAS+B,EAApB,IACjBA,IAGG,QAAV,EAAA5F,EAAK6F,aAAK,eAAEjC,UAERqB,QAAQC,IAAI,iBAAkB,qBAAsB,WAAIlF,EAAK6F,MAAMjC,QAAO,MAE9EgC,EAAME,KAAK9F,EAAK6F,OACTD,GAGJN,EAAqB,QAAV,EAAAtF,EAAK6F,aAAK,eAAE7E,SAAU4E,GAftBA,CAgBtB,EAEa1F,EAAAA,gBAAkB,SAAC6F,GAC5B,IAAK,IAAMC,KAAOD,EACd,GAAY,UAARC,GAAmBD,EAASC,GAI5B,OAFIf,QAAQC,IAAI,sBAAuB,sBAAuBc,GAEvDA,CAGnB,EAEa9F,EAAAA,YAAc,SAACwB,GACxB,IAAK,IAAMuE,KAAKvE,EACZ,GAAIA,EAAOuE,GAAG9B,MACV,OAAO,EAGf,OAAO,CACX,EAEajE,EAAAA,UAAY,SAAkBwB,EAAWY,QAAA,IAAAA,IAAAA,EAAAA,SAA2B4D,GAAU,OAAAA,EAAMzC,KAAN,GACvF,IAAM0C,EAAO,CAAC,EACd,IAAK,IAAMF,KAAKvE,EACZyE,EAAKF,GAAK3D,EAAOZ,EAAOuE,IAE5B,OAAOE,CACX,EAIajG,EAAAA,WAAa,SAAkB4C,EAA8BsD,GACtE,IAAKtD,EAAM,OAAO,IAAIuD,SAEtB,GAAID,EAAS,CACD,IACJE,EADIC,EAAqBH,EAAO,QAAnBI,EAAYJ,EAAO,QAGpC,GAAII,EAGA,OAFAF,EAAW,IAAID,SACfG,EAAQrB,SAAQ,SAAAa,GAAO,SAASS,IAAIT,EAAelD,EAAKkD,GAAevC,MAAhD,IAChB6C,EAEN,GAAIC,EAGL,OAFAD,EAAW,IAAID,SAASvD,GACxByD,EAAQpB,SAAQ,SAAAa,GAAO,SAASU,OAAOV,EAAhB,IAChBM,C,CAIf,OAAO,IAAID,SAASvD,EACxB,EAQA5C,EAAAA,kBAAA,SAAwEkG,GAAxE,WAEI,GAAIA,EAAS,CACT,IAAIO,EAEIJ,EAAqBH,EAAO,QAAnBI,EAAYJ,EAAO,QAUpC,OATII,GACAG,EAAO,CAAC,EACRH,EAAQrB,SAAQ,SAAAa,GAAO,OAACW,EAAKX,GAAOY,EAAKZ,GAAKvC,KAAvB,MAGvBkD,EAAO/D,KAAKP,YACZkE,SAAAA,EAASpB,SAAQ,SAAAa,GAAO,cAAOW,EAAKX,EAAZ,KAGrB,IAAIa,gBAAgBF,E,CAG/B,OAAO,IAAIE,gBAAgBjE,KAAKP,YACpC,C,gdC9JAgC,EAAAA,EAAAA,KAAAA,GACAA,EAAAA,EAAAA,KAAAA,GACAA,EAAAA,EAAAA,KAAAA,GACAA,EAAAA,EAAAA,KAAAA,GACAA,EAAAA,EAAAA,KAAAA,E,sWCJA,aAGA,SACA,SAIAnE,EAAAA,QAAA,SAAyCmB,EAAkBJ,QAAA,IAAAA,IAAAA,EAAAA,CAAAA,GACjD,OAAsB,IAAAY,UAASR,GAA9BK,EAAM,KAAEoF,EAAS,KAOlBlF,EAAuB,SAAC+C,EAAoB1B,GAC9C,GAAK0B,EAGL,GAFKA,EAAM9B,gBAAe8B,EAAM9B,cAAgB,WAAM,OAACI,EAAEC,OAA4BL,eAA/B,GAElDI,EAAEC,kBAAkB6D,kBAAoB9D,EAAEC,kBAAkB8D,qBAAuB/D,EAAEC,kBAAkB+D,kBAAmB,CAC1HhE,EAAEC,OAAOgE,kBAAkB,IAE3B,IAAMnB,EAAW9C,EAAEC,OAAO6C,SACpBoB,GAAc,IAAAC,iBAAgBrB,GAEpCsB,EAAc1C,EAAOwC,IAEhBA,GAAexC,EAAMR,OACtBlB,EAAEC,OAAOgE,kBAAkB,qB,MAI3BjC,QAAQC,IAAI,2BAA4B,qBAAcP,EAAMf,QAAO,qCAAqCX,GAI5GoE,EAAc1C,EAAOA,EAAM2C,WAAa3C,EAAMlB,MAAQ,oBAAiB8D,EAE/E,EAkBMF,EAAgB,SAAC1C,EAAoBwC,G,MACjCK,EAAiBvG,EAAY0D,EAAM8C,cAAgB9C,EAAMf,SACzD8D,EAAWF,aAA0BG,EAAAA,WAAaH,EAAeE,SAAWF,EAE9EvC,QAAQC,IAAI,oBAAqB,oBAAqBP,EAAMf,QAAS,WAAIuD,GAA4B,SAAQ,MAEjHS,EAAejD,EAAO+C,EAA+CP,GACrEL,EAAU,EAAD,KAAMpF,KAAM,MAAGiD,EAAMf,SAAUe,EAAK,IACjD,EAOMkD,EAAc,SAAC7B,EAAavC,GAChB/B,EAAOsE,GACfvC,MAAQA,CAClB,EAKMmE,EAAiB,SAACjD,EAAoB+C,EAAkCP,GAC1E,IAAMW,EAAW,WACbnD,EAAMR,MAAQS,QAAQuC,EAC1B,EAEA,IAAKO,EAAU,OAAOI,IAatB,IAEQ7C,QAAQC,IAAI,qBAAsB,kCAAmCwC,GAEzE/C,EAAMR,MAAQuD,EAASK,MAfV,SAACC,EAAwCC,GACtD,IAAMC,EAAqC,mBAArBF,EAAkCA,EAAiBrD,EAAOwC,EAAazF,GAAUsG,EACjG5F,EAA8B,kBAAX8F,EAAuBA,GAAUA,EAAOC,KAAKC,OAAOzD,EAAMlB,QAMnF,OAHIwB,QAAQC,IAAI,qBAAsB,0CAAmC+C,EAAK,QAAQD,EAAkB,wBAAyBE,EAAQ,eAAgB9F,EAAW,WAAIA,EAAY,SAAW,SAAQ,MAGhMA,CACX,IAOSuC,EAAMR,QAAOQ,EAAMP,UAAY,G,CAExC,MAAOnB,GAGH6E,G,CAER,EAEA,MAAO,CAAEpG,OAAM,EAAEC,mBAlEU,SAACqE,EAAa/C,GACrC,IAAMQ,EAA6B,aAArB/B,EAAOsE,GAAKjC,KAAuBd,EAAEC,OAA4BmF,QAAWpF,EAAEC,OAA4BO,MACxHoE,EAAY7B,EAAKvC,GACjB7B,EAAqBF,EAAOsE,GAAM/C,EACtC,EA8DqCrB,qBAAoB,EAC7D,C,0EC/GA,iBAGI,WAAa0G,GACT,IAAMC,GAAeD,aAAa,EAAbA,EAAeZ,WAAY,GAChD9E,KAAK8E,UAAW,IAAI3C,OAA2ByD,OAAOD,EAC1D,CAsDJ,OApDIE,EAAAA,UAAAA,oBAAA,SAAoBC,GAChB,OAAO9F,KAAK+F,EAAiC,eAAgBD,EACjE,EAEAD,EAAAA,UAAAA,qBAAA,SAAqBC,GACjB,OAAO9F,KAAK+F,EAAiC,UAAWD,EAC5D,EAEAD,EAAAA,UAAAA,qBAAA,SAAqBC,GACjB,OAAO9F,KAAK+F,EAAiC,WAAYD,EAC7D,EAEAD,EAAAA,UAAAA,2BAAA,SAA2BC,GACvB,OAAO9F,KAAK+F,EAAiC,kBAAmBD,EACpE,EAEAD,EAAAA,UAAAA,oBAAA,SAAoBC,GAChB,OAAO9F,KAAK+F,EAAiC,WAAYD,EAC7D,EAEAD,EAAAA,UAAAA,0BAAA,SAA0BC,GACtB,OAAO9F,KAAK+F,EAAiC,iBAAkBD,EACnE,EAEAD,EAAAA,UAAAA,yBAAA,SAAyBC,GACrB,OAAO9F,KAAK+F,EAAiC,gBAAiBD,EAClE,EAEAD,EAAAA,UAAAA,wBAAA,SAAwBC,GACpB,OAAO9F,KAAK+F,EAAiC,eAAgBD,EACjE,EAEAD,EAAAA,UAAAA,wBAAA,SAAwBC,GACpB,OAAO9F,KAAK+F,EAAiC,eAAgBD,EACjE,EAEAD,EAAAA,UAAAA,qBAAA,SAAqBG,GAEjB,OADAhG,KAAK8E,SAAS5B,KAAK8C,GACZhG,IACX,EAEQ6F,EAAAA,UAAAA,EAAR,SAAyCtB,EAAkCuB,GASvE,OARA9F,KAAK8E,SAAS5B,MAAK,SAACnB,EAAOqB,GACvB,OAAIA,IAAQmB,IACRxC,EAAMP,UAA+B,iBAAZsE,EAAuBA,EAAUA,EAAQ/D,IAC3D,EAGf,IAEO/B,IACX,EACJ,EA5DA,GAAa1C,EAAAA,WAAAA,C,gdCWbmE,EAAAA,EAAAA,KAAAA,E,UCbAlE,EAAOD,QAAUQ,C,GCCbmI,EAA2B,CAAC,EAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBxB,IAAjByB,EACH,OAAOA,EAAa9I,QAGrB,IAAIC,EAAS0I,EAAyBE,GAAY,CAGjD7I,QAAS,CAAC,GAOX,OAHA+I,EAAoBF,GAAUG,KAAK/I,EAAOD,QAASC,EAAQA,EAAOD,QAAS4I,GAGpE3I,EAAOD,OACf,CCnB0B4I,CAAoB,K,MDF1CD,C","sources":["webpack://gform-react/webpack/universalModuleDefinition","webpack://gform-react/./src/GForm.tsx","webpack://gform-react/./src/context.ts","webpack://gform-react/./src/fields/GInput.tsx","webpack://gform-react/./src/fields/index.ts","webpack://gform-react/./src/helpers.ts","webpack://gform-react/./src/index.ts","webpack://gform-react/./src/useForm.ts","webpack://gform-react/./src/validations/GValidator.ts","webpack://gform-react/./src/validations/index.ts","webpack://gform-react/external umd {\"root\":\"React\",\"commonjs2\":\"react\",\"commonjs\":\"react\",\"amd\":\"react\",\"umd\":\"react\"}","webpack://gform-react/webpack/bootstrap","webpack://gform-react/webpack/startup"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\"], factory);\n\telse {\n\t\tvar a = typeof exports === 'object' ? factory(require(\"react\")) : factory(root[\"React\"]);\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(self, (__WEBPACK_EXTERNAL_MODULE__244__) => {\nreturn ","import React, { ReactNode, useMemo, useState, MutableRefObject, HTMLAttributes, useRef, ChangeEvent, FormEvent } from \"react\";\r\n\r\nimport { useForm } from \"./useForm\";\r\nimport { buildFormInitialValues, toRawData, toFormData, isFormValid, toURLSearchParams } from \"./helpers\";\r\nimport { GFormContext } from \"./context\";\r\nimport { GFormState, ToRawDataSetter } from \"./state\";\r\nimport { GValidators } from \"./validations\";\r\nimport { IForm } from \"./form\";\r\n\r\nexport type GFormProps<T extends IForm> = Omit<HTMLAttributes<HTMLFormElement>, 'children' | 'onSubmit' | 'onChange'> & {\r\n    loader?: ReactNode;\r\n    stateRef?: MutableRefObject<GFormState<T> | undefined>;\r\n    onChange?: (state: GFormState<T>, e: FormEvent<HTMLFormElement>) => void;\r\n    onSubmit?: (state: GFormState<T>, e: FormEvent<HTMLFormElement>) => void;\r\n    children?: JSX.Element | JSX.Element[] | ((state: GFormState<T>) => JSX.Element | JSX.Element[]);\r\n    validators?: GValidators<T>;\r\n};\r\n\r\n/**\r\n * build dynammic forms with validations.\r\n *\r\n * @example\r\n * import { InputText } from \"primereact/inputtext\";\r\n * import { Button } from 'primereact/button';\r\n * import { GForm, GInput, IForm } from \"gform-react\";\r\n * \r\n * type SignInForm = IForm<{\r\n *     email: GInputState<string>;\r\n *     password: GInputState<string>;\r\n * }>;\r\n *\r\n * const App: FC = () => {\r\n *    return (\r\n *        <div>\r\n *            ...\r\n *            <GForm className='some-class'>\r\n *                <GInput formKey={'email'} required minLength={7}\r\n *                        element={(input, props) =>  <div>\r\n *                                                        <label htmlFor=\"email\">Email</label>\r\n *                                                        <InputText {...props} id=\"email\" aria-describedby=\"email-help\" className={input.error ? \"p-invalid\" : ''} />\r\n *                                                        {input.error && <small id=\"email-help\" className=\"p-error\">{input.errorText}</small>}\r\n *                                                    </div>}\r\n *                        />\r\n  \r\n *                <GInput formKey={'password'} required \r\n *                        element={(input, props) =>  <div>\r\n *                                                        <label htmlFor=\"password\">Password</label>\r\n *                                                        <InputText {...props} id=\"password\" aria-describedby=\"password-help\" className={input.error ? \"p-invalid\" : ''} />\r\n *                                                        {input.error && <small id=\"password-help\" className=\"p-error\">{input.errorText}</small>}\r\n *                                                    </div>}\r\n *                />\r\n  \r\n *                <Button label=\"Submit\" aria-label=\"Submit\" />\r\n *            </GForm>\r\n *        </div>\r\n *    );\r\n * };\r\n *\r\n * @param validators - for handling validations (optional).\r\n * @param loader - a component to display while loading (optional).\r\n */\r\nexport const GForm = <T extends IForm>({\r\n    loader = <div>loading</div>,\r\n    stateRef,\r\n    onSubmit,\r\n    children,\r\n    validators,\r\n    ...rest\r\n}: GFormProps<T>): JSX.Element => {\r\n    const formRef = useRef<HTMLFormElement>(null);\r\n    const initialValues = useMemo(() => buildFormInitialValues<T>(typeof children === 'function' ? children({} as GFormState<T>) : children), []);\r\n    const values = useForm(initialValues, validators);\r\n    const { fields, updateInputHandler, validateInputHandler } = values;\r\n    const [loading, setLoading] = useState(false);\r\n\r\n    const formState = useMemo(() => {\r\n        const _isFormValid = isFormValid(fields);\r\n\r\n        const formState: GFormState<T> = {\r\n            ...fields,\r\n            isValid: _isFormValid,\r\n            isInvalid: !_isFormValid,\r\n            loading,\r\n            toRawData: (setter?: ToRawDataSetter) => toRawData(fields, setter),\r\n            toFormData: () => toFormData(formRef.current),\r\n            toURLSearchParams: toURLSearchParams,\r\n            updateValidity: function () { // it has to be function in order to refer to 'this'\r\n                this.isValid = formRef.current?.checkValidity() || false;\r\n                this.isInvalid = !this.isValid;\r\n            },\r\n            setLoading\r\n        };\r\n\r\n        if (stateRef) stateRef.current = formState;\r\n\r\n        return formState;\r\n    }, [fields]);\r\n\r\n    const form = useMemo(() => <form {...rest} ref={formRef}\r\n        onChange={(e: ChangeEvent<HTMLFormElement>) => updateInputHandler(e.target.name, e)}\r\n        onBlur={(e) => validateInputHandler(fields[e.target.name], e)}\r\n        onInvalid={(e: ChangeEvent<HTMLFormElement>) => {\r\n            e.preventDefault(); // hide default browser validation tooltip\r\n            validateInputHandler(fields[e.target.name], e);\r\n        }}\r\n        onSubmit={(e) => {\r\n            e.preventDefault();\r\n            onSubmit?.(formState, e);\r\n        }}>\r\n        {typeof children === 'function' ? children(formState) : children}\r\n    </form>, [formState]);\r\n\r\n    return (\r\n        <GFormContext.Provider value={values}>\r\n            {\r\n                loading\r\n                    ?\r\n                    loader\r\n                    :\r\n                    form\r\n            }\r\n        </GFormContext.Provider>\r\n    );\r\n};","import {createContext, useContext} from \"react\";\r\nimport { IForm } from \"./form\";\r\nimport { useForm } from \"./useForm\";\r\n\r\nexport type GContext<T> = ReturnType<T & typeof useForm>;\r\n\r\nexport const GFormContext = createContext<GContext<IForm>>(\r\n    {\r\n        fields: {},\r\n        updateInputHandler: () => null,\r\n        validateInputHandler: () => null\r\n    }\r\n);\r\n\r\nexport const useGenericFormContext = () => useContext<GContext<IForm>>(GFormContext);","import React, { ChangeEvent, FC, useMemo } from 'react';\r\nimport { useGenericFormContext } from \"../context\";\r\nimport { BaseGenericFieldProps, FieldWithError } from \".\";\r\n\r\ntype GElementProps = {\r\n    name: string;\r\n};\r\n\r\nexport type GInputState<T extends string | number | boolean = string | number | boolean> = FieldWithError<BaseGenericFieldProps & {\r\n    checkValidity: () => boolean;\r\n    rows: number;\r\n    value: T;\r\n    required?: boolean;\r\n}>;\r\n\r\ntype NonNativeHandlers = {\r\n    onChange: (e: {target: {value?: string;}} | ChangeEvent<unknown>) => void;\r\n};\r\n\r\nexport type GInputInitialProps = BaseGenericFieldProps & {\r\n    required?: boolean;\r\n} & (\r\n        {\r\n            type?: 'text' | 'password' | 'email' | 'tel' | 'url' | 'search';\r\n            minLength?: number;\r\n            maxLength?: number;\r\n            pattern?: string;\r\n            defaultValue?: string;\r\n            element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n        |\r\n        {\r\n            type: 'checkbox';\r\n            defaultChecked?: boolean;\r\n            element?: (input: GInputState<boolean>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n        |\r\n        {\r\n            type: 'color';\r\n            defaultValue?: string;\r\n            element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n        |\r\n        {\r\n            type: 'number' | 'range' | 'date' | 'time' | 'week';\r\n            defaultValue?: number;\r\n            min?: number;\r\n            max?: number;\r\n            step?: number;\r\n            element?: (input: GInputState<number>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n        |\r\n        {\r\n            type: 'file';\r\n            defaultValue?: string;\r\n            element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n        |\r\n        {\r\n            type: 'select';\r\n            defaultValue?: string;\r\n            element?: (input: GInputState<string>, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element;\r\n        }\r\n    );\r\n\r\nexport const GInput: FC<GInputInitialProps> = ({ formKey, element, type = 'text', validatorKey, ...rest }) => {\r\n    const { fields, updateInputHandler } = useGenericFormContext();\r\n    const inputState = fields[formKey];\r\n\r\n    const _element = useMemo(() => {\r\n        const _props = {\r\n            ...rest,\r\n            type,\r\n            name: formKey\r\n        };\r\n\r\n        if (element) {\r\n            const nonNativeHandlers: NonNativeHandlers = {\r\n                onChange: (e) => {\r\n                    updateInputHandler(formKey, e);\r\n                }\r\n            };\r\n            return (element as (input: GInputState, props: GElementProps, handlers: NonNativeHandlers) => JSX.Element)(inputState, _props, nonNativeHandlers);\r\n        }\r\n\r\n        return (\r\n            <input {..._props} />\r\n        );\r\n    }, [inputState.value, inputState.error, inputState.errorText]);\r\n\r\n    return _element;\r\n};","import { GInputState } from \"./GInput\";\r\n\r\nexport * from './GInput';\r\n\r\nexport type BaseGenericFieldProps = {\r\n    formKey: string;\r\n    validatorKey?: string;\r\n    type?: 'text' | 'password' | 'email' | 'tel' | 'checkbox' | 'number' | 'range' | 'color' | 'file' | 'date' | 'month' | 'week' | 'time' | 'search' | 'select';\r\n};\r\n\r\nexport type FieldWithError<T extends BaseGenericFieldProps = GInputState> = T & {\r\n    error: boolean;\r\n    errorText: string;\r\n    checkValidity: () => boolean;\r\n};","import { BaseGenericFieldProps, GInputInitialProps, GInputState } from './fields';\r\nimport { IForm } from './form';\r\nimport { GFormState, RawData, ToRawDataSetter } from './state';\r\n\r\n/* =======================================================\r\n * reminder: `$DEF_DEBUG` blocks are excluded from bundle!\r\n * =====================================================*/\r\n\r\ntype GInputInitialPropsWithValue = GInputInitialProps & {\r\n    value?: string | number | boolean;\r\n    defaultValue?: string | number | boolean;\r\n};\r\n\r\nconst defaultFieldProps: { [key: string]: {value: string | number | boolean} } = {\r\n    text: { value: '' },\r\n    file: { value: '' },\r\n    datepicker: {\r\n        value: '',\r\n    },\r\n    checkbox: { value: false }\r\n};\r\n\r\nexport const isGFInput = (input: BaseGenericFieldProps): input is GInputState<string | number | boolean> => Boolean(input.formKey);\r\n\r\nexport const buildFormInitialValues = <T extends IForm>(rows: JSX.Element | JSX.Element[] = []): T => {\r\n    const fieldsSchema = {} as { [key: string]: Omit<GInputInitialPropsWithValue, 'formKey'> };\r\n\r\n    if (!Array.isArray(rows)) rows = [rows];\r\n\r\n    if ($DEF_DEBUG) {\r\n        console.log('[buildFormInitialValues] -', 'building initial values for ', rows);\r\n    }\r\n\r\n    rows.forEach(row => {\r\n        const inputConfigs = findInputs(row);\r\n\r\n        if (inputConfigs) {\r\n            inputConfigs.forEach(config => {\r\n                if ($DEF_DEBUG) {\r\n                    console.log('[buildFormInitialValues] -', 'building input', `(${config.formKey})`,config);\r\n                }\r\n\r\n                if (fieldsSchema[config.formKey]) {\r\n                    console.warn(`[Duplicate Keys].\\nfield with key '${config.formKey}' has already been defined.`);\r\n                }\r\n\r\n                const defaultProps = defaultFieldProps[config.type || 'text'] || defaultFieldProps.text;\r\n                const inputValue = config.defaultValue || defaultProps.value;\r\n\r\n                fieldsSchema[config.formKey] = {\r\n                    ...defaultProps,\r\n                    ...config,\r\n                    value: inputValue\r\n                };\r\n\r\n                delete fieldsSchema[config.formKey].element;\r\n            });\r\n        }\r\n    });\r\n    return fieldsSchema as T;\r\n};\r\n\r\nconst findInputs = (root?: JSX.Element | JSX.Element[], total: GInputInitialPropsWithValue[] = []): GInputInitialPropsWithValue[] => {\r\n    if (!root) return total;\r\n\r\n    if (Array.isArray(root)) {\r\n        root.forEach(element => findInputs(element, total));\r\n        return total;\r\n    }\r\n\r\n    if (root.props?.formKey) {\r\n        if ($DEF_DEBUG) {\r\n            console.log('[findInputs] -', 'input config found', `(${root.props.formKey})`);\r\n        }\r\n        total.push(root.props);\r\n        return total;\r\n    }\r\n\r\n    return findInputs(root.props?.children, total);\r\n};\r\n\r\nexport const findValidityKey = (validity: ValidityState): keyof ValidityState | undefined => {\r\n    for (const key in validity) {\r\n        if (key !== 'valid' && validity[key as keyof ValidityState]) {\r\n            if ($DEF_DEBUG) {\r\n                console.log('[findValidityKey] -', 'found validity key:', key);\r\n            }\r\n            return key as keyof ValidityState;\r\n        }\r\n    }\r\n};\r\n\r\nexport const isFormValid = (fields: IForm): boolean => {\r\n    for (const f in fields) {\r\n        if (fields[f].error) {\r\n            return false;\r\n        }\r\n    }\r\n    return true;\r\n};\r\n\r\nexport const toRawData = <T extends IForm>(fields: T, setter: ToRawDataSetter = (field) => field.value): RawData<T> => {\r\n    const data = {} as RawData<T>;\r\n    for (const f in fields) {\r\n        data[f] = setter(fields[f]);\r\n    }\r\n    return data;\r\n};\r\n\r\nexport type ToFormDataOptions<T extends IForm> = ToURLSearchParamsOptions<T>;\r\n\r\nexport const toFormData = <T extends IForm>(form: HTMLFormElement | null, options?: ToFormDataOptions<T>): FormData => {\r\n    if (!form) return new FormData();\r\n\r\n    if (options) {\r\n        const { exclude, include } = options;\r\n        let formData: FormData;\r\n\r\n        if (include) {\r\n            formData = new FormData();\r\n            include.forEach(key => formData.set(key as string, form[key as string].value));\r\n            return formData;\r\n        }\r\n        else if (exclude) {\r\n            formData = new FormData(form);\r\n            exclude.forEach(key => formData.delete(key as string));\r\n            return formData;\r\n        }\r\n    }\r\n\r\n    return new FormData(form);\r\n};\r\n\r\n\r\nexport type ToURLSearchParamsOptions<T extends IForm> = {\r\n    exclude?: (keyof T)[];\r\n    include?: (keyof T)[];\r\n};\r\n\r\nexport function toURLSearchParams<T extends IForm>(this: GFormState<T>, options?: ToURLSearchParamsOptions<T>): URLSearchParams {\r\n\r\n    if (options) {\r\n        let data: RawData<T>;\r\n\r\n        const { exclude, include } = options;\r\n        if (include) {\r\n            data = {} as RawData<T>;\r\n            include.forEach(key => (data[key] = this[key].value));\r\n        }\r\n        else {\r\n            data = this.toRawData();\r\n            exclude?.forEach(key => delete data[key]);\r\n        }\r\n\r\n        return new URLSearchParams(data as Record<string, string>);\r\n    } \r\n\r\n    return new URLSearchParams(this.toRawData() as Record<string, string>); // this is ok because URLSearchParams will stringify the values (boolean/number)\r\n}","export * from './GForm';\r\nexport * from './form';\r\nexport * from './state';\r\nexport * from './fields';\r\nexport * from './validations';","import { useState } from \"react\";\r\n\r\nimport { GInputState } from \"./fields\";\r\nimport { findValidityKey } from \"./helpers\";\r\nimport { GValidator } from \"./validations/GValidator\";\r\nimport { GValidatorHandler, GValidators } from \"./validations\";\r\nimport { BaseFormEvent, IForm, GFormChangeEvent, GFormEvent } from \"./form\";\r\n\r\nexport function useForm<T extends IForm>(initialValues: T, validators: GValidators<T> = {}) {\r\n    const [fields, setFields] = useState(initialValues);\r\n\r\n    /**\r\n     * handler for validating a form input\r\n     * @param input the input to be validated\r\n     * @param e the event object\r\n     */\r\n    const validateInputHandler = (input: GInputState, e: GFormEvent | BaseFormEvent): void => {\r\n        if (!input) return;\r\n        if (!input.checkValidity) input.checkValidity = () => (e.target as HTMLInputElement).checkValidity();\r\n\r\n        if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLSelectElement) {\r\n            e.target.setCustomValidity(''); //reset any previous error (custom)\r\n\r\n            const validity = e.target.validity;\r\n            const validityKey = findValidityKey(validity);\r\n\r\n            validateInput(input, validityKey);\r\n\r\n            if (!validityKey && input.error) {\r\n                e.target.setCustomValidity('GFCustomValidation');\r\n            }\r\n        } else {\r\n            if ($DEF_DEBUG) {\r\n                console.log('[validateInputHandler] -', `the input '${input.formKey}' is not a native element\\nevent:`, e);\r\n            }\r\n            //fallback - validate the input for 'required' constraint validation (valueMissing)\r\n            //TODO - add the rest of constraint validations\r\n            validateInput(input, input.required && !input.value ? 'valueMissing' : undefined);\r\n        }\r\n    };\r\n\r\n    /**\r\n     * handler for updating and validating a form input\r\n     * @param key the key used to identify the input (`formKey`)\r\n     * @param e the event object\r\n     */\r\n    const updateInputHandler = (key: string, e: GFormChangeEvent | GFormEvent | BaseFormEvent): void => {\r\n        const value = fields[key].type === 'checkbox' ? (e.target as HTMLInputElement).checked : (e.target as HTMLInputElement).value;\r\n        updateInput(key, value);\r\n        validateInputHandler(fields[key], e);\r\n    };\r\n\r\n    /**\r\n     * Validates the input and updates the state with the result\r\n     * @param input the input to be validated\r\n     * @param validityKey the `Constraint Validation` key\r\n     */\r\n    const validateInput = (input: GInputState, validityKey?: keyof ValidityState): void => {\r\n        const inputValidator = validators[(input.validatorKey || input.formKey)];\r\n        const handlers = inputValidator instanceof GValidator ? inputValidator.handlers : inputValidator;\r\n        if ($DEF_DEBUG) {\r\n            console.log('[validateInput] -', 'validating input:', input.formKey, `(${validityKey ? validityKey : 'custom'})`);\r\n        }\r\n        _validateInput(input, handlers as Required<GValidatorHandler<T>[]> , validityKey);\r\n        setFields({ ...fields, [input.formKey]: input });\r\n    };\r\n\r\n    /**\r\n     * update the input state.\r\n     * @param key the key used to identify the input (`formKey`)\r\n     * @param value the new value\r\n     */\r\n    const updateInput = (key: string, value: GInputState['value']) => {\r\n        const input = fields[key];\r\n        input.value = value;\r\n    };\r\n\r\n    /**\r\n     * @internal\r\n     */\r\n    const _validateInput = (input: GInputState, handlers: GValidatorHandler<T>[], validityKey?: keyof ValidityState): void => {\r\n        const fallback = () => {\r\n            input.error = Boolean(validityKey);\r\n        };\r\n\r\n        if (!handlers) return fallback();\r\n\r\n        const validate = (validatorHandler: GValidatorHandler<T>, index: number): boolean => {\r\n            const result = typeof validatorHandler === 'function' ? validatorHandler(input, validityKey, fields) : validatorHandler;\r\n            const isInvalid = typeof result === 'boolean' ? result : !result.test(String(input.value));\r\n\r\n            if ($DEF_DEBUG) {\r\n                console.log('[_validateInput] -', `validation results for handler (${index}):\\n`, validatorHandler, '\\n\\nvalidator result:', result, '\\nviolation:', isInvalid, `(${isInvalid ? 'failed' : 'passed'})`);\r\n            }\r\n\r\n            return isInvalid;\r\n        };\r\n\r\n        try {\r\n            if ($DEF_DEBUG) {\r\n                console.log('[_validateInput] -', 'validating input with handlers:', handlers);\r\n            }\r\n            input.error = handlers.some(validate);\r\n            if (!input.error) input.errorText = '';\r\n        }\r\n        catch (e) {\r\n            if (process.env.NODE_ENV !== 'production')\r\n                console.warn(`DEV only: cannot validate input with key '${input.formKey}'\\nfalling back with basic input validation.\\nreason:\\n`, e);\r\n            fallback();\r\n        }\r\n    };\r\n\r\n    return { fields, updateInputHandler, validateInputHandler };\r\n}","import type { GConstraintValidatorHandler, GValidatorHandler } from \".\";\r\n\r\nexport class GValidator {\r\n    public readonly handlers: GValidatorHandler[];\r\n\r\n    constructor (baseValidator?: GValidator) {\r\n        const baseHandlers = baseValidator?.handlers || [];\r\n        this.handlers = new Array<GValidatorHandler>().concat(baseHandlers);\r\n    }\r\n\r\n    withRequiredMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('valueMissing', message);\r\n    }\r\n\r\n    withMaxLengthMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('tooLong', message);\r\n    }\r\n\r\n    withMinLengthMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('tooShort', message);\r\n    }\r\n\r\n    withPatternMismatchMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('patternMismatch', message);\r\n    }\r\n\r\n    withBadInputMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('badInput', message);\r\n    }\r\n\r\n    withRangeUnderflowMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('rangeUnderflow', message);\r\n    }\r\n\r\n    withRangeOverflowMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('rangeOverflow', message);\r\n    }\r\n\r\n    withTypeMismatchMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('typeMismatch', message);\r\n    }\r\n\r\n    withStepMismatchMessage(message: string | GConstraintValidatorHandler): GValidator {\r\n        return this.__addConstraintValidationHandler('stepMismatch', message);\r\n    }\r\n\r\n    withCustomValidation(handler: GValidatorHandler): GValidator {\r\n        this.handlers.push(handler);\r\n        return this;\r\n    }\r\n\r\n    private __addConstraintValidationHandler(validityKey: keyof ValidityState, message: string | GConstraintValidatorHandler): GValidator {\r\n        this.handlers.push((input, key) => {\r\n            if (key === validityKey) {\r\n                input.errorText = typeof message === 'string' ? message : message(input);\r\n                return true;\r\n            }\r\n            return false;\r\n        });\r\n\r\n        return this;\r\n    }\r\n}","import { IForm } from \"..\";\r\nimport type { FieldWithError, GInputState } from \"../fields\";\r\nimport type { GValidator } from \"./GValidator\";\r\n\r\nexport type GConstraintValidatorHandler = (input: FieldWithError<GInputState>) => string;\r\n\r\nexport type GValidatorHandler<F extends IForm = IForm> = RegExp |\r\n    ((input: FieldWithError<GInputState>, validityKey: keyof ValidityState | undefined, fields: F) => RegExp | boolean);\r\n\r\nexport type GValidators<T extends IForm> = {\r\n    [key in keyof T]?: GValidator | GValidatorHandler<T>[];\r\n};\r\n\r\nexport * from './GValidator';","module.exports = __WEBPACK_EXTERNAL_MODULE__244__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(820);\n"],"names":["root","factory","exports","module","require","define","amd","a","i","self","__WEBPACK_EXTERNAL_MODULE__244__","_a","loader","react_1","stateRef","onSubmit","children","validators","rest","formRef","useRef","initialValues","useMemo","buildFormInitialValues","values","useForm","fields","updateInputHandler","validateInputHandler","useState","loading","setLoading","formState","_isFormValid","isFormValid","isValid","isInvalid","toRawData","setter","toFormData","current","toURLSearchParams","helpers_1","updateValidity","this","checkValidity","form","ref","onChange","e","target","name","onBlur","onInvalid","preventDefault","context_1","Provider","value","createContext","useContext","formKey","element","_b","type","useGenericFormContext","inputState","_props","error","errorText","__exportStar","defaultFieldProps","text","file","datepicker","checkbox","input","Boolean","rows","fieldsSchema","Array","isArray","console","log","forEach","row","inputConfigs","findInputs","config","warn","defaultProps","inputValue","defaultValue","total","props","push","validity","key","f","field","data","options","FormData","formData_1","exclude","include","set","delete","data_1","_this","URLSearchParams","setFields","HTMLInputElement","HTMLTextAreaElement","HTMLSelectElement","setCustomValidity","validityKey","findValidityKey","validateInput","required","undefined","inputValidator","validatorKey","handlers","GValidator_1","_validateInput","updateInput","fallback","some","validatorHandler","index","result","test","String","checked","baseValidator","baseHandlers","concat","GValidator","message","__addConstraintValidationHandler","handler","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","__webpack_modules__","call"],"sourceRoot":""}

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "gform-react",
+  "version": "1.0.0",
+  "description": "A generic form builder for react-based applications",
+  "author": "Tal Maman, Arkady Birko",
+  "license": "MIT",
+  "scripts": {
+    "dev": "webpack serve --env development --config webpack.dev.js --open",
+    "debug": "webpack serve --env development --env debug --config webpack.dev.js --open",
+    "strict": "webpack serve --env development --env debug --env strict --config webpack.dev.js --open",
+    "build": "webpack --config webpack.prod.js",
+    "build:prod": "npm run tscheck && npm run lint && npm run security:check && npm run build",
+    "tscheck": "tsc --noEmit",
+    "security:check": "npm audit --production --audit-level high",
+    "lint": "eslint src --ext .ts --ext .tsx",
+    "lint:fix": "eslint src --ext .ts --ext .tsx --fix",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "main": "dist/index.js",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist/"
+  ],
+  "peerDependencies": {
+    "react": ">=16.7.0",
+    "react-dom": ">=16.7.0"
+  },
+  "devDependencies": {
+    "webpack": "5.75.0",
+    "webpack-bundle-analyzer": "^4.7.0",
+    "webpack-cli": "5.0.1",
+    "webpack-dev-server": "4.11.1",
+    "webpack-merge": "5.8.0",
+    "style-loader": "3.3.1",
+    "babel-loader": "9.1.2",
+    "css-loader": "6.7.3",
+    "ts-loader": "9.4.2",
+    "html-webpack-plugin": "5.5.0",
+    "terser-webpack-plugin": "5.3.1",
+    "@babel/core": "7.20.12",
+    "@babel/preset-env": "7.20.2",
+    "@babel/preset-react": "7.18.6",
+    "@babel/preset-typescript": "7.18.6",
+    "typescript": "4.9.5",
+    "@types/react": "18.0.26",
+    "@types/react-dom": "18.0.10",
+    "@typescript-eslint/eslint-plugin": "^5.18.0",
+    "@typescript-eslint/parser": "^5.18.0",
+    "eslint": "^8.12.0",
+    "primeicons": "^6.0.1",
+    "primereact": "^8.7.3",
+    "@mui/material": "^5.10.2",
+    "@emotion/react": "^11.10.0",
+    "@emotion/styled": "^11.10.0"
+  }
+}