@lobehub/ui 2.18.3 → 2.18.4

package/es/EmojiPicker/EmojiPicker.js

@@ -1,7 +1,7 @@
 'use client';
 
 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); }
-var _excluded = ["value", "defaultAvatar", "onChange", "locale", "allowUpload", "allowDelete", "texts", "onDelete", "compressSize", "customEmojis", "className", "loading", "onUpload", "customTabs", "popupClassName", "popupStyle", "customRender", "open", "defaultOpen", "onOpenChange"];
+var _excluded = ["value", "defaultAvatar", "onChange", "locale", "allowUpload", "allowDelete", "texts", "onDelete", "compressSize", "customEmojis", "className", "loading", "onUpload", "customTabs", "popupClassName", "popupStyle", "customRender", "open", "defaultOpen", "onOpenChange", "popupProps"];
 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; }
 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; }
@@ -66,6 +66,7 @@ var EmojiPicker = /*#__PURE__*/memo(function (_ref) {
     _ref$defaultOpen = _ref.defaultOpen,
     defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
     onOpenChange = _ref.onOpenChange,
+    popupProps = _ref.popupProps,
     rest = _objectWithoutProperties(_ref, _excluded);
   var ref = useRef(null);
   var _useMergeState = useMergeState(defaultOpen, {
@@ -154,6 +155,7 @@ var EmojiPicker = /*#__PURE__*/memo(function (_ref) {
     }, popupStyle),
     children: [showTabs && /*#__PURE__*/_jsxs(Flexbox, {
       align: 'center',
+      className: styles.tabs,
       horizontal: true,
       justify: 'space-between',
       paddingInline: 10,
@@ -163,14 +165,18 @@ var EmojiPicker = /*#__PURE__*/memo(function (_ref) {
         items: items,
         onChange: function onChange(key) {
           return setTab(key);
-        }
+        },
+        size: 'small'
       }), allowDelete && /*#__PURE__*/_jsx(ActionIcon, {
         icon: TrashIcon,
         onClick: function onClick() {
           handleAvatarChange(defaultAvatar);
           onDelete === null || onDelete === void 0 || onDelete();
         },
-        size: 20,
+        size: {
+          blockSize: 32,
+          size: 18
+        },
         title: (texts === null || texts === void 0 ? void 0 : texts.delete) || 'Delete'
       })]
     }), tab === 'emoji' && /*#__PURE__*/_jsx(Picker, {
@@ -198,7 +204,7 @@ var EmojiPicker = /*#__PURE__*/memo(function (_ref) {
       }, item.value);
     })]
   });
-  return /*#__PURE__*/_jsx(Popover, {
+  return /*#__PURE__*/_jsx(Popover, _objectSpread(_objectSpread({
     arrow: false,
     content: content,
     defaultOpen: defaultOpen,
@@ -207,15 +213,16 @@ var EmojiPicker = /*#__PURE__*/memo(function (_ref) {
       setVisible(v);
     },
     open: visible,
-    placement: 'bottomRight',
+    placement: 'bottom',
     rootClassName: styles.popover,
-    trigger: ['click'],
+    trigger: ['click']
+  }, popupProps), {}, {
     children: customRender ? customRender(ava) : /*#__PURE__*/_jsx(Avatar, _objectSpread({
       avatar: ava,
       className: cx(styles.root, className),
       loading: loading
     }, rest))
-  });
+  }));
 });
 EmojiPicker.displayName = 'EmojiPicker';
 export default EmojiPicker;

package/es/EmojiPicker/style.d.ts

@@ -3,4 +3,5 @@ export declare const useStyles: (props?: unknown) => import("antd-style").Return
     picker: import("antd-style").SerializedStyles;
     popover: import("antd-style").SerializedStyles;
     root: import("antd-style").SerializedStyles;
+    tabs: import("antd-style").SerializedStyles;
 }>;

package/es/EmojiPicker/style.js

@@ -1,4 +1,4 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { createStyles } from 'antd-style';
 import chroma from 'chroma-js';
