feat: deployable design studio and updated component showcase

app/pages/components/accordion.wrn

@@ -112,7 +112,7 @@ page AccordionDetail {
         <div class="demo-workbench">
           <div id="accordion-demo-1" class="demo-canvas demo-canvas--1">
             <div class="demo-browser-chrome"><span></span><span></span><span></span><small>Live preview</small></div>
-            
+
             <div class="demo-render"><Accordion size="default" variant="default" class="showcase-instance showcase-instance--1" items='[{"value":"workspace","label":"How do I create a workspace?","content":"Choose Create workspace, add a name, and invite your team. You can update the details any time in Settings."},{"value":"billing","label":"Can I change my plan later?","content":"Yes. Open Billing to compare plans and choose the one that suits your team."},{"value":"security","label":"How is my account protected?","content":"Enable two-step verification and add a recovery method to keep your account secure."}]' defaultOpen='["workspace"]' multiple="false" alwaysOpen="false" disabled="false" indicator="chevron" indicatorPosition="end" showIndicator="true" bordered="false" separated="false" flush="false" contentItalic="false" /></div>
           </div>
           <section class="demo-code" aria-label="Plain disclosure rows usage">
@@ -158,7 +158,7 @@ page AccordionDetail {
         <div class="demo-workbench">
           <div id="accordion-demo-2" class="demo-canvas demo-canvas--2">
             <div class="demo-browser-chrome"><span></span><span></span><span></span><small>Live preview</small></div>
-            
+
             <div class="demo-render"><Accordion size="sm" variant="secondary" class="showcase-instance showcase-instance--2" items='[{"value":"workspace","label":"How do I create a workspace?","content":"Choose Create workspace, add a name, and invite your team. You can update the details any time in Settings."},{"value":"billing","label":"Can I change my plan later?","content":"Yes. Open Billing to compare plans and choose the one that suits your team."},{"value":"security","label":"How is my account protected?","content":"Enable two-step verification and add a recovery method to keep your account secure."}]' defaultOpen='["workspace"]' multiple="false" alwaysOpen="false" disabled="false" indicator="plus" indicatorPosition="start" showIndicator="true" bordered="true" separated="false" flush="false" contentItalic="false" /></div>
           </div>
           <section class="demo-code" aria-label="Bordered group usage">
@@ -205,7 +205,7 @@ page AccordionDetail {
         <div class="demo-workbench">
           <div id="accordion-demo-3" class="demo-canvas demo-canvas--3">
             <div class="demo-browser-chrome"><span></span><span></span><span></span><small>Live preview</small></div>
-            
+
             <div class="demo-render"><Accordion size="lg" variant="success" class="showcase-instance showcase-instance--3" items='[{"value":"workspace","label":"How do I create a workspace?","content":"Choose Create workspace, add a name, and invite your team. You can update the details any time in Settings."},{"value":"billing","label":"Can I change my plan later?","content":"Yes. Open Billing to compare plans and choose the one that suits your team."},{"value":"security","label":"How is my account protected?","content":"Enable two-step verification and add a recovery method to keep your account secure."}]' defaultOpen='["workspace"]' multiple="true" alwaysOpen="false" disabled="false" indicator="chevron" indicatorPosition="end" showIndicator="true" bordered="true" separated="true" flush="false" contentItalic="false" /></div>
           </div>
           <section class="demo-code" aria-label="Separate panels usage">