@saas-ui/forms 3.0.0-alpha.2 → 3.0.0-alpha.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/CHANGELOG.md +161 -0
  2. package/dist/index.d.mts +25 -12
  3. package/dist/index.d.ts +25 -12
  4. package/dist/index.js +111 -96
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +86 -71
  7. package/dist/index.mjs.map +1 -1
  8. package/dist/yup/index.d.mts +4 -4
  9. package/dist/yup/index.d.ts +4 -4
  10. package/dist/yup/index.js.map +1 -1
  11. package/dist/yup/index.mjs.map +1 -1
  12. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,166 @@
1
1
  # @saas-ui/forms
2
2
 
3
+ ## 3.0.0-alpha.20
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [f85d493]
8
+ - Updated dependencies [f85d493]
9
+ - @saas-ui/react@3.0.0-alpha.20
10
+ - @saas-ui/core@3.0.0-alpha.6
11
+
12
+ ## 3.0.0-alpha.19
13
+
14
+ ### Patch Changes
15
+
16
+ - 38082d4: Improved horizontal field styles
17
+ - Updated dependencies [ba3b566]
18
+ - Updated dependencies [38082d4]
19
+ - Updated dependencies [ba3b566]
20
+ - Updated dependencies [ba3b566]
21
+ - Updated dependencies [3a73bc8]
22
+ - Updated dependencies [ba3b566]
23
+ - Updated dependencies [727b902]
24
+ - @saas-ui/react@3.0.0-alpha.19
25
+
26
+ ## 3.0.0-alpha.18
27
+
28
+ ### Patch Changes
29
+
30
+ - Updated dependencies [eb02362]
31
+ - Updated dependencies [e7fe684]
32
+ - Updated dependencies [eb02362]
33
+ - Updated dependencies [eb02362]
34
+ - @saas-ui/react@3.0.0-alpha.18
35
+ - @saas-ui/core@3.0.0-alpha.5
36
+
37
+ ## 3.0.0-alpha.17
38
+
39
+ ### Patch Changes
40
+
41
+ - Updated dependencies [a2ef175]
42
+ - @saas-ui/react@3.0.0-alpha.17
43
+
44
+ ## 3.0.0-alpha.16
45
+
46
+ ### Patch Changes
47
+
48
+ - Updated dependencies [205580d]
49
+ - Updated dependencies [205580d]
50
+ - @saas-ui/react@3.0.0-alpha.16
51
+
52
+ ## 3.0.0-alpha.15
53
+
54
+ ### Patch Changes
55
+
56
+ - Updated dependencies [2285040]
57
+ - Updated dependencies [2285040]
58
+ - @saas-ui/react@3.0.0-alpha.15
59
+
60
+ ## 3.0.0-alpha.14
61
+
62
+ ### Patch Changes
63
+
64
+ - Updated dependencies [0067207]
65
+ - Updated dependencies [0067207]
66
+ - @saas-ui/react@3.0.0-alpha.14
67
+
68
+ ## 3.0.0-alpha.13
69
+
70
+ ### Major Changes
71
+
72
+ - b51aff9: BREAKING: getBaseField should now return props and Component
73
+
74
+ ### Patch Changes
75
+
76
+ - b51aff9: Improved prop handling of base field
77
+ - Updated dependencies [b51aff9]
78
+ - Updated dependencies [b51aff9]
79
+ - @saas-ui/react@3.0.0-alpha.13
80
+
81
+ ## 3.0.0-alpha.12
82
+
83
+ ### Patch Changes
84
+
85
+ - Updated dependencies [61ce1b5]
86
+ - @saas-ui/react@3.0.0-alpha.12
87
+
88
+ ## 3.0.0-alpha.11
89
+
90
+ ### Patch Changes
91
+
92
+ - Updated dependencies [19309d4]
93
+ - Updated dependencies [19309d4]
94
+ - @saas-ui/react@3.0.0-alpha.11
95
+
96
+ ## 3.0.0-alpha.10
97
+
98
+ ### Patch Changes
99
+
100
+ - Updated dependencies [212a7e6]
101
+ - Updated dependencies [942e9a0]
102
+ - Updated dependencies [212a7e6]
103
+ - Updated dependencies [65fac53]
104
+ - @saas-ui/react@3.0.0-alpha.10
105
+
106
+ ## 3.0.0-alpha.9
107
+
108
+ ### Patch Changes
109
+
110
+ - Updated dependencies [f0f5ab0]
111
+ - @saas-ui/react@3.0.0-alpha.9
112
+
113
+ ## 3.0.0-alpha.8
114
+
115
+ ### Patch Changes
116
+
117
+ - Updated dependencies [64e680e]
118
+ - Updated dependencies [64e680e]
119
+ - @saas-ui/react@3.0.0-alpha.8
120
+
121
+ ## 3.0.0-alpha.7
122
+
123
+ ### Patch Changes
124
+
125
+ - Updated dependencies [8e760c5]
126
+ - @saas-ui/react@3.0.0-alpha.7
127
+
128
+ ## 3.0.0-alpha.6
129
+
130
+ ### Minor Changes
131
+
132
+ - 95c8652: Update to Chakra UI 3.2.1
133
+
134
+ ### Patch Changes
135
+
136
+ - Updated dependencies [95c8652]
137
+ - @saas-ui/react@3.0.0-alpha.6
138
+ - @saas-ui/core@3.0.0-alpha.4
139
+
140
+ ## 3.0.0-alpha.5
141
+
142
+ ### Patch Changes
143
+
144
+ - Updated dependencies [e9fec88]
145
+ - Updated dependencies [f62c3d6]
146
+ - @saas-ui/react@3.0.0-alpha.5
147
+
148
+ ## 3.0.0-alpha.4
149
+
150
+ ### Patch Changes
151
+
152
+ - Updated dependencies [7808a76]
153
+ - @saas-ui/react@3.0.0-alpha.4
154
+
155
+ ## 3.0.0-alpha.3
156
+
157
+ ### Patch Changes
158
+
159
+ - cee2e9c: Removed chakra ui dependency of core package
160
+ - Updated dependencies [cee2e9c]
161
+ - @saas-ui/core@3.0.0-alpha.3
162
+ - @saas-ui/react@3.0.0-alpha.3
163
+
3
164
  ## 3.0.0-alpha.2
