@comitor/ui 3.5.0 → 3.6.0

package/README.md

@@ -129,7 +129,7 @@ Package có **8 entry**, tách theo peer optional mà mỗi tầng kéo theo:
 | `@comitor/ui/chart` | Lớp shadcn bọc recharts + `Comitor*Chart` + `CHART_COLORS` | `recharts` (~100KB) |
 | `@comitor/ui/data-grid` | `DataGrid` — lưới sửa trực tiếp kiểu bảng tính: ảo hoá dòng, chọn vùng bằng bàn phím, copy/paste với Excel, ghim cột, lọc/sắp xếp nhiều tiêu chí, hoàn tác/làm lại | `@tanstack/react-table` (peer); kèm `@tanstack/react-virtual` + `@dnd-kit/*` (dependency của gói) |
 | `@comitor/ui/uploader` | `FileUpload` (tệp tài liệu) · `ImageUploadField` (ảnh đại diện, logo) · `useFileUpload` | `@uppy/core`, `@uppy/xhr-upload` (~13KB gzip) |
-| `@comitor/ui/editor` | `MarkdownEditor` — trình soạn kiểu Linear, lưu bằng markdown: gõ tắt, menu `/`, `@` nhắc người, thanh định dạng nổi, ảnh, bảng, khối mã tô màu | `@tiptap/*` + `lowlight` (~234KB gzip — nạp lười nếu trang không cần ngay) |
+| `@comitor/ui/editor` | `MarkdownEditor` — trình soạn kiểu Linear, lưu bằng markdown · `RichTextEditor` — lưu HTML, thanh công cụ cố định kiểu CMS. Chung: gõ tắt, menu `/`, `@` nhắc người, ảnh, bảng, khối mã tô màu, `toolbar="bubble" \| "fixed"` | `@tiptap/*` + `lowlight` (~234KB gzip — nạp lười nếu trang không cần ngay) |
 | `@comitor/ui/form` | Binding shadcn ⇄ react-hook-form | `react-hook-form` |
 | `@comitor/ui/tokens` | Token dạng object TS — cho nơi không có Tailwind: canvas, email HTML, PDF | không có |
 
@@ -187,7 +187,7 @@ riêng kèm demo, bảng prop và cạm bẫy của nó:
 | **chart** · 4 file · `@comitor/ui/chart` | Lớp shadcn bọc recharts, cùng ba bản dựng sẵn theo brand. ⚠ Ba wrapper `Comitor*Chart` **mặc định TẮT** hiệu ứng vẽ dần (`isAnimationActive = false`) — bật lại là biểu đồ kẹt ở khung đầu: có trục, có lưới, KHÔNG có dữ liệu. Mặc định đó KHÔNG áp cho `<ChartContainer>` + recharts do app tự lắp | https://design-system.comitor.ai/components/chart |
 | **data-grid** · 32 file · `@comitor/ui/data-grid` | `DataGrid` — lưới sửa trực tiếp kiểu bảng tính, cho màn nhập liệu hàng loạt. Port từ [tablecn](https://www.tablecn.com/data-grid) (MIT) sang primitive + token của gói. ⚠ Là tầng DUY NHẤT có peer **`@tanstack/react-table`**, có thêm prop `locale` riêng (xem dưới), và mọi thứ trong nó là client component | [docs/data-grid.md](docs/data-grid.md) |
 | **uploader** · 5 file · `@comitor/ui/uploader` | `FileUpload` (tệp) · `ImageUploadField` (ảnh) · `useFileUpload` — kéo thả, xem trước, tiến độ. Peer optional: `@uppy/core` + `@uppy/xhr-upload` | https://design-system.comitor.ai/components |
-| **editor** · 11 file · `@comitor/ui/editor` | `MarkdownEditor` — soạn trực tiếp trên bản đã định dạng, giá trị vào/ra là markdown (GFM). Dựng trên Tiptap 3 (ProseMirror). ⚠ Định dạng LƯU là hợp đồng: nhắc người là `[@Tên](mention:<id>)`, ảnh lưu `src` app trả về (không phải URL đã ký), gạch chân cố ý không có. Peer optional: bộ `@tiptap/*` + `lowlight` | [docs/editor.md](docs/editor.md) |
+| **editor** · 17 file · `@comitor/ui/editor` | `MarkdownEditor` — soạn trực tiếp trên bản đã định dạng, giá trị vào/ra là markdown (GFM); `RichTextEditor` — cùng lõi, giá trị là HTML, lược đồ có thêm gạch chân và ô bảng nhiều khối, mặc định thanh cố định. Dựng trên Tiptap 3 (ProseMirror). ⚠ Định dạng LƯU là hợp đồng: nhắc người là `[@Tên](mention:<id>)` / `<span data-type="mention">`, ảnh lưu `src` app trả về (không phải URL đã ký), markdown cố ý không có gạch chân. ⚠ HTML đã lưu hiển thị lại bằng `RichTextEditor editable={false}`, không `dangerouslySetInnerHTML`. Peer optional: bộ `@tiptap/*` + `lowlight` | [docs/editor.md](docs/editor.md) |
 | **form** · `@comitor/ui/form` | Binding shadcn ⇄ react-hook-form | https://design-system.comitor.ai/components/form |
 
 **Ngôn ngữ — mặc định TIẾNG ANH, tiếng Việt dựng sẵn (từ `3.0.0`).** Mọi chuỗi hiển thị của gói —
@@ -313,6 +313,8 @@ Mỗi bản publish đi qua cùng một chuỗi cổng (`prepublishOnly` nối c
 - **`test:editor-markdown`** — markdown là định dạng LƯU của `MarkdownEditor`, nên phép đo là tài liệu →
   markdown → tài liệu phải ra đúng tài liệu ban đầu, trên CHÍNH lược đồ trong `dist/`. Lỗi loại này không lộ
   ra lúc gõ mà ở lần mở sau. Trên lược đồ gốc của Tiptap (chưa vá) cổng trượt 16/46 — [docs/editor.md](docs/editor.md) §5.
+  Từ `3.6.0` nó canh cả lược đồ HTML của `RichTextEditor`: thứ GHI xuống (`src` gốc, tên chụp) không được lẫn
+  thứ chỉ để VẼ (URL đã ký, tên sống).
 - **`test:a11y-gate`** tự kiểm chính cổng màu (cổng còn bắt đủ không); **`test:nav-active`** khoá
   toàn bộ luật active matching của sidebar dưới dạng hàm thuần (§4.1).
 - **`test:grid-render`** render THẬT `DataGrid` bằng `react-dom/server` rồi soi HTML ra được. Nó

package/dist/data-grid/use-data-grid.d.ts

@@ -122,7 +122,7 @@ declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, o
     pasteDialog: PasteDialogState;
     onRowAdd: ((event?: React.MouseEvent<HTMLDivElement>) => Promise<void>) | undefined;
     adjustLayout: boolean;
-    locale: "en" | "vi" | {
+    locale: {
         grid: {
             label: string;
             addRow: string;
@@ -397,7 +397,7 @@ declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, o
                 shortcuts: string;
             };
         };
-    } | undefined;
+    } | "en" | "vi" | undefined;
 };
 
 export { type UseDataGridProps, useDataGrid };

