@portone/docx-editor 0.3.0 → 0.5.0

package/dist/editor/externalClipboard.js

@@ -1,456 +0,0 @@
-// src/editor/externalClipboard.ts
-import {
-  DOMSerializer,
-  Fragment,
-  Slice
-} from "prosemirror-model";
-import { Plugin } from "prosemirror-state";
-import { paragraphAttrsFor, styleIdOf } from "../docx/formatting.js";
-import {
-  withListNumbering,
-  withParagraphStyle
-} from "../docx/paraProps.js";
-import { MAX_ILVL, nextNumId } from "../numbering/listTemplate.js";
-import { docxSchema, isPageBreak } from "../schema/index.js";
-import { editorClassNames } from "../styles/classNames.js";
-import { PASTED_IMAGE_ATTRIBUTE } from "./clipboard/images.js";
-import {
-  appendInline,
-  contextFor,
-  marksFor,
-  safeHref,
-  withInlineStyle
-} from "./clipboard/inlineFormatting.js";
-import { listRefOf } from "./commands/listCommands.js";
-import { documentFormatting, documentParagraphStyles } from "./documentStyles.js";
-import { insertPlainText } from "./plainText.js";
-import { moveCaretToDrop } from "./plugins/dropCaret.js";
-import {
-  canStartNewList,
-  documentNumbering
-} from "./plugins/numberingDecorations.js";
-var BLOCK_TAGS = /* @__PURE__ */ new Set([
-  "ADDRESS",
-  "ARTICLE",
-  "ASIDE",
-  "BLOCKQUOTE",
-  "DIV",
-  "H1",
-  "H2",
-  "H3",
-  "H4",
-  "H5",
-  "H6",
-  "LI",
-  "P",
-  "PRE",
-  "SECTION"
-]);
-var HEADING_LEVELS = {
-  H1: 1,
-  H2: 2,
-  H3: 3,
-  H4: 4,
-  H5: 5,
-  H6: 6
-};
-var HEADING_FALLBACKS = {
-  1: { bold: true, fontSizePt: 24 },
-  2: { bold: true, fontSizePt: 18 },
-  3: { bold: true, fontSizePt: 14 },
-  4: { bold: true, fontSizePt: 12 },
-  5: { bold: true, fontSizePt: 10 },
-  6: { bold: true, fontSizePt: 8 }
-};
-var PUBLIC_ATTRIBUTES = /* @__PURE__ */ new Set([
-  "alt",
-  "aria-label",
-  "class",
-  "colspan",
-  "height",
-  "href",
-  "lang",
-  "rowspan",
-  "src",
-  "style",
-  "width"
-]);
-var COPIED_STYLE_ATTRIBUTE = "data-style";
-function isAttributes(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Node);
-}
-function publicAttributes(attrs) {
-  return Object.fromEntries(
-    Object.entries(attrs).filter(([name]) => PUBLIC_ATTRIBUTES.has(name))
-  );
-}
-function isSpecArray(value) {
-  return Array.isArray(value) && typeof value[0] === "string";
-}
-function stripPrivateAttributes(spec) {
-  if (!isSpecArray(spec)) return spec;
-  const [tag, ...rest] = spec;
-  const attrs = isAttributes(rest[0]) ? publicAttributes(rest[0]) : null;
-  const children = (attrs === null ? rest : rest.slice(1)).map(
-    (child) => isSpecArray(child) ? stripPrivateAttributes(child) : child
-  );
-  return attrs === null ? [tag, ...children] : [tag, attrs, ...children];
-}
-function withDomAttribute(spec, name, value) {
-  if (!isSpecArray(spec)) return spec;
-  const [tag, ...rest] = spec;
-  return isAttributes(rest[0]) ? [tag, { ...rest[0], [name]: value }, ...rest.slice(1)] : [tag, { [name]: value }, ...rest];
-}
-function asTag(spec, tag) {
-  return isSpecArray(spec) ? [tag, ...spec.slice(1)] : spec;
-}
-function copiedMarkSpec(mark, spec) {
-  const stripped = stripPrivateAttributes(spec);
-  if (mark.type !== docxSchema.marks.link) return stripped;
-  const href = safeHref(
-    typeof mark.attrs.href === "string" ? mark.attrs.href : null
-  );
-  return href === null ? stripped : asTag(withDomAttribute(stripped, "href", href), "a");
-}
-function copiedNodeSpec(node, spec) {
-  const stripped = stripPrivateAttributes(spec);
-  if (node.type !== docxSchema.nodes.paragraph) return stripped;
-  const styleId = styleIdOf(node.attrs.pPr);
-  return styleId === null ? stripped : withDomAttribute(stripped, COPIED_STYLE_ATTRIBUTE, styleId);
-}
-function clipboardSerializer() {
-  const drawn = DOMSerializer.fromSchema(docxSchema);
-  const nodes = Object.fromEntries(
-    Object.entries(drawn.nodes).map(([name, toDOM]) => [
-      name,
-      (node) => copiedNodeSpec(node, toDOM(node))
-    ])
-  );
-  const marks = Object.fromEntries(
-    Object.entries(drawn.marks).map(([name, toDOM]) => [
-      name,
-      (mark, inline) => copiedMarkSpec(mark, toDOM(mark, inline))
-    ])
-  );
-  return new DOMSerializer(nodes, marks);
-}
-var UNREADABLE_BLOCKS = /* @__PURE__ */ new Set([
-  "bookmarkBlock",
-  "docxRaw",
-  "rawBlock"
-]);
-function stringAttr(value) {
-  return typeof value === "string" ? value : "";
-}
-function inlineText(node) {
-  if (node.isText) return node.text ?? "";
-  if (node.type === docxSchema.nodes.hardBreak) {
-    return isPageBreak(node.attrs.brAttrs) ? "\f" : "\n";
-  }
-  if (node.type === docxSchema.nodes.image) return stringAttr(node.attrs.alt);
-  if (node.type === docxSchema.nodes.noteReference) {
-    return node.attrs.customMarkFollows === true ? "" : stringAttr(node.attrs.label);
-  }
-  return "";
-}
-function rowsText(table) {
-  const rows = [];
-  table.forEach((row) => {
-    const cells = [];
-    row.forEach((cell) => {
-      cells.push(fragmentText(cell.content));
-    });
-    rows.push(cells.join("	"));
-  });
-  return rows.join("\n");
-}
-function blockText(node) {
-  if (node.type === docxSchema.nodes.table) return rowsText(node);
-  if (UNREADABLE_BLOCKS.has(node.type.name)) return "";
-  return fragmentText(node.content);
-}
-function fragmentText(fragment) {
-  const pieces = [];
-  fragment.forEach((child) => {
-    pieces.push(child.isInline ? inlineText(child) : blockText(child));
-  });
-  return pieces.join(fragment.firstChild?.isInline === true ? "" : "\n");
-}
-function bareWrappers(content, openStart, openEnd) {
-  const wrapper = content.firstChild;
-  if (openStart <= 1 || openEnd <= 1 || content.childCount !== 1)
-    return content;
-  if (wrapper === null || wrapper.childCount !== 1) return content;
-  return Fragment.from(
-    wrapper.type.create(
-      null,
-      bareWrappers(wrapper.content, openStart - 1, openEnd - 1),
-      wrapper.marks
-    )
-  );
-}
-function copiedSlice(slice) {
-  return new Slice(
-    bareWrappers(slice.content, slice.openStart, slice.openEnd),
-    slice.openStart,
-    slice.openEnd
-  );
-}
-function clipboardText(slice) {
-  return fragmentText(slice.content);
-}
-function normalizedStyleName(value) {
-  return value.toLowerCase().replace(/[\s_-]+/g, "");
-}
-function copiedStyleId(element) {
-  if (!element.classList.contains(editorClassNames.paragraph)) return null;
-  return element.getAttribute(COPIED_STYLE_ATTRIBUTE) ?? styleIdOf(element.getAttribute("data-ppr"));
-}
-function headingLevel(element, sourceStyleId) {
-  const direct = HEADING_LEVELS[element.tagName];
-  if (direct !== void 0) return direct;
-  const match = /^heading([1-6])$/.exec(
-    normalizedStyleName(sourceStyleId ?? "")
-  );
-  return match ? Number.parseInt(match[1] ?? "", 10) : null;
-}
-function destinationStyleId(state, sourceStyleId, level) {
-  const styles = documentParagraphStyles(state);
-  if (sourceStyleId && styles.some((style) => style.id === sourceStyleId)) {
-    return sourceStyleId;
-  }
-  if (level === null) return null;
-  const wanted = `heading${level}`;
-  return styles.find(
-    (style) => normalizedStyleName(style.id) === wanted || normalizedStyleName(style.name) === wanted
-  )?.id ?? null;
-}
-function blockContext(state, parent, element, preserveParagraphStyle) {
-  const editorParagraph = element.classList.contains(
-    editorClassNames.paragraph
-  );
-  const sourceStyleId = copiedStyleId(element);
-  const level = headingLevel(element, sourceStyleId);
-  if (!preserveParagraphStyle && editorParagraph) {
-    return {
-      inline: contextFor(parent, element),
-      paragraph: null
-    };
-  }
-  const styleId = destinationStyleId(state, sourceStyleId, level);
-  const paragraph = styleId === null ? null : withParagraphStyle(null, styleId);
-  const usesDestinationStyle = editorParagraph && (sourceStyleId === null || paragraph !== null);
-  let inline = parent;
-  if (paragraph === null && level !== null) {
-    inline = withInlineStyle(inline, HEADING_FALLBACKS[level] ?? {});
-  }
-  return {
-    inline: contextFor(inline, element, !usesDestinationStyle),
-    paragraph
-  };
-}
-function listParagraphProps(list) {
-  if (!list || list.numId === null) return null;
-  return withListNumbering(null, {
-    numbering: { numId: list.numId, ilvl: Math.min(MAX_ILVL, list.level) },
-    indent: { kind: "keep" }
-  });
-}
-function paragraphAttrs(state, list, paragraph) {
-  const props = listParagraphProps(list) ?? paragraph;
-  return props ? {
-    pPr: props.pPr,
-    ...paragraphAttrsFor(props.pPr, documentFormatting(state))
-  } : null;
-}
-function usedNumIds(state) {
-  const used = new Set(documentNumbering(state).lists.keys());
-  state.doc.descendants((node) => {
-    if (node.type !== docxSchema.nodes.paragraph) return true;
-    const ref = listRefOf(node);
-    if (ref) used.add(ref.numId);
-    return false;
-  });
-  return used;
-}
-var HtmlReader = class {
-  constructor(state, preserveParagraphStyles, images) {
-    this.state = state;
-    this.preserveParagraphStyles = preserveParagraphStyles;
-    this.images = images;
-    this.used = usedNumIds(state);
-    this.canCreateLists = canStartNewList(state);
-  }
-  state;
-  preserveParagraphStyles;
-  images;
-  blocks = [];
-  used;
-  canCreateLists;
-  read(root) {
-    this.readFlow(root, { style: {}, href: null, preserveWhitespace: false });
-    return this.blocks;
-  }
-  appendInline(target, node, context) {
-    appendInline(target, node, context, (content, element, inline) => {
-      if (element.tagName !== "IMG") return false;
-      const token = element.getAttribute(PASTED_IMAGE_ATTRIBUTE);
-      const image = token === null ? void 0 : this.images.get(token);
-      if (!image) return true;
-      content.push(
-        docxSchema.nodes.image.create(
-          {
-            ...image,
-            // The source drawing may point at a relationship in another package.
-            xml: null
-          },
-          null,
-          marksFor(inline)
-        )
-      );
-      return true;
-    });
-  }
-  addParagraph(content, list = null, paragraph = null) {
-    if (list && list.numId === null) {
-      const marker = list.kind === "bullet" ? "\u2022 " : "1. ";
-      content.unshift(docxSchema.text(marker));
-    }
-    this.blocks.push(
-      docxSchema.nodes.paragraph.create(
-        paragraphAttrs(this.state, list, paragraph),
-        content
-      )
-    );
-  }
-  readFlow(parent, context, paragraph = null) {
-    let inline = [];
-    const flush = () => {
-      if (inline.length === 0) return;
-      this.addParagraph(inline, null, paragraph);
-      inline = [];
-    };
-    for (const child of parent.childNodes) {
-      const element = child.nodeType === child.ELEMENT_NODE ? child : null;
-      if (element?.tagName === "UL" || element?.tagName === "OL") {
-        flush();
-        this.readList(element, context, 0, null);
-      } else if (element && BLOCK_TAGS.has(element.tagName)) {
-        flush();
-        const before = this.blocks.length;
-        const block = blockContext(
-          this.state,
-          context,
-          element,
-          this.preserveParagraphStyles
-        );
-        this.readFlow(element, block.inline, block.paragraph);
-        if (this.blocks.length === before) {
-          this.addParagraph([], null, block.paragraph);
-        }
-      } else {
-        this.appendInline(inline, child, context);
-      }
-    }
-    flush();
-  }
-  takeNumId(kind) {
-    if (!this.canCreateLists) return null;
-    const id = nextNumId(this.used, kind);
-    this.used.add(id);
-    return id;
-  }
-  readList(list, context, level, inherited) {
-    const kind = list.tagName === "UL" ? "bullet" : "numbered";
-    const listContext = {
-      kind,
-      numId: inherited?.kind === kind ? inherited.numId : this.takeNumId(kind),
-      level
-    };
-    const items = Array.from(list.children).filter(
-      (child) => child.tagName === "LI"
-    );
-    for (const item of items) {
-      const itemContext = contextFor(context, item);
-      const content = [];
-      for (const child of item.childNodes) {
-        const nested = child.nodeType === child.ELEMENT_NODE ? child : null;
-        if (nested?.tagName === "UL" || nested?.tagName === "OL") continue;
-        this.appendInline(content, child, itemContext);
-      }
-      this.addParagraph(content, listContext);
-      for (const nested of Array.from(item.children)) {
-        if (nested.tagName === "UL" || nested.tagName === "OL") {
-          this.readList(
-            nested,
-            itemContext,
-            level + 1,
-            listContext
-          );
-        }
-      }
-    }
-  }
-};
-function sliceDepth(root) {
-  const marker = root.querySelector("[data-pm-slice]");
-  const openStart = Number.parseInt(
-    marker?.getAttribute("data-pm-slice")?.split(/\s+/, 1)[0] ?? "",
-    10
-  );
-  if (Number.isFinite(openStart)) return openStart === 0 ? 0 : 1;
-  const blocks = [...BLOCK_TAGS, "OL", "UL"].map((tag) => tag.toLowerCase());
-  return root.querySelector(blocks.join(",")) ? 0 : 1;
-}
-function richHtmlSlice(state, document, source, images = /* @__PURE__ */ new Map()) {
-  if (source.trim() === "") return null;
-  const template = document.createElement("template");
-  template.innerHTML = source;
-  const open = sliceDepth(template.content);
-  const blocks = new HtmlReader(state, open === 0, images).read(
-    template.content
-  );
-  return blocks.length === 0 ? null : new Slice(Fragment.fromArray([...blocks]), open, open);
-}
-function insertRichHtml(view, source) {
-  const slice = richHtmlSlice(view.state, view.dom.ownerDocument, source);
-  if (slice === null) return false;
-  view.dispatch(view.state.tr.replaceSelection(slice).scrollIntoView());
-  return true;
-}
-function insertClipboardData(view, data) {
-  if (insertRichHtml(view, data.html ?? "")) return;
-  insertPlainText(view, data.text ?? "");
-}
-function externalClipboard() {
-  const serializer = clipboardSerializer();
-  return new Plugin({
-    props: {
-      clipboardSerializer: serializer,
-      clipboardTextSerializer: clipboardText,
-      transformCopied: copiedSlice,
-      handlePaste(view, event) {
-        insertClipboardData(view, {
-          html: event.clipboardData?.getData("text/html"),
-          text: event.clipboardData?.getData("text/plain")
-        });
-        return true;
-      },
-      handleDrop(view, event) {
-        if (view.dragging) return false;
-        const text = event.dataTransfer?.getData("text/plain") ?? "";
-        if (text) {
-          moveCaretToDrop(view, event);
-          insertPlainText(view, text);
-        }
-        return true;
-      }
-    }
-  });
-}
-export {
-  externalClipboard,
-  insertClipboardData,
-  insertRichHtml,
-  richHtmlSlice
-};