vdc-editor 0.1.13 → 0.1.15

package/README.md

@@ -1,4 +1,3 @@
-
 # Web Editor and React Native App
 
 ## Overview
@@ -11,6 +10,7 @@ This repository contains two main projects:
 ---
 
 ## Table of Contents
+
 - [Web Editor](#web-editor)
   - [Features](#features)
   - [Setup and Installation](#setup-and-installation)
@@ -29,6 +29,7 @@ This repository contains two main projects:
 ## Web Editor
 
 ### Features
+
 - **Rich-text editing**: Using Tiptap to provide a highly customizable editing experience.
 - **Vue.js**: The frontend framework for building reactive user interfaces.
 - **Customization**: Easily extendable with additional features and plugins from the Tiptap ecosystem.
@@ -36,22 +37,26 @@ This repository contains two main projects:
 ### Setup and Installation
 
 1. **Clone the repository:**
+
    ```bash
    git clone https://github.com/your-username/your-repo-name.git
    cd your-repo-name
    ```
 
 2. **Navigate to the web editor folder:**
+
    ```bash
    cd pakages/web
    ```
 
 3. **Install dependencies:**
+
    ```bash
    npm install
    ```
 
 4. **Run the development server:**
+
    ```bash
    npm run dev
    ```
@@ -59,6 +64,7 @@ This repository contains two main projects:
 5. **Open the editor in your browser** at `http://localhost:5173/`.
 
 ### Usage
+
 To start using the editor, simply open the URL in your browser, and you will see a full-featured text editor. You can edit, format, and style text as you like. More features can be added through Tiptap extensions.
 
 ---
@@ -66,6 +72,7 @@ To start using the editor, simply open the URL in your browser, and you will see
 ## React Native App
 
 ### Features
+
 - **WebView**: Displays the Vue-based web editor inside a WebView component.
 - **Cross-platform**: Available for both iOS and Android through React Native.
 - **Simple navigation**: Load the web editor seamlessly inside the app.
@@ -73,16 +80,19 @@ To start using the editor, simply open the URL in your browser, and you will see
 ### Setup and Installation
 
 1. **Navigate to the React Native app folder:**
+
    ```bash
    cd pakages/native
    ```
 
 2. **Install dependencies:**
+
    ```bash
    npm install
    ```
 
 3. **Link required packages (for React Native < 0.60):**
+
    ```bash
    react-native link
    ```
@@ -90,16 +100,19 @@ To start using the editor, simply open the URL in your browser, and you will see
 4. **Run the app on iOS or Android:**
 
    For iOS:
+
    ```bash
    npx react-native run-ios
    ```
 
    For Android:
+
    ```bash
    npx react-native run-android
    ```
 
 ### Usage
+
 Once the app is running, it will open the web editor inside a WebView, allowing users to edit text from their mobile devices with a responsive interface.
 
 ---
@@ -136,6 +149,7 @@ The `package.json` file includes the following script commands under the `"scrip
 ### Breakdown:
 
 - **`"app": "yarn workspace native-app start"`**
+
   - This command is used to **start the React Native app**.
   - It specifies that the command should be run within the `native-app` workspace.
   - `native-app` refers to the folder that contains the React Native code.
@@ -150,6 +164,7 @@ The `package.json` file includes the following script commands under the `"scrip
 ### How to Use:
 
 1. **To run the mobile app (React Native)**:
+
    ```bash
    yarn app
    ```
@@ -174,4 +189,5 @@ Contributions are welcome! Please follow the steps below to contribute:
 ---
 
 ## License
+
 This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

package/lib/index.d.ts

@@ -1,3 +1,3 @@
 export * from './src/index'
-import SBSEditor from './src/index'
-export default SBSEditor
+import VDCEditor from './src/index'
+export default VDCEditor

package/lib/src/components/ActionButton.vue.d.ts

@@ -9,6 +9,7 @@ interface Props {
     title?: string;
     tooltip?: string;
     disabled?: boolean;
+    hidden?: boolean;
     shortcutKeys?: string[];
     customClass?: string;
     loading?: boolean;

package/lib/src/components/CoreEditor.vue.d.ts

@@ -8,7 +8,17 @@ type SBSEditorOnChange = {
     /** Output content, can be a string or JSON content */
     output: string | JSONContent;
 };
-interface EditorProps {
+export interface EditorProps {
+    /**
+     * super Text Area
+     *
+     * @default show: false
+     * @default default: false
+     */
+    superTextArea?: {
+        view: boolean;
+        button: boolean;
+    };
     /**
      * Editor mode
      *
@@ -88,6 +98,12 @@ interface EditorProps {
      */
     contentClass?: string | string[] | Record<string, any>;
 }
+export interface EditorEmits {
+    (event: 'enter'): void;
+    (event: 'change', value: SBSEditorOnChange): void;
+    (event: 'update:modelValue', value: EditorProps['modelValue']): void;
+    (event: 'changed:selection', value: any): void;
+}
 declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<EditorProps>, {
     modelValue: string;
     output: string;
@@ -97,6 +113,7 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
     hideToolbar: boolean;
     disableBubble: boolean;
     hideBubble: boolean;
+    superTextArea: any;
     removeDefaultWrapper: boolean;
     maxWidth: undefined;
     minHeight: undefined;
@@ -120,6 +137,7 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
     hideToolbar: boolean;
     disableBubble: boolean;
     hideBubble: boolean;
+    superTextArea: any;
     removeDefaultWrapper: boolean;
     maxWidth: undefined;
     minHeight: undefined;
@@ -140,6 +158,10 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
     maxHeight: string | number;
     maxWidth: string | number;
     minHeight: string | number;
+    superTextArea: {
+        view: boolean;
+        button: boolean;
+    };
     dark: boolean;
     dense: boolean;
     hideToolbar: boolean;

package/lib/src/components/icons/icons.d.ts

@@ -102,5 +102,6 @@ export declare const icons: {
     FlipHorizontal: string;
     LucidePanelLeft: string;
     LucidePanelRight: string;
+    ALargeSmall: string;
 };
 export default icons;

package/lib/src/extensions/Page/computed.d.ts

@@ -7,61 +7,61 @@ export declare const sameListCalculation: ComputedFn;
 export declare const sameItemCalculation: ComputedFn;
 export declare const defaultNodesComputed: NodesComputed;
 /**
- * 分页上下文类
+ * Page context class
  */
 export declare class SplitContext {
     #private;
     attributes: Record<string, any>;
     schema: Schema;
     /**
-     * 获取文档
-     * @returns 文档
+     * Get document
+     * @returns Document
      */
     getDoc(): Node;
     /**
-     * 构造函数
-     * @param doc 文档
-     * @param height 分页高度
-     * @param paragraphDefaultHeight p标签的默认高度
+     * Constructor
+     * @param doc Document
+     * @param height Page height
+     * @param paragraphDefaultHeight Default height of p tag
      */
     constructor(schema: Schema, doc: Node, height: number, paragraphDefaultHeight: number);
     getHeight(): number;
     /**
-     * 获取默认高度
-     * @returns 默认高度
+     * Get default height
+     * @returns Default height
      */
     getDefaultHeight(): number;
     /**
-     * 判断是否溢出
-     * @param height 增加的高度
-     * @returns 是否溢出
+     * Check if overflow
+     * @param height Height to add
+     * @returns Whether overflow
      */
     isOverflow(height: number): boolean;
     /**
-     * 增加高度
-     * @param height 增加的高度
+     * Add height
+     * @param height Height to add
      */
     addHeight(height: number): void;
     /**
-     * 设置切割点
-     * @param pos 切割点位置
-     * @param depth 切割点深度
+     * Set split point
+     * @param pos Split point position
+     * @param depth Split point depth
      */
     setBoundary(pos: number, depth: number): void;
     /**
-     * 获取切割点
-     * @returns 切割点
+     * Get split point
+     * @returns Split point
      */
     pageBoundary(): SplitInfo | null;
     /**
-     * 解析切割点
-     * @param pos 切割点位置
-     * @returns 解析结果
+     * Parse split point
+     * @param pos Split point position
+     * @returns Parse result
      */
     splitResolve(pos: number): any;
     /**
-     * 获取最后一页
-     * @returns 最后一页
+     * Get last page
+     * @returns Last page
      */
     lastPage(): Node | null;
 }
@@ -83,16 +83,16 @@ export declare class PageComputedContext {
     mergeDefaultDocument(count: number): void;
     /**
      * @method mergeDocument
-     * @description  合并剩余文档 将剩余文档进行分页
-     *  深度判断：如果剩余页的 第一个子标签是 扩展类型(是主类型的拆分类型) 进行合并的时候 深度为2
-     *  如果第一个标签不是扩展类型 则深度为1
+     * @description Merge remaining document and paginate remaining document
+     * Depth determination: If first child tag of remaining page is extension type (split type of main type), depth is 2 when merging
+     * If first tag is not extension type, depth is 1
      */
     mergeDocument(): void;
     forceSplit(): Transaction;
     /**
-     * @description 分页主要逻辑 修改系统tr split方法 添加默认 extend判断 默认id重新生成
+     * @description Main pagination logic - Modifies system tr split method, adds default extend check and regenerates default id
      * @author Cassie
-     * @method splitPage 分割页面
+     * @method splitPage Split page
      * @param pos
      * @param depth
      * @param typesAfter
@@ -100,13 +100,13 @@ export declare class PageComputedContext {
      */
     lift({ pos, depth, typesAfter, schema, force }: SplitParams): void;
     /**
-     * desc 检查并修正分页造成的段落分行问题
+     * Check and fix paragraph line break issues caused by pagination
      */
     checkNodeAndFix(): Transaction;
     /**
-     * @description 获取需要分页的点 然后返回
+     * @description Get pagination points and return them
      * @author Cassie
-     * @method getNodeHeight 获取节点高度
+     * @method getNodeHeight Get node height
      */
     getNodeHeight(): SplitInfo | null;
 }

package/lib/src/extensions/Page/core.d.ts

@@ -30,27 +30,27 @@ export declare class UnitConversion {
     arrDPI: any[];
     constructor();
     /**
-   * @description px to mm
-   * @param value px值
-   */
+     * @description px to mm
+     * @param value px值
+     */
     pxConversionMm(value: number): number;
     /**
-   * @description mm to px
-   * @param value px值
-   */
+     * @description mm to px
+     * @param value px值
+     */
     mmConversionPx(value: number): number;
     cmConversionPx(value: number): number;
     /**
- * Convert px string to number
- * @param value String containing px value
- * @returns number without px unit
- */
+     * Convert px string to number
+     * @param value String containing px value
+     * @returns number without px unit
+     */
     pxToNumber(value: string | number): number;
     /**
- * Convert height CSS value to px number
- * @param value CSS height value
- * @returns number in pixels
- */
+     * Convert height CSS value to px number
+     * @param value CSS height value
+     * @returns number in pixels
+     */
     convertHeightToPx(value: string | number): number;
 }
 export declare function getPageOption(restore?: boolean): any;

package/lib/src/extensions/Page/index.d.ts

@@ -16,6 +16,12 @@ declare module '@tiptap/core' {
              */
             autoPaging: (status: boolean | undefined) => ReturnType;
         };
+        togglePagePlugin: {
+            /**
+             * Toggle the page plugin.
+             */
+            togglePagePlugin: (disable: boolean) => ReturnType;
+        };
     }
 }
 declare const _default: Node<PageOptions, any>;

package/lib/src/extensions/Page/types.d.ts

@@ -35,6 +35,7 @@ export declare class PageState {
     initSplit: boolean;
     scrollHeight: number;
     runState: boolean;
+    enable: boolean;
     constructor(deleting: boolean, inserting: boolean, splitPage: boolean, initSplit: boolean, scrollHeight: number, runState?: boolean);
     transform(tr: Transaction): PageState;
 }

package/lib/src/extensions/SpellChecker/index.d.ts

@@ -1,3 +1,3 @@
 export { SpellcheckerExtension } from './spellchecker-extension';
-export type { IProofreaderInterface, ITextWithPosition, ITransferSpellData, SpellCheckDataType } from './i-proofreader-interface';
+export type { IProofreaderInterface, ITextWithPosition, ITransferSpellData, SpellCheckDataType } from '../../type';
 export { Proofreader } from './proofreader';

package/lib/src/extensions/SpellChecker/proofreader.d.ts

@@ -1,9 +1,10 @@
-import { IProofreaderInterface, ITextWithPosition, ITransferSpellData } from './i-proofreader-interface';
+import { IProofreaderInterface, ITextWithPosition, ITransferSpellData } from '../../type';
 import { AxiosResponse } from 'axios';
 
 export declare class Proofreader implements IProofreaderInterface {
     private suggestions;
     private api;
+    enabled: boolean;
     limit: number | undefined;
     transfer?: (data: AxiosResponse<any, any>) => ITransferSpellData[];
     constructor({ api, limit, transfer, }: {
@@ -16,5 +17,6 @@ export declare class Proofreader implements IProofreaderInterface {
     getApi(): string;
     normalizeTextForLanguage(text: string): string;
     proofreadText(sentence: string): Promise<ITextWithPosition[]>;
+    setActiveSpellCheck(): void;
 }
 export type ProofreaderType = typeof Proofreader;

package/lib/src/extensions/SpellChecker/spellchecker-extension.d.ts

@@ -1,5 +1,5 @@
 import { Extension } from '@tiptap/core';
-import { IProofreaderInterface } from './i-proofreader-interface';
+import { IProofreaderInterface } from '../../type';
 import { default as Spellchecker } from './spellchecker';
 
 export declare const SPELLCHECKER_TRANSACTION = "spellchecker-transation";
@@ -21,6 +21,9 @@ declare module '@tiptap/core' {
         spellchecker: {
             checkSpelling: () => ReturnType;
         };
+        handleActiveSpellCheck: {
+            handleActiveSpellCheck: () => ReturnType;
+        };
     }
 }
 export declare const SpellcheckerExtension: Extension<ISpellcheckerOptions, ISpellcheckerStorage>;

package/lib/src/extensions/SpellChecker/spellchecker.d.ts

@@ -1,7 +1,7 @@
 import { Node } from 'prosemirror-model';
 import { Transaction } from 'prosemirror-state';
 import { DecorationSet, EditorView } from 'prosemirror-view';
-import { IProofreaderInterface } from './i-proofreader-interface';
+import { IProofreaderInterface } from '../../type';
 import { IUiStrings } from './spellchecker-extension';
 
 export default class Spellchecker {
@@ -19,6 +19,7 @@ export default class Spellchecker {
     private lastOriginalFrom;
     private readonly suggestionBox;
     constructor(proofreader: IProofreaderInterface, uiStrings?: IUiStrings, showSuggestionsEvent?: (word: string) => void);
+    setStatusSpellCheck(): void;
     setDecorationSet(decorationSet: DecorationSet): void;
     getDecorationSet(): DecorationSet;
     setEditorView(editorView: EditorView): void;

package/lib/src/extensions/SuperText/SuperText.d.ts

@@ -4,6 +4,8 @@ declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         superText: {
             updateSuperText: () => ReturnType;
+            toggleSuperText: () => ReturnType;
+            showSuperTextButton: (isShow: boolean) => ReturnType;
         };
     }
 }

package/lib/src/index.d.ts

@@ -1,14 +1,14 @@
 import { Plugin } from 'vue';
-import { default as CoreEditor } from './components/CoreEditor.vue';
-import { default as ActionButton } from './components/ActionButton.vue';
+import { default as CoreEditor, EditorProps, EditorEmits } from './components/CoreEditor.vue';
 
 declare const SBSEditorPlugin: Plugin;
-export * from './extensions';
-export * from './hooks';
-export * from './utils/node-names';
+export * as extension from './extensions';
+export { useConfigTiptap, useTiptapStore } from './hooks';
+export * as nodeNames from './utils/node-names';
 export type * from './type';
 export { useEditor } from '@tiptap/vue-3';
 export { type Editor as EditorInstance } from '@tiptap/core';
 export { enUS, koKR } from './locales';
-export { SBSEditorPlugin, CoreEditor, ActionButton };
+export { SBSEditorPlugin, CoreEditor };
+export type { EditorProps, EditorEmits, };
 export default SBSEditorPlugin;

package/lib/src/type.d.ts

@@ -92,12 +92,12 @@ export interface ButtonView<T = any> {
 }
 /**
  * The computed function for the page extension a node.
- * @param splitContex 分割上下文.
- * @param node 当前需要计算的节点.
- * @param pos 当前计算节点的位置.
- * @param parent 当前计算节点的父节点.
- * @param dom 当前计算节点的 dom.
- * @returns 如果返回 true 则会会进入当前节点的 子标签计算.
+ * @param splitContex Split context.
+ * @param node Current node to be computed.
+ * @param pos Position of the current computed node.
+ * @param parent Parent node of the current computed node.
+ * @param dom DOM element of the current computed node.
+ * @returns If returns true, it will proceed to compute child tags of the current node.
  */
 export type ComputedFn = (splitContex: SplitContext, node: Node, pos: number, parent: Node | null, dom: HTMLElement) => boolean;
 export type NodesComputed = Record<string, ComputedFn>;
@@ -147,3 +147,25 @@ export interface Config {
     sidebar: boolean;
 }
 export type EditorMode = 'editor' | 'straight' | 'report';
+export interface ITextWithPosition {
+    startIndex: number;
+    length: number;
+    wrongWord: string;
+}
+export interface ITransferSpellData {
+    errorText: ITextWithPosition;
+    spellData: SpellCheckDataType;
+}
+export type SpellCheckDataType = {
+    correctWord: string[];
+    startIndex: number;
+    endIndex: number;
+    wrongWordIndex: number;
+    wrongWord: string;
+};
+export interface IProofreaderInterface {
+    proofreadText(sentence: string): Promise<ITextWithPosition[]>;
+    getSuggestions(word: string): Promise<string[]>;
+    normalizeTextForLanguage(text: string): string;
+    setActiveSpellCheck(): void;
+}

package/lib/src/utils/eventBus.d.ts

@@ -0,0 +1,3 @@
+export declare enum EventKey {
+    TOGGLE_SUPER_TEXT = "toggle-super-text"
+}