@muibook/components 1.0.2 → 1.0.4

package/dist/muibook/assets/index-BnpaoEYs.js

@@ -1,386 +0,0 @@
-import{I as p}from"./image-1080-Bg-8LoSs.js";class t extends HTMLElement{constructor(){super();const n=this.attachShadow({mode:"open"}),s=`
-      :host { display: block; }
-    `,b="1fr 1fr 1fr auto";n.innerHTML=`
-      <style>${s}</style>
-
-      <story-template 
-        title="Card" 
-        description="The Card provides the ability to group items or components." 
-        figma="https://www.figma.com/design/l0mt1lXu97XoHJCEdnrWLp/Mui-Design-System?node-id=3-861&t=fSFYVey9aCoE5oQa-1"
-        github="https://github.com/michaeltrilford/muibook/tree/b060f2c788d521abd1f16889a460822d0cf8da3d/src/components/mui-card"
-      >
-
-      <mui-v-stack space="var(--space-700)">
-
-        <story-card title="Card">
-          <div slot="body">
-            <mui-card>
-              <mui-card-header>
-                <mui-heading size="3">Card</mui-heading>
-              </mui-card-header>
-              <mui-card-body>
-                <mui-body>Etiam porta sem malesuada magna mollis euismod. Fusce dapibus,
-                  tellus ac cursus commodo, tortor mauris condimentum nibh, ut
-                  fermentum massa justo sit amet risus.
-                </mui-body>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            &lt;mui-card&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-heading size="3"&gt;...&lt;/mui-heading&gt;            
-            <br />
-            &nbsp;&nbsp;&lt;/mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-body&gt;Basic
-            card&lt;/mui-card-body&gt;
-            <br />
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card w/ footer actions">
-          <div slot="body">
-            <mui-card>
-              <mui-card-header>
-                <mui-heading size="3">Title</mui-heading>
-              </mui-card-header>
-              <mui-card-body>
-                <mui-body>Etiam porta sem malesuada magna mollis euismod. Fusce dapibus,
-                  tellus ac cursus commodo, tortor mauris condimentum nibh, ut
-                  fermentum massa justo sit amet risus.
-                </mui-body>
-              </mui-card-body>
-              <mui-card-footer>
-                <mui-button-group right>
-                  <mui-button variant="secondary">Cancel</mui-button>
-                  <mui-button variant="primary">Submit</mui-button>
-                </mui-button-group>
-              </mui-card-footer>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            &lt;mui-card footer&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-heading size="3"&gt;...&lt;/mui-heading&gt;            
-            <br />
-            &nbsp;&nbsp;&lt;/mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-body&gt;...&lt;/mui-card-body&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-footer&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button-group right&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button
-            variant="secondary">Cancel&lt;/mui-button&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button
-            variant="primary">Submit&lt;/mui-button&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-button-group&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-footer&gt;
-            <br />
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card with image">
-          <div slot="body">
-            <mui-card>
-              <mui-card-header>
-                <mui-heading size="3">Title</mui-heading>
-              </mui-card-header>
-              <mui-card-body>
-                <mui-image>
-                  <img slot="image" src="${p}" alt="image-1080" />
-                </mui-image>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            &lt;mui-card footer&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-heading size="3"&gt;...&lt;/mui-heading&gt;            
-            <br />
-            &nbsp;&nbsp;&lt;/mui-card-header&gt;
-            <br />
-            &nbsp;&nbsp;&lt;mui-card-body&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-image&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;img slot="image" src="images/story/image-1080.png" alt="image-1080" /&gt;
-            <br />
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-image&gt;
-            <br />
-            &nbsp;&nbsp;&lt;/mui-card-body&gt;
-            <br />
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card w/ Table">
-          <div slot="body">
-            <mui-card>
-              <mui-card-body>
-                <mui-table>
-                  <mui-row-group heading>
-                    <mui-row columns="${b}">
-                      <mui-cell heading>Office</mui-cell>
-                      <mui-cell heading>Revenue</mui-cell>
-                      <mui-cell heading>Cost</mui-cell>
-                      <mui-cell heading action>
-                      </mui-cell>
-                    </mui-row>
-                  </mui-row-group>
-                  <mui-row-group>
-                    <mui-row columns="${b}">
-                      <mui-cell data-label="Office:">Whalen</mui-cell>
-                      <mui-cell data-label="Revenue:">$4,400.00</mui-cell>
-                      <mui-cell data-label="Cost:">$1,100.00</mui-cell>
-                      <mui-cell data-label="" action>
-                        <mui-button variant="tertiary" icon-only> <mui-icon-add size="small"></mui-icon-add></mui-button>
-                      </mui-cell>
-                    </mui-row>
-                    <mui-row columns="${b}">
-                      <mui-cell data-label="Office:">Whalen</mui-cell>
-                      <mui-cell data-label="Revenue:">$4,400.00</mui-cell>
-                      <mui-cell data-label="Cost:">$1,100.00</mui-cell>
-                      <mui-cell data-label="" action>
-                        <mui-button variant="tertiary" icon-only> <mui-icon-add size="small"></mui-icon-add></mui-button>
-                      </mui-cell>
-                    </mui-row>
-                  </mui-row-group>
-                </mui-table>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            const Columns = &#96;1fr 1fr 1fr auto&#96;;<br>
-            <br>
-            &lt;mui-card&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-body&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-table&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row-group heading&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Office&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Revenue&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Cost&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading action&gt;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Office:"&gt;Whalen&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Revenue:"&gt;$4,400.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Cost:"&gt;$1,100.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="" action&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button variant="tertiary" icon-only&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-icon-add size="small"&gt;&lt;/mui-icon-add&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-button&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Office:"&gt;Whalen&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Revenue:"&gt;$4,400.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Cost:"&gt;$1,100.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="" action&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button variant="tertiary" icon-only&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-icon-add size="small"&gt;&lt;/mui-icon-add&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-button&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-table&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-body&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-footer&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-code&gt;&lt;/mui-code&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-footer&gt;<br>
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card Header w/ Table">
-          <div slot="body">
-            <mui-card>
-              <mui-card-header>
-                <mui-heading size="3">Title</mui-heading>
-              </mui-card-header>
-              <mui-rule></mui-rule>
-              <mui-card-body>
-                <mui-table>
-                  <mui-row-group heading>
-                    <mui-row columns="${b}">
-                      <mui-cell heading>Office</mui-cell>
-                      <mui-cell heading>Revenue</mui-cell>
-                      <mui-cell heading>Cost</mui-cell>
-                      <mui-cell heading action>
-                      </mui-cell>
-                    </mui-row>
-                  </mui-row-group>
-                  <mui-row-group>
-                    <mui-row columns="${b}">
-                      <mui-cell data-label="Office:">Whalen</mui-cell>
-                      <mui-cell data-label="Revenue:">$4,400.00</mui-cell>
-                      <mui-cell data-label="Cost:">$1,100.00</mui-cell>
-                      <mui-cell data-label="" action>
-                        <mui-button variant="tertiary" icon-only> <mui-icon-add size="small"></mui-icon-add></mui-button>
-                      </mui-cell>
-                    </mui-row>
-                    <mui-row columns="${b}">
-                      <mui-cell data-label="Office:">Whalen</mui-cell>
-                      <mui-cell data-label="Revenue:">$4,400.00</mui-cell>
-                      <mui-cell data-label="Cost:">$1,100.00</mui-cell>
-                      <mui-cell data-label="" action>
-                        <mui-button variant="tertiary" icon-only> <mui-icon-add size="small"></mui-icon-add></mui-button>
-                      </mui-cell>
-                    </mui-row>
-                  </mui-row-group>
-                </mui-table>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            const Columns = &#96;1fr 1fr 1fr auto&#96;;<br>
-            <br>
-            &lt;mui-card&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-header&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-heading size="3"&gt;Title&lt;/mui-heading&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-header&gt;<br>
-            &nbsp;&nbsp;&lt;mui-rule&gt;&lt;/mui-rule&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-body&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-table&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row-group heading&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Office&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Revenue&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading&gt;Cost&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell heading action&gt;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Office:"&gt;Whalen&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Revenue:"&gt;$4,400.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Cost:"&gt;$1,100.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="" action&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button variant="tertiary" icon-only&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-icon-add size="small"&gt;&lt;/mui-icon-add&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-button&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-row columns="\${Columns}"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Office:"&gt;Whalen&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Revenue:"&gt;$4,400.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="Cost:"&gt;$1,100.00&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-cell data-label="" action&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-button variant="tertiary" icon-only&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-icon-add size="small"&gt;&lt;/mui-icon-add&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-button&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-cell&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-row-group&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-table&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-body&gt;<br>
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card w/ Accordion">
-          <div slot="body">
-            <mui-card>
-              <mui-card-body>
-                <mui-accordion-group exclusive>
-                  <mui-accordion-block heading="Heading">
-                    <div slot="detail">
-                        Content
-                    </div>
-                  </mui-accordion-block>
-                  <mui-accordion-block heading="Heading">
-                    <div slot="detail">
-                        Content
-                    </div>
-                  </mui-accordion-block>
-                </mui-accordion-group>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            &lt;mui-card&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-body&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-group exclusive&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-block heading="Heading"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div slot="detail"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Content<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-block&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-block heading="Heading"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div slot="detail"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Content<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-block&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-group&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-body&gt;<br>
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-        <story-card title="Card Header w/ Accordion">
-          <div slot="body">
-            <mui-card>
-              <mui-card-header>
-                <mui-heading size="3">Title</mui-heading>
-              </mui-card-header>
-              <mui-rule></mui-rule>
-              <mui-card-body>
-                <mui-accordion-group exclusive>
-                  <mui-accordion-block heading="Heading">
-                    <div slot="detail">
-                        Content
-                    </div>
-                  </mui-accordion-block>
-                  <mui-accordion-block heading="Heading">
-                    <div slot="detail">
-                        Content
-                    </div>
-                  </mui-accordion-block>
-                </mui-accordion-group>
-              </mui-card-body>
-            </mui-card>
-          </div>
-          <mui-code slot="footer">
-            &lt;mui-card&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-header&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-heading size="3"&gt;Title&lt;/mui-heading&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-header&gt;<br>
-            &nbsp;&nbsp;&lt;mui-rule&gt;&lt;/mui-rule&gt;<br>
-            &nbsp;&nbsp;&lt;mui-card-body&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-group exclusive&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-block heading="Heading"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div slot="detail"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Content<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-block&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;mui-accordion-block heading="Heading"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div slot="detail"&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Content<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-block&gt;<br>
-            &nbsp;&nbsp;&nbsp;&nbsp;&lt;/mui-accordion-group&gt;<br>
-            &nbsp;&nbsp;&lt;/mui-card-body&gt;<br>
-            &lt;/mui-card&gt;
-          </mui-code>
-        </story-card>
-
-      </mui-v-stack>
-
-      </story-template>
-    `}}customElements.define("story-cards",t);