@arbidocs/blocks 0.4.97 → 0.4.99

package/dist/{chunk-QIEEFBZ5.js → chunk-4ZTIMQ7Z.js}

@@ -6,9 +6,10 @@ import { collectReviewItems, revisionItemsOf } from '@docx-editor.dev/core/store
 import React3, { createContext, useContext, useState, useRef, useCallback, useEffect, useLayoutEffect, useMemo } from 'react';
 import { useDocxEditor, ReviewRailContext, useEditorSnapshot, useChromeTranslate, DocxEditor, createFontSource, useParagraphStyle, useEditorCommand } from '@docx-editor.dev/react';
 import { AiMarkdown, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Button, DialogFooter, cn, splitMarkdownBlocks } from '@arbidocs/react/ui';
-import { MessageSquarePlus, MessageSquare, PencilLine, ChevronLeft, ChevronRight, X, ChevronUp, ChevronDown, CheckCheck, RotateCcw, CircleCheck, Trash2, Check, SendHorizontal, Type, Ellipsis, RefreshCw, WifiOff, Download, Save, BookA, ListRestart, Superscript, NotebookText } from 'lucide-react';
+import { MessageSquarePlus, MessageSquare, PencilLine, ChevronLeft, ChevronRight, X, ChevronUp, ChevronDown, CheckCheck, RotateCcw, CircleCheck, Trash2, Check, SendHorizontal, Type, Ellipsis, RefreshCw, WifiOff, Download, Save, BookA, ListRestart, Blocks, Superscript, NotebookText } from 'lucide-react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
+import { defaultLegalTemplate, listBuildingBlocks, attachedTemplateOf, linkedLevelStyles, styleDivergence, buildingBlockFragment, fragmentClipboardHtml, trackInsertion, newFromTemplate } from '@arbidocs/coedit/template';
 import { renderToStaticMarkup } from 'react-dom/server';
 import * as Y from 'yjs';
 import { DOCUMENT_COLLABORATION_VERSIONS, collaborationModule } from '@arbidocs/coedit';
@@ -1259,8 +1260,6 @@ function DocxMentions({
     }
   ) });
 }
