@ant-design/agentic-ui 2.0.0

package/dist/MarkdownEditor/editor/code.css

@@ -0,0 +1,47 @@
+/* Ace编辑器容器样式 */
+.ace-container {
+  position: relative;
+  min-width: min(320px, 100%);
+  margin-top: 8px;
+}
+
+.ace-container.frontmatter:before {
+  top: 3px;
+  content: 'Front Matter';
+  width: 100%;
+  height: 22px;
+  line-height: 21px;
+  position: absolute;
+  z-index: 10;
+  left: 0;
+  padding-left: 10px;
+  font-size: var(--font-size-sm);
+  color: var(--color-gray-text-secondary);
+}
+
+.ace-container.frontmatter:is(.dark *):before {
+  color: var(--color-gray-text-secondary);
+}
+
+.ace_hidden-cursors {
+  display: none !important;
+}
+
+.ace_gutter {
+  color: rgba(255, 255, 255, 0.45);
+  font: var(--font-text-code-base);
+  letter-spacing: var(--letter-spacing-code-base, normal);
+  background: transparent;
+}
+
+.ace_gutter-cell {
+  padding-left: 12px;
+}
+
+.ace-container .ace_gutter {
+  background: transparent;
+}
+
+.code-editor-content .ace-chaos {
+  background: transparent;
+}

package/dist/MarkdownEditor/editor/components/CommentList/index.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+import { CommentDataType, MarkdownEditorProps } from '../../../BaseMarkdownEditor';
+/**
+ * CommentList 组件 - 评论列表组件
+ *
+ * 该组件用于显示文档中的评论列表，支持评论的查看、编辑、删除和跳转功能。
+ * 使用 Framer Motion 提供流畅的动画效果，集成 Ant Design 组件。
+ *
+ * @component
+ * @description 评论列表组件，显示文档评论并提供交互功能
+ * @param {Object} props - 组件属性
+ * @param {CommentDataType[]} props.commentList - 评论数据列表
+ * @param {MarkdownEditorProps['comment']} props.comment - 评论配置对象
+ * @param {React.CSSProperties} [props.style] - 自定义样式
+ * @param {string} [props.className] - 自定义CSS类名
+ *
+ * @example
+ * ```tsx
+ * <CommentList
+ *   commentList={comments}
+ *   comment={{
+ *     onClick: (id, comment) => console.log('点击评论', id),
+ *     onEdit: (id, comment) => console.log('编辑评论', id),
+ *     onDelete: (id, comment) => console.log('删除评论', id)
+ *   }}
+ * />
+ * ```
+ *
+ * @returns {React.ReactElement} 渲染的评论列表组件
+ *
+ * @remarks
+ * - 支持评论的查看、编辑、删除操作
+ * - 提供评论位置跳转功能
+ * - 使用 Framer Motion 实现动画效果
+ * - 集成 Ant Design 组件（Avatar、Tooltip、Popconfirm）
+ * - 支持用户头像和名称显示
+ * - 显示评论时间戳
+ * - 响应式布局设计
+ * - 支持自定义样式和类名
+ */
+export declare const CommentList: React.FC<{
+    commentList: CommentDataType[];
+    comment: MarkdownEditorProps['comment'];
+    style?: React.CSSProperties;
+    className?: string;
+    pure?: boolean;
+}>;

package/dist/MarkdownEditor/editor/components/CommentList/index.js