package/dist/editor/bubble-toolbar.d.ts

@@ -1,5 +1,6 @@
 import { Editor } from '@tiptap/core';
 import * as React from 'react';
+import { f as EditorFormat } from '../editor-types-BMST7-VR.js';
 import { MarkdownEditorLabels } from './markdown-editor-constants.js';
 
 /**
@@ -13,6 +14,18 @@ import { MarkdownEditorLabels } from './markdown-editor-constants.js';
  *
  * Vị trí do `BubbleMenu` của Tiptap tính (Floating UI). Nó gắn vào CHA của vùng soạn chứ không vào
  * `document.body`, nên ở trong `Dialog` vẫn nằm trong lớp của hộp thoại.
+ *
+ * ⚠ `strategy` PHẢI là `absolute` (mặc định của Tiptap), không phải `fixed`. `BubbleMenu` của
+ * `@tiptap/react` gán sẵn `position: absolute` cho phần tử lúc dựng, và Floating UI đo theo vị trí
+ * ĐANG CÓ của phần tử: lần hiện ĐẦU TIÊN, nó tính toạ độ theo khung `relative` của trình soạn rồi plugin
+ * áp chúng như toạ độ MÀN HÌNH (`fixed`) — bong bóng lệch đúng bằng khoảng cách từ khung tới góc màn
+ * hình, tới lần cập nhật sau mới về chỗ. `3.5.0` để `fixed` và lỗi đó có thật (đo ở harness: liên kết
+ * mở ở `left: -9px` thay vì sát chữ). `absolute` còn đi theo chữ khi một khung cuộn BÊN TRONG cuộn
+ * (`DialogBody`, cột chi tiết) — `fixed` thì đứng yên, vì plugin chỉ nghe cuộn của `window`. Bị khung
+ * cuộn cắt thì `flip` lật bong bóng xuống dưới vùng chọn.
+ *
+ * Trình soạn có thanh CỐ ĐỊNH (`toolbar="fixed"`) vẫn dùng bong bóng này với `formatting={false}`:
+ * nút định dạng đã ở thanh trên, nhưng ô sửa liên kết và phần xem trước liên kết chỉ có ở đây.
  */
 
 /**
@@ -26,9 +39,15 @@ declare function normalizeLinkHref(input: string): string | null;
 interface BubbleToolbarProps {
     editor: Editor;
     labels: MarkdownEditorLabels;
+    format: EditorFormat;
+    /**
+     * `false` khi trình soạn có thanh cố định (`toolbar="fixed"`): bong bóng không hiện nút định dạng
+     * nữa (đã có ở thanh trên), chỉ còn phần LIÊN KẾT — xem trước, sửa, gỡ.
+     */
+    formatting: boolean;
     /** Tăng mỗi lần ⌘/Ctrl+K — mở ô liên kết. Số đếm thay vì cờ để hai lần ⌘K liền nhau vẫn là hai lần. */
     linkRequest: number;
 }
-declare function BubbleToolbar({ editor, labels, linkRequest }: BubbleToolbarProps): React.JSX.Element | null;
+declare function BubbleToolbar({ editor, labels, format, formatting, linkRequest }: BubbleToolbarProps): React.JSX.Element | null;
 
 export { BubbleToolbar, type BubbleToolbarProps, normalizeLinkHref };

package/dist/editor/bubble-toolbar.js

@@ -3,32 +3,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { NodeSelection } from "@tiptap/pm/state";
 import { useEditorState } from "@tiptap/react";
 import { BubbleMenu } from "@tiptap/react/menus";
-import {
-  Bold,
-  Check,
-  Code,
-  ExternalLink,
-  Heading1,
-  Heading2,
-  Heading3,
-  Italic,
-  Link2,
-  Link2Off,
-  List,
-  ListChecks,
-  ListOrdered,
-  Pencil,
-  SquareCode,
-  Strikethrough,
-  TextQuote
-} from "lucide-react";
+import { Check, ExternalLink, Link2, Link2Off, Pencil } from "lucide-react";
 import * as React from "react";
-import { KeyboardHint } from "../components/composite/keyboard-hint.js";
 import { Separator } from "../components/ui/separator.js";
-import { Toggle } from "../components/ui/toggle.js";
-import { Tooltip, TooltipContent, TooltipTrigger } from "../components/ui/tooltip.js";
-import { cn } from "../lib/cn.js";
 import { useAsRef } from "../lib/use-as-ref.js";
