@saas-ui/forms 2.0.0-rc.25 → 2.0.0-rc.27

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.
@@ -1,15 +1,18 @@
1
+ import * as _chakra_ui_button_dist_button from '@chakra-ui/button/dist/button';
2
+ import * as _saas_ui_modals from '@saas-ui/modals';
3
+ import { BaseModalProps } from '@saas-ui/modals';
1
4
  import * as React$1 from 'react';
2
5
  import React$1__default from 'react';
3
6
  import * as react_hook_form from 'react-hook-form';
4
- import { FieldValues, FieldPath, UseFormProps, SubmitHandler, RegisterOptions, UseFormReturn, UseFieldArrayReturn, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
7
+ import { FieldValues, FieldPath, UseFormProps, SubmitHandler, UseFieldArrayReturn, RegisterOptions, UseFormReturn, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
5
8
  import { MaybeRenderProp } from '@chakra-ui/react-utils';
6
9
  import { UseStepperProps, UseStepperReturn } from '@saas-ui/core';
7
- import { HTMLChakraProps, TextareaProps, SwitchProps, CheckboxProps, FormControlProps, ResponsiveValue, InputProps, RadioGroupProps, MenuProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, ButtonProps, RadioProps } from '@chakra-ui/react';
10
+ import { ButtonProps, HTMLChakraProps, TextareaProps, SwitchProps, CheckboxProps, ResponsiveValue, FormControlProps, InputProps, RadioGroupProps, MenuProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, RadioProps } from '@chakra-ui/react';
8
11
  import { FocusableElement } from '@chakra-ui/utils';
9
12
  import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
10
13
  import * as yup from 'yup';
11
14
  import { ObjectSchema, InferType } from 'yup';
12
- import { FieldProps as FieldProps$1, GetFieldResolver, WithFields, FormProps as FormProps$1, CreateFormProps } from '@saas-ui/forms';
15
+ import { FieldProps as FieldProps$1, GetFieldResolver, WithFields, FormProps as FormProps$1, CreateFormProps, StepsOptions as StepsOptions$1, UseStepFormProps as UseStepFormProps$1 } from '@saas-ui/forms';
13
16
  import { yupResolver } from '@hookform/resolvers/yup';
14
17
  export { yupResolver } from '@hookform/resolvers/yup';
15
18
 
@@ -160,6 +163,66 @@ interface SubmitButtonProps extends ButtonProps {
160
163
  disableIfInvalid?: boolean;
161
164
  }
162
165
 
166
+ interface ObjectFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends BaseFieldProps {
167
+ name: TName;
168
+ children: React$1.ReactNode;
169
+ columns?: ResponsiveValue<number>;
170
+ spacing?: ResponsiveValue<string | number>;
171
+ }
172
+
173
+ interface UseArrayFieldReturn extends UseFieldArrayReturn {
174
+ /**
175
+ * The array field name
176
+ */
177
+ name: string;
178
+ /**
179
+ * The default value for new items
180
+ */
181
+ defaultValue: Record<string, any>;
182
+ /**
183
+ * Min amount of items
184
+ */
185
+ min?: number;
186
+ /**
187
+ * Max amount of items
188
+ */
189
+ max?: number;
190
+ }
191
+ interface ArrayFieldOptions<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
192
+ /**
193
+ * The field name
194
+ */
195
+ name: TName;
196
+ /**
197
+ * Default value for new values in the array
198
+ */
199
+ defaultValue?: Record<string, any>;
200
+ /**
201
+ * Default key name for rows, change this if your data uses a different 'id' field
202
+ * @default "id"
203
+ */
204
+ keyName?: string;
205
+ min?: number;
206
+ max?: number;
207
+ }
208
+ interface ArrayFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ArrayFieldOptions<TFieldValues, TName>, Omit<BaseFieldProps<TFieldValues, TName>, 'name' | 'defaultValue' | 'children'> {
209
+ children: MaybeRenderProp<ArrayField[]>;
210
+ }
211
+ interface ArrayField {
212
+ id: string;
213
+ [key: string]: unknown;
214
+ }
215
+ /**
216
+ * The wrapper component that composes the default ArrayField functionality.
217
+ *
218
+ * @see Docs https://saas-ui.dev/docs/components/forms/array-field
219
+ */
220
+ declare const ArrayField: ((props: ArrayFieldProps & {
221
+ ref?: React$1.ForwardedRef<UseArrayFieldReturn>;
222
+ }) => React$1.ReactElement) & {
223
+ displayName: string;
224
+ };
225
+
163
226
  type FieldOption = {
164
227
  label?: string;
165
228
  value: string;
@@ -229,66 +292,6 @@ interface DisplayIfProps<TFieldValues extends FieldValues = FieldValues, TName e
229
292
  condition?: (value: unknown, context: UseFormReturn<TFieldValues>) => boolean;
230
293
  }
231
294
 
232
- interface UseArrayFieldReturn extends UseFieldArrayReturn {
233
- /**
234
- * The array field name
235
- */
236
- name: string;
237
- /**
238
- * The default value for new items
239
- */
240
- defaultValue: Record<string, any>;
241
- /**
242
- * Min amount of items
243
- */
244
- min?: number;
245
- /**
246
- * Max amount of items
247
- */
248
- max?: number;
249
- }
250
- interface ArrayFieldOptions<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
251
- /**
252
- * The field name
253
- */
254
- name: TName;
255
- /**
256
- * Default value for new values in the array
257
- */
258
- defaultValue?: Record<string, any>;
259
- /**
260
- * Default key name for rows, change this if your data uses a different 'id' field
261
- * @default "id"
262
- */
263
- keyName?: string;
264
- min?: number;
265
- max?: number;
266
- }
267
- interface ArrayFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ArrayFieldOptions<TFieldValues, TName>, Omit<BaseFieldProps<TFieldValues, TName>, 'name' | 'defaultValue' | 'children'> {
268
- children: MaybeRenderProp<ArrayField[]>;
269
- }
270
- interface ArrayField {
271
- id: string;
272
- [key: string]: unknown;
273
- }
274
- /**
275
- * The wrapper component that composes the default ArrayField functionality.
276
- *
277
- * @see Docs https://saas-ui.dev/docs/components/forms/array-field
278
- */
279
- declare const ArrayField: ((props: ArrayFieldProps & {
280
- ref?: React$1.ForwardedRef<UseArrayFieldReturn>;
281
- }) => React$1.ReactElement) & {
282
- displayName: string;
283
- };
284
-
285
- interface ObjectFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends BaseFieldProps {
286
- name: TName;
287
- children: React$1.ReactNode;
288
- columns?: ResponsiveValue<number>;
289
- spacing?: ResponsiveValue<string | number>;
290
- }
291
-
292
295
  interface FormRenderContext<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseFormReturn<TFieldValues, TContext> {
293
296
  Field: React$1.FC<TFieldTypes & React$1.RefAttributes<FocusableElement>>;
294
297
  DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
@@ -403,10 +406,10 @@ declare const getFieldsFromSchema: (schema: AnyObjectSchema) => FieldProps$1[];
403
406
  declare const getNestedSchema: (schema: AnyObjectSchema, path: string) => AnyObjectSchema;
404
407
  declare const yupFieldResolver: GetFieldResolver;
405
408
 
406
- type ResolverArgs = Parameters<typeof yupResolver>;
407
- interface CreateYupFormProps<FieldDefs> extends CreateFormProps<FieldDefs> {
408
- schemaOptions?: ResolverArgs[1];
409
- resolverOptions?: ResolverArgs[2];
409
+ type ResolverArgs$1 = Parameters<typeof yupResolver>;
410
+ interface CreateYupFormProps$1<FieldDefs> extends CreateFormProps<FieldDefs> {
411
+ schemaOptions?: ResolverArgs$1[1];
412
+ resolverOptions?: ResolverArgs$1[2];
410
413
  }
411
414
  type YupFormType<FieldDefs, ExtraProps = object, ExtraOverrides = object, Type extends 'yup' = 'yup'> = (<TSchema extends AnyObjectSchema = AnyObjectSchema, TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder
412
415
  TContext extends object = object>(props: WithFields<FormProps$1<TFieldValues, TContext, TSchema>, FieldDefs, ExtraOverrides> & {
@@ -415,7 +418,28 @@ TContext extends object = object>(props: WithFields<FormProps$1<TFieldValues, TC
415
418
  displayName?: string;
416
419
  id?: 'YupForm';
417
420
  };
418
- declare const createYupForm: <FieldDefs>(options?: CreateYupFormProps<FieldDefs> | undefined) => YupFormType<FieldDefs, object, object, "yup">;
421
+ declare const createYupForm: <FieldDefs>(options?: CreateYupFormProps$1<FieldDefs> | undefined) => YupFormType<FieldDefs, object, object, "yup">;
422
+
423
+ type ResolverArgs = Parameters<typeof yupResolver>;
424
+ interface CreateYupFormProps<FieldDefs> extends CreateFormProps<FieldDefs> {
425
+ schemaOptions?: ResolverArgs[1];
426
+ resolverOptions?: ResolverArgs[2];
427
+ }
428
+ type InferStepType<T extends Required<StepsOptions$1<AnyObjectSchema>>> = T extends [infer Step, ...infer Rest] ? Step extends {
429
+ schema: AnyObjectSchema;
430
+ } ? InferType<Step['schema']> & (Rest extends Required<StepsOptions$1<AnyObjectSchema>> ? InferStepType<Rest> : object) : object : object;
431
+ type YupStepFormType<FieldDefs, ExtraProps = object, ExtraOverrides = object> = (<TSteps extends Required<StepsOptions$1<AnyObjectSchema>> = Required<StepsOptions$1<AnyObjectSchema>>, TFieldValues extends InferStepType<TSteps> = InferStepType<TSteps>, TContext extends object = object>(props: UseStepFormProps$1<TSteps, TFieldValues, TContext> & {
432
+ steps: TSteps;
433
+ ref?: React$1__default.ForwardedRef<HTMLFormElement>;
434
+ }) => React$1__default.ReactElement) & {
435
+ displayName?: string;
436
+ id?: string;
437
+ };
438
+ declare const createYupStepForm: <FieldDefs>(options?: CreateYupFormProps<FieldDefs> | undefined) => YupStepFormType<FieldDefs, object, object>;
439
+
440
+ declare function createYupFormDialog<FieldDefs = any, ExtraProps = object, ExtraOverrides = object>(Form: YupFormType<FieldDefs, ExtraProps, ExtraOverrides>): YupFormType<FieldDefs, ExtraProps & Omit<BaseModalProps, "children">, ExtraOverrides & DefaultFieldOverrides & {
441
+ cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
442
+ }>;
419
443
 
420
444
  declare const Form: YupFormType<unknown, object, object, "yup">;
421
445
  declare const StepForm: (<TSteps extends {
@@ -541,5 +565,8 @@ declare const StepForm: (<TSteps extends {
541
565
  displayName?: string | undefined;
542
566
  id?: string | undefined;
543
567
  };
568
+ declare const FormDialog: YupFormType<unknown, object & Omit<_saas_ui_modals.BaseModalProps, "children">, object & DefaultFieldOverrides & {
569
+ cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
570
+ }>;
544
571
 
545
- export { AnyObjectSchema, Form, Options, StepForm, YupFormType, createYupForm, getFieldsFromSchema, getNestedSchema, yupFieldResolver };
572
+ export { AnyObjectSchema, Form, FormDialog, Options, StepForm, YupFormType, createYupForm, createYupFormDialog, createYupStepForm, getFieldsFromSchema, getNestedSchema, yupFieldResolver };
package/dist/yup/index.js CHANGED
@@ -3,8 +3,49 @@
3
3
  var yup$1 = require('yup');
4
4
  var yup = require('@hookform/resolvers/yup');
5
5
  var forms = require('@saas-ui/forms');
6
+ var React = require('react');
7
+ var react = require('@chakra-ui/react');
8
+ var jsxRuntime = require('react/jsx-runtime');
9
+ var utils_star = require('@chakra-ui/utils');
6
10
 
7
- // yup/src/yup-resolver.ts
11
+ function _interopNamespace(e) {
12
+ if (e && e.__esModule) return e;
13
+ var n = Object.create(null);
14
+ if (e) {
15
+ Object.keys(e).forEach(function (k) {
16
+ if (k !== 'default') {
17
+ var d = Object.getOwnPropertyDescriptor(e, k);
18
+ Object.defineProperty(n, k, d.get ? d : {
19
+ enumerable: true,
20
+ get: function () { return e[k]; }
21
+ });
22
+ }
23
+ });
24
+ }
25
+ n.default = e;
26
+ return Object.freeze(n);
27
+ }
28
+
29
+ var React__namespace = /*#__PURE__*/_interopNamespace(React);
30
+ var utils_star__namespace = /*#__PURE__*/_interopNamespace(utils_star);
31
+
32
+ var __defProp = Object.defineProperty;
33
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
34
+ var __getOwnPropNames = Object.getOwnPropertyNames;
35
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
36
+ var __export = (target, all) => {
37
+ for (var name in all)
38
+ __defProp(target, name, { get: all[name], enumerable: true });
39
+ };
40
+ var __copyProps = (to, from, except, desc) => {
41
+ if (from && typeof from === "object" || typeof from === "function") {
42
+ for (let key of __getOwnPropNames(from))
43
+ if (!__hasOwnProp.call(to, key) && key !== except)
44
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
45
+ }
46
+ return to;
47
+ };
48
+ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
8
49
  var getType = (field) => {
9
50
  var _a;
10
51
  if ((_a = field.spec.meta) == null ? void 0 : _a.type) {
@@ -89,17 +130,215 @@ var createYupStepForm = (options) => {
89
130
  return YupStepForm;
90
131
  };
91
132
 
133
+ // ../saas-ui-react-utils/dist/index.mjs
134
+ var dist_exports = {};
135
+ __export(dist_exports, {
136
+ getChildOfType: () => getChildOfType,
137
+ getChildrenOfType: () => getChildrenOfType,
138
+ useResponsiveValue: () => useResponsiveValue
139
+ });
140
+ __reExport(dist_exports, utils_star__namespace);
141
+ function getChildOfType(children, type) {
142
+ return React__namespace.Children.toArray(children).find(
143
+ (item) => item.type === type
144
+ );
145
+ }
146
+ function getChildrenOfType(children, type) {
147
+ return React__namespace.Children.toArray(children).filter(
148
+ (item) => Array.isArray(type) ? type.some((component) => component === item.type) : item.type === type
149
+ );
150
+ }
151
+ var normalize = (variant, toArray) => {
152
+ if (Array.isArray(variant))
153
+ return variant;
154
+ else if (typeof variant === "object")
155
+ return toArray == null ? void 0 : toArray(variant);
156
+ if (variant != null)
157
+ return [variant];
158
+ return [];
159
+ };
160
+ var useResponsiveValue = (value, options) => {
161
+ var _a;
162
+ const theme = react.useTheme();
163
+ const normalized = normalize(value, (_a = theme.__breakpoints) == null ? void 0 : _a.toArrayValue);
164
+ return react.useBreakpointValue(normalized, options);
165
+ };
166
+ var BaseModal = (props) => {
167
+ const {
168
+ title,
169
+ footer,
170
+ children,
171
+ isOpen,
172
+ onClose,
173
+ hideCloseButton,
174
+ hideOverlay,
175
+ headerProps,
176
+ contentProps,
177
+ footerProps,
178
+ ...rest
179
+ } = props;
180
+ return /* @__PURE__ */ jsxRuntime.jsxs(react.Modal, { isOpen, onClose, ...rest, children: [
181
+ !hideOverlay && /* @__PURE__ */ jsxRuntime.jsx(react.ModalOverlay, {}),
182
+ /* @__PURE__ */ jsxRuntime.jsxs(react.ModalContent, { ...contentProps, children: [
183
+ title && /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { ...headerProps, children: title }),
184
+ !hideCloseButton && /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {}),
185
+ utils_star.runIfFn(children, {
186
+ isOpen,
187
+ onClose
188
+ }),
189
+ footer && /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { ...footerProps, children: footer })
190
+ ] })
191
+ ] });
192
+ };
193
+ var [StylesProvider] = react.createStylesContext("SuiMenuDialog");
194
+ react.forwardRef(
195
+ (props, forwardedRef) => {
196
+ const {
197
+ rootProps,
198
+ title,
199
+ footer,
200
+ initialFocusRef,
201
+ hideCloseButton,
202
+ motionPreset = "slideInBottom",
203
+ isCentered: isCenteredProp,
204
+ ...rest
205
+ } = props;
206
+ const { isOpen, onClose, menuRef } = react.useMenuContext();
207
+ const { ref, ...ownProps } = react.useMenuList(rest, forwardedRef);
208
+ const styles = react.useMultiStyleConfig("Menu", props);
209
+ const isCentered = react.useBreakpointValue({ base: true, md: false });
210
+ return /* @__PURE__ */ jsxRuntime.jsxs(
211
+ BaseModal,
212
+ {
213
+ isOpen,
214
+ onClose,
215
+ initialFocusRef: initialFocusRef || menuRef,
216
+ title,
217
+ hideCloseButton,
218
+ motionPreset,
219
+ isCentered: isCenteredProp != null ? isCenteredProp : isCentered,
220
+ contentProps: { mx: 4 },
221
+ children: [
222
+ /* @__PURE__ */ jsxRuntime.jsx(StylesProvider, { value: styles, children: /* @__PURE__ */ jsxRuntime.jsx(
223
+ react.chakra.div,
224
+ {
225
+ ...ownProps,
226
+ ref,
227
+ __css: {
228
+ outline: 0,
229
+ maxHeight: "80vh",
230
+ // can override this in theme
231
+ overflowY: "auto",
232
+ // can override this in theme
233
+ ...styles.list,
234
+ boxShadow: "none",
235
+ border: 0,
236
+ _dark: {
237
+ /* @ts-expect-error */
238
+ ...styles.list._dark || {},
239
+ boxShadow: "none"
240
+ }
241
+ }
242
+ }
243
+ ) }),
244
+ footer && /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { children: footer })
245
+ ]
246
+ }
247
+ );
248
+ }
249
+ );
250
+ var useFormProps = (props) => {
251
+ const {
252
+ schema,
253
+ resolver,
254
+ fieldResolver,
255
+ defaultValues,
256
+ values,
257
+ context,
258
+ onChange,
259
+ onSubmit,
260
+ onError,
261
+ mode,
262
+ reValidateMode,
263
+ shouldFocusError = true,
264
+ shouldUnregister,
265
+ shouldUseNativeValidation,
266
+ criteriaMode,
267
+ delayError = 100,
268
+ fields,
269
+ ...modalProps
270
+ } = props;
271
+ const formProps = {
272
+ schema,
273
+ resolver,
274
+ defaultValues,
275
+ values,
276
+ context,
277
+ onChange,
278
+ onSubmit,
279
+ onError,
280
+ mode,
281
+ reValidateMode,
282
+ shouldFocusError,
283
+ shouldUnregister,
284
+ shouldUseNativeValidation,
285
+ criteriaMode,
286
+ delayError,
287
+ fields
288
+ };
289
+ return { modalProps, formProps, fields };
290
+ };
291
+ function createFormDialog(Form22) {
292
+ const Dialog = react.forwardRef((props, ref) => {
293
+ const { isOpen, onClose, footer, children, ...rest } = props;
294
+ const { modalProps, formProps, fields } = useFormProps(rest);
295
+ return /* @__PURE__ */ jsxRuntime.jsx(BaseModal, { ...modalProps, isOpen, onClose, children: /* @__PURE__ */ jsxRuntime.jsx(Form22, { ref, ...formProps, children: (form) => {
296
+ var _a, _b;
297
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
298
+ /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: (0, dist_exports.runIfFn)(children, form) || /* @__PURE__ */ jsxRuntime.jsx(forms.AutoFields, {}) }),
299
+ footer || /* @__PURE__ */ jsxRuntime.jsxs(react.ModalFooter, { children: [
300
+ /* @__PURE__ */ jsxRuntime.jsx(
301
+ react.Button,
302
+ {
303
+ variant: "ghost",
304
+ mr: 3,
305
+ onClick: onClose,
306
+ ...fields == null ? void 0 : fields.cancel,
307
+ children: (_b = (_a = fields == null ? void 0 : fields.cancel) == null ? void 0 : _a.children) != null ? _b : "Cancel"
308
+ }
309
+ ),
310
+ /* @__PURE__ */ jsxRuntime.jsx(forms.SubmitButton, { ...fields == null ? void 0 : fields.submit })
311
+ ] })
312
+ ] });
313
+ } }) });
314
+ });
315
+ Dialog.displayName = `${Form22.displayName || Form22.name}Dialog`;
316
+ Dialog.id = Form22.id;
317
+ return Dialog;
318
+ }
319
+ createFormDialog(forms.Form);
320
+ React__namespace.createContext(null);
321
+
322
+ // yup/src/create-yup-dialog.ts
323
+ function createYupFormDialog(Form4) {
324
+ return createFormDialog(Form4);
325
+ }
326
+
92
327
  // yup/src/index.ts
93
- var Form2 = createYupForm();
328
+ var Form3 = createYupForm();
94
329
  var StepForm = createYupStepForm();
330
+ var FormDialog2 = createYupFormDialog(Form3);
95
331
 
96
332
  Object.defineProperty(exports, 'yupResolver', {
97
333
  enumerable: true,
98
334
  get: function () { return yup.yupResolver; }
99
335
  });
100
- exports.Form = Form2;
336
+ exports.Form = Form3;
337
+ exports.FormDialog = FormDialog2;
101
338
  exports.StepForm = StepForm;
102
339
  exports.createYupForm = createYupForm;
340
+ exports.createYupFormDialog = createYupFormDialog;
341
+ exports.createYupStepForm = createYupStepForm;
103
342
  exports.getFieldsFromSchema = getFieldsFromSchema;
104
343
  exports.getNestedSchema = getNestedSchema;
105
344
  exports.yupFieldResolver = yupFieldResolver;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../yup/src/yup-resolver.ts","../../yup/src/create-yup-form.ts","../../yup/src/create-yup-step-form.ts","../../yup/src/index.ts"],"names":["Form"],"mappings":";AAAA,SAAS,aAAa;AACtB,SAAS,mBAAmB;AAa5B,IAAM,UAAU,CAAC,UAAe;AAdhC;AAeE,OAAI,WAAM,KAAK,SAAX,mBAAiB,MAAM;AACzB,WAAO,MAAM,KAAK,KAAK;AAAA,EACzB;AAEA,UAAQ,MAAM,MAAM;AAAA,IAClB,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AAlCrD;AAmCE,aAAW,QAAQ,MAAM,OAAO;AAC9B,SAAI,UAAK,YAAL,mBAAc,OAAO;AAAO,aAAO,KAAK,QAAQ,OAAO,IAAI;AAAA,EACjE;AACF;AAQO,IAAM,sBAAsB,CAAC,WAA0C;AAC5E,QAAM,SAAS,CAAC;AAEhB,MAAI,eAAoC,CAAC;AACzC,MAAI,OAAO,SAAS,SAAS;AAE3B,mBAAe,OAAO,UAAU;AAAA,EAClC,OAAO;AACL,mBAAe,OAAO;AAAA,EACxB;AAEA,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,aAAa,IAAI;AAE/B,UAAM,UAAmB,CAAC;AAC1B,QAAI,MAAM,SAAS,SAAS;AAC1B,cAAQ,MAAM,eAAe,OAAO,KAAK;AACzC,cAAQ,MAAM,eAAe,OAAO,KAAK;AAAA,IAC3C;AAEA,WAAO,KAAK;AAAA,MACV;AAAA,MACA,OAAO,MAAM,KAAK,SAAS;AAAA,MAC3B,MAAM,QAAQ,KAAK;AAAA,MACnB,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAyB,SAAiB;AACxE,SAAO,MAAM,QAAQ,IAAI;AAC3B;AAEO,IAAM,mBAAqC,CAAC,WAA4B;AAC7E,SAAO;AAAA,IACL,YAAY;AACV,aAAO,oBAAoB,MAAM;AAAA,IACnC;AAAA,IACA,gBAAgB,MAAc;AAC5B,aAAO,oBAAoB,gBAAgB,QAAQ,IAAI,CAAC;AAAA,IAC1D;AAAA,EACF;AACF;;;ACzFA;AAAA,EACE;AAAA,OAKK;AAoCA,IAAM,gBAAgB,CAC3B,YACG;AACH,QAAM,UAAU,WAAW;AAAA,IACzB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,UAAQ,cAAc;AACtB,UAAQ,KAAK;AAEb,SAAO;AACT;;;ACxDA;AAAA,EAME;AAAA,OAIK;AA4CA,IAAM,oBAAoB,CAC/B,YACG;AACH,QAAM,cAAc,eAA8B;AAAA,IAChD,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,cAAY,cAAc;AAC1B,cAAY,KAAK;AAEjB,SAAO;AACT;;;AC9DO,IAAMA,QAAO,cAAc;AAE3B,IAAM,WAAW,kBAAkB","sourcesContent":["import { reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps, GetFieldResolver } from '@saas-ui/forms'\nimport { AnyObjectSchema } from './types'\n\nexport { yupResolver }\n\nexport type Options = {\n min?: number\n max?: number\n}\n\n// @TODO get proper typings for the schema fields\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\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 = (schema: AnyObjectSchema): 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: AnyObjectSchema, path: string) => {\n return reach(schema, path) as AnyObjectSchema\n}\n\nexport const yupFieldResolver: GetFieldResolver = (schema: AnyObjectSchema) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type YupFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'yup' = 'yup'\n> = (<\n TSchema extends AnyObjectSchema = AnyObjectSchema,\n TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TFieldValues, TContext, TSchema>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: 'YupForm'\n}\n\nexport const createYupForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupForm = createForm({\n resolver: (schema: any) =>\n yupResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupForm.displayName = 'YupForm'\n YupForm.id = 'YupForm'\n\n return YupForm as YupFormType<FieldDefs>\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType, object, string } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyObjectSchema>>> =\n T extends [infer Step, ...infer Rest]\n ? Step extends { schema: AnyObjectSchema }\n ? InferType<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyObjectSchema>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype YupStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyObjectSchema>> = Required<\n StepsOptions<AnyObjectSchema>\n >,\n TFieldValues extends InferStepType<TSteps> = InferStepType<TSteps>,\n TContext extends object = object\n>(\n props: UseStepFormProps<TSteps, TFieldValues, TContext> & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n }\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createYupStepForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n yupResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupStepForm.displayName = 'YupStepForm'\n YupStepForm.id = 'YupStepForm'\n\n return YupStepForm as YupStepFormType<FieldDefs>\n}\n","export * from './yup-resolver'\nexport { createYupForm, type YupFormType } from './create-yup-form'\nexport type { AnyObjectSchema } from './types'\nimport { createYupForm } from './create-yup-form'\nimport { createYupStepForm } from './create-yup-step-form'\n\nexport const Form = createYupForm()\n\nexport const StepForm = createYupStepForm()\n"]}
1
+ {"version":3,"sources":["../../yup/src/yup-resolver.ts","../../yup/src/create-yup-form.ts","../../yup/src/create-yup-step-form.ts","../../../saas-ui-modals/src/dialog.tsx","../../../saas-ui-react-utils/src/get-child-of-type.ts","../../../saas-ui-react-utils/src/get-children-of-type.ts","../../../saas-ui-react-utils/src/use-responsive-value.ts","../../../saas-ui-modals/src/drawer.tsx","../../../saas-ui-modals/src/modal.tsx","../../../saas-ui-modals/src/menu.tsx","../../../saas-ui-modals/src/form.tsx","../../yup/src/create-yup-dialog.ts","../../yup/src/index.ts"],"names":["useBreakpointValue","Form","runIfFn","jsx","ModalFooter","Form2","ModalBody","Button","FormDialog"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,SAAS,aAAa;AACtB,SAAS,mBAAmB;AAa5B,IAAM,UAAU,CAAC,UAAe;AAdhC;AAeE,OAAI,WAAM,KAAK,SAAX,mBAAiB,MAAM;AACzB,WAAO,MAAM,KAAK,KAAK;AAAA,EACzB;AAEA,UAAQ,MAAM,MAAM;AAAA,IAClB,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AAlCrD;AAmCE,aAAW,QAAQ,MAAM,OAAO;AAC9B,SAAI,UAAK,YAAL,mBAAc,OAAO;AAAO,aAAO,KAAK,QAAQ,OAAO,IAAI;AAAA,EACjE;AACF;AAQO,IAAM,sBAAsB,CAAC,WAA0C;AAC5E,QAAM,SAAS,CAAC;AAEhB,MAAI,eAAoC,CAAC;AACzC,MAAI,OAAO,SAAS,SAAS;AAE3B,mBAAe,OAAO,UAAU;AAAA,EAClC,OAAO;AACL,mBAAe,OAAO;AAAA,EACxB;AAEA,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,aAAa,IAAI;AAE/B,UAAM,UAAmB,CAAC;AAC1B,QAAI,MAAM,SAAS,SAAS;AAC1B,cAAQ,MAAM,eAAe,OAAO,KAAK;AACzC,cAAQ,MAAM,eAAe,OAAO,KAAK;AAAA,IAC3C;AAEA,WAAO,KAAK;AAAA,MACV;AAAA,MACA,OAAO,MAAM,KAAK,SAAS;AAAA,MAC3B,MAAM,QAAQ,KAAK;AAAA,MACnB,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAyB,SAAiB;AACxE,SAAO,MAAM,QAAQ,IAAI;AAC3B;AAEO,IAAM,mBAAqC,CAAC,WAA4B;AAC7E,SAAO;AAAA,IACL,YAAY;AACV,aAAO,oBAAoB,MAAM;AAAA,IACnC;AAAA,IACA,gBAAgB,MAAc;AAC5B,aAAO,oBAAoB,gBAAgB,QAAQ,IAAI,CAAC;AAAA,IAC1D;AAAA,EACF;AACF;;;ACzFA;AAAA,EACE;AAAA,OAKK;AAoCA,IAAM,gBAAgB,CAC3B,YACG;AACH,QAAM,UAAU,WAAW;AAAA,IACzB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,UAAQ,cAAc;AACtB,UAAQ,KAAK;AAEb,SAAO;AACT;;;ACxDA;AAAA,EAME;AAAA,OAIK;AA4CA,IAAM,oBAAoB,CAC/B,YACG;AACH,QAAM,cAAc,eAA8B;AAAA,IAChD,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,cAAY,cAAc;AAC1B,cAAY,KAAK;AAEjB,SAAO;AACT;;;;ACpEA,SAAA,qBAAuB,YAAA,gBAAA,aAAA,qBAAA,sBAAAA,qBAAA,QAAA,aAAA,aAAA,oBAAA,oBAAA,mBAAA,iBAAA,mBAAA,aAAA,QAAA,UAAA,UAAA,eAAA,eAAA,cAAA,mBAAA,cAAA,YAAA,SAAA,SAAA,cAAA,cAAA,aAAA,kBAAA,WAAA,YAAA;AAEvB,SAAA,MAAA,KAAA,gBAAA;AAAA,SACE,eAAA;;;;;;;;;ACIK;;AAPP,SAAA,UAAY,0BAAW;AAOhB,4BAAS;AAKY,SAC1B,eAAA,UAAA,MAAA;AACF,SAAA,eAAA,QAAA,QAAA,EAAA;;;ACdA;AAOO,SAAS,kBACd,UACA,MACA;AACA,SAAc,eAAA,QAAS,QAAQ,EAAQ;IACrC,CAAC,SACC,MAAM,QAAQ,IAAI,IACd,KAAK,KAAK,CAAC,cAAc,cAAc,KAAK,IAAI,IAChD,KAAK,SAAS;EACtB;AACF;;;ACjBA,WAAA;WAGE,OAAA,YAAA;AACA,WAAA,WAAA,OAAA,SAAA,QAAA,OAAA;AAAA,MAAA,WACK;AAED,WAAA,CAAA,OAAa;AACjB,SAAI,CAAA;AAAwB;AAAO,IAAA,qBACnB,CAAA,OAAY,YAAA;AAAU,MAAA;AACtC,QAAI,QAAA,SAAW;AAAM,QAAA,aAAe,UAAA,QAAA,KAAA,MAAA,kBAAA,OAAA,SAAA,GAAA,YAAA;AACpC,SAAO,mBAAC,YAAA,OAAA;AACV;;;AHRE,SACA,YAAA,cAAA,QAAAC,aAAA;AImEoC,IAChC,YAAA,CAAA,UAAC;AACE,QAAA;IAA+C;IACR;IACrB;IACjB;IACA;IACD;IACiD;IACpD;IAGN;IASa;IACX,GAAA;EACA,IAAA;AAGyB,SACjB,qBAAA,SAAA,EAAA,QAAA,SAAA,GAAA,MAAA,UAAA;IACA,CAAA,eAAA,oBAAA,cAAA,CAAA,CAAA;IAGN,qBAAA,cAAA,EAAA,GAAA,cAAA,UAAA;MAEJ,SAAA,oBAAA,aAAA,EAAA,GAAA,aAAA,UAAA,MAAA,CAAA;;;QCvGA;QACE;MACA,CAAA;MACA,UAAA,oBAAA,aAAA,EAAA,GAAA,aAAA,UAAA,OAAA,CAAA;IACA,EAAA,CAAA;EACA,EAAA,CAAA;AAAA;AAmDE,IACA,CAAA,cAAA,IAAA,oBAAA,eAAA;AAemD,IAAA,iBAC7C;EAAqC,CAAA,OACtCC,iBAAkB;AAAA,UACjB;MAAA;MAEF;MACC;MAAgD;MAErD;MAEJ,eAAA;MAEa,YAAmC;MAC9C,GAAM;IACN,IAAA;AAIQ,UAAA,EAAA,QAAA,SAAA,QAAA,IAAA,eAAA;AACA,UAAA,EAAA,KAAA,GAAA,SAAA,IAAA,YAAA,MAAA,YAAA;AACD,UAEL,SAAA,oBAAA,QAAA,KAAA;AAEJ,UAAA,aAAAF,oBAAA,EAAA,MAAA,MAAA,IAAA,MAAA,CAAA;;;MChGA;QACE;QACA;QACA,iBAAA,mBAAA;QACA;QACA;QACA;QACA,YAAA,kBAAA,OAAA,iBAAA;QACA,cAAA,EAAA,IAAA,EAAA;QAEA,UAAA;UACK,oBAAA,gBAAA,EAAA,OAAA,QAAA,UAAA;YAiBH,OAAAG;YAbG;cASM,GAAwC;cAC3C;cAGN,OAAA;gBAAC,SAAA;gBAAA,WAAA;;gBAEU,WAAM;;gBAIb,GAAA,OAAA;gBACF,WAAA;gBACI,QAAA;gBAAA,OAAA;;kBAGV,GAAA,OAAA,KAAA,SAAA,CAAA;kBASa,WAAiB;gBACpB;cACA;YACJ;UACA,EAAA,CAAA;UACA,UAAA,oBAAA,aAAA,EAAA,UAAA,OAAA,CAAA;QACA;MACA;IAAA;EACe;AACH;AACT,IACL,eAAI,CAAA,UAAA;AAEJ,QAAA;IAEA;IAEA;IAEA;IAEA;IACE;IAAC;IAAA;IACC;IACA;IACoC;IACpC;IACA,mBACA;IAAA;IAC8B;IACR;IAGtB,aAAA;IACE;IAAQ,GAAA;EAAP,IAAA;AACK,QAAA,YACJ;IAAA;IACO;IACI;IACE;IAAA;IACA;IAAA;IACD;IACC;IACH;IACD;IAAA;IAEqB;IACf;IACb;IACF;EAAA;AAEJ,SAAA,EACC,YAAU,WAAA,OAACC;AAAoB;AAAA,SAAA,iBAAAC,QAAA;AAAA,QAClC,SAAA,WAAA,CAAA,OAAA,QAAA;AAEJ,UAAA,EAAA,QAAA,SAAA,QAAA,UAAA,GAAA,KAAA,IAAA;AACF,UAAA,EAAA,YAAA,WAAA,OAAA,IAAA,aAAA,IAAA;;;ACxGA,aAAA,qBAAA,UAAA,EAAA,UAAA;QACEC,oBAAAA,WAAAA,EAAAA,cAAAA,aAAAA,SAAAA,UAAAA,IAAAA,KAAAA,oBAAAA,YAAAA,CAAAA,CAAAA,EAAAA,CAAAA;QACA,UAAAF,qBAAAA,aAAAA,EAAAA,UAAAA;UACAG;YACA;YAEK;cACE,SAAAL;cAET,IAAA;cACE,SAAA;cACA,GAAA,UAAA,OAAA,SAAA,OAAA;cACA,WAAA,MAAA,KAAA,UAAA,OAAA,SAAA,OAAA,WAAA,OAAA,SAAA,GAAA,aAAA,OAAA,KAAA;YAOK;UAsJK;UArGU,oBAA2B,cAAA,EAAA,GAAA,UAAA,OAAA,SAAA,OAAA,OAAA,CAAA;QACzC,EAAA,CAAA;MACJ,EAAA,CAAA;IACA,EAAA,CAAA,EAAA,CAAA;EAAA,CAAA;AACA,SACA,cAAA,GAAAG,OAAA,eAAAA,OAAA;AAAA,SACA,KAAAA,OAAA;AAAA,SACA;AAAA;AACA,IACA,aAAA,iBAAAJ,KAAA;AAUG,IACL,gBAAI,qBAAA,IAAA;;;ACnFC,SAAS,oBAIdA,OAA0D;AAC1D,SAAO,iBAAiBA,KAAI;AAK9B;;;ACPO,IAAMA,QAAO,cAAc;AAE3B,IAAM,WAAW,kBAAkB;AAEnC,IAAMO,cAAa,oBAAoBP,KAAI","sourcesContent":["import { reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps, GetFieldResolver } from '@saas-ui/forms'\nimport { AnyObjectSchema } from './types'\n\nexport { yupResolver }\n\nexport type Options = {\n min?: number\n max?: number\n}\n\n// @TODO get proper typings for the schema fields\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\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 = (schema: AnyObjectSchema): 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: AnyObjectSchema, path: string) => {\n return reach(schema, path) as AnyObjectSchema\n}\n\nexport const yupFieldResolver: GetFieldResolver = (schema: AnyObjectSchema) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type YupFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'yup' = 'yup'\n> = (<\n TSchema extends AnyObjectSchema = AnyObjectSchema,\n TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TFieldValues, TContext, TSchema>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: 'YupForm'\n}\n\nexport const createYupForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupForm = createForm({\n resolver: (schema: any) =>\n yupResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupForm.displayName = 'YupForm'\n YupForm.id = 'YupForm'\n\n return YupForm as YupFormType<FieldDefs>\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType, object, string } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyObjectSchema>>> =\n T extends [infer Step, ...infer Rest]\n ? Step extends { schema: AnyObjectSchema }\n ? InferType<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyObjectSchema>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype YupStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyObjectSchema>> = Required<\n StepsOptions<AnyObjectSchema>\n >,\n TFieldValues extends InferStepType<TSteps> = InferStepType<TSteps>,\n TContext extends object = object\n>(\n props: UseStepFormProps<TSteps, TFieldValues, TContext> & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n }\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createYupStepForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n yupResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupStepForm.displayName = 'YupStepForm'\n YupStepForm.id = 'YupStepForm'\n\n return YupStepForm as YupStepFormType<FieldDefs>\n}\n","import * as React from 'react'\n\nimport {\n AlertDialog,\n AlertDialogBody,\n AlertDialogFooter,\n AlertDialogHeader,\n AlertDialogContent,\n AlertDialogOverlay,\n AlertDialogProps,\n ButtonGroup,\n ButtonGroupProps,\n Button,\n ButtonProps,\n} from '@chakra-ui/react'\n\nexport interface ConfirmDialogProps\n extends Omit<AlertDialogProps, 'leastDestructiveRef'> {\n /**\n * The dialog title\n */\n title?: React.ReactNode\n /**\n * The cancel button label\n */\n cancelLabel?: React.ReactNode\n /**\n * The confirm button label\n */\n confirmLabel?: React.ReactNode\n /**\n * The cancel button props\n */\n cancelProps?: ButtonProps\n /**\n * The confirm button props\n */\n confirmProps?: ButtonProps\n /**\n * The button group props\n */\n buttonGroupProps?: ButtonGroupProps\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const ConfirmDialog: React.FC<ConfirmDialogProps> = (props) => {\n const {\n title,\n cancelLabel = 'Cancel',\n confirmLabel = 'Confirm',\n cancelProps,\n confirmProps,\n buttonGroupProps,\n isOpen,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onClose,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onClose()\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n console.log(isLoading)\n return (\n <AlertDialog\n isOpen={isOpen}\n onClose={onClose}\n {...rest}\n leastDestructiveRef={\n leastDestructiveFocus === 'cancel' ? cancelRef : confirmRef\n }\n >\n <AlertDialogOverlay>\n <AlertDialogContent>\n <AlertDialogHeader>{title}</AlertDialogHeader>\n\n <AlertDialogBody>{children}</AlertDialogBody>\n\n <AlertDialogFooter>\n <ButtonGroup {...buttonGroupProps}>\n <Button\n ref={cancelRef}\n {...cancelProps}\n onClick={() => {\n onCancel?.()\n\n closeOnCancel && onClose()\n }}\n >\n {cancelProps?.children || cancelLabel}\n </Button>\n <Button\n ref={confirmRef}\n isLoading={isLoading}\n {...confirmProps}\n onClick={handleConfirm}\n >\n {confirmProps?.children || confirmLabel}\n </Button>\n </ButtonGroup>\n </AlertDialogFooter>\n </AlertDialogContent>\n </AlertDialogOverlay>\n </AlertDialog>\n )\n}\n","import * as React from 'react'\n\n/**\n * Get the first child of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any>\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).find(\n (item) => item.type === type\n )\n}\n","import * as React from 'react'\n\n/**\n * Get all children of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildrenOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any> | React.JSXElementConstructor<any>[]\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).filter(\n (item) =>\n Array.isArray(type)\n ? type.some((component) => component === item.type)\n : item.type === type\n )\n}\n","import {\n ResponsiveValue,\n UseBreakpointOptions,\n useTheme,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nconst normalize = (variant: any, toArray?: (value: any) => any) => {\n if (Array.isArray(variant)) return variant\n else if (typeof variant === 'object') return toArray?.(variant)\n if (variant != null) return [variant]\n return []\n}\n\nexport const useResponsiveValue = (\n value: ResponsiveValue<any>,\n options?: UseBreakpointOptions\n) => {\n const theme = useTheme()\n const normalized = normalize(value, theme.__breakpoints?.toArrayValue)\n return useBreakpointValue(normalized, options)\n}\n","import * as React from 'react'\n\nimport {\n Drawer as ChakraDrawer,\n DrawerOverlay,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerBody,\n DrawerCloseButton,\n DrawerProps as ChakraDrawerProps,\n ModalHeaderProps,\n ModalContentProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseDrawerProps extends Omit<ChakraDrawerProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overflow\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseDrawer: React.FC<BaseDrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <DrawerOverlay />}\n <DrawerContent {...contentProps}>\n {title && <DrawerHeader {...headerProps}>{title}</DrawerHeader>}\n {!hideCloseButton && <DrawerCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <DrawerFooter {...footerProps}>{footer}</DrawerFooter>}\n </DrawerContent>\n </ChakraDrawer>\n )\n}\n\nexport interface DrawerProps extends BaseDrawerProps {\n /**\n * Drawer footer content, wrapped with `DrawerFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n <DrawerBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </DrawerBody>\n </BaseDrawer>\n )\n}\n","import * as React from 'react'\n\nimport {\n Modal as ChakraModal,\n ModalOverlay,\n ModalContent,\n ModalHeader,\n ModalFooter,\n ModalBody,\n ModalCloseButton,\n ModalProps as ChakraModalProps,\n ModalContentProps,\n ModalHeaderProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseModalProps extends Omit<ChakraModalProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseModal: React.FC<BaseModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraModal isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <ModalOverlay />}\n <ModalContent {...contentProps}>\n {title && <ModalHeader {...headerProps}>{title}</ModalHeader>}\n {!hideCloseButton && <ModalCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <ModalFooter {...footerProps}>{footer}</ModalFooter>}\n </ModalContent>\n </ChakraModal>\n )\n}\n\nexport const Modal: React.FC<BaseModalProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseModal {...rest} isOpen={isOpen} onClose={onClose}>\n <ModalBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </ModalBody>\n </BaseModal>\n )\n}\n","import * as React from 'react'\n\nimport {\n ModalFooter,\n chakra,\n forwardRef,\n useMenuContext,\n useMenuList,\n createStylesContext,\n useMultiStyleConfig,\n Menu,\n MenuListProps,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nconst [StylesProvider] = createStylesContext('SuiMenuDialog')\n\nexport interface MenuDialogProps extends BaseModalProps {\n /**\n * The modal footer, wrapped with `ModalFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const MenuDialog: React.FC<MenuDialogProps> = (props) => {\n const { onClose, onCloseComplete, ...rest } = props\n\n return (\n <Menu\n variant=\"dialog\"\n onClose={() => {\n onClose?.()\n // Not supported in Menu, so we call it here instead\n // @todo Refactor this in v2?\n onCloseComplete?.()\n }}\n {...rest}\n />\n )\n}\n\nexport interface MenuDialogListProps\n extends Omit<\n BaseModalProps,\n 'isOpen' | 'onClose' | 'children' | 'scrollBehavior'\n >,\n Omit<MenuListProps, 'title'> {}\n\nexport const MenuDialogList = forwardRef<MenuDialogListProps, 'div'>(\n (props, forwardedRef) => {\n const {\n rootProps,\n title,\n footer,\n initialFocusRef,\n hideCloseButton,\n motionPreset = 'slideInBottom',\n isCentered: isCenteredProp,\n ...rest\n } = props\n\n const { isOpen, onClose, menuRef } = useMenuContext()\n\n const { ref, ...ownProps } = useMenuList(rest, forwardedRef)\n\n const styles = useMultiStyleConfig('Menu', props)\n\n const isCentered = useBreakpointValue({ base: true, md: false })\n\n return (\n <BaseModal\n isOpen={isOpen}\n onClose={onClose}\n initialFocusRef={initialFocusRef || menuRef}\n title={title}\n hideCloseButton={hideCloseButton}\n motionPreset={motionPreset}\n isCentered={isCenteredProp ?? isCentered}\n contentProps={{ mx: 4 }}\n >\n {/* We forward the styles again, otherwise the modal styles will be picked up */}\n <StylesProvider value={styles}>\n <chakra.div\n {...ownProps}\n ref={ref as React.Ref<HTMLDivElement>}\n __css={{\n outline: 0,\n maxHeight: '80vh', // can override this in theme\n overflowY: 'auto', // can override this in theme\n ...styles.list,\n boxShadow: 'none',\n border: 0,\n _dark: {\n /* @ts-expect-error */\n ...(styles.list._dark || {}),\n boxShadow: 'none',\n },\n }}\n />\n </StylesProvider>\n {footer && <ModalFooter>{footer}</ModalFooter>}\n </BaseModal>\n )\n }\n)\n","import * as React from 'react'\n\nimport {\n ModalBody,\n ModalFooter,\n Button,\n forwardRef,\n ButtonProps,\n} from '@chakra-ui/react'\nimport { runIfFn } from '@saas-ui/react-utils'\n\nimport {\n Form,\n AutoFields,\n SubmitButton,\n FormProps,\n FieldValues,\n FieldResolver,\n FieldProps,\n FormType,\n DefaultFieldOverrides,\n} from '@saas-ui/forms'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nexport type FormDialogFieldOverrides = DefaultFieldOverrides & {\n cancel?: ButtonProps\n}\n\nexport interface FormDialogProps<\n TSchema = any,\n TFieldValues extends FieldValues = FieldValues,\n TContext extends object = object,\n TFieldTypes = FieldProps<TFieldValues>\n> extends Omit<BaseModalProps, 'children'>,\n Pick<\n FormProps<TSchema, TFieldValues, TContext, TFieldTypes>,\n | 'schema'\n | 'defaultValues'\n | 'values'\n | 'context'\n | 'onChange'\n | 'onSubmit'\n | 'onError'\n | 'resolver'\n | 'mode'\n | 'reValidateMode'\n | 'shouldFocusError'\n | 'shouldUnregister'\n | 'shouldUseNativeValidation'\n | 'criteriaMode'\n | 'delayError'\n | 'resetOptions'\n | 'children'\n > {\n /**\n * The modal footer, will be wrapped with `ModalFooter`.\n * Defaults to a cancel and submit button.\n */\n footer?: React.ReactNode\n /**\n * A schema field resolver used to auto generate form fields.\n */\n fieldResolver?: FieldResolver\n /**\n * Field overrides\n */\n fields?: FormDialogFieldOverrides\n}\n\nconst useFormProps = (props: FormDialogProps) => {\n const {\n schema,\n resolver,\n fieldResolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError = true,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError = 100,\n fields,\n ...modalProps\n } = props\n\n const formProps = {\n schema,\n resolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError,\n fields,\n }\n\n return { modalProps, formProps, fields }\n}\n\n/**\n * @todo make this dynamic to support other schema types\n */\ntype MergeDialogProps<T> = T extends FormType<\n infer FieldDefs,\n infer ExtraProps,\n infer ExtraOverrides\n>\n ? FormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n : never\n\ntype IsSchemaType<T, Schema, FieldDefs> = T extends DefaultFormType<FieldDefs>\n ? T extends (\n props: FormProps<infer TSchema, infer TFieldValues, infer TContext>\n ) => any\n ? Schema extends TSchema\n ? true\n : false\n : false\n : false\n\nexport type DefaultFormType<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides\n> = (<\n TSchema = unknown,\n TFieldValues extends Record<string, any> = any,\n TContext extends object = object\n>(\n props: any\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport function createFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides,\n TFormType extends DefaultFormType<\n FieldDefs,\n ExtraProps,\n ExtraOverrides\n > = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>\n>(Form: TFormType) {\n const Dialog = forwardRef<any, 'div'>((props, ref) => {\n const { isOpen, onClose, footer, children, ...rest } = props\n const { modalProps, formProps, fields } = useFormProps(rest)\n return (\n <BaseModal {...modalProps} isOpen={isOpen} onClose={onClose}>\n <Form ref={ref} {...(formProps as any)}>\n {(form: any) => (\n <>\n <ModalBody>{runIfFn(children, form) || <AutoFields />}</ModalBody>\n\n {footer || (\n <ModalFooter>\n <Button\n variant=\"ghost\"\n mr={3}\n onClick={onClose}\n {...fields?.cancel}\n >\n {fields?.cancel?.children ?? 'Cancel'}\n </Button>\n <SubmitButton {...fields?.submit} />\n </ModalFooter>\n )}\n </>\n )}\n </Form>\n </BaseModal>\n )\n }) as MergeDialogProps<TFormType>\n\n Dialog.displayName = `${Form.displayName || Form.name}Dialog`\n Dialog.id = Form.id\n\n return Dialog\n}\n\n/**\n * Can be used to quickly request information from people without leaving the current page.\n *\n * @see Docs https://saas-ui.dev/docs/components/overlay/form-dialog\n */\nexport const FormDialog = createFormDialog(Form)\n","import {\n BaseModalProps,\n FormDialogFieldOverrides,\n createFormDialog,\n} from '@saas-ui/modals'\nimport { YupFormType } from './create-yup-form'\n\nexport function createYupFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: YupFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as YupFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","export * from './yup-resolver'\nexport { createYupForm, type YupFormType } from './create-yup-form'\nexport { createYupStepForm } from './create-yup-step-form'\nexport { createYupFormDialog } from './create-yup-dialog'\nexport type { AnyObjectSchema } from './types'\n\nimport { createYupForm } from './create-yup-form'\nimport { createYupStepForm } from './create-yup-step-form'\nimport { createYupFormDialog } from './create-yup-dialog'\n\nexport const Form = createYupForm()\n\nexport const StepForm = createYupStepForm()\n\nexport const FormDialog = createYupFormDialog(Form)\n"]}