@happyvertical/smrt-chat 0.34.4 → 0.34.6

package/dist/manifest.json

@@ -1,8 +1,8 @@
 {
   "version": "1.0.0",
-  "timestamp": 1782257901323,
+  "timestamp": 1782278483770,
   "packageName": "@happyvertical/smrt-chat",
-  "packageVersion": "0.34.4",
+  "packageVersion": "0.34.6",
   "objects": {
     "@happyvertical/smrt-chat:AgentSessionCollection": {
       "name": "agentsessioncollection",

package/dist/smrt-knowledge.json

@@ -1,13 +1,13 @@
 {
   "schemaVersion": 1,
-  "generatedAt": "2026-06-23T23:38:22.310Z",
+  "generatedAt": "2026-06-24T05:21:24.161Z",
   "packageName": "@happyvertical/smrt-chat",
-  "packageVersion": "0.34.4",
+  "packageVersion": "0.34.6",
   "sourceManifestPath": "dist/manifest.json",
   "agentDocPath": "AGENTS.md",
   "sourceHashes": {
-    "manifest": "d230c1ade8f919f7761ac03c5bacaccd73740efd72945692c1f55defe95894f2",
-    "packageJson": "31a03b374eddefd5f563815e23aecdf2b665bd9e0d4bb8c0363573f36c58d691",
+    "manifest": "2975e8cc9d58e5960d1d59de3dc09523b44a85d6af43e7fbef3e9c03f695b2d9",
+    "packageJson": "5fbeb77ade984295729f043140c7db7b16609c4c5ef9333f04af4df283a14f15",
     "agents": "e0a8c6788fbd48c2619a353295d4538e9ff6863d483bcd354af522fb7c6a31bc"
   },
   "exports": [

package/dist/svelte/components/agent/AgentChat.svelte

@@ -6,6 +6,7 @@
  */
 
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
+import { Button } from '@happyvertical/smrt-ui/ui';
 import { M } from '../../i18n.js';
 import type {
   AgentSessionData,
@@ -106,7 +107,8 @@ $effect(() => {
         disabled={!isActive}
         aria-label={t(M['chat.agent_chat.message_input'])}
       ></textarea>
-      <button
+      <Button
+        variant="ghost"
         class="agent-chat__send-btn"
         type="submit"
         disabled={!inputValue.trim() || !isActive}
@@ -115,7 +117,7 @@ $effect(() => {
         <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
           <path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" />
         </svg>
-      </button>
+      </Button>
     {/if}
   </form>
 
@@ -151,19 +153,21 @@ $effect(() => {
                   {:else if block.type === 'fields'}
                     <div class="field-update-block">
                       <span class="applied-badge">{t(M['chat.agent_chat.updated_fields'], { count: Object.keys(block.fields).length, plural: Object.keys(block.fields).length !== 1 ? 's' : '' })}</span>
-                      <button class="diff-btn" type="button" onclick={() => showDiff(block.fields)}>Diff</button>
+                      <Button variant="ghost" size="sm" class="diff-btn" type="button" onclick={() => showDiff(block.fields)}>Diff</Button>
                     </div>
                   {:else if block.type === 'markdown'}
                     <div class="markdown-block">
                       <pre class="markdown-block__content"><code>{block.content}</code></pre>
                       {#if onapplychange}
-                        <button
+                        <Button
+                          variant="ghost"
+                          size="sm"
                           class="diff-btn"
                           type="button"
                           onclick={() => onapplychange(block.content)}
                         >
                           Apply
-                        </button>
+                        </Button>
                       {/if}
                     </div>
                   {/if}
@@ -198,7 +202,7 @@ $effect(() => {
 <dialog bind:this={diffDialog} class="diff-dialog">
   <div class="diff-dialog__header">
     <h4>{t(M['chat.agent_chat.field_changes'])}</h4>
-    <button class="diff-dialog__close" type="button" onclick={closeDiff}>✕</button>
+    <Button variant="ghost" size="sm" class="diff-dialog__close" type="button" onclick={closeDiff}>✕</Button>
   </div>
   {#if diffDialogFields}
     <div class="diff-dialog__body">
@@ -349,27 +353,20 @@ $effect(() => {
     color: var(--smrt-color-outline, #74777f);
   }
 
-  .agent-chat__send-btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .agent-chat__input-bar :global(.agent-chat__send-btn) {
     width: 34px;
     height: 34px;
-    border: none;
+    padding: 0;
     background: var(--smrt-color-primary, #005ac1);
     color: var(--smrt-color-on-primary, #ffffff);
     border-radius: var(--smrt-radius-full, 9999px);
-    cursor: pointer;
     flex-shrink: 0;
     transition: opacity 150ms;
   }
 
-  .agent-chat__send-btn:disabled {
-    opacity: 0.4;
-    cursor: not-allowed;
-  }
-
-  .agent-chat__send-btn:not(:disabled):hover {
+  .agent-chat__input-bar :global(.agent-chat__send-btn:not(:disabled):hover) {
+    background: var(--smrt-color-primary, #005ac1);
     opacity: 0.85;
   }
 
@@ -411,7 +408,9 @@ $effect(() => {
     line-height: var(--smrt-typography-body-medium-line-height, 1.45);
   }
 
-  .diff-btn {
+  /* :global() pierces into each Button's rendered <button> (see #1589). */
+  .field-update-block :global(.diff-btn),
+  .markdown-block :global(.diff-btn) {
     padding: var(--smrt-spacing-1, 4px) var(--smrt-spacing-2, 8px);
     font-size: var(--smrt-typography-label-small-size, 0.625rem);
     font-weight: var(--smrt-typography-weight-semibold, 600);
@@ -419,11 +418,10 @@ $effect(() => {
     border-radius: var(--smrt-radius-full, 9999px);
     background: none;
     color: var(--smrt-color-on-surface-variant, #43474e);
-    cursor: pointer;
-    transition: background 0.15s;
   }
 
-  .diff-btn:hover {
+  .field-update-block :global(.diff-btn:hover),
+  .markdown-block :global(.diff-btn:hover) {
     background: var(--smrt-color-surface-variant, #e1e2ec);
     color: var(--smrt-color-primary, #005ac1);
   }
@@ -457,17 +455,16 @@ $effect(() => {
     font-weight: var(--smrt-typography-weight-semibold, 600);
   }
 
-  .diff-dialog__close {
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .diff-dialog__header :global(.diff-dialog__close) {
     background: none;
-    border: none;
     font-size: var(--smrt-typography-body-large-size, 1rem);
-    cursor: pointer;
     color: var(--smrt-color-outline, #74777f);
     padding: var(--smrt-spacing-1, 4px) var(--smrt-spacing-2, 8px);
     border-radius: var(--smrt-radius-sm, 4px);
   }
 
-  .diff-dialog__close:hover {
+  .diff-dialog__header :global(.diff-dialog__close:hover) {
     background: var(--smrt-color-surface-variant, #e1e2ec);
   }
 

package/dist/svelte/components/agent/AgentChat.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AgentChat.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentChat.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EAEhB,MAAM,gBAAgB,CAAC;AAMxB,MAAM,WAAW,KAAK;IACpB,yBAAyB;IACzB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,oCAAoC;IACpC,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B,gCAAgC;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kCAAkC;IAClC,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,4CAA4C;IAC5C,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,2BAA2B;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAwKD,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"AgentChat.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentChat.svelte.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EAEhB,MAAM,gBAAgB,CAAC;AAMxB,MAAM,WAAW,KAAK;IACpB,yBAAyB;IACzB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,oCAAoC;IACpC,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B,gCAAgC;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kCAAkC;IAClC,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,4CAA4C;IAC5C,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,2BAA2B;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAyKD,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/svelte/components/agent/AgentSelector.svelte

@@ -26,6 +26,7 @@ const { t } = useI18n();
 
   <div class="agent-selector__grid" role="listbox" aria-label={t(M['chat.agent_selector.available_agents'])}>
     {#each agents as agent (agent.id)}
+      <!-- raw-primitive-allow: large pressable selection card with role=option wrapping rich content (avatar, name, description, unavailable badge) inside a role=listbox; no Button primitive owns this structural listbox-option pattern -->
       <button
         class="agent-selector__card"
         class:agent-selector__card--unavailable={!agent.isAvailable}

package/dist/svelte/components/agent/AgentSelector.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AgentSelector.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentSelector.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,MAAM,WAAW,KAAK;IACpB,uBAAuB;IACvB,MAAM,EAAE,eAAe,EAAE,CAAC;IAC1B,sBAAsB;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC;AA6CD,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"AgentSelector.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentSelector.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,MAAM,WAAW,KAAK;IACpB,uBAAuB;IACvB,MAAM,EAAE,eAAe,EAAE,CAAC;IAC1B,sBAAsB;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC;AA8CD,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/svelte/components/agent/AgentSessionPanel.svelte

@@ -5,6 +5,7 @@
  * Allows selecting an existing session or creating a new one.
  */
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
+import { Button } from '@happyvertical/smrt-ui/ui';
 import { M } from '../../i18n.js';
 import type { AgentSessionData } from '../../types.js';
 import Avatar from '../shared/Avatar.svelte';
@@ -49,7 +50,8 @@ const statusLabel: Record<string, string> = {
   <div class="session-panel__header">
     <h2 class="session-panel__title">Sessions</h2>
     {#if onnewsession}
-      <button
+      <Button
+        variant="ghost"
         class="session-panel__new-btn"
         type="button"
         onclick={onnewsession}
@@ -59,13 +61,14 @@ const statusLabel: Record<string, string> = {
         <svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
           <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
         </svg>
-      </button>
+      </Button>
     {/if}
   </div>
 
   <div class="session-panel__list" role="listbox" aria-label={t(M['chat.agent_session_panel.session_list'])}>
     {#each sessions as session (session.id)}
       {@const isCurrent = session.id === currentSessionId}
+      <!-- raw-primitive-allow: large pressable selection card with role=option wrapping rich content (avatar, name, date, status, message count, tool chips) inside a role=listbox; no Button primitive owns this structural listbox-option pattern -->
       <button
         class="session-panel__item"
         class:session-panel__item--active={isCurrent}
@@ -152,29 +155,22 @@ const statusLabel: Record<string, string> = {
     margin: 0;
   }
 
-  .session-panel__new-btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .session-panel__header :global(.session-panel__new-btn) {
     width: 36px;
     height: 36px;
-    border: none;
+    padding: 0;
     background: var(--smrt-color-primary, #005ac1);
     color: var(--smrt-color-on-primary, #ffffff);
     border-radius: var(--smrt-radius-full, 9999px);
-    cursor: pointer;
     transition: opacity var(--smrt-duration-short2, 150ms);
   }
 
-  .session-panel__new-btn:hover {
+  .session-panel__header :global(.session-panel__new-btn:hover) {
+    background: var(--smrt-color-primary, #005ac1);
     opacity: 0.85;
   }
 
-  .session-panel__new-btn:focus-visible {
-    outline: 2px solid var(--smrt-color-primary, #005ac1);
-    outline-offset: 2px;
-  }
-
   .session-panel__list {
     flex: 1;
     overflow-y: auto;
@@ -314,8 +310,11 @@ const statusLabel: Record<string, string> = {
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .session-panel__item,
-    .session-panel__new-btn {
+    .session-panel__item {
+      transition: none;
+    }
+
+    .session-panel__header :global(.session-panel__new-btn) {
       transition: none;
     }
   }

package/dist/svelte/components/agent/AgentSessionPanel.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AgentSessionPanel.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentSessionPanel.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,MAAM,WAAW,KAAK;IACpB,yBAAyB;IACzB,QAAQ,EAAE,gBAAgB,EAAE,CAAC;IAC7B,kCAAkC;IAClC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uBAAuB;IACvB,eAAe,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAiGD,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"AgentSessionPanel.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/AgentSessionPanel.svelte.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,MAAM,WAAW,KAAK;IACpB,yBAAyB;IACzB,QAAQ,EAAE,gBAAgB,EAAE,CAAC;IAC7B,kCAAkC;IAClC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uBAAuB;IACvB,eAAe,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAmGD,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/svelte/components/agent/ToolCallDisplay.svelte

@@ -50,6 +50,7 @@ function formatDuration(ms: number | undefined): string {
 </script>
 
 <div class="tool-call tool-call--{toolCall.status}" aria-label={t(M['chat.tool_call_display.tool_call'], { toolName: toolCall.toolName })}>
+  <!-- raw-primitive-allow: full-width disclosure trigger with aria-expanded and aria-controls toggling an externally-rendered collapsible panel, wrapping rich content (status dot, name, duration, status label, rotating chevron); structural accordion header no Button primitive owns -->
   <button
     class="tool-call__header"
     type="button"

package/dist/svelte/components/agent/ToolCallDisplay.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolCallDisplay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/ToolCallDisplay.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAG1D,MAAM,WAAW,KAAK;IACpB,qBAAqB;IACrB,QAAQ,EAAE,mBAAmB,CAAC;CAC/B;AAkGD,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ToolCallDisplay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/agent/ToolCallDisplay.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAG1D,MAAM,WAAW,KAAK;IACpB,qBAAqB;IACrB,QAAQ,EAAE,mBAAmB,CAAC;CAC/B;AAmGD,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/svelte/components/dialogs/RoomCreateDialog.svelte

@@ -9,6 +9,7 @@
  */
 import { Modal } from '@happyvertical/smrt-ui/feedback';
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
+import { Button } from '@happyvertical/smrt-ui/ui';
 import { M } from '../../i18n.js';
 
 const { t } = useI18n();
@@ -153,25 +154,26 @@ $effect(() => {
     </div>
 
     <!-- Hidden submit keeps Enter-to-submit working inside the Modal body. -->
+    <!-- raw-primitive-allow: off-screen aria-hidden type=submit element with tabindex=-1 used only to enable native Enter-to-submit inside the Modal body; intentionally non-interactive and not a visible action button -->
     <button type="submit" class="visually-hidden" tabindex="-1" disabled={!canCreate} aria-hidden="true"></button>
   </form>
 
   {#snippet footer()}
-    <button
+    <Button
+      variant="secondary"
       type="button"
-      class="btn btn--secondary"
       onclick={handleClose}
     >
       Cancel
-    </button>
-    <button
+    </Button>
+    <Button
+      variant="primary"
       type="button"
-      class="btn btn--primary"
       disabled={!canCreate}
       onclick={handleSubmit}
     >
       {t(M['chat.room_create_dialog.create_room'])}
-    </button>
+    </Button>
   {/snippet}
 </Modal>
 
@@ -301,45 +303,8 @@ $effect(() => {
     color: var(--smrt-color-on-surface-variant, #43474e);
   }
 
-  .btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0.625rem 1.5rem;
-    font: var(--smrt-typography-label-large-font, 500 0.875rem / 1.25 sans-serif);
-    letter-spacing: 0.1px;
-    border-radius: var(--smrt-radius-full, 9999px);
-    border: none;
-    cursor: pointer;
-    transition: all var(--smrt-duration-short2, 150ms) var(--smrt-easing-standard, ease);
-  }
-
-  .btn:disabled {
-    opacity: 0.38;
-    cursor: not-allowed;
-  }
-
-  .btn--primary {
-    background: var(--smrt-color-primary, #005ac1);
-    color: var(--smrt-color-on-primary, #fff);
-  }
-
-  .btn--primary:hover:not(:disabled) {
-    box-shadow: var(--smrt-elevation-1, 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15));
-  }
-
-  .btn--secondary {
-    background: transparent;
-    color: var(--smrt-color-primary, #005ac1);
-  }
-
-  .btn--secondary:hover:not(:disabled) {
-    background: color-mix(in srgb, var(--smrt-color-primary, #005ac1) 8%, transparent);
-  }
-
   @media (prefers-reduced-motion: reduce) {
-    .type-option,
-    .btn {
+    .type-option {
       transition: none;
     }
   }

package/dist/svelte/components/dialogs/RoomCreateDialog.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RoomCreateDialog.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/dialogs/RoomCreateDialog.svelte.ts"],"names":[],"mappings":"AAgBA,MAAM,WAAW,KAAK;IACpB,iCAAiC;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,mCAAmC;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,oCAAoC;IACpC,QAAQ,EAAE,CAAC,MAAM,EAAE;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,MAAM,CAAC;KACrB,KAAK,IAAI,CAAC;CACZ;AAwHD,QAAA,MAAM,gBAAgB,2CAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"RoomCreateDialog.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/dialogs/RoomCreateDialog.svelte.ts"],"names":[],"mappings":"AAiBA,MAAM,WAAW,KAAK;IACpB,iCAAiC;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,mCAAmC;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,oCAAoC;IACpC,QAAQ,EAAE,CAAC,MAAM,EAAE;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,MAAM,CAAC;KACrB,KAAK,IAAI,CAAC;CACZ;AA0HD,QAAA,MAAM,gBAAgB,2CAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/svelte/components/dialogs/SearchMessages.svelte

@@ -4,6 +4,7 @@
  * Provides a search input and displays matching messages
  */
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
+import { Button } from '@happyvertical/smrt-ui/ui';
 import { M } from '../../i18n.js';
 import type { ChatMessageData } from '../../types.js';
 
@@ -108,7 +109,9 @@ $effect(() => {
   >
     <div class="search-panel__header">
       <h2 class="search-panel__title">{t(M['chat.search_messages.title'])}</h2>
-      <button
+      <Button
+        variant="ghost"
+        size="sm"
         class="close-btn"
         type="button"
         onclick={handleClose}
@@ -118,7 +121,7 @@ $effect(() => {
           <path d="M18 6 6 18" />
           <path d="m6 6 12 12" />
         </svg>
-      </button>
+      </Button>
     </div>
 
     <form
@@ -140,7 +143,9 @@ $effect(() => {
           aria-label={t(M['chat.search_messages.query'])}
         />
         {#if hasQuery}
-          <button
+          <Button
+            variant="ghost"
+            size="sm"
             class="clear-btn"
             type="button"
             onclick={() => { query = ''; searchInput?.focus(); }}
@@ -150,7 +155,7 @@ $effect(() => {
               <path d="M18 6 6 18" />
               <path d="m6 6 12 12" />
             </svg>
-          </button>
+          </Button>
         {/if}
       </div>
     </form>
@@ -163,6 +168,7 @@ $effect(() => {
         <ul class="results-list" aria-label={t(M['chat.search_messages.results'])}>
           {#each results as message (message.id)}
             <li class="results-list__item">
+              <!-- raw-primitive-allow: large pressable search-result card wrapping rich content (avatar, sender, date, multi-line highlighted message excerpt); no Button primitive owns this structural selection-card pattern -->
               <button
                 class="result-item"
                 type="button"
@@ -231,29 +237,21 @@ $effect(() => {
     color: var(--smrt-color-on-surface, #1a1c1e);
   }
 
-  .close-btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .search-panel__header :global(.close-btn) {
     width: 1.75rem;
     height: 1.75rem;
-    border: none;
+    padding: 0;
     background: none;
     border-radius: var(--smrt-radius-medium, 0.5rem);
     color: var(--smrt-color-on-surface-variant, #43474e);
-    cursor: pointer;
     transition: background var(--smrt-duration-short2, 150ms);
   }
 
-  .close-btn:hover {
+  .search-panel__header :global(.close-btn:hover) {
     background: var(--smrt-color-surface-variant, #e1e2ec);
   }
 
-  .close-btn:focus-visible {
-    outline: 2px solid var(--smrt-color-primary, #005ac1);
-    outline-offset: -2px;
-  }
-
   .close-btn__icon {
     width: 1rem;
     height: 1rem;
@@ -300,21 +298,19 @@ $effect(() => {
     color: var(--smrt-color-on-surface-variant, #43474e);
   }
 
-  .clear-btn {
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .search-input-wrap :global(.clear-btn) {
     flex-shrink: 0;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
     width: 1.25rem;
     height: 1.25rem;
-    border: none;
+    padding: 0;
     background: none;
     border-radius: var(--smrt-radius-full, 9999px);
     color: var(--smrt-color-on-surface-variant, #43474e);
-    cursor: pointer;
   }
 
-  .clear-btn:hover {
+  .search-input-wrap :global(.clear-btn:hover) {
+    background: none;
     color: var(--smrt-color-on-surface, #1a1c1e);
   }
 
@@ -448,10 +444,13 @@ $effect(() => {
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .close-btn,
     .result-item,
     .search-input-wrap {
       transition: none;
     }
+
+    .search-panel__header :global(.close-btn) {
+      transition: none;
+    }
   }
 </style>

package/dist/svelte/components/dialogs/SearchMessages.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchMessages.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/dialogs/SearchMessages.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,MAAM,WAAW,KAAK;IACpB,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;IAChB,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gDAAgD;IAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qBAAqB;IACrB,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,yCAAyC;IACzC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAyKD,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
+{"version":3,"file":"SearchMessages.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/dialogs/SearchMessages.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,MAAM,WAAW,KAAK;IACpB,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;IAChB,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gDAAgD;IAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qBAAqB;IACrB,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,yCAAyC;IACzC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AA2KD,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/svelte/components/layout/ChatLayout.svelte

@@ -72,6 +72,7 @@ function handlePointerUp() {
     />
   </aside>
 
+  <!-- raw-primitive-allow: custom drag-to-resize splitter with pointer capture (pointerdown/move/up) and ArrowLeft/ArrowRight keyboard resizing; a press-and-drag control no Button primitive owns -->
   <button
     type="button"
     class="chat-layout__resize-handle"

package/dist/svelte/components/layout/ChatLayout.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatLayout.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/layout/ChatLayout.svelte.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAInD,MAAM,WAAW,KAAK;IACpB,2BAA2B;IAC3B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,iCAAiC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gCAAgC;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,uCAAuC;IACvC,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mEAAmE;IACnE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,wBAAwB;IACxB,QAAQ,EAAE,OAAO,CAAC;CACnB;AA+DD,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ChatLayout.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/layout/ChatLayout.svelte.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAInD,MAAM,WAAW,KAAK;IACpB,2BAA2B;IAC3B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,iCAAiC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gCAAgC;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,uCAAuC;IACvC,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mEAAmE;IACnE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,wBAAwB;IACxB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAgED,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/svelte/components/layout/MemberList.svelte

@@ -4,6 +4,7 @@
  * Lists participants grouped by online status with role badges
  */
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
+import { Button } from '@happyvertical/smrt-ui/ui';
 import { M } from '../../i18n.messages.js';
 import type { ChatParticipantData } from '../../types.js';
 
@@ -74,7 +75,9 @@ function getRoleBadgeLabel(role: string): string {
   <div class="member-list__header">
     <h2 class="member-list__title">Members</h2>
     <span class="member-list__count">{participants.length}</span>
-    <button
+    <Button
+      variant="ghost"
+      size="sm"
       class="close-btn"
       type="button"
       onclick={onclose}
@@ -84,7 +87,7 @@ function getRoleBadgeLabel(role: string): string {
         <path d="M18 6 6 18" />
         <path d="m6 6 12 12" />
       </svg>
-    </button>
+    </Button>
   </div>
 
   <div class="member-list__content">
@@ -235,30 +238,22 @@ function getRoleBadgeLabel(role: string): string {
     color: var(--smrt-color-on-surface-variant, #43474e);
   }
 
-  .close-btn {
+  /* :global() pierces into the Button child's rendered <button> (see #1589). */
+  .member-list__header :global(.close-btn) {
     margin-left: auto;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
     width: 1.75rem;
     height: 1.75rem;
-    border: none;
+    padding: 0;
     background: none;
     border-radius: var(--smrt-radius-medium, 0.5rem);
     color: var(--smrt-color-on-surface-variant, #43474e);
-    cursor: pointer;
     transition: background var(--smrt-duration-short2, 150ms);
   }
 
-  .close-btn:hover {
+  .member-list__header :global(.close-btn:hover) {
     background: var(--smrt-color-surface-variant, #e1e2ec);
   }
 
-  .close-btn:focus-visible {
-    outline: 2px solid var(--smrt-color-primary, #005ac1);
-    outline-offset: -2px;
-  }
-
   .close-btn__icon {
     width: 1rem;
     height: 1rem;
@@ -384,7 +379,7 @@ function getRoleBadgeLabel(role: string): string {
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .close-btn {
+    .member-list__header :global(.close-btn) {
       transition: none;
     }
   }

package/dist/svelte/components/layout/MemberList.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MemberList.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/layout/MemberList.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAG1D,MAAM,WAAW,KAAK;IACpB,wBAAwB;IACxB,YAAY,EAAE,mBAAmB,EAAE,CAAC;IACpC,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AA0LD,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"MemberList.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/layout/MemberList.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAG1D,MAAM,WAAW,KAAK;IACpB,wBAAwB;IACxB,YAAY,EAAE,mBAAmB,EAAE,CAAC;IACpC,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AA2LD,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}