@ant-design/agentic-ui 2.0.0

package/dist/MarkdownEditor/el.d.ts

@@ -0,0 +1,241 @@
+import { BaseEditor, BaseElement, BaseRange } from 'slate';
+import { HistoryEditor } from 'slate-history';
+import { ReactEditor, RenderElementProps } from 'slate-react';
+import { TdNode as TableCellNode, TableCustomElement, TableNode, TrNode as TableRowNode } from './editor/elements/Table';
+export type { TableCellNode, TableNode, TableRowNode };
+type Align = 'left' | 'center' | 'right';
+export interface DetailedSettings {
+    row: number;
+    col: number;
+    rowSpan: number;
+    colSpan: number;
+}
+export type CodeNode<T = Record<string, any>> = {
+    contextProps?: T;
+    type: 'code';
+    otherProps?: {
+        className?: string;
+        language?: string;
+        render?: boolean;
+        frontmatter?: boolean;
+    } & T;
+    children: [{
+        text: string;
+    }];
+    language?: string;
+    render?: boolean;
+    frontmatter?: boolean;
+    h?: number;
+    value: string;
+    katex?: boolean;
+    isConfig?: boolean;
+};
+export type ParagraphNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'paragraph';
+    align?: Align;
+    children: BaseElement['children'];
+    h?: number;
+};
+export type FootnoteDefinitionNode<T = Record<string, any>> = {
+    contextProps?: T;
+    identifier: string;
+    otherProps?: T;
+    url?: string;
+    value?: string;
+    type: 'footnoteDefinition';
+    children: BaseElement['children'];
+    h?: number;
+};
+export type CardNode<T = any> = {
+    type: 'card';
+    children: (CardBeforeNode | CardAfterNode | T)[];
+};
+export type CardBeforeNode = {
+    type: 'card-before';
+    children: BaseElement['children'];
+};
+export type CardAfterNode = {
+    type: 'card-after';
+    children: BaseElement['children'];
+};
+export type BlockQuoteNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'blockquote';
+    children: (BlockQuoteNode | ParagraphNode)[];
+};
+export type ListNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'list';
+    children: ListItemNode[];
+    order?: boolean;
+    start?: number;
+    task?: boolean;
+    h?: number;
+};
+export type ChartTypeConfig<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    chartType: string;
+    x?: string;
+    y?: string;
+    [key: string]: any;
+};
+export type ChartNode<T = Record<string, any>> = {
+    contextProps?: T;
+    type: 'chart';
+    children: BaseElement['children'];
+    otherProps?: {
+        showSource?: boolean;
+        config: ChartTypeConfig | ChartTypeConfig[];
+        columns: {
+            title: string;
+            dataIndex: string;
+            key: string;
+        }[];
+        dataSource: any[];
+    } & T;
+};
+export type ListItemNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'list-item';
+    children: BaseElement['children'];
+    checked?: boolean;
+    mentions: {
+        id: string;
+        name: string;
+    }[];
+    id: string;
+};
+export type HeadNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'head';
+    children: BaseElement['children'];
+    level: number;
+    h?: number;
+    align?: Align;
+};
+export type HrNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'hr';
+    children: undefined;
+};
+export type BreakNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'break';
+    children: BaseElement['children'];
+};
+export type MediaNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'media';
+    url?: string;
+    alt: string;
+    downloadUrl?: string;
+    height?: number;
+    width?: number;
+    docId?: string;
+    block?: boolean;
+    hash?: string;
+    h?: number;
+    children: BaseElement['children'];
+    align?: 'left' | 'right';
+    mediaType?: string;
+    controls?: boolean;
+    autoplay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    poster?: string;
+};
+export type LinkCardNode<T = Record<string, any>> = {
+    otherProps?: T;
+    contextProps?: T;
+    type: 'link-card';
+    url?: string;
+    icon?: string;
+    description?: string;
+    title?: string;
+    name?: string;
+    alt: string;
+    children: BaseElement['children'];
+};
+export type AttachNode<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    type: 'attach';
+    name: string;
+    size: number;
+    url: string;
+    children: BaseElement['children'];
+};
+export type SchemaNode<T = Record<string, any>> = {
+    contextProps?: T;
+    type: 'schema' | 'apaasify';
+    otherProps?: {
+        language?: string;
+        render?: boolean;
+        frontmatter?: boolean;
+    } & T;
+    children: [text: string];
+    value: Record<string, any> | Record<string, any>[];
+    language?: string;
+    render?: boolean;
+    frontmatter?: boolean;
+    h?: number;
+};
+export type Elements<T = Record<string, any>> = CodeNode<T> | FootnoteDefinitionNode<T> | SchemaNode<{
+    valueType: string;
+} & T> | ParagraphNode<T> | BlockQuoteNode<T> | ListNode<T> | ListItemNode<T> | HeadNode<T> | HrNode<T> | MediaNode<T> | BreakNode<T> | ChartNode<T> | AttachNode<T> | LinkCardNode<T> | CardNode | CardBeforeNode | CardAfterNode | TableCustomElement;
+export type CustomLeaf<T = Record<string, any>> = {
+    contextProps?: T;
+    otherProps?: T;
+    bold?: boolean | null;
+    identifier?: string;
+    code?: boolean | null;
+    tag?: boolean | null;
+    italic?: boolean | null;
+    strikethrough?: boolean | null;
+    color?: string;
+    highColor?: string;
+    url?: string;
+    text?: string;
+    current?: boolean | null;
+    html?: string;
+    fnc?: boolean;
+    fnd?: boolean;
+    comment?: boolean;
+    selection?: BaseRange;
+    id?: string;
+    data?: Record<string, any>;
+};
+export type NodeTypes<T extends Elements = Elements> = T['type'];
+export type MapValue<T> = T extends Map<any, infer I> ? I : T extends WeakMap<any, infer I> ? I : unknown;
+declare module 'slate' {
+    interface BaseElement {
+        align?: Align;
+    }
+    interface BaseRange {
+        color?: string;
+        current?: boolean;
+    }
+    interface CustomTypes {
+        Editor: BaseEditor & ReactEditor & HistoryEditor;
+        Element: Elements & BaseElement;
+        Text: CustomLeaf;
+    }
+}
+export type InlineKatexNode = {
+    type: 'inline-katex';
+    value: string;
+    children: BaseElement['children'];
+};
+export interface ElementProps<T = Elements> extends RenderElementProps {
+    element: T;
+}