+import { actionsFor, BLOCK_ACTIONS, MARK_ACTIONS } from "./toolbar-actions.js";
+import { ToolbarButton } from "./toolbar-button.js";
 function normalizeLinkHref(input) {
   const value = input.trim();
   if (!value) return null;
@@ -39,109 +19,9 @@ function normalizeLinkHref(input) {
   if (/^[^\s/]+\.[^\s/.]{2,}(?:[/?#]\S*)?$/.test(value)) return `https://${value}`;
   return null;
 }
-const MARK_ACTIONS = [
-  {
-    id: "bold",
-    icon: Bold,
-    label: "bold",
-    keys: "mod+b",
-    isActive: (editor) => editor.isActive("bold"),
-    run: (editor) => editor.chain().focus().toggleBold().run()
-  },
-  {
-    id: "italic",
-    icon: Italic,
-    label: "italic",
-    keys: "mod+i",
-    isActive: (editor) => editor.isActive("italic"),
-    run: (editor) => editor.chain().focus().toggleItalic().run()
-  },
-  {
-    id: "strike",
-    icon: Strikethrough,
-    label: "strike",
-    keys: "mod+shift+s",
-    isActive: (editor) => editor.isActive("strike"),
-    run: (editor) => editor.chain().focus().toggleStrike().run()
-  },
-  {
-    id: "code",
-    icon: Code,
-    label: "code",
-    keys: "mod+e",
-    isActive: (editor) => editor.isActive("code"),
-    run: (editor) => editor.chain().focus().toggleCode().run()
-  }
-];
-const BLOCK_ACTIONS = [
-  {
-    id: "heading1",
-    icon: Heading1,
-    label: "heading1",
-    keys: "mod+alt+1",
-    isActive: (editor) => editor.isActive("heading", { level: 1 }),
-    run: (editor) => editor.chain().focus().toggleHeading({ level: 1 }).run()
-  },
-  {
-    id: "heading2",
-    icon: Heading2,
-    label: "heading2",
-    keys: "mod+alt+2",
-    isActive: (editor) => editor.isActive("heading", { level: 2 }),
-    run: (editor) => editor.chain().focus().toggleHeading({ level: 2 }).run()
-  },
-  {
-    id: "heading3",
-    icon: Heading3,
-    label: "heading3",
-    keys: "mod+alt+3",
-    isActive: (editor) => editor.isActive("heading", { level: 3 }),
-    run: (editor) => editor.chain().focus().toggleHeading({ level: 3 }).run()
-  },
-  {
-    id: "bulletList",
-    icon: List,
-    label: "bulletList",
-    keys: "mod+shift+8",
-    isActive: (editor) => editor.isActive("bulletList"),
-    run: (editor) => editor.chain().focus().toggleBulletList().run()
-  },
-  {
-    id: "orderedList",
-    icon: ListOrdered,
-    label: "orderedList",
-    keys: "mod+shift+7",
-    isActive: (editor) => editor.isActive("orderedList"),
-    run: (editor) => editor.chain().focus().toggleOrderedList().run()
-  },
-  {
-    id: "taskList",
-    icon: ListChecks,
-    label: "taskList",
-    keys: "mod+shift+9",
-    isActive: (editor) => editor.isActive("taskList"),
-    run: (editor) => editor.chain().focus().toggleTaskList().run()
-  },
-  {
-    id: "blockquote",
-    icon: TextQuote,
-    label: "blockquote",
-    keys: "mod+shift+b",
-    isActive: (editor) => editor.isActive("blockquote"),
-    run: (editor) => editor.chain().focus().toggleBlockquote().run()
-  },
-  {
-    id: "codeBlock",
-    icon: SquareCode,
-    label: "codeBlock",
-    keys: "mod+alt+c",
-    isActive: (editor) => editor.isActive("codeBlock"),
-    run: (editor) => editor.chain().focus().toggleCodeBlock().run()
-  }
-];
 function readToolbarState(editor) {
   const active = {};
-  for (const action of [...MARK_ACTIONS, ...BLOCK_ACTIONS]) active[action.id] = action.isActive(editor);
+  for (const action of [...MARK_ACTIONS, ...BLOCK_ACTIONS]) active[action.id] = action.isActive?.(editor) ?? false;
   const href = editor.getAttributes("link").href;
   return {
     active,
@@ -156,49 +36,7 @@ function sameToolbarState(a, b) {
   if (a.link !== b.link || a.href !== b.href || a.empty !== b.empty || a.inTable !== b.inTable) return false;
   return Object.keys(a.active).every((key) => a.active[key] === b.active[key]);
 }
-const BUTTON_CLASS = "h-7 min-w-7 px-1.5";
-function ToolbarButton({
-  icon: Icon,
-  label,
-  keys,
-  pressed,
-  onClick,
-  className
-}) {
-  const button = pressed === void 0 ? /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      "aria-label": label,
-      onMouseDown: (event) => event.preventDefault(),
-      onClick,
-      className: cn(
-        "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors duration-150 ease-out hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 [&_svg]:size-4 [&_svg]:shrink-0",
-        BUTTON_CLASS,
-        className
-      ),
-      children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true" })
-    }
-  ) : /* @__PURE__ */ jsx(
-    Toggle,
-    {
-      "aria-label": label,
-      pressed,
-      onPressedChange: onClick,
-      onMouseDown: (event) => event.preventDefault(),
-      className: cn(BUTTON_CLASS, className),
-      children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true" })
-    }
-  );
-  return /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 400, children: [
-    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: button }),
-    /* @__PURE__ */ jsxs(TooltipContent, { side: "top", sideOffset: 6, className: "flex items-center gap-2", children: [
-      label,
-      keys && /* @__PURE__ */ jsx(KeyboardHint, { keys, compact: true })
-    ] })
-  ] });
-}
-function BubbleToolbar({ editor, labels, linkRequest }) {
+function BubbleToolbar({ editor, labels, format, formatting, linkRequest }) {
   const state = useEditorState({
     editor,
     selector: ({ editor: current }) => readToolbarState(current),
@@ -206,6 +44,7 @@ function BubbleToolbar({ editor, labels, linkRequest }) {
   });
   const [editingLink, setEditingLink] = React.useState(false);
   const editingLinkRef = useAsRef(editingLink);
+  const formattingRef = useAsRef(formatting);
   const [draft, setDraft] = React.useState("");
   const [invalid, setInvalid] = React.useState(false);
   const inputRef = React.useRef(null);
@@ -266,14 +105,15 @@ function BubbleToolbar({ editor, labels, linkRequest }) {
       const { selection } = editorState;
       if (selection instanceof NodeSelection || current.isActive("codeBlock")) return false;
       if (selection.empty) return current.isActive("link");
+      if (!formattingRef.current) return false;
       return editorState.doc.textBetween(from, to, " ").trim().length > 0;
     },
-    [editingLinkRef]
+    [editingLinkRef, formattingRef]
   );
   const options = React.useMemo(
     () => ({
-      // `fixed`: không bị cắt bởi khung cuộn chứa trình soạn (`DialogBody`, cột chi tiết cuộn riêng).
-      strategy: "fixed",
+      // `absolute`, không `fixed` — lý do ở đầu file.
+      strategy: "absolute",
       placement: "top",
       offset: 8,
       flip: true,
@@ -352,7 +192,7 @@ function BubbleToolbar({ editor, labels, linkRequest }) {
         /* @__PURE__ */ jsx(ToolbarButton, { icon: Pencil, label: labels.linkEdit, keys: "mod+k", onClick: openLinkEditor }),
         /* @__PURE__ */ jsx(ToolbarButton, { icon: Link2Off, label: labels.linkRemove, onClick: removeLink })
       ] }) : /* @__PURE__ */ jsxs("div", { role: "toolbar", "aria-label": labels.toolbar, className: "flex items-center gap-0.5", children: [
-        MARK_ACTIONS.map((action) => /* @__PURE__ */ jsx(
+        actionsFor(MARK_ACTIONS, format).map((action) => /* @__PURE__ */ jsx(
           ToolbarButton,
           {
             icon: action.icon,
@@ -364,7 +204,7 @@ function BubbleToolbar({ editor, labels, linkRequest }) {
           action.id
         )),
         /* @__PURE__ */ jsx(ToolbarButton, { icon: Link2, label: labels.link, keys: "mod+k", pressed: state.link, onClick: openLinkEditor }),
-        !state.inTable && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5 max-sm:hidden", children: [
+        !(format === "markdown" && state.inTable) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5 max-sm:hidden", children: [
           /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "mx-0.5 h-5" }),
           BLOCK_ACTIONS.map((action, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
             (index === 3 || index === 6) && /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "mx-0.5 h-5" }),

package/dist/editor/bubble-toolbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/editor/bubble-toolbar.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Thanh định dạng NỔI — hiện khi bôi chọn chữ, như Linear: không có thanh công cụ cố định chiếm chỗ\n * trên đầu tài liệu, định dạng ở ngay chỗ đang chọn.\n *\n * Ba trạng thái trong cùng một bong bóng:\n *   · đang chọn chữ  → nút định dạng (dấu nội dòng + đổi khối);\n *   · con trỏ đứng TRONG một liên kết (không chọn gì) → địa chỉ + Mở / Sửa / Gỡ;\n *   · đang sửa liên kết (nút Liên kết, hoặc ⌘K) → ô nhập địa chỉ.\n *\n * Vị trí do `BubbleMenu` của Tiptap tính (Floating UI). Nó gắn vào CHA của vùng soạn chứ không vào\n * `document.body`, nên ở trong `Dialog` vẫn nằm trong lớp của hộp thoại.\n */\n\nimport type { Editor } from \"@tiptap/core\";\nimport { NodeSelection } from \"@tiptap/pm/state\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { BubbleMenu, type BubbleMenuProps } from \"@tiptap/react/menus\";\nimport {\n  Bold,\n  Check,\n  Code,\n  ExternalLink,\n  Heading1,\n  Heading2,\n  Heading3,\n  Italic,\n  Link2,\n  Link2Off,\n  List,\n  ListChecks,\n  ListOrdered,\n  type LucideIcon,\n  Pencil,\n  SquareCode,\n  Strikethrough,\n  TextQuote\n} from \"lucide-react\";\nimport * as React from \"react\";\nimport { KeyboardHint } from \"../components/composite/keyboard-hint.js\";\nimport { Separator } from \"../components/ui/separator.js\";\nimport { Toggle } from \"../components/ui/toggle.js\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../components/ui/tooltip.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { useAsRef } from \"../lib/use-as-ref.js\";\nimport type { MarkdownEditorLabels } from \"./markdown-editor-constants.js\";\n\n/**\n * Chuẩn hoá địa chỉ người dùng gõ vào ô liên kết. Trả `null` khi KHÔNG nhận.\n *\n * Nhận: `http(s):`, `mailto:`, `tel:`, đường dẫn trong app (`/tasks/CV-12`, `#muc`), và hai dạng gõ\n * tắt — tên miền trần (`comitor.ai/docs` → `https://…`), email trần (→ `mailto:`). Từ chối MỌI lược\n * đồ khác: `javascript:`, `data:`, `vbscript:` là ba cách biến một liên kết thành mã chạy được.\n */\nexport function normalizeLinkHref(input: string): string | null {\n  const value = input.trim();\n  if (!value) return null;\n  if (/^(?:https?:\\/\\/|mailto:|tel:)/i.test(value)) return value;\n  if (/^[a-z][a-z0-9+.-]*:/i.test(value)) return null;\n  if (/^[/#]/.test(value)) return value;\n  if (/^[^\\s@/]+@[^\\s@/]+\\.[^\\s@/]+$/.test(value)) return `mailto:${value}`;\n  if (/^[^\\s/]+\\.[^\\s/.]{2,}(?:[/?#]\\S*)?$/.test(value)) return `https://${value}`;\n  return null;\n}\n\n/** Khoá nhãn mang CHUỖI (loại `slashKeywords` và hàm `taskCheckbox`). */\ntype TextLabelKey = {\n  [K in keyof MarkdownEditorLabels]: MarkdownEditorLabels[K] extends string ? K : never;\n}[keyof MarkdownEditorLabels];\n\ninterface ToolbarAction {\n  id: string;\n  icon: LucideIcon;\n  label: TextLabelKey;\n  /** Phím tắt cho tooltip — cú pháp của `KeyboardHint` (`mod+b`). Mặc định Tiptap, trừ ⌘K của gói. */\n  keys?: string;\n  isActive: (editor: Editor) => boolean;\n  run: (editor: Editor) => void;\n}\n\nconst MARK_ACTIONS: readonly ToolbarAction[] = [\n  {\n    id: \"bold\",\n    icon: Bold,\n    label: \"bold\",\n    keys: \"mod+b\",\n    isActive: (editor) => editor.isActive(\"bold\"),\n    run: (editor) => editor.chain().focus().toggleBold().run()\n  },\n  {\n    id: \"italic\",\n    icon: Italic,\n    label: \"italic\",\n    keys: \"mod+i\",\n    isActive: (editor) => editor.isActive(\"italic\"),\n    run: (editor) => editor.chain().focus().toggleItalic().run()\n  },\n  {\n    id: \"strike\",\n    icon: Strikethrough,\n    label: \"strike\",\n    keys: \"mod+shift+s\",\n    isActive: (editor) => editor.isActive(\"strike\"),\n    run: (editor) => editor.chain().focus().toggleStrike().run()\n  },\n  {\n    id: \"code\",\n    icon: Code,\n    label: \"code\",\n    keys: \"mod+e\",\n    isActive: (editor) => editor.isActive(\"code\"),\n    run: (editor) => editor.chain().focus().toggleCode().run()\n  }\n];\n\n/*\n * Đổi khối. Ẩn ở màn hẹp (thanh sẽ rộng hơn 375px) và trong bảng (ô bảng chỉ chứa một đoạn văn —\n * xem `ComitorTableCell`): cả hai chỗ đó vẫn còn cú pháp gõ tắt và menu `/`.\n */\nconst BLOCK_ACTIONS: readonly ToolbarAction[] = [\n  {\n    id: \"heading1\",\n    icon: Heading1,\n    label: \"heading1\",\n    keys: \"mod+alt+1\",\n    isActive: (editor) => editor.isActive(\"heading\", { level: 1 }),\n    run: (editor) => editor.chain().focus().toggleHeading({ level: 1 }).run()\n  },\n  {\n    id: \"heading2\",\n    icon: Heading2,\n    label: \"heading2\",\n    keys: \"mod+alt+2\",\n    isActive: (editor) => editor.isActive(\"heading\", { level: 2 }),\n    run: (editor) => editor.chain().focus().toggleHeading({ level: 2 }).run()\n  },\n  {\n    id: \"heading3\",\n    icon: Heading3,\n    label: \"heading3\",\n    keys: \"mod+alt+3\",\n    isActive: (editor) => editor.isActive(\"heading\", { level: 3 }),\n    run: (editor) => editor.chain().focus().toggleHeading({ level: 3 }).run()\n  },\n  {\n    id: \"bulletList\",\n    icon: List,\n    label: \"bulletList\",\n    keys: \"mod+shift+8\",\n    isActive: (editor) => editor.isActive(\"bulletList\"),\n    run: (editor) => editor.chain().focus().toggleBulletList().run()\n  },\n  {\n    id: \"orderedList\",\n    icon: ListOrdered,\n    label: \"orderedList\",\n    keys: \"mod+shift+7\",\n    isActive: (editor) => editor.isActive(\"orderedList\"),\n    run: (editor) => editor.chain().focus().toggleOrderedList().run()\n  },\n  {\n    id: \"taskList\",\n    icon: ListChecks,\n    label: \"taskList\",\n    keys: \"mod+shift+9\",\n    isActive: (editor) => editor.isActive(\"taskList\"),\n    run: (editor) => editor.chain().focus().toggleTaskList().run()\n  },\n  {\n    id: \"blockquote\",\n    icon: TextQuote,\n    label: \"blockquote\",\n    keys: \"mod+shift+b\",\n    isActive: (editor) => editor.isActive(\"blockquote\"),\n    run: (editor) => editor.chain().focus().toggleBlockquote().run()\n  },\n  {\n    id: \"codeBlock\",\n    icon: SquareCode,\n    label: \"codeBlock\",\n    keys: \"mod+alt+c\",\n    isActive: (editor) => editor.isActive(\"codeBlock\"),\n    run: (editor) => editor.chain().focus().toggleCodeBlock().run()\n  }\n];\n\ninterface ToolbarState {\n  active: Record<string, boolean>;\n  link: boolean;\n  href: string;\n  empty: boolean;\n  inTable: boolean;\n}\n\nfunction readToolbarState(editor: Editor): ToolbarState {\n  const active: Record<string, boolean> = {};\n  for (const action of [...MARK_ACTIONS, ...BLOCK_ACTIONS]) active[action.id] = action.isActive(editor);\n  const href = editor.getAttributes(\"link\").href;\n  return {\n    active,\n    link: editor.isActive(\"link\"),\n    href: typeof href === \"string\" ? href : \"\",\n    empty: editor.state.selection.empty,\n    inTable: editor.isActive(\"table\")\n  };\n}\n\n/** So nông — `useEditorState` chỉ render lại khi kết quả KHÁC, mà mỗi lần đọc là một object mới. */\nfunction sameToolbarState(a: ToolbarState | null, b: ToolbarState | null): boolean {\n  if (!a || !b) return a === b;\n  if (a.link !== b.link || a.href !== b.href || a.empty !== b.empty || a.inTable !== b.inTable) return false;\n  return Object.keys(a.active).every((key) => a.active[key] === b.active[key]);\n}\n\n/*\n * Nút nhỏ hơn `Toggle size=\"sm\"` một bậc (28px): mười ba nút của Linear-style toolbar phải nằm gọn\n * trên một dòng ở màn laptop. Mousedown bị chặn để focus Ở LẠI vùng soạn — mất focus là mất vùng chọn\n * mà nút sắp áp định dạng lên.\n */\nconst BUTTON_CLASS = \"h-7 min-w-7 px-1.5\";\n\nfunction ToolbarButton({\n  icon: Icon,\n  label,\n  keys,\n  pressed,\n  onClick,\n  className\n}: {\n  icon: LucideIcon;\n  label: string;\n  keys?: string;\n  pressed?: boolean;\n  onClick: () => void;\n  className?: string;\n}) {\n  const button =\n    pressed === undefined ? (\n      <button\n        type=\"button\"\n        aria-label={label}\n        onMouseDown={(event) => event.preventDefault()}\n        onClick={onClick}\n        className={cn(\n          \"inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors duration-150 ease-out hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 [&_svg]:size-4 [&_svg]:shrink-0\",\n          BUTTON_CLASS,\n          className\n        )}\n      >\n        <Icon aria-hidden=\"true\" />\n      </button>\n    ) : (\n      <Toggle\n        aria-label={label}\n        pressed={pressed}\n        onPressedChange={onClick}\n        onMouseDown={(event) => event.preventDefault()}\n        className={cn(BUTTON_CLASS, className)}\n      >\n        <Icon aria-hidden=\"true\" />\n      </Toggle>\n    );\n\n  return (\n    <Tooltip delayDuration={400}>\n      <TooltipTrigger asChild>{button}</TooltipTrigger>\n      <TooltipContent side=\"top\" sideOffset={6} className=\"flex items-center gap-2\">\n        {label}\n        {keys && <KeyboardHint keys={keys} compact />}\n      </TooltipContent>\n    </Tooltip>\n  );\n}\n\nexport interface BubbleToolbarProps {\n  editor: Editor;\n  labels: MarkdownEditorLabels;\n  /** Tăng mỗi lần ⌘/Ctrl+K — mở ô liên kết. Số đếm thay vì cờ để hai lần ⌘K liền nhau vẫn là hai lần. */\n  linkRequest: number;\n}\n\nexport function BubbleToolbar({ editor, labels, linkRequest }: BubbleToolbarProps) {\n  const state = useEditorState({\n    editor,\n    selector: ({ editor: current }) => readToolbarState(current),\n    equalityFn: sameToolbarState\n  });\n  const [editingLink, setEditingLink] = React.useState(false);\n  const editingLinkRef = useAsRef(editingLink);\n  const [draft, setDraft] = React.useState(\"\");\n  const [invalid, setInvalid] = React.useState(false);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const pluginKey = \"comitorBubbleToolbar\";\n\n  /*\n   * Hai giao dịch, theo đúng thứ tự: meta `\"show\"` của plugin gọi `updatePosition()` TRƯỚC `show()`,\n   * mà `updatePosition()` bỏ qua khi bong bóng đang ẩn — nên một mình `\"show\"` hiện bong bóng ở toạ\n   * độ CŨ (lần hiện trước, hoặc góc trái trên). `\"updatePosition\"` sau đó mới tính đúng chỗ.\n   */\n  const showBubble = React.useCallback(() => {\n    editor.view.dispatch(editor.state.tr.setMeta(pluginKey, \"show\"));\n    editor.view.dispatch(editor.state.tr.setMeta(pluginKey, \"updatePosition\"));\n  }, [editor]);\n\n  const openLinkEditor = React.useCallback(() => {\n    const href = editor.getAttributes(\"link\").href;\n    setDraft(typeof href === \"string\" ? href : \"\");\n    setInvalid(false);\n    setEditingLink(true);\n  }, [editor]);\n\n  // ⌘K từ vùng soạn. Bỏ qua giá trị đầu (0) — đó là lúc mount, không phải một lần bấm.\n  React.useEffect(() => {\n    if (linkRequest === 0) return;\n    openLinkEditor();\n  }, [linkRequest, openLinkEditor]);\n\n  // Vừa vào chế độ sửa: bắt plugin hiện bong bóng (kể cả khi không chọn gì) rồi đưa focus vào ô nhập.\n  React.useEffect(() => {\n    if (!editingLink) return;\n    showBubble();\n    const frame = requestAnimationFrame(() => inputRef.current?.select());\n    return () => cancelAnimationFrame(frame);\n  }, [editingLink, showBubble]);\n\n  const closeLinkEditor = (refocus: boolean) => {\n    setEditingLink(false);\n    setInvalid(false);\n    if (refocus) editor.commands.focus();\n  };\n\n  const applyLink = () => {\n    const href = normalizeLinkHref(draft);\n    if (draft.trim() === \"\") {\n      editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\n      closeLinkEditor(false);\n      return;\n    }\n    if (!href) {\n      setInvalid(true);\n      return;\n    }\n    const chain = editor.chain().focus().extendMarkRange(\"link\");\n    if (editor.state.selection.empty && !editor.isActive(\"link\")) {\n      // Không chọn chữ nào: chèn chính địa chỉ làm chữ của liên kết.\n      chain.insertContent({ type: \"text\", text: draft.trim(), marks: [{ type: \"link\", attrs: { href } }] }).run();\n    } else {\n      chain.setLink({ href }).run();\n    }\n    closeLinkEditor(false);\n  };\n\n  const removeLink = () => {\n    editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\n    closeLinkEditor(false);\n  };\n\n  /*\n   * Ổn định qua các lượt render: `BubbleMenu` gửi lại TOÀN BỘ tuỳ chọn vào plugin mỗi khi một prop\n   * đổi định danh. `shouldShow` đọc cờ sửa-liên-kết qua ref vì cùng lý do.\n   */\n  const shouldShow = React.useCallback<NonNullable<BubbleMenuProps[\"shouldShow\"]>>(\n    ({ editor: current, element, view, state: editorState, from, to }) => {\n      if (!current.isEditable) return false;\n      if (!(view.hasFocus() || element.contains(document.activeElement))) return false;\n      if (editingLinkRef.current) return true;\n      const { selection } = editorState;\n      if (selection instanceof NodeSelection || current.isActive(\"codeBlock\")) return false;\n      if (selection.empty) return current.isActive(\"link\");\n      return editorState.doc.textBetween(from, to, \" \").trim().length > 0;\n    },\n    [editingLinkRef]\n  );\n\n  const options = React.useMemo<BubbleMenuProps[\"options\"]>(\n    () => ({\n      // `fixed`: không bị cắt bởi khung cuộn chứa trình soạn (`DialogBody`, cột chi tiết cuộn riêng).\n      strategy: \"fixed\",\n      placement: \"top\",\n      offset: 8,\n      flip: true,\n      shift: { padding: 8 },\n      onHide: () => setEditingLink(false)\n    }),\n    []\n  );\n\n  if (!state) return null;\n\n  return (\n    <BubbleMenu\n      editor={editor}\n      pluginKey={pluginKey}\n      updateDelay={100}\n      shouldShow={shouldShow}\n      options={options}\n      className=\"z-50 rounded-lg border bg-popover p-1 text-popover-foreground shadow-overlay\"\n    >\n      {editingLink ? (\n        <form\n          className=\"flex flex-col gap-1\"\n          onSubmit={(event) => {\n            event.preventDefault();\n            applyLink();\n          }}\n        >\n          <div className=\"flex items-center gap-1\">\n            <input\n              ref={inputRef}\n              type=\"text\"\n              inputMode=\"url\"\n              aria-label={labels.linkInput}\n              aria-invalid={invalid || undefined}\n              placeholder={labels.linkPlaceholder}\n              value={draft}\n              onChange={(event) => {\n                setDraft(event.target.value);\n                setInvalid(false);\n              }}\n              onKeyDown={(event) => {\n                if (event.key === \"Escape\") {\n                  event.preventDefault();\n                  // Escape ở đây chỉ đóng ô liên kết — không để nó lan tới `Dialog` bao ngoài.\n                  event.stopPropagation();\n                  closeLinkEditor(true);\n                }\n              }}\n              className=\"h-7 w-60 rounded-md border border-input bg-transparent px-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-primary-ink focus:outline-none focus:ring-2 focus:ring-ring/50 aria-invalid:border-destructive-ink dark:bg-input-fill\"\n            />\n            <ToolbarButton icon={Check} label={labels.linkApply} onClick={applyLink} />\n            {state.link && <ToolbarButton icon={Link2Off} label={labels.linkRemove} onClick={removeLink} />}\n          </div>\n          {invalid && (\n            <p role=\"alert\" className=\"px-1 pb-0.5 text-xs text-destructive-ink\">\n              {labels.linkInvalid}\n            </p>\n          )}\n        </form>\n      ) : state.empty && state.link ? (\n        <div className=\"flex items-center gap-1\">\n          <a\n            href={state.href}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n            onMouseDown={(event) => event.preventDefault()}\n            className=\"flex max-w-60 items-center gap-1.5 truncate rounded-md px-1.5 py-1 text-sm text-link-ink underline-offset-4 hover:text-link-ink-hover hover:underline\"\n          >\n            <ExternalLink aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n            <span className=\"truncate\">{state.href}</span>\n            <span className=\"sr-only\">{labels.linkOpen}</span>\n          </a>\n          <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />\n          <ToolbarButton icon={Pencil} label={labels.linkEdit} keys=\"mod+k\" onClick={openLinkEditor} />\n          <ToolbarButton icon={Link2Off} label={labels.linkRemove} onClick={removeLink} />\n        </div>\n      ) : (\n        <div role=\"toolbar\" aria-label={labels.toolbar} className=\"flex items-center gap-0.5\">\n          {MARK_ACTIONS.map((action) => (\n            <ToolbarButton\n              key={action.id}\n              icon={action.icon}\n              label={labels[action.label]}\n              keys={action.keys}\n              pressed={Boolean(state.active[action.id])}\n              onClick={() => action.run(editor)}\n            />\n          ))}\n          <ToolbarButton icon={Link2} label={labels.link} keys=\"mod+k\" pressed={state.link} onClick={openLinkEditor} />\n          {!state.inTable && (\n            <div className=\"flex items-center gap-0.5 max-sm:hidden\">\n              <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />\n              {BLOCK_ACTIONS.map((action, index) => (\n                <React.Fragment key={action.id}>\n                  {(index === 3 || index === 6) && <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />}\n                  <ToolbarButton\n                    icon={action.icon}\n                    label={labels[action.label]}\n                    keys={action.keys}\n                    pressed={Boolean(state.active[action.id])}\n                    onClick={() => action.run(editor)}\n                  />\n                </React.Fragment>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </BubbleMenu>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/editor/bubble-toolbar.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Thanh định dạng NỔI — hiện khi bôi chọn chữ, như Linear: không có thanh công cụ cố định chiếm chỗ\n * trên đầu tài liệu, định dạng ở ngay chỗ đang chọn.\n *\n * Ba trạng thái trong cùng một bong bóng:\n *   · đang chọn chữ  → nút định dạng (dấu nội dòng + đổi khối);\n *   · con trỏ đứng TRONG một liên kết (không chọn gì) → địa chỉ + Mở / Sửa / Gỡ;\n *   · đang sửa liên kết (nút Liên kết, hoặc ⌘K) → ô nhập địa chỉ.\n *\n * Vị trí do `BubbleMenu` của Tiptap tính (Floating UI). Nó gắn vào CHA của vùng soạn chứ không vào\n * `document.body`, nên ở trong `Dialog` vẫn nằm trong lớp của hộp thoại.\n *\n * ⚠ `strategy` PHẢI là `absolute` (mặc định của Tiptap), không phải `fixed`. `BubbleMenu` của\n * `@tiptap/react` gán sẵn `position: absolute` cho phần tử lúc dựng, và Floating UI đo theo vị trí\n * ĐANG CÓ của phần tử: lần hiện ĐẦU TIÊN, nó tính toạ độ theo khung `relative` của trình soạn rồi plugin\n * áp chúng như toạ độ MÀN HÌNH (`fixed`) — bong bóng lệch đúng bằng khoảng cách từ khung tới góc màn\n * hình, tới lần cập nhật sau mới về chỗ. `3.5.0` để `fixed` và lỗi đó có thật (đo ở harness: liên kết\n * mở ở `left: -9px` thay vì sát chữ). `absolute` còn đi theo chữ khi một khung cuộn BÊN TRONG cuộn\n * (`DialogBody`, cột chi tiết) — `fixed` thì đứng yên, vì plugin chỉ nghe cuộn của `window`. Bị khung\n * cuộn cắt thì `flip` lật bong bóng xuống dưới vùng chọn.\n *\n * Trình soạn có thanh CỐ ĐỊNH (`toolbar=\"fixed\"`) vẫn dùng bong bóng này với `formatting={false}`:\n * nút định dạng đã ở thanh trên, nhưng ô sửa liên kết và phần xem trước liên kết chỉ có ở đây.\n */\n\nimport type { Editor } from \"@tiptap/core\";\nimport { NodeSelection } from \"@tiptap/pm/state\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { BubbleMenu, type BubbleMenuProps } from \"@tiptap/react/menus\";\nimport { Check, ExternalLink, Link2, Link2Off, Pencil } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Separator } from \"../components/ui/separator.js\";\nimport { useAsRef } from \"../lib/use-as-ref.js\";\nimport type { EditorFormat } from \"./editor-types.js\";\nimport type { MarkdownEditorLabels } from \"./markdown-editor-constants.js\";\nimport { actionsFor, BLOCK_ACTIONS, MARK_ACTIONS } from \"./toolbar-actions.js\";\nimport { ToolbarButton } from \"./toolbar-button.js\";\n\n/**\n * Chuẩn hoá địa chỉ người dùng gõ vào ô liên kết. Trả `null` khi KHÔNG nhận.\n *\n * Nhận: `http(s):`, `mailto:`, `tel:`, đường dẫn trong app (`/tasks/CV-12`, `#muc`), và hai dạng gõ\n * tắt — tên miền trần (`comitor.ai/docs` → `https://…`), email trần (→ `mailto:`). Từ chối MỌI lược\n * đồ khác: `javascript:`, `data:`, `vbscript:` là ba cách biến một liên kết thành mã chạy được.\n */\nexport function normalizeLinkHref(input: string): string | null {\n  const value = input.trim();\n  if (!value) return null;\n  if (/^(?:https?:\\/\\/|mailto:|tel:)/i.test(value)) return value;\n  if (/^[a-z][a-z0-9+.-]*:/i.test(value)) return null;\n  if (/^[/#]/.test(value)) return value;\n  if (/^[^\\s@/]+@[^\\s@/]+\\.[^\\s@/]+$/.test(value)) return `mailto:${value}`;\n  if (/^[^\\s/]+\\.[^\\s/.]{2,}(?:[/?#]\\S*)?$/.test(value)) return `https://${value}`;\n  return null;\n}\n\ninterface ToolbarState {\n  active: Record<string, boolean>;\n  link: boolean;\n  href: string;\n  empty: boolean;\n  inTable: boolean;\n}\n\nfunction readToolbarState(editor: Editor): ToolbarState {\n  const active: Record<string, boolean> = {};\n  for (const action of [...MARK_ACTIONS, ...BLOCK_ACTIONS]) active[action.id] = action.isActive?.(editor) ?? false;\n  const href = editor.getAttributes(\"link\").href;\n  return {\n    active,\n    link: editor.isActive(\"link\"),\n    href: typeof href === \"string\" ? href : \"\",\n    empty: editor.state.selection.empty,\n    inTable: editor.isActive(\"table\")\n  };\n}\n\n/** So nông — `useEditorState` chỉ render lại khi kết quả KHÁC, mà mỗi lần đọc là một object mới. */\nfunction sameToolbarState(a: ToolbarState | null, b: ToolbarState | null): boolean {\n  if (!a || !b) return a === b;\n  if (a.link !== b.link || a.href !== b.href || a.empty !== b.empty || a.inTable !== b.inTable) return false;\n  return Object.keys(a.active).every((key) => a.active[key] === b.active[key]);\n}\n\nexport interface BubbleToolbarProps {\n  editor: Editor;\n  labels: MarkdownEditorLabels;\n  format: EditorFormat;\n  /**\n   * `false` khi trình soạn có thanh cố định (`toolbar=\"fixed\"`): bong bóng không hiện nút định dạng\n   * nữa (đã có ở thanh trên), chỉ còn phần LIÊN KẾT — xem trước, sửa, gỡ.\n   */\n  formatting: boolean;\n  /** Tăng mỗi lần ⌘/Ctrl+K — mở ô liên kết. Số đếm thay vì cờ để hai lần ⌘K liền nhau vẫn là hai lần. */\n  linkRequest: number;\n}\n\nexport function BubbleToolbar({ editor, labels, format, formatting, linkRequest }: BubbleToolbarProps) {\n  const state = useEditorState({\n    editor,\n    selector: ({ editor: current }) => readToolbarState(current),\n    equalityFn: sameToolbarState\n  });\n  const [editingLink, setEditingLink] = React.useState(false);\n  const editingLinkRef = useAsRef(editingLink);\n  const formattingRef = useAsRef(formatting);\n  const [draft, setDraft] = React.useState(\"\");\n  const [invalid, setInvalid] = React.useState(false);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const pluginKey = \"comitorBubbleToolbar\";\n\n  /*\n   * Hai giao dịch, theo đúng thứ tự: meta `\"show\"` của plugin gọi `updatePosition()` TRƯỚC `show()`,\n   * mà `updatePosition()` bỏ qua khi bong bóng đang ẩn — nên một mình `\"show\"` hiện bong bóng ở toạ\n   * độ CŨ (lần hiện trước, hoặc góc trái trên). `\"updatePosition\"` sau đó mới tính đúng chỗ.\n   */\n  const showBubble = React.useCallback(() => {\n    editor.view.dispatch(editor.state.tr.setMeta(pluginKey, \"show\"));\n    editor.view.dispatch(editor.state.tr.setMeta(pluginKey, \"updatePosition\"));\n  }, [editor]);\n\n  const openLinkEditor = React.useCallback(() => {\n    const href = editor.getAttributes(\"link\").href;\n    setDraft(typeof href === \"string\" ? href : \"\");\n    setInvalid(false);\n    setEditingLink(true);\n  }, [editor]);\n\n  // ⌘K từ vùng soạn. Bỏ qua giá trị đầu (0) — đó là lúc mount, không phải một lần bấm.\n  React.useEffect(() => {\n    if (linkRequest === 0) return;\n    openLinkEditor();\n  }, [linkRequest, openLinkEditor]);\n\n  // Vừa vào chế độ sửa: bắt plugin hiện bong bóng (kể cả khi không chọn gì) rồi đưa focus vào ô nhập.\n  React.useEffect(() => {\n    if (!editingLink) return;\n    showBubble();\n    const frame = requestAnimationFrame(() => inputRef.current?.select());\n    return () => cancelAnimationFrame(frame);\n  }, [editingLink, showBubble]);\n\n  const closeLinkEditor = (refocus: boolean) => {\n    setEditingLink(false);\n    setInvalid(false);\n    if (refocus) editor.commands.focus();\n  };\n\n  const applyLink = () => {\n    const href = normalizeLinkHref(draft);\n    if (draft.trim() === \"\") {\n      editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\n      closeLinkEditor(false);\n      return;\n    }\n    if (!href) {\n      setInvalid(true);\n      return;\n    }\n    const chain = editor.chain().focus().extendMarkRange(\"link\");\n    if (editor.state.selection.empty && !editor.isActive(\"link\")) {\n      // Không chọn chữ nào: chèn chính địa chỉ làm chữ của liên kết.\n      chain.insertContent({ type: \"text\", text: draft.trim(), marks: [{ type: \"link\", attrs: { href } }] }).run();\n    } else {\n      chain.setLink({ href }).run();\n    }\n    closeLinkEditor(false);\n  };\n\n  const removeLink = () => {\n    editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\n    closeLinkEditor(false);\n  };\n\n  /*\n   * Ổn định qua các lượt render: `BubbleMenu` gửi lại TOÀN BỘ tuỳ chọn vào plugin mỗi khi một prop\n   * đổi định danh. `shouldShow` đọc cờ sửa-liên-kết qua ref vì cùng lý do.\n   */\n  const shouldShow = React.useCallback<NonNullable<BubbleMenuProps[\"shouldShow\"]>>(\n    ({ editor: current, element, view, state: editorState, from, to }) => {\n      if (!current.isEditable) return false;\n      if (!(view.hasFocus() || element.contains(document.activeElement))) return false;\n      if (editingLinkRef.current) return true;\n      const { selection } = editorState;\n      if (selection instanceof NodeSelection || current.isActive(\"codeBlock\")) return false;\n      if (selection.empty) return current.isActive(\"link\");\n      if (!formattingRef.current) return false;\n      return editorState.doc.textBetween(from, to, \" \").trim().length > 0;\n    },\n    [editingLinkRef, formattingRef]\n  );\n\n  const options = React.useMemo<BubbleMenuProps[\"options\"]>(\n    () => ({\n      // `absolute`, không `fixed` — lý do ở đầu file.\n      strategy: \"absolute\",\n      placement: \"top\",\n      offset: 8,\n      flip: true,\n      shift: { padding: 8 },\n      onHide: () => setEditingLink(false)\n    }),\n    []\n  );\n\n  if (!state) return null;\n\n  return (\n    <BubbleMenu\n      editor={editor}\n      pluginKey={pluginKey}\n      updateDelay={100}\n      shouldShow={shouldShow}\n      options={options}\n      className=\"z-50 rounded-lg border bg-popover p-1 text-popover-foreground shadow-overlay\"\n    >\n      {editingLink ? (\n        <form\n          className=\"flex flex-col gap-1\"\n          onSubmit={(event) => {\n            event.preventDefault();\n            applyLink();\n          }}\n        >\n          <div className=\"flex items-center gap-1\">\n            <input\n              ref={inputRef}\n              type=\"text\"\n              inputMode=\"url\"\n              aria-label={labels.linkInput}\n              aria-invalid={invalid || undefined}\n              placeholder={labels.linkPlaceholder}\n              value={draft}\n              onChange={(event) => {\n                setDraft(event.target.value);\n                setInvalid(false);\n              }}\n              onKeyDown={(event) => {\n                if (event.key === \"Escape\") {\n                  event.preventDefault();\n                  // Escape ở đây chỉ đóng ô liên kết — không để nó lan tới `Dialog` bao ngoài.\n                  event.stopPropagation();\n                  closeLinkEditor(true);\n                }\n              }}\n              className=\"h-7 w-60 rounded-md border border-input bg-transparent px-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-primary-ink focus:outline-none focus:ring-2 focus:ring-ring/50 aria-invalid:border-destructive-ink dark:bg-input-fill\"\n            />\n            <ToolbarButton icon={Check} label={labels.linkApply} onClick={applyLink} />\n            {state.link && <ToolbarButton icon={Link2Off} label={labels.linkRemove} onClick={removeLink} />}\n          </div>\n          {invalid && (\n            <p role=\"alert\" className=\"px-1 pb-0.5 text-xs text-destructive-ink\">\n              {labels.linkInvalid}\n            </p>\n          )}\n        </form>\n      ) : state.empty && state.link ? (\n        <div className=\"flex items-center gap-1\">\n          <a\n            href={state.href}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n            onMouseDown={(event) => event.preventDefault()}\n            className=\"flex max-w-60 items-center gap-1.5 truncate rounded-md px-1.5 py-1 text-sm text-link-ink underline-offset-4 hover:text-link-ink-hover hover:underline\"\n          >\n            <ExternalLink aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n            <span className=\"truncate\">{state.href}</span>\n            <span className=\"sr-only\">{labels.linkOpen}</span>\n          </a>\n          <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />\n          <ToolbarButton icon={Pencil} label={labels.linkEdit} keys=\"mod+k\" onClick={openLinkEditor} />\n          <ToolbarButton icon={Link2Off} label={labels.linkRemove} onClick={removeLink} />\n        </div>\n      ) : (\n        <div role=\"toolbar\" aria-label={labels.toolbar} className=\"flex items-center gap-0.5\">\n          {actionsFor(MARK_ACTIONS, format).map((action) => (\n            <ToolbarButton\n              key={action.id}\n              icon={action.icon}\n              label={labels[action.label]}\n              keys={action.keys}\n              pressed={Boolean(state.active[action.id])}\n              onClick={() => action.run(editor)}\n            />\n          ))}\n          <ToolbarButton icon={Link2} label={labels.link} keys=\"mod+k\" pressed={state.link} onClick={openLinkEditor} />\n          {!(format === \"markdown\" && state.inTable) && (\n            <div className=\"flex items-center gap-0.5 max-sm:hidden\">\n              <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />\n              {BLOCK_ACTIONS.map((action, index) => (\n                <React.Fragment key={action.id}>\n                  {(index === 3 || index === 6) && <Separator orientation=\"vertical\" className=\"mx-0.5 h-5\" />}\n                  <ToolbarButton\n                    icon={action.icon}\n                    label={labels[action.label]}\n                    keys={action.keys}\n                    pressed={Boolean(state.active[action.id])}\n                    onClick={() => action.run(editor)}\n                  />\n                </React.Fragment>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </BubbleMenu>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/editor/editor-core.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { g as EditorBaseProps, f as EditorFormat, a as EditorToolbarMode, E as EditorHandleBase } from '../editor-types-BMST7-VR.js';
+import '@tiptap/core';
+import './markdown-editor-constants.js';
+
+/** Handle chung, đọc/ghi theo định dạng của trình soạn — mỗi lớp ngoài đặt tên lại cho cặp này. */
+interface EditorCoreHandle extends EditorHandleBase {
+    getValue: () => string;
+    setValue: (value: string) => void;
+}
+interface EditorCoreProps<THandle> extends EditorBaseProps {
+    format: EditorFormat;
+    toolbar: EditorToolbarMode;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    /** `data-slot` của khung ngoài — mỗi trình soạn một tên, để CSS/test của app nhắm đúng. */
+    slot: string;
+    handleRef?: React.Ref<THandle>;
+    /**
+     * Dựng handle công khai từ handle chung. Hàm ở cấp MODULE (định danh ổn định), và KHÔNG trải `core`
+     * ra (`{ ...core }`): trải là đọc getter `editor` đúng một lần — lúc nó còn `null`.
+     */
+    createHandle: (core: EditorCoreHandle) => THandle;
+}
+declare function EditorCore<THandle>({ format, toolbar, value, defaultValue, onChange, onSubmit, onFocus, onBlur, placeholder, editable, autoFocus, variant, mentions, onImageUpload, onImageUploadError, resolveImageSrc, extensions: extraExtensions, labels: labelsProp, name, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, className, contentClassName, slot, handleRef, createHandle }: EditorCoreProps<THandle>): React.JSX.Element;
+
+export { EditorCore, type EditorCoreHandle, type EditorCoreProps };