@@ -10,6 +10,7 @@ export var useStyles = createStyles(function (_ref) {
     editor: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow: hidden;\n    border: 1px solid ", ";\n    border-radius: ", "px;\n  "])), token.colorBorder, token.borderRadiusLG),
     picker: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n\n    em-emoji-picker {\n      --rgb-accent: ", ";\n      --shadow: none;\n      --rgb-background: ", ";\n      --border-radius: 0;\n    }\n  "])), chroma(token.colorPrimary).rgb().join(','), chroma(token.colorBgElevated).rgb().join(',')),
     popover: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    .", "-popover-inner {\n      overflow: hidden;\n      padding: 0;\n    }\n  "])), prefixCls),
-    root: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    position: relative;\n    transition: box-shadow 100ms ", ";\n\n    &:hover {\n      box-shadow: 0 0 0 3px ", ";\n    }\n  "])), token.motionEaseOut, token.colorText)
+    root: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    position: relative;\n    transition: background 150ms ", ";\n\n    &:hover {\n      background: ", ";\n    }\n  "])), token.motionEaseOut, token.colorFillSecondary),
+    tabs: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    border-block-end: 1px solid ", ";\n\n    .ant-tabs-tab {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      width: 32px;\n      height: 32px;\n      padding: 0 !important;\n    }\n  "])), token.colorBorderSecondary)
   };
 });

package/es/EmojiPicker/type.d.ts

@@ -1,3 +1,4 @@
+import { PopoverProps } from 'antd';
 import { CSSProperties, ReactNode } from 'react';
 import type { AvatarProps } from "../Avatar/type";
 import type { AvatarUploaderProps } from "./AvatarUploader";
@@ -37,6 +38,7 @@ export interface EmojiPickerProps extends Omit<AvatarProps, 'onChange' | 'avatar
     onUpload?: AvatarUploaderProps['onUpload'];
     open?: boolean;
     popupClassName?: string;
+    popupProps?: Omit<PopoverProps, 'onOpenChange' | 'defaultOpen' | 'content' | 'open' | 'rootClassName' | 'trigger'>;
     popupStyle?: CSSProperties;
     size?: number;
     texts?: AvatarUploaderProps['texts'] & {

package/es/ThemeProvider/ConfigProvider.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const ConfigProvider: import("react").NamedExoticComponent<{
+    children?: import("react").ReactNode;
+}>;
+export default ConfigProvider;

package/es/ThemeProvider/ConfigProvider.js

@@ -0,0 +1,41 @@
+'use client';
+
+import { ConfigProvider as AntdConfigProvider } from 'antd';
+import { useTheme } from 'antd-style';
+import { memo } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var ConfigProvider = /*#__PURE__*/memo(function (_ref) {
+  var children = _ref.children;
+  var theme = useTheme();
+  return /*#__PURE__*/_jsx(AntdConfigProvider, {
+    theme: {
+      components: {
+        Button: {
+          contentFontSizeSM: 12
+        },
+        DatePicker: {
+          activeBorderColor: theme.colorBorder,
+          hoverBorderColor: theme.colorBorder
+        },
+        Input: {
+          activeBorderColor: theme.colorBorder,
+          hoverBorderColor: theme.colorBorder
+        },
+        InputNumber: {
+          activeBorderColor: theme.colorBorder,
+          hoverBorderColor: theme.colorBorder
+        },
+        Mentions: {
+          activeBorderColor: theme.colorBorder,
+          hoverBorderColor: theme.colorBorder
+        },
+        Select: {
+          activeBorderColor: theme.colorBorder,
+          hoverBorderColor: theme.colorBorder
+        }
+      }
+    },
+    children: children
+  });
+});
+export default ConfigProvider;

package/es/ThemeProvider/ThemeProvider.js

@@ -17,6 +17,7 @@ import { useCdnFn } from "../ConfigProvider";
 import FontLoader from "../FontLoader";
 import { lobeCustomStylish, lobeCustomToken } from "../styles";
 import { createLobeAntdTheme } from "../styles/theme/antdTheme";
+import ConfigProvider from "./ConfigProvider";
 import GlobalStyle from "./GlobalStyle";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -71,19 +72,21 @@ var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
       return /*#__PURE__*/_jsx(FontLoader, {
         url: webfont
       }, webfont);
-    }), /*#__PURE__*/_jsxs(AntdThemeProvider, _objectSpread(_objectSpread({
+    }), /*#__PURE__*/_jsx(AntdThemeProvider, _objectSpread(_objectSpread({
       customStylish: stylish,
       customToken: token,
       theme: theme
     }, rest), {}, {
-      children: [enableGlobalStyle && /*#__PURE__*/_jsx(GlobalStyle, {}), /*#__PURE__*/_jsx(App, {
-        className: className,
-        style: _objectSpread({
-          minHeight: 'inherit',
-          width: 'inherit'
-        }, style),
-        children: children
-      })]
+      children: /*#__PURE__*/_jsxs(ConfigProvider, {
+        children: [enableGlobalStyle && /*#__PURE__*/_jsx(GlobalStyle, {}), /*#__PURE__*/_jsx(App, {
+          className: className,
+          style: _objectSpread({
+            minHeight: 'inherit',
+            width: 'inherit'
+          }, style),
+          children: children
+        })]
+      })
     }))]
   });
 });

package/package.json

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