@@ -0,0 +1,262 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/MarkdownEditor/editor/components/CommentList/index.tsx
+import {
+  CloseOutlined,
+  DeleteFilled,
+  EditOutlined,
+  ExportOutlined
+} from "@ant-design/icons";
+import { Avatar, ConfigProvider, Popconfirm, Tooltip } from "antd";
+import classNames from "classnames";
+import dayjs from "dayjs";
+import { motion } from "framer-motion";
+import React, { useContext } from "react";
+import { Transforms } from "slate";
+import { EditorStoreContext, useEditorStore } from "../../store";
+import { useStyle } from "./style";
+var navVariants = {
+  open: {
+    transition: { staggerChildren: 0.07, delayChildren: 0.2 }
+  },
+  closed: {
+    transition: { staggerChildren: 0.05, staggerDirection: -1 }
+  }
+};
+var itemVariants = {
+  open: {
+    y: 0,
+    opacity: 1,
+    transition: {
+      y: { stiffness: 1e3, velocity: -100 }
+    }
+  },
+  closed: {
+    y: 50,
+    opacity: 0,
+    transition: {
+      y: { stiffness: 1e3 }
+    }
+  }
+};
+var CommentList = (props) => {
+  var _a, _b;
+  const { markdownEditorRef } = useEditorStore();
+  const context = useContext(ConfigProvider.ConfigContext);
+  const { setShowComment } = useContext(EditorStoreContext) || {};
+  const baseCls = context == null ? void 0 : context.getPrefixCls("md-editor-comment-view");
+  const { wrapSSR, hashId } = useStyle(baseCls);
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(React.Fragment, null, !props.pure ? /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        style: {
+          width: "300px"
+        }
+      }
+    ) : null, /* @__PURE__ */ React.createElement(
+      motion.div,
+      {
+        style: props.style,
+        className: classNames(hashId, props.className, baseCls),
+        initial: { transform: "translateX(100%)", opacity: 0 },
+        animate: { transform: "translateX(0)", opacity: 1 },
+        exit: { transform: "translateX(100%)", opacity: 0 }
+      },
+      /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          style: {
+            display: "flex",
+            justifyContent: "space-between",
+            padding: "8px 12px",
+            cursor: "pointer"
+          }
+        },
+        "划词评论 (",
+        (_a = props.commentList) == null ? void 0 : _a.length,
+        ")",
+        /* @__PURE__ */ React.createElement(
+          CloseOutlined,
+          {
+            onClick: () => {
+              setShowComment == null ? void 0 : setShowComment([]);
+            }
+          }
+        )
+      ),
+      /* @__PURE__ */ React.createElement(
+        motion.div,
+        {
+          variants: navVariants,
+          style: {
+            display: "flex",
+            flexDirection: "column",
+            gap: 8
+          },
+          initial: "closed",
+          whileInView: "open"
+        },
+        (_b = props.commentList) == null ? void 0 : _b.map((item, index) => {
+          var _a2, _b2, _c, _d, _e, _f, _g, _h, _i;
+          return /* @__PURE__ */ React.createElement(
+            motion.div,
+            {
+              key: index,
+              whileHover: { scale: 1.04 },
+              variants: itemVariants,
+              onClick: (e) => __async(void 0, null, function* () {
+                var _a3, _b3;
+                e.stopPropagation();
+                e.preventDefault();
+                yield (_b3 = (_a3 = props.comment) == null ? void 0 : _a3.onClick) == null ? void 0 : _b3.call(_a3, item.id, item);
+              }),
+              className: classNames(`${baseCls}-item`, hashId)
+            },
+            /* @__PURE__ */ React.createElement("div", { className: classNames(`${baseCls}-item-header`, hashId) }, /* @__PURE__ */ React.createElement(
+              "div",
+              {
+                className: classNames(
+                  `${baseCls}-item-header-title`,
+                  hashId
+                )
+              },
+              /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
+                "div",
+                {
+                  className: classNames(
+                    `${baseCls}-item-header-name`,
+                    hashId
+                  )
+                },
+                /* @__PURE__ */ React.createElement(Avatar, { src: (_a2 = item.user) == null ? void 0 : _a2.avatar, size: 14 }, ((_e = (_d = (_c = (_b2 = item.user) == null ? void 0 : _b2.name) == null ? void 0 : _c.split(" ")) == null ? void 0 : _d.map(
+                  (item2) => {
+                    var _a3;
+                    return (_a3 = item2 == null ? void 0 : item2.split("").at(0)) == null ? void 0 : _a3.toUpperCase();
+                  }
+                )) == null ? void 0 : _e.join("")) || ""),
+                (_f = item.user) == null ? void 0 : _f.name
+              ), /* @__PURE__ */ React.createElement(
+                "div",
+                {
+                  className: classNames(
+                    `${baseCls}-item-header-time`,
+                    hashId
+                  )
+                },
+                dayjs(item.time).format("YYYY-MM-DD HH:mm:ss")
+              ))
+            ), /* @__PURE__ */ React.createElement(
+              "div",
+              {
+                className: classNames(
+                  `${baseCls}-item-header-action`,
+                  hashId
+                )
+              },
+              ((_g = props.comment) == null ? void 0 : _g.onDelete) ? /* @__PURE__ */ React.createElement(
+                Popconfirm,
+                {
+                  title: ((_h = props.comment) == null ? void 0 : _h.deleteConfirmText) || "Are you sure to delete this comment?",
+                  onConfirm: (e) => __async(void 0, null, function* () {
+                    var _a3, _b3;
+                    e == null ? void 0 : e.stopPropagation();
+                    e == null ? void 0 : e.preventDefault();
+                    try {
+                      yield (_b3 = (_a3 = props.comment) == null ? void 0 : _a3.onDelete) == null ? void 0 : _b3.call(_a3, item.id, item);
+                      Transforms.setNodes(
+                        markdownEditorRef.current,
+                        {
+                          updateTimestamp: Date.now()
+                        },
+                        {
+                          at: item.path
+                        }
+                      );
+                    } catch (error) {
+                    }
+                  })
+                },
+                /* @__PURE__ */ React.createElement(Tooltip, { title: "删除评论" }, /* @__PURE__ */ React.createElement(
+                  "span",
+                  {
+                    className: classNames(
+                      `${baseCls}-item-header-action-item`,
+                      hashId
+                    )
+                  },
+                  /* @__PURE__ */ React.createElement(DeleteFilled, null)
+                ))
+              ) : null,
+              ((_i = props.comment) == null ? void 0 : _i.onEdit) ? /* @__PURE__ */ React.createElement(Tooltip, { title: "编辑评论" }, /* @__PURE__ */ React.createElement(
+                "span",
+                {
+                  className: classNames(
+                    `${baseCls}-item-header-action-item`,
+                    hashId
+                  ),
+                  onClick: (e) => __async(void 0, null, function* () {
+                    var _a3, _b3;
+                    e.stopPropagation();
+                    e.preventDefault();
+                    yield (_b3 = (_a3 = props.comment) == null ? void 0 : _a3.onEdit) == null ? void 0 : _b3.call(_a3, item.id, item);
+                  })
+                },
+                /* @__PURE__ */ React.createElement(EditOutlined, null)
+              )) : null,
+              /* @__PURE__ */ React.createElement(Tooltip, { title: "跳转到评论位置" }, /* @__PURE__ */ React.createElement(
+                "span",
+                {
+                  className: classNames(
+                    `${baseCls}-item-header-action-item`,
+                    hashId
+                  ),
+                  onClick: (e) => __async(void 0, null, function* () {
+                    var _a3, _b3;
+                    e.stopPropagation();
+                    e.preventDefault();
+                    const element = document.getElementById(
+                      `comment-${item.id}`
+                    );
+                    if (element) {
+                      element.scrollIntoView({
+                        behavior: "smooth",
+                        block: "start"
+                      });
+                      window.scrollBy(0, -40);
+                    }
+                    yield (_b3 = (_a3 = props.comment) == null ? void 0 : _a3.onClick) == null ? void 0 : _b3.call(_a3, item.id, item);
+                  })
+                },
+                /* @__PURE__ */ React.createElement(ExportOutlined, null)
+              ))
+            )),
+            /* @__PURE__ */ React.createElement("div", { className: classNames(`${baseCls}-item-content`, hashId) }, item.content)
+          );
+        })
+      )
+    ))
+  );
+};
+export {
+  CommentList
+};

