@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS
3 lines • 5.13 kB
JavaScript
'use client';
import{a}from"./chunk-UQJAQAHD.js";import{e as D}from"./chunk-CAYEOXAV.js";import{a as $}from"./chunk-HTOKQYVM.js";import{b as e}from"./chunk-CMFNILWJ.js";import{a as l,b as T}from"./chunk-XYM7TA65.js";import{Label as ee}from"@radix-ui/react-label";import{forwardRef as ae,useId as re}from"react";import o from"lodash/fp/isEmpty";import G from"lodash/fp/isFunction";import te from"lodash/fp/isNil";import U from"lodash/fp/omit";import{jsx as d,jsxs as F}from"react/jsx-runtime";var X=ae(({autoFocus:j=!1,button:r={},defaultValue:E,description:M,disabled:s=!1,error:v,extraSmall:z=!1,fullWidth:b=!1,id:J,label:C,name:K,onButtonClick:Q,onChange:L,placeholder:Y,prefix:h,readOnly:n=!1,required:_=!1,selectOnFocus:Z=!0,success:g,suffix:x,type:y="text",value:V,withButton:t=!1,withSpinButton:W=!1,...c},O)=>{let R=re(),k=(J??R)||R,N=!o(v),i=N||v===!0,I=!o(g),f=(I||g===!0)&&!i,P=p=>{G(L)&&L(p,p.target.value)},B=p=>{G(c.onFocus)&&c.onFocus(p),Z&&p.target&&p.target.select()},u=c.inputMode??"text";switch(y){case"email":{u="email";break}case"number":{u="decimal";break}case"search":{u="search";break}case"tel":{u="tel";break}case"url":{u="url";break}default:break}let m=!s&&!n,H=!!h,q=!!x,S="flex max-w-full absolute top-1/2 -translate-y-1/2 w-fit",w=te(r?.disabled)?s||n:r.disabled,A=t&&d(D,{className:T("rounded-0 border-1 border-l-0 hover:bg-primary hover:text-dark focus:bg-primary focus:text-dark active:border-l-0 active:!border-black active:shadow-hover",w?"border-disabled hover:bg-disabled hover:text-light focus:bg-disabled focus:text-light active:border-1 active:border-l-0 active:!border-disabled active:shadow-none":"",(s||n)&&!w?"border-l-1 active:border-l-1":"",r?.position==="left"?"rounded-l-full":"rounded-r-full",r?.className),disabled:w,variant:"primary",onClick:Q,...U(["variant","onClick","className","position","disabled"],r)});return F("div",{className:T(`${e}-${a}`,"flex w-full max-w-full flex-col gap-1 text-dark",`${e}-${a}--${m?"":"not-"}-writable`,s?`${e}-${a}--disabled`:"",n&&!s?"cursor-default":"",b?`${e}-${a}--full-width`:"sm:w-fit",i?`${e}-${a}--with-error`:"",!o(h)||!o(x)?`${e}-${a}--with-addendum`:"",o(h)?"":`${e}-${a}--with-prefix`,o(x)?"":`${e}-${a}--with-suffix`,n?`${e}-${a}--readonly`:"",_?`${e}-${a}--required`:"",f?`${e}-${a}--with-success`:"",c.className),children:[o(C)?!1:d(ee,{asChild:!0,className:l(`${e}-${a}__label`,"text-dark",s?`${e}-${a}__label--disabled cursor-default`:"cursor-pointer",_?`${e}-${a}__label--required after:text-feedback-danger-50 after:content-required`:""),htmlFor:k,children:d($,{element:"label",children:C})}),F($,{className:l(`${e}-${a}__wrapper`,"w-full max-w-full",b?"":"sm:w-fit",t?"flex":""),element:"div",children:[t&&r?.position==="left"&&A,F("div",{className:l(`${e}-${a}__icon-wrapper`,"relative",b?"w-full":""),children:[H&&d("div",{className:l(`${e}-${a}__addendum ${e}-${a}__addendum--prefix`,S,m?"":"text-disabled",t?"left-2":"left-1"),children:h}),d("input",{autoFocus:j,className:l(`${e}-${a}__input`,"box-border h-6 max-h-6 w-full min-w-6 max-w-full border-1 px-2 py-1 text-left outline-none transition-border-color duration-300 ease-out placeholder:text-placeholder",z?"to-sm:min-w-5 to-sm:px-1":"",t?`${e}-${a}__input--with-button ${e}-${a}__input--with-button--${r?.position??"right"}`:"rounded-sm",t&&r?.position==="left"?"rounded-r-full":"",t&&(o(r?.position)||r?.position==="right")?"rounded-l-full":"",m?`${e}-${a}__input--writable bg-white hover:border-normal hover:shadow-hover focus:border-primary focus:shadow-primary [&:is([data-state="open"])]:bg-primary [&:is([data-state="open"])]:shadow-primary`:`${e}-${a}__input--not-writable border-disabled bg-disabled-light placeholder:text-transparent`,s?`${e}-${a}__input--disabled cursor-not-allowed text-disabled`:"text-dark",n&&!s?`${e}-${a}__input--readonly cursor-default`:"",b?`${e}-${a}__input--full-width w-full`:"sm:w-unset",i?`${e}-${a}__input--with-error border-error shadow-error`:"",f?`${e}-${a}__input--with-success border-success shadow-success`:"",m&&!i&&!f?"border-normal":"",H?t?"pl-6":"pl-5":"",q?t?"pr-6":"pr-5":"",_?`${e}-${a}--required`:"",W?"":"[appearance:textfield] [&::-webkit-inner-spin-button]:hidden [&::-webkit-outer-spin-button]:hidden",t&&w&&m?"border-r-disabled":""),disabled:s,...E===void 0?{}:{defaultValue:E},id:k,ref:O,inputMode:u,name:K||k,pattern:c.pattern??y==="number"?"[0-9]*":void 0,placeholder:Y,readOnly:n,required:_,type:y,value:V,onChange:P,onFocus:B,...U(["className","onFocus"],c)}),q&&d("div",{className:l(`${e}-${a}__addendum ${e}-${a}__addendum--suffix`,S,"right-1",!m&&!i&&!f?"text-disabled":"",i?"text-error":"",f?"text-success":""),children:x})]}),t&&(o(r?.position)||r?.position==="right")&&A]}),!o(M)&&!N&&!I&&d($,{className:l(`${e}-${a}__description`,"cursor-default text-dark"),element:"div",variant:"caption-median",children:M}),(N||I)&&d($,{className:l(`${e}-${a}__message ${e}-${a}__message--${i?"error":"success"}`,"cursor-default text-dark"),element:"div",variant:"caption-median",children:i?v:g})]})});X.displayName="InputText";var $e=X;export{X as a,$e as b};
//# sourceMappingURL=chunk-2VC6MRRO.js.map