paul-ai-assistant 0.1.16

package/es/components/ModelSelect/ModeDropdown.js

@@ -0,0 +1,118 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/**
+ * @author qytan
+ * @description 模式选择的Dropdown
+ */
+import React, { useEffect, useRef, useState } from 'react';
+import { Dropdown, Tooltip } from '@alife/magic-basic';
+import classNames from 'classnames';
+import { FEATURE_MODE_TYPE_KEY, FEATURE_MODE_TYPE_MAP } from "./const";
+import "./index.scss";
+var ModeDropdown = function ModeDropdown(_ref) {
+  var item = _ref.item,
+    featureConfig = _ref.featureConfig,
+    setFeatureConfig = _ref.setFeatureConfig;
+  var _ref2 = item || {},
+    value = _ref2.value,
+    label = _ref2.label,
+    icon = _ref2.icon,
+    modeType = _ref2.modeType,
+    children = _ref2.children;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    openVisible = _useState2[0],
+    setOpenVisible = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    tipVisible = _useState4[0],
+    setTipVisible = _useState4[1];
+  var _useState5 = useState(true),
+    _useState6 = _slicedToArray(_useState5, 2),
+    showLabel = _useState6[0],
+    setShowLabel = _useState6[1]; // 新增状态控制label显示
+  var resizeObserverRef = useRef(null);
+
+  // 监听元素尺寸变化
+  useEffect(function () {
+    var targetElement = document.querySelector('.assistant-chat-paul-ai-bottom-reply-send-btn');
+    if (!targetElement) return;
+
+    // 清除之前的观察器
+    if (resizeObserverRef.current) {
+      resizeObserverRef.current.disconnect();
+    }
+
+    // 使用ResizeObserver监听元素尺寸变化
+    var resizeObserver = new ResizeObserver(function () {
+      // 初始检查
+      if (targetElement) {
+        var replyBtnWidth = targetElement.getBoundingClientRect().width;
+        setShowLabel(replyBtnWidth >= 360);
+      }
+    });
+    resizeObserverRef.current = resizeObserver;
+    resizeObserver.observe(targetElement);
+    return function () {
+      if (resizeObserverRef.current) {
+        resizeObserverRef.current.disconnect();
+        resizeObserverRef.current = null;
+      }
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    key: value
+  }, /*#__PURE__*/React.createElement(Dropdown, {
+    trigger: ['click'],
+    overlayClassName: "goc-tag-item-self-popover",
+    open: openVisible,
+    onOpenChange: setOpenVisible,
+    dropdownRender: function dropdownRender() {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "dropdown-custom-mode-type-content"
+      }, children === null || children === void 0 ? void 0 : children.map(function (cItem) {
+        return /*#__PURE__*/React.createElement("div", {
+          key: cItem.value,
+          className: classNames('mode-type-menu-item', {
+            'mode-type-menu-item-on': (cItem === null || cItem === void 0 ? void 0 : cItem.value) !== FEATURE_MODE_TYPE_KEY.OFF,
+            'mode-type-menu-item-selected': (cItem === null || cItem === void 0 ? void 0 : cItem.value) === featureConfig[modeType]
+          }),
+          onClick: function onClick() {
+            setFeatureConfig(_objectSpread(_objectSpread({}, featureConfig), {}, _defineProperty({}, modeType, cItem === null || cItem === void 0 ? void 0 : cItem.value)));
+            setOpenVisible(false);
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "mode-type-icon-container"
+        }, icon, cItem.value === FEATURE_MODE_TYPE_KEY.AUTO && /*#__PURE__*/React.createElement("div", {
+          className: "status-indicator-green"
+        })), /*#__PURE__*/React.createElement("div", {
+          className: "mode-type-menu-item-content"
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "mode-type-menu-item-content-label"
+        }, cItem === null || cItem === void 0 ? void 0 : cItem.label), /*#__PURE__*/React.createElement("div", {
+          className: "mode-type-menu-item-content-describe"
+        }, cItem === null || cItem === void 0 ? void 0 : cItem.describe)));
+      }));
+    },
+    placement: "topLeft"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: classNames('goc-tag-item-self', {
+      'goc-tag-item-self--selected': featureConfig[modeType] === FEATURE_MODE_TYPE_KEY.AUTO || featureConfig[modeType] === FEATURE_MODE_TYPE_KEY.ON
+    }),
+    onClick: function onClick() {
+      return setTipVisible(false);
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "mode-type-icon-container"
+  }, icon, featureConfig[modeType] === FEATURE_MODE_TYPE_KEY.AUTO && /*#__PURE__*/React.createElement("div", {
+    className: "status-indicator-green small-indicator"
+  })), showLabel ? /*#__PURE__*/React.createElement(React.Fragment, null, label, ":", FEATURE_MODE_TYPE_MAP[featureConfig[modeType]]) : /*#__PURE__*/React.createElement(Tooltip, {
+    title: label,
+    open: tipVisible,
+    onOpenChange: function onOpenChange(visible) {
+      return setTipVisible(visible);
+    }
+  }, FEATURE_MODE_TYPE_MAP[featureConfig[modeType]]))));
+};
+export default ModeDropdown;

