@antv/dumi-theme-antv
Version:
AntV website theme based on dumi2.
181 lines (179 loc) • 9.06 kB
JavaScript
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { DatasourceCard } from "./DatasourceCard";
import { useEventListener } from 'ahooks';
import classnames from 'classnames';
import _ from 'lodash';
import React, { useEffect, useRef, useState } from 'react';
import styles from "./index.module.less";
import { SendButton } from "./SendButton";
import { ChooseLib } from "./ChooseLib";
import { useSiteData, useIntl } from 'dumi';
import { ic } from "../../../../slots/hooks";
import { useTypewriter } from "../../../../hooks/useTypewriter";
import { authStore, showLoginModal } from "../../../../model/auth";
import { useSnapshot } from "valtio";
import { AIChatStore } from "../../../../model/AIChat";
import { ModeSelectorDropdown } from "../ModeSelector/ModeSelectorDropdown";
var PLACEHOLDER = {
implement: 'ai.placeholder.implement',
solve: 'ai.placeholder.solve'
};
export var PromptTextarea = /*#__PURE__*/React.memo(function PromptTextareaInner(props) {
var value = props.value,
size = props.size,
_onChange = props.onChange,
onDataSummaryChange = props.onDataSummaryChange,
onConfirm = props.onConfirm,
onCancel = props.onCancel,
loading = props.loading,
_props$showAction = props.showAction,
showAction = _props$showAction === void 0 ? true : _props$showAction,
_props$showModeSelect = props.showModeSelector,
showModeSelector = _props$showModeSelect === void 0 ? false : _props$showModeSelect,
_props$skipLoginCheck = props.skipLoginCheck,
skipLoginCheck = _props$skipLoginCheck === void 0 ? false : _props$skipLoginCheck,
sendButtonTip = props.sendButtonTip;
var snap = useSnapshot(AIChatStore);
var authSnap = useSnapshot(authStore);
var _useIntl = useIntl(),
formatMessage = _useIntl.formatMessage;
var textareaRef = useRef(null);
var _useSiteData = useSiteData(),
themeConfig = _useSiteData.themeConfig;
useEffect(function () {
if (!themeConfig.isAntVSite && !snap.lib) {
AIChatStore.lib = themeConfig.title;
}
}, [themeConfig.isAntVSite, themeConfig.title]);
// 将fileMeta状态移到组件内部管理
var _useState = useState(null),
_useState2 = _slicedToArray(_useState, 2),
fileMeta = _useState2[0],
setFileMeta = _useState2[1];
// ... 其他状态和hooks保持不变
var _useState3 = useState(false),
_useState4 = _slicedToArray(_useState3, 2),
focus = _useState4[0],
setFocus = _useState4[1];
var isCompact = size === 'compact';
var typedPlaceholder = useTypewriter({
texts: [formatMessage({
id: 'ai.placeholder.whatis'
}, {
title: themeConfig.title
}), ic(themeConfig.metas.description)]
});
// 处理DataUploader的回调
var handleDataAnalyzed = function handleDataAnalyzed(analyzedData) {
setFileMeta(analyzedData.fileMeta);
if (onDataSummaryChange) {
onDataSummaryChange(analyzedData.dataSummary);
}
};
function renderDatasourceCard() {
if (((fileMeta === null || fileMeta === void 0 ? void 0 : fileMeta.type) === 'FILE' || (fileMeta === null || fileMeta === void 0 ? void 0 : fileMeta.type) === 'IMAGE') && fileMeta !== null && fileMeta !== void 0 && fileMeta.fileName) {
// 当点击DatasourceCard的关闭按钮时，应该清空状态
var handleClose = function handleClose() {
setFileMeta(null);
if (onDataSummaryChange) {
onDataSummaryChange('');
}
};
return /*#__PURE__*/React.createElement(DatasourceCard, {
type: fileMeta.type,
title: fileMeta.fileName,
desc: fileMeta.fileSize,
onDelete: handleClose
});
} else {
return null;
}
}
var datasourceNode = renderDatasourceCard();
var promptTextValid = Boolean(value);
var pureSend = function pureSend() {
if (promptTextValid) {
onConfirm === null || onConfirm === void 0 || onConfirm();
}
};
var send = function send() {
// 如果跳过登录检查，直接发送
if (skipLoginCheck) {
pureSend();
return;
}
// 否则检查登录状态
if (!authSnap.isAuthenticated) {
showLoginModal(pureSend);
return;
}
pureSend();
};
useEventListener('keydown', function (event) {
if (event.key === 'Enter') {
// 不区分 textarea 是否聚焦
if (!event.shiftKey && !event.isComposing && !loading) {
event.preventDefault();
send(); // 触发自定义事件
}
}
}, {
target: textareaRef
});
return /*#__PURE__*/React.createElement("div", {
className: classnames(styles.container, _defineProperty(_defineProperty(_defineProperty({}, styles.active, focus), styles.compact, isCompact), styles.withDatasource, Boolean(datasourceNode))),
style: props.style
}, datasourceNode && /*#__PURE__*/React.createElement("div", {
className: styles.header
}, datasourceNode), /*#__PURE__*/React.createElement("textarea", {
onFocus: function onFocus() {
return setFocus(true);
},
onBlur: function onBlur() {
return setFocus(false);
},
id: "prompt-textarea",
className: classnames(styles.promptTextarea),
ref: textareaRef,
placeholder:
// (!isCompact && !themeConfig.isAntVSite && ic(themeConfig.metas.description)) ||
!isCompact && !themeConfig.isAntVSite ? typedPlaceholder : formatMessage({
id: _.get(PLACEHOLDER, snap.mode, 'ai.placeholder.implement')
}),
value: value,
onChange: function onChange(evt) {
_onChange(evt.target.value);
}
}), /*#__PURE__*/React.createElement("div", {
className: styles.footer
}, /*#__PURE__*/React.createElement("div", {
className: styles.dataActions
}, showAction && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ChooseLib, {
size: size,
value: snap.lib,
onChange: function onChange(s) {
return AIChatStore.lib = s;
}
})), showModeSelector && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ModeSelectorDropdown, null))), /*#__PURE__*/React.createElement("div", {
className: styles.actions
}, loading ? /*#__PURE__*/React.createElement("img", {
className: styles.actionBtn,
onClick: onCancel,
src: "https://mdn.alipayobjects.com/huamei_2yzvel/afts/img/A*Yin-QLza5hMAAAAAQBAAAAgAeriAAQ/original"
}) : /*#__PURE__*/React.createElement(SendButton, {
onClick: send,
disabled: !promptTextValid,
tip: !promptTextValid ? formatMessage({
id: 'ai.msgbox.send.tip'
}) : sendButtonTip
}))));
});