@kaitify/react 0.0.1-beta.1

package/lib/editor/menu/built-in/unordered-list/props.d.ts

@@ -0,0 +1,11 @@
+import { MenuPropsType } from '../../props';
+export type UnorderedListMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 浮层属性
+     */
+    popoverProps?: Omit<NonNullable<MenuPropsType['popoverProps']>, 'onShow' | 'onShowing' | 'onShown' | 'onHide' | 'onHiding' | 'onHidden'>;
+};

package/lib/editor/menu/built-in/unordered-list/unordered-list.d.ts

@@ -0,0 +1,2 @@
+import { UnorderedListMenuPropsType } from './props';
+export default function UnorderedListMenu(props: UnorderedListMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/video/index.d.ts

@@ -0,0 +1,6 @@
+import { default as VideoMenu } from './video';
+import { default as VideoControlsMenu } from './video-controls';
+import { default as VideoMutedMenu } from './video-muted';
+import { default as VideoLoopMenu } from './video-loop';
+export * from './props';
+export { VideoMenu, VideoControlsMenu, VideoMutedMenu, VideoLoopMenu };

package/lib/editor/menu/built-in/video/props.d.ts

@@ -0,0 +1,56 @@
+import { MenuPropsType } from '../../props';
+export type VideoMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 初始视频宽度
+     */
+    width?: string | number;
+    /**
+     * tabs配置
+     */
+    tabs?: {
+        data: ('remote' | 'upload')[];
+        default: 'remote' | 'upload';
+    };
+    /**
+     * 自定义上传方法
+     */
+    customUpload?: (file: File) => string | Promise<string>;
+    /**
+     * 浮层属性
+     */
+    popoverProps?: Omit<NonNullable<MenuPropsType['popoverProps']>, 'onShow' | 'onShowing' | 'onShown' | 'onHide' | 'onHiding' | 'onHidden'>;
+};
+export type VideoControlsMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 快捷键设置
+     */
+    shortcut?: (e: KeyboardEvent) => boolean;
+};
+export type VideoMutedMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 快捷键设置
+     */
+    shortcut?: (e: KeyboardEvent) => boolean;
+};
+export type VideoLoopMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 快捷键设置
+     */
+    shortcut?: (e: KeyboardEvent) => boolean;
+};

package/lib/editor/menu/built-in/video/video-controls.d.ts

