carbon-components-svelte/assets/Dropdown.96fbc715.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 i,N as r,y as u,q as d,r as k,M as m,w as $,j as x,c as f,p as g,a as h,x as b,m as v,I as w,A as _,t as y,b as E,d as I,B as T,C as D,D as S,E as j,F as C,J as L,H as F,Z as A,_ as W,Y as z,G as H}from"./index.c2c9d961.js";import"./Button.37430222.js";import"./index.af83b04a.js";import{W as N,C as U,P as B}from"./Preview.4c9c0c28.js";import{L as M,a as R,b as V,c as P}from"./ListBoxMenuItem.266f0ae0.js";import"./ChevronDown16.d70ae9ed.js";import"./Loading.8dea5962.js";import"./Column.2e03e551.js";import"./Content.94950662.js";import"./store.a9279dc1.js";function q(n,a,s){const t=n.slice();return t[31]=a[s],t[33]=s,t}function G(n){let a,s;return{c(){a=e("label"),s=p(n[10]),this.h()},l(t){a=o(t,"LABEL",{for:!0});var e=l(a);s=c(e,n[10]),e.forEach(i),this.h()},h(){r(a,"for",n[16]),u(a,"bx--label",!0),u(a,"bx--label--disabled",n[9])},m(n,t){d(n,a,t),k(a,s)},p(n,t){1024&t[0]&&m(s,n[10]),65536&t[0]&&r(a,"for",n[16]),512&t[0]&&u(a,"bx--label--disabled",n[9])},d(n){n&&i(a)}}}function J(n){let a,s;return a=new N({props:{class:"bx--list-box__invalid-icon"}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function O(n){let a;return{c(){a=p(n[14])},l(s){a=c(s,n[14])},m(n,s){d(n,a,s)},p(n,s){16384&s[0]&&m(a,n[14])},d(n){n&&i(a)}}}function Y(n){let a,s=n[5](n[20])+"";return{c(){a=p(s)},l(n){a=c(n,s)},m(n,s){d(n,a,s)},p(n,t){1048608&t[0]&&s!==(s=n[5](n[20])+"")&&m(a,s)},d(n){n&&i(a)}}}function Z(n){let a,s;return a=new V({props:{"aria-labelledby":n[16],id:n[16],$$slots:{default:[X]},$$scope:{ctx:n}}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p(n,s){const t={};65536&s[0]&&(t["aria-labelledby"]=n[16]),65536&s[0]&&(t.id=n[16]),786481&s[0]|8&s[1]&&(t.$$scope={dirty:s,ctx:n}),a.$set(t)},i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function K(n){let a,s,t=n[5](n[31])+"";return{c(){a=p(t),s=x()},l(n){a=c(n,t),s=g(n)},m(n,t){d(n,a,t),d(n,s,t)},p(n,s){48&s[0]&&t!==(t=n[5](n[31])+"")&&m(a,t)},d(n){n&&i(a),n&&i(s)}}}function Q(n,a){let s,t,e;return t=new P({props:{id:a[31].id,active:a[0]===a[33]||a[18]===a[31].id,highlighted:a[19]===a[33]||a[0]===a[33],$$slots:{default:[K]},$$scope:{ctx:a}}}),t.$on("click",(function(...n){return a[28](a[31],a[33],...n)})),t.$on("mouseenter",(function(...n){return a[29](a[33],...n)})),{key:n,first:null,c(){s=S(),f(t.$$.fragment),this.h()},l(n){s=S(),h(t.$$.fragment,n),this.h()},h(){this.first=s},m(n,a){d(n,s,a),v(t,n,a),e=!0},p(n,s){a=n;const e={};16&s[0]&&(e.id=a[31].id),262161&s[0]&&(e.active=a[0]===a[33]||a[18]===a[31].id),524305&s[0]&&(e.highlighted=a[19]===a[33]||a[0]===a[33]),48&s[0]|8&s[1]&&(e.$$scope={dirty:s,ctx:a}),t.$set(e)},i(n){e||(y(t.$$.fragment,n),e=!0)},o(n){E(t.$$.fragment,n),e=!1},d(n){n&&i(s),I(t,n)}}}function X(n){let a,s,t=[],e=new Map,p=n[4];const o=n=>n[31].id||n[33];for(let a=0;a<p.length;a+=1){let s=q(n,p,a),l=o(s);e.set(l,t[a]=Q(l,s))}return{c(){for(let n=0;n<t.length;n+=1)t[n].c();a=S()},l(n){for(let a=0;a<t.length;a+=1)t[a].l(n);a=S()},m(n,e){for(let a=0;a<t.length;a+=1)t[a].m(n,e);d(n,a,e),s=!0},p(n,s){if(786481&s[0]){const p=n[4];j(),t=A(t,s,o,1,n,p,e,a.parentNode,W,Q,a,q),C()}},i(n){if(!s){for(let n=0;n<p.length;n+=1)y(t[n]);s=!0}},o(n){for(let n=0;n<t.length;n+=1)E(t[n]);s=!1},d(n){for(let a=0;a<t.length;a+=1)t[a].d(n);n&&i(a)}}}function nn(n){let a,s,t,p,c,m,$,b,_,T,D=n[11]&&J();function F(n,a){return n[20]?Y:O}let A=F(n),W=A(n);c=new R({props:{open:n[1],translateWithId:n[15]}});let z=n[1]&&Z(n);return{c(){D&&D.c(),a=x(),s=e("button"),t=e("span"),W.c(),p=x(),f(c.$$.fragment),m=x(),z&&z.c(),$=S(),this.h()},l(n){D&&D.l(n),a=g(n),s=o(n,"BUTTON",{tabindex:!0,role:!0,"aria-expanded":!0,disabled:!0,translateWithId:!0,id:!0});var e=l(s);t=o(e,"SPAN",{class:!0});var r=l(t);W.l(r),r.forEach(i),p=g(e),h(c.$$.fragment,e),e.forEach(i),m=g(n),z&&z.l(n),$=S(),this.h()},h(){r(t,"class","bx--list-box__label"),r(s,"tabindex","0"),r(s,"role","button"),r(s,"aria-expanded",n[1]),s.disabled=n[9],r(s,"translatewithid",n[15]),r(s,"id",n[16]),u(s,"bx--list-box__field",!0)},m(e,o){D&&D.m(e,o),d(e,a,o),d(e,s,o),k(s,t),W.m(t,null),k(s,p),v(c,s,null),n[25](s),d(e,m,o),z&&z.m(e,o),d(e,$,o),b=!0,_||(T=[w(s,"keydown",n[26]),w(s,"blur",n[27])],_=!0)},p(n,e){n[11]?D?2048&e[0]&&y(D,1):(D=J(),D.c(),y(D,1),D.m(a.parentNode,a)):D&&(j(),E(D,1,1,()=>{D=null}),C()),A===(A=F(n))&&W?W.p(n,e):(W.d(1),W=A(n),W&&(W.c(),W.m(t,null)));const p={};2&e[0]&&(p.open=n[1]),32768&e[0]&&(p.translateWithId=n[15]),c.$set(p),(!b||2&e[0])&&r(s,"aria-expanded",n[1]),(!b||512&e[0])&&(s.disabled=n[9]),(!b||32768&e[0])&&r(s,"translatewithid",n[15]),(!b||65536&e[0])&&r(s,"id",n[16]),n[1]?z?(z.p(n,e),2&e[0]&&y(z,1)):(z=Z(n),z.c(),y(z,1),z.m($.parentNode,$)):z&&(j(),E(z,1,1,()=>{z=null}),C())},i(n){b||(y(D),y(c.$$.fragment,n),y(z),b=!0)},o(n){E(D),E(c.$$.fragment,n),E(z),b=!1},d(t){D&&D.d(t),t&&i(a),t&&i(s),W.d(),I(c),n[25](null),t&&i(m),z&&z.d(t),t&&i($),_=!1,L(T)}}}function an(n){let a,s;return{c(){a=e("div"),s=p(n[13]),this.h()},l(t){a=o(t,"DIV",{});var e=l(a);s=c(e,n[13]),e.forEach(i),this.h()},h(){u(a,"bx--form__helper-text",!0),u(a,"bx--form__helper-text--disabled",n[9])},m(n,t){d(n,a,t),k(a,s)},p(n,t){8192&t[0]&&m(s,n[13]),512&t[0]&&u(a,"bx--form__helper-text--disabled",n[9])},d(n){n&&i(a)}}}function sn(n){let a,s,t,p,c,r,m,T,D=n[10]&&G(n);p=new M({props:{type:n[6],size:n[7],id:n[16],name:n[17],"aria-label":n[23]["aria-label"],class:"bx--dropdown "+(n[11]&&"bx--dropdown--invalid")+"\n      "+(n[1]&&"bx--dropdown--open")+"\n      "+(n[2]&&"bx--dropdown--inline")+"\n      "+(n[9]&&"bx--dropdown--disabled")+"\n      "+(n[8]&&"bx--dropdown--light"),disabled:n[9],open:n[1],invalid:n[11],invalidText:n[12],light:n[8],$$slots:{default:[nn]},$$scope:{ctx:n}}}),p.$on("click",n[30]);let S=!n[2]&&!n[11]&&n[13]&&an(n),j=[n[22]],C={};for(let n=0;n<j.length;n+=1)C=$(C,j[n]);return{c(){a=x(),s=e("div"),D&&D.c(),t=x(),f(p.$$.fragment),c=x(),S&&S.c(),this.h()},l(n){a=g(n),s=o(n,"DIV",{});var e=l(s);D&&D.l(e),t=g(e),h(p.$$.fragment,e),c=g(e),S&&S.l(e),e.forEach(i),this.h()},h(){b(s,C),u(s,"bx--dropdown__wrapper",!0),u(s,"bx--list-box__wrapper",!0),u(s,"bx--dropdown__wrapper--inline",n[2]),u(s,"bx--list-box__wrapper--inline",n[2]),u(s,"bx--dropdown__wrapper--inline--invalid",n[2]&&n[11])},m(e,o){d(e,a,o),d(e,s,o),D&&D.m(s,null),k(s,t),v(p,s,null),k(s,c),S&&S.m(s,null),r=!0,m||(T=w(document.body,"click",n[24]),m=!0)},p(n,a){n[10]?D?D.p(n,a):(D=G(n),D.c(),D.m(s,t)):D&&(D.d(1),D=null);const e={};64&a[0]&&(e.type=n[6]),128&a[0]&&(e.size=n[7]),65536&a[0]&&(e.id=n[16]),131072&a[0]&&(e.name=n[17]),8388608&a[0]&&(e["aria-label"]=n[23]["aria-label"]),2822&a[0]&&(e.class="bx--dropdown "+(n[11]&&"bx--dropdown--invalid")+"\n      "+(n[1]&&"bx--dropdown--open")+"\n      "+(n[2]&&"bx--dropdown--inline")+"\n      "+(n[9]&&"bx--dropdown--disabled")+"\n      "+(n[8]&&"bx--dropdown--light")),512&a[0]&&(e.disabled=n[9]),2&a[0]&&(e.open=n[1]),2048&a[0]&&(e.invalid=n[11]),4096&a[0]&&(e.invalidText=n[12]),256&a[0]&&(e.light=n[8]),1952315&a[0]|8&a[1]&&(e.$$scope={dirty:a,ctx:n}),p.$set(e),n[2]||n[11]||!n[13]?S&&(S.d(1),S=null):S?S.p(n,a):(S=an(n),S.c(),S.m(s,null)),b(s,C=_(j,[4194304&a[0]&&n[22]])),u(s,"bx--dropdown__wrapper",!0),u(s,"bx--list-box__wrapper",!0),u(s,"bx--dropdown__wrapper--inline",n[2]),u(s,"bx--list-box__wrapper--inline",n[2]),u(s,"bx--dropdown__wrapper--inline--invalid",n[2]&&n[11])},i(n){r||(y(p.$$.fragment,n),r=!0)},o(n){E(p.$$.fragment,n),r=!1},d(n){n&&i(a),n&&i(s),D&&D.d(),I(p),S&&S.d(),m=!1,T()}}}function tn(n,a,s){const t=["items","itemToString","selectedIndex","type","size","open","inline","light","disabled","titleText","invalid","invalidText","helperText","label","translateWithId","id","name","ref"];let e=T(a,t),{items:p=[]}=a,{itemToString:o=(n=>n.text||n.id)}=a,{selectedIndex:l=-1}=a,{type:c="default"}=a,{size:i}=a,{open:r=!1}=a,{inline:u=!1}=a,{light:d=!1}=a,{disabled:k=!1}=a,{titleText:m=""}=a,{invalid:x=!1}=a,{invalidText:f=""}=a,{helperText:g=""}=a,{label:h}=a,{translateWithId:b}=a,{id:v="ccs-"+Math.random().toString(36)}=a,{name:w}=a,{ref:_=null}=a,y=void 0,E=-1;function I(n){let a=E+n;a<0?a=p.length-1:a>=p.length&&(a=0),s(19,E=a)}let S;return n.$$set=n=>{s(23,a=$($({},a),D(n))),s(22,e=T(a,t)),"items"in n&&s(4,p=n.items),"itemToString"in n&&s(5,o=n.itemToString),"selectedIndex"in n&&s(0,l=n.selectedIndex),"type"in n&&s(6,c=n.type),"size"in n&&s(7,i=n.size),"open"in n&&s(1,r=n.open),"inline"in n&&s(2,u=n.inline),"light"in n&&s(8,d=n.light),"disabled"in n&&s(9,k=n.disabled),"titleText"in n&&s(10,m=n.titleText),"invalid"in n&&s(11,x=n.invalid),"invalidText"in n&&s(12,f=n.invalidText),"helperText"in n&&s(13,g=n.helperText),"label"in n&&s(14,h=n.label),"translateWithId"in n&&s(15,b=n.translateWithId),"id"in n&&s(16,v=n.id),"name"in n&&s(17,w=n.name),"ref"in n&&s(3,_=n.ref)},n.$$.update=()=>{64&n.$$.dirty[0]&&s(2,u="inline"===c),17&n.$$.dirty[0]&&s(20,S=p[l]),2&n.$$.dirty[0]&&(r||s(19,E=-1))},a=D(a),[l,r,u,_,p,o,c,i,d,k,m,x,f,g,h,b,v,w,y,E,S,I,e,a,({target:n})=>{r&&_&&!_.contains(n)&&s(1,r=!1)},function(n){F[n?"unshift":"push"](()=>{_=n,s(3,_)})},({key:n})=>{"Enter"===n?(s(1,r=!r),E>-1&&E!==l&&(s(0,l=E),s(1,r=!1))):"Tab"===n?(s(1,r=!1),_.blur()):"ArrowDown"===n?I(1):"ArrowUp"===n&&I(-1)},({relatedTarget:n})=>{n&&_.focus()},(n,a)=>{s(18,y=n.id),s(0,l=a)},n=>{s(19,E=n)},({target:n})=>{s(1,r=!!_.contains(n)&&!r)}]}class en extends a{constructor(n){super(),s(this,n,tn,sn,t,{items:4,itemToString:5,selectedIndex:0,type:6,size:7,open:1,inline:2,light:8,disabled:9,titleText:10,invalid:11,invalidText:12,helperText:13,label:14,translateWithId:15,id:16,name:17,ref:3},[-1,-1])}}function pn(n){let a,s,t,p,c,m=[n[1]],x={};for(let n=0;n<m.length;n+=1)x=$(x,m[n]);return{c(){a=e("div"),s=e("div"),t=e("span"),this.h()},l(n){a=o(n,"DIV",{});var e=l(a);s=o(e,"DIV",{role:!0});var p=l(s);t=o(p,"SPAN",{}),l(t).forEach(i),p.forEach(i),e.forEach(i),this.h()},h(){u(t,"bx--list-box__label",!0),r(s,"role","button"),u(s,"bx--list-box__field",!0),b(a,x),u(a,"bx--skeleton",!0),u(a,"bx--dropdown-v2",!0),u(a,"bx--list-box",!0),u(a,"bx--form-item",!0),u(a,"bx--list-box--inline",n[0])},m(e,o){d(e,a,o),k(a,s),k(s,t),p||(c=[w(a,"click",n[2]),w(a,"mouseover",n[3]),w(a,"mouseenter",n[4]),w(a,"mouseleave",n[5])],p=!0)},p(n,[s]){b(a,x=_(m,[2&s&&n[1]])),u(a,"bx--skeleton",!0),u(a,"bx--dropdown-v2",!0),u(a,"bx--list-box",!0),u(a,"bx--form-item",!0),u(a,"bx--list-box--inline",n[0])},i:z,o:z,d(n){n&&i(a),p=!1,L(c)}}}function on(n,a,s){const t=["inline"];let e=T(a,t),{inline:p=!1}=a;return n.$$set=n=>{a=$($({},a),D(n)),s(1,e=T(a,t)),"inline"in n&&s(0,p=n.inline)},[p,e,function(a){H(n,a)},function(a){H(n,a)},function(a){H(n,a)},function(a){H(n,a)}]}class ln extends a{constructor(n){super(),s(this,n,on,pn,t,{inline:0})}}function cn(n){let a,s;return a=new en({props:{titleText:"Contact",selectedIndex:0,items:[{id:"0",text:"Slack"},{id:"1",text:"Email"},{id:"2",text:"Fax"}]}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p:z,i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function rn(n){let a,s;return a=new en({props:{light:!0,titleText:"Contact",selectedIndex:0,items:[{id:"0",text:"Slack"},{id:"1",text:"Email"},{id:"2",text:"Fax"}]}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p:z,i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function un(n){let a,s;return a=new en({props:{type:"inline",titleText:"Contact",selectedIndex:0,items:[{id:"0",text:"Slack"},{id:"1",text:"Email"},{id:"2",text:"Fax"}]}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p:z,i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function dn(n){let a,s;return a=new en({props:{disabled:!0,titleText:"Contact",selectedIndex:0,items:[{id:"0",text:"Slack"},{id:"1",text:"Email"},{id:"2",text:"Fax"}]}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p:z,i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function kn(n){let a,s;return a=new ln({}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}function mn(n){let a,s,t,u,m,$,f,h,b,v,w,_,y,E,I,T,D,S,j,C,L,F,A,W,z,H;return{c(){a=e("div"),s=e("ul"),t=e("li"),u=e("a"),m=p("Usage"),$=x(),f=e("ul"),h=e("li"),b=e("a"),v=p("Default"),w=x(),_=e("li"),y=e("a"),E=p("Light variant"),I=x(),T=e("li"),D=e("a"),S=p("Inline type"),j=x(),C=e("li"),L=e("a"),F=p("Disabled state"),A=x(),W=e("li"),z=e("a"),H=p("Skeleton"),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 r=l(t);u=o(r,"A",{class:!0,href:!0});var d=l(u);m=c(d,"Usage"),d.forEach(i),$=g(r),f=o(r,"UL",{class:!0});var k=l(f);h=o(k,"LI",{class:!0});var x=l(h);b=o(x,"A",{class:!0,href:!0});var N=l(b);v=c(N,"Default"),N.forEach(i),x.forEach(i),w=g(k),_=o(k,"LI",{class:!0});var U=l(_);y=o(U,"A",{class:!0,href:!0});var B=l(y);E=c(B,"Light variant"),B.forEach(i),U.forEach(i),I=g(k),T=o(k,"LI",{class:!0});var M=l(T);D=o(M,"A",{class:!0,href:!0});var R=l(D);S=c(R,"Inline type"),R.forEach(i),M.forEach(i),j=g(k),C=o(k,"LI",{class:!0});var V=l(C);L=o(V,"A",{class:!0,href:!0});var P=l(L);F=c(P,"Disabled state"),P.forEach(i),V.forEach(i),A=g(k),W=o(k,"LI",{class:!0});var q=l(W);z=o(q,"A",{class:!0,href:!0});var G=l(z);H=c(G,"Skeleton"),G.forEach(i),q.forEach(i),k.forEach(i),r.forEach(i),p.forEach(i),e.forEach(i),this.h()},h(){r(u,"class","bx--link"),r(u,"href","#usage"),r(b,"class","bx--link"),r(b,"href","#default"),r(h,"class","bx--list__item"),r(y,"class","bx--link"),r(y,"href","#light-variant"),r(_,"class","bx--list__item"),r(D,"class","bx--link"),r(D,"href","#inline-type"),r(T,"class","bx--list__item"),r(L,"class","bx--link"),r(L,"href","#disabled-state"),r(C,"class","bx--list__item"),r(z,"class","bx--link"),r(z,"href","#skeleton"),r(W,"class","bx--list__item"),r(f,"class","bx--list--unordered bx--list--nested"),r(t,"class","bx--list__item"),r(s,"class","bx--list--unordered"),r(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,b),k(b,v),k(f,w),k(f,_),k(_,y),k(y,E),k(f,I),k(f,T),k(T,D),k(D,S),k(f,j),k(f,C),k(C,L),k(L,F),k(f,A),k(f,W),k(W,z),k(z,H)},d(n){n&&i(a)}}}function $n(n){let a,s,t,u,m,$,b,w,_,T,D,S,j,C,L,F,A,W,z,H,N,U,M,R,V,P;return u=new B({props:{codeRaw:"<script>\n  import { Dropdown } from \"carbon-components-svelte\";\n<\/script>\n\n<Dropdown\n  titleText=\"Contact\"\n  selectedIndex={0}\n  items={[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}\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> Dropdown <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>Dropdown</span>\n  <span class="token attr-name">titleText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Contact<span class="token punctuation">"</span></span>\n  <span class="token attr-name">selectedIndex=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token number">0</span><span class="token punctuation">}</span></span>\n  <span class="token attr-name">items=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'0\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Slack\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'1\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Email\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'2\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Fax\'</span> <span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[cn]},$$scope:{ctx:n}}}),_=new B({props:{codeRaw:"<script>\n  import { Dropdown } from \"carbon-components-svelte\";\n<\/script>\n\n<Dropdown\n  light\n  titleText=\"Contact\"\n  selectedIndex={0}\n  items={[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}\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> Dropdown <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>Dropdown</span>\n  <span class="token attr-name">light</span>\n  <span class="token attr-name">titleText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Contact<span class="token punctuation">"</span></span>\n  <span class="token attr-name">selectedIndex=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token number">0</span><span class="token punctuation">}</span></span>\n  <span class="token attr-name">items=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'0\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Slack\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'1\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Email\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'2\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Fax\'</span> <span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[rn]},$$scope:{ctx:n}}}),C=new B({props:{codeRaw:"<script>\n  import { Dropdown } from \"carbon-components-svelte\";\n<\/script>\n\n<Dropdown\n  type=\"inline\"\n  titleText=\"Contact\"\n  selectedIndex={0}\n  items={[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}\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> Dropdown <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>Dropdown</span>\n  <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>inline<span class="token punctuation">"</span></span>\n  <span class="token attr-name">titleText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Contact<span class="token punctuation">"</span></span>\n  <span class="token attr-name">selectedIndex=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token number">0</span><span class="token punctuation">}</span></span>\n  <span class="token attr-name">items=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'0\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Slack\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'1\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Email\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'2\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Fax\'</span> <span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[un]},$$scope:{ctx:n}}}),z=new B({props:{codeRaw:"<script>\n  import { Dropdown } from \"carbon-components-svelte\";\n<\/script>\n\n<Dropdown\n  disabled\n  titleText=\"Contact\"\n  selectedIndex={0}\n  items={[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}\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> Dropdown <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>Dropdown</span>\n  <span class="token attr-name">disabled</span>\n  <span class="token attr-name">titleText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Contact<span class="token punctuation">"</span></span>\n  <span class="token attr-name">selectedIndex=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token number">0</span><span class="token punctuation">}</span></span>\n  <span class="token attr-name">items=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'0\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Slack\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'1\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Email\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> id<span class="token operator">:</span> <span class="token string">\'2\'</span><span class="token punctuation">,</span> text<span class="token operator">:</span> <span class="token string">\'Fax\'</span> <span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n<span class="token punctuation">/></span></span>\n',$$slots:{default:[dn]},$$scope:{ctx:n}}}),R=new B({props:{codeRaw:'<script>\n  import { DropdownSkeleton } from "carbon-components-svelte";\n<\/script>\n\n<DropdownSkeleton />\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> DropdownSkeleton <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>DropdownSkeleton</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[kn]},$$scope:{ctx:n}}}),{c(){a=e("h3"),s=p("Default"),t=x(),f(u.$$.fragment),m=x(),$=e("h3"),b=p("Light variant"),w=x(),f(_.$$.fragment),T=x(),D=e("h3"),S=p("Inline type"),j=x(),f(C.$$.fragment),L=x(),F=e("h3"),A=p("Disabled state"),W=x(),f(z.$$.fragment),H=x(),N=e("h3"),U=p("Skeleton"),M=x(),f(R.$$.fragment),V=x(),this.h()},l(n){a=o(n,"H3",{id:!0});var e=l(a);s=c(e,"Default"),e.forEach(i),t=g(n),h(u.$$.fragment,n),m=g(n),$=o(n,"H3",{id:!0});var p=l($);b=c(p,"Light variant"),p.forEach(i),w=g(n),h(_.$$.fragment,n),T=g(n),D=o(n,"H3",{id:!0});var r=l(D);S=c(r,"Inline type"),r.forEach(i),j=g(n),h(C.$$.fragment,n),L=g(n),F=o(n,"H3",{id:!0});var d=l(F);A=c(d,"Disabled state"),d.forEach(i),W=g(n),h(z.$$.fragment,n),H=g(n),N=o(n,"H3",{id:!0});var k=l(N);U=c(k,"Skeleton"),k.forEach(i),M=g(n),h(R.$$.fragment,n),V=g(n),this.h()},h(){r(a,"id","default"),r($,"id","light-variant"),r(D,"id","inline-type"),r(F,"id","disabled-state"),r(N,"id","skeleton")},m(n,e){d(n,a,e),k(a,s),d(n,t,e),v(u,n,e),d(n,m,e),d(n,$,e),k($,b),d(n,w,e),v(_,n,e),d(n,T,e),d(n,D,e),k(D,S),d(n,j,e),v(C,n,e),d(n,L,e),d(n,F,e),k(F,A),d(n,W,e),v(z,n,e),d(n,H,e),d(n,N,e),k(N,U),d(n,M,e),v(R,n,e),d(n,V,e),P=!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}),_.$set(t);const e={};1&a&&(e.$$scope={dirty:a,ctx:n}),C.$set(e);const p={};1&a&&(p.$$scope={dirty:a,ctx:n}),z.$set(p);const o={};1&a&&(o.$$scope={dirty:a,ctx:n}),R.$set(o)},i(n){P||(y(u.$$.fragment,n),y(_.$$.fragment,n),y(C.$$.fragment,n),y(z.$$.fragment,n),y(R.$$.fragment,n),P=!0)},o(n){E(u.$$.fragment,n),E(_.$$.fragment,n),E(C.$$.fragment,n),E(z.$$.fragment,n),E(R.$$.fragment,n),P=!1},d(n){n&&i(a),n&&i(t),I(u,n),n&&i(m),n&&i($),n&&i(w),I(_,n),n&&i(T),n&&i(D),n&&i(j),I(C,n),n&&i(L),n&&i(F),n&&i(W),I(z,n),n&&i(H),n&&i(N),n&&i(M),I(R,n),n&&i(V)}}}function xn(n){let a,s;return a=new U({props:{$$slots:{default:[$n],aside:[mn]},$$scope:{ctx:n}}}),{c(){f(a.$$.fragment)},l(n){h(a.$$.fragment,n)},m(n,t){v(a,n,t),s=!0},p(n,[s]){const t={};1&s&&(t.$$scope={dirty:s,ctx:n}),a.$set(t)},i(n){s||(y(a.$$.fragment,n),s=!0)},o(n){E(a.$$.fragment,n),s=!1},d(n){I(a,n)}}}export default class extends a{constructor(n){super(),s(this,n,null,xn,t,{})}}