@flamingo-stack/openframe-frontend-core 0.0.777 → 0.0.781

package/dist/components/features/push-button-selector.d.ts

@@ -67,25 +67,6 @@ interface PushButtonSelectorProps<Id extends SelectableOptionId = string> {
     /** Rendered under the list (result counts, hints). */
     footer?: React.ReactNode;
 }
-export interface PushButtonSelectorSkeletonProps {
-    /** How many option rows to draw (the selector's `skeletonCount`). */
-    count?: number;
-    /** The selector's title and help text: static copy, drawn as they are. */
-    title?: string;
-    helpText?: string;
-    /** Sections, whose headers are drawn as they are, each over its share of the rows. */
-    sections?: SectionDefinition[];
-    /** Whether the rows carry a description line under the name (default true). */
-    description?: boolean;
-    /** The loading state announces itself (`LoadingRegion`). `false` inside another loading region. Default `true`. */
-    region?: boolean;
-    className?: string;
-}
-/**
- * The selector while its options are read: its title, section headers and help text drawn for real, every option
- * row a skeleton of the row. `PushButtonSelector` draws it while `isLoading` and in a loading scope.
- */
-export declare function PushButtonSelectorSkeleton({ count, title, helpText, sections, description, region, className, }: PushButtonSelectorSkeletonProps): React.JSX.Element;
 export declare function PushButtonSelector<Id extends SelectableOptionId = string>({ options, selectedIds, onSelectionChange, multiSelect, title, helpText, className, selectionSummary, optional, isLoading, error, skeletonCount, optionDescriptions, sections, search, lazyLoad, emptyMessage, footer, }: PushButtonSelectorProps<Id>): React.JSX.Element;
 export {};
 //# sourceMappingURL=push-button-selector.d.ts.map