package/dist/MarkdownEditor/hooks/editor.d.ts

@@ -0,0 +1,43 @@
+import { BaseElement, Path } from 'slate';
+import { ReactEditor } from 'slate-react';
+import { EditorStore } from '../editor/store';
+/**
+ * 自定义钩子 `useMEditor` 用于管理 Slate 编辑器中的节点更新和删除操作。
+ *
+ * @param el - 基础元素，用于确定操作的目标节点。
+ * @returns 包含编辑器实例、更新函数和删除函数的元组。
+ *
+ * @example
+ * ```typescript
+ * const [editor, update, remove] = useMEditor(element);
+ *
+ * // 更新节点属性
+ * update({ key: 'value' }, currentElement);
+ *
+ * // 删除节点
+ * remove(currentElement);
+ * ```
+ *
+ * @function
+ * @name useMEditor
+ * @param {BaseElement} el - 基础元素，用于确定操作的目标节点。
+ * @returns {[Editor, (props: Record<string, any>, current?: BaseElement) => void, (current?: BaseElement) => void]}
+ *          包含编辑器实例、更新函数和删除函数的元组。
+ */
+export declare const useMEditor: (el: BaseElement) => [import("slate").BaseEditor & ReactEditor & import("slate-history").HistoryEditor, (props: Record<string, any>, current?: BaseElement) => void];
+/**
+ * 自定义 Hook，用于获取编辑器中元素的选中状态和路径。
+ *
+ * @param element - 需要检查的元素。
+ * @returns 一个包含选中状态、路径和编辑器存储的数组。
+ *
+ * @remarks
+ * 该 Hook 使用 `useEditorStore` 获取编辑器存储，并使用 `useGetSetState` 管理组件状态。
+ * 它通过 `useSubject` 订阅 `selChange$` 主题，以响应选中状态的变化。
+ *
+ * @example
+ * ```typescript
+ * const [isSelected, elementPath, editorStore] = useSelStatus(someElement);
+ * ```
+ */
+export declare const useSelStatus: (element: any) => [boolean, Path, EditorStore];

package/dist/MarkdownEditor/hooks/editor.js

