@ai-matrx/rich-content 0.2.40 → 0.2.43

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog
 
+## 0.2.43
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/rich-content/v0.2.41..npm/rich-content/v0.2.43 -- apps/shared/rich-content`).
+No source changes intended and no consumer action required.
+
+## 0.2.42
+
+- **No second visible Export control.** `ExportPaletteAnchor` loses `trigger`; a host with no ⋯ menu passes `CopySplitButton onExport`, which adds ONE "Export…" row under a divider in the chevron menu (`useExportPaletteKey` + `openExportPalette`). `ActionBar` with `hideOverflow` does this itself. A host with a ⋯ menu keeps exactly the two rows.
+- **A context action takes Comment's slot.** `SELECTION_CONTEXT_PRIMARY` / `selectionPrimaryFor`: on a study guide the reading row is Copy · Highlight · I don't get this · Ask AI · More; Comment is a More row there. Still at most 6.
+
+**Consumer action:** replace `<ExportPaletteAnchor trigger …/>` with an anchor keyed by `useExportPaletteKey()` and `onExport={() => openExportPalette(key)}` on the split.
+
+## 0.2.41
+
+- **Copy is two rows.** `CopySplitButton`'s chevron menu is exactly "Copy markdown" and "Copy plain text"; the `mountMore` slot (the Alchemy palette under the chevron) is removed.
+- **"Export…" holds the palette.** New `copy/ExportPalette` (`ExportPaletteAnchor`, `openExportPalette`, `hasExportPalette`) and the registry action `export-palette` ("Export…", ⋯ menu). `ActionBar` mounts the anchor at its ⋯; with `hideOverflow` the anchor is its own "Export…" icon. Formatted, JSON, download and AI are unchanged — they moved, nothing was removed.
+- **One compact selection row.** The mode table gains `SELECTION_PRIMARY` (the only actions that take a button) and `SELECTION_MAX_VISIBLE = 6`. Reading: Copy · Highlight · Comment · Ask AI · More. Editing: Copy · Bold · Italic · Link · Ask AI · More. The five `selection:highlight-<colour>` ids are replaced by one `selection:highlight` that opens the colours.
+
+**Consumer action:** stop passing `mountMore`; register one `selection:highlight` action (a colour panel) instead of five colour actions; a surface with no ⋯ menu renders `<ExportPaletteAnchor trigger controllerRef=…/>` beside its split Copy.
+
 ## 0.2.40
 
 - The selection toolbar's outer strip is `role="group"`, not a second `role=toolbar` wrapped around the real SelectionToolbar: one toolbar on screen.
@@ -281,3 +302,4 @@ held-back streaming text; the heal tests encode 1.3.1's behavior).
 - matrx-frontend: call `configureRichContent` at the root (see README) and import from
   `@ai-matrx/rich-content/<domain>/<module>`.
 
+

package/dist/copy/CopySplitButton.d.ts

@@ -7,18 +7,21 @@ export interface CopySplitButtonProps {
     label?: string;
     /** "sm" (32px, an action bar) or "xs" (28px, a dense strip). */
     size?: "sm" | "xs";
-    /** Mount more copy options (the Alchemy palette) under the two rows; called with null on close. */
-    mountMore?: (element: HTMLElement | null, close: () => void) => void;
     /**
      * Render only the chevron and its menu — for a host whose main control is already its own one-click
      * tile (the phone note dock). Same rows, same "Default" tag, same copy module; the host positions it
      * through `className`.
      */
     moreOnly?: boolean;
+    /**
+     * Open the export palette — ONLY for a host with no ⋯ menu of its own: adds one "Export…" row
+     * under a divider. A host with a ⋯ menu leaves this out; Export… lives in that menu.
+     */
+    onExport?: () => void;
     /** Keep the page's text selection when pressed (the selection toolbar). */
     preserveSelection?: boolean;
     disabled?: boolean;
     className?: string;
 }
-export declare function CopySplitButton({ copy, label, size, mountMore, moreOnly, preserveSelection, disabled, className, }: CopySplitButtonProps): React.ReactElement;
+export declare function CopySplitButton({ copy, label, size, moreOnly, onExport, preserveSelection, disabled, className, }: CopySplitButtonProps): React.ReactElement;
 export default CopySplitButton;

package/dist/copy/CopySplitButton.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Check, ChevronDown, ClipboardCopy, Copy, FileCode2, Type } from "lucide-react";
+import { Check, ChevronDown, ClipboardCopy, Copy, FileCode2, Share, Type } from "lucide-react";
 import { Popover, PopoverContent, PopoverTrigger, cn } from "@ai-matrx/design-system";
 import { defaultCopyFlavor } from "./copy-commands.js";
 const ROWS = [
@@ -12,8 +12,8 @@ function CopySplitButton({
   copy,
   label = "Copy",
   size = "sm",
-  mountMore,
   moreOnly = false,
+  onExport,
   preserveSelection = false,
   disabled = false,
   className
@@ -32,7 +32,6 @@ function CopySplitButton({
     if (timer.current) clearTimeout(timer.current);
     timer.current = setTimeout(() => setCopied(null), 1600);
   };
-  const close = React.useCallback(() => setOpen(false), []);
   const keep = preserveSelection ? (event) => event.preventDefault() : void 0;
   const mainName = `${label} (${flavor === "text" ? "plain text" : "markdown"})`;
   const box = size === "xs" ? "h-7" : "h-8";
@@ -116,7 +115,24 @@ function CopySplitButton({
                   },
                   rowFlavor
                 )) }),
-                mountMore ? /* @__PURE__ */ jsx(MoreSlot, { mount: mountMore, close }) : null
+                onExport ? /* @__PURE__ */ jsx("div", { className: "mt-1 border-t border-border pt-1", children: /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    role: "menuitem",
+                    "data-copy-split-export": "",
+                    onMouseDown: keep,
+                    onClick: () => {
+                      setOpen(false);
+                      onExport();
+                    },
+                    className: "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm hover:bg-accent",
+                    children: [
+                      /* @__PURE__ */ jsx(Share, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+                      /* @__PURE__ */ jsx("span", { className: "flex-1", children: "Export\u2026" })
+                    ]
+                  }
+                ) }) : null
               ]
             }
           )
@@ -125,24 +141,6 @@ function CopySplitButton({
     }
   );
 }
-function MoreSlot({ mount, close }) {
-  const ref = React.useRef(null);
-  React.useEffect(() => {
-    const element = ref.current;
-    try {
-      mount(element, close);
-    } catch (error) {
-      console.error("[copy] more copy options could not open:", error);
-    }
-    return () => {
-      try {
-        mount(null, close);
-      } catch {
-      }
-    };
-  }, [mount, close]);
-  return /* @__PURE__ */ jsx("div", { ref, "data-copy-split-more-slot": "", className: "mt-1 border-t border-border pt-1 empty:hidden" });
-}
 var CopySplitButton_default = CopySplitButton;
 export {
   CopySplitButton,

package/dist/copy/ExportPalette.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import type { ContentTransferController } from "@ai-matrx/alchemy/react/workspace";
+/** Is an export palette mounted for this key (a ⋯ "Export…" row shows only then)? */
+export declare function hasExportPalette(key: string): boolean;
+/** Open the export palette mounted under `key`. False when nothing is mounted there. */
+export declare function openExportPalette(key: string): boolean;
+export interface ExportPaletteAnchorProps {
+    /** The key a ⋯ "Export…" row opens this palette by (the document's `instanceKey("alchemy")`). */
+    exportKey?: string;
+    /** The host's hidden ContentTransferMenu — the palette that mounts here. */
+    controllerRef: React.RefObject<ContentTransferController | null>;
+    className?: string;
+}
+export declare function ExportPaletteAnchor({ exportKey, controllerRef, className, }: ExportPaletteAnchorProps): React.ReactElement;
+/** A key for a host that opens its own anchor (the split Copy's "Export…" row). */
+export declare function useExportPaletteKey(): string;
+export default ExportPaletteAnchor;

package/dist/copy/ExportPalette.js

@@ -0,0 +1,78 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Popover, PopoverAnchor, PopoverContent, cn } from "@ai-matrx/design-system";
+const hosts = /* @__PURE__ */ new Map();
+function hasExportPalette(key) {
+  return hosts.has(key);
+}
+function openExportPalette(key) {
+  const open = hosts.get(key);
+  if (!open) return false;
+  open();
+  return true;
+}
+function ExportPaletteAnchor({
+  exportKey,
+  controllerRef,
+  className
+}) {
+  const [open, setOpen] = React.useState(false);
+  React.useEffect(() => {
+    if (!exportKey) return;
+    const opener = () => {
+      window.setTimeout(() => setOpen(true), 0);
+    };
+    hosts.set(exportKey, opener);
+    return () => {
+      if (hosts.get(exportKey) === opener) hosts.delete(exportKey);
+    };
+  }, [exportKey]);
+  const close = React.useCallback(() => setOpen(false), []);
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverAnchor, { asChild: true, children: /* @__PURE__ */ jsx("span", { "aria-hidden": true, "data-export-palette-anchor": "", className: cn("inline-block h-0 w-0", className) }) }),
+    /* @__PURE__ */ jsx(
+      PopoverContent,
+      {
+        align: "end",
+        className: "w-auto min-w-60 max-w-[min(24rem,calc(100vw-16px))] p-1",
+        "data-export-palette": "",
+        children: open ? /* @__PURE__ */ jsx(PaletteSlot, { controllerRef, close }) : null
+      }
+    )
+  ] });
+}
+function PaletteSlot({
+  controllerRef,
+  close
+}) {
+  const ref = React.useRef(null);
+  const [failed, setFailed] = React.useState(null);
+  React.useEffect(() => {
+    const element = ref.current;
+    try {
+      if (!controllerRef.current) throw new Error("Export is unavailable here.");
+      controllerRef.current.mountPalette(element, close);
+    } catch (error) {
+      setFailed(error instanceof Error ? error.message : "Export is unavailable here.");
+    }
+    return () => {
+      try {
+        controllerRef.current?.mountPalette(null);
+      } catch {
+      }
+    };
+  }, [controllerRef, close]);
+  return /* @__PURE__ */ jsx("div", { ref, "data-export-palette-slot": "", children: failed ? /* @__PURE__ */ jsx("p", { className: "px-2 py-1.5 text-sm text-muted-foreground", children: failed }) : null });
+}
+function useExportPaletteKey() {
+  return `export-palette-${React.useId()}`;
+}
+var ExportPalette_default = ExportPaletteAnchor;
+export {
+  ExportPaletteAnchor,
+  ExportPalette_default as default,
+  hasExportPalette,
+  openExportPalette,
+  useExportPaletteKey
+};

package/dist/rich-document/actions/export-palette-action.d.ts

@@ -0,0 +1,5 @@
+import type { RichDocumentAction } from "../types.js";
+export declare const EXPORT_PALETTE_ACTION_ID = "export-palette";
+export declare const EXPORT_PALETTE_ACTION: RichDocumentAction;
+/** Idempotent: the bar calls this on load. */
+export declare function ensureExportPaletteAction(): void;

package/dist/rich-document/actions/export-palette-action.js

@@ -0,0 +1,26 @@
+import { Share } from "lucide-react";
+import { getAction, registerAction } from "./provider.js";
+import { hasExportPalette, openExportPalette } from "../../copy/ExportPalette.js";
+const EXPORT_PALETTE_ACTION_ID = "export-palette";
+const EXPORT_PALETTE_ACTION = {
+  id: EXPORT_PALETTE_ACTION_ID,
+  label: "Export\u2026",
+  icon: Share,
+  category: "export",
+  supportedSources: "*",
+  renderSlot: "overflow",
+  order: 0,
+  visible: (ctx) => hasExportPalette(ctx.instanceKey("alchemy")),
+  run: (ctx) => {
+    openExportPalette(ctx.instanceKey("alchemy"));
+  }
+};
+function ensureExportPaletteAction() {
+  if (getAction(EXPORT_PALETTE_ACTION_ID)) return;
+  registerAction(EXPORT_PALETTE_ACTION);
+}
+export {
+  EXPORT_PALETTE_ACTION,
+  EXPORT_PALETTE_ACTION_ID,
+  ensureExportPaletteAction
+};

package/dist/rich-document/variants/ActionBar.js

@@ -7,8 +7,11 @@ import { cn } from "@ai-matrx/design-system";
 import { AlchemyDocumentMenu } from "./shared/AlchemyDocumentMenu.js";
 import { CopySplitButton } from "../../copy/CopySplitButton.js";
 import { copyRichContent } from "../../copy/copy-commands.js";
+import { ExportPaletteAnchor, openExportPalette } from "../../copy/ExportPalette.js";
+import { ensureExportPaletteAction } from "../actions/export-palette-action.js";
 import { OpenOneMenuButton, useOneMenuFor } from "./shared/OpenOneMenuButton.js";
 import { StandaloneOneMenu } from "./shared/StandaloneOneMenu.js";
+ensureExportPaletteAction();
 const BAR_RESTRICT = { exclude: ["copy"] };
 const SPLIT_COPY_ACTION_IDS = {
   markdown: "copy-markdown",
@@ -26,9 +29,6 @@ function ActionBar(props) {
   const hasCopy = actions.some((action) => action.category === "copy");
   const palette = React.useRef(null);
   const copy = React.useCallback((flavor) => runDocumentCopy(actions, getCtx, flavor), [actions, getCtx]);
-  const mountMore = React.useCallback((element, close) => {
-    palette.current?.mountPalette(element, close);
-  }, []);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -43,7 +43,14 @@ function ActionBar(props) {
       ),
       children: [
         hasCopy ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(CopySplitButton, { copy, size: mini ? "xs" : "sm", mountMore }),
+          /* @__PURE__ */ jsx(
+            CopySplitButton,
+            {
+              copy,
+              size: mini ? "xs" : "sm",
+              ...hideOverflow ? { onExport: () => void openExportPalette(sourceId) } : {}
+            }
+          ),
           /* @__PURE__ */ jsx(
             AlchemyDocumentMenu,
             {
@@ -67,6 +74,7 @@ function ActionBar(props) {
             hideOverflow: true
           }
         ),
+        hasCopy ? /* @__PURE__ */ jsx(ExportPaletteAnchor, { exportKey: sourceId, controllerRef: palette }) : null,
         hideOverflow ? null : oneMenu ? /* @__PURE__ */ jsx(OpenOneMenuButton, { source: getCtx().source }) : /* @__PURE__ */ jsx(StandaloneOneMenu, { getCtx, target })
       ]
     }

package/dist/selection-toolbar/selection-actions.d.ts

@@ -42,7 +42,8 @@ export declare function hostHalf<T>(target: ClickTarget, key: string): T | null;
 type ModeRule = readonly SelectionMode[] | ((knobs: SelectionToolbarKnobs) => readonly SelectionMode[]);
 /**
  * THE MODE TABLE. Editing: formatting + AI + comment. Reading: highlight,
- * comment, suggest, AI, link and report. AI shows in both.
+ * comment, suggest, AI, link and report. AI shows in both. WHERE each shows —
+ * a button or a More row — is `SELECTION_PRIMARY` below.
  */
 export declare const SELECTION_ACTION_MODES: Readonly<Record<string, ModeRule>>;
 /**
@@ -50,7 +51,7 @@ export declare const SELECTION_ACTION_MODES: Readonly<Record<string, ModeRule>>;
  * the census test checks against the providers (selection-host-kinds.test.ts):
  * a host kind is the set of host halves present on the target.
  *
- *   annotated reading  (annotation + context menu)  highlight ×5, comment, suggest, link, report, AI and more —
+ *   annotated reading  (annotation + context menu)  highlight, comment, Ask AI; More: suggest, link, report —
  *                                                    the study guide, document Annotate, and EVERY saved record
  *                                                    (annotations/RecordAnnotations): a note's preview, a chat
  *                                                    answer, the studio previewing an unedited saved document.
@@ -98,6 +99,24 @@ export interface SelectionCommonHost {
         messageId: string;
     }): void;
 }
+/**
+ * THE BUTTONS (Arman, 2026-10-07: "simple, obvious, nothing extra"). The strip
+ * is the split Copy, these, then More — on every surface, desktop and phone.
+ * Every other action of the mode table is a More row.
+ *   reading:  Copy · Highlight (opens the colours) · Comment · Ask AI · More
+ *   editing:  Copy · Bold · Italic · Link · Ask AI · More (headings, lists, comment…)
+ */
+export declare const SELECTION_PRIMARY: Readonly<Record<SelectionMode, readonly string[]>>;
+/**
+ * A surface's OWN passage action takes the reading row's middle slot when present (Arman,
+ * 2026-10-07): the study guide reads Copy · Highlight · I don't get this · Ask AI · More, and
+ * Comment moves behind More there. Listed in priority order; the first present one wins.
+ */
+export declare const SELECTION_CONTEXT_PRIMARY: readonly string[];
+/** The buttons for this target: the mode's set, with a present context action in Comment's slot. */
+export declare function selectionPrimaryFor(target: ClickTarget, mode: SelectionMode): readonly string[];
+/** The most controls the strip ever shows: the split Copy, the buttons, and More. */
+export declare const SELECTION_MAX_VISIBLE = 6;
 /**
  * Which actions keep a button when the bar cannot show them all (a phone).
  * Everything else — including "AI and more" when space is tight — moves into

package/dist/selection-toolbar/selection-actions.js

@@ -35,12 +35,8 @@ const SELECTION_ACTION_MODES = {
   "selection:format-codeblock": ["edit"],
   "selection:format-variable": ["edit"],
   "selection:format-color": ["edit"],
-  // Annotations (the annotation sidecar)
-  "selection:highlight-yellow": HIGHLIGHT,
-  "selection:highlight-green": HIGHLIGHT,
-  "selection:highlight-blue": HIGHLIGHT,
-  "selection:highlight-pink": HIGHLIGHT,
-  "selection:highlight-purple": HIGHLIGHT,
+  // Annotations (the annotation sidecar). ONE Highlight button; it opens the colour choice.
+  "selection:highlight": HIGHLIGHT,
   "selection:comment": ["read", "edit"],
   "selection:suggest": ["read"],
   "selection:link-record": ["read"],
@@ -85,6 +81,18 @@ function shownInSelectionMode(actionId, target) {
   return modes.includes(toolbar.mode);
 }
 const SELECTION_COMMON_HOST_KEY = "selectionCommon";
+const SELECTION_PRIMARY = {
+  edit: ["selection:format-bold", "selection:format-italic", "selection:format-link", "selection:ai"],
+  read: ["selection:highlight", "selection:comment", "selection:ai"]
+};
+const SELECTION_CONTEXT_PRIMARY = ["selection:tutor-explain"];
+function selectionPrimaryFor(target, mode) {
+  const base = SELECTION_PRIMARY[mode];
+  if (mode !== "read") return base;
+  const context = SELECTION_CONTEXT_PRIMARY.find((id) => presentAt(id, target));
+  return context ? base.map((id) => id === "selection:comment" ? context : id) : base;
+}
+const SELECTION_MAX_VISIBLE = 6;
 const SELECTION_PRIORITY = {
   edit: [
     "selection:format-bold",
@@ -102,11 +110,7 @@ const SELECTION_PRIORITY = {
     "selection:format-quote",
     "selection:format-list",
     "selection:format-variable",
-    "selection:highlight-yellow",
-    "selection:highlight-green",
-    "selection:highlight-blue",
-    "selection:highlight-pink",
-    "selection:highlight-purple",
+    "selection:highlight",
     "selection:table-row-above",
     "selection:table-col-left",
     "selection:table-align-left",
@@ -119,15 +123,11 @@ const SELECTION_PRIORITY = {
     "selection:save-to-table"
   ],
   read: [
-    "selection:highlight-yellow",
+    "selection:highlight",
     "selection:comment",
     "selection:ai",
     "selection:suggest",
     "selection:tutor-explain",
-    "selection:highlight-green",
-    "selection:highlight-blue",
-    "selection:highlight-pink",
-    "selection:highlight-purple",
     "selection:tutor-ask",
     "selection:link-record",
     "selection:report",
@@ -165,8 +165,11 @@ function presentAt(id, target) {
 }
 function selectionPlacement(id, target) {
   const toolbar = selectionToolbarHostOf(target);
-  if (!toolbar || toolbar.slots === null) return "primary";
-  const shown = SELECTION_PRIORITY[toolbar.mode].filter((x) => presentAt(x, target));
+  if (!toolbar) return "primary";
+  const primary = selectionPrimaryFor(target, toolbar.mode);
+  if (!primary.includes(id)) return "overflow";
+  if (toolbar.slots === null) return "primary";
+  const shown = primary.filter((x) => presentAt(x, target));
   if (shown.length <= toolbar.slots) return "primary";
   const rank = shown.indexOf(id);
   return rank >= 0 && rank < Math.max(1, toolbar.slots - 1) ? "primary" : "overflow";
@@ -225,7 +228,10 @@ export {
   PASSAGE_ACTIONS_HOST_KEY,
   SELECTION_ACTION_MODES,
   SELECTION_COMMON_HOST_KEY,
+  SELECTION_CONTEXT_PRIMARY,
   SELECTION_HOST_KINDS,
+  SELECTION_MAX_VISIBLE,
+  SELECTION_PRIMARY,
   SELECTION_PRIORITY,
   SELECTION_TOOLBAR_KNOB_FEATURE,
   declareSelectionProvider,
@@ -235,6 +241,7 @@ export {
   passageActionsProvider,
   placeSelectionActions,
   selectionPlacement,
+  selectionPrimaryFor,
   selectionToolbarHostOf,
   shownInSelectionMode,
   subscribeDeclaredSelectionProviders

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-matrx/rich-content",
-  "version": "0.2.40",
+  "version": "0.2.43",
   "description": "The AI Matrx formatted-text engine: the one markdown renderer, streaming markdown, the block splitter and renderer, the generic blocks, <RichContent> levels, the rich-document action registry and menus, copy, and the selection toolbar — as portable React.",
   "type": "module",
   "license": "MIT",
@@ -136,15 +136,15 @@
     "@ai-matrx/content-ir": "latest",
     "@ai-matrx/content-ir-react": "latest",
     "@ai-matrx/data": "latest",
-    "@ai-matrx/diff": "latest",
     "@ai-matrx/design-system": "latest",
+    "@ai-matrx/diff": "latest",
     "@ai-matrx/icons": "latest",
     "@ai-matrx/kit": "latest",
     "@ai-matrx/media": "latest",
-    "@ai-matrx/records": "latest",
     "@ai-matrx/print": "latest",
-    "@ai-matrx/tap-target": "latest",
-    "@ai-matrx/records-ui": "latest"
+    "@ai-matrx/records": "latest",
+    "@ai-matrx/records-ui": "latest",
+    "@ai-matrx/tap-target": "latest"
   },
   "peerDependencies": {
     "react": ">=19.0.0",