package/dist/components/features/push-button-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"push-button-selector.d.ts","sourceRoot":"","sources":["../../../src/components/features/push-button-selector.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"push-button-selector.d.ts","sourceRoot":"","sources":["../../../src/components/features/push-button-selector.tsx"],"names":[],"mappings":"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"}

package/dist/components/features/push-button-selector.js

@@ -7,8 +7,9 @@ import { cn } from "../../utils/cn.js";
 import { LoadingRegion } from "../loading/loading-region.js";
 import { TextLineSkeleton, UnifiedSkeleton } from "../loading/unified-skeleton.js";
 import { Badge, Input } from "../ui/index.js";
-import { useLoadingScope } from "../ui/loading-scope.js";
+import { LoadingItems, loadingItemProps, useLoadingScope } from "../ui/loading-scope.js";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/tooltip.js";
+const PUSH_BUTTON_SELECTOR_SKELETON_OPTIONS = 3;
 const SELECTOR_STACK_CLASS = "space-y-4";
 const SELECTOR_TITLE_CLASS = "text-ods-text-primary text-h5";
 const SELECTOR_HELP_CLASS = "text-ods-text-secondary text-h6";
@@ -25,8 +26,11 @@ const SELECTION_BOX_CLASS = `flex ${CONTROL_SIZE.selection} flex-shrink-0 items-
 const SELECTION_BOX_IDLE_CLASS = "border-ods-border";
 const OPTION_ICON_BOX_CLASS = `flex ${TILE_SIZE.sm} shrink-0 items-center justify-center`;
 const OPTION_IDLE_SURFACE_CLASS = "border-ods-border bg-ods-bg";
-function OptionRowSkeleton({ description = true }) {
-  return /* @__PURE__ */ jsx("div", { className: cn(OPTION_FRAME_CLASS, OPTION_IDLE_SURFACE_CLASS), children: /* @__PURE__ */ jsxs("div", { className: OPTION_ROW_CLASS, children: [
+function OptionRowSkeleton({
+  description = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn(OPTION_FRAME_CLASS, OPTION_IDLE_SURFACE_CLASS), ...loadingItemProps(props), children: /* @__PURE__ */ jsxs("div", { className: OPTION_ROW_CLASS, children: [
     /* @__PURE__ */ jsxs("div", { className: OPTION_LEAD_CLASS, children: [
       /* @__PURE__ */ jsx(UnifiedSkeleton, { className: OPTION_ICON_BOX_CLASS }),
       /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
@@ -51,10 +55,7 @@ function OptionListSkeleton({
   sections,
   description
 }) {
-  const rows = (n) => (
-    // biome-ignore lint/suspicious/noArrayIndexKey: skeleton rows never reorder
-    Array.from({ length: n }, (_, i) => /* @__PURE__ */ jsx(OptionRowSkeleton, { description }, i))
-  );
+  const rows = (n) => /* @__PURE__ */ jsx(LoadingItems, { count: n, children: () => /* @__PURE__ */ jsx(OptionRowSkeleton, { description, "data-loading-item": true }) });
   if (!sections || sections.length === 0) return /* @__PURE__ */ jsx("div", { className: OPTION_LIST_CLASS, children: rows(count) });
   const perSection = Math.max(1, Math.round(count / sections.length));
   return /* @__PURE__ */ jsx("div", { className: SECTIONED_LIST_CLASS, children: sections.map((section) => /* @__PURE__ */ jsxs("div", { className: SECTION_CLASS, children: [
@@ -63,7 +64,7 @@ function OptionListSkeleton({
   ] }, section.id)) });
 }
 function PushButtonSelectorSkeleton({
-  count = 3,
+  count = PUSH_BUTTON_SELECTOR_SKELETON_OPTIONS,
   title,
   helpText,
   sections,
@@ -98,7 +99,7 @@ function PushButtonSelector({
   optional = false,
   isLoading = false,
   error = null,
-  skeletonCount = 3,
+  skeletonCount = PUSH_BUTTON_SELECTOR_SKELETON_OPTIONS,
   optionDescriptions = true,
   sections,
   search,
@@ -135,6 +136,7 @@ function PushButtonSelector({
   const searchInput = search ? /* @__PURE__ */ jsx(
     Input,
     {
+      userValue: true,
       value: search.value,
       onChange: (e) => search.onChange(e.target.value),
       placeholder: search.placeholder,
@@ -181,6 +183,7 @@ function PushButtonSelector({
     const optionEl = /* @__PURE__ */ jsx(
       "div",
       {
+        "data-loading-item": true,
         className: cn(
           "group transition-all duration-200",
           OPTION_FRAME_CLASS,
@@ -292,6 +295,5 @@ function PushButtonSelector({
   ] }) });
 }
 export {
-  PushButtonSelector,
-  PushButtonSelectorSkeleton
+  PushButtonSelector
 };

package/dist/components/features/remote-session/index.d.ts

@@ -4,7 +4,7 @@ export { RemoteSessionBlockFrame, RemoteSessionEndButton, RemoteSessionMinimized
 export type { RemoteSessionBlockFrameProps, RemoteSessionMinimizedChipProps, RemoteSessionSummaryProps, } from './remote-session-block';
 export { RemoteSessionChatPanel } from './remote-session-chat-panel';
 export type { RemoteSessionChatPanelProps } from './remote-session-chat-panel';
-export { RemoteDesktopChatMessageRow, RemoteDesktopChatMessageRowSkeleton } from './remote-desktop-chat-message-row';
+export { RemoteDesktopChatMessageRow } from './remote-desktop-chat-message-row';
 export type { RemoteDesktopChatMessageRowProps } from './remote-desktop-chat-message-row';
 export { REMOTE_DESKTOP_CHAT_END_USER_NAME, RemoteDesktopChatPanel } from './remote-desktop-chat-panel';
 export type { RemoteDesktopChatPanelProps, RemoteDesktopChatTechnician } from './remote-desktop-chat-panel';

package/dist/components/features/remote-session/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,YAAY,EAAE,4BAA4B,EAAE,MAAM,8BAA8B,CAAC;AACjF,OAAO,EACL,uBAAuB,EACvB,sBAAsB,EACtB,0BAA0B,EAC1B,oBAAoB,GACrB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EACV,4BAA4B,EAC5B,+BAA+B,EAC/B,yBAAyB,GAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,YAAY,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAC/E,OAAO,EAAE,2BAA2B,EAAE,mCAAmC,EAAE,MAAM,mCAAmC,CAAC;AACrH,YAAY,EAAE,gCAAgC,EAAE,MAAM,mCAAmC,CAAC;AAC1F,OAAO,EAAE,iCAAiC,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACxG,YAAY,EAAE,2BAA2B,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAC5G,OAAO,EAAE,8BAA8B,EAAE,MAAM,qCAAqC,CAAC;AACrF,YAAY,EAAE,mCAAmC,EAAE,MAAM,qCAAqC,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,YAAY,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClF,OAAO,EACL,iCAAiC,EACjC,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,8BAA8B,CAAC;AACtC,YAAY,EACV,uBAAuB,EACvB,sBAAsB,EACtB,wBAAwB,GACzB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACxF,YAAY,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACvG,OAAO,EACL,sBAAsB,EACtB,4BAA4B,EAC5B,yBAAyB,GAC1B,MAAM,yBAAyB,CAAC;AACjC,YAAY,EAAE,2BAA2B,EAAE,iCAAiC,EAAE,MAAM,yBAAyB,CAAC;AAC9G,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACjH,YAAY,EACV,wBAAwB,EACxB,2BAA2B,EAC3B,8BAA8B,GAC/B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAChE,YAAY,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,EACL,gCAAgC,EAChC,oBAAoB,EACpB,oBAAoB,EACpB,yBAAyB,EACzB,kBAAkB,EAClB,0BAA0B,EAC1B,qBAAqB,GACtB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACjG,YAAY,EACV,oBAAoB,EACpB,uBAAuB,EACvB,wBAAwB,EACxB,0BAA0B,EAC1B,yBAAyB,EACzB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,YAAY,EAAE,4BAA4B,EAAE,MAAM,8BAA8B,CAAC;AACjF,OAAO,EACL,uBAAuB,EACvB,sBAAsB,EACtB,0BAA0B,EAC1B,oBAAoB,GACrB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EACV,4BAA4B,EAC5B,+BAA+B,EAC/B,yBAAyB,GAC1B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,YAAY,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAC/E,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAChF,YAAY,EAAE,gCAAgC,EAAE,MAAM,mCAAmC,CAAC;AAC1F,OAAO,EAAE,iCAAiC,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACxG,YAAY,EAAE,2BAA2B,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAC5G,OAAO,EAAE,8BAA8B,EAAE,MAAM,qCAAqC,CAAC;AACrF,YAAY,EAAE,mCAAmC,EAAE,MAAM,qCAAqC,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,YAAY,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClF,OAAO,EACL,iCAAiC,EACjC,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,8BAA8B,CAAC;AACtC,YAAY,EACV,uBAAuB,EACvB,sBAAsB,EACtB,wBAAwB,GACzB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACxF,YAAY,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACvG,OAAO,EACL,sBAAsB,EACtB,4BAA4B,EAC5B,yBAAyB,GAC1B,MAAM,yBAAyB,CAAC;AACjC,YAAY,EAAE,2BAA2B,EAAE,iCAAiC,EAAE,MAAM,yBAAyB,CAAC;AAC9G,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACjH,YAAY,EACV,wBAAwB,EACxB,2BAA2B,EAC3B,8BAA8B,GAC/B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAChE,YAAY,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,EACL,gCAAgC,EAChC,oBAAoB,EACpB,oBAAoB,EACpB,yBAAyB,EACzB,kBAAkB,EAClB,0BAA0B,EAC1B,qBAAqB,GACtB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACjG,YAAY,EACV,oBAAoB,EACpB,uBAAuB,EACvB,wBAAwB,EACxB,0BAA0B,EAC1B,yBAAyB,EACzB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,SAAS,CAAC"}

package/dist/components/features/remote-session/index.js

@@ -6,7 +6,7 @@ import {
   RemoteSessionSummary
 } from "./remote-session-block.js";
 import { RemoteSessionChatPanel } from "./remote-session-chat-panel.js";
-import { RemoteDesktopChatMessageRow, RemoteDesktopChatMessageRowSkeleton } from "./remote-desktop-chat-message-row.js";
+import { RemoteDesktopChatMessageRow } from "./remote-desktop-chat-message-row.js";
 import { REMOTE_DESKTOP_CHAT_END_USER_NAME, RemoteDesktopChatPanel } from "./remote-desktop-chat-panel.js";
 import { RemoteDesktopFullscreenToolbar } from "./remote-desktop-fullscreen-toolbar.js";
 import { RemoteDesktopView } from "./remote-desktop-view.js";
@@ -43,7 +43,6 @@ export {
   ReleaseKeepingModal,
   RemoteAccessRequestCard,
   RemoteDesktopChatMessageRow,
-  RemoteDesktopChatMessageRowSkeleton,
   RemoteDesktopChatPanel,
   RemoteDesktopFullscreenToolbar,
   RemoteDesktopView,

package/dist/components/features/remote-session/remote-desktop-chat-message-row.d.ts

@@ -6,6 +6,11 @@ export interface RemoteDesktopChatMessageRowProps {
     /** When the message was sent: an ISO timestamp or a `Date`. */
     sentAt: string | Date;
     body: string;
+    /** The message is still being read: the SAME row draws its name, time and body as bars (and the technician's avatar
+     *  in its loading form on a technician's row). A loading scope does the same. */
+    loading?: boolean;
+    /** List markers (`data-loading-item`), set by the list on its rows in both forms. */
+    [key: `data-${string}`]: unknown;
 }
 /**
  * One session-chat message on the technician's side, shared by the recording
@@ -16,8 +21,9 @@ export interface RemoteDesktopChatMessageRowProps {
  * Names are Azeret Mono 18/24 medium in the mockup - a combination the ODS
  * composite utilities don't carry (`text-h5` is the 14px uppercase caption),
  * so the heading family is applied over `text-h4` via the ODS font variable.
+ *
+ * ONE switch (`useLoadingScope() || loading`): while the chat is read the row keeps its structure and draws its read
+ * text as bars.
  */
-export declare function RemoteDesktopChatMessageRow({ authorName, isTechnician, avatarUrl, sentAt, body, }: RemoteDesktopChatMessageRowProps): import("react").JSX.Element;
-/** A message row while the chat is read: the name and the time as bars on the name row, one line of the body. */
-export declare function RemoteDesktopChatMessageRowSkeleton(): import("react").JSX.Element;
+export declare function RemoteDesktopChatMessageRow({ authorName, isTechnician, avatarUrl, sentAt, body, loading: loadingProp, ...props }: RemoteDesktopChatMessageRowProps): import("react").JSX.Element;
 //# sourceMappingURL=remote-desktop-chat-message-row.d.ts.map

package/dist/components/features/remote-session/remote-desktop-chat-message-row.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-desktop-chat-message-row.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-chat-message-row.tsx"],"names":[],"mappings":"AAYA,MAAM,WAAW,gCAAgC;IAC/C,UAAU,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;GASG;AACH,wBAAgB,2BAA2B,CAAC,EAC1C,UAAU,EACV,YAAY,EACZ,SAAS,EACT,MAAM,EACN,IAAI,GACL,EAAE,gCAAgC,+BAkBlC;AAED,iHAAiH;AACjH,wBAAgB,mCAAmC,gCAYlD"}
+{"version":3,"file":"remote-desktop-chat-message-row.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-chat-message-row.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,gCAAgC;IAC/C,UAAU,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb;qFACiF;IACjF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qFAAqF;IACrF,CAAC,GAAG,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAClC;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,2BAA2B,CAAC,EAC1C,UAAU,EACV,YAAY,EACZ,SAAS,EACT,MAAM,EACN,IAAI,EACJ,OAAO,EAAE,WAAmB,EAC5B,GAAG,KAAK,EACT,EAAE,gCAAgC,+BAoClC"}

package/dist/components/features/remote-session/remote-desktop-chat-message-row.js

@@ -3,36 +3,50 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../../utils/cn.js";
 import { formatTime } from "../../../utils/format-date.js";
 import { TextLineSkeleton } from "../../loading/unified-skeleton.js";
+import { loadingItemProps, useLoadingScope } from "../../ui/loading-scope.js";
 import { SquareAvatar } from "../../ui/square-avatar.js";
 const MESSAGE_ROW_CLASS = "grid grid-cols-1 gap-[var(--spacing-system-xxs)]";
 const MESSAGE_HEAD_CLASS = "flex items-center gap-[var(--spacing-system-xxs)]";
+const TECHNICIAN_AVATAR_PX = 24;
 const MESSAGE_NAME_CLASS = "min-w-0 flex-1 truncate text-h4 [font-family:var(--font-family-heading)]";
 function RemoteDesktopChatMessageRow({
   authorName,
   isTechnician,
   avatarUrl,
   sentAt,
-  body
+  body,
+  loading: loadingProp = false,
+  ...props
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: MESSAGE_ROW_CLASS, children: [
+  const loading = useLoadingScope() || loadingProp;
+  return /* @__PURE__ */ jsxs("div", { className: MESSAGE_ROW_CLASS, "aria-hidden": loading || void 0, ...loadingItemProps(props), children: [
     /* @__PURE__ */ jsxs("div", { className: MESSAGE_HEAD_CLASS, children: [
-      isTechnician && /* @__PURE__ */ jsx(SquareAvatar, { variant: "round", sizePx: 24, src: avatarUrl, alt: authorName, className: "shrink-0" }),
-      /* @__PURE__ */ jsx("span", { className: cn(MESSAGE_NAME_CLASS, isTechnician ? "text-ods-accent" : "text-ods-text-secondary"), children: authorName }),
-      /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, className: "shrink-0 text-ods-text-secondary text-h6", children: formatTime(sentAt) })
+      isTechnician && /* @__PURE__ */ jsx(
+        SquareAvatar,
+        {
+          loading,
+          variant: "round",
+          sizePx: TECHNICIAN_AVATAR_PX,
+          src: avatarUrl,
+          alt: authorName,
+          className: "shrink-0"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(MESSAGE_NAME_CLASS, !loading && (isTechnician ? "text-ods-accent" : "text-ods-text-secondary")),
+          children: loading ? /* @__PURE__ */ jsx(TextLineSkeleton, { type: "inherit", as: "span", className: "w-24" }) : authorName
+        }
+      ),
+      loading ? /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h6", as: "span", className: "w-12 shrink-0" }) : (
+        // The time is in the viewer's zone, which a server render cannot know.
+        /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, className: "shrink-0 text-ods-text-secondary text-h6", children: formatTime(sentAt) })
+      )
     ] }),
-    /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-ods-text-primary text-h4", children: body })
-  ] });
-}
-function RemoteDesktopChatMessageRowSkeleton() {
-  return /* @__PURE__ */ jsxs("div", { className: MESSAGE_ROW_CLASS, "aria-hidden": true, children: [
-    /* @__PURE__ */ jsxs("div", { className: MESSAGE_HEAD_CLASS, children: [
-      /* @__PURE__ */ jsx("span", { className: MESSAGE_NAME_CLASS, children: /* @__PURE__ */ jsx(TextLineSkeleton, { type: "inherit", as: "span", className: "w-24" }) }),
-      /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h6", as: "span", className: "w-12 shrink-0" })
-    ] }),
-    /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h4", className: "w-3/4" })
+    loading ? /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h4", className: "w-3/4" }) : /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-ods-text-primary text-h4", children: body })
   ] });
 }
 export {
-  RemoteDesktopChatMessageRow,
-  RemoteDesktopChatMessageRowSkeleton
+  RemoteDesktopChatMessageRow
 };

package/dist/components/features/remote-session/remote-desktop-chat-panel.d.ts

@@ -27,5 +27,5 @@ export interface RemoteDesktopChatPanelProps {
  * `RemoteSessionChatPanel` in the session block; the "joined the chat" notice
  * is that side's indication only and is not shown here.
  */
-export declare function RemoteDesktopChatPanel({ messages, loading, technician, sending, onSend, variant, }: RemoteDesktopChatPanelProps): import("react").JSX.Element;
+export declare function RemoteDesktopChatPanel({ messages, loading: loadingProp, technician, sending, onSend, variant, }: RemoteDesktopChatPanelProps): import("react").JSX.Element;
 //# sourceMappingURL=remote-desktop-chat-panel.d.ts.map

package/dist/components/features/remote-session/remote-desktop-chat-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-desktop-chat-panel.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-chat-panel.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAQxD,0FAA0F;AAC1F,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,+FAA+F;AAC/F,eAAO,MAAM,iCAAiC,SAAS,CAAC;AAExD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,iGAAiG;IACjG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,2BAA2B,CAAC;IACxC,OAAO,EAAE,OAAO,CAAC;IACjB,0EAA0E;IAC1E,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAC3C;;;;OAIG;IACH,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;CAC7B;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,OAAO,EACP,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,GACR,EAAE,2BAA2B,+BA8D7B"}
+{"version":3,"file":"remote-desktop-chat-panel.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-chat-panel.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAQxD,0FAA0F;AAC1F,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,+FAA+F;AAC/F,eAAO,MAAM,iCAAiC,SAAS,CAAC;AAExD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,iGAAiG;IACjG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,2BAA2B,CAAC;IACxC,OAAO,EAAE,OAAO,CAAC;IACjB,0EAA0E;IAC1E,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAC3C;;;;OAIG;IACH,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;CAC7B;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,GACR,EAAE,2BAA2B,+BA2E7B"}

package/dist/components/features/remote-session/remote-desktop-chat-panel.js

@@ -4,12 +4,13 @@ import { useEffect, useRef } from "react";
 import { cn } from "../../../utils/cn.js";
 import { ChatInput } from "../../chat/chat-input.js";
 import { LoadingRegion } from "../../loading/loading-region.js";
-import { RemoteDesktopChatMessageRow, RemoteDesktopChatMessageRowSkeleton } from "./remote-desktop-chat-message-row.js";
+import { LoadingItems, useLoadingScope } from "../../ui/loading-scope.js";
+import { RemoteDesktopChatMessageRow } from "./remote-desktop-chat-message-row.js";
 const CHAT_PANEL_SKELETON_ROWS = 10;
 const REMOTE_DESKTOP_CHAT_END_USER_NAME = "User";
 function RemoteDesktopChatPanel({
   messages,
-  loading,
+  loading: loadingProp,
   technician,
   sending,
   onSend,
@@ -17,6 +18,7 @@ function RemoteDesktopChatPanel({
 }) {
   const scrollRef = useRef(null);
   const rows = messages.filter((message) => message.author !== "system");
+  const loading = useLoadingScope() || rows.length === 0 && !!loadingProp;
   useEffect(() => {
     const el = scrollRef.current;
     if (el) el.scrollTop = el.scrollHeight;
@@ -30,16 +32,27 @@ function RemoteDesktopChatPanel({
         variant === "side" ? "h-full w-[400px] flex-shrink-0" : "absolute bottom-[var(--spacing-system-mf)] right-[var(--spacing-system-mf)] top-[calc(var(--spacing-system-xlf)+var(--spacing-system-mf))] z-10 w-[360px] shadow-lg"
       ),
       children: [
-        /* @__PURE__ */ jsx("div", { ref: scrollRef, className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx("div", { className: "flex min-h-full flex-col justify-end gap-[var(--spacing-system-xsf)]", children: rows.length === 0 && loading ? (
+        /* @__PURE__ */ jsx("div", { ref: scrollRef, className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx("div", { className: "flex min-h-full flex-col justify-end gap-[var(--spacing-system-xsf)]", children: loading ? (
           // The chat while it is read: a screen of the panel's own message rows, stacked by a one-column grid
           // (the thread above is already the column flexbox: WEBVIEW-001).
-          /* @__PURE__ */ jsx(LoadingRegion, { label: "Loading the chat", className: "grid grid-cols-1 gap-[var(--spacing-system-xsf)]", children: Array.from({ length: CHAT_PANEL_SKELETON_ROWS }, (_, i) => (
-            // biome-ignore lint/suspicious/noArrayIndexKey: skeleton rows never reorder
-            /* @__PURE__ */ jsx(RemoteDesktopChatMessageRowSkeleton, {}, i)
-          )) })
+          /* @__PURE__ */ jsx(LoadingRegion, { label: "Loading the chat", className: "grid grid-cols-1 gap-[var(--spacing-system-xsf)]", children: /* @__PURE__ */ jsx(LoadingItems, { count: CHAT_PANEL_SKELETON_ROWS, children: (i) => (
+            // A conversation: the technician and the user take turns.
+            /* @__PURE__ */ jsx(
+              RemoteDesktopChatMessageRow,
+              {
+                loading: true,
+                "data-loading-item": true,
+                isTechnician: i % 2 === 1,
+                authorName: "",
+                sentAt: "",
+                body: ""
+              }
+            )
+          ) }) })
         ) : rows.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-center text-ods-text-muted text-h6", children: "No messages yet - say hello to the user." }) : rows.map((message) => /* @__PURE__ */ jsx(
           RemoteDesktopChatMessageRow,
           {
+            "data-loading-item": true,
             authorName: message.name || (message.author === "technician" ? technician.name : REMOTE_DESKTOP_CHAT_END_USER_NAME),
             isTechnician: message.author === "technician",
             avatarUrl: message.author === "technician" ? technician.avatarUrl : void 0,

package/dist/components/features/remote-session/remote-desktop-fullscreen-toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-desktop-fullscreen-toolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-fullscreen-toolbar.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAuB,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGnF,MAAM,WAAW,mCAAmC;IAClD,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,wBAAgB,8BAA8B,CAAC,EAC7C,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,QAAgB,EAChB,YAAY,GACb,EAAE,mCAAmC,+BA+ErC"}
+{"version":3,"file":"remote-desktop-fullscreen-toolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-fullscreen-toolbar.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAuB,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGnF,MAAM,WAAW,mCAAmC;IAClD,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,wBAAgB,8BAA8B,CAAC,EAC7C,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,QAAgB,EAChB,YAAY,GACb,EAAE,mCAAmC,+BAuErC"}

package/dist/components/features/remote-session/remote-desktop-fullscreen-toolbar.js

@@ -42,19 +42,11 @@ function RemoteDesktopFullscreenToolbar({
               ActionsMenuDropdown,
               {
                 groups: displayMenuGroups,
-                customTrigger: /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    "aria-label": "Switch display",
-                    className: "flex h-8 flex-shrink-0 items-center gap-[var(--spacing-system-xs)] rounded-[6px] border border-ods-border bg-ods-card p-[var(--spacing-system-xsf)] text-ods-text-primary hover:border-ods-border-hover",
-                    children: [
-                      /* @__PURE__ */ jsx(MonitorIcon, { className: "h-4 w-4" }),
-                      /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-h5", children: currentDisplayLabel }),
-                      /* @__PURE__ */ jsx(Chevron02DownIcon, { className: "h-4 w-4" })
-                    ]
-                  }
-                )
+                customTrigger: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "small", type: "button", "aria-label": "Switch display", className: "shrink-0", children: [
+                  /* @__PURE__ */ jsx(MonitorIcon, {}),
+                  /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap", children: currentDisplayLabel }),
+                  /* @__PURE__ */ jsx(Chevron02DownIcon, {})
+                ] })
               }
             )
           ] }),

package/dist/components/features/remote-session/remote-desktop-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-desktop-view.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAavC,OAAO,EAAuB,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAgBnF,MAAM,WAAW,sBAAsB;IACrC,uCAAuC;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,+FAA+F;IAC/F,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,yHAAyH;IACzH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,2FAA2F;IAC3F,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B;;;;;OAKG;IACH,MAAM,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,gBAAgB,EAChB,MAAM,EACN,UAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAsB,EACtB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,QAAgB,EAChB,YAAY,EACZ,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,OAAO,EAAE,WAAmB,GAC7B,EAAE,sBAAsB,+BAoJxB"}
+{"version":3,"file":"remote-desktop-view.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-desktop-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAavC,OAAO,EAAuB,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAgBnF,MAAM,WAAW,sBAAsB;IACrC,uCAAuC;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,+FAA+F;IAC/F,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,yHAAyH;IACzH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,2FAA2F;IAC3F,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACtC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B;;;;;OAKG;IACH,MAAM,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,gBAAgB,EAChB,MAAM,EACN,UAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAsB,EACtB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,QAAgB,EAChB,YAAY,EACZ,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,OAAO,EAAE,WAAmB,GAC7B,EAAE,sBAAsB,+BAkJxB"}

package/dist/components/features/remote-session/remote-desktop-view.js

@@ -102,26 +102,18 @@ function RemoteDesktopView({
         )
       ] })
     ] }),
-    displayMenuGroups.length > 0 && /* @__PURE__ */ jsx(
+    displayMenuGroups.length > 0 && /* @__PURE__ */ jsx("div", { className: "border-t border-ods-border", children: /* @__PURE__ */ jsx(
       ActionsMenuDropdown,
       {
         groups: displayMenuGroups,
         align: "start",
-        customTrigger: /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Switch display",
-            className: "flex w-full items-center gap-[var(--spacing-system-xs)] border-t border-ods-border p-[var(--spacing-system-sf)] text-left text-ods-text-primary outline-none transition-colors hover:bg-ods-bg-hover focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ods-focus",
-            children: [
-              /* @__PURE__ */ jsx(MonitorIcon, { className: "h-6 w-6 shrink-0" }),
-              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-h4", children: currentDisplayLabel }),
-              /* @__PURE__ */ jsx(Chevron02DownIcon, { className: "h-6 w-6 shrink-0" })
-            ]
-          }
-        )
+        customTrigger: /* @__PURE__ */ jsxs(Button, { variant: "row", type: "button", "aria-label": "Switch display", children: [
+          /* @__PURE__ */ jsx(MonitorIcon, { className: "h-6 w-6" }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: currentDisplayLabel }),
+          /* @__PURE__ */ jsx(Chevron02DownIcon, { className: "h-6 w-6" })
+        ] })
       }
-    )
+    ) })
   ] });
   if (loading) {
     return /* @__PURE__ */ jsx(PageLayout, { className: PAGE_CLASS, backButton: onBack ? { label: "Back", onClick: onBack } : void 0, children: /* @__PURE__ */ jsxs(LoadingRegion, { label: "Loading the remote session", announce: !inScope, className: "contents", children: [

package/dist/components/features/remote-session/remote-session-block.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-session-block.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-block.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAYnD,OAAO,KAAK,EAAE,yBAAyB,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAElG,MAAM,WAAW,4BAA4B;IAC3C,qCAAqC;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,yHA4BnC,CAAC;AAGF,2EAA2E;AAC3E,wBAAgB,sBAAsB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,IAAI,CAAA;CAAE,+BAWpF;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,+DAA+D;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAChC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,4DAA4D;IAC5D,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED,qFAAqF;AACrF,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,OAAO,EACP,gBAAwB,EACxB,OAAO,EACP,UAAU,EACV,YAAY,EACZ,YAAY,GACb,EAAE,yBAAyB,+BA4C3B;AAED,MAAM,WAAW,+BAA+B;IAC9C,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED,6GAA6G;AAC7G,eAAO,MAAM,0BAA0B,+HAoCtC,CAAC"}
+{"version":3,"file":"remote-session-block.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-block.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAYnD,OAAO,KAAK,EAAE,yBAAyB,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAElG,MAAM,WAAW,4BAA4B;IAC3C,qCAAqC;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,yHA0BnC,CAAC;AAGF,2EAA2E;AAC3E,wBAAgB,sBAAsB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,IAAI,CAAA;CAAE,+BAWpF;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,+DAA+D;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAChC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,4DAA4D;IAC5D,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED,qFAAqF;AACrF,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,OAAO,EACP,gBAAwB,EACxB,OAAO,EACP,UAAU,EACV,YAAY,EACZ,YAAY,GACb,EAAE,yBAAyB,+BA4C3B;AAED,MAAM,WAAW,+BAA+B;IAC9C,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED,6GAA6G;AAC7G,eAAO,MAAM,0BAA0B,+HAoCtC,CAAC"}

package/dist/components/features/remote-session/remote-session-block.js

@@ -25,26 +25,18 @@ const RemoteSessionBlockFrame = forwardRef(
         ),
         children: [
           children,
-          /* @__PURE__ */ jsxs(
-            "button",
-            {
-              type: "button",
-              className: "flex h-12 w-full shrink-0 items-center gap-[var(--spacing-system-xs)] border-t border-ods-border bg-ods-card px-[var(--spacing-system-m)]",
-              onClick: onHide,
-              children: [
-                /* @__PURE__ */ jsx(Chevrons03RightIcon, { size: 24 }),
-                /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-left text-ods-text-secondary text-h4", children: "Hide this Block" }),
-                /* @__PURE__ */ jsx(
-                  OpenframeLogoIcon,
-                  {
-                    color: "var(--color-text-on-accent)",
-                    secondaryColor: "var(--color-text-primary)",
-                    className: "size-6 shrink-0"
-                  }
-                )
-              ]
-            }
-          )
+          /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t border-ods-border bg-ods-card", children: /* @__PURE__ */ jsxs(Button, { variant: "row", type: "button", className: "h-12", onClick: onHide, children: [
+            /* @__PURE__ */ jsx(Chevrons03RightIcon, { size: 24 }),
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-ods-text-secondary", children: "Hide this Block" }),
+            /* @__PURE__ */ jsx(
+              OpenframeLogoIcon,
+              {
+                color: "var(--color-text-on-accent)",
+                secondaryColor: "var(--color-text-primary)",
+                className: "size-6"
+              }
+            )
+          ] }) })
         ]
       }
     );
@@ -127,19 +119,17 @@ function RemoteSessionSummary({
 const RemoteSessionMinimizedChip = forwardRef(
   ({ party, onExpand, dragHandlers }, ref) => {
     const technician = party.technicianName;
-    return /* @__PURE__ */ jsxs(
-      "button",
+    return /* @__PURE__ */ jsx(
+      Button,
       {
+        variant: "card",
         ref,
         type: "button",
         "aria-label": "Show session block",
-        className: cn(
-          "flex shrink-0 flex-col overflow-hidden rounded-md border border-ods-border",
-          dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
-        ),
+        className: cn("w-auto shrink-0", dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS),
         onClick: onExpand,
         ...dragHandlers,
-        children: [
+        children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col overflow-hidden rounded-md border border-ods-border", children: [
           technician ? /* @__PURE__ */ jsx(
             SquareAvatar,
             {
@@ -158,7 +148,7 @@ const RemoteSessionMinimizedChip = forwardRef(
             }
           ),
           /* @__PURE__ */ jsx("span", { className: "flex h-9 w-12 items-center justify-center border-t border-ods-border bg-ods-card", children: /* @__PURE__ */ jsx(Chevrons03LeftIcon, { size: 24 }) })
-        ]
+        ] })
       }
     );
   }

package/dist/components/features/remote-session/remote-session-chat-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-session-chat-panel.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-chat-panel.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,wBAAwB,EACxB,yBAAyB,EACzB,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,kBAAkB,CAAC;IAC1B,+DAA+D;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAChC,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,wFAAwF;IACxF,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,0EAA0E;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,wDAAwD;IACxD,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAMD,6DAA6D;AAC7D,wBAAgB,sBAAsB,CAAC,EACrC,KAAK,EACL,OAAO,EACP,QAAQ,EACR,gBAAwB,EACxB,OAAO,EACP,KAAK,EACL,aAAa,EACb,MAAM,EACN,KAAY,EACZ,KAAK,EACL,WAAW,EACX,YAAY,EACZ,YAAY,GACb,EAAE,2BAA2B,+BAyF7B"}
+{"version":3,"file":"remote-session-chat-panel.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-chat-panel.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,wBAAwB,EACxB,yBAAyB,EACzB,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,kBAAkB,CAAC;IAC1B,+DAA+D;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAChC,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,wFAAwF;IACxF,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,0EAA0E;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,wDAAwD;IACxD,YAAY,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAMD,6DAA6D;AAC7D,wBAAgB,sBAAsB,CAAC,EACrC,KAAK,EACL,OAAO,EACP,QAAQ,EACR,gBAAwB,EACxB,OAAO,EACP,KAAK,EACL,aAAa,EACb,MAAM,EACN,KAAY,EACZ,KAAK,EACL,WAAW,EACX,YAAY,EACZ,YAAY,GACb,EAAE,2BAA2B,+BA2F7B"}

package/dist/components/features/remote-session/remote-session-chat-panel.js

@@ -107,13 +107,15 @@ function RemoteSessionChatPanel({
             }
           ),
           /* @__PURE__ */ jsx(
-            "button",
+            Button,
             {
+              variant: "transparent",
+              size: "icon",
               type: "submit",
               "aria-label": "Send message",
               disabled: !ready,
-              className: "flex size-12 shrink-0 items-center justify-center",
-              children: /* @__PURE__ */ jsx(Send03Icon, { size: 24, color: "currentColor", className: "text-ods-text-primary" })
+              className: "shrink-0",
+              children: /* @__PURE__ */ jsx(Send03Icon, { size: 24, color: "currentColor" })
             }
           )
         ]

package/dist/components/features/remote-session/remote-session-events.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-session-events.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-events.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,+EAA+E;AAC/E,wBAAgB,yBAAyB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMlE;AAED,MAAM,WAAW,2BAA2B;IAC1C,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wFAAwF;AACxF,wBAAgB,sBAAsB,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,2BAA2B,+BA8BjH;AAED,MAAM,WAAW,iCAAiC;IAChD,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,qEAAqE;IACrE,UAAU,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,8FAA8F;AAC9F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,QAAQ,EACR,SAAS,GACV,EAAE,iCAAiC,sCAqBnC"}
+{"version":3,"file":"remote-session-events.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-events.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,+EAA+E;AAC/E,wBAAgB,yBAAyB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMlE;AAED,MAAM,WAAW,2BAA2B;IAC1C,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wFAAwF;AACxF,wBAAgB,sBAAsB,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,2BAA2B,+BA4BjH;AAED,MAAM,WAAW,iCAAiC;IAChD,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,qEAAqE;IACrE,UAAU,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,8FAA8F;AAC9F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,QAAQ,EACR,SAAS,GACV,EAAE,iCAAiC,sCAwBnC"}

package/dist/components/features/remote-session/remote-session-events.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../../utils/cn.js";
+import { Button } from "../../ui/button/index.js";
 function formatRemoteSessionOffset(offsetMs) {
   const total = Math.max(0, Math.floor(offsetMs / 1e3));
   const hours = Math.floor(total / 3600);
@@ -12,16 +13,14 @@ function RemoteSessionEventList({ events, activeEventId, onSelect, className })
   return /* @__PURE__ */ jsxs("section", { className: cn("flex w-full flex-col gap-[var(--spacing-system-xxs)]", className), children: [
     /* @__PURE__ */ jsx("h2", { className: "text-ods-text-secondary text-h5", children: "Session Events" }),
     /* @__PURE__ */ jsx("ol", { className: "flex w-full flex-col gap-[var(--spacing-system-xxs)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-m)]", children: events.map((event) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
-      "button",
+      Button,
       {
+        variant: "row",
         type: "button",
         "aria-current": event.id === activeEventId || void 0,
+        "data-state": event.id === activeEventId ? "active" : void 0,
         onClick: () => onSelect?.(event),
-        className: cn(
-          "flex w-full items-start gap-[var(--spacing-system-xxs)] rounded-md p-[var(--spacing-system-xxs)] text-left outline-none transition-colors",
-          "hover:bg-ods-bg-hover focus-visible:ring-2 focus-visible:ring-ods-focus",
-          event.id === activeEventId && "bg-ods-border hover:bg-ods-border"
-        ),
+        className: "items-start",
         children: [
           /* @__PURE__ */ jsx("span", { className: "w-[84px] shrink-0 text-ods-text-secondary text-h4", children: formatRemoteSessionOffset(event.offsetMs) }),
           /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [
@@ -44,14 +43,16 @@ function RemoteSessionTimelineMarkers({
     const share = Math.min(1, Math.max(0, event.offsetMs / durationMs));
     const label = `${event.title} at ${formatRemoteSessionOffset(event.offsetMs)}`;
     return /* @__PURE__ */ jsx(
-      "button",
+      Button,
       {
+        variant: "card",
         type: "button",
         "aria-label": label,
         title: label,
         onClick: () => onSelect?.(event),
         style: { left: `${share * 100}%` },
-        className: "absolute top-0 h-4 w-1 -translate-x-1/2 rounded-md bg-ods-text-secondary outline-none transition-colors hover:bg-ods-text-primary focus-visible:ring-2 focus-visible:ring-ods-focus"
+        className: "absolute top-0 h-4 w-1 -translate-x-1/2",
+        children: /* @__PURE__ */ jsx("span", { className: "block size-full rounded-md bg-ods-text-secondary" })
       },
       event.id
     );

package/dist/components/features/remote-session/remote-session-overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"remote-session-overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-overlay.tsx"],"names":[],"mappings":"AAYA,2FAA2F;AAC3F,wBAAgB,mBAAmB,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAExE;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,IAAI,CAAA;CAAE,+BAW/E"}
+{"version":3,"file":"remote-session-overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/features/remote-session/remote-session-overlay.tsx"],"names":[],"mappings":"AAaA,2FAA2F;AAC3F,wBAAgB,mBAAmB,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAExE;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,IAAI,CAAA;CAAE,+BAO/E"}

package/dist/components/features/remote-session/remote-session-overlay.js

@@ -2,22 +2,15 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../../utils/cn.js";
 import { MonitorOffIcon } from "../../icons-v2-generated/index.js";
+import { Button } from "../../ui/button/index.js";
 function RemoteSessionBorder({ className }) {
   return /* @__PURE__ */ jsx("div", { className: cn("pointer-events-none size-full border-4 border-ods-warning", className) });
 }
 function RemoteSessionPill({ onEndSession }) {
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      className: "flex items-center gap-[var(--spacing-system-xsf)] rounded-b-md bg-ods-warning px-[var(--spacing-system-m)] py-[var(--spacing-system-xs)] text-ods-text-on-accent",
-      onClick: onEndSession,
-      children: [
-        /* @__PURE__ */ jsx(MonitorOffIcon, { size: 24, color: "currentColor" }),
-        /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-h3", children: "End Session" })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxs(Button, { variant: "warning", type: "button", onClick: onEndSession, children: [
+    /* @__PURE__ */ jsx(MonitorOffIcon, { size: 24, color: "currentColor" }),
+    /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap", children: "End Session" })
+  ] });
 }
 export {
   RemoteSessionBorder,