@@ -0,0 +1,52 @@
+// src/MarkdownEditor/hooks/editor.ts
+import { useCallback } from "react";
+import { Path, Transforms } from "slate";
+import { ReactEditor, useSlate } from "slate-react";
+import { selChange$ } from "../editor/plugins/useOnchange";
+import { useEditorStore } from "../editor/store";
+import { useGetSetState } from "../editor/utils";
+import { EditorUtils } from "../editor/utils/editorUtils";
+import { useSubject } from "./subscribe";
+var useMEditor = (el) => {
+  const editor = useSlate();
+  const update = useCallback(
+    (props, current) => {
+      Transforms.setNodes(editor, props, {
+        at: ReactEditor.findPath(editor, current || el)
+      });
+    },
+    [editor, el]
+  );
+  return [editor, update];
+};
+var useSelStatus = (element) => {
+  const editor = useSlate();
+  const { store, markdownEditorRef } = useEditorStore();
+  const [state, setState] = useGetSetState({
+    selected: ReactEditor.isFocused(editor),
+    path: EditorUtils.findPath(editor, element)
+  });
+  useSubject(
+    selChange$,
+    (ctx) => {
+      var _a;
+      const path = EditorUtils.findPath(markdownEditorRef.current, element);
+      if (!ctx) {
+        return setState({
+          selected: false,
+          path
+        });
+      }
+      setState({
+        path,
+        selected: Path.equals(path, ((_a = ctx.node) == null ? void 0 : _a[1]) || [])
+      });
+    },
+    [element]
+  );
+  return [state().selected, state().path, store];
+};
+export {
+  useMEditor,
+  useSelStatus
+};

package/dist/MarkdownEditor/hooks/subscribe.d.ts

@@ -0,0 +1,10 @@
+import { Observable, Subject } from 'rxjs';
+/**
+ * 订阅一个 `Subject` 或 `Observable`，并在值变化时调用指定的回调函数。
+ *
+ * @template T - `Subject` 或 `Observable` 中值的类型。
+ * @param {Subject<T> | Observable<T>} subject - 要订阅的 `Subject` 或 `Observable`。
+ * @param {(value: T) => void} fn - 当 `subject` 发出新值时调用的回调函数。
+ * @param {any[]} [deps=[]] - 依赖项数组，当依赖项变化时重新订阅 `subject`。
+ */
+export declare const useSubject: <T>(subject: Subject<T> | Observable<T>, fn: (value: T) => void, deps?: any[]) => void;

package/dist/MarkdownEditor/hooks/subscribe.js

@@ -0,0 +1,17 @@
+// src/MarkdownEditor/hooks/subscribe.ts
+import { useLayoutEffect } from "react";
+var useSubject = (subject, fn, deps = []) => {
+  useLayoutEffect(() => {
+    var _a;
+    if (!subject)
+      return;
+    const cancel = (_a = subject == null ? void 0 : subject.subscribe) == null ? void 0 : _a.call(subject, fn);
+    return () => {
+      var _a2;
+      return (_a2 = cancel == null ? void 0 : cancel.unsubscribe) == null ? void 0 : _a2.call(cancel);
+    };
+  }, deps);
+};
+export {
+  useSubject
+};

package/dist/MarkdownEditor/index.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+import { MarkdownEditorProps } from './BaseMarkdownEditor';
+export * from './BaseMarkdownEditor';
+/**
+ * MarkdownEditor 组件 - Markdown编辑器组件
+ *
+ * 该组件是一个功能完整的Markdown编辑器，基于BaseMarkdownEditor构建，
+ * 集成了标准插件集合，提供开箱即用的Markdown编辑功能。
+ *
+ * @component
+ * @description Markdown编辑器组件，提供完整的Markdown编辑功能
+ * @param {MarkdownEditorProps} props - 组件属性
+ * @param {string} [props.initValue] - 初始值
+ * @param {(value: string) => void} [props.onChange] - 内容变化回调
+ * @param {React.RefObject} [props.editorRef] - 编辑器引用
+ * @param {boolean} [props.readonly] - 是否只读模式
+ * @param {Plugin[]} [props.plugins] - 自定义插件列表
+ * @param {MarkdownRenderConfig} [props.markdownRenderConfig] - Markdown渲染配置
+ * @param {string} [props.className] - 自定义CSS类名
+ * @param {React.CSSProperties} [props.style] - 自定义样式
+ *
+ * @example
+ * ```tsx
+ * <MarkdownEditor
+ *   initValue="# Hello World"
+ *   onChange={(value) => console.log('内容变化:', value)}
+ *   editorRef={editorRef}
+ *   readonly={false}
+ * />
+ * ```
+ *
+ * @returns {React.ReactElement} 渲染的Markdown编辑器组件
+ *
+ * @remarks
+ * - 基于BaseMarkdownEditor构建
+ * - 集成标准插件集合
+ * - 支持自定义插件扩展
+ * - 提供完整的Markdown编辑功能
+ * - 支持只读模式
+ * - 支持内容变化监听
+ * - 提供编辑器引用
+ */
+export declare const MarkdownEditor: React.FC<MarkdownEditorProps>;

