@s_mart/form 10.0.0-beta.22 → 10.0.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 +1 -1
- package/dist/index.mjs +11 -29
- package/package.json +11 -11
package/dist/index.d.mts
CHANGED
|
@@ -74,7 +74,7 @@ type CreatableV2Props<FieldValue, Multiple extends boolean | undefined = undefin
|
|
|
74
74
|
* @type {(value: FieldValue) => Promise<void> | void}
|
|
75
75
|
* @memberof CreatableV2Props
|
|
76
76
|
*/
|
|
77
|
-
onEditOption?: (value: FieldValue) => Promise<void> | void;
|
|
77
|
+
onEditOption?: (value: NonNullable<AutocompleteValue<FieldValue, Multiple, false, false>>) => Promise<void> | void;
|
|
78
78
|
/**
|
|
79
79
|
* Componente que renderiza no footer do searchable (opcional)
|
|
80
80
|
* @example
|
package/dist/index.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import{useController as
|
|
1
|
+
import{useController as _e,useFormContext as Ke}from"react-hook-form";import{Checkbox as We,FormControlLabel as Ye}from"@mui/material";import{Indicator as Oe}from"@s_mart/core";import{useFormState as $e}from"react-hook-form";var L=(e,o)=>o.replace(/[[\]]/g,"").split(".").reduce((l,n)=>l?.[n],e);import{jsx as qe}from"react/jsx-runtime";var ze=({name:e,disableIcon:o,control:t})=>{let l=$e({control:t,name:e}),n=L(l?.errors,e);return n?qe(Oe,{severity:"error",icon:o?!1:void 0,children:n?.message}):null},v=ze;import{Typography as me}from"@mui/material";import{toRem as He}from"@s_mart/utils";import{jsx as ue,jsxs as Ne}from"react/jsx-runtime";var Ge=({label:e,required:o,regular:t})=>Ne("span",{style:{display:"flex",alignItems:"center",gap:He(2)},children:[ue(me,{variant:"caption",style:{display:"flex",alignItems:"center"},sx:{fontWeight:t?400:700},children:e}),o&&ue(me,{variant:"caption",color:"error",sx:{fontWeight:900},children:"*"})]}),x=Ge;var P=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{memo as Ue}from"react";var w=Ue;import{jsx as Q,jsxs as Qe}from"react/jsx-runtime";var Je=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,label:f,labelPlacement:c,required:m,disableIconError:h,onChange:i,...V})=>{let p=Ke()?.control,d=n??p;if(!d)throw new P("Checkbox");let{field:s}=_e({control:d,name:e,rules:o,defaultValue:t,shouldUnregister:l});return Qe("span",{children:[Q(Ye,{control:Q(We,{checked:!!s.value,value:s.value??"",defaultValue:s.value,onChange:(a,S)=>{s.onChange(a,S),i?.(a,S)},...V},e),label:Q(x,{label:f,required:m,regular:!0}),labelPlacement:c||"end"}),Q(v,{name:e,disableIcon:h,control:d})]})},Xe=w(Je);import{forwardRef as io,useCallback as X,useState as no}from"react";import{useController as ao,useFormContext as so,useFormState as po}from"react-hook-form";import mo from"lodash-es/isObject";import uo from"lodash-es/isEmpty";import fo from"lodash-es/isEqual";import{Autocomplete as co,TextField as Fo,Divider as Fe,Button as yo,IconButton as ye}from"@mui/material";import{LIcon as te}from"@s_mart/core";import{linePlus as xe,linePen as xo}from"@s_mart/solid-icons";import{toRem as Pe}from"@s_mart/utils";import{css as Ze,styled as je}from"@mui/material";import{toRem as eo}from"@s_mart/utils";var fe=Ze`
|
|
2
2
|
display: flex;
|
|
3
3
|
align-items: center;
|
|
4
4
|
justify-content: center;
|
|
5
|
-
`,ce=
|
|
5
|
+
`,ce=je("div")`
|
|
6
6
|
display: flex;
|
|
7
7
|
|
|
8
8
|
div.endAdornments {
|
|
@@ -27,44 +27,26 @@ import{useController as Ge,useFormContext as Ne}from"react-hook-form";import{Che
|
|
|
27
27
|
|
|
28
28
|
.divider {
|
|
29
29
|
width: 1px;
|
|
30
|
-
height: ${
|
|
30
|
+
height: ${eo(20)};
|
|
31
31
|
background-color: ${({theme:e})=>e.palette.grey[400]};
|
|
32
32
|
}
|
|
33
|
-
|
|
34
|
-
.button {
|
|
35
|
-
display: flex;
|
|
36
|
-
justify-content: center;
|
|
37
|
-
align-items: center;
|
|
38
|
-
color: ${({theme:e})=>e.palette.grey[600]};
|
|
39
|
-
border-radius: 50%;
|
|
40
|
-
|
|
41
|
-
margin: 0 ${Q(6)};
|
|
42
|
-
width: ${Q(28)};
|
|
43
|
-
height: ${Q(28)};
|
|
44
|
-
|
|
45
|
-
&:hover {
|
|
46
|
-
cursor: pointer;
|
|
47
|
-
background-color: ${({theme:e})=>e.palette.grey[100]};
|
|
48
|
-
transition: background-color 0.2s ease-in-out;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
33
|
}
|
|
52
|
-
`;import{Tooltip as
|
|
34
|
+
`;import{Tooltip as oo}from"@mui/material";import{LIcon as to}from"@s_mart/core";import{lineInfoCircle as ro}from"@s_mart/solid-icons";import{jsx as oe}from"react/jsx-runtime";var lo=({title:e})=>oe(oo,{title:e,placement:"top",children:oe("div",{style:{width:"fit-content"},children:oe(to,{icon:ro,color:"#757575"})})}),_=lo;import{Fragment as re,jsx as C,jsxs as D}from"react/jsx-runtime";import{createElement as bo}from"react";function Po(e){let{name:o,rules:t,defaultValue:l,shouldUnregister:n,control:f,label:c,required:m,options:h,footer:i,showCreatableButton:V=!0,showEditableButton:p,onEditOption:d,onCreateOption:s,getOptionKey:a,getOptionLabel:S,getOptionAfterLabel:F,multiple:k,info:T,noOptionsText:O="Nenhuma op\xE7\xE3o encontrada",onChange:$,onInputChange:M,placeholder:z,...y}=e,[N,R]=no(""),u=so()?.control,r=f??u;if(!r)throw new P("CreatableV2");let b=po({control:r,name:o}),E=L(b.errors,o),K=!V||y.disabled,{field:U}=ao({name:o,control:r,rules:t,defaultValue:l,shouldUnregister:n}),Ee=I=>{let g=0;return e.slotProps?.textField?.slotProps?.input||(g+=2.5),K||(g+=2.56,pe(I)&&(g+=2.56)),!y.disableClearable&&!y.disabled&&(g+=1.3),`${g}rem`},pe=I=>y.disabled?!1:p&&mo(I)&&!uo(I),Le=()=>y.disabled?!1:V,de=X(()=>{typeof s<"u"&&(s(N),R(""))},[N,s]),we=X(()=>{d?.(U.value)},[U.value,d]),Re=X((I,g,W)=>{W==="input"&&(R(g),M?.(g))},[M]),Be=X((I,g)=>{R(""),U.onChange(g),$?.(g)},[U.onChange,$]),Me=X(I=>{y?.onBlur?.(I),R("")},[y?.onBlur]),De=U.value?U.value:k?[]:null;return D("div",{style:{display:"flex",flexDirection:"column"},children:[D("div",{style:{display:"flex"},children:[c&&C(x,{label:c,required:m}),T&&C(_,{title:T})]}),C(ce,{children:C(co,{fullWidth:!0,onChange:Be,onInputChange:Re,onBlur:Me,slotProps:{...y.slotProps,listbox:{component:io(function(g,W){return D(re,{children:[C("ul",{...g,ref:W}),typeof i<"u"?D("div",{...g,children:[C("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:C(Fe,{})}),i()]},"creatable-footer"):null]})})}},value:De,options:h,multiple:k,readOnly:y.disabled,noOptionsText:D(re,{children:[O,!K&&D(yo,{sx:{justifyContent:"flex-start",padding:`${Pe(6)} ${Pe(-16)}`,margin:0},fullWidth:!0,onClick:de,variant:"text",startIcon:C(te,{icon:xe}),children:["Adicionar ",`"${N}"`]}),typeof i<"u"&&D(re,{children:[C("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:C(Fe,{})}),i()]})]}),isOptionEqualToValue:(I,g)=>fo(I,g),getOptionLabel:S,getOptionKey:a,renderOption:typeof F=="function"?(I,g)=>{let W=F(g),Ae=a(g);return bo("li",{...I,key:Ae},D("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[C("span",{children:S(g)}),typeof W=="string"?C("span",{children:W}):W]}))}:void 0,...y,sx:{"& div.MuiInputBase-root":{paddingRight:`${Ee(U.value)} !important`},...y.sx},renderInput:I=>C(Fo,{placeholder:z,...I,error:!!E,...e.slotProps?.textField,slotProps:{input:{...I.InputProps,...e.slotProps?.textField?.slotProps?.input,inputRef:U.ref,endAdornment:D("div",{className:"endAdornments",children:[I.InputProps.endAdornment,e.slotProps?.textField?.slotProps?.input?.endAdornment??null,pe(U.value)?D("div",{className:"editable",children:[C("div",{className:"divider"}),C(ye,{size:"small",onClick:we,sx:{mx:"3px"},children:C(te,{icon:xo,size:"24px",removeMargin:!0})})]}):null,Le()&&D("div",{className:"creatable",children:[C("div",{className:"divider"}),C(ye,{size:"small",onClick:de,sx:{mx:"3px"},children:C(te,{icon:xe,size:"24px",removeMargin:!0})})]})]})}}})},o)}),C(v,{name:o,control:r})]})}var ho=w(Po);import{Stack as So}from"@mui/material";import{AdapterDayjs as To}from"@mui/x-date-pickers/AdapterDayjs";import{DatePicker as Io}from"@mui/x-date-pickers";import{LocalizationProvider as ko}from"@mui/x-date-pickers/LocalizationProvider";import{ptBR as Eo}from"@mui/x-date-pickers/locales";import{composeValidators as Lo,date as be}from"@s_mart/rules";import{useController as wo,useFormContext as Ro,useFormState as Bo}from"react-hook-form";import{IconButton as go,styled as vo}from"@mui/material";import{toRem as q}from"@s_mart/utils";var Co=e=>{switch(e){case"small":return q(16);case"large":return q(24);default:return q(20)}},Vo=e=>{switch(e){case"small":return`${q(2)} ${q(8)}`;case"large":return`${q(10)}`;default:return`${q(6)} ${q(8)}`}},he=vo(go)`
|
|
53
35
|
margin: 0px;
|
|
54
36
|
|
|
55
|
-
padding: ${({size:e})=>
|
|
56
|
-
border-radius: 0 ${
|
|
37
|
+
padding: ${({size:e})=>Vo(e)};
|
|
38
|
+
border-radius: 0 ${q(4)} ${q(4)} 0;
|
|
57
39
|
|
|
58
40
|
svg {
|
|
59
|
-
width: ${({size:e})=>
|
|
41
|
+
width: ${({size:e})=>Co(e)} !important;
|
|
60
42
|
}
|
|
61
|
-
`;import"dayjs/locale/pt-br";import{jsx as le,jsxs as Do}from"react/jsx-runtime";import{createElement as Ro}from"react";var Lo=({rules:e,name:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,disabled:d,disableIconError:h,...i})=>{let V=Io()?.control,p=n??V;if(!p)throw new x("DatePicker");let m=wo({control:p,name:o}),s=L(m.errors,o),a=i?.format||"DD/MM/YYYY",S=e?To([he(a),e]):he(a),{field:F}=ko({control:p,name:o,rules:S,defaultValue:t,shouldUnregister:l});return le(Vo,{dateAdapter:vo,localeText:So.components.MuiLocalizationProvider.defaultProps.localeText,children:Do(go,{children:[f&&le(P,{label:f,required:c}),Ro(Co,{...i,key:o,value:F.value??null,format:a,onChange:(I,T)=>{F.onChange(I,T),i?.onChange?.(I,T)},disabled:d,enableAccessibleFieldDOMStructure:!1,slots:{openPickerButton:xe},slotProps:{...i?.slotProps,textField:{error:!!s,...i.slotProps?.textField,inputRef:F.ref}}}),le(v,{name:o,disableIcon:h,control:p})]})})},Eo=E(Lo);import{FormProvider as Bo}from"react-hook-form";import{jsx as be}from"react/jsx-runtime";function Mo({children:e,style:o,onSubmit:t,...l}){return be(Bo,{...l,children:be("form",{onSubmit:n=>{n.preventDefault(),n.stopPropagation(),t(n)},style:o,children:e})})}var ie=Mo;import{useEffect as Ao}from"react";import{useForm as Oo}from"react-hook-form";import{zodResolver as $o}from"@hookform/resolvers/zod";var zo=({disableDefaultValuesUpdate:e,onSubmit:o,...t})=>{let l=Oo({...t,resolver:t.schema&&$o(t.schema)});return Ao(()=>{e||l.reset(t.defaultValues)},[t.defaultValues,l.reset]),{...l,onSubmit:l.handleSubmit(n=>o(n,l))}},ne=zo;import{jsx as No}from"react/jsx-runtime";function qo({children:e,style:o,...t}){let l=ne(t);return No(ie,{...l,style:o,children:typeof e=="function"?e(l):e})}var Go=qo;import{RadioGroup as Uo,Stack as Ho}from"@mui/material";import{useController as _o,useFormContext as Ko}from"react-hook-form";import{jsx as ae,jsxs as Jo}from"react/jsx-runtime";var Wo=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,children:d,orientation:h="row",disableIconError:i,...V})=>{let p=Ko()?.control,m=n??p;if(!m)throw new x("RadioGroup");let{field:s}=_o({control:m,name:e,rules:o,defaultValue:t,shouldUnregister:l});return Jo(Ho,{children:[f&&ae(P,{label:f,required:c}),ae(Uo,{value:s.value||"",name:e,...V,onChange:a=>{V?.onChange?.(a,a.target?.value),s.onChange(a)},style:{display:"flex",flexDirection:h},children:d},e),ae(v,{name:e,disableIcon:i,control:m})]})},Yo=Wo;import{FormControlLabel as Xo,Grid as Qo,Radio as Zo}from"@mui/material";import{jsx as Z}from"react/jsx-runtime";var jo=({label:e,labelPlacement:o,...t})=>Z(Qo,{sx:{display:"flex",flexDirection:"column"},children:Z(Xo,{control:Z(Zo,{...t}),label:Z(P,{label:e}),labelPlacement:o||"end"})}),et=jo;import{Autocomplete as ot,Divider as ge,TextField as tt}from"@mui/material";import rt from"lodash-es/isEqual";import{forwardRef as lt}from"react";import{useController as it,useFormContext as nt,useFormState as at}from"react-hook-form";import{Fragment as se,jsx as D,jsxs as Y}from"react/jsx-runtime";import{createElement as dt}from"react";var st=e=>{let{name:o,rules:t,defaultValue:l,shouldUnregister:n,control:f,label:c,required:d,options:h,textFieldProps:i,noOptionsText:V,footer:p,multiple:m,info:s,placeholder:a,onChange:S,onInputChange:F,getOptionAfterLabel:I,getOptionLabel:T,getOptionKey:A,...N}=e,O=nt()?.control,$=f??O;if(!$)throw new x("SearchableV2");let y=at({control:$,name:o}),U=L(y.errors,o),{field:R}=it({name:o,control:$,rules:t,defaultValue:l,shouldUnregister:n}),u=R.value?R.value:m?[]:null;return Y("div",{style:{display:"flex",flexDirection:"column"},children:[Y("div",{style:{display:"flex"},children:[c&&D(P,{label:c,required:d}),s&&D(H,{title:s})]}),D(ot,{onChange:(r,b)=>{R.onChange(b),S?.(b)},onInputChange:(r,b,w)=>{w==="input"&&F?.(b)},value:u,options:h,multiple:m,readOnly:N.disabled,slotProps:{...N.slotProps,listbox:{component:lt(function(b,w){return Y(se,{children:[D("ul",{...b,ref:w}),typeof p<"u"?Y("div",{...b,children:[D("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:D(ge,{})}),p()]},"searchable-footer"):null]})})}},noOptionsText:Y(se,{children:[V||"Nenhuma op\xE7\xE3o encontrada",typeof p<"u"?Y(se,{children:[D("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:D(ge,{})}),p()]}):null]}),isOptionEqualToValue:(r,b)=>rt(r,b),getOptionLabel:T,getOptionKey:A,renderOption:typeof I=="function"?(r,b)=>{let w=I(b),_=A(b);return dt("li",{...r,key:_},Y("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[D("span",{children:T(b)}),typeof w=="string"?D("span",{children:w}):w]}))}:void 0,...N,renderInput:r=>D(tt,{error:!!U,placeholder:a,...r,...i,inputRef:R.ref})},o),D(v,{name:o,control:$})]})},pt=E(st);import{useState as ft}from"react";import{useController as ct,useFormContext as Ft,useFormState as yt}from"react-hook-form";import{IconButton as Pt,LIcon as xt}from"@s_mart/core";import{lineTimes as ht}from"@s_mart/regular-icons";import{colorPalette as bt}from"@s_mart/tokens";import{Select as gt,MenuItem as vt,Divider as Ct}from"@mui/material";import{colorPalette as mt}from"@s_mart/tokens";import{jsx as ut}from"react/jsx-runtime";var ve=({value:e,placeholder:o,getOptionLabel:t})=>e===null||e?.length===0?ut("p",{style:{color:mt.neutral[100]},children:o}):t(e);import{Fragment as Tt,jsx as M,jsxs as J}from"react/jsx-runtime";var Vt=e=>{let{name:o,rules:t,defaultValue:l,shouldUnregister:n,control:f,label:c,required:d,options:h,placeholder:i,clearable:V,info:p,footer:m,onChange:s,variant:a="outlined",getOptionKey:S,getOptionLabel:F,getOptionAfterLabel:I,getOptionIcon:T,...A}=e,N=Ft()?.control,O=f??N,[$,y]=ft(!1);if(!O)throw new x("SelectV2");let U=yt({control:O,name:o}),R=L(U.errors,o),{field:u}=ct({control:O,name:o,rules:t,defaultValue:l,shouldUnregister:n});return J("div",{style:{display:"flex",flexDirection:"column"},children:[J("div",{style:{display:"flex"},children:[c&&M(P,{label:c,required:d}),p&&M(H,{title:p})]}),J(gt,{open:$,onOpen:()=>y(!0),onClose:()=>y(!1),displayEmpty:!!i,variant:a,autoComplete:"off",value:u.value||null,renderValue:r=>M(ve,{getOptionLabel:F,placeholder:i,value:r}),onChange:r=>{console.log(r),u.onChange(r.target.value),s?.(r.target.value)},error:!!R,size:A.size||"medium",inputRef:u.ref,...A,endAdornment:J(Tt,{children:[A.endAdornment,!!(V&&u.value)&&M(Pt,{variant:"text",color:"neutral",size:"small",sx:{borderRadius:"50%",position:"absolute",right:"2rem"},style:{padding:0},"aria-label":"Limpar",title:"Limpar",onClick:()=>{u.onChange(null),s?.(null)},children:M(xt,{icon:ht,color:bt.neutral[100],size:"25px",removeMargin:!0})})]}),children:[h.map(r=>{let b=S(r),w=F(r),_=T?.(r);return M(vt,{value:r,children:J("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[_!==void 0?J("div",{style:{display:"flex",alignItems:"center"},children:[_,w]}):w,M("span",{children:I?.(r)??null})]})},b)}),m!==void 0&&J("div",{children:[M("div",{style:{padding:"8px 16px"},children:M(Ct,{})},"footer-divider"),M("div",{children:m({closeSelect:()=>y(!1)})},"footer-content")]},"footer")]},o),M(v,{name:o,control:O})]})},St=E(Vt);import{useController as kt,useFormContext as It}from"react-hook-form";import{Slider as wt}from"@mui/material";import{jsx as Rt}from"react/jsx-runtime";var Lt=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,...f})=>{let c=It()?.control,d=n??c;if(!d)throw new x("Slider");let{field:h}=kt({control:d,name:e,rules:o,defaultValue:t,shouldUnregister:l});return Rt(wt,{value:h.value||f?.min||0,onChange:h.onChange,valueLabelDisplay:"auto",...f},e)},Et=Lt;import{FormControlLabel as Dt,Stack as Bt,Switch as Mt}from"@mui/material";import{useController as At,useFormContext as Ot}from"react-hook-form";import{useCallback as $t}from"react";import{jsx as j,jsxs as Gt}from"react/jsx-runtime";var zt=({name:e,rules:o,defaultValue:t,defaultChecked:l,shouldUnregister:n,control:f,label:c,labelPlacement:d="end",disableIconError:h,onChange:i,...V})=>{let p=Ot()?.control,m=f??p;if(!m)throw new x("Switch");let{field:s}=At({control:m,name:e,rules:o,defaultValue:l??t??!1,shouldUnregister:n}),a=$t((S,F)=>{s.onChange(F),i?.(S,F)},[s,i]);return Gt(Bt,{children:[j(Dt,{control:j(Mt,{...V,...s,checked:!!s.value,onChange:a}),label:j(P,{label:c}),labelPlacement:d}),j(v,{name:e,disableIcon:h,control:m})]})},qt=zt;import{InputAdornment as Nt,Stack as Ut,TextField as Ht,Tooltip as _t}from"@mui/material";import{LIcon as Ce}from"@s_mart/core";import*as Ve from"@s_mart/masks";import{lineEye as Kt,lineEyeSlash as Wt,lineInfoCircle as Yt}from"@s_mart/solid-icons";import{useRef as Jt,useState as Xt}from"react";import{useController as Qt,useFormContext as Zt,useFormState as jt}from"react-hook-form";import{jsx as q,jsxs as Se}from"react/jsx-runtime";var er=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,mask:d,variant:h="outlined",info:i,parse:V,format:p,onInputChange:m,disableIconError:s,...a})=>{let S=Zt()?.control,F=n??S,I=Jt(t||void 0);if(!F)throw new x("TextField");let[T,A]=Xt(!1),N=u=>{let r=u;return r=p?.(u)??u,d?Ve?.[d]?.format(r):r},O=u=>{let r=u;return r=V?.(u)??r,d?Ve?.[d]?.parse(r,I.current):r},$=u=>{if(!u||d!=="porcentagem"&&d!=="porcentagem0")return;u?.stopPropagation();let r=(u?.target).value;if(r){let b=String(r);if(b.length>0){let w=b.indexOf("%");w>-1&&(u.currentTarget.selectionEnd=w)}}},{field:y}=Qt({control:F,name:e,rules:o,defaultValue:t,shouldUnregister:l}),U=jt({control:F,name:e}),R=L(U.errors,e);return Se(Ut,{children:[Se("div",{style:{display:"flex"},children:[f&&q("div",{children:q(P,{label:f,required:c})}),i&&q("div",{children:q(_t,{title:i,placement:"top",children:q("div",{style:{width:"fit-content"},children:q(Ce,{icon:Yt,color:"#757575"})})})})]}),q(Ht,{variant:h,defaultValue:t,value:N(y.value||(y.value!=0?"":y.value)),onChange:u=>{let r=O(u?.target?.value);y.onChange(r),m?.(r),I.current=u.target.value},error:!!R,...a,type:a.type==="password"?T?"text":"password":a.type,autoComplete:a.autoComplete||"off",slotProps:{input:{onKeyDown:$,inputRef:y.ref,endAdornment:a.type==="password"&&q(Nt,{position:"start",onClick:()=>A(!T),style:{cursor:"pointer"},children:q(Ce,{icon:T?Kt:Wt,size:"24px",removeMargin:!0})}),...a.slotProps?.input}}},e),q(v,{name:e,disableIcon:s,control:F})]})},or=E(er);import{Stack as nr}from"@mui/material";import{AdapterDayjs as ar}from"@mui/x-date-pickers/AdapterDayjs";import{LocalizationProvider as sr}from"@mui/x-date-pickers/LocalizationProvider";import{TimePicker as pr}from"@mui/x-date-pickers/TimePicker";import{composeValidators as dr,time as ke}from"@s_mart/rules";import{useController as mr,useFormContext as ur,useFormState as fr}from"react-hook-form";import{styled as tr}from"@mui/material";import{IconButton as rr}from"@mui/material";import{toRem as G}from"@s_mart/utils";var lr=e=>{switch(e){case"small":return G(16);case"large":return G(24);default:return G(20)}},ir=e=>{switch(e){case"small":return`${G(2)} ${G(8)}`;case"large":return G(10);default:return`${G(6)} ${G(8)}`}},Te=tr(rr)`
|
|
43
|
+
`;import"dayjs/locale/pt-br";import{jsx as le,jsxs as Oo}from"react/jsx-runtime";import{createElement as Ao}from"react";var Mo=({rules:e,name:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,disabled:m,disableIconError:h,...i})=>{let V=Ro()?.control,p=n??V;if(!p)throw new P("DatePicker");let d=Bo({control:p,name:o}),s=L(d.errors,o),a=i?.format||"DD/MM/YYYY",S=e?Lo([be(a),e]):be(a),{field:F}=wo({control:p,name:o,rules:S,defaultValue:t,shouldUnregister:l});return le(ko,{dateAdapter:To,localeText:Eo.components.MuiLocalizationProvider.defaultProps.localeText,children:Oo(So,{children:[f&&le(x,{label:f,required:c}),Ao(Io,{...i,key:o,value:F.value??null,format:a,onChange:(k,T)=>{F.onChange(k,T),i?.onChange?.(k,T)},disabled:m,enableAccessibleFieldDOMStructure:!1,slots:{openPickerButton:he},slotProps:{...i?.slotProps,textField:{error:!!s,...i.slotProps?.textField,inputRef:F.ref}}}),le(v,{name:o,disableIcon:h,control:p})]})})},Do=w(Mo);import{FormProvider as $o}from"react-hook-form";import{jsx as ge}from"react/jsx-runtime";function zo({children:e,style:o,onSubmit:t,...l}){return ge($o,{...l,children:ge("form",{onSubmit:n=>{n.preventDefault(),n.stopPropagation(),t(n)},style:o,children:e})})}var ie=zo;import{useEffect as qo}from"react";import{useForm as Ho}from"react-hook-form";import{zodResolver as Go}from"@hookform/resolvers/zod";var No=({disableDefaultValuesUpdate:e,onSubmit:o,...t})=>{let l=Ho({...t,resolver:t.schema&&Go(t.schema)});return qo(()=>{e||l.reset(t.defaultValues)},[t.defaultValues,l.reset]),{...l,onSubmit:l.handleSubmit(n=>o(n,l))}},ne=No;import{jsx as Ko}from"react/jsx-runtime";function Uo({children:e,style:o,...t}){let l=ne(t);return Ko(ie,{...l,style:o,children:typeof e=="function"?e(l):e})}var _o=Uo;import{RadioGroup as Wo,Stack as Yo}from"@mui/material";import{useController as Jo,useFormContext as Xo}from"react-hook-form";import{jsx as ae,jsxs as jo}from"react/jsx-runtime";var Qo=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,children:m,orientation:h="row",disableIconError:i,...V})=>{let p=Xo()?.control,d=n??p;if(!d)throw new P("RadioGroup");let{field:s}=Jo({control:d,name:e,rules:o,defaultValue:t,shouldUnregister:l});return jo(Yo,{children:[f&&ae(x,{label:f,required:c}),ae(Wo,{value:s.value||"",name:e,...V,onChange:a=>{V?.onChange?.(a,a.target?.value),s.onChange(a)},style:{display:"flex",flexDirection:h},children:m},e),ae(v,{name:e,disableIcon:i,control:d})]})},Zo=Qo;import{FormControlLabel as et,Grid as ot,Radio as tt}from"@mui/material";import{jsx as Z}from"react/jsx-runtime";var rt=({label:e,labelPlacement:o,...t})=>Z(ot,{sx:{display:"flex",flexDirection:"column"},children:Z(et,{control:Z(tt,{...t}),label:Z(x,{label:e}),labelPlacement:o||"end"})}),lt=rt;import{Autocomplete as it,Divider as ve,TextField as nt}from"@mui/material";import at from"lodash-es/isEqual";import{forwardRef as st}from"react";import{useController as pt,useFormContext as dt,useFormState as mt}from"react-hook-form";import{Fragment as se,jsx as B,jsxs as Y}from"react/jsx-runtime";import{createElement as ct}from"react";var ut=e=>{let{name:o,rules:t,defaultValue:l,shouldUnregister:n,control:f,label:c,required:m,options:h,textFieldProps:i,noOptionsText:V,footer:p,multiple:d,info:s,placeholder:a,onChange:S,onInputChange:F,getOptionAfterLabel:k,getOptionLabel:T,getOptionKey:O,...$}=e,M=dt()?.control,z=f??M;if(!z)throw new P("SearchableV2");let y=mt({control:z,name:o}),N=L(y.errors,o),{field:R}=pt({name:o,control:z,rules:t,defaultValue:l,shouldUnregister:n}),u=R.value?R.value:d?[]:null;return Y("div",{style:{display:"flex",flexDirection:"column"},children:[Y("div",{style:{display:"flex"},children:[c&&B(x,{label:c,required:m}),s&&B(_,{title:s})]}),B(it,{onChange:(r,b)=>{R.onChange(b),S?.(b)},onInputChange:(r,b,E)=>{E==="input"&&F?.(b)},value:u,options:h,multiple:d,readOnly:$.disabled,slotProps:{...$.slotProps,listbox:{component:st(function(b,E){return Y(se,{children:[B("ul",{...b,ref:E}),typeof p<"u"?Y("div",{...b,children:[B("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:B(ve,{})}),p()]},"searchable-footer"):null]})})}},noOptionsText:Y(se,{children:[V||"Nenhuma op\xE7\xE3o encontrada",typeof p<"u"?Y(se,{children:[B("div",{style:{paddingTop:"0.5rem",paddingBottom:"0.5rem"},children:B(ve,{})}),p()]}):null]}),isOptionEqualToValue:(r,b)=>at(r,b),getOptionLabel:T,getOptionKey:O,renderOption:typeof k=="function"?(r,b)=>{let E=k(b),K=O(b);return ct("li",{...r,key:K},Y("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[B("span",{children:T(b)}),typeof E=="string"?B("span",{children:E}):E]}))}:void 0,...$,renderInput:r=>B(nt,{error:!!N,placeholder:a,...r,...i,inputRef:R.ref})},o),B(v,{name:o,control:z})]})},ft=w(ut);import{useState as xt}from"react";import{useController as Pt,useFormContext as ht,useFormState as bt}from"react-hook-form";import{IconButton as gt,LIcon as vt}from"@s_mart/core";import{lineTimes as Ct}from"@s_mart/regular-icons";import{colorPalette as Vt}from"@s_mart/tokens";import{Select as St,MenuItem as Tt,Divider as It}from"@mui/material";import{colorPalette as Ft}from"@s_mart/tokens";import{jsx as yt}from"react/jsx-runtime";var Ce=({value:e,placeholder:o,getOptionLabel:t})=>e===null||e?.length===0?yt("p",{style:{color:Ft.neutral[100]},children:o}):t(e);import{Fragment as Lt,jsx as A,jsxs as J}from"react/jsx-runtime";var kt=e=>{let{name:o,rules:t,defaultValue:l,shouldUnregister:n,control:f,label:c,required:m,options:h,placeholder:i,clearable:V,info:p,footer:d,onChange:s,variant:a="outlined",getOptionKey:S,getOptionLabel:F,getOptionAfterLabel:k,getOptionIcon:T,...O}=e,$=ht()?.control,M=f??$,[z,y]=xt(!1);if(!M)throw new P("SelectV2");let N=bt({control:M,name:o}),R=L(N.errors,o),{field:u}=Pt({control:M,name:o,rules:t,defaultValue:l,shouldUnregister:n});return J("div",{style:{display:"flex",flexDirection:"column"},children:[J("div",{style:{display:"flex"},children:[c&&A(x,{label:c,required:m}),p&&A(_,{title:p})]}),J(St,{open:z,onOpen:()=>y(!0),onClose:()=>y(!1),displayEmpty:!!i,variant:a,autoComplete:"off",value:u.value||null,renderValue:r=>A(Ce,{getOptionLabel:F,placeholder:i,value:r}),onChange:r=>{console.log(r),u.onChange(r.target.value),s?.(r.target.value)},error:!!R,size:O.size||"medium",inputRef:u.ref,...O,endAdornment:J(Lt,{children:[O.endAdornment,!!(V&&u.value)&&A(gt,{variant:"text",color:"neutral",size:"small",sx:{borderRadius:"50%",position:"absolute",right:"2rem"},style:{padding:0},"aria-label":"Limpar",title:"Limpar",onClick:()=>{u.onChange(null),s?.(null)},children:A(vt,{icon:Ct,color:Vt.neutral[100],size:"25px",removeMargin:!0})})]}),children:[h.map(r=>{let b=S(r),E=F(r),K=T?.(r);return A(Tt,{value:r,children:J("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[K!==void 0?J("div",{style:{display:"flex",alignItems:"center"},children:[K,E]}):E,A("span",{children:k?.(r)??null})]})},b)}),d!==void 0&&J("div",{children:[A("div",{style:{padding:"8px 16px"},children:A(It,{})},"footer-divider"),A("div",{children:d({closeSelect:()=>y(!1)})},"footer-content")]},"footer")]},o),A(v,{name:o,control:M})]})},Et=w(kt);import{useController as wt,useFormContext as Rt}from"react-hook-form";import{Slider as Bt}from"@mui/material";import{jsx as At}from"react/jsx-runtime";var Mt=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,...f})=>{let c=Rt()?.control,m=n??c;if(!m)throw new P("Slider");let{field:h}=wt({control:m,name:e,rules:o,defaultValue:t,shouldUnregister:l});return At(Bt,{value:h.value||f?.min||0,onChange:h.onChange,valueLabelDisplay:"auto",...f},e)},Dt=Mt;import{FormControlLabel as Ot,Stack as $t,Switch as zt}from"@mui/material";import{useController as qt,useFormContext as Ht}from"react-hook-form";import{useCallback as Gt}from"react";import{jsx as j,jsxs as _t}from"react/jsx-runtime";var Nt=({name:e,rules:o,defaultValue:t,defaultChecked:l,shouldUnregister:n,control:f,label:c,labelPlacement:m="end",disableIconError:h,onChange:i,...V})=>{let p=Ht()?.control,d=f??p;if(!d)throw new P("Switch");let{field:s}=qt({control:d,name:e,rules:o,defaultValue:l??t??!1,shouldUnregister:n}),a=Gt((S,F)=>{s.onChange(F),i?.(S,F)},[s,i]);return _t($t,{children:[j(Ot,{control:j(zt,{...V,...s,checked:!!s.value,onChange:a}),label:j(x,{label:c}),labelPlacement:m}),j(v,{name:e,disableIcon:h,control:d})]})},Ut=Nt;import{InputAdornment as Kt,Stack as Wt,TextField as Yt,Tooltip as Jt}from"@mui/material";import{LIcon as Ve}from"@s_mart/core";import*as Se from"@s_mart/masks";import{lineEye as Xt,lineEyeSlash as Qt,lineInfoCircle as Zt}from"@s_mart/solid-icons";import{useRef as jt,useState as er}from"react";import{useController as or,useFormContext as tr,useFormState as rr}from"react-hook-form";import{jsx as H,jsxs as Te}from"react/jsx-runtime";var lr=({name:e,rules:o,defaultValue:t,shouldUnregister:l,control:n,label:f,required:c,mask:m,variant:h="outlined",info:i,parse:V,format:p,onInputChange:d,disableIconError:s,...a})=>{let S=tr()?.control,F=n??S,k=jt(t||void 0);if(!F)throw new P("TextField");let[T,O]=er(!1),$=u=>{let r=u;return r=p?.(u)??u,m?Se?.[m]?.format(r):r},M=u=>{let r=u;return r=V?.(u)??r,m?Se?.[m]?.parse(r,k.current):r},z=u=>{if(!u||m!=="porcentagem"&&m!=="porcentagem0")return;u?.stopPropagation();let r=(u?.target).value;if(r){let b=String(r);if(b.length>0){let E=b.indexOf("%");E>-1&&(u.currentTarget.selectionEnd=E)}}},{field:y}=or({control:F,name:e,rules:o,defaultValue:t,shouldUnregister:l}),N=rr({control:F,name:e}),R=L(N.errors,e);return Te(Wt,{children:[Te("div",{style:{display:"flex"},children:[f&&H("div",{children:H(x,{label:f,required:c})}),i&&H("div",{children:H(Jt,{title:i,placement:"top",children:H("div",{style:{width:"fit-content"},children:H(Ve,{icon:Zt,color:"#757575"})})})})]}),H(Yt,{variant:h,defaultValue:t,value:$(y.value||(y.value!=0?"":y.value)),onChange:u=>{let r=M(u?.target?.value);y.onChange(r),d?.(r),k.current=u.target.value},error:!!R,...a,type:a.type==="password"?T?"text":"password":a.type,autoComplete:a.autoComplete||"off",slotProps:{input:{onKeyDown:z,inputRef:y.ref,endAdornment:a.type==="password"&&H(Kt,{position:"start",onClick:()=>O(!T),style:{cursor:"pointer"},children:H(Ve,{icon:T?Xt:Qt,size:"24px",removeMargin:!0})}),...a.slotProps?.input}}},e),H(v,{name:e,disableIcon:s,control:F})]})},ir=w(lr);import{Stack as dr}from"@mui/material";import{AdapterDayjs as mr}from"@mui/x-date-pickers/AdapterDayjs";import{LocalizationProvider as ur}from"@mui/x-date-pickers/LocalizationProvider";import{TimePicker as fr}from"@mui/x-date-pickers/TimePicker";import{composeValidators as cr,time as ke}from"@s_mart/rules";import{useController as Fr,useFormContext as yr,useFormState as xr}from"react-hook-form";import{styled as nr}from"@mui/material";import{IconButton as ar}from"@mui/material";import{toRem as G}from"@s_mart/utils";var sr=e=>{switch(e){case"small":return G(16);case"large":return G(24);default:return G(20)}},pr=e=>{switch(e){case"small":return`${G(2)} ${G(8)}`;case"large":return G(10);default:return`${G(6)} ${G(8)}`}},Ie=nr(ar)`
|
|
62
44
|
margin: 0px;
|
|
63
45
|
|
|
64
|
-
padding: ${({size:e})=>
|
|
46
|
+
padding: ${({size:e})=>pr(e)};
|
|
65
47
|
border-radius: 0 ${G(4)} ${G(4)} 0;
|
|
66
48
|
|
|
67
49
|
svg {
|
|
68
|
-
width: ${({size:e})=>
|
|
50
|
+
width: ${({size:e})=>sr(e)} !important;
|
|
69
51
|
}
|
|
70
|
-
`;import"dayjs/locale/pt-br";import{jsx as ee,jsxs as
|
|
52
|
+
`;import"dayjs/locale/pt-br";import{jsx as ee,jsxs as br}from"react/jsx-runtime";var Pr=({rules:e,defaultValue:o,shouldUnregister:t,name:l,control:n,required:f,label:c,disabled:m,disableIconError:h,...i})=>{let V=yr()?.control,p=n??V;if(!p)throw new P("TimePicker");let d=xr({control:p,name:l}),s=L(d.errors,l),a=i.format||"HH:mm",S=e?cr([ke(a),e]):ke(a),{field:F}=Fr({control:p,name:l,rules:S,defaultValue:o,shouldUnregister:t});return ee(ur,{dateAdapter:mr,children:br(dr,{children:[c&&ee(x,{label:c,required:f}),ee(fr,{ampm:!1,format:a,value:F.value??null,disabled:m,...i,enableAccessibleFieldDOMStructure:!1,onChange:(k,T)=>{F.onChange(k,T),i?.onChange?.(k,T)},slots:{openPickerButton:Ie},slotProps:{...i.slotProps,textField:{error:!!s,...i.slotProps?.textField,inputRef:F.ref},actionBar:{actions:[],...i.slotProps?.actionBar}}},l),ee(v,{name:l,disableIcon:h,control:p})]})})},hr=w(Pr);console.log("opa");export{Xe as Checkbox,ho as CreatableV2,Do as DatePicker,v as FieldError,_ as FieldInfo,x as FieldLabel,_o as Form,ie as FormProvider,lt as RadioButton,Zo as RadioGroup,ft as SearchableV2,Et as SelectV2,Dt as Slider,Ut as Switch,ir as TextField,hr as TimePicker,ne as useForm};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@s_mart/form",
|
|
3
|
-
"version": "10.0.0
|
|
3
|
+
"version": "10.0.0",
|
|
4
4
|
"main": "./dist/index.mjs",
|
|
5
5
|
"module": "./dist/index.mjs",
|
|
6
6
|
"types": "./dist/index.d.mts",
|
|
@@ -31,13 +31,13 @@
|
|
|
31
31
|
"react-hook-form": "^7.51.0",
|
|
32
32
|
"typescript": ">=5.4.2",
|
|
33
33
|
"zod": "^3.22.4",
|
|
34
|
-
"@s_mart/core": "10.0.0
|
|
34
|
+
"@s_mart/core": "10.0.0",
|
|
35
35
|
"@s_mart/masks": "5.2.0",
|
|
36
|
-
"@s_mart/regular-icons": "6.0.11
|
|
37
|
-
"@s_mart/rules": "5.1.2
|
|
38
|
-
"@s_mart/solid-icons": "6.0.
|
|
39
|
-
"@s_mart/tokens": "6.0.0
|
|
40
|
-
"@s_mart/typed": "8.0.0
|
|
36
|
+
"@s_mart/regular-icons": "6.0.11",
|
|
37
|
+
"@s_mart/rules": "5.1.2",
|
|
38
|
+
"@s_mart/solid-icons": "6.0.11",
|
|
39
|
+
"@s_mart/tokens": "6.0.0",
|
|
40
|
+
"@s_mart/typed": "8.0.0",
|
|
41
41
|
"@s_mart/utils": "5.3.4"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
@@ -51,11 +51,11 @@
|
|
|
51
51
|
"@types/react-dom": "^18.3.1",
|
|
52
52
|
"dayjs": "^1.11.10",
|
|
53
53
|
"typescript": ">=5.4.2",
|
|
54
|
-
"@s_mart/core": "10.0.0
|
|
54
|
+
"@s_mart/core": "10.0.0",
|
|
55
55
|
"@s_mart/masks": "5.2.0",
|
|
56
|
-
"@s_mart/rules": "5.1.2
|
|
57
|
-
"@s_mart/tokens": "6.0.0
|
|
58
|
-
"@s_mart/typed": "8.0.0
|
|
56
|
+
"@s_mart/rules": "5.1.2",
|
|
57
|
+
"@s_mart/tokens": "6.0.0",
|
|
58
|
+
"@s_mart/typed": "8.0.0",
|
|
59
59
|
"@s_mart/utils": "5.3.4"
|
|
60
60
|
},
|
|
61
61
|
"overrides": {
|