@docyrus/ui-pro-ai-assistant 0.0.2 → 0.0.5

package/src/internal/plate-editor/editor/plugins/slash-kit.tsx

@@ -1,17 +0,0 @@
-'use client';
-
-import { SlashInputPlugin, SlashPlugin } from '@platejs/slash-command/react';
-import { KEYS } from 'platejs';
-
-import { SlashInputElement } from '../../plate-ui/slash-node';
-
-export const SlashKit = [
-  SlashPlugin.configure({
-    options: {
-      triggerQuery: editor => !editor.api.some({
-        match: { type: editor.getType(KEYS.codeBlock) }
-      })
-    }
-  }),
-  SlashInputPlugin.withComponent(SlashInputElement)
-];

package/src/internal/plate-editor/editor/plugins/suggestion-base-kit.tsx

@@ -1,5 +0,0 @@
-import { BaseSuggestionPlugin } from '@platejs/suggestion';
-
-import { SuggestionLeafStatic } from '../../plate-ui/suggestion-node-static';
-
-export const BaseSuggestionKit = [BaseSuggestionPlugin.withComponent(SuggestionLeafStatic)];

package/src/internal/plate-editor/editor/plugins/suggestion-kit.tsx

@@ -1,95 +0,0 @@
-'use client';
-
-import {
-  type BaseSuggestionConfig,
-  BaseSuggestionPlugin
-} from '@platejs/suggestion';
-import {
-  type ExtendConfig,
-  type Path,
-  isSlateEditor,
-  isSlateString
-} from 'platejs';
-import { toTPlatePlugin } from 'platejs/react';
-
-import { discussionPlugin } from './discussion-kit';
-
-import {
-  SuggestionLeaf,
-  SuggestionLineBreak
-} from '../../plate-ui/suggestion-node';
-
-export type SuggestionConfig = ExtendConfig<
-  BaseSuggestionConfig,
-  {
-    activeId: string | null;
-    hoverId: string | null;
-    uniquePathMap: Map<string, Path>;
-  }
->;
-
-export const suggestionPlugin = toTPlatePlugin<SuggestionConfig>(
-  BaseSuggestionPlugin,
-  ({ editor }) => ({
-    handlers: {
-      onClick: ({
-        api, event, setOption, type
-      }) => {
-        let leaf = event.target as HTMLElement;
-        let isSet = false;
-
-        const isBlockLeaf = leaf.dataset.blockSuggestion === 'true';
-
-        const unsetActiveSuggestion = () => {
-          setOption('activeId', null);
-          isSet = true;
-        };
-
-        if (!isSlateString(leaf) && !isBlockLeaf) {
-          unsetActiveSuggestion();
-        }
-
-        while (leaf.parentElement && !isSlateEditor(leaf.parentElement)) {
-          const isBlockSuggestion = leaf.dataset.blockSuggestion === 'true';
-
-          if (leaf.classList.contains(`slate-${type}`) || isBlockSuggestion) {
-            const suggestionEntry = api.suggestion!.node({
-              isText: !isBlockSuggestion
-            });
-
-            if (!suggestionEntry) {
-              unsetActiveSuggestion();
-
-              break;
-            }
-
-            const id = api.suggestion!.nodeId(suggestionEntry[0]);
-
-            setOption('activeId', id ?? null);
-
-            isSet = true;
-
-            break;
-          }
-
-          leaf = leaf.parentElement;
-        }
-
-        if (!isSet) unsetActiveSuggestion();
-      }
-    },
-    options: {
-      activeId: null,
-      currentUserId: editor.getOption(discussionPlugin, 'currentUserId'),
-      hoverId: null,
-      uniquePathMap: new Map()
-    }
-  })
-).configure({
-  render: {
-    belowNodes: SuggestionLineBreak as any,
-    node: SuggestionLeaf
-  }
-});
-
-export const SuggestionKit = [suggestionPlugin];

package/src/internal/plate-editor/editor/plugins/table-base-kit.tsx

@@ -1,20 +0,0 @@
-import {
-  BaseTableCellHeaderPlugin,
-  BaseTableCellPlugin,
-  BaseTablePlugin,
-  BaseTableRowPlugin
-} from '@platejs/table';
-
-import {
-  TableCellElementStatic,
-  TableCellHeaderElementStatic,
-  TableElementStatic,
-  TableRowElementStatic
-} from '../../plate-ui/table-node-static';
-
-export const BaseTableKit = [
-  BaseTablePlugin.withComponent(TableElementStatic),
-  BaseTableRowPlugin.withComponent(TableRowElementStatic),
-  BaseTableCellPlugin.withComponent(TableCellElementStatic),
-  BaseTableCellHeaderPlugin.withComponent(TableCellHeaderElementStatic)
-];

