@ant-design/agentic-ui 2.0.0

package/dist/MarkdownInputField/SendButton/index.js

@@ -0,0 +1,137 @@
+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;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// src/MarkdownInputField/SendButton/index.tsx
+import { ConfigProvider } from "antd";
+import classNames from "classnames";
+import { motion } from "framer-motion";
+import React, { useContext, useEffect } from "react";
+import { ErrorBoundary } from "react-error-boundary";
+import { StopIcon } from "../../AgentRunBar/icons";
+import { useStyle } from "./style";
+function SendIcon(props) {
+  const _a = props, { hover, typing, onInit } = _a, rest = __objRest(_a, ["hover", "typing", "onInit"]);
+  useEffect(() => {
+    onInit == null ? void 0 : onInit();
+  }, []);
+  if (typing) {
+    return /* @__PURE__ */ React.createElement(StopIcon, __spreadValues({}, rest));
+  }
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    __spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "none",
+      width: "1em",
+      height: "1em",
+      viewBox: "0 0 32 32"
+    }, rest),
+    /* @__PURE__ */ React.createElement(
+      motion.circle,
+      {
+        cx: "50%",
+        cy: "50%",
+        r: "0.5em",
+        animate: {
+          fill: hover ? "#14161C" : "#001C39",
+          fillOpacity: hover ? 1 : 0.03530000150203705
+        },
+        transition: {
+          duration: 0.6,
+          ease: "easeInOut"
+        }
+      }
+    ),
+    /* @__PURE__ */ React.createElement("g", null, /* @__PURE__ */ React.createElement(
+      motion.path,
+      {
+        d: "M16.667 12.943l3.528 3.528a.667.667 0 00.943-.942l-4.666-4.667a.665.665 0 00-.943 0l-4.667 4.667a.667.667 0 10.943.942l3.528-3.528v7.724a.667.667 0 101.334 0v-7.724z",
+        fillRule: "evenodd",
+        animate: {
+          fill: hover ? "#fff" : "#00183D",
+          fillOpacity: hover ? 1 : 0.24709999561309814
+        },
+        transition: {
+          duration: 0.2,
+          ease: "easeInOut"
+        }
+      }
+    ))
+  );
+}
+var SendButton = (props) => {
+  const { isSendable, disabled, typing, onClick, style } = props;
+  useEffect(() => {
+    var _a;
+    (_a = props.onInit) == null ? void 0 : _a.call(props);
+  }, []);
+  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
+  const baseCls = getPrefixCls("md-input-field-send-button");
+  const { wrapSSR, hashId } = useStyle(baseCls);
+  if (typeof window === "undefined" || typeof document === "undefined" || !window.document) {
+    return null;
+  }
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        "data-testid": "send-button",
+        onClick: () => {
+          if (!disabled) {
+            onClick();
+          }
+        },
+        role: "button",
+        tabIndex: 0,
+        onKeyDown: (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            onClick();
+          }
+        },
+        style,
+        className: classNames(baseCls, hashId, {
+          [`${baseCls}-compact`]: props.compact,
+          [`${baseCls}-disabled`]: disabled,
+          [`${baseCls}-typing`]: typing
+        })
+      },
+      /* @__PURE__ */ React.createElement(ErrorBoundary, { fallback: /* @__PURE__ */ React.createElement("div", null) }, /* @__PURE__ */ React.createElement(
+        SendIcon,
+        {
+          hover: isSendable && !disabled,
+          disabled,
+          typing
+        }
+      ))
+    )
+  );
+};
+export {
+  SendButton
+};

package/dist/MarkdownInputField/SendButton/style.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * Probubble
+ * @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/MarkdownInputField/SendButton/style.js