@@ -0,0 +1,2 @@
+import { VideoControlsMenuPropsType } from './props';
+export default function VideoControlsMenu(props: VideoControlsMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/video/video-loop.d.ts

@@ -0,0 +1,2 @@
+import { VideoLoopMenuPropsType } from './props';
+export default function VideoLoopMenu(props: VideoLoopMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/video/video-muted.d.ts

@@ -0,0 +1,2 @@
+import { VideoMutedMenuPropsType } from './props';
+export default function VideoMutedMenu(props: VideoMutedMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/video/video.d.ts

@@ -0,0 +1,2 @@
+import { VideoMenuPropsType } from './props';
+export default function VideoMenu({ tabs, ...props }: VideoMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/wrap-down/index.d.ts

@@ -0,0 +1,3 @@
+import { default as WrapDownMenu } from './wrap-down';
+export * from './props';
+export { WrapDownMenu };

package/lib/editor/menu/built-in/wrap-down/props.d.ts

@@ -0,0 +1,15 @@
+import { KNodeMatchOptionType } from '../../../../index';
+export type WrapDownMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 指定换行的块节点条件
+     */
+    match: KNodeMatchOptionType;
+    /**
+     * 快捷键设置
+     */
+    shortcut?: (e: KeyboardEvent) => boolean;
+};

package/lib/editor/menu/built-in/wrap-down/wrap-down.d.ts

@@ -0,0 +1,2 @@
+import { WrapDownMenuPropsType } from './props';
+export default function WrapDownMenu(props: WrapDownMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/built-in/wrap-up/index.d.ts

@@ -0,0 +1,3 @@
+import { default as WrapUpMenu } from './wrap-up';
+export * from './props';
+export { WrapUpMenu };

package/lib/editor/menu/built-in/wrap-up/props.d.ts

@@ -0,0 +1,15 @@
+import { KNodeMatchOptionType } from '../../../../index';
+export type WrapUpMenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 指定换行的块节点条件
+     */
+    match: KNodeMatchOptionType;
+    /**
+     * 快捷键设置
+     */
+    shortcut?: (e: KeyboardEvent) => boolean;
+};

package/lib/editor/menu/built-in/wrap-up/wrap-up.d.ts

@@ -0,0 +1,2 @@
+import { WrapUpMenuPropsType } from './props';
+export default function WrapUpMenu(props: WrapUpMenuPropsType): import("react/jsx-runtime").JSX.Element;

package/lib/editor/menu/index.d.ts

@@ -0,0 +1,4 @@
+import { default as Menu } from './menu';
+export * from './props';
+export * from './built-in';
+export { Menu };

package/lib/editor/menu/menu.d.ts

@@ -0,0 +1,6 @@
+import { MenuPropsType, MenuRefType } from './props';
+/**
+ * 菜单组件
+ */
+declare const Menu: import('react').ForwardRefExoticComponent<MenuPropsType & import('react').RefAttributes<MenuRefType>>;
+export default Menu;

package/lib/editor/menu/props.d.ts

@@ -0,0 +1,89 @@
+import { PopoverPropsType } from '../../core/popover';
+import { ReactNode } from 'react';
+/**
+ * 菜单可选数据的类型
+ */
+export type MenuDataType = {
+    /**
+     * 显示的文字
+     */
+    label: string;
+    /**
+     * 表示的值
+     */
+    value: string | number;
+    /**
+     * 左侧显示的图标
+     */
+    icon?: string;
+};
+/**
+ * 菜单组件的属性类型
+ */
+export type MenuPropsType = {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 是否激活
+     */
+    active?: boolean;
+    /**
+     * 选项禁用
+     */
+    itemDisabled?: (item: MenuDataType) => boolean;
+    /**
+     * 选项是否激活
+     */
+    itemActive?: (item: MenuDataType) => boolean;
+    /**
+     * 是否有浮层
+     */
+    popover?: boolean;
+    /**
+     * 浮层属性
+     */
+    popoverProps?: Omit<PopoverPropsType, 'disabled' | 'delay' | 'refer' | 'children'>;
+    /**
+     * 可选数据
+     */
+    data?: MenuDataType[];
+    /**
+     * 快捷键设置
+     */
+    shortcut?: ((e: KeyboardEvent) => boolean) | {
+        [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean;
+    };
+    /**
+     * 非浮层类型的菜单按钮点击触发的事件
+     */
+    onOperate?: () => void;
+    /**
+     * 浮层类型的菜单按钮点击选项触发的事件
+     */
+    onSelect?: (value: MenuDataType) => void;
+    /**
+     * 默认插槽
+     */
+    children: ReactNode;
+    /**
+     * 自定义浮层内容
+     */
+    customPopover?: ReactNode;
+    /**
+     * 自定义选项图标
+     */
+    customIcon?: ReactNode | ((option: MenuDataType) => ReactNode);
+    /**
+     * 自定义选项内容
+     */
+    customLabel?: ReactNode | ((option: MenuDataType) => ReactNode);
+};
+/**
+ * 菜单组件实例类型
+ */
+export type MenuRefType = {
+    showPopover: () => void;
+    hidePopover: () => void;
+};

package/lib/editor/wrapper/index.d.ts

@@ -0,0 +1,3 @@
+import { default as Wrapper } from './wrapper';
+export * from './props';
+export { Wrapper };

package/lib/editor/wrapper/props.d.ts

@@ -0,0 +1,206 @@
+import { LocaleType } from '../../locale';
+import { Editor, Selection, EditorConfigureOptionType } from '@kaitify/core';
+import { CSSProperties, ReactNode } from 'react';
+/**
+ * 编辑器参数类型
+ */
+export type WrapperPropsType = {
+    /**
+     * 编辑器的值
+     */
+    value?: string;
+    /**
+     * 样式
+     */
+    style?: CSSProperties;
+    /**
+     * 样式类
+     */
+    className?: string;
+    /**
+     * 编辑器是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 语言环境
+     */
+    locale?: LocaleType;
+    /**
+     * 子元素，用于渲染气泡栏组件
+     */
+    children?: ReactNode | ((state: StateType) => ReactNode);
+    /**
+     * before插槽挂载的元素，如果不设置，则就放置在编辑器前面
+     */
+    appendBeforeTo?: string | HTMLElement;
+    /**
+     * after插槽挂载的元素，如果不设置，则就放置在编辑器后面
+     */
+    appendAfterTo?: string | HTMLElement;
+    /**
+     * before插槽
+     */
+    before?: ReactNode | ((state: StateType) => ReactNode);
+    /**
+     * after插槽
+     */
+    after?: ReactNode | ((state: StateType) => ReactNode);
+    /**
+     * 是否自动聚焦
+     */
+    autofocus?: EditorConfigureOptionType['autofocus'];
+    /**
+     * 编辑器内容只有一个段落时的默认文本
+     */
+    placeholder?: EditorConfigureOptionType['placeholder'];
+    /**
+     * 是否深色模式
+     */
+    dark?: EditorConfigureOptionType['dark'];
+    /**
+     * 是否允许复制
+     */
+    allowCopy?: EditorConfigureOptionType['allowCopy'];
+    /**
+     * 是否允许粘贴
+     */
+    allowPaste?: EditorConfigureOptionType['allowPaste'];
+    /**
+     * 是否允许剪切
+     */
+    allowCut?: EditorConfigureOptionType['allowCut'];
+    /**
+     * 是否允许粘贴html
+     */
+    allowPasteHtml?: EditorConfigureOptionType['allowPasteHtml'];
+    /**
+     * 剪切板同时存在文件和html/text时，是否优先粘贴文件
+     */
+    priorityPasteFiles?: EditorConfigureOptionType['priorityPasteFiles'];
+    /**
+     * 自定义编辑器内渲染文本节点的真实标签
+     */
+    textRenderTag?: EditorConfigureOptionType['textRenderTag'];
+    /**
+     * 自定义编辑内渲染默认块级节点的真实标签，即段落标签
+     */
+    blockRenderTag?: EditorConfigureOptionType['blockRenderTag'];
+    /**
+     * 自定义编辑器内定义需要置空的标签
+     */
+    emptyRenderTags?: EditorConfigureOptionType['emptyRenderTags'];
+    /**
+     * 自定义编辑器内额外保留的标签
+     */
+    extraKeepTags?: EditorConfigureOptionType['extraKeepTags'];
+    /**
+     * 自定义插件数组
+     */
+    extensions?: EditorConfigureOptionType['extensions'];
+    /**
+     * 自定义节点数组格式化规则
+     */
+    formatRules?: EditorConfigureOptionType['formatRules'];
+    /**
+     * 编辑器值改变事件
+     */
+    onChange?: (value: string) => void;
+    /**
+     * 编辑器创建完成后触发的事件
+     */
+    onCreated?: (editor: Editor) => void;
+    /**
+     * 自定义dom转为非文本节点的后续处理
+     */
+    onDomParseNode?: EditorConfigureOptionType['onDomParseNode'];
+    /**
+     * 节点粘贴保留标记的自定义方法
+     */
+    onPasteKeepMarks?: EditorConfigureOptionType['onPasteKeepMarks'];
+    /**
+     * 节点粘贴保留样式的自定义方法
+     */
+    onPasteKeepStyles?: EditorConfigureOptionType['onPasteKeepStyles'];
+    /**
+     * 编辑器粘贴纯文本时触发，如果返回true则表示继续使用默认逻辑，返回false则不走默认逻辑，需要进行自定义处理
+     */
+    onPasteText?: EditorConfigureOptionType['onPasteText'];
+    /**
+     * 编辑器粘贴html内容时触发，如果返回true则表示继续使用默认逻辑，返回false则不走默认逻辑，需要进行自定义处理
+     */
+    onPasteHtml?: EditorConfigureOptionType['onPasteHtml'];
+    /**
+     * 编辑器粘贴图片时触发，如果返回true则表示继续使用默认逻辑，返回false则不走默认逻辑，需要进行自定义处理
+     */
+    onPasteImage?: EditorConfigureOptionType['onPasteImage'];
+    /**
+     * 编辑器粘贴视频时触发，如果返回true则表示继续使用默认逻辑，返回false则不走默认逻辑，需要进行自定义处理
+     */
+    onPasteVideo?: EditorConfigureOptionType['onPasteVideo'];
+    /**
+     * 编辑器粘贴除了图片和视频以外的文件时触发，需要自定义处理
+     */
+    onPasteFile?: EditorConfigureOptionType['onPasteFile'];
+    /**
+     * 在删除和换行操作中块节点节点从其父节点中抽离出去成为与父节点同级的节点后触发，如果返回true则表示继续使用默认逻辑，会将该节点转为段落，返回false则不走默认逻辑，需要自定义处理
+     */
+    onDetachMentBlockFromParent?: EditorConfigureOptionType['onDetachMentBlockFromParent'];
+    /**
+     * 编辑器updateView执行时，通过比对新旧节点数组获取需要格式化的节点，在这些节点被格式化前，触发此方法，回调参数即当前需要被格式化的节点，该方法返回一个节点，返回的节点将会被格式化，如果你不需要任何特殊处理，返回入参提供的节点即可
+     */
+    onBeforePatchNodeToFormat?: EditorConfigureOptionType['onBeforePatchNodeToFormat'];
+    /**
+     * 编辑器光标发生变化触发的事件
+     */
+    onSelectionUpdate?: EditorConfigureOptionType['onSelectionUpdate'];
+    /**
+     * 编辑器进行换行时触发的事件
+     */
+    onInsertParagraph?: EditorConfigureOptionType['onInsertParagraph'];
+    /**
+     * 编辑器执行删除操作完成的时候触发的事件
+     */
+    onDeleteComplete?: EditorConfigureOptionType['onDeleteComplete'];
+    /**
+     * 编辑器内键盘按下触发的事件
+     */
+    onKeydown?: EditorConfigureOptionType['onKeydown'];
+    /**
+     * 编辑器内键盘松开触发的事件
+     */
+    onKeyup?: EditorConfigureOptionType['onKeyup'];
+    /**
+     * 编辑器获取光标触发的事件
+     */
+    onFocus?: EditorConfigureOptionType['onFocus'];
+    /**
+     * 编辑器失去光标触发的事件
+     */
+    onBlur?: EditorConfigureOptionType['onBlur'];
+    /**
+     * 编辑器视图更新前触发的事件
+     */
+    onBeforeUpdateView?: EditorConfigureOptionType['onBeforeUpdateView'];
+    /**
+     * 编辑器视图更新后触发的事件
+     */
+    onAfterUpdateView?: EditorConfigureOptionType['onAfterUpdateView'];
+};
+/**
+ * 编辑器状态对象
+ */
+export type StateType = {
+    editor: {
+        value?: Editor;
+    };
+    selection: {
+        value?: Selection;
+    };
+};
+/**
+ * 编辑器实例对象
+ */
+export type WrapperRefType = {
+    elRef: React.MutableRefObject<HTMLDivElement | null>;
+    state: StateType;
+};

package/lib/editor/wrapper/render.d.ts

@@ -0,0 +1,18 @@
+import { Editor, KNodeMarksType, KNodeRenderOptionType } from '@kaitify/core';
+import { default as React, ReactNode } from 'react';
+export declare const ATTR_MAP: Record<string, string>;
+/**
+ * 替换 attrs 的属性名为 React 识别的形式
+ */
+export declare const normalizeAttrs: (attrs: KNodeMarksType) => KNodeMarksType;
+/**
+ * 生成ReactNode
+ */
+export declare const createReactNode: (options: KNodeRenderOptionType) => React.ReactElement<{
+    style: import('@kaitify/core').KNodeStylesType;
+    key: number;
+}, string | React.JSXElementConstructor<any>>;
+/**
+ * 创建ReactNode数组
+ */
+export declare const createReactNodes: (editor: Editor) => ReactNode[];

package/lib/editor/wrapper/wrapper.d.ts

@@ -0,0 +1,6 @@
+import { WrapperPropsType, WrapperRefType } from './props';
+/**
+ * 编辑器编辑区域组件
+ */
+declare const Wrapper: import('react').ForwardRefExoticComponent<WrapperPropsType & import('react').RefAttributes<WrapperRefType>>;
+export default Wrapper;

package/lib/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useEditor } from './use-editor';

package/lib/hooks/use-editor.d.ts

@@ -0,0 +1,32 @@
+import { StateType } from '../editor/wrapper';
+/**
+ * 上下文数据类型
+ */
+export type EditorContextType = {
+    /**
+     * 编辑器状态数据
+     */
+    state: StateType;
+    /**
+     * 编辑器是否禁用
+     */
+    disabled: boolean;
+    /**
+     * 编辑器内鼠标是否按下
+     */
+    isMouseDown: boolean;
+    /**
+     * 编辑器元素
+     */
+    el: HTMLDivElement | null;
+    /**
+     * 翻译函数
+     */
+    t: (key: string) => string;
+    /**
+     * 是否深色模式
+     */
+    dark: boolean;
+};
+export declare const EditorContext: import('react').Context<EditorContextType>;
+export declare const useEditor: () => EditorContextType;

package/lib/index.d.ts

@@ -0,0 +1,9 @@
+export * from '@kaitify/core';
+export * from './core/divider';
+export * from './core/tabs';
+export * from './core/checkbox';
+export * from './core/icon';
+export * from './editor/wrapper';
+export * from './editor/bubble';
+export * from './editor/menu';
+export * from './hooks';