package/src/internal/plate-editor/editor/plugins/table-kit.tsx

@@ -1,22 +0,0 @@
-'use client';
-
-import {
-  TableCellHeaderPlugin,
-  TableCellPlugin,
-  TablePlugin,
-  TableRowPlugin
-} from '@platejs/table/react';
-
-import {
-  TableCellElement,
-  TableCellHeaderElement,
-  TableElement,
-  TableRowElement
-} from '../../plate-ui/table-node';
-
-export const TableKit = [
-  TablePlugin.withComponent(TableElement),
-  TableRowPlugin.withComponent(TableRowElement),
-  TableCellPlugin.withComponent(TableCellElement),
-  TableCellHeaderPlugin.withComponent(TableCellHeaderElement)
-];

package/src/internal/plate-editor/editor/plugins/toc-base-kit.tsx

@@ -1,5 +0,0 @@
-import { BaseTocPlugin } from '@platejs/toc';
-
-import { TocElementStatic } from '../../plate-ui/toc-node-static';
-
-export const BaseTocKit = [BaseTocPlugin.withComponent(TocElementStatic)];

package/src/internal/plate-editor/editor/plugins/toc-kit.tsx

@@ -1,14 +0,0 @@
-'use client';
-
-import { TocPlugin } from '@platejs/toc/react';
-
-import { TocElement } from '../../plate-ui/toc-node';
-
-export const TocKit = [
-  TocPlugin.configure({
-    options: {
-      isScroll: true,
-      topOffset: 80
-    }
-  }).withComponent(TocElement)
-];

package/src/internal/plate-editor/editor/plugins/toggle-base-kit.tsx

@@ -1,5 +0,0 @@
-import { BaseTogglePlugin } from '@platejs/toggle';
-
-import { ToggleElementStatic } from '../../plate-ui/toggle-node-static';
-
-export const BaseToggleKit = [BaseTogglePlugin.withComponent(ToggleElementStatic)];

package/src/internal/plate-editor/editor/plugins/toggle-kit.tsx

@@ -1,9 +0,0 @@
-'use client';
-
-import { TogglePlugin } from '@platejs/toggle/react';
-
-import { IndentKit } from './indent-kit';
-
-import { ToggleElement } from '../../plate-ui/toggle-node';
-
-export const ToggleKit = [...IndentKit, TogglePlugin.withComponent(ToggleElement)];

package/src/internal/plate-editor/editor/transforms.ts