package/es/components/ModelSelect/const.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+export declare const AIGC_MODE_TYPE_V2: {
+    REASONING_QWEN: string;
+    REASONING_DEEPSEEK: string;
+};
+export declare const AIGC_MODE_TYPE_V2_MAP: {
+    [x: string]: string;
+};
+export declare const FEATURE_MODE_TYPE_KEY: {
+    AUTO: string;
+    ON: string;
+    OFF: string;
+};
+export declare const FEATURE_MODE_TYPE_MAP: {
+    [x: string]: string;
+};
+export declare const AIGC_MODE_TYPE_V2_LIST: {
+    icon: React.JSX.Element;
+    value: string;
+    label: string;
+    balloonText: string;
+    featureConfigKey: string;
+    modeType: string;
+    children: {
+        label: string;
+        value: string;
+        key: string;
+        describe: string;
+    }[];
+}[];

package/es/components/ModelSelect/const.js

@@ -0,0 +1,61 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import React from 'react';
+import { EarthO, GeometryO } from '@alife/magic-icons';
+export var AIGC_MODE_TYPE_V2 = {
+  REASONING_QWEN: 'REASONING_QWEN',
+  REASONING_DEEPSEEK: 'REASONING_DEEPSEEK'
+};
+export var AIGC_MODE_TYPE_V2_MAP = _defineProperty(_defineProperty({}, AIGC_MODE_TYPE_V2.REASONING_QWEN, '深度思考'), AIGC_MODE_TYPE_V2.REASONING_DEEPSEEK, '联网搜索');
+export var FEATURE_MODE_TYPE_KEY = {
+  AUTO: 'AUTO',
+  ON: 'ON',
+  OFF: 'OFF'
+};
+export var FEATURE_MODE_TYPE_MAP = _defineProperty(_defineProperty(_defineProperty({}, FEATURE_MODE_TYPE_KEY.AUTO, '自动'), FEATURE_MODE_TYPE_KEY.ON, '开'), FEATURE_MODE_TYPE_KEY.OFF, '关闭');
+export var AIGC_MODE_TYPE_V2_LIST = [{
+  icon: /*#__PURE__*/React.createElement(GeometryO, null),
+  value: AIGC_MODE_TYPE_V2.REASONING_QWEN,
+  label: AIGC_MODE_TYPE_V2_MAP[AIGC_MODE_TYPE_V2.REASONING_QWEN],
+  balloonText: '',
+  featureConfigKey: 'thinkingEnabled',
+  modeType: 'thinkingMode',
+  children: [{
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.AUTO],
+    value: FEATURE_MODE_TYPE_KEY.AUTO,
+    key: FEATURE_MODE_TYPE_KEY.AUTO,
+    describe: '根据上下文智能切换'
+  }, {
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.ON],
+    value: FEATURE_MODE_TYPE_KEY.ON,
+    key: FEATURE_MODE_TYPE_KEY.ON,
+    describe: '输出带推理过程的答案'
+  }, {
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.OFF],
+    value: FEATURE_MODE_TYPE_KEY.OFF,
+    key: FEATURE_MODE_TYPE_KEY.OFF,
+    describe: '快速直接回答问题'
+  }]
+}, {
+  icon: /*#__PURE__*/React.createElement(EarthO, null),
+  value: AIGC_MODE_TYPE_V2.REASONING_DEEPSEEK,
+  label: AIGC_MODE_TYPE_V2_MAP[AIGC_MODE_TYPE_V2.REASONING_DEEPSEEK],
+  balloonText: '',
+  featureConfigKey: 'webSearchEnabled',
+  modeType: 'webSearchMode',
+  children: [{
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.AUTO],
+    value: FEATURE_MODE_TYPE_KEY.AUTO,
+    key: FEATURE_MODE_TYPE_KEY.AUTO,
+    describe: '根据上下文智能切换'
+  }, {
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.ON],
+    value: FEATURE_MODE_TYPE_KEY.ON,
+    key: FEATURE_MODE_TYPE_KEY.ON,
+    describe: '基于联网搜索生成答案'
+  }, {
+    label: FEATURE_MODE_TYPE_MAP[FEATURE_MODE_TYPE_KEY.OFF],
+    value: FEATURE_MODE_TYPE_KEY.OFF,
+    key: FEATURE_MODE_TYPE_KEY.OFF,
+    describe: '基于应用及MCP回答'
+  }]
+}];

