@s_mart/form 9.1.3 → 9.2.0-beta.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/index.d.mts +24 -31
- package/dist/index.mjs +25 -25
- package/package.json +5 -5
package/dist/index.d.mts
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import * as react_hook_form from 'react-hook-form';
|
|
2
|
-
import { FieldValues, UseFormReturn, FormProviderProps, UseFormProps,
|
|
2
|
+
import { FieldValues, UseFormReturn, FormProviderProps, UseFormProps, UseControllerProps, ControllerProps } from 'react-hook-form';
|
|
3
3
|
import { z } from 'zod';
|
|
4
4
|
import * as react from 'react';
|
|
5
|
-
import react__default from 'react';
|
|
6
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
6
|
import { TextFieldProps as TextFieldProps$1, SelectProps as SelectProps$1, AutocompleteProps as AutocompleteProps$1, CheckboxProps as CheckboxProps$1, SwitchProps as SwitchProps$1, RadioProps as RadioProps$1, RadioGroupProps as RadioGroupProps$1, SliderProps as SliderProps$1 } from '@mui/material';
|
|
8
7
|
import { DatePickerProps as DatePickerProps$1, TimePickerProps as TimePickerProps$1 } from '@mui/x-date-pickers';
|
|
@@ -66,9 +65,8 @@ declare const useForm: <TValues extends FieldValues>({ disableDefaultValuesUpdat
|
|
|
66
65
|
|
|
67
66
|
declare function FormProvider<TFieldValues extends FieldValues>({ children, style, onSubmit, ...methods }: IFormProviderProps<TFieldValues>): react_jsx_runtime.JSX.Element;
|
|
68
67
|
|
|
69
|
-
type ControllerTextField = Omit<ControllerProps, 'render' | 'control'>;
|
|
70
68
|
type Masks = 'cpf' | 'cnpj' | 'cpfCnpj' | 'cep' | 'telefone' | 'decimal' | 'decimal3' | 'decimal4' | 'decimal5' | 'porcentagem' | 'porcentagem0' | 'nome' | 'numero' | 'numeroPontuacao' | 'placa' | 'valor' | 'valor3' | 'valor4';
|
|
71
|
-
type TextFieldProps = TextFieldProps$1 &
|
|
69
|
+
type TextFieldProps = TextFieldProps$1 & UseControllerProps & {
|
|
72
70
|
mask?: Masks;
|
|
73
71
|
/**
|
|
74
72
|
* @description Função que será executada quando o valor do input for alterado
|
|
@@ -77,7 +75,7 @@ type TextFieldProps = TextFieldProps$1 & ControllerTextField & {
|
|
|
77
75
|
*
|
|
78
76
|
* @example onInputChange={(values,values) => console.log({value, values})}
|
|
79
77
|
*/
|
|
80
|
-
onInputChange?: (value: string
|
|
78
|
+
onInputChange?: (value: string) => void;
|
|
81
79
|
/**
|
|
82
80
|
* @param value Valor do input
|
|
83
81
|
* @returns Valor formatado para o input
|
|
@@ -109,14 +107,14 @@ type TextFieldProps = TextFieldProps$1 & ControllerTextField & {
|
|
|
109
107
|
disableIconError?: boolean;
|
|
110
108
|
};
|
|
111
109
|
|
|
112
|
-
declare const _default$6: react.MemoExoticComponent<({ name, rules, defaultValue, shouldUnregister, label, required, mask, variant, info, parse, format, onInputChange, disableIconError, ...rest }: TextFieldProps) => react_jsx_runtime.JSX.Element>;
|
|
110
|
+
declare const _default$6: react.MemoExoticComponent<({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, required, mask, variant, info, parse, format, onInputChange, disableIconError, ...rest }: TextFieldProps) => react_jsx_runtime.JSX.Element>;
|
|
113
111
|
|
|
114
112
|
/**
|
|
115
113
|
* @deprecated usar SelectV2
|
|
116
114
|
*/
|
|
117
115
|
declare const Select: react.MemoExoticComponent<({ name, rules, defaultValue, shouldUnregister, label, required, options, placeholder, clearable, disableOnChangeForm, multiple, info, footer, onChange: onChangeProp, disableIconError, variant, ...rest }: SelectProps) => react_jsx_runtime.JSX.Element>;
|
|
118
116
|
|
|
119
|
-
type ControllerSelect
|
|
117
|
+
type ControllerSelect = Omit<ControllerProps, 'render' | 'control'>;
|
|
120
118
|
/**
|
|
121
119
|
* @deprecated
|
|
122
120
|
*/
|
|
@@ -134,7 +132,7 @@ type FooterProps = {
|
|
|
134
132
|
/**
|
|
135
133
|
* @deprecated
|
|
136
134
|
*/
|
|
137
|
-
type SelectProps = Omit<SelectProps$1, 'onChange'> & ControllerSelect
|
|
135
|
+
type SelectProps = Omit<SelectProps$1, 'onChange'> & ControllerSelect & {
|
|
138
136
|
/**
|
|
139
137
|
* As opções que serão renderizadas no select
|
|
140
138
|
*
|
|
@@ -377,8 +375,7 @@ type CreatableProps = Omit<AutocompleteProps$1<CreatableOption, true, true, true
|
|
|
377
375
|
*/
|
|
378
376
|
declare const Creatable: react.MemoExoticComponent<({ name, rules, defaultValue, shouldUnregister, label, required, options, editable, footer, onEditOption, onCreateOption, textFieldProps, hideAddButton, multiple, info, onChange: onChangeProp, onInputChange, placeholder, disableIconError, ...rest }: CreatableProps) => react_jsx_runtime.JSX.Element>;
|
|
379
377
|
|
|
380
|
-
type
|
|
381
|
-
type CheckboxProps = CheckboxProps$1 & ControllerCheckbox & {
|
|
378
|
+
type CheckboxProps = CheckboxProps$1 & UseControllerProps & {
|
|
382
379
|
/**
|
|
383
380
|
* O nome do checkbox que será renderizado na tela
|
|
384
381
|
* @default ''
|
|
@@ -405,10 +402,9 @@ type CheckboxProps = CheckboxProps$1 & ControllerCheckbox & {
|
|
|
405
402
|
disableIconError?: boolean;
|
|
406
403
|
};
|
|
407
404
|
|
|
408
|
-
declare const Checkbox: ({ name, rules, defaultValue, shouldUnregister, label, labelPlacement, required, disableIconError, onChange: onChangeProp, ...rest }: CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
405
|
+
declare const Checkbox: ({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, labelPlacement, required, disableIconError, onChange: onChangeProp, ...rest }: CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
409
406
|
|
|
410
|
-
type
|
|
411
|
-
type SwitchProps = SwitchProps$1 & ControllerSwitch & {
|
|
407
|
+
type SwitchProps = SwitchProps$1 & UseControllerProps & {
|
|
412
408
|
/**
|
|
413
409
|
* O nome do switch que será renderizado na tela
|
|
414
410
|
* @default ''
|
|
@@ -435,7 +431,7 @@ type SwitchProps = SwitchProps$1 & ControllerSwitch & {
|
|
|
435
431
|
disableIconError?: boolean;
|
|
436
432
|
};
|
|
437
433
|
|
|
438
|
-
declare const Switch: ({ name, rules, defaultValue, shouldUnregister, label, labelPlacement, disableIconError, onChange: onChangeProp, ...rest }: SwitchProps) => react_jsx_runtime.JSX.Element;
|
|
434
|
+
declare const Switch: ({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, labelPlacement, disableIconError, onChange: onChangeProp, ...rest }: SwitchProps) => react_jsx_runtime.JSX.Element;
|
|
439
435
|
|
|
440
436
|
type RadioProps = RadioProps$1 & {
|
|
441
437
|
/**
|
|
@@ -458,8 +454,7 @@ type RadioProps = RadioProps$1 & {
|
|
|
458
454
|
|
|
459
455
|
declare const RadioButton: ({ label, labelPlacement, ...rest }: RadioProps) => react_jsx_runtime.JSX.Element;
|
|
460
456
|
|
|
461
|
-
type
|
|
462
|
-
type RadioGroupProps = RadioGroupProps$1 & ControllerRadioGroup & {
|
|
457
|
+
type RadioGroupProps = RadioGroupProps$1 & UseControllerProps & {
|
|
463
458
|
/**
|
|
464
459
|
* O nome do checkbox que será renderizado na tela
|
|
465
460
|
* @default ''
|
|
@@ -502,10 +497,9 @@ type RadioGroupProps = RadioGroupProps$1 & ControllerRadioGroup & {
|
|
|
502
497
|
disableIconError?: boolean;
|
|
503
498
|
};
|
|
504
499
|
|
|
505
|
-
declare const RadioGroup: ({ name, rules, defaultValue, shouldUnregister, label, required, children, orientation, disableIconError, ...rest }: RadioGroupProps) => react_jsx_runtime.JSX.Element;
|
|
500
|
+
declare const RadioGroup: ({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, required, children, orientation, disableIconError, ...rest }: RadioGroupProps) => react_jsx_runtime.JSX.Element;
|
|
506
501
|
|
|
507
|
-
type
|
|
508
|
-
type SliderProps = SliderProps$1 & ControllerSlider & {
|
|
502
|
+
type SliderProps = SliderProps$1 & UseControllerProps & {
|
|
509
503
|
/**
|
|
510
504
|
* O nome do switch que será renderizado na tela
|
|
511
505
|
* @default ''
|
|
@@ -524,9 +518,9 @@ type SliderProps = SliderProps$1 & ControllerSlider & {
|
|
|
524
518
|
labelPlacement?: 'start' | 'end' | 'top' | 'bottom';
|
|
525
519
|
};
|
|
526
520
|
|
|
527
|
-
declare const Slider: ({ name, rules, defaultValue, shouldUnregister, ...rest }: SliderProps) => react_jsx_runtime.JSX.Element;
|
|
521
|
+
declare const Slider: ({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, ...rest }: SliderProps) => react_jsx_runtime.JSX.Element;
|
|
528
522
|
|
|
529
|
-
type DatePickerProps =
|
|
523
|
+
type DatePickerProps = UseControllerProps & Pick<TextFieldProps$1, 'label' | 'error' | 'helperText' | 'size' | 'fullWidth' | 'variant' | 'autoFocus' | 'placeholder'> & {
|
|
530
524
|
datePickerProps?: Partial<DatePickerProps$1<any>>;
|
|
531
525
|
/**
|
|
532
526
|
* Se `true` irá adicionar um asterisco ao label do campo
|
|
@@ -550,9 +544,9 @@ type DatePickerProps = Omit<UseControllerProps, 'control'> & Pick<TextFieldProps
|
|
|
550
544
|
disableIconError?: boolean;
|
|
551
545
|
};
|
|
552
546
|
|
|
553
|
-
declare const _default$5: react.MemoExoticComponent<({ rules, name, defaultValue, shouldUnregister, datePickerProps, label, required, placeholder, disabled, disableIconError, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element>;
|
|
547
|
+
declare const _default$5: react.MemoExoticComponent<({ rules, name, defaultValue, shouldUnregister, control: controlFromProps, datePickerProps, label, required, placeholder, disabled, disableIconError, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element>;
|
|
554
548
|
|
|
555
|
-
type TimePickerProps =
|
|
549
|
+
type TimePickerProps = UseControllerProps & Pick<TextFieldProps$1, 'label' | 'error' | 'helperText' | 'size' | 'fullWidth' | 'variant' | 'autoFocus' | 'placeholder'> & {
|
|
556
550
|
timePickerProps?: Partial<TimePickerProps$1<any>>;
|
|
557
551
|
/**
|
|
558
552
|
* Se `true` irá adicionar um asterisco ao label do campo
|
|
@@ -576,7 +570,7 @@ type TimePickerProps = Omit<UseControllerProps, 'control'> & Pick<TextFieldProps
|
|
|
576
570
|
disableIconError?: boolean;
|
|
577
571
|
};
|
|
578
572
|
|
|
579
|
-
declare const _default$4:
|
|
573
|
+
declare const _default$4: react.MemoExoticComponent<({ rules, defaultValue, shouldUnregister, name, control: controlFromProps, required, label, timePickerProps, placeholder, disabled, disableIconError, ...rest }: TimePickerProps) => react_jsx_runtime.JSX.Element>;
|
|
580
574
|
|
|
581
575
|
type AutoCompleteOption = {
|
|
582
576
|
key?: string | number;
|
|
@@ -625,7 +619,7 @@ declare const FieldLabel: ({ label, required, regular }: FieldLabelProps) => rea
|
|
|
625
619
|
|
|
626
620
|
type ConditionalArrayType<T, Multiple extends boolean | undefined = undefined> = Multiple extends true ? T[] : T;
|
|
627
621
|
|
|
628
|
-
type SearchableV2Props<T extends FieldValues | string | number, Multiple extends boolean | undefined, _ValueType = unknown> = Omit<AutocompleteProps$1<T, Multiple, true, true>, 'renderInput' | 'size' | 'onInputChange' | 'onChange' | 'getOptionLabel' | 'getOptionKey' | 'defaultValue' | 'value'> &
|
|
622
|
+
type SearchableV2Props<T extends FieldValues | string | number, Multiple extends boolean | undefined, _ValueType = unknown> = Omit<AutocompleteProps$1<T, Multiple, true, true>, 'renderInput' | 'size' | 'onInputChange' | 'onChange' | 'getOptionLabel' | 'getOptionKey' | 'defaultValue' | 'value'> & UseControllerProps & {
|
|
629
623
|
options: T[];
|
|
630
624
|
textFieldProps?: TextFieldProps$1;
|
|
631
625
|
label?: React.ReactNode;
|
|
@@ -667,13 +661,12 @@ type SearchableV2Props<T extends FieldValues | string | number, Multiple extends
|
|
|
667
661
|
getOptionAfterLabel?: (option: T) => string | React.ReactNode;
|
|
668
662
|
};
|
|
669
663
|
|
|
670
|
-
declare const _default$2: <T extends string | number | FieldValues, Multiple extends boolean | undefined = undefined, _ValueType = ConditionalArrayType<T, Multiple>>({ name, rules, defaultValue, shouldUnregister, label, required, options, textFieldProps, noOptionsText, footer, multiple, info, placeholder, onChange: onChangeProp, onInputChange, getOptionAfterLabel, getOptionLabel, getOptionKey, ...rest }: SearchableV2Props<T, Multiple, _ValueType>) => react_jsx_runtime.JSX.Element;
|
|
664
|
+
declare const _default$2: <T extends string | number | FieldValues, Multiple extends boolean | undefined = undefined, _ValueType = ConditionalArrayType<T, Multiple>>({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, required, options, textFieldProps, noOptionsText, footer, multiple, info, placeholder, onChange: onChangeProp, onInputChange, getOptionAfterLabel, getOptionLabel, getOptionKey, ...rest }: SearchableV2Props<T, Multiple, _ValueType>) => react_jsx_runtime.JSX.Element;
|
|
671
665
|
|
|
672
|
-
type ControllerSelect = Omit<ControllerProps, 'render' | 'control'>;
|
|
673
666
|
type FooterPropsV2 = {
|
|
674
667
|
closeSelect: () => void;
|
|
675
668
|
};
|
|
676
|
-
type SelectV2Props<T extends FieldValues | string | number> = Omit<SelectProps$1, 'onChange' | 'multiple' | 'defaultValue' | 'variant'> &
|
|
669
|
+
type SelectV2Props<T extends FieldValues | string | number> = Omit<SelectProps$1, 'onChange' | 'multiple' | 'defaultValue' | 'variant'> & UseControllerProps & {
|
|
677
670
|
variant?: 'filled' | 'outlined' | 'standard';
|
|
678
671
|
/**
|
|
679
672
|
* As opções que serão renderizadas no select
|
|
@@ -724,9 +717,9 @@ type SelectV2Props<T extends FieldValues | string | number> = Omit<SelectProps$1
|
|
|
724
717
|
getOptionIcon?: (option: T) => React.ReactNode;
|
|
725
718
|
};
|
|
726
719
|
|
|
727
|
-
declare const _default$1: <T extends string | number | FieldValues>({ name, rules, defaultValue, shouldUnregister, label, required, options, placeholder, clearable, info, footer, onChange: onChangeProp, variant, getOptionKey, getOptionLabel, getOptionAfterLabel, getOptionIcon, ...rest }: SelectV2Props<T>) => react_jsx_runtime.JSX.Element;
|
|
720
|
+
declare const _default$1: <T extends string | number | FieldValues>({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, required, options, placeholder, clearable, info, footer, onChange: onChangeProp, variant, getOptionKey, getOptionLabel, getOptionAfterLabel, getOptionIcon, ...rest }: SelectV2Props<T>) => react_jsx_runtime.JSX.Element;
|
|
728
721
|
|
|
729
|
-
type CreatableV2Props<T extends FieldValues | string | number, Multiple extends boolean | undefined, _ValueType = unknown> = Omit<AutocompleteProps$1<T, Multiple, true, true>, 'renderInput' | 'size' | 'onInputChange' | 'onChange' | 'getOptionLabel' | 'getOptionKey' | 'defaultValue' | 'value'> &
|
|
722
|
+
type CreatableV2Props<T extends FieldValues | string | number, Multiple extends boolean | undefined, _ValueType = unknown> = Omit<AutocompleteProps$1<T, Multiple, true, true>, 'renderInput' | 'size' | 'onInputChange' | 'onChange' | 'getOptionLabel' | 'getOptionKey' | 'defaultValue' | 'value'> & UseControllerProps & {
|
|
730
723
|
options: T[];
|
|
731
724
|
textFieldProps?: TextFieldProps$1;
|
|
732
725
|
label?: React.ReactNode;
|
|
@@ -789,6 +782,6 @@ type CreatableV2Props<T extends FieldValues | string | number, Multiple extends
|
|
|
789
782
|
getOptionAfterLabel?: (option: T) => string | React.ReactNode;
|
|
790
783
|
};
|
|
791
784
|
|
|
792
|
-
declare const _default: <T extends string | number | FieldValues, Multiple extends boolean | undefined = undefined, _ValueType = ConditionalArrayType<T, Multiple>>({ name, rules, defaultValue, shouldUnregister, label, required, options, footer, showCreatableButton, showEditableButton, onEditOption, onCreateOption, getOptionKey, getOptionLabel, getOptionAfterLabel, textFieldProps, multiple, info, noOptionsText, onChange: onChangeProp, onInputChange, placeholder, ...rest }: CreatableV2Props<T, Multiple, _ValueType>) => react_jsx_runtime.JSX.Element;
|
|
785
|
+
declare const _default: <T extends string | number | FieldValues, Multiple extends boolean | undefined = undefined, _ValueType = ConditionalArrayType<T, Multiple>>({ name, rules, defaultValue, shouldUnregister, control: controlFromProps, label, required, options, footer, showCreatableButton, showEditableButton, onEditOption, onCreateOption, getOptionKey, getOptionLabel, getOptionAfterLabel, textFieldProps, multiple, info, noOptionsText, onChange: onChangeProp, onInputChange, placeholder, ...rest }: CreatableV2Props<T, Multiple, _ValueType>) => react_jsx_runtime.JSX.Element;
|
|
793
786
|
|
|
794
787
|
export { _default$3 as Autocomplete, type AutocompleteProps, Checkbox, type CheckboxProps, Creatable, type CreatableOption, type CreatableProps, _default as CreatableV2, type CreatableV2Props, _default$5 as DatePicker, type DatePickerProps, FieldLabel, type FieldLabelProps, type FooterProps, type FooterPropsV2, Form, FormProvider, type IFormProps, type IFormProviderProps, type IUseFormProps, RadioButton, RadioGroup, type RadioGroupProps, type RadioProps, Searchable, type SearchableOption, type SearchableProps, _default$2 as SearchableV2, type SearchableV2Props, Select, type SelectOption, type SelectProps, _default$1 as SelectV2, type SelectV2Props, Slider, type SliderProps, Switch, type SwitchProps, _default$6 as TextField, type TextFieldProps, _default$4 as TimePicker, type TimePickerProps, useForm };
|
package/dist/index.mjs
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import{FormProvider as
|
|
1
|
+
import{FormProvider as no}from"react-hook-form";import{jsx as Ie}from"react/jsx-runtime";function ao({children:e,style:o,onSubmit:i,...a}){return Ie(no,{...a,children:Ie("form",{onSubmit:p=>{p.preventDefault(),p.stopPropagation(),i(p)},style:o,children:e})})}var be=ao;import{useEffect as so}from"react";import{useForm as po}from"react-hook-form";import{zodResolver as mo}from"@hookform/resolvers/zod";var uo=({disableDefaultValuesUpdate:e,onSubmit:o,...i})=>{let a=po({...i,resolver:i.schema&&mo(i.schema)});return so(()=>{e||a.reset(i.defaultValues)},[i.defaultValues,a.reset]),{...a,onSubmit:a.handleSubmit(p=>o(p,a))}},ve=uo;import{jsx as yo}from"react/jsx-runtime";function fo({children:e,style:o,...i}){let a=ve(i);return yo(be,{...a,style:o,children:typeof e=="function"?e(a):e})}var co=fo;import{InputAdornment as Po,Stack as To,TextField as So,Tooltip as ko}from"@mui/material";import{LIcon as Re}from"@s_mart/core";import*as Ae from"@s_mart/masks";import{lineEye as Io,lineEyeSlash as wo,lineInfoCircle as Vo}from"@s_mart/solid-icons";import{memo as Ro,useRef as Ao,useState as Bo}from"react";import{useController as Lo,useFormContext as Eo,useFormState as Do}from"react-hook-form";import{Indicator as xo}from"@s_mart/core";import{useFormState as Fo}from"react-hook-form";var L=(e,o)=>o.replace(/[[\]]/g,"").split(".").reduce((a,p)=>a?.[p],e);import{jsx as vo}from"react/jsx-runtime";var bo=({name:e,disableIcon:o,control:i})=>{let a=Fo({control:i,name:e}),p=L(a?.errors,e);return p?vo(xo,{severity:"error",icon:o?!1:void 0,children:p?.message}):null},V=bo;import{Typography as we}from"@mui/material";import{toRem as go}from"@s_mart/utils";import{jsx as Ve,jsxs as Co}from"react/jsx-runtime";var ho=({label:e,required:o,regular:i})=>Co("span",{style:{display:"flex",alignItems:"center",gap:go(2)},children:[Ve(we,{variant:"caption",style:{display:"flex",alignItems:"center"},sx:{fontWeight:i?400:700},children:e}),o&&Ve(we,{variant:"caption",color:"error",sx:{fontWeight:900},children:"*"})]}),k=ho;var T=class extends Error{constructor(o){super(`O componente ${o} precisa de um control para funcionar. Passe o control como prop ou coloque o componente dentro de um <Form />`),this.name="FormComponentPrecisaDeControl"}};import{jsx as U,jsxs as Be}from"react/jsx-runtime";var $o=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,required:S,mask:c,variant:g="outlined",info:C,parse:h,format:y,onInputChange:d,disableIconError:m,...u})=>{let P=Eo()?.control,l=p??P,b=Ao(i||void 0);if(!l)throw new T("TextField");let[w,n]=Bo(!1),x=s=>{let t=s;return t=y?.(s)??s,c?Ae?.[c]?.format(t):t},_=s=>{let t=s;return t=h?.(s)??t,c?Ae?.[c]?.parse(t,b.current):t},v=s=>{if(!s||c!=="porcentagem"&&c!=="porcentagem0")return;s?.stopPropagation();let t=(s?.target).value;if(t){let G=String(t);if(G.length>0){let j=G.indexOf("%");j>-1&&(s.currentTarget.selectionEnd=j)}}},{field:r}=Lo({control:l,name:e,rules:o,defaultValue:i,shouldUnregister:a}),E=Do({control:l,name:e}),f=L(E.errors,e);return Be(To,{children:[Be("div",{style:{display:"flex"},children:[F&&U("div",{children:U(k,{label:F,required:S})}),C&&U("div",{children:U(ko,{title:C,placement:"top",children:U("div",{style:{width:"fit-content"},children:U(Re,{icon:Vo,color:"#757575"})})})})]}),U(So,{variant:g,defaultValue:i,value:x(r.value||(r.value!=0?"":r.value)),onChange:s=>{let t=_(s?.target?.value);r.onChange(t),d?.(t),b.current=s.target.value},error:!!f,...u,type:u.type==="password"?w?"text":"password":u.type,autoComplete:u.autoComplete||"off",slotProps:{input:{onKeyDown:v,inputRef:r.ref,endAdornment:u.type==="password"&&U(Po,{position:"start",onClick:()=>n(!w),style:{cursor:"pointer"},children:U(Re,{icon:w?Io:wo,size:"24px",removeMargin:!0})}),...u.InputProps}}},e),U(V,{name:e,disableIcon:m,control:l})]})},Mo=Ro($o);import{Divider as Go,Grid as X,MenuItem as zo,Select as _o,Tooltip as Oo,useTheme as qo}from"@mui/material";import{IconButton as No,LIcon as Le}from"@s_mart/core";import{lineTimes as Uo}from"@s_mart/regular-icons";import{lineInfoCircle as Ho}from"@s_mart/solid-icons";import{colorPalette as Wo}from"@s_mart/tokens";import{memo as Yo,useState as jo}from"react";import{Controller as Jo,useFormContext as Ko}from"react-hook-form";import{Fragment as Qo,jsx as z,jsxs as ae}from"react/jsx-runtime";var Ee=Yo(({name:e,rules:o,defaultValue:i,shouldUnregister:a,label:p,required:F,options:S,placeholder:c,clearable:g,disableOnChangeForm:C=!1,multiple:h,info:y,footer:d,onChange:m,disableIconError:u,variant:P="outlined",...l})=>{let b=Ko(),{palette:w}=qo(),[n,x]=jo(!1);if(!b)throw new T("Select");let _=L(b.formState.errors,e);return z(Jo,{control:b.control,name:e,rules:o,defaultValue:i,shouldUnregister:a,render:({field:{value:v,onChange:r,ref:E}})=>ae(X,{sx:{display:"flex",flexDirection:"column"},children:[ae("div",{style:{display:"flex"},children:[p&&z(X,{item:!0,children:z(k,{label:p,required:F})}),y&&z(X,{item:!0,children:z(Oo,{title:y,placement:"top",children:z("div",{style:{width:"fit-content"},children:z(Le,{icon:Ho,color:"#757575"})})})})]}),ae(_o,{open:n,onOpen:()=>x(!0),onClose:()=>x(!1),displayEmpty:!!c,variant:P,autoComplete:"off",value:v?v||"":h?[]:"",renderValue:f=>{if(f.label)return f.label;if(c)return z("p",{style:{color:w.grey[400]},children:c})},multiple:h,onChange:f=>{!C&&r(f.target.value),m&&m(f.target.value,b.getValues())},error:!!_,size:l.size||"medium",inputRef:E,...l,endAdornment:ae(Qo,{children:[l.endAdornment,!!(g&&v)&&z(No,{variant:"text",color:"neutral",size:"small",sx:{borderRadius:"50%",position:"absolute",right:"2rem"},style:{padding:0},"aria-label":"Clear",title:"Clear",onClick:()=>{!C&&r(null),m&&m(null,b.getValues())},children:z(Le,{icon:Uo,color:Wo.neutral[100],size:"25px",removeMargin:!0})})]}),children:[S?.map((f,s)=>z(zo,{value:f,children:ae(X,{container:!0,direction:"column",children:[z(X,{item:!0,children:f.label}),f.afterLabel&&z(X,{item:!0,children:f.afterLabel})]})},s)),d&&[z(X,{sx:{px:2,py:1},children:z(Go,{})},"footer-divider"),z("div",{children:d({closeSelect:()=>x(!1)})},"footer-content")]]},e),z(V,{name:e,disableIcon:u,control:b.control})]})})});Ee.displayName="Select";var Xo=Ee;import{Autocomplete as Zo,Divider as De,Grid as J,TextField as er,Tooltip as or}from"@mui/material";import{LIcon as rr}from"@s_mart/core";import{lineInfoCircle as tr}from"@s_mart/solid-icons";import{colorPalette as ir}from"@s_mart/tokens";import{forwardRef as lr,memo as nr}from"react";import{Controller as ar,useFormContext as sr}from"react-hook-form";import{Fragment as pe,jsx as M,jsxs as Q}from"react/jsx-runtime";import{createElement as $e}from"react";var Me=nr(({name:e,rules:o,defaultValue:i,shouldUnregister:a,label:p,required:F,options:S,textFieldProps:c,noOptionsText:g,footer:C,multiple:h,info:y,placeholder:d,onChange:m,onInputChange:u,disableIconError:P,...l})=>{let b=sr();if(!b)throw new T("Searchable");let w=L(b.formState.errors,e);return M(ar,{control:b.control,name:e,rules:o,defaultValue:i,shouldUnregister:a,render:({field:{onChange:n,value:x,ref:_}})=>Q(J,{sx:{display:"flex",flexDirection:"column"},children:[Q("div",{style:{display:"flex"},children:[p&&M(J,{item:!0,children:M(k,{label:p,required:F})}),y&&M(J,{item:!0,children:M(or,{title:y,placement:"top",children:M("div",{style:{width:"fit-content"},children:M(rr,{icon:tr,color:"#757575"})})})})]}),M(Zo,{onChange:(v,r)=>{n(r),m?.(r,b.getValues())},onInputChange:(v,r,E)=>{E==="input"&&setTimeout(()=>{u?.(r,b.getValues())},0)},slotProps:{...l.slotProps||{},paper:{...(l.slotProps||{}).paper||{},sx:{border:`1px solid ${ir.neutral[30]}`,boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.15)"}},listbox:{component:lr(function(r,E){return Q(pe,{children:[M("ul",{...r,ref:E}),!!C&&M("div",{...r,children:Q(pe,{children:[M(J,{sx:{px:2,py:1},children:M(De,{})}),C]})},"searchable-footer")]})})}},value:x||(h?[]:null),options:S,multiple:h,readOnly:l.disabled,noOptionsText:Q(pe,{children:[g||"Nenhum resultado encontrado",C?Q(pe,{children:[M(J,{sx:{py:1},children:M(De,{})}),C]}):null]}),isOptionEqualToValue:(v,r)=>typeof v=="string"&&typeof r=="string"?v===r:typeof v=="object"&&typeof r=="object"?typeof v.value=="object"&&typeof r.value=="object"&&v.key!==void 0&&r.key!==void 0?v.key===r.key:v.value===r.value:!1,renderOption:(v,r)=>typeof r=="object"?$e("li",{...v,key:r.key||r.value},Q(J,{container:!0,direction:"column",children:[M(J,{item:!0,children:r.label}),r.afterLabel&&M(J,{item:!0,children:r.afterLabel})]})):$e("li",{...v,key:r},r),...l,renderInput:v=>M(er,{error:!!w,placeholder:d,...v,...c,inputRef:_})},e),M(V,{name:e,disableIcon:P,control:b.control})]})})});Me.displayName="Searchable";var pr=Me;import{forwardRef as ur,memo as fr}from"react";import{Controller as cr,useFormContext as yr}from"react-hook-form";import{isObject as xr,isEmpty as Fr}from"lodash-es";import{Grid as Z,Autocomplete as br,TextField as vr,Tooltip as gr,Divider as hr}from"@mui/material";import{LIcon as me,Button as Cr}from"@s_mart/core";import{colorPalette as Pr}from"@s_mart/tokens";import{linePlus as Oe,linePen as Tr,lineInfoCircle as Sr}from"@s_mart/solid-icons";import{toRem as qe}from"@s_mart/utils";import{css as Ge}from"@emotion/react";import{styled as dr}from"@mui/material";import{toRem as de}from"@s_mart/utils";var ze=Ge`
|
|
2
2
|
display: flex;
|
|
3
3
|
align-items: center;
|
|
4
4
|
justify-content: center;
|
|
5
|
-
`,
|
|
5
|
+
`,mr=e=>Ge`
|
|
6
6
|
.creatable,
|
|
7
7
|
.editable {
|
|
8
|
-
${
|
|
8
|
+
${ze}
|
|
9
9
|
|
|
10
10
|
.divider {
|
|
11
11
|
width: 1px;
|
|
12
|
-
height: ${
|
|
12
|
+
height: ${de(20)};
|
|
13
13
|
background-color: ${e.palette.grey[400]};
|
|
14
14
|
}
|
|
15
15
|
|
|
@@ -20,9 +20,9 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
20
20
|
color: ${e.palette.grey[600]};
|
|
21
21
|
border-radius: 50%;
|
|
22
22
|
|
|
23
|
-
margin: 0 ${
|
|
24
|
-
width: ${
|
|
25
|
-
height: ${
|
|
23
|
+
margin: 0 ${de(6)};
|
|
24
|
+
width: ${de(28)};
|
|
25
|
+
height: ${de(28)};
|
|
26
26
|
|
|
27
27
|
&:hover {
|
|
28
28
|
cursor: pointer;
|
|
@@ -31,14 +31,14 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
|
-
`,
|
|
34
|
+
`,_e=dr("div")`
|
|
35
35
|
display: flex;
|
|
36
36
|
|
|
37
37
|
div.endAdornments {
|
|
38
38
|
position: absolute;
|
|
39
39
|
right: 0;
|
|
40
40
|
|
|
41
|
-
${
|
|
41
|
+
${ze}
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
.MuiAutocomplete-endAdornment {
|
|
@@ -50,30 +50,30 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
50
50
|
transform: translate(0, 0);
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
-
${({hideAddButton:e,theme:
|
|
54
|
-
`;import{Fragment as
|
|
53
|
+
${({hideAddButton:e,theme:o})=>!e&&mr(o)}
|
|
54
|
+
`;import{Fragment as ge,jsx as A,jsxs as H}from"react/jsx-runtime";import{createElement as Ne}from"react";var Ue=fr(({name:e,rules:o,defaultValue:i,shouldUnregister:a,label:p,required:F,options:S,editable:c,footer:g,onEditOption:C,onCreateOption:h,textFieldProps:y,hideAddButton:d,multiple:m,info:u,onChange:P,onInputChange:l,placeholder:b,disableIconError:w,...n})=>{let x=yr();if(!x)throw new T("Creatable");let _=L(x.formState.errors,e),v=d||n.disabled,r=t=>{let G=0;return y?.InputProps||(G+=2.5),v||(G+=2.56,E(t)&&(G+=2.56)),!n.disableClearable&&!n.disabled&&(G+=1.3),G+"rem"},E=t=>n.disabled?!1:c&&xr(t)&&!Fr(t);console.warn=()=>{};let f=t=>{h?h(t):console.error("onCreateOption n\xE3o foi definido")},s=t=>{C?C(t):console.error("onEditOption n\xE3o foi definido")};return A(cr,{control:x.control,name:e,rules:o,defaultValue:i,shouldUnregister:a,render:({field:{value:t,onChange:G,ref:j}})=>{let ne=t?.label||t?.value||t;return H(Z,{sx:{display:"flex",flexDirection:"column"},children:[H("div",{style:{display:"flex"},children:[p&&A(Z,{item:!0,children:A(k,{label:p,required:F})}),u&&A(Z,{item:!0,children:A(gr,{title:u,placement:"top",children:A("div",{style:{width:"fit-content"},children:A(me,{icon:Sr,color:"#757575"})})})})]}),A(_e,{hideAddButton:v,children:A(br,{fullWidth:!0,onChange:(R,I)=>{G(I),P?.(I,x.getValues())},onInputChange:(R,I,ie)=>{ie==="input"&&setTimeout(()=>{l?.(I,x.getValues())},0)},slotProps:{...n.slotProps||{},paper:{...(n.slotProps||{}).paper||{},sx:{border:`1px solid ${Pr.neutral[30]}`,boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.15)"}},listbox:{component:ur(function(I,ie){return H(ge,{children:[A("ul",{...I,ref:ie}),!!g&&A("div",{...I,children:H(ge,{children:[A(Z,{sx:{px:2,py:1},children:A(hr,{})}),g]})},"creatable-footer")]})})}},options:S,value:t||(m?[]:null),multiple:m,readOnly:n.disabled,noOptionsText:v?void 0:H(Cr,{sx:{justifyContent:"flex-start",padding:`${qe(6)} ${qe(-16)}`,margin:0},fullWidth:!0,onClick:()=>f(t),variant:"text",startIcon:A(me,{icon:Oe}),children:["Adicionar ",ne&&`"${ne}"`]}),isOptionEqualToValue:(R,I)=>I?typeof R=="string"&&typeof I=="string"?R===I:typeof R=="object"&&typeof I=="object"?typeof R.value=="object"&&typeof I.value=="object"&&R.key!==void 0&&I.key!==void 0?R.key===I.key:R.value===I.value:typeof R=="object"&&typeof I=="string":!1,renderOption:(R,I)=>typeof I=="object"?Ne("li",{...R,key:I.key||I.value},H(Z,{container:!0,direction:"column",children:[A(Z,{item:!0,children:I.label}),I.afterLabel&&A(Z,{item:!0,children:I.afterLabel})]})):Ne("li",{...R,key:I},I),...n,sx:{"& div.MuiInputBase-root":{paddingRight:`${r(t)} !important`},...n.sx},renderInput:R=>A(vr,{placeholder:b,...R,error:!!_,...y,slotProps:{input:{...R.InputProps,inputRef:j,endAdornment:H("div",{className:"endAdornments",children:[R.InputProps.endAdornment,!v&&H(ge,{children:[E(t)?H("div",{className:"editable",children:[A("div",{className:"divider"}),A("div",{className:"button",onClick:()=>s(t),children:A(me,{icon:Tr,size:"24px",removeMargin:!0})})]}):null,H("div",{className:"creatable",children:[A("div",{className:"divider"}),A("div",{className:"button",onClick:()=>f(t),children:A(me,{icon:Oe,size:"24px",removeMargin:!0})})]})]})]})}}})},e)}),A(V,{name:e,disableIcon:w,control:x.control})]})}})});Ue.displayName="Creatable";var kr=Ue;import{useController as Ir,useFormContext as wr}from"react-hook-form";import{Checkbox as Vr,FormControlLabel as Rr}from"@mui/material";import{jsx as ue,jsxs as Lr}from"react/jsx-runtime";var Ar=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,labelPlacement:S,required:c,disableIconError:g,onChange:C,...h})=>{let y=wr()?.control,d=p??y;if(!d)throw new T("Checkbox");let{field:m}=Ir({control:d,name:e,rules:o,defaultValue:i,shouldUnregister:a});return Lr("span",{children:[ue(Rr,{control:ue(Vr,{checked:!!m.value,value:m.value??"",defaultValue:m.value,onChange:(u,P)=>{m.onChange(u,P),C?.(u,P)},...h},e),label:ue(k,{label:F,required:c,regular:!0}),labelPlacement:S||"end"}),ue(V,{name:e,disableIcon:g,control:d})]})},Br=Ar;import{FormControlLabel as Er,Stack as Dr,Switch as $r}from"@mui/material";import{useController as Mr,useFormContext as Gr}from"react-hook-form";import{jsx as fe,jsxs as Or}from"react/jsx-runtime";var zr=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,labelPlacement:S,disableIconError:c,onChange:g,...C})=>{let h=Gr()?.control,y=p??h;if(!y)throw new T("Switch");let{field:d}=Mr({control:y,name:e,rules:o,defaultValue:i,shouldUnregister:a});return Or(Dr,{children:[fe(Er,{control:fe($r,{value:d.value??"",checked:d.value??!1,defaultValue:d.value,onChange:(m,u)=>{d.onChange(m,u),g?.(m,u)},...C},e),label:fe(k,{label:F}),labelPlacement:S||"end"}),fe(V,{name:e,disableIcon:c,control:y})]})},_r=zr;import{FormControlLabel as qr,Grid2 as Nr,Radio as Ur}from"@mui/material";import{jsx as ce}from"react/jsx-runtime";var Hr=({label:e,labelPlacement:o,...i})=>ce(Nr,{sx:{display:"flex",flexDirection:"column"},children:ce(qr,{control:ce(Ur,{...i}),label:ce(k,{label:e}),labelPlacement:o||"end"})}),Wr=Hr;import{RadioGroup as Yr,Stack as jr}from"@mui/material";import{useController as Jr,useFormContext as Kr}from"react-hook-form";import{jsx as he,jsxs as Zr}from"react/jsx-runtime";var Xr=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,required:S,children:c,orientation:g="row",disableIconError:C,...h})=>{let y=Kr()?.control,d=p??y;if(!d)throw new T("RadioGroup");let{field:m}=Jr({control:d,name:e,rules:o,defaultValue:i,shouldUnregister:a});return Zr(jr,{children:[F&&he(k,{label:F,required:S}),he(Yr,{value:m.value||"",name:e,...h,onChange:u=>{h?.onChange?.(u,u.target?.value),m.onChange(u)},style:{display:"flex",flexDirection:g},children:c},e),he(V,{name:e,disableIcon:C,control:d})]})},Qr=Xr;import{useController as et,useFormContext as ot}from"react-hook-form";import{Slider as rt}from"@mui/material";import{jsx as lt}from"react/jsx-runtime";var tt=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,...F})=>{let S=ot()?.control,c=p??S;if(!c)throw new T("Slider");let{field:g}=et({control:c,name:e,rules:o,defaultValue:i,shouldUnregister:a});return lt(rt,{value:g.value||F?.min||0,onChange:g.onChange,valueLabelDisplay:"auto",...F},e)},it=tt;import{Stack as dt,TextField as mt}from"@mui/material";import{AdapterDayjs as ut}from"@mui/x-date-pickers/AdapterDayjs";import{DatePicker as ft}from"@mui/x-date-pickers/DatePicker";import{LocalizationProvider as ct}from"@mui/x-date-pickers/LocalizationProvider";import{ptBR as yt}from"@mui/x-date-pickers/locales/ptBR";import{composeValidators as xt,date as We}from"@s_mart/rules";import Ft from"dayjs/locale/pt-br";import{memo as bt}from"react";import{useController as vt,useFormContext as gt,useFormState as ht}from"react-hook-form";import{IconButton as nt,styled as at}from"@mui/material";import{toRem as W}from"@s_mart/utils";var st=e=>{switch(e){case"small":return W(16);default:case"medium":return W(20);case"large":return W(24)}},pt=e=>{switch(e){case"small":return`${W(2)} ${W(8)}`;default:case"medium":return`${W(6)} ${W(8)}`;case"large":return`${W(10)}`}},He=at(nt)`
|
|
55
55
|
margin: 0px;
|
|
56
56
|
|
|
57
|
-
padding: ${({size:e})=>
|
|
58
|
-
border-radius: 0 ${
|
|
57
|
+
padding: ${({size:e})=>pt(e)};
|
|
58
|
+
border-radius: 0 ${W(4)} ${W(4)} 0;
|
|
59
59
|
|
|
60
60
|
svg {
|
|
61
|
-
width: ${({size:e})=>
|
|
61
|
+
width: ${({size:e})=>st(e)} !important;
|
|
62
62
|
}
|
|
63
|
-
`;import{jsx as
|
|
63
|
+
`;import{jsx as ye,jsxs as St}from"react/jsx-runtime";import{createElement as Tt}from"react";var Ct=({rules:e,name:o,defaultValue:i,shouldUnregister:a,control:p,datePickerProps:F,label:S,required:c,placeholder:g,disabled:C,disableIconError:h,...y})=>{let d=gt()?.control,m=p??d;if(!m)throw new T("DatePicker");let u=ht({control:m,name:o}),P=L(u.errors,o),l=F?.format||"DD/MM/YYYY",b=e?xt([We(l),e]):We(l),{field:w}=vt({control:m,name:o,rules:b,defaultValue:i,shouldUnregister:a});return ye(ct,{dateAdapter:ut,adapterLocale:Ft,localeText:yt.components.MuiLocalizationProvider.defaultProps.localeText,children:St(dt,{children:[S&&ye(k,{label:S,required:c}),Tt(ft,{...F,key:o,value:w.value??null,format:l,onChange:(n,x)=>{w.onChange(n,x),F?.onChange?.(n,x)},disabled:C,slots:{textField:mt,openPickerButton:n=>ye(He,{...n,size:y.size})},slotProps:{textField:n=>({variant:"outlined",...n,error:!!P,...y,inputProps:{...n.inputProps,placeholder:g||n.inputProps?.placeholder},InputProps:{...n.InputProps,inputRef:x=>{w.ref(x),typeof n.inputRef=="function"&&n.inputRef(x)}}})}}),ye(V,{name:o,disableIcon:h,control:m})]})})},Pt=bt(Ct);import{Stack as Rt,TextField as At}from"@mui/material";import{AdapterDayjs as Bt}from"@mui/x-date-pickers/AdapterDayjs";import{LocalizationProvider as Lt}from"@mui/x-date-pickers/LocalizationProvider";import{TimePicker as Et}from"@mui/x-date-pickers/TimePicker";import{ptBR as Dt}from"@mui/x-date-pickers/locales/ptBR";import{composeValidators as $t,time as je}from"@s_mart/rules";import Mt from"dayjs/locale/pt-br";import{memo as Gt}from"react";import{useController as zt,useFormContext as _t,useFormState as Ot}from"react-hook-form";import{styled as kt}from"@mui/material";import{IconButton as It}from"@mui/material";import{toRem as Y}from"@s_mart/utils";var wt=e=>{switch(e){case"small":return Y(16);default:case"medium":return Y(20);case"large":return Y(24)}},Vt=e=>{switch(e){case"small":return`${Y(2)} ${Y(8)}`;default:case"medium":return`${Y(6)} ${Y(8)}`;case"large":return`${Y(10)}`}},Ye=kt(It)`
|
|
64
64
|
margin: 0px;
|
|
65
65
|
|
|
66
|
-
padding: ${({size:e})=>
|
|
67
|
-
border-radius: 0 ${
|
|
66
|
+
padding: ${({size:e})=>Vt(e)};
|
|
67
|
+
border-radius: 0 ${Y(4)} ${Y(4)} 0;
|
|
68
68
|
|
|
69
69
|
svg {
|
|
70
|
-
width: ${({size:e})=>
|
|
70
|
+
width: ${({size:e})=>wt(e)} !important;
|
|
71
71
|
}
|
|
72
|
-
`;import{jsx as
|
|
72
|
+
`;import{jsx as se,jsxs as Ut}from"react/jsx-runtime";var qt=({rules:e,defaultValue:o,shouldUnregister:i,name:a,control:p,required:F,label:S,timePickerProps:c,placeholder:g,disabled:C,disableIconError:h,...y})=>{let d=_t()?.control,m=p??d;if(!m)throw new T("TimePicker");let u=Ot({control:m,name:a}),P=L(u.errors,a),l=c?.format||"HH:mm",b=e?$t([je(l),e]):je(l),{field:w}=zt({control:m,name:a,rules:b,defaultValue:o,shouldUnregister:i});return se(Lt,{dateAdapter:Bt,adapterLocale:Mt,localeText:Dt.components.MuiLocalizationProvider.defaultProps.localeText,children:Ut(Rt,{children:[S&&se(k,{label:S,required:F}),se(Et,{ampm:!1,format:l,value:w.value??null,disabled:C,...c,onChange:(n,x)=>{w.onChange(n,x),c?.onChange?.(n,x)},slots:{textField:At,openPickerButton:n=>se(Ye,{...n,size:y.size})},slotProps:{textField:n=>({variant:"outlined",...n,error:!!P,...y,inputProps:{...n.inputProps,placeholder:g||n.inputProps?.placeholder},InputProps:{...n.InputProps,inputRef:x=>{w.ref(x),typeof n.inputRef=="function"&&n.inputRef(x)}}})}},a),se(V,{name:a,disableIcon:h,control:m})]})})},Nt=Gt(qt);import{Autocomplete as Ht,Grid as xe,TextField as Wt}from"@mui/material";import{colorPalette as Yt}from"@s_mart/tokens";import{memo as jt}from"react";import{Controller as Jt,useFormContext as Kt}from"react-hook-form";import{jsx as ee,jsxs as Je}from"react/jsx-runtime";import{createElement as Zt}from"react";var Xt=({name:e,defaultValue:o,rules:i,shouldUnregister:a,label:p,required:F,noOptionsText:S,placeholder:c,onInputChange:g,onChange:C,disableIconError:h,...y})=>{let d=Kt();if(!d)throw new T("Autocomplete");let m=L(d.formState.errors,e);return console.warn=()=>{},ee(Jt,{name:e,control:d.control,defaultValue:o,rules:i,shouldUnregister:a,render:({field:u})=>Je(xe,{sx:{display:"flex",flexDirection:"column"},children:[p&&ee(k,{label:p,required:F}),ee(Ht,{onChange:(P,l)=>{u.onChange(l),C?.(l,d.getValues())},onInputChange:(P,l,b)=>{b==="input"&&(u.onChange(l),setTimeout(()=>{g?.(l,d.getValues())},0))},slotProps:{...y.slotProps||{},paper:{...y.slotProps?.paper||{},sx:{border:`1px solid ${Yt.neutral[30]}`,boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.15)"}}},isOptionEqualToValue:(P,l)=>P.value===l.value,renderOption:(P,l)=>Zt("li",{...P,key:l.key||l.value,onClick:b=>{P.onClick?.(b),u.onChange(l)}},Je(xe,{container:!0,direction:"column",children:[ee(xe,{item:!0,children:l.label}),l.afterLabel&&ee(xe,{item:!0,children:l.afterLabel})]})),value:u.value||null,readOnly:y.disabled,noOptionsText:S||"Nenhuma op\xE7\xE3o encontrada",...y,renderInput:P=>ee(Wt,{placeholder:c,...P,error:!!m,slotProps:{input:{inputProps:P.inputProps,inputRef:u.ref}}})},e),ee(V,{name:e,disableIcon:h,control:d.control})]})})},Qt=jt(Xt);import{Autocomplete as li,Divider as Ke,TextField as ni}from"@mui/material";import{colorPalette as ai}from"@s_mart/tokens";import{isEqual as si}from"lodash-es";import{forwardRef as pi}from"react";import{useController as di,useFormContext as mi,useFormState as ui}from"react-hook-form";import{Tooltip as ei}from"@mui/material";import{LIcon as oi}from"@s_mart/core";import{lineInfoCircle as ri}from"@s_mart/solid-icons";import{jsx as Ce}from"react/jsx-runtime";var ti=({title:e})=>Ce(ei,{title:e,placement:"top",children:Ce("div",{style:{width:"fit-content"},children:Ce(oi,{icon:ri,color:"#757575"})})}),oe=ti;import{memo as ii}from"react";var le=ii;import{Fragment as Pe,jsx as O,jsxs as re}from"react/jsx-runtime";import{createElement as yi}from"react";var fi=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,required:S,options:c,textFieldProps:g,noOptionsText:C,footer:h,multiple:y,info:d,placeholder:m,onChange:u,onInputChange:P,getOptionAfterLabel:l,getOptionLabel:b,getOptionKey:w,...n})=>{let x=mi()?.control,_=p??x;if(!_)throw new T("SearchableV2");let v=ui({control:_,name:e}),r=L(v.errors,e),{field:E}=di({name:e,control:_,rules:o,defaultValue:i,shouldUnregister:a});return re("div",{style:{display:"flex",flexDirection:"column"},children:[re("div",{style:{display:"flex"},children:[F&&O(k,{label:F,required:S}),d&&O(oe,{title:d})]}),O(li,{onChange:(f,s)=>{E.onChange(s),u?.(s)},onInputChange:(f,s,t)=>{t==="input"&&P?.(s)},value:E.value?E.value:y?[]:null,options:c,multiple:y,readOnly:n.disabled,slotProps:{...n.slotProps,paper:{...n.slotProps?.paper,sx:{border:`1px solid ${ai.neutral[30]}`,boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.15)"}},listbox:{component:pi(function(s,t){return re(Pe,{children:[O("ul",{...s,ref:t}),typeof h<"u"?re("div",{...s,children:[O("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:O(Ke,{})}),h()]},"searchable-footer"):null]})})}},noOptionsText:re(Pe,{children:[C||"Nenhuma op\xE7\xE3o encontrada",typeof h<"u"?re(Pe,{children:[O("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:O(Ke,{})}),h()]}):null]}),isOptionEqualToValue:(f,s)=>si(f,s),getOptionLabel:f=>b(f),getOptionKey:f=>w(f),renderOption:typeof l=="function"?(f,s)=>{let t=l(s),G=w(s);return yi("li",{...f,key:G},re("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[O("span",{children:b(s)}),typeof t=="string"?O("span",{children:t}):t]}))}:void 0,...n,renderInput:f=>O(ni,{error:!!r,placeholder:m,...f,...g,inputRef:E.ref})},e),O(V,{name:e,control:_})]})},ci=le(fi);import{useState as bi}from"react";import{useController as vi,useFormContext as gi,useFormState as hi}from"react-hook-form";import{IconButton as Ci,LIcon as Pi}from"@s_mart/core";import{lineTimes as Ti}from"@s_mart/regular-icons";import{colorPalette as Si}from"@s_mart/tokens";import{Select as ki,MenuItem as Ii,Divider as wi}from"@mui/material";import{colorPalette as xi}from"@s_mart/tokens";import{jsx as Fi}from"react/jsx-runtime";var Xe=({value:e,placeholder:o,getOptionLabel:i})=>e===null||e?.length===0?Fi("p",{style:{color:xi.neutral[100]},children:o}):i(e);import{Fragment as Ai,jsx as q,jsxs as te}from"react/jsx-runtime";var Vi=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,required:S,options:c,placeholder:g,clearable:C,info:h,footer:y,onChange:d,variant:m="outlined",getOptionKey:u,getOptionLabel:P,getOptionAfterLabel:l,getOptionIcon:b,...w})=>{let n=gi()?.control,x=p??n,[_,v]=bi(!1);if(!x)throw new T("SelectV2");let r=hi({control:x,name:e}),E=L(r.errors,e),{field:f}=vi({control:x,name:e,rules:o,defaultValue:i,shouldUnregister:a});return te("div",{style:{display:"flex",flexDirection:"column"},children:[te("div",{style:{display:"flex"},children:[F&&q(k,{label:F,required:S}),h&&q(oe,{title:h})]}),te(ki,{open:_,onOpen:()=>v(!0),onClose:()=>v(!1),displayEmpty:!!g,variant:m,autoComplete:"off",value:f.value||null,renderValue:s=>q(Xe,{getOptionLabel:P,placeholder:g,value:s}),onChange:s=>{f.onChange(s.target.value),d?.(s.target.value)},error:!!E,size:w.size||"medium",inputRef:f.ref,...w,endAdornment:te(Ai,{children:[w.endAdornment,!!(C&&f.value)&&q(Ci,{variant:"text",color:"neutral",size:"small",sx:{borderRadius:"50%",position:"absolute",right:"2rem"},style:{padding:0},"aria-label":"Limpar",title:"Limpar",onClick:()=>{f.onChange(null),d?.(null)},children:q(Pi,{icon:Ti,color:Si.neutral[100],size:"25px",removeMargin:!0})})]}),children:[c.map(s=>{let t=u(s),G=P(s),j=b?.(s);return q(Ii,{value:s,children:te("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[j!==void 0?te("div",{style:{display:"flex",alignItems:"center"},children:[j,G]}):G,q("span",{children:l?.(s)??null})]})},t)}),y!==void 0&&te("div",{children:[q("div",{style:{padding:"8px 16px"},children:q(wi,{})},"footer-divider"),q("div",{children:y({closeSelect:()=>v(!1)})},"footer-content")]},"footer")]},e),q(V,{name:e,control:x})]})},Ri=le(Vi);import{forwardRef as Ei,useCallback as Di,useState as $i}from"react";import{useController as Mi,useFormContext as Gi,useFormState as zi}from"react-hook-form";import{isObject as _i,isEmpty as Oi,isEqual as qi}from"lodash-es";import{Autocomplete as Ni,TextField as Ui,Divider as eo}from"@mui/material";import{LIcon as Te,Button as Hi}from"@s_mart/core";import{colorPalette as Wi}from"@s_mart/tokens";import{linePlus as oo,linePen as Yi}from"@s_mart/solid-icons";import{toRem as ro}from"@s_mart/utils";import{css as Bi,styled as Li}from"@mui/material";import{toRem as Fe}from"@s_mart/utils";import"@mui/system";var Qe=Bi`
|
|
73
73
|
display: flex;
|
|
74
74
|
align-items: center;
|
|
75
75
|
justify-content: center;
|
|
76
|
-
`,Ze=
|
|
76
|
+
`,Ze=Li("div")`
|
|
77
77
|
display: flex;
|
|
78
78
|
|
|
79
79
|
div.endAdornments {
|
|
@@ -98,7 +98,7 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
98
98
|
|
|
99
99
|
.divider {
|
|
100
100
|
width: 1px;
|
|
101
|
-
height: ${
|
|
101
|
+
height: ${Fe(20)};
|
|
102
102
|
background-color: ${({theme:e})=>e.palette.grey[400]};
|
|
103
103
|
}
|
|
104
104
|
|
|
@@ -109,9 +109,9 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
109
109
|
color: ${({theme:e})=>e.palette.grey[600]};
|
|
110
110
|
border-radius: 50%;
|
|
111
111
|
|
|
112
|
-
margin: 0 ${
|
|
113
|
-
width: ${
|
|
114
|
-
height: ${
|
|
112
|
+
margin: 0 ${Fe(6)};
|
|
113
|
+
width: ${Fe(28)};
|
|
114
|
+
height: ${Fe(28)};
|
|
115
115
|
|
|
116
116
|
&:hover {
|
|
117
117
|
cursor: pointer;
|
|
@@ -120,4 +120,4 @@ import{FormProvider as io}from"react-hook-form";import{jsx as ke}from"react/jsx-
|
|
|
120
120
|
}
|
|
121
121
|
}
|
|
122
122
|
}
|
|
123
|
-
`;import{Fragment as Se,jsx as
|
|
123
|
+
`;import{Fragment as Se,jsx as $,jsxs as N}from"react/jsx-runtime";import{createElement as Ki}from"react";var ji=({name:e,rules:o,defaultValue:i,shouldUnregister:a,control:p,label:F,required:S,options:c,footer:g,showCreatableButton:C=!0,showEditableButton:h,onEditOption:y,onCreateOption:d,getOptionKey:m,getOptionLabel:u,getOptionAfterLabel:P,textFieldProps:l,multiple:b,info:w,noOptionsText:n,onChange:x,onInputChange:_,placeholder:v,...r})=>{let[E,f]=$i(""),s=Gi()?.control,t=p??s;if(!t)throw new T("CreatableV2");let G=zi({control:t,name:e}),j=L(G.errors,e),ne=!C||r.disabled,{field:R}=Mi({name:e,control:t,rules:o,defaultValue:i,shouldUnregister:a}),I=B=>{let D=0;return l?.InputProps||(D+=2.5),ne||(D+=2.56,ie(B)&&(D+=2.56)),!r.disableClearable&&!r.disabled&&(D+=1.3),`${D}rem`},ie=B=>r.disabled?!1:h&&_i(B)&&!Oi(B),to=()=>r.disabled?!1:C,ke=Di(()=>{typeof d<"u"&&(d(E),f(""))},[E,d]),io=B=>{y?.(B)};return N("div",{style:{display:"flex",flexDirection:"column"},children:[N("div",{style:{display:"flex"},children:[F&&$(k,{label:F,required:S}),w&&$(oe,{title:w})]}),$(Ze,{children:$(Ni,{fullWidth:!0,onChange:(B,D)=>{f(""),R.onChange(D),x?.(D)},onInputChange:(B,D,K)=>{K==="input"&&(f(D),_?.(D))},slotProps:{...r.slotProps,paper:{...r.slotProps?.paper,sx:{border:`1px solid ${Wi.neutral[30]}`,boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.15)"}},listbox:{component:Ei(function(D,K){return N(Se,{children:[$("ul",{...D,ref:K}),typeof g<"u"?N("div",{...D,children:[$("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:$(eo,{})}),g()]},"creatable-footer"):null]})})}},value:R.value?R.value:b?[]:null,options:c,multiple:b,readOnly:r.disabled,noOptionsText:N(Se,{children:[n||"Nenhuma op\xE7\xE3o encontrada",!ne&&N(Hi,{sx:{justifyContent:"flex-start",padding:`${ro(6)} ${ro(-16)}`,margin:0},fullWidth:!0,onClick:ke,variant:"text",startIcon:$(Te,{icon:oo}),children:["Adicionar ",`"${E}"`]}),typeof g<"u"&&N(Se,{children:[$("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:$(eo,{})}),g()]})]}),isOptionEqualToValue:(B,D)=>qi(B,D),getOptionLabel:B=>u(B),getOptionKey:B=>m(B),renderOption:typeof P=="function"?(B,D)=>{let K=P(D),lo=m(D);return Ki("li",{...B,key:lo},N("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[$("span",{children:u(D)}),typeof K=="string"?$("span",{children:K}):K]}))}:void 0,...r,sx:{"& div.MuiInputBase-root":{paddingRight:`${I(R.value)} !important`},...r.sx},onBlur:B=>{r?.onBlur?.(B),f("")},renderInput:B=>$(Ui,{placeholder:v,...B,error:!!j,...l,slotProps:{input:{...B.InputProps,...l?.InputProps,inputRef:R.ref,endAdornment:N("div",{className:"endAdornments",children:[B.InputProps.endAdornment,l?.InputProps?.endAdornment??null,ie(R.value)?N("div",{className:"editable",children:[$("div",{className:"divider"}),$("div",{className:"button",onClick:()=>io(R.value),children:$(Te,{icon:Yi,size:"24px",removeMargin:!0})})]}):null,to()&&N("div",{className:"creatable",children:[$("div",{className:"divider"}),$("div",{className:"button",onClick:ke,children:$(Te,{icon:oo,size:"24px",removeMargin:!0})})]})]})}}})},e)}),$(V,{name:e,control:t})]})},Ji=le(ji);export{Qt as Autocomplete,Br as Checkbox,kr as Creatable,Ji as CreatableV2,Pt as DatePicker,k as FieldLabel,co as Form,be as FormProvider,Wr as RadioButton,Qr as RadioGroup,pr as Searchable,ci as SearchableV2,Xo as Select,Ri as SelectV2,it as Slider,_r as Switch,Mo as TextField,Nt as TimePicker,ve as useForm};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@s_mart/form",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.2.0-beta.0",
|
|
4
4
|
"main": "./dist/index.mjs",
|
|
5
5
|
"module": "./dist/index.mjs",
|
|
6
6
|
"types": "./dist/index.d.mts",
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
"@hookform/resolvers": "^3.1.0",
|
|
14
14
|
"lodash-es": "^4.17.21",
|
|
15
15
|
"tsup": "8.0.2",
|
|
16
|
-
"@s_mart/regular-icons": "6.0.
|
|
17
|
-
"@s_mart/solid-icons": "6.0.
|
|
16
|
+
"@s_mart/regular-icons": "6.0.9",
|
|
17
|
+
"@s_mart/solid-icons": "6.0.6"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"@emotion/react": "^11.11.4",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"react-hook-form": "^7.51.0",
|
|
33
33
|
"typescript": ">=5.4.2",
|
|
34
34
|
"zod": "^3.22.4",
|
|
35
|
-
"@s_mart/core": "9.1.
|
|
35
|
+
"@s_mart/core": "9.1.5-beta.0",
|
|
36
36
|
"@s_mart/masks": "5.2.0",
|
|
37
37
|
"@s_mart/rules": "5.1.1",
|
|
38
38
|
"@s_mart/tokens": "5.1.1",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"@types/react-dom": ">=18.3.1",
|
|
51
51
|
"dayjs": "^1.11.10",
|
|
52
52
|
"typescript": ">=5.4.2",
|
|
53
|
-
"@s_mart/core": "9.1.
|
|
53
|
+
"@s_mart/core": "9.1.5-beta.0",
|
|
54
54
|
"@s_mart/masks": "5.2.0",
|
|
55
55
|
"@s_mart/rules": "5.1.1",
|
|
56
56
|
"@s_mart/tokens": "5.1.1",
|