@lobehub/ui 1.8.1 → 1.9.0

package/es/ThemeProvider/GlobalStyle.js

@@ -1,7 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 var _templateObject;
 import { createGlobalStyle } from 'antd-style';
-var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n  html,body {\n    --font-settings: \"cv01\";\n    --font-variations: \"opsz\" auto;\n\n    overflow-x: hidden;\n\n    margin: 0;\n    padding: 0;\n\n    font-family: ", ";\n    font-size: ", "px;\n    font-feature-settings: var(--font-settings);\n    font-variation-settings: var(--font-variations);\n    line-height: 1;\n    color: ", ";\n    text-size-adjust: none;\n    text-rendering: optimizelegibility;\n    vertical-align: baseline;\n\n    color-scheme: dark;\n    background-color: ", ";\n\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n\n  * {\n    box-sizing: border-box;\n    vertical-align: baseline;\n  }\n\n  #root {\n\t  min-height: 100vh;\n  }\n\n  ::-webkit-scrollbar {\n    width: 0;\n    height: 4px;\n    background-color: transparent;\n\n    &-thumb {\n      background-color: ", ";\n      border-radius: 4px;\n    }\n\n    &-corner {\n      display: none;\n    }\n  }\n\n  p {\n    text-align: justify;\n    word-wrap: break-word;\n  }\n"])), function (_ref) {
+var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n  html,body {\n    --font-settings: \"cv01\", \"tnum\", \"kern\";\n    --font-variations: \"opsz\" auto, tabular-nums;\n\n    overflow-x: hidden;\n\n    margin: 0;\n    padding: 0;\n\n    font-family: ", ";\n    font-size: ", "px;\n    font-feature-settings: var(--font-settings);\n    font-variation-settings: var(--font-variations);\n    line-height: 1;\n    color: ", ";\n    text-size-adjust: none;\n    text-rendering: optimizelegibility;\n    vertical-align: baseline;\n\n    color-scheme: dark;\n    background-color: ", ";\n\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n\n  * {\n    box-sizing: border-box;\n    vertical-align: baseline;\n  }\n\n  #root {\n\t  min-height: 100vh;\n  }\n\n  ::-webkit-scrollbar {\n    width: 0;\n    height: 4px;\n    background-color: transparent;\n\n    &-thumb {\n      background-color: ", ";\n      border-radius: 4px;\n    }\n\n    &-corner {\n      display: none;\n    }\n  }\n\n  p {\n    text-align: justify;\n    word-wrap: break-word;\n  }\n\n  code {\n\t  font-family: ", " !important;\n\t  * {\n\t\t  font-family: inherit !important;\n\t  }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.fontFamily;
 }, function (_ref2) {
@@ -16,5 +16,8 @@ var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
 }, function (_ref5) {
   var theme = _ref5.theme;
   return theme.colorFill;
+}, function (_ref6) {
+  var theme = _ref6.theme;
+  return theme.fontFamilyCode;
 });
 export default GlobalStyle;

package/es/ThemeProvider/index.js

@@ -1,6 +1,4 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { App } from 'antd';
 import { ThemeProvider as AntdThemeProvider, StyleProvider, setupStyled } from 'antd-style';
 import React, { useCallback } from 'react';
