@lobehub/ui 1.168.18 → 1.168.20

package/es/Highlighter/style.d.ts

@@ -1,4 +1,4 @@
-export declare const useStyles: (props?: "block" | "ghost" | "pure" | undefined) => import("antd-style").ReturnStyles<{
+export declare const useStyles: (props?: "block" | "pure" | "ghost" | undefined) => import("antd-style").ReturnStyles<{
     button: string;
     container: string;
     header: import("antd-style").SerializedStyles;

package/es/Hotkey/index.d.ts

@@ -13,6 +13,7 @@ export interface HotkeyProps extends Omit<FlexboxProps, 'children'> {
         descStyle?: CSSProperties;
         kbdStyle?: CSSProperties;
     };
+    variant?: 'default' | 'pure';
 }
 declare const Hotkey: import("react").NamedExoticComponent<HotkeyProps>;
 export default Hotkey;

package/es/Hotkey/index.js

@@ -1,6 +1,6 @@
 'use client';
 
-var _excluded = ["classNames", "styles", "keys", "inverseTheme", "isApple", "compact", "className", "style"];
+var _excluded = ["variant", "classNames", "styles", "keys", "inverseTheme", "isApple", "compact", "className", "style"];
 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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -94,7 +94,9 @@ var mappingKey = function mappingKey(isAppleDevice) {
   })), KeyMapEnum.Comma, ','), KeyMapEnum.Period, '.'), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref, KeyMapEnum.Slash, '/'), KeyMapEnum.Semicolon, ';'), KeyMapEnum.Quote, "'"), KeyMapEnum.Backquote, '`'), KeyMapEnum.Backslash, '\\'), KeyMapEnum.BracketLeft, '['), KeyMapEnum.BracketRight, ']'), KeyMapEnum.Minus, '-'), KeyMapEnum.Equal, '=');
 };
 var Hotkey = /*#__PURE__*/memo(function (_ref2) {
-  var classNames = _ref2.classNames,
+  var _ref2$variant = _ref2.variant,
+    variant = _ref2$variant === void 0 ? 'default' : _ref2$variant,
+    classNames = _ref2.classNames,
     styles = _ref2.styles,
     keys = _ref2.keys,
     inverseTheme = _ref2.inverseTheme,
@@ -106,6 +108,7 @@ var Hotkey = /*#__PURE__*/memo(function (_ref2) {
   var _useStyles = useStyles(inverseTheme),
     cx = _useStyles.cx,
     s = _useStyles.styles;
+  var isPure = variant === 'pure';
   var _useState = useState(splitKeysByPlus(keys)),
     _useState2 = _slicedToArray(_useState, 2),
     keysGroup = _useState2[0],
@@ -130,7 +133,12 @@ var Hotkey = /*#__PURE__*/memo(function (_ref2) {
       visibility: visibility
     }, style)
   }, rest), {}, {
-    children: compact ? /*#__PURE__*/_jsx(Flexbox, {
+    children: isPure ? keysGroup.map(function (key, index) {
+      var _mapping$key;
+      return /*#__PURE__*/_jsx("span", {
+        children: (_mapping$key = mapping[key]) !== null && _mapping$key !== void 0 ? _mapping$key : startCase(key)
+      }, index);
+    }) : compact ? /*#__PURE__*/_jsx(Flexbox, {
       align: 'center',
       as: 'kbd',
       className: classNames === null || classNames === void 0 ? void 0 : classNames.descClassName,
@@ -138,17 +146,17 @@ var Hotkey = /*#__PURE__*/memo(function (_ref2) {
       horizontal: true,
       style: styles === null || styles === void 0 ? void 0 : styles.kbdStyle,
       children: keysGroup.map(function (key, index) {
-        var _mapping$key;
+        var _mapping$key2;
         return /*#__PURE__*/_jsx("div", {
-          children: (_mapping$key = mapping[key]) !== null && _mapping$key !== void 0 ? _mapping$key : startCase(key)
+          children: (_mapping$key2 = mapping[key]) !== null && _mapping$key2 !== void 0 ? _mapping$key2 : startCase(key)
         }, index);
       })
     }) : keysGroup.map(function (key, index) {
-      var _mapping$key2;
+      var _mapping$key3;
       return /*#__PURE__*/_jsx("kbd", {
         className: classNames === null || classNames === void 0 ? void 0 : classNames.descClassName,
         style: styles === null || styles === void 0 ? void 0 : styles.kbdStyle,
-        children: (_mapping$key2 = mapping[key]) !== null && _mapping$key2 !== void 0 ? _mapping$key2 : startCase(key)
+        children: (_mapping$key3 = mapping[key]) !== null && _mapping$key3 !== void 0 ? _mapping$key3 : startCase(key)
       }, index);
     })
   }));

package/es/Hotkey/style.js

@@ -5,5 +5,5 @@ import { rgba } from 'polished';
 export var useStyles = createStyles(function (_ref, inverseTheme) {
   var css = _ref.css,
     token = _ref.token;
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    kbd {\n      overflow: hidden;\n      display: flex;\n      flex: none;\n      align-items: center;\n      justify-content: center;\n\n      min-width: 16px;\n      height: 22px;\n      padding-block: 0;\n      padding-inline: 8px;\n\n      font-family: ", ";\n      font-size: 12px;\n      line-height: 1.1;\n      color: ", ";\n      text-align: center;\n      white-space: nowrap;\n\n      background: ", ";\n      border: none;\n      border-radius: ", "px;\n    }\n  "])), token.fontFamily, inverseTheme ? token.colorTextTertiary : token.colorTextSecondary, inverseTheme ? rgba(token.colorTextTertiary, 0.15) : token.colorFillTertiary, token.borderRadiusSM);
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    color: ", ";\n\n    kbd {\n      overflow: hidden;\n      display: flex;\n      flex: none;\n      align-items: center;\n      justify-content: center;\n\n      min-width: 16px;\n      height: 22px;\n      padding-block: 0;\n      padding-inline: 8px;\n\n      font-family: ", ";\n      font-size: 12px;\n      line-height: 1.1;\n      color: inherit;\n      text-align: center;\n      white-space: nowrap;\n\n      background: ", ";\n      border: none;\n      border-radius: ", "px;\n    }\n  "])), inverseTheme ? token.colorTextTertiary : token.colorTextSecondary, token.fontFamily, inverseTheme ? rgba(token.colorTextTertiary, 0.15) : token.colorFillTertiary, token.borderRadiusSM);
 });

package/es/Hotkey/type.d.ts

@@ -10,6 +10,7 @@ export declare const KeyMapEnum: {
     readonly Down: "down";
     readonly Enter: "enter";
     readonly Equal: "equal";
+    readonly Esc: "esc";
     readonly Left: "left";
     readonly LeftClick: "left-click";
     readonly LeftDoubleClick: "left-double-click";

package/es/Hotkey/type.js

@@ -16,6 +16,7 @@ export var KeyMapEnum = {
   Enter: 'enter',
   Equal: 'equal',
   // =
+  Esc: 'esc',
   Left: 'left',
   LeftClick: 'left-click',
   LeftDoubleClick: 'left-double-click',

package/es/Mermaid/style.d.ts

@@ -1,4 +1,4 @@
-export declare const useStyles: (props?: "block" | "ghost" | "pure" | undefined) => import("antd-style").ReturnStyles<{
+export declare const useStyles: (props?: "block" | "pure" | "ghost" | undefined) => import("antd-style").ReturnStyles<{
     button: string;
     container: string;
     header: import("antd-style").SerializedStyles;

package/es/chat/MessageInput/index.js

@@ -19,14 +19,14 @@ import { Button } from 'antd';
 import { memo, useState } from 'react';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { Flexbox } from 'react-layout-kit';
-import Hotkey from "../../Hotkey";
 import { KeyMapEnum } from "../../Hotkey/type";
 import { combineKeys } from "../../Hotkey/utils";
 import { TextArea } from "../../Input";
+import Tooltip from "../../Tooltip";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var MessageInput = /*#__PURE__*/memo(function (_ref) {
   var text = _ref.text,
     _ref$type = _ref.type,
@@ -53,15 +53,38 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
   var _useStyles = useStyles(),
     cx = _useStyles.cx,
     styles = _useStyles.styles;
-  var hotkey = combineKeys([KeyMapEnum.Mod, KeyMapEnum.Enter]);
+  var confirmHotkey = combineKeys([KeyMapEnum.Mod, KeyMapEnum.Enter]);
+  var confirmText = (text === null || text === void 0 ? void 0 : text.confirm) || 'Confirm';
+  var cancelHotkey = combineKeys([KeyMapEnum.Esc]);
+  var cancelText = (text === null || text === void 0 ? void 0 : text.cancel) || 'Cancel';
   var isAutoSize = height === 'auto';
-  useHotkeys(hotkey, function () {
+  var handleConfirm = function handleConfirm() {
     return onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(temporaryValue);
-  }, {
+  };
+  var handleCancel = function handleCancel() {
+    return onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+  };
+  useHotkeys(confirmHotkey, handleConfirm, {
+    enableOnFormTags: true,
+    enabled: shortcut,
+    preventDefault: true
+  });
+  useHotkeys(cancelHotkey, handleCancel, {
     enableOnFormTags: true,
     enabled: shortcut,
     preventDefault: true
   });
+  var confirmButton = /*#__PURE__*/_jsx(Button, {
+    onClick: handleConfirm,
+    size: editButtonSize,
+    type: "primary",
+    children: confirmText
+  });
+  var cancllButton = /*#__PURE__*/_jsx(Button, {
+    onClick: handleCancel,
+    size: editButtonSize,
+    children: (text === null || text === void 0 ? void 0 : text.cancel) || 'Cancel'
+  });
   return /*#__PURE__*/_jsxs(Flexbox, _objectSpread(_objectSpread({
     gap: 16,
     style: _objectSpread({
@@ -92,21 +115,15 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
           size: "small"
         }, buttonProps), index);
       }) : /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsxs(Button, {
-          onClick: function onClick() {
-            return onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(temporaryValue);
-          },
-          size: editButtonSize,
-          type: "primary",
-          children: [(text === null || text === void 0 ? void 0 : text.confirm) || 'Confirm', shortcut && /*#__PURE__*/_jsx(Hotkey, {
-            inverseTheme: true,
-            keys: combineKeys([KeyMapEnum.Mod, KeyMapEnum.Enter])
-          })]
-        }), /*#__PURE__*/_jsx(Button, {
-          onClick: onCancel,
-          size: editButtonSize,
-          children: (text === null || text === void 0 ? void 0 : text.cancel) || 'Cancel'
-        })]
+        children: [shortcut ? /*#__PURE__*/_jsx(Tooltip, {
+          hotkey: confirmHotkey,
+          title: confirmText,
+          children: confirmButton
+        }) : confirmButton, shortcut ? /*#__PURE__*/_jsx(Tooltip, {
+          hotkey: cancelHotkey,
+          title: cancelText,
+          children: cancllButton
+        }) : cancllButton]
       })
     })]
   }));

package/es/hooks/useHighlight.d.ts

@@ -1,4 +1,10 @@
 import { SWRResponse } from 'swr';
 export declare const FALLBACK_LANG = "txt";
+declare const highlightCache: Map<string, string>;
+declare const MD5_LENGTH_THRESHOLD = 10000;
+declare const loadShiki: () => Promise<(code: string, options: import("@shikijs/types").CodeToHastOptions<import("shiki/dist/langs.mjs").BundledLanguage, import("shiki/dist/themes.mjs").BundledTheme>) => Promise<string>>;
+declare const shikiPromise: Promise<(code: string, options: import("@shikijs/types").CodeToHastOptions<import("shiki/dist/langs.mjs").BundledLanguage, import("shiki/dist/themes.mjs").BundledTheme>) => Promise<string>>;
+declare const escapeHtml: (str: string) => string;
 export declare const useHighlight: (text: string, lang: string, enableTransformer?: boolean) => SWRResponse<string, Error>;
 export { default as languageMap } from './languageMap';
+export { escapeHtml, highlightCache, loadShiki, MD5_LENGTH_THRESHOLD, shikiPromise };

package/es/hooks/useHighlight.js

@@ -80,7 +80,7 @@ export var useHighlight = function useHighlight(text, lang, enableTransformer) {
     // 长文本使用 hash
     var hash = text.length < MD5_LENGTH_THRESHOLD ? text : Md5.hashStr(text);
     return [matchedLanguage, isDarkMode ? 'd' : 'l', hash].join('-');
-  }, [matchedLanguage, isDarkMode]);
+  }, [text, matchedLanguage, isDarkMode]);
 
   // 使用SWR获取高亮HTML
   return useSWR(cacheKey, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
@@ -150,4 +150,5 @@ export var useHighlight = function useHighlight(text, lang, enableTransformer) {
     revalidateOnReconnect: false
   });
 };
-export { default as languageMap } from "./languageMap";
+export { default as languageMap } from "./languageMap";
+export { escapeHtml, highlightCache, loadShiki, MD5_LENGTH_THRESHOLD, shikiPromise };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.168.18",
+  "version": "1.168.20",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",