4
165
 
5
166
  ### Minor Changes
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React$1 from 'react';
2
2
  import React__default, { ForwardRefRenderFunction, PropsWithoutRef } from 'react';
3
- import { RecipeProps, HTMLChakraProps, SimpleGridProps, InputProps, TextareaProps, SystemStyleObject, Field as Field$1, ButtonProps as ButtonProps$1 } from '@chakra-ui/react';
3
+ import { RecipeProps, SimpleGridProps, InputProps, TextareaProps, SystemStyleObject, Field as Field$1, HTMLChakraProps, ButtonProps as ButtonProps$1 } from '@chakra-ui/react';
4
4
  import { MaybeRenderProp } from '@saas-ui/core/utils';
5
5
  import * as react_hook_form from 'react-hook-form';
6
6
  import { FieldValues, FieldPath, UseFormReturn as UseFormReturn$1, UseFieldArrayReturn, UseFormProps, WatchObserver, SubmitHandler, SubmitErrorHandler, ResolverOptions, ResolverResult, RegisterOptions, FormProviderProps as FormProviderProps$1 } from 'react-hook-form';
@@ -19,13 +19,13 @@ interface FormLayoutOptions {
19
19
  columns?: SimpleGridProps['columns'];
20
20
  gap?: SimpleGridProps['gap'];
21
21
  }
