@portone/docx-editor 0.1.0

package/dist/schema/index.d.ts

@@ -0,0 +1,2 @@
+export { docxSchema, isPageBreak } from "./docxSchema";
+export { imageNodeSpec, runMarkSpec } from "./rendering";

package/dist/schema/index.js

@@ -0,0 +1,9 @@
+// src/schema/index.ts
+import { docxSchema, isPageBreak } from "./docxSchema.js";
+import { imageNodeSpec, runMarkSpec } from "./rendering.js";
+export {
+  docxSchema,
+  imageNodeSpec,
+  isPageBreak,
+  runMarkSpec
+};

package/dist/schema/locks.d.ts

@@ -0,0 +1,112 @@
+/**
+ * Evaluates OOXML content and deletion locks for inline controls and whole table cells. Commands
+ * query these predicates before editing; `editor/plugins/lockedContent` enforces them at runtime.
+ */
+import type { Mark, Node as PMNode } from "prosemirror-model";
+import { PluginKey, type Selection, type Transaction } from "prosemirror-state";
+/**
+ * The pass that lets a transaction through the guard, which is how a lock can be lifted at all.
+ * A plugin key is used as the name so that it cannot collide with a consumer's own metadata.
+ */
+export declare const unlockAllowed: PluginKey<boolean>;
+/**
+ * The pass an undo or a redo carries (`editor/commands/historyCommands`).
+ *
+ * Every step the history replays is the reverse of a step that passed the guard when it was made,
+ * so replaying one leads back to a state that was allowed and nothing else. Without the pass the
+ * reverse of a lock - a step across the very stretch that lock shut - would be refused, and the
+ * refusal would take the whole history behind it down as well.
+ */
+export declare const historyReplay: PluginKey<boolean>;
+interface StepRange {
+    from: number;
+    to: number;
+}
+/**
+ * The control shutting the contents this inline node is part of. Null when it sits in no control,
+ * or in one whose contents stand open, a control locked against deletion alone included.
+ */
+export declare function lockedMarkOf(node: PMNode | null | undefined): Mark | null;
+/** Whether the control around this cell shuts its contents (`sdtContentsLocked` in `schema`) */
+export declare function isLockedCell(node: PMNode | null | undefined): boolean;
+/**
+ * Whether this node carries a lock of either clause, an inline one wearing a control's mark and a
+ * wrapped cell alike.
+ * This is the question about the document holding a lock at all rather than about editing a spot,
+ * so a control locked against deletion alone counts (`editor/commands/lockCommands`).
+ */
+export declare function carriesLock(node: PMNode): boolean;
+/** A textblock a judgement or an edit runs through, and where its content begins */
+export interface Textblock {
+    node: PMNode;
+    start: number;
+}
+/** One content control inside a textblock, as the one whole stretch it covers */
+export interface ControlSpan extends StepRange {
+    mark: Mark;
+}
+/**
+ * Every control in this textblock, locked or open, each as the one whole stretch it covers.
+ *
+ * A control that wrapped several runs comes in as several inlines wearing the very same mark, and
+ * what a lock answers for is the control rather than the run: a stretch covering one run of a
+ * control whole still covers only a part of the control.
+ */
+export declare function controlSpans(block: Textblock): ControlSpan[];
+/**
+ * Whether what stands at this position sits inside a cell a control shuts.
+ *
+ * This is the question a paragraph edit leaves its locked paragraphs out by
+ * (`editor/paragraphEdits`), and it is deliberately not `rangeTouchesLocked` over the paragraph:
+ * a paragraph merely holding a locked control keeps its own alignment and indent.
+ */
+export declare function insideLockedCell(doc: PMNode, pos: number): boolean;
+/**
+ * Whether this stretch reaches contents a lock shuts: text inside a control that shuts its
+ * contents, or what a locked cell holds, the cell itself included.
+ *
+ * This is the question about editing what stands there rather than about taking it away, so every
+ * control the stretch meets answers with its contents clause. The lock commands and the formatting
+ * commands ask it of the stretch they are about to mark, so it is exported.
+ */
+export declare function rangeTouchesLocked(doc: PMNode, from: number, to: number): boolean;
+/**
+ * Whether something inserted at this spot would land inside a locked control or a locked cell.
+ *
+ * Only a spot with the very same control on both sides is inside one. At either edge the other
+ * side belongs to a different control or to none, and since the mark is not inclusive what goes
+ * in there falls outside the control.
+ */
+export declare function insertionInsideLocked(doc: PMNode, pos: number): boolean;
+/**
+ * Whether the guard shuts editing where this selection stands.
+ *
+ * This is the question a command that rewrites whatever is selected has to ask before it reports
+ * that it applies (`editor/insertImage`), and the one a menu offering to lift a lock is built on
+ * (`editor/commands/lockCommands`). A caret is shut by standing inside a control rather than
+ * against its edge, which is the same rule an insertion follows.
+ * A control locked against deletion alone shuts nothing here: its contents stand open, so editing
+ * where it stands goes through, and only taking the control away is refused.
+ */
+export declare function selectionShut(selection: Selection, doc: PMNode): boolean;
+/**
+ * Whether the guard would refuse putting something in place of what this selection covers, which
+ * is what an image insertion does (`editor/insertImage`).
+ *
+ * A different question from `selectionShut`: what the selection covers whole goes away rather than
+ * being edited, so the deletion clause answers for it. A control that may be taken away whole may
+ * therefore be replaced, and one locked against deletion alone may not, even though editing inside
+ * it would have gone through.
+ */
+export declare function replacementShut(selection: Selection, doc: PMNode): boolean;
+/**
+ * Whether the guard would let this transaction through, decided and nothing else.
+ *
+ * The refusal the guard itself answers with carries a side effect - the composition it ends
+ * (`editor/plugins/lockedContent`) - which a query about a button's state may not set off, so the
+ * decision stands apart from it and every caller building an edit asks this rather than handing
+ * the transaction to a state.
+ * `doc` only stands in for a step the transaction kept no document for.
+ */
+export declare function transactionAllowed(tr: Transaction, doc: PMNode): boolean;
+export {};