@@ -1,165 +0,0 @@
-import { type PlateEditor } from 'platejs/react';
-
-import { insertCallout } from '@platejs/callout';
-import { insertCodeBlock } from '@platejs/code-block';
-import { insertDate } from '@platejs/date';
-import { insertColumnGroup, toggleColumnGroup } from '@platejs/layout';
-import { insertEquation, insertInlineEquation } from '@platejs/math';
-import {
-  insertAudioPlaceholder,
-  insertFilePlaceholder,
-  insertImagePlaceholder,
-  insertVideoPlaceholder
-} from '@platejs/media';
-import { insertTable } from '@platejs/table';
-import { insertToc } from '@platejs/toc';
-import {
-  KEYS,
-  type NodeEntry,
-  type Path,
-  PathApi,
-  type TElement
-} from 'platejs';
-
-const ACTION_THREE_COLUMNS = 'action_three_columns';
-
-const insertList = (editor: PlateEditor, type: string) => {
-  editor.tf.insertNodes(
-    editor.api.create.block({
-      indent: 1,
-      listStyleType: type
-    }),
-    { select: true }
-  );
-};
-
-const insertBlockMap: Record<
-  string,
-  (editor: PlateEditor, type: string) => void
-> = {
-  [KEYS.listTodo]: insertList,
-  [KEYS.ol]: insertList,
-  [KEYS.ul]: insertList,
-  [ACTION_THREE_COLUMNS]: editor => insertColumnGroup(editor, { columns: 3, select: true }),
-  [KEYS.audio]: editor => insertAudioPlaceholder(editor, { select: true }),
-  [KEYS.callout]: editor => insertCallout(editor, { select: true }),
-  [KEYS.codeBlock]: editor => insertCodeBlock(editor, { select: true }),
-  [KEYS.equation]: editor => insertEquation(editor, { select: true }),
-  [KEYS.file]: editor => insertFilePlaceholder(editor, { select: true }),
-  [KEYS.img]: editor => insertImagePlaceholder(editor, { select: true }),
-  [KEYS.table]: editor => insertTable(editor, {}, { select: true }),
-  [KEYS.toc]: editor => insertToc(editor, { select: true }),
-  [KEYS.video]: editor => insertVideoPlaceholder(editor, { select: true })
-};
-
-const insertInlineMap: Record<
-  string,
-  (editor: PlateEditor, type: string) => void
-> = {
-  [KEYS.date]: editor => insertDate(editor, { select: true }),
-  [KEYS.inlineEquation]: editor => insertInlineEquation(editor, '', { select: true })
-};
-
-export const insertBlock = (editor: PlateEditor, type: string) => {
-  editor.tf.withoutNormalizing(() => {
-    const block = editor.api.block();
-
-    if (!block) return;
-    if (type in insertBlockMap) {
-      insertBlockMap[type](editor, type);
-    } else {
-      editor.tf.insertNodes(editor.api.create.block({ type }), {
-        at: PathApi.next(block[1]),
-        select: true
-      });
-    }
-    if (getBlockType(block[0]) !== type) {
-      editor.tf.removeNodes({ previousEmptyBlock: true });
-    }
-  });
-};
-
-export const insertInlineElement = (editor: PlateEditor, type: string) => {
-  if (insertInlineMap[type]) {
-    insertInlineMap[type](editor, type);
-  }
-};
-
-const setList = (
-  editor: PlateEditor,
-  type: string,
-  entry: NodeEntry<TElement>
-) => {
-  editor.tf.setNodes(
-    editor.api.create.block({
-      indent: 1,
-      listStyleType: type
-    }),
-    {
-      at: entry[1]
-    }
-  );
-};
-
-const setBlockMap: Record<
-  string,
-  (editor: PlateEditor, type: string, entry: NodeEntry<TElement>) => void
-> = {
-  [KEYS.listTodo]: setList,
-  [KEYS.ol]: setList,
-  [KEYS.ul]: setList,
-  [ACTION_THREE_COLUMNS]: editor => toggleColumnGroup(editor, { columns: 3 })
-};
-
-export const setBlockType = (
-  editor: PlateEditor,
-  type: string,
-  { at }: { at?: Path } = {}
-) => {
-  editor.tf.withoutNormalizing(() => {
-    const setEntry = (entry: NodeEntry<TElement>) => {
-      const [node, path] = entry;
-
-      if (node[KEYS.listType]) {
-        editor.tf.unsetNodes([KEYS.listType, 'indent'], { at: path });
-      }
-      if (type in setBlockMap) {
-        return setBlockMap[type](editor, type, entry);
-      }
-      if (node.type !== type) {
-        editor.tf.setNodes({ type } as TElement, { at: path });
-      }
-    };
-
-    if (at) {
-      const entry = editor.api.node(at) as NodeEntry<TElement> | undefined;
-
-      if (entry) {
-        setEntry(entry);
-
-        return;
-      }
-    }
-
-    const entries = editor.api.blocks({ mode: 'lowest' }) as NodeEntry<TElement>[];
-
-    entries.forEach((entry: NodeEntry<TElement>) => {
-      setEntry(entry);
-    });
-  });
-};
-
-export const getBlockType = (block: TElement) => {
-  if (block[KEYS.listType]) {
-    if (block[KEYS.listType] === KEYS.ol) {
-      return KEYS.ol;
-    }
-    if (block[KEYS.listType] === KEYS.listTodo) {
-      return KEYS.listTodo;
-    }
-
-    return KEYS.ul;
-  }
-
-  return block.type;
-};

package/src/internal/plate-editor/editor/use-chat.ts

