@ai-matrx/office 0.8.59 → 0.8.60

package/dist/pdf.js

@@ -3,7 +3,7 @@
 // src/pdf/PdfWorkspace.tsx
 import { Fragment as Fragment3, useCallback, useEffect as useEffect4, useLayoutEffect, useMemo as useMemo2, useRef as useRef2, useState as useState4 } from "react";
 import { cn as cn2 } from "@ai-matrx/design-system/cn";
-import { Button as Button3, Field as Field3, PageRangeInput as PageRangeInput2, SegmentedControl as SegmentedControl3, ToolRail, parsePageRanges as parsePageRanges2 } from "@ai-matrx/design-system/controls";
+import { Button as Button3, Field as Field3, PageRangeInput as PageRangeInput2, SegmentedControl as SegmentedControl3, Tile as Tile2, ToolRail, parsePageRanges as parsePageRanges2 } from "@ai-matrx/design-system/controls";
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
@@ -157,7 +157,7 @@ function LayersList({ host }) {
 
 // src/pdf/panels.tsx
 import { useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
-import { Button, Field, SegmentedControl as SegmentedControl2, Select } from "@ai-matrx/design-system/controls";
+import { Button, Field, SegmentedControl as SegmentedControl2, Select, Textarea } from "@ai-matrx/design-system/controls";
 import { PageRangeInput, formatPageRanges, parsePageRanges } from "@ai-matrx/design-system/controls";
 import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function Row({ label, children }) {
@@ -199,12 +199,14 @@ function Result({ result, host, error }) {
     ] }) : null,
     result?.kind === "text" ? /* @__PURE__ */ jsxs2(Fragment, { children: [
       /* @__PURE__ */ jsx2(
-        "textarea",
+        Textarea,
         {
           readOnly: true,
           value: result.text,
           "aria-label": "Extracted text",
-          className: "h-48 w-full resize-none rounded-md border border-border bg-background p-2 text-xs text-foreground"
+          minHeight: 192,
+          maxHeight: 192,
+          className: "w-full resize-none"
         }
       ),
       /* @__PURE__ */ jsx2(Button, { variant: "outline", onClick: () => void copy(result.text), children: copied ? "Copied" : "Copy text" })
@@ -596,7 +598,7 @@ function formatKeys(keys, mac) {
 // src/pdf/markup-panel.tsx
 import { useEffect as useEffect3, useState as useState3 } from "react";
 import { cn } from "@ai-matrx/design-system/cn";
-import { AnchoredToolbar, Button as Button2, ColorSwatchRow, Field as Field2, OpacitySlider, Select as Select2 } from "@ai-matrx/design-system/controls";
+import { AnchoredToolbar, Button as Button2, ColorSwatchRow, Field as Field2, OpacitySlider, Select as Select2, Tile } from "@ai-matrx/design-system/controls";
 import {
   HighlighterIcon,
   ImageIcon,
@@ -682,22 +684,19 @@ function MarkupPanel({ host, engine, snapshot, active, onPick, blocked, busy, on
     const Icon = MARKUP_ICONS[t.id];
     const on = t.id === active;
     return /* @__PURE__ */ jsxs3("li", { children: [
-      /* @__PURE__ */ jsxs3(
-        "button",
+      /* @__PURE__ */ jsx3(
+        Tile,
         {
           type: "button",
-          "aria-pressed": t.status === "ready" ? on : void 0,
+          dense: true,
+          variant: "quiet",
+          title: t.label,
+          icon: /* @__PURE__ */ jsx3(Icon, {}),
+          end: t.status === "soon" ? /* @__PURE__ */ jsx3("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: "Soon" }) : /* @__PURE__ */ jsx3("kbd", { className: "text-muted-foreground", children: t.key?.toUpperCase() }),
+          ...t.status === "ready" ? { selected: on } : {},
           disabled: t.status === "ready" && (!engine || Boolean(blocked)),
           onClick: () => t.status === "soon" ? onSoon(markupComingSoonId(t.id)) : onPick(t.id),
-          className: cn(
-            "flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:text-disabled-foreground",
-            on && "bg-accent"
-          ),
-          children: [
-            /* @__PURE__ */ jsx3(Icon, { className: "size-4 shrink-0" }),
-            /* @__PURE__ */ jsx3("span", { className: "min-w-0 flex-1 truncate", children: t.label }),
-            t.status === "soon" ? /* @__PURE__ */ jsx3("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: "Soon" }) : /* @__PURE__ */ jsx3("kbd", { className: "text-muted-foreground", children: t.key?.toUpperCase() })
-          ]
+          className: "w-full"
         }
       ),
       t.status === "soon" && t.reason ? /* @__PURE__ */ jsx3("div", { className: "pl-8 pr-2 text-xs text-muted-foreground", children: t.reason }) : null
@@ -735,19 +734,22 @@ function MarkupPanel({ host, engine, snapshot, active, onPick, blocked, busy, on
       ] })
     ] }),
     host.existingAnnotations ? /* @__PURE__ */ jsxs3(Section, { label: "In this file", children: [
-      existing === null ? /* @__PURE__ */ jsx3("div", { className: "text-xs text-muted-foreground", children: "Reading\u2026" }) : existing.filter((a) => a.subtype !== "Link" && a.subtype !== "Widget").length === 0 ? /* @__PURE__ */ jsx3("div", { className: "text-xs text-muted-foreground", children: "No comments or markup yet" }) : /* @__PURE__ */ jsx3("ul", { className: "flex flex-col", "aria-label": "Annotations in this file", children: existing.filter((a) => a.subtype !== "Link" && a.subtype !== "Widget").map((a, i) => /* @__PURE__ */ jsx3("li", { children: /* @__PURE__ */ jsxs3("button", { type: "button", onClick: () => goToPage(a.page), className: "flex w-full items-start gap-2 rounded-md px-2 py-1 text-left text-xs hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [
-        /* @__PURE__ */ jsxs3("span", { className: "w-8 shrink-0 tabular-nums text-muted-foreground", children: [
-          "p. ",
-          a.page
-        ] }),
-        /* @__PURE__ */ jsxs3("span", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ jsxs3("span", { className: "block", children: [
-            a.subtype,
-            a.author ? ` \xB7 ${a.author}` : ""
+      existing === null ? /* @__PURE__ */ jsx3("div", { className: "text-xs text-muted-foreground", children: "Reading\u2026" }) : existing.filter((a) => a.subtype !== "Link" && a.subtype !== "Widget").length === 0 ? /* @__PURE__ */ jsx3("div", { className: "text-xs text-muted-foreground", children: "No comments or markup yet" }) : /* @__PURE__ */ jsx3("ul", { className: "flex flex-col", "aria-label": "Annotations in this file", children: existing.filter((a) => a.subtype !== "Link" && a.subtype !== "Widget").map((a, i) => /* @__PURE__ */ jsx3("li", { children: /* @__PURE__ */ jsx3(
+        Tile,
+        {
+          type: "button",
+          dense: true,
+          variant: "quiet",
+          title: `${a.subtype}${a.author ? ` \xB7 ${a.author}` : ""}`,
+          line: a.contents,
+          icon: /* @__PURE__ */ jsxs3("span", { className: "w-8 shrink-0 tabular-nums text-muted-foreground", children: [
+            "p. ",
+            a.page
           ] }),
-          a.contents ? /* @__PURE__ */ jsx3("span", { className: "block truncate text-muted-foreground", children: a.contents }) : null
-        ] })
-      ] }) }, `${a.page}-${i}`)) }),
+          className: "w-full",
+          onClick: () => goToPage(a.page)
+        }
+      ) }, `${a.page}-${i}`)) }),
       /* @__PURE__ */ jsx3("div", { className: "text-xs text-muted-foreground", children: "Markup already saved shows on the page; changing it in place is coming." })
     ] }) : null,
     /* @__PURE__ */ jsx3(Section, { label: "Coming soon", children: /* @__PURE__ */ jsx3("ul", { className: "flex flex-col", "aria-label": "Markup coming soon", children: soon.map(row) }) })
@@ -866,35 +868,35 @@ function useWidth(ref) {
 }
 function ToolRows({ tool, hostTools, onPick, canMarkup = false }) {
   return /* @__PURE__ */ jsxs4(Fragment4, { children: [
-    hostTools.map((t) => /* @__PURE__ */ jsx4("li", { role: "none", children: /* @__PURE__ */ jsxs4(
-      "button",
+    hostTools.map((t) => /* @__PURE__ */ jsx4("li", { role: "none", children: /* @__PURE__ */ jsx4(
+      Tile2,
       {
         type: "button",
+        dense: true,
+        variant: "quiet",
         role: "menuitem",
         "aria-current": tool === `host:${t.id}` ? "true" : void 0,
-        className: cn2("flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", tool === `host:${t.id}` && "bg-accent"),
-        onClick: () => onPick(`host:${t.id}`),
-        children: [
-          /* @__PURE__ */ jsx4(t.icon, { className: "size-4 shrink-0" }),
-          /* @__PURE__ */ jsx4("span", { className: "flex-1 whitespace-nowrap", children: t.label })
-        ]
+        title: t.label,
+        icon: /* @__PURE__ */ jsx4(t.icon, {}),
+        className: "w-full",
+        onClick: () => onPick(`host:${t.id}`)
       }
     ) }, `host:${t.id}`)),
     PDF_TOOLS.filter((t) => t.id !== "browse" && (t.id !== "markup" || canMarkup)).map((t) => {
       const Icon = PDF_TOOL_ICONS[t.id];
-      return /* @__PURE__ */ jsx4("li", { role: "none", children: /* @__PURE__ */ jsxs4(
-        "button",
+      return /* @__PURE__ */ jsx4("li", { role: "none", children: /* @__PURE__ */ jsx4(
+        Tile2,
         {
           type: "button",
+          dense: true,
+          variant: "quiet",
           role: "menuitem",
           "aria-current": t.id === tool ? "true" : void 0,
-          className: cn2("flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", t.id === tool && "bg-accent"),
-          onClick: () => onPick(t.id),
-          children: [
-            /* @__PURE__ */ jsx4(Icon, { className: "size-4 shrink-0" }),
-            /* @__PURE__ */ jsx4("span", { className: "flex-1 whitespace-nowrap", children: t.label }),
-            t.status === "soon" ? /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Coming soon" }) : null
-          ]
+          title: t.label,
+          icon: /* @__PURE__ */ jsx4(Icon, {}),
+          end: t.status === "soon" ? /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Coming soon" }) : void 0,
+          className: "w-full",
+          onClick: () => onPick(t.id)
         }
       ) }, t.id);
     })
@@ -1347,10 +1349,11 @@ function PdfWorkspace({ host, className }) {
       width: "lg"
     }
   ) : /* @__PURE__ */ jsx4(
-    "button",
+    Button3,
     {
       type: "button",
-      className: "min-w-0 max-w-[16rem] truncate rounded-md px-2 text-sm font-medium text-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      variant: "quiet",
+      className: "min-w-0 max-w-[16rem]",
       title: host.rename ? "Rename" : host.file.name,
       onClick: () => host.rename && (setNameDraft(host.file.name), setEditingName(true)),
       children: host.file.name
@@ -1471,21 +1474,21 @@ function PdfWorkspace({ host, className }) {
                 }
               }
             ),
-            pop === "tool-search" && toolHits.length ? /* @__PURE__ */ jsx4("ul", { role: "listbox", className: "absolute left-0 right-0 top-9 z-30 rounded-lg border border-border bg-popover p-1 shadow-lg", children: toolHits.map((t) => /* @__PURE__ */ jsx4("li", { role: "option", "aria-selected": false, children: /* @__PURE__ */ jsxs4(
-              "button",
+            pop === "tool-search" && toolHits.length ? /* @__PURE__ */ jsx4("ul", { role: "listbox", className: "absolute left-0 right-0 top-9 z-30 rounded-lg border border-border bg-popover p-1 shadow-lg", children: toolHits.map((t) => /* @__PURE__ */ jsx4("li", { role: "option", "aria-selected": false, children: /* @__PURE__ */ jsx4(
+              Tile2,
               {
                 type: "button",
-                className: "flex w-full items-center justify-between rounded-md px-2 py-1 text-left text-xs hover:bg-accent",
+                dense: true,
+                variant: "quiet",
+                title: t.label,
+                end: t.status === "soon" ? /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Coming soon" }) : void 0,
+                className: "w-full",
                 onMouseDown: (e) => e.preventDefault(),
                 onClick: () => {
                   chooseTool(t.id);
                   setToolQuery("");
                   setPop(null);
-                },
-                children: [
-                  /* @__PURE__ */ jsx4("span", { children: t.label }),
-                  t.status === "soon" ? /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Coming soon" }) : null
-                ]
+                }
               }
             ) }, t.id)) }) : null
           ] }) : null,
@@ -1590,7 +1593,7 @@ function PdfWorkspace({ host, className }) {
             ] }) : null
           ] }) : null,
           compact && sheet ? /* @__PURE__ */ jsxs4(Fragment4, { children: [
-            /* @__PURE__ */ jsx4("button", { type: "button", "aria-label": "Close", className: "absolute inset-0 z-30 bg-background/60", onClick: () => setSheet(null) }),
+            /* @__PURE__ */ jsx4(Tile2, { type: "button", layout: "stack", variant: "quiet", title: /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Close" }), "aria-label": "Close", className: "absolute inset-0 z-30 h-full w-full bg-background/60", onClick: () => setSheet(null) }),
             /* @__PURE__ */ jsx4("div", { className: "absolute inset-x-0 bottom-0 z-40 flex max-h-[75%] flex-col rounded-t-xl border-t border-border bg-background", role: "dialog", "aria-label": sheet === "pages" ? "Pages" : "Tools", children: sheet === "pages" ? /* @__PURE__ */ jsx4("div", { className: "h-[60vh] min-h-0", children: leftPanel }) : /* @__PURE__ */ jsxs4("div", { className: "flex min-h-0 flex-col overflow-y-auto", children: [
               /* @__PURE__ */ jsx4("ul", { className: "p-2", role: "menu", "aria-label": "Tools", children: /* @__PURE__ */ jsx4(ToolRows, { tool: activeToolKey, hostTools, canMarkup, onPick: chooseTool }) }),
               /* @__PURE__ */ jsx4("div", { className: "border-t border-border", children: rightPanel })