@collabchron/notiq 0.3.0 → 1.0.0

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

@@ -1,179 +0,0 @@
-
-import type {
-  DOMConversionMap,
-  DOMConversionOutput,
-  DOMExportOutput,
-  EditorConfig,
-  ElementFormatType,
-  LexicalEditor,
-  LexicalNode,
-  NodeKey,
-  Spread,
-} from 'lexical';
-
-import { BlockWithAlignableContents } from '@lexical/react/LexicalBlockWithAlignableContents';
-import {
-  DecoratorBlockNode,
-  SerializedDecoratorBlockNode,
-} from '@lexical/react/LexicalDecoratorBlockNode';
-import * as React from 'react';
-
-type YouTubeComponentProps = Readonly<{
-  className: Readonly<{
-    base: string;
-    focus: string;
-  }>;
-  format: ElementFormatType | null;
-  nodeKey: NodeKey;
-  videoID: string;
-}>;
-
-function YouTubeComponent({
-  className,
-  format,
-  nodeKey,
-  videoID,
-}: YouTubeComponentProps) {
-  return (
-    <BlockWithAlignableContents
-      className={className}
-      format={format}
-      nodeKey={nodeKey}>
-      <iframe
-        width="560"
-        height="315"
-        style={{
-          width: "100%",
-          aspectRatio: "16/9",
-          borderRadius: "8px",
-          border: "4px solid #e6c10aff"
-        }}
-        src={`https://www.youtube-nocookie.com/embed/${videoID}`}
-        frameBorder="0"
-        allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
-        allowFullScreen={true}
-        title="YouTube video"
-      />
-    </BlockWithAlignableContents>
-  );
-}
-
-export type SerializedYouTubeNode = Spread<
-  {
-    videoID: string;
-  },
-  SerializedDecoratorBlockNode
->;
-
-function $convertYoutubeElement(
-  domNode: HTMLElement,
-): null | DOMConversionOutput {
-  const videoID = domNode.getAttribute('data-lexical-youtube');
-  if (videoID) {
-    const node = $createYouTubeNode(videoID);
-    return { node };
-  }
-  return null;
-}
-
-export class YouTubeNode extends DecoratorBlockNode {
-  __id: string;
-
-  static getType(): string {
-    return 'youtube';
-  }
-
-  static clone(node: YouTubeNode): YouTubeNode {
-    return new YouTubeNode(node.__id, node.__format, node.__key);
-  }
-
-  static importJSON(serializedNode: SerializedYouTubeNode): YouTubeNode {
-    return $createYouTubeNode(serializedNode.videoID).updateFromJSON(
-      serializedNode,
-    );
-  }
-
-  exportJSON(): SerializedYouTubeNode {
-    return {
-      ...super.exportJSON(),
-      videoID: this.__id,
-    };
-  }
-
-  constructor(id: string, format?: ElementFormatType, key?: NodeKey) {
-    super(format, key);
-    this.__id = id;
-  }
-
-  exportDOM(): DOMExportOutput {
-    const element = document.createElement('iframe');
-    element.setAttribute('data-lexical-youtube', this.__id);
-    element.setAttribute('width', '560');
-    element.setAttribute('height', '315');
-    element.setAttribute(
-      'src',
-      `https://www.youtube-nocookie.com/embed/${this.__id}`,
-    );
-    element.setAttribute('frameborder', '0');
-    element.setAttribute(
-      'allow',
-      'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture',
-    );
-    element.setAttribute('allowfullscreen', 'true');
-    element.setAttribute('title', 'YouTube video');
-    return { element };
-  }
-
-  static importDOM(): DOMConversionMap | null {
-    return {
-      iframe: (domNode: HTMLElement) => {
-        if (!domNode.hasAttribute('data-lexical-youtube')) {
-          return null;
-        }
-        return {
-          conversion: $convertYoutubeElement,
-          priority: 1,
-        };
-      },
-    };
-  }
-
-  updateDOM(): false {
-    return false;
-  }
-
-  getId(): string {
-    return this.__id;
-  }
-
-  getTextContent(
-  ): string {
-    return `https://www.youtube.com/watch?v=${this.__id}`;
-  }
-
-  decorate(_editor: LexicalEditor, config: EditorConfig): React.JSX.Element {
-    const embedBlockTheme = config.theme.embedBlock || {};
-    const className = {
-      base: embedBlockTheme.base || '',
-      focus: embedBlockTheme.focus || '',
-    };
-    return (
-      <YouTubeComponent
-        className={className}
-        format={this.__format}
-        nodeKey={this.getKey()}
-        videoID={this.__id}
-      />
-    );
-  }
-}
-
-export function $createYouTubeNode(videoID: string): YouTubeNode {
-  return new YouTubeNode(videoID);
-}
-
-export function $isYouTubeNode(
-  node: YouTubeNode | LexicalNode | null | undefined,
-): node is YouTubeNode {
-  return node instanceof YouTubeNode;
-}

