doclific 0.2.0 → 0.2.2

package/frontend/src/components/editor/plugins/code-block-kit.tsx

@@ -1,26 +0,0 @@
-'use client';
-
-import {
-  CodeBlockPlugin,
-  CodeLinePlugin,
-  CodeSyntaxPlugin,
-} from '@platejs/code-block/react';
-import { all, createLowlight } from 'lowlight';
-
-import {
-  CodeBlockElement,
-  CodeLineElement,
-  CodeSyntaxLeaf,
-} from '@/components/ui/code-block-node';
-
-const lowlight = createLowlight(all);
-
-export const CodeBlockKit = [
-  CodeBlockPlugin.configure({
-    node: { component: CodeBlockElement },
-    options: { lowlight },
-    shortcuts: { toggle: { keys: 'mod+alt+8' } },
-  }),
-  CodeLinePlugin.withComponent(CodeLineElement),
-  CodeSyntaxPlugin.withComponent(CodeSyntaxLeaf),
-];

package/frontend/src/components/editor/plugins/codebase-kit.tsx

@@ -1,23 +0,0 @@
-import { createPlatePlugin } from "platejs/react";
-import { CodebaseSnippetElement } from "@/components/ui/codebase-snippet-node";
-
-export const CodebaseSnippetType = 'CodebaseSnippet';
-
-export interface CodebaseSnippetElementType {
-    type: typeof CodebaseSnippetType;
-    filePath?: string;
-    lineStart?: string;
-    lineEnd?: string;
-    children: [{ text: '' }];
-    [key: string]: any;
-}
-
-
-export const CodebaseSnippetPlugin = createPlatePlugin({
-    key: CodebaseSnippetType,
-    node: {
-        isElement: true,
-        isVoid: true,
-        component: CodebaseSnippetElement
-    }
-})

package/frontend/src/components/editor/plugins/column-base-kit.tsx

@@ -1,11 +0,0 @@
-import { BaseColumnItemPlugin, BaseColumnPlugin } from '@platejs/layout';
-
-import {
-  ColumnElementStatic,
-  ColumnGroupElementStatic,
-} from '@/components/ui/column-node-static';
-
-export const BaseColumnKit = [
-  BaseColumnPlugin.withComponent(ColumnGroupElementStatic),
-  BaseColumnItemPlugin.withComponent(ColumnElementStatic),
-];

package/frontend/src/components/editor/plugins/column-kit.tsx

@@ -1,10 +0,0 @@
-'use client';
-
-import { ColumnItemPlugin, ColumnPlugin } from '@platejs/layout/react';
-
-import { ColumnElement, ColumnGroupElement } from '@/components/ui/column-node';
-
-export const ColumnKit = [
-  ColumnPlugin.withComponent(ColumnGroupElement),
-  ColumnItemPlugin.withComponent(ColumnElement),
-];

package/frontend/src/components/editor/plugins/comment-base-kit.tsx

@@ -1,7 +0,0 @@
-import { BaseCommentPlugin } from '@platejs/comment';
-
-import { CommentLeafStatic } from '@/components/ui/comment-node-static';
-
-export const BaseCommentKit = [
-  BaseCommentPlugin.withComponent(CommentLeafStatic),
-];

package/frontend/src/components/editor/plugins/comment-kit.tsx

