@fuma-content/studio 1.0.0 → 1.0.2

package/src/components/collection/context.tsx

@@ -1,24 +0,0 @@
-"use client";
-import type { ClientContext } from "lib";
-import { createContext, ReactNode, use, useMemo } from "react";
-
-const ClientContext = createContext<Map<string, ClientContext> | null>(null);
-
-export function ClientContextProvider({
-  contexts,
-  children,
-}: {
-  contexts: Map<string, ClientContext>;
-  children: ReactNode;
-}) {
-  const cachedCtx = useMemo(() => contexts, []);
-
-  return <ClientContext value={cachedCtx}>{children}</ClientContext>;
-}
-
-/**
- * you can assume the client context is immutable
- */
-export function useClientContext(collectionId: string): ClientContext {
-  return use(ClientContext)?.get(collectionId) ?? {};
-}

package/src/components/collection/document/actions.tsx

@@ -1,83 +0,0 @@
-"use client";
-import { MoreHorizontalIcon, TrashIcon } from "lucide-react";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { Button } from "@/components/ui/button";
-import {
-  ContextMenu,
-  ContextMenuContent,
-  ContextMenuItem,
-  ContextMenuTrigger,
-} from "@/components/ui/context-menu";
-import { ReactElement } from "react";
-import { documentCollection, type DocumentItem } from "@/lib/data/store";
-import { usePathname, useRouter } from "next/navigation";
-import { isActive } from "@/lib/utils/urls";
-
-export function DocumentActionsDropdown({ document }: { document: DocumentItem }) {
-  const router = useRouter();
-  const pathname = usePathname();
-
-  return (
-    <DropdownMenu>
-      <Button variant="ghost" size="icon" className="text-muted-foreground ms-auto" asChild>
-        <DropdownMenuTrigger aria-label="More Actions">
-          <MoreHorizontalIcon />
-        </DropdownMenuTrigger>
-      </Button>
-      <DropdownMenuContent>
-        {document.permissions.delete && (
-          <DropdownMenuItem
-            variant="destructive"
-            onClick={() => {
-              documentCollection.delete(`${document.collectionId}-${document.id}`);
-              if (isActive(pathname, `/collection/${document.collectionId}/${document.id}`, true)) {
-                router.push(`/collection/${document.collectionId}`);
-              }
-            }}
-          >
-            <TrashIcon />
-            Delete Item
-          </DropdownMenuItem>
-        )}
-      </DropdownMenuContent>
-    </DropdownMenu>
-  );
-}
-
-export function DocumentActionsContext({
-  document,
-  children,
-}: {
-  document: DocumentItem;
-  children: ReactElement;
-}) {
-  const router = useRouter();
-  const pathname = usePathname();
-
-  return (
-    <ContextMenu>
-      <ContextMenuTrigger render={children} />
-      <ContextMenuContent>
-        {document.permissions.delete && (
-          <ContextMenuItem
-            variant="destructive"
-            onClick={() => {
-              documentCollection.delete(`${document.collectionId}-${document.id}`);
-              if (isActive(pathname, `/collection/${document.collectionId}/${document.id}`, true)) {
-                router.push(`/collection/${document.collectionId}`);
-              }
-            }}
-          >
-            <TrashIcon />
-            Delete Item
-          </ContextMenuItem>
-        )}
-      </ContextMenuContent>
-    </ContextMenu>
-  );
-}

package/src/components/editor/editor-base-kit.tsx