22
- interface FormLayoutProps extends RecipeProps<'formLayout'>, FormLayoutOptions, Omit<HTMLChakraProps<'div'>, 'columns'> {
22
+ interface FormLayoutProps extends RecipeProps<'suiFormLayout'>, SimpleGridProps {
23
23
  }
24
24
  /**
25
25
  * Create consistent field spacing and positioning.
26
26
  *
27
27
  * Renders form items in a `SimpleGrid`
28
- * @see https://chakra-ui.com/docs/layout/simple-grid
28
+ * @see https://chakra-ui.com/docs/components/simple-grid
29
29
  *
30
30
  * @see https://saas-ui.dev/docs/components/forms/form
31
31
  */
@@ -46,7 +46,10 @@ declare const TextareaField: React__default.FC<Omit<BaseFieldProps<react_hook_fo
46
46
  interface SwitchFieldProps extends SwitchProps {
47
47
  type: 'switch';
48
48
  }
49
- interface SelectFieldProps extends Omit<Select.RootProps<FieldOption>, 'collection'> {
49
+ interface SelectFieldProps<Multiple extends boolean = boolean> extends Omit<Select.RootProps<FieldOption>, 'collection' | 'value' | 'multiple' | 'onChange' | 'onValueChange'> {
50
+ multiple?: Multiple;
51
+ value?: Multiple extends true ? Array<string> : string;
52
+ onChange?: (value: Multiple extends true ? Array<string> : string) => void;
50
53
  options: FieldOptions;
51
54
  placeholder?: string;
52
55
  triggerProps?: Select.TriggerProps;
@@ -80,7 +83,7 @@ declare const defaultFieldTypes: {
80
83
  checkbox: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof CheckboxFieldProps> & CheckboxFieldProps>;
81
84
  radio: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof RadioFieldProps> & RadioFieldProps>;
82
85
  password: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PasswordInputProps> & PasswordInputProps>;
83
- select: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps> & SelectFieldProps>;
86
+ select: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps<boolean>> & SelectFieldProps<boolean>>;
84
87
  switch: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SwitchFieldProps> & SwitchFieldProps>;
85
88
  textarea: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof TextareaFieldProps> & TextareaFieldProps>;
86
89
  };
@@ -336,8 +339,14 @@ interface BaseFieldProps<TFieldValues extends FieldValues = FieldValues, TName e
336
339
  children?: React.ReactNode;
337
340
  }
338
341
  type GetBaseField<TProps extends object = object> = () => {
339
- extraProps: string[];
340
- BaseField: React.FC<Omit<BaseFieldProps, 'name'> & {
342
+ /**
343
+ * Extra props to pass to the component
344
+ */
345
+ props: Array<Extract<keyof TProps, string>>;
346
+ /**
347
+ * The component to render
348
+ */
349
+ Component: React.FC<Omit<BaseFieldProps, 'name'> & {
341
350
  name: string;
342
351
  children: React.ReactNode;
343
352
  } & TProps>;
@@ -529,9 +538,9 @@ interface FieldsProps<TSchema = any> {
529
538
  }
530
539
  declare const AutoFields: React$1.FC<FieldsProps>;
531
540
 
532
- interface FieldsContextValue {
533
- fields: Record<string, React__default.FC<any>>;
534
- getBaseField?: GetBaseField<any>;
541
+ interface FieldsContextValue<TFields = any, TBaseFieldProps extends object = object> {
542
+ fields: Record<string, React__default.FC<TFields>>;
543
+ getBaseField?: GetBaseField<TBaseFieldProps>;
535
544
  }
536
545
  declare const FieldsProvider: React__default.FC<{
537
546
  value: FieldsContextValue;
@@ -581,17 +590,21 @@ interface WatchFieldProps<Value = unknown, TFieldValues extends FieldValues = Fi
581
590
  declare const WatchField: <Value = unknown, TFieldValues extends FieldValues = FieldValues, TContext extends object = object>(props: WatchFieldProps<Value, TFieldValues, TContext>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
582
591
 
583
592
  declare const useBaseField: (props: BaseFieldProps) => {
584
- controlProps: Pick<BaseFieldProps<react_hook_form.FieldValues, string>, never>;
593
+ rootProps: Omit<BaseFieldProps<react_hook_form.FieldValues, string>, "name" | "label" | "hideLabel" | "help" | "rules" | "type" | "placeholder" | "children">;
585
594
  error: any;
586
595
  touched: any;
587
596
  name: string;
588
597
  label?: string | undefined;
589
598
  hideLabel?: boolean | undefined;
590
599
  help?: string | undefined;
600
+ rules?: Omit<react_hook_form.RegisterOptions<react_hook_form.FieldValues, string>, "disabled" | "setValueAs" | "valueAsNumber" | "valueAsDate"> | undefined;
601
+ type?: string | undefined;
602
+ placeholder?: string | undefined;
603
+ children?: React$1.ReactNode;
591
604
  };
592
605
  /**
593
606
  * The default BaseField component
594
- * Composes the Chakra UI FormControl component, with FormLabel, FormHelperText and FormErrorMessage.
607
+ * Composes the Chakra UI Field component, with Label, HelperText and ErrorText.
595
608
  */
596
609
  declare const BaseField: React$1.FC<BaseFieldProps>;
597
610
 
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React$1 from 'react';
2
2
  import React__default, { ForwardRefRenderFunction, PropsWithoutRef } from 'react';
3
- import { RecipeProps, HTMLChakraProps, SimpleGridProps, InputProps, TextareaProps, SystemStyleObject, Field as Field$1, ButtonProps as ButtonProps$1 } from '@chakra-ui/react';
3
+ import { RecipeProps, SimpleGridProps, InputProps, TextareaProps, SystemStyleObject, Field as Field$1, HTMLChakraProps, ButtonProps as ButtonProps$1 } from '@chakra-ui/react';
4
4
  import { MaybeRenderProp } from '@saas-ui/core/utils';
5
5
  import * as react_hook_form from 'react-hook-form';
6
6
  import { FieldValues, FieldPath, UseFormReturn as UseFormReturn$1, UseFieldArrayReturn, UseFormProps, WatchObserver, SubmitHandler, SubmitErrorHandler, ResolverOptions, ResolverResult, RegisterOptions, FormProviderProps as FormProviderProps$1 } from 'react-hook-form';
@@ -19,13 +19,13 @@ interface FormLayoutOptions {
19
19
  columns?: SimpleGridProps['columns'];
20
20
  gap?: SimpleGridProps['gap'];
21
21
  }
22
- interface FormLayoutProps extends RecipeProps<'formLayout'>, FormLayoutOptions, Omit<HTMLChakraProps<'div'>, 'columns'> {
22
+ interface FormLayoutProps extends RecipeProps<'suiFormLayout'>, SimpleGridProps {
23
23
  }
24
24
  /**
25
25
  * Create consistent field spacing and positioning.
26
26
  *
27
27
  * Renders form items in a `SimpleGrid`
28
- * @see https://chakra-ui.com/docs/layout/simple-grid
28
+ * @see https://chakra-ui.com/docs/components/simple-grid
29
29
  *
30
30
  * @see https://saas-ui.dev/docs/components/forms/form
31
31
  */
@@ -46,7 +46,10 @@ declare const TextareaField: React__default.FC<Omit<BaseFieldProps<react_hook_fo
46
46
  interface SwitchFieldProps extends SwitchProps {
47
47
  type: 'switch';
48
48
  }
49
- interface SelectFieldProps extends Omit<Select.RootProps<FieldOption>, 'collection'> {
49
+ interface SelectFieldProps<Multiple extends boolean = boolean> extends Omit<Select.RootProps<FieldOption>, 'collection' | 'value' | 'multiple' | 'onChange' | 'onValueChange'> {
50
+ multiple?: Multiple;
51
+ value?: Multiple extends true ? Array<string> : string;
52
+ onChange?: (value: Multiple extends true ? Array<string> : string) => void;
50
53
  options: FieldOptions;
51
54
  placeholder?: string;
52
55
  triggerProps?: Select.TriggerProps;
@@ -80,7 +83,7 @@ declare const defaultFieldTypes: {
80
83
  checkbox: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof CheckboxFieldProps> & CheckboxFieldProps>;
81
84
  radio: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof RadioFieldProps> & RadioFieldProps>;
82
85
  password: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PasswordInputProps> & PasswordInputProps>;
83
- select: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps> & SelectFieldProps>;
86
+ select: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps<boolean>> & SelectFieldProps<boolean>>;
84
87
  switch: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SwitchFieldProps> & SwitchFieldProps>;
85
88
  textarea: React__default.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof TextareaFieldProps> & TextareaFieldProps>;
86
89
  };
@@ -336,8 +339,14 @@ interface BaseFieldProps<TFieldValues extends FieldValues = FieldValues, TName e
336
339
  children?: React.ReactNode;
337
340
  }
338
341
  type GetBaseField<TProps extends object = object> = () => {
339
- extraProps: string[];
340
- BaseField: React.FC<Omit<BaseFieldProps, 'name'> & {
342
+ /**
343
+ * Extra props to pass to the component
344
+ */
345
+ props: Array<Extract<keyof TProps, string>>;
346
+ /**
347
+ * The component to render
348
+ */
349
+ Component: React.FC<Omit<BaseFieldProps, 'name'> & {
341
350
  name: string;
342
351
  children: React.ReactNode;
343
352
  } & TProps>;
@@ -529,9 +538,9 @@ interface FieldsProps<TSchema = any> {
529
538
  }
530
539
  declare const AutoFields: React$1.FC<FieldsProps>;
531
540
 
532
- interface FieldsContextValue {
533
- fields: Record<string, React__default.FC<any>>;
534
- getBaseField?: GetBaseField<any>;
541
+ interface FieldsContextValue<TFields = any, TBaseFieldProps extends object = object> {
542
+ fields: Record<string, React__default.FC<TFields>>;
543
+ getBaseField?: GetBaseField<TBaseFieldProps>;
535
544
  }
536
545
  declare const FieldsProvider: React__default.FC<{
537
546
  value: FieldsContextValue;
@@ -581,17 +590,21 @@ interface WatchFieldProps<Value = unknown, TFieldValues extends FieldValues = Fi
581
590
  declare const WatchField: <Value = unknown, TFieldValues extends FieldValues = FieldValues, TContext extends object = object>(props: WatchFieldProps<Value, TFieldValues, TContext>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
582
591
 
583
592
  declare const useBaseField: (props: BaseFieldProps) => {
584
- controlProps: Pick<BaseFieldProps<react_hook_form.FieldValues, string>, never>;
593
+ rootProps: Omit<BaseFieldProps<react_hook_form.FieldValues, string>, "name" | "label" | "hideLabel" | "help" | "rules" | "type" | "placeholder" | "children">;
585
594
  error: any;
586
595
  touched: any;
587
596
  name: string;
588
597
  label?: string | undefined;
589
598
  hideLabel?: boolean | undefined;
590
599
  help?: string | undefined;
600
+ rules?: Omit<react_hook_form.RegisterOptions<react_hook_form.FieldValues, string>, "disabled" | "setValueAs" | "valueAsNumber" | "valueAsDate"> | undefined;
601
+ type?: string | undefined;
602
+ placeholder?: string | undefined;
603
+ children?: React$1.ReactNode;
591
604
  };
592
605
  /**
593
606
  * The default BaseField component
594
- * Composes the Chakra UI FormControl component, with FormLabel, FormHelperText and FormErrorMessage.
607
+ * Composes the Chakra UI Field component, with Label, HelperText and ErrorText.
595
608
  */
596
609
  declare const BaseField: React$1.FC<BaseFieldProps>;
597
610