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) 7.95 kB
import{a as g}from"./chunk-IU4XB45E.js";import{a as m}from"./chunk-2MB3Y6WI.js";import{a as I}from"./chunk-OMQZQF62.js";import{a as p,b as d,c as u}from"./chunk-DDCCLFYC.js";import{Children as J,isValidElement as X}from"react";var b=(a,s)=>{var i;let r=(i=J.toArray(a))==null?void 0:i.filter(e=>X(e));return r.map((e,o)=>{let t=s.find(l=>e.type===l.child),n=r.reduce((l,c,f)=>(c==null?void 0:c.type)===e.type&&f<=o?l+1:l,0);return t&&n<=(t==null?void 0:t.amount)?e:null})};var V=m({base:` group flex w-[100%] items-center justify-between gap-onepulse py-threepulse duration-100 ease-in bg-forms-fill-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"},hasError:{true:"ring-forms-border-error"},readOnly:{true:""},disabled:{true:"cursor-not-allowed ring-forms-border-disabled ring-quarterpulse"}},compoundVariants:[{readOnly:!1,disabled:!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"}],defaultVariants:{size:"ml",isFocused:!1,hasError:!1,readOnly:!1,disabled:!1}});import{jsx as Y}from"react/jsx-runtime";var O=i=>{var e=i,{children:a,__scopeInputText:s}=e,r=u(e,["children","__scopeInputText"]);let{disabled:o,hasError:t,readOnly:n,size:l}=x("InputTextActions",s);return Y("div",d(p({},r),{className:V({size:l,disabled:o,readOnly:n,hasError:t}),"aria-disabled":o,"data-disabled":o,children:b(a,[{child:T.Icon,amount:2},{child:T.Field,amount:1},{child:T.ClearButton,amount:1}])}))};var N=m({base:"input-text-clear-button invisible hidden",variants:{size:{md:"-mr-[6px]",ml:"-mr-[8px]",lg:"-mr-[8px]",xl:"-mr-[8px]"},readOnly:{true:""},disabled:{true:""},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}}),S=m({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 w}from"react/jsx-runtime";var z=r=>{var i=r,{__scopeInputText:a}=i,s=u(i,["__scopeInputText"]);let{size:e,disabled:o,readOnly:t,isActive:n}=x("InputTextClearButton",a);return w("div",{className:N({size:e,disabled:o,readOnly:t,isActive:n}),"aria-disabled":o||t,children:w(g.Root,d(p({},s),{size:e,disabled:o||t,variant:"neutral-tertiary",className:S({size:e}),children:w(g.Icon,{symbol:"rdicon-dismiss-circle-outline"})}))})};import{forwardRef as G}from"react";var E=m({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 C=G((o,e)=>{var t=o,{__scopeInputText:a,onFocus:s,onBlur:r}=t,i=u(t,["__scopeInputText","onFocus","onBlur"]);let{disabled:n,readOnly:l,size:c,isActive:f,setActive:h}=x("InputTextField",a),y=v=>{h(!0),s==null||s(v)},k=v=>{h(!1),r==null||r(v)};return K("input",d(p({},i),{ref:e,disabled:n,readOnly:l,placeholder:"Placeholder is hidden",className:E({disabled:n,readOnly:l,isActive:f,size:c}),onFocus:y,onBlur:k}))});C.displayName="InputTextField";import{useMemo as Q}from"react";var F=m({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=o=>{var t=o,{withIcon:a,iconName:s="rdicon-warning-circle",children:r,__scopeInputText:i}=t,e=u(t,["withIcon","iconName","children","__scopeInputText"]);let{disabled:n,hasError:l,readOnly:c}=x("InputTextHelperText",i),f=l?"rdicon-warning-circle":s,h=Q(()=>n?"colorTextNeutralDisabled":c?"colorTextNeutralReadonly":l?"colorTextDangerAlternative":"colorTextNeutralAlternative",[n,l,c]);if(!r)return null;let y=l||a;return U("div",d(p({},e),{"aria-disabled":n,className:F({hasError:l,disabled:n,readOnly:c}),children:[y&&P("div",{className:"flex items-center",children:P(I,{symbol:f,color:h,size:"tiny"})}),P("span",{className:"flex flex-1",children:r})]}))};import{useMemo as W}from"react";import{jsx as R}from"react/jsx-runtime";function H(i){var e=i,{__scopeInputText:a,color:s="colorTextNeutralDefault"}=e,r=u(e,["__scopeInputText","color"]);let{size:o,disabled:t,readOnly:n}=x("InputTextField",a),l=W(()=>{let f={md:"extra-small",ml:"small",lg:"small",xl:"small"};return f==null?void 0:f[o]},[o]),c=()=>t?"colorTextNeutralDisabled":n?"colorTextNeutralReadonly":"colorTextNeutralDefault";return R("div",{className:"flex items-center",children:R(I,d(p({},r),{color:c(),size:l}))})}var B=m({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=a=>{let n=a,{__scopeInputText:s,children:r}=n,i=u(n,["__scopeInputText","children"]),{disabled:e,readOnly:o,size:t}=x("InputTextLabel",s);return r?_("div",{className:"flex h-extrasmall w-[100%] items-center rounded-none border-none px-onepulse text-left",children:_("label",d(p({},i),{className:B({disabled:e,readOnly:o,size:t}),"aria-disabled":e,children:r}))}):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=a=>{let{size:s="ml",children:r,__scopeInputText:i}=a,[e,o]=$(!1);return M(ee,d(p({},a),{size:s,scope:i,isActive:e,setActive:o,children:M("div",{className:"flex w-full flex-col gap-halfpulse ",children:b(r,[{child:T.Label,amount:1},{child:T.Actions,amount:1},{child:T.HelperText,amount:1}])})}))};q.displayName=A;var[j]=Z(A),[ee,x]=j(A),T={Root:q,Label:D,Field:C,HelperText:L,Actions:O,ClearButton:z,Icon:H};export{T as a}; //# sourceMappingURL=chunk-5GGORHT2.js.map