@@ -1,37 +0,0 @@
-import { BaseAlignKit } from "./plugins/align-base-kit";
-import { BaseBasicBlocksKit } from "./plugins/basic-blocks-base-kit";
-import { BaseBasicMarksKit } from "./plugins/basic-marks-base-kit";
-import { BaseCalloutKit } from "./plugins/callout-base-kit";
-import { BaseCodeBlockKit } from "./plugins/code-block-base-kit";
-import { BaseColumnKit } from "./plugins/column-base-kit";
-import { BaseCommentKit } from "./plugins/comment-base-kit";
-import { BaseDateKit } from "./plugins/date-base-kit";
-import { BaseFontKit } from "./plugins/font-base-kit";
-import { BaseLineHeightKit } from "./plugins/line-height-base-kit";
-import { BaseLinkKit } from "./plugins/link-base-kit";
-import { BaseListKit } from "./plugins/list-base-kit";
-import { MarkdownKit } from "./plugins/markdown-kit";
-import { BaseMathKit } from "./plugins/math-base-kit";
-import { BaseMediaKit } from "./plugins/media-base-kit";
-import { BaseSuggestionKit } from "./plugins/suggestion-base-kit";
-import { BaseTableKit } from "./plugins/table-base-kit";
-
-export const BaseEditorKit = [
-  ...BaseBasicBlocksKit,
-  ...BaseCodeBlockKit,
-  ...BaseTableKit,
-  ...BaseMediaKit,
-  ...BaseCalloutKit,
-  ...BaseColumnKit,
-  ...BaseMathKit,
-  ...BaseDateKit,
-  ...BaseLinkKit,
-  ...BaseBasicMarksKit,
-  ...BaseFontKit,
-  ...BaseListKit,
-  ...BaseAlignKit,
-  ...BaseLineHeightKit,
-  ...BaseCommentKit,
-  ...BaseSuggestionKit,
-  ...MarkdownKit,
-];

package/src/components/editor/editor-kit.tsx

@@ -1,87 +0,0 @@
-"use client";
-
-import { TrailingBlockPlugin, type Value } from "platejs";
-import { type TPlateEditor, useEditorRef } from "platejs/react";
-
-import { AIKit } from "@/components/editor/plugins/ai-kit";
-import { AlignKit } from "@/components/editor/plugins/align-kit";
-import { AutoformatKit } from "@/components/editor/plugins/autoformat-kit";
-import { BasicBlocksKit } from "@/components/editor/plugins/basic-blocks-kit";
-import { BasicMarksKit } from "@/components/editor/plugins/basic-marks-kit";
-import { BlockMenuKit } from "@/components/editor/plugins/block-menu-kit";
-import { BlockPlaceholderKit } from "@/components/editor/plugins/block-placeholder-kit";
-import { CalloutKit } from "@/components/editor/plugins/callout-kit";
-import { CodeBlockKit } from "@/components/editor/plugins/code-block-kit";
-import { ColumnKit } from "@/components/editor/plugins/column-kit";
-import { CommentKit } from "@/components/editor/plugins/comment-kit";
-import { CopilotKit } from "@/components/editor/plugins/copilot-kit";
-import { CursorOverlayKit } from "@/components/editor/plugins/cursor-overlay-kit";
-import { DateKit } from "@/components/editor/plugins/date-kit";
-import { DiscussionKit } from "@/components/editor/plugins/discussion-kit";
-import { DndKit } from "@/components/editor/plugins/dnd-kit";
-import { EmojiKit } from "@/components/editor/plugins/emoji-kit";
-import { ExitBreakKit } from "@/components/editor/plugins/exit-break-kit";
-import { FixedToolbarKit } from "@/components/editor/plugins/fixed-toolbar-kit";
-import { FloatingToolbarKit } from "@/components/editor/plugins/floating-toolbar-kit";
-import { FontKit } from "@/components/editor/plugins/font-kit";
-import { LineHeightKit } from "@/components/editor/plugins/line-height-kit";
-import { LinkKit } from "@/components/editor/plugins/link-kit";
-import { ListKit } from "@/components/editor/plugins/list-kit";
-import { MarkdownKit } from "@/components/editor/plugins/markdown-kit";
-import { MathKit } from "@/components/editor/plugins/math-kit";
-import { MediaKit } from "@/components/editor/plugins/media-kit";
-import { SlashKit } from "@/components/editor/plugins/slash-kit";
-import { SuggestionKit } from "@/components/editor/plugins/suggestion-kit";
-import { TableKit } from "@/components/editor/plugins/table-kit";
-
-export const EditorKit = [
-  ...CopilotKit,
-  ...AIKit,
-
-  // Elements
-  ...BasicBlocksKit,
-  ...CodeBlockKit,
-  ...TableKit,
-  ...MediaKit,
-  ...CalloutKit,
-  ...ColumnKit,
-  ...MathKit,
-  ...DateKit,
-  ...LinkKit,
-
-  // Marks
-  ...BasicMarksKit,
-  ...FontKit,
-
-  // Block Style
-  ...ListKit,
-  ...AlignKit,
-  ...LineHeightKit,
-
-  // Collaboration
-  ...DiscussionKit,
-  ...CommentKit,
-  ...SuggestionKit,
-
-  // Editing
-  ...SlashKit,
-  ...AutoformatKit,
-  ...CursorOverlayKit,
-  ...BlockMenuKit,
-  ...DndKit,
-  ...EmojiKit,
-  ...ExitBreakKit,
-  TrailingBlockPlugin,
-
-  // Parsers
-  ...MarkdownKit,
-
-  // UI
-  ...BlockPlaceholderKit,
-  ...FixedToolbarKit,
-  ...FloatingToolbarKit,
-];
-
-export type MyEditor = TPlateEditor<Value, (typeof EditorKit)[number]>;
-
-export const useEditor = () => useEditorRef<MyEditor>();

