npm - @modusoperandi/licit - Versions diffs - 1.4.2 → 1.4.6 - Mend

@modusoperandi/licit 1.4.2 → 1.4.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (228) hide show

package/BlockquoteInsertNewLineCommand.js.flow +70 -70
package/BlockquoteNodeSpec.js.flow +29 -29
package/BlockquoteToggleCommand.js.flow +56 -56
package/BookmarkNodeSpec.js.flow +39 -39
package/BulletListNodeSpec.js.flow +61 -61
package/CZIProseMirror.js.flow +90 -90
package/CodeBlockCommand.js.flow +65 -65
package/CodeBlockNodeSpec.js.flow +24 -24
package/CodeMarkSpec.js.flow +14 -14
package/ContentPlaceholderPlugin.js.flow +183 -183
package/CursorPlaceholderPlugin.js.flow +113 -113
package/DocLayoutCommand.js.flow +97 -97
package/DocNodeSpec.js.flow +62 -62
package/EMMarkSpec.js.flow +39 -39
package/EditorCommands.js.flow +124 -124
package/EditorKeyMap.js.flow +173 -173
package/EditorMarks.js +4 -2
package/EditorMarks.js.flow +77 -74
package/EditorNodes.js.flow +55 -55
package/EditorPageLayoutPlugin.js.flow +67 -67
package/EditorPlugins.js.flow +8 -8
package/EditorSchema.js.flow +12 -12
package/EditorState.js.flow +7 -7
package/FontSizeMarkSpec.js.flow +54 -54
package/FontTypeMarkSpec.js.flow +89 -89
package/HTMLMutator.js.flow +58 -58
package/HangingIndentMarkSpec.js +34 -0
package/HangingIndentMarkSpec.js.flow +30 -0
package/HardBreakNodeSpec.js.flow +15 -15
package/HeadingNodeSpec.js.flow +42 -42
package/HistoryRedoCommand.js.flow +41 -41
package/HistoryUndoCommand.js.flow +41 -41
package/HorizontalRuleCommand.js.flow +71 -71
package/HorizontalRuleNodeSpec.js.flow +39 -39
package/ImageUploadPlaceholderPlugin.js.flow +187 -187
package/LICENSE +22 -22
package/LinkMarkSpec.js +4 -2
package/LinkMarkSpec.js.flow +38 -37
package/LinkSetURLCommand.js +1 -1
package/LinkSetURLCommand.js.flow +129 -129
package/LinkTooltipPlugin.js +32 -38
package/LinkTooltipPlugin.js.flow +204 -217
package/ListItemInsertNewLineCommand.js.flow +76 -76
package/ListItemMergeCommand.js.flow +197 -197
package/ListItemNodeSpec.js.flow +52 -52
package/ListSplitCommand.js.flow +54 -54
package/ListToggleCommand.js.flow +99 -99
package/MarkNames.js +2 -1
package/MarkNames.js.flow +20 -19
package/MarksClearCommand.js.flow +66 -66
package/NodeNames.js.flow +23 -23
package/OrderedListNodeSpec.js.flow +131 -131
package/OverrideMarkSpec.js.flow +49 -49
package/ParagraphNodeSpec.js +21 -2
package/ParagraphNodeSpec.js.flow +233 -215
package/ParagraphSpacingCommand.js.flow +139 -139
package/PrintCommand.js.flow +53 -53
package/SelectionPlaceholderPlugin.js.flow +129 -129
package/SpacerMarkSpec.js.flow +47 -47
package/StrikeMarkSpec.js.flow +24 -24
package/StrongMarkSpec.js.flow +39 -39
package/StyleView.js.flow +18 -18
package/TableBackgroundColorCommand.js.flow +79 -79
package/TableBorderColorCommand.js +5 -3
package/TableBorderColorCommand.js.flow +108 -106
package/TableCellColorCommand.js.flow +73 -73
package/TableCellMenuPlugin.js.flow +129 -129
package/TableInsertCommand.js.flow +117 -117
package/TableMergeCellsCommand.js.flow +113 -113
package/TableNodesSpecs.js.flow +144 -144
package/TablePlugins.js.flow +14 -14
package/TableResizePlugin.js.flow +636 -636
package/TextColorMarkSpec.js.flow +40 -40
package/TextHighlightMarkSpec.js.flow +47 -47
package/TextInsertTabSpaceCommand.js +0 -3
package/TextInsertTabSpaceCommand.js.flow +103 -106
package/TextNoWrapMarkSpec.js.flow +14 -14
package/TextNodeSpec.js.flow +7 -7
package/TextSelectionMarkSpec.js.flow +24 -24
package/TextSubMarkSpec.js.flow +28 -28
package/TextSuperMarkSpec.js.flow +28 -28
package/TextUnderlineMarkSpec.js.flow +24 -24
package/Types.js.flow +77 -77
package/WebFontLoader.js.flow +22 -22
package/blockQuoteInputRule.js.flow +36 -36
package/bom.xml +8645 -8637
package/browser.js.flow +7 -7
package/buildEditorPlugins.js.flow +48 -48
package/buildInputRules.js.flow +85 -85
package/client/CollabConnector.js.flow +90 -90
package/client/EditorConnection.js.flow +324 -324
package/client/Licit.js +40 -40
package/client/Licit.js.flow +649 -648
package/client/Licit.test.js.flow +104 -104
package/client/Reporter.js.flow +35 -35
package/client/SimpleConnector.js.flow +61 -61
package/client/http.js.flow +60 -60
package/client/licit.css +12 -12
package/client/throttle.js.flow +27 -27
package/convertFromDOMElement.js.flow +33 -33
package/convertFromHTML.js.flow +15 -15
package/convertFromJSON.js.flow +53 -53
package/convertToCSSPTValue.js.flow +19 -19
package/convertToJSON.js.flow +7 -7
package/createCommand.js.flow +62 -62
package/createEditorKeyMap.js.flow +87 -87
package/createEmptyEditorState.js.flow +29 -29
package/createTableResizingPlugin.js.flow +86 -86
package/findActionableCell.js.flow +74 -74
package/findActiveMark.js.flow +32 -32
package/hyphenize.js.flow +17 -17
package/index.d.ts +167 -167
package/index.js.flow +10 -10
package/insertTable.js.flow +54 -54
package/isEditorStateEmpty.js.flow +32 -32
package/isTableNode.js.flow +15 -15
package/joinDown.js.flow +25 -25
package/joinListNode.js.flow +55 -55
package/joinUp.js.flow +37 -37
package/keymaps.js.flow +175 -175
package/lookUpElement.js.flow +14 -14
package/nodeAt.js.flow +12 -12
package/normalizeHTML.js.flow +80 -80
package/package.json +152 -152
package/patchAnchorElements.js.flow +38 -38
package/patchBreakElements.js.flow +22 -22
package/patchElementInlineStyles.js.flow +92 -92
package/patchListElements.js.flow +275 -275
package/patchMathElements.js.flow +58 -58
package/patchParagraphElements.js.flow +20 -20
package/patchStyleElements.js.flow +197 -197
package/patchTableElements.js.flow +88 -88
package/rebaseDocWithSteps.js.flow +42 -42
package/sanitizeURL.js.flow +13 -13
package/splitListItem.js.flow +191 -191
package/styles.css +46 -46
package/toClosestFontPtSize.js.flow +22 -22
package/toSafeHTMLDocument.js.flow +9 -9
package/toggleBlockquote.js.flow +101 -101
package/toggleCodeBlock.js.flow +102 -102
package/ui/AlertInfo.js.flow +63 -63
package/ui/BookmarkNodeView.js.flow +64 -64
package/ui/CommandButton.js.flow +68 -68
package/ui/CommandMenu.js.flow +74 -74
package/ui/CommandMenuButton.js.flow +128 -128
package/ui/CustomEditorView.js.flow +29 -29
package/ui/CustomMenu.js.flow +14 -14
package/ui/CustomMenuItem.js.flow +35 -35
package/ui/CustomNodeView.js.flow +207 -207
package/ui/CustomRadioButton.js.flow +63 -63
package/ui/DocLayoutEditor.js.flow +130 -130
package/ui/Editor.js.flow +281 -281
package/ui/EditorFrameset.js.flow +79 -79
package/ui/EditorToolbar.js.flow +197 -197
package/ui/EditorToolbarConfig.js.flow +162 -162
package/ui/FontSizeCommandMenuButton.js.flow +66 -66
package/ui/FontTypeCommandMenuButton.js.flow +60 -60
package/ui/Frag.js.flow +11 -11
package/ui/Icon.js +1 -1
package/ui/Icon.js.flow +82 -82
package/ui/ImageInlineEditor.js.flow +66 -66
package/ui/KeyCodes.js.flow +12 -12
package/ui/LinkTooltip.js.flow +51 -51
package/ui/LinkURLEditor.js.flow +227 -227
package/ui/ListItemNodeView.js.flow +101 -101
package/ui/ListTypeButton.js.flow +121 -121
package/ui/ListTypeCommandButton.js.flow +85 -85
package/ui/ListTypeMenu.js.flow +78 -78
package/ui/LoadingIndicator.js.flow +19 -19
package/ui/PasteMenu.js.flow +52 -52
package/ui/ResizeObserver.js.flow +105 -105
package/ui/RichTextEditor.js.flow +133 -133
package/ui/SelectionObserver.js.flow +134 -134
package/ui/TableCellMenu.js.flow +49 -49
package/ui/TableGridSizeEditor.js.flow +185 -185
package/ui/TableNodeView.js.flow +36 -36
package/ui/bindScrollHandler.js.flow +46 -46
package/ui/canUseCSSFont.js.flow +42 -42
package/ui/czi-body-layout-editor.css +16 -16
package/ui/czi-bookmark-view.css +10 -10
package/ui/czi-cursor-placeholder.css +36 -36
package/ui/czi-custom-menu-button.css +18 -18
package/ui/czi-custom-menu-item.css +30 -30
package/ui/czi-custom-menu.css +8 -8
package/ui/czi-custom-radio-button.css +80 -80
package/ui/czi-custom-scrollbar.css +21 -21
package/ui/czi-editor-frameset.css +81 -81
package/ui/czi-editor-toolbar.css +122 -122
package/ui/czi-editor.css +239 -216
package/ui/czi-form.css +201 -201
package/ui/czi-frag.css +3 -3
package/ui/czi-heading.css +40 -40
package/ui/czi-icon.css +72 -72
package/ui/czi-image-resize-box.css +165 -165
package/ui/czi-image-upload-editor.css +57 -57
package/ui/czi-image-upload-placeholder.css +50 -50
package/ui/czi-image-url-editor.css +38 -38
package/ui/czi-image-view.css +121 -121
package/ui/czi-indent.css +137 -137
package/ui/czi-inline-editor.css +20 -20
package/ui/czi-link-tooltip.css +112 -112
package/ui/czi-list.css +406 -406
package/ui/czi-loading-indicator.css +66 -66
package/ui/czi-math-view.css +62 -62
package/ui/czi-selection-placeholder.css +24 -24
package/ui/czi-table-cell-menu.css +16 -16
package/ui/czi-table-grid-size-editor.css +37 -37
package/ui/czi-table.css +89 -89
package/ui/czi-vars.css +47 -45
package/ui/findActiveFontSize.js.flow +55 -55
package/ui/findActiveFontType.js.flow +35 -35
package/ui/fonts.css +460 -460
package/ui/handleEditorDrop.js.flow +28 -28
package/ui/handleEditorKeyDown.js.flow +39 -39
package/ui/handleEditorPaste.js.flow +33 -33
package/ui/htmlElementToRect.js.flow +18 -18
package/ui/icon-font.css +9 -9
package/ui/injectStyleSheet.js.flow +40 -40
package/ui/isElementFullyVisible.js.flow +14 -14
package/ui/isOffline.js.flow +8 -8
package/ui/isReactClass.js.flow +12 -12
package/ui/listType.css +21 -21
package/ui/resolveImage.js.flow +121 -121
package/ui/toCSSColor.js.flow +51 -51
package/ui/toCSSLineSpacing.js.flow +53 -53
package/ui/toHexColor.js.flow +26 -26
package/ui/uuid.js.flow +9 -9
package/uuid.js.flow +9 -9

