let a=document.createElement("style");a.innerHTML="",document.head.appendChild(a);import{S as s,i as n,s as t,c as o,a as p,m as e,t as c,b as l,d as r,g as i,h as u,j as d,k,l as m,n as h,o as g,p as f,N as b,q as M,r as $,Y as v}from"./index.c724c7a8.js";import"./Button.050f7fa6.js";import"./index.353a6bed.js";import{C,P as x}from"./Preview.cac03ac9.js";import"./ChevronDown16.65632e2b.js";import"./Loading.04ab43b5.js";import"./Column.1268d8a6.js";import"./Content.8eaa1372.js";import"./store.063a32c5.js";function y(a){let s,n,t,o,p,e,c,l,r,v;return{c(){s=i("div"),n=i("ul"),t=i("li"),o=i("a"),p=u("Usage"),e=d(),c=i("ul"),l=i("li"),r=i("a"),v=u("Composed modal"),this.h()},l(a){s=k(a,"DIV",{slot:!0});var i=m(s);n=k(i,"UL",{class:!0});var u=m(n);t=k(u,"LI",{class:!0});var d=m(t);o=k(d,"A",{class:!0,href:!0});var b=m(o);p=h(b,"Usage"),b.forEach(g),e=f(d),c=k(d,"UL",{class:!0});var M=m(c);l=k(M,"LI",{class:!0});var $=m(l);r=k($,"A",{class:!0,href:!0});var C=m(r);v=h(C,"Composed modal"),C.forEach(g),$.forEach(g),M.forEach(g),d.forEach(g),u.forEach(g),i.forEach(g),this.h()},h(){b(o,"class","bx--link"),b(o,"href","#usage"),b(r,"class","bx--link"),b(r,"href","#composed-modal"),b(l,"class","bx--list__item"),b(c,"class","bx--list--unordered bx--list--nested"),b(t,"class","bx--list__item"),b(n,"class","bx--list--unordered"),b(s,"slot","aside")},m(a,i){M(a,s,i),$(s,n),$(n,t),$(t,o),$(o,p),$(t,e),$(t,c),$(c,l),$(l,r),$(r,v)},d(a){a&&g(s)}}}function j(a){let s,n,t,C,y,j;return C=new x({props:{framed:!0,src:"/framed/Modal/ComposedModal",codeRaw:'<script>\n  import {\n    ComposedModal,\n    ModalHeader,\n    ModalBody,\n    ModalFooter,\n    Checkbox,\n  } from "carbon-components-svelte";\n\n  let checked = false;\n<\/script>\n\n<ComposedModal open>\n  <ModalHeader title="Confirm changes" />\n  <ModalBody hasForm>\n    <Checkbox labelText="I have reviewed the changes" bind:checked />\n  </ModalBody>\n  <ModalFooter primaryButtonText="Proceed" primaryButtonDisabled={!checked} />\n</ComposedModal>\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>\n    ComposedModal<span class="token punctuation">,</span>\n    ModalHeader<span class="token punctuation">,</span>\n    ModalBody<span class="token punctuation">,</span>\n    ModalFooter<span class="token punctuation">,</span>\n    Checkbox<span class="token punctuation">,</span>\n  <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\n  <span class="token keyword">let</span> checked <span class="token operator">=</span> <span class="token boolean">false</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>ComposedModal</span> <span class="token attr-name">open</span><span class="token punctuation">></span></span>\n  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ModalHeader</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Confirm changes<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>\n  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ModalBody</span> <span class="token attr-name">hasForm</span><span class="token punctuation">></span></span>\n    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Checkbox</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>I have reviewed the changes<span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">bind:</span>checked</span> <span class="token punctuation">/></span></span>\n  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ModalBody</span><span class="token punctuation">></span></span>\n  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ModalFooter</span> <span class="token attr-name">primaryButtonText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Proceed<span class="token punctuation">"</span></span> <span class="token attr-name">primaryButtonDisabled=</span><span class="token language-javascript"><span class="token punctuation">{</span><span class="token operator">!</span>checked<span class="token punctuation">}</span></span> <span class="token punctuation">/></span></span>\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ComposedModal</span><span class="token punctuation">></span></span>\n'}}),{c(){s=i("h3"),n=u("Composed modal"),t=d(),o(C.$$.fragment),y=d(),this.h()},l(a){s=k(a,"H3",{id:!0});var o=m(s);n=h(o,"Composed modal"),o.forEach(g),t=f(a),p(C.$$.fragment,a),y=f(a),this.h()},h(){b(s,"id","composed-modal")},m(a,o){M(a,s,o),$(s,n),M(a,t,o),e(C,a,o),M(a,y,o),j=!0},p:v,i(a){j||(c(C.$$.fragment,a),j=!0)},o(a){l(C.$$.fragment,a),j=!1},d(a){a&&g(s),a&&g(t),r(C,a),a&&g(y)}}}function B(a){let s,n;return s=new C({props:{$$slots:{default:[j],aside:[y]},$$scope:{ctx:a}}}),{c(){o(s.$$.fragment)},l(a){p(s.$$.fragment,a)},m(a,t){e(s,a,t),n=!0},p(a,[n]){const t={};1&n&&(t.$$scope={dirty:n,ctx:a}),s.$set(t)},i(a){n||(c(s.$$.fragment,a),n=!0)},o(a){l(s.$$.fragment,a),n=!1},d(a){r(s,a)}}}export default class extends s{constructor(a){super(),n(this,a,null,B,t,{})}}