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.

21 lines (20 loc) 8.29 kB
import{b as g}from"./chunk-KW3ZLVSY.js";import{a as I}from"./chunk-2CDASR7X.js";import{a as f}from"./chunk-V5IX4U5J.js";import{a as d,b as u,c as m}from"./chunk-UABQX4UA.js";import{Children as J,isValidElement as X}from"react";var b=(s,a)=>{var i;let o=(i=J.toArray(s))==null?void 0:i.filter(e=>X(e));return o.map((e,n)=>{let t=a.find(r=>e.type===r.child),l=o.reduce((r,p,c)=>(p==null?void 0:p.type)===e.type&&c<=n?r+1:r,0);return t&&l<=(t==null?void 0:t.amount)?e:null})};var V=f({base:` group flex w-[100%] items-center justify-between gap-onepulse py-threepulse duration-100 ease-in bg-forms-filled ring-forms-border-filled ring-quarterpulse overflow-hidden focus-within:ring-halfpulse focus-within:bg-forms-fill-focused min-w-[calc(var(--sizing-huge)_+_var(--sizing-tiny))] `,variants:{size:{md:"h-medium rounded-form px-twopulse",ml:"h-mediumlarge rounded-form px-threepulse",lg:"h-large rounded-form px-threepulse",xl:"h-extralarge rounded-largecontainer px-threepulse"},readOnly:{true:""},hasError:{true:""},filled:{true:""},active:{true:""},disabled:{true:"cursor-not-allowed ring-forms-border-disabled ring-quarterpulse"}},compoundVariants:[{readOnly:!1,disabled:!1,hasError:!1,class:` [&:not(:focus-within)]:has-[:placeholder-shown]:bg-forms-fill [&:not(:focus-within)]:has-[:placeholder-shown]:hover:bg-forms-fill-hovered `},{hasError:!1,readOnly:!1,disabled:!1,class:` focus-within:ring-action-border-focused hover:ring-halfpulse [&: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 `},{readOnly:!0,disabled:!1,class:"cursor-not-allowed bg-forms-fill-readonly ring-forms-border-readonly ring-quarterpulse"},{hasError:!0,filled:!0,active:!1,class:"bg-forms-fill-error ring-forms-border-error hover:ring-halfpulse"},{hasError:!0,active:!0,class:"bg-forms-fill-error ring-forms-border-error ring-halfpulse hover:bg-forms-fill-error hover:ring-halfpulse"},{hasError:!0,filled:!1,active:!1,class:"bg-forms-fill ring-forms-border-error hover:bg-forms-fill-hovered hover:ring-bg-forms-hovered hover:ring-halfpulse"}],defaultVariants:{size:"ml",isFocused:!1,hasError:!1,readOnly:!1,disabled:!1}});import{jsx as Y}from"react/jsx-runtime";var N=i=>{var e=i,{children:s,__scopeInputText:a}=e,o=m(e,["children","__scopeInputText"]);let{disabled:n,hasError:t,readOnly:l,size:r,value:p,isActive:c}=x("InputTextActions",a);return Y("div",u(d({},o),{className:V({active:c,size:r,disabled:n,readOnly:l,hasError:!!t,filled:!!p&&!!p.length}),"aria-disabled":n,"data-disabled":n,children:b(s,[{child:h.Icon,amount:2},{child:h.Field,amount:1},{child:h.ClearButton,amount:1}])}))};var O=f({base:"input-text-clear-button",variants:{size:{md:"-mr-[6px]",ml:"-mr-[8px]",lg:"-mr-[8px]",xl:"-mr-[8px]"},readOnly:{true:"invisible hidden"},disabled:{true:"invisible hidden"},isActive:{true:"invisible hidden"},filled:{false:"invisible hidden"}},defaultVariants:{readOnly:!1,disabled:!1}}),S=f({base:"!px-none",variants:{size:{md:"!h-medium !w-medium",ml:"!h-mediumlarge !min-w-mediumlarge",lg:"!h-mediumlarge !min-w-mediumlarge",xl:"!h-mediumlarge !min-w-mediumlarge"}}});import{jsx as C}from"react/jsx-runtime";var z=o=>{var i=o,{__scopeInputText:s}=i,a=m(i,["__scopeInputText"]);let{size:e,disabled:n,readOnly:t,isActive:l,value:r}=x("InputTextClearButton",s);return C("div",{className:O({size:e,disabled:n,readOnly:t,isActive:l,filled:!!r&&!!r.length}),"aria-disabled":n||t,children:C(g.Root,u(d({},a),{size:e,disabled:n||t,variant:"neutral-tertiary",className:S({size:e}),children:C(g.Icon,{symbol:"rdicon-dismiss-circle-outline"})}))})};import{forwardRef as G}from"react";var E=f({base:` peer/field 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 K}from"react/jsx-runtime";var w=G((n,e)=>{var t=n,{__scopeInputText:s,onFocus:a,onBlur:o}=t,i=m(t,["__scopeInputText","onFocus","onBlur"]);let{disabled:l,readOnly:r,size:p,isActive:c,setActive:T}=x("InputTextField",s),v=y=>{T(!0),a==null||a(y)},k=y=>{T(!1),o==null||o(y)};return K("input",u(d({},i),{ref:e,disabled:l,readOnly:r,placeholder:"Placeholder is hidden",className:E({disabled:l,readOnly:r,isActive:c,size:p}),onFocus:v,onBlur:k}))});w.displayName="InputTextField";import{useMemo as Q}from"react";var F=f({base:"justify-star flex w-[100%] flex-wrap items-center 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"},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 P,jsxs as U}from"react/jsx-runtime";var L=n=>{var t=n,{withIcon:s,iconName:a="rdicon-warning-circle",children:o,__scopeInputText:i}=t,e=m(t,["withIcon","iconName","children","__scopeInputText"]);let{disabled:l,hasError:r,readOnly:p}=x("InputTextHelperText",i),c=r?"rdicon-warning-circle":a,T=Q(()=>l?"colorTextNeutralDisabled":p?"colorTextNeutralReadonly":r?"colorTextDangerAlternative":"colorTextNeutralAlternative",[l,r,p]);if(!o)return null;let v=r||s;return U("div",u(d({},e),{"aria-disabled":l,className:F({hasError:r,disabled:l,readOnly:p}),children:[v&&P("div",{className:"flex items-center",children:P(I,{symbol:c,color:T,size:"tiny"})}),P("span",{className:"flex flex-1",children:o})]}))};import{useMemo as W}from"react";import{jsx as R}from"react/jsx-runtime";function H(i){var e=i,{__scopeInputText:s,color:a="colorTextNeutralDefault"}=e,o=m(e,["__scopeInputText","color"]);let{size:n,disabled:t,readOnly:l}=x("InputTextField",s),r=W(()=>{let c={md:"extra-small",ml:"small",lg:"small",xl:"small"};return c==null?void 0:c[n]},[n]),p=()=>t?"colorTextNeutralDisabled":l?"colorTextNeutralReadonly":"colorTextNeutralDefault";return R("div",{className:"flex items-center",children:R(I,u(d({},o),{color:p(),size:r}))})}var B=f({base:` w-[100%] 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",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 _}from"react/jsx-runtime";var D=s=>{let l=s,{__scopeInputText:a,children:o}=l,i=m(l,["__scopeInputText","children"]),{disabled:e,readOnly:n,size:t}=x("InputTextLabel",a);return o?_("div",{className:"flex h-extrasmall w-[100%] items-center rounded-none border-none px-onepulse text-left",children:_("label",u(d({},i),{className:B({disabled:e,readOnly:n,size:t}),"aria-disabled":e,children:o}))}):null};import{createContextScope as Z}from"@radix-ui/react-context";import{useState as $}from"react";import{jsx as M}from"react/jsx-runtime";var A="InputText",q=s=>{let{size:a="ml",children:o,__scopeInputText:i,value:e}=s,[n,t]=$(!1);return M(ee,u(d({},s),{size:a,scope:i,isActive:n,value:e,setActive:t,children:M("div",{className:"flex w-full flex-col gap-halfpulse ",children:b(o,[{child:h.Label,amount:1},{child:h.Actions,amount:1},{child:h.HelperText,amount:1}])})}))};q.displayName=A;var[j]=Z(A),[ee,x]=j(A),h={Root:q,Label:D,Field:w,HelperText:L,Actions:N,ClearButton:z,Icon:H};export{h as a}; //# sourceMappingURL=chunk-7753V76Q.js.map