@lobehub/ui 1.26.0 → 1.26.2

package/es/Chat/utils/fetch.js

@@ -23,7 +23,7 @@ var codeMessage = {
  * @param options
  */
 export var fetchSSE = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(fetchFn) {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(fetchFunction) {
     var options,
       response,
       _options$onErrorHandl,
@@ -44,7 +44,7 @@ export var fetchSSE = /*#__PURE__*/function () {
         case 0:
           options = _args.length > 1 && _args[1] !== undefined ? _args[1] : {};
           _context.next = 3;
-          return fetchFn();
+          return fetchFunction();
         case 3:
           response = _context.sent;
           if (response.ok) {
@@ -52,9 +52,9 @@ export var fetchSSE = /*#__PURE__*/function () {
             break;
           }
           chatMessageError = {
-            type: 'chatbot',
             message: codeMessage[response.status],
-            status: response.status
+            status: response.status,
+            type: 'chatbot'
           };
           (_options$onErrorHandl = options.onErrorHandle) === null || _options$onErrorHandl === void 0 ? void 0 : _options$onErrorHandl.call(options, chatMessageError);
           return _context.abrupt("return");

package/es/ChatInputArea/index.js

@@ -7,7 +7,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { Button } from 'antd';
 import { Maximize2, Minimize2 } from 'lucide-react';
 import { memo, useCallback, useEffect, useRef, useState } from 'react';
-import { ActionIcon, TextArea } from "./..";
+import ActionIcon from "../ActionIcon";
+import { TextArea } from "../Input";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";

package/es/ChatInputArea/style.d.ts

@@ -1,8 +1,8 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    container: import("antd-style").SerializedStyles;
-    actionsBar: import("antd-style").SerializedStyles;
     actionLeft: import("antd-style").SerializedStyles;
+    actionsBar: import("antd-style").SerializedStyles;
     actionsRight: import("antd-style").SerializedStyles;
-    textarea: import("antd-style").SerializedStyles;
+    container: import("antd-style").SerializedStyles;
     footerBar: import("antd-style").SerializedStyles;
+    textarea: import("antd-style").SerializedStyles;
 }>;

package/es/ChatInputArea/style.js

@@ -4,11 +4,11 @@ import { createStyles } from 'antd-style';
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return {
-    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      position: relative;\n\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n\n      height: 100%;\n      padding: 12px 0 16px;\n    "]))),
+    actionLeft: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex: 1;\n      gap: 4px;\n      align-items: center;\n      justify-content: flex-start;\n    "]))),
     actionsBar: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: none;\n      align-items: center;\n      justify-content: space-between;\n\n      padding: 0 16px;\n    "]))),
-    actionLeft: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: 1;\n      gap: 4px;\n      align-items: center;\n      justify-content: flex-start;\n    "]))),
-    actionsRight: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: 0;\n      gap: 4px;\n      align-items: center;\n      justify-content: flex-end;\n    "]))),
-    textarea: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      flex: 1;\n      padding: 0 24px;\n    "]))),
-    footerBar: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: none;\n      gap: 8px;\n      align-items: center;\n      justify-content: flex-end;\n\n      padding: 0 24px;\n    "])))
+    actionsRight: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: 0;\n      gap: 4px;\n      align-items: center;\n      justify-content: flex-end;\n    "]))),
+    container: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      position: relative;\n\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n\n      height: 100%;\n      padding: 12px 0 16px;\n    "]))),
+    footerBar: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      display: flex;\n      flex: none;\n      gap: 8px;\n      align-items: center;\n      justify-content: flex-end;\n\n      padding: 0 24px;\n    "]))),
+    textarea: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      flex: 1;\n      padding: 0 24px;\n    "])))
   };
 });

package/es/ChatItem/index.js

@@ -6,7 +6,9 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { Alert } from 'antd';
 import { Loader2 } from 'lucide-react';
 import { memo } from 'react';
-import { Avatar, Icon, Markdown } from "./..";
+import Avatar from "../Avatar";
+import Icon from "../Icon";
+import Markdown from "../Markdown";
 import { formatTime } from "../utils/formatTime";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -29,21 +31,21 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
     alert = _ref.alert,
     showTitle = _ref.showTitle,
     time = _ref.time,
-    props = _objectWithoutProperties(_ref, _excluded);
+    properties = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles({
+      avatarSize: AVATAR_SIZE,
+      borderSpacing: borderSpacing,
       placement: placement,
-      type: type,
-      title: title,
       primary: primary,
-      avatarSize: AVATAR_SIZE,
       showTitle: showTitle,
-      borderSpacing: borderSpacing
+      title: title,
+      type: type
     }),
     cx = _useStyles.cx,
     styles = _useStyles.styles;
   return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
     className: cx(styles.container, className)
-  }, props), {}, {
+  }, properties), {}, {
     children: [/*#__PURE__*/_jsxs("div", {
       className: styles.avatarContainer,
       children: [/*#__PURE__*/_jsx(Avatar, {
@@ -66,7 +68,7 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
       className: styles.messageContainer,
       children: [/*#__PURE__*/_jsxs("div", {
         className: cx(styles.name, 'chat-item-name'),
-        children: [showTitle ? avatar.title || 'untitled' : null, time && /*#__PURE__*/_jsx("span", {
+        children: [showTitle ? avatar.title || 'untitled' : undefined, time && /*#__PURE__*/_jsx("span", {
           className: "chat-item-time",
           children: formatTime(time)
         })]
@@ -83,8 +85,8 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
       })]
     }), borderSpacing && /*#__PURE__*/_jsx("div", {
       style: {
-        width: AVATAR_SIZE,
-        flex: 'none'
+        flex: 'none',
+        width: AVATAR_SIZE
       }
     })]
   }));

package/es/ChatItem/style.d.ts

@@ -7,11 +7,11 @@ export declare const useStyles: (props?: {
     title?: string | undefined;
     type?: "block" | "pure" | undefined;
 } | undefined) => import("antd-style").ReturnStyles<{
+    actions: string;
+    avatarContainer: import("antd-style").SerializedStyles;
     container: string;
     loading: import("antd-style").SerializedStyles;
-    avatarContainer: import("antd-style").SerializedStyles;
+    message: string;
     messageContainer: import("antd-style").SerializedStyles;
     name: import("antd-style").SerializedStyles;
-    message: string;
-    actions: string;
 }>;

package/es/ChatItem/style.js

@@ -17,12 +17,12 @@ export var useStyles = createStyles(function (_ref, _ref2) {
   var pureContainerStylish = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      transition: background-color 100ms ", ";\n    "])), token.motionEaseOut);
   var typeStylish = type === 'block' ? blockStylish : pureStylish;
   return {
-    container: cx(type === 'pure' && pureContainerStylish, css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n          position: relative;\n\n          display: flex;\n          flex-direction: ", ";\n          gap: 12px;\n          align-items: flex-start;\n          justify-content: revert;\n\n          width: 100%;\n          padding: 12px;\n\n          .chat-item-time,\n          .chat-item-actions {\n            display: none;\n          }\n\n          &:hover {\n            .chat-item-time {\n              display: inline-block;\n            }\n\n            .chat-item-actions {\n              display: flex;\n            }\n          }\n        "])), placement === 'left' ? 'row' : 'row-reverse')),
-    loading: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        position: absolute;\n        right: ", ";\n        bottom: 0;\n        left: ", ";\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        width: 16px;\n        height: 16px;\n\n        color: ", ";\n\n        background: ", ";\n        border-radius: 50%;\n      "])), placement === 'left' ? '-4px' : 'unset', placement === 'right' ? '-4px' : 'unset', token.colorBgLayout, token.colorPrimary),
-    avatarContainer: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        position: relative;\n        flex: none;\n        width: ", "px;\n        height: ", "px;\n      "])), avatarSize, avatarSize),
-    messageContainer: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        position: relative;\n\n        .ant-alert-with-description {\n          padding-block: 12px;\n          padding-inline: 12px;\n        }\n      "]))),
-    name: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        position: ", ";\n        top: ", ";\n        right: ", ";\n        left: ", ";\n\n        display: flex;\n        flex-direction: ", ";\n        gap: 4px;\n\n        margin-bottom: 6px;\n\n        font-size: 12px;\n        line-height: 1;\n        color: ", ";\n        text-align: ", ";\n      "])), showTitle ? 'relative' : 'absolute', showTitle ? 'unset' : '-16px', placement === 'right' ? '0' : 'unset', placement === 'left' ? '0' : 'unset', placement === 'left' ? 'row' : 'row-reverse', token.colorTextDescription, placement === 'left' ? 'left' : 'right'),
-    message: cx(typeStylish, css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n          position: relative;\n        "])))),
-    actions: cx(css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n          position: absolute;\n          display: flex;\n          align-items: flex-start;\n          justify-content: ", ";\n        "])), placement === 'left' ? 'flex-end' : 'flex-start'), type === 'block' && borderSpacing ? css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n              right: ", ";\n              bottom: 0;\n              left: ", ";\n              transform: translateX(", ");\n            "])), placement === 'left' ? '-4px' : 'unset', placement === 'right' ? '-4px' : 'unset', placement === 'left' ? '100%' : '-100%') : css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n              right: ", ";\n              bottom: ", ";\n              left: ", ";\n            "])), placement === 'left' ? '0' : 'unset', type === 'block' ? '-40px' : '-32px', placement === 'right' ? '0' : 'unset'))
+    actions: cx(css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n          position: absolute;\n          display: flex;\n          align-items: flex-start;\n          justify-content: ", ";\n        "])), placement === 'left' ? 'flex-end' : 'flex-start'), type === 'block' && borderSpacing ? css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n              right: ", ";\n              bottom: 0;\n              left: ", ";\n              transform: translateX(", ");\n            "])), placement === 'left' ? '-4px' : 'unset', placement === 'right' ? '-4px' : 'unset', placement === 'left' ? '100%' : '-100%') : css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n              right: ", ";\n              bottom: ", ";\n              left: ", ";\n            "])), placement === 'left' ? '0' : 'unset', type === 'block' ? '-40px' : '-32px', placement === 'right' ? '0' : 'unset')),
+    avatarContainer: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        position: relative;\n        flex: none;\n        width: ", "px;\n        height: ", "px;\n      "])), avatarSize, avatarSize),
+    container: cx(type === 'pure' && pureContainerStylish, css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n          position: relative;\n\n          display: flex;\n          flex-direction: ", ";\n          gap: 12px;\n          align-items: flex-start;\n          justify-content: revert;\n\n          width: 100%;\n          padding: 12px;\n\n          .chat-item-time,\n          .chat-item-actions {\n            display: none;\n          }\n\n          &:hover {\n            .chat-item-time {\n              display: inline-block;\n            }\n\n            .chat-item-actions {\n              display: flex;\n            }\n          }\n        "])), placement === 'left' ? 'row' : 'row-reverse')),
+    loading: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n        position: absolute;\n        right: ", ";\n        bottom: 0;\n        left: ", ";\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        width: 16px;\n        height: 16px;\n\n        color: ", ";\n\n        background: ", ";\n        border-radius: 50%;\n      "])), placement === 'left' ? '-4px' : 'unset', placement === 'right' ? '-4px' : 'unset', token.colorBgLayout, token.colorPrimary),
+    message: cx(typeStylish, css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n          position: relative;\n        "])))),
+    messageContainer: css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n        position: relative;\n\n        .ant-alert-with-description {\n          padding-block: 12px;\n          padding-inline: 12px;\n        }\n      "]))),
+    name: css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n        position: ", ";\n        top: ", ";\n        right: ", ";\n        left: ", ";\n\n        display: flex;\n        flex-direction: ", ";\n        gap: 4px;\n\n        margin-bottom: 6px;\n\n        font-size: 12px;\n        line-height: 1;\n        color: ", ";\n        text-align: ", ";\n      "])), showTitle ? 'relative' : 'absolute', showTitle ? 'unset' : '-16px', placement === 'right' ? '0' : 'unset', placement === 'left' ? '0' : 'unset', placement === 'left' ? 'row' : 'row-reverse', token.colorTextDescription, placement === 'left' ? 'left' : 'right')
   };
 });

package/es/ChatList/ActionsBar.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { type ActionIconGroupProps } from "../index";
+import { type ActionIconGroupProps } from "../ActionIconGroup";
 export interface ActionsBarProps extends ActionIconGroupProps {
     primary?: boolean;
 }

package/es/ChatList/ActionsBar.js

@@ -6,7 +6,8 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 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 { Copy, Edit, RotateCw, Trash } from 'lucide-react';
 import { memo, useMemo } from 'react';
-import { ActionIconGroup, Icon } from "./..";
+import ActionIconGroup from "../ActionIconGroup";
+import Icon from "../Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 var ActionsBar = /*#__PURE__*/memo(function (_ref) {
   var primary = _ref.primary,
@@ -18,50 +19,50 @@ var ActionsBar = /*#__PURE__*/memo(function (_ref) {
   var groupItems = useMemo(function () {
     return [primary ? {
       icon: Edit,
-      title: 'Edit',
       onClick: function onClick() {
         return console.log('click Edit');
-      }
+      },
+      title: 'Edit'
     } : {
       icon: RotateCw,
-      title: 'Regenerate',
       onClick: function onClick() {
         return console.log('click Regenerate');
-      }
+      },
+      title: 'Regenerate'
     }].concat(_toConsumableArray(items)).filter(Boolean);
   }, [primary, items]);
   var groupDropdownMenu = useMemo(function () {
-    return dropdownMenu.concat([{
-      key: 'Edit',
+    return [].concat(_toConsumableArray(dropdownMenu), [{
       icon: /*#__PURE__*/_jsx(Icon, {
         icon: Edit,
         size: "small"
       }),
+      key: 'Edit',
       label: 'Edit'
     }, {
-      key: 'Copy',
       icon: /*#__PURE__*/_jsx(Icon, {
         icon: Copy,
         size: "small"
       }),
+      key: 'Copy',
       label: 'Copy'
     }, {
-      key: 'Regenerate',
       icon: /*#__PURE__*/_jsx(Icon, {
         icon: RotateCw,
         size: "small"
       }),
+      key: 'Regenerate',
       label: 'Regenerate'
     }, {
       type: 'divider'
     }, {
-      key: 'Delete',
       icon: /*#__PURE__*/_jsx(Icon, {
         icon: Trash,
         size: "small"
       }),
+      key: 'Delete',
       label: 'Delete'
-    }]).filter(Boolean);
+    }]);
   }, [primary, dropdownMenu]);
   return /*#__PURE__*/_jsx(ActionIconGroup, _objectSpread({
     dropdownMenu: groupDropdownMenu,

package/es/ChatList/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ChatItemProps } from "../index";
+import { ChatItemProps } from "../ChatItem";
 import type { DivProps } from "../types";
 import { ChatMessage } from "../types/chatMessage";
 export interface ChatListProps extends DivProps {

package/es/ChatList/index.js

@@ -4,7 +4,7 @@ var _excluded = ["className", "data", "type", "showTitle"];
 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 } from 'react';
-import { ChatItem } from "./..";
+import ChatItem from "../ChatItem";
 import ActionsBar from "./ActionsBar";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";

package/es/ColorScales/ScaleRow.js

@@ -14,21 +14,27 @@ var ScaleRow = /*#__PURE__*/memo(function (_ref) {
   var isAlpha = false;
   switch (title) {
     case 'lightA':
-      style = {
-        backgroundColor: '#fff',
-        background: alphaBg.light
-      };
-      isAlpha = true;
-      break;
+      {
+        style = {
+          background: alphaBg.light,
+          backgroundColor: '#fff'
+        };
+        isAlpha = true;
+        break;
+      }
     case 'darkA':
-      style = {
-        backgroundColor: '#000',
-        background: alphaBg.dark
-      };
-      isAlpha = true;
-      break;
+      {
+        style = {
+          background: alphaBg.dark,
+          backgroundColor: '#000'
+        };
+        isAlpha = true;
+        break;
+      }
     default:
-      break;
+      {
+        break;
+      }
   }
   return /*#__PURE__*/_jsxs(Space, {
     size: 2,
@@ -39,7 +45,7 @@ var ScaleRow = /*#__PURE__*/memo(function (_ref) {
         children: title
       })
     }, title), scale.map(function (color, index) {
-      if (index === 0 || index === 12) return null;
+      if (index === 0 || index === 12) return false;
       return /*#__PURE__*/_jsx("div", {
         className: styles.scaleBox,
         onClick: function onClick() {

package/es/ColorScales/index.js

@@ -23,8 +23,10 @@ var ColorScales = /*#__PURE__*/memo(function (_ref) {
           size: 2,
           children: [/*#__PURE__*/_jsx("div", {
             className: styles.scaleRowTitle
-          }, "scale-num"), new Array(scale.light.length).fill('').map(function (_, index) {
-            if (index === 0 || index === 12) return null;
+          }, "scale-num"), Array.from({
+            length: scale.light.length
+          }).fill('').map(function (_, index) {
+            if (index === 0 || index === 12) return false;
             var isMidHighlight = midHighLight === index;
             return /*#__PURE__*/_jsx("div", {
               className: styles.scaleBox,
@@ -33,8 +35,8 @@ var ColorScales = /*#__PURE__*/memo(function (_ref) {
                 children: /*#__PURE__*/_jsx("div", {
                   className: styles.scaleItem,
                   style: {
-                    opacity: 0.5,
-                    fontWeight: isMidHighlight ? 700 : 400
+                    fontWeight: isMidHighlight ? 700 : 400,
+                    opacity: 0.5
                   },
                   children: index
                 })

package/es/ColorScales/style.d.ts

@@ -1,11 +1,11 @@
 export declare const alphaBg: {
-    light: string;
     dark: string;
+    light: string;
 };
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    view: import("antd-style").SerializedStyles;
     scaleBox: import("antd-style").SerializedStyles;
     scaleItem: import("antd-style").SerializedStyles;
     scaleRowTitle: import("antd-style").SerializedStyles;
     text: import("antd-style").SerializedStyles;
+    view: import("antd-style").SerializedStyles;
 }>;

package/es/ColorScales/style.js

@@ -2,16 +2,16 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 import { createStyles } from 'antd-style';
 export var alphaBg = {
-  light: 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAFpJREFUWAntljEKADAIA23p6v//qQ+wfUEcCu1yriEgp0FHRJSJcnehmmWm1Dv/lO4HIg1AAAKjTqm03ea88zMCCEDgO4HV5bS757f+7wRoAAIQ4B9gByAAgQ3pfiDmXmAeEwAAAABJRU5ErkJggg==) 0% 0% / 26px',
-  dark: 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAACPTkDJAAAAZUlEQVRIDe2VMQoAMAgDa9/g/1/oIzrpZBCh2dLFkkoDF0Fz99OdiOjks+2/7S8fRRmMMIVoRGSoYzvvqF8ZIMKlC1GhQBc6IkPzq32QmdAzkEGihpWOSPsAss8HegYySNSw0hE9WQ4StafZFqkAAAAASUVORK5CYII=) 0% 0% / 26px'
+  dark: 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAACPTkDJAAAAZUlEQVRIDe2VMQoAMAgDa9/g/1/oIzrpZBCh2dLFkkoDF0Fz99OdiOjks+2/7S8fRRmMMIVoRGSoYzvvqF8ZIMKlC1GhQBc6IkPzq32QmdAzkEGihpWOSPsAss8HegYySNSw0hE9WQ4StafZFqkAAAAASUVORK5CYII=) 0% 0% / 26px',
+  light: 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAFpJREFUWAntljEKADAIA23p6v//qQ+wfUEcCu1yriEgp0FHRJSJcnehmmWm1Dv/lO4HIg1AAAKjTqm03ea88zMCCEDgO4HV5bS757f+7wRoAAIQ4B9gByAAgQ3pfiDmXmAeEwAAAABJRU5ErkJggg==) 0% 0% / 26px'
 };
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return {
-    view: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n  "]))),
-    scaleBox: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    cursor: pointer;\n\n    position: relative;\n\n    width: 48px;\n    height: 32px;\n\n    background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n    background-size: 16px 16px;\n\n    &:active {\n      transform: scale(0.95);\n    }\n  "]))),
-    scaleItem: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    width: 100%;\n    height: 100%;\n  "]))),
-    scaleRowTitle: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    width: 64px;\n    height: 32px;\n  "]))),
-    text: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    opacity: 0.5;\n  "])))
+    scaleBox: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    cursor: pointer;\n\n    position: relative;\n\n    width: 48px;\n    height: 32px;\n\n    background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n    background-size: 16px 16px;\n\n    &:active {\n      transform: scale(0.95);\n    }\n  "]))),
+    scaleItem: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    width: 100%;\n    height: 100%;\n  "]))),
+    scaleRowTitle: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    width: 64px;\n    height: 32px;\n  "]))),
+    text: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    opacity: 0.5;\n  "]))),
+    view: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n  "])))
   };
 });

package/es/ContextMenu/MenuItem/index.js

@@ -11,22 +11,22 @@ import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var KEYBOARD_ICON_MAP = {
-  meta: /*#__PURE__*/_jsx(CommandIcon, {}),
-  control: /*#__PURE__*/_jsx(ControlIcon, {}),
-  shift: /*#__PURE__*/_jsx(ShiftIcon, {}),
   alt: /*#__PURE__*/_jsx(AltIcon, {}),
-  enter: '↵'
+  control: /*#__PURE__*/_jsx(ControlIcon, {}),
+  enter: '↵',
+  meta: /*#__PURE__*/_jsx(CommandIcon, {}),
+  shift: /*#__PURE__*/_jsx(ShiftIcon, {})
 };
 var CODE_MAP = {
-  meta: 'meta',
-  command: 'meta',
+  alt: 'alt',
   cmd: 'meta',
-  ctl: 'control',
+  command: 'meta',
   control: 'control',
-  shift: 'shift',
-  alt: 'alt'
+  ctl: 'control',
+  meta: 'meta',
+  shift: 'shift'
 };
-var MenuItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
+var MenuItem = /*#__PURE__*/forwardRef(function (_ref, reference) {
   var _cx;
   var label = _ref.label,
     icon = _ref.icon,
@@ -35,16 +35,16 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
     shortcut = _ref.shortcut,
     active = _ref.active,
     selected = _ref.selected,
-    props = _objectWithoutProperties(_ref, _excluded);
+    properties = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
   return /*#__PURE__*/_jsxs("button", _objectSpread(_objectSpread({
     type: 'button'
-  }, props), {}, {
+  }, properties), {}, {
     className: cx(styles.item, (_cx = {}, _defineProperty(_cx, styles.selected, selected), _defineProperty(_cx, styles.active, active), _cx)),
     disabled: disabled,
-    ref: ref,
+    ref: reference,
     role: "menuitem",
     children: [/*#__PURE__*/_jsxs(Flexbox, {
       gap: 8,
@@ -67,7 +67,7 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
           children: code ? KEYBOARD_ICON_MAP[code] : c.toUpperCase()
         }, c);
       })
-    }) : null]
+    }) : undefined]
   }));
 });
 export default MenuItem;

package/es/ContextMenu/MenuItem/style.d.ts

@@ -1,7 +1,7 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    item: string;
-    selected: string;
     active: string;
     arrow: import("antd-style").SerializedStyles;
+    item: string;
     kbd: import("antd-style").SerializedStyles;
+    selected: string;
 }>;

package/es/ContextMenu/MenuItem/style.js

@@ -7,10 +7,10 @@ export var useStyles = createStyles(function (_ref, prefixCls) {
     token = _ref.token;
   var selected = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    font-weight: bold;\n    color: ", ";\n    background: ", ";\n\n    &:hover {\n      color: ", ";\n      background: ", ";\n    }\n  "])), token.colorPrimaryText, token.colorPrimaryBg, token.colorPrimaryTextHover, token.colorPrimaryBgHover);
   return {
-    item: cx("".concat(prefixCls, "-item"), css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        all: unset;\n\n        user-select: none;\n        scroll-margin: 50px;\n\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n\n        box-sizing: inherit;\n        width: 100%;\n        padding: 12px 10px;\n\n        font-family: ", ";\n        font-weight: normal;\n        line-height: 1;\n        color: ", ";\n\n        background: transparent;\n        border-radius: 5px;\n\n        &:hover {\n          background: ", ";\n        }\n      "])), token.fontFamily, token.colorText, token.colorFillTertiary)),
-    selected: cx("".concat(prefixCls, "-item-selected"), selected),
-    active: cx("".concat(prefixCls, "-item-active"), css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        background: ", ";\n      "])), token.colorFillTertiary)),
-    arrow: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      color: ", ";\n    "])), token.colorTextTertiary),
-    kbd: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      width: 18px;\n      height: 20px;\n\n      font-family: ", ";\n      font-size: 14px;\n      color: ", ";\n\n      border-radius: 2px;\n    "])), token.fontFamily, token.colorTextQuaternary)
+    active: cx("".concat(prefixCls, "-item-active"), css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        background: ", ";\n      "])), token.colorFillTertiary)),
+    arrow: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      color: ", ";\n    "])), token.colorTextTertiary),
+    item: cx("".concat(prefixCls, "-item"), css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        all: unset;\n\n        user-select: none;\n        scroll-margin: 50px;\n\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n\n        box-sizing: inherit;\n        width: 100%;\n        padding: 12px 10px;\n\n        font-family: ", ";\n        font-weight: normal;\n        line-height: 1;\n        color: ", ";\n\n        background: transparent;\n        border-radius: 5px;\n\n        &:hover {\n          background: ", ";\n        }\n      "])), token.fontFamily, token.colorText, token.colorFillTertiary)),
+    kbd: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      width: 18px;\n      height: 20px;\n\n      font-family: ", ";\n      font-size: 14px;\n      color: ", ";\n\n      border-radius: 2px;\n    "])), token.fontFamily, token.colorTextQuaternary),
+    selected: cx("".concat(prefixCls, "-item-selected"), selected)
   };
 });