package/src/components/editor/md.tsx

@@ -1,60 +0,0 @@
-"use client";
-
-import { MarkdownPlugin } from "@platejs/markdown";
-import type { Value } from "platejs";
-import { Plate, type PlateEditor, usePlateEditor } from "platejs/react";
-import { type ReactNode, use, useRef } from "react";
-import { EditorKit } from "@/components/editor/editor-kit";
-import { Editor, EditorContainer } from "@/components/editor/ui/editor";
-
-const mdMap: Record<string, Promise<Value>> = {};
-
-export function MDXEditor({
-  defaultValue,
-  onUpdate,
-  children,
-}: {
-  defaultValue: string;
-  onUpdate?: (options: { editor: PlateEditor; getMarkdown: () => string }) => void;
-  children?: ReactNode;
-}) {
-  const initializedRef = useRef(false);
-  const editor = usePlateEditor({
-    plugins: EditorKit,
-    skipInitialization: true,
-  });
-  const deserializedDefault = use(
-    (mdMap[defaultValue] ??= new Promise((res) => {
-      res(editor.getApi(MarkdownPlugin).markdown.deserialize(defaultValue));
-    })),
-  );
-  if (!initializedRef.current) {
-    editor.tf.init({
-      value: deserializedDefault,
-    });
-    initializedRef.current = true;
-  }
-
-  return (
-    <Plate
-      editor={editor}
-      onValueChange={() => {
-        onUpdate?.({
-          editor,
-          getMarkdown() {
-            return editor.getApi(MarkdownPlugin).markdown.serialize();
-          },
-        });
-      }}
-    >
-      {children ?? (
-        <MDXEditorContainer>
-          <MDXEditorView />
-        </MDXEditorContainer>
-      )}
-    </Plate>
-  );
-}
-
-export const MDXEditorContainer = EditorContainer;
-export const MDXEditorView = Editor;

package/src/components/editor/plugins/ai-kit.tsx

