@lobehub/ui 1.25.4 → 1.25.5

package/es/EditableMessageList/index.js

@@ -1,13 +1,12 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { PlusOutlined } from '@ant-design/icons';
 import { Button, Select } from 'antd';
 import isEqual from 'fast-deep-equal';
-import { TrashIcon } from 'lucide-react';
+import { Plus, Trash } from 'lucide-react';
 import { memo, useEffect, useReducer } from 'react';
 import { Flexbox } from 'react-layout-kit';
-import IconAction from "../ActionIcon";
 import { messagesReducer } from "../Chat";
 import { ControlInput } from "../components/ControlInput";
+import { ActionIcon, Icon } from "./..";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {
@@ -45,13 +44,13 @@ export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {
           },
           options: [{
             value: 'system',
-            label: '系统'
+            label: 'System'
           }, {
             value: 'user',
-            label: '输入'
+            label: 'Input'
           }, {
             value: 'assistant',
-            label: '输出'
+            label: 'Output'
           }],
           style: {
             width: 120
@@ -68,8 +67,8 @@ export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {
           },
           placeholder: item.role === 'user' ? '请填入输入的样例内容' : '请填入输出的样例',
           value: item.content
-        }), /*#__PURE__*/_jsx(IconAction, {
-          icon: TrashIcon,
+        }), /*#__PURE__*/_jsx(ActionIcon, {
+          icon: Trash,
           onClick: function onClick() {
             dispatch({
               type: 'deleteMessage',
@@ -77,13 +76,18 @@ export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {
             });
           },
           placement: "right",
+          size: {
+            fontSize: 16
+          },
           title: "Delete"
         })]
       }, "".concat(index, "-").concat(item.content));
     }), /*#__PURE__*/_jsx(Button, {
       block: true,
       disabled: disabled,
-      icon: /*#__PURE__*/_jsx(PlusOutlined, {}),
+      icon: /*#__PURE__*/_jsx(Icon, {
+        icon: Plus
+      }),
       onClick: function onClick() {
         var lastMeg = chatMessages.at(-1);
         dispatch({
@@ -94,7 +98,7 @@ export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {
           }
         });
       },
-      children: "\u6DFB\u52A0\u4E00\u9879"
+      children: "Add Props"
     })]
   });
 }, isEqual);

package/es/Hero/index.js

@@ -33,21 +33,18 @@ var Hero = /*#__PURE__*/memo(function (_ref) {
           rel: "noreferrer",
           target: openExternal ? '_blank' : undefined,
           children: type === 'primary' ? /*#__PURE__*/_jsx(GradientButton, {
+            icon: ButtonIcon && /*#__PURE__*/_jsx(Icon, {
+              icon: ButtonIcon
+            }),
             size: "large",
             children: text
           }, index) : /*#__PURE__*/_jsx(Button, {
+            icon: ButtonIcon && /*#__PURE__*/_jsx(Icon, {
+              icon: ButtonIcon
+            }),
             size: "large",
             type: "primary",
-            children: /*#__PURE__*/_jsxs(Space, {
-              align: "center",
-              children: [ButtonIcon && /*#__PURE__*/_jsx(Icon, {
-                icon: ButtonIcon,
-                size: {
-                  fontSize: 18,
-                  strokeWidth: 2
-                }
-              }), text]
-            })
+            children: text
           }, index)
         }, text);
       })

package/es/Highlighter/SyntaxHighlighter/index.js

@@ -1,10 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { Loading3QuartersOutlined as Loading } from '@ant-design/icons';
 import { useThemeMode } from 'antd-style';
+import { Loader2 } from 'lucide-react';
 import { memo, useEffect } from 'react';
 import { Center } from 'react-layout-kit';
 import { shallow } from 'zustand/shallow';
 import { useHighlight } from "../../hooks/useHighlight";
