@saas-ui/forms 2.0.2 → 2.0.3
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +6 -0
- package/dist/index.d.ts +75 -73
- package/dist/index.js.map +1 -1
- package/dist/index.mjs.map +1 -1
- package/dist/yup/index.d.ts +102 -37
- package/dist/yup/index.js.map +1 -1
- package/dist/yup/index.mjs.map +1 -1
- package/dist/zod/index.d.ts +105 -40
- package/dist/zod/index.js.map +1 -1
- package/dist/zod/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/create-step-form.tsx +15 -21
- package/src/index.ts +2 -2
- package/src/step-form.tsx +2 -4
- package/src/types.ts +40 -1
- package/src/use-step-form.tsx +9 -13
package/dist/yup/index.d.ts
CHANGED
@@ -1,18 +1,21 @@
|
|
1
1
|
import * as _chakra_ui_button_dist_button from '@chakra-ui/button/dist/button';
|
2
2
|
import * as _saas_ui_modals from '@saas-ui/modals';
|
3
3
|
import { BaseModalProps } from '@saas-ui/modals';
|
4
|
+
import * as _chakra_ui_checkbox_dist_checkbox from '@chakra-ui/checkbox/dist/checkbox';
|
5
|
+
import * as _chakra_ui_switch_dist_switch from '@chakra-ui/switch/dist/switch';
|
6
|
+
import * as _chakra_ui_textarea_dist_textarea from '@chakra-ui/textarea/dist/textarea';
|
7
|
+
import * as react_hook_form from 'react-hook-form';
|
8
|
+
import { FieldValues, FieldPath, RegisterOptions, SubmitHandler, UseFieldArrayReturn, UseFormReturn, UseFormProps, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
|
4
9
|
import * as React$1 from 'react';
|
5
10
|
import React$1__default from 'react';
|
6
|
-
import
|
7
|
-
import { FieldValues, FieldPath, UseFormProps, SubmitHandler, UseFieldArrayReturn, RegisterOptions, UseFormReturn, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
|
8
|
-
import { MaybeRenderProp } from '@chakra-ui/react-utils';
|
11
|
+
import { InputProps, RadioGroupProps, MenuProps, ThemingProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, ButtonProps, ResponsiveValue, FormControlProps, HTMLChakraProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, RadioProps, TextareaProps, SwitchProps, CheckboxProps } from '@chakra-ui/react';
|
9
12
|
import { UseStepperProps, UseStepperReturn } from '@saas-ui/core';
|
10
|
-
import { ButtonProps, HTMLChakraProps, TextareaProps, SwitchProps, CheckboxProps, ResponsiveValue, FormControlProps, InputProps, RadioGroupProps, MenuProps, ThemingProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, RadioProps } from '@chakra-ui/react';
|
11
13
|
import { FocusableElement } from '@chakra-ui/utils';
|
14
|
+
import { MaybeRenderProp } from '@chakra-ui/react-utils';
|
12
15
|
import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
|
13
16
|
import * as yup from 'yup';
|
14
17
|
import { ObjectSchema, InferType } from 'yup';
|
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';
|
18
|
+
import { FieldProps as FieldProps$1, GetFieldResolver, WithFields, FormProps as FormProps$1, CreateFormProps, CreateStepFormProps, StepsOptions as StepsOptions$1, WithStepFields, UseStepFormProps as UseStepFormProps$1 } from '@saas-ui/forms';
|
16
19
|
import { yupResolver } from '@hookform/resolvers/yup';
|
17
20
|
export { yupResolver } from '@hookform/resolvers/yup';
|
18
21
|
|
@@ -277,6 +280,7 @@ type DefaultFieldOverrides = {
|
|
277
280
|
submit?: SubmitButtonProps;
|
278
281
|
[key: string]: any;
|
279
282
|
};
|
283
|
+
type StepFormChildren<FieldDefs, TSteps extends StepsOptions<any> = StepsOptions<any>, TFieldValues extends FieldValues = FieldValues, TContext extends object = object> = MaybeRenderProp<StepFormRenderContext<TSteps, TFieldValues, TContext, MergeFieldProps<FieldDefs extends never ? DefaultFields : ShallowMerge<DefaultFields, FieldDefs>, TFieldValues>>>;
|
280
284
|
|
281
285
|
type FieldResolver = {
|
282
286
|
getFields(): BaseFieldProps[];
|
@@ -334,6 +338,33 @@ interface FormOptions<TSchema = unknown, TFieldValues extends FieldValues = Fiel
|
|
334
338
|
}
|
335
339
|
interface FormProps<TSchema = unknown, TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseFormProps<TFieldValues, TContext>, Omit<HTMLChakraProps<'form'>, 'children' | 'onChange' | 'onSubmit' | 'onError'>, FormOptions<TSchema, TFieldValues, TContext, TFieldTypes> {
|
336
340
|
}
|
341
|
+
type FormStepSubmitHandler<TFieldValues extends FieldValues = FieldValues> = (data: TFieldValues, stepper: UseStepperReturn) => Promise<void>;
|
342
|
+
|
343
|
+
type StepName<T extends {
|
344
|
+
[k: number]: {
|
345
|
+
readonly name: string;
|
346
|
+
};
|
347
|
+
}> = T[number]['name'];
|
348
|
+
interface StepFormRenderContext<TSteps extends StepsOptions<any> = StepsOptions<any>, TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseStepFormReturn<TFieldValues> {
|
349
|
+
Field: React$1.FC<TFieldTypes & React$1.RefAttributes<FocusableElement>>;
|
350
|
+
FormStep: React$1.FC<FormStepProps<StepName<TSteps>>>;
|
351
|
+
DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
|
352
|
+
ArrayField: React$1.FC<ArrayFieldProps<TFieldValues> & React$1.RefAttributes<UseArrayFieldReturn>>;
|
353
|
+
ObjectField: React$1.FC<ObjectFieldProps<TFieldValues>>;
|
354
|
+
}
|
355
|
+
interface UseStepFormProps<TSteps extends StepsOptions<any> = StepsOptions<any>, TFieldValues extends FieldValues = FieldValues, TContext extends object = object> extends Omit<UseStepperProps, 'onChange'>, Omit<FormProps<any, TFieldValues, TContext>, 'children'> {
|
356
|
+
steps?: TSteps;
|
357
|
+
children: StepFormChildren<any, TSteps, TFieldValues, TContext>;
|
358
|
+
}
|
359
|
+
interface UseStepFormReturn<TFieldValues extends FieldValues = FieldValues> extends UseStepperReturn {
|
360
|
+
getFormProps(): {
|
361
|
+
onSubmit: SubmitHandler<TFieldValues>;
|
362
|
+
schema?: any;
|
363
|
+
resolver?: any;
|
364
|
+
};
|
365
|
+
updateStep(step: any): void;
|
366
|
+
steps: Record<string, any>;
|
367
|
+
}
|
337
368
|
|
338
369
|
type StepsOptions<TSchema, TName extends string = string> = {
|
339
370
|
/**
|
@@ -362,33 +393,6 @@ interface FormStepOptions<TName extends string = string> {
|
|
362
393
|
interface FormStepProps<TName extends string = string> extends FormStepOptions<TName>, Omit<HTMLChakraProps<'div'>, 'onSubmit'> {
|
363
394
|
onSubmit?: FormStepSubmitHandler;
|
364
395
|
}
|
365
|
-
type FormStepSubmitHandler<TFieldValues extends FieldValues = FieldValues> = (data: TFieldValues, stepper: UseStepperReturn) => Promise<void>;
|
366
|
-
|
367
|
-
type StepName<T extends {
|
368
|
-
[k: number]: {
|
369
|
-
readonly name: string;
|
370
|
-
};
|
371
|
-
}> = T[number]['name'];
|
372
|
-
interface StepFormRenderContext<TSteps extends StepsOptions<any> = StepsOptions<any>, TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseStepFormReturn<TFieldValues> {
|
373
|
-
Field: React$1.FC<TFieldTypes & React$1.RefAttributes<FocusableElement>>;
|
374
|
-
FormStep: React$1.FC<FormStepProps<StepName<TSteps>>>;
|
375
|
-
DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
|
376
|
-
ArrayField: React$1.FC<ArrayFieldProps<TFieldValues> & React$1.RefAttributes<UseArrayFieldReturn>>;
|
377
|
-
ObjectField: React$1.FC<ObjectFieldProps<TFieldValues>>;
|
378
|
-
}
|
379
|
-
interface UseStepFormProps<TSteps extends StepsOptions<any> = StepsOptions<any>, TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends Omit<UseStepperProps, 'onChange'>, Omit<FormProps<any, TFieldValues, TContext, TFieldTypes>, 'children'> {
|
380
|
-
steps?: TSteps;
|
381
|
-
children: MaybeRenderProp<StepFormRenderContext<TSteps, TFieldValues, TContext, TFieldTypes>>;
|
382
|
-
}
|
383
|
-
interface UseStepFormReturn<TFieldValues extends FieldValues = FieldValues> extends UseStepperReturn {
|
384
|
-
getFormProps(): {
|
385
|
-
onSubmit: SubmitHandler<TFieldValues>;
|
386
|
-
schema?: any;
|
387
|
-
resolver?: any;
|
388
|
-
};
|
389
|
-
updateStep(step: any): void;
|
390
|
-
steps: Record<string, any>;
|
391
|
-
}
|
392
396
|
|
393
397
|
type AnyObjectSchema = ObjectSchema<any, any, any, ''> | ObjectSchema<any, any, any, 'd'> | ObjectSchema<any, any, any, 's'>;
|
394
398
|
|
@@ -421,17 +425,17 @@ TContext extends object = object>(props: WithFields<FormProps$1<TFieldValues, TC
|
|
421
425
|
declare const createYupForm: <FieldDefs>(options?: CreateYupFormProps$1<FieldDefs> | undefined) => YupFormType<FieldDefs, object, object, "yup">;
|
422
426
|
|
423
427
|
type ResolverArgs = Parameters<typeof yupResolver>;
|
424
|
-
interface CreateYupFormProps<FieldDefs> extends
|
428
|
+
interface CreateYupFormProps<FieldDefs> extends CreateStepFormProps<FieldDefs> {
|
425
429
|
schemaOptions?: ResolverArgs[1];
|
426
430
|
resolverOptions?: ResolverArgs[2];
|
427
431
|
}
|
428
432
|
type InferStepType<T extends Required<StepsOptions$1<AnyObjectSchema>>> = T extends [infer Step, ...infer Rest] ? Step extends {
|
429
433
|
schema: AnyObjectSchema;
|
430
434
|
} ? 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> & {
|
435
|
+
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: WithStepFields<UseStepFormProps$1<TSteps, TFieldValues, TContext>, FieldDefs, ExtraOverrides> & {
|
432
436
|
steps: TSteps;
|
433
437
|
ref?: React$1__default.ForwardedRef<HTMLFormElement>;
|
434
|
-
}) => React$1__default.ReactElement) & {
|
438
|
+
} & ExtraProps) => React$1__default.ReactElement) & {
|
435
439
|
displayName?: string;
|
436
440
|
id?: string;
|
437
441
|
};
|
@@ -558,10 +562,71 @@ declare const StepForm: (<TSteps extends {
|
|
558
562
|
} ? yup.Asserts<Step["schema"]> & (Rest extends {
|
559
563
|
name: string;
|
560
564
|
schema?: AnyObjectSchema | undefined;
|
561
|
-
}[] ? any : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object, TContext extends object = object>(props: UseStepFormProps<TSteps, TFieldValues, TContext
|
565
|
+
}[] ? any : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object, TContext extends object = object>(props: Omit<UseStepFormProps<TSteps, TFieldValues, TContext>, "children" | "fields"> & {
|
566
|
+
children?: React$1.ReactNode | ((props: StepFormRenderContext<TSteps, TFieldValues, TContext, ({
|
567
|
+
type?: "number" | undefined;
|
568
|
+
} & Omit<NumberInputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
569
|
+
type?: "text" | undefined;
|
570
|
+
} & Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
571
|
+
type?: "email" | undefined;
|
572
|
+
} & Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
573
|
+
type?: "url" | undefined;
|
574
|
+
} & Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
575
|
+
type?: "phone" | undefined;
|
576
|
+
} & Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
577
|
+
type?: "password" | undefined;
|
578
|
+
} & Omit<PasswordInputProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
579
|
+
type?: "textarea" | undefined;
|
580
|
+
} & Omit<_chakra_ui_textarea_dist_textarea.TextareaProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
581
|
+
type?: "switch" | undefined;
|
582
|
+
} & Omit<_chakra_ui_switch_dist_switch.SwitchProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
583
|
+
type?: "select" | undefined;
|
584
|
+
} & Omit<SelectProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
585
|
+
type?: "checkbox" | undefined;
|
586
|
+
} & Omit<_chakra_ui_checkbox_dist_checkbox.CheckboxProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
587
|
+
type?: "radio" | undefined;
|
588
|
+
} & Omit<RadioInputProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
589
|
+
type?: "pin" | undefined;
|
590
|
+
} & Omit<PinFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
591
|
+
type?: "native-select" | undefined;
|
592
|
+
} & Omit<NativeSelectProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>)>) => React$1.ReactNode);
|
593
|
+
fields?: ({ [K in react_hook_form.Path<TFieldValues> | (react_hook_form.Path<TFieldValues> extends infer T_20 ? T_20 extends react_hook_form.Path<TFieldValues> ? T_20 extends string ? (string extends T_20 ? (T_20 & string)[] : T_20 extends infer T_21 ? T_21 extends T_20 ? T_21 extends "" ? [] : T_21 extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...any] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [T_21] : never : never) extends infer T_23 ? T_23 extends (string extends T_20 ? (T_20 & string)[] : T_20 extends infer T_34 ? T_34 extends T_20 ? T_34 extends "" ? [] : T_34 extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...any] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [T_34] : never : never) ? T_23 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_24 ? T_24 extends R ? T_24 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_25 ? T_25 extends R ? T_25 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_26 ? T_26 extends R ? T_26 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_27 ? T_27 extends R ? T_27 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_28 ? T_28 extends R ? T_28 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_29 ? T_29 extends R ? T_29 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_30 ? T_30 extends R ? T_30 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_31 ? T_31 extends R ? T_31 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_32 ? T_32 extends R ? T_32 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_33 ? T_33 extends R ? T_33 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? any : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : never : never : never)]?: (({
|
594
|
+
type?: "number" | undefined;
|
595
|
+
} & Omit<Omit<NumberInputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
596
|
+
type?: "text" | undefined;
|
597
|
+
} & Omit<Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
598
|
+
type?: "email" | undefined;
|
599
|
+
} & Omit<Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
600
|
+
type?: "url" | undefined;
|
601
|
+
} & Omit<Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
602
|
+
type?: "phone" | undefined;
|
603
|
+
} & Omit<Omit<InputFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
604
|
+
type?: "password" | undefined;
|
605
|
+
} & Omit<Omit<PasswordInputProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
606
|
+
type?: "textarea" | undefined;
|
607
|
+
} & Omit<Omit<_chakra_ui_textarea_dist_textarea.TextareaProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
608
|
+
type?: "switch" | undefined;
|
609
|
+
} & Omit<Omit<_chakra_ui_switch_dist_switch.SwitchProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
610
|
+
type?: "select" | undefined;
|
611
|
+
} & Omit<Omit<SelectProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
612
|
+
type?: "checkbox" | undefined;
|
613
|
+
} & Omit<Omit<_chakra_ui_checkbox_dist_checkbox.CheckboxProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
614
|
+
type?: "radio" | undefined;
|
615
|
+
} & Omit<Omit<RadioInputProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
616
|
+
type?: "pin" | undefined;
|
617
|
+
} & Omit<Omit<PinFieldProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
618
|
+
type?: "native-select" | undefined;
|
619
|
+
} & Omit<Omit<NativeSelectProps & BaseFieldProps<react_hook_form.FieldValues, string>, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">)) | ({
|
620
|
+
type?: "object" | undefined;
|
621
|
+
} & Omit<ObjectFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name" | "children">) | ({
|
622
|
+
type?: "array" | undefined;
|
623
|
+
} & Omit<ArrayFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name" | "children">) | undefined; } & {
|
624
|
+
submit?: SubmitButtonProps | undefined;
|
625
|
+
} & object) | undefined;
|
626
|
+
} & {
|
562
627
|
steps: TSteps;
|
563
628
|
ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
|
564
|
-
}) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>) & {
|
629
|
+
} & object) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>) & {
|
565
630
|
displayName?: string | undefined;
|
566
631
|
id?: string | undefined;
|
567
632
|
};
|
package/dist/yup/index.js.map
CHANGED
@@ -1 +1 @@
|
|
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":"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","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"]}
|
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,EAEE;AAAA,OAKK;AAgDA,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;;;;ACrEA,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 CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n WithStepFields,\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 CreateStepFormProps<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: WithStepFields<\n UseStepFormProps<TSteps, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\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"]}
|
package/dist/yup/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
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":"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","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"]}
|
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":"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","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 CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n WithStepFields,\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 CreateStepFormProps<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: WithStepFields<\n UseStepFormProps<TSteps, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\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"]}
|