@flamingo-stack/openframe-frontend-core 0.0.748 → 0.0.749

package/dist/{chunk-U6XWGK53.cjs → chunk-ALPRQ3ZX.cjs}

@@ -17,7 +17,7 @@ var _chunkYRULLK7Ncjs = require('./chunk-YRULLK7N.cjs');
 
 
 
-var _chunkB27QEHYRcjs = require('./chunk-B27QEHYR.cjs');
+var _chunkP6F6PHVKcjs = require('./chunk-P6F6PHVK.cjs');
 
 
 var _chunk2NETL2MScjs = require('./chunk-2NETL2MS.cjs');
@@ -122,7 +122,10 @@ var _chunkHTRILBJDcjs = require('./chunk-HTRILBJD.cjs');
 
 
 
-var _chunkL2RMTGOKcjs = require('./chunk-L2RMTGOK.cjs');
+var _chunkMGF3FUKDcjs = require('./chunk-MGF3FUKD.cjs');
+
+
+var _chunkUGCRLRCTcjs = require('./chunk-UGCRLRCT.cjs');
 
 
 
@@ -137,7 +140,7 @@ var _chunkV45KLJQPcjs = require('./chunk-V45KLJQP.cjs');
 var _chunkOF336YWGcjs = require('./chunk-OF336YWG.cjs');
 
 
-var _chunk5M5C6UV4cjs = require('./chunk-5M5C6UV4.cjs');
+var _chunk2YXOD2KLcjs = require('./chunk-2YXOD2KL.cjs');
 
 
 var _chunk3ATAYP36cjs = require('./chunk-3ATAYP36.cjs');
@@ -1196,9 +1199,9 @@ function actionToMenuItems(action, idx) {
 function renderActionButton(action, opts = {}) {
   const button = renderRawActionButton(action, opts);
   if (!action.tooltip) return button;
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkB27QEHYRcjs.Tooltip, { children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.TooltipTrigger, { asChild: true, children: button }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.TooltipContent, { children: action.tooltip })
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkP6F6PHVKcjs.Tooltip, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.TooltipContent, { children: action.tooltip })
   ] }) });
 }
 function renderRawActionButton(action, opts = {}) {
@@ -1222,7 +1225,7 @@ function renderRawActionButton(action, opts = {}) {
   }
   if (action.submenu && action.submenu.length > 0) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkB27QEHYRcjs.ActionsMenuDropdown,
+      _chunkP6F6PHVKcjs.ActionsMenuDropdown,
       {
         groups: [{ items: action.submenu }],
         customTrigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -1289,7 +1292,7 @@ function ActionSkeletons({
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: items.map((action, idx) => {
     const isIconOnly = action ? !action.label || !!action.iconOnlyOnDesktop : emptyFallback === "icon";
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunk5M5C6UV4cjs.Skeleton,
+      _chunk2YXOD2KLcjs.UnifiedSkeleton,
       {
         className: _chunk3ATAYP36cjs.cn.call(void 0, 
           SKELETON_HEIGHT,
@@ -1301,9 +1304,7 @@ function ActionSkeletons({
     );
   }) });
 }
-function MobileTriggerSkeleton() {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: _chunk3ATAYP36cjs.cn.call(void 0, SKELETON_HEIGHT, SKELETON_ICON_WIDTH, SKELETON_RADIUS) });
-}
+var MOBILE_TRIGGER_SKELETON_CLASS = _chunk3ATAYP36cjs.cn.call(void 0, SKELETON_HEIGHT, SKELETON_ICON_WIDTH, SKELETON_RADIUS);
 function PageActions({
   variant = "icon-buttons",
   actions,
@@ -1357,10 +1358,10 @@ function IconButtonsVariant({
       selector,
       loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ActionSkeletons, { actions: desktopActions }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
         desktopActions.map((action, idx) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react2.default.Fragment, { children: renderActionButton(action) }, actionKey(action, idx))),
-        hasMenuActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: menuActions })
+        hasMenuActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: menuActions })
       ] })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex content-md:hidden", className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MobileTriggerSkeleton, {}) : useSingleActionMobile && singleAction ? renderActionButton(singleAction, { iconOnly: true }) : hasMobileMenuItems ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: mobileMenuGroups }) : null })
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex content-md:hidden", className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: MOBILE_TRIGGER_SKELETON_CLASS }) : useSingleActionMobile && singleAction ? renderActionButton(singleAction, { iconOnly: true }) : hasMobileMenuItems ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: mobileMenuGroups }) : null })
   ] });
 }
 function PrimaryButtonsVariant({
@@ -1380,7 +1381,7 @@ function PrimaryButtonsVariant({
       // into a labelled button, not a square one.
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ActionSkeletons, { actions: desktopActions, emptyFallback: "label" })
     ) : desktopActions.map((action, idx) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react2.default.Fragment, { children: renderActionButton(action) }, `desktop-${actionKey(action, idx)}`)) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "hidden items-center md:content-max-md:flex", ACTIONS_GAP, className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MobileTriggerSkeleton, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CompactPrimaryActions, { actions: desktopActions }) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "hidden items-center md:content-max-md:flex", ACTIONS_GAP, className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: MOBILE_TRIGGER_SKELETON_CLASS }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CompactPrimaryActions, { actions: desktopActions }) }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MobileBottomActions, { actions: sortedActions, loading })
   ] });
 }