+import { Icon } from "../..";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -13,8 +14,7 @@ var SyntaxHighlighter = /*#__PURE__*/memo(function (_ref) {
   var children = _ref.children,
     language = _ref.language;
   var _useStyles = useStyles(),
-    styles = _useStyles.styles,
-    theme = _useStyles.theme;
+    styles = _useStyles.styles;
   var _useThemeMode = useThemeMode(),
     isDarkMode = _useThemeMode.isDarkMode;
   var _useHighlight = useHighlight(function (s) {
@@ -43,11 +43,9 @@ var SyntaxHighlighter = /*#__PURE__*/memo(function (_ref) {
       className: styles.loading,
       gap: 8,
       horizontal: true,
-      children: [/*#__PURE__*/_jsx(Loading, {
-        spin: true,
-        style: {
-          color: theme.colorTextTertiary
-        }
+      children: [/*#__PURE__*/_jsx(Icon, {
+        icon: Loader2,
+        spin: true
       }), "Highlighting..."]
     })]
   });

package/es/Icon/index.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["icon", "size", "style", "className", "spin"];
+var _excluded = ["icon", "size", "className", "spin"];
 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 { memo, useMemo } from 'react';
@@ -40,7 +40,6 @@ var calcSize = function calcSize(size) {
 var Icon = /*#__PURE__*/memo(function (_ref) {
   var icon = _ref.icon,
     size = _ref.size,
-    style = _ref.style,
     className = _ref.className,
     spin = _ref.spin,
     props = _objectWithoutProperties(_ref, _excluded);
@@ -53,16 +52,16 @@ var Icon = /*#__PURE__*/memo(function (_ref) {
     }, [size]),
     fontSize = _useMemo.fontSize,
     strokeWidth = _useMemo.strokeWidth;
-  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
-    className: cx(styles.icon, spin && styles.spin, className),
-    style: _objectSpread({
-      width: fontSize,
-      height: fontSize
-    }, style)
+  return /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
+    className: cx('anticon', spin && styles.spin, className),
+    role: "img"
   }, props), {}, {
     children: /*#__PURE__*/_jsx(SvgIcon, {
+      focusable: false,
+      height: fontSize,
       size: fontSize,
-      strokeWidth: strokeWidth
+      strokeWidth: strokeWidth,
+      width: fontSize
     })
   }));
 });

package/es/Icon/style.d.ts

@@ -1,4 +1,3 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    icon: import("antd-style").SerializedStyles;
     spin: import("antd-style").SerializedStyles;
 }>;

package/es/Icon/style.js

@@ -1,11 +1,10 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject, _templateObject2;
 import { createStyles, keyframes } from 'antd-style';
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   var spin = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n  "])));
   return {
-    icon: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    "]))),
-    spin: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      animation: ", " 1s linear infinite;\n    "])), spin)
+    spin: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      animation: ", " 1s linear infinite;\n    "])), spin)
   };
 });

package/es/MessageModal/index.js

@@ -1,14 +1,12 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { AimOutlined } from '@ant-design/icons';
 import { Modal } from 'antd';
+import { X } from 'lucide-react';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 import useControlledState from 'use-merge-value';
-import Markdown from "../Markdown";
-import MessageInput from "../MessageInput";
+import { Icon, Markdown, MessageInput } from "./..";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
 var MessageModal = /*#__PURE__*/memo(function (_ref) {
   var editing = _ref.editing,
     open = _ref.open,
@@ -33,10 +31,13 @@ var MessageModal = /*#__PURE__*/memo(function (_ref) {
     expand = _useControlledState4[0],
     setExpand = _useControlledState4[1];
   return /*#__PURE__*/_jsx(Modal, {
-    cancelText: '关闭',
+    cancelText: 'Cancel',
     className: styles.modal,
+    closeIcon: /*#__PURE__*/_jsx(Icon, {
+      icon: X
+    }),
     footer: isEdit ? null : undefined,
-    okText: '编辑',
+    okText: 'Edit',
     onCancel: function onCancel() {
       return setExpand(false);
     },
@@ -44,11 +45,11 @@ var MessageModal = /*#__PURE__*/memo(function (_ref) {
       setTyping(true);
     },
     open: expand,
-    title: /*#__PURE__*/_jsxs(Flexbox, {
+    title: /*#__PURE__*/_jsx(Flexbox, {
       align: 'center',
       gap: 4,
       horizontal: true,
-      children: [/*#__PURE__*/_jsx(AimOutlined, {}), "\u63D0\u793A\u8BCD"]
+      children: "Prompt"
     }),
     width: 800,
     children: isEdit ? /*#__PURE__*/_jsx(MessageInput, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.25.4",
+  "version": "1.25.5",
   "description": "Lobe UI is an open-source UI component library for building chatbot web apps",
   "keywords": [
     "lobehub",
@@ -98,7 +98,7 @@
     "react-rnd": "^10",
     "remark-gfm": "^3",
     "shiki-es": "^0",
-    "styled-components": "beta",
+    "styled-components": "latest",
     "ts-md5": "^1",
     "use-merge-value": "^1",
     "zustand": "^4",