package/dist/schema/locks.js

@@ -0,0 +1,211 @@
+// src/schema/locks.ts
+import { PluginKey } from "prosemirror-state";
+import {
+  AddMarkStep,
+  AddNodeMarkStep,
+  AttrStep,
+  RemoveMarkStep,
+  RemoveNodeMarkStep,
+  ReplaceAroundStep,
+  ReplaceStep
+} from "prosemirror-transform";
+import { docxSchema } from "./index.js";
+var unlockAllowed = new PluginKey("docxEditorUnlockAllowed");
+var historyReplay = new PluginKey("docxEditorHistoryReplay");
+var OPEN = { contents: false, deletion: false };
+function sdtMarkOf(node) {
+  return node?.marks.find((mark) => mark.type === docxSchema.marks.sdt) ?? null;
+}
+function markLocks(mark) {
+  return {
+    contents: mark.attrs.contentsLocked === true,
+    deletion: mark.attrs.deletionLocked === true
+  };
+}
+function lockedMarkOf(node) {
+  const mark = sdtMarkOf(node);
+  return mark !== null && markLocks(mark).contents ? mark : null;
+}
+var CELL_CONTENTS_ATTR = "sdtContentsLocked";
+var CELL_DELETION_ATTR = "sdtDeletionLocked";
+function isCell(node) {
+  return node?.type.spec.tableRole === "cell";
+}
+function cellLocks(node) {
+  if (!node || !isCell(node)) return OPEN;
+  return {
+    contents: node.attrs[CELL_CONTENTS_ATTR] === true,
+    deletion: node.attrs[CELL_DELETION_ATTR] === true
+  };
+}
+function isLockedCell(node) {
+  return cellLocks(node).contents;
+}
+function carriesLock(node) {
+  const mark = node.isInline ? sdtMarkOf(node) : null;
+  const locks = mark === null ? cellLocks(node) : markLocks(mark);
+  return locks.contents || locks.deletion;
+}
+function controlSpans(block) {
+  const spans = [];
+  block.node.forEach((child, offset) => {
+    const mark = sdtMarkOf(child);
+    if (!mark) return;
+    const from = block.start + offset;
+    const to = from + child.nodeSize;
+    const last = spans.at(-1);
+    if (last && last.to === from && last.mark.eq(mark)) last.to = to;
+    else spans.push({ from, to, mark });
+  });
+  return spans;
+}
+function lockedCellContent($pos) {
+  for (let depth = $pos.depth; depth > 0; depth -= 1) {
+    const node = $pos.node(depth);
+    if (!isLockedCell(node)) continue;
+    const from = $pos.before(depth) + 1;
+    return { from, to: from + node.content.size };
+  }
+  return null;
+}
+function insideLockedCell(doc, pos) {
+  return lockedCellContent(doc.resolve(pos)) !== null;
+}
+function reachesLockedCell(doc, range) {
+  const content = lockedCellContent(doc.resolve(range.from)) ?? lockedCellContent(doc.resolve(range.to));
+  if (!content) return false;
+  if (range.from === range.to) return true;
+  return range.from < content.to && range.to > content.from;
+}
+function coversWhole(range, span) {
+  return range.from <= span.from && range.to >= span.to;
+}
+function overlaps(range, span) {
+  return range.from < span.to && range.to > span.from;
+}
+function shuts(locks, range, span) {
+  return range.takesAway && coversWhole(range, span) ? locks.deletion : locks.contents && overlaps(range, span);
+}
+function rangeShut(doc, range) {
+  if (reachesLockedCell(doc, range)) return true;
+  let shut = false;
+  doc.nodesBetween(range.from, range.to, (node, pos) => {
+    if (shut) return false;
+    if (isCell(node)) {
+      const locks = cellLocks(node);
+      if (coversWhole(range, { from: pos, to: pos + node.nodeSize })) {
+        if (range.takesAway ? locks.deletion : locks.contents) shut = true;
+      }
+      return !shut;
+    }
+    if (!node.isTextblock) return true;
+    shut ||= controlSpans({ node, start: pos + 1 }).some(
+      (span) => shuts(markLocks(span.mark), range, span)
+    );
+    return false;
+  });
+  return shut;
+}
+function rangeTouchesLocked(doc, from, to) {
+  return rangeShut(doc, { from, to, takesAway: false });
+}
+function insertionInsideLocked(doc, pos) {
+  const $pos = doc.resolve(pos);
+  if (lockedCellContent($pos)) return true;
+  const before = lockedMarkOf($pos.nodeBefore);
+  const after = lockedMarkOf($pos.nodeAfter);
+  return before !== null && after !== null && before.eq(after);
+}
+function selectionShut(selection, doc) {
+  return selection.ranges.some(
+    (range) => range.$from.pos === range.$to.pos ? insertionInsideLocked(doc, range.$from.pos) : rangeTouchesLocked(doc, range.$from.pos, range.$to.pos)
+  );
+}
+function replacementShut(selection, doc) {
+  return selection.ranges.some((range) => {
+    const from = range.$from.pos;
+    const to = range.$to.pos;
+    return from === to ? insertionInsideLocked(doc, from) : rangeShut(doc, { from, to, takesAway: true });
+  });
+}
+function editedRanges(step) {
+  if (step instanceof ReplaceAroundStep) {
+    return [
+      { from: step.from, to: step.gapFrom, takesAway: true },
+      { from: step.gapTo, to: step.to, takesAway: true }
+    ];
+  }
+  if (step instanceof ReplaceStep) {
+    return [{ from: step.from, to: step.to, takesAway: true }];
+  }
+  if (step instanceof AddMarkStep || step instanceof RemoveMarkStep) {
+    return [{ from: step.from, to: step.to, takesAway: false }];
+  }
+  return null;
+}
+function rangeAllowed(doc, range) {
+  return range.from < range.to ? !rangeShut(doc, range) : !insertionInsideLocked(doc, range.from);
+}
+function plantedLock(node) {
+  if (node.isInline) return lockedMarkOf(node) !== null;
+  return isLockedCell(node) && node.content.size > 0;
+}
+function lockedInside(content) {
+  let found = false;
+  content.descendants((node) => {
+    if (found) return false;
+    if (plantedLock(node)) found = true;
+    return !found;
+  });
+  return found;
+}
+function plantsLocked(step) {
+  const carried = step instanceof ReplaceStep || step instanceof ReplaceAroundStep ? step.slice.content : null;
+  return carried !== null && lockedInside(carried);
+}
+function clearsCellLock(step, doc) {
+  if (step instanceof AttrStep) {
+    if (step.value === true) return false;
+    const locks = cellLocks(doc.nodeAt(step.pos));
+    if (step.attr === CELL_CONTENTS_ATTR) return locks.contents;
+    if (step.attr === CELL_DELETION_ATTR) return locks.deletion;
+    return false;
+  }
+  if (!(step instanceof ReplaceAroundStep)) return false;
+  const was = cellLocks(doc.nodeAt(step.from));
+  const now = cellLocks(step.slice.content.firstChild);
+  return was.contents && !now.contents || was.deletion && !now.deletion;
+}
+function stepAllowed(step, doc) {
+  if (plantsLocked(step) || clearsCellLock(step, doc)) return false;
+  const ranges = editedRanges(step);
+  if (ranges) return ranges.every((range) => rangeAllowed(doc, range));
+  if (step instanceof AttrStep || step instanceof AddNodeMarkStep || step instanceof RemoveNodeMarkStep) {
+    return lockedCellContent(doc.resolve(step.pos)) === null && lockedMarkOf(doc.nodeAt(step.pos)) === null;
+  }
+  return true;
+}
+function carriesPass(tr) {
+  return tr.getMeta(unlockAllowed) === true || tr.getMeta(historyReplay) === true;
+}
+function transactionAllowed(tr, doc) {
+  if (!tr.docChanged) return true;
+  if (carriesPass(tr)) return true;
+  return tr.steps.every(
+    (step, index) => stepAllowed(step, tr.docs[index] ?? doc)
+  );
+}
+export {
+  carriesLock,
+  controlSpans,
+  historyReplay,
+  insertionInsideLocked,
+  insideLockedCell,
+  isLockedCell,
+  lockedMarkOf,
+  rangeTouchesLocked,
+  replacementShut,
+  selectionShut,
+  transactionAllowed,
+  unlockAllowed
+};

