@rdsaude/pulso-react-components
Version:
Biblioteca de componentes React do Pulso Design System da RD Saúde oferece componentes consistentes e de alto desempenho, alinhados com os padrões da RDSaúde. Ideal para desenvolver aplicações modernas e acessíveis.
50 lines (49 loc) • 13.2 kB
JavaScript
import{a as v}from"./chunk-J7H2C3SX.js";import{a as w}from"./chunk-PHPPC3UR.js";import{a as g}from"./chunk-M3MZVAAU.js";import{a as y}from"./chunk-DQ6V5CGR.js";import{a as p}from"./chunk-2MB3Y6WI.js";import{a as f,b,c as I}from"./chunk-DDCCLFYC.js";import{Children as W,isValidElement as Z}from"react";var C=(s,u)=>{var d;let e=(d=W.toArray(s))==null?void 0:d.filter(r=>Z(r));return e.map((r,l)=>{let o=u.find(t=>r.type===t.child),i=e.reduce((t,n,c)=>(n==null?void 0:n.type)===r.type&&c<=l?t+1:t,0);return o&&i<=(o==null?void 0:o.amount)?r:null})};var E=p({base:`
group flex w-full items-center justify-between gap-onepulse
bg-forms-fill border-forms-none overflow-hidden cursor-pointer
min-w-[calc(var(--sizing-huge)_+_var(--sizing-tiny))] focus-visible:outline-none
`,variants:{size:{md:"min-h-medium rounded-form px-threepulse",ml:"min-h-mediumlarge rounded-form px-threepulse",lg:"min-h-large rounded-form px-threepulse",xl:"min-h-extralarge rounded-largecontainer px-threepulse"},hasError:{true:""},disabled:{true:""},filled:{true:""},readonly:{true:""},active:{true:""},hasTwoItems:{true:""}},compoundVariants:[{hasError:!0,active:!0,class:`
border-forms-border-error bg-forms-fill-error
border-halfpulse
`},{hasError:!0,filled:!0,active:!1,class:`
border border-forms-border-error bg-forms-fill-error
hover:border-forms-border-error hover:border-halfpulse
focus:border-forms-border-error focus:border-halfpulse
active:border-forms-border-error active:border-halfpulse
`},{hasError:!0,filled:!1,active:!1,class:`
border-forms-border-error border-quarterpulse bg-forms-fill
hover:border-forms-border-error hover:bg-forms-fill-hovered hover:border-halfpulse
focus:border-forms-border-error focus:border-halfpulse
active:border-forms-border-error active:border-halfpulse
`},{readonly:!0,filled:!0,class:`
border border-forms-border-readonly bg-forms-fill-readonly
hover:border-forms-border-readonly hover:border-quarterpulse
focus:border-forms-border-readonly focus:border-quarterpulse
active:border-forms-border-readonly active:border-quarterpulse
`},{readonly:!0,filled:!1,class:`
border border-forms-border-readonly bg-forms-fill-readonly
hover:border-forms-border-readonly hover:border-quarterpulse
focus:border-forms-border-readonly focus:border-quarterpulse
active:border-forms-border-readonly active:border-quarterpulse
`},{disabled:!0,filled:!0,class:`
border border-forms-border-disabled bg-forms-fill-disabled
hover:border-forms-border-disabled hover:border-quarterpulse
focus:border-forms-border-disabled focus:border-quarterpulse
active:border-forms-border-disabled active:border-quarterpulse
`},{disabled:!0,filled:!1,class:`
border border-forms-border-disabled bg-forms-fill-disabled
hover:border-forms-border-disabled hover:border-quarterpulse
focus:border-forms-border-disabled focus:border-quarterpulse
active:border-forms-border-disabled active:border-quarterpulse
`},{active:!0,filled:!0,readonly:!1,disabled:!1,hasError:!1,class:"cursor-pointer border-forms-border-focused border-forms-border-focused border-halfpulse bg-forms-fill-focused active:border-forms-border-focused active:border-halfpulse"},{active:!0,readonly:!1,disabled:!1,hasError:!1,filled:!1,class:"cursor-pointer border border-forms-border-focused border-forms-border-focused border-halfpulse bg-forms-fill-focused"},{active:!1,hasError:!1,disabled:!1,readonly:!1,filled:!0,class:"border border-forms-border-filled border-quarterpulse bg-forms-fill-filled hover:border-halfpulse focus:border-forms-border-focused focus:border-halfpulse focus:bg-forms-fill-focused active:border-forms-border-focused active:border-halfpulse active:bg-forms-fill-focused"},{active:!1,hasError:!1,disabled:!1,readonly:!1,filled:!1,class:`
focus-simple:cursor-pointer
focus:border-halfpulse focus:border-forms-border-focused focus:cursor-pointer
hover:border-none hover:bg-forms-fill-hovered
`},{size:"md",hasTwoItems:!1,class:"h-medium"},{size:"ml",hasTwoItems:!1,class:"h-mediumlarge"},{size:"lg",hasTwoItems:!1,class:"h-large"},{size:"xl",hasTwoItems:!1,class:"h-extralarge"}],defaultVariants:{size:"ml",isFocused:!1,hasError:!1,readonly:!1,disabled:!1}});import{Children as j,isValidElement as ee,useEffect as te,useMemo as re}from"react";import le from"react";import{jsx as oe}from"react/jsx-runtime";var R=d=>{var r=d,{children:s,__scopeInputMultiSelect:u}=r,e=I(r,["children","__scopeInputMultiSelect"]);let{disabled:l,hasError:o,size:i,readonly:t,isActive:n,setActive:c}=m("InputMultiSelectActions",u),a=!!(e.selectedItemsQuantity&&e.selectedItemsQuantity>0),x=!!(e.selectedItemsQuantity&&e.selectedItemsQuantity>1),M=re(()=>t?"colorTextNeutralReadonly":l?"colorTextNeutralDisabled":"colorTextNeutralDefault",[l,t]);return te(()=>{c(!!e.isActive)},[e.isActive]),oe("button",b(f({},e),{onClick:S=>{c(!n),e.onClick&&e.onClick(S)},className:E({active:n||e.isActive,size:i,disabled:l,hasError:o,readonly:t,filled:a,hasTwoItems:x}),"aria-disabled":l,children:C(j.map(s,S=>ee(S)&&S.type===y?le.cloneElement(S,{color:M}):S),[{child:h.Icon,amount:1},{child:h.Field,amount:1},{child:h.Quantity,amount:4},{child:h.ClearButton,amount:1},{child:y,amount:1}])}))};import{useMemo as se}from"react";var L=p({base:"input-text-clear-button group-active:hidden",variants:{size:{md:"-mr-[0.375rem]",ml:"-mr-[0.5rem]",lg:"-mr-[0.5rem]",xl:"-mr-[0.5rem]"},readOnly:{true:"invisible hidden"},disabled:{true:"invisible hidden"},isActive:{true:""}},compoundVariants:[{readOnly:!1,disabled:!1,isActive:!0,class:"peer-focus/field:peer-[:not(:placeholder-shown)]/field:visible peer-focus/field:peer-[:not(:placeholder-shown)]/field:flex group-hover:peer-[:not(:placeholder-shown)]/field:flex"}],defaultVariants:{readOnly:!1,disabled:!1}}),O=p({base:"px-none",variants:{size:{md:"h-medium w-medium",ml:"h-mediumlarge w-mediumlarge",lg:"h-mediumlarge w-mediumlarge",xl:"h-mediumlarge w-mediumlarge"}}});import{jsx as T}from"react/jsx-runtime";var Q=e=>{var d=e,{__scopeInputMultiSelect:s}=d,u=I(d,["__scopeInputMultiSelect"]);let{size:r,disabled:l,isActive:o,readonly:i}=m("InputMultiSelectClearButton",s),t=se(()=>{switch(r){case"md":return"md";default:return"ml"}},[r]);return T("div",{className:L({size:r,disabled:l,isActive:o,readOnly:i}),"aria-disabled":l,children:T(w.Root,b(f({},u),{size:t,disabled:l,variant:"neutral-tertiary",className:O({size:t}),children:T(w.Icon,{symbol:"rdicon-dismiss-circle-outline"})}))})};import{forwardRef as ie}from"react";var D=p({base:`
peer/field h-small flex w-[100%] bg-[transparent] !font-rdmodern font-regular text-text-neutral-alternative tracking-tiny leading-small
placeholder:opacity-transparent focus-visible:border-none focus-visible:outline-none
`,variants:{size:{md:"text-threepulse",ml:"text-threeandhalfpulse",lg:"text-threeandhalfpulse",xl:"text-threeandhalfpulse"},readOnly:{true:"text-text-neutral-readonly"},disabled:{true:"cursor-not-allowed text-text-neutral-disabled",false:""},isActive:{true:"text-text-neutral"}},compoundVariants:[{readOnly:!0,disabled:!1,class:"cursor-not-allowed text-text-neutral-readonly"}],defaultVariants:{readOnly:!1,disabled:!1}});import{jsx as ne}from"react/jsx-runtime";var A=ie((l,r)=>{var o=l,{__scopeInputMultiSelect:s,onFocus:u,onBlur:e}=o,d=I(o,["__scopeInputMultiSelect","onFocus","onBlur"]);let{disabled:i,readonly:t,size:n,isActive:c,setActive:a}=m("InputMultiSelectField",s),x=S=>{a(!0),u==null||u(S)},M=S=>{a(!1),e==null||e(S)};return ne("input",b(f({},d),{ref:r,disabled:i,readOnly:t,placeholder:"Placeholder is hidden",className:D({disabled:i,readOnly:t,isActive:c,size:n}),onFocus:x,onBlur:M}))});A.displayName="InputMultiSelectField";import{useMemo as ae}from"react";var F=p({base:"flex w-full flex-wrap items-center justify-start gap-onepulse px-onepulse text-left font-rdmodern font-semibold text-text-neutral-alternative text-threepulse",variants:{hasError:{true:"text-text-danger-alternative",false:""},readOnly:{true:"cursor-not-allowed text-text-neutral-readonly"},disabled:{true:"cursor-not-allowed text-text-neutral-disabled",false:""}},compoundVariants:[{readOnly:!0,disabled:!1,class:"text-text-neutral-readonly"}],defaultVariants:{error:!1,disabled:!1,readOnly:!1}});import{jsx as V,jsxs as ue}from"react/jsx-runtime";var q=l=>{var o=l,{withIcon:s,iconName:u="rdicon-warning-circle",children:e,__scopeInputMultiSelect:d}=o,r=I(o,["withIcon","iconName","children","__scopeInputMultiSelect"]);let{disabled:i,hasError:t,readonly:n}=m("InputMultiSelectHelperText",d),c=t?"rdicon-warning-circle":u,a=ae(()=>n?"colorTextNeutralReadonly":i?"colorTextNeutralDisabled":t?"colorTextDangerAlternative":"colorTextNeutralAlternative",[i,t,n]);return e?ue("div",b(f({},r),{"aria-disabled":i,className:F({hasError:t,disabled:i,readOnly:n}),children:[s&&V("div",{className:"flex items-center",children:V(y,{symbol:c,color:a,size:"tiny"})}),V("span",{className:"line-clamp-2 flex-1",children:e})]})):null};import{useMemo as de}from"react";import{jsx as B}from"react/jsx-runtime";function H(d){var r=d,{__scopeInputMultiSelect:s,color:u="colorTextNeutralDefault"}=r,e=I(r,["__scopeInputMultiSelect","color"]);let{size:l,disabled:o,readonly:i}=m("InputMultiSelectField",s),t=de(()=>{let c={md:"extra-small",ml:"small",lg:"small",xl:"small"};return c==null?void 0:c[l]},[l]),n=()=>i?"colorTextNeutralReadonly":o?"colorTextNeutralDisabled":"colorTextNeutralDefault";return B("div",{className:"flex items-center",children:B(y,b(f({},e),{color:n(),size:t}))})}var k=p({base:`
w-full align-middle m-none p-none
text-left font-rdmodern font-regular tracking-tiny text-text-neutral text-nowrap truncate leading
`,variants:{size:{md:"text-threepulse leading-[150%]",ml:"text-threeandhalfpulse leading-[140%]",lg:"text-threeandhalfpulse leading-[140%]",xl:"text-threeandhalfpulse leading-[140%]"},readOnly:{true:"",false:""},disabled:{true:"cursor-not-allowed text-text-neutral-disabled",false:""}},compoundVariants:[{readOnly:!0,disabled:!1,class:"cursor-not-allowed text-text-neutral-readonly"}],defaultVariants:{disabled:!1,readOnly:!1}});import{jsx as _}from"react/jsx-runtime";var J=s=>{let o=s,{__scopeInputMultiSelect:u,children:e}=o,d=I(o,["__scopeInputMultiSelect","children"]),{disabled:r,size:l}=m("InputMultiSelectLabel",u);return e?_("div",{className:"flex h-extrasmall w-full items-center rounded-none border-none px-onepulse text-left",children:_("label",b(f({},d),{className:k({disabled:r,size:l}),"aria-disabled":r,children:e}))}):null};import{useCallback as ce,useMemo as pe}from"react";var U=p({base:"flex w-full flex-wrap gap-1"}),xt=p({base:"flex h-[2rem] max-h-[2.5rem] items-center justify-center gap-onepulse rounded-[999px] border border-[#9E9E9E] px-twopulse py-onepulse font-bold text-[#575757] text-sm"}),yt=p({base:"flex rotate-45"});import{jsx as P}from"react/jsx-runtime";function X({labels:s,removeItem:u,__scopeInputMultiSelect:e}){let{disabled:d,readonly:r,size:l}=m("InputMultiSelectLabel",e),o=ce((t,n)=>n?`+${t}`:t.slice(0,1).toUpperCase()+t.slice(1),[]),i=pe(()=>l==="lg"||l==="xl"?"ml":"sm",[l]);return P("div",{className:U(),children:s.map(({id:t,label:n,oversized:c})=>{let a=o(n,c);return P(g.Root,{id:t,name:a,disabled:d,readOnly:r,value:"",size:i,checked:!c,children:P(g.Input,{id:t,name:a,value:"",onChange:()=>u(t),children:P(g.Label,{children:a})})},t)})})}import{createContextScope as be}from"@radix-ui/react-context";import{useState as Ie}from"react";import{useState as me}from"react";import{jsx as z,jsxs as fe}from"react/jsx-runtime";var Y=({labels:s,selectedLabels:u,onCancel:e,onConfirm:d,__scopeInputMultiSelect:r})=>{let{isActive:l,setActive:o}=m("InputMultiSelectActions",r),[i,t]=me(u),n=a=>!!i.find(({id:x})=>x===a),c=(a,x)=>{t(a?i.filter(({id:M})=>M!==x.id):[...i,x])};return fe(v.Root,{children:[z(v.List,{children:s.map(a=>z(v.Item,{type:"multi",checked:n(a.id),content:{label:a.label,value:a.id},customColor:"colorTextNeutralDefault",onPress:()=>c(n(a.id),a)},a.id))}),z(v.Footer,{controls:[{type:"cancel",label:"Cancelar",handler:()=>{o(!l),e()}},{type:"confirm",label:"Confirmar",handler:()=>{o(!l),d(i)}}]})]})};var $=p({base:"flex w-full min-w-[calc(var(--sizing-gigantic)_+_var(--sizing-gigantic))] flex-col gap-halfpulse",variants:{disabled:{true:"opacity-50"},readonly:{true:"opacity-75"}}});import{jsx as G}from"react/jsx-runtime";var N="InputMultiSelect",K=s=>{let{size:u="ml",children:e,__scopeInputMultiSelect:d}=s,[r,l]=Ie(!1);return G(he,b(f({},s),{size:u,scope:d,isActive:r,setActive:l,children:G("div",{className:$({disabled:s.disabled,readonly:s.readonly}),children:C(e,[{child:h.Label,amount:1},{child:h.Actions,amount:1},{child:h.HelperText,amount:1},{child:h.Dropdown,amount:1}])})}))};K.displayName=N;var[Se]=be(N),[he,m]=Se(N),h={Root:K,Label:J,HelperText:q,Actions:R,ClearButton:Q,Icon:H,Field:A,Quantity:X,Dropdown:Y};export{h as a};
//# sourceMappingURL=chunk-RKSMFXG5.js.map