@saas-ui/forms 2.0.0-next.3 → 2.0.0-next.6

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @saas-ui/forms
 
+## 2.0.0-next.6
+
+### Major Changes
+
+- 532011d6: Restructured the Select component to make it atomic, the new composition is Select, SelectButton, SelectList and SelectOption.
+- 39e778d8: Form will now render AutoField by default when no children are passed.
+
+### Minor Changes
+
+- 532011d6: Select can now supports theming using the SuiSelect theme config.
+- 6dd737ce: Select field now renders invalid state.
+- c85541cb: AutoForm field props can now be overridden using the fields prop on Form
+
+## 2.0.0-next.5
+
+### Minor Changes
+
+- a8ea24da: PasswordInput now accepts leftAddon property.
+
+### Patch Changes
+
+- Updated dependencies [61b27fa6]
+  - @saas-ui/core@2.0.0-next.5
+
+## 2.0.0-next.4
+
+### Patch Changes
+
+- Updated dependencies [83f54180]
+- Updated dependencies [ba61612f]
+- Updated dependencies [83f54180]
+- Updated dependencies [83f54180]
+- Updated dependencies [83f54180]
+- Updated dependencies [83f54180]
+- Updated dependencies [27a68bca]
+  - @saas-ui/core@2.0.0-next.4
+
 ## 2.0.0-next.3
 
 ### Patch Changes
@@ -39,6 +76,12 @@
 - Updated dependencies [3a15e8c8]
   - @saas-ui/core@2.0.0-next.0
 
+## 1.5.3
+
+### Patch Changes
+
+- 382e095: InputRightButton no longer exported from forms package to prevent conflicts.
+
 ## 1.5.2
 
 ### Patch Changes

package/README.md

@@ -1,10 +1,11 @@
-# @saas-ui/forms
+# Forms Manager
 
-Chakra UI Forms.
+Powerfull forms library for Chakra UI.
+Create typesafe React forms with speed.
 
-Create fully functional React forms with just a few lines of code.
+Supports Zod, Yup and AJV for validation and form generation.
 