package/dist/MarkdownEditor/editor/components/CommentList/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/editor/components/CommentList/style.js

@@ -0,0 +1,97 @@
+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/editor/components/CommentList/style.ts
+import {
+  useEditorStyleRegister
+} from "../../../../hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      display: "flex",
+      flexDirection: "column",
+      position: "fixed",
+      right: 0,
+      top: 0,
+      width: 300,
+      padding: 16,
+      paddingRight: 24,
+      boxSizing: "border-box",
+      gap: 8,
+      borderLeft: "1px solid rgba(0,0,0,0.04)",
+      maxWidth: "300px",
+      backgroundColor: "#fff",
+      height: "100vh",
+      "&-item": {
+        padding: "12px",
+        border: "1px solid rgba(0,0,0,0.04)",
+        borderRadius: 8,
+        cursor: "pointer",
+        display: "flex",
+        flexDirection: "column",
+        gap: 8,
+        "&:hover": {
+          backgroundColor: "#f9f9f9"
+        },
+        "&-header": {
+          display: "flex",
+          gap: 8,
+          justifyContent: "space-between",
+          "&-title": {
+            display: "flex",
+            gap: 8,
+            flex: 1,
+            alignItems: "flex-end"
+          },
+          "&-name": {
+            display: "flex",
+            gap: 4,
+            alignItems: "center"
+          },
+          "&-time": {
+            color: "#bfbfbf",
+            fontSize: "12px"
+          },
+          "&-action": {
+            display: "flex",
+            gap: 8,
+            "& &-item": {
+              cursor: "pointer",
+              "&:hover": {
+                color: token.colorPrimary
+              }
+            }
+          }
+        }
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("editor-content-column", (token) => {
+    const editorToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(editorToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/MarkdownEditor/editor/components/ContributorAvatar/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+type AvatarListItem = {
+    name: string;
+    collaboratorNumber: number;
+};
+interface ContributorAvatarProps {
+    loading?: boolean;
+    item?: AvatarListItem;
+    index?: number;
+    className: string;
+}
+export declare const ContributorAvatar: React.FC<ContributorAvatarProps>;
+export declare const AvatarList: React.FC<{
+    displayList: AvatarListItem[];
+    style?: React.CSSProperties;
+}>;
+export {};

package/dist/MarkdownEditor/editor/components/ContributorAvatar/index.js

@@ -0,0 +1,74 @@
+var __defProp = Object.defineProperty;
+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;
+};
+
+// src/MarkdownEditor/editor/components/ContributorAvatar/index.tsx
+import { Avatar, ConfigProvider, Tooltip } from "antd";
+import classNames from "classnames";
+import React from "react";
+import { useStyle } from "./style";
+var COLOR_LIST = [
+  "#f56a00",
+  "#7265e6",
+  "#ffbf00",
+  "#00a2ae",
+  "#f44336",
+  "#87d068"
+];
+var ContributorAvatar = (props) => {
+  const { item: { name } = {}, index = 0 } = props;
+  return /* @__PURE__ */ React.createElement(Tooltip, { title: name }, /* @__PURE__ */ React.createElement("div", { className: props.className }, /* @__PURE__ */ React.createElement(
+    Avatar,
+    {
+      size: 14,
+      alt: name,
+      style: {
+        backgroundColor: COLOR_LIST[index % COLOR_LIST.length],
+        cursor: "pointer"
+      }
+    },
+    name == null ? void 0 : name.slice(0, 2)
+  )));
+};
+var AvatarList = ({ displayList, style }) => {
+  const context = React.useContext(ConfigProvider.ConfigContext);
+  const baseCls = context == null ? void 0 : context.getPrefixCls("md-editor-contributor-avatar-list");
+  const { wrapSSR, hashId } = useStyle(baseCls);
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: classNames(hashId, baseCls),
+        style: __spreadValues({}, style)
+      },
+      displayList.map((item, index) => {
+        return /* @__PURE__ */ React.createElement(
+          ContributorAvatar,
+          {
+            key: item.name,
+            className: classNames(`${baseCls}-item`, hashId),
+            item,
+            index
+          }
+        );
+      })
+    ))
+  );
+};
+export {
+  AvatarList,
+  ContributorAvatar
+};