package/es/components/ModelSelect/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.scss';
+declare const ModelSelectV2: (props: any) => React.JSX.Element;
+export default ModelSelectV2;

package/es/components/ModelSelect/index.js

@@ -0,0 +1,45 @@
+import React, { useContext } from 'react';
+import { AssistantChatContext } from "../../context";
+import { AIGC_MODE_TYPE_V2_LIST } from "./const";
+import ModeDropdown from "./ModeDropdown";
+import "./index.scss";
+var ModelSelectV2 = function ModelSelectV2(props) {
+  var _props$visible = props.visible,
+    visible = _props$visible === void 0 ? false : _props$visible;
+  var _useContext = useContext(AssistantChatContext),
+    featureConfig = _useContext.featureConfig,
+    setFeatureConfig = _useContext.setFeatureConfig;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "model-select-container",
+    style: {
+      display: visible ? 'block' : 'none'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "all-goc-tag-item"
+  }, AIGC_MODE_TYPE_V2_LIST.map(function (item) {
+    return /*#__PURE__*/React.createElement(ModeDropdown, {
+      key: item.value,
+      item: item,
+      featureConfig: featureConfig,
+      setFeatureConfig: setFeatureConfig
+    });
+    // return (
+    //   <span
+    //     key={value}
+    //     className={classNames('goc-tag-item-self', {
+    //       'goc-tag-item-self--selected': featureConfig[featureConfigKey],
+    //     })}
+    //     onClick={() => {
+    //       setFeatureConfig({
+    //         ...featureConfig,
+    //         [featureConfigKey]: !featureConfig[featureConfigKey],
+    //       });
+    //     }}
+    //   >
+    //     {icon}
+    //     {label}
+    //   </span>
+    // );
+  })));
+};
+export default ModelSelectV2;

package/es/components/ModelSelect/index.scss

@@ -0,0 +1,121 @@
+.model-select-container {
+  .all-goc-tag-item {
+    display: flex;
+  }
+  .goc-tag-item-self {
+    cursor: pointer;
+    display: inline-block;
+    font-size: 12px;
+    color: #474a52;
+    line-height: 28px;
+    height: 28px;
+    border-radius: 14px;
+    box-sizing: content-box;
+    padding: 0 8px;
+    margin-right: 8px;
+    background-color: #f1f2f3;
+    display: flex;
+    align-items: center;
+    .magic-icon {
+      margin-right: 5px;
+      color: #81848f;
+    }
+  }
+
+  .goc-tag-item-self {
+    &--selected {
+      color: #1b58f4;
+      background-color: #ebf1ff;
+      .magic-icon {
+        color: #1b58f4;
+      }
+    }
+  }
+}
+
+.goc-tag-item-self-popover {
+  background-color: #ffffff;
+  box-shadow: 0 2px 16px 0 rgba(129, 132, 143, 0.24);
+  border-radius: 12px;
+
+  .dropdown-custom-mode-type-content {
+    padding: 8px;
+  }
+
+  .mode-type-menu-item {
+    display: flex;
+    align-items: center;
+    padding: 4px;
+    margin-bottom: 4px;
+    border-radius: 8px;
+    cursor: pointer;
+
+    &:last-child {
+      margin-bottom: 0px;
+    }
+
+    .magic-icon {
+      font-size: 24px;
+      color: #81848f;
+      margin-right: 4px;
+    }
+
+    &-on {
+      .magic-icon {
+        color: #1b58f4;
+      }
+      &:hover,
+      &.mode-type-menu-item-selected {
+        .mode-type-menu-item-content-label {
+          color: #1b58f4;
+        }
+      }
+    }
+
+    &:hover,
+    &-selected {
+      background-color: #ebf1ff;
+    }
+
+    .mode-type-menu-item-content {
+      flex: 1;
+      font-size: 12px;
+    }
+
+    .mode-type-menu-item-content-label {
+      font-weight: 500;
+      color: #474a52;
+      line-height: 12px;
+      margin-bottom: 2px;
+    }
+
+    .mode-type-menu-item-content-describe {
+      color: #81848f;
+      line-height: 12px;
+    }
+  }
+}
+
+.mode-type-icon-container {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+
+  .status-indicator-green {
+    position: absolute;
+    bottom: 0px;
+    right: 4px;
+    height: 12px;
+    width: 12px;
+    background-color: #29a64e;
+    border: 1px solid #ffffff;
+    border-radius: 50%;
+
+    &.small-indicator {
+      height: 6px;
+      width: 6px;
+      right: 5px;
+      border: 0.5px solid #ffffff;
+    }
+  }
+}