package/src/components/editor/plugins/YouTubePlugin/index.ts

@@ -1,41 +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 {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext';
-import {$insertNodeToNearestRoot} from '@lexical/utils';
-import {COMMAND_PRIORITY_EDITOR, createCommand, LexicalCommand} from 'lexical';
-import {JSX, useEffect} from 'react';
-import { $createYouTubeNode, YouTubeNode } from '../YouTubeNode';
-
-
-export const INSERT_YOUTUBE_COMMAND: LexicalCommand<string> = createCommand(
-  'INSERT_YOUTUBE_COMMAND',
-);
-
-export default function YouTubePlugin(): JSX.Element | null {
-  const [editor] = useLexicalComposerContext();
-
-  useEffect(() => {
-    if (!editor.hasNodes([YouTubeNode])) {
-      throw new Error('YouTubePlugin: YouTubeNode not registered on editor');
-    }
-
-    return editor.registerCommand<string>(
-      INSERT_YOUTUBE_COMMAND,
-      (payload) => {
-        const youTubeNode = $createYouTubeNode(payload);
-        $insertNodeToNearestRoot(youTubeNode);
-
-        return true;
-      },
-      COMMAND_PRIORITY_EDITOR,
-    );
-  }, [editor]);
-
-  return null;
-}

package/src/components/editor/themes/editor-theme.ts

@@ -1,113 +0,0 @@
-
-import type {EditorThemeClasses} from 'lexical';
-
-
-
-import "./theme.css"
-const theme: EditorThemeClasses = {
-  code:`
-  bg-[#e1e1e1] dark:bg-[#1a1a1a] m-0  text-sm  
-  overflow-auto relative pl-[52px]  p-3 font-mono group 
-  rounded-sm  w-full h-fit block  line-code
-  `,
-  codeHighlight: {
-    atrule: 'PlaygroundEditorTheme__tokenAttr',
-    attr: 'PlaygroundEditorTheme__tokenAttr',
-    boolean: 'PlaygroundEditorTheme__tokenProperty',
-    builtin: 'PlaygroundEditorTheme__tokenSelector',
-    cdata: 'PlaygroundEditorTheme__tokenComment',
-    char: 'PlaygroundEditorTheme__tokenSelector',
-    class: 'PlaygroundEditorTheme__tokenFunction',
-    'class-name': 'PlaygroundEditorTheme__tokenFunction',
-    comment: 'PlaygroundEditorTheme__tokenComment',
-    constant: 'PlaygroundEditorTheme__tokenProperty',
-    deleted: 'PlaygroundEditorTheme__tokenProperty',
-    doctype: 'PlaygroundEditorTheme__tokenComment',
-    entity: 'PlaygroundEditorTheme__tokenOperator',
-    function: 'PlaygroundEditorTheme__tokenFunction',
-    important: 'PlaygroundEditorTheme__tokenVariable',
-    inserted: 'PlaygroundEditorTheme__tokenSelector',
-    keyword: 'PlaygroundEditorTheme__tokenAttr',
-    namespace: 'PlaygroundEditorTheme__tokenVariable',
-    number: 'PlaygroundEditorTheme__tokenProperty',
-    operator: 'PlaygroundEditorTheme__tokenOperator',
-    prolog: 'PlaygroundEditorTheme__tokenComment',
-    property: 'PlaygroundEditorTheme__tokenProperty',
-    punctuation: 'PlaygroundEditorTheme__tokenPunctuation',
-    regex: 'PlaygroundEditorTheme__tokenVariable',
-    selector: 'PlaygroundEditorTheme__tokenSelector',
-    string: 'PlaygroundEditorTheme__tokenSelector',
-    symbol: 'PlaygroundEditorTheme__tokenProperty',
-    tag: 'PlaygroundEditorTheme__tokenProperty',
-    url: 'PlaygroundEditorTheme__tokenOperator',
-    variable: 'PlaygroundEditorTheme__tokenVariable',
-  },
-  embedBlock: {
-    base: 'PlaygroundEditorTheme__embedBlock',
-    focus: 'PlaygroundEditorTheme__embedBlockFocus',
-  },
-  list: { 
-    checklist: 'PlaygroundEditorTheme__checklist',
-    listitem: 'PlaygroundEditorTheme__listItem',
-    listitemChecked: 'PlaygroundEditorTheme__listItemChecked',
-    listitemUnchecked: 'PlaygroundEditorTheme__listItemUnchecked',
-    nested: {
-      listitem: 'PlaygroundEditorTheme__nestedListItem',
-    },
-    olDepth: [
-      'PlaygroundEditorTheme__ol1 ',
-      'PlaygroundEditorTheme__ol2',
-      'PlaygroundEditorTheme__ol3',
-      'PlaygroundEditorTheme__ol4',
-      'PlaygroundEditorTheme__ol5',
-    ],
-    ulDepth:[
-      'PlaygroundEditorTheme__ul1',
-      'PlaygroundEditorTheme__ul2',
-      'PlaygroundEditorTheme__ul3',
-      'PlaygroundEditorTheme__ul4',
-      'PlaygroundEditorTheme__ul5'
-    ],
-    ul: 'ul',
-    ol:"ol"
-  },
-  paragraph: 'leading-7',
-  link: `underline cursor-pointer text-blue-600 after:content-['_↗']`,
-  hr: 'w-full h-1  border-input',
-  table: 'PlaygroundEditorTheme__table',
-  tableCell: 'PlaygroundEditorTheme__tableCell',
-  tableCellActionButton: 'PlaygroundEditorTheme__tableCellActionButton',
-  tableCellActionButtonContainer:'PlaygroundEditorTheme__tableCellActionButtonContainer',
-  tableCellHeader: 'PlaygroundEditorTheme__tableCellHeader',
-  tableCellResizer: 'PlaygroundEditorTheme__tableCellResizer',
-  tableCellSelected: 'PlaygroundEditorTheme__tableCellSelected',
-  tableRowStriping: 'PlaygroundEditorTheme__tableRowStriping',
-  tableScrollableWrapper: 'PlaygroundEditorTheme__tableScrollableWrapper',
-  tableSelected: 'PlaygroundEditorTheme__tableSelected',
-  tableSelection: 'PlaygroundEditorTheme__tableSelection',
-  layoutContainer: 'grid gap-[10px] my-[10px] ',
-  layoutItem: 'px-2 py-[16px] border dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-50 border border-zinc-200 bg-white/90 shadow-md  rounded-sm',
-  heading: {
-    h1: "scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl",
-    h2: "scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight first:mt-0",
-    h3: "scroll-m-20 text-2xl font-semibold tracking-tight",
-    h4: "scroll-m-20 text-xl font-semibold tracking-tight",
-    h5: "text-lg font-bold",
-    h6: "text-sm font-bold",
-  },
-  quote:"mt-6 border-l-[4px] pl-6 italic",
-  text: {
-    bold: 'font-bold',
-    capitalize: 'capitalize',
-    code:  "inline-flex items-center rounded-sm border border-zinc-200 px-0.1 py-0  h-fit min-h-[20px] transition-colors focus:outline-none focus:ring-2 focus:ring-zinc-950 focus:ring-offset-2 dark:border-zinc-800 dark:focus:ring-zinc-300 border-transparent bg-zinc-100 text-zinc-900 hover:bg-zinc-100/80 dark:bg-zinc-800 dark:text-zinc-50 dark:hover:bg-zinc-800/80", 
-    italic: 'italic ',
-    lowercase: 'lowercase',
-    strikethrough: 'line-through',
-    underline: 'underline',
-    underlineStrikethrough: 'underline line-through',
-    uppercase: 'uppercase',
-  },
-
-};
-
-export default theme;

package/src/components/editor/themes/theme.css

@@ -1,377 +0,0 @@
-.PlaygroundEditorTheme__table {
-  border-collapse: collapse;
-  border-spacing: 0;
-  overflow-x: auto;
-  table-layout: fixed;
-  display: block;
-  max-width: fit-content;
-  width: 100%;
-  margin: 0px 25px 30px 0px;
-}
-
-.PlaygroundEditorTheme__tableSelection *::selection {
-  background-color: transparent;
-}
-.PlaygroundEditorTheme__tableSelected {
-  outline: 2px solid rgb(60, 132, 244);
-}
-.PlaygroundEditorTheme__tableCell {
-  border: 1px solid #979797;
-  width: 75px;
-  min-width: 75px;
-  vertical-align: top;
-  text-align: start;
-  padding: 6px 8px;
-  position: relative;
-  outline: none;
-}
-.PlaygroundEditorTheme__tableCellSortedIndicator {
-  display: block;
-  opacity: 0.5;
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-
-  height: 4px;
-  background-color: #999;
-}
-.PlaygroundEditorTheme__tableCellResizer {
-  position: absolute;
-  right: -4px;
-  height: 100%;
-  width: 8px;
-  cursor: ew-resize;
-  z-index: 10;
-  top: 0;
-}
-.PlaygroundEditorTheme__tableCellHeader {
-  text-align: start;
-}
-.PlaygroundEditorTheme__tableCellSelected {
-  background-color: #c9dbf0;
-}
-.PlaygroundEditorTheme__tableCellPrimarySelected {
-  border: 2px solid rgb(60, 132, 244);
-  display: block;
-  height: calc(100% - 2px);
-  position: absolute;
-  width: calc(100% - 2px);
-  left: -1px;
-  top: -1px;
-  z-index: 2;
-}
-.PlaygroundEditorTheme__tableCellEditing {
-  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
-  border-radius: 3px;
-}
-.PlaygroundEditorTheme__tableAddColumns {
-  position: absolute;
-  background-color: #eee;
-  height: 100%;
-  animation: table-controls 0.2s ease;
-  border: 0;
-  cursor: pointer;
-}
-.PlaygroundEditorTheme__tableAddColumns:after {
-  background-image: url(/public/images/icons/plus.svg);
-  background-size: contain;
-  background-position: center;
-  background-repeat: no-repeat;
-  display: block;
-  content: " ";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 0.4;
-}
-.PlaygroundEditorTheme__tableAddColumns:hover,
-.PlaygroundEditorTheme__tableAddRows:hover {
-  background-color: #c9dbf0;
-}
-.PlaygroundEditorTheme__tableAddRows {
-  position: absolute;
-  width: calc(100% - 25px);
-  background-color: #eee;
-  animation: table-controls 0.2s ease;
-  border: 0;
-  cursor: pointer;
-}
-.PlaygroundEditorTheme__tableAddRows:after {
-  background-image: url(/public/images/icons/plus.svg);
-  background-size: contain;
-  background-position: center;
-  background-repeat: no-repeat;
-  display: block;
-  content: " ";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 0.4;
-}
-@keyframes table-controls {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.PlaygroundEditorTheme__tableCellResizeRuler {
-  display: block;
-  position: absolute;
-  width: 1px;
-  background-color: rgb(60, 132, 244);
-  height: 100%;
-  top: 0;
-}
-.PlaygroundEditorTheme__tableCellActionButtonContainer {
-  display: block;
-  right: 5px;
-  top: 6px;
-  position: absolute;
-  z-index: 4;
-  width: 20px;
-  height: 20px;
-}
-.PlaygroundEditorTheme__tableCellActionButton {
-  background-color: #eee;
-  display: block;
-  border: 0;
-  border-radius: 20px;
-  width: 20px;
-  height: 20px;
-  color: #222;
-  cursor: pointer;
-}
-.PlaygroundEditorTheme__tableCellActionButton:hover {
-  background-color: #ddd;
-}
-
-.PlaygroundEditorTheme__tokenComment {
-  color: slategray;
-}
-.PlaygroundEditorTheme__tokenPunctuation {
-  color: #999;
-}
-.PlaygroundEditorTheme__tokenProperty {
-  color: rgba(226, 113, 175, 0.5);
-}
-.PlaygroundEditorTheme__tokenSelector {
-  color: #690;
-}
-.PlaygroundEditorTheme__tokenOperator {
-  color: #9a6e3a;
-}
-.PlaygroundEditorTheme__tokenAttr {
-  color: #07a;
-}
-.PlaygroundEditorTheme__tokenVariable {
-  color: #e90;
-}
-.PlaygroundEditorTheme__tokenFunction {
-  color: #e398a7;
-}
-
-.PlaygroundEditorTheme__embedBlock {
-  user-select: none;
-}
-.PlaygroundEditorTheme__embedBlockFocus {
-  outline: 2px solid rgb(60, 132, 244);
-}
-
-.line-code{
-  tab-size: 2;
-}
-
-
-.line-code:before {
-  content: attr(data-gutter);
-  position: absolute;
-  background-color:transparent;
-  left: 0;
-  top: 0;
-  height: 100%;
-  border-right: 1px solid rgba(42, 42, 42, 0.158);
-  padding: 8px;
-  color: rgba(0, 0, 0, 0.349);
-  white-space: pre-wrap;
-  text-align: right;
-  min-width: 25px;
-}
-.line-code:before:hover{
-  background: red;
-}
-.dark .line-code:before{
-  border-right: 1px solid #3b3b3b65;
-  color: #777;
-  
-}
-
-.PlaygroundEditorTheme__ul1,
-.PlaygroundEditorTheme__ul2,
-.PlaygroundEditorTheme__ul3,
-.PlaygroundEditorTheme__ul4,
-.PlaygroundEditorTheme__ul5 {
-  padding: 0;
-  margin: 0;
-  list-style-position: inside;
-  
-}
-.PlaygroundEditorTheme__ol1,
-.PlaygroundEditorTheme__ol2,
-.PlaygroundEditorTheme__ol3,
-.PlaygroundEditorTheme__ol4,
-.PlaygroundEditorTheme__ol5 {
-  padding: 0;
-  margin: 0;
-  list-style-position: inside;
-}
-.PlaygroundEditorTheme__listItem {
-  margin: 2px 32px;
-  
-}
-
-
-.PlaygroundEditorTheme__listItemChecked,
-.PlaygroundEditorTheme__listItemUnchecked {
-  position: relative;
-  margin-left: 8px;
-  margin-right: 8px;
-  padding-left: 24px;
-  padding-right: 24px;
-  list-style-type: none;
-  outline: none;
-}
-.ol {
-  list-style-type: decimal;
-}
-
-.ul {
-  list-style-type:disc;
-}
-
-.PlaygroundEditorTheme__listItemChecked {
-  text-decoration: line-through;
-}
-.PlaygroundEditorTheme__listItemUnchecked:before,
-.PlaygroundEditorTheme__listItemChecked:before {
-  content: '';
-  width: 16px;
-  height: 16px;
-  top: 4px;
-  left: 0;
-  cursor: pointer;
-  display: block;
-  background-size: cover;
-  position: absolute;
-}
-.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before,
-.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before {
-  left: auto;
-  right: 0;
-}
-.PlaygroundEditorTheme__listItemUnchecked:focus:before,
-.PlaygroundEditorTheme__listItemChecked:focus:before {
-  box-shadow: 0 0 0 2px #a6cdfe;
-  border-radius: 2px;
-}
-.PlaygroundEditorTheme__listItemUnchecked:before {
-  border: 1px solid #999;
-  border-radius: 2px;
-}
-.PlaygroundEditorTheme__listItemChecked:before {
-  border: 1px solid rgb(61, 135, 245);
-  border-radius: 2px;
-  background-color: #3d87f5;
-  background-repeat: no-repeat;
-}
-.PlaygroundEditorTheme__listItemChecked:after {
-  content: '';
-  cursor: pointer;
-  border-color: #fff;
-  border-style: solid;
-  position: absolute;
-  display: block;
-  top: 9px;
-  width: 3px;
-  left: 7px;
-  right: 7px;
-  height: 6px;
-  transform: rotate(45deg);
-  border-width: 0 2px 2px 0;
-}
-
-.PlaygroundEditorTheme__ol1 {
-  padding: 0;
-  margin: 0;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ol2 {
-  padding: 0;
-  margin: 0;
-  list-style-type: upper-alpha;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ol3 {
-  padding: 0;
-  margin: 0;
-  list-style-type: lower-alpha;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ol4 {
-  padding: 0;
-  margin: 0;
-  list-style-type: upper-roman;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ol5 {
-  padding: 0;
-  margin: 0;
-  list-style-type: lower-roman;
-  list-style-position: outside;
-}
-
-.PlaygroundEditorTheme__ul1 {
-  padding: 0;
-  margin: 0;
-  list-style-type:disc;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ul2 {
-  padding: 0;
-  margin: 0;
-  list-style-type:circle;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ul3 {
-  padding: 0;
-  margin: 0;
-  list-style-type:square;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ul4 {
-  padding: 0;
-  margin: 0;
-  list-style-type:circle;
-  list-style-position: outside;
-}
-.PlaygroundEditorTheme__ul5 {
-  padding: 0;
-  margin: 0;
-  list-style-type:disc;
-  list-style-position: outside;
-}
-
-
-.PlaygroundEditorTheme__nestedListItem {
-  list-style-type: none;
-}
-.PlaygroundEditorTheme__nestedListItem:before,
-.PlaygroundEditorTheme__nestedListItem:after {
-  display: none;
-}