@saas-ui/forms 0.1.8 → 0.2.2

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @saas-ui/forms
 
+## 0.2.2
+
+### Patch Changes
+
+- Set default value on FormProps generic type
+
+## 0.2.1
+
+### Patch Changes
+
+- 9673005: Improved typescript support and fixed issue with invalid states
+
+## 0.2.0
+
+### Minor Changes
+
+- Upgrade to Chakra UI 1.8.1
+
+### Patch Changes
+
+- Updated dependencies
+  - @saas-ui/input-right-button@0.2.0
+  - @saas-ui/number-input@0.2.0
+  - @saas-ui/pin-input@0.2.0
+  - @saas-ui/radio@0.2.0
+  - @saas-ui/select@0.2.0
+  - @saas-ui/button@0.2.0
+  - @saas-ui/password-input@0.2.0
+
+## 0.1.9
+
+### Patch Changes
+
+- Removed unused isOptional option
+
 ## 0.1.8
 
 ### Patch Changes

package/dist/auto-form.d.ts

@@ -1,10 +1,11 @@
+import { FieldValues } from 'react-hook-form';
 import { FormProps } from './form';
 interface AutoFormOptions {
     schema: any;
     submitLabel?: false | string;
 }
-export interface AutoFormProps extends Omit<FormProps, 'schema'>, AutoFormOptions {
+export interface AutoFormProps<TFieldValues extends FieldValues> extends Omit<FormProps<TFieldValues>, 'schema'>, AutoFormOptions {
 }
-export declare const AutoForm: import("@chakra-ui/react").ComponentWithAs<"form", AutoFormProps>;
+export declare const AutoForm: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").As<any>, AutoFormProps<FieldValues>>;
 export {};
 //# sourceMappingURL=auto-form.d.ts.map

package/dist/auto-form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auto-form.d.ts","sourceRoot":"","sources":["../src/auto-form.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAA;AAMxC,UAAU,eAAe;IACvB,MAAM,EAAE,GAAG,CAAA;IACX,WAAW,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;CAC7B;AAED,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,EAC/B,eAAe;CAAG;AAEtB,eAAO,MAAM,QAAQ,mEAWpB,CAAA"}
+{"version":3,"file":"auto-form.d.ts","sourceRoot":"","sources":["../src/auto-form.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAG7C,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAA;AAMxC,UAAU,eAAe;IACvB,MAAM,EAAE,GAAG,CAAA;IACX,WAAW,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;CAC7B;AAED,MAAM,WAAW,aAAa,CAAC,YAAY,SAAS,WAAW,CAC7D,SAAQ,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,QAAQ,CAAC,EAC7C,eAAe;CAAG;AAEtB,eAAO,MAAM,QAAQ,4GAepB,CAAA"}

package/dist/display-field.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { FormControlProps } from '@chakra-ui/react';
-import { FieldProps } from './Field';
+import { FieldProps } from './field';
 export interface DisplayFieldProps extends FormControlProps, Omit<FieldProps, 'type' | 'label'> {
 }
 export declare const DisplayField: React.FC<DisplayFieldProps>;

package/dist/{Field.d.ts → field.d.ts}

@@ -1,10 +1,13 @@
 import * as React from 'react';
+import { RegisterOptions, FieldValues, FieldPath } from 'react-hook-form';
 import { FormControlProps } from '@chakra-ui/react';
-export interface FieldProps extends Omit<FormControlProps, 'label'> {
+export declare type FieldRules = Pick<RegisterOptions, 'required' | 'min' | 'max' | 'maxLength' | 'minLength' | 'pattern'>;
+export declare type FieldTypes = 'text' | 'number' | 'password' | 'textarea' | 'select' | 'native-select' | 'checkbox' | 'radio' | 'switch' | 'pin' | string;
+export interface FieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Omit<FormControlProps, 'label' | 'type'> {
     /**
      * The field name
      */
-    name: string;
+    name: TName;
     /**
      * The field label
      */
@@ -20,7 +23,7 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
     /**
      * React hook form rules
      */
-    rules?: any;
+    rules?: Omit<RegisterOptions<TFieldValues, TName>, 'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'>;
     /**
      * Options used for selects and radio fields
      */
@@ -33,7 +36,7 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
      * - password
      * - textarea
      * - select
-     * - nativeselect
+     * - native-select
      * - checkbox
      * - radio
      * - switch
@@ -42,16 +45,16 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
      * Will default to a text field if there is no matching type.
      * @default 'text'
      */
-    type?: string;
+    type?: FieldTypes;
     /**
      * The input placeholder
      */
     placeholder?: string;
 }
 export declare const BaseField: React.FC<FieldProps>;
-export declare const Field: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const withControlledInput: (InputComponent: any) => import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").As<any>, object>;
-export declare const withUncontrolledInput: (InputComponent: any) => import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").As<any>, object>;
+export declare const Field: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const withControlledInput: (InputComponent: any) => import("@chakra-ui/react").ComponentWithAs<any, FieldProps<FieldValues, string>>;
+export declare const withUncontrolledInput: (InputComponent: any) => import("@chakra-ui/react").ComponentWithAs<any, FieldProps<FieldValues, string>>;
 export interface RegisterFieldTypeOptions {
     isControlled?: boolean;
     hideLabel?: boolean;
@@ -65,15 +68,15 @@ export interface RegisterFieldTypeOptions {
  * @param options.isControlled Set this to true if this is a controlled field.
  * @param options.hideLabel Hide the field label, for example for checkbox or switch field.
  */
-export declare const registerFieldType: (type: string, component: any, options?: RegisterFieldTypeOptions | undefined) => import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const InputField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const NumberInputField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const PasswordInputFIeld: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const TextareaField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const SwitchField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const SelectField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const CheckboxField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const RadioField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const PinField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-export declare const NativeSelectField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps>;
-//# sourceMappingURL=Field.d.ts.map
+export declare const registerFieldType: (type: string, component: React.FC<any>, options?: RegisterFieldTypeOptions | undefined) => import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const InputField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const NumberInputField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const PasswordInputFIeld: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const TextareaField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const SwitchField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const SelectField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const CheckboxField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const RadioField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const PinField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+export declare const NativeSelectField: import("@chakra-ui/react").ComponentWithAs<import("@chakra-ui/react").ComponentWithAs<"div", FormControlProps>, FieldProps<FieldValues, string>>;
+//# sourceMappingURL=field.d.ts.map

package/dist/field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../src/field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAKL,eAAe,EACf,WAAW,EAEX,SAAS,EAEV,MAAM,iBAAiB,CAAA;AAExB,OAAO,EAIL,gBAAgB,EASjB,MAAM,kBAAkB,CAAA;AAQzB,oBAAY,UAAU,GAAG,IAAI,CAC3B,eAAe,EACf,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CACnE,CAAA;AAED,oBAAY,UAAU,GAClB,MAAM,GACN,QAAQ,GACR,UAAU,GACV,UAAU,GACV,QAAQ,GACR,eAAe,GACf,UAAU,GACV,OAAO,GACP,QAAQ,GACR,KAAK,GACL,MAAM,CAAA;AAEV,MAAM,WAAW,UAAU,CACzB,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,CAC/D,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,MAAM,CAAC;IAChD;;OAEG;IACH,IAAI,EAAE,KAAK,CAAA;IACX;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,IAAI,CACV,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,EACpC,eAAe,GAAG,aAAa,GAAG,YAAY,GAAG,UAAU,CAC5D,CAAA;IACD;;OAEG;IACH,OAAO,CAAC,EAAE,GAAG,CAAA;IACb;;;;;;;;;;;;;;;;OAgBG;IACH,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAqBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAwB1C,CAAA;AAED,eAAO,MAAM,KAAK,kJAOjB,CAAA;AA4CD,eAAO,MAAM,mBAAmB,mBAAoB,GAAG,qFAqBtD,CAAA;AAED,eAAO,MAAM,qBAAqB,mBAAoB,GAAG,qFAgBxD,CAAA;AAED,MAAM,WAAW,wBAAwB;IACvC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;CAC1B;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,iBAAiB,SACtB,MAAM,aACD,MAAM,EAAE,CAAC,GAAG,CAAC,qMAsBzB,CAAA;AAID,eAAO,MAAM,UAAU,kJAAmC,CAAA;AAC1D,eAAO,MAAM,gBAAgB,kJAE3B,CAAA;AACF,eAAO,MAAM,kBAAkB,kJAA+C,CAAA;AAC9E,eAAO,MAAM,aAAa,kJAA0C,CAAA;AACpE,eAAO,MAAM,WAAW,kJAavB,CAAA;AACD,eAAO,MAAM,WAAW,kJAEtB,CAAA;AACF,eAAO,MAAM,aAAa,kJAYzB,CAAA;AACD,eAAO,MAAM,UAAU,kJAErB,CAAA;AACF,eAAO,MAAM,QAAQ,kJAEnB,CAAA;AACF,eAAO,MAAM,iBAAiB,kJAI7B,CAAA"}

package/dist/form.d.ts

@@ -1,16 +1,20 @@
 import * as React from 'react';
 import { HTMLChakraProps } from '@chakra-ui/react';
-import { FieldErrors } from 'react-hook-form';
+import { UseFormProps, FieldErrors, FieldValues } from 'react-hook-form';
 interface FormOptions {
     schema?: any;
     submitLabel?: false | string;
-}
-export interface FormProps extends HTMLChakraProps<'form'>, FormOptions {
-    defaultValues: Record<string, any>;
     onSubmit: (arg: any) => Promise<any> | void;
     onError?: (errors: FieldErrors) => void;
-    children?: React.ReactNode;
 }
-export declare const Form: import("@chakra-ui/react").ComponentWithAs<"form", FormProps>;
+export interface FormProps<TFieldValues extends FieldValues = FieldValues> extends UseFormProps<TFieldValues>, Omit<HTMLChakraProps<'form'>, 'onSubmit' | 'onError'>, FormOptions {
+}
+/**
+ * @todo Figure out how to pass down FieldValues to all Field components,
+ * if at all possible.
+ */
+export declare const Form: <TFieldValues extends FieldValues>(props: FormProps<TFieldValues> & {
+    ref?: React.ForwardedRef<HTMLFormElement> | undefined;
+}) => React.ReactElement;
 export {};
 //# sourceMappingURL=form.d.ts.map

package/dist/form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../src/form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAU,eAAe,EAAc,MAAM,kBAAkB,CAAA;AAEtE,OAAO,EAIL,WAAW,EACZ,MAAM,iBAAiB,CAAA;AAIxB,UAAU,WAAW;IACnB,MAAM,CAAC,EAAE,GAAG,CAAA;IACZ,WAAW,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;CAC7B;AAED,MAAM,WAAW,SAAU,SAAQ,eAAe,CAAC,MAAM,CAAC,EAAE,WAAW;IACrE,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAClC,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAA;IAC3C,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,eAAO,MAAM,IAAI,+DAuBhB,CAAA"}
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../src/form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAU,eAAe,EAAc,MAAM,kBAAkB,CAAA;AAEtE,OAAO,EAGL,YAAY,EACZ,WAAW,EACX,WAAW,EACZ,MAAM,iBAAiB,CAAA;AAIxB,UAAU,WAAW;IACnB,MAAM,CAAC,EAAE,GAAG,CAAA;IACZ,WAAW,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;IAC5B,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAA;IAC3C,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;CACxC;AAED,MAAM,WAAW,SAAS,CAAC,YAAY,SAAS,WAAW,GAAG,WAAW,CACvE,SAAQ,YAAY,CAAC,YAAY,CAAC,EAChC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC,EACrD,WAAW;CAAG;AAElB;;;GAGG;AACH,eAAO,MAAM,IAAI;;MAwDZ,MAAM,YAAY,CAAA"}

package/dist/index.js

@@ -1,2 +1,2 @@
-var e=require("react"),r=require("react-hook-form"),t=require("@chakra-ui/react"),n=require("@saas-ui/number-input"),a=require("@saas-ui/password-input"),l=require("@saas-ui/radio"),i=require("@saas-ui/pin-input"),o=require("@saas-ui/select"),u=require("yup"),s=require("@hookform/resolvers/yup"),c=require("@chakra-ui/system"),m=require("@chakra-ui/icons"),d=require("@saas-ui/button"),f=require("@chakra-ui/react-utils"),p=require("@saas-ui/input-right-button");function v(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,r}var x=/*#__PURE__*/v(e);function y(){return y=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},y.apply(this,arguments)}function h(e,r){if(null==e)return{};var t,n,a={},l=Object.keys(e);for(n=0;n<l.length;n++)r.indexOf(t=l[n])>=0||(a[t]=e[t]);return a}function b(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}var F=["name","label","placeholder"],E=["name","label","help","variant","hideLabel","children"],g=["label","isDisabled","isInvalid","isReadOnly","isRequired","isOptional","variant"],w=["name","rules"],C=["ref"],A=["name","rules"],R=["ref"],k=["label"],O=["label"],I={},S=function(e){var n=e.name,a=e.label,l=e.help,i=e.variant,o=e.hideLabel,u=e.children,s=h(e,E),c=function(e,t){return r.get(t.errors,e)}(n,r.useFormContext().formState);/*#__PURE__*/return x.createElement(t.FormControl,y({isInvalid:!!c,variant:i},s),a&&!o?/*#__PURE__*/x.createElement(t.FormLabel,{variant:i},a):null,/*#__PURE__*/x.createElement(t.Box,null,u,!l||null!=c&&c.message?null:/*#__PURE__*/x.createElement(t.FormHelperText,null,l),(null==c?void 0:c.message)&&/*#__PURE__*/x.createElement(t.FormErrorMessage,null,null==c?void 0:c.message)))},q=t.forwardRef(function(e,r){var t=e.type;/*#__PURE__*/return x.createElement(I[void 0===t?"text":t]||I.text,y({ref:r},e))}),j=function(e){return t.forwardRef(function(n,a){var l=n.name,i=n.rules,o=h(n,w),u=r.useFormContext();/*#__PURE__*/return x.createElement(r.Controller,{name:l,control:u.control,rules:i,render:function(r){var n=r.field,l=n.ref,i=h(n,C);/*#__PURE__*/return x.createElement(e,y({},i,o,{ref:t.useMergeRefs(a,l)}))}})})},L=function(e){return t.forwardRef(function(n,a){var l=n.name,i=n.rules,o=h(n,A),u=(0,r.useFormContext().register)(l,i),s=u.ref,c=h(u,R);/*#__PURE__*/return x.createElement(e,y({},c,o,{ref:t.useMergeRefs(a,s)}))})},P=function(e,r,n){var a=function(e,r){var n=r.displayName,a=r.hideLabel,l=r.BaseField,i=t.forwardRef(function(r,t){var n=r.label,i=r.isDisabled,o=r.isInvalid,u=r.isReadOnly,s=r.isRequired,c=r.isOptional,m=r.variant,d=h(r,g);/*#__PURE__*/return x.createElement(l,{label:n,hideLabel:a,isDiabled:i,isInvalid:o,isReadOnly:u,isRequired:s,isOptional:c,variant:m},/*#__PURE__*/x.createElement(e,y({ref:t,label:n},d)))});return i.displayName=n,i}(null!=n&&n.isControlled?j(r):L(r),{displayName:e.split("-").map(function(e){return e.charAt(0).toUpperCase()+e.slice(1)}).join("")+"Field",hideLabel:null==n?void 0:n.hideLabel,BaseField:(null==n?void 0:n.BaseField)||S});return I[e]=a,a},N=P("text",t.Input),B=P("number",n.NumberInput,{isControlled:!0}),V=P("password",a.PasswordInput),T=P("textarea",t.Textarea),D=P("switch",t.forwardRef(function(e,r){var n=e.label,a=h(e,k);/*#__PURE__*/return x.createElement(t.Switch,y({ref:r},a),n)}),{isControlled:!0,hideLabel:!0}),M=P("select",o.Select,{isControlled:!0}),_=P("checkbox",t.forwardRef(function(e,r){var n=e.label,a=h(e,O);/*#__PURE__*/return x.createElement(t.Checkbox,y({ref:r},a),n)}),{hideLabel:!0}),G=P("radio",l.RadioInput,{isControlled:!0}),U=P("pin",i.PinInput,{isControlled:!0}),z=P("native-select",o.NativeSelect,{isControlled:!0}),H=s.yupResolver,$=function(e){var r;if(null!=(r=e.spec.meta)&&r.type)return e.spec.meta.type;switch(e.type){case"array":return"array";case"object":return"object";case"number":return"number";case"date":return"date";default:return"text"}},J=function(e,r){for(var t,n=function(e,r){var t="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(t)return(t=t.call(e)).next.bind(t);if(Array.isArray(e)||(t=function(e,r){if(e){if("string"==typeof e)return b(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?b(e,r):void 0}}(e))){t&&(e=t);var n=0;return function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}(e.tests);!(t=n()).done;){var a,l=t.value;if(null!=(a=l.OPTIONS)&&a.params[r])return l.OPTIONS.params[r]}},K=function(e){var r,t=[];for(var n in r="array"===e.type?e.innerType.fields:e.fields){var a=r[n],l={};"array"===a.type&&(l.min=J(a,"min"),l.max=J(a,"max")),t.push(y({name:n,label:a.spec.label||n,type:$(a)},l))}return t},Q=["children"],W=function(e){/*#__PURE__*/return x.createElement(t.chakra.div,null,e.children)},X=function(e){var r,n,a,l=e.children,i=h(e,Q),o=y({},null!=(r=null==(n=t.useTheme().components)||null==(a=n.FormLayout)?void 0:a.defaultProps)?r:{spacing:4},i);/*#__PURE__*/return x.createElement(t.SimpleGrid,o,x.Children.map(l,function(e){return x.isValidElement(e)?/*#__PURE__*/x.createElement(W,null,e):e}))},Y=function(e,r){return x.Children.map(r,function(r){return x.isValidElement(r)&&r.props.name?x.cloneElement(r,y({},r.props,{name:e+"."+r.props.name})):r})},Z=f.createContext({name:"ArrayFieldContext"}),ee=Z[0],re=Z[1],te=f.createContext({name:"ArrayFieldRowContext"}),ne=te[0],ae=te[1],le=function(e){var t=e.name,n=e.defaultValue,a=void 0===n?{}:n,l=e.keyName,i=e.min,o=e.max,u=r.useFormContext();return y({},r.useFieldArray({control:u.control,name:t,keyName:l}),{name:t,defaultValue:a,min:i,max:o})},ie=function(e){var t=e.index,n=r.useFormContext().clearErrors,a=re(),l=a.name,i=a.remove,o=a.fields;return x.useEffect(function(){n(l)},[]),{index:t,isFirst:0===t,isLast:t===o.length-1,name:l+"."+t,remove:x.useCallback(function(){n(l),i(t)},[t])}},oe=function(){var e=ae(),r=e.isFirst,t=e.remove,n=re(),a=n.min;return{onClick:function(){return t()},isDisabled:r&&!!(a&&n.fields.length<=a)}},ue=function(){var e=re(),r=e.append,t=e.defaultValue,n=e.max;return{onClick:function(){return r(t,{shouldFocus:!1})},isDisabled:!!(n&&e.fields.length>=n)}},se=["children","columns","spacing"],ce=["children"],me=["name","defaultValue","keyName","min","max","children"],de=function(e){/*#__PURE__*/return x.createElement(pe,{index:e.index},/*#__PURE__*/x.createElement(fe,{columns:e.columns,spacing:e.spacing},e.children),/*#__PURE__*/x.createElement(ve,null))},fe=function(e){var r=e.children,t=e.columns,n=e.spacing,a=h(e,se),l=ae().name;/*#__PURE__*/return x.createElement(X,y({flex:"1",columns:t,gridGap:n,mr:"2"},a),Y(l,r))},pe=function(e){var r=e.children,t=ie({index:e.index});/*#__PURE__*/return x.createElement(ne,{value:t},/*#__PURE__*/x.createElement(c.chakra.div,{__css:{display:"flex",flexDirection:"row",alignItems:"flex-end",width:"100%",mb:4}},r))},ve=function(e){/*#__PURE__*/return x.createElement(d.IconButton,y({icon:/*#__PURE__*/x.createElement(m.MinusIcon,null),"aria-label":"Remove row"},oe(),e))},xe=function(e){/*#__PURE__*/return x.createElement(d.IconButton,y({icon:/*#__PURE__*/x.createElement(m.AddIcon,null),"aria-label":"Add row",float:"right"},ue(),e))},ye=function(e){var r=e.children,t=h(e,ce);/*#__PURE__*/return x.createElement(be,t,/*#__PURE__*/x.createElement(he,null,function(e){/*#__PURE__*/return x.createElement(x.Fragment,null,e.map(function(e,t){/*#__PURE__*/return x.createElement(de,{key:e.id,index:t},r)}))}),/*#__PURE__*/x.createElement(xe,null))},he=function(e){return(0,e.children)(re().fields)},be=function(e){var r=e.name,t=e.defaultValue,n=e.keyName,a=e.min,l=e.max,i=e.children,o=h(e,me),u=le({name:r,defaultValue:t,keyName:n,min:a,max:l});/*#__PURE__*/return x.createElement(ee,{value:u},/*#__PURE__*/x.createElement(S,y({name:r},o),i))},Fe=["name","children","columns","spacing"],Ee=function(e){var r=e.name,t=e.children,n=e.columns,a=e.spacing,l=h(e,Fe);/*#__PURE__*/return x.createElement(S,y({name:r},l),/*#__PURE__*/x.createElement(X,{columns:n,gridGap:a},Y(r,t)))},ge=["name","type"],we=["schema"],Ce=["name","type","defaultValue"],Ae=function(e,r){return K(function(e,r){return u.reach(e,r)}(e,r)).map(function(e){var r=e.name,t=e.type,n=h(e,ge);/*#__PURE__*/return x.createElement(q,y({key:r,name:r,type:t},n))})},Re=function(e){var r=e.schema,t=h(e,we);/*#__PURE__*/return x.createElement(X,t,K(r).map(function(e){var t=e.name,n=e.type,a=h(e,Ce);return"array"===n?/*#__PURE__*/x.createElement(ye,y({name:t},a),Ae(r,t)):"object"===n?/*#__PURE__*/x.createElement(Ee,y({name:t},a),Ae(r,t)):/*#__PURE__*/x.createElement(q,y({key:t,name:t,type:n},a))}))},ke=["schema","defaultValues","onSubmit","onError","children"],Oe=t.forwardRef(function(e,n){var a=e.schema,l=e.defaultValues,i=e.onSubmit,o=e.onError,u=e.children,s=h(e,ke),c={mode:"all",defaultValues:l};a&&(c.resolver=H(a));var m=r.useForm(c);/*#__PURE__*/return x.createElement(r.FormProvider,m,/*#__PURE__*/x.createElement(t.chakra.form,y({ref:n,onSubmit:(0,m.handleSubmit)(i,o)},s),u))}),Ie=["children"],Se=c.forwardRef(function(e,t){var n=e.children,a=h(e,Ie),l=r.useFormContext();/*#__PURE__*/return x.createElement(d.Button,y({type:"submit",isLoading:l.formState.isSubmitting,isPrimary:!0,ref:t},a),n)}),qe=["schema","submitLabel"],je=t.forwardRef(function(e,r){var t=e.schema,n=e.submitLabel,a=h(e,qe);/*#__PURE__*/return x.createElement(Oe,y({},a,{schema:t,ref:r}),/*#__PURE__*/x.createElement(X,null,/*#__PURE__*/x.createElement(Re,{schema:t}),n&&/*#__PURE__*/x.createElement(Se,{label:n})))});je.defaultProps={submitLabel:"Submit"},exports.ArrayField=ye,exports.ArrayFieldAddButton=xe,exports.ArrayFieldContainer=be,exports.ArrayFieldProvider=ee,exports.ArrayFieldRemoveButton=ve,exports.ArrayFieldRow=de,exports.ArrayFieldRowContainer=pe,exports.ArrayFieldRowFields=fe,exports.ArrayFieldRowProvider=ne,exports.ArrayFieldRows=he,exports.AutoForm=je,exports.BaseField=S,exports.CheckboxField=_,exports.DisplayField=function(e){var n=e.name,a=e.label,l=h(e,F),i=r.useFormContext().getValues;/*#__PURE__*/return x.createElement(t.FormControl,l,a?/*#__PURE__*/x.createElement(t.FormLabel,{htmlFor:n},a):null,/*#__PURE__*/x.createElement(t.Text,{fontSize:"md"},i(n)))},exports.Field=q,exports.Fields=Re,exports.Form=Oe,exports.FormLayout=X,exports.InputField=N,exports.NativeSelectField=z,exports.NumberInputField=B,exports.ObjectField=Ee,exports.PasswordInputFIeld=V,exports.PinField=U,exports.RadioField=G,exports.SelectField=M,exports.SubmitButton=Se,exports.SwitchField=D,exports.TextareaField=T,exports.registerFieldType=P,exports.useArrayField=le,exports.useArrayFieldAddButton=ue,exports.useArrayFieldContext=re,exports.useArrayFieldRemoveButton=oe,exports.useArrayFieldRow=ie,exports.useArrayFieldRowContext=ae,exports.withControlledInput=j,exports.withUncontrolledInput=L,Object.keys(p).forEach(function(e){"default"===e||exports.hasOwnProperty(e)||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return p[e]}})});
+var e=require("react"),r=require("react-hook-form"),t=require("@chakra-ui/react"),n=require("@saas-ui/number-input"),a=require("@saas-ui/password-input"),l=require("@saas-ui/radio"),i=require("@saas-ui/pin-input"),o=require("@saas-ui/select"),u=require("yup"),s=require("@hookform/resolvers/yup"),c=require("@chakra-ui/system"),d=require("@chakra-ui/icons"),m=require("@saas-ui/button"),f=require("@chakra-ui/react-utils"),p=require("@saas-ui/input-right-button");function v(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,r}var h=/*#__PURE__*/v(e);function y(){return y=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},y.apply(this,arguments)}function x(e,r){if(null==e)return{};var t,n,a={},l=Object.keys(e);for(n=0;n<l.length;n++)r.indexOf(t=l[n])>=0||(a[t]=e[t]);return a}function b(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}var E=["name","label","placeholder"],F=["name","label","help","variant","hideLabel","children"],g=["name","label","isDisabled","isInvalid","isReadOnly","isRequired","variant"],w=["name","rules"],C=["ref"],A=["name","rules"],R=["ref"],k=["label"],I=["label"],S={},O=function(e){var n=e.name,a=e.label,l=e.help,i=e.variant,o=e.hideLabel,u=e.children,s=x(e,F),c=function(e,t){return r.get(t.errors,e)}(n,r.useFormContext().formState);/*#__PURE__*/return h.createElement(t.FormControl,y({variant:i},s,{isInvalid:!!c}),a&&!o?/*#__PURE__*/h.createElement(t.FormLabel,{variant:i},a):null,/*#__PURE__*/h.createElement(t.Box,null,u,!l||null!=c&&c.message?null:/*#__PURE__*/h.createElement(t.FormHelperText,null,l),(null==c?void 0:c.message)&&/*#__PURE__*/h.createElement(t.FormErrorMessage,null,null==c?void 0:c.message)))},V=t.forwardRef(function(e,r){var t=e.type;/*#__PURE__*/return h.createElement(S[void 0===t?"text":t]||S.text,y({ref:r},e))}),q=function(e){return t.forwardRef(function(n,a){var l=n.name,i=n.rules,o=x(n,w),u=r.useFormContext();/*#__PURE__*/return h.createElement(r.Controller,{name:l,control:u.control,rules:i,render:function(r){var n=r.field,l=n.ref,i=x(n,C);/*#__PURE__*/return h.createElement(e,y({},i,o,{ref:t.useMergeRefs(a,l)}))}})})},j=function(e){return t.forwardRef(function(n,a){var l=n.name,i=n.rules,o=x(n,A),u=(0,r.useFormContext().register)(l,i),s=u.ref,c=x(u,R);/*#__PURE__*/return h.createElement(e,y({},c,o,{ref:t.useMergeRefs(a,s)}))})},L=function(e,r,n){var a=function(e,r){var n=r.displayName,a=r.hideLabel,l=r.BaseField,i=t.forwardRef(function(r,t){var n=r.name,i=r.label,o=r.isDisabled,u=r.isInvalid,s=r.isReadOnly,c=r.isRequired,d=r.variant,m=x(r,g);/*#__PURE__*/return h.createElement(l,{name:n,label:i,hideLabel:a,isDisabled:o,isInvalid:u,isReadOnly:s,isRequired:c,variant:d},/*#__PURE__*/h.createElement(e,y({ref:t,name:n,label:i},m)))});return i.displayName=n,i}(null!=n&&n.isControlled?q(r):j(r),{displayName:e.split("-").map(function(e){return e.charAt(0).toUpperCase()+e.slice(1)}).join("")+"Field",hideLabel:null==n?void 0:n.hideLabel,BaseField:(null==n?void 0:n.BaseField)||O});return S[e]=a,a},N=L("text",t.Input),P=L("number",n.NumberInput,{isControlled:!0}),B=L("password",a.PasswordInput),M=L("textarea",t.Textarea),T=L("switch",t.forwardRef(function(e,r){var n=e.label,a=x(e,k);/*#__PURE__*/return h.createElement(t.Switch,y({ref:r},a),n)}),{isControlled:!0,hideLabel:!0}),U=L("select",o.Select,{isControlled:!0}),D=L("checkbox",t.forwardRef(function(e,r){var n=e.label,a=x(e,I);/*#__PURE__*/return h.createElement(t.Checkbox,y({ref:r},a),n)}),{hideLabel:!0}),_=L("radio",l.RadioInput,{isControlled:!0}),G=L("pin",i.PinInput,{isControlled:!0}),z=L("native-select",o.NativeSelect,{isControlled:!0}),H=function(e){var r;if(null!=(r=e.spec.meta)&&r.type)return e.spec.meta.type;switch(e.type){case"array":return"array";case"object":return"object";case"number":return"number";case"date":return"date";default:return"text"}},$=function(e,r){for(var t,n=function(e,r){var t="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(t)return(t=t.call(e)).next.bind(t);if(Array.isArray(e)||(t=function(e,r){if(e){if("string"==typeof e)return b(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?b(e,r):void 0}}(e))){t&&(e=t);var n=0;return function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}(e.tests);!(t=n()).done;){var a,l=t.value;if(null!=(a=l.OPTIONS)&&a.params[r])return l.OPTIONS.params[r]}},J=function(e){var r,t=[];for(var n in r="array"===e.type?e.innerType.fields:e.fields){var a=r[n],l={};"array"===a.type&&(l.min=$(a,"min"),l.max=$(a,"max")),t.push(y({name:n,label:a.spec.label||n,type:H(a)},l))}return t},K=["children"],Q=function(e){/*#__PURE__*/return h.createElement(t.chakra.div,null,e.children)},W=function(e){var r,n,a,l=e.children,i=x(e,K),o=y({},null!=(r=null==(n=t.useTheme().components)||null==(a=n.FormLayout)?void 0:a.defaultProps)?r:{spacing:4},i);/*#__PURE__*/return h.createElement(t.SimpleGrid,o,h.Children.map(l,function(e){return h.isValidElement(e)?/*#__PURE__*/h.createElement(Q,null,e):e}))},X=function(e,r){return h.Children.map(r,function(r){return h.isValidElement(r)&&r.props.name?h.cloneElement(r,y({},r.props,{name:e+"."+r.props.name})):r})},Y=f.createContext({name:"ArrayFieldContext"}),Z=Y[0],ee=Y[1],re=f.createContext({name:"ArrayFieldRowContext"}),te=re[0],ne=re[1],ae=function(e){var t=e.name,n=e.defaultValue,a=void 0===n?{}:n,l=e.keyName,i=e.min,o=e.max,u=r.useFormContext();return y({},r.useFieldArray({control:u.control,name:t,keyName:l}),{name:t,defaultValue:a,min:i,max:o})},le=function(e){var t=e.index,n=r.useFormContext().clearErrors,a=ee(),l=a.name,i=a.remove,o=a.fields;return h.useEffect(function(){n(l)},[]),{index:t,isFirst:0===t,isLast:t===o.length-1,name:l+"."+t,remove:h.useCallback(function(){n(l),i(t)},[t])}},ie=function(){var e=ne(),r=e.isFirst,t=e.remove,n=ee(),a=n.min;return{onClick:function(){return t()},isDisabled:r&&!!(a&&n.fields.length<=a)}},oe=function(){var e=ee(),r=e.append,t=e.defaultValue,n=e.max;return{onClick:function(){return r(t,{shouldFocus:!1})},isDisabled:!!(n&&e.fields.length>=n)}},ue=["children","columns","spacing"],se=["children"],ce=["name","defaultValue","keyName","min","max","children"],de=function(e){/*#__PURE__*/return h.createElement(fe,{index:e.index},/*#__PURE__*/h.createElement(me,{columns:e.columns,spacing:e.spacing},e.children),/*#__PURE__*/h.createElement(pe,null))},me=function(e){var r=e.children,t=e.columns,n=e.spacing,a=x(e,ue),l=ne().name;/*#__PURE__*/return h.createElement(W,y({flex:"1",columns:t,gridGap:n,mr:"2"},a),X(l,r))},fe=function(e){var r=e.children,t=le({index:e.index});/*#__PURE__*/return h.createElement(te,{value:t},/*#__PURE__*/h.createElement(c.chakra.div,{__css:{display:"flex",flexDirection:"row",alignItems:"flex-end",width:"100%",mb:4}},r))},pe=function(e){/*#__PURE__*/return h.createElement(m.IconButton,y({icon:/*#__PURE__*/h.createElement(d.MinusIcon,null),"aria-label":"Remove row"},ie(),e))},ve=function(e){/*#__PURE__*/return h.createElement(m.IconButton,y({icon:/*#__PURE__*/h.createElement(d.AddIcon,null),"aria-label":"Add row",float:"right"},oe(),e))},he=function(e){var r=e.children,t=x(e,se);/*#__PURE__*/return h.createElement(xe,t,/*#__PURE__*/h.createElement(ye,null,function(e){/*#__PURE__*/return h.createElement(h.Fragment,null,e.map(function(e,t){/*#__PURE__*/return h.createElement(de,{key:e.id,index:t},r)}))}),/*#__PURE__*/h.createElement(ve,null))},ye=function(e){return(0,e.children)(ee().fields)},xe=function(e){var r=e.name,t=e.defaultValue,n=e.keyName,a=e.min,l=e.max,i=e.children,o=x(e,ce),u=ae({name:r,defaultValue:t,keyName:n,min:a,max:l});/*#__PURE__*/return h.createElement(Z,{value:u},/*#__PURE__*/h.createElement(O,y({name:r},o),i))},be=["name","children","columns","spacing"],Ee=function(e){var r=e.name,t=e.children,n=e.columns,a=e.spacing,l=x(e,be);/*#__PURE__*/return h.createElement(O,y({name:r},l),/*#__PURE__*/h.createElement(W,{columns:n,gridGap:a},X(r,t)))},Fe=["name","type"],ge=["schema"],we=["name","type","defaultValue"],Ce=function(e,r){return J(function(e,r){return u.reach(e,r)}(e,r)).map(function(e){var r=e.name,t=e.type,n=x(e,Fe);/*#__PURE__*/return h.createElement(V,y({key:r,name:r,type:t},n))})},Ae=function(e){var r=e.schema,t=x(e,ge);/*#__PURE__*/return h.createElement(W,t,J(r).map(function(e){var t=e.name,n=e.type,a=x(e,we);return"array"===n?/*#__PURE__*/h.createElement(he,y({name:t},a),Ce(r,t)):"object"===n?/*#__PURE__*/h.createElement(Ee,y({name:t},a),Ce(r,t)):/*#__PURE__*/h.createElement(V,y({key:t,name:t,type:n},a))}))},Re=["mode","resolver","reValidateMode","shouldFocusError","shouldUnregister","shouldUseNativeValidation","criteriaMode","delayError","schema","defaultValues","onSubmit","onError","children"],ke=t.forwardRef(function(e,n){var a=e.mode,l=void 0===a?"all":a,i=e.resolver,o=e.reValidateMode,u=e.shouldFocusError,c=e.shouldUnregister,d=e.shouldUseNativeValidation,m=e.criteriaMode,f=e.delayError,p=e.schema,v=e.defaultValues,b=e.onSubmit,E=e.onError,F=e.children,g=x(e,Re),w={mode:l,resolver:i,defaultValues:v,reValidateMode:o,shouldFocusError:u,shouldUnregister:c,shouldUseNativeValidation:d,criteriaMode:m,delayError:f};p&&(w.resolver=s.yupResolver(p));var C=r.useForm(w);/*#__PURE__*/return h.createElement(r.FormProvider,C,/*#__PURE__*/h.createElement(t.chakra.form,y({ref:n,onSubmit:(0,C.handleSubmit)(b,E)},g),F))}),Ie=["children"],Se=c.forwardRef(function(e,t){var n=e.children,a=x(e,Ie),l=r.useFormContext();/*#__PURE__*/return h.createElement(m.Button,y({type:"submit",isLoading:l.formState.isSubmitting,isPrimary:!0,ref:t},a),n)}),Oe=["schema","submitLabel"],Ve=t.forwardRef(function(e,r){var t=e.schema,n=e.submitLabel,a=x(e,Oe);/*#__PURE__*/return h.createElement(ke,y({},a,{schema:t,ref:r}),/*#__PURE__*/h.createElement(W,null,/*#__PURE__*/h.createElement(Ae,{schema:t}),n&&/*#__PURE__*/h.createElement(Se,{label:n})))});Ve.defaultProps={submitLabel:"Submit"},exports.ArrayField=he,exports.ArrayFieldAddButton=ve,exports.ArrayFieldContainer=xe,exports.ArrayFieldProvider=Z,exports.ArrayFieldRemoveButton=pe,exports.ArrayFieldRow=de,exports.ArrayFieldRowContainer=fe,exports.ArrayFieldRowFields=me,exports.ArrayFieldRowProvider=te,exports.ArrayFieldRows=ye,exports.AutoForm=Ve,exports.BaseField=O,exports.CheckboxField=D,exports.DisplayField=function(e){var n=e.name,a=e.label,l=x(e,E),i=r.useFormContext().getValues;/*#__PURE__*/return h.createElement(t.FormControl,l,a?/*#__PURE__*/h.createElement(t.FormLabel,{htmlFor:n},a):null,/*#__PURE__*/h.createElement(t.Text,{fontSize:"md"},i(n)))},exports.Field=V,exports.Fields=Ae,exports.Form=ke,exports.FormLayout=W,exports.InputField=N,exports.NativeSelectField=z,exports.NumberInputField=P,exports.ObjectField=Ee,exports.PasswordInputFIeld=B,exports.PinField=G,exports.RadioField=_,exports.SelectField=U,exports.SubmitButton=Se,exports.SwitchField=T,exports.TextareaField=M,exports.registerFieldType=L,exports.useArrayField=ae,exports.useArrayFieldAddButton=oe,exports.useArrayFieldContext=ee,exports.useArrayFieldRemoveButton=ie,exports.useArrayFieldRow=le,exports.useArrayFieldRowContext=ne,exports.withControlledInput=q,exports.withUncontrolledInput=j,Object.keys(p).forEach(function(e){"default"===e||exports.hasOwnProperty(e)||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return p[e]}})});
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/field.tsx","../src/resolvers/yup.ts","../src/layout.tsx","../src/utils.ts","../src/use-array-field.tsx","../src/array-field.tsx","../src/object-field.tsx","../src/fields.tsx","../src/form.tsx","../src/submit-button.tsx","../src/auto-form.tsx","../src/display-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext, FormState, Controller, get } from 'react-hook-form'\n\nimport {\n  forwardRef,\n  Box,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n  FormHelperText,\n  FormErrorMessage,\n  Input,\n  Textarea,\n  Checkbox,\n  Switch,\n  useMergeRefs,\n} from '@chakra-ui/react'\n\nimport { NumberInput } from '@saas-ui/number-input'\nimport { PasswordInput } from '@saas-ui/password-input'\nimport { RadioInput } from '@saas-ui/radio'\nimport { PinInput } from '@saas-ui/pin-input'\nimport { Select, NativeSelect } from '@saas-ui/select'\n\nexport interface FieldProps extends Omit<FormControlProps, 'label'> {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * The field label\n   */\n  label?: string\n  /**\n   * Hide the field label\n   */\n  hideLabel?: boolean\n  /**\n   * Field help text\n   */\n  help?: string\n  /**\n   * React hook form rules\n   */\n  rules?: any\n  /**\n   * Options used for selects and radio fields\n   */\n  options?: any\n  /**\n   * The field type\n   * Build-in types:\n   * - text\n   * - number\n   * - password\n   * - textarea\n   * - select\n   * - nativeselect\n   * - checkbox\n   * - radio\n   * - switch\n   * - pin\n   *\n   * Will default to a text field if there is no matching type.\n   * @default 'text'\n   */\n  type?: string\n  /**\n   * The input placeholder\n   */\n  placeholder?: string\n}\n\nconst inputTypes: Record<string, any> = {}\n\nconst defaultInputType = 'text'\n\nconst getInput = (type: string) => {\n  return inputTypes[type] || inputTypes[defaultInputType]\n}\n\nconst getError = (name: string, formState: FormState<{ [x: string]: any }>) => {\n  return get(formState.errors, name)\n}\n\nconst isTouched = (\n  name: string,\n  formState: FormState<{ [x: string]: any }>\n) => {\n  return get(formState.touchedFields, name)\n}\n\nexport const BaseField: React.FC<FieldProps> = (props) => {\n  const { name, label, help, variant, hideLabel, children, ...controlProps } =\n    props\n\n  const { formState } = useFormContext()\n\n  const error = getError(name, formState)\n\n  return (\n    <FormControl isInvalid={!!error} variant={variant} {...controlProps}>\n      {label && !hideLabel ? (\n        <FormLabel variant={variant}>{label}</FormLabel>\n      ) : null}\n      <Box>\n        {children}\n        {help && !error?.message ? (\n          <FormHelperText>{help}</FormHelperText>\n        ) : null}\n        {error?.message && (\n          <FormErrorMessage>{error?.message}</FormErrorMessage>\n        )}\n      </Box>\n    </FormControl>\n  )\n}\n\nexport const Field = forwardRef<FieldProps, typeof FormControl>(\n  (props, ref) => {\n    const { type = defaultInputType } = props\n    const InputComponent = getInput(type)\n\n    return <InputComponent ref={ref} {...props} />\n  }\n)\n\ninterface CreateFieldProps {\n  displayName: string\n  hideLabel?: boolean\n  BaseField: React.FC<any>\n}\n\nconst createField = (\n  InputComponent: React.FC<any>,\n  { displayName, hideLabel, BaseField }: CreateFieldProps\n) => {\n  const Field = forwardRef<FieldProps, typeof FormControl>((props, ref) => {\n    const {\n      label,\n      isDisabled,\n      isInvalid,\n      isReadOnly,\n      isRequired,\n      isOptional,\n      variant,\n      ...inputProps\n    } = props\n\n    return (\n      <BaseField\n        label={label}\n        hideLabel={hideLabel}\n        isDiabled={isDisabled}\n        isInvalid={isInvalid}\n        isReadOnly={isReadOnly}\n        isRequired={isRequired}\n        isOptional={isOptional}\n        variant={variant}\n      >\n        <InputComponent ref={ref} label={label} {...inputProps} />\n      </BaseField>\n    )\n  })\n  Field.displayName = displayName\n\n  return Field\n}\n\nexport const withControlledInput = (InputComponent: any) => {\n  return forwardRef(({ name, rules, ...inputProps }, ref) => {\n    const { control } = useFormContext()\n\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={rules}\n        render={({ field: { ref: _ref, ...field } }) => (\n          <InputComponent\n            {...field}\n            {...inputProps}\n            ref={useMergeRefs(ref, _ref)}\n          />\n        )}\n      />\n    )\n  })\n}\n\nexport const withUncontrolledInput = (InputComponent: any) => {\n  return forwardRef(({ name, rules, ...inputProps }, ref) => {\n    const { register } = useFormContext()\n\n    const { ref: _ref, ...field } = register(name, rules)\n\n    return (\n      <InputComponent\n        {...field}\n        {...inputProps}\n        ref={useMergeRefs(ref, _ref)}\n      />\n    )\n  })\n}\n\nexport interface RegisterFieldTypeOptions {\n  isControlled?: boolean\n  hideLabel?: boolean\n  BaseField?: React.FC<any>\n}\n\n/**\n * Register a new field type\n * @param type The name for this field in kebab-case, eg `email` or `array-field`\n * @param component The React component\n * @param options\n * @param options.isControlled Set this to true if this is a controlled field.\n * @param options.hideLabel Hide the field label, for example for checkbox or switch field.\n */\nexport const registerFieldType = (\n  type: string,\n  component: any,\n  options?: RegisterFieldTypeOptions\n) => {\n  let InputComponent\n  if (options?.isControlled) {\n    InputComponent = withControlledInput(component)\n  } else {\n    InputComponent = withUncontrolledInput(component)\n  }\n\n  const Field = createField(InputComponent, {\n    displayName: `${type\n      .split('-')\n      .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n      .join('')}Field`,\n    hideLabel: options?.hideLabel,\n    BaseField: options?.BaseField || BaseField,\n  })\n\n  inputTypes[type] = Field\n\n  return Field\n}\n\n// @todo Consider not registering all fields by default to lower the package size and computations.\n// Not all types may be required in a project.\nexport const InputField = registerFieldType('text', Input)\nexport const NumberInputField = registerFieldType('number', NumberInput, {\n  isControlled: true,\n})\nexport const PasswordInputFIeld = registerFieldType('password', PasswordInput)\nexport const TextareaField = registerFieldType('textarea', Textarea)\nexport const SwitchField = registerFieldType(\n  'switch',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Switch ref={ref} {...props}>\n        {label}\n      </Switch>\n    )\n  }),\n  {\n    isControlled: true,\n    hideLabel: true,\n  }\n)\nexport const SelectField = registerFieldType('select', Select, {\n  isControlled: true,\n})\nexport const CheckboxField = registerFieldType(\n  'checkbox',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Checkbox ref={ref} {...props}>\n        {label}\n      </Checkbox>\n    )\n  }),\n  {\n    hideLabel: true,\n  }\n)\nexport const RadioField = registerFieldType('radio', RadioInput, {\n  isControlled: true,\n})\nexport const PinField = registerFieldType('pin', PinInput, {\n  isControlled: true,\n})\nexport const NativeSelectField = registerFieldType(\n  'native-select',\n  NativeSelect,\n  { isControlled: true }\n)\n","import { SchemaOf, AnySchema, reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps } from '../Field'\n\nexport const resolver = yupResolver\n\n// @TODO get proper typings for the schema fields\n\nconst getType = (field: any) => {\n  if (field.spec.meta?.type) {\n    return field.spec.meta.type\n  }\n\n  switch (field.type) {\n    case 'array':\n      return 'array'\n    case 'object':\n      return 'object'\n    case 'number':\n      return 'number'\n    case 'date':\n      return 'date'\n    case 'string':\n    default:\n      return 'text'\n  }\n}\n\ntype Options = {\n  min?: number\n  max?: number\n}\n\nconst getArrayOption = (field: any, name: string) => {\n  for (const test of field.tests) {\n    if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n  }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (\n  schema: SchemaOf<AnySchema>\n): FieldProps[] => {\n  const fields = []\n\n  let schemaFields: Record<string, any> = {}\n  if (schema.type === 'array') {\n    /* @ts-ignore this is actually valid */\n    schemaFields = schema.innerType.fields\n  } else {\n    schemaFields = schema.fields\n  }\n\n  for (const name in schemaFields) {\n    const field = schemaFields[name]\n\n    const options: Options = {}\n    if (field.type === 'array') {\n      options.min = getArrayOption(field, 'min')\n      options.max = getArrayOption(field, 'max')\n    }\n\n    fields.push({\n      name,\n      label: field.spec.label || name,\n      type: getType(field),\n      ...options,\n    })\n  }\n  return fields\n}\n\nexport const getNestedSchema = (schema: SchemaOf<AnySchema>, path: string) => {\n  return reach(schema, path)\n}\n","import * as React from 'react'\n\nimport { chakra, SimpleGrid, SimpleGridProps, useTheme } from '@chakra-ui/react'\n\nexport type FormLayoutProps = SimpleGridProps\n\ninterface FormLayoutItemProps {\n  children: React.ReactNode\n}\n\nconst FormLayoutItem: React.FC<FormLayoutItemProps> = ({ children }) => {\n  return <chakra.div>{children}</chakra.div>\n}\n\nexport const FormLayout = ({ children, ...props }: FormLayoutProps) => {\n  const theme = useTheme()\n\n  const defaultProps = theme.components?.FormLayout?.defaultProps ?? {\n    spacing: 4,\n  }\n\n  const gridProps = {\n    ...defaultProps,\n    ...props,\n  }\n\n  return (\n    <SimpleGrid {...gridProps}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return <FormLayoutItem>{child}</FormLayoutItem>\n        }\n        return child\n      })}\n    </SimpleGrid>\n  )\n}\n","import * as React from 'react'\n\nexport const mapNestedFields = (name: string, children: React.ReactNode) => {\n  return React.Children.map(children, (child) => {\n    if (React.isValidElement(child) && child.props.name) {\n      return React.cloneElement(child, {\n        ...child.props,\n        name: `${name}.${child.props.name}`,\n      })\n    }\n    return child\n  })\n}\n","import * as React from 'react'\nimport {\n  useFieldArray,\n  useFormContext,\n  UseFieldArrayReturn,\n} from 'react-hook-form'\n\nimport { createContext } from '@chakra-ui/react-utils'\n\nexport interface UseArrayFieldReturn extends UseFieldArrayReturn {\n  /**\n   * The array field name\n   */\n  name: string\n  /**\n   * The default value for new items\n   */\n  defaultValue: Record<string, any>\n  /**\n   * Min amount of items\n   */\n  min?: number\n  /**\n   * Max amount of items\n   */\n  max?: number\n}\n\nexport const [ArrayFieldProvider, useArrayFieldContext] =\n  createContext<UseArrayFieldReturn>({\n    name: 'ArrayFieldContext',\n  })\n\nexport interface UseArrayFieldRowReturn {\n  /**\n   * Name of the array field including the index, eg 'field.0'\n   */\n  name: string\n  /**\n   * The field index\n   */\n  index: number\n  /**\n   * Remove this array item\n   */\n  remove: () => void\n  /**\n   * True if this is the first item\n   */\n  isFirst: boolean\n  /**\n   * True if this is the last item\n   */\n  isLast: boolean\n}\n\nexport const [ArrayFieldRowProvider, useArrayFieldRowContext] =\n  createContext<UseArrayFieldRowReturn>({\n    name: 'ArrayFieldRowContext',\n  })\n\nexport interface ArrayFieldOptions {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * Default value for new values in the array\n   */\n  defaultValue?: Record<string, any>\n  /**\n   * Default key name for rows, change this if your data uses 'id'\n   * @default \"id\"\n   */\n  keyName?: string\n  min?: number\n  max?: number\n}\n\nexport const useArrayField = ({\n  name,\n  defaultValue = {},\n  keyName,\n  min,\n  max,\n}: ArrayFieldOptions) => {\n  const { control } = useFormContext()\n  const context = useFieldArray({\n    control,\n    name,\n    keyName,\n  })\n\n  return {\n    ...context,\n    name,\n    defaultValue,\n    min,\n    max,\n  }\n}\n\nexport interface UseArrayFieldRowProps {\n  index: number\n}\n\nexport const useArrayFieldRow = ({ index }: UseArrayFieldRowProps) => {\n  const { clearErrors } = useFormContext()\n  const { name, remove, fields } = useArrayFieldContext()\n\n  React.useEffect(() => {\n    // reset errors, to make sure min/max errors reset correctly\n    clearErrors(name)\n  }, [])\n\n  return {\n    index,\n    isFirst: index === 0,\n    isLast: index === fields.length - 1,\n    name: `${name}.${index}`,\n    remove: React.useCallback(() => {\n      clearErrors(name)\n      remove(index)\n    }, [index]),\n  }\n}\n\nexport const useArrayFieldRemoveButton = () => {\n  const { isFirst, remove } = useArrayFieldRowContext()\n  const { min, fields } = useArrayFieldContext()\n\n  const isDisabled = isFirst && !!(min && fields.length <= min)\n\n  return {\n    onClick: () => remove(),\n    isDisabled,\n  }\n}\n\nexport const useArrayFieldAddButton = () => {\n  const { append, defaultValue, max, fields } = useArrayFieldContext()\n\n  const isDisabled = !!(max && fields.length >= max)\n\n  return {\n    onClick: () =>\n      append(defaultValue, {\n        shouldFocus: false,\n      }),\n    isDisabled,\n  }\n}\n","import * as React from 'react'\n\nimport { chakra, ResponsiveValue } from '@chakra-ui/system'\n\nimport { AddIcon, MinusIcon } from '@chakra-ui/icons'\nimport { IconButton, ButtonProps } from '@saas-ui/button'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nimport {\n  useArrayField,\n  useArrayFieldRow,\n  useArrayFieldContext,\n  ArrayFieldProvider,\n  ArrayFieldOptions,\n  ArrayFieldRowProvider,\n  useArrayFieldRowContext,\n  useArrayFieldRemoveButton,\n  useArrayFieldAddButton,\n} from './use-array-field'\n\ninterface ArrayField {\n  id: string\n  [key: string]: unknown\n}\n\ninterface ArrayFieldRowProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n  /**\n   * The array index\n   */\n  index: number\n}\n\nexport const ArrayFieldRow: React.FC<ArrayFieldRowProps> = ({\n  children,\n  columns,\n  spacing,\n  index,\n}) => {\n  return (\n    <ArrayFieldRowContainer index={index}>\n      <ArrayFieldRowFields columns={columns} spacing={spacing}>\n        {children}\n      </ArrayFieldRowFields>\n      <ArrayFieldRemoveButton />\n    </ArrayFieldRowContainer>\n  )\n}\n\nexport interface ArrayFieldRowFieldsProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ArrayFieldRowFields: React.FC<ArrayFieldRowFieldsProps> = ({\n  children,\n  columns,\n  spacing,\n  ...layoutProps\n}) => {\n  const { name } = useArrayFieldRowContext()\n  return (\n    <FormLayout\n      flex=\"1\"\n      columns={columns}\n      gridGap={spacing}\n      mr=\"2\"\n      {...layoutProps}\n    >\n      {mapNestedFields(name, children)}\n    </FormLayout>\n  )\n}\n\nexport const ArrayFieldRowContainer: React.FC<ArrayFieldRowProps> = ({\n  children,\n  index,\n}) => {\n  const context = useArrayFieldRow({ index })\n\n  const styles = {\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'flex-end',\n    width: '100%',\n    mb: 4,\n  }\n\n  return (\n    <ArrayFieldRowProvider value={context}>\n      <chakra.div __css={styles}>{children}</chakra.div>\n    </ArrayFieldRowProvider>\n  )\n}\n\nexport const ArrayFieldRemoveButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<MinusIcon />}\n      aria-label=\"Remove row\"\n      {...useArrayFieldRemoveButton()}\n      {...props}\n    />\n  )\n}\n\nexport const ArrayFieldAddButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<AddIcon />}\n      aria-label=\"Add row\"\n      float=\"right\"\n      {...useArrayFieldAddButton()}\n      {...props}\n    />\n  )\n}\n\nexport interface ArrayFieldProps\n  extends ArrayFieldOptions,\n    Omit<FieldProps, 'defaultValue'> {}\n\nexport const ArrayField: React.FC<ArrayFieldProps> = (props) => {\n  const { children, ...containerProps } = props\n\n  return (\n    <ArrayFieldContainer {...containerProps}>\n      <ArrayFieldRows>\n        {(fields: ArrayField[]) => (\n          <>\n            {fields.map(({ id }, index: number) => (\n              <ArrayFieldRow key={id} index={index}>\n                {children}\n              </ArrayFieldRow>\n            ))}\n          </>\n        )}\n      </ArrayFieldRows>\n      <ArrayFieldAddButton />\n    </ArrayFieldContainer>\n  )\n}\n\nexport interface ArrayFieldRowsProps {\n  children: (fields: ArrayField[]) => React.ReactElement | null\n}\n\nexport const ArrayFieldRows = ({\n  children,\n}: ArrayFieldRowsProps): React.ReactElement | null => {\n  const { fields } = useArrayFieldContext()\n  return children(fields)\n}\n\nexport const ArrayFieldContainer: React.FC<ArrayFieldProps> = ({\n  name,\n  defaultValue,\n  keyName,\n  min,\n  max,\n  children,\n  ...fieldProps\n}) => {\n  const context = useArrayField({\n    name,\n    defaultValue,\n    keyName,\n    min,\n    max,\n  })\n\n  return (\n    <ArrayFieldProvider value={context}>\n      <BaseField name={name} {...fieldProps}>\n        {children}\n      </BaseField>\n    </ArrayFieldProvider>\n  )\n}\n","import * as React from 'react'\nimport { ResponsiveValue } from '@chakra-ui/system'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nexport interface ObjectFieldProps extends FieldProps {\n  name: string\n  children: React.ReactNode\n  columns?: ResponsiveValue<number>\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ObjectField: React.FC<ObjectFieldProps> = (props) => {\n  const { name, children, columns, spacing, ...fieldProps } = props\n  return (\n    <BaseField name={name} {...fieldProps}>\n      <FormLayout columns={columns} gridGap={spacing}>\n        {mapNestedFields(name, children)}\n      </FormLayout>\n    </BaseField>\n  )\n}\n","import * as React from 'react'\nimport { getFieldsFromSchema, getNestedSchema } from './resolvers/yup'\n\nimport { FormLayout } from './layout'\nimport { Field, FieldProps } from './field'\n\nimport { ArrayField } from './array-field'\nimport { ObjectField } from './object-field'\n\nexport interface FieldsProps {\n  schema: any\n}\n\nconst getNestedFields = (schema: any, name: string) => {\n  return getFieldsFromSchema(getNestedSchema(schema, name)).map(\n    ({ name, type, ...nestedFieldProps }: FieldProps): React.ReactNode => (\n      <Field key={name} name={name} type={type} {...nestedFieldProps} />\n    )\n  )\n}\n\nexport const Fields: React.FC<FieldsProps> = ({ schema, ...props }) => {\n  return (\n    <FormLayout {...props}>\n      {getFieldsFromSchema(schema).map(\n        ({\n          name,\n          type,\n          defaultValue,\n          ...fieldProps\n        }: FieldProps): React.ReactNode => {\n          if (type === 'array') {\n            return (\n              <ArrayField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ArrayField>\n            )\n          } else if (type === 'object') {\n            return (\n              <ObjectField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ObjectField>\n            )\n          }\n\n          return <Field key={name} name={name} type={type} {...fieldProps} />\n        }\n      )}\n    </FormLayout>\n  )\n}\n","import * as React from 'react'\n\nimport { chakra, HTMLChakraProps, forwardRef } from '@chakra-ui/react'\n\nimport {\n  useForm,\n  FormProvider,\n  UseFormProps,\n  FieldErrors,\n} from 'react-hook-form'\n\nimport { resolver } from './resolvers/yup'\n\ninterface FormOptions {\n  schema?: any\n  submitLabel?: false | string\n}\n\nexport interface FormProps extends HTMLChakraProps<'form'>, FormOptions {\n  defaultValues: Record<string, any>\n  onSubmit: (arg: any) => Promise<any> | void\n  onError?: (errors: FieldErrors) => void\n  children?: React.ReactNode\n}\n\nexport const Form = forwardRef<FormProps, 'form'>(\n  ({ schema, defaultValues, onSubmit, onError, children, ...props }, ref) => {\n    const form: UseFormProps = { mode: 'all', defaultValues }\n\n    if (schema) {\n      form.resolver = resolver(schema)\n    }\n\n    const methods = useForm(form)\n    const { handleSubmit } = methods\n\n    return (\n      <FormProvider {...methods}>\n        <chakra.form\n          ref={ref}\n          onSubmit={handleSubmit(onSubmit, onError)}\n          {...props}\n        >\n          {children}\n        </chakra.form>\n      </FormProvider>\n    )\n  }\n)\n","import * as React from 'react'\n\nimport { useFormContext } from 'react-hook-form'\n\nimport { Button, ButtonProps } from '@saas-ui/button'\n\nimport { forwardRef } from '@chakra-ui/system'\n\nexport const SubmitButton = forwardRef<ButtonProps, 'button'>(\n  ({ children, ...props }, ref) => {\n    const data = useFormContext()\n\n    return (\n      <Button\n        type=\"submit\"\n        isLoading={data.formState.isSubmitting}\n        isPrimary\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </Button>\n    )\n  }\n)\n","import * as React from 'react'\n\nimport { forwardRef } from '@chakra-ui/react'\n\nimport { Form, FormProps } from './form'\n\nimport { FormLayout } from './layout'\nimport { Fields } from './fields'\nimport { SubmitButton } from './submit-button'\n\ninterface AutoFormOptions {\n  schema: any\n  submitLabel?: false | string\n}\n\nexport interface AutoFormProps\n  extends Omit<FormProps, 'schema'>,\n    AutoFormOptions {}\n\nexport const AutoForm = forwardRef<AutoFormProps, 'form'>(\n  ({ schema, submitLabel, ...props }, ref) => {\n    return (\n      <Form {...props} schema={schema} ref={ref}>\n        <FormLayout>\n          {<Fields schema={schema} />}\n          {submitLabel && <SubmitButton label={submitLabel} />}\n        </FormLayout>\n      </Form>\n    )\n  }\n)\n\nAutoForm.defaultProps = {\n  submitLabel: 'Submit',\n}\n","import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  Text,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n} from '@chakra-ui/react'\n\nimport { FieldProps } from './Field'\n\nexport interface DisplayFieldProps\n  extends FormControlProps,\n    Omit<FieldProps, 'type' | 'label'> {}\n\nexport const DisplayField: React.FC<DisplayFieldProps> = ({\n  name,\n  label,\n  placeholder,\n  ...props\n}) => {\n  const { getValues } = useFormContext()\n\n  return (\n    <FormControl {...props}>\n      {label ? <FormLabel htmlFor={name}>{label}</FormLabel> : null}\n      <Text fontSize=\"md\">{getValues(name)}</Text>\n    </FormControl>\n  )\n}\n"],"names":["inputTypes","BaseField","props","name","label","help","variant","hideLabel","children","controlProps","error","formState","get","errors","getError","useFormContext","React","FormControl","isInvalid","FormLabel","Box","message","FormHelperText","FormErrorMessage","Field","forwardRef","ref","type","withControlledInput","InputComponent","rules","inputProps","Controller","control","render","field","_ref","useMergeRefs","withUncontrolledInput","register","registerFieldType","component","options","displayName","isDisabled","isReadOnly","isRequired","isOptional","isDiabled","createField","isControlled","split","map","part","charAt","toUpperCase","slice","join","InputField","Input","NumberInputField","NumberInput","PasswordInputFIeld","PasswordInput","TextareaField","Textarea","SwitchField","Switch","SelectField","Select","CheckboxField","Checkbox","RadioField","RadioInput","PinField","PinInput","NativeSelectField","NativeSelect","resolver","yupResolver","getType","spec","meta","_field$spec$meta","getArrayOption","tests","test","OPTIONS","_test$OPTIONS","params","getFieldsFromSchema","schema","schemaFields","fields","innerType","min","max","push","FormLayoutItem","chakra","div","FormLayout","gridProps","useTheme","components","_theme$components","_theme$components$For2","defaultProps","spacing","SimpleGrid","Children","child","isValidElement","mapNestedFields","cloneElement","createContext","ArrayFieldProvider","useArrayFieldContext","ArrayFieldRowProvider","useArrayFieldRowContext","useArrayField","defaultValue","keyName","useFieldArray","useArrayFieldRow","index","clearErrors","remove","useEffect","isFirst","isLast","length","useCallback","useArrayFieldRemoveButton","onClick","useArrayFieldAddButton","append","shouldFocus","ArrayFieldRow","ArrayFieldRowContainer","ArrayFieldRowFields","columns","ArrayFieldRemoveButton","layoutProps","flex","gridGap","mr","context","value","__css","display","flexDirection","alignItems","width","mb","IconButton","icon","MinusIcon","ArrayFieldAddButton","AddIcon","float","ArrayField","containerProps","ArrayFieldContainer","ArrayFieldRows","key","id","fieldProps","ObjectField","getNestedFields","path","reach","getNestedSchema","nestedFieldProps","Fields","Form","defaultValues","onSubmit","onError","form","mode","methods","useForm","FormProvider","handleSubmit","SubmitButton","data","Button","isLoading","isSubmitting","isPrimary","AutoForm","submitLabel","getValues","htmlFor","Text","fontSize"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/field.tsx","../src/resolvers/yup.ts","../src/layout.tsx","../src/utils.ts","../src/use-array-field.tsx","../src/array-field.tsx","../src/object-field.tsx","../src/fields.tsx","../src/form.tsx","../src/submit-button.tsx","../src/auto-form.tsx","../src/display-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport {\n  useFormContext,\n  FormState,\n  Controller,\n  get,\n  RegisterOptions,\n  FieldValues,\n  FieldName,\n  FieldPath,\n  FieldPathValue,\n} from 'react-hook-form'\n\nimport {\n  forwardRef,\n  Box,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n  FormHelperText,\n  FormErrorMessage,\n  Input,\n  Textarea,\n  Checkbox,\n  Switch,\n  useMergeRefs,\n} from '@chakra-ui/react'\n\nimport { NumberInput } from '@saas-ui/number-input'\nimport { PasswordInput } from '@saas-ui/password-input'\nimport { RadioInput } from '@saas-ui/radio'\nimport { PinInput } from '@saas-ui/pin-input'\nimport { Select, NativeSelect } from '@saas-ui/select'\n\nexport type FieldRules = Pick<\n  RegisterOptions,\n  'required' | 'min' | 'max' | 'maxLength' | 'minLength' | 'pattern'\n>\n\nexport type FieldTypes =\n  | 'text'\n  | 'number'\n  | 'password'\n  | 'textarea'\n  | 'select'\n  | 'native-select'\n  | 'checkbox'\n  | 'radio'\n  | 'switch'\n  | 'pin'\n  | string\n\nexport interface FieldProps<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> extends Omit<FormControlProps, 'label' | 'type'> {\n  /**\n   * The field name\n   */\n  name: TName\n  /**\n   * The field label\n   */\n  label?: string\n  /**\n   * Hide the field label\n   */\n  hideLabel?: boolean\n  /**\n   * Field help text\n   */\n  help?: string\n  /**\n   * React hook form rules\n   */\n  rules?: Omit<\n    RegisterOptions<TFieldValues, TName>,\n    'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'\n  >\n  /**\n   * Options used for selects and radio fields\n   */\n  options?: any\n  /**\n   * The field type\n   * Build-in types:\n   * - text\n   * - number\n   * - password\n   * - textarea\n   * - select\n   * - native-select\n   * - checkbox\n   * - radio\n   * - switch\n   * - pin\n   *\n   * Will default to a text field if there is no matching type.\n   * @default 'text'\n   */\n  type?: FieldTypes\n  /**\n   * The input placeholder\n   */\n  placeholder?: string\n}\n\nconst inputTypes: Record<FieldTypes, any> = {}\n\nconst defaultInputType = 'text'\n\nconst getInput = (type: string) => {\n  return inputTypes[type] || inputTypes[defaultInputType]\n}\n\nconst getError = (name: string, formState: FormState<{ [x: string]: any }>) => {\n  return get(formState.errors, name)\n}\n\nconst isTouched = (\n  name: string,\n  formState: FormState<{ [x: string]: any }>\n) => {\n  return get(formState.touchedFields, name)\n}\n\nexport const BaseField: React.FC<FieldProps> = (props) => {\n  const { name, label, help, variant, hideLabel, children, ...controlProps } =\n    props\n\n  const { formState } = useFormContext()\n\n  const error = getError(name, formState)\n\n  return (\n    <FormControl variant={variant} {...controlProps} isInvalid={!!error}>\n      {label && !hideLabel ? (\n        <FormLabel variant={variant}>{label}</FormLabel>\n      ) : null}\n      <Box>\n        {children}\n        {help && !error?.message ? (\n          <FormHelperText>{help}</FormHelperText>\n        ) : null}\n        {error?.message && (\n          <FormErrorMessage>{error?.message}</FormErrorMessage>\n        )}\n      </Box>\n    </FormControl>\n  )\n}\n\nexport const Field = forwardRef<FieldProps, typeof FormControl>(\n  (props, ref) => {\n    const { type = defaultInputType } = props\n    const InputComponent = getInput(type)\n\n    return <InputComponent ref={ref} {...props} />\n  }\n)\n\ninterface CreateFieldProps {\n  displayName: string\n  hideLabel?: boolean\n  BaseField: React.FC<any>\n}\n\nconst createField = (\n  InputComponent: React.FC<any>,\n  { displayName, hideLabel, BaseField }: CreateFieldProps\n) => {\n  const Field = forwardRef<FieldProps, typeof FormControl>((props, ref) => {\n    const {\n      name,\n      label,\n      isDisabled,\n      isInvalid,\n      isReadOnly,\n      isRequired,\n      variant,\n      ...inputProps\n    } = props\n\n    return (\n      <BaseField\n        name={name}\n        label={label}\n        hideLabel={hideLabel}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isReadOnly={isReadOnly}\n        isRequired={isRequired}\n        variant={variant}\n      >\n        <InputComponent ref={ref} name={name} label={label} {...inputProps} />\n      </BaseField>\n    )\n  })\n  Field.displayName = displayName\n\n  return Field\n}\n\nexport const withControlledInput = (InputComponent: any) => {\n  return forwardRef<FieldProps, typeof InputComponent>(\n    ({ name, rules, ...inputProps }, ref) => {\n      const { control } = useFormContext()\n\n      return (\n        <Controller\n          name={name}\n          control={control}\n          rules={rules}\n          render={({ field: { ref: _ref, ...field } }) => (\n            <InputComponent\n              {...field}\n              {...inputProps}\n              ref={useMergeRefs(ref, _ref)}\n            />\n          )}\n        />\n      )\n    }\n  )\n}\n\nexport const withUncontrolledInput = (InputComponent: any) => {\n  return forwardRef<FieldProps, typeof InputComponent>(\n    ({ name, rules, ...inputProps }, ref) => {\n      const { register } = useFormContext()\n\n      const { ref: _ref, ...field } = register(name, rules)\n\n      return (\n        <InputComponent\n          {...field}\n          {...inputProps}\n          ref={useMergeRefs(ref, _ref)}\n        />\n      )\n    }\n  )\n}\n\nexport interface RegisterFieldTypeOptions {\n  isControlled?: boolean\n  hideLabel?: boolean\n  BaseField?: React.FC<any>\n}\n\n/**\n * Register a new field type\n * @param type The name for this field in kebab-case, eg `email` or `array-field`\n * @param component The React component\n * @param options\n * @param options.isControlled Set this to true if this is a controlled field.\n * @param options.hideLabel Hide the field label, for example for checkbox or switch field.\n */\nexport const registerFieldType = (\n  type: string,\n  component: React.FC<any>,\n  options?: RegisterFieldTypeOptions\n) => {\n  let InputComponent\n  if (options?.isControlled) {\n    InputComponent = withControlledInput(component)\n  } else {\n    InputComponent = withUncontrolledInput(component)\n  }\n\n  const Field = createField(InputComponent, {\n    displayName: `${type\n      .split('-')\n      .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n      .join('')}Field`,\n    hideLabel: options?.hideLabel,\n    BaseField: options?.BaseField || BaseField,\n  })\n\n  inputTypes[type] = Field\n\n  return Field\n}\n\n// @todo Consider not registering all fields by default to lower the package size and computations.\n// Not all types may be required in a project.\nexport const InputField = registerFieldType('text', Input)\nexport const NumberInputField = registerFieldType('number', NumberInput, {\n  isControlled: true,\n})\nexport const PasswordInputFIeld = registerFieldType('password', PasswordInput)\nexport const TextareaField = registerFieldType('textarea', Textarea)\nexport const SwitchField = registerFieldType(\n  'switch',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Switch ref={ref} {...props}>\n        {label}\n      </Switch>\n    )\n  }),\n  {\n    isControlled: true,\n    hideLabel: true,\n  }\n)\nexport const SelectField = registerFieldType('select', Select, {\n  isControlled: true,\n})\nexport const CheckboxField = registerFieldType(\n  'checkbox',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Checkbox ref={ref} {...props}>\n        {label}\n      </Checkbox>\n    )\n  }),\n  {\n    hideLabel: true,\n  }\n)\nexport const RadioField = registerFieldType('radio', RadioInput, {\n  isControlled: true,\n})\nexport const PinField = registerFieldType('pin', PinInput, {\n  isControlled: true,\n})\nexport const NativeSelectField = registerFieldType(\n  'native-select',\n  NativeSelect,\n  { isControlled: true }\n)\n","import { SchemaOf, AnySchema, reach } from 'yup'\nexport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps } from '../field'\n\n// @TODO get proper typings for the schema fields\n\nconst getType = (field: any) => {\n  if (field.spec.meta?.type) {\n    return field.spec.meta.type\n  }\n\n  switch (field.type) {\n    case 'array':\n      return 'array'\n    case 'object':\n      return 'object'\n    case 'number':\n      return 'number'\n    case 'date':\n      return 'date'\n    case 'string':\n    default:\n      return 'text'\n  }\n}\n\ntype Options = {\n  min?: number\n  max?: number\n}\n\nconst getArrayOption = (field: any, name: string) => {\n  for (const test of field.tests) {\n    if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n  }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (\n  schema: SchemaOf<AnySchema>\n): FieldProps[] => {\n  const fields = []\n\n  let schemaFields: Record<string, any> = {}\n  if (schema.type === 'array') {\n    /* @ts-ignore this is actually valid */\n    schemaFields = schema.innerType.fields\n  } else {\n    schemaFields = schema.fields\n  }\n\n  for (const name in schemaFields) {\n    const field = schemaFields[name]\n\n    const options: Options = {}\n    if (field.type === 'array') {\n      options.min = getArrayOption(field, 'min')\n      options.max = getArrayOption(field, 'max')\n    }\n\n    fields.push({\n      name,\n      label: field.spec.label || name,\n      type: getType(field),\n      ...options,\n    })\n  }\n  return fields\n}\n\nexport const getNestedSchema = (schema: SchemaOf<AnySchema>, path: string) => {\n  return reach(schema, path)\n}\n","import * as React from 'react'\n\nimport { chakra, SimpleGrid, SimpleGridProps, useTheme } from '@chakra-ui/react'\n\nexport type FormLayoutProps = SimpleGridProps\n\ninterface FormLayoutItemProps {\n  children: React.ReactNode\n}\n\nconst FormLayoutItem: React.FC<FormLayoutItemProps> = ({ children }) => {\n  return <chakra.div>{children}</chakra.div>\n}\n\n/**\n * FormLayout\n *\n * Renders form items in a `SimpleGrid`\n * @see https://chakra-ui.com/docs/layout/simple-grid\n */\nexport const FormLayout = ({ children, ...props }: FormLayoutProps) => {\n  const theme = useTheme()\n\n  const defaultProps = theme.components?.FormLayout?.defaultProps ?? {\n    spacing: 4,\n  }\n\n  const gridProps = {\n    ...defaultProps,\n    ...props,\n  }\n\n  return (\n    <SimpleGrid {...gridProps}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return <FormLayoutItem>{child}</FormLayoutItem>\n        }\n        return child\n      })}\n    </SimpleGrid>\n  )\n}\n","import * as React from 'react'\n\nexport const mapNestedFields = (name: string, children: React.ReactNode) => {\n  return React.Children.map(children, (child) => {\n    if (React.isValidElement(child) && child.props.name) {\n      return React.cloneElement(child, {\n        ...child.props,\n        name: `${name}.${child.props.name}`,\n      })\n    }\n    return child\n  })\n}\n","import * as React from 'react'\nimport {\n  useFieldArray,\n  useFormContext,\n  UseFieldArrayReturn,\n} from 'react-hook-form'\n\nimport { createContext } from '@chakra-ui/react-utils'\n\nexport interface UseArrayFieldReturn extends UseFieldArrayReturn {\n  /**\n   * The array field name\n   */\n  name: string\n  /**\n   * The default value for new items\n   */\n  defaultValue: Record<string, any>\n  /**\n   * Min amount of items\n   */\n  min?: number\n  /**\n   * Max amount of items\n   */\n  max?: number\n}\n\nexport const [ArrayFieldProvider, useArrayFieldContext] =\n  createContext<UseArrayFieldReturn>({\n    name: 'ArrayFieldContext',\n  })\n\nexport interface UseArrayFieldRowReturn {\n  /**\n   * Name of the array field including the index, eg 'field.0'\n   */\n  name: string\n  /**\n   * The field index\n   */\n  index: number\n  /**\n   * Remove this array item\n   */\n  remove: () => void\n  /**\n   * True if this is the first item\n   */\n  isFirst: boolean\n  /**\n   * True if this is the last item\n   */\n  isLast: boolean\n}\n\nexport const [ArrayFieldRowProvider, useArrayFieldRowContext] =\n  createContext<UseArrayFieldRowReturn>({\n    name: 'ArrayFieldRowContext',\n  })\n\nexport interface ArrayFieldOptions {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * Default value for new values in the array\n   */\n  defaultValue?: Record<string, any>\n  /**\n   * Default key name for rows, change this if your data uses 'id'\n   * @default \"id\"\n   */\n  keyName?: string\n  min?: number\n  max?: number\n}\n\nexport const useArrayField = ({\n  name,\n  defaultValue = {},\n  keyName,\n  min,\n  max,\n}: ArrayFieldOptions) => {\n  const { control } = useFormContext()\n  const context = useFieldArray({\n    control,\n    name,\n    keyName,\n  })\n\n  return {\n    ...context,\n    name,\n    defaultValue,\n    min,\n    max,\n  }\n}\n\nexport interface UseArrayFieldRowProps {\n  index: number\n}\n\nexport const useArrayFieldRow = ({ index }: UseArrayFieldRowProps) => {\n  const { clearErrors } = useFormContext()\n  const { name, remove, fields } = useArrayFieldContext()\n\n  React.useEffect(() => {\n    // reset errors, to make sure min/max errors reset correctly\n    clearErrors(name)\n  }, [])\n\n  return {\n    index,\n    isFirst: index === 0,\n    isLast: index === fields.length - 1,\n    name: `${name}.${index}`,\n    remove: React.useCallback(() => {\n      clearErrors(name)\n      remove(index)\n    }, [index]),\n  }\n}\n\nexport const useArrayFieldRemoveButton = () => {\n  const { isFirst, remove } = useArrayFieldRowContext()\n  const { min, fields } = useArrayFieldContext()\n\n  const isDisabled = isFirst && !!(min && fields.length <= min)\n\n  return {\n    onClick: () => remove(),\n    isDisabled,\n  }\n}\n\nexport const useArrayFieldAddButton = () => {\n  const { append, defaultValue, max, fields } = useArrayFieldContext()\n\n  const isDisabled = !!(max && fields.length >= max)\n\n  return {\n    onClick: () =>\n      append(defaultValue, {\n        shouldFocus: false,\n      }),\n    isDisabled,\n  }\n}\n","import * as React from 'react'\n\nimport { chakra, ResponsiveValue } from '@chakra-ui/system'\n\nimport { AddIcon, MinusIcon } from '@chakra-ui/icons'\nimport { IconButton, ButtonProps } from '@saas-ui/button'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nimport {\n  useArrayField,\n  useArrayFieldRow,\n  useArrayFieldContext,\n  ArrayFieldProvider,\n  ArrayFieldOptions,\n  ArrayFieldRowProvider,\n  useArrayFieldRowContext,\n  useArrayFieldRemoveButton,\n  useArrayFieldAddButton,\n} from './use-array-field'\n\ninterface ArrayField {\n  id: string\n  [key: string]: unknown\n}\n\ninterface ArrayFieldRowProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n  /**\n   * The array index\n   */\n  index: number\n}\n\nexport const ArrayFieldRow: React.FC<ArrayFieldRowProps> = ({\n  children,\n  columns,\n  spacing,\n  index,\n}) => {\n  return (\n    <ArrayFieldRowContainer index={index}>\n      <ArrayFieldRowFields columns={columns} spacing={spacing}>\n        {children}\n      </ArrayFieldRowFields>\n      <ArrayFieldRemoveButton />\n    </ArrayFieldRowContainer>\n  )\n}\n\nexport interface ArrayFieldRowFieldsProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ArrayFieldRowFields: React.FC<ArrayFieldRowFieldsProps> = ({\n  children,\n  columns,\n  spacing,\n  ...layoutProps\n}) => {\n  const { name } = useArrayFieldRowContext()\n  return (\n    <FormLayout\n      flex=\"1\"\n      columns={columns}\n      gridGap={spacing}\n      mr=\"2\"\n      {...layoutProps}\n    >\n      {mapNestedFields(name, children)}\n    </FormLayout>\n  )\n}\n\nexport const ArrayFieldRowContainer: React.FC<ArrayFieldRowProps> = ({\n  children,\n  index,\n}) => {\n  const context = useArrayFieldRow({ index })\n\n  const styles = {\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'flex-end',\n    width: '100%',\n    mb: 4,\n  }\n\n  return (\n    <ArrayFieldRowProvider value={context}>\n      <chakra.div __css={styles}>{children}</chakra.div>\n    </ArrayFieldRowProvider>\n  )\n}\n\nexport const ArrayFieldRemoveButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<MinusIcon />}\n      aria-label=\"Remove row\"\n      {...useArrayFieldRemoveButton()}\n      {...props}\n    />\n  )\n}\n\nexport const ArrayFieldAddButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<AddIcon />}\n      aria-label=\"Add row\"\n      float=\"right\"\n      {...useArrayFieldAddButton()}\n      {...props}\n    />\n  )\n}\n\nexport interface ArrayFieldProps\n  extends ArrayFieldOptions,\n    Omit<FieldProps, 'defaultValue'> {}\n\nexport const ArrayField: React.FC<ArrayFieldProps> = (props) => {\n  const { children, ...containerProps } = props\n\n  return (\n    <ArrayFieldContainer {...containerProps}>\n      <ArrayFieldRows>\n        {(fields: ArrayField[]) => (\n          <>\n            {fields.map(({ id }, index: number) => (\n              <ArrayFieldRow key={id} index={index}>\n                {children}\n              </ArrayFieldRow>\n            ))}\n          </>\n        )}\n      </ArrayFieldRows>\n      <ArrayFieldAddButton />\n    </ArrayFieldContainer>\n  )\n}\n\nexport interface ArrayFieldRowsProps {\n  children: (fields: ArrayField[]) => React.ReactElement | null\n}\n\nexport const ArrayFieldRows = ({\n  children,\n}: ArrayFieldRowsProps): React.ReactElement | null => {\n  const { fields } = useArrayFieldContext()\n  return children(fields)\n}\n\nexport const ArrayFieldContainer: React.FC<ArrayFieldProps> = ({\n  name,\n  defaultValue,\n  keyName,\n  min,\n  max,\n  children,\n  ...fieldProps\n}) => {\n  const context = useArrayField({\n    name,\n    defaultValue,\n    keyName,\n    min,\n    max,\n  })\n\n  return (\n    <ArrayFieldProvider value={context}>\n      <BaseField name={name} {...fieldProps}>\n        {children}\n      </BaseField>\n    </ArrayFieldProvider>\n  )\n}\n","import * as React from 'react'\nimport { ResponsiveValue } from '@chakra-ui/system'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nexport interface ObjectFieldProps extends FieldProps {\n  name: string\n  children: React.ReactNode\n  columns?: ResponsiveValue<number>\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ObjectField: React.FC<ObjectFieldProps> = (props) => {\n  const { name, children, columns, spacing, ...fieldProps } = props\n  return (\n    <BaseField name={name} {...fieldProps}>\n      <FormLayout columns={columns} gridGap={spacing}>\n        {mapNestedFields(name, children)}\n      </FormLayout>\n    </BaseField>\n  )\n}\n","import * as React from 'react'\nimport { getFieldsFromSchema, getNestedSchema } from './resolvers/yup'\n\nimport { FormLayout } from './layout'\nimport { Field, FieldProps } from './field'\n\nimport { ArrayField } from './array-field'\nimport { ObjectField } from './object-field'\n\nexport interface FieldsProps {\n  schema: any\n}\n\nconst getNestedFields = (schema: any, name: string) => {\n  return getFieldsFromSchema(getNestedSchema(schema, name)).map(\n    ({ name, type, ...nestedFieldProps }: FieldProps): React.ReactNode => (\n      <Field key={name} name={name} type={type} {...nestedFieldProps} />\n    )\n  )\n}\n\nexport const Fields: React.FC<FieldsProps> = ({ schema, ...props }) => {\n  return (\n    <FormLayout {...props}>\n      {getFieldsFromSchema(schema).map(\n        ({\n          name,\n          type,\n          defaultValue,\n          ...fieldProps\n        }: FieldProps): React.ReactNode => {\n          if (type === 'array') {\n            return (\n              <ArrayField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ArrayField>\n            )\n          } else if (type === 'object') {\n            return (\n              <ObjectField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ObjectField>\n            )\n          }\n\n          return <Field key={name} name={name} type={type} {...fieldProps} />\n        }\n      )}\n    </FormLayout>\n  )\n}\n","import * as React from 'react'\n\nimport { chakra, HTMLChakraProps, forwardRef } from '@chakra-ui/react'\n\nimport {\n  useForm,\n  FormProvider,\n  UseFormProps,\n  FieldErrors,\n  FieldValues,\n} from 'react-hook-form'\n\nimport { yupResolver } from './resolvers/yup'\n\ninterface FormOptions {\n  schema?: any\n  submitLabel?: false | string\n  onSubmit: (arg: any) => Promise<any> | void\n  onError?: (errors: FieldErrors) => void\n}\n\nexport interface FormProps<TFieldValues extends FieldValues = FieldValues>\n  extends UseFormProps<TFieldValues>,\n    Omit<HTMLChakraProps<'form'>, 'onSubmit' | 'onError'>,\n    FormOptions {}\n\n/**\n * @todo Figure out how to pass down FieldValues to all Field components,\n * if at all possible.\n */\nexport const Form = forwardRef(\n  <TFieldValues extends FieldValues = FieldValues>(\n    props: FormProps<TFieldValues>,\n    ref: React.ForwardedRef<HTMLFormElement>\n  ) => {\n    const {\n      mode = 'all',\n      resolver,\n      reValidateMode,\n      shouldFocusError,\n      shouldUnregister,\n      shouldUseNativeValidation,\n      criteriaMode,\n      delayError,\n      schema,\n      defaultValues,\n      onSubmit,\n      onError,\n      children,\n      ...rest\n    } = props\n\n    const form = {\n      mode,\n      resolver,\n      defaultValues,\n      reValidateMode,\n      shouldFocusError,\n      shouldUnregister,\n      shouldUseNativeValidation,\n      criteriaMode,\n      delayError,\n    }\n\n    // @todo remove yup dependency and just use resolver prop?\n    if (schema) {\n      form.resolver = yupResolver(schema)\n    }\n\n    const methods = useForm<TFieldValues>(form)\n    const { handleSubmit } = methods\n\n    return (\n      <FormProvider {...methods}>\n        <chakra.form\n          ref={ref}\n          onSubmit={handleSubmit(onSubmit, onError)}\n          {...rest}\n        >\n          {children}\n        </chakra.form>\n      </FormProvider>\n    )\n  }\n) as <TFieldValues extends FieldValues>(\n  props: FormProps<TFieldValues> & { ref?: React.ForwardedRef<HTMLFormElement> }\n) => React.ReactElement\n","import * as React from 'react'\n\nimport { useFormContext } from 'react-hook-form'\n\nimport { Button, ButtonProps } from '@saas-ui/button'\n\nimport { forwardRef } from '@chakra-ui/system'\n\nexport const SubmitButton = forwardRef<ButtonProps, 'button'>(\n  ({ children, ...props }, ref) => {\n    const data = useFormContext()\n\n    return (\n      <Button\n        type=\"submit\"\n        isLoading={data.formState.isSubmitting}\n        isPrimary\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </Button>\n    )\n  }\n)\n","import * as React from 'react'\nimport { FieldValues } from 'react-hook-form'\nimport { forwardRef } from '@chakra-ui/react'\n\nimport { Form, FormProps } from './form'\n\nimport { FormLayout } from './layout'\nimport { Fields } from './fields'\nimport { SubmitButton } from './submit-button'\n\ninterface AutoFormOptions {\n  schema: any\n  submitLabel?: false | string\n}\n\nexport interface AutoFormProps<TFieldValues extends FieldValues>\n  extends Omit<FormProps<TFieldValues>, 'schema'>,\n    AutoFormOptions {}\n\nexport const AutoForm = forwardRef(\n  <TFieldValues extends FieldValues = FieldValues>(\n    props: AutoFormProps<TFieldValues>,\n    ref: React.ForwardedRef<HTMLFormElement>\n  ) => {\n    const { schema, submitLabel, ...rest } = props\n    return (\n      <Form {...rest} schema={schema} ref={ref}>\n        <FormLayout>\n          {<Fields schema={schema} />}\n          {submitLabel && <SubmitButton label={submitLabel} />}\n        </FormLayout>\n      </Form>\n    )\n  }\n)\n\nAutoForm.defaultProps = {\n  submitLabel: 'Submit',\n}\n","import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  Text,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n} from '@chakra-ui/react'\n\nimport { FieldProps } from './field'\n\nexport interface DisplayFieldProps\n  extends FormControlProps,\n    Omit<FieldProps, 'type' | 'label'> {}\n\nexport const DisplayField: React.FC<DisplayFieldProps> = ({\n  name,\n  label,\n  placeholder,\n  ...props\n}) => {\n  const { getValues } = useFormContext()\n\n  return (\n    <FormControl {...props}>\n      {label ? <FormLabel htmlFor={name}>{label}</FormLabel> : null}\n      <Text fontSize=\"md\">{getValues(name)}</Text>\n    </FormControl>\n  )\n}\n"],"names":["inputTypes","BaseField","props","name","label","help","variant","hideLabel","children","controlProps","error","formState","get","errors","getError","useFormContext","React","FormControl","isInvalid","FormLabel","Box","message","FormHelperText","FormErrorMessage","Field","forwardRef","ref","type","withControlledInput","InputComponent","rules","inputProps","Controller","control","render","field","_ref","useMergeRefs","withUncontrolledInput","register","registerFieldType","component","options","displayName","isDisabled","isReadOnly","isRequired","createField","isControlled","split","map","part","charAt","toUpperCase","slice","join","InputField","Input","NumberInputField","NumberInput","PasswordInputFIeld","PasswordInput","TextareaField","Textarea","SwitchField","Switch","SelectField","Select","CheckboxField","Checkbox","RadioField","RadioInput","PinField","PinInput","NativeSelectField","NativeSelect","getType","spec","meta","_field$spec$meta","getArrayOption","tests","test","OPTIONS","_test$OPTIONS","params","getFieldsFromSchema","schema","schemaFields","fields","innerType","min","max","push","FormLayoutItem","chakra","div","FormLayout","gridProps","useTheme","components","_theme$components","_theme$components$For2","defaultProps","spacing","SimpleGrid","Children","child","isValidElement","mapNestedFields","cloneElement","createContext","ArrayFieldProvider","useArrayFieldContext","ArrayFieldRowProvider","useArrayFieldRowContext","useArrayField","defaultValue","keyName","useFieldArray","useArrayFieldRow","index","clearErrors","remove","useEffect","isFirst","isLast","length","useCallback","useArrayFieldRemoveButton","onClick","useArrayFieldAddButton","append","shouldFocus","ArrayFieldRow","ArrayFieldRowContainer","ArrayFieldRowFields","columns","ArrayFieldRemoveButton","layoutProps","flex","gridGap","mr","context","value","__css","display","flexDirection","alignItems","width","mb","IconButton","icon","MinusIcon","ArrayFieldAddButton","AddIcon","float","ArrayField","containerProps","ArrayFieldContainer","ArrayFieldRows","key","id","fieldProps","ObjectField","getNestedFields","path","reach","getNestedSchema","nestedFieldProps","Fields","Form","mode","resolver","reValidateMode","shouldFocusError","shouldUnregister","shouldUseNativeValidation","criteriaMode","delayError","defaultValues","onSubmit","onError","rest","form","yupResolver","methods","useForm","FormProvider","handleSubmit","SubmitButton","data","Button","isLoading","isSubmitting","isPrimary","AutoForm","submitLabel","getValues","htmlFor","Text","fontSize"],"mappings":"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"}

package/dist/index.modern.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{useFormContext as t,get as r,Controller as l,useFieldArray as n,useForm as a,FormProvider as i}from"react-hook-form";import{FormControl as m,FormLabel as s,Text as o,forwardRef as c,Switch as u,Checkbox as d,Box as p,FormHelperText as f,FormErrorMessage as h,useMergeRefs as b,Input as E,Textarea as y,useTheme as v,SimpleGrid as x,chakra as g}from"@chakra-ui/react";import{NumberInput as k}from"@saas-ui/number-input";import{PasswordInput as C}from"@saas-ui/password-input";import{RadioInput as O}from"@saas-ui/radio";import{PinInput as L}from"@saas-ui/pin-input";import{Select as V,NativeSelect as F}from"@saas-ui/select";import{reach as w}from"yup";import{yupResolver as S}from"@hookform/resolvers/yup";import{chakra as N,forwardRef as R}from"@chakra-ui/system";import{MinusIcon as j,AddIcon as I}from"@chakra-ui/icons";import{IconButton as D,Button as P}from"@saas-ui/button";import{createContext as $}from"@chakra-ui/react-utils";export*from"@saas-ui/input-right-button";function A(){return A=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var l in r)Object.prototype.hasOwnProperty.call(r,l)&&(e[l]=r[l])}return e},A.apply(this,arguments)}function q(e,t){if(null==e)return{};var r,l,n={},a=Object.keys(e);for(l=0;l<a.length;l++)t.indexOf(r=a[l])>=0||(n[r]=e[r]);return n}const B=["name","label","placeholder"],T=r=>{let{name:l,label:n}=r,a=q(r,B);const{getValues:i}=t();/*#__PURE__*/return e.createElement(m,a,n?/*#__PURE__*/e.createElement(s,{htmlFor:l},n):null,/*#__PURE__*/e.createElement(o,{fontSize:"md"},i(l)))},G=["name","label","help","variant","hideLabel","children"],_=["label","isDisabled","isInvalid","isReadOnly","isRequired","isOptional","variant"],z=["name","rules"],U=["ref"],H=["name","rules"],J=["ref"],K=["label"],M=["label"],Q={},W="text",X=l=>{const{name:n,label:a,help:i,variant:o,hideLabel:c,children:u}=l,d=q(l,G),{formState:b}=t(),E=((e,t)=>r(t.errors,e))(n,b);/*#__PURE__*/return e.createElement(m,A({isInvalid:!!E,variant:o},d),a&&!c?/*#__PURE__*/e.createElement(s,{variant:o},a):null,/*#__PURE__*/e.createElement(p,null,u,!i||null!=E&&E.message?null:/*#__PURE__*/e.createElement(f,null,i),(null==E?void 0:E.message)&&/*#__PURE__*/e.createElement(h,null,null==E?void 0:E.message)))},Y=c((t,r)=>{const{type:l=W}=t,n=(e=>Q[e]||Q[W])(l);/*#__PURE__*/return e.createElement(n,A({ref:r},t))}),Z=r=>c((n,a)=>{let{name:i,rules:m}=n,s=q(n,z);const{control:o}=t();/*#__PURE__*/return e.createElement(l,{name:i,control:o,rules:m,render:t=>{let{field:{ref:l}}=t,n=q(t.field,U);/*#__PURE__*/return e.createElement(r,A({},n,s,{ref:b(a,l)}))}})}),ee=r=>c((l,n)=>{let{name:a,rules:i}=l,m=q(l,H);const{register:s}=t(),o=s(a,i),{ref:c}=o,u=q(o,J);/*#__PURE__*/return e.createElement(r,A({},u,m,{ref:b(n,c)}))}),te=(t,r,l)=>{let n;n=null!=l&&l.isControlled?Z(r):ee(r);const a=((t,{displayName:r,hideLabel:l,BaseField:n})=>{const a=c((r,a)=>{const{label:i,isDisabled:m,isInvalid:s,isReadOnly:o,isRequired:c,isOptional:u,variant:d}=r,p=q(r,_);/*#__PURE__*/return e.createElement(n,{label:i,hideLabel:l,isDiabled:m,isInvalid:s,isReadOnly:o,isRequired:c,isOptional:u,variant:d},/*#__PURE__*/e.createElement(t,A({ref:a,label:i},p)))});return a.displayName=r,a})(n,{displayName:`${t.split("-").map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join("")}Field`,hideLabel:null==l?void 0:l.hideLabel,BaseField:(null==l?void 0:l.BaseField)||X});return Q[t]=a,a},re=te("text",E),le=te("number",k,{isControlled:!0}),ne=te("password",C),ae=te("textarea",y),ie=te("switch",c((t,r)=>{let{label:l}=t,n=q(t,K);/*#__PURE__*/return e.createElement(u,A({ref:r},n),l)}),{isControlled:!0,hideLabel:!0}),me=te("select",V,{isControlled:!0}),se=te("checkbox",c((t,r)=>{let{label:l}=t,n=q(t,M);/*#__PURE__*/return e.createElement(d,A({ref:r},n),l)}),{hideLabel:!0}),oe=te("radio",O,{isControlled:!0}),ce=te("pin",L,{isControlled:!0}),ue=te("native-select",F,{isControlled:!0}),de=S,pe=e=>{var t;if(null!=(t=e.spec.meta)&&t.type)return e.spec.meta.type;switch(e.type){case"array":return"array";case"object":return"object";case"number":return"number";case"date":return"date";default:return"text"}},fe=(e,t)=>{for(const l of e.tests){var r;if(null!=(r=l.OPTIONS)&&r.params[t])return l.OPTIONS.params[t]}},he=e=>{const t=[];let r={};r="array"===e.type?e.innerType.fields:e.fields;for(const e in r){const l=r[e],n={};"array"===l.type&&(n.min=fe(l,"min"),n.max=fe(l,"max")),t.push(A({name:e,label:l.spec.label||e,type:pe(l)},n))}return t},be=["children"],Ee=({children:t})=>/*#__PURE__*/e.createElement(g.div,null,t),ye=t=>{var r,l,n;let{children:a}=t,i=q(t,be);const m=A({},null!=(r=null==(l=v().components)||null==(n=l.FormLayout)?void 0:n.defaultProps)?r:{spacing:4},i);/*#__PURE__*/return e.createElement(x,m,e.Children.map(a,t=>e.isValidElement(t)?/*#__PURE__*/e.createElement(Ee,null,t):t))},ve=(t,r)=>e.Children.map(r,r=>e.isValidElement(r)&&r.props.name?e.cloneElement(r,A({},r.props,{name:`${t}.${r.props.name}`})):r),[xe,ge]=$({name:"ArrayFieldContext"}),[ke,Ce]=$({name:"ArrayFieldRowContext"}),Oe=({name:e,defaultValue:r={},keyName:l,min:a,max:i})=>{const{control:m}=t();return A({},n({control:m,name:e,keyName:l}),{name:e,defaultValue:r,min:a,max:i})},Le=({index:r})=>{const{clearErrors:l}=t(),{name:n,remove:a,fields:i}=ge();return e.useEffect(()=>{l(n)},[]),{index:r,isFirst:0===r,isLast:r===i.length-1,name:`${n}.${r}`,remove:e.useCallback(()=>{l(n),a(r)},[r])}},Ve=()=>{const{isFirst:e,remove:t}=Ce(),{min:r,fields:l}=ge();return{onClick:()=>t(),isDisabled:e&&!!(r&&l.length<=r)}},Fe=()=>{const{append:e,defaultValue:t,max:r,fields:l}=ge();return{onClick:()=>e(t,{shouldFocus:!1}),isDisabled:!!(r&&l.length>=r)}},we=["children","columns","spacing"],Se=["children"],Ne=["name","defaultValue","keyName","min","max","children"],Re=({children:t,columns:r,spacing:l,index:n})=>/*#__PURE__*/e.createElement(Ie,{index:n},/*#__PURE__*/e.createElement(je,{columns:r,spacing:l},t),/*#__PURE__*/e.createElement(De,null)),je=t=>{let{children:r,columns:l,spacing:n}=t,a=q(t,we);const{name:i}=Ce();/*#__PURE__*/return e.createElement(ye,A({flex:"1",columns:l,gridGap:n,mr:"2"},a),ve(i,r))},Ie=({children:t,index:r})=>{const l=Le({index:r});/*#__PURE__*/return e.createElement(ke,{value:l},/*#__PURE__*/e.createElement(N.div,{__css:{display:"flex",flexDirection:"row",alignItems:"flex-end",width:"100%",mb:4}},t))},De=t=>/*#__PURE__*/e.createElement(D,A({icon:/*#__PURE__*/e.createElement(j,null),"aria-label":"Remove row"},Ve(),t)),Pe=t=>/*#__PURE__*/e.createElement(D,A({icon:/*#__PURE__*/e.createElement(I,null),"aria-label":"Add row",float:"right"},Fe(),t)),$e=t=>{const{children:r}=t,l=q(t,Se);/*#__PURE__*/return e.createElement(qe,l,/*#__PURE__*/e.createElement(Ae,null,t=>/*#__PURE__*/e.createElement(e.Fragment,null,t.map(({id:t},l)=>/*#__PURE__*/e.createElement(Re,{key:t,index:l},r)))),/*#__PURE__*/e.createElement(Pe,null))},Ae=({children:e})=>{const{fields:t}=ge();return e(t)},qe=t=>{let{name:r,defaultValue:l,keyName:n,min:a,max:i,children:m}=t,s=q(t,Ne);const o=Oe({name:r,defaultValue:l,keyName:n,min:a,max:i});/*#__PURE__*/return e.createElement(xe,{value:o},/*#__PURE__*/e.createElement(X,A({name:r},s),m))},Be=["name","children","columns","spacing"],Te=t=>{const{name:r,children:l,columns:n,spacing:a}=t,i=q(t,Be);/*#__PURE__*/return e.createElement(X,A({name:r},i),/*#__PURE__*/e.createElement(ye,{columns:n,gridGap:a},ve(r,l)))},Ge=["name","type"],_e=["schema"],ze=["name","type","defaultValue"],Ue=(t,r)=>he(((e,t)=>w(e,t))(t,r)).map(t=>{let{name:r,type:l}=t,n=q(t,Ge);/*#__PURE__*/return e.createElement(Y,A({key:r,name:r,type:l},n))}),He=t=>{let{schema:r}=t,l=q(t,_e);/*#__PURE__*/return e.createElement(ye,l,he(r).map(t=>{let{name:l,type:n}=t,a=q(t,ze);return"array"===n?/*#__PURE__*/e.createElement($e,A({name:l},a),Ue(r,l)):"object"===n?/*#__PURE__*/e.createElement(Te,A({name:l},a),Ue(r,l)):/*#__PURE__*/e.createElement(Y,A({key:l,name:l,type:n},a))}))},Je=["schema","defaultValues","onSubmit","onError","children"],Ke=c((t,r)=>{let{schema:l,defaultValues:n,onSubmit:m,onError:s,children:o}=t,c=q(t,Je);const u={mode:"all",defaultValues:n};l&&(u.resolver=de(l));const d=a(u),{handleSubmit:p}=d;/*#__PURE__*/return e.createElement(i,d,/*#__PURE__*/e.createElement(g.form,A({ref:r,onSubmit:p(m,s)},c),o))}),Me=["children"],Qe=R((r,l)=>{let{children:n}=r,a=q(r,Me);const i=t();/*#__PURE__*/return e.createElement(P,A({type:"submit",isLoading:i.formState.isSubmitting,isPrimary:!0,ref:l},a),n)}),We=["schema","submitLabel"],Xe=c((t,r)=>{let{schema:l,submitLabel:n}=t,a=q(t,We);/*#__PURE__*/return e.createElement(Ke,A({},a,{schema:l,ref:r}),/*#__PURE__*/e.createElement(ye,null,/*#__PURE__*/e.createElement(He,{schema:l}),n&&/*#__PURE__*/e.createElement(Qe,{label:n})))});Xe.defaultProps={submitLabel:"Submit"};export{$e as ArrayField,Pe as ArrayFieldAddButton,qe as ArrayFieldContainer,xe as ArrayFieldProvider,De as ArrayFieldRemoveButton,Re as ArrayFieldRow,Ie as ArrayFieldRowContainer,je as ArrayFieldRowFields,ke as ArrayFieldRowProvider,Ae as ArrayFieldRows,Xe as AutoForm,X as BaseField,se as CheckboxField,T as DisplayField,Y as Field,He as Fields,Ke as Form,ye as FormLayout,re as InputField,ue as NativeSelectField,le as NumberInputField,Te as ObjectField,ne as PasswordInputFIeld,ce as PinField,oe as RadioField,me as SelectField,Qe as SubmitButton,ie as SwitchField,ae as TextareaField,te as registerFieldType,Oe as useArrayField,Fe as useArrayFieldAddButton,ge as useArrayFieldContext,Ve as useArrayFieldRemoveButton,Le as useArrayFieldRow,Ce as useArrayFieldRowContext,Z as withControlledInput,ee as withUncontrolledInput};
+import*as e from"react";import{useFormContext as r,get as t,Controller as a,useFieldArray as l,useForm as n,FormProvider as i}from"react-hook-form";import{FormControl as m,FormLabel as s,Text as o,forwardRef as c,Switch as u,Checkbox as d,Box as p,FormHelperText as f,FormErrorMessage as h,useMergeRefs as E,Input as b,Textarea as y,useTheme as v,SimpleGrid as g,chakra as x}from"@chakra-ui/react";import{NumberInput as k}from"@saas-ui/number-input";import{PasswordInput as V}from"@saas-ui/password-input";import{RadioInput as C}from"@saas-ui/radio";import{PinInput as F}from"@saas-ui/pin-input";import{Select as L,NativeSelect as N}from"@saas-ui/select";import{reach as O}from"yup";import{yupResolver as w}from"@hookform/resolvers/yup";import{chakra as S,forwardRef as R}from"@chakra-ui/system";import{MinusIcon as j,AddIcon as I}from"@chakra-ui/icons";import{IconButton as U,Button as D}from"@saas-ui/button";import{createContext as M}from"@chakra-ui/react-utils";export*from"@saas-ui/input-right-button";function P(){return P=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},P.apply(this,arguments)}function $(e,r){if(null==e)return{};var t,a,l={},n=Object.keys(e);for(a=0;a<n.length;a++)r.indexOf(t=n[a])>=0||(l[t]=e[t]);return l}const A=["name","label","placeholder"],q=t=>{let{name:a,label:l}=t,n=$(t,A);const{getValues:i}=r();/*#__PURE__*/return e.createElement(m,n,l?/*#__PURE__*/e.createElement(s,{htmlFor:a},l):null,/*#__PURE__*/e.createElement(o,{fontSize:"md"},i(a)))},B=["name","label","help","variant","hideLabel","children"],T=["name","label","isDisabled","isInvalid","isReadOnly","isRequired","variant"],G=["name","rules"],_=["ref"],z=["name","rules"],H=["ref"],J=["label"],K=["label"],Q={},W="text",X=a=>{const{name:l,label:n,help:i,variant:o,hideLabel:c,children:u}=a,d=$(a,B),{formState:E}=r(),b=((e,r)=>t(r.errors,e))(l,E);/*#__PURE__*/return e.createElement(m,P({variant:o},d,{isInvalid:!!b}),n&&!c?/*#__PURE__*/e.createElement(s,{variant:o},n):null,/*#__PURE__*/e.createElement(p,null,u,!i||null!=b&&b.message?null:/*#__PURE__*/e.createElement(f,null,i),(null==b?void 0:b.message)&&/*#__PURE__*/e.createElement(h,null,null==b?void 0:b.message)))},Y=c((r,t)=>{const{type:a=W}=r,l=(e=>Q[e]||Q[W])(a);/*#__PURE__*/return e.createElement(l,P({ref:t},r))}),Z=t=>c((l,n)=>{let{name:i,rules:m}=l,s=$(l,G);const{control:o}=r();/*#__PURE__*/return e.createElement(a,{name:i,control:o,rules:m,render:r=>{let{field:{ref:a}}=r,l=$(r.field,_);/*#__PURE__*/return e.createElement(t,P({},l,s,{ref:E(n,a)}))}})}),ee=t=>c((a,l)=>{let{name:n,rules:i}=a,m=$(a,z);const{register:s}=r(),o=s(n,i),{ref:c}=o,u=$(o,H);/*#__PURE__*/return e.createElement(t,P({},u,m,{ref:E(l,c)}))}),re=(r,t,a)=>{let l;l=null!=a&&a.isControlled?Z(t):ee(t);const n=((r,{displayName:t,hideLabel:a,BaseField:l})=>{const n=c((t,n)=>{const{name:i,label:m,isDisabled:s,isInvalid:o,isReadOnly:c,isRequired:u,variant:d}=t,p=$(t,T);/*#__PURE__*/return e.createElement(l,{name:i,label:m,hideLabel:a,isDisabled:s,isInvalid:o,isReadOnly:c,isRequired:u,variant:d},/*#__PURE__*/e.createElement(r,P({ref:n,name:i,label:m},p)))});return n.displayName=t,n})(l,{displayName:`${r.split("-").map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join("")}Field`,hideLabel:null==a?void 0:a.hideLabel,BaseField:(null==a?void 0:a.BaseField)||X});return Q[r]=n,n},te=re("text",b),ae=re("number",k,{isControlled:!0}),le=re("password",V),ne=re("textarea",y),ie=re("switch",c((r,t)=>{let{label:a}=r,l=$(r,J);/*#__PURE__*/return e.createElement(u,P({ref:t},l),a)}),{isControlled:!0,hideLabel:!0}),me=re("select",L,{isControlled:!0}),se=re("checkbox",c((r,t)=>{let{label:a}=r,l=$(r,K);/*#__PURE__*/return e.createElement(d,P({ref:t},l),a)}),{hideLabel:!0}),oe=re("radio",C,{isControlled:!0}),ce=re("pin",F,{isControlled:!0}),ue=re("native-select",N,{isControlled:!0}),de=e=>{var r;if(null!=(r=e.spec.meta)&&r.type)return e.spec.meta.type;switch(e.type){case"array":return"array";case"object":return"object";case"number":return"number";case"date":return"date";default:return"text"}},pe=(e,r)=>{for(const a of e.tests){var t;if(null!=(t=a.OPTIONS)&&t.params[r])return a.OPTIONS.params[r]}},fe=e=>{const r=[];let t={};t="array"===e.type?e.innerType.fields:e.fields;for(const e in t){const a=t[e],l={};"array"===a.type&&(l.min=pe(a,"min"),l.max=pe(a,"max")),r.push(P({name:e,label:a.spec.label||e,type:de(a)},l))}return r},he=["children"],Ee=({children:r})=>/*#__PURE__*/e.createElement(x.div,null,r),be=r=>{var t,a,l;let{children:n}=r,i=$(r,he);const m=P({},null!=(t=null==(a=v().components)||null==(l=a.FormLayout)?void 0:l.defaultProps)?t:{spacing:4},i);/*#__PURE__*/return e.createElement(g,m,e.Children.map(n,r=>e.isValidElement(r)?/*#__PURE__*/e.createElement(Ee,null,r):r))},ye=(r,t)=>e.Children.map(t,t=>e.isValidElement(t)&&t.props.name?e.cloneElement(t,P({},t.props,{name:`${r}.${t.props.name}`})):t),[ve,ge]=M({name:"ArrayFieldContext"}),[xe,ke]=M({name:"ArrayFieldRowContext"}),Ve=({name:e,defaultValue:t={},keyName:a,min:n,max:i})=>{const{control:m}=r();return P({},l({control:m,name:e,keyName:a}),{name:e,defaultValue:t,min:n,max:i})},Ce=({index:t})=>{const{clearErrors:a}=r(),{name:l,remove:n,fields:i}=ge();return e.useEffect(()=>{a(l)},[]),{index:t,isFirst:0===t,isLast:t===i.length-1,name:`${l}.${t}`,remove:e.useCallback(()=>{a(l),n(t)},[t])}},Fe=()=>{const{isFirst:e,remove:r}=ke(),{min:t,fields:a}=ge();return{onClick:()=>r(),isDisabled:e&&!!(t&&a.length<=t)}},Le=()=>{const{append:e,defaultValue:r,max:t,fields:a}=ge();return{onClick:()=>e(r,{shouldFocus:!1}),isDisabled:!!(t&&a.length>=t)}},Ne=["children","columns","spacing"],Oe=["children"],we=["name","defaultValue","keyName","min","max","children"],Se=({children:r,columns:t,spacing:a,index:l})=>/*#__PURE__*/e.createElement(je,{index:l},/*#__PURE__*/e.createElement(Re,{columns:t,spacing:a},r),/*#__PURE__*/e.createElement(Ie,null)),Re=r=>{let{children:t,columns:a,spacing:l}=r,n=$(r,Ne);const{name:i}=ke();/*#__PURE__*/return e.createElement(be,P({flex:"1",columns:a,gridGap:l,mr:"2"},n),ye(i,t))},je=({children:r,index:t})=>{const a=Ce({index:t});/*#__PURE__*/return e.createElement(xe,{value:a},/*#__PURE__*/e.createElement(S.div,{__css:{display:"flex",flexDirection:"row",alignItems:"flex-end",width:"100%",mb:4}},r))},Ie=r=>/*#__PURE__*/e.createElement(U,P({icon:/*#__PURE__*/e.createElement(j,null),"aria-label":"Remove row"},Fe(),r)),Ue=r=>/*#__PURE__*/e.createElement(U,P({icon:/*#__PURE__*/e.createElement(I,null),"aria-label":"Add row",float:"right"},Le(),r)),De=r=>{const{children:t}=r,a=$(r,Oe);/*#__PURE__*/return e.createElement(Pe,a,/*#__PURE__*/e.createElement(Me,null,r=>/*#__PURE__*/e.createElement(e.Fragment,null,r.map(({id:r},a)=>/*#__PURE__*/e.createElement(Se,{key:r,index:a},t)))),/*#__PURE__*/e.createElement(Ue,null))},Me=({children:e})=>{const{fields:r}=ge();return e(r)},Pe=r=>{let{name:t,defaultValue:a,keyName:l,min:n,max:i,children:m}=r,s=$(r,we);const o=Ve({name:t,defaultValue:a,keyName:l,min:n,max:i});/*#__PURE__*/return e.createElement(ve,{value:o},/*#__PURE__*/e.createElement(X,P({name:t},s),m))},$e=["name","children","columns","spacing"],Ae=r=>{const{name:t,children:a,columns:l,spacing:n}=r,i=$(r,$e);/*#__PURE__*/return e.createElement(X,P({name:t},i),/*#__PURE__*/e.createElement(be,{columns:l,gridGap:n},ye(t,a)))},qe=["name","type"],Be=["schema"],Te=["name","type","defaultValue"],Ge=(r,t)=>fe(((e,r)=>O(e,r))(r,t)).map(r=>{let{name:t,type:a}=r,l=$(r,qe);/*#__PURE__*/return e.createElement(Y,P({key:t,name:t,type:a},l))}),_e=r=>{let{schema:t}=r,a=$(r,Be);/*#__PURE__*/return e.createElement(be,a,fe(t).map(r=>{let{name:a,type:l}=r,n=$(r,Te);return"array"===l?/*#__PURE__*/e.createElement(De,P({name:a},n),Ge(t,a)):"object"===l?/*#__PURE__*/e.createElement(Ae,P({name:a},n),Ge(t,a)):/*#__PURE__*/e.createElement(Y,P({key:a,name:a,type:l},n))}))},ze=["mode","resolver","reValidateMode","shouldFocusError","shouldUnregister","shouldUseNativeValidation","criteriaMode","delayError","schema","defaultValues","onSubmit","onError","children"],He=c((r,t)=>{const{mode:a="all",resolver:l,reValidateMode:m,shouldFocusError:s,shouldUnregister:o,shouldUseNativeValidation:c,criteriaMode:u,delayError:d,schema:p,defaultValues:f,onSubmit:h,onError:E,children:b}=r,y=$(r,ze),v={mode:a,resolver:l,defaultValues:f,reValidateMode:m,shouldFocusError:s,shouldUnregister:o,shouldUseNativeValidation:c,criteriaMode:u,delayError:d};p&&(v.resolver=w(p));const g=n(v),{handleSubmit:k}=g;/*#__PURE__*/return e.createElement(i,g,/*#__PURE__*/e.createElement(x.form,P({ref:t,onSubmit:k(h,E)},y),b))}),Je=["children"],Ke=R((t,a)=>{let{children:l}=t,n=$(t,Je);const i=r();/*#__PURE__*/return e.createElement(D,P({type:"submit",isLoading:i.formState.isSubmitting,isPrimary:!0,ref:a},n),l)}),Qe=["schema","submitLabel"],We=c((r,t)=>{const{schema:a,submitLabel:l}=r,n=$(r,Qe);/*#__PURE__*/return e.createElement(He,P({},n,{schema:a,ref:t}),/*#__PURE__*/e.createElement(be,null,/*#__PURE__*/e.createElement(_e,{schema:a}),l&&/*#__PURE__*/e.createElement(Ke,{label:l})))});We.defaultProps={submitLabel:"Submit"};export{De as ArrayField,Ue as ArrayFieldAddButton,Pe as ArrayFieldContainer,ve as ArrayFieldProvider,Ie as ArrayFieldRemoveButton,Se as ArrayFieldRow,je as ArrayFieldRowContainer,Re as ArrayFieldRowFields,xe as ArrayFieldRowProvider,Me as ArrayFieldRows,We as AutoForm,X as BaseField,se as CheckboxField,q as DisplayField,Y as Field,_e as Fields,He as Form,be as FormLayout,te as InputField,ue as NativeSelectField,ae as NumberInputField,Ae as ObjectField,le as PasswordInputFIeld,ce as PinField,oe as RadioField,me as SelectField,Ke as SubmitButton,ie as SwitchField,ne as TextareaField,re as registerFieldType,Ve as useArrayField,Le as useArrayFieldAddButton,ge as useArrayFieldContext,Fe as useArrayFieldRemoveButton,Ce as useArrayFieldRow,ke as useArrayFieldRowContext,Z as withControlledInput,ee as withUncontrolledInput};
 //# sourceMappingURL=index.modern.js.map

package/dist/index.modern.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.modern.js","sources":["../src/display-field.tsx","../src/field.tsx","../src/resolvers/yup.ts","../src/layout.tsx","../src/utils.ts","../src/use-array-field.tsx","../src/array-field.tsx","../src/object-field.tsx","../src/fields.tsx","../src/form.tsx","../src/submit-button.tsx","../src/auto-form.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  Text,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n} from '@chakra-ui/react'\n\nimport { FieldProps } from './Field'\n\nexport interface DisplayFieldProps\n  extends FormControlProps,\n    Omit<FieldProps, 'type' | 'label'> {}\n\nexport const DisplayField: React.FC<DisplayFieldProps> = ({\n  name,\n  label,\n  placeholder,\n  ...props\n}) => {\n  const { getValues } = useFormContext()\n\n  return (\n    <FormControl {...props}>\n      {label ? <FormLabel htmlFor={name}>{label}</FormLabel> : null}\n      <Text fontSize=\"md\">{getValues(name)}</Text>\n    </FormControl>\n  )\n}\n","import * as React from 'react'\nimport { useFormContext, FormState, Controller, get } from 'react-hook-form'\n\nimport {\n  forwardRef,\n  Box,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n  FormHelperText,\n  FormErrorMessage,\n  Input,\n  Textarea,\n  Checkbox,\n  Switch,\n  useMergeRefs,\n} from '@chakra-ui/react'\n\nimport { NumberInput } from '@saas-ui/number-input'\nimport { PasswordInput } from '@saas-ui/password-input'\nimport { RadioInput } from '@saas-ui/radio'\nimport { PinInput } from '@saas-ui/pin-input'\nimport { Select, NativeSelect } from '@saas-ui/select'\n\nexport interface FieldProps extends Omit<FormControlProps, 'label'> {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * The field label\n   */\n  label?: string\n  /**\n   * Hide the field label\n   */\n  hideLabel?: boolean\n  /**\n   * Field help text\n   */\n  help?: string\n  /**\n   * React hook form rules\n   */\n  rules?: any\n  /**\n   * Options used for selects and radio fields\n   */\n  options?: any\n  /**\n   * The field type\n   * Build-in types:\n   * - text\n   * - number\n   * - password\n   * - textarea\n   * - select\n   * - nativeselect\n   * - checkbox\n   * - radio\n   * - switch\n   * - pin\n   *\n   * Will default to a text field if there is no matching type.\n   * @default 'text'\n   */\n  type?: string\n  /**\n   * The input placeholder\n   */\n  placeholder?: string\n}\n\nconst inputTypes: Record<string, any> = {}\n\nconst defaultInputType = 'text'\n\nconst getInput = (type: string) => {\n  return inputTypes[type] || inputTypes[defaultInputType]\n}\n\nconst getError = (name: string, formState: FormState<{ [x: string]: any }>) => {\n  return get(formState.errors, name)\n}\n\nconst isTouched = (\n  name: string,\n  formState: FormState<{ [x: string]: any }>\n) => {\n  return get(formState.touchedFields, name)\n}\n\nexport const BaseField: React.FC<FieldProps> = (props) => {\n  const { name, label, help, variant, hideLabel, children, ...controlProps } =\n    props\n\n  const { formState } = useFormContext()\n\n  const error = getError(name, formState)\n\n  return (\n    <FormControl isInvalid={!!error} variant={variant} {...controlProps}>\n      {label && !hideLabel ? (\n        <FormLabel variant={variant}>{label}</FormLabel>\n      ) : null}\n      <Box>\n        {children}\n        {help && !error?.message ? (\n          <FormHelperText>{help}</FormHelperText>\n        ) : null}\n        {error?.message && (\n          <FormErrorMessage>{error?.message}</FormErrorMessage>\n        )}\n      </Box>\n    </FormControl>\n  )\n}\n\nexport const Field = forwardRef<FieldProps, typeof FormControl>(\n  (props, ref) => {\n    const { type = defaultInputType } = props\n    const InputComponent = getInput(type)\n\n    return <InputComponent ref={ref} {...props} />\n  }\n)\n\ninterface CreateFieldProps {\n  displayName: string\n  hideLabel?: boolean\n  BaseField: React.FC<any>\n}\n\nconst createField = (\n  InputComponent: React.FC<any>,\n  { displayName, hideLabel, BaseField }: CreateFieldProps\n) => {\n  const Field = forwardRef<FieldProps, typeof FormControl>((props, ref) => {\n    const {\n      label,\n      isDisabled,\n      isInvalid,\n      isReadOnly,\n      isRequired,\n      isOptional,\n      variant,\n      ...inputProps\n    } = props\n\n    return (\n      <BaseField\n        label={label}\n        hideLabel={hideLabel}\n        isDiabled={isDisabled}\n        isInvalid={isInvalid}\n        isReadOnly={isReadOnly}\n        isRequired={isRequired}\n        isOptional={isOptional}\n        variant={variant}\n      >\n        <InputComponent ref={ref} label={label} {...inputProps} />\n      </BaseField>\n    )\n  })\n  Field.displayName = displayName\n\n  return Field\n}\n\nexport const withControlledInput = (InputComponent: any) => {\n  return forwardRef(({ name, rules, ...inputProps }, ref) => {\n    const { control } = useFormContext()\n\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={rules}\n        render={({ field: { ref: _ref, ...field } }) => (\n          <InputComponent\n            {...field}\n            {...inputProps}\n            ref={useMergeRefs(ref, _ref)}\n          />\n        )}\n      />\n    )\n  })\n}\n\nexport const withUncontrolledInput = (InputComponent: any) => {\n  return forwardRef(({ name, rules, ...inputProps }, ref) => {\n    const { register } = useFormContext()\n\n    const { ref: _ref, ...field } = register(name, rules)\n\n    return (\n      <InputComponent\n        {...field}\n        {...inputProps}\n        ref={useMergeRefs(ref, _ref)}\n      />\n    )\n  })\n}\n\nexport interface RegisterFieldTypeOptions {\n  isControlled?: boolean\n  hideLabel?: boolean\n  BaseField?: React.FC<any>\n}\n\n/**\n * Register a new field type\n * @param type The name for this field in kebab-case, eg `email` or `array-field`\n * @param component The React component\n * @param options\n * @param options.isControlled Set this to true if this is a controlled field.\n * @param options.hideLabel Hide the field label, for example for checkbox or switch field.\n */\nexport const registerFieldType = (\n  type: string,\n  component: any,\n  options?: RegisterFieldTypeOptions\n) => {\n  let InputComponent\n  if (options?.isControlled) {\n    InputComponent = withControlledInput(component)\n  } else {\n    InputComponent = withUncontrolledInput(component)\n  }\n\n  const Field = createField(InputComponent, {\n    displayName: `${type\n      .split('-')\n      .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n      .join('')}Field`,\n    hideLabel: options?.hideLabel,\n    BaseField: options?.BaseField || BaseField,\n  })\n\n  inputTypes[type] = Field\n\n  return Field\n}\n\n// @todo Consider not registering all fields by default to lower the package size and computations.\n// Not all types may be required in a project.\nexport const InputField = registerFieldType('text', Input)\nexport const NumberInputField = registerFieldType('number', NumberInput, {\n  isControlled: true,\n})\nexport const PasswordInputFIeld = registerFieldType('password', PasswordInput)\nexport const TextareaField = registerFieldType('textarea', Textarea)\nexport const SwitchField = registerFieldType(\n  'switch',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Switch ref={ref} {...props}>\n        {label}\n      </Switch>\n    )\n  }),\n  {\n    isControlled: true,\n    hideLabel: true,\n  }\n)\nexport const SelectField = registerFieldType('select', Select, {\n  isControlled: true,\n})\nexport const CheckboxField = registerFieldType(\n  'checkbox',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Checkbox ref={ref} {...props}>\n        {label}\n      </Checkbox>\n    )\n  }),\n  {\n    hideLabel: true,\n  }\n)\nexport const RadioField = registerFieldType('radio', RadioInput, {\n  isControlled: true,\n})\nexport const PinField = registerFieldType('pin', PinInput, {\n  isControlled: true,\n})\nexport const NativeSelectField = registerFieldType(\n  'native-select',\n  NativeSelect,\n  { isControlled: true }\n)\n","import { SchemaOf, AnySchema, reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps } from '../Field'\n\nexport const resolver = yupResolver\n\n// @TODO get proper typings for the schema fields\n\nconst getType = (field: any) => {\n  if (field.spec.meta?.type) {\n    return field.spec.meta.type\n  }\n\n  switch (field.type) {\n    case 'array':\n      return 'array'\n    case 'object':\n      return 'object'\n    case 'number':\n      return 'number'\n    case 'date':\n      return 'date'\n    case 'string':\n    default:\n      return 'text'\n  }\n}\n\ntype Options = {\n  min?: number\n  max?: number\n}\n\nconst getArrayOption = (field: any, name: string) => {\n  for (const test of field.tests) {\n    if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n  }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (\n  schema: SchemaOf<AnySchema>\n): FieldProps[] => {\n  const fields = []\n\n  let schemaFields: Record<string, any> = {}\n  if (schema.type === 'array') {\n    /* @ts-ignore this is actually valid */\n    schemaFields = schema.innerType.fields\n  } else {\n    schemaFields = schema.fields\n  }\n\n  for (const name in schemaFields) {\n    const field = schemaFields[name]\n\n    const options: Options = {}\n    if (field.type === 'array') {\n      options.min = getArrayOption(field, 'min')\n      options.max = getArrayOption(field, 'max')\n    }\n\n    fields.push({\n      name,\n      label: field.spec.label || name,\n      type: getType(field),\n      ...options,\n    })\n  }\n  return fields\n}\n\nexport const getNestedSchema = (schema: SchemaOf<AnySchema>, path: string) => {\n  return reach(schema, path)\n}\n","import * as React from 'react'\n\nimport { chakra, SimpleGrid, SimpleGridProps, useTheme } from '@chakra-ui/react'\n\nexport type FormLayoutProps = SimpleGridProps\n\ninterface FormLayoutItemProps {\n  children: React.ReactNode\n}\n\nconst FormLayoutItem: React.FC<FormLayoutItemProps> = ({ children }) => {\n  return <chakra.div>{children}</chakra.div>\n}\n\nexport const FormLayout = ({ children, ...props }: FormLayoutProps) => {\n  const theme = useTheme()\n\n  const defaultProps = theme.components?.FormLayout?.defaultProps ?? {\n    spacing: 4,\n  }\n\n  const gridProps = {\n    ...defaultProps,\n    ...props,\n  }\n\n  return (\n    <SimpleGrid {...gridProps}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return <FormLayoutItem>{child}</FormLayoutItem>\n        }\n        return child\n      })}\n    </SimpleGrid>\n  )\n}\n","import * as React from 'react'\n\nexport const mapNestedFields = (name: string, children: React.ReactNode) => {\n  return React.Children.map(children, (child) => {\n    if (React.isValidElement(child) && child.props.name) {\n      return React.cloneElement(child, {\n        ...child.props,\n        name: `${name}.${child.props.name}`,\n      })\n    }\n    return child\n  })\n}\n","import * as React from 'react'\nimport {\n  useFieldArray,\n  useFormContext,\n  UseFieldArrayReturn,\n} from 'react-hook-form'\n\nimport { createContext } from '@chakra-ui/react-utils'\n\nexport interface UseArrayFieldReturn extends UseFieldArrayReturn {\n  /**\n   * The array field name\n   */\n  name: string\n  /**\n   * The default value for new items\n   */\n  defaultValue: Record<string, any>\n  /**\n   * Min amount of items\n   */\n  min?: number\n  /**\n   * Max amount of items\n   */\n  max?: number\n}\n\nexport const [ArrayFieldProvider, useArrayFieldContext] =\n  createContext<UseArrayFieldReturn>({\n    name: 'ArrayFieldContext',\n  })\n\nexport interface UseArrayFieldRowReturn {\n  /**\n   * Name of the array field including the index, eg 'field.0'\n   */\n  name: string\n  /**\n   * The field index\n   */\n  index: number\n  /**\n   * Remove this array item\n   */\n  remove: () => void\n  /**\n   * True if this is the first item\n   */\n  isFirst: boolean\n  /**\n   * True if this is the last item\n   */\n  isLast: boolean\n}\n\nexport const [ArrayFieldRowProvider, useArrayFieldRowContext] =\n  createContext<UseArrayFieldRowReturn>({\n    name: 'ArrayFieldRowContext',\n  })\n\nexport interface ArrayFieldOptions {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * Default value for new values in the array\n   */\n  defaultValue?: Record<string, any>\n  /**\n   * Default key name for rows, change this if your data uses 'id'\n   * @default \"id\"\n   */\n  keyName?: string\n  min?: number\n  max?: number\n}\n\nexport const useArrayField = ({\n  name,\n  defaultValue = {},\n  keyName,\n  min,\n  max,\n}: ArrayFieldOptions) => {\n  const { control } = useFormContext()\n  const context = useFieldArray({\n    control,\n    name,\n    keyName,\n  })\n\n  return {\n    ...context,\n    name,\n    defaultValue,\n    min,\n    max,\n  }\n}\n\nexport interface UseArrayFieldRowProps {\n  index: number\n}\n\nexport const useArrayFieldRow = ({ index }: UseArrayFieldRowProps) => {\n  const { clearErrors } = useFormContext()\n  const { name, remove, fields } = useArrayFieldContext()\n\n  React.useEffect(() => {\n    // reset errors, to make sure min/max errors reset correctly\n    clearErrors(name)\n  }, [])\n\n  return {\n    index,\n    isFirst: index === 0,\n    isLast: index === fields.length - 1,\n    name: `${name}.${index}`,\n    remove: React.useCallback(() => {\n      clearErrors(name)\n      remove(index)\n    }, [index]),\n  }\n}\n\nexport const useArrayFieldRemoveButton = () => {\n  const { isFirst, remove } = useArrayFieldRowContext()\n  const { min, fields } = useArrayFieldContext()\n\n  const isDisabled = isFirst && !!(min && fields.length <= min)\n\n  return {\n    onClick: () => remove(),\n    isDisabled,\n  }\n}\n\nexport const useArrayFieldAddButton = () => {\n  const { append, defaultValue, max, fields } = useArrayFieldContext()\n\n  const isDisabled = !!(max && fields.length >= max)\n\n  return {\n    onClick: () =>\n      append(defaultValue, {\n        shouldFocus: false,\n      }),\n    isDisabled,\n  }\n}\n","import * as React from 'react'\n\nimport { chakra, ResponsiveValue } from '@chakra-ui/system'\n\nimport { AddIcon, MinusIcon } from '@chakra-ui/icons'\nimport { IconButton, ButtonProps } from '@saas-ui/button'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nimport {\n  useArrayField,\n  useArrayFieldRow,\n  useArrayFieldContext,\n  ArrayFieldProvider,\n  ArrayFieldOptions,\n  ArrayFieldRowProvider,\n  useArrayFieldRowContext,\n  useArrayFieldRemoveButton,\n  useArrayFieldAddButton,\n} from './use-array-field'\n\ninterface ArrayField {\n  id: string\n  [key: string]: unknown\n}\n\ninterface ArrayFieldRowProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n  /**\n   * The array index\n   */\n  index: number\n}\n\nexport const ArrayFieldRow: React.FC<ArrayFieldRowProps> = ({\n  children,\n  columns,\n  spacing,\n  index,\n}) => {\n  return (\n    <ArrayFieldRowContainer index={index}>\n      <ArrayFieldRowFields columns={columns} spacing={spacing}>\n        {children}\n      </ArrayFieldRowFields>\n      <ArrayFieldRemoveButton />\n    </ArrayFieldRowContainer>\n  )\n}\n\nexport interface ArrayFieldRowFieldsProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ArrayFieldRowFields: React.FC<ArrayFieldRowFieldsProps> = ({\n  children,\n  columns,\n  spacing,\n  ...layoutProps\n}) => {\n  const { name } = useArrayFieldRowContext()\n  return (\n    <FormLayout\n      flex=\"1\"\n      columns={columns}\n      gridGap={spacing}\n      mr=\"2\"\n      {...layoutProps}\n    >\n      {mapNestedFields(name, children)}\n    </FormLayout>\n  )\n}\n\nexport const ArrayFieldRowContainer: React.FC<ArrayFieldRowProps> = ({\n  children,\n  index,\n}) => {\n  const context = useArrayFieldRow({ index })\n\n  const styles = {\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'flex-end',\n    width: '100%',\n    mb: 4,\n  }\n\n  return (\n    <ArrayFieldRowProvider value={context}>\n      <chakra.div __css={styles}>{children}</chakra.div>\n    </ArrayFieldRowProvider>\n  )\n}\n\nexport const ArrayFieldRemoveButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<MinusIcon />}\n      aria-label=\"Remove row\"\n      {...useArrayFieldRemoveButton()}\n      {...props}\n    />\n  )\n}\n\nexport const ArrayFieldAddButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<AddIcon />}\n      aria-label=\"Add row\"\n      float=\"right\"\n      {...useArrayFieldAddButton()}\n      {...props}\n    />\n  )\n}\n\nexport interface ArrayFieldProps\n  extends ArrayFieldOptions,\n    Omit<FieldProps, 'defaultValue'> {}\n\nexport const ArrayField: React.FC<ArrayFieldProps> = (props) => {\n  const { children, ...containerProps } = props\n\n  return (\n    <ArrayFieldContainer {...containerProps}>\n      <ArrayFieldRows>\n        {(fields: ArrayField[]) => (\n          <>\n            {fields.map(({ id }, index: number) => (\n              <ArrayFieldRow key={id} index={index}>\n                {children}\n              </ArrayFieldRow>\n            ))}\n          </>\n        )}\n      </ArrayFieldRows>\n      <ArrayFieldAddButton />\n    </ArrayFieldContainer>\n  )\n}\n\nexport interface ArrayFieldRowsProps {\n  children: (fields: ArrayField[]) => React.ReactElement | null\n}\n\nexport const ArrayFieldRows = ({\n  children,\n}: ArrayFieldRowsProps): React.ReactElement | null => {\n  const { fields } = useArrayFieldContext()\n  return children(fields)\n}\n\nexport const ArrayFieldContainer: React.FC<ArrayFieldProps> = ({\n  name,\n  defaultValue,\n  keyName,\n  min,\n  max,\n  children,\n  ...fieldProps\n}) => {\n  const context = useArrayField({\n    name,\n    defaultValue,\n    keyName,\n    min,\n    max,\n  })\n\n  return (\n    <ArrayFieldProvider value={context}>\n      <BaseField name={name} {...fieldProps}>\n        {children}\n      </BaseField>\n    </ArrayFieldProvider>\n  )\n}\n","import * as React from 'react'\nimport { ResponsiveValue } from '@chakra-ui/system'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nexport interface ObjectFieldProps extends FieldProps {\n  name: string\n  children: React.ReactNode\n  columns?: ResponsiveValue<number>\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ObjectField: React.FC<ObjectFieldProps> = (props) => {\n  const { name, children, columns, spacing, ...fieldProps } = props\n  return (\n    <BaseField name={name} {...fieldProps}>\n      <FormLayout columns={columns} gridGap={spacing}>\n        {mapNestedFields(name, children)}\n      </FormLayout>\n    </BaseField>\n  )\n}\n","import * as React from 'react'\nimport { getFieldsFromSchema, getNestedSchema } from './resolvers/yup'\n\nimport { FormLayout } from './layout'\nimport { Field, FieldProps } from './field'\n\nimport { ArrayField } from './array-field'\nimport { ObjectField } from './object-field'\n\nexport interface FieldsProps {\n  schema: any\n}\n\nconst getNestedFields = (schema: any, name: string) => {\n  return getFieldsFromSchema(getNestedSchema(schema, name)).map(\n    ({ name, type, ...nestedFieldProps }: FieldProps): React.ReactNode => (\n      <Field key={name} name={name} type={type} {...nestedFieldProps} />\n    )\n  )\n}\n\nexport const Fields: React.FC<FieldsProps> = ({ schema, ...props }) => {\n  return (\n    <FormLayout {...props}>\n      {getFieldsFromSchema(schema).map(\n        ({\n          name,\n          type,\n          defaultValue,\n          ...fieldProps\n        }: FieldProps): React.ReactNode => {\n          if (type === 'array') {\n            return (\n              <ArrayField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ArrayField>\n            )\n          } else if (type === 'object') {\n            return (\n              <ObjectField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ObjectField>\n            )\n          }\n\n          return <Field key={name} name={name} type={type} {...fieldProps} />\n        }\n      )}\n    </FormLayout>\n  )\n}\n","import * as React from 'react'\n\nimport { chakra, HTMLChakraProps, forwardRef } from '@chakra-ui/react'\n\nimport {\n  useForm,\n  FormProvider,\n  UseFormProps,\n  FieldErrors,\n} from 'react-hook-form'\n\nimport { resolver } from './resolvers/yup'\n\ninterface FormOptions {\n  schema?: any\n  submitLabel?: false | string\n}\n\nexport interface FormProps extends HTMLChakraProps<'form'>, FormOptions {\n  defaultValues: Record<string, any>\n  onSubmit: (arg: any) => Promise<any> | void\n  onError?: (errors: FieldErrors) => void\n  children?: React.ReactNode\n}\n\nexport const Form = forwardRef<FormProps, 'form'>(\n  ({ schema, defaultValues, onSubmit, onError, children, ...props }, ref) => {\n    const form: UseFormProps = { mode: 'all', defaultValues }\n\n    if (schema) {\n      form.resolver = resolver(schema)\n    }\n\n    const methods = useForm(form)\n    const { handleSubmit } = methods\n\n    return (\n      <FormProvider {...methods}>\n        <chakra.form\n          ref={ref}\n          onSubmit={handleSubmit(onSubmit, onError)}\n          {...props}\n        >\n          {children}\n        </chakra.form>\n      </FormProvider>\n    )\n  }\n)\n","import * as React from 'react'\n\nimport { useFormContext } from 'react-hook-form'\n\nimport { Button, ButtonProps } from '@saas-ui/button'\n\nimport { forwardRef } from '@chakra-ui/system'\n\nexport const SubmitButton = forwardRef<ButtonProps, 'button'>(\n  ({ children, ...props }, ref) => {\n    const data = useFormContext()\n\n    return (\n      <Button\n        type=\"submit\"\n        isLoading={data.formState.isSubmitting}\n        isPrimary\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </Button>\n    )\n  }\n)\n","import * as React from 'react'\n\nimport { forwardRef } from '@chakra-ui/react'\n\nimport { Form, FormProps } from './form'\n\nimport { FormLayout } from './layout'\nimport { Fields } from './fields'\nimport { SubmitButton } from './submit-button'\n\ninterface AutoFormOptions {\n  schema: any\n  submitLabel?: false | string\n}\n\nexport interface AutoFormProps\n  extends Omit<FormProps, 'schema'>,\n    AutoFormOptions {}\n\nexport const AutoForm = forwardRef<AutoFormProps, 'form'>(\n  ({ schema, submitLabel, ...props }, ref) => {\n    return (\n      <Form {...props} schema={schema} ref={ref}>\n        <FormLayout>\n          {<Fields schema={schema} />}\n          {submitLabel && <SubmitButton label={submitLabel} />}\n        </FormLayout>\n      </Form>\n    )\n  }\n)\n\nAutoForm.defaultProps = {\n  submitLabel: 'Submit',\n}\n"],"names":["DisplayField","_ref","name","label","props","getValues","useFormContext","React","FormControl","FormLabel","htmlFor","Text","fontSize","inputTypes","defaultInputType","BaseField","help","variant","hideLabel","children","controlProps","formState","error","get","errors","getError","isInvalid","Box","message","FormHelperText","FormErrorMessage","Field","forwardRef","ref","type","InputComponent","getInput","withControlledInput","rules","inputProps","control","Controller","render","_ref3","field","useMergeRefs","withUncontrolledInput","register","registerFieldType","component","options","isControlled","displayName","isDisabled","isReadOnly","isRequired","isOptional","isDiabled","createField","split","map","part","charAt","toUpperCase","slice","join","InputField","Input","NumberInputField","NumberInput","PasswordInputFIeld","PasswordInput","TextareaField","Textarea","SwitchField","Switch","SelectField","Select","CheckboxField","Checkbox","RadioField","RadioInput","PinField","PinInput","NativeSelectField","NativeSelect","resolver","yupResolver","getType","spec","meta","_field$spec$meta","getArrayOption","test","tests","OPTIONS","_test$OPTIONS","params","getFieldsFromSchema","schema","fields","schemaFields","innerType","min","max","push","FormLayoutItem","chakra","div","FormLayout","gridProps","useTheme","components","_theme$components","_theme$components$For2","defaultProps","spacing","SimpleGrid","Children","child","isValidElement","mapNestedFields","cloneElement","ArrayFieldProvider","useArrayFieldContext","createContext","ArrayFieldRowProvider","useArrayFieldRowContext","useArrayField","defaultValue","keyName","useFieldArray","useArrayFieldRow","index","clearErrors","remove","useEffect","isFirst","isLast","length","useCallback","useArrayFieldRemoveButton","onClick","useArrayFieldAddButton","append","shouldFocus","ArrayFieldRow","columns","ArrayFieldRowContainer","ArrayFieldRowFields","ArrayFieldRemoveButton","layoutProps","flex","gridGap","mr","context","value","__css","display","flexDirection","alignItems","width","mb","IconButton","icon","MinusIcon","ArrayFieldAddButton","AddIcon","float","ArrayField","containerProps","ArrayFieldContainer","ArrayFieldRows","id","key","_ref2","fieldProps","ObjectField","getNestedFields","path","reach","getNestedSchema","nestedFieldProps","Fields","Form","defaultValues","onSubmit","onError","form","mode","methods","useForm","handleSubmit","FormProvider","SubmitButton","data","Button","isLoading","isSubmitting","isPrimary","AutoForm","submitLabel"],"mappings":"02CAgBaA,EAA4CC,QAACC,KACxDA,EADwDC,MAExDA,KAEGC,SAEH,MAAMC,UAAEA,GAAcC,iBAEtB,OACEC,gBAACC,EAAgBJ,EACdD,eAAQI,gBAACE,GAAUC,QAASR,GAAOC,GAAqB,kBACzDI,gBAACI,GAAKC,SAAS,MAAMP,EAAUH,yOC8C/BW,EAAkC,GAElCC,EAAmB,OAiBZC,EAAmCX,IAC9C,MAAMF,KAAEA,EAAFC,MAAQA,EAARa,KAAeA,EAAfC,QAAqBA,EAArBC,UAA8BA,EAA9BC,SAAyCA,GAC7Cf,EAD0DgB,IAC1DhB,MAEIiB,UAAEA,GAAcf,IAEhBgB,EAjBS,EAACpB,EAAcmB,IACvBE,EAAIF,EAAUG,OAAQtB,GAgBfuB,CAASvB,EAAMmB,gBAE7B,OACEd,gBAACC,KAAYkB,YAAaJ,EAAOL,QAASA,GAAaG,GACpDjB,IAAUe,eACTX,gBAACE,GAAUQ,QAASA,GAAUd,GAC5B,kBACJI,gBAACoB,OACER,GACAH,SAASM,GAAAA,EAAOM,QAEb,kBADFrB,gBAACsB,OAAgBb,UAElBM,SAAAA,EAAOM,uBACNrB,gBAACuB,aAAkBR,SAAAA,EAAOM,YAOvBG,EAAQC,EACnB,CAAC5B,EAAO6B,KACN,MAAMC,KAAEA,EAAOpB,GAAqBV,EAC9B+B,EA5CQD,CAAAA,GACTrB,EAAWqB,IAASrB,EAAWC,GA2CbsB,CAASF,gBAEhC,OAAO3B,gBAAC4B,KAAeF,IAAKA,GAAS7B,MA8C5BiC,EAAuBF,GAC3BH,EAAW,GAAiCC,SAAhC/B,KAAEA,EAAFoC,MAAQA,KAAUC,SACnC,MAAMC,QAAEA,GAAYlC,iBAEpB,OACEC,gBAACkC,GACCvC,KAAMA,EACNsC,QAASA,EACTF,MAAOA,EACPI,OAAQC,QAAGC,OAASX,IAAKhC,MAAS2C,MAAvBA,6BACTrC,gBAAC4B,OACKS,EACAL,GACJN,IAAKY,EAAaZ,EAAKhC,WAQtB6C,GAAyBX,GAC7BH,EAAW,GAAiCC,SAAhC/B,KAAEA,EAAFoC,MAAQA,KAAUC,SACnC,MAAMQ,SAAEA,GAAazC,MAEWyC,EAAS7C,EAAMoC,IAAvCL,IAAKhC,KAAS2C,sBAEtB,OACErC,gBAAC4B,OACKS,EACAL,GACJN,IAAKY,EAAaZ,EAAKhC,QAoBlB+C,GAAoB,CAC/Bd,EACAe,EACAC,KAEA,IAAIf,EAEFA,QADEe,GAAAA,EAASC,aACMd,EAAoBY,GAEpBH,GAAsBG,GAGzC,MAAMlB,EAnGY,EAClBI,GACEiB,YAAAA,EAAalC,UAAAA,EAAWH,UAAAA,MAE1B,MAAMgB,EAAQC,EAA2C,CAAC5B,EAAO6B,KAC/D,MAAM9B,MACJA,EADIkD,WAEJA,EAFI3B,UAGJA,EAHI4B,WAIJA,EAJIC,WAKJA,EALIC,WAMJA,EANIvC,QAOJA,GAEEb,EADCmC,IACDnC,kBAEJ,OACEG,gBAACQ,GACCZ,MAAOA,EACPe,UAAWA,EACXuC,UAAWJ,EACX3B,UAAWA,EACX4B,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZvC,QAASA,gBAETV,gBAAC4B,KAAeF,IAAKA,EAAK9B,MAAOA,GAAWoC,OAMlD,OAFAR,EAAMqB,YAAcA,EAEbrB,GAkEO2B,CAAYvB,EAAgB,CACxCiB,eAAgBlB,EACbyB,MAAM,KACNC,IAAKC,GAASA,EAAKC,OAAO,GAAGC,cAAgBF,EAAKG,MAAM,IACxDC,KAAK,WACR/C,gBAAWgC,SAAAA,EAAShC,UACpBH,iBAAWmC,SAAAA,EAASnC,YAAaA,IAKnC,OAFAF,EAAWqB,GAAQH,EAEZA,GAKImC,GAAalB,GAAkB,OAAQmB,GACvCC,GAAmBpB,GAAkB,SAAUqB,EAAa,CACvElB,cAAc,IAEHmB,GAAqBtB,GAAkB,WAAYuB,GACnDC,GAAgBxB,GAAkB,WAAYyB,GAC9CC,GAAc1B,GACzB,SACAhB,EAAW,GAA0CC,SAAzC9B,MAAEA,KAAUC,sBACtB,OACEG,gBAACoE,KAAO1C,IAAKA,GAAS7B,GACnBD,KAIP,CACEgD,cAAc,EACdjC,WAAW,IAGF0D,GAAc5B,GAAkB,SAAU6B,EAAQ,CAC7D1B,cAAc,IAEH2B,GAAgB9B,GAC3B,WACAhB,EAAW,GAA0CC,SAAzC9B,MAAEA,KAAUC,sBACtB,OACEG,gBAACwE,KAAS9C,IAAKA,GAAS7B,GACrBD,KAIP,CACEe,WAAW,IAGF8D,GAAahC,GAAkB,QAASiC,EAAY,CAC/D9B,cAAc,IAEH+B,GAAWlC,GAAkB,MAAOmC,EAAU,CACzDhC,cAAc,IAEHiC,GAAoBpC,GAC/B,gBACAqC,EACA,CAAElC,cAAc,IChSLmC,GAAWC,EAIlBC,GAAW5C,UACf,YAAIA,EAAM6C,KAAKC,OAAXC,EAAiBzD,KACnB,OAAOU,EAAM6C,KAAKC,KAAKxD,KAGzB,OAAQU,EAAMV,MACZ,IAAK,QACH,MAAO,QACT,IAAK,SACH,MAAO,SACT,IAAK,SACH,MAAO,SACT,IAAK,OACH,MAAO,OAET,QACE,MAAO,SASP0D,GAAiB,CAAChD,EAAY1C,KAClC,IAAK,MAAM2F,KAAQjD,EAAMkD,MAAO,OAC9B,YAAID,EAAKE,UAALC,EAAcC,OAAO/F,GAAO,OAAO2F,EAAKE,QAAQE,OAAO/F,KAUlDgG,GACXC,IAEA,MAAMC,EAAS,GAEf,IAAIC,EAAoC,GAGtCA,EAFkB,UAAhBF,EAAOjE,KAEMiE,EAAOG,UAAUF,OAEjBD,EAAOC,OAGxB,IAAK,MAAMlG,KAAQmG,EAAc,CAC/B,MAAMzD,EAAQyD,EAAanG,GAErBgD,EAAmB,GACN,UAAfN,EAAMV,OACRgB,EAAQqD,IAAMX,GAAehD,EAAO,OACpCM,EAAQsD,IAAMZ,GAAehD,EAAO,QAGtCwD,EAAOK,QACLvG,KAAAA,EACAC,MAAOyC,EAAM6C,KAAKtF,OAASD,EAC3BgC,KAAMsD,GAAQ5C,IACXM,IAGP,OAAOkD,mBCjEHM,GAAgD,EAAGvF,SAAAA,kBAChDZ,gBAACoG,EAAOC,SAAKzF,GAGT0F,GAAa5G,kBAACkB,SAAEA,KAAaf,UACxC,MAMM0G,yBANQC,IAEaC,sBAANC,EAAkBJ,mBAAlBK,EAA8BC,gBAAgB,CACjEC,QAAS,GAKNhH,gBAGL,OACEG,gBAAC8G,EAAeP,EACbvG,EAAM+G,SAAS1D,IAAIzC,EAAWoG,GACzBhH,EAAMiH,eAAeD,gBAChBhH,gBAACmG,QAAgBa,GAEnBA,KC9BFE,GAAkB,CAACvH,EAAciB,IACrCZ,EAAM+G,SAAS1D,IAAIzC,EAAWoG,GAC/BhH,EAAMiH,eAAeD,IAAUA,EAAMnH,MAAMF,KACtCK,EAAMmH,aAAaH,OACrBA,EAAMnH,OACTF,QAASA,KAAQqH,EAAMnH,MAAMF,UAG1BqH,ICkBGI,GAAoBC,IAChCC,EAAmC,CACjC3H,KAAM,uBA0BI4H,GAAuBC,IACnCF,EAAsC,CACpC3H,KAAM,yBAqBG8H,GAAgB,EAC3B9H,KAAAA,EACA+H,aAAAA,EAAe,GACfC,QAAAA,EACA3B,IAAAA,EACAC,IAAAA,MAEA,MAAMhE,QAAEA,GAAYlC,IAOpB,YANgB6H,EAAc,CAC5B3F,QAAAA,EACAtC,KAAAA,EACAgI,QAAAA,KAKAhI,KAAAA,EACA+H,aAAAA,EACA1B,IAAAA,EACAC,IAAAA,KAQS4B,GAAmB,EAAGC,MAAAA,MACjC,MAAMC,YAAEA,GAAgBhI,KAClBJ,KAAEA,EAAFqI,OAAQA,EAARnC,OAAgBA,GAAWwB,KAOjC,OALArH,EAAMiI,UAAU,KAEdF,EAAYpI,IACX,IAEI,CACLmI,MAAAA,EACAI,QAAmB,IAAVJ,EACTK,OAAQL,IAAUjC,EAAOuC,OAAS,EAClCzI,QAASA,KAAQmI,IACjBE,OAAQhI,EAAMqI,YAAY,KACxBN,EAAYpI,GACZqI,EAAOF,IACN,CAACA,MAIKQ,GAA4B,KACvC,MAAMJ,QAAEA,EAAFF,OAAWA,GAAWR,MACtBxB,IAAEA,EAAFH,OAAOA,GAAWwB,KAIxB,MAAO,CACLkB,QAAS,IAAMP,IACflF,WAJiBoF,MAAclC,GAAOH,EAAOuC,QAAUpC,KAQ9CwC,GAAyB,KACpC,MAAMC,OAAEA,EAAFf,aAAUA,EAAVzB,IAAwBA,EAAxBJ,OAA6BA,GAAWwB,KAI9C,MAAO,CACLkB,QAAS,IACPE,EAAOf,EAAc,CACnBgB,aAAa,IAEjB5F,cAPoBmD,GAAOJ,EAAOuC,QAAUnC,qHClGnC0C,GAA8C,EACzD/H,SAAAA,EACAgI,QAAAA,EACA/B,QAAAA,EACAiB,MAAAA,kBAGE9H,gBAAC6I,IAAuBf,MAAOA,gBAC7B9H,gBAAC8I,IAAoBF,QAASA,EAAS/B,QAASA,GAC7CjG,gBAEHZ,gBAAC+I,UAgBMD,GAA0DpJ,QAACkB,SACtEA,EADsEgI,QAEtEA,EAFsE/B,QAGtEA,KACGmC,UAEH,MAAMrJ,KAAEA,GAAS6H,kBACjB,OACExH,gBAACsG,MACC2C,KAAK,IACLL,QAASA,EACTM,QAASrC,EACTsC,GAAG,KACCH,GAEH9B,GAAgBvH,EAAMiB,KAKhBiI,GAAuD,EAClEjI,SAAAA,EACAkH,MAAAA,MAEA,MAAMsB,EAAUvB,GAAiB,CAAEC,MAAAA,iBAUnC,OACE9H,gBAACuH,IAAsB8B,MAAOD,gBAC5BpJ,gBAACoG,EAAOC,KAAIiD,MAVD,CACbC,QAAS,OACTC,cAAe,MACfC,WAAY,WACZC,MAAO,OACPC,GAAI,IAK0B/I,KAKrBmI,GAAiDlJ,gBAE1DG,gBAAC4J,KACCC,kBAAM7J,gBAAC8J,QACP,aAAW,cACPxB,KACAzI,IAKGkK,GAA8ClK,gBAEvDG,gBAAC4J,KACCC,kBAAM7J,gBAACgK,QACP,aAAW,UACXC,MAAM,SACFzB,KACA3I,IASGqK,GAAyCrK,IACpD,MAAMe,SAAEA,GAAgCf,EAAnBsK,IAAmBtK,mBAExC,OACEG,gBAACoK,GAAwBD,eACvBnK,gBAACqK,QACGxE,gBACA7F,gCACG6F,EAAOxC,IAAI,EAAGiH,GAAAA,GAAMxC,iBACnB9H,gBAAC2I,IAAc4B,IAAKD,EAAIxC,MAAOA,GAC5BlH,mBAMXZ,gBAAC+J,WASMM,GAAiB,EAC5BzJ,SAAAA,MAEA,MAAMiF,OAAEA,GAAWwB,KACnB,OAAOzG,EAASiF,IAGLuE,GAAiDI,QAAC7K,KAC7DA,EAD6D+H,aAE7DA,EAF6DC,QAG7DA,EAH6D3B,IAI7DA,EAJ6DC,IAK7DA,EAL6DrF,SAM7DA,KACG6J,UAEH,MAAMrB,EAAU3B,GAAc,CAC5B9H,KAAAA,EACA+H,aAAAA,EACAC,QAAAA,EACA3B,IAAAA,EACAC,IAAAA,iBAGF,OACEjG,gBAACoH,IAAmBiC,MAAOD,gBACzBpJ,gBAACQ,KAAUb,KAAMA,GAAU8K,GACxB7J,gDChLI8J,GAA2C7K,IACtD,MAAMF,KAAEA,EAAFiB,SAAQA,EAARgI,QAAkBA,EAAlB/B,QAA2BA,GAA2BhH,EAAf4K,IAAe5K,mBAC5D,OACEG,gBAACQ,KAAUb,KAAMA,GAAU8K,gBACzBzK,gBAACsG,IAAWsC,QAASA,EAASM,QAASrC,GACpCK,GAAgBvH,EAAMiB,yECPzB+J,GAAkB,CAAC/E,EAAajG,IAC7BgG,GNgEsB,EAACC,EAA6BgF,IACpDC,EAAMjF,EAAQgF,GMjEME,CAAgBlF,EAAQjG,IAAO0D,IACxD3D,QAACC,KAAEA,EAAFgC,KAAQA,KAASoJ,8BAChB/K,gBAACwB,KAAM+I,IAAK5K,EAAMA,KAAMA,EAAMgC,KAAMA,GAAUoJ,MAKvCC,GAAgCR,QAAC5E,OAAEA,KAAW/F,uBACzD,OACEG,gBAACsG,GAAezG,EACb8F,GAAoBC,GAAQvC,IAC3BjB,QAACzC,KACCA,EADDgC,KAECA,KAEG8I,UAEH,MAAa,UAAT9I,eAEA3B,gBAACkK,MAAWvK,KAAMA,GAAU8K,GACzBE,GAAgB/E,EAAQjG,IAGX,WAATgC,eAEP3B,gBAAC0K,MAAY/K,KAAMA,GAAU8K,GAC1BE,GAAgB/E,EAAQjG,iBAKxBK,gBAACwB,KAAM+I,IAAK5K,EAAMA,KAAMA,EAAMgC,KAAMA,GAAU8I,sECpBlDQ,GAAOxJ,EAClB,GAAmEC,SAAlEkE,OAAEA,EAAFsF,cAAUA,EAAVC,SAAyBA,EAAzBC,QAAmCA,EAAnCxK,SAA4CA,KAAaf,UACxD,MAAMwL,EAAqB,CAAEC,KAAM,MAAOJ,cAAAA,GAEtCtF,IACFyF,EAAKtG,SAAWA,GAASa,IAG3B,MAAM2F,EAAUC,EAAQH,IAClBI,aAAEA,GAAiBF,eAEzB,OACEvL,gBAAC0L,EAAiBH,eAChBvL,gBAACoG,EAAOiF,QACN3J,IAAKA,EACLyJ,SAAUM,EAAaN,EAAUC,IAC7BvL,GAEHe,sBCnCE+K,GAAelK,EAC1B,GAAyBC,SAAxBd,SAAEA,KAAaf,UACd,MAAM+L,EAAO7L,iBAEb,OACEC,gBAAC6L,KACClK,KAAK,SACLmK,UAAWF,EAAK9K,UAAUiL,aAC1BC,aACAtK,IAAKA,GACD7B,GAEHe,iCCDIqL,GAAWxK,EACtB,GAAoCC,SAAnCkE,OAAEA,EAAFsG,YAAUA,KAAgBrM,uBACzB,OACEG,gBAACiL,QAASpL,GAAO+F,OAAQA,EAAQlE,IAAKA,iBACpC1B,gBAACsG,qBACEtG,gBAACgL,IAAOpF,OAAQA,IAChBsG,gBAAelM,gBAAC2L,IAAa/L,MAAOsM,QAO/CD,GAASrF,aAAe,CACtBsF,YAAa"}
+{"version":3,"file":"index.modern.js","sources":["../src/display-field.tsx","../src/field.tsx","../src/resolvers/yup.ts","../src/layout.tsx","../src/utils.ts","../src/use-array-field.tsx","../src/array-field.tsx","../src/object-field.tsx","../src/fields.tsx","../src/form.tsx","../src/submit-button.tsx","../src/auto-form.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  Text,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n} from '@chakra-ui/react'\n\nimport { FieldProps } from './field'\n\nexport interface DisplayFieldProps\n  extends FormControlProps,\n    Omit<FieldProps, 'type' | 'label'> {}\n\nexport const DisplayField: React.FC<DisplayFieldProps> = ({\n  name,\n  label,\n  placeholder,\n  ...props\n}) => {\n  const { getValues } = useFormContext()\n\n  return (\n    <FormControl {...props}>\n      {label ? <FormLabel htmlFor={name}>{label}</FormLabel> : null}\n      <Text fontSize=\"md\">{getValues(name)}</Text>\n    </FormControl>\n  )\n}\n","import * as React from 'react'\nimport {\n  useFormContext,\n  FormState,\n  Controller,\n  get,\n  RegisterOptions,\n  FieldValues,\n  FieldName,\n  FieldPath,\n  FieldPathValue,\n} from 'react-hook-form'\n\nimport {\n  forwardRef,\n  Box,\n  FormControl,\n  FormControlProps,\n  FormLabel,\n  FormHelperText,\n  FormErrorMessage,\n  Input,\n  Textarea,\n  Checkbox,\n  Switch,\n  useMergeRefs,\n} from '@chakra-ui/react'\n\nimport { NumberInput } from '@saas-ui/number-input'\nimport { PasswordInput } from '@saas-ui/password-input'\nimport { RadioInput } from '@saas-ui/radio'\nimport { PinInput } from '@saas-ui/pin-input'\nimport { Select, NativeSelect } from '@saas-ui/select'\n\nexport type FieldRules = Pick<\n  RegisterOptions,\n  'required' | 'min' | 'max' | 'maxLength' | 'minLength' | 'pattern'\n>\n\nexport type FieldTypes =\n  | 'text'\n  | 'number'\n  | 'password'\n  | 'textarea'\n  | 'select'\n  | 'native-select'\n  | 'checkbox'\n  | 'radio'\n  | 'switch'\n  | 'pin'\n  | string\n\nexport interface FieldProps<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> extends Omit<FormControlProps, 'label' | 'type'> {\n  /**\n   * The field name\n   */\n  name: TName\n  /**\n   * The field label\n   */\n  label?: string\n  /**\n   * Hide the field label\n   */\n  hideLabel?: boolean\n  /**\n   * Field help text\n   */\n  help?: string\n  /**\n   * React hook form rules\n   */\n  rules?: Omit<\n    RegisterOptions<TFieldValues, TName>,\n    'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'\n  >\n  /**\n   * Options used for selects and radio fields\n   */\n  options?: any\n  /**\n   * The field type\n   * Build-in types:\n   * - text\n   * - number\n   * - password\n   * - textarea\n   * - select\n   * - native-select\n   * - checkbox\n   * - radio\n   * - switch\n   * - pin\n   *\n   * Will default to a text field if there is no matching type.\n   * @default 'text'\n   */\n  type?: FieldTypes\n  /**\n   * The input placeholder\n   */\n  placeholder?: string\n}\n\nconst inputTypes: Record<FieldTypes, any> = {}\n\nconst defaultInputType = 'text'\n\nconst getInput = (type: string) => {\n  return inputTypes[type] || inputTypes[defaultInputType]\n}\n\nconst getError = (name: string, formState: FormState<{ [x: string]: any }>) => {\n  return get(formState.errors, name)\n}\n\nconst isTouched = (\n  name: string,\n  formState: FormState<{ [x: string]: any }>\n) => {\n  return get(formState.touchedFields, name)\n}\n\nexport const BaseField: React.FC<FieldProps> = (props) => {\n  const { name, label, help, variant, hideLabel, children, ...controlProps } =\n    props\n\n  const { formState } = useFormContext()\n\n  const error = getError(name, formState)\n\n  return (\n    <FormControl variant={variant} {...controlProps} isInvalid={!!error}>\n      {label && !hideLabel ? (\n        <FormLabel variant={variant}>{label}</FormLabel>\n      ) : null}\n      <Box>\n        {children}\n        {help && !error?.message ? (\n          <FormHelperText>{help}</FormHelperText>\n        ) : null}\n        {error?.message && (\n          <FormErrorMessage>{error?.message}</FormErrorMessage>\n        )}\n      </Box>\n    </FormControl>\n  )\n}\n\nexport const Field = forwardRef<FieldProps, typeof FormControl>(\n  (props, ref) => {\n    const { type = defaultInputType } = props\n    const InputComponent = getInput(type)\n\n    return <InputComponent ref={ref} {...props} />\n  }\n)\n\ninterface CreateFieldProps {\n  displayName: string\n  hideLabel?: boolean\n  BaseField: React.FC<any>\n}\n\nconst createField = (\n  InputComponent: React.FC<any>,\n  { displayName, hideLabel, BaseField }: CreateFieldProps\n) => {\n  const Field = forwardRef<FieldProps, typeof FormControl>((props, ref) => {\n    const {\n      name,\n      label,\n      isDisabled,\n      isInvalid,\n      isReadOnly,\n      isRequired,\n      variant,\n      ...inputProps\n    } = props\n\n    return (\n      <BaseField\n        name={name}\n        label={label}\n        hideLabel={hideLabel}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isReadOnly={isReadOnly}\n        isRequired={isRequired}\n        variant={variant}\n      >\n        <InputComponent ref={ref} name={name} label={label} {...inputProps} />\n      </BaseField>\n    )\n  })\n  Field.displayName = displayName\n\n  return Field\n}\n\nexport const withControlledInput = (InputComponent: any) => {\n  return forwardRef<FieldProps, typeof InputComponent>(\n    ({ name, rules, ...inputProps }, ref) => {\n      const { control } = useFormContext()\n\n      return (\n        <Controller\n          name={name}\n          control={control}\n          rules={rules}\n          render={({ field: { ref: _ref, ...field } }) => (\n            <InputComponent\n              {...field}\n              {...inputProps}\n              ref={useMergeRefs(ref, _ref)}\n            />\n          )}\n        />\n      )\n    }\n  )\n}\n\nexport const withUncontrolledInput = (InputComponent: any) => {\n  return forwardRef<FieldProps, typeof InputComponent>(\n    ({ name, rules, ...inputProps }, ref) => {\n      const { register } = useFormContext()\n\n      const { ref: _ref, ...field } = register(name, rules)\n\n      return (\n        <InputComponent\n          {...field}\n          {...inputProps}\n          ref={useMergeRefs(ref, _ref)}\n        />\n      )\n    }\n  )\n}\n\nexport interface RegisterFieldTypeOptions {\n  isControlled?: boolean\n  hideLabel?: boolean\n  BaseField?: React.FC<any>\n}\n\n/**\n * Register a new field type\n * @param type The name for this field in kebab-case, eg `email` or `array-field`\n * @param component The React component\n * @param options\n * @param options.isControlled Set this to true if this is a controlled field.\n * @param options.hideLabel Hide the field label, for example for checkbox or switch field.\n */\nexport const registerFieldType = (\n  type: string,\n  component: React.FC<any>,\n  options?: RegisterFieldTypeOptions\n) => {\n  let InputComponent\n  if (options?.isControlled) {\n    InputComponent = withControlledInput(component)\n  } else {\n    InputComponent = withUncontrolledInput(component)\n  }\n\n  const Field = createField(InputComponent, {\n    displayName: `${type\n      .split('-')\n      .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n      .join('')}Field`,\n    hideLabel: options?.hideLabel,\n    BaseField: options?.BaseField || BaseField,\n  })\n\n  inputTypes[type] = Field\n\n  return Field\n}\n\n// @todo Consider not registering all fields by default to lower the package size and computations.\n// Not all types may be required in a project.\nexport const InputField = registerFieldType('text', Input)\nexport const NumberInputField = registerFieldType('number', NumberInput, {\n  isControlled: true,\n})\nexport const PasswordInputFIeld = registerFieldType('password', PasswordInput)\nexport const TextareaField = registerFieldType('textarea', Textarea)\nexport const SwitchField = registerFieldType(\n  'switch',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Switch ref={ref} {...props}>\n        {label}\n      </Switch>\n    )\n  }),\n  {\n    isControlled: true,\n    hideLabel: true,\n  }\n)\nexport const SelectField = registerFieldType('select', Select, {\n  isControlled: true,\n})\nexport const CheckboxField = registerFieldType(\n  'checkbox',\n  forwardRef(({ label, ...props }: { label?: string }, ref) => {\n    return (\n      <Checkbox ref={ref} {...props}>\n        {label}\n      </Checkbox>\n    )\n  }),\n  {\n    hideLabel: true,\n  }\n)\nexport const RadioField = registerFieldType('radio', RadioInput, {\n  isControlled: true,\n})\nexport const PinField = registerFieldType('pin', PinInput, {\n  isControlled: true,\n})\nexport const NativeSelectField = registerFieldType(\n  'native-select',\n  NativeSelect,\n  { isControlled: true }\n)\n","import { SchemaOf, AnySchema, reach } from 'yup'\nexport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps } from '../field'\n\n// @TODO get proper typings for the schema fields\n\nconst getType = (field: any) => {\n  if (field.spec.meta?.type) {\n    return field.spec.meta.type\n  }\n\n  switch (field.type) {\n    case 'array':\n      return 'array'\n    case 'object':\n      return 'object'\n    case 'number':\n      return 'number'\n    case 'date':\n      return 'date'\n    case 'string':\n    default:\n      return 'text'\n  }\n}\n\ntype Options = {\n  min?: number\n  max?: number\n}\n\nconst getArrayOption = (field: any, name: string) => {\n  for (const test of field.tests) {\n    if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n  }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (\n  schema: SchemaOf<AnySchema>\n): FieldProps[] => {\n  const fields = []\n\n  let schemaFields: Record<string, any> = {}\n  if (schema.type === 'array') {\n    /* @ts-ignore this is actually valid */\n    schemaFields = schema.innerType.fields\n  } else {\n    schemaFields = schema.fields\n  }\n\n  for (const name in schemaFields) {\n    const field = schemaFields[name]\n\n    const options: Options = {}\n    if (field.type === 'array') {\n      options.min = getArrayOption(field, 'min')\n      options.max = getArrayOption(field, 'max')\n    }\n\n    fields.push({\n      name,\n      label: field.spec.label || name,\n      type: getType(field),\n      ...options,\n    })\n  }\n  return fields\n}\n\nexport const getNestedSchema = (schema: SchemaOf<AnySchema>, path: string) => {\n  return reach(schema, path)\n}\n","import * as React from 'react'\n\nimport { chakra, SimpleGrid, SimpleGridProps, useTheme } from '@chakra-ui/react'\n\nexport type FormLayoutProps = SimpleGridProps\n\ninterface FormLayoutItemProps {\n  children: React.ReactNode\n}\n\nconst FormLayoutItem: React.FC<FormLayoutItemProps> = ({ children }) => {\n  return <chakra.div>{children}</chakra.div>\n}\n\n/**\n * FormLayout\n *\n * Renders form items in a `SimpleGrid`\n * @see https://chakra-ui.com/docs/layout/simple-grid\n */\nexport const FormLayout = ({ children, ...props }: FormLayoutProps) => {\n  const theme = useTheme()\n\n  const defaultProps = theme.components?.FormLayout?.defaultProps ?? {\n    spacing: 4,\n  }\n\n  const gridProps = {\n    ...defaultProps,\n    ...props,\n  }\n\n  return (\n    <SimpleGrid {...gridProps}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return <FormLayoutItem>{child}</FormLayoutItem>\n        }\n        return child\n      })}\n    </SimpleGrid>\n  )\n}\n","import * as React from 'react'\n\nexport const mapNestedFields = (name: string, children: React.ReactNode) => {\n  return React.Children.map(children, (child) => {\n    if (React.isValidElement(child) && child.props.name) {\n      return React.cloneElement(child, {\n        ...child.props,\n        name: `${name}.${child.props.name}`,\n      })\n    }\n    return child\n  })\n}\n","import * as React from 'react'\nimport {\n  useFieldArray,\n  useFormContext,\n  UseFieldArrayReturn,\n} from 'react-hook-form'\n\nimport { createContext } from '@chakra-ui/react-utils'\n\nexport interface UseArrayFieldReturn extends UseFieldArrayReturn {\n  /**\n   * The array field name\n   */\n  name: string\n  /**\n   * The default value for new items\n   */\n  defaultValue: Record<string, any>\n  /**\n   * Min amount of items\n   */\n  min?: number\n  /**\n   * Max amount of items\n   */\n  max?: number\n}\n\nexport const [ArrayFieldProvider, useArrayFieldContext] =\n  createContext<UseArrayFieldReturn>({\n    name: 'ArrayFieldContext',\n  })\n\nexport interface UseArrayFieldRowReturn {\n  /**\n   * Name of the array field including the index, eg 'field.0'\n   */\n  name: string\n  /**\n   * The field index\n   */\n  index: number\n  /**\n   * Remove this array item\n   */\n  remove: () => void\n  /**\n   * True if this is the first item\n   */\n  isFirst: boolean\n  /**\n   * True if this is the last item\n   */\n  isLast: boolean\n}\n\nexport const [ArrayFieldRowProvider, useArrayFieldRowContext] =\n  createContext<UseArrayFieldRowReturn>({\n    name: 'ArrayFieldRowContext',\n  })\n\nexport interface ArrayFieldOptions {\n  /**\n   * The field name\n   */\n  name: string\n  /**\n   * Default value for new values in the array\n   */\n  defaultValue?: Record<string, any>\n  /**\n   * Default key name for rows, change this if your data uses 'id'\n   * @default \"id\"\n   */\n  keyName?: string\n  min?: number\n  max?: number\n}\n\nexport const useArrayField = ({\n  name,\n  defaultValue = {},\n  keyName,\n  min,\n  max,\n}: ArrayFieldOptions) => {\n  const { control } = useFormContext()\n  const context = useFieldArray({\n    control,\n    name,\n    keyName,\n  })\n\n  return {\n    ...context,\n    name,\n    defaultValue,\n    min,\n    max,\n  }\n}\n\nexport interface UseArrayFieldRowProps {\n  index: number\n}\n\nexport const useArrayFieldRow = ({ index }: UseArrayFieldRowProps) => {\n  const { clearErrors } = useFormContext()\n  const { name, remove, fields } = useArrayFieldContext()\n\n  React.useEffect(() => {\n    // reset errors, to make sure min/max errors reset correctly\n    clearErrors(name)\n  }, [])\n\n  return {\n    index,\n    isFirst: index === 0,\n    isLast: index === fields.length - 1,\n    name: `${name}.${index}`,\n    remove: React.useCallback(() => {\n      clearErrors(name)\n      remove(index)\n    }, [index]),\n  }\n}\n\nexport const useArrayFieldRemoveButton = () => {\n  const { isFirst, remove } = useArrayFieldRowContext()\n  const { min, fields } = useArrayFieldContext()\n\n  const isDisabled = isFirst && !!(min && fields.length <= min)\n\n  return {\n    onClick: () => remove(),\n    isDisabled,\n  }\n}\n\nexport const useArrayFieldAddButton = () => {\n  const { append, defaultValue, max, fields } = useArrayFieldContext()\n\n  const isDisabled = !!(max && fields.length >= max)\n\n  return {\n    onClick: () =>\n      append(defaultValue, {\n        shouldFocus: false,\n      }),\n    isDisabled,\n  }\n}\n","import * as React from 'react'\n\nimport { chakra, ResponsiveValue } from '@chakra-ui/system'\n\nimport { AddIcon, MinusIcon } from '@chakra-ui/icons'\nimport { IconButton, ButtonProps } from '@saas-ui/button'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nimport {\n  useArrayField,\n  useArrayFieldRow,\n  useArrayFieldContext,\n  ArrayFieldProvider,\n  ArrayFieldOptions,\n  ArrayFieldRowProvider,\n  useArrayFieldRowContext,\n  useArrayFieldRemoveButton,\n  useArrayFieldAddButton,\n} from './use-array-field'\n\ninterface ArrayField {\n  id: string\n  [key: string]: unknown\n}\n\ninterface ArrayFieldRowProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n  /**\n   * The array index\n   */\n  index: number\n}\n\nexport const ArrayFieldRow: React.FC<ArrayFieldRowProps> = ({\n  children,\n  columns,\n  spacing,\n  index,\n}) => {\n  return (\n    <ArrayFieldRowContainer index={index}>\n      <ArrayFieldRowFields columns={columns} spacing={spacing}>\n        {children}\n      </ArrayFieldRowFields>\n      <ArrayFieldRemoveButton />\n    </ArrayFieldRowContainer>\n  )\n}\n\nexport interface ArrayFieldRowFieldsProps {\n  /**\n   * Amount of field columns\n   */\n  columns?: ResponsiveValue<number>\n  /**\n   * Spacing between fields\n   */\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ArrayFieldRowFields: React.FC<ArrayFieldRowFieldsProps> = ({\n  children,\n  columns,\n  spacing,\n  ...layoutProps\n}) => {\n  const { name } = useArrayFieldRowContext()\n  return (\n    <FormLayout\n      flex=\"1\"\n      columns={columns}\n      gridGap={spacing}\n      mr=\"2\"\n      {...layoutProps}\n    >\n      {mapNestedFields(name, children)}\n    </FormLayout>\n  )\n}\n\nexport const ArrayFieldRowContainer: React.FC<ArrayFieldRowProps> = ({\n  children,\n  index,\n}) => {\n  const context = useArrayFieldRow({ index })\n\n  const styles = {\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'flex-end',\n    width: '100%',\n    mb: 4,\n  }\n\n  return (\n    <ArrayFieldRowProvider value={context}>\n      <chakra.div __css={styles}>{children}</chakra.div>\n    </ArrayFieldRowProvider>\n  )\n}\n\nexport const ArrayFieldRemoveButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<MinusIcon />}\n      aria-label=\"Remove row\"\n      {...useArrayFieldRemoveButton()}\n      {...props}\n    />\n  )\n}\n\nexport const ArrayFieldAddButton: React.FC<ButtonProps> = (props) => {\n  return (\n    <IconButton\n      icon={<AddIcon />}\n      aria-label=\"Add row\"\n      float=\"right\"\n      {...useArrayFieldAddButton()}\n      {...props}\n    />\n  )\n}\n\nexport interface ArrayFieldProps\n  extends ArrayFieldOptions,\n    Omit<FieldProps, 'defaultValue'> {}\n\nexport const ArrayField: React.FC<ArrayFieldProps> = (props) => {\n  const { children, ...containerProps } = props\n\n  return (\n    <ArrayFieldContainer {...containerProps}>\n      <ArrayFieldRows>\n        {(fields: ArrayField[]) => (\n          <>\n            {fields.map(({ id }, index: number) => (\n              <ArrayFieldRow key={id} index={index}>\n                {children}\n              </ArrayFieldRow>\n            ))}\n          </>\n        )}\n      </ArrayFieldRows>\n      <ArrayFieldAddButton />\n    </ArrayFieldContainer>\n  )\n}\n\nexport interface ArrayFieldRowsProps {\n  children: (fields: ArrayField[]) => React.ReactElement | null\n}\n\nexport const ArrayFieldRows = ({\n  children,\n}: ArrayFieldRowsProps): React.ReactElement | null => {\n  const { fields } = useArrayFieldContext()\n  return children(fields)\n}\n\nexport const ArrayFieldContainer: React.FC<ArrayFieldProps> = ({\n  name,\n  defaultValue,\n  keyName,\n  min,\n  max,\n  children,\n  ...fieldProps\n}) => {\n  const context = useArrayField({\n    name,\n    defaultValue,\n    keyName,\n    min,\n    max,\n  })\n\n  return (\n    <ArrayFieldProvider value={context}>\n      <BaseField name={name} {...fieldProps}>\n        {children}\n      </BaseField>\n    </ArrayFieldProvider>\n  )\n}\n","import * as React from 'react'\nimport { ResponsiveValue } from '@chakra-ui/system'\n\nimport { FormLayout } from './layout'\nimport { BaseField, FieldProps } from './field'\n\nimport { mapNestedFields } from './utils'\n\nexport interface ObjectFieldProps extends FieldProps {\n  name: string\n  children: React.ReactNode\n  columns?: ResponsiveValue<number>\n  spacing?: ResponsiveValue<string | number>\n}\n\nexport const ObjectField: React.FC<ObjectFieldProps> = (props) => {\n  const { name, children, columns, spacing, ...fieldProps } = props\n  return (\n    <BaseField name={name} {...fieldProps}>\n      <FormLayout columns={columns} gridGap={spacing}>\n        {mapNestedFields(name, children)}\n      </FormLayout>\n    </BaseField>\n  )\n}\n","import * as React from 'react'\nimport { getFieldsFromSchema, getNestedSchema } from './resolvers/yup'\n\nimport { FormLayout } from './layout'\nimport { Field, FieldProps } from './field'\n\nimport { ArrayField } from './array-field'\nimport { ObjectField } from './object-field'\n\nexport interface FieldsProps {\n  schema: any\n}\n\nconst getNestedFields = (schema: any, name: string) => {\n  return getFieldsFromSchema(getNestedSchema(schema, name)).map(\n    ({ name, type, ...nestedFieldProps }: FieldProps): React.ReactNode => (\n      <Field key={name} name={name} type={type} {...nestedFieldProps} />\n    )\n  )\n}\n\nexport const Fields: React.FC<FieldsProps> = ({ schema, ...props }) => {\n  return (\n    <FormLayout {...props}>\n      {getFieldsFromSchema(schema).map(\n        ({\n          name,\n          type,\n          defaultValue,\n          ...fieldProps\n        }: FieldProps): React.ReactNode => {\n          if (type === 'array') {\n            return (\n              <ArrayField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ArrayField>\n            )\n          } else if (type === 'object') {\n            return (\n              <ObjectField name={name} {...fieldProps}>\n                {getNestedFields(schema, name)}\n              </ObjectField>\n            )\n          }\n\n          return <Field key={name} name={name} type={type} {...fieldProps} />\n        }\n      )}\n    </FormLayout>\n  )\n}\n","import * as React from 'react'\n\nimport { chakra, HTMLChakraProps, forwardRef } from '@chakra-ui/react'\n\nimport {\n  useForm,\n  FormProvider,\n  UseFormProps,\n  FieldErrors,\n  FieldValues,\n} from 'react-hook-form'\n\nimport { yupResolver } from './resolvers/yup'\n\ninterface FormOptions {\n  schema?: any\n  submitLabel?: false | string\n  onSubmit: (arg: any) => Promise<any> | void\n  onError?: (errors: FieldErrors) => void\n}\n\nexport interface FormProps<TFieldValues extends FieldValues = FieldValues>\n  extends UseFormProps<TFieldValues>,\n    Omit<HTMLChakraProps<'form'>, 'onSubmit' | 'onError'>,\n    FormOptions {}\n\n/**\n * @todo Figure out how to pass down FieldValues to all Field components,\n * if at all possible.\n */\nexport const Form = forwardRef(\n  <TFieldValues extends FieldValues = FieldValues>(\n    props: FormProps<TFieldValues>,\n    ref: React.ForwardedRef<HTMLFormElement>\n  ) => {\n    const {\n      mode = 'all',\n      resolver,\n      reValidateMode,\n      shouldFocusError,\n      shouldUnregister,\n      shouldUseNativeValidation,\n      criteriaMode,\n      delayError,\n      schema,\n      defaultValues,\n      onSubmit,\n      onError,\n      children,\n      ...rest\n    } = props\n\n    const form = {\n      mode,\n      resolver,\n      defaultValues,\n      reValidateMode,\n      shouldFocusError,\n      shouldUnregister,\n      shouldUseNativeValidation,\n      criteriaMode,\n      delayError,\n    }\n\n    // @todo remove yup dependency and just use resolver prop?\n    if (schema) {\n      form.resolver = yupResolver(schema)\n    }\n\n    const methods = useForm<TFieldValues>(form)\n    const { handleSubmit } = methods\n\n    return (\n      <FormProvider {...methods}>\n        <chakra.form\n          ref={ref}\n          onSubmit={handleSubmit(onSubmit, onError)}\n          {...rest}\n        >\n          {children}\n        </chakra.form>\n      </FormProvider>\n    )\n  }\n) as <TFieldValues extends FieldValues>(\n  props: FormProps<TFieldValues> & { ref?: React.ForwardedRef<HTMLFormElement> }\n) => React.ReactElement\n","import * as React from 'react'\n\nimport { useFormContext } from 'react-hook-form'\n\nimport { Button, ButtonProps } from '@saas-ui/button'\n\nimport { forwardRef } from '@chakra-ui/system'\n\nexport const SubmitButton = forwardRef<ButtonProps, 'button'>(\n  ({ children, ...props }, ref) => {\n    const data = useFormContext()\n\n    return (\n      <Button\n        type=\"submit\"\n        isLoading={data.formState.isSubmitting}\n        isPrimary\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </Button>\n    )\n  }\n)\n","import * as React from 'react'\nimport { FieldValues } from 'react-hook-form'\nimport { forwardRef } from '@chakra-ui/react'\n\nimport { Form, FormProps } from './form'\n\nimport { FormLayout } from './layout'\nimport { Fields } from './fields'\nimport { SubmitButton } from './submit-button'\n\ninterface AutoFormOptions {\n  schema: any\n  submitLabel?: false | string\n}\n\nexport interface AutoFormProps<TFieldValues extends FieldValues>\n  extends Omit<FormProps<TFieldValues>, 'schema'>,\n    AutoFormOptions {}\n\nexport const AutoForm = forwardRef(\n  <TFieldValues extends FieldValues = FieldValues>(\n    props: AutoFormProps<TFieldValues>,\n    ref: React.ForwardedRef<HTMLFormElement>\n  ) => {\n    const { schema, submitLabel, ...rest } = props\n    return (\n      <Form {...rest} schema={schema} ref={ref}>\n        <FormLayout>\n          {<Fields schema={schema} />}\n          {submitLabel && <SubmitButton label={submitLabel} />}\n        </FormLayout>\n      </Form>\n    )\n  }\n)\n\nAutoForm.defaultProps = {\n  submitLabel: 'Submit',\n}\n"],"names":["DisplayField","_ref","name","label","props","getValues","useFormContext","React","FormControl","FormLabel","htmlFor","Text","fontSize","inputTypes","defaultInputType","BaseField","help","variant","hideLabel","children","controlProps","formState","error","get","errors","getError","isInvalid","Box","message","FormHelperText","FormErrorMessage","Field","forwardRef","ref","type","InputComponent","getInput","withControlledInput","rules","inputProps","control","Controller","render","_ref3","field","useMergeRefs","withUncontrolledInput","register","registerFieldType","component","options","isControlled","displayName","isDisabled","isReadOnly","isRequired","createField","split","map","part","charAt","toUpperCase","slice","join","InputField","Input","NumberInputField","NumberInput","PasswordInputFIeld","PasswordInput","TextareaField","Textarea","SwitchField","Switch","SelectField","Select","CheckboxField","Checkbox","RadioField","RadioInput","PinField","PinInput","NativeSelectField","NativeSelect","getType","spec","meta","_field$spec$meta","getArrayOption","test","tests","OPTIONS","_test$OPTIONS","params","getFieldsFromSchema","schema","fields","schemaFields","innerType","min","max","push","FormLayoutItem","chakra","div","FormLayout","gridProps","useTheme","components","_theme$components","_theme$components$For2","defaultProps","spacing","SimpleGrid","Children","child","isValidElement","mapNestedFields","cloneElement","ArrayFieldProvider","useArrayFieldContext","createContext","ArrayFieldRowProvider","useArrayFieldRowContext","useArrayField","defaultValue","keyName","useFieldArray","useArrayFieldRow","index","clearErrors","remove","useEffect","isFirst","isLast","length","useCallback","useArrayFieldRemoveButton","onClick","useArrayFieldAddButton","append","shouldFocus","ArrayFieldRow","columns","ArrayFieldRowContainer","ArrayFieldRowFields","ArrayFieldRemoveButton","layoutProps","flex","gridGap","mr","context","value","__css","display","flexDirection","alignItems","width","mb","IconButton","icon","MinusIcon","ArrayFieldAddButton","AddIcon","float","ArrayField","containerProps","ArrayFieldContainer","ArrayFieldRows","id","key","_ref2","fieldProps","ObjectField","getNestedFields","path","reach","getNestedSchema","nestedFieldProps","Fields","Form","mode","resolver","reValidateMode","shouldFocusError","shouldUnregister","shouldUseNativeValidation","criteriaMode","delayError","defaultValues","onSubmit","onError","rest","form","yupResolver","methods","useForm","handleSubmit","FormProvider","SubmitButton","data","Button","isLoading","isSubmitting","isPrimary","AutoForm","submitLabel"],"mappings":"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"}

package/dist/layout.d.ts

@@ -1,5 +1,11 @@
 /// <reference types="react" />
 import { SimpleGridProps } from '@chakra-ui/react';
 export declare type FormLayoutProps = SimpleGridProps;
+/**
+ * FormLayout
+ *
+ * Renders form items in a `SimpleGrid`
+ * @see https://chakra-ui.com/docs/layout/simple-grid
+ */
 export declare const FormLayout: ({ children, ...props }: FormLayoutProps) => JSX.Element;
 //# sourceMappingURL=layout.d.ts.map

package/dist/layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAsB,eAAe,EAAY,MAAM,kBAAkB,CAAA;AAEhF,oBAAY,eAAe,GAAG,eAAe,CAAA;AAU7C,eAAO,MAAM,UAAU,2BAA4B,eAAe,gBAsBjE,CAAA"}
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAsB,eAAe,EAAY,MAAM,kBAAkB,CAAA;AAEhF,oBAAY,eAAe,GAAG,eAAe,CAAA;AAU7C;;;;;GAKG;AACH,eAAO,MAAM,UAAU,2BAA4B,eAAe,gBAsBjE,CAAA"}

package/dist/resolvers/yup.d.ts

@@ -1,6 +1,6 @@
 import { SchemaOf, AnySchema } from 'yup';
-import { FieldProps } from '../Field';
-export declare const resolver: import("@hookform/resolvers/yup").Resolver;
+export { yupResolver } from '@hookform/resolvers/yup';
+import { FieldProps } from '../field';
 /**
  * A helper function to render forms automatically based on a Yup schema
  *

package/dist/resolvers/yup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"yup.d.ts","sourceRoot":"","sources":["../../src/resolvers/yup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAS,MAAM,KAAK,CAAA;AAGhD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,eAAO,MAAM,QAAQ,4CAAc,CAAA;AAmCnC;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,WACtB,SAAS,SAAS,CAAC,KAC1B,UAAU,EA4BZ,CAAA;AAED,eAAO,MAAM,eAAe,WAAY,SAAS,SAAS,CAAC,QAAQ,MAAM,QAExE,CAAA"}
+{"version":3,"file":"yup.d.ts","sourceRoot":"","sources":["../../src/resolvers/yup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAS,MAAM,KAAK,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAErD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAmCrC;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,WACtB,SAAS,SAAS,CAAC,KAC1B,UAAU,EA4BZ,CAAA;AAED,eAAO,MAAM,eAAe,WAAY,SAAS,SAAS,CAAC,QAAQ,MAAM,QAExE,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saas-ui/forms",
-  "version": "0.1.8",
+  "version": "0.2.2",
   "description": "Theme and components agnostic SaasProvider",
   "source": "src/index.ts",
   "exports": {
@@ -39,7 +39,7 @@
   "homepage": "https://saas-ui.dev/",
   "repository": {
     "type": "git",
-    "url": "https://github.com/AppulseSoftware/saas-ui",
+    "url": "https://github.com/saas-js/saas-ui",
     "directory": "packages/saas-ui-forms"
   },
   "keywords": [
@@ -65,20 +65,19 @@
     "@chakra-ui/icons": "^1.1.1",
     "@chakra-ui/react-utils": "^1.2.1",
     "@hookform/resolvers": "^2.8.3",
-    "@saas-ui/button": "0.1.6",
-    "@saas-ui/input-right-button": "0.1.6",
-    "@saas-ui/number-input": "0.1.4",
-    "@saas-ui/password-input": "0.1.7",
-    "@saas-ui/pin-input": "0.1.4",
-    "@saas-ui/radio": "0.1.5",
-    "@saas-ui/select": "0.1.5",
+    "@saas-ui/button": "0.2.0",
+    "@saas-ui/input-right-button": "0.2.0",
+    "@saas-ui/number-input": "0.2.0",
+    "@saas-ui/password-input": "0.2.0",
+    "@saas-ui/pin-input": "0.2.0",
+    "@saas-ui/radio": "0.2.0",
+    "@saas-ui/select": "0.2.0",
     "react-hook-form": "^7.22.0"
   },
   "peerDependencies": {
-    "@chakra-ui/react": ">=1.7.0",
+    "@chakra-ui/react": ">=1.8.0",
     "@chakra-ui/system": ">=1.0.0",
     "react": ">=16.8.6",
     "yup": "^0.32.11"
-  },
-  "optionalDependencies": {}
+  }
 }

package/src/auto-form.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-
+import { FieldValues } from 'react-hook-form'
 import { forwardRef } from '@chakra-ui/react'
 
 import { Form, FormProps } from './form'
@@ -13,14 +13,18 @@ interface AutoFormOptions {
   submitLabel?: false | string
 }
 
-export interface AutoFormProps
-  extends Omit<FormProps, 'schema'>,
+export interface AutoFormProps<TFieldValues extends FieldValues>
+  extends Omit<FormProps<TFieldValues>, 'schema'>,
     AutoFormOptions {}
 
-export const AutoForm = forwardRef<AutoFormProps, 'form'>(
-  ({ schema, submitLabel, ...props }, ref) => {
+export const AutoForm = forwardRef(
+  <TFieldValues extends FieldValues = FieldValues>(
+    props: AutoFormProps<TFieldValues>,
+    ref: React.ForwardedRef<HTMLFormElement>
+  ) => {
+    const { schema, submitLabel, ...rest } = props
     return (
-      <Form {...props} schema={schema} ref={ref}>
+      <Form {...rest} schema={schema} ref={ref}>
         <FormLayout>
           {<Fields schema={schema} />}
           {submitLabel && <SubmitButton label={submitLabel} />}

package/src/display-field.tsx

@@ -8,7 +8,7 @@ import {
   FormLabel,
 } from '@chakra-ui/react'
 
-import { FieldProps } from './Field'
+import { FieldProps } from './field'
 
 export interface DisplayFieldProps
   extends FormControlProps,

package/src/field.tsx

@@ -1,5 +1,15 @@
 import * as React from 'react'
-import { useFormContext, FormState, Controller, get } from 'react-hook-form'
+import {
+  useFormContext,
+  FormState,
+  Controller,
+  get,
+  RegisterOptions,
+  FieldValues,
+  FieldName,
+  FieldPath,
+  FieldPathValue,
+} from 'react-hook-form'
 
 import {
   forwardRef,
@@ -22,11 +32,32 @@ import { RadioInput } from '@saas-ui/radio'
 import { PinInput } from '@saas-ui/pin-input'
 import { Select, NativeSelect } from '@saas-ui/select'
 
-export interface FieldProps extends Omit<FormControlProps, 'label'> {
+export type FieldRules = Pick<
+  RegisterOptions,
+  'required' | 'min' | 'max' | 'maxLength' | 'minLength' | 'pattern'
+>
+
+export type FieldTypes =
+  | 'text'
+  | 'number'
+  | 'password'
+  | 'textarea'
+  | 'select'
+  | 'native-select'
+  | 'checkbox'
+  | 'radio'
+  | 'switch'
+  | 'pin'
+  | string
+
+export interface FieldProps<
+  TFieldValues extends FieldValues = FieldValues,
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+> extends Omit<FormControlProps, 'label' | 'type'> {
   /**
    * The field name
    */
-  name: string
+  name: TName
   /**
    * The field label
    */
@@ -42,7 +73,10 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
   /**
    * React hook form rules
    */
-  rules?: any
+  rules?: Omit<
+    RegisterOptions<TFieldValues, TName>,
+    'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'
+  >
   /**
    * Options used for selects and radio fields
    */
@@ -55,7 +89,7 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
    * - password
    * - textarea
    * - select
-   * - nativeselect
+   * - native-select
    * - checkbox
    * - radio
    * - switch
@@ -64,14 +98,14 @@ export interface FieldProps extends Omit<FormControlProps, 'label'> {
    * Will default to a text field if there is no matching type.
    * @default 'text'
    */
-  type?: string
+  type?: FieldTypes
   /**
    * The input placeholder
    */
   placeholder?: string
 }
 
-const inputTypes: Record<string, any> = {}
+const inputTypes: Record<FieldTypes, any> = {}
 
 const defaultInputType = 'text'
 
@@ -99,7 +133,7 @@ export const BaseField: React.FC<FieldProps> = (props) => {
   const error = getError(name, formState)
 
   return (
-    <FormControl isInvalid={!!error} variant={variant} {...controlProps}>
+    <FormControl variant={variant} {...controlProps} isInvalid={!!error}>
       {label && !hideLabel ? (
         <FormLabel variant={variant}>{label}</FormLabel>
       ) : null}
@@ -137,28 +171,28 @@ const createField = (
 ) => {
   const Field = forwardRef<FieldProps, typeof FormControl>((props, ref) => {
     const {
+      name,
       label,
       isDisabled,
       isInvalid,
       isReadOnly,
       isRequired,
-      isOptional,
       variant,
       ...inputProps
     } = props
 
     return (
       <BaseField
+        name={name}
         label={label}
         hideLabel={hideLabel}
-        isDiabled={isDisabled}
+        isDisabled={isDisabled}
         isInvalid={isInvalid}
         isReadOnly={isReadOnly}
         isRequired={isRequired}
-        isOptional={isOptional}
         variant={variant}
       >
-        <InputComponent ref={ref} label={label} {...inputProps} />
+        <InputComponent ref={ref} name={name} label={label} {...inputProps} />
       </BaseField>
     )
   })
@@ -168,40 +202,44 @@ const createField = (
 }
 
 export const withControlledInput = (InputComponent: any) => {
-  return forwardRef(({ name, rules, ...inputProps }, ref) => {
-    const { control } = useFormContext()
+  return forwardRef<FieldProps, typeof InputComponent>(
+    ({ name, rules, ...inputProps }, ref) => {
+      const { control } = useFormContext()
 
-    return (
-      <Controller
-        name={name}
-        control={control}
-        rules={rules}
-        render={({ field: { ref: _ref, ...field } }) => (
-          <InputComponent
-            {...field}
-            {...inputProps}
-            ref={useMergeRefs(ref, _ref)}
-          />
-        )}
-      />
-    )
-  })
+      return (
+        <Controller
+          name={name}
+          control={control}
+          rules={rules}
+          render={({ field: { ref: _ref, ...field } }) => (
+            <InputComponent
+              {...field}
+              {...inputProps}
+              ref={useMergeRefs(ref, _ref)}
+            />
+          )}
+        />
+      )
+    }
+  )
 }
 
 export const withUncontrolledInput = (InputComponent: any) => {
-  return forwardRef(({ name, rules, ...inputProps }, ref) => {
-    const { register } = useFormContext()
+  return forwardRef<FieldProps, typeof InputComponent>(
+    ({ name, rules, ...inputProps }, ref) => {
+      const { register } = useFormContext()
 
-    const { ref: _ref, ...field } = register(name, rules)
+      const { ref: _ref, ...field } = register(name, rules)
 
-    return (
-      <InputComponent
-        {...field}
-        {...inputProps}
-        ref={useMergeRefs(ref, _ref)}
-      />
-    )
-  })
+      return (
+        <InputComponent
+          {...field}
+          {...inputProps}
+          ref={useMergeRefs(ref, _ref)}
+        />
+      )
+    }
+  )
 }
 
 export interface RegisterFieldTypeOptions {
@@ -220,7 +258,7 @@ export interface RegisterFieldTypeOptions {
  */
 export const registerFieldType = (
   type: string,
-  component: any,
+  component: React.FC<any>,
   options?: RegisterFieldTypeOptions
 ) => {
   let InputComponent

package/src/form.tsx

@@ -7,31 +7,67 @@ import {
   FormProvider,
   UseFormProps,
   FieldErrors,
+  FieldValues,
 } from 'react-hook-form'
 
-import { resolver } from './resolvers/yup'
+import { yupResolver } from './resolvers/yup'
 
 interface FormOptions {
   schema?: any
   submitLabel?: false | string
-}
-
-export interface FormProps extends HTMLChakraProps<'form'>, FormOptions {
-  defaultValues: Record<string, any>
   onSubmit: (arg: any) => Promise<any> | void
   onError?: (errors: FieldErrors) => void
-  children?: React.ReactNode
 }
 
-export const Form = forwardRef<FormProps, 'form'>(
-  ({ schema, defaultValues, onSubmit, onError, children, ...props }, ref) => {
-    const form: UseFormProps = { mode: 'all', defaultValues }
+export interface FormProps<TFieldValues extends FieldValues = FieldValues>
+  extends UseFormProps<TFieldValues>,
+    Omit<HTMLChakraProps<'form'>, 'onSubmit' | 'onError'>,
+    FormOptions {}
+
+/**
+ * @todo Figure out how to pass down FieldValues to all Field components,
+ * if at all possible.
+ */
+export const Form = forwardRef(
+  <TFieldValues extends FieldValues = FieldValues>(
+    props: FormProps<TFieldValues>,
+    ref: React.ForwardedRef<HTMLFormElement>
+  ) => {
+    const {
+      mode = 'all',
+      resolver,
+      reValidateMode,
+      shouldFocusError,
+      shouldUnregister,
+      shouldUseNativeValidation,
+      criteriaMode,
+      delayError,
+      schema,
+      defaultValues,
+      onSubmit,
+      onError,
+      children,
+      ...rest
+    } = props
+
+    const form = {
+      mode,
+      resolver,
+      defaultValues,
+      reValidateMode,
+      shouldFocusError,
+      shouldUnregister,
+      shouldUseNativeValidation,
+      criteriaMode,
+      delayError,
+    }
 
+    // @todo remove yup dependency and just use resolver prop?
     if (schema) {
-      form.resolver = resolver(schema)
+      form.resolver = yupResolver(schema)
     }
 
-    const methods = useForm(form)
+    const methods = useForm<TFieldValues>(form)
     const { handleSubmit } = methods
 
     return (
@@ -39,11 +75,13 @@ export const Form = forwardRef<FormProps, 'form'>(
         <chakra.form
           ref={ref}
           onSubmit={handleSubmit(onSubmit, onError)}
-          {...props}
+          {...rest}
         >
           {children}
         </chakra.form>
       </FormProvider>
     )
   }
-)
+) as <TFieldValues extends FieldValues>(
+  props: FormProps<TFieldValues> & { ref?: React.ForwardedRef<HTMLFormElement> }
+) => React.ReactElement

package/src/layout.tsx

@@ -12,6 +12,12 @@ const FormLayoutItem: React.FC<FormLayoutItemProps> = ({ children }) => {
   return <chakra.div>{children}</chakra.div>
 }
 
+/**
+ * FormLayout
+ *
+ * Renders form items in a `SimpleGrid`
+ * @see https://chakra-ui.com/docs/layout/simple-grid
+ */
 export const FormLayout = ({ children, ...props }: FormLayoutProps) => {
   const theme = useTheme()
 

package/src/resolvers/yup.ts

@@ -1,9 +1,7 @@
 import { SchemaOf, AnySchema, reach } from 'yup'
-import { yupResolver } from '@hookform/resolvers/yup'
+export { yupResolver } from '@hookform/resolvers/yup'
 
-import { FieldProps } from '../Field'
-
-export const resolver = yupResolver
+import { FieldProps } from '../field'
 
 // @TODO get proper typings for the schema fields
 

package/dist/Field.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../src/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAIL,gBAAgB,EASjB,MAAM,kBAAkB,CAAA;AAQzB,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACjE;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAA;IACX;;OAEG;IACH,OAAO,CAAC,EAAE,GAAG,CAAA;IACb;;;;;;;;;;;;;;;;OAgBG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAqBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAwB1C,CAAA;AAED,eAAO,MAAM,KAAK,6HAOjB,CAAA;AA4CD,eAAO,MAAM,mBAAmB,mBAAoB,GAAG,2FAmBtD,CAAA;AAED,eAAO,MAAM,qBAAqB,mBAAoB,GAAG,2FAcxD,CAAA;AAED,MAAM,WAAW,wBAAwB;IACvC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;CAC1B;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,iBAAiB,SACtB,MAAM,aACD,GAAG,gLAsBf,CAAA;AAID,eAAO,MAAM,UAAU,6HAAmC,CAAA;AAC1D,eAAO,MAAM,gBAAgB,6HAE3B,CAAA;AACF,eAAO,MAAM,kBAAkB,6HAA+C,CAAA;AAC9E,eAAO,MAAM,aAAa,6HAA0C,CAAA;AACpE,eAAO,MAAM,WAAW,6HAavB,CAAA;AACD,eAAO,MAAM,WAAW,6HAEtB,CAAA;AACF,eAAO,MAAM,aAAa,6HAYzB,CAAA;AACD,eAAO,MAAM,UAAU,6HAErB,CAAA;AACF,eAAO,MAAM,QAAQ,6HAEnB,CAAA;AACF,eAAO,MAAM,iBAAiB,6HAI7B,CAAA"}