@fast-food/design-system 1.32.0 → 1.34.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/atoms/Icon/iconRegistry.d.ts +1 -0
- package/dist/components/atoms/index.d.ts +1 -0
- package/dist/components/molecules/ComboboxSelect/ComboboxSelect.d.ts +1 -1
- package/dist/components/molecules/ComboboxSelect/ComboboxSelect.type.d.ts +6 -0
- package/dist/components/molecules/Form/Form.d.ts +37 -0
- package/dist/components/molecules/Form/index.d.ts +1 -0
- package/dist/components/molecules/FormField/index.d.ts +2 -2
- package/dist/components/molecules/FormFields/BooleanField/BooleanField.d.ts +3 -0
- package/dist/components/molecules/FormFields/BooleanField/index.d.ts +1 -0
- package/dist/components/molecules/FormFields/CurrencyField/CurrencyField.d.ts +8 -3
- package/dist/components/molecules/FormFields/DurationField/DurationField.d.ts +6 -0
- package/dist/components/molecules/FormFields/DurationField/index.d.ts +1 -0
- package/dist/components/molecules/FormFields/EmailField/EmailField.d.ts +1 -3
- package/dist/components/molecules/FormFields/MaskField/MaskField.d.ts +6 -3
- package/dist/components/molecules/FormFields/NumberField/NumberField.d.ts +8 -3
- package/dist/components/molecules/FormFields/PasswordField/PasswordField.d.ts +1 -3
- package/dist/components/molecules/FormFields/PercentageField/PercentageField.d.ts +8 -3
- package/dist/components/molecules/FormFields/TextAreaField/TextAreaField.d.ts +5 -3
- package/dist/components/molecules/FormFields/TextField/TextField.d.ts +6 -3
- package/dist/components/molecules/FormFields/TimeField/TimeField.d.ts +5 -0
- package/dist/components/molecules/FormFields/TimeField/index.d.ts +1 -0
- package/dist/components/molecules/FormFields/index.d.ts +3 -0
- package/dist/components/molecules/FormFields/shared/emitFieldValue.d.ts +9 -0
- package/dist/components/molecules/FormFields/shared/formFieldTypes.d.ts +61 -5
- package/dist/components/molecules/FormFields/shared/maskFieldHelpers.d.ts +24 -0
- package/dist/components/molecules/FormFields/shared/mergeRefs.d.ts +7 -0
- package/dist/components/molecules/ModeToggle/ModeToggle.d.ts +6 -0
- package/dist/components/molecules/ModeToggle/ModeToggle.style.d.ts +10 -0
- package/dist/components/molecules/ModeToggle/ModeToggle.type.d.ts +21 -0
- package/dist/components/molecules/ModeToggle/index.d.ts +2 -0
- package/dist/components/molecules/PopoverMultiSelect/PopoverMultiSelect.d.ts +1 -1
- package/dist/components/molecules/PopoverMultiSelect/PopoverMultiSelect.type.d.ts +6 -0
- package/dist/components/molecules/index.d.ts +2 -0
- package/dist/components/organisms/ConfirmationModal/ConfirmationModal.d.ts +7 -0
- package/dist/components/organisms/ConfirmationModal/ConfirmationModal.style.d.ts +6 -0
- package/dist/components/organisms/ConfirmationModal/ConfirmationModal.type.d.ts +24 -0
- package/dist/components/organisms/ConfirmationModal/ConfirmationModalHost.d.ts +6 -0
- package/dist/components/organisms/ConfirmationModal/confirm.d.ts +11 -0
- package/dist/components/organisms/ConfirmationModal/confirmStore.d.ts +19 -0
- package/dist/components/organisms/ConfirmationModal/index.d.ts +6 -0
- package/dist/components/organisms/ConfirmationModal/useConfirmationModal.d.ts +9 -0
- package/dist/components/organisms/Toaster/Toaster.d.ts +10 -0
- package/dist/components/organisms/Toaster/Toaster.style.d.ts +4 -0
- package/dist/components/organisms/Toaster/index.d.ts +5 -0
- package/dist/components/organisms/Toaster/toast.d.ts +27 -0
- package/dist/components/organisms/Toaster/toast.type.d.ts +32 -0
- package/dist/components/organisms/Toaster/toastStore.d.ts +17 -0
- package/dist/components/organisms/index.d.ts +2 -0
- package/dist/contexts/index.d.ts +1 -0
- package/dist/contexts/theme/ThemeProvider.d.ts +8 -0
- package/dist/contexts/theme/index.d.ts +3 -0
- package/dist/contexts/theme/theme.context.d.ts +7 -0
- package/dist/contexts/theme/theme.type.d.ts +23 -0
- package/dist/contexts/theme/useTheme.d.ts +6 -0
- package/dist/fast-food-design-system-1.34.0.tgz +0 -0
- package/dist/fast-food-design-system.cjs.js +165 -160
- package/dist/fast-food-design-system.css +1 -1
- package/dist/fast-food-design-system.es.js +14413 -13072
- package/dist/index.d.ts +1 -0
- package/package.json +13 -3
- package/dist/fast-food-design-system-1.32.0.tgz +0 -0
|
@@ -47,6 +47,7 @@ export declare const iconRegistry: {
|
|
|
47
47
|
readonly menu: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
48
48
|
readonly 'message-circle': import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
49
49
|
readonly minus: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
50
|
+
readonly monitor: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
50
51
|
readonly moon: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
51
52
|
readonly 'more-vertical': import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
52
53
|
readonly package: import('react').ForwardRefExoticComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ComboboxSelectProps } from './ComboboxSelect.type';
|
|
2
|
-
declare function ComboboxSelect<TData, TParams = void>({ id, label, value, onChange, loadOptions, loadPage, loadParams, getValue, getLabel, getDescription, placeholder, searchPlaceholder, loadingText, noOptionsText, loadErrorText, helperText, errorText, error, disabled, readOnly, clearable, onClear, className, containerClassName, reloadOnParamsChange, searchDebounce, }: ComboboxSelectProps<TData, TParams>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare function ComboboxSelect<TData, TParams = void>({ id, label, value, onChange, loadOptions, loadPage, loadParams, getValue, getLabel, getDescription, selectedItem: selectedItemProp, placeholder, searchPlaceholder, loadingText, noOptionsText, loadErrorText, helperText, errorText, error, disabled, readOnly, clearable, onClear, className, containerClassName, reloadOnParamsChange, searchDebounce, }: ComboboxSelectProps<TData, TParams>): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
declare namespace ComboboxSelect {
|
|
4
4
|
var displayName: string;
|
|
5
5
|
}
|
|
@@ -32,6 +32,12 @@ export interface ComboboxSelectProps<TData, TParams = void> {
|
|
|
32
32
|
getValue: (item: TData) => string;
|
|
33
33
|
getLabel: (item: TData) => string;
|
|
34
34
|
getDescription?: (item: TData) => string | undefined;
|
|
35
|
+
/**
|
|
36
|
+
* Item já resolvido correspondente a `value`. Use no modo paginado para
|
|
37
|
+
* exibir o rótulo de um valor pré-selecionado (edição) que pode não estar
|
|
38
|
+
* na primeira página carregada.
|
|
39
|
+
*/
|
|
40
|
+
selectedItem?: TData | null;
|
|
35
41
|
placeholder?: string;
|
|
36
42
|
searchPlaceholder?: string;
|
|
37
43
|
loadingText?: string;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { FormProvider, ControllerProps, FieldPath, FieldValues } from 'react-hook-form';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function useFormField(): {
|
|
5
|
+
invalid: boolean;
|
|
6
|
+
isDirty: boolean;
|
|
7
|
+
isTouched: boolean;
|
|
8
|
+
isValidating: boolean;
|
|
9
|
+
error?: import('react-hook-form').FieldError;
|
|
10
|
+
id: string;
|
|
11
|
+
name: string;
|
|
12
|
+
formItemId: string;
|
|
13
|
+
formDescriptionId: string;
|
|
14
|
+
formMessageId: string;
|
|
15
|
+
};
|
|
16
|
+
declare const FormItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
17
|
+
declare const FormLabel: React.ForwardRefExoticComponent<Omit<React.LabelHTMLAttributes<HTMLLabelElement> & import('../../atoms/Label/Label.style').LabelStyleProps & {
|
|
18
|
+
as?: "label" | "p" | "span";
|
|
19
|
+
} & React.RefAttributes<HTMLLabelElement | HTMLParagraphElement | HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
|
|
20
|
+
declare const FormControl: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-slot').SlotProps & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
21
|
+
declare const FormDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
22
|
+
declare const FormMessage: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
23
|
+
/**
|
|
24
|
+
* `Form` equivale ao `FormProvider` do react-hook-form e também agrupa as
|
|
25
|
+
* primitivas como propriedades: `<Form.Field>`, `<Form.Item>`, `<Form.Label>`,
|
|
26
|
+
* `<Form.Control>`, `<Form.Description>`, `<Form.Message>`.
|
|
27
|
+
*/
|
|
28
|
+
type FormComponent = typeof FormProvider & {
|
|
29
|
+
Field: typeof FormField;
|
|
30
|
+
Item: typeof FormItem;
|
|
31
|
+
Label: typeof FormLabel;
|
|
32
|
+
Control: typeof FormControl;
|
|
33
|
+
Description: typeof FormDescription;
|
|
34
|
+
Message: typeof FormMessage;
|
|
35
|
+
};
|
|
36
|
+
declare const Form: FormComponent;
|
|
37
|
+
export { Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, useFormField, };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, useFormField, } from './Form';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default as FormField } from './FormField';
|
|
2
|
-
export type { FormFieldProps } from './FormField.type';
|
|
1
|
+
export { default as FormField, default as InputField } from './FormField';
|
|
2
|
+
export type { FormFieldProps, FormFieldProps as InputFieldProps } from './FormField.type';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { BooleanField } from './BooleanField';
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const CurrencyField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "defaultValue" | "value"> & import('..').BaseFieldProps & {
|
|
2
|
+
value?: number | null;
|
|
3
|
+
defaultValue?: number;
|
|
4
|
+
onValueChange?: (value: number | null) => void;
|
|
5
|
+
onChange?: (value: number | null) => void;
|
|
6
|
+
locale?: string;
|
|
7
|
+
currency?: string;
|
|
8
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const DurationField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "defaultValue" | "value"> & import('..').BaseFieldProps & {
|
|
2
|
+
value?: number | null;
|
|
3
|
+
onValueChange?: (value: number | null) => void;
|
|
4
|
+
onChange?: (value: number | null) => void;
|
|
5
|
+
lengthHoursMask?: number;
|
|
6
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { DurationField } from './DurationField';
|
|
@@ -1,3 +1 @@
|
|
|
1
|
-
|
|
2
|
-
import { EmailFieldProps } from '../shared/formFieldTypes';
|
|
3
|
-
export declare const EmailField: React.FC<EmailFieldProps>;
|
|
1
|
+
export declare const EmailField: import('react').ForwardRefExoticComponent<import('react').InputHTMLAttributes<HTMLInputElement> & import('..').BaseFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const MaskField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange"> & import('..').BaseFieldProps & {
|
|
2
|
+
mask: string | string[];
|
|
3
|
+
onValueChange?: (value: string) => void;
|
|
4
|
+
onChange?: (value: string) => void;
|
|
5
|
+
onComplete?: (value: string) => void;
|
|
6
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const NumberField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "value"> & import('..').BaseFieldProps & {
|
|
2
|
+
value?: number | null;
|
|
3
|
+
onValueChange?: (value: number | null) => void;
|
|
4
|
+
onChange?: (value: number | null) => void;
|
|
5
|
+
min?: number;
|
|
6
|
+
max?: number;
|
|
7
|
+
allowDecimal?: boolean;
|
|
8
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -1,3 +1 @@
|
|
|
1
|
-
|
|
2
|
-
import { PasswordFieldProps } from '../shared/formFieldTypes';
|
|
3
|
-
export declare const PasswordField: React.FC<PasswordFieldProps>;
|
|
1
|
+
export declare const PasswordField: import('react').ForwardRefExoticComponent<import('react').InputHTMLAttributes<HTMLInputElement> & import('..').BaseFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const PercentageField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "defaultValue" | "value"> & import('..').BaseFieldProps & {
|
|
2
|
+
value?: number | null;
|
|
3
|
+
defaultValue?: number;
|
|
4
|
+
onValueChange?: (value: number | null) => void;
|
|
5
|
+
onChange?: (value: number | null) => void;
|
|
6
|
+
min?: number;
|
|
7
|
+
max?: number;
|
|
8
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const TextAreaField: import('react').ForwardRefExoticComponent<import('react').TextareaHTMLAttributes<HTMLTextAreaElement> & import('..').BaseFieldProps & {
|
|
2
|
+
error?: boolean;
|
|
3
|
+
characterCount?: boolean;
|
|
4
|
+
characterLimit?: number;
|
|
5
|
+
} & import('react').RefAttributes<HTMLTextAreaElement>>;
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Campo de texto rotulado. Encaminha o `ref` para o `<input>` interno — assim
|
|
3
|
+
* `<TextField {...register('campo')} />` (react-hook-form, não-controlado) e o
|
|
4
|
+
* `field.ref` do `Controller` (foco automático no erro) funcionam diretamente.
|
|
5
|
+
*/
|
|
6
|
+
export declare const TextField: import('react').ForwardRefExoticComponent<import('react').InputHTMLAttributes<HTMLInputElement> & import('..').BaseFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export declare const TimeField: import('react').ForwardRefExoticComponent<Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "defaultValue" | "value"> & import('..').BaseFieldProps & {
|
|
2
|
+
value?: string;
|
|
3
|
+
onValueChange?: (value: string) => void;
|
|
4
|
+
onChange?: (value: string) => void;
|
|
5
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { TimeField } from './TimeField';
|
|
@@ -10,4 +10,7 @@ export * from './TextAreaField';
|
|
|
10
10
|
export * from './DateField';
|
|
11
11
|
export * from './DateTimeField';
|
|
12
12
|
export * from './DateRangeField';
|
|
13
|
+
export * from './TimeField';
|
|
14
|
+
export * from './DurationField';
|
|
15
|
+
export * from './BooleanField';
|
|
13
16
|
export type * from './shared/formFieldTypes';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Dispara o valor tratado de um campo tanto para `onChange` (assinatura
|
|
3
|
+
* RHF-native `(value) => void`, compatível com `{...field}` do `Controller`)
|
|
4
|
+
* quanto para o alias `onValueChange`. Ambos recebem exatamente o mesmo valor.
|
|
5
|
+
*/
|
|
6
|
+
export declare function emitFieldValue<T>(value: T, handlers: {
|
|
7
|
+
onChange?: (value: T) => void;
|
|
8
|
+
onValueChange?: (value: T) => void;
|
|
9
|
+
}): void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { InputHTMLAttributes, ReactNode, TextareaHTMLAttributes } from 'react';
|
|
2
2
|
import { DateRange } from 'react-day-picker';
|
|
3
3
|
import { DatePickerCalendarProps } from '../../DatePicker/DatePicker.type';
|
|
4
4
|
export type BaseFieldProps = {
|
|
@@ -7,13 +7,20 @@ export type BaseFieldProps = {
|
|
|
7
7
|
errorText?: ReactNode;
|
|
8
8
|
containerClassName?: string;
|
|
9
9
|
};
|
|
10
|
+
/**
|
|
11
|
+
* Convenção RHF-native: nos campos de valor abaixo, `onChange` recebe o **valor
|
|
12
|
+
* já tratado** (e não o evento do DOM), com a mesma assinatura do `field.onChange`
|
|
13
|
+
* do `Controller` do react-hook-form. Isso permite `<NumberField {...field} />`.
|
|
14
|
+
* `onValueChange` permanece como alias equivalente (ambos são disparados).
|
|
15
|
+
*/
|
|
10
16
|
export type TextFieldProps = InputHTMLAttributes<HTMLInputElement> & BaseFieldProps;
|
|
11
17
|
export type EmailFieldProps = InputHTMLAttributes<HTMLInputElement> & BaseFieldProps;
|
|
12
18
|
export type PasswordFieldProps = InputHTMLAttributes<HTMLInputElement> & BaseFieldProps;
|
|
13
19
|
export type NumberFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange' | 'value'> & BaseFieldProps & {
|
|
14
20
|
value?: number | null;
|
|
15
21
|
onValueChange?: (value: number | null) => void;
|
|
16
|
-
|
|
22
|
+
/** RHF-native: recebe o número tratado (ou `null`). Compatível com `{...field}`. */
|
|
23
|
+
onChange?: (value: number | null) => void;
|
|
17
24
|
/** Mínimo permitido — aplicado no onBlur */
|
|
18
25
|
min?: number;
|
|
19
26
|
/** Máximo permitido — aplicado no onBlur */
|
|
@@ -22,16 +29,20 @@ export type NumberFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type
|
|
|
22
29
|
allowDecimal?: boolean;
|
|
23
30
|
};
|
|
24
31
|
export type CurrencyFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'defaultValue' | 'onChange'> & BaseFieldProps & {
|
|
25
|
-
value?: number;
|
|
32
|
+
value?: number | null;
|
|
26
33
|
defaultValue?: number;
|
|
27
34
|
onValueChange?: (value: number | null) => void;
|
|
35
|
+
/** RHF-native: recebe o número tratado (ou `null`). Compatível com `{...field}`. */
|
|
36
|
+
onChange?: (value: number | null) => void;
|
|
28
37
|
locale?: string;
|
|
29
38
|
currency?: string;
|
|
30
39
|
};
|
|
31
40
|
export type PercentageFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'defaultValue' | 'onChange'> & BaseFieldProps & {
|
|
32
|
-
value?: number;
|
|
41
|
+
value?: number | null;
|
|
33
42
|
defaultValue?: number;
|
|
34
43
|
onValueChange?: (value: number | null) => void;
|
|
44
|
+
/** RHF-native: recebe o número tratado (ou `null`). Compatível com `{...field}`. */
|
|
45
|
+
onChange?: (value: number | null) => void;
|
|
35
46
|
min?: number;
|
|
36
47
|
max?: number;
|
|
37
48
|
};
|
|
@@ -44,7 +55,8 @@ export type MaskFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'
|
|
|
44
55
|
*/
|
|
45
56
|
mask: string | string[];
|
|
46
57
|
onValueChange?: (value: string) => void;
|
|
47
|
-
|
|
58
|
+
/** RHF-native: recebe o valor mascarado. Compatível com `{...field}`. */
|
|
59
|
+
onChange?: (value: string) => void;
|
|
48
60
|
/** Disparado quando a máscara escolhida fica completamente preenchida. */
|
|
49
61
|
onComplete?: (value: string) => void;
|
|
50
62
|
};
|
|
@@ -58,6 +70,8 @@ export type TextAreaFieldProps = TextareaHTMLAttributes<HTMLTextAreaElement> & B
|
|
|
58
70
|
export type DateFieldProps = BaseFieldProps & DatePickerCalendarProps & {
|
|
59
71
|
value?: Date;
|
|
60
72
|
onValueChange?: (value: Date | undefined) => void;
|
|
73
|
+
/** RHF-native: recebe a data selecionada. Compatível com `{...field}`. */
|
|
74
|
+
onChange?: (value: Date | undefined) => void;
|
|
61
75
|
placeholder?: string;
|
|
62
76
|
disabled?: boolean;
|
|
63
77
|
id?: string;
|
|
@@ -66,6 +80,8 @@ export type DateFieldProps = BaseFieldProps & DatePickerCalendarProps & {
|
|
|
66
80
|
export type DateTimeFieldProps = BaseFieldProps & DatePickerCalendarProps & {
|
|
67
81
|
value?: Date;
|
|
68
82
|
onValueChange?: (value: Date | undefined) => void;
|
|
83
|
+
/** RHF-native: recebe a data/hora selecionada. Compatível com `{...field}`. */
|
|
84
|
+
onChange?: (value: Date | undefined) => void;
|
|
69
85
|
placeholder?: string;
|
|
70
86
|
disabled?: boolean;
|
|
71
87
|
id?: string;
|
|
@@ -76,6 +92,46 @@ export type DateRangeValue = DateRange;
|
|
|
76
92
|
export type DateRangeFieldProps = BaseFieldProps & {
|
|
77
93
|
value?: DateRange;
|
|
78
94
|
onValueChange?: (value: DateRange | undefined) => void;
|
|
95
|
+
/** RHF-native: recebe o intervalo selecionado. Compatível com `{...field}`. */
|
|
96
|
+
onChange?: (value: DateRange | undefined) => void;
|
|
97
|
+
disabled?: boolean;
|
|
98
|
+
readOnly?: boolean;
|
|
99
|
+
};
|
|
100
|
+
export type TimeFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'defaultValue' | 'onChange'> & BaseFieldProps & {
|
|
101
|
+
/** Valor no formato `HH:mm`. */
|
|
102
|
+
value?: string;
|
|
103
|
+
/** Disparado com o valor formatado `HH:mm` (normalizado e clamped no blur). */
|
|
104
|
+
onValueChange?: (value: string) => void;
|
|
105
|
+
/** RHF-native: recebe o valor `HH:mm`. Compatível com `{...field}`. */
|
|
106
|
+
onChange?: (value: string) => void;
|
|
107
|
+
};
|
|
108
|
+
export type DurationFieldProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'defaultValue' | 'onChange'> & BaseFieldProps & {
|
|
109
|
+
/** Duração total em minutos. */
|
|
110
|
+
value?: number | null;
|
|
111
|
+
/** Disparado com a duração total em minutos (ou `null` quando vazio). */
|
|
112
|
+
onValueChange?: (value: number | null) => void;
|
|
113
|
+
/** RHF-native: recebe a duração em minutos (ou `null`). Compatível com `{...field}`. */
|
|
114
|
+
onChange?: (value: number | null) => void;
|
|
115
|
+
/** Número de dígitos reservados para as horas. Padrão: 3 (até 999h). */
|
|
116
|
+
lengthHoursMask?: number;
|
|
117
|
+
};
|
|
118
|
+
export type BooleanFieldProps = BaseFieldProps & {
|
|
119
|
+
/** Valor booleano. `null`/`undefined` = nenhuma opção selecionada. */
|
|
120
|
+
value?: boolean | null;
|
|
121
|
+
onValueChange?: (value: boolean | null) => void;
|
|
122
|
+
/** RHF-native: recebe o booleano (ou `null`). Compatível com `{...field}`. */
|
|
123
|
+
onChange?: (value: boolean | null) => void;
|
|
124
|
+
/** Apresentação do campo. Padrão: `'select'`. */
|
|
125
|
+
variant?: 'select' | 'radio';
|
|
126
|
+
/** Rótulo da opção verdadeira. Padrão: `'Sim'`. */
|
|
127
|
+
trueLabel?: string;
|
|
128
|
+
/** Rótulo da opção falsa. Padrão: `'Não'`. */
|
|
129
|
+
falseLabel?: string;
|
|
130
|
+
/** Texto do placeholder (apenas variante `select`). Padrão: `'Selecione'`. */
|
|
131
|
+
placeholder?: string;
|
|
79
132
|
disabled?: boolean;
|
|
80
133
|
readOnly?: boolean;
|
|
134
|
+
required?: boolean;
|
|
135
|
+
name?: string;
|
|
136
|
+
id?: string;
|
|
81
137
|
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Helpers compartilhados pelos campos com máscara numérica
|
|
3
|
+
* (`TimeField`, `DurationField`, `CurrencyField`). Centralizar essa lógica
|
|
4
|
+
* evita cópias divergentes de formatação/parsing entre os campos.
|
|
5
|
+
*/
|
|
6
|
+
/** Remove tudo que não é dígito de uma string (tolerante a `null`/`undefined`). */
|
|
7
|
+
export declare const onlyDigits: (raw: string | null | undefined) => string;
|
|
8
|
+
/** Formatação progressiva enquanto digita: `1230` -> `12:30`. */
|
|
9
|
+
export declare function formatTimeMask(raw: string): string;
|
|
10
|
+
/** Normaliza para `HH:mm` válido, com clamp de horas (0-23) e minutos (0-59). */
|
|
11
|
+
export declare function normalizeTime(raw: string): string;
|
|
12
|
+
/** Converte minutos totais para a string `HHhMMm` (horas com zero-padding). */
|
|
13
|
+
export declare function minutesToDisplay(value: number | null | undefined, lengthHoursMask: number): string;
|
|
14
|
+
/**
|
|
15
|
+
* Interpreta os dígitos digitados: os 2 últimos são minutos (clamp 0-59) e os
|
|
16
|
+
* demais são horas. Retorna o total de minutos (ou `null` quando vazio).
|
|
17
|
+
*/
|
|
18
|
+
export declare function digitsToMinutes(raw: string, lengthHoursMask: number): number | null;
|
|
19
|
+
/**
|
|
20
|
+
* Posição do cursor no texto formatado após `n` dígitos (preserva a posição
|
|
21
|
+
* lógica ao reformatar — ex.: máscara de moeda). Para `n <= 0` retorna o índice
|
|
22
|
+
* do primeiro dígito (ou o fim quando não há dígitos).
|
|
23
|
+
*/
|
|
24
|
+
export declare function caretPosForDigits(formatted: string, n: number): number;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Ref } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Combina vários refs (callback ou objeto) em um único callback ref. Útil quando
|
|
4
|
+
* um componente precisa manter um ref interno e, ao mesmo tempo, encaminhar o
|
|
5
|
+
* `ref` recebido (ex.: `field.ref` do react-hook-form).
|
|
6
|
+
*/
|
|
7
|
+
export declare function mergeRefs<T>(...refs: Array<Ref<T> | undefined>): (node: T | null) => void;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { ModeToggleProps } from './ModeToggle.type';
|
|
2
|
+
/**
|
|
3
|
+
* Controle de troca de tema. Deve estar dentro de um `<ThemeProvider>`.
|
|
4
|
+
*/
|
|
5
|
+
export declare const ModeToggle: ({ variant, size, includeSystem, className, "aria-label": ariaLabel }: ModeToggleProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export default ModeToggle;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const modeToggleGroupStyles: (props?: ({
|
|
2
|
+
size?: "sm" | "md" | null | undefined;
|
|
3
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
4
|
+
export declare const modeToggleOptionStyles: (props?: ({
|
|
5
|
+
size?: "sm" | "md" | null | undefined;
|
|
6
|
+
active?: boolean | null | undefined;
|
|
7
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
|
+
export declare const modeToggleIconButtonStyles: (props?: ({
|
|
9
|
+
size?: "sm" | "md" | null | undefined;
|
|
10
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { Theme } from '../../../contexts/theme/theme.type';
|
|
2
|
+
export interface ModeToggleProps {
|
|
3
|
+
/**
|
|
4
|
+
* `segmented` mostra os três modos (claro/escuro/sistema) lado a lado.
|
|
5
|
+
* `icon` mostra um único botão que alterna entre os modos.
|
|
6
|
+
*/
|
|
7
|
+
variant?: 'segmented' | 'icon';
|
|
8
|
+
/** Tamanho do controle. */
|
|
9
|
+
size?: 'sm' | 'md';
|
|
10
|
+
/** Inclui a opção "Sistema". Padrão: true. */
|
|
11
|
+
includeSystem?: boolean;
|
|
12
|
+
/** Classe adicional no container. */
|
|
13
|
+
className?: string;
|
|
14
|
+
/** Rótulo acessível do controle. Padrão: "Alternar tema". */
|
|
15
|
+
'aria-label'?: string;
|
|
16
|
+
}
|
|
17
|
+
export interface ThemeOptionMeta {
|
|
18
|
+
value: Theme;
|
|
19
|
+
label: string;
|
|
20
|
+
icon: 'sun' | 'moon' | 'monitor';
|
|
21
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PopoverMultiSelectProps } from './PopoverMultiSelect.type';
|
|
2
|
-
declare function PopoverMultiSelect<TData, TParams = void>({ label, value, onChange, loadOptions, loadPage, loadParams, getValue, getLabel, getSubLabel, placeholder, searchPlaceholder, emptyText, loadingText, loadErrorText, helperText, errorText, error, disabled, readOnly, clearable, previewLimit, className, containerClassName, searchDebounce, }: PopoverMultiSelectProps<TData, TParams>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare function PopoverMultiSelect<TData, TParams = void>({ label, value, onChange, loadOptions, loadPage, loadParams, getValue, getLabel, getSubLabel, selectedItems: selectedItemsProp, placeholder, searchPlaceholder, emptyText, loadingText, loadErrorText, helperText, errorText, error, disabled, readOnly, clearable, previewLimit, className, containerClassName, searchDebounce, }: PopoverMultiSelectProps<TData, TParams>): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
declare namespace PopoverMultiSelect {
|
|
4
4
|
var displayName: string;
|
|
5
5
|
}
|
|
@@ -18,6 +18,12 @@ export interface PopoverMultiSelectProps<TData, TParams = void> {
|
|
|
18
18
|
getValue: (item: TData) => string;
|
|
19
19
|
getLabel: (item: TData) => string;
|
|
20
20
|
getSubLabel?: (item: TData) => string | undefined;
|
|
21
|
+
/**
|
|
22
|
+
* Itens já resolvidos correspondentes a `value`. Use no modo paginado para
|
|
23
|
+
* exibir os chips de valores pré-selecionados (edição) que podem não estar
|
|
24
|
+
* nas páginas já carregadas.
|
|
25
|
+
*/
|
|
26
|
+
selectedItems?: TData[];
|
|
21
27
|
placeholder?: string;
|
|
22
28
|
searchPlaceholder?: string;
|
|
23
29
|
emptyText?: string;
|
|
@@ -12,8 +12,10 @@ export * from './FilterBar';
|
|
|
12
12
|
export * from './FilterForm';
|
|
13
13
|
export * from './FormFields';
|
|
14
14
|
export * from './FormField';
|
|
15
|
+
export * from './Form';
|
|
15
16
|
export * from './Grid';
|
|
16
17
|
export * from './ListingTable';
|
|
18
|
+
export * from './ModeToggle';
|
|
17
19
|
export * from './PageLoadingSkeleton';
|
|
18
20
|
export * from './PageHeader';
|
|
19
21
|
export * from './Pagination';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ConfirmationModalProps } from './ConfirmationModal.type';
|
|
2
|
+
/**
|
|
3
|
+
* Diálogo de confirmação controlado. Para uso imperativo, prefira
|
|
4
|
+
* `confirm()` / `useConfirmationModal()` com o `<ConfirmationModalHost />`.
|
|
5
|
+
*/
|
|
6
|
+
export declare const ConfirmationModal: ({ isOpen, title, description, confirmLabel, cancelLabel, tone, loading, onConfirm, onCancel }: ConfirmationModalProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default ConfirmationModal;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const confirmationIconStyles: (props?: ({
|
|
2
|
+
tone?: "default" | "warning" | "danger" | null | undefined;
|
|
3
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
4
|
+
export declare const confirmationBodyStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|
|
5
|
+
export declare const confirmationDescriptionStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|
|
6
|
+
export declare const confirmationFooterStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export type ConfirmationTone = 'default' | 'danger' | 'warning';
|
|
3
|
+
export interface ConfirmationOptions {
|
|
4
|
+
/** Título do diálogo. */
|
|
5
|
+
title: string;
|
|
6
|
+
/** Texto explicativo (string ou nó React). */
|
|
7
|
+
description?: ReactNode;
|
|
8
|
+
/** Rótulo do botão de confirmação. Padrão: "Confirmar". */
|
|
9
|
+
confirmLabel?: string;
|
|
10
|
+
/** Rótulo do botão de cancelamento. Padrão: "Cancelar". */
|
|
11
|
+
cancelLabel?: string;
|
|
12
|
+
/** Tom visual — `danger` usa o botão destrutivo. Padrão: `default`. */
|
|
13
|
+
tone?: ConfirmationTone;
|
|
14
|
+
}
|
|
15
|
+
export interface ConfirmationModalProps extends ConfirmationOptions {
|
|
16
|
+
/** Controla a visibilidade. */
|
|
17
|
+
isOpen: boolean;
|
|
18
|
+
/** Chamado ao confirmar. */
|
|
19
|
+
onConfirm: () => void;
|
|
20
|
+
/** Chamado ao cancelar / fechar. */
|
|
21
|
+
onCancel: () => void;
|
|
22
|
+
/** Mostra estado de carregamento no botão de confirmação. */
|
|
23
|
+
loading?: boolean;
|
|
24
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Renderiza a confirmação ativa disparada por `confirm()` / `useConfirmationModal()`.
|
|
3
|
+
* Monte uma única vez próximo da raiz da aplicação.
|
|
4
|
+
*/
|
|
5
|
+
export declare const ConfirmationModalHost: () => import("react/jsx-runtime").JSX.Element | null;
|
|
6
|
+
export default ConfirmationModalHost;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ConfirmationOptions } from './ConfirmationModal.type';
|
|
2
|
+
/**
|
|
3
|
+
* Abre um diálogo de confirmação e resolve `true`/`false` conforme a escolha.
|
|
4
|
+
* Requer um `<ConfirmationModalHost />` montado na árvore.
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* if (await confirm({ title: 'Excluir pedido?', tone: 'danger' })) {
|
|
8
|
+
* await remove();
|
|
9
|
+
* }
|
|
10
|
+
*/
|
|
11
|
+
export declare const confirm: (options: ConfirmationOptions) => Promise<boolean>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { ConfirmationOptions } from './ConfirmationModal.type';
|
|
2
|
+
export interface ConfirmRequest extends ConfirmationOptions {
|
|
3
|
+
id: number;
|
|
4
|
+
}
|
|
5
|
+
interface ConfirmState {
|
|
6
|
+
current: ConfirmRequest | null;
|
|
7
|
+
}
|
|
8
|
+
type Listener = (state: ConfirmState) => void;
|
|
9
|
+
/**
|
|
10
|
+
* Store da confirmação imperativa. Mantém uma única requisição ativa;
|
|
11
|
+
* uma nova chamada antes da anterior resolver cancela a anterior (resolve `false`).
|
|
12
|
+
*/
|
|
13
|
+
export declare const confirmStore: {
|
|
14
|
+
subscribe(listener: Listener): () => void;
|
|
15
|
+
getSnapshot(): ConfirmState;
|
|
16
|
+
request(options: ConfirmationOptions): Promise<boolean>;
|
|
17
|
+
resolve(value: boolean): void;
|
|
18
|
+
};
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Retorna a função `confirm` para abrir confirmações dentro de componentes.
|
|
3
|
+
* Requer um `<ConfirmationModalHost />` montado na árvore.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* const confirm = useConfirmationModal();
|
|
7
|
+
* const ok = await confirm({ title: 'Inativar?', tone: 'warning' });
|
|
8
|
+
*/
|
|
9
|
+
export declare const useConfirmationModal: () => (options: import('./ConfirmationModal.type').ConfirmationOptions) => Promise<boolean>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { ToasterProps } from './toast.type';
|
|
2
|
+
/**
|
|
3
|
+
* Renderiza os toasts disparados pela API imperativa `toast.*`.
|
|
4
|
+
* Monte uma única vez próximo da raiz da aplicação.
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* <Toaster position="top-right" />
|
|
8
|
+
*/
|
|
9
|
+
export declare const Toaster: ({ position, duration, max, className, zIndex }: ToasterProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
10
|
+
export default Toaster;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const toasterViewportStyles: (props?: ({
|
|
2
|
+
position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;
|
|
3
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
4
|
+
export declare const toasterItemStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|