package/dist/MarkdownEditor/editor/components/ContributorAvatar/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/editor/components/ContributorAvatar/style.js

@@ -0,0 +1,57 @@
+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/editor/components/ContributorAvatar/style.ts
+import {
+  useEditorStyleRegister
+} from "../../../../hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      display: "flex",
+      alignItems: "center",
+      boxSizing: "border-box",
+      listStyle: "none",
+      margin: 0,
+      padding: 0,
+      flexFlow: "wrap",
+      "&-item": {
+        display: "inline-block",
+        marginRight: "-8px",
+        transition: "all 0.3s"
+      },
+      "&:hover &-item": {
+        display: "inline-block",
+        marginRight: "0px"
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("editor-content-contributorAvatar", (token) => {
+    const editorToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(editorToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/MarkdownEditor/editor/components/LazyElement/index.d.ts

@@ -0,0 +1,45 @@
+import React from 'react';
+/**
+ * LazyElement 组件属性
+ */
+export interface LazyElementProps {
+    /** 子元素 */
+    children: React.ReactNode;
+    /** 占位符高度，默认 100px */
+    placeholderHeight?: number;
+    /** 根边距，用于提前加载，默认 '200px' */
+    rootMargin?: string;
+    /** 占位符样式 */
+    placeholderStyle?: React.CSSProperties;
+}
+/**
+ * LazyElement 组件 - 懒加载元素包裹器
+ *
+ * 使用 IntersectionObserver API 实现元素的懒加载渲染。
+ * 只有当元素进入视口时才会真正渲染内容，否则显示占位符。
+ * 这可以显著提升大型文档的渲染性能。
+ *
+ * @component
+ * @description 基于 IntersectionObserver 的懒加载包裹器
+ * @param {LazyElementProps} props - 组件属性
+ * @param {React.ReactNode} props.children - 需要懒加载的子元素
+ * @param {number} [props.placeholderHeight=100] - 占位符高度
+ * @param {string} [props.rootMargin='200px'] - 提前加载的距离
+ * @param {React.CSSProperties} [props.placeholderStyle] - 自定义占位符样式
+ *
+ * @example
+ * ```tsx
+ * <LazyElement placeholderHeight={150} rootMargin="300px">
+ *   <div>这是需要懒加载的内容</div>
+ * </LazyElement>
+ * ```
+ *
+ * @returns {React.ReactElement} 渲染的懒加载元素
+ *
+ * @remarks
+ * - 使用 IntersectionObserver 监听元素是否进入视口
+ * - 元素一旦被渲染后将保持渲染状态（不会卸载）
+ * - 提供 rootMargin 参数可以提前加载元素
+ * - 占位符保持与内容相同的高度以避免布局抖动
+ */
+export declare const LazyElement: React.FC<LazyElementProps>;