UNPKG

@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.

49 lines 12.8 kB
import{a as F}from"./chunk-J44H5GIE.js";import{a as z}from"./chunk-W7XK6INV.js";import{a as c}from"./chunk-2MB3Y6WI.js";import{a as y}from"./chunk-DQ6V5CGR.js";import{a as h,b as x,c as g}from"./chunk-DDCCLFYC.js";import{createContextScope as Ne}from"@radix-ui/react-context";import{jsx as ce}from"react/jsx-runtime";var q=({children:e})=>ce("div",{className:"input-select-actions","data-testid":"input-name-actions",children:e});import{forwardRef as Se,useEffect as J,useRef as ve,useState as ge}from"react";import{createContextScope as de}from"@radix-ui/react-context";import{forwardRef as pe}from"react";var _=c({base:` group flex items-center justify-between rounded-pill min-w-[11.25rem] w-full gap-onepulse pl-threepulse pr-onepulse relative py-[2px] text-text-neutral leading-none border-solid bg-forms-fill border-forms-fill duration-100 ease-in hover:bg-forms-fill-hovered hover:border-forms-fill-hovered focus:border-forms-border-focused focus:bg-forms-fill-focused focus:border-halfpulse active:border-forms-fill-focused active:bg-forms-fill-focused active:border-halfpulse has-[:focus]:ring-forms-border-filled has-[:focus]:bg-forms-fill-focused has-[:focus]:border-halfpulse has-[:active]:ring-forms-border-focused has-[:active]:bg-forms-fill-focused has-[:active]:border-halfpulse focus-within:ring-action-border-focused [&:not(:focus-within)]:has-[:placeholder-shown]:border-action-border-focused [&:not(:focus-within)]:has-[:placeholder-shown]:bg-forms-fill [&:not(:focus-within)]:has-[:placeholder-shown]:hover:bg-forms-fill-hovered [&:not(:focus-within)]:has-[:not(:placeholder-shown)]:border-forms-border-filled has-[:active]:[&:not(:focus-within)]:has-[:placeholder-shown]:bg-forms-fill-focused has-[:active]:[&:not(:focus-within)]:has-[:placeholder-shown]:border-forms-border-focused has-[:active]:[&:not(:focus-within)]:has-[:not(:placeholder-shown)]:border-forms-border-focused has-[:focus]:has-[:not(:placeholder-shown)]:border-forms-border-focused `,variants:{size:{md:"h-medium",ml:"h-mediumlarge",lg:"h-large"},hasFilled:{true:` border-forms-border-filled border-quarterpulse bg-forms-fill-filled active:border-forms-fill-focused active:bg-forms-fill-focused active:border-halfpulse hover:bg-forms-fill-filled hover:border-forms-border-filled hover:border-halfpulse has-[:active]:border-forms-fill-focused has-[:active]:bg-forms-fill-focused has-[:active]:border-halfpulse [&:not(:focus-within)]:has-[:placeholder-shown]:bg-forms-fill [&:not(:focus-within)]:has-[:placeholder-shown]:hover:bg-forms-fill-hovered [&:not(:focus-within)]:has-[:placeholder-shown]:ring-forms-border [&:not(:focus-within)]:has-[:placeholder-shown]:hover:ring-forms-border-hovered [&:not(:focus-within)]:has-[:placeholder-shown]:ring-none `}},defaultVariants:{size:"md"}}),$=c({base:` peer/field font-wheight-regular text-text-neutral-alternative font-rdmodern font-regular text-threeandhalfpulse leading-none border-none bg-[transparent] flex-1 align-middle self-center focus-visible:border-none focus-visible:outline-none placeholder:text-text-neutral-alternative active:placeholder:text-text-neutral-placeholder focus:placeholder:text-text-neutral-placeholder active:text-text-neutral-placeholder focus:text-text-neutral-placeholder `,variants:{size:{md:"h-extrasmall",ml:"h-extrasmall",lg:"h-extrasmall"},hasFilled:{true:`text-text-neutral active:text-text-neutral `}},defaultVariants:{size:"md"}}),K=c({base:"searchbar-button bg-none",variants:{size:{md:"h-medium w-medium min-w-medium",ml:"h-mediumlarge w-mediumlarge min-w-mediumlarge",lg:"h-mediumlarge w-mediumlarge min-w-mediumlarge"}},defaultVariants:{size:"md"}}),Y=c({base:` searchbar-clear-button hidden peer-focus/field:peer-[:not(:placeholder-shown)]/field:flex peer-focus/field:peer-[:not(:placeholder-shown)]/field:visible group-hover:peer-[:not(:placeholder-shown)]/field:flex `,variants:{size:{md:"h-medium w-medium min-w-medium",ml:"h-mediumlarge w-mediumlarge min-w-mediumlarge",lg:"h-mediumlarge w-mediumlarge min-w-mediumlarge"}}});import{jsx as N,jsxs as he}from"react/jsx-runtime";var L="SearchBar",U=pe((e,r)=>{let{onChange:o=()=>{},handleSearch:l=()=>{},handleClear:i=()=>{},placeholder:a,datatestid:f="search-bar",value:s="",size:t="md",__scopeSearchBar:d}=e,n=p=>p==="lg"?"ml":p;return N(me,x(h({},e),{scope:d,children:he("div",{className:_({size:t,hasFilled:s!==""}),children:[N("input",{ref:r,type:"text",className:$({size:t,hasFilled:s!==""}),placeholder:a,onChange:p=>o(p),value:s,"data-testid":f}),N(z.Root,{size:n(t),variant:"neutral-tertiary",className:Y({size:t}),onClick:i,children:N(z.Icon,{symbol:"rdicon-dismiss-circle-outline"})}),N(z.Root,{size:n(t),variant:"neutral-tertiary",className:K({size:t}),onClick:l,children:N(z.Icon,{symbol:"rdicon-search"})})]})}))});U.displayName=L;var[fe]=de(L),[me,Ae]=fe(L),ue={Root:U};import{useState as xe}from"react";var W=c({base:` flex flex-row bg-[transparent] `,variants:{size:{tiny:"gap-none",small:"gap-onepulse"}}});import{jsx as T}from"react/jsx-runtime";var Ge=a=>{var f=a,{size:e="tiny",value:r,ratingLimit:o=5,onPress:l}=f,i=g(f,["size","value","ratingLimit","onPress"]);let[s,t]=xe(0),d="colorTextEvaluateDefault";function n(p){let m=p+1;l(m),t(m)}return T("div",{className:W(),children:Array.from({length:o},(p,m)=>{let S=r!=null?r:s,B=Math.floor(S),P=S%1,w=B,C=!1;P>=.5&&(C=!0),P>=.99&&(w+=1,C=!1);let I=m<w;return T("div",{onClick:()=>n(m),onKeyDown:()=>n(m),"data-testid":"star-icon",children:I?T(y,{symbol:"rdicon-star-filled",color:d,size:e}):m===w&&C?T(y,{symbol:"rdicon-star-half",color:d,size:e}):T(y,{symbol:"rdicon-star-outline",color:d,size:e})},`${m}-${S}`)})})};import{useState as be}from"react";function O(){let[e,r]=be();return{useSelect:O,selectedOption:e,setSelectedOption:r}}var G=c({base:` flex justify-between w-full h-extrasmall p-none px-twopulse items-center text-text-neutral font-rdmodern flex-1 rounded-none leading-small z-80 placeholder:opacity-transparent focus-visible:border-none focus-visible:outline-none tracking-onepulse `,variants:{size:{md:"text-threepulse",ml:"text-threeandhalfpulse",lg:"text-threeandhalfpulse",xl:"text-threeandhalfpulse"},readOnly:{true:"text-text-neutral-readonly",false:""},disabled:{true:"text-text-neutral-disabled",false:""},hasError:{true:"bg-forms-fill-error",false:"bg-forms-fill-filled"}},defaultVariants:{size:"md",readOnly:!1,disabled:!1,hasError:!1}});import{jsx as R,jsxs as Q}from"react/jsx-runtime";var H=Se(f=>{var s=f,{children:e,__scopeInputSelect:r,onChangeSelectionValue:o,value:l,optionMaxHeight:i}=s,a=g(s,["children","__scopeInputSelect","onChangeSelectionValue","value","optionMaxHeight"]);let{size:t,hasError:d,disabled:n,readOnly:p,placeholder:m,options:S=[]}=b("InputSelectField",r),[B,P]=ge(!1),{setSelectedOption:w,selectedOption:C}=O(),I=ve(null),E={label:m!=null?m:"Selecione...",value:""};J(()=>{if(l){let u=S.find(v=>v.value===l);return w(u)}return w(E)},[l]),J(()=>{function u(v){I.current&&!I.current.contains(v.target)&&P(!1)}return document.addEventListener("mousedown",u),()=>{document.removeEventListener("mousedown",u)}},[]);let ie=u=>{w(u),P(!1),o==null||o(u.value)},k=()=>{!n&&!p&&P(!B)};return Q("div",{ref:I,className:"relative flex w-full flex-col",children:[Q("div",x(h({},Object.keys(a).reduce((v,V)=>(V.startsWith("data-")&&(v[V]=a[V]),v),{})),{className:G(h({size:t,hasError:d,readOnly:p,disabled:n},a)),onClick:()=>k(),onKeyUp:()=>k(),"data-testid":"select-field",children:[C?C.label:E.label,R(A.Icon,{symbol:B?"rdicon-chevron-up":"rdicon-chevron-down",color:n?"colorTextNeutralDisabled":p?"colorTextNeutralReadonly":"colorTextNeutralDefault"})]})),B&&R("div",{className:"x-full absolute top-full left-0 z-10 w-full py-fivepulse","data-testid":"select-option-menu",children:R(F.Root,x(h({type:"single"},a),{children:R(F.List,{maxHeight:i,children:S==null?void 0:S.map((u,v)=>R(F.Item,{content:u,onPress:()=>ie(u),disabled:n,"data-testid":"select-item"},`${u.label}-${v}`))})}))})]})});H.displayName="InputSelectField";var X=c({base:` flex w-full border border-solid bg-forms-fill-filled border-forms-border-filled px-onepulse py-threepulse items-center gap-none self-stretch rounded-form border opacity-opaque group hover:border-halfpulse `,variants:{size:{md:"h-medium text-threepulse",ml:"h-mediumlarge text-threeandhalfpulse",lg:"h-large text-hreeandhalfpulse",xl:"h-extralarge text-threeandhalfpulse"},readOnly:{true:"border-forms-border-readonly bg-forms-fill-readonly text-text-neutral-readonly hover:border-quarterpulse",false:""},disabled:{true:"border-forms-border-disabled bg-forms-fill-disabled text-text-neutral-disabled hover:border-quarterpulse",false:""},hasError:{true:"border-forms-border-error border-quarterpulse bg-forms-fill-error",false:"border-quarterpulse"}},defaultVariants:{}});import{jsx as ye}from"react/jsx-runtime";var Z=({__scopeInputSelect:e,children:r})=>{let{hasError:o,size:l,disabled:i,readOnly:a}=b("InputSelectHelperText",e);return ye("div",{"data-testid":"select-field-container",className:X({hasError:o,size:l,disabled:i,readOnly:a}),children:r})};import{useMemo as we}from"react";var j=c({base:"justify-star flex w-[100%] flex-wrap items-center gap-onepulse px-twopulse text-left font-rdmodern font-semibold text-text-neutral-alternative text-threepulse tracking-inline-onepulse",variants:{hasError:{true:"text-text-danger-alternative",false:""},readOnly:{true:"cursor-not-allowed"},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 D,jsxs as Pe}from"react/jsx-runtime";var ee=a=>{var f=a,{withIcon:e,iconName:r="rdicon-warning-circle",__scopeInputSelect:o,children:l}=f,i=g(f,["withIcon","iconName","__scopeInputSelect","children"]);let{hasError:s,readOnly:t,disabled:d}=b("InputSelectHelperText",o),n=s?"rdicon-warning-circle":r,p=we(()=>d?"colorTextNeutralDisabled":t?"colorTextNeutralReadonly":s?"colorTextDangerAlternative":"colorTextNeutralAlternative",[d,s,t]);return l?Pe("div",x(h({},i),{"aria-disabled":d,className:j({hasError:s,disabled:d,readOnly:t}),children:[e&&D("div",{className:"flex items-center",children:D(y,{symbol:n,color:p,size:"tiny"})}),D("span",{className:"flex flex-1",children:l})]})):null};import Ce from"react";import{jsx as te}from"react/jsx-runtime";function re(l){var i=l,{__scopeInputSelect:e,color:r="colorTextNeutralDefault"}=i,o=g(i,["__scopeInputSelect","color"]);let{size:a,hasError:f,disabled:s,readOnly:t}=b("InputSelectField",e),d=Ce.useMemo(()=>{let n={md:"small",ml:"small",lg:"small",xl:"small"};return n==null?void 0:n[a]},[a]);return te("div",{className:"flex h-6 h-small w-6 items-center justify-center rounded-none opacity-100",children:te(y,x(h({},o),{size:d,color:f?"colorTextDangerAlternative":s?"colorTextNeutralDisabled":t?"colorTextNeutralReadonly":"colorTextNeutralDefault"}))})}var oe=c({base:` w-[100%] align-middle m-none p-none text-left font-rdmodern font-semibold tracking-tiny text-text-neutral text-nowrap truncate leading `,variants:{size:{md:"text-threepulse",ml:"text-threeandhalfpulse",lg:"text-threeandhalfpulse",xl:"text-threeandhalfpulse"},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 le}from"react/jsx-runtime";var ae=({htmlFor:e,__scopeInputSelect:r,children:o})=>{let{size:l,disabled:i,readOnly:a}=b("InputSelectLabel",r);return le("div",{className:"flex h-extrasmall w-[100%] items-center rounded-none rounded-none border-none px-twopulse text-left",children:le("label",{htmlFor:e,className:oe({disabled:i,readOnly:a,size:l}),"data-testid":"testid-label",children:o})})};import{jsx as se}from"react/jsx-runtime";var M="Select",ne=e=>{let{size:r="md",hasError:o=!1,disabled:l=!1,__scopeInputSelect:i,options:a,children:f,placeholder:s}=e,{selectedOption:t}=O();return se(Ie,x(h({},e),{size:r,scope:i,hasError:o,disabled:l,options:a,value:t==null?void 0:t.value,placeholder:s,children:se("div",{className:"size-${size} min-w-[5rem] flex-1 flex-shrink-0 flex-col items-start gap-halfpulse rounded-none border-none bg-transparent p-none font-rdmodern text-align-center opacity-opaque",children:f})}))};ne.displayName=M;var[Be]=Ne(M),[Ie,b]=Be(M),A={Root:ne,Label:ae,FieldContainer:Z,Icon:re,Field:H,Actions:q,HelperText:ee};export{A as a,ue as b,Ge as c}; //# sourceMappingURL=chunk-W7JM5BEQ.js.map