-
-// src/docx/definitions/fragment.ts
 var DEFINED_TERM_STYLE = "DefinedTerm";
 var FRAGMENT_STYLES = stylesXml(
   "",
@@ -1293,12 +1292,13 @@ function base64(bytes) {
     binary += String.fromCharCode(...bytes.subarray(i, i + 32768));
   return btoa(binary);
 }
-function fragmentHtml(body, covered2) {
-  const bytes = docxPackage({
+function fragmentHtml(body, covered2, revision) {
+  const untracked = docxPackage({
     document: documentXml(body),
     styles: FRAGMENT_STYLES,
     title: "Defined terms"
   });
+  const bytes = revision ? trackInsertion(untracked, revision, covered2) : untracked;
   return `<div data-docx-fragment="${base64(bytes)}" data-docx-fragment-end="${covered2 ? "covered" : "open"}"></div>`;
 }
 
@@ -1555,7 +1555,7 @@ function readParagraph(node, topLevel, bookmarks) {
     links
   };
 }
-function editorPort(editor) {
+function editorPort(editor, revision) {
   const surface = () => {
     const s = editor.surface;
     if (!s) throw new Error("The document is not open.");
@@ -1574,7 +1574,7 @@ function editorPort(editor) {
       surface().setSelection({ anchor: from, head: to });
       surface().deleteSelection();
     },
-    paste: (body, text, covered2) => editor.exec({ type: "paste", text, html: fragmentHtml(body, covered2) }).ok,
+    paste: (body, text, covered2) => editor.exec({ type: "paste", text, html: fragmentHtml(body, covered2, revision) }).ok,
     splitParagraph: () => surface().splitParagraph()
   };
 }
@@ -1617,6 +1617,70 @@ function holdCaret(editor, timeoutMs = 5e3) {
   const offSelection = editor.on("selectionChange", restore);
   const timer = setTimeout(stop, timeoutMs);
 }
+
+// src/docx/structural/trackedOrNoted.ts
+var revisionDate = (at = /* @__PURE__ */ new Date()) => at.toISOString().replace(/\.\d{3}Z$/, "Z");
+function trackedOrNoted(port, { label, author, insert, inserted = Boolean }) {
+  const mode = port.mode();
+  if (mode === "viewing") throw new Error("This document is read only.");
+  if (mode !== "suggesting") return { result: insert(null), how: "direct" };
+  const revision = { author, date: revisionDate() };
+  const before = port.caret();
+  const tracked = port.trackedBy(revision);
+  port.setMode("editing");
+  let result;
+  try {
+    result = insert(revision);
+  } finally {
+    port.setMode("suggesting");
+  }
+  if (!inserted(result) || port.trackedBy(revision) > tracked)
+    return { result, how: inserted(result) ? "tracked" : "direct" };
+  const after = port.caret();
+  if (before && after && port.comment(before, after, label)) return { result, how: "noted" };
+  return { result, how: "direct" };
+}
+var attr2 = (node, name) => node.attributes?.find((a) => a.localName === name)?.value;
+function structuralPort(editor) {
+  return {
+    mode: () => editor.getEditingMode(),
+    setMode: (mode) => void editor.setEditingMode(mode),
+    caret: () => {
+      const head = editor.surface?.state().selection?.head;
+      return head ? { paragraphId: head.paragraphId, offset: head.offset } : null;
+    },
+    // Read from the story's tree: the review pane merges adjacent insertions by one author into
+    // one card, so a card's date need not be this insert's.
+    trackedBy: ({ author, date }) => {
+      const root = editor.surface?.session.part().root;
+      let count = 0;
+      const visit = (node) => {
+        if (node.localName === "ins" && attr2(node, "author") === author && attr2(node, "date") === date)
+          count++;
+        node.children?.forEach(visit);
+      };
+      if (root) visit(root);
+      return count;
+    },
+    comment: (from, to, text) => {
+      const surface = editor.surface;
+      if (!surface) return false;
+      surface.setSelection({ anchor: from, head: to });
+      const ok2 = editor.addComment(text).ok;
+      surface.setSelection({ anchor: to, head: to });
+      return ok2;
+    }
+  };
+}
+var DocxAuthorContext = createContext("You");
+function useTrackedOrNoted() {
+  const editor = useDocxEditor();
+  const author = useContext(DocxAuthorContext);
+  return useCallback(
+    (spec) => editor ? trackedOrNoted(structuralPort(editor), { ...spec, author }) : void 0,
+    [editor, author]
+  );
+}
 var DEFINED_TERM_TRIGGER = "@@";
 var TRIGGER_QUERY = /(?:^|[\s([{"“‘'])@@([^@\n\t]{0,40})$/;
 var MAX_GROUPS = 8;
@@ -1660,6 +1724,7 @@ function DefinedTermsProvider({
   labels
 }) {
   const editor = useDocxEditor();
+  const track = useTrackedOrNoted();
   const l = useMemo(() => ({ ...DEFAULT_DEFINED_TERMS_LABELS, ...labels }), [labels]);
   const [sources, setSources] = useState(null);
   const loadedAt = useRef(0);
@@ -1716,35 +1781,46 @@ function DefinedTermsProvider({
   refreshRef.current = refresh;
   const firstHover = useCallback(() => void refreshRef.current(), []);
   const caretRect = () => container().querySelector(".docx-editor-one-surface__caret")?.getBoundingClientRect();
-  const run = useCallback(
+  const attempt = useCallback(
     (fn) => {
-      if (!editor) return void 0;
       try {
-        return withDirectEditing(editor, fn);
+        return fn();
       } catch (error) {
         notify?.(error instanceof Error ? error.message : "Could not change the document.", "error");
         return void 0;
       }
     },
-    [editor, notify]
+    [notify]
+  );
+  const run = useCallback(
+    (fn) => editor ? attempt(() => withDirectEditing(editor, fn)) : void 0,
+    [editor, attempt]
   );
   const pick = useCallback(
     (row) => {
       if (!editor || !picker || !row) return;
       const port = editorPort(editor);
-      const result = run(() => {
+      const placed = run(() => {
         if (picker.mode === "search" && picker.caret) port.setCaret(picker.caret);
-        return insertDefinedTerm(port, row.definition, {
-          replace: picker.mode === "typing" ? DEFINED_TERM_TRIGGER.length + picker.query.length : 0
-        });
+        const caret = port.caret();
+        if (!caret) throw new Error("Place the cursor where the term should go.");
+        const typed = picker.mode === "typing" ? DEFINED_TERM_TRIGGER.length + picker.query.length : 0;
+        if (typed) port.deleteRange({ ...caret, offset: Math.max(0, caret.offset - typed) }, caret);
+        return true;
       });
+      const result = placed ? attempt(
+        () => track({
+          label: `Inserted defined term: ${row.definition.term}`,
+          insert: (revision) => insertDefinedTerm(editorPort(editor, revision), row.definition)
+        })?.result
+      ) : void 0;
       setPicker(null);
       editor.surface?.focus();
       if (result) holdCaret(editor);
       if (result?.addedDefinition)
         notify?.(`\u201C${row.definition.term}\u201D added to the Definitions section.`, "success");
     },
-    [editor, picker, run, notify]
+    [editor, picker, run, attempt, track, notify]
   );
   const openPicker = useCallback(
     (anchor) => {
@@ -2122,6 +2198,138 @@ function DefinedTermHover({
     document.body
   );
 }
+var BUILTIN_TEMPLATE_NAME = "ARBI legal template";
+var templateFileName = (t) => /\.(dotx|dotm|docx|docm)$/i.test(t.name) ? t.name : `${t.name}.dotx`;
+var builtin;
+function builtinHouseTemplate() {
+  builtin ??= { bytes: defaultLegalTemplate(), name: BUILTIN_TEMPLATE_NAME, source: "builtin" };
+  return builtin;
+}
+async function resolveHouseTemplate(host) {
+  if (!host) return builtinHouseTemplate();
+  try {
+    return await host.load();
+  } catch {
+    return builtinHouseTemplate();
+  }
+}
+var HouseTemplateContext = createContext(null);
+var useHouseTemplate = () => useContext(HouseTemplateContext);
+function HouseTemplateProvider({
+  host,
+  documentId,
+  editable,
+  notify,
+  enabled = true,
+  children
+}) {
+  const editor = useDocxEditor();
+  const track = useTrackedOrNoted();
+  const [template, setTemplate] = useState(builtinHouseTemplate);
+  const [divergence, setDivergence] = useState(null);
+  const [basedOnTemplate, setBasedOnTemplate] = useState(false);
+  const [levels, setLevels] = useState({});
+  const [generation, setGeneration] = useState(0);
+  useEffect(() => {
+    let live = true;
+    void resolveHouseTemplate(host).then((t) => live && setTemplate(t));
+    return () => {
+      live = false;
+    };
+  }, [host]);
+  const blocks = useMemo(() => {
+    try {
+      return listBuildingBlocks(template.bytes);
+    } catch {
+      return [];
+    }
+  }, [template]);
+  useEffect(() => {
+    if (!editor || !enabled) return;
+    let live = true;
+    void editor.save().then((saved) => {
+      if (!live || !saved) return;
+      const bytes = new Uint8Array(saved);
+      setBasedOnTemplate(attachedTemplateOf(bytes) === templateFileName(template));
+      setLevels(linkedLevelStyles(bytes));
+      setDivergence(styleDivergence(bytes, template.bytes));
+    }).catch(() => live && setDivergence(null));
+    return () => {
+      live = false;
+    };
+  }, [editor, template, generation, enabled]);
+  const refresh = useCallback(() => setGeneration((g) => g + 1), []);
+  const insertBlock = useCallback(
+    (name) => {
+      if (!editor || !editable) return false;
+      const fragment = buildingBlockFragment(template.bytes, name);
+      if (!fragment) return false;
+      try {
+        const result = track({
+          label: `Inserted Quick Part: ${name}`,
+          insert: (revision) => editor.exec({
+            type: "paste",
+            text: "",
+            html: fragmentClipboardHtml(
+              revision ? trackInsertion(fragment, revision, true) : fragment
+            )
+          }),
+          inserted: (r) => r.ok
+        })?.result;
+        if (!result?.ok) throw new Error(result?.reason ?? "The block could not be inserted here.");
+        refresh();
+        return true;
+      } catch (failure) {
+        notify?.(
+          failure instanceof Error ? failure.message : "Could not insert the block.",
+          "error"
+        );
+        return false;
+      }
+    },
+    [editor, editable, template, notify, refresh, track]
+  );
+  const setAsHouseTemplate = useMemo(
+    () => host?.setFromDocument && documentId ? async () => {
+      try {
+        await host.setFromDocument(documentId);
+        setTemplate(await resolveHouseTemplate(host));
+        notify?.("This document is now the house template for new documents.", "success");
+      } catch (failure) {
+        notify?.(
+          failure instanceof Error ? failure.message : "Could not set the house template.",
+          "error"
+        );
+      }
+    } : void 0,
+    [host, documentId, notify]
+  );
+  const value = useMemo(
+    () => ({
+      template,
+      blocks,
+      divergence,
+      basedOnTemplate,
+      levels,
+      insertBlock,
+      refresh,
+      setAsHouseTemplate,
+      editable
+    }),
+    [
+      template,
+      blocks,
+      divergence,
+      basedOnTemplate,
+      levels,
+      insertBlock,
+      refresh,
+      setAsHouseTemplate,
+      editable
+    ]
+  );
+  return /* @__PURE__ */ jsx(HouseTemplateContext.Provider, { value: enabled ? value : null, children });
+}
 function wordDraftHtml(markdown) {
   const template = document.createElement("template");
   template.innerHTML = renderToStaticMarkup(/* @__PURE__ */ jsx(AiMarkdown, { children: markdown }));
@@ -2214,7 +2422,8 @@ function RibbonMenu({
   icon,
   children,
   className,
-  testId
+  testId,
+  title
 }) {
   const [open, setOpen] = useState(false);
   const element = useRef(null);
@@ -2240,7 +2449,7 @@ function RibbonMenu({
         type: "button",
         className: ["native-docx-ribbon-trigger", className].filter(Boolean).join(" "),
         "aria-label": label,
-        title: label,
+        title: title ?? label,
         "aria-expanded": open,
         "data-testid": testId,
         onMouseDown: (event) => event.preventDefault(),
@@ -2297,6 +2506,17 @@ function wordShortcut(event) {
   if (event.shiftKey && !event.altKey && event.code === "KeyN") return "Normal";
   return null;
 }
+function divergenceSummary(divergence) {
+  if (!divergence) return null;
+  const changed = divergence.styles.filter((s) => s.kind === "changed").map((s) => styleLabel(s.name));
+  const missing = divergence.styles.filter((s) => s.kind === "missing").map((s) => styleLabel(s.name));
+  const parts = [
+    divergence.docDefaults ? "default text formatting" : "",
+    changed.length ? `${changed.length === 1 ? "style" : "styles"} ${changed.slice(0, 6).join(", ")}${changed.length > 6 ? "\u2026" : ""}` : "",
+    missing.length ? `${missing.length} house ${missing.length === 1 ? "style" : "styles"} missing` : ""
+  ].filter(Boolean);
+  return parts.length ? `Differs from the house template: ${parts.join("; ")}.` : null;
+}
 var FILTER_FROM = 8;
 function previewStyle(option) {
   const { fontFamily, fontSizePt, bold, italic, color } = option.preview;
@@ -2312,6 +2532,10 @@ function previewStyle(option) {
 function Gallery({ close }) {
   const { value, setValue, options, isEnabled } = useParagraphStyle();
   const editor = useDocxEditor();
+  const house = useHouseTemplate();
+  const changed = new Set(
+    house?.basedOnTemplate ? house.divergence?.styles.filter((s) => s.kind === "changed").map((s) => s.styleId) : []
+  );
   const [query, setQuery] = useState("");
   const quick = useMemo(
     () => QUICK_STYLES.map((name) => findStyle(options, name)).filter(
@@ -2374,7 +2598,7 @@ function Gallery({ close }) {
         id: nav.listboxId,
         "aria-label": "Document styles",
         children: [
-          shown.map((option, index) => /* @__PURE__ */ jsx(
+          shown.map((option, index) => /* @__PURE__ */ jsxs(
             "li",
             {
               id: listOptionId(nav.listboxId, index),
@@ -2385,7 +2609,17 @@ function Gallery({ close }) {
               "data-style-id": option.styleId,
               onMouseEnter: () => nav.setSelectedIndex(index),
               onClick: () => isEnabled && apply(option),
-              children: /* @__PURE__ */ jsx("span", { style: previewStyle(option), children: styleLabel(option.name) })
+              children: [
+                /* @__PURE__ */ jsx("span", { style: previewStyle(option), children: styleLabel(option.name) }),
+                changed.has(option.styleId) && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: "native-docx-style-diverged",
+                    title: "Defined differently from the house template",
+                    "aria-label": "Defined differently from the house template"
+                  }
+                )
+              ]
             },
             option.styleId
           )),
@@ -2399,14 +2633,25 @@ function StyleGallery() {
   const { value, options } = useParagraphStyle();
   const current = options.find((o) => o.styleId === value);
   const name = current ? styleLabel(current.name) : "Styles";
+  const house = useHouseTemplate();
+  const diverged = house?.basedOnTemplate ? divergenceSummary(house.divergence) : null;
   return /* @__PURE__ */ jsx(
     RibbonMenu,
     {
       label: "Styles",
+      title: diverged ? `Styles. ${diverged}` : void 0,
       className: "native-docx-style-trigger",
       testId: "docx-style-trigger",
       icon: /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("span", { className: "native-docx-style-current", "data-testid": "docx-current-style", children: name }),
+        diverged && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "native-docx-style-diverged",
+            "data-testid": "docx-style-diverged",
+            "aria-label": diverged
+          }
+        ),
         /* @__PURE__ */ jsx(ChevronDown, { size: 12, "aria-hidden": true })
       ] }),
       children: (close) => /* @__PURE__ */ jsx(Gallery, { close })
@@ -2475,12 +2720,18 @@ function WordShortcuts({ scope }) {
   const endnote = useInsertNote("endnote");
   const styles = useParagraphStyle();
   const editor = useDocxEditor();
-  const latest = useRef({ footnote, endnote, styles, editor });
-  latest.current = { footnote, endnote, styles, editor };
+  const levels = useHouseTemplate()?.levels;
+  const latest = useRef({ footnote, endnote, styles, editor, levels });
+  latest.current = { footnote, endnote, styles, editor, levels };
   useEffect(() => {
     const element = scope.current;
     if (!element) return;
     const onKeyDown = (event) => {
+      if (outlineTab(event)) {
+        event.preventDefault();
+        event.stopPropagation();
+        return;
+      }
       const action = wordShortcut(event);
       if (!action) return;
       const { footnote: footnote2, endnote: endnote2, styles: styles2, editor: editor2 } = latest.current;
@@ -2495,11 +2746,110 @@ function WordShortcuts({ scope }) {
       event.stopPropagation();
       editor2?.surface?.focus();
     };
+    const outlineTab = (event) => {
+      if (event.key !== "Tab" || event.ctrlKey || event.metaKey || event.altKey) return false;
+      const { editor: editor2, levels: levels2, styles: styles2 } = latest.current;
+      const current = editor2?.getSelectionFormatting()?.styleId;
+      const link = current ? levels2?.[current] : void 0;
+      const target = event.shiftKey ? link?.previous : link?.next;
+      if (!target || !editor2 || editorPort(editor2).caret()?.offset !== 0) return false;
+      styles2.setValue(target);
+      return true;
+    };
     element.addEventListener("keydown", onKeyDown, true);
     return () => element.removeEventListener("keydown", onKeyDown, true);
   }, [scope]);
   return null;
 }
+function QuickParts() {
+  const house = useHouseTemplate();
+  if (!house || house.blocks.length === 0) return null;
+  const categories = [...new Set(house.blocks.map((b) => b.category))];
+  return /* @__PURE__ */ jsx(RibbonMenu, { label: "Quick Parts", icon: /* @__PURE__ */ jsx(Blocks, { size: 16 }), testId: "docx-quick-parts", children: (close) => /* @__PURE__ */ jsxs("div", { className: "native-docx-quick-parts", "data-testid": "docx-quick-parts-panel", children: [
+    categories.map((category) => /* @__PURE__ */ jsxs("section", { "aria-label": category, children: [
+      /* @__PURE__ */ jsx("h3", { children: category }),
+      /* @__PURE__ */ jsx("ul", { children: house.blocks.filter((b) => b.category === category).map((block) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          disabled: !house.editable,
+          title: block.description || block.name,
+          onClick: () => {
+            close();
+            house.insertBlock(block.name);
+          },
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "native-docx-quick-part-name", children: block.name }),
+            /* @__PURE__ */ jsx("span", { className: "native-docx-quick-part-preview", children: block.text })
+          ]
+        }
+      ) }, block.name)) })
+    ] }, category)),
+    /* @__PURE__ */ jsxs("p", { className: "native-docx-quick-parts-source", children: [
+      "From ",
+      house.template.name
+    ] })
+  ] }) });
+}
+var SOURCE = {
+  workspace: "This workspace's house template",
+  deployment: "The house template for all workspaces",
+  builtin: "ARBI\u2019s built-in template (no house template has been set)"
+};
+function download(bytes, name) {
+  const isTemplate = !/\.docx$/i.test(name);
+  const url = URL.createObjectURL(
+    new Blob([bytes], {
+      type: isTemplate ? "application/vnd.openxmlformats-officedocument.wordprocessingml.template" : "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+    })
+  );
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = /\.(dotx|docx)$/i.test(name) ? name : `${name}.dotx`;
+  a.click();
+  setTimeout(() => URL.revokeObjectURL(url), 5e3);
+}
+function HouseTemplatePanel() {
+  const house = useHouseTemplate();
+  if (!house) return null;
+  const summary = divergenceSummary(house.divergence);
+  return /* @__PURE__ */ jsx(
+    RibbonMenu,
+    {
+      label: "House template",
+      className: "native-docx-style-trigger",
+      testId: "docx-house-template",
+      icon: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { className: "native-docx-style-current", children: "House template" }),
+        /* @__PURE__ */ jsx(ChevronDown, { size: 12, "aria-hidden": true })
+      ] }),
+      children: /* @__PURE__ */ jsxs("div", { className: "native-docx-house-template", "data-testid": "docx-house-template-panel", children: [
+        /* @__PURE__ */ jsxs("p", { children: [
+          /* @__PURE__ */ jsx("strong", { children: house.template.name }),
+          /* @__PURE__ */ jsx("br", {}),
+          SOURCE[house.template.source],
+          ". New documents start from it."
+        ] }),
+        /* @__PURE__ */ jsx("p", { "data-testid": "docx-house-template-status", children: house.divergence === null ? "Comparing this document\u2019s styles\u2026" : !house.basedOnTemplate ? "This document was not started from the house template." : summary ?? "This document\u2019s styles match the house template." }),
+        /* @__PURE__ */ jsxs("div", { className: "native-docx-house-template-actions", children: [
+          /* @__PURE__ */ jsxs("button", { type: "button", onClick: () => download(house.template.bytes, house.template.name), children: [
+            /* @__PURE__ */ jsx(Download, { size: 14 }),
+            " Download template"
+          ] }),
+          house.setAsHouseTemplate && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "data-testid": "docx-set-house-template",
+              onClick: () => void house.setAsHouseTemplate(),
+              children: "Use this document as the house template"
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+}
 function contentPath(documentId) {
   const match = /^(doc-[A-Za-z0-9]+)@v([1-9][0-9]*)$/.exec(documentId);
   return match ? `/${encodeURIComponent(match[1])}/content?version=${match[2]}` : `/${encodeURIComponent(documentId)}/content`;
@@ -2589,6 +2939,7 @@ function DocxRibbon({
     /* @__PURE__ */ jsxs("select", { "aria-label": "Ribbon tab", value: tab, onChange: (event) => setTab(event.target.value), children: [
       /* @__PURE__ */ jsx("option", { children: "Home" }),
       /* @__PURE__ */ jsx("option", { children: "Insert" }),
+      /* @__PURE__ */ jsx("option", { children: "Design" }),
       /* @__PURE__ */ jsx("option", { children: "References" }),
       /* @__PURE__ */ jsx("option", { children: "Review" })
     ] }),
@@ -2622,8 +2973,10 @@ function DocxRibbon({
         /* @__PURE__ */ jsx(DocxEditor.Toolbar.TableInsert, {}),
         /* @__PURE__ */ jsx(DocxEditor.Toolbar.ImageInsert, {}),
         /* @__PURE__ */ jsx(DocxEditor.Toolbar.Link, {}),
-        /* @__PURE__ */ jsx(DefinedTermButtons, {})
+        /* @__PURE__ */ jsx(DefinedTermButtons, {}),
+        /* @__PURE__ */ jsx(QuickParts, {})
       ] }),
+      tab === "Design" && /* @__PURE__ */ jsx(HouseTemplatePanel, {}),
       tab === "References" && /* @__PURE__ */ jsx(NoteButtons, {}),
       tab === "Review" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(DocxEditor.Toolbar.EditingMode, {}),
@@ -2698,11 +3051,16 @@ function NativeDocxEditor({
     async function start() {
       const fonts = await adapter.loadFonts();
       if (isDraft || snapshot) {
-        const data = isDraft ? !streamRef.current && drafts.get(documentId) || await (await adapter.request("/prepare", {
+        const data = isDraft ? !streamRef.current && drafts.get(documentId) || (draftContent === "" && adapter.houseTemplate ? await (async () => {
+          const template = await resolveHouseTemplate(adapter.houseTemplate);
+          return newFromTemplate(template.bytes, {
+            attachedTemplate: templateFileName(template)
+          });
+        })() : await (await adapter.request("/prepare", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
           body: JSON.stringify({ content: draftContent })
-        })).arrayBuffer() : await (await adapter.request(contentPath(documentId))).arrayBuffer();
+        })).arrayBuffer()) : await (await adapter.request(contentPath(documentId))).arrayBuffer();
         if (!cancelled) {
           setReady({
             document: new Uint8Array(data),
@@ -2964,70 +3322,80 @@ function NativeDocxEditor({
               if (change.source !== "load") changed();
             },
             onFontError: (e) => setError(e.message),
-            children: /* @__PURE__ */ jsxs(
+            children: /* @__PURE__ */ jsx(DocxAuthorContext.Provider, { value: ready.author, children: /* @__PURE__ */ jsx(
               DefinedTermsProvider,
               {
                 load: adapter.definitions,
                 editable: !stream && !snapshot && ready.canEdit,
                 notify: adapter.notify,
-                children: [
-                  /* @__PURE__ */ jsx(
-                    DocxEditor.RevisionMarkup,
-                    {
-                      insertions: { mark: "underline", color: "blue" },
-                      deletions: { mark: "strikethrough", color: "red" },
-                      movedFrom: { mark: "doubleStrikethrough", color: "green" },
-                      movedTo: { mark: "doubleUnderline", color: "green" },
-                      trackMoves: true
-                    }
-                  ),
-                  !stream && /* @__PURE__ */ jsx(
-                    DocxRibbon,
-                    {
-                      onSave: () => void saveVersion(),
-                      badge: (
-                        // Says the document is shared live, in place of a title row above the ribbon.
-                        ready.room && ready.canEdit && !snapshot ? /* @__PURE__ */ jsx("span", { title: "Edits sync live with everyone who has this document open", children: "Co-edit mode" }) : void 0
+                children: /* @__PURE__ */ jsxs(
+                  HouseTemplateProvider,
+                  {
+                    enabled: !stream,
+                    host: adapter.houseTemplate,
+                    documentId: isDraft || snapshot ? void 0 : documentId,
+                    editable: !stream && !snapshot && ready.canEdit,
+                    notify: adapter.notify,
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        DocxEditor.RevisionMarkup,
+                        {
+                          insertions: { mark: "underline", color: "blue" },
+                          deletions: { mark: "strikethrough", color: "red" },
+                          movedFrom: { mark: "doubleStrikethrough", color: "green" },
+                          movedTo: { mark: "doubleUnderline", color: "green" },
+                          trackMoves: true
+                        }
+                      ),
+                      !stream && /* @__PURE__ */ jsx(
+                        DocxRibbon,
+                        {
+                          onSave: () => void saveVersion(),
+                          badge: (
+                            // Says the document is shared live, in place of a title row above the ribbon.
+                            ready.room && ready.canEdit && !snapshot ? /* @__PURE__ */ jsx("span", { title: "Edits sync live with everyone who has this document open", children: "Co-edit mode" }) : void 0
+                          )
+                        }
+                      ),
+                      !stream && /* @__PURE__ */ jsx(WordShortcuts, { scope: stageRef }),
+                      /* @__PURE__ */ jsxs(
+                        "div",
+                        {
+                          className: "native-docx-stage",
+                          ref: stageRef,
+                          onMouseDownCapture: (event) => {
+                            if (event.button === 2 && ref.current?.getSelectionPlacement())
+                              event.preventDefault();
+                          },
+                          children: [
+                            /* @__PURE__ */ jsxs(DocxEditor.Viewport, { className: "native-docx-viewport", children: [
+                              /* @__PURE__ */ jsx(DocxEditor.Content, {}),
+                              /* @__PURE__ */ jsx(
+                                DocxMentions,
+                                {
+                                  initialCommentId,
+                                  mentions: adapter.mentions,
+                                  notify: adapter.notify,
+                                  getAgentStatus: adapter.getAgentStatus,
+                                  requestAgent: adapter.requestAgent ? (request) => adapter.requestAgent(documentId, request) : void 0,
+                                  children: /* @__PURE__ */ jsx(DocxEditorReview, { children: () => /* @__PURE__ */ jsx(DocxEditorReview.Card, { children: /* @__PURE__ */ jsx(DocxCommentActivity, {}) }) })
+                                }
+                              ),
+                              /* @__PURE__ */ jsx(DocxEditor.HeaderFooterChrome, {}),
+                              /* @__PURE__ */ jsx(DocxEditor.NotesChrome, {}),
+                              /* @__PURE__ */ jsx(DocxEditor.Equation, {}),
+                              /* @__PURE__ */ jsx(DocxEditor.HyperLink, {}),
+                              /* @__PURE__ */ jsx(DocxEditor.ContextMenu, {})
+                            ] }),
+                            /* @__PURE__ */ jsx(DocxEditor.PageNumber, {})
+                          ]
+                        }
                       )
-                    }
-                  ),
-                  !stream && /* @__PURE__ */ jsx(WordShortcuts, { scope: stageRef }),
-                  /* @__PURE__ */ jsxs(
-                    "div",
-                    {
-                      className: "native-docx-stage",
-                      ref: stageRef,
-                      onMouseDownCapture: (event) => {
-                        if (event.button === 2 && ref.current?.getSelectionPlacement())
-                          event.preventDefault();
-                      },
-                      children: [
-                        /* @__PURE__ */ jsxs(DocxEditor.Viewport, { className: "native-docx-viewport", children: [
-                          /* @__PURE__ */ jsx(DocxEditor.Content, {}),
-                          /* @__PURE__ */ jsx(
-                            DocxMentions,
-                            {
-                              initialCommentId,
-                              mentions: adapter.mentions,
-                              notify: adapter.notify,
-                              getAgentStatus: adapter.getAgentStatus,
-                              requestAgent: adapter.requestAgent ? (request) => adapter.requestAgent(documentId, request) : void 0,
-                              children: /* @__PURE__ */ jsx(DocxEditorReview, { children: () => /* @__PURE__ */ jsx(DocxEditorReview.Card, { children: /* @__PURE__ */ jsx(DocxCommentActivity, {}) }) })
-                            }
-                          ),
-                          /* @__PURE__ */ jsx(DocxEditor.HeaderFooterChrome, {}),
-                          /* @__PURE__ */ jsx(DocxEditor.NotesChrome, {}),
-                          /* @__PURE__ */ jsx(DocxEditor.Equation, {}),
-                          /* @__PURE__ */ jsx(DocxEditor.HyperLink, {}),
-                          /* @__PURE__ */ jsx(DocxEditor.ContextMenu, {})
-                        ] }),
-                        /* @__PURE__ */ jsx(DocxEditor.PageNumber, {})
-                      ]
-                    }
-                  )
-                ]
+                    ]
+                  }
+                )
               }
-            )
+            ) })
           }
         ) }, retry) }),
         /* @__PURE__ */ jsxs("div", { className: "native-docx-actions", children: [
@@ -3122,6 +3490,6 @@ async function loadFonts(baseUrl) {
   };
 }
 
-export { DEFAULT_DEFINED_TERMS_LABELS, DEFINED_TERM_TRIGGER, DefinedTermsProvider, DocxCommentActivity, DocxEditorReview, DocxMentions, DocxParticipants, DocxRibbon, NativeDocxEditor, editorPort, findDefinitionsSection, insertDefinedTerm, loadDocxFonts, normalizeDocxExport, reviewModule, updateDefinitions, useDefinedTerms, useReview, useReviewItem, withDirectEditing };
-//# sourceMappingURL=chunk-QIEEFBZ5.js.map
-//# sourceMappingURL=chunk-QIEEFBZ5.js.map
+export { BUILTIN_TEMPLATE_NAME, DEFAULT_DEFINED_TERMS_LABELS, DEFINED_TERM_TRIGGER, DefinedTermsProvider, DocxAuthorContext, DocxCommentActivity, DocxEditorReview, DocxMentions, DocxParticipants, DocxRibbon, HouseTemplateProvider, NativeDocxEditor, builtinHouseTemplate, contentPath, editorPort, findDefinitionsSection, insertDefinedTerm, loadDocxFonts, normalizeDocxExport, resolveHouseTemplate, reviewModule, structuralPort, templateFileName, trackedOrNoted, updateDefinitions, useDefinedTerms, useHouseTemplate, useReview, useReviewItem, useTrackedOrNoted, withDirectEditing };
+//# sourceMappingURL=chunk-4ZTIMQ7Z.js.map
+//# sourceMappingURL=chunk-4ZTIMQ7Z.js.map