package/dist/MarkdownEditor/index.js

@@ -0,0 +1,36 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/MarkdownEditor/index.tsx
+import React from "react";
+import { standardPlugins } from "../plugins/defaultPlugins";
+import { BaseMarkdownEditor } from "./BaseMarkdownEditor";
+export * from "./BaseMarkdownEditor";
+var MarkdownEditor = (props) => {
+  return /* @__PURE__ */ React.createElement(
+    BaseMarkdownEditor,
+    __spreadProps(__spreadValues({}, props), {
+      plugins: [...standardPlugins || [], ...(props == null ? void 0 : props.plugins) || []]
+    })
+  );
+};
+export {
+  MarkdownEditor
+};

package/dist/MarkdownEditor/plugin.d.ts

@@ -0,0 +1,19 @@
+import { Node } from 'mdast';
+import React from 'react';
+import { Editor, NodeEntry } from 'slate';
+import { ElementProps, Elements } from './el';
+export type MarkdownEditorPlugin = {
+    elements?: Record<string, React.ComponentType<ElementProps<any>>>;
+    parseMarkdown?: {
+        match: (node: Node) => boolean;
+        convert: (node: Node) => Elements | NodeEntry<Text>;
+    }[];
+    toMarkdown?: {
+        match: (node: Elements) => boolean;
+        convert: (node: Elements) => Node;
+    }[];
+    withEditor?: (editor: Editor) => Editor;
+    hotkeys?: Record<string, (editor: Editor) => void>;
+    onPaste?: (text: string) => boolean;
+};
+export declare const PluginContext: React.Context<MarkdownEditorPlugin[]>;

package/dist/MarkdownEditor/plugin.js

@@ -0,0 +1,6 @@
+// src/MarkdownEditor/plugin.ts
+import React from "react";
+var PluginContext = React.createContext([]);
+export {
+  PluginContext
+};

package/dist/MarkdownEditor/style.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * BubbleChat
+ * @param prefixCls
+ * @returns
+ */
+export declare function useStyle(prefixCls?: string): {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};

package/dist/MarkdownEditor/style.js

@@ -0,0 +1,71 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/MarkdownEditor/style.ts
+import {
+  resetComponent,
+  useEditorStyleRegister
+} from "../hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      boxSizing: "border-box",
+      height: "max-content",
+      maxWidth: "100%",
+      outline: "none",
+      tabSize: 4,
+      position: "relative",
+      lineHeight: 1.7,
+      whiteSpace: "normal",
+      // 全局样式
+      "*": {
+        scrollbarWidth: "thin",
+        scrollbarColor: "hsl(240 5.9% 90%) transparent",
+        boxSizing: "border-box"
+      },
+      "div.composition div:not(.no-focus).empty:first-child::before": {
+        display: "none"
+      },
+      "> *": {
+        boxSizing: "border-box",
+        scrollbarWidth: "thin",
+        fontVariantNumeric: "tabular-nums",
+        WebkitTextSizeAdjust: "100%",
+        msTextSizeAdjust: "100%",
+        WebkitFontSmoothing: "antialiased",
+        scrollbarColor: "hsl(#e4e4e7) transparent"
+      },
+      "&-edit-area": {
+        outline: "none !important"
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("MarkdownEditor", (token) => {
+    const editorToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [resetComponent(editorToken), genStyle(editorToken)];
+  });
+}
+export {
+  useStyle
+};