@@ -1,102 +0,0 @@
-"use client";
-
-import { withAIBatch } from "@platejs/ai";
-import {
-  AIChatPlugin,
-  AIPlugin,
-  applyAISuggestions,
-  streamInsertChunk,
-  useChatChunk,
-} from "@platejs/ai/react";
-import { getPluginType, KEYS, PathApi } from "platejs";
-import { usePluginOption } from "platejs/react";
-
-import { AILoadingBar, AIMenu } from "@/components/editor/ui/ai-menu";
-import { AIAnchorElement, AILeaf } from "@/components/editor/ui/ai-node";
-
-import { useChat } from "../use-chat";
-import { CursorOverlayKit } from "./cursor-overlay-kit";
-import { MarkdownKit } from "./markdown-kit";
-
-export const aiChatPlugin = AIChatPlugin.extend({
-  options: {
-    chatOptions: {
-      api: "/api/ai/command",
-      body: {},
-    },
-  },
-  render: {
-    afterContainer: AILoadingBar,
-    afterEditable: AIMenu,
-    node: AIAnchorElement,
-  },
-  shortcuts: { show: { keys: "mod+j" } },
-  useHooks: ({ editor, getOption }) => {
-    useChat();
-
-    const mode = usePluginOption(AIChatPlugin, "mode");
-    const toolName = usePluginOption(AIChatPlugin, "toolName");
-    useChatChunk({
-      onChunk: ({ chunk, isFirst, nodes, text: content }) => {
-        if (isFirst && mode === "insert") {
-          editor.tf.withoutSaving(() => {
-            if (!editor.selection) return;
-
-            editor.tf.insertNodes(
-              {
-                children: [{ text: "" }],
-                type: getPluginType(editor, KEYS.aiChat),
-              },
-              {
-                at: PathApi.next(editor.selection.focus.path.slice(0, 1)),
-              },
-            );
-          });
-          editor.setOption(AIChatPlugin, "streaming", true);
-        }
-
-        if (mode === "insert" && nodes.length > 0) {
-          withAIBatch(
-            editor,
-            () => {
-              if (!getOption("streaming")) return;
-              editor.tf.withScrolling(() => {
-                streamInsertChunk(editor, chunk, {
-                  textProps: {
-                    [getPluginType(editor, KEYS.ai)]: true,
-                  },
-                });
-              });
-            },
-            { split: isFirst },
-          );
-        }
-
-        if (toolName === "edit" && mode === "chat") {
-          withAIBatch(
-            editor,
-            () => {
-              applyAISuggestions(editor, content);
-            },
-            {
-              split: isFirst,
-            },
-          );
-        }
-      },
-      onFinish: () => {
-        editor.setOption(AIChatPlugin, "streaming", false);
-        editor.setOption(AIChatPlugin, "_blockChunks", "");
-        editor.setOption(AIChatPlugin, "_blockPath", null);
-        editor.setOption(AIChatPlugin, "_mdxName", null);
-      },
-    });
-  },
-});
-
-export const AIKit = [
-  ...CursorOverlayKit,
-  ...MarkdownKit,
-  AIPlugin.withComponent(AILeaf),
-  aiChatPlugin,
-];

package/src/components/editor/plugins/align-base-kit.tsx

@@ -1,16 +0,0 @@
-import { BaseTextAlignPlugin } from "@platejs/basic-styles";
-import { KEYS } from "platejs";
-
-export const BaseAlignKit = [
-  BaseTextAlignPlugin.configure({
-    inject: {
-      nodeProps: {
-        defaultNodeValue: "start",
-        nodeKey: "align",
-        styleKey: "textAlign",
-        validNodeValues: ["start", "left", "center", "right", "end", "justify"],
-      },
-      targetPlugins: [...KEYS.heading, KEYS.p, KEYS.img, KEYS.mediaEmbed],
-    },
-  }),
-];

package/src/components/editor/plugins/align-kit.tsx

@@ -1,18 +0,0 @@
-"use client";
-
-import { TextAlignPlugin } from "@platejs/basic-styles/react";
-import { KEYS } from "platejs";
-
-export const AlignKit = [
-  TextAlignPlugin.configure({
-    inject: {
-      nodeProps: {
-        defaultNodeValue: "start",
-        nodeKey: "align",
-        styleKey: "textAlign",
-        validNodeValues: ["start", "left", "center", "right", "end", "justify"],
-      },
-      targetPlugins: [...KEYS.heading, KEYS.p, KEYS.img, KEYS.mediaEmbed],
-    },
-  }),
-];

