@lobehub/ui 1.160.0 → 1.161.0

package/es/ActionIcon/index.d.ts

@@ -1,4 +1,4 @@
-import { type CSSProperties } from 'react';
+/// <reference types="react" />
 import { type FlexboxProps } from 'react-layout-kit';
 import { type IconProps, type IconSizeConfig, type IconSizeType, LucideIconProps } from "../Icon";
 import { type TooltipProps } from "../Tooltip";
@@ -19,6 +19,7 @@ export interface ActionIconProps extends LucideIconProps, FlexboxProps {
      * @default false
      */
     arrow?: boolean;
+    classNames?: TooltipProps['classNames'];
     disable?: boolean;
     /**
      * @description Glass blur style
@@ -30,7 +31,8 @@ export interface ActionIconProps extends LucideIconProps, FlexboxProps {
      * @description Set the loading status of ActionIcon
      */
     loading?: boolean;
-    overlayStyle?: CSSProperties;
+    overlayClassName?: TooltipProps['overlayClassName'];
+    overlayStyle?: TooltipProps['overlayStyle'];
     /**
      * @description The position of the tooltip relative to the target
      * @enum ["top","left","right","bottom","topLeft","topRight","bottomLeft","bottomRight","leftTop","leftBottom","rightTop","rightBottom"]
@@ -48,6 +50,7 @@ export interface ActionIconProps extends LucideIconProps, FlexboxProps {
      * @default false
      */
     spotlight?: boolean;
+    styles?: TooltipProps['styles'];
     /**
      * @description The text shown in the tooltip
      */

package/es/ActionIcon/index.js

@@ -3,7 +3,7 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["color", "fill", "className", "active", "icon", "size", "style", "glass", "title", "placement", "arrow", "spotlight", "onClick", "children", "loading", "overlayStyle", "tooltipDelay", "fillOpacity", "fillRule", "focusable", "disable", "spin"];
+var _excluded = ["color", "fill", "className", "active", "icon", "size", "style", "glass", "title", "placement", "arrow", "spotlight", "onClick", "children", "loading", "tooltipDelay", "fillOpacity", "fillRule", "focusable", "disable", "spin", "styles"];
 import { Loader2 } from 'lucide-react';
 import { forwardRef, useCallback, useMemo, useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
@@ -32,7 +32,6 @@ var ActionIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onClick = _ref.onClick,
     children = _ref.children,
     loading = _ref.loading,
-    overlayStyle = _ref.overlayStyle,
     _ref$tooltipDelay = _ref.tooltipDelay,
     tooltipDelay = _ref$tooltipDelay === void 0 ? 0.5 : _ref$tooltipDelay,
     fillOpacity = _ref.fillOpacity,
@@ -40,12 +39,13 @@ var ActionIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
     focusable = _ref.focusable,
     disable = _ref.disable,
     iconSpinning = _ref.spin,
+    styles = _ref.styles,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles({
       active: Boolean(active),
       glass: Boolean(glass)
     }),
-    styles = _useStyles.styles,
+    s = _useStyles.styles,
     cx = _useStyles.cx;
   var _useMemo = useMemo(function () {
       return calcSize(size);
@@ -61,7 +61,7 @@ var ActionIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
     size: size === 'site' ? 'normal' : size
   };
   var content = icon && /*#__PURE__*/_jsx(Icon, _objectSpread(_objectSpread({
-    className: styles.icon,
+    className: s.icon,
     icon: icon
   }, iconProps), {}, {
     spin: iconSpinning
@@ -82,7 +82,7 @@ var ActionIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, [loading, disable, setTooltipOpen, onClick]);
   var actionIconBlock = /*#__PURE__*/_jsxs(Flexbox, _objectSpread(_objectSpread({
     align: 'center',
-    className: cx(styles.block, disable ? styles.disabled : styles.normal, className),
+    className: cx(s.block, disable ? s.disabled : s.normal, className),
     horizontal: true,
     justify: 'center',
     onClick: handleClick,
@@ -101,10 +101,12 @@ var ActionIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
     mouseEnterDelay: tooltipDelay,
     onOpenChange: setTooltipOpen,
     open: tooltipOpen,
-    overlayStyle: _objectSpread({
-      pointerEvents: 'none'
-    }, overlayStyle),
     placement: placement,
+    styles: _objectSpread(_objectSpread({}, styles), {}, {
+      root: _objectSpread({
+        pointerEvents: 'none'
+      }, styles === null || styles === void 0 ? void 0 : styles.root)
+    }),
     title: title,
     children: actionIconBlock
   });

package/es/Tooltip/index.js

@@ -17,7 +17,9 @@ var Tooltip = /*#__PURE__*/memo(function (_ref) {
     cx = _useStyles.cx;
   return /*#__PURE__*/_jsx(AntdTooltip, _objectSpread({
     arrow: arrow,
-    overlayClassName: cx(styles.tooltip, className)
+    classNames: {
+      root: cx(styles.tooltip, className)
+    }
   }, rest));
 });
 export default Tooltip;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.160.0",
+  "version": "1.161.0",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",
@@ -41,6 +41,7 @@
     "storybook.js"
   ],
   "dependencies": {
+    "@ant-design/cssinjs": "^1.22.0",
     "@babel/runtime": "^7.26.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^8.0.0",
@@ -50,19 +51,32 @@
     "@emoji-mart/react": "^1.1.1",
     "@floating-ui/react": "^0.26.28",
     "@giscus/react": "^3.1.0",
+    "@lobehub/fluent-emoji": "^1.0.0",
     "@mdx-js/mdx": "^2.3.0",
     "@mdx-js/react": "^2.3.0",
     "@radix-ui/react-slot": "^1.1.1",
     "@shikijs/transformers": "^1.26.1",
+    "@splinetool/runtime": "^0.9.0",
+    "ahooks": "^3.8.0",
+    "antd-style": "^3.7.0",
+    "chroma-js": "^3.0.0",
+    "class-variance-authority": "^0.7.0",
+    "dayjs": "^1.11.0",
     "emoji-mart": "^5.6.0",
+    "fast-deep-equal": "^3.0.0",
     "immer": "^10.1.1",
     "leva": "^0.9.35",
+    "lodash-es": "^4.0.0",
+    "lucide-react": "^0.469.0",
     "mermaid": "^11.4.1",
     "numeral": "^2.0.6",
+    "polished": "^4.0.0",
+    "query-string": "^9.0.0",
     "rc-footer": "^0.6.8",
     "re-resizable": "^6.10.3",
     "react-avatar-editor": "^13.0.2",
     "react-error-boundary": "^4.1.2",
+    "react-layout-kit": "^1.0.0",
     "react-markdown": "^8.0.7",
     "react-merge-refs": "^2.1.1",
     "react-rnd": "^10.4.14",
@@ -72,31 +86,16 @@
     "remark-gfm": "^3.0.1",
     "remark-math": "^5.1.1",
     "shiki": "^1.26.1",
-    "unified": "^10.1.2"
-  },
-  "peerDependencies": {
-    "@ant-design/cssinjs": "^1.22.0",
-    "@babel/runtime": "^7.0.0",
-    "@lobehub/fluent-emoji": "^1.0.0",
-    "@splinetool/runtime": "^0.9.0",
-    "ahooks": "^3.8.0",
-    "antd": "^5.22.0",
-    "antd-style": "^3.7.0",
-    "chroma-js": "^3.0.0",
-    "class-variance-authority": "^0.7.0",
-    "dayjs": "^1.11.0",
-    "fast-deep-equal": "^3.0.0",
-    "lodash-es": "^4.0.0",
-    "lucide-react": "^0.400.0",
-    "polished": "^4.0.0",
-    "query-string": "^9.0.0",
-    "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0",
-    "react-layout-kit": "^1.0.0",
     "swr": "^2.3.0",
     "ts-md5": "^1.0.0",
+    "unified": "^10.1.2",
     "url-join": "^5.0.0",
     "use-merge-value": "^1.2.0",
     "uuid": "^11.0.0"
+  },
+  "peerDependencies": {
+    "antd": "^5.23.0",
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
   }
 }