package/patchListElements.js.flow CHANGED Viewed

@@ -1,275 +1,275 @@
-// @flow
-import HTMLMutator from './HTMLMutator.js';
-import uuid from './ui/uuid.js';
-import { ATTRIBUTE_LIST_STYLE_TYPE } from './ListItemNodeSpec.js';
-import {
-  ATTRIBUTE_INDENT,
-  EMPTY_CSS_VALUE,
-  convertMarginLeftToIndentValue,
-} from './ParagraphNodeSpec.js';
-import {
-  ATTRIBUTE_COUNTER_RESET,
-  ATTRIBUTE_FOLLOWING,
-} from './OrderedListNodeSpec.js';
-import { ATTRIBUTE_CSS_BEFORE_CONTENT } from './patchStyleElements.js';
-export default function patchListElements(doc: Document): void {
-  // In Google Doc, lists are exported as indented
-  // (e.g. style="margin-left: 48pt") list elements which is the default DOM
-  // structure that `czi-prosemirror` supports. However, other doc providers
-  // (e.g Office 365) may export lists as nested list elements that can't
-  // be rendered properly.
-  // Before proceeding further, it needs to convert the nested list elements
-  // into indented list elements.
-  liftNestedListElements(doc);
-  Array.from(doc.querySelectorAll('ol, ul')).forEach(patchListElementsElement);
-}
-// This assumes that every 36pt maps to one indent level.
-const CHAR_BULLET = '\u25cf';
-const CHAR_CIRCLE = '\u25cb';
-const CHAR_SQUARE = '\u25a0';
-const CHAR_BOX = '\u274f';
-const CHAR_ZERO_SPACE = '\u200B';
-const INLINE_NODE_NAME_PATTERN = /^(#text|(A|SPAN|B|STRONG))$/;
-function patchListElementsElement(listElement: HTMLElement): void {
-  // If the children of `listElement` all have teh same marginLeft, assume
-  // it to be indented.
-  let marginLeft;
-  let beforeContent;
-  const { parentElement, children } = listElement;
-  // A workaround to patch the issue when <ul /> or <ol /> is pasted as the
-  // first child of <body />, its first <li /> somehow can't be wrapped
-  // with the list. The hack is to prepend zero-width-space character
-  // before the list.
-  if (
-    parentElement &&
-    parentElement.nodeName === 'BODY' &&
-    parentElement.firstChild === listElement
-  ) {
-    const tt = parentElement.ownerDocument.createTextNode(CHAR_ZERO_SPACE);
-    parentElement.insertBefore(tt, listElement);
-  }
-  Array.from(children).forEach((listItemElement) => {
-    const { style } = listItemElement;
-    patchPaddingStyle(listItemElement);
-    const bc = listItemElement.getAttribute(ATTRIBUTE_CSS_BEFORE_CONTENT) || '';
-    if (beforeContent === undefined) {
-      beforeContent = bc;
-    }
-    if (beforeContent !== bc) {
-      beforeContent = null;
-    }
-    const ml = (style?.marginLeft) || '';
-    if (marginLeft === undefined) {
-      marginLeft = ml;
-    }
-    if (ml !== marginLeft) {
-      marginLeft = null;
-    }
-  });
-  if (marginLeft) {
-    const indent = convertMarginLeftToIndentValue(marginLeft);
-    if (indent) {
-      listElement.setAttribute(ATTRIBUTE_INDENT, String(indent));
-    }
-  }
-  if (beforeContent) {
-    beforeContent = String(beforeContent);
-    let listStyleType;
-    switch (true) {
-      case beforeContent.indexOf(CHAR_BULLET) > -1:
-        listStyleType = 'disc';
-        break;
-      case beforeContent.indexOf(CHAR_CIRCLE) > -1:
-        listStyleType = 'circle';
-        break;
-      case beforeContent.indexOf(CHAR_SQUARE) > -1:
-        listStyleType = 'square';
-        break;
-      case beforeContent.indexOf(CHAR_BOX) > -1:
-        listStyleType = 'box';
-        break;
-      case beforeContent.indexOf('lower-latin') > -1:
-        listStyleType = 'lower-latin';
-        break;
-      case beforeContent.indexOf('upper-latin') > -1:
-        listStyleType = 'upper-latin';
-        break;
-      case beforeContent.indexOf('lower-roman') > -1:
-        listStyleType = 'lower-roman';
-        break;
-      case beforeContent.indexOf('upper-roman') > -1:
-        listStyleType = 'upper-roman';
-        break;
-      case beforeContent.indexOf('-') > -1:
-        listStyleType = 'dash';
-        break;
-      default:
-        console.log('unknown list style type', beforeContent);
-        break;
-    }
-    if (listStyleType) {
-      listElement.setAttribute(ATTRIBUTE_LIST_STYLE_TYPE, listStyleType);
-    }
-  }
-}
-// This moves the styles of <li /> into its content <p />.
-function patchPaddingStyle(listItemElement: HTMLElement): void {
-  const { style, childNodes } = listItemElement;
-  const { paddingTop, paddingBottom, lineHeight } = style;
-  if (
-    !EMPTY_CSS_VALUE.has(paddingBottom) &&
-    !EMPTY_CSS_VALUE.has(paddingTop) &&
-    !EMPTY_CSS_VALUE.has(lineHeight)
-  ) {
-    return;
-  }
-  const doc = listItemElement.ownerDocument;
-  const frag = doc.createDocumentFragment();
-  let contentIsInline = true;
-  Array.from(childNodes).forEach((cn) => {
-    contentIsInline =
-      contentIsInline && INLINE_NODE_NAME_PATTERN.test(cn.nodeName);
-    frag.appendChild(cn);
-  });
-  if (contentIsInline) {
-    // Wrap all inline content with <p /> with the padding style applied.
-    const pEl = doc.createElement('p');
-    Object.assign(pEl.style, {
-      lineHeight,
-      paddingBottom,
-      paddingTop,
-    });
-    pEl.appendChild(frag);
-    listItemElement.appendChild(pEl);
-  } else {
-    // Unable to patch the style.
-    listItemElement.appendChild(frag);
-  }
-}
-// This converts all nested list elements into indented list elements.
-// For instance,
-// == UI ==
-// 1. AA
-//   1. BB
-//   2. BB
-// 2. AA
-// == DOM Structure (Before) ==
-// <ol> <!-- Parent List -->
-//   <li>
-//     AA
-//     <ol> <!-- Child (nested) List -->
-//       <li>BB</li>
-//       <li>BB</li>
-//     </ol>
-//   </li>
-//   <li> AA</li>
-// </ol>
-// == DOM Structure (After) ==
-// <ol name="x">
-//   <li>AA</li>
-// </ol>
-// <ol data-indent="1">
-//   <li>BB</li>
-//   <li>BB</li>
-// </ol>
-// <ol data-following="x" data-counter-reset-"none">
-//   <li>AA</li>
-// </ol>
-function liftNestedListElements(doc: Document): void {
-  const selector = 'li > ol, li > ul';
-  const els = Array.from(doc.querySelectorAll(selector));
-  const htmlMutator = new HTMLMutator(doc);
-  els.forEach((list) => {
-    const indent = findIndentLevel(list);
-    list.setAttribute('data-indent', String(indent));
-    const parentListItem = list?.parentElement;
-    const parentList = parentListItem?.parentElement;
-    const parentListNodeName = parentList.nodeName.toLowerCase();
-    const isLast = parentList.lastElementChild === parentListItem;
-    const style = parentList.getAttribute('style') || '';
-    // The parent list will be split into two lists and the second list should
-    // follow the first list.
-    const followingName = parentList.getAttribute('name') || uuid();
-    parentList.setAttribute('name', followingName);
-    // Stub HTML snippets that will lift the list.
-    // Before:
-    // <ol>
-    //   <li>
-    //     AAA
-    //     <ol><li>BBB</li></ol>
-    //   </li>
-    //   <li>CCC</li>
-    // </ol>
-    // After:
-    // <ol><li>AAA</li></ol>
-    // <ol><li>BBB</li></ol>
-    // <ol><li>CCC</li></ol>
-    // Close the parent list before the list.
-    htmlMutator.insertHTMLBefore(`</${parentListNodeName}>`, list);
-    // Open a new list after list.
-    htmlMutator.insertHTMLAfter(
-      `<${parentListNodeName}
-          style="${style}"
-          class="${parentList.className}"
-          ${ATTRIBUTE_COUNTER_RESET}="none"
-          ${ATTRIBUTE_FOLLOWING}="${followingName}">`,
-      list
-    );
-    if (isLast) {
-      // The new list after list is an empty list, comment it out.
-      htmlMutator
-        .insertHTMLAfter('<!--', list)
-        .insertHTMLAfter('-->', parentList);
-    }
-  });
-  htmlMutator.execute();
-}
-function findIndentLevel(el: Element): number {
-  let indent = 0;
-  let currentEl = el.parentElement;
-  while (currentEl) {
-    const { nodeName } = currentEl;
-    if (nodeName === 'OL' || nodeName === 'UL') {
-      indent++;
-    } else if (nodeName !== 'LI') {
-      break;
-    }
-    currentEl = currentEl.parentElement;
-  }
-  return indent;
-}
+// @flow
+import HTMLMutator from './HTMLMutator.js';
+import uuid from './ui/uuid.js';
+import { ATTRIBUTE_LIST_STYLE_TYPE } from './ListItemNodeSpec.js';
+import {
+  ATTRIBUTE_INDENT,
+  EMPTY_CSS_VALUE,
+  convertMarginLeftToIndentValue,
+} from './ParagraphNodeSpec.js';
+import {
+  ATTRIBUTE_COUNTER_RESET,
+  ATTRIBUTE_FOLLOWING,
+} from './OrderedListNodeSpec.js';
+import { ATTRIBUTE_CSS_BEFORE_CONTENT } from './patchStyleElements.js';
+export default function patchListElements(doc: Document): void {
+  // In Google Doc, lists are exported as indented
+  // (e.g. style="margin-left: 48pt") list elements which is the default DOM
+  // structure that `czi-prosemirror` supports. However, other doc providers
+  // (e.g Office 365) may export lists as nested list elements that can't
+  // be rendered properly.
+  // Before proceeding further, it needs to convert the nested list elements
+  // into indented list elements.
+  liftNestedListElements(doc);
+  Array.from(doc.querySelectorAll('ol, ul')).forEach(patchListElementsElement);
+}
+// This assumes that every 36pt maps to one indent level.
+const CHAR_BULLET = '\u25cf';
+const CHAR_CIRCLE = '\u25cb';
+const CHAR_SQUARE = '\u25a0';
+const CHAR_BOX = '\u274f';
+const CHAR_ZERO_SPACE = '\u200B';
+const INLINE_NODE_NAME_PATTERN = /^(#text|(A|SPAN|B|STRONG))$/;
+function patchListElementsElement(listElement: HTMLElement): void {
+  // If the children of `listElement` all have teh same marginLeft, assume
+  // it to be indented.
+  let marginLeft;
+  let beforeContent;
+  const { parentElement, children } = listElement;
+  // A workaround to patch the issue when <ul /> or <ol /> is pasted as the
+  // first child of <body />, its first <li /> somehow can't be wrapped
+  // with the list. The hack is to prepend zero-width-space character
+  // before the list.
+  if (
+    parentElement &&
+    parentElement.nodeName === 'BODY' &&
+    parentElement.firstChild === listElement
+  ) {
+    const tt = parentElement.ownerDocument.createTextNode(CHAR_ZERO_SPACE);
+    parentElement.insertBefore(tt, listElement);
+  }
+  Array.from(children).forEach((listItemElement) => {
+    const { style } = listItemElement;
+    patchPaddingStyle(listItemElement);
+    const bc = listItemElement.getAttribute(ATTRIBUTE_CSS_BEFORE_CONTENT) || '';
+    if (beforeContent === undefined) {
+      beforeContent = bc;
+    }
+    if (beforeContent !== bc) {
+      beforeContent = null;
+    }
+    const ml = (style?.marginLeft) || '';
+    if (marginLeft === undefined) {
+      marginLeft = ml;
+    }
+    if (ml !== marginLeft) {
+      marginLeft = null;
+    }
+  });
+  if (marginLeft) {
+    const indent = convertMarginLeftToIndentValue(marginLeft);
+    if (indent) {
+      listElement.setAttribute(ATTRIBUTE_INDENT, String(indent));
+    }
+  }
+  if (beforeContent) {
+    beforeContent = String(beforeContent);
+    let listStyleType;
+    switch (true) {
+      case beforeContent.indexOf(CHAR_BULLET) > -1:
+        listStyleType = 'disc';
+        break;
+      case beforeContent.indexOf(CHAR_CIRCLE) > -1:
+        listStyleType = 'circle';
+        break;
+      case beforeContent.indexOf(CHAR_SQUARE) > -1:
+        listStyleType = 'square';
+        break;
+      case beforeContent.indexOf(CHAR_BOX) > -1:
+        listStyleType = 'box';
+        break;
+      case beforeContent.indexOf('lower-latin') > -1:
+        listStyleType = 'lower-latin';
+        break;
+      case beforeContent.indexOf('upper-latin') > -1:
+        listStyleType = 'upper-latin';
+        break;
+      case beforeContent.indexOf('lower-roman') > -1:
+        listStyleType = 'lower-roman';
+        break;
+      case beforeContent.indexOf('upper-roman') > -1:
+        listStyleType = 'upper-roman';
+        break;
+      case beforeContent.indexOf('-') > -1:
+        listStyleType = 'dash';
+        break;
+      default:
+        console.log('unknown list style type', beforeContent);
+        break;
+    }
+    if (listStyleType) {
+      listElement.setAttribute(ATTRIBUTE_LIST_STYLE_TYPE, listStyleType);
+    }
+  }
+}
+// This moves the styles of <li /> into its content <p />.
+function patchPaddingStyle(listItemElement: HTMLElement): void {
+  const { style, childNodes } = listItemElement;
+  const { paddingTop, paddingBottom, lineHeight } = style;
+  if (
+    !EMPTY_CSS_VALUE.has(paddingBottom) &&
+    !EMPTY_CSS_VALUE.has(paddingTop) &&
+    !EMPTY_CSS_VALUE.has(lineHeight)
+  ) {
+    return;
+  }
+  const doc = listItemElement.ownerDocument;
+  const frag = doc.createDocumentFragment();
+  let contentIsInline = true;
+  Array.from(childNodes).forEach((cn) => {
+    contentIsInline =
+      contentIsInline && INLINE_NODE_NAME_PATTERN.test(cn.nodeName);
+    frag.appendChild(cn);
+  });
+  if (contentIsInline) {
+    // Wrap all inline content with <p /> with the padding style applied.
+    const pEl = doc.createElement('p');
+    Object.assign(pEl.style, {
+      lineHeight,
+      paddingBottom,
+      paddingTop,
+    });
+    pEl.appendChild(frag);
+    listItemElement.appendChild(pEl);
+  } else {
+    // Unable to patch the style.
+    listItemElement.appendChild(frag);
+  }
+}
+// This converts all nested list elements into indented list elements.
+// For instance,
+// == UI ==
+// 1. AA
+//   1. BB
+//   2. BB
+// 2. AA
+// == DOM Structure (Before) ==
+// <ol> <!-- Parent List -->
+//   <li>
+//     AA
+//     <ol> <!-- Child (nested) List -->
+//       <li>BB</li>
+//       <li>BB</li>
+//     </ol>
+//   </li>
+//   <li> AA</li>
+// </ol>
+// == DOM Structure (After) ==
+// <ol name="x">
+//   <li>AA</li>
+// </ol>
+// <ol data-indent="1">
+//   <li>BB</li>
+//   <li>BB</li>
+// </ol>
+// <ol data-following="x" data-counter-reset-"none">
+//   <li>AA</li>
+// </ol>
+function liftNestedListElements(doc: Document): void {
+  const selector = 'li > ol, li > ul';
+  const els = Array.from(doc.querySelectorAll(selector));
+  const htmlMutator = new HTMLMutator(doc);
+  els.forEach((list) => {
+    const indent = findIndentLevel(list);
+    list.setAttribute('data-indent', String(indent));
+    const parentListItem = list?.parentElement;
+    const parentList = parentListItem?.parentElement;
+    const parentListNodeName = parentList.nodeName.toLowerCase();
+    const isLast = parentList.lastElementChild === parentListItem;
+    const style = parentList.getAttribute('style') || '';
+    // The parent list will be split into two lists and the second list should
+    // follow the first list.
+    const followingName = parentList.getAttribute('name') || uuid();
+    parentList.setAttribute('name', followingName);
+    // Stub HTML snippets that will lift the list.
+    // Before:
+    // <ol>
+    //   <li>
+    //     AAA
+    //     <ol><li>BBB</li></ol>
+    //   </li>
+    //   <li>CCC</li>
+    // </ol>
+    // After:
+    // <ol><li>AAA</li></ol>
+    // <ol><li>BBB</li></ol>
+    // <ol><li>CCC</li></ol>
+    // Close the parent list before the list.
+    htmlMutator.insertHTMLBefore(`</${parentListNodeName}>`, list);
+    // Open a new list after list.
+    htmlMutator.insertHTMLAfter(
+      `<${parentListNodeName}
+          style="${style}"
+          class="${parentList.className}"
+          ${ATTRIBUTE_COUNTER_RESET}="none"
+          ${ATTRIBUTE_FOLLOWING}="${followingName}">`,
+      list
+    );
+    if (isLast) {
+      // The new list after list is an empty list, comment it out.
+      htmlMutator
+        .insertHTMLAfter('<!--', list)
+        .insertHTMLAfter('-->', parentList);
+    }
+  });
+  htmlMutator.execute();
+}
+function findIndentLevel(el: Element): number {
+  let indent = 0;
+  let currentEl = el.parentElement;
+  while (currentEl) {
+    const { nodeName } = currentEl;
+    if (nodeName === 'OL' || nodeName === 'UL') {
+      indent++;
+    } else if (nodeName !== 'LI') {
+      break;
+    }
+    currentEl = currentEl.parentElement;
+  }
+  return indent;
+}

package/patchMathElements.js.flow CHANGED Viewed

@@ -1,58 +1,58 @@
-// @flow
-export default function patchMathElements(doc: Document): void {
-  Array.from(doc.querySelectorAll('img')).forEach(patchGoogleEquationElement);
-}
-// See https://developers.google.com/chart/image/docs/chart_params#gcharts_cht
-const PARAM_CHART_CHART_TYPE = 'cht';
-const PARAM_CHART_LABEL = 'chl';
-// Google Doc exports math equation content as single image element that loads
-// its content from google. For example:
-//   <img src="https://www.google.com/chart?cht=tx&amp;c...p;chl=m%E2%88%A0C" />
-// Unfortunately, such image often fails to load because its url contains the
-// value that the Google Chart API does not support.
-// The workaround is to use KaTex (https://katex.org/) whoch supports a broader
-// set of characters that can be safely converted into math quations.
-function patchGoogleEquationElement(el: HTMLElement): void {
-  const { ownerDocument, parentElement } = el;
-  if (!ownerDocument || !parentElement) {
-    return;
-  }
-  const src = el.getAttribute('src');
-  const content = getGoogleEquationContent(src);
-  if (!content) {
-    return;
-  }
-  // Replace `<img src="..." />` with `<math data-latex="..." />`.
-  // Note that this requires the schema to support `MathNodeSpec`.
-  const math = ownerDocument.createElement('math');
-  math.setAttribute('data-latex', content);
-  parentElement.insertBefore(math, el);
-  parentElement.removeChild(el);
-}
-function getGoogleEquationContent(src: ?string): ?string {
-  if (!src) {
-    return null;
-  }
-  const { host, pathname, query } = new URL(src);
-  if (host !== 'www.google.com' || pathname !== '/chart') {
-    return null;
-  }
-  const params = new URL(query);
-  const chartType = params[PARAM_CHART_CHART_TYPE];
-  const label = params[PARAM_CHART_LABEL];
-  // Google exports math equation as a special chart with plan text only
-  // contents.
-  if (chartType !== 'tx' || !label) {
-    return null;
-  }
-  return label;
-}
+// @flow
+export default function patchMathElements(doc: Document): void {
+  Array.from(doc.querySelectorAll('img')).forEach(patchGoogleEquationElement);
+}
+// See https://developers.google.com/chart/image/docs/chart_params#gcharts_cht
+const PARAM_CHART_CHART_TYPE = 'cht';
+const PARAM_CHART_LABEL = 'chl';
+// Google Doc exports math equation content as single image element that loads
+// its content from google. For example:
+//   <img src="https://www.google.com/chart?cht=tx&amp;c...p;chl=m%E2%88%A0C" />
+// Unfortunately, such image often fails to load because its url contains the
+// value that the Google Chart API does not support.
+// The workaround is to use KaTex (https://katex.org/) whoch supports a broader
+// set of characters that can be safely converted into math quations.
+function patchGoogleEquationElement(el: HTMLElement): void {
+  const { ownerDocument, parentElement } = el;
+  if (!ownerDocument || !parentElement) {
+    return;
+  }
+  const src = el.getAttribute('src');
+  const content = getGoogleEquationContent(src);
+  if (!content) {
+    return;
+  }
+  // Replace `<img src="..." />` with `<math data-latex="..." />`.
+  // Note that this requires the schema to support `MathNodeSpec`.
+  const math = ownerDocument.createElement('math');
+  math.setAttribute('data-latex', content);
+  parentElement.insertBefore(math, el);
+  parentElement.removeChild(el);
+}
+function getGoogleEquationContent(src: ?string): ?string {
+  if (!src) {
+    return null;
+  }
+  const { host, pathname, query } = new URL(src);
+  if (host !== 'www.google.com' || pathname !== '/chart') {
+    return null;
+  }
+  const params = new URL(query);
+  const chartType = params[PARAM_CHART_CHART_TYPE];
+  const label = params[PARAM_CHART_LABEL];
+  // Google exports math equation as a special chart with plan text only
+  // contents.
+  if (chartType !== 'tx' || !label) {
+    return null;
+  }
+  return label;
+}