package/src/components/editor/plugins/autoformat-kit.tsx

@@ -1,236 +0,0 @@
-"use client";
-
-import type { AutoformatRule } from "@platejs/autoformat";
-
-import {
-  autoformatArrow,
-  autoformatLegal,
-  autoformatLegalHtml,
-  autoformatMath,
-  AutoformatPlugin,
-  autoformatPunctuation,
-  autoformatSmartQuotes,
-} from "@platejs/autoformat";
-import { insertEmptyCodeBlock } from "@platejs/code-block";
-import { toggleList } from "@platejs/list";
-import { KEYS } from "platejs";
-
-const autoformatMarks: AutoformatRule[] = [
-  {
-    match: "***",
-    mode: "mark",
-    type: [KEYS.bold, KEYS.italic],
-  },
-  {
-    match: "__*",
-    mode: "mark",
-    type: [KEYS.underline, KEYS.italic],
-  },
-  {
-    match: "__**",
-    mode: "mark",
-    type: [KEYS.underline, KEYS.bold],
-  },
-  {
-    match: "___***",
-    mode: "mark",
-    type: [KEYS.underline, KEYS.bold, KEYS.italic],
-  },
-  {
-    match: "**",
-    mode: "mark",
-    type: KEYS.bold,
-  },
-  {
-    match: "__",
-    mode: "mark",
-    type: KEYS.underline,
-  },
-  {
-    match: "*",
-    mode: "mark",
-    type: KEYS.italic,
-  },
-  {
-    match: "_",
-    mode: "mark",
-    type: KEYS.italic,
-  },
-  {
-    match: "~~",
-    mode: "mark",
-    type: KEYS.strikethrough,
-  },
-  {
-    match: "^",
-    mode: "mark",
-    type: KEYS.sup,
-  },
-  {
-    match: "~",
-    mode: "mark",
-    type: KEYS.sub,
-  },
-  {
-    match: "==",
-    mode: "mark",
-    type: KEYS.highlight,
-  },
-  {
-    match: "≡",
-    mode: "mark",
-    type: KEYS.highlight,
-  },
-  {
-    match: "`",
-    mode: "mark",
-    type: KEYS.code,
-  },
-];
-
-const autoformatBlocks: AutoformatRule[] = [
-  {
-    match: "# ",
-    mode: "block",
-    type: KEYS.h1,
-  },
-  {
-    match: "## ",
-    mode: "block",
-    type: KEYS.h2,
-  },
-  {
-    match: "### ",
-    mode: "block",
-    type: KEYS.h3,
-  },
-  {
-    match: "#### ",
-    mode: "block",
-    type: KEYS.h4,
-  },
-  {
-    match: "##### ",
-    mode: "block",
-    type: KEYS.h5,
-  },
-  {
-    match: "###### ",
-    mode: "block",
-    type: KEYS.h6,
-  },
-  {
-    match: "> ",
-    mode: "block",
-    type: KEYS.blockquote,
-  },
-  {
-    match: "```",
-    mode: "block",
-    type: KEYS.codeBlock,
-    format: (editor) => {
-      insertEmptyCodeBlock(editor, {
-        defaultType: KEYS.p,
-        insertNodesOptions: { select: true },
-      });
-    },
-  },
-  // {
-  //   match: '+ ',
-  //   mode: 'block',
-  //   preFormat: openNextToggles,
-  //   type: KEYS.toggle,
-  // },
-  {
-    match: ["---", "—-", "___ "],
-    mode: "block",
-    type: KEYS.hr,
-    format: (editor) => {
-      editor.tf.setNodes({ type: KEYS.hr });
-      editor.tf.insertNodes({
-        children: [{ text: "" }],
-        type: KEYS.p,
-      });
-    },
-  },
-];
-
-const autoformatLists: AutoformatRule[] = [
-  {
-    match: ["* ", "- "],
-    mode: "block",
-    type: "list",
-    format: (editor) => {
-      toggleList(editor, {
-        listStyleType: KEYS.ul,
-      });
-    },
-  },
-  {
-    match: [String.raw`^\d+\.$ `, String.raw`^\d+\)$ `],
-    matchByRegex: true,
-    mode: "block",
-    type: "list",
-    format: (editor, { matchString }) => {
-      toggleList(editor, {
-        listRestartPolite: Number(matchString) || 1,
-        listStyleType: KEYS.ol,
-      });
-    },
-  },
-  {
-    match: ["[] "],
-    mode: "block",
-    type: "list",
-    format: (editor) => {
-      toggleList(editor, {
-        listStyleType: KEYS.listTodo,
-      });
-      editor.tf.setNodes({
-        checked: false,
-        listStyleType: KEYS.listTodo,
-      });
-    },
-  },
-  {
-    match: ["[x] "],
-    mode: "block",
-    type: "list",
-    format: (editor) => {
-      toggleList(editor, {
-        listStyleType: KEYS.listTodo,
-      });
-      editor.tf.setNodes({
-        checked: true,
-        listStyleType: KEYS.listTodo,
-      });
-    },
-  },
-];
-
-export const AutoformatKit = [
-  AutoformatPlugin.configure({
-    options: {
-      enableUndoOnDelete: true,
-      rules: [
-        ...autoformatBlocks,
-        ...autoformatMarks,
-        ...autoformatSmartQuotes,
-        ...autoformatPunctuation,
-        ...autoformatLegal,
-        ...autoformatLegalHtml,
-        ...autoformatArrow,
-        ...autoformatMath,
-        ...autoformatLists,
-      ].map(
-        (rule): AutoformatRule => ({
-          ...rule,
-          query: (editor) =>
-            !editor.api.some({
-              match: { type: editor.getType(KEYS.codeBlock) },
-            }),
-        }),
-      ),
-    },
-  }),
-];