@@ -1399,15 +1400,15 @@ function MenuPrimaryVariant({
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "hidden items-center content-md:flex", ACTIONS_GAP, className), children: [
       selector,
       loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ActionSkeletons, { actions: desktopActions }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        hasMenuActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: menuActions }),
+        hasMenuActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: menuActions }),
         desktopActions.map((action, idx) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react2.default.Fragment, { children: renderActionButton({ ...action, variant: action.variant || "accent" }) }, `desktop-${actionKey(action, idx)}`))
       ] })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex content-md:hidden", className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, MobileTriggerSkeleton, {}) : hasMobileMenuItems || selector ? (
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex content-md:hidden", className), children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: MOBILE_TRIGGER_SKELETON_CLASS }) : hasMobileMenuItems || selector ? (
       // The selector rides into the menu as its header row: on mobile the
       // title row has no room for it, and hiding it entirely (what
       // `icon-buttons` does) would leave no way to switch views at all.
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: mobileMenuGroups, header: selector })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: mobileMenuGroups, header: selector })
     ) : null })
   ] });
 }
@@ -1416,7 +1417,7 @@ function CompactPrimaryActions({ actions }) {
   const fold = foldable.length > 1;
   const inline = fold ? actions.filter((action) => !foldable.includes(action)) : actions;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-    fold && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: [{ items: foldable.flatMap(actionToMenuItems) }] }),
+    fold && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: [{ items: foldable.flatMap(actionToMenuItems) }] }),
     inline.map((action, idx) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react2.default.Fragment, { children: renderActionButton(action) }, `compact-${actionKey(action, idx)}`))
   ] });
 }
@@ -1486,15 +1487,7 @@ function EntityImage({ src, alt, fallbackText, sizeClassName, className }) {
 // src/components/layout/title-block.tsx
 
 var TITLE_BLOCK_MIN_HEIGHT = "min-h-11 content-md:min-h-12";
-function TitleTextSkeleton({ widthClass, heightClass }) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "span",
-    {
-      "aria-hidden": true,
-      className: _chunk3ATAYP36cjs.cn.call(void 0, "inline-block max-w-full animate-pulse rounded-md bg-ods-border", widthClass, heightClass)
-    }
-  );
-}
+var TITLE_TEXT_SKELETON_CLASS = "inline-block max-w-full rounded-md";
 var TITLE_SKELETON_SIZE = {
   h1: { width: "w-56 content-md:w-80 content-lg:w-96", height: "h-7 content-md:h-8 content-lg:h-9" },
   h2: { width: "w-48 content-md:w-72", height: "h-4 content-md:h-6" }
@@ -1527,7 +1520,14 @@ function TitleBlock({
   const { ref: subtitleRef, isTruncated: subtitleTruncated } = _chunkKTPR66EEcjs.useIsTruncated.call(void 0, 
     loading ? null : subtitle
   );
-  const titleNode = loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TitleTextSkeleton, { widthClass: skeletonSize.width, heightClass: skeletonSize.height }) : title;
+  const titleNode = loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunk2YXOD2KLcjs.UnifiedSkeleton,
+    {
+      as: "span",
+      "aria-hidden": true,
+      className: _chunk3ATAYP36cjs.cn.call(void 0, TITLE_TEXT_SKELETON_CLASS, skeletonSize.width, skeletonSize.height)
+    }
+  ) : title;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
@@ -1589,7 +1589,14 @@ function TitleBlock({
                       ref: subtitleRef,
                       className: "truncate text-ods-text-secondary text-h6",
                       "aria-hidden": !loading && !subtitle ? true : void 0,
-                      children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TitleTextSkeleton, { widthClass: "w-28 content-md:w-36", heightClass: "h-2.5 content-md:h-3" }) : subtitle || "\xA0"
+                      children: loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                        _chunk2YXOD2KLcjs.UnifiedSkeleton,
+                        {
+                          as: "span",
+                          "aria-hidden": true,
+                          className: _chunk3ATAYP36cjs.cn.call(void 0, TITLE_TEXT_SKELETON_CLASS, "h-2.5 w-28 content-md:h-3 content-md:w-36")
+                        }
+                      ) : subtitle || "\xA0"
                     }
                   ) })
                 ] })
