carbon-components-svelte/assets/TextArea.c35347cd.js

let n=document.createElement("style");n.innerHTML="",document.head.appendChild(n);import{S as a,i as s,s as t,g as e,h as p,k as o,l,n as c,o as r,N as i,y as u,q as d,r as k,M as m,c as $,a as f,m as h,t as g,b as x,d as b,w as v,j as T,p as w,x as A,I as E,E as y,F as L,A as _,J as I,B as j,C as S,G as D,H,Y as C}from"./index.c2c9d961.js";import"./Button.37430222.js";import"./index.af83b04a.js";import{W as R,C as V,P as W}from"./Preview.4c9c0c28.js";import"./ChevronDown16.d70ae9ed.js";import"./Loading.8dea5962.js";import"./Column.2e03e551.js";import"./Content.94950662.js";import"./store.a9279dc1.js";function U(n){let a,s;return{c(){a=e("label"),s=p(n[8]),this.h()},l(t){a=o(t,"LABEL",{for:!0});var e=l(a);s=c(e,n[8]),e.forEach(r),this.h()},h(){i(a,"for",n[12]),u(a,"bx--label",!0),u(a,"bx--visually-hidden",n[9]),u(a,"bx--label--disabled",n[6])},m(n,t){d(n,a,t),k(a,s)},p(n,t){256&t&&m(s,n[8]),4096&t&&i(a,"for",n[12]),512&t&&u(a,"bx--visually-hidden",n[9]),64&t&&u(a,"bx--label--disabled",n[6])},d(n){n&&r(a)}}}function B(n){let a,s;return a=new R({props:{class:"bx--text-area__invalid-icon"}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function M(n){let a,s;return{c(){a=e("div"),s=p(n[7]),this.h()},l(t){a=o(t,"DIV",{});var e=l(a);s=c(e,n[7]),e.forEach(r),this.h()},h(){u(a,"bx--form__helper-text",!0),u(a,"bx--form__helper-text--disabled",n[6])},m(n,t){d(n,a,t),k(a,s)},p(n,t){128&t&&m(s,n[7]),64&t&&u(a,"bx--form__helper-text--disabled",n[6])},d(n){n&&r(a)}}}function O(n){let a,s;return{c(){a=e("div"),s=p(n[11]),this.h()},l(t){a=o(t,"DIV",{id:!0});var e=l(a);s=c(e,n[11]),e.forEach(r),this.h()},h(){i(a,"id",n[14]),u(a,"bx--form-requirement",!0)},m(n,t){d(n,a,t),k(a,s)},p(n,t){2048&t&&m(s,n[11]),16384&t&&i(a,"id",n[14])},d(n){n&&r(a)}}}function P(n){let a,s,t,p,c,m,$,f,h,b,j,S,D,H=n[8]&&!n[9]&&U(n),C=n[10]&&B(),R=[{"aria-invalid":m=n[10]||void 0},{"aria-describedby":$=n[10]?n[14]:void 0},{disabled:n[6]},{id:n[12]},{name:n[13]},{cols:n[3]},{rows:n[4]},{value:n[0]},{placeholder:n[2]},n[15]],V={};for(let n=0;n<R.length;n+=1)V=v(V,R[n]);let W=!n[10]&&n[7]&&M(n),P=n[10]&&O(n);return{c(){a=e("div"),H&&H.c(),s=T(),t=e("div"),C&&C.c(),p=T(),c=e("textarea"),h=T(),W&&W.c(),b=T(),P&&P.c(),this.h()},l(n){a=o(n,"DIV",{});var e=l(a);H&&H.l(e),s=w(e),t=o(e,"DIV",{"data-invalid":!0});var i=l(t);C&&C.l(i),p=w(i),c=o(i,"TEXTAREA",{"aria-invalid":!0,"aria-describedby":!0,disabled:!0,id:!0,name:!0,cols:!0,rows:!0,value:!0,placeholder:!0}),l(c).forEach(r),i.forEach(r),h=w(e),W&&W.l(e),b=w(e),P&&P.l(e),e.forEach(r),this.h()},h(){A(c,V),u(c,"bx--text-area",!0),u(c,"bx--text-area--light",n[5]),u(c,"bx--text-area--invalid",n[10]),i(t,"data-invalid",f=n[10]||void 0),u(t,"bx--text-area__wrapper",!0),u(a,"bx--form-item",!0)},m(e,o){d(e,a,o),H&&H.m(a,null),k(a,s),k(a,t),C&&C.m(t,null),k(t,p),k(t,c),n[24](c),k(a,h),W&&W.m(a,null),k(a,b),P&&P.m(a,null),j=!0,S||(D=[E(c,"change",n[20]),E(c,"input",n[21]),E(c,"input",n[25]),E(c,"focus",n[22]),E(c,"blur",n[23]),E(a,"click",n[16]),E(a,"mouseover",n[17]),E(a,"mouseenter",n[18]),E(a,"mouseleave",n[19])],S=!0)},p(n,[e]){n[8]&&!n[9]?H?H.p(n,e):(H=U(n),H.c(),H.m(a,s)):H&&(H.d(1),H=null),n[10]?C?1024&e&&g(C,1):(C=B(),C.c(),g(C,1),C.m(t,p)):C&&(y(),x(C,1,1,()=>{C=null}),L()),A(c,V=_(R,[(!j||1024&e&&m!==(m=n[10]||void 0))&&{"aria-invalid":m},(!j||17408&e&&$!==($=n[10]?n[14]:void 0))&&{"aria-describedby":$},(!j||64&e)&&{disabled:n[6]},(!j||4096&e)&&{id:n[12]},(!j||8192&e)&&{name:n[13]},(!j||8&e)&&{cols:n[3]},(!j||16&e)&&{rows:n[4]},(!j||1&e)&&{value:n[0]},(!j||4&e)&&{placeholder:n[2]},32768&e&&n[15]])),u(c,"bx--text-area",!0),u(c,"bx--text-area--light",n[5]),u(c,"bx--text-area--invalid",n[10]),(!j||1024&e&&f!==(f=n[10]||void 0))&&i(t,"data-invalid",f),!n[10]&&n[7]?W?W.p(n,e):(W=M(n),W.c(),W.m(a,b)):W&&(W.d(1),W=null),n[10]?P?P.p(n,e):(P=O(n),P.c(),P.m(a,null)):P&&(P.d(1),P=null)},i(n){j||(g(C),j=!0)},o(n){x(C),j=!1},d(s){s&&r(a),H&&H.d(),C&&C.d(),n[24](null),W&&W.d(),P&&P.d(),S=!1,I(D)}}}function q(n,a,s){const t=["value","placeholder","cols","rows","light","disabled","helperText","labelText","hideLabel","invalid","invalidText","id","name","ref"];let e=j(a,t),{value:p=""}=a,{placeholder:o=""}=a,{cols:l=50}=a,{rows:c=4}=a,{light:r=!1}=a,{disabled:i=!1}=a,{helperText:u=""}=a,{labelText:d=""}=a,{hideLabel:k=!1}=a,{invalid:m=!1}=a,{invalidText:$=""}=a,{id:f="ccs-"+Math.random().toString(36)}=a,{name:h}=a,{ref:g=null}=a;let x;return n.$$set=n=>{a=v(v({},a),S(n)),s(15,e=j(a,t)),"value"in n&&s(0,p=n.value),"placeholder"in n&&s(2,o=n.placeholder),"cols"in n&&s(3,l=n.cols),"rows"in n&&s(4,c=n.rows),"light"in n&&s(5,r=n.light),"disabled"in n&&s(6,i=n.disabled),"helperText"in n&&s(7,u=n.helperText),"labelText"in n&&s(8,d=n.labelText),"hideLabel"in n&&s(9,k=n.hideLabel),"invalid"in n&&s(10,m=n.invalid),"invalidText"in n&&s(11,$=n.invalidText),"id"in n&&s(12,f=n.id),"name"in n&&s(13,h=n.name),"ref"in n&&s(1,g=n.ref)},n.$$.update=()=>{4096&n.$$.dirty&&s(14,x="error-"+f)},[p,g,o,l,c,r,i,u,d,k,m,$,f,h,x,e,function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(n){H[n?"unshift":"push"](()=>{g=n,s(1,g)})},({target:n})=>{s(0,p=n.value)}]}class N extends a{constructor(n){super(),s(this,n,q,P,t,{value:0,placeholder:2,cols:3,rows:4,light:5,disabled:6,helperText:7,labelText:8,hideLabel:9,invalid:10,invalidText:11,id:12,name:13,ref:1})}}function F(n){let a;return{c(){a=e("span"),this.h()},l(n){a=o(n,"SPAN",{}),l(a).forEach(r),this.h()},h(){u(a,"bx--label",!0),u(a,"bx--skeleton",!0)},m(n,s){d(n,a,s)},d(n){n&&r(a)}}}function G(n){let a,s,t,p,c,i=!n[0]&&F(),m=[n[1]],$={};for(let n=0;n<m.length;n+=1)$=v($,m[n]);return{c(){a=e("div"),i&&i.c(),s=T(),t=e("div"),this.h()},l(n){a=o(n,"DIV",{});var e=l(a);i&&i.l(e),s=w(e),t=o(e,"DIV",{}),l(t).forEach(r),e.forEach(r),this.h()},h(){u(t,"bx--skeleton",!0),u(t,"bx--text-area",!0),A(a,$),u(a,"bx--form-item",!0)},m(e,o){d(e,a,o),i&&i.m(a,null),k(a,s),k(a,t),p||(c=[E(a,"click",n[2]),E(a,"mouseover",n[3]),E(a,"mouseenter",n[4]),E(a,"mouseleave",n[5])],p=!0)},p(n,[t]){n[0]?i&&(i.d(1),i=null):i||(i=F(),i.c(),i.m(a,s)),A(a,$=_(m,[2&t&&n[1]])),u(a,"bx--form-item",!0)},i:C,o:C,d(n){n&&r(a),i&&i.d(),p=!1,I(c)}}}function J(n,a,s){const t=["hideLabel"];let e=j(a,t),{hideLabel:p=!1}=a;return n.$$set=n=>{a=v(v({},a),S(n)),s(1,e=j(a,t)),"hideLabel"in n&&s(0,p=n.hideLabel)},[p,e,function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)},function(a){D(n,a)}]}class X extends a{constructor(n){super(),s(this,n,J,G,t,{hideLabel:0})}}function Y(n){let a,s;return a=new N({props:{labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function z(n){let a,s;return a=new N({props:{labelText:"App description",helperText:"A rich description helps us better recommend related products and services",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function K(n){let a,s;return a=new N({props:{hideLabel:!0,labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function Q(n){let a,s;return a=new N({props:{light:!0,labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function Z(n){let a,s;return a=new N({props:{rows:10,labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function nn(n){let a,s;return a=new N({props:{invalid:!0,invalidText:"Only plain text characters are allowed",labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function an(n){let a,s;return a=new N({props:{disabled:!0,labelText:"App description",placeholder:"Enter a description..."}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function sn(n){let a,s;return a=new X({}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function tn(n){let a,s;return a=new X({props:{hideLabel:!0}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p:C,i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}function en(n){let a,s,t,u,m,$,f,h,g,x,b,v,A,E,y,L,_,I,j,S,D,H,C,R,V,W,U,B,M,O,P,q,N,F,G,J,X,Y,z,K,Q,Z;return{c(){a=e("div"),s=e("ul"),t=e("li"),u=e("a"),m=p("Usage"),$=T(),f=e("ul"),h=e("li"),g=e("a"),x=p("Default"),b=T(),v=e("li"),A=e("a"),E=p("With helper text"),y=T(),L=e("li"),_=e("a"),I=p("Hidden label"),j=T(),S=e("li"),D=e("a"),H=p("Light variant"),C=T(),R=e("li"),V=e("a"),W=p("Custom rows"),U=T(),B=e("li"),M=e("a"),O=p("Invalid state"),P=T(),q=e("li"),N=e("a"),F=p("Disabled state"),G=T(),J=e("li"),X=e("a"),Y=p("Skeleton"),z=T(),K=e("li"),Q=e("a"),Z=p("Skeleton without label"),this.h()},l(n){a=o(n,"DIV",{slot:!0});var e=l(a);s=o(e,"UL",{class:!0});var p=l(s);t=o(p,"LI",{class:!0});var i=l(t);u=o(i,"A",{class:!0,href:!0});var d=l(u);m=c(d,"Usage"),d.forEach(r),$=w(i),f=o(i,"UL",{class:!0});var k=l(f);h=o(k,"LI",{class:!0});var T=l(h);g=o(T,"A",{class:!0,href:!0});var nn=l(g);x=c(nn,"Default"),nn.forEach(r),T.forEach(r),b=w(k),v=o(k,"LI",{class:!0});var an=l(v);A=o(an,"A",{class:!0,href:!0});var sn=l(A);E=c(sn,"With helper text"),sn.forEach(r),an.forEach(r),y=w(k),L=o(k,"LI",{class:!0});var tn=l(L);_=o(tn,"A",{class:!0,href:!0});var en=l(_);I=c(en,"Hidden label"),en.forEach(r),tn.forEach(r),j=w(k),S=o(k,"LI",{class:!0});var pn=l(S);D=o(pn,"A",{class:!0,href:!0});var on=l(D);H=c(on,"Light variant"),on.forEach(r),pn.forEach(r),C=w(k),R=o(k,"LI",{class:!0});var ln=l(R);V=o(ln,"A",{class:!0,href:!0});var cn=l(V);W=c(cn,"Custom rows"),cn.forEach(r),ln.forEach(r),U=w(k),B=o(k,"LI",{class:!0});var rn=l(B);M=o(rn,"A",{class:!0,href:!0});var un=l(M);O=c(un,"Invalid state"),un.forEach(r),rn.forEach(r),P=w(k),q=o(k,"LI",{class:!0});var dn=l(q);N=o(dn,"A",{class:!0,href:!0});var kn=l(N);F=c(kn,"Disabled state"),kn.forEach(r),dn.forEach(r),G=w(k),J=o(k,"LI",{class:!0});var mn=l(J);X=o(mn,"A",{class:!0,href:!0});var $n=l(X);Y=c($n,"Skeleton"),$n.forEach(r),mn.forEach(r),z=w(k),K=o(k,"LI",{class:!0});var fn=l(K);Q=o(fn,"A",{class:!0,href:!0});var hn=l(Q);Z=c(hn,"Skeleton without label"),hn.forEach(r),fn.forEach(r),k.forEach(r),i.forEach(r),p.forEach(r),e.forEach(r),this.h()},h(){i(u,"class","bx--link"),i(u,"href","#usage"),i(g,"class","bx--link"),i(g,"href","#default"),i(h,"class","bx--list__item"),i(A,"class","bx--link"),i(A,"href","#with-helper-text"),i(v,"class","bx--list__item"),i(_,"class","bx--link"),i(_,"href","#hidden-label"),i(L,"class","bx--list__item"),i(D,"class","bx--link"),i(D,"href","#light-variant"),i(S,"class","bx--list__item"),i(V,"class","bx--link"),i(V,"href","#custom-rows"),i(R,"class","bx--list__item"),i(M,"class","bx--link"),i(M,"href","#invalid-state"),i(B,"class","bx--list__item"),i(N,"class","bx--link"),i(N,"href","#disabled-state"),i(q,"class","bx--list__item"),i(X,"class","bx--link"),i(X,"href","#skeleton"),i(J,"class","bx--list__item"),i(Q,"class","bx--link"),i(Q,"href","#skeleton-without-label"),i(K,"class","bx--list__item"),i(f,"class","bx--list--unordered bx--list--nested"),i(t,"class","bx--list__item"),i(s,"class","bx--list--unordered"),i(a,"slot","aside")},m(n,e){d(n,a,e),k(a,s),k(s,t),k(t,u),k(u,m),k(t,$),k(t,f),k(f,h),k(h,g),k(g,x),k(f,b),k(f,v),k(v,A),k(A,E),k(f,y),k(f,L),k(L,_),k(_,I),k(f,j),k(f,S),k(S,D),k(D,H),k(f,C),k(f,R),k(R,V),k(V,W),k(f,U),k(f,B),k(B,M),k(M,O),k(f,P),k(f,q),k(q,N),k(N,F),k(f,G),k(f,J),k(J,X),k(X,Y),k(f,z),k(f,K),k(K,Q),k(Q,Z)},d(n){n&&r(a)}}}function pn(n){let a,s,t,u,m,v,A,E,y,L,_,I,j,S,D,H,C,R,V,U,B,M,O,P,q,N,F,G,J,X,en,pn,on,ln,cn,rn,un,dn,kn,mn,$n,fn,hn,gn,xn,bn;return u=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea labelText="App description" placeholder="Enter a description..." />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[Y]},$$scope:{ctx:n}}}),y=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  labelText="App description"\n  helperText="A rich description helps us better recommend related products and services"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">helperText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>A rich description helps us better recommend related products and services<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[z]},$$scope:{ctx:n}}}),S=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  hideLabel\n  labelText="App description"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">hideLabel</span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[K]},$$scope:{ctx:n}}}),V=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  light\n  labelText="App description"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">light</span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[Q]},$$scope:{ctx:n}}}),P=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  rows={10}\n  labelText="App description"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">rows=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token number">10</span><span class="token punctuation">}</span></span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[Z]},$$scope:{ctx:n}}}),J=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  invalid\n  invalidText="Only plain text characters are allowed"\n  labelText="App description"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">invalid</span>\n  <span class="token attr-name">invalidText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Only plain text characters are allowed<span class="token punctuation">"</span></span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[nn]},$$scope:{ctx:n}}}),ln=new W({props:{codeRaw:'<script>\n  import { TextArea } from "carbon-components-svelte";\n<\/script>\n\n<TextArea\n  disabled\n  labelText="App description"\n  placeholder="Enter a description..."\n/>\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextArea <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextArea</span>\n  <span class="token attr-name">disabled</span>\n  <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>App description<span class="token punctuation">"</span></span>\n  <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Enter a description...<span class="token punctuation">"</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[an]},$$scope:{ctx:n}}}),kn=new W({props:{codeRaw:'<script>\n  import { TextAreaSkeleton } from "carbon-components-svelte";\n<\/script>\n\n<TextAreaSkeleton />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextAreaSkeleton <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextAreaSkeleton</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[sn]},$$scope:{ctx:n}}}),gn=new W({props:{codeRaw:'<script>\n  import { TextAreaSkeleton } from "carbon-components-svelte";\n<\/script>\n\n<TextAreaSkeleton hideLabel />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n  <span class="token keyword">import</span> <span class="token punctuation">{</span> TextAreaSkeleton <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextAreaSkeleton</span> <span class="token attr-name">hideLabel</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[tn]},$$scope:{ctx:n}}}),{c(){a=e("h3"),s=p("Default"),t=T(),$(u.$$.fragment),m=T(),v=e("h3"),A=p("With helper text"),E=T(),$(y.$$.fragment),L=T(),_=e("h3"),I=p("Hidden label"),j=T(),$(S.$$.fragment),D=T(),H=e("h3"),C=p("Light variant"),R=T(),$(V.$$.fragment),U=T(),B=e("h3"),M=p("Custom rows"),O=T(),$(P.$$.fragment),q=T(),N=e("h3"),F=p("Invalid state"),G=T(),$(J.$$.fragment),X=T(),en=e("h3"),pn=p("Disabled state"),on=T(),$(ln.$$.fragment),cn=T(),rn=e("h3"),un=p("Skeleton"),dn=T(),$(kn.$$.fragment),mn=T(),$n=e("h3"),fn=p("Skeleton without label"),hn=T(),$(gn.$$.fragment),xn=T(),this.h()},l(n){a=o(n,"H3",{id:!0});var e=l(a);s=c(e,"Default"),e.forEach(r),t=w(n),f(u.$$.fragment,n),m=w(n),v=o(n,"H3",{id:!0});var p=l(v);A=c(p,"With helper text"),p.forEach(r),E=w(n),f(y.$$.fragment,n),L=w(n),_=o(n,"H3",{id:!0});var i=l(_);I=c(i,"Hidden label"),i.forEach(r),j=w(n),f(S.$$.fragment,n),D=w(n),H=o(n,"H3",{id:!0});var d=l(H);C=c(d,"Light variant"),d.forEach(r),R=w(n),f(V.$$.fragment,n),U=w(n),B=o(n,"H3",{id:!0});var k=l(B);M=c(k,"Custom rows"),k.forEach(r),O=w(n),f(P.$$.fragment,n),q=w(n),N=o(n,"H3",{id:!0});var $=l(N);F=c($,"Invalid state"),$.forEach(r),G=w(n),f(J.$$.fragment,n),X=w(n),en=o(n,"H3",{id:!0});var h=l(en);pn=c(h,"Disabled state"),h.forEach(r),on=w(n),f(ln.$$.fragment,n),cn=w(n),rn=o(n,"H3",{id:!0});var g=l(rn);un=c(g,"Skeleton"),g.forEach(r),dn=w(n),f(kn.$$.fragment,n),mn=w(n),$n=o(n,"H3",{id:!0});var x=l($n);fn=c(x,"Skeleton without label"),x.forEach(r),hn=w(n),f(gn.$$.fragment,n),xn=w(n),this.h()},h(){i(a,"id","default"),i(v,"id","with-helper-text"),i(_,"id","hidden-label"),i(H,"id","light-variant"),i(B,"id","custom-rows"),i(N,"id","invalid-state"),i(en,"id","disabled-state"),i(rn,"id","skeleton"),i($n,"id","skeleton-without-label")},m(n,e){d(n,a,e),k(a,s),d(n,t,e),h(u,n,e),d(n,m,e),d(n,v,e),k(v,A),d(n,E,e),h(y,n,e),d(n,L,e),d(n,_,e),k(_,I),d(n,j,e),h(S,n,e),d(n,D,e),d(n,H,e),k(H,C),d(n,R,e),h(V,n,e),d(n,U,e),d(n,B,e),k(B,M),d(n,O,e),h(P,n,e),d(n,q,e),d(n,N,e),k(N,F),d(n,G,e),h(J,n,e),d(n,X,e),d(n,en,e),k(en,pn),d(n,on,e),h(ln,n,e),d(n,cn,e),d(n,rn,e),k(rn,un),d(n,dn,e),h(kn,n,e),d(n,mn,e),d(n,$n,e),k($n,fn),d(n,hn,e),h(gn,n,e),d(n,xn,e),bn=!0},p(n,a){const s={};1&a&&(s.$$scope={dirty:a,ctx:n}),u.$set(s);const t={};1&a&&(t.$$scope={dirty:a,ctx:n}),y.$set(t);const e={};1&a&&(e.$$scope={dirty:a,ctx:n}),S.$set(e);const p={};1&a&&(p.$$scope={dirty:a,ctx:n}),V.$set(p);const o={};1&a&&(o.$$scope={dirty:a,ctx:n}),P.$set(o);const l={};1&a&&(l.$$scope={dirty:a,ctx:n}),J.$set(l);const c={};1&a&&(c.$$scope={dirty:a,ctx:n}),ln.$set(c);const r={};1&a&&(r.$$scope={dirty:a,ctx:n}),kn.$set(r);const i={};1&a&&(i.$$scope={dirty:a,ctx:n}),gn.$set(i)},i(n){bn||(g(u.$$.fragment,n),g(y.$$.fragment,n),g(S.$$.fragment,n),g(V.$$.fragment,n),g(P.$$.fragment,n),g(J.$$.fragment,n),g(ln.$$.fragment,n),g(kn.$$.fragment,n),g(gn.$$.fragment,n),bn=!0)},o(n){x(u.$$.fragment,n),x(y.$$.fragment,n),x(S.$$.fragment,n),x(V.$$.fragment,n),x(P.$$.fragment,n),x(J.$$.fragment,n),x(ln.$$.fragment,n),x(kn.$$.fragment,n),x(gn.$$.fragment,n),bn=!1},d(n){n&&r(a),n&&r(t),b(u,n),n&&r(m),n&&r(v),n&&r(E),b(y,n),n&&r(L),n&&r(_),n&&r(j),b(S,n),n&&r(D),n&&r(H),n&&r(R),b(V,n),n&&r(U),n&&r(B),n&&r(O),b(P,n),n&&r(q),n&&r(N),n&&r(G),b(J,n),n&&r(X),n&&r(en),n&&r(on),b(ln,n),n&&r(cn),n&&r(rn),n&&r(dn),b(kn,n),n&&r(mn),n&&r($n),n&&r(hn),b(gn,n),n&&r(xn)}}}function on(n){let a,s;return a=new V({props:{$$slots:{default:[pn],aside:[en]},$$scope:{ctx:n}}}),{c(){$(a.$$.fragment)},l(n){f(a.$$.fragment,n)},m(n,t){h(a,n,t),s=!0},p(n,[s]){const t={};1&s&&(t.$$scope={dirty:s,ctx:n}),a.$set(t)},i(n){s||(g(a.$$.fragment,n),s=!0)},o(n){x(a.$$.fragment,n),s=!1},d(n){b(a,n)}}}export default class extends a{constructor(n){super(),s(this,n,null,on,t,{})}}