@@ -0,0 +1,70 @@
+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/MarkdownInputField/SendButton/style.ts
+import { Keyframes } from "@ant-design/cssinjs";
+import {
+  resetComponent,
+  useEditorStyleRegister
+} from "../../hooks/useStyle";
+var pauseIconRotate = new Keyframes("pauseIconRotate", {
+  "0%": {
+    transform: "rotate(0deg)"
+  },
+  "100%": {
+    transform: "rotate(360deg)"
+  }
+});
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      fontSize: "32px",
+      height: 32,
+      display: "flex",
+      alignItems: "center",
+      lineHeight: "32px",
+      cursor: "pointer",
+      "&&-disabled": {
+        cursor: "not-allowed",
+        opacity: 1
+      },
+      // 旋转动画样式
+      ".pause-icon-ring": {
+        transition: "transform 0.1s ",
+        transformOrigin: "16px 16px",
+        animationName: pauseIconRotate,
+        animationDuration: "1s",
+        animationTimingFunction: "linear",
+        animationIterationCount: "infinite"
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("SendButton", (token) => {
+    const proChatToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [resetComponent(proChatToken), genStyle(proChatToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/MarkdownInputField/SkillModeBar/hooks/index.d.ts

@@ -0,0 +1,4 @@
+/**
+ * SkillModeBar hooks 模块导出
+ */
+export { useSkillModeState } from './useSkillModeState';

package/dist/MarkdownInputField/SkillModeBar/hooks/index.js

@@ -0,0 +1,5 @@
+// src/MarkdownInputField/SkillModeBar/hooks/index.ts
+import { useSkillModeState } from "./useSkillModeState";
+export {
+  useSkillModeState
+};

package/dist/MarkdownInputField/SkillModeBar/hooks/useSkillModeState.d.ts

@@ -0,0 +1,22 @@
+import type { SkillModeConfig } from '../';
+/**
+ * 技能模式状态管理 Hook
+ * @description 处理技能模式的状态变化，具备以下特性：
+ * - 使用 useUpdateEffect 自动跳过初始化时的回调
+ * - 防止内部操作触发的重复回调
+ * - 只在真正的外部状态变化时触发回调
+ * @param skillMode 技能模式配置
+ * @param onSkillModeOpenChange 状态变化回调函数
+ * @returns 内部状态变化处理函数
+ *
+ * @example
+ * ```tsx
+ * const handleInternalChange = useSkillModeState(skillMode, onSkillModeOpenChange);
+ *
+ * // 在内部操作时使用
+ * const handleCloseClick = () => {
+ *   handleInternalChange(false); // 避免重复回调
+ * };
+ * ```
+ */
+export declare function useSkillModeState(skillMode?: SkillModeConfig, onSkillModeOpenChange?: (open: boolean) => void): (open: boolean) => void;

package/dist/MarkdownInputField/SkillModeBar/hooks/useSkillModeState.js

@@ -0,0 +1,30 @@
+// src/MarkdownInputField/SkillModeBar/hooks/useSkillModeState.ts
+import { useRef } from "react";
+import { useUpdateEffect } from "react-use";
+import { useRefFunction } from "../../../hooks/useRefFunction";
+function useSkillModeState(skillMode, onSkillModeOpenChange) {
+  const prevSkillModeOpenRef = useRef(skillMode == null ? void 0 : skillMode.open);
+  const skipNextCallbackRef = useRef(false);
+  const handleInternalSkillModeChange = useRefFunction((open) => {
+    if (onSkillModeOpenChange) {
+      skipNextCallbackRef.current = true;
+      onSkillModeOpenChange(open);
+    }
+  });
+  useUpdateEffect(() => {
+    const currentOpen = skillMode == null ? void 0 : skillMode.open;
+    const prevOpen = prevSkillModeOpenRef.current;
+    if (currentOpen !== prevOpen) {
+      prevSkillModeOpenRef.current = currentOpen;
+      if (skipNextCallbackRef.current) {
+        skipNextCallbackRef.current = false;
+        return;
+      }
+      onSkillModeOpenChange == null ? void 0 : onSkillModeOpenChange(!!currentOpen);
+    }
+  }, [skillMode == null ? void 0 : skillMode.open, onSkillModeOpenChange]);
+  return handleInternalSkillModeChange;
+}
+export {
+  useSkillModeState
+};

package/dist/MarkdownInputField/SkillModeBar/index.d.ts

@@ -0,0 +1,82 @@
+import React from 'react';
+/**
+ * 技能模式配置接口
+ * @interface SkillModeConfig
+ * @property {boolean} [enable] - 是否启用技能模式组件，默认为 true
+ * @property {boolean} [open] - 是否打开技能模式
+ * @property {React.ReactNode} [title] - 技能模式标题，支持字符串或React节点
+ * @property {React.ReactNode | React.ReactNode[]} [rightContent] - 右侧自定义内容，支持单个节点或数组
+ * @property {boolean} [closable] - 是否显示默认关闭按钮
+ * @property {React.CSSProperties} [style] - 技能模式容器样式
+ * @property {string} [className] - 技能模式容器类名
+ */
+export interface SkillModeConfig {
+    /**
+     * 是否启用技能模式组件
+     * @description 控制整个技能模式组件是否渲染，当为 false 时组件完全不渲染任何内容
+     * @default true
+     * @example enable={skillModeFeatureEnabled}
+     */
+    enable?: boolean;
+    /**
+     * 是否打开技能模式
+     * @description 控制技能模式的显示与隐藏状态
+     * @default false
+     * @example open={skillModeEnabled}
+     */
+    open?: boolean;
+    /**
+     * 技能模式标题
+     * @description 支持字符串或React节点
+     * @example title="AI助手模式"
+     * @example title={<Space><Icon />助手模式</Space>}
+     */
+    title?: React.ReactNode;
+    /**
+     * 右侧自定义内容
+     * @description 在技能模式右侧显示的自定义内容，支持单个节点或数组
+     * @example rightContent={<Tag>v2.0</Tag>}
+     * @example rightContent={[<Tag key="version">v2.0</Tag>, <Button key="settings">设置</Button>]}
+     */
+    rightContent?: React.ReactNode | React.ReactNode[];
+    /**
+     * 是否显示默认关闭按钮
+     * @description 控制是否在右侧显示默认的关闭按钮，点击后会触发 onSkillModeOpenChange(false)
+     * @default true
+     * @example closable={false} // 不显示关闭按钮
+     */
+    closable?: boolean;
+    /**
+     * 技能模式容器样式
+     * @description 应用于技能模式容器的内联样式
+     */
+    style?: React.CSSProperties;
+    /**
+     * 技能模式容器类名
+     * @description 应用于技能模式容器的CSS类名
+     */
+    className?: string;
+}
+export interface SkillModeBarProps {
+    /**
+     * 技能模式配置
+     */
+    skillMode?: SkillModeConfig;
+    /**
+     * 技能模式开关状态变化时触发的回调函数
+     * @description 监听技能模式 open 状态的所有变化，包括用户点击关闭按钮和外部直接修改状态
+     * @param open 新的开关状态
+     * @example onSkillModeOpenChange={(open) => {
+     *   console.log(`技能模式${open ? '打开' : '关闭'}`);
+     *   setSkillModeEnabled(open);
+     * }}
+     */
+    onSkillModeOpenChange?: (open: boolean) => void;
+}
+/**
+ * 技能模式条组件
+ * @description 用于显示技能模式的标题栏，包含标题、右侧内容和关闭按钮
+ * @param props - 组件属性
+ * @returns React 组件
+ */
+export declare const SkillModeBar: React.FC<SkillModeBarProps>;

package/dist/MarkdownInputField/SkillModeBar/index.js

@@ -0,0 +1,121 @@
+// src/MarkdownInputField/SkillModeBar/index.tsx
+import { CloseOutlined } from "@ant-design/icons";
+import { ConfigProvider, Divider, Flex } from "antd";
+import classNames from "classnames";
+import { AnimatePresence, motion } from "framer-motion";
+import React, { useContext } from "react";
+import { useSkillModeState } from "./hooks";
+import { useStyle } from "./style";
+var SkillModeBarInner = ({
+  skillMode,
+  onSkillModeOpenChange
+}) => {
+  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls("skill-mode");
+  const { wrapSSR, hashId } = useStyle(prefixCls);
+  const handleInternalSkillModeChange = useSkillModeState(
+    skillMode,
+    onSkillModeOpenChange
+  );
+  const rightContentArray = React.useMemo(() => {
+    if (!(skillMode == null ? void 0 : skillMode.rightContent))
+      return [];
+    return Array.isArray(skillMode.rightContent) ? skillMode.rightContent : [skillMode.rightContent];
+  }, [skillMode == null ? void 0 : skillMode.rightContent]);
+  const hasRightContent = rightContentArray.length > 0;
+  const isClosable = (skillMode == null ? void 0 : skillMode.closable) !== false;
+  const shouldShowDivider = hasRightContent && isClosable;
+  const handleCloseClick = (e) => {
+    e.stopPropagation();
+    handleInternalSkillModeChange(false);
+  };
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(AnimatePresence, null, (skillMode == null ? void 0 : skillMode.open) && /* @__PURE__ */ React.createElement(
+      motion.div,
+      {
+        role: "region",
+        "aria-live": "polite",
+        "aria-label": "技能模式",
+        initial: { height: 0, opacity: 0 },
+        animate: { height: "auto", opacity: 1 },
+        exit: { height: 0, opacity: 0 },
+        transition: { duration: 0.3, ease: [0.25, 0.1, 0.25, 1] },
+        className: classNames(`${prefixCls}-container`, hashId),
+        "data-testid": "skill-mode-bar"
+      },
+      /* @__PURE__ */ React.createElement(
+        motion.div,
+        {
+          initial: {
+            padding: "0px",
+            backgroundColor: "transparent",
+            borderColor: "transparent"
+          },
+          animate: {
+            padding: "12px",
+            backgroundColor: "var(--color-gray-bg-page)",
+            borderColor: "rgba(0, 16, 64, 0.0627)"
+          },
+          exit: {
+            padding: "0px",
+            backgroundColor: "transparent",
+            borderColor: "transparent"
+          },
+          transition: { duration: 0.3, ease: [0.25, 0.1, 0.25, 1] },
+          style: skillMode == null ? void 0 : skillMode.style,
+          className: classNames(`${prefixCls}`, hashId, skillMode == null ? void 0 : skillMode.className)
+        },
+        /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-title`, hashId) }, skillMode == null ? void 0 : skillMode.title),
+        /* @__PURE__ */ React.createElement(
+          Flex,
+          {
+            justify: "flex-end",
+            align: "center",
+            gap: 8,
+            className: classNames(`${prefixCls}-right`, hashId)
+          },
+          rightContentArray.map((content, index) => {
+            const key = React.isValidElement(content) && content.key ? content.key : index;
+            return /* @__PURE__ */ React.createElement(React.Fragment, { key }, content);
+          }),
+          shouldShowDivider && /* @__PURE__ */ React.createElement(
+            Divider,
+            {
+              type: "vertical",
+              className: classNames(`${prefixCls}-divider`, hashId)
+            }
+          ),
+          isClosable && /* @__PURE__ */ React.createElement(
+            "button",
+            {
+              type: "button",
+              "aria-label": "关闭技能模式",
+              className: classNames(`${prefixCls}-close`, hashId),
+              onClick: handleCloseClick,
+              "data-testid": "skill-mode-close"
+            },
+            /* @__PURE__ */ React.createElement(CloseOutlined, null)
+          )
+        )
+      )
+    ))
+  );
+};
+var SkillModeBar = ({
+  skillMode,
+  onSkillModeOpenChange
+}) => {
+  if (!skillMode || skillMode.enable === false) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    SkillModeBarInner,
+    {
+      skillMode,
+      onSkillModeOpenChange
+    }
+  );
+};
+export {
+  SkillModeBar
+};

package/dist/MarkdownInputField/SkillModeBar/style.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * SkillModeBar 样式 Hook
+ * @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/MarkdownInputField/SkillModeBar/style.js

@@ -0,0 +1,103 @@
+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/MarkdownInputField/SkillModeBar/style.ts
+import {
+  resetComponent,
+  useEditorStyleRegister
+} from "../../hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [`${token.componentCls}-container`]: {
+      // overflow: 'hidden', // 会把Quote的弹框遮挡
+      borderTopLeftRadius: "inherit",
+      borderTopRightRadius: "inherit"
+    },
+    [`${token.componentCls}`]: {
+      borderWidth: "0px 0px 1px 0px",
+      width: "100%",
+      height: "fit-content",
+      borderTopLeftRadius: "inherit",
+      borderTopRightRadius: "inherit",
+      minHeight: "48px",
+      alignSelf: "stretch",
+      borderStyle: "solid",
+      display: "flex",
+      alignItems: "flex-start",
+      justifyContent: "space-between"
+    },
+    [`${token.componentCls}-title`]: {
+      flex: 1,
+      font: "var(--font-text-h5-base)",
+      letterSpacing: "var(--letter-spacing-h5-base, normal)",
+      color: "var(--color-primary-control-fill-primary)",
+      minHeight: "28px"
+    },
+    [`${token.componentCls}-right`]: {
+      font: "var(--font-text-body-sm)",
+      letterSpacing: "var(--letter-spacing-body-sm, normal)",
+      color: "var(--color-gray-text-secondary)"
+    },
+    [`${token.componentCls}-divider`]: {
+      margin: "0"
+    },
+    [`${token.componentCls}-close`]: {
+      cursor: "pointer",
+      outline: "none",
+      border: "none",
+      background: "transparent",
+      padding: "4px",
+      borderRadius: "4px",
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      transition: "all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)",
+      color: "var(--color-gray-text-light)",
+      "&:hover": {
+        backgroundColor: "var(--color-gray-control-fill-active)",
+        color: "var(--color-gray-text-light)",
+        borderRadius: "var(--radius-control-sm)"
+      },
+      "&:active": {
+        backgroundColor: "var(--color-gray-control-fill-pressed)",
+        outline: "none",
+        border: "none"
+      },
+      "&:focus": {
+        outline: `2px solid ${token.colorPrimary}`,
+        outlineOffset: "2px"
+      },
+      "&:focus:not(:focus-visible)": {
+        outline: "none"
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("SkillModeBar", (token) => {
+    const skillModeToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [resetComponent(skillModeToken), genStyle(skillModeToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/MarkdownInputField/Suggestion/index.d.ts

@@ -0,0 +1,75 @@
+import React from 'react';
+import { MarkdownEditorProps } from '../../MarkdownEditor';
+import { TagPopupProps } from '../../MarkdownEditor/editor/elements/TagPopup';
+/**
+ * 建议面板状态的 React 上下文
+ *
+ * 该上下文用于管理建议面板（Suggestion）的显示状态，允许组件树中的任何组件访问或修改面板的开关状态。
+ *
+ * @interface
+ * @property {boolean} [open] - 控制建议面板是否打开的状态
+ * @property {function} [setOpen] - 设置建议面板开关状态的函数
+ * @example
+ * // 在消费组件中使用此上下文
+ * const { open, setOpen } = useContext(SuggestionConnext);
+ * // 打开建议面板
+ * setOpen?.(true);
+ */
+export declare const SuggestionConnext: React.Context<{
+    open?: boolean | undefined;
+    setOpen?: ((open: boolean) => void) | undefined;
+    isRender: true;
+    onSelectRef?: React.MutableRefObject<((value: string) => void | undefined) | undefined> | undefined;
+    triggerNodeContext?: React.MutableRefObject<(TagPopupProps & {
+        text?: string | undefined;
+        placeholder?: string | undefined;
+    }) | undefined> | undefined;
+}>;
+/**
+ * Suggestion 组件 - 自动完成建议组件
+ *
+ * 该组件提供输入框的自动完成功能，支持静态建议列表和动态加载建议。
+ * 当用户输入时显示相关建议，支持键盘导航和点击选择。
+ *
+ * @component
+ * @description 自动完成建议组件，提供输入建议和选择功能
+ * @param {Object} props - 组件属性
+ * @param {React.ReactNode} props.children - 子组件，通常是输入框
+ * @param {TagInputProps} [props.tagInputProps] - 标签输入配置
+ * @param {Array|Function} [props.tagInputProps.items] - 建议项列表或加载函数
+ * @param {boolean} [props.tagInputProps.open] - 是否显示下拉菜单
+ * @param {(open: boolean) => void} [props.tagInputProps.onOpenChange] - 下拉菜单状态变化回调
+ * @param {Function} [props.tagInputProps.dropdownRender] - 自定义下拉菜单渲染
+ * @param {React.ReactNode} [props.tagInputProps.menu] - 自定义菜单内容
+ * @param {React.CSSProperties} [props.tagInputProps.dropdownStyle] - 下拉菜单样式
+ * @param {React.ReactNode} [props.tagInputProps.notFoundContent] - 无数据时显示的内容
+ *
+ * @example
+ * ```tsx
+ * <Suggestion
+ *   tagInputProps={{
+ *     items: [
+ *       { key: 'item1', label: '建议项1' },
+ *       { key: 'item2', label: '建议项2' }
+ *     ],
+ *     onOpenChange: (open) => console.log('下拉状态:', open)
+ *   }}
+ * >
+ *   <Input placeholder="请输入..." />
+ * </Suggestion>
+ * ```
+ *
+ * @returns {React.ReactElement} 渲染的自动完成建议组件
+ *
+ * @remarks
+ * - 支持静态建议列表和动态加载
+ * - 提供键盘导航功能
+ * - 支持自定义下拉菜单渲染
+ * - 支持加载状态显示
+ * - 自动处理选择事件
+ * - 支持自定义样式和内容
+ */
+export declare const Suggestion: React.FC<{
+    children: React.ReactNode;
+    tagInputProps?: MarkdownEditorProps['tagInputProps'];
+}>;