package/dist/schema/rendering.d.ts

@@ -0,0 +1,6 @@
+import type { Attrs, DOMOutputSpec } from "prosemirror-model";
+import type { FontFallbacks } from "../styles/fontStack";
+/** The DOM representation shared by the schema and the editor's custom run mark view. */
+export declare function runMarkSpec(attrs: Attrs, fontFallbacks: FontFallbacks): DOMOutputSpec;
+/** The image element shared by the schema and the resizable image node view. */
+export declare function imageNodeSpec(attrs: Attrs): DOMOutputSpec;

package/dist/schema/rendering.js

@@ -0,0 +1,46 @@
+// src/schema/rendering.ts
+import { toRunFormat } from "../model/format.js";
+import { emuToPx, toImageExtent, toImageSrc } from "../ooxml/image.js";
+import { editorClassNames } from "../styles/classNames.js";
+import { runStyle } from "../styles/inlineStyle.js";
+function text(value) {
+  return typeof value === "string" ? value : void 0;
+}
+function formatJson(format) {
+  return format ? JSON.stringify(format) : void 0;
+}
+function runMarkSpec(attrs, fontFallbacks) {
+  const format = toRunFormat(attrs.format);
+  return [
+    "span",
+    {
+      class: editorClassNames.run,
+      style: runStyle(format, fontFallbacks),
+      // Which shape of a Han character the browser draws is decided by this and nothing else
+      lang: format?.lang,
+      "data-rattrs": text(attrs.rAttrs),
+      "data-rpr": text(attrs.rPr),
+      "data-fmt": formatJson(format)
+    },
+    0
+  ];
+}
+function imageNodeSpec(attrs) {
+  const extent = toImageExtent(attrs.extent);
+  return [
+    "img",
+    {
+      class: editorClassNames.image,
+      src: toImageSrc(attrs.src) ?? void 0,
+      alt: text(attrs.alt) ?? "",
+      width: extent ? `${Math.round(emuToPx(extent.cx))}` : void 0,
+      height: extent ? `${Math.round(emuToPx(extent.cy))}` : void 0,
+      "data-extent": formatJson(extent),
+      "data-xml": text(attrs.xml)
+    }
+  ];
+}
+export {
+  imageNodeSpec,
+  runMarkSpec
+};