package/src/components/editor/plugins/basic-blocks-base-kit.tsx

@@ -1,34 +0,0 @@
-import {
-  BaseBlockquotePlugin,
-  BaseH1Plugin,
-  BaseH2Plugin,
-  BaseH3Plugin,
-  BaseH4Plugin,
-  BaseH5Plugin,
-  BaseH6Plugin,
-  BaseHorizontalRulePlugin,
-} from "@platejs/basic-nodes";
-import { BaseParagraphPlugin } from "platejs";
-import { BlockquoteElementStatic } from "@/components/editor/ui/blockquote-node-static";
-import {
-  H1ElementStatic,
-  H2ElementStatic,
-  H3ElementStatic,
-  H4ElementStatic,
-  H5ElementStatic,
-  H6ElementStatic,
-} from "@/components/editor/ui/heading-node-static";
-import { HrElementStatic } from "@/components/editor/ui/hr-node-static";
-import { ParagraphElementStatic } from "@/components/editor/ui/paragraph-node-static";
-
-export const BaseBasicBlocksKit = [
-  BaseParagraphPlugin.withComponent(ParagraphElementStatic),
-  BaseH1Plugin.withComponent(H1ElementStatic),
-  BaseH2Plugin.withComponent(H2ElementStatic),
-  BaseH3Plugin.withComponent(H3ElementStatic),
-  BaseH4Plugin.withComponent(H4ElementStatic),
-  BaseH5Plugin.withComponent(H5ElementStatic),
-  BaseH6Plugin.withComponent(H6ElementStatic),
-  BaseBlockquotePlugin.withComponent(BlockquoteElementStatic),
-  BaseHorizontalRulePlugin.withComponent(HrElementStatic),
-];