@collabchron/notiq 0.3.0 → 1.0.0

package/src/components/editor/plugins/MarkdownTransformers/index.tsx

@@ -1,304 +0,0 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-import {
-  $convertFromMarkdownString,
-  $convertToMarkdownString,
-  CHECK_LIST,
-  ELEMENT_TRANSFORMERS,
-  ElementTransformer,
-  MULTILINE_ELEMENT_TRANSFORMERS,
-  TEXT_FORMAT_TRANSFORMERS,
-  TEXT_MATCH_TRANSFORMERS,
-  TextMatchTransformer,
-  Transformer,
-} from "@lexical/markdown";
-import {
-  $createHorizontalRuleNode,
-  $isHorizontalRuleNode,
-  HorizontalRuleNode,
-} from "@lexical/react/LexicalHorizontalRuleNode";
-import {
-  $createTableCellNode,
-  $createTableNode,
-  $createTableRowNode,
-  $isTableCellNode,
-  $isTableNode,
-  $isTableRowNode,
-  TableCellHeaderStates,
-  TableCellNode,
-  TableNode,
-  TableRowNode,
-} from "@lexical/table";
-import {
-  $createTextNode,
-  $isParagraphNode,
-  $isTextNode,
-  LexicalNode,
-} from "lexical";
-
-import {
-  $createImageNode,
-  $isImageNode,
-  ImageNode,
-} from "../../nodes/ImageNode";
-
-export const HR: ElementTransformer = {
-  dependencies: [HorizontalRuleNode],
-  export: (node: LexicalNode) => {
-    return $isHorizontalRuleNode(node) ? "***" : null;
-  },
-  regExp: /^(---|\*\*\*|___)\s?$/,
-  replace: (parentNode, _1, _2, isImport) => {
-    const line = $createHorizontalRuleNode();
-
-    // TODO: Get rid of isImport flag
-    if (isImport || parentNode.getNextSibling() != null) {
-      parentNode.replace(line);
-    } else {
-      parentNode.insertBefore(line);
-    }
-
-    line.selectNext();
-  },
-  type: "element",
-};
-
-export const IMAGE: TextMatchTransformer = {
-  dependencies: [ImageNode],
-  export: (node) => {
-    if (!$isImageNode(node)) {
-      return null;
-    }
-
-    return `![${node.getAltText()}](${node.getSrc()})`;
-  },
-  importRegExp: /!(?:\[([^[]*)\])(?:\(([^(]+)\))/,
-  regExp: /!(?:\[([^[]*)\])(?:\(([^(]+)\))$/,
-  replace: (textNode, match) => {
-    const [, altText, src] = match;
-    const imageNode = $createImageNode({
-      altText,
-      maxWidth: 800,
-      src,
-    });
-    textNode.replace(imageNode);
-  },
-  trigger: ")",
-  type: "text-match",
-};
-
-
-
-// export const EQUATION: TextMatchTransformer = {
-//   dependencies: [EquationNode],
-//   export: (node) => {
-//     if (!$isEquationNode(node)) {
-//       return null;
-//     }
-
-//     return `$${node.getEquation()}$`;
-//   },
-//   importRegExp: /\$([^$]+?)\$/,
-//   regExp: /\$([^$]+?)\$$/,
-//   replace: (textNode, match) => {
-//     const [, equation] = match;
-//     const equationNode = $createEquationNode(equation, true);
-//     textNode.replace(equationNode);
-//   },
-//   trigger: "$",
-//   type: "text-match",
-// };
-
-// export const TWEET: ElementTransformer = {
-//   dependencies: [TweetNode],
-//   export: (node) => {
-//     if (!$isTweetNode(node)) {
-//       return null;
-//     }
-
-//     return `<tweet id="${node.getId()}" />`;
-//   },
-//   regExp: /<tweet id="([^"]+?)"\s?\/>\s?$/,
-//   replace: (textNode, _1, match) => {
-//     const [, id] = match;
-//     const tweetNode = $createTweetNode(id);
-//     textNode.replace(tweetNode);
-//   },
-//   type: "element",
-// };
-
-// Very primitive table setup
-const TABLE_ROW_REG_EXP = /^(?:\|)(.+)(?:\|)\s?$/;
-const TABLE_ROW_DIVIDER_REG_EXP = /^(\| ?:?-*:? ?)+\|\s?$/;
-
-export const TABLE: ElementTransformer = {
-  dependencies: [TableNode, TableRowNode, TableCellNode],
-  export: (node: LexicalNode) => {
-    if (!$isTableNode(node)) {
-      return null;
-    }
-
-    const output: string[] = [];
-
-    for (const row of node.getChildren()) {
-      const rowOutput = [];
-      if (!$isTableRowNode(row)) {
-        continue;
-      }
-
-      let isHeaderRow = false;
-      for (const cell of row.getChildren()) {
-        // It's TableCellNode so it's just to make flow happy
-        if ($isTableCellNode(cell)) {
-          rowOutput.push(
-            $convertToMarkdownString(PLAYGROUND_TRANSFORMERS, cell)
-              .replace(/\n/g, "\\n")
-              .trim()
-          );
-          if (cell.__headerState === TableCellHeaderStates.ROW) {
-            isHeaderRow = true;
-          }
-        }
-      }
-
-      output.push(`| ${rowOutput.join(" | ")} |`);
-      if (isHeaderRow) {
-        output.push(`| ${rowOutput.map((_) => "---").join(" | ")} |`);
-      }
-    }
-
-    return output.join("\n");
-  },
-  regExp: TABLE_ROW_REG_EXP,
-  replace: (parentNode, _1, match) => {
-    // Header row
-    if (TABLE_ROW_DIVIDER_REG_EXP.test(match[0])) {
-      const table = parentNode.getPreviousSibling();
-      if (!table || !$isTableNode(table)) {
-        return;
-      }
-
-      const rows = table.getChildren();
-      const lastRow = rows[rows.length - 1];
-      if (!lastRow || !$isTableRowNode(lastRow)) {
-        return;
-      }
-
-      // Add header state to row cells
-      lastRow.getChildren().forEach((cell) => {
-        if (!$isTableCellNode(cell)) {
-          return;
-        }
-        cell.setHeaderStyles(
-          TableCellHeaderStates.ROW,
-          TableCellHeaderStates.ROW
-        );
-      });
-
-      // Remove line
-      parentNode.remove();
-      return;
-    }
-
-    const matchCells = mapToTableCells(match[0]);
-
-    if (matchCells == null) {
-      return;
-    }
-
-    const rows = [matchCells];
-    let sibling = parentNode.getPreviousSibling();
-    let maxCells = matchCells.length;
-
-    while (sibling) {
-      if (!$isParagraphNode(sibling)) {
-        break;
-      }
-
-      if (sibling.getChildrenSize() !== 1) {
-        break;
-      }
-
-      const firstChild = sibling.getFirstChild();
-
-      if (!$isTextNode(firstChild)) {
-        break;
-      }
-
-      const cells = mapToTableCells(firstChild.getTextContent());
-
-      if (cells == null) {
-        break;
-      }
-
-      maxCells = Math.max(maxCells, cells.length);
-      rows.unshift(cells);
-      const previousSibling = sibling.getPreviousSibling();
-      sibling.remove();
-      sibling = previousSibling;
-    }
-
-    const table = $createTableNode();
-
-    for (const cells of rows) {
-      const tableRow = $createTableRowNode();
-      table.append(tableRow);
-
-      for (let i = 0; i < maxCells; i++) {
-        tableRow.append(i < cells.length ? cells[i] : $createTableCell(""));
-      }
-    }
-
-    const previousSibling = parentNode.getPreviousSibling();
-    if (
-      $isTableNode(previousSibling) &&
-      getTableColumnsSize(previousSibling) === maxCells
-    ) {
-      previousSibling.append(...table.getChildren());
-      parentNode.remove();
-    } else {
-      parentNode.replace(table);
-    }
-
-    table.selectEnd();
-  },
-  type: "element",
-};
-
-function getTableColumnsSize(table: TableNode) {
-  const row = table.getFirstChild();
-  return $isTableRowNode(row) ? row.getChildrenSize() : 0;
-}
-
-const $createTableCell = (textContent: string): TableCellNode => {
-  textContent = textContent.replace(/\\n/g, "\n");
-  const cell = $createTableCellNode(TableCellHeaderStates.NO_STATUS);
-  $convertFromMarkdownString(textContent, PLAYGROUND_TRANSFORMERS, cell);
-  return cell;
-};
-
-const mapToTableCells = (textContent: string): Array<TableCellNode> | null => {
-  const match = textContent.match(TABLE_ROW_REG_EXP);
-  if (!match || !match[1]) {
-    return null;
-  }
-  return match[1].split("|").map((text) => $createTableCell(text));
-};
-
-export const PLAYGROUND_TRANSFORMERS: Array<Transformer> = [
-  TABLE,
-  HR,
-  IMAGE,
-  // TWEET,
-  CHECK_LIST,
-  ...ELEMENT_TRANSFORMERS,
-  ...MULTILINE_ELEMENT_TRANSFORMERS,
-  ...TEXT_FORMAT_TRANSFORMERS,
-  ...TEXT_MATCH_TRANSFORMERS,
-];

package/src/components/editor/plugins/PollPlugin/index.tsx

@@ -1,49 +0,0 @@
-
-import {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext';
-import {$wrapNodeInElement} from '@lexical/utils';
-import {
-  $createParagraphNode,
-  $insertNodes,
-  $isRootOrShadowRoot,
-  COMMAND_PRIORITY_EDITOR,
-  createCommand,
-  LexicalCommand,
-} from 'lexical';
-import {useEffect} from 'react';
-import * as React from 'react';
-import { $createPollNode, createPollOption, PollNode } from '../../nodes/PollNode';
-
-
-
-export const INSERT_POLL_COMMAND: LexicalCommand<string> = createCommand(
-  'INSERT_POLL_COMMAND',
-);
-
-
-
-export default function PollPlugin(): React.JSX.Element | null {
-  const [editor] = useLexicalComposerContext();
-  useEffect(() => {
-    if (!editor.hasNodes([PollNode])) {
-      throw new Error('PollPlugin: PollNode not registered on editor');
-    }
-
-    return editor.registerCommand<string>(
-      INSERT_POLL_COMMAND,
-      (payload) => {
-        const pollNode = $createPollNode(payload, [
-          createPollOption(),
-          createPollOption(),
-        ]);
-        $insertNodes([pollNode]);
-        if ($isRootOrShadowRoot(pollNode.getParentOrThrow())) {
-          $wrapNodeInElement(pollNode, $createParagraphNode).selectEnd();
-        }
-
-        return true;
-      },
-      COMMAND_PRIORITY_EDITOR,
-    );
-  }, [editor]);
-  return null;
-}

package/src/components/editor/plugins/ShortcutsPlugin/index.tsx

@@ -1,180 +0,0 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-import {TOGGLE_LINK_COMMAND} from '@lexical/link';
-import {HeadingTagType} from '@lexical/rich-text';
-import {
-  COMMAND_PRIORITY_NORMAL,
-  FORMAT_ELEMENT_COMMAND,
-  FORMAT_TEXT_COMMAND,
-  INDENT_CONTENT_COMMAND,
-  KEY_MODIFIER_COMMAND,
-  LexicalEditor,
-  OUTDENT_CONTENT_COMMAND,
-} from 'lexical';
-import {Dispatch, useEffect} from 'react';
-
-import {sanitizeUrl} from '../../utils/url';
-import {
-  clearFormatting,
-  formatBulletList,
-  formatCheckList,
-  formatCode,
-  formatHeading,
-  formatNumberedList,
-  formatParagraph,
-  formatQuote,
-  updateFontSize,
-  UpdateFontSizeType,
-} from '@/components/editor/utils/editorFormatting';
-import {
-  isCapitalize,
-  isCenterAlign,
-  isClearFormatting,
-  isDecreaseFontSize,
-  isFormatBulletList,
-  isFormatCheckList,
-  isFormatCode,
-  isFormatHeading,
-  isFormatNumberedList,
-  isFormatParagraph,
-  isFormatQuote,
-  isIncreaseFontSize,
-  isIndent,
-  isInsertCodeBlock,
-  isInsertLink,
-  isJustifyAlign,
-  isLeftAlign,
-  isLowercase,
-  isOutdent,
-  isRightAlign,
-  isStrikeThrough,
-  isSubscript,
-  isSuperscript,
-  isUppercase,
-} from './shortcuts';
-import { useToolbarState } from '@/components/providers/ToolbarContext';
-
-export default function ShortcutsPlugin({
-  editor,
-  setIsLinkEditMode,
-}: {
-  editor: LexicalEditor;
-  setIsLinkEditMode: Dispatch<boolean>;
-}): null {
-  const {toolbarState} = useToolbarState();
-
-  useEffect(() => {
-    const keyboardShortcutsHandler = (payload: KeyboardEvent) => {
-      const event: KeyboardEvent = payload;
-
-      if (isFormatParagraph(event)) {
-        event.preventDefault();
-        formatParagraph(editor);
-      } else if (isFormatHeading(event)) {
-        event.preventDefault();
-        const {code} = event;
-        const headingSize = `h${code[code.length - 1]}` as HeadingTagType;
-        formatHeading(editor, toolbarState.blockType, headingSize);
-      } else if (isFormatBulletList(event)) {
-        event.preventDefault();
-        formatBulletList(editor, toolbarState.blockType);
-      } else if (isFormatNumberedList(event)) {
-        event.preventDefault();
-        formatNumberedList(editor, toolbarState.blockType);
-      } else if (isFormatCheckList(event)) {
-        event.preventDefault();
-        formatCheckList(editor, toolbarState.blockType);
-      } else if (isFormatCode(event)) {
-        event.preventDefault();
-        formatCode(editor, toolbarState.blockType);
-      } else if (isFormatQuote(event)) {
-        event.preventDefault();
-        formatQuote(editor, toolbarState.blockType);
-      } else if (isStrikeThrough(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough');
-      } else if (isLowercase(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'lowercase');
-      } else if (isUppercase(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'uppercase');
-      } else if (isCapitalize(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'capitalize');
-      } else if (isIndent(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(INDENT_CONTENT_COMMAND, undefined);
-      } else if (isOutdent(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(OUTDENT_CONTENT_COMMAND, undefined);
-      } else if (isCenterAlign(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'center');
-      } else if (isLeftAlign(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'left');
-      } else if (isRightAlign(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'right');
-      } else if (isJustifyAlign(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'justify');
-      } else if (isSubscript(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'subscript');
-      } else if (isSuperscript(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'superscript');
-      } else if (isInsertCodeBlock(event)) {
-        event.preventDefault();
-        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'code');
-      } else if (isIncreaseFontSize(event)) {
-        event.preventDefault();
-        updateFontSize(
-          editor,
-          UpdateFontSizeType.increment,
-          toolbarState.fontSizeInputValue,
-        );
-      } else if (isDecreaseFontSize(event)) {
-        event.preventDefault();
-        updateFontSize(
-          editor,
-          UpdateFontSizeType.decrement,
-          toolbarState.fontSizeInputValue,
-        );
-      } else if (isClearFormatting(event)) {
-        event.preventDefault();
-        clearFormatting(editor);
-      } else if (isInsertLink(event)) {
-        event.preventDefault();
-        const url = toolbarState.isLink ? null : sanitizeUrl('https://');
-        setIsLinkEditMode(!toolbarState.isLink);
-
-        editor.dispatchCommand(TOGGLE_LINK_COMMAND, url);
-      }
-
-      return false;
-    };
-
-    return editor.registerCommand(
-      KEY_MODIFIER_COMMAND,
-      keyboardShortcutsHandler,
-      COMMAND_PRIORITY_NORMAL,
-    );
-  }, [
-    editor,
-    toolbarState.isLink,
-    toolbarState.blockType,
-    toolbarState.fontSizeInputValue,
-    setIsLinkEditMode,
-  ]);
-
-  return null;
-}