@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.
2 lines • 7.08 kB
JavaScript
import{a as g,b}from"./chunk-FQCU2UPX.js";import{a as f}from"./chunk-JOWCR2VE.js";import{a as I}from"./chunk-F3QZNV6U.js";import{a as i,b as u,c as s,d as E}from"./chunk-VXGPURSP.js";var F={};E(F,{Actions:()=>w,ClearButton:()=>N,Field:()=>v,HelperText:()=>R,Icon:()=>L,Label:()=>P,Root:()=>y});import{Field as M,useField as S}from"@ark-ui/react/field";import{forwardRef as B,useState as D}from"react";import{jsx as O}from"react/jsx-runtime";var y=B((x,m)=>{var c=x,{children:p,size:e="ml",value:t,disabled:l,readOnly:o,hasError:n}=c,r=s(c,["children","size","value","disabled","readOnly","hasError"]);let[a,d]=D(!1),h=S({disabled:l,invalid:n}),T=g(p,{targets:["InputTextLabel","InputTextActions","InputTextHelperText"],props:{size:e,readOnly:o,hasError:n,value:t,isActive:a,setActive:d}});return O(M.RootProvider,u(i({},r),{ref:m,className:"flex w-full flex-col gap-halfpulse",value:h,children:T}))});y.displayName="InputTextRoot";import{Field as q}from"@ark-ui/react/field";import{forwardRef as _}from"react";import{jsx as H}from"react/jsx-runtime";var P=_((r,n)=>{var m=r,{children:p,size:e="ml",disabled:t,readOnly:l}=m,o=s(m,["children","size","disabled","readOnly"]);return p?H("div",{className:"flex h-extrasmall w-[100%] items-center rounded-none border-none px-onepulse text-left",children:H(q.Label,u(i({ref:n,className:f("w-[100%] align-middle m-none p-none text-left font-rdmodern font-regular tracking-tiny text-text-neutral text-nowrap truncate leading",{"text-threepulse":e==="md","text-threeandhalfpulse":e==="ml"||e==="lg"||e==="xl","cursor-not-allowed text-text-neutral-disabled":t,"cursor-not-allowed text-text-neutral-readonly":l&&!t}),"aria-disabled":t},o),{children:p}))}):null});P.displayName="InputTextLabel";import{Field as W}from"@ark-ui/react/field";import{forwardRef as G}from"react";import{jsx as J}from"react/jsx-runtime";var v=G((c,x)=>{var a=c,{onFocus:p,onBlur:e,size:t="ml",disabled:l,readOnly:o,isActive:n,setActive:r}=a,m=s(a,["onFocus","onBlur","size","disabled","readOnly","isActive","setActive"]);let d=T=>{r==null||r(!0),p==null||p(T)},h=T=>{r==null||r(!1),e==null||e(T)};return J(W.Input,i({ref:x,disabled:l,readOnly:o,placeholder:"Placeholder is hidden",className:f("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",{"text-threepulse":t==="md","text-threeandhalfpulse":t==="ml"||t==="lg"||t==="xl","text-text-neutral-readonly":o,"cursor-not-allowed text-text-neutral-disabled":l,"text-text-neutral":n}),onFocus:d,onBlur:h},m))});v.displayName="InputTextField";import{ark as K}from"@ark-ui/react";import{forwardRef as Q}from"react";import{jsx as U}from"react/jsx-runtime";var w=Q((c,x)=>{var a=c,{children:p,size:e="ml",disabled:t,readOnly:l,hasError:o,value:n,isActive:r}=a,m=s(a,["children","size","disabled","readOnly","hasError","value","isActive"]);let d=g(p,{targets:["InputTextIcon","InputTextField","InputTextClearButton"],props:{}});return U(K.div,u(i({ref:x,className:f("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))]",{"h-medium rounded-form px-twopulse":e==="md","h-mediumlarge rounded-form px-threepulse":e==="ml","h-large rounded-form px-threepulse":e==="lg","h-extralarge rounded-largecontainer px-threepulse":e==="xl","cursor-not-allowed ring-forms-border-disabled ring-quarterpulse":t,"cursor-not-allowed bg-forms-fill-readonly ring-forms-border-readonly ring-quarterpulse":l&&!t,"bg-forms-fill-error ring-forms-border-error hover:ring-halfpulse":o&&!!n&&!r,"bg-forms-fill-error ring-forms-border-error ring-halfpulse hover:bg-forms-fill-error hover:ring-halfpulse":o&&r,"bg-forms-fill ring-forms-border-error hover:bg-forms-fill-hovered hover:ring-bg-forms-hovered hover:ring-halfpulse":o&&!n&&!r},!l&&!t&&!o&&"hover:ring-halfpulse [&:not(:focus-within)]:has-[:placeholder-shown]:bg-forms-fill [&:not(:focus-within)]:has-[:placeholder-shown]:hover:bg-forms-fill-hovered",!o&&!l&&!t&&"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"),"aria-disabled":t,"data-disabled":t},m),{children:d}))});w.displayName="InputTextActions";import{Field as V}from"@ark-ui/react/field";import{forwardRef as X}from"react";import{jsx as A,jsxs as Y}from"react/jsx-runtime";var R=X((c,x)=>{var a=c,{withIcon:p,iconName:e="rdicon-warning-circle",children:t,size:l="ml",disabled:o,readOnly:n,hasError:r}=a,m=s(a,["withIcon","iconName","children","size","disabled","readOnly","hasError"]);if(!t)return null;let d=r?"rdicon-warning-circle":e,h=r||p,T=o?"colorTextNeutralDisabled":n?"colorTextNeutralReadonly":r?"colorTextDangerAlternative":"colorTextNeutralAlternative";return Y(V.ErrorText,u(i({ref:x,"aria-disabled":o,className:f("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",{"text-text-danger-alternative":r,"cursor-not-allowed":n,"cursor-not-allowed text-text-neutral-disabled":o,"text-text-neutral-readonly":n&&!o})},m),{children:[h&&A("div",{className:"flex items-center",children:A(I,{symbol:d,color:T,size:"tiny"})}),A("span",{className:"flex flex-1",children:t})]}))});R.displayName="InputTextHelperText";import{forwardRef as Z}from"react";import{jsx as k}from"react/jsx-runtime";var N=Z((c,x)=>{var a=c,{size:p,size:e="ml",disabled:t,readOnly:l,hasError:o,value:n,isActive:r}=a,m=s(a,["size","size","disabled","readOnly","hasError","value","isActive"]);return k("div",{className:f("input-text-clear-button",{"-mr-[6px]":e==="md","-mr-[8px]":e==="ml"||e==="lg"||e==="xl","invisible hidden":l||t||r||!n||!n.length}),"aria-disabled":t||l,children:k(b.Root,u(i({},m),{size:p||e,disabled:t||l,variant:"neutral-tertiary",className:f("!px-none",{"!h-medium !w-medium":e==="md","!h-mediumlarge !min-w-mediumlarge":e==="ml"||e==="lg"||e==="xl"}),children:k(b.Icon,{symbol:"rdicon-dismiss-circle-outline"})}))})});N.displayName="InputTextClearButton";import{ark as $}from"@ark-ui/react";import{forwardRef as j}from"react";import{jsx as C}from"react/jsx-runtime";var L=j((m,r)=>{var x=m,{color:p="colorTextNeutralDefault",symbol:e,size:t="ml",disabled:l,readOnly:o}=x,n=s(x,["color","symbol","size","disabled","readOnly"]);let c=(()=>{let d={md:"extra-small",ml:"small",lg:"small",xl:"small"};return d==null?void 0:d[t]})(),a=()=>l?"colorTextNeutralDisabled":o?"colorTextNeutralReadonly":"colorTextNeutralDefault";return C($.div,u(i({ref:r,className:"flex items-center"},n),{children:C(I,{symbol:e,color:a(),size:c})}))});L.displayName="InputTextIcon";export{F as a};
//# sourceMappingURL=chunk-IX55HYE2.js.map