@@ -1,97 +0,0 @@
-'use client';
-
-import type { ExtendConfig, Path } from 'platejs';
-
-import {
-  type BaseCommentConfig,
-  BaseCommentPlugin,
-  getDraftCommentKey,
-} from '@platejs/comment';
-import { isSlateString } from 'platejs';
-import { toTPlatePlugin } from 'platejs/react';
-
-import { CommentLeaf } from '@/components/ui/comment-node';
-
-type CommentConfig = ExtendConfig<
-  BaseCommentConfig,
-  {
-    activeId: string | null;
-    commentingBlock: Path | null;
-    hoverId: string | null;
-    uniquePathMap: Map<string, Path>;
-  }
->;
-
-export const commentPlugin = toTPlatePlugin<CommentConfig>(BaseCommentPlugin, {
-  handlers: {
-    onClick: ({ api, event, setOption, type }) => {
-      let leaf = event.target as HTMLElement;
-      let isSet = false;
-
-      const unsetActiveSuggestion = () => {
-        setOption('activeId', null);
-        isSet = true;
-      };
-
-      if (!isSlateString(leaf)) unsetActiveSuggestion();
-
-      while (leaf.parentElement) {
-        if (leaf.classList.contains(`slate-${type}`)) {
-          const commentsEntry = api.comment!.node();
-
-          if (!commentsEntry) {
-            unsetActiveSuggestion();
-
-            break;
-          }
-
-          const id = api.comment!.nodeId(commentsEntry[0]);
-
-          setOption('activeId', id ?? null);
-          isSet = true;
-
-          break;
-        }
-
-        leaf = leaf.parentElement;
-      }
-
-      if (!isSet) unsetActiveSuggestion();
-    },
-  },
-  options: {
-    activeId: null,
-    commentingBlock: null,
-    hoverId: null,
-    uniquePathMap: new Map(),
-  },
-})
-  .extendTransforms(
-    ({
-      editor,
-      setOption,
-      tf: {
-        comment: { setDraft },
-      },
-    }) => ({
-      setDraft: () => {
-        if (editor.api.isCollapsed()) {
-          editor.tf.select(editor.api.block()![1]);
-        }
-
-        setDraft();
-
-        editor.tf.collapse();
-        setOption('activeId', getDraftCommentKey());
-        setOption('commentingBlock', editor.selection!.focus.path.slice(0, 1));
-      },
-    })
-  )
-  .configure({
-    node: { component: CommentLeaf },
-    shortcuts: {
-      setDraft: { keys: 'mod+shift+m' },
-    },
-  });
-
-export const CommentKit = [commentPlugin];

package/frontend/src/components/editor/plugins/cursor-overlay-kit.tsx

