feat: deployable design studio and updated component showcase

app/pages/components/alert.wrn

@@ -85,7 +85,7 @@ page AlertDetail {
         <div class="demo-workbench">
           <div id="alert-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"><Alert size="default" color="success" variant="soft" class="" radius="md" shadow="none" title="Changes saved" description="Your workspace settings are up to date." items='[]' actions='[]' showIcon="true" icon="icon-[lucide--circle-check]" dismissible="true" dismissLabel="Dismiss alert" role="alert" live="polite" linkLabel="" linkHref="" actionLabel="" actionHref="" compact="false" /></div>
           </div>
           <section class="demo-code" aria-label="Success message usage">
@@ -118,7 +118,7 @@ page AlertDetail {
         <div class="demo-workbench">
           <div id="alert-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"><Alert size="default" color="info" variant="soft" class="" radius="md" shadow="none" title="Scheduled maintenance" description="The dashboard will be unavailable Sunday, 02:00–02:30 UTC." items='[]' actions='[]' showIcon="true" icon="icon-[lucide--info]" dismissible="true" dismissLabel="Dismiss alert" role="alert" live="polite" linkLabel="" linkHref="" actionLabel="" actionHref="" compact="false" /></div>
           </div>
           <section class="demo-code" aria-label="Informational notice usage">
@@ -150,7 +150,7 @@ page AlertDetail {
         <div class="demo-workbench">
           <div id="alert-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"><Alert size="default" color="warning" variant="soft" class="" radius="md" shadow="none" title="Payment needs attention" description="Update your payment method to keep your subscription active." items='[]' actions='[]' showIcon="true" icon="icon-[lucide--triangle-alert]" dismissible="true" dismissLabel="Dismiss alert" role="alert" live="polite" linkLabel="" linkHref="" actionLabel="Update payment" actionHref="#payment" compact="false" /></div>
           </div>
           <section class="demo-code" aria-label="Action required usage">