@@ -1707,9 +1714,9 @@ function RemoteSessionViewers({ viewers, max = 4, className }) {
   const faces = ordered.slice(0, max);
   const overflow = ordered.length - faces.length;
   const Chevron = open ? _chunk3MRRIHC2cjs.Chevron02UpIcon : _chunkSKI6NKOEcjs.Chevron02DownIcon;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkL2RMTGOKcjs.DropdownMenu, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkMGF3FUKDcjs.DropdownMenu, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _chunkL2RMTGOKcjs.DropdownMenuTrigger,
+      _chunkMGF3FUKDcjs.DropdownMenuTrigger,
       {
         "aria-label": `In this session: ${ordered.map(viewerLabel).join(", ")}`,
         className: _chunk3ATAYP36cjs.cn.call(void 0, 
@@ -1745,8 +1752,8 @@ function RemoteSessionViewers({ viewers, max = 4, className }) {
         ]
       }
     ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL2RMTGOKcjs.DropdownMenuContent, { align: "end", className: "w-[280px] p-0", children: ordered.map((viewer) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _chunkL2RMTGOKcjs.DropdownMenuItem,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMGF3FUKDcjs.DropdownMenuContent, { align: "end", className: "w-[280px] p-0", children: ordered.map((viewer) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      _chunkMGF3FUKDcjs.DropdownMenuItem,
       {
         className: _chunk3ATAYP36cjs.cn.call(void 0, 
           "gap-[var(--spacing-system-xsf)] rounded-none border-b border-ods-border bg-ods-bg last:border-b-0",
@@ -2370,7 +2377,7 @@ function RemoteDesktopFullscreenToolbar({
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xsf)]", children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate text-ods-text-primary text-h6", children: deviceName }),
             displayMenuGroups.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkB27QEHYRcjs.ActionsMenuDropdown,
+              _chunkP6F6PHVKcjs.ActionsMenuDropdown,
               {
                 groups: displayMenuGroups,
                 customTrigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -2401,7 +2408,7 @@ function RemoteDesktopFullscreenToolbar({
               }
             ),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkB27QEHYRcjs.ActionsMenuDropdown,
+              _chunkP6F6PHVKcjs.ActionsMenuDropdown,
               {
                 groups: actionsMenuGroups,
                 customTrigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -2490,7 +2497,7 @@ function RemoteDesktopView({
             children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only content-md:not-sr-only", children: chatOpen ? "Close Chat" : "Open Chat" })
           }
         ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB27QEHYRcjs.ActionsMenuDropdown, { groups: actionsMenuGroups, triggerAriaLabel: "Actions" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP6F6PHVKcjs.ActionsMenuDropdown, { groups: actionsMenuGroups, triggerAriaLabel: "Actions" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           _chunk2QMBXGMQcjs.Button,
           {
@@ -2514,7 +2521,7 @@ function RemoteDesktopView({
       ] })
     ] }),
     displayMenuGroups.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkB27QEHYRcjs.ActionsMenuDropdown,
+      _chunkP6F6PHVKcjs.ActionsMenuDropdown,
       {
         groups: displayMenuGroups,
         align: "start",
@@ -2565,24 +2572,27 @@ function RemoteDesktopView({
     }
   );
 }
-function RemoteDesktopViewSkeleton({ onBack }) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, PageLayout, { className: PAGE_CLASS, backButton: onBack ? { label: "Back", onClick: onBack } : void 0, children: [
+function RemoteDesktopViewSkeleton({
+  onBack,
+  region = true
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PageLayout, { className: PAGE_CLASS, backButton: onBack ? { label: "Back", onClick: onBack } : void 0, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkUGCRLRCTcjs.LoadingRegion, { label: "Loading the remote session", announce: region, className: "contents", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: CONTROLS_BAR_CLASS, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: CONTROLS_ROW_CLASS, children: [
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 items-center gap-[var(--spacing-system-mf)]", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-9 w-9 flex-shrink-0 rounded-md" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-9 w-9 flex-shrink-0 rounded-md" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-col gap-[var(--spacing-system-xxs)]", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-5 w-48" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-4 w-36" })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-5 w-48" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-4 w-36" })
         ] })
       ] }),
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-shrink-0 items-center gap-[var(--spacing-system-xs)]", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5M5C6UV4cjs.Skeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" })
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-11 w-11 rounded-lg md:h-12 md:w-12" })
       ] })
     ] }) }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 min-w-0 flex-1 rounded-lg bg-black" })
-  ] });
+  ] }) });
 }
 
 // src/components/features/remote-session/remote-session-dialog.tsx