package/dist/styles/classNames.d.ts

@@ -0,0 +1,214 @@
+/**
+ * The CSS class and variable names attached to the UI.
+ *
+ * They are built only here, so that renaming the package means changing a single
+ * prefix line.
+ * `editor.css` uses the same prefix, so change it along with this file.
+ */
+export declare const editorClassNames: {
+    /** The outermost box holding both the toolbar and the paper */
+    readonly frame: "docx-editor-frame";
+    /** The box that owns the scrolling */
+    readonly root: "docx-editor-editor";
+    /** The paper the text sits on (contenteditable) */
+    readonly sheet: "docx-editor-sheet";
+    readonly paragraph: "docx-editor-p";
+    readonly run: "docx-editor-run";
+    readonly tab: "docx-editor-tab";
+    /** The independently measurable DOM range around one tab character. */
+    readonly tabSlot: "docx-editor-tab-slot";
+    /** The caret drawn at an unambiguous edge of a laid-out tab. */
+    readonly tabCaret: "docx-editor-tab-caret";
+    /** Attached to the contenteditable while its native caret is replaced. */
+    readonly tabCaretActive: "docx-editor-tab-caret-active";
+    /** An inline image (`w:drawing` holding a picture) */
+    readonly image: "docx-editor-img";
+    /** The box the image sits in, which is also what the resize handles stand in */
+    readonly imageBox: "docx-editor-img-box";
+    /** Attached to that box while the image is the selection */
+    readonly imageSelected: "docx-editor-img-selected";
+    /** One of the four corner handles a selected image is resized by */
+    readonly imageHandle: "docx-editor-img-handle";
+    readonly table: "docx-editor-tbl";
+    readonly tableRow: "docx-editor-tr";
+    readonly tableCell: "docx-editor-tc";
+    /** Attached alongside it when the control around the cell says the cell may not be edited */
+    readonly cellLocked: "docx-editor-tc-locked";
+    /** A stretch of text sitting inside a content control (`w:sdt`) */
+    readonly sdt: "docx-editor-sdt";
+    /** Attached alongside it when the control says its contents may not be edited */
+    readonly sdtLocked: "docx-editor-sdt-locked";
+    /** A stretch of text inside a hyperlink (`w:hyperlink`) */
+    readonly link: "docx-editor-link";
+    /** A stretch of text carrying a comment anchor */
+    readonly commentRange: "docx-editor-comment-range";
+    /** An invisible OOXML comment marker inside the editable text flow */
+    readonly commentMarker: "docx-editor-comment-marker";
+    /** A superscript footnote or endnote reference */
+    readonly noteReference: "docx-editor-note-reference";
+    /** An invisible bookmark marker that occurs between body blocks */
+    readonly bookmarkBlock: "docx-editor-bookmark-block";
+    readonly rawInline: "docx-editor-raw-inline";
+    readonly rawBlock: "docx-editor-raw-block";
+    /** A preserved block that carries the original XML directly (inside a table cell, and so on) */
+    readonly rawXmlBlock: "docx-editor-raw-xml";
+    readonly tablePlaceholder: "docx-editor-table";
+    /** The box holding both the paper and the marks overlaid on it */
+    readonly pageLayer: "docx-editor-page-layer";
+    /** All of the page marks drawn over the paper */
+    readonly pageGuides: "docx-editor-page-guides";
+    /** The band that covers the space between one page and the next */
+    readonly pageSplit: "docx-editor-page-split";
+    /** The line drawn where a block that cannot be pushed down crosses a page */
+    readonly pageCrossed: "docx-editor-page-crossed";
+    /** The page number laid on the top corner of a page */
+    readonly pageBadge: "docx-editor-page-badge";
+    /** A first-section header story projected into a visual page margin */
+    readonly pageHeader: "docx-editor-page-header";
+    /** A first-section footer story projected into a visual page margin */
+    readonly pageFooter: "docx-editor-page-footer";
+    /** The mark that changes the cursor while it is over a column boundary or while a boundary is being dragged. Attached to the sheet */
+    readonly columnResize: "docx-editor-col-resize";
+    /** The vertical line that shows where the boundary stands while it is being dragged */
+    readonly columnResizeGuide: "docx-editor-col-guide";
+    readonly rowResize: "docx-editor-row-resize";
+    readonly rowResizeGuide: "docx-editor-row-guide";
+    readonly toolbar: "docx-editor-toolbar";
+    /** A bundle of buttons set off by a single separator */
+    readonly toolbarGroup: "docx-editor-toolbar-group";
+    readonly toolbarSeparator: "docx-editor-toolbar-sep";
+    readonly toolbarButton: "docx-editor-toolbar-btn";
+    readonly toolbarColorIcon: "docx-editor-toolbar-color-icon";
+    readonly toolbarColorIndicator: "docx-editor-toolbar-color-indicator";
+    readonly toolbarSelect: "docx-editor-toolbar-select";
+    readonly fontFamilySelect: "docx-editor-font-family-select";
+    readonly zoomSelect: "docx-editor-zoom-select";
+    /** The box wrapped around a control that cannot draw its own tooltip (a native `select`) */
+    readonly tooltipWrapper: "docx-editor-tooltip-wrap";
+    /** The box around the button a panel opens from. A click inside it counts as a click on the panel */
+    readonly popoverBox: "docx-editor-popover-box";
+    /** The small panel that opens below a button, floated against the screen */
+    readonly popover: "docx-editor-popover";
+    /** The grid for picking a table size */
+    readonly sizeGrid: "docx-editor-size-grid";
+    readonly sizeGridRow: "docx-editor-size-row";
+    readonly sizeGridCell: "docx-editor-size-cell";
+    readonly sizeGridLabel: "docx-editor-size-label";
+    readonly colorPicker: "docx-editor-color-picker";
+    /** The text color palette. A grid of rows, so the markup says what the layout shows */
+    readonly colorGrid: "docx-editor-color-grid";
+    /** One row of the palette. Ten swatches of a family, light to dark */
+    readonly colorRow: "docx-editor-color-row";
+    /** The row at the head of the palette holding the entry that withdraws the color */
+    readonly colorClearRow: "docx-editor-color-clear-row";
+    readonly swatch: "docx-editor-swatch";
+    readonly colorCustom: "docx-editor-color-custom";
+    readonly colorNativeInput: "docx-editor-color-native-input";
+    readonly colorHexInput: "docx-editor-color-hex-input";
+    readonly colorApply: "docx-editor-color-apply";
+    /** The table menu opened with the right button, and the choice menus inside the toolbar panels */
+    readonly menu: "docx-editor-menu";
+    /** A menu of choices inside a toolbar panel, where one of them is the current one */
+    readonly menuList: "docx-editor-menu-list";
+    readonly menuItem: "docx-editor-menu-item";
+    /** The slot at the head of a menu row where the check mark of the current choice goes */
+    readonly menuCheck: "docx-editor-menu-check";
+    /** The keyboard shortcut written on the right of a menu row */
+    readonly menuHint: "docx-editor-menu-hint";
+    readonly menuSeparator: "docx-editor-menu-sep";
+    /** The panel that reads and writes a link's address, floated over the selection */
+    readonly linkPanel: "docx-editor-link-panel";
+    /** The field the address is typed into */
+    readonly linkAddress: "docx-editor-link-address";
+    /** The row of buttons under it */
+    readonly linkPanelRow: "docx-editor-link-row";
+    readonly linkPanelIcon: "docx-editor-link-icon";
+    /** A button of that panel, and of the card below, which offer the same actions */
+    /** The card that says where the link under the cursor points, floated under the link's first line */
+    readonly linkCard: "docx-editor-link-card";
+    /** The address it shows, cut off with an ellipsis where it is longer than the card */
+    readonly linkCardAddress: "docx-editor-link-card-address";
+    /** What it says in place of an address for a link that names a place in the document */
+    readonly linkCardNote: "docx-editor-link-card-note";
+    /** The document and its comment rail, laid out side by side */
+    readonly workspace: "docx-editor-workspace";
+    readonly commentsPanel: "docx-editor-comments";
+    readonly commentsToggle: "docx-editor-comments-toggle";
+    readonly commentsHeading: "docx-editor-comments-heading";
+    readonly commentsCanvas: "docx-editor-comments-canvas";
+    readonly commentsEmpty: "docx-editor-comments-empty";
+    readonly commentPosition: "docx-editor-comment-position";
+    readonly commentCard: "docx-editor-comment-card";
+    readonly commentHeader: "docx-editor-comment-header";
+    readonly commentReply: "docx-editor-comment-reply";
+    readonly commentMeta: "docx-editor-comment-meta";
+    readonly commentAuthor: "docx-editor-comment-author";
+    readonly commentDate: "docx-editor-comment-date";
+    readonly commentBody: "docx-editor-comment-body";
+    readonly commentActions: "docx-editor-comment-actions";
+    readonly commentPrimaryAction: "docx-editor-comment-primary-action";
+    readonly commentIconActions: "docx-editor-comment-icon-actions";
+    readonly commentComposer: "docx-editor-comment-composer";
+    readonly commentInput: "docx-editor-comment-input";
+    readonly notesPanel: "docx-editor-notes";
+    readonly notesHeading: "docx-editor-notes-heading";
+    readonly notesList: "docx-editor-notes-list";
+    readonly noteLabel: "docx-editor-note-label";
+    readonly noteBody: "docx-editor-note-body";
+    /** The panel drawn in place of the editor when a document was refused and the consumer wrote no panel of its own */
+    readonly rejection: "docx-editor-rejection";
+    readonly rejectionTitle: "docx-editor-rejection-title";
+};
+export declare const editorCssVariables: {
+    readonly fontSize: "--docx-editor-font-size";
+    readonly fontFamily: "--docx-editor-font-family";
+    readonly lineHeight: "--docx-editor-line-height";
+    /** The hanging indent width the list marker sits in */
+    readonly markerWidth: "--docx-editor-marker-width";
+    /** The width calculated for a tab using custom paragraph stops. */
+    readonly tabWidth: "--docx-editor-tab-width";
+    /** The paper height, grown to match the page count */
+    readonly sheetHeight: "--docx-editor-sheet-height";
+    /** The paper the open document names, and the margins printed inside it */
+    readonly pageWidth: "--docx-editor-page-width";
+    readonly pageHeight: "--docx-editor-page-height";
+    readonly pageMarginTop: "--docx-editor-page-margin-top";
+    readonly pageMarginRight: "--docx-editor-page-margin-right";
+    readonly pageMarginBottom: "--docx-editor-page-margin-bottom";
+    readonly pageMarginLeft: "--docx-editor-page-margin-left";
+};
+/**
+ * The attributes that carry marks which exist only on screen.
+ * A list marker is a decoration rather than part of the document model, so CSS
+ * draws it from this attribute alone.
+ * The boundary guides use these attributes to find the places that ask for a page
+ * break.
+ */
+export declare const editorAttributes: {
+    readonly listMarker: "data-marker";
+    /** A new page starts at this paragraph */
+    readonly pageBreakBefore: "data-page-break";
+    /** The kind of line break. `page` when the break splits the page */
+    readonly breakType: "data-break";
+    /** Which corner of the image a resize handle stands at (`nw`, `ne`, `sw`, `se`) */
+    readonly imageCorner: "data-corner";
+    /** The extra height opened up to push content down to the top of the next page */
+    readonly pagePush: "data-page-push";
+    /** The space opened up at a page break, so what follows the break starts the next page */
+    readonly pageBreakSpace: "data-page-space";
+    /** A display-only table row that fills the remainder between page bodies */
+    readonly tablePageSpace: "data-table-page-space";
+    /** A display-only copy of a table header row on a continued page */
+    readonly tableRepeatedHeader: "data-table-repeated-header";
+    /**
+     * The tooltip a control shows on hover, drawn by the CSS straight from this attribute.
+     * It is the one mark here whose selector is the attribute on its own rather than a
+     * class of ours, so it carries the prefix and cannot collide with the host app.
+     */
+    readonly tooltip: "data-docx-editor-tooltip";
+    /**
+     * Put on the box the tooltips are drawn inside while they are hushed, which is what Escape
+     * does to the one standing in the way (`ui/Tooltip.tsx`).
+     */
+    readonly tooltipsHushed: "data-docx-editor-tooltips-off";
+};