@@ -1,13 +0,0 @@
-'use client';
-
-import { CursorOverlayPlugin } from '@platejs/selection/react';
-
-import { CursorOverlay } from '@/components/ui/cursor-overlay';
-
-export const CursorOverlayKit = [
-  CursorOverlayPlugin.configure({
-    render: {
-      afterEditable: () => <CursorOverlay />,
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/date-base-kit.tsx

@@ -1,5 +0,0 @@
-import { BaseDatePlugin } from '@platejs/date';
-
-import { DateElementStatic } from '@/components/ui/date-node-static';
-
-export const BaseDateKit = [BaseDatePlugin.withComponent(DateElementStatic)];

package/frontend/src/components/editor/plugins/date-kit.tsx

@@ -1,7 +0,0 @@
-'use client';
-
-import { DatePlugin } from '@platejs/date/react';
-
-import { DateElement } from '@/components/ui/date-node';
-
-export const DateKit = [DatePlugin.withComponent(DateElement)];

package/frontend/src/components/editor/plugins/discussion-kit.tsx

@@ -1,148 +0,0 @@
-'use client';
-
-import type { TComment } from '@/components/ui/comment';
-
-import { createPlatePlugin } from 'platejs/react';
-
-import { BlockDiscussion } from '@/components/ui/block-discussion';
-
-export type TDiscussion = {
-  id: string;
-  comments: TComment[];
-  createdAt: Date;
-  isResolved: boolean;
-  userId: string;
-  documentContent?: string;
-};
-
-const discussionsData: TDiscussion[] = [
-  {
-    id: 'discussion1',
-    comments: [
-      {
-        id: 'comment1',
-        contentRich: [
-          {
-            children: [
-              {
-                text: 'Comments are a great way to provide feedback and discuss changes.',
-              },
-            ],
-            type: 'p',
-          },
-        ],
-        createdAt: new Date(Date.now() - 600_000),
-        discussionId: 'discussion1',
-        isEdited: false,
-        userId: 'charlie',
-      },
-      {
-        id: 'comment2',
-        contentRich: [
-          {
-            children: [
-              {
-                text: 'Agreed! The link to the docs makes it easy to learn more.',
-              },
-            ],
-            type: 'p',
-          },
-        ],
-        createdAt: new Date(Date.now() - 500_000),
-        discussionId: 'discussion1',
-        isEdited: false,
-        userId: 'bob',
-      },
-    ],
-    createdAt: new Date(),
-    documentContent: 'comments',
-    isResolved: false,
-    userId: 'charlie',
-  },
-  {
-    id: 'discussion2',
-    comments: [
-      {
-        id: 'comment1',
-        contentRich: [
-          {
-            children: [
-              {
-                text: 'Nice demonstration of overlapping annotations with both comments and suggestions!',
-              },
-            ],
-            type: 'p',
-          },
-        ],
-        createdAt: new Date(Date.now() - 300_000),
-        discussionId: 'discussion2',
-        isEdited: false,
-        userId: 'bob',
-      },
-      {
-        id: 'comment2',
-        contentRich: [
-          {
-            children: [
-              {
-                text: 'This helps users understand how powerful the editor can be.',
-              },
-            ],
-            type: 'p',
-          },
-        ],
-        createdAt: new Date(Date.now() - 200_000),
-        discussionId: 'discussion2',
-        isEdited: false,
-        userId: 'charlie',
-      },
-    ],
-    createdAt: new Date(),
-    documentContent: 'overlapping',
-    isResolved: false,
-    userId: 'bob',
-  },
-];
-
-const avatarUrl = (seed: string) =>
-  `https://api.dicebear.com/9.x/glass/svg?seed=${seed}`;
-
-const usersData: Record<
-  string,
-  { id: string; avatarUrl: string; name: string; hue?: number }
-> = {
-  alice: {
-    id: 'alice',
-    avatarUrl: avatarUrl('alice6'),
-    name: 'Alice',
-  },
-  bob: {
-    id: 'bob',
-    avatarUrl: avatarUrl('bob4'),
-    name: 'Bob',
-  },
-  charlie: {
-    id: 'charlie',
-    avatarUrl: avatarUrl('charlie2'),
-    name: 'Charlie',
-  },
-};
-
-// This plugin is purely UI. It's only used to store the discussions and users data
-export const discussionPlugin = createPlatePlugin({
-  key: 'discussion',
-  options: {
-    currentUserId: 'alice',
-    discussions: discussionsData,
-    users: usersData,
-  },
-})
-  .configure({
-    render: { aboveNodes: BlockDiscussion },
-  })
-  .extendSelectors(({ getOption }) => ({
-    currentUser: () => getOption('users')[getOption('currentUserId')],
-    user: (id: string) => getOption('users')[id],
-  }));
-
-export const DiscussionKit = [discussionPlugin];

package/frontend/src/components/editor/plugins/dnd-kit.tsx

@@ -1,28 +0,0 @@
-'use client';
-
-import { DndProvider } from 'react-dnd';
-import { HTML5Backend } from 'react-dnd-html5-backend';
-
-import { DndPlugin } from '@platejs/dnd';
-import { PlaceholderPlugin } from '@platejs/media/react';
-
-import { BlockDraggable } from '@/components/ui/block-draggable';
-
-export const DndKit = [
-  DndPlugin.configure({
-    options: {
-      enableScroller: true,
-      onDropFiles: ({ dragItem, editor, target }) => {
-        editor
-          .getTransforms(PlaceholderPlugin)
-          .insert.media(dragItem.files, { at: target, nextBlock: false });
-      },
-    },
-    render: {
-      aboveNodes: BlockDraggable,
-      aboveSlate: ({ children }) => (
-        <DndProvider backend={HTML5Backend}>{children}</DndProvider>
-      ),
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/docx-kit.tsx

@@ -1,6 +0,0 @@
-'use client';
-
-import { DocxPlugin } from '@platejs/docx';
-import { JuicePlugin } from '@platejs/juice';
-
-export const DocxKit = [DocxPlugin, JuicePlugin];

package/frontend/src/components/editor/plugins/emoji-kit.tsx

@@ -1,13 +0,0 @@
-'use client';
-
-import emojiMartData from '@emoji-mart/data';
-import { EmojiInputPlugin, EmojiPlugin } from '@platejs/emoji/react';
-
-import { EmojiInputElement } from '@/components/ui/emoji-node';
-
-export const EmojiKit = [
-  EmojiPlugin.configure({
-    options: { data: emojiMartData as any },
-  }),
-  EmojiInputPlugin.withComponent(EmojiInputElement),
-];

package/frontend/src/components/editor/plugins/excalidraw-kit.tsx

@@ -1,9 +0,0 @@
-'use client';
-
-import { ExcalidrawPlugin } from '@platejs/excalidraw/react';
-
-import { ExcalidrawElement } from '@/components/ui/excalidraw-node';
-
-export const ExcalidrawKit = [
-  ExcalidrawPlugin.withComponent(ExcalidrawElement),
-];

package/frontend/src/components/editor/plugins/exit-break-kit.tsx

@@ -1,12 +0,0 @@
-'use client';
-
-import { ExitBreakPlugin } from 'platejs';
-
-export const ExitBreakKit = [
-  ExitBreakPlugin.configure({
-    shortcuts: {
-      insert: { keys: 'mod+enter' },
-      insertBefore: { keys: 'mod+shift+enter' },
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/floating-toolbar-kit.tsx

@@ -1,19 +0,0 @@
-'use client';
-
-import { createPlatePlugin } from 'platejs/react';
-
-import { FloatingToolbar } from '@/components/ui/floating-toolbar';
-import { FloatingToolbarButtons } from '@/components/ui/floating-toolbar-buttons';
-
-export const FloatingToolbarKit = [
-  createPlatePlugin({
-    key: 'floating-toolbar',
-    render: {
-      afterEditable: () => (
-        <FloatingToolbar>
-          <FloatingToolbarButtons />
-        </FloatingToolbar>
-      ),
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/font-base-kit.tsx

@@ -1,20 +0,0 @@
-import type { SlatePluginConfig } from 'platejs';
-
-import {
-  BaseFontBackgroundColorPlugin,
-  BaseFontColorPlugin,
-  BaseFontFamilyPlugin,
-  BaseFontSizePlugin,
-} from '@platejs/basic-styles';
-import { KEYS } from 'platejs';
-
-const options = {
-  inject: { targetPlugins: [KEYS.p] },
-} satisfies SlatePluginConfig;
-
-export const BaseFontKit = [
-  BaseFontColorPlugin.configure(options),
-  BaseFontBackgroundColorPlugin.configure(options),
-  BaseFontSizePlugin.configure(options),
-  BaseFontFamilyPlugin.configure(options),
-];

package/frontend/src/components/editor/plugins/font-kit.tsx

@@ -1,29 +0,0 @@
-'use client';
-
-import type { PlatePluginConfig } from 'platejs/react';
-
-import {
-  FontBackgroundColorPlugin,
-  FontColorPlugin,
-  FontFamilyPlugin,
-  FontSizePlugin,
-} from '@platejs/basic-styles/react';
-import { KEYS } from 'platejs';
-
-const options = {
-  inject: { targetPlugins: [KEYS.p] },
-} satisfies PlatePluginConfig;
-
-export const FontKit = [
-  FontColorPlugin.configure({
-    inject: {
-      ...options.inject,
-      nodeProps: {
-        defaultNodeValue: 'black',
-      },
-    },
-  }),
-  FontBackgroundColorPlugin.configure(options),
-  FontSizePlugin.configure(options),
-  FontFamilyPlugin.configure(options),
-];

package/frontend/src/components/editor/plugins/indent-base-kit.tsx

@@ -1,19 +0,0 @@
-import { BaseIndentPlugin } from '@platejs/indent';
-import { KEYS } from 'platejs';
-
-export const BaseIndentKit = [
-  BaseIndentPlugin.configure({
-    inject: {
-      targetPlugins: [
-        ...KEYS.heading,
-        KEYS.p,
-        KEYS.blockquote,
-        KEYS.codeBlock,
-        KEYS.toggle,
-      ],
-    },
-    options: {
-      offset: 24,
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/indent-kit.tsx

@@ -1,22 +0,0 @@
-'use client';
-
-import { IndentPlugin } from '@platejs/indent/react';
-import { KEYS } from 'platejs';
-
-export const IndentKit = [
-  IndentPlugin.configure({
-    inject: {
-      targetPlugins: [
-        ...KEYS.heading,
-        KEYS.p,
-        KEYS.blockquote,
-        KEYS.codeBlock,
-        KEYS.toggle,
-        KEYS.img,
-      ],
-    },
-    options: {
-      offset: 24,
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/line-height-base-kit.tsx

@@ -1,14 +0,0 @@
-import { BaseLineHeightPlugin } from '@platejs/basic-styles';
-import { KEYS } from 'platejs';
-
-export const BaseLineHeightKit = [
-  BaseLineHeightPlugin.configure({
-    inject: {
-      nodeProps: {
-        defaultNodeValue: 1.5,
-        validNodeValues: [1, 1.2, 1.5, 2, 3],
-      },
-      targetPlugins: [...KEYS.heading, KEYS.p],
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/line-height-kit.tsx

@@ -1,16 +0,0 @@
-'use client';
-
-import { LineHeightPlugin } from '@platejs/basic-styles/react';
-import { KEYS } from 'platejs';
-
-export const LineHeightKit = [
-  LineHeightPlugin.configure({
-    inject: {
-      nodeProps: {
-        defaultNodeValue: 1.5,
-        validNodeValues: [1, 1.2, 1.5, 2, 3],
-      },
-      targetPlugins: [...KEYS.heading, KEYS.p],
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/link-base-kit.tsx

@@ -1,5 +0,0 @@
-import { BaseLinkPlugin } from '@platejs/link';
-
-import { LinkElementStatic } from '@/components/ui/link-node-static';
-
-export const BaseLinkKit = [BaseLinkPlugin.withComponent(LinkElementStatic)];

package/frontend/src/components/editor/plugins/link-kit.tsx

@@ -1,15 +0,0 @@
-'use client';
-
-import { LinkPlugin } from '@platejs/link/react';
-
-import { LinkElement } from '@/components/ui/link-node';
-import { LinkFloatingToolbar } from '@/components/ui/link-toolbar';
-
-export const LinkKit = [
-  LinkPlugin.configure({
-    render: {
-      node: LinkElement,
-      afterEditable: () => <LinkFloatingToolbar />,
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/list-base-kit.tsx

@@ -1,23 +0,0 @@
-import { BaseListPlugin } from '@platejs/list';
-import { KEYS } from 'platejs';
-
-import { BaseIndentKit } from '@/components/editor/plugins/indent-base-kit';
-import { BlockListStatic } from '@/components/ui/block-list-static';
-
-export const BaseListKit = [
-  ...BaseIndentKit,
-  BaseListPlugin.configure({
-    inject: {
-      targetPlugins: [
-        ...KEYS.heading,
-        KEYS.p,
-        KEYS.blockquote,
-        KEYS.codeBlock,
-        KEYS.toggle,
-      ],
-    },
-    render: {
-      belowNodes: BlockListStatic,
-    },
-  }),
-];

package/frontend/src/components/editor/plugins/list-kit.tsx

@@ -1,26 +0,0 @@
-'use client';
-
-import { ListPlugin } from '@platejs/list/react';
-import { KEYS } from 'platejs';
-
-import { IndentKit } from '@/components/editor/plugins/indent-kit';
-import { BlockList } from '@/components/ui/block-list';
-
-export const ListKit = [
-  ...IndentKit,
-  ListPlugin.configure({
-    inject: {
-      targetPlugins: [
-        ...KEYS.heading,
-        KEYS.p,
-        KEYS.blockquote,
-        KEYS.codeBlock,
-        KEYS.toggle,
-        KEYS.img,
-      ],
-    },
-    render: {
-      belowNodes: BlockList,
-    },
-  }),
-];