@arbidocs/blocks 0.4.4 → 0.4.6

package/dist/chunk-DCDVWPMB.cjs

@@ -0,0 +1,29 @@
+"use client";
+'use strict';
+
+var react = require('react');
+
+// src/lib/useRestoreFocus.ts
+function useRestoreFocus() {
+  const origin = react.useRef(null);
+  return react.useMemo(
+    () => ({
+      onOpenAutoFocus: () => {
+        origin.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+      },
+      onCloseAutoFocus: (event) => {
+        const element = origin.current;
+        origin.current = null;
+        if (element && element.isConnected && element !== document.body) {
+          event.preventDefault();
+          element.focus();
+        }
+      }
+    }),
+    []
+  );
+}
+
+exports.useRestoreFocus = useRestoreFocus;
+//# sourceMappingURL=chunk-DCDVWPMB.cjs.map
+//# sourceMappingURL=chunk-DCDVWPMB.cjs.map

package/dist/chunk-DCDVWPMB.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/useRestoreFocus.ts"],"names":["useRef","useMemo"],"mappings":";;;;;AASO,SAAS,eAAA,GAGd;AACA,EAAA,MAAM,MAAA,GAASA,aAA2B,IAAI,CAAA;AAC9C,EAAA,OAAOC,aAAA;AAAA,IACL,OAAO;AAAA,MACL,iBAAiB,MAAM;AAErB,QAAA,MAAA,CAAO,OAAA,GACL,QAAA,CAAS,aAAA,YAAyB,WAAA,GAAc,SAAS,aAAA,GAAgB,IAAA;AAAA,MAC7E,CAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,KAAA,KAAiB;AAClC,QAAA,MAAM,UAAU,MAAA,CAAO,OAAA;AACvB,QAAA,MAAA,CAAO,OAAA,GAAU,IAAA;AACjB,QAAA,IAAI,OAAA,IAAW,OAAA,CAAQ,WAAA,IAAe,OAAA,KAAY,SAAS,IAAA,EAAM;AAC/D,UAAA,KAAA,CAAM,cAAA,EAAe;AACrB,UAAA,OAAA,CAAQ,KAAA,EAAM;AAAA,QAChB;AAAA,MACF;AAAA,KACF,CAAA;AAAA,IACA;AAAC,GACH;AACF","file":"chunk-DCDVWPMB.cjs","sourcesContent":["import { useMemo, useRef } from 'react'\n\n/**\n * Props for a Radix `DialogContent` that put focus back where it was when the dialog opened.\n *\n * Radix Dialog returns focus to its `Trigger` on close and, when the dialog is opened from state\n * (no `DialogTrigger`, as every controlled dialog in the blocks is), drops it to `<body>`:\n * a keyboard or screen-reader user loses their place. Spread the result on `DialogContent`.\n */\nexport function useRestoreFocus(): {\n  onOpenAutoFocus: (event: Event) => void\n  onCloseAutoFocus: (event: Event) => void\n} {\n  const origin = useRef<HTMLElement | null>(null)\n  return useMemo(\n    () => ({\n      onOpenAutoFocus: () => {\n        // Runs before the dialog moves focus inside, so this is still the opener.\n        origin.current =\n          document.activeElement instanceof HTMLElement ? document.activeElement : null\n      },\n      onCloseAutoFocus: (event: Event) => {\n        const element = origin.current\n        origin.current = null\n        if (element && element.isConnected && element !== document.body) {\n          event.preventDefault()\n          element.focus()\n        }\n      },\n    }),\n    []\n  )\n}\n"]}

package/dist/{chunk-TI4UTYRL.js → chunk-EY2RJW27.js}

@@ -1,9 +1,9 @@
 "use client";
 import { ActionLink } from './chunk-S7PSMMRG.js';
-import { useDrawerBehavior, BlocksTooltipProvider } from './chunk-2VBJ763Y.js';
+import { useDrawerBehavior, BlocksTooltipProvider, useShellBottomInset } from './chunk-KZJAG7T3.js';
 import { testIdOr, prefixedTestId } from './chunk-7F6CBP3Z.js';
-import { createContext, forwardRef, useContext, useMemo, useRef, useState, useId, useEffect } from 'react';
-import { PanelLeftClose, PanelLeftOpen, X, Globe, Users, Lock, ChevronDown, LayoutGrid, Plus, Sparkles, Search, ArrowUp, Menu, TriangleAlert, CheckCircle2, Loader2, RefreshCw, WifiOff, MousePointerClick, Lightbulb, Pencil, ChevronLeft, ChevronRight, Info } from 'lucide-react';
+import { createContext, forwardRef, useContext, useMemo, useRef, useState, useEffect, useCallback, useId } from 'react';
+import { PanelLeftClose, PanelLeftOpen, X, Globe, Users, Lock, ChevronDown, LayoutGrid, Plus, Sparkles, Search, ArrowUp, Menu, Download, TriangleAlert, CheckCircle2, Loader2, RefreshCw, WifiOff, MousePointerClick, Lightbulb, Pencil, ChevronLeft, ChevronRight, Info } from 'lucide-react';
 import { cn, Tooltip, TooltipTrigger, TooltipContent, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuLabel, Button } from '@arbidocs/react/ui';
 export { UserMenu } from '@arbidocs/react/ui';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
@@ -119,7 +119,7 @@ function SidebarRoot({
   useDrawerBehavior(isDrawer, onBackdropClick ?? noop, drawerRef);
   const ariaLabel = ariaLabelProp ?? mergedLabels.mainNavigation;
   const contextValue = useMemo(() => ({ expanded, labels: mergedLabels }), [expanded, mergedLabels]);
-  const navBase = "group/sidebar bg-sidebar border-r border-border text-foreground flex flex-col h-full overflow-y-auto overflow-x-hidden pb-safe pt-3 transition-all duration-300 ease-in-out";
+  const navBase = "group/sidebar bg-sidebar border-r border-border text-foreground scrollbar-themed flex flex-col h-full overflow-y-auto overflow-x-hidden pb-safe pt-3 transition-all duration-300 ease-in-out";
   const common = {
     "aria-label": ariaLabel,
     "data-testid": testIdOr(testId, { testId: "sidebar" }),
@@ -1055,6 +1055,15 @@ function MobileAppBar({
     }
   );
 }
+function TabLabel({ item }) {
+  const wrap = "max-w-full text-balance px-0.5 text-center [overflow-wrap:normal] @max-[4.5rem]:text-[10px]";
+  if (!item.shortLabel) return /* @__PURE__ */ jsx("span", { className: wrap, children: item.label });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { "data-slot": "tab-short-label", "aria-hidden": "true", className: cn(wrap, "@[5.5rem]:hidden"), children: item.shortLabel }),
+    /* @__PURE__ */ jsx("span", { className: cn(wrap, "hidden @[5.5rem]:block"), children: item.label }),
+    /* @__PURE__ */ jsx("span", { className: "sr-only @[5.5rem]:hidden", children: item.label })
+  ] });
+}
 function MobileTabBar({
   items,
   label,
@@ -1063,14 +1072,17 @@ function MobileTabBar({
   className,
   "data-testid": testId
 }) {
+  const navRef = useRef(null);
+  useShellBottomInset(navRef);
   return /* @__PURE__ */ jsx(
     "nav",
     {
+      ref: navRef,
       "aria-label": label ?? labels?.workspaceSections ?? DEFAULT_MOBILE_BARS_LABELS.workspaceSections,
       "data-slot": "mobile-tab-bar",
       "data-testid": testIdOr(testId, { testId: "mobile-tab-bar" }),
       className: cn(
-        "flex h-16 flex-shrink-0 items-stretch bg-sidebar px-2 pb-safe sm:hidden",
+        "flex min-h-16 flex-shrink-0 items-stretch bg-sidebar px-2 pb-safe sm:hidden",
         className
       ),
       children: items.map((item) => /* @__PURE__ */ jsxs(
@@ -1081,13 +1093,14 @@ function MobileTabBar({
           disabled: item.disabled,
           "aria-current": item.active ? "page" : void 0,
           className: cn(
-            "flex min-h-12 min-w-0 flex-1 flex-col items-center justify-center gap-0.5 rounded-md text-xs transition-colors",
+            // Each tab is a size container: a `shortLabel` replaces the label when it is narrow.
+            "@container flex min-h-12 min-w-0 flex-1 flex-col items-center justify-center gap-0.5 rounded-md text-[11px] leading-tight transition-colors",
             item.active ? "font-semibold text-primary" : "font-medium text-muted-foreground hover:text-foreground"
           ),
           "data-testid": prefixedTestId(testIdPrefix, item.id, { testId: `mobile-tab-${item.id}` }),
           children: [
             item.icon,
-            /* @__PURE__ */ jsx("span", { className: "max-w-full truncate px-1", children: item.label })
+            /* @__PURE__ */ jsx(TabLabel, { item })
           ]
         },
         item.id
@@ -1095,6 +1108,241 @@ function MobileTabBar({
     }
   );
 }
+
+// src/shell/install-instructions.ts
+function isIosDevice() {
+  if (typeof navigator === "undefined") return false;
+  return /iPad|iPhone|iPod/.test(navigator.userAgent) || navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1;
+}
+function getInstallInstructions({
+  appName = "this app"
+} = {}) {
+  if (typeof navigator === "undefined" || typeof window === "undefined") {
+    return {
+      heading: `Install ${appName}`,
+      steps: [`Open ${appName} in Chrome, Edge, or Safari to install it.`]
+    };
+  }
+  const ua = navigator.userAgent;
+  const isChromium = "onbeforeinstallprompt" in window;
+  const isFirefox = /firefox|fxios/i.test(ua);
+  const isMac = /Macintosh|Mac OS X/.test(ua);
+  if (isIosDevice()) {
+    return {
+      heading: "Install on iPhone or iPad",
+      steps: [
+        `Open ${appName} in Safari, then tap the Share button.`,
+        "Scroll down and tap \u201CAdd to Home Screen\u201D.",
+        `Tap \u201CAdd\u201D: ${appName} appears on your home screen.`
+      ]
+    };
+  }
+  if (isChromium) {
+    return {
+      heading: `Install ${appName}`,
+      steps: [
+        "Click the install icon at the right of the address bar (a small monitor with a down arrow).",
+        "Choose \u201CInstall\u201D in the dialog that appears."
+      ],
+      note: `On a phone, open the browser menu and choose \u201CInstall app\u201D / \u201CAdd to Home screen\u201D. If you don\u2019t see the option, ${appName} may already be installed.`
+    };
+  }
+  if (isMac && !isFirefox) {
+    return {
+      heading: "Install on macOS Safari",
+      steps: ["In the menu bar, open the File menu.", "Choose \u201CAdd to Dock\u201D."],
+      note: "Requires Safari 17 or later (macOS Sonoma). On older Safari, use Chrome or Edge to install."
+    };
+  }
+  if (isFirefox) {
+    return {
+      heading: "Firefox can\u2019t install web apps",
+      steps: [`Open ${appName} in Chrome, Edge, or Safari to install it as an app.`]
+    };
+  }
+  return {
+    heading: `Install ${appName}`,
+    steps: [
+      "Look for an \u201CInstall\u201D or \u201CAdd to Home Screen\u201D option in your browser\u2019s menu or address bar."
+    ]
+  };
+}
+
+// src/shell/use-install-prompt.ts
+var deferredPrompt = null;
+var installed = false;
+var initialized = false;
+var autoPromptParam = null;
+var subscribers = /* @__PURE__ */ new Set();
+var notify = () => subscribers.forEach((fn) => fn());
+function isStandalone() {
+  if (typeof window === "undefined") return false;
+  const iosStandalone = navigator.standalone === true;
+  return window.matchMedia?.("(display-mode: standalone)").matches === true || iosStandalone;
+}
+function wantsAutoPrompt() {
+  if (!autoPromptParam) return false;
+  return new URLSearchParams(window.location.search).get(autoPromptParam) === "true";
+}
+function onBeforeInstallPrompt(event) {
+  event.preventDefault();
+  deferredPrompt = event;
+  notify();
+  if (wantsAutoPrompt()) void promptAppInstall();
+}
+function onAppInstalled() {
+  installed = true;
+  deferredPrompt = null;
+  notify();
+}
+function initInstallPrompt(options = {}) {
+  if (options.autoPromptParam) autoPromptParam = options.autoPromptParam;
+  if (initialized || typeof window === "undefined") return;
+  initialized = true;
+  installed = isStandalone();
+  window.addEventListener("beforeinstallprompt", onBeforeInstallPrompt);
+  window.addEventListener("appinstalled", onAppInstalled);
+}
+async function promptAppInstall() {
+  if (!deferredPrompt) return false;
+  const prompt = deferredPrompt;
+  deferredPrompt = null;
+  notify();
+  try {
+    await prompt.prompt();
+  } catch {
+  }
+  return true;
+}
+var INSTALL_PROMPT_DISMISSED_KEY = "arbi-blocks:install-prompt-dismissed";
+var DAY_MS = 24 * 60 * 60 * 1e3;
+function readDismissedAt(key) {
+  try {
+    const raw = window.localStorage.getItem(key);
+    const at = raw ? Number(raw) : NaN;
+    return Number.isFinite(at) ? at : null;
+  } catch {
+    return null;
+  }
+}
+function useInstallPrompt({
+  storageKey = INSTALL_PROMPT_DISMISSED_KEY,
+  dismissDays = 30,
+  autoPromptParam: autoParam,
+  appName
+} = {}) {
+  const [, forceRender] = useState(0);
+  const [dismissedAt, setDismissedAt] = useState(
+    () => typeof window === "undefined" ? null : readDismissedAt(storageKey)
+  );
+  useEffect(() => {
+    initInstallPrompt({ autoPromptParam: autoParam });
+    const onChange = () => forceRender((n) => n + 1);
+    subscribers.add(onChange);
+    onChange();
+    return () => {
+      subscribers.delete(onChange);
+    };
+  }, [autoParam]);
+  const dismiss = useCallback(() => {
+    const now = Date.now();
+    setDismissedAt(now);
+    try {
+      window.localStorage.setItem(storageKey, String(now));
+    } catch {
+    }
+  }, [storageKey]);
+  const isDismissed = dismissedAt !== null && Date.now() - dismissedAt < dismissDays * DAY_MS;
+  const isInstalled = installed || isStandalone();
+  return {
+    canPrompt: !isInstalled && deferredPrompt !== null,
+    isInstalled,
+    isIos: isIosDevice(),
+    isDismissed,
+    promptInstall: promptAppInstall,
+    dismiss,
+    instructions: getInstallInstructions({ appName })
+  };
+}
+var DEFAULT_INSTALL_PROMPT_LABELS = {
+  install: "Install app",
+  dismiss: "Dismiss install prompt",
+  installAs: "Install {app} as an app"
+};
+function InstallPrompt({
+  placement = "start",
+  labels,
+  className,
+  "data-testid": testId,
+  ...options
+}) {
+  const l = { ...DEFAULT_INSTALL_PROMPT_LABELS, ...labels };
+  const install = useInstallPrompt(options);
+  const [showSteps, setShowSteps] = useState(false);
+  const isOffer = install.canPrompt || install.isIos;
+  if (install.isInstalled || install.isDismissed || !isOffer) return null;
+  const appName = options.appName ?? "this app";
+  const onInstall = async () => {
+    if (install.canPrompt) await install.promptInstall();
+    else setShowSteps((open) => !open);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "install-prompt",
+      "data-testid": testIdOr(testId, { testId: "install-app-prompt" }),
+      className: cn(
+        "fixed z-30 flex max-w-[calc(100vw-1.5rem)] flex-col gap-2",
+        // Above the bottom bars (tab bar / composer) and the home indicator on a phone, a plain
+        // corner offset from `sm` up where the tab bar is gone.
+        "bottom-[calc(max(var(--shell-bottom-inset,0px),env(safe-area-inset-bottom,0px))+0.75rem)] sm:bottom-[calc(env(safe-area-inset-bottom,0px)+0.75rem)]",
+        placement === "start" ? "left-3 items-start" : "right-3 items-end",
+        className
+      ),
+      children: [
+        showSteps && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-slot": "install-prompt-steps",
+            className: "w-72 max-w-full rounded-lg border border-border bg-card p-3 text-sm text-card-foreground shadow-lg",
+            children: [
+              /* @__PURE__ */ jsx("p", { className: "font-medium", children: install.instructions.heading }),
+              /* @__PURE__ */ jsx("ol", { className: "mt-2 list-decimal space-y-1 pl-5 text-muted-foreground", children: install.instructions.steps.map((step) => /* @__PURE__ */ jsx("li", { children: step }, step)) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center rounded-full border border-border bg-card/95 text-foreground shadow-sm backdrop-blur", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => void onInstall(),
+              "aria-label": l.installAs.replace("{app}", appName),
+              "aria-expanded": install.canPrompt ? void 0 : showSteps,
+              "data-slot": "install-prompt-action",
+              className: "inline-flex min-h-11 items-center gap-1.5 rounded-full pl-4 pr-2 text-xs font-medium transition-colors hover:bg-accent sm:min-h-9 sm:pl-3",
+              children: [
+                /* @__PURE__ */ jsx(Download, { className: "size-3.5", "aria-hidden": "true" }),
+                l.install
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: install.dismiss,
+              "aria-label": l.dismiss,
+              "data-slot": "install-prompt-dismiss",
+              className: "inline-flex size-11 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground sm:size-9",
+              children: /* @__PURE__ */ jsx(X, { className: "size-3.5", "aria-hidden": "true" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
 function ActionCluster({
   layout = "bar",
   status,
@@ -1571,6 +1819,6 @@ function SplitLayout({
   );
 }
 
-export { ActionCluster, AskField, AskRow, AskTrigger, DEFAULT_ASK_FIELD_LABELS, DEFAULT_MOBILE_BARS_LABELS, DEFAULT_OFFLINE_PILL_LABELS, DEFAULT_REMOTE_CONTROL_PILL_LABELS, DEFAULT_SIDEBAR_LABELS, DEFAULT_TIP_CARD_LABELS, DEFAULT_WORKSPACE_KIND_LABELS, DEFAULT_WORKSPACE_SWITCHER_LABELS, InfoBar, MobileAppBar, MobileTabBar, OfflinePill, RemoteControlPill, Sidebar, SidebarBadgeRow, SidebarRowAction, SidebarRowHoverContext, SplitLayout, StatusRow, TipCard, WorkspaceIdentity, WorkspaceSwitcher, resolveSidebarLayout, useSidebarContext, useSidebarSettle, workspaceKindColor, workspaceKindMeta };
-//# sourceMappingURL=chunk-TI4UTYRL.js.map
-//# sourceMappingURL=chunk-TI4UTYRL.js.map
+export { ActionCluster, AskField, AskRow, AskTrigger, DEFAULT_ASK_FIELD_LABELS, DEFAULT_INSTALL_PROMPT_LABELS, DEFAULT_MOBILE_BARS_LABELS, DEFAULT_OFFLINE_PILL_LABELS, DEFAULT_REMOTE_CONTROL_PILL_LABELS, DEFAULT_SIDEBAR_LABELS, DEFAULT_TIP_CARD_LABELS, DEFAULT_WORKSPACE_KIND_LABELS, DEFAULT_WORKSPACE_SWITCHER_LABELS, INSTALL_PROMPT_DISMISSED_KEY, InfoBar, InstallPrompt, MobileAppBar, MobileTabBar, OfflinePill, RemoteControlPill, Sidebar, SidebarBadgeRow, SidebarRowAction, SidebarRowHoverContext, SplitLayout, StatusRow, TipCard, WorkspaceIdentity, WorkspaceSwitcher, getInstallInstructions, initInstallPrompt, isIosDevice, promptAppInstall, resolveSidebarLayout, useInstallPrompt, useSidebarContext, useSidebarSettle, workspaceKindColor, workspaceKindMeta };
+//# sourceMappingURL=chunk-EY2RJW27.js.map
+//# sourceMappingURL=chunk-EY2RJW27.js.map