-Uses React Hook Form under the hood.
+- [Docs](https://www.saas-ui.dev/docs/forms/form)
 
 ## Installation
 
@@ -16,9 +17,55 @@ $ yarn add @saas-ui/forms
 $ npm i @saas-ui/forms  --save
 ```
 
-## Docs
+## Usage with Zod
 
-https://www.saas-ui.dev/docs/forms/form
+### AutoForm
+
+Generate forms from schema.
+
+```tsx
+import { createZodForm } from '@saas-ui/forms/zod'
+
+const { AutoForm } = createZodForm()
+
+const schema = z.object({
+  name: z.string(),
+})
+
+function App() {
+  const onSubmit = (data: z.infer<typeof schema>) => {}
+  return <AutoForm schema={schema} onSubmit={onSubmit} />
+}
+```
+
+### Form
+
+Create custom typesafe forms.
+
+```tsx
+import { FormLayout, createZodForm } from '@saas-ui/forms/zod'
+
+const { Form, SubmitButton } = createZodForm()
+
+const schema = z.object({
+  name: z.string()
+})
+
+function App() {
+  const onSubmit = (data: z.infer<typeof schema>) => {}
+
+  return (
+    <Form schema={schema} onSubmit={onSubmit}>
+        {({ Field }) => (
+            <FormLayout>
+                <Field name="name" type="text" />
+                <SubmitButton>Save</SubmitButton>
+            </FormLayotu>
+        )}
+    </Form>
+  )
+}
+```
 
 ## Source
 

package/dist/ajv/index.d.ts

@@ -1,21 +1,368 @@
+import * as React$1 from 'react';
+import React$1__default from 'react';
+import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
+import { HTMLChakraProps, ButtonProps, TextareaProps, SwitchProps, CheckboxProps, FormControlProps, ResponsiveValue, InputProps, RadioGroupProps, MenuProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, RadioProps } from '@chakra-ui/react';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, UseFormProps, FieldPath, UseFormReturn, WatchObserver, SubmitHandler, SubmitErrorHandler, RegisterOptions, UseFieldArrayReturn } from 'react-hook-form';
+import { MaybeRenderProp } from '@chakra-ui/react-utils';
+import * as ajv_dist_jtd from 'ajv/dist/jtd';
+import { JTDDataType } from 'ajv/dist/jtd';
+export { JTDDataType, JTDSchemaType } from 'ajv/dist/jtd';
+import * as _saas_ui_forms from '@saas-ui/forms';
+import { FieldResolver as FieldResolver$1, CreateFormProps, WithFields as WithFields$1, FormProps as FormProps$1 } from '@saas-ui/forms';
+import { JSONSchemaType } from 'ajv';
 import { ajvResolver } from '@hookform/resolvers/ajv';
 export { ajvResolver } from '@hookform/resolvers/ajv';
-import { FieldResolver, CreateFormProps } from '@saas-ui/forms';
-import { JSONSchemaType } from 'ajv';
-export { JTDDataType, JTDSchemaType } from 'ajv/dist/jtd';
 
-interface JsonSchemaFormReturn {
-    schema: JSONSchemaType<unknown>;
-    fieldResolver: FieldResolver;
-    resolver: ReturnType<typeof ajvResolver>;
+interface SubmitButtonProps extends ButtonProps {
+    /**
+     * Disable the submit button if the form is untouched.
+     *
+     * Change the default behavior by updating
+     * `SubmitButton.defaultProps.disableIfUntouched`
+     */
+    disableIfUntouched?: boolean;
+    /**
+     * Disable the submit button if the form is invalid.
+     *
+     * Change the default behavior by updating
+     * `SubmitButton.defaultProps.disableIfInvalid`
+     */
+    disableIfInvalid?: boolean;
+}
+
+interface NumberInputOptions {
+    /**
+     * Hide the stepper.
+     */
+    hideStepper?: boolean;
+    /**
+     * Render a custom increment icon.
+     */
+    incrementIcon?: React$1.ReactNode;
+    /**
+     * Render a custom decrement icon.
+     */
+    decrementIcon?: React$1.ReactNode;
+}
+interface NumberInputProps extends NumberInputProps$1, NumberInputOptions {
+}
+
+interface PasswordOptions {
+    viewIcon?: React$1__default.ReactNode;
+    viewOffIcon?: React$1__default.ReactNode;
+    leftAddon?: React$1__default.ReactNode;
+}
+interface PasswordInputProps extends InputProps, PasswordOptions {
+}
+
+interface RadioOption extends Omit<RadioProps, 'value' | 'label'>, FieldOption {
+}
+type RadioOptions = FieldOptions<RadioOption>;
+interface RadioInputOptions {
+    options: RadioOptions;
+    spacing?: SystemProps['margin'];
+    direction?: StackDirection;
+}
+interface RadioInputProps extends Omit<RadioGroupProps, 'children'>, RadioInputOptions {
+}
+
+interface SelectOptions {
+    /**
+     * The name of the input field in a native form.
+     */
+    name: string;
+    /**
+     * The value of the select field.
+     */
+    value?: string | string[];
+    /**
+     * The initial value of the select field.
+     */
+    defaultValue?: string | string[];
+    /**
+     * The callback invoked when the value of the select field changes.
+     * @param value The value of the select field.
+     */
+    onChange?: (value: string | string[]) => void;
+    /**
+     * The placeholder text when there's no value.
+     */
+    placeholder?: string;
+    /**
+     * If `true`, the select will be disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * An array of options
+     * If you leave this empty the children prop will be rendered.
+     */
+    options?: FieldOptions<SelectOption>;
+    /**
+     * Enable multiple select.
+     */
+    multiple?: boolean;
+    /**
+     * The function used to render the value of the select field.
+     * @param value The value of the select field.
+     * @returns The rendered value.
+     */
+    renderValue?: (value: string | string[]) => React$1__default.ReactNode;
+}
+
+interface SelectProps extends Omit<MenuProps, 'children'>, SelectOptions {
+}
+interface SelectOption extends Omit<MenuItemOptionProps, 'value'>, FieldOption {
+}
+/**
+ * An option in a select list
+ *
+ * @see https://saas-ui.dev/docs/components/forms/select
+ */
+declare const SelectOption: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", MenuItemOptionProps>;
+
+interface Option$1 {
+    value: string;
+    label?: string;
+}
+interface NativeSelectOptions {
+    options?: Option$1[];
+}
+interface NativeSelectProps extends SelectProps$1, NativeSelectOptions {
 }
-declare const jsonSchemaForm: (schema: JSONSchemaType<unknown>) => JsonSchemaFormReturn;
+
+interface InputFieldProps extends InputProps {
+    type?: string;
+    leftAddon?: React$1.ReactNode;
+    rightAddon?: React$1.ReactNode;
+}
+interface NumberInputFieldProps extends NumberInputProps {
+    type: 'number';
+}
+interface PinFieldProps extends Omit<UsePinInputProps, 'type'> {
+    pinLength?: number;
+    pinType?: 'alphanumeric' | 'number';
+    spacing?: SystemProps['margin'];
+}
+declare const defaultFieldTypes: {
+    text: React$1.FC<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    email: React$1.FC<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    url: React$1.FC<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    phone: React$1.FC<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    number: React$1.FC<NumberInputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    password: React$1.FC<PasswordInputProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    textarea: React$1.FC<TextareaProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    switch: React$1.FC<SwitchProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    select: React$1.FC<SelectProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    checkbox: React$1.FC<CheckboxProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    radio: React$1.FC<RadioInputProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    pin: React$1.FC<PinFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+    'native-select': React$1.FC<NativeSelectProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
+};
+type DefaultFields = typeof defaultFieldTypes;
+
+type FieldOption = {
+    label?: string;
+    value: string;
+};
+type FieldOptions<TOption extends FieldOption = FieldOption> = Array<string> | Array<TOption>;
+type ValueOf<T> = T[keyof T];
+type ShallowMerge<A, B> = Omit<A, keyof B> & B;
+type Split<S extends string, D extends string> = string extends S ? string[] : S extends '' ? [] : S extends `${infer T}${D}${infer U}` ? [T, ...Split<U, D>] : [S];
+type MapPath<T extends string[]> = T extends [infer U, ...infer R] ? U extends string ? `${U extends `${number}` ? '$' : U}${R[0] extends string ? '.' : ''}${R extends string[] ? MapPath<R> : ''}` : '' : '';
+type TransformPath<T extends string> = MapPath<Split<T, '.'>>;
+type ArrayFieldPath<Name extends string> = Name extends string ? TransformPath<Name> : never;
+interface BaseFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Omit<FormControlProps, 'label' | 'type'> {
+    /**
+     * The field name
+     */
+    name: TName | ArrayFieldPath<TName>;
+    /**
+     * The field label
+     */
+    label?: string;
+    /**
+     * Hide the field label
+     */
+    hideLabel?: boolean;
+    /**
+     * Field help text
+     */
+    help?: string;
+    /**
+     * React hook form rules
+     */
+    rules?: Omit<RegisterOptions<TFieldValues, TName>, 'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'>;
+    /**
+     * Build-in types:
+     * text, number, password, textarea, select, native-select, checkbox, radio, switch, pin
+     *
+     * Will default to a text field if there is no matching type.
+     */
+    type?: string;
+    /**
+     * The input placeholder
+     */
+    placeholder?: string;
+}
+type FieldPathWithArray<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = TName | ArrayFieldPath<TName>;
+type MergeFieldProps<FieldDefs, TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = ValueOf<{
+    [K in keyof FieldDefs]: FieldDefs[K] extends React.FC<infer Props> ? {
+        type?: K;
+    } & ShallowMerge<Props, BaseFieldProps<TFieldValues, TName>> : never;
+}>;
+type FieldProps<TFieldValues extends FieldValues = FieldValues> = MergeFieldProps<DefaultFields, TFieldValues>;
+type FormChildren<FieldDefs, TFieldValues extends FieldValues = FieldValues, TContext extends object = object> = MaybeRenderProp<FormRenderContext<TFieldValues, TContext, MergeFieldProps<FieldDefs extends never ? DefaultFields : ShallowMerge<DefaultFields, FieldDefs>, TFieldValues>>>;
+type DefaultFieldOverrides = {
+    submit?: SubmitButtonProps;
+    [key: string]: any;
+};
+type FieldOverrides<FieldDefs, TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
+    [K in FieldPathWithArray<TFieldValues, TName>]?: Omit<MergeFieldProps<FieldDefs extends never ? DefaultFields : ShallowMerge<DefaultFields, FieldDefs>, TFieldValues>, 'name'>;
+};
+type WithFields<TFormProps extends FormProps<any, any, any, any>, FieldDefs> = TFormProps extends FormProps<infer TFieldValues, infer TContext> ? Omit<TFormProps, 'children' | 'fields'> & {
+    children?: FormChildren<FieldDefs, TFieldValues, TContext>;
+    fields?: FieldOverrides<FieldDefs, TFieldValues> & {
+        submit?: SubmitButtonProps;
+    };
+} : never;
+
+type FieldResolver = {
+    getFields(): BaseFieldProps[];
+    getNestedFields(name: string): BaseFieldProps[];
+};
+
+interface DisplayIfProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
+    children: React$1.ReactElement;
+    name: TName;
+    defaultValue?: unknown;
+    isDisabled?: boolean;
+    isExact?: boolean;
+    condition?: (value: unknown, context: UseFormReturn<TFieldValues>) => boolean;
+}
+
+interface UseArrayFieldReturn extends UseFieldArrayReturn {
+    /**
+     * The array field name
+     */
+    name: string;
+    /**
+     * The default value for new items
+     */
+    defaultValue: Record<string, any>;
+    /**
+     * Min amount of items
+     */
+    min?: number;
+    /**
+     * Max amount of items
+     */
+    max?: number;
+}
+interface ArrayFieldOptions<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
+    /**
+     * The field name
+     */
+    name: TName;
+    /**
+     * Default value for new values in the array
+     */
+    defaultValue?: Record<string, any>;
+    /**
+     * Default key name for rows, change this if your data uses a different 'id' field
+     * @default "id"
+     */
+    keyName?: string;
+    min?: number;
+    max?: number;
+}
+interface ArrayFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ArrayFieldOptions<TFieldValues, TName>, Omit<BaseFieldProps<TFieldValues, TName>, 'name' | 'defaultValue' | 'children'> {
+    children: MaybeRenderProp<ArrayField[]>;
+}
+interface ArrayField {
+    id: string;
+    [key: string]: unknown;
+}
+/**
+ * The wrapper component that composes the default ArrayField functionality.
+ *
+ * @see Docs https://saas-ui.dev/docs/components/forms/array-field
+ */
+declare const ArrayField: ((props: ArrayFieldProps & {
+    ref?: React$1.ForwardedRef<UseArrayFieldReturn>;
+}) => React$1.ReactElement) & {
+    displayName: string;
+};
+
+interface ObjectFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends BaseFieldProps {
+    name: TName;
+    children: React$1.ReactNode;
+    columns?: ResponsiveValue<number>;
+    spacing?: ResponsiveValue<string | number>;
+}
+
+interface FormRenderContext<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseFormReturn<TFieldValues, TContext> {
+    Field: React$1.FC<TFieldTypes>;
+    DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
+    ArrayField: React$1.FC<ArrayFieldProps<TFieldValues>>;
+    ObjectField: React$1.FC<ObjectFieldProps<TFieldValues>>;
+}
+interface FormOptions<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>> {
+    /**
+     * The form schema.
+     */
+    schema?: TSchema;
+    /**
+     * Triggers when any of the field change.
+     */
+    onChange?: WatchObserver<TFieldValues>;
+    /**
+     * The submit handler.
+     */
+    onSubmit: SubmitHandler<TFieldValues>;
+    /**
+     * Triggers when there are validation errors.
+     */
+    onError?: SubmitErrorHandler<TFieldValues>;
+    /**
+     * The Hook Form state ref.
+     */
+    formRef?: React$1.RefObject<UseFormReturn<TFieldValues, TContext>>;
+    /**
+     * The form children, can be a render prop or a ReactNode.
+     */
+    children?: MaybeRenderProp<FormRenderContext<TFieldValues, TContext, TFieldTypes>>;
+    /**
+     * The field resolver, used to resolve the fields from schemas.
+     */
+    fieldResolver?: FieldResolver;
+    /**
+     * Field overrides
+     */
+    fields?: DefaultFieldOverrides;
+}
+interface FormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>> extends UseFormProps<TFieldValues, TContext>, Omit<HTMLChakraProps<'form'>, 'children' | 'onChange' | 'onSubmit' | 'onError'>, FormOptions<TFieldValues, TContext, TSchema, TFieldTypes> {
+}
+
+declare const ajvFieldResolver: (schema: JSONSchemaType<unknown>) => FieldResolver$1;
 
 type ResolverArgs = Parameters<typeof ajvResolver>;
-interface CreateAjvFormProps extends CreateFormProps {
+interface CreateAjvFormProps<FieldDefs> extends CreateFormProps<FieldDefs> {
     schemaOptions?: ResolverArgs[1];
     resolverOptions?: ResolverArgs[2];
 }
-declare function createAjvForm(options?: CreateAjvFormProps): any;
+/**
+ * Create a Form component with AJV validation that accepts JSON Type Definition schema
+ *
+ * @see Docs https://saas-ui.dev/docs/components/forms/form
+ * @see https://ajv.js.org/json-type-definition.html
+ */
+declare function createAjvForm<FieldDefs>(options?: CreateAjvFormProps<FieldDefs>): <TSchema extends Record<string, any>, TContext extends object = object, TJSONSchema = JTDDataType<TSchema>>(props: WithFields$1<FormProps$1<TJSONSchema, TContext, TSchema, _saas_ui_forms.FieldProps<TJSONSchema>>, FieldDefs> & {
+    ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
+}) => React.ReactElement;
+
+declare const Form: <TSchema extends Record<string, any>, TContext extends object = object, TJSONSchema = ajv_dist_jtd.JTDDataType<TSchema>>(props: WithFields<FormProps<TJSONSchema, TContext, TSchema, FieldProps<TJSONSchema>>, unknown> & {
+    ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
+}) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>;
 
-export { CreateAjvFormProps, createAjvForm, jsonSchemaForm };
+export { CreateAjvFormProps, Form, ajvFieldResolver, createAjvForm };

package/dist/ajv/index.js

@@ -4,28 +4,26 @@ var ajv = require('@hookform/resolvers/ajv');
 var forms = require('@saas-ui/forms');
 
 // ajv/src/ajv-resolver.ts
-var jsonSchemaFieldResolver = (schema) => {
+var ajvFieldResolver = (schema) => {
   return forms.objectFieldResolver(schema.properties);
 };
-var jsonSchemaForm = (schema) => {
-  return {
-    schema,
-    fieldResolver: jsonSchemaFieldResolver(schema),
-    resolver: ajv.ajvResolver(schema)
-  };
-};
 function createAjvForm(options) {
   return forms.createForm({
     resolver: (schema) => ajv.ajvResolver(schema, options == null ? void 0 : options.schemaOptions, options == null ? void 0 : options.resolverOptions),
+    fieldResolver: ajvFieldResolver,
     ...options
   });
 }
 
+// ajv/src/index.ts
+var Form = createAjvForm();
+
 Object.defineProperty(exports, 'ajvResolver', {
   enumerable: true,
   get: function () { return ajv.ajvResolver; }
 });
+exports.Form = Form;
+exports.ajvFieldResolver = ajvFieldResolver;
 exports.createAjvForm = createAjvForm;
-exports.jsonSchemaForm = jsonSchemaForm;
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map

package/dist/ajv/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../ajv/src/ajv-resolver.ts","../../ajv/src/create-ajv-form.ts"],"names":[],"mappings":";AAAA,SAAS,mBAAmB;AAC5B,SAAS,2BAA0C;AAMnD,IAAM,0BAA0B,CAAC,WAAoC;AACnE,SAAO,oBAAoB,OAAO,UAAU;AAC9C;AAQO,IAAM,iBAAiB,CAC5B,WACyB;AACzB,SAAO;AAAA,IACL;AAAA,IACA,eAAe,wBAAwB,MAAM;AAAA,IAC7C,UAAU,YAAY,MAAM;AAAA,EAC9B;AACF;;;ACzBA;AAAA,EACE;AAAA,OAIK;AAWA,SAAS,cAAc,SAAmC;AAC/D,SAAO,WAAW;AAAA,IAChB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,GAAG;AAAA,EACL,CAAC;AAOH","sourcesContent":["import { ajvResolver } from '@hookform/resolvers/ajv'\nimport { objectFieldResolver, FieldResolver } from '@saas-ui/forms'\n\nimport { JSONSchemaType } from 'ajv'\n\nexport { ajvResolver }\n\nconst jsonSchemaFieldResolver = (schema: JSONSchemaType<unknown>) => {\n  return objectFieldResolver(schema.properties)\n}\n\ninterface JsonSchemaFormReturn {\n  schema: JSONSchemaType<unknown>\n  fieldResolver: FieldResolver\n  resolver: ReturnType<typeof ajvResolver>\n}\n\nexport const jsonSchemaForm = (\n  schema: JSONSchemaType<unknown>\n): JsonSchemaFormReturn => {\n  return {\n    schema,\n    fieldResolver: jsonSchemaFieldResolver(schema),\n    resolver: ajvResolver(schema),\n  }\n}\n","import {\n  createForm,\n  CreateFormProps,\n  FieldValues,\n  FormProps,\n} from '@saas-ui/forms'\nimport { ajvResolver } from './ajv-resolver'\nimport { JSONSchemaType } from 'ajv'\n\ntype ResolverArgs = Parameters<typeof ajvResolver>\n\nexport interface CreateAjvFormProps extends CreateFormProps {\n  schemaOptions?: ResolverArgs[1]\n  resolverOptions?: ResolverArgs[2]\n}\n\nexport function createAjvForm(options?: CreateAjvFormProps): any {\n  return createForm({\n    resolver: (schema) =>\n      ajvResolver(schema, options?.schemaOptions, options?.resolverOptions),\n    ...options,\n  }) as <\n    TFieldValues extends FieldValues = FieldValues,\n    TSchema extends JSONSchemaType<TFieldValues> = JSONSchemaType<TFieldValues>,\n    TContext extends object = object\n  >(\n    props: FormProps<TFieldValues, TContext, TSchema>\n  ) => React.ReactElement\n}\n"]}
+{"version":3,"sources":["../../ajv/src/ajv-resolver.ts","../../ajv/src/create-ajv-form.ts","../../ajv/src/index.ts"],"names":[],"mappings":";AAAA,SAAS,mBAAmB;AAC5B,SAAS,2BAA0C;AAM5C,IAAM,mBAAmB,CAAC,WAAoC;AACnE,SAAO,oBAAoB,OAAO,UAAU;AAC9C;;;ACTA;AAAA,EACE;AAAA,OAIK;AAiBA,SAAS,cACd,SACA;AACA,SAAO,WAAgB;AAAA,IACrB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAUH;;;ACjCO,IAAM,OAAO,cAAc","sourcesContent":["import { ajvResolver } from '@hookform/resolvers/ajv'\nimport { objectFieldResolver, FieldResolver } from '@saas-ui/forms'\n\nimport { JSONSchemaType } from 'ajv'\n\nexport { ajvResolver }\n\nexport const ajvFieldResolver = (schema: JSONSchemaType<unknown>) => {\n  return objectFieldResolver(schema.properties)\n}\n","import {\n  createForm,\n  CreateFormProps,\n  FormProps,\n  WithFields,\n} from '@saas-ui/forms'\nimport { ajvFieldResolver, ajvResolver } from './ajv-resolver'\nimport { JTDDataType } from 'ajv/dist/jtd'\ntype ResolverArgs = Parameters<typeof ajvResolver>\n\nexport interface CreateAjvFormProps<FieldDefs>\n  extends CreateFormProps<FieldDefs> {\n  schemaOptions?: ResolverArgs[1]\n  resolverOptions?: ResolverArgs[2]\n}\n\n/**\n * Create a Form component with AJV validation that accepts JSON Type Definition schema\n *\n * @see Docs https://saas-ui.dev/docs/components/forms/form\n * @see https://ajv.js.org/json-type-definition.html\n */\nexport function createAjvForm<FieldDefs>(\n  options?: CreateAjvFormProps<FieldDefs>\n) {\n  return createForm<any>({\n    resolver: (schema) =>\n      ajvResolver(schema, options?.schemaOptions, options?.resolverOptions),\n    fieldResolver: ajvFieldResolver,\n    ...options,\n  }) as <\n    TSchema extends Record<string, any>,\n    TContext extends object = object,\n    TJSONSchema = JTDDataType<TSchema>\n  >(\n    /** @ts-expect-error @todo properly fix these types */\n    props: WithFields<FormProps<TJSONSchema, TContext, TSchema>, FieldDefs> & {\n      ref?: React.ForwardedRef<HTMLFormElement>\n    }\n  ) => React.ReactElement\n}\n","export * from './ajv-resolver'\nexport { createAjvForm } from './create-ajv-form'\nexport type { CreateAjvFormProps } from './create-ajv-form'\nexport type { JTDDataType, JTDSchemaType } from 'ajv/dist/jtd'\n\nimport { createAjvForm } from './create-ajv-form'\n\nexport const Form = createAjvForm()\n"]}

package/dist/ajv/index.mjs

@@ -1,25 +1,22 @@
 import { ajvResolver } from '@hookform/resolvers/ajv';
 export { ajvResolver } from '@hookform/resolvers/ajv';
-import { createForm, objectFieldResolver } from '@saas-ui/forms';
+import { objectFieldResolver, createForm } from '@saas-ui/forms';
 
 // ajv/src/ajv-resolver.ts
-var jsonSchemaFieldResolver = (schema) => {
+var ajvFieldResolver = (schema) => {
   return objectFieldResolver(schema.properties);
 };
-var jsonSchemaForm = (schema) => {
-  return {
-    schema,
-    fieldResolver: jsonSchemaFieldResolver(schema),
-    resolver: ajvResolver(schema)
-  };
-};
 function createAjvForm(options) {
   return createForm({
     resolver: (schema) => ajvResolver(schema, options == null ? void 0 : options.schemaOptions, options == null ? void 0 : options.resolverOptions),
+    fieldResolver: ajvFieldResolver,
     ...options
   });
 }
 
-export { createAjvForm, jsonSchemaForm };
+// ajv/src/index.ts
+var Form = createAjvForm();
+
+export { Form, ajvFieldResolver, createAjvForm };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.mjs.map

package/dist/ajv/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../ajv/src/ajv-resolver.ts","../../ajv/src/create-ajv-form.ts"],"names":[],"mappings":";AAAA,SAAS,mBAAmB;AAC5B,SAAS,2BAA0C;AAMnD,IAAM,0BAA0B,CAAC,WAAoC;AACnE,SAAO,oBAAoB,OAAO,UAAU;AAC9C;AAQO,IAAM,iBAAiB,CAC5B,WACyB;AACzB,SAAO;AAAA,IACL;AAAA,IACA,eAAe,wBAAwB,MAAM;AAAA,IAC7C,UAAU,YAAY,MAAM;AAAA,EAC9B;AACF;;;ACzBA;AAAA,EACE;AAAA,OAIK;AAWA,SAAS,cAAc,SAAmC;AAC/D,SAAO,WAAW;AAAA,IAChB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,GAAG;AAAA,EACL,CAAC;AAOH","sourcesContent":["import { ajvResolver } from '@hookform/resolvers/ajv'\nimport { objectFieldResolver, FieldResolver } from '@saas-ui/forms'\n\nimport { JSONSchemaType } from 'ajv'\n\nexport { ajvResolver }\n\nconst jsonSchemaFieldResolver = (schema: JSONSchemaType<unknown>) => {\n  return objectFieldResolver(schema.properties)\n}\n\ninterface JsonSchemaFormReturn {\n  schema: JSONSchemaType<unknown>\n  fieldResolver: FieldResolver\n  resolver: ReturnType<typeof ajvResolver>\n}\n\nexport const jsonSchemaForm = (\n  schema: JSONSchemaType<unknown>\n): JsonSchemaFormReturn => {\n  return {\n    schema,\n    fieldResolver: jsonSchemaFieldResolver(schema),\n    resolver: ajvResolver(schema),\n  }\n}\n","import {\n  createForm,\n  CreateFormProps,\n  FieldValues,\n  FormProps,\n} from '@saas-ui/forms'\nimport { ajvResolver } from './ajv-resolver'\nimport { JSONSchemaType } from 'ajv'\n\ntype ResolverArgs = Parameters<typeof ajvResolver>\n\nexport interface CreateAjvFormProps extends CreateFormProps {\n  schemaOptions?: ResolverArgs[1]\n  resolverOptions?: ResolverArgs[2]\n}\n\nexport function createAjvForm(options?: CreateAjvFormProps): any {\n  return createForm({\n    resolver: (schema) =>\n      ajvResolver(schema, options?.schemaOptions, options?.resolverOptions),\n    ...options,\n  }) as <\n    TFieldValues extends FieldValues = FieldValues,\n    TSchema extends JSONSchemaType<TFieldValues> = JSONSchemaType<TFieldValues>,\n    TContext extends object = object\n  >(\n    props: FormProps<TFieldValues, TContext, TSchema>\n  ) => React.ReactElement\n}\n"]}
+{"version":3,"sources":["../../ajv/src/ajv-resolver.ts","../../ajv/src/create-ajv-form.ts","../../ajv/src/index.ts"],"names":[],"mappings":";AAAA,SAAS,mBAAmB;AAC5B,SAAS,2BAA0C;AAM5C,IAAM,mBAAmB,CAAC,WAAoC;AACnE,SAAO,oBAAoB,OAAO,UAAU;AAC9C;;;ACTA;AAAA,EACE;AAAA,OAIK;AAiBA,SAAS,cACd,SACA;AACA,SAAO,WAAgB;AAAA,IACrB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAUH;;;ACjCO,IAAM,OAAO,cAAc","sourcesContent":["import { ajvResolver } from '@hookform/resolvers/ajv'\nimport { objectFieldResolver, FieldResolver } from '@saas-ui/forms'\n\nimport { JSONSchemaType } from 'ajv'\n\nexport { ajvResolver }\n\nexport const ajvFieldResolver = (schema: JSONSchemaType<unknown>) => {\n  return objectFieldResolver(schema.properties)\n}\n","import {\n  createForm,\n  CreateFormProps,\n  FormProps,\n  WithFields,\n} from '@saas-ui/forms'\nimport { ajvFieldResolver, ajvResolver } from './ajv-resolver'\nimport { JTDDataType } from 'ajv/dist/jtd'\ntype ResolverArgs = Parameters<typeof ajvResolver>\n\nexport interface CreateAjvFormProps<FieldDefs>\n  extends CreateFormProps<FieldDefs> {\n  schemaOptions?: ResolverArgs[1]\n  resolverOptions?: ResolverArgs[2]\n}\n\n/**\n * Create a Form component with AJV validation that accepts JSON Type Definition schema\n *\n * @see Docs https://saas-ui.dev/docs/components/forms/form\n * @see https://ajv.js.org/json-type-definition.html\n */\nexport function createAjvForm<FieldDefs>(\n  options?: CreateAjvFormProps<FieldDefs>\n) {\n  return createForm<any>({\n    resolver: (schema) =>\n      ajvResolver(schema, options?.schemaOptions, options?.resolverOptions),\n    fieldResolver: ajvFieldResolver,\n    ...options,\n  }) as <\n    TSchema extends Record<string, any>,\n    TContext extends object = object,\n    TJSONSchema = JTDDataType<TSchema>\n  >(\n    /** @ts-expect-error @todo properly fix these types */\n    props: WithFields<FormProps<TJSONSchema, TContext, TSchema>, FieldDefs> & {\n      ref?: React.ForwardedRef<HTMLFormElement>\n    }\n  ) => React.ReactElement\n}\n","export * from './ajv-resolver'\nexport { createAjvForm } from './create-ajv-form'\nexport type { CreateAjvFormProps } from './create-ajv-form'\nexport type { JTDDataType, JTDSchemaType } from 'ajv/dist/jtd'\n\nimport { createAjvForm } from './create-ajv-form'\n\nexport const Form = createAjvForm()\n"]}