package/es/components/PaulButtonGroup/Select.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: (props: any) => React.JSX.Element;
+export default _default;

package/es/components/PaulButtonGroup/Select.js

@@ -0,0 +1,109 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["value", "onChange", "apiConfig", "fieldMapping"];
+import React, { useState } from 'react';
+import { Select } from '@alife/magic-basic';
+import { customRequest } from '@alife/magic-request';
+import { useDebounceFn } from 'ahooks';
+import { get } from 'lodash';
+export default (function (props) {
+  var value = props.value,
+    onChange = props.onChange,
+    apiConfig = props.apiConfig,
+    fieldMapping = props.fieldMapping,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    options = _useState4[0],
+    setOptions = _useState4[1];
+  var fetchOptions = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(searchText) {
+      var dynamicSearchParam, searchParamKey, keyName, val, params, response, userList, formattedOptions;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (searchText) {
+              _context.next = 3;
+              break;
+            }
+            setOptions([]);
+            return _context.abrupt("return");
+          case 3:
+            setLoading(true);
+            _context.prev = 4;
+            // 1. 构造动态搜索参数
+            dynamicSearchParam = {};
+            searchParamKey = apiConfig.searchParamKey;
+            if (_typeof(searchParamKey) === 'object' && searchParamKey !== null) {
+              // 如果是对象类型
+              keyName = searchParamKey.name;
+              val = searchParamKey.wrapAs === 'array' ? [searchText] : searchText;
+              dynamicSearchParam = _defineProperty({}, keyName, val);
+            } else if (typeof searchParamKey === 'string') {
+              // 如果是字符串类型
+              dynamicSearchParam = _defineProperty({}, searchParamKey, searchText);
+            }
+            // 1.1 合并静态参数和动态参数
+            params = _objectSpread(_objectSpread({}, apiConfig.extraParams), dynamicSearchParam); // 2. 发起请求
+            _context.next = 11;
+            return customRequest({
+              url: apiConfig.url,
+              method: apiConfig.method || 'GET',
+              query: params
+            });
+          case 11:
+            response = _context.sent;
+            // 3. 解析数据
+            userList = get(response, fieldMapping.dataPath, []);
+            formattedOptions = userList.map(function (user) {
+              return {
+                value: user[fieldMapping.valueField],
+                label: user[fieldMapping.labelField]
+              };
+            });
+            setOptions(formattedOptions);
+            _context.next = 21;
+            break;
+          case 17:
+            _context.prev = 17;
+            _context.t0 = _context["catch"](4);
+            console.error('Failed to fetch options:', _context.t0);
+            setOptions([]);
+          case 21:
+            _context.prev = 21;
+            setLoading(false);
+            return _context.finish(21);
+          case 24:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[4, 17, 21, 24]]);
+    }));
+    return function fetchOptions(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var _useDebounceFn = useDebounceFn(fetchOptions, {
+      wait: 500
+    }),
+    debouncedFetchUsers = _useDebounceFn.run;
+  return /*#__PURE__*/React.createElement(Select, _extends({
+    value: value,
+    onChange: onChange,
+    options: options,
+    loading: loading,
+    onSearch: debouncedFetchUsers,
+    showSearch: true,
+    filterOption: false
+  }, restProps));
+});

package/es/components/PaulButtonGroup/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @author linhuiw、洛萨
+ * @description 按钮组组件
+ * value: { {configId: 29, opType: 'createSubmit'}, title: "提交" }
+ */
+import React from 'react';
+import './index.scss';
+interface PaulButtonGroupProps {
+    buttonGroupConfig: any[];
+    enterParamsConfig: any;
+    offset?: number;
+    getFormValues: any;
+    [key: string]: any;
+}
+declare const _default: (props: PaulButtonGroupProps) => React.JSX.Element;
+export default _default;