carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 7.43 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../../__internal__/utils/helpers/tags/tags.js"),n=require("../../__internal__/input/input.component.js"),r=require("../../__internal__/input/input-presentation.component.js"),l=require("../../__internal__/form-field/form-field.component.js"),a=require("../../hooks/useCharacterCount/useCharacterCount.js"),o=require("../../__internal__/input-behaviour/input-behaviour.component.js"),d=require("../../__internal__/input-icon-toggle/input-icon-toggle.component.js"),s=require("../../__internal__/utils/helpers/guid/index.js"),u=require("./textarea.style.js"),c=require("../../__internal__/tooltip-provider/index.js"),p=require("../../hooks/__internal__/useInputAccessibility/useInputAccessibility.js"),b=require("../carbon-provider/__internal__/new-validation.context.js"),f=require("../textbox/textbox.style.js"),h=require("../../__internal__/validation-message/validation-message.component.js"),v=require("../box/box.component.js"),g=require("../../__internal__/utils/logger/index.js"),_=require("../../__internal__/hint-text/hint-text.component.js");require("../../style/utils/filter-styled-system-padding-props.js");var y=require("../../style/utils/filter-styled-system-margin-props.js");function j(e){return e&&e.__esModule?e:{default:e}}function m(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function x(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{},n=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(i).filter((function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable})))),n.forEach((function(t){m(e,t,i[t])}))}return e}let O=!1,I=!1;const w=j(t).default.forwardRef(((j,m)=>{var{"aria-labelledby":w,"aria-describedby":H,autoFocus:q,inputHint:T,fieldHelp:P,label:E,children:L,characterLimit:A,onChange:B,onFocus:R,onBlur:F,disabled:M=!1,labelInline:S,labelAlign:k,labelHelp:C,labelSpacing:D,inputIcon:W,id:N,error:G,warning:U,info:z,name:V,readOnly:$=!1,placeholder:J,expandable:K=!1,rows:Q,validationOnLabel:X=!1,adaptiveLabelBreakpoint:Y,inputWidth:Z,maxWidth:ee,labelWidth:te=30,tooltipPosition:ie,value:ne,"data-element":re,"data-role":le,helpAriaLabel:ae,borderRadius:oe,hideBorders:de=!1,required:se,isOptional:ue,minHeight:ce=u.DEFAULT_MIN_HEIGHT,validationMessagePositionTop:pe=!0}=j,be=function(e,t){if(null==e)return{};var i,n,r=function(e,t){if(null==e)return{};var i,n,r={},l=Object.keys(e);for(n=0;n<l.length;n++)i=l[n],t.indexOf(i)>=0||(r[i]=e[i]);return r}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(n=0;n<l.length;n++)i=l[n],t.indexOf(i)>=0||Object.prototype.propertyIsEnumerable.call(e,i)&&(r[i]=e[i])}return r}(j,["aria-labelledby","aria-describedby","autoFocus","inputHint","fieldHelp","label","children","characterLimit","onChange","onFocus","onBlur","disabled","labelInline","labelAlign","labelHelp","labelSpacing","inputIcon","id","error","warning","info","name","readOnly","placeholder","expandable","rows","validationOnLabel","adaptiveLabelBreakpoint","inputWidth","maxWidth","labelWidth","tooltipPosition","value","data-element","data-role","helpAriaLabel","borderRadius","hideBorders","required","isOptional","minHeight","validationMessagePositionTop"]);!O&&ue&&(O=!0,g.default.deprecate("`isOptional` is deprecated in TextArea and support will soon be removed. If the value of this component is not required, use the `required` prop and set it to false instead."));const{validationRedesignOptIn:fe}=t.useContext(b.default),he=!fe&&S,[ve,ge]=t.useState(u.DEFAULT_MIN_HEIGHT),_e=e=>fe?void 0:e,{current:ye}=t.useRef(N||s.default()),je=t.useRef(null),me=t.useCallback((e=>{je.current=e,m&&("current"in m?m.current=e:m(e))}),[m]),[xe,Oe]=t.useState("off");Array.isArray(oe)&&oe.length>4&&!I&&(g.default.warn("The `borderRadius` prop in `Textarea` component only supports up to 4 values."),I=!0);const Ie=t.useCallback((()=>{const e=je.current;if((null==e?void 0:e.scrollHeight)&&(null==e?void 0:e.scrollHeight)>ve){let t=e;for(;t&&!(null==t?void 0:t.scrollTop);)t=(null==t?void 0:t.parentElement)||null;const i=null==t?void 0:t.scrollTop;e.style.height="auto",e.style.height=`${Math.max(e.scrollHeight,ve)}px`,t&&i&&(t.scrollTop=i)}}),[ve]),{labelId:we,validationId:He,fieldHelpId:qe,ariaDescribedBy:Te}=p.default({id:ye,validationRedesignOptIn:fe,error:G,warning:U,info:z,label:E,fieldHelp:P}),[Pe,Ee]=a.default(ne,A,xe);t.useEffect((()=>{var e;ge(Q?(null==je||null===(e=je.current)||void 0===e?void 0:e.scrollHeight)||0:ce>u.DEFAULT_MIN_HEIGHT?ce:u.DEFAULT_MIN_HEIGHT)}),[ce,Q]),t.useEffect((()=>{K&&Ie()})),t.useEffect((()=>{var e,t;return K&&(window.addEventListener("resize",Ie),ge((null==je||null===(e=je.current)||void 0===e?void 0:e.clientHeight)||0),null===(t=document.fonts)||void 0===t||t.addEventListener("loadingdone",Ie)),()=>{var e;K&&(window.removeEventListener("resize",Ie),null===(e=document.fonts)||void 0===e||e.removeEventListener("loadingdone",Ie))}}),[Ie,K]);const Le=!!(W||He&&!X),Ae=t.useRef(s.default()),Be=T?Ae.current:void 0,Re=[...fe&&pe?[Te,Be]:[Be,Te],Ee,H].filter(Boolean).join(" "),Fe=e.jsxs(r.default,{disabled:M,readOnly:$,inputWidth:"number"==typeof Z?Z:100-te,maxWidth:ee,error:G,warning:U,info:z,borderRadius:oe,hideBorders:de,children:[e.jsx(n.default,x({"aria-invalid":!!G,"aria-labelledby":w,"aria-describedby":Re,autoFocus:q,name:V,value:ne,ref:me,onChange:B,onFocus:e=>{A&&Oe("polite"),null==R||R(e)},onBlur:e=>{A&&Oe("off"),null==F||F(e)},disabled:M,readOnly:$,placeholder:M?"":J,rows:Q,id:ye,as:"textarea",validationIconId:fe?void 0:He,inputBorderRadius:oe,required:se},be)),L,e.jsx(d.default,{disabled:M,readOnly:$,inputIcon:W,error:G,warning:U,info:z,validationIconId:fe?void 0:He,useValidationIcon:!(fe||X)})]}),Me=y.default(be);return e.jsx(c.TooltipProvider,{tooltipPosition:ie,helpAriaLabel:ae,children:e.jsx(o.InputBehaviour,{children:e.jsx(u.default,(Se=x({labelInline:he,hasIcon:Le,minHeight:ve},Me,i.default("textarea",{"data-element":re,"data-role":le})),ke={children:e.jsxs(l.default,{fieldHelp:_e(P),fieldHelpId:qe,error:G,warning:U,info:z,label:E,labelId:we,disabled:M,id:ye,labelInline:_e(he),labelAlign:k,labelWidth:_e(te),labelHelp:_e(C),labelSpacing:D,isRequired:se,useValidationIcon:_e(X),adaptiveLabelBreakpoint:Y,validationRedesignOptIn:fe,my:0,children:[(T||C&&fe)&&e.jsx(_.HintText,{align:k,id:Be,"data-element":"input-hint",children:T||C}),fe?e.jsxs(v.Box,{position:"relative",children:[pe&&e.jsxs(e.Fragment,{children:[e.jsx(h.default,{error:G,validationId:He,warning:U,validationMessagePositionTop:pe}),(G||U)&&e.jsx(f.default,{warning:!(G||!U)})]}),Fe,!pe&&e.jsxs(e.Fragment,{children:[e.jsx(h.default,{error:G,validationId:He,warning:U,validationMessagePositionTop:pe}),(G||U)&&e.jsx(f.default,{warning:!(G||!U)})]})]}):Fe,Pe]})},ke=null!=ke?ke:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Se,Object.getOwnPropertyDescriptors(ke)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t.push.apply(t,i)}return t}(Object(ke)).forEach((function(e){Object.defineProperty(Se,e,Object.getOwnPropertyDescriptor(ke,e))})),Se))})});var Se,ke}));w.displayName="Textarea",exports.OriginalTextarea=w,exports.Textarea=w,exports.default=w;