@@ -1,152 +0,0 @@
-'use client';
-
-import { useEffect } from 'react';
-
-import { type UseChatHelpers, useChat as useBaseChat } from '@ai-sdk/react';
-import { withAIBatch } from '@platejs/ai';
-import {
-  AIChatPlugin,
-  aiCommentToRange,
-  applyTableCellSuggestion
-} from '@platejs/ai/react';
-import { getCommentKey, getTransientCommentKey } from '@platejs/comment';
-import { deserializeMd } from '@platejs/markdown';
-import { DefaultChatTransport, type UIMessage } from 'ai';
-import {
-  KEYS, NodeApi, nanoid, TextApi, type TNode
-} from 'platejs';
-import { useEditorRef } from 'platejs/react';
-
-import { useAuthContext } from './auth-context';
-import { discussionPlugin } from './plugins/discussion-kit';
-
-export type Chat = UseChatHelpers<ChatMessage>;
-
-export type ChatMessage = UIMessage<{}, MessageDataPart>;
-
-export type MessageDataPart = {
-  toolName: ToolName;
-  comment?: TComment;
-  table?: TTableCellUpdate;
-};
-
-export type TComment = {
-  comment: {
-    blockId: string;
-    comment: string;
-    content: string;
-  } | null;
-  status: 'finished' | 'streaming';
-};
-
-export type TTableCellUpdate = {
-  cell: {
-    content: string;
-    id: string;
-  } | null;
-  status: 'finished' | 'streaming';
-};
-
-export type ToolName = 'comment' | 'edit' | 'generate';
-
-export const useChat = () => {
-  const editor = useEditorRef();
-  const { getAccessToken } = useAuthContext();
-  const baseChat = useBaseChat<ChatMessage>({
-    id: 'editor',
-    transport: new DefaultChatTransport({
-      api: '/api/ai/command',
-      headers: async () => {
-        const token = getAccessToken ? await getAccessToken() : null;
-
-        return {
-          'Content-Type': 'application/json',
-          ...(token && { Authorization: `Bearer ${token}` })
-        };
-      }
-    }),
-    onData(data) {
-      if (data.type === 'data-toolName') {
-        editor.setOption(AIChatPlugin, 'toolName', data.data as ToolName);
-      }
-      // Handle table cell updates
-      if (data.type === 'data-table' && data.data) {
-        const tableData = data.data as TTableCellUpdate;
-
-        if (tableData.status === 'streaming' && tableData.cell) {
-          withAIBatch(editor, () => {
-            applyTableCellSuggestion(editor, tableData.cell!);
-          });
-        }
-      }
-      // Handle comment data
-      if (data.type === 'data-comment' && data.data) {
-        const commentData = data.data as TComment;
-
-        if (commentData.status !== 'streaming' || !commentData.comment) return;
-
-        const aiComment = commentData.comment;
-
-        const range = aiCommentToRange(editor, aiComment);
-
-        if (!range) return;
-
-        const discussions
-          = editor.getOption(discussionPlugin, 'discussions') || [];
-
-        // Generate a new discussion ID
-        const discussionId = nanoid();
-
-        // Create a new comment
-        const newComment = {
-          id: nanoid(),
-          contentRich: [{ children: [{ text: aiComment.comment }], type: 'p' }],
-          createdAt: new Date(),
-          discussionId,
-          isEdited: false,
-          userId: editor.getOption(discussionPlugin, 'currentUserId')
-        };
-
-        // Create a new discussion
-        const newDiscussion = {
-          id: discussionId,
-          comments: [newComment],
-          createdAt: new Date(),
-          documentContent: deserializeMd(editor, aiComment.content)
-            .map((node: TNode) => NodeApi.string(node))
-            .join('\n'),
-          isResolved: false,
-          userId: editor.getOption(discussionPlugin, 'currentUserId')
-        };
-
-        // Update discussions
-        const updatedDiscussions = [...discussions, newDiscussion];
-
-        editor.setOption(discussionPlugin, 'discussions', updatedDiscussions);
-
-        // Apply comment marks to the editor
-        editor.tf.withMerging(() => {
-          editor.tf.setNodes(
-            {
-              [getCommentKey(newDiscussion.id)]: true,
-              [getTransientCommentKey()]: true,
-              [KEYS.comment]: true
-            },
-            {
-              at: range,
-              match: TextApi.isText,
-              split: true
-            }
-          );
-        });
-      }
-    }
-  });
-
-  useEffect(() => {
-    editor.setOption(AIChatPlugin, 'chat', baseChat as any);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [baseChat.status, baseChat.messages, baseChat.error]);
-
-  return baseChat;
-};

package/src/internal/plate-editor/hooks/index.ts

@@ -1,3 +0,0 @@
-export { useCopyToClipboard } from './use-copy-to-clipboard';
-export { useIsTouchDevice } from './use-is-touch-device';
-export { useLockScroll } from './use-lock-scroll';

package/src/internal/plate-editor/hooks/use-copy-to-clipboard.ts

@@ -1,31 +0,0 @@
-'use client';
-
-import { useCallback, useState } from 'react';
-
-export function useCopyToClipboard() {
-  const [isCopied, setIsCopied] = useState(false);
-
-  const copyToClipboard = useCallback(
-    async (text: string, _options?: { tooltip?: string }) => {
-      try {
-        await navigator.clipboard.writeText(text);
-        setIsCopied(true);
-        setTimeout(() => setIsCopied(false), 2000);
-      } catch {
-        // Fallback
-        const textarea = document.createElement('textarea');
-
-        textarea.value = text;
-        document.body.appendChild(textarea);
-        textarea.select();
-        document.execCommand('copy');
-        document.body.removeChild(textarea);
-        setIsCopied(true);
-        setTimeout(() => setIsCopied(false), 2000);
-      }
-    },
-    []
-  );
-
-  return { copyToClipboard, isCopied };
-}

package/src/internal/plate-editor/hooks/use-is-touch-device.ts

@@ -1,26 +0,0 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-
-export function useIsTouchDevice() {
-  const [isTouchDevice, setIsTouchDevice] = useState(false);
-
-  useEffect(() => {
-    function onResize() {
-      setIsTouchDevice(
-        'ontouchstart' in window
-        || navigator.maxTouchPoints > 0
-        || navigator.maxTouchPoints > 0
-      );
-    }
-
-    window.addEventListener('resize', onResize);
-    onResize();
-
-    return () => {
-      window.removeEventListener('resize', onResize);
-    };
-  }, []);
-
-  return isTouchDevice;
-}

package/src/internal/plate-editor/hooks/use-lock-scroll.ts

@@ -1,21 +0,0 @@
-'use client';
-
-import { useEffect } from 'react';
-
-export function useLockScroll(lock: boolean, selector?: string) {
-  useEffect(() => {
-    if (!lock) return;
-
-    const target = selector ? document.querySelector(selector) : document.body;
-
-    if (!target) return;
-
-    const prev = (target as HTMLElement).style.overflow;
-
-    (target as HTMLElement).style.overflow = 'hidden';
-
-    return () => {
-      (target as HTMLElement).style.overflow = prev;
-    };
-  }, [lock, selector]);
-}

package/src/internal/plate-editor/hooks/use-media-query.ts

@@ -1,44 +0,0 @@
-import { useEffect, useState } from 'react';
-
-/** Checks if the current viewport matches the specified media query. */
-export const useMediaQuery = (query: string): boolean => {
-  const getMatches = (query: string): boolean => {
-    // Prevents SSR issues
-    if (typeof window !== 'undefined') {
-      return window.matchMedia(query).matches;
-    }
-
-    return false;
-  };
-
-  const [matches, setMatches] = useState<boolean>(getMatches(query));
-
-  function handleChange() {
-    setMatches(getMatches(query));
-  }
-
-  useEffect(() => {
-    const matchMedia = window.matchMedia(query);
-
-    // Triggered at the first client-side load and if query changes
-    handleChange();
-
-    // Listen matchMedia
-    if (matchMedia.addListener) {
-      matchMedia.addListener(handleChange);
-    } else {
-      matchMedia.addEventListener('change', handleChange);
-    }
-
-    return () => {
-      if (matchMedia.removeListener) {
-        matchMedia.removeListener(handleChange);
-      } else {
-        matchMedia.removeEventListener('change', handleChange);
-      }
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [query]);
-
-  return matches;
-};

package/src/internal/plate-editor/hooks/use-mounted.ts

@@ -1,18 +0,0 @@
-'use client';
-
-import { useSyncExternalStore } from 'react';
-
-/**
- * A custom hook that returns a boolean value indicating whether the component
- * is mounted (client-side) or not. Useful for preventing hydration mismatches
- * when rendering different content on server vs client.
- */
-export const useMounted = () => {
-  return useSyncExternalStore(
-    subscribe, // subscribe: no-op, never changes
-    () => true, // getSnapshot (client): always true
-    () => false // getServerSnapshot (SSR): always false
-  );
-};
-
-const subscribe = () => () => {};