@@ -34,8 +32,6 @@ var ThemeProvider = function ThemeProvider(_ref) {
       customStylish: getCustomStylish,
       customToken: getCustomToken,
       children: [/*#__PURE__*/_jsx(ReactFontLoader, {
-        url: "https://raw.githubusercontent.com/divspace/hack/master/css/hack.css"
-      }), /*#__PURE__*/_jsx(ReactFontLoader, {
         url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans.css"
       }), /*#__PURE__*/_jsx(ReactFontLoader, {
         url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans_sc.css"

package/es/ThemeSwitch/index.js

@@ -1,8 +1,6 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["size", "themeMode", "onThemeSwitch"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { ActionIcon, Icon } from "./..";
 import { Dropdown } from 'antd';
 import { Monitor, Moon, Sun } from 'lucide-react';

package/es/Tooltip/index.js

@@ -1,20 +1,21 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["className"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded = ["className", "arrow"];
 import { Tooltip as AntdTooltip } from 'antd';
 import { memo } from 'react';
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 var Tooltip = /*#__PURE__*/memo(function (_ref) {
   var className = _ref.className,
+    _ref$arrow = _ref.arrow,
+    arrow = _ref$arrow === void 0 ? false : _ref$arrow,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
   return /*#__PURE__*/_jsx(AntdTooltip, _objectSpread({
-    overlayClassName: cx(styles.tooltip, className)
+    overlayClassName: cx(styles.tooltip, className),
+    arrow: arrow
   }, props));
 });
 export default Tooltip;

package/es/components/ControlInput.js

@@ -1,9 +1,7 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["value", "onChange", "onValueChanging", "onChangeEnd"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { Button, ConfigProvider, Input } from 'antd';
 import { memo, useCallback, useEffect, useRef, useState } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";

package/es/hooks/useHighlight.js

@@ -1,5 +1,5 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { getHighlighter } from 'shiki-es';
 import { create } from 'zustand';
 var THEME = {
@@ -16,9 +16,9 @@ export var useHighlight = create(function (set, get) {
   return {
     highlighter: undefined,
     initHighlighter: function () {
-      var _initHighlighter = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _initHighlighter = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
         var highlighter;
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
+        return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               if (get().highlighter) {

package/es/styles/algorithms/index.js

@@ -1,7 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { generateAssociatedColors } from "./colorRelationship";
 import { generateColorPalette, generateNeutralPalette } from "./paletteGenerator";
 var defaultRelationship = function defaultRelationship(type) {

package/es/styles/theme/base.js

@@ -1,7 +1,7 @@
-var FONT_EMOJI = "\"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Apple Color Emoji\", \"Twemoji Mozilla\", \"Noto Color Emoji\", \"Android Emoji\"";
-var FONT_EN = "\"HarmonyOS Sans\", \"Segoe UI\", \"SF Pro Display\",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, \"Open Sans\", \"Helvetica Neue\", sans-serif";
-var FONT_CN = "\"HarmonyOS Sans SC\", \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft Yahei UI\", \"Microsoft Yahei\", \"Source Han Sans CN\", sans-serif";
-var FONT_CODE = "ui-monospace, Hack, \"SFMono Regular\", Consolas, \"Liberation Mono\", Menlo, Courier, monospace";
+var FONT_EMOJI = "\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Apple Color Emoji\",\"Twemoji Mozilla\",\"Noto Color Emoji\",\"Android Emoji\"";
+var FONT_EN = "\"HarmonyOS Sans\",\"Segoe UI\",\"SF Pro Display\",-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,\"Open Sans\",\"Helvetica Neue\",sans-serif";
+var FONT_CN = "\"HarmonyOS Sans SC\",\"PingFang SC\",\"Hiragino Sans GB\",\"Microsoft Yahei UI\",\"Microsoft Yahei\",\"Source Han Sans CN\",sans-serif";
+var FONT_CODE = "ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace";
 export var baseTheme = {
   token: {
     colorInfo: '#0070f3',

package/es/styles/theme/dark.js

@@ -1,6 +1,5 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { theme } from 'antd';
 import { genMapTokenAlgorithm } from "../algorithms";
 import { baseTheme } from "./base";

package/es/styles/theme/light.js

@@ -1,6 +1,4 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { genMapTokenAlgorithm } from "../algorithms";
 import { baseTheme } from "./base";
 var lightMode = genMapTokenAlgorithm('light');

package/lib/Conversation/InputArea/index.js

@@ -47,7 +47,6 @@ var useStyles = (0, import_antd_style.createStyles)(({ css, responsive, token })
     z-index: ${token.zIndexPopupBase};
     bottom: 0;
 
-    width: ${token.contentWidth}px;
     padding-top: 12px;
     padding-bottom: 24px;
 

package/lib/Conversation/StoreUpdater.js

@@ -29,7 +29,6 @@ var StoreUpdater = ({
   createAt,
   title,
   description,
-  agent,
   messages,
   onAgentChange,
   onMessagesChange,
@@ -37,7 +36,6 @@ var StoreUpdater = ({
   onResponseStart
 }) => {
   const useStoreUpdater = (0, import_zustand_utils.createStoreUpdater)((0, import_store.useStoreApi)());
-  useStoreUpdater("agent", agent);
   useStoreUpdater("onAgentChange", onAgentChange);
   useStoreUpdater("messages", messages);
   useStoreUpdater("onMessagesChange", onMessagesChange);

package/lib/EditableText/index.js

@@ -22,11 +22,11 @@ __export(EditableText_exports, {
   default: () => EditableText_default
 });
 module.exports = __toCommonJS(EditableText_exports);
-var import_icons = require("@ant-design/icons");
-var import_antd = require("antd");
+var import_ControlInput = require("../components/ControlInput");
+var import__ = require("../index");
+var import_lucide_react = require("lucide-react");
 var import_react = require("react");
 var import_react_layout_kit = require("react-layout-kit");
-var import_ControlInput = require("../components/ControlInput");
 var EditableText = (0, import_react.memo)(({ value, onChange }) => {
   const [edited, setEdited] = (0, import_react.useState)(false);
   return edited ? /* @__PURE__ */ React.createElement(
@@ -38,14 +38,18 @@ var EditableText = (0, import_react.memo)(({ value, onChange }) => {
       },
       onChange
     }
-  ) : /* @__PURE__ */ React.createElement(import_react_layout_kit.Flexbox, { horizontal: true, gap: 8 }, value, /* @__PURE__ */ React.createElement(import_antd.Tooltip, { title: "编辑" }, /* @__PURE__ */ React.createElement(
-    import_icons.EditOutlined,
+  ) : /* @__PURE__ */ React.createElement(import_react_layout_kit.Flexbox, { horizontal: true, gap: 8 }, value, /* @__PURE__ */ React.createElement(
+    import__.ActionIcon,
     {
+      title: "Edit",
+      placement: "right",
+      icon: import_lucide_react.Edit3,
+      size: { fontSize: 14, blockSize: 24 },
       onClick: () => {
         setEdited(!edited);
       }
     }
-  )));
+  ));
 });
 var EditableText_default = EditableText;
 // Annotate the CommonJS export names for ESM import in node:

package/lib/Markdown/style.js

@@ -32,7 +32,7 @@ var useStyles = (0, import_antd_style.createStyles)(({ css, token, isDarkMode })
         margin: 20px auto;
 
         font-size: 14px;
-        line-height: 2;
+        line-height: 1.8;
         color: ${token.colorText};
         text-align: justify;
         word-wrap: break-word;

package/lib/SearchBar/index.d.ts

@@ -1,5 +1,9 @@
 /// <reference types="react" />
 import { InputProps } from 'antd';
-export declare type SearchBarProps = InputProps;
-declare const SearchBar: import("react").MemoExoticComponent<({ value, onChange, style, placeholder, ...props }: SearchBarProps) => import("react/jsx-runtime").JSX.Element>;
+export interface SearchBarProps extends InputProps {
+    shortKey?: string;
+    enableShortKey?: boolean;
+    type?: 'ghost' | 'block';
+}
+declare const SearchBar: import("react").NamedExoticComponent<SearchBarProps>;
 export default SearchBar;

package/lib/SearchBar/index.js

@@ -22,21 +22,74 @@ __export(SearchBar_exports, {
   default: () => SearchBar_default
 });
 module.exports = __toCommonJS(SearchBar_exports);
-var import_icons = require("@ant-design/icons");
+var import__ = require("../index");
 var import_antd = require("antd");
+var import_lucide_react = require("lucide-react");
 var import_react = require("react");
-var SearchBar = (0, import_react.memo)(({ value, onChange, style, placeholder, ...props }) => /* @__PURE__ */ React.createElement(
-  import_antd.Input,
-  {
-    prefix: /* @__PURE__ */ React.createElement(import_icons.SearchOutlined, null),
-    allowClear: true,
+var import_style = require("./style");
+var isAppleDevice = /(mac|iphone|ipod|ipad)/i.test(
+  typeof navigator !== "undefined" ? navigator == null ? void 0 : navigator.platform : ""
+);
+var symbol = isAppleDevice ? "⌘" : "Ctrl";
+var SearchBar = (0, import_react.memo)(
+  ({
+    className,
     value,
-    placeholder: placeholder ?? "Search",
-    style: { ...style, borderColor: "transparent" },
     onChange,
+    style,
+    placeholder,
+    type = "ghost",
+    enableShortKey,
+    shortKey = "f",
     ...props
+  }) => {
+    const [showTag, setShowTag] = (0, import_react.useState)(true);
+    const [inputValue, setInputValue] = (0, import_react.useState)(value);
+    const { styles, cx } = (0, import_style.useStyles)({ type });
+    const inputRef = (0, import_react.useRef)(null);
+    (0, import_react.useEffect)(() => {
+      if (!enableShortKey)
+        return;
+      const handler = (ev) => {
+        if ((isAppleDevice ? ev.metaKey : ev.ctrlKey) && ev.key === shortKey) {
+          ev.preventDefault();
+          inputRef.current.focus();
+        }
+      };
+      document.addEventListener("keydown", handler);
+      return () => document.removeEventListener("keydown", handler);
+    }, []);
+    return /* @__PURE__ */ React.createElement("div", { className: cx(styles.search, className) }, /* @__PURE__ */ React.createElement(
+      import_antd.Input,
+      {
+        ref: inputRef,
+        className: styles.input,
+        prefix: /* @__PURE__ */ React.createElement(
+          import__.Icon,
+          {
+            className: styles.icon,
+            icon: import_lucide_react.Search,
+            size: { fontSize: 14 },
+            style: { marginRight: 4 }
+          }
+        ),
+        allowClear: true,
+        value,
+        placeholder: placeholder ?? "Type keywords...",
+        style: { ...style, borderColor: "transparent" },
+        onChange: (e) => {
+          setInputValue(e.target.value);
+          setShowTag(e.target.value ? false : true);
+          if (onChange)
+            onChange(e);
+        },
+        onFocus: () => setShowTag(false),
+        onBlur: () => setShowTag(true),
+        ...props
+      }
+    ), enableShortKey && showTag && !inputValue && /* @__PURE__ */ React.createElement(import_antd.Tag, { className: styles.tag }, symbol, " ", shortKey.toUpperCase()));
   }
-));
+);
 var SearchBar_default = SearchBar;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {});

package/lib/SearchBar/style.d.ts

@@ -0,0 +1,8 @@
+export declare const useStyles: (props?: {
+    type: 'ghost' | 'block';
+} | undefined) => import("antd-style").ReturnStyles<{
+    search: import("antd-style").SerializedStyles;
+    input: import("antd-style").SerializedStyles;
+    tag: import("antd-style").SerializedStyles;
+    icon: import("antd-style").SerializedStyles;
+}>;

package/lib/SearchBar/style.js

@@ -0,0 +1,68 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/SearchBar/style.ts
+var style_exports = {};
+__export(style_exports, {
+  useStyles: () => useStyles
+});
+module.exports = __toCommonJS(style_exports);
+var import_antd_style = require("antd-style");
+var import_polished = require("polished");
+var useStyles = (0, import_antd_style.createStyles)(({ css, token }, { type }) => ({
+  search: css`
+    position: relative;
+    max-width: 100%;
+    height: 36px;
+  `,
+  input: css`
+    position: relative;
+    height: inherit;
+    padding: 0 8px 0 12px;
+    transition: background-color 100ms ${token.motionEaseOut};
+
+    ${type === "block" ? css`
+          background-color: ${(0, import_polished.rgba)(token.colorBgElevated, 0.6)} !important;
+        ` : css`
+          background: transparent !important;
+          border: 1px solid ${token.colorBorder} !important;
+        `}
+
+    &:hover {
+      background-color: ${token.colorFillTertiary} !important;
+    }
+
+    input {
+      background: transparent;
+    }
+  `,
+  tag: css`
+    position: absolute;
+    z-index: 5;
+    top: 50%;
+    right: 0;
+    transform: translateY(-50%);
+  `,
+  icon: css`
+    color: ${token.colorTextPlaceholder};
+  `
+}));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStyles
+});

package/lib/StroyBook/style.js

@@ -62,6 +62,7 @@ var useStyles = (0, import_antd_style.createStyles)(
         --leva-colors-vivid1: ${token.colorWarning};
         --leva-shadows-level1: unset;
         --leva-shadows-level2: unset;
+        --leva-fonts-mono: ${token.fontFamilyCode};
 
         padding: 6px 0;
         background: ${token.colorBgLayout};

package/lib/ThemeProvider/GlobalStyle.js

@@ -26,8 +26,8 @@ var import_antd_style = require("antd-style");
 var GlobalStyle = import_antd_style.createGlobalStyle`
 
   html,body {
-    --font-settings: "cv01";
-    --font-variations: "opsz" auto;
+    --font-settings: "cv01", "tnum", "kern";
+    --font-variations: "opsz" auto, tabular-nums;
 
     overflow-x: hidden;
 
@@ -81,6 +81,13 @@ var GlobalStyle = import_antd_style.createGlobalStyle`
     text-align: justify;
     word-wrap: break-word;
   }
+
+  code {
+	  font-family: ${({ theme }) => theme.fontFamilyCode} !important;
+	  * {
+		  font-family: inherit !important;
+	  }
+  }
 `;
 var GlobalStyle_default = GlobalStyle;
 // Annotate the CommonJS export names for ESM import in node:

package/lib/ThemeProvider/index.js

@@ -60,7 +60,6 @@ var ThemeProvider = ({ token, children, themeMode }) => {
       customStylish: import_styles.getCustomStylish,
       customToken: getCustomToken
     },
-    /* @__PURE__ */ import_react.default.createElement(import_react_font_loader.default, { url: "https://raw.githubusercontent.com/divspace/hack/master/css/hack.css" }),
     /* @__PURE__ */ import_react.default.createElement(import_react_font_loader.default, { url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans.css" }),
     /* @__PURE__ */ import_react.default.createElement(import_react_font_loader.default, { url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans_sc.css" }),
     /* @__PURE__ */ import_react.default.createElement(import_GlobalStyle.default, null),

package/lib/Tooltip/index.js

@@ -25,9 +25,9 @@ module.exports = __toCommonJS(Tooltip_exports);
 var import_antd = require("antd");
 var import_react = require("react");
 var import_style = require("./style");
-var Tooltip = (0, import_react.memo)(({ className, ...props }) => {
+var Tooltip = (0, import_react.memo)(({ className, arrow = false, ...props }) => {
   const { styles, cx } = (0, import_style.useStyles)();
-  return /* @__PURE__ */ React.createElement(import_antd.Tooltip, { overlayClassName: cx(styles.tooltip, className), ...props });
+  return /* @__PURE__ */ React.createElement(import_antd.Tooltip, { overlayClassName: cx(styles.tooltip, className), arrow, ...props });
 });
 var Tooltip_default = Tooltip;
 // Annotate the CommonJS export names for ESM import in node:

package/lib/styles/theme/base.js

@@ -22,10 +22,10 @@ __export(base_exports, {
   baseTheme: () => baseTheme
 });
 module.exports = __toCommonJS(base_exports);
-var FONT_EMOJI = `"Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji"`;
-var FONT_EN = `"HarmonyOS Sans", "Segoe UI", "SF Pro Display",-apple-system, BlinkMacSystemFont, Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif`;
-var FONT_CN = `"HarmonyOS Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei UI", "Microsoft Yahei", "Source Han Sans CN", sans-serif`;
-var FONT_CODE = `ui-monospace, Hack, "SFMono Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace`;
+var FONT_EMOJI = `"Segoe UI Emoji","Segoe UI Symbol","Apple Color Emoji","Twemoji Mozilla","Noto Color Emoji","Android Emoji"`;
+var FONT_EN = `"HarmonyOS Sans","Segoe UI","SF Pro Display",-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif`;
+var FONT_CN = `"HarmonyOS Sans SC","PingFang SC","Hiragino Sans GB","Microsoft Yahei UI","Microsoft Yahei","Source Han Sans CN",sans-serif`;
+var FONT_CODE = `ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace`;
 var baseTheme = {
   token: {
     colorInfo: "#0070f3",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.8.1",
+  "version": "1.9.0",
   "description": "Lobe UI is an open-source UI component library for building chatbot web apps",
   "keywords": [
     "lobehub",
@@ -67,75 +67,75 @@
     ]
   },
   "dependencies": {
-    "@ant-design/icons": "^5",
-    "@babel/runtime": "^7",
-    "@dqbd/tiktoken": "^1",
-    "@floating-ui/react": "^0.24",
-    "ahooks": "^3",
-    "antd-style": "^3",
-    "chroma-js": "^2",
-    "copy-to-clipboard": "^3",
-    "dayjs": "^1",
-    "fast-deep-equal": "^3",
-    "immer": "^10",
-    "leva": "^0.9",
-    "lodash": "^4",
+    "@ant-design/icons": "^5.1.2",
+    "@babel/runtime": "^7.21.5",
+    "@dqbd/tiktoken": "^1.0.7",
+    "@floating-ui/react": "^0.24.1",
+    "ahooks": "^3.7.7",
+    "antd-style": "^3.1.1",
+    "chroma-js": "^2.4.2",
+    "copy-to-clipboard": "^3.3.3",
+    "dayjs": "^1.11.7",
+    "fast-deep-equal": "^3.1.3",
+    "immer": "^10.0.2",
+    "leva": "^0.9.34",
+    "lodash": "^4.17.21",
     "lucide-react": "latest",
-    "pangu": "^4",
-    "polished": "^4",
-    "prism-react-renderer": "^2",
-    "re-resizable": "^6",
+    "pangu": "^4.0.7",
+    "polished": "^4.2.2",
+    "prism-react-renderer": "^2.0.4",
+    "re-resizable": "^6.9.9",
     "react-font-loader": "^2.0.0",
-    "react-layout-kit": "^1",
-    "react-markdown": "^8",
-    "react-rnd": "^10",
-    "remark-gfm": "^3",
-    "shiki-es": "^0.2",
-    "styled-components": "^6.0.0-rc.1",
-    "ts-md5": "^1",
-    "use-merge-value": "^1",
-    "zustand": "^4",
-    "zustand-utils": "^1"
+    "react-layout-kit": "^1.7.0",
+    "react-markdown": "^8.0.7",
+    "react-rnd": "^10.4.1",
+    "remark-gfm": "^3.0.1",
+    "shiki-es": "^0.2.0",
+    "styled-components": "6.0.0-rc.2",
+    "ts-md5": "^1.3.1",
+    "use-merge-value": "^1.2.0",
+    "zustand": "^4.3.8",
+    "zustand-utils": "^1.2.2"
   },
   "devDependencies": {
-    "@ant-design/colors": "^7",
-    "@commitlint/cli": "^17",
-    "@testing-library/react": "^14",
-    "@types/chroma-js": "^2",
-    "@types/lodash": "^4",
-    "@types/pangu": "^4",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
-    "@umijs/lint": "^4",
+    "@ant-design/colors": "^7.0.0",
+    "@commitlint/cli": "^17.6.3",
+    "@testing-library/react": "^14.0.0",
+    "@types/chroma-js": "^2.4.0",
+    "@types/lodash": "^4.14.195",
+    "@types/pangu": "^4.0.0",
+    "@types/react": "^18.2.7",
+    "@types/react-dom": "^18.2.4",
+    "@umijs/lint": "^4.0.69",
     "@vitest/coverage-c8": "latest",
-    "antd": "^5",
-    "commitlint": "^17",
-    "commitlint-config-gitmoji": "^2",
-    "concurrently": "^8",
-    "cross-env": "^7",
-    "dumi": "2",
-    "dumi-assets-types": "^1",
-    "dumi-theme-lobehub": "latest",
-    "eslint": "^8",
-    "eslint-import-resolver-alias": "^1",
-    "eslint-import-resolver-typescript": "^3",
-    "father": "^4",
-    "husky": "^8",
-    "jsdom": "^22",
-    "lint-staged": "^13",
-    "postcss-styled-syntax": "^0.4",
-    "prettier": "^2",
-    "prettier-plugin-organize-imports": "^3",
-    "prettier-plugin-packagejson": "^2",
-    "react": "^18",
-    "react-dom": "^18",
-    "semantic-release": "^21",
-    "semantic-release-config-gitmoji": "^1",
-    "stylelint": "^15",
-    "stylelint-config-clean-order": "^5",
-    "stylelint-config-recommended": "^12",
-    "stylelint-order": "^6",
-    "typescript": "^5",
+    "antd": "^5.5.1",
+    "commitlint": "^17.6.3",
+    "commitlint-config-gitmoji": "^2.3.1",
+    "concurrently": "^8.0.1",
+    "cross-env": "^7.0.3",
+    "dumi": "^2.2.0",
+    "dumi-assets-types": "^1.0.1",
+    "dumi-theme-lobehub": "workspace:latest",
+    "eslint": "^8.41.0",
+    "eslint-import-resolver-alias": "^1.1.2",
+    "eslint-import-resolver-typescript": "^3.5.5",
+    "father": "^4.1.9",
+    "husky": "^8.0.3",
+    "jsdom": "^22.0.0",
+    "lint-staged": "^13.2.2",
+    "postcss-styled-syntax": "^0.4.0",
+    "prettier": "^2.8.8",
+    "prettier-plugin-organize-imports": "^3.2.2",
+    "prettier-plugin-packagejson": "^2.4.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "semantic-release": "^21.0.2",
+    "semantic-release-config-gitmoji": "^1.5.0",
+    "stylelint": "^15.6.2",
+    "stylelint-config-clean-order": "^5.0.1",
+    "stylelint-config-recommended": "^12.0.0",
+    "stylelint-order": "^6.0.3",
+    "typescript": "^5.0.4",
     "vitest": "latest"
   },
   "peerDependencies": {