UNPKG

koval-ui

Version:

React components collection with minimalistic design. Supports theming, layout, and input validation.

3 lines (2 loc) 2.04 kB
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("react"),A=require("classnames"),D=require("css-vars-hook"),G=require("../../internal/inputs/ValidationProps.cjs"),J=require("../../internal/inputs/useValidation.cjs"),K=require("../../internal/inputs/useRevalidateOnFormChange.cjs"),Q=require("../../internal/inputs/useExternalValidation.cjs"),U=require("../../internal/inputs/useValidationIcon.cjs"),W=require("../../internal/hooks/useInternalId.cjs"),X=require("../../internal/hooks/useInternalRef.cjs"),s=require("./Textarea.module.css.cjs"),f=e.forwardRef(({prefix:i,className:I,placeholder:q="",disabled:V,value:b,onChange:d=()=>{},onFocus:p=()=>{},onBlur:R=()=>{},onKeyDown:g=()=>{},onKeyUp:j=()=>{},defaultValue:C,id:T,readOnly:o,cols:N=20,rows:k=3,resize:m="both",revalidateOnFormChange:y,validation:l,errorMessage:S,displayIcon:L=!0,...n},v)=>{const F=!!l||!!n.required||typeof n.maxLength=="number"||typeof n.minLength=="number",{validateTextual:r,validity:x,setValidity:u}=J.useValidation({validation:l,hasValidators:F}),c=X.useInternalRef(v);K.useRevalidateOnFormChange(c,r,y),Q.useExternalValidation({errorMessage:S,inputRef:c,setValidity:u,validation:l});const w=U.useValidationIcon(x),B=e.useCallback(a=>{d(a)},[d]),E=e.useCallback(()=>{u(G.ValidationState.error)},[u]),M=e.useCallback(a=>{r(a)},[r]),H=e.useCallback(a=>{o&&a.target.select()},[o]),h=W.useInternalId(T),{LocalRoot:O}=D.useLocalTheme(),_=e.useMemo(()=>({resize:m}),[m]);return t.jsxs(O,{theme:_,className:A(s.default.wrapper,I),children:[i&&t.jsx("label",{className:s.default.prefix,htmlFor:h,children:t.jsx(i,{})}),t.jsx("textarea",{...n,cols:N,rows:k,readOnly:o,id:h,placeholder:q,className:s.default.textarea,ref:c,disabled:V,value:b,defaultValue:C,onChange:B,onBlur:R,onFocus:p,onKeyUp:j,onKeyDown:g,onInvalid:E,onInput:M,onSelect:H}),L&&x&&t.jsx(w,{className:s.default.validation})]})});f.displayName="Textarea";exports.Textarea=f; //# sourceMappingURL=Textarea.cjs.map