@lobehub/ui 1.16.0 → 1.16.2

package/es/MessageInput/index.js

@@ -1,10 +1,12 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { TextArea } from "./..";
+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 } from 'antd';
 import { cx } from 'antd-style';
 import { memo, useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
+import { TextArea } from "./..";
 
 /**
  * @title MessageInputProps
@@ -29,16 +31,16 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
   return /*#__PURE__*/_jsxs(Flexbox, {
     gap: 8,
     children: [/*#__PURE__*/_jsx(TextArea, {
-      type: type,
-      value: tempSystemRole,
+      className: cx('nowheel', className),
+      onChange: function onChange(e) {
+        setRole(e.target.value);
+      },
       placeholder: '例如：你是一名擅长翻译的翻译官，请将用户所输入的英文都翻译为中文。',
       style: {
         height: height !== null && height !== void 0 ? height : 200
       },
-      onChange: function onChange(e) {
-        setRole(e.target.value);
-      },
-      className: cx('nowheel', className)
+      type: type,
+      value: tempSystemRole
     }), /*#__PURE__*/_jsx(Flexbox, {
       direction: 'horizontal-reverse',
       gap: 8,
@@ -46,14 +48,14 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
         return /*#__PURE__*/_jsx(Button, _objectSpread({}, buttonProps), index);
       }) : /*#__PURE__*/_jsxs(_Fragment, {
         children: [/*#__PURE__*/_jsx(Button, {
-          type: "primary",
           onClick: function onClick() {
             onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(tempSystemRole);
           },
+          type: "primary",
           children: "Confirm"
         }), /*#__PURE__*/_jsx(Button, {
-          type: "text",
           onClick: onCancel,
+          type: "text",
           children: "Cancel"
         })]
       })

package/es/MessageModal/index.d.ts

@@ -1,27 +1,27 @@
 /// <reference types="react" />
 export interface MessageModalProps {
-    /**
-     * @description Whether the modal is open or not
-     * @default false
-     */
-    open?: boolean;
-    /**
-     * @description Callback fired when open state is changed
-     */
-    onOpenChange?: (open: boolean) => void;
     /**
      * @description Whether the message is being edited or not
      * @default false
      */
     editing?: boolean;
+    /**
+     * @description Callback fired when message content is changed
+     */
+    onChange?: (text: string) => void;
     /**
      * @description Callback fired when editing state is changed
      */
     onEditingChange?: (editing: boolean) => void;
     /**
-     * @description Callback fired when message content is changed
+     * @description Callback fired when open state is changed
      */
-    onChange?: (text: string) => void;
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * @description Whether the modal is open or not
+     * @default false
+     */
+    open?: boolean;
     /**
      * @description The value of the message content
      */

package/es/MessageModal/index.js

@@ -1,11 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import Markdown from "../Markdown";
-import MessageInput from "../MessageInput";
 import { AimOutlined } from '@ant-design/icons';
 import { Modal } from 'antd';
 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 { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -33,34 +33,34 @@ var MessageModal = /*#__PURE__*/memo(function (_ref) {
     expand = _useControlledState4[0],
     setExpand = _useControlledState4[1];
   return /*#__PURE__*/_jsx(Modal, {
-    open: expand,
-    width: 800,
+    cancelText: '关闭',
+    className: styles.modal,
+    footer: isEdit ? null : undefined,
+    okText: '编辑',
     onCancel: function onCancel() {
       return setExpand(false);
     },
-    okText: '编辑',
     onOk: function onOk() {
       setTyping(true);
     },
-    footer: isEdit ? null : undefined,
-    cancelText: '关闭',
+    open: expand,
     title: /*#__PURE__*/_jsxs(Flexbox, {
-      horizontal: true,
       align: 'center',
       gap: 4,
+      horizontal: true,
       children: [/*#__PURE__*/_jsx(AimOutlined, {}), "\u63D0\u793A\u8BCD"]
     }),
-    className: styles.modal,
+    width: 800,
     children: isEdit ? /*#__PURE__*/_jsx(MessageInput, {
-      onConfirm: function onConfirm(text) {
-        setTyping(false);
-        onChange === null || onChange === void 0 ? void 0 : onChange(text);
-      },
+      defaultValue: value,
+      height: 400,
       onCancel: function onCancel() {
         return setTyping(false);
       },
-      defaultValue: value,
-      height: 400
+      onConfirm: function onConfirm(text) {
+        setTyping(false);
+        onChange === null || onChange === void 0 ? void 0 : onChange(text);
+      }
     }) : /*#__PURE__*/_jsx(Markdown, {
       className: styles.body,
       children: value

package/es/SearchBar/index.d.ts

@@ -1,16 +1,16 @@
 /// <reference types="react" />
 import { InputProps } from "../index";
 export interface SearchBarProps extends InputProps {
-    /**
-     * @description The shortcut key to focus on the input. Only works if `enableShortKey` is true
-     * @default 'f'
-     */
-    shortKey?: string;
     /**
      * @description Whether to enable the shortcut key to focus on the input
      * @default false
      */
     enableShortKey?: boolean;
+    /**
+     * @description The shortcut key to focus on the input. Only works if `enableShortKey` is true
+     * @default 'f'
+     */
+    shortKey?: string;
 }
 declare const SearchBar: import("react").NamedExoticComponent<SearchBarProps>;
 export default SearchBar;

package/es/SearchBar/index.js

@@ -1,12 +1,14 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "value", "onChange", "placeholder", "enableShortKey", "shortKey"];
 var _navigator;
-import { Icon, Input } from "./..";
+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 { Tag } from 'antd';
 import { Search } from 'lucide-react';
 import { memo, useEffect, useRef, useState } from 'react';
+import { Icon, Input } from "./..";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -50,19 +52,11 @@ var SearchBar = /*#__PURE__*/memo(function (_ref) {
   return /*#__PURE__*/_jsxs("div", {
     className: styles.search,
     children: [/*#__PURE__*/_jsx(Input, _objectSpread({
-      ref: inputRef,
-      className: cx(styles.input, className),
-      prefix: /*#__PURE__*/_jsx(Icon, {
-        className: styles.icon,
-        icon: Search,
-        size: "small",
-        style: {
-          marginRight: 4
-        }
-      }),
       allowClear: true,
-      value: value,
-      placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : 'Type keywords...',
+      className: cx(styles.input, className),
+      onBlur: function onBlur() {
+        return setShowTag(true);
+      },
       onChange: function onChange(e) {
         setInputValue(e.target.value);
         setShowTag(e.target.value ? false : true);
@@ -71,9 +65,17 @@ var SearchBar = /*#__PURE__*/memo(function (_ref) {
       onFocus: function onFocus() {
         return setShowTag(false);
       },
-      onBlur: function onBlur() {
-        return setShowTag(true);
-      }
+      placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : 'Type keywords...',
+      prefix: /*#__PURE__*/_jsx(Icon, {
+        className: styles.icon,
+        icon: Search,
+        size: "small",
+        style: {
+          marginRight: 4
+        }
+      }),
+      ref: inputRef,
+      value: value
     }, props)), enableShortKey && showTag && !inputValue && /*#__PURE__*/_jsxs(Tag, {
       className: styles.tag,
       children: [symbol, " ", shortKey.toUpperCase()]

package/es/SideNav/index.d.ts

@@ -1,18 +1,18 @@
-import { DivProps } from "../types";
 import { ReactNode } from 'react';
+import { DivProps } from "../types";
 export interface SideNavProps extends DivProps {
     /**
      * @description Avatar to be displayed at the top of the sidenav
      */
     avatar?: ReactNode;
-    /**
-     * @description Actions to be displayed below the avatar
-     */
-    topActions?: ReactNode;
     /**
      * @description Actions to be displayed at the bottom of the sidenav
      */
     bottomActions: ReactNode;
+    /**
+     * @description Actions to be displayed below the avatar
+     */
+    topActions?: ReactNode;
 }
 declare const SideNav: import("react").NamedExoticComponent<SideNavProps>;
 export default SideNav;

package/es/SideNav/index.js

@@ -1,6 +1,8 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "avatar", "topActions", "bottomActions"];
+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 { Space } from 'antd';
 import { memo } from 'react';
 import { useStyles } from "./style";
@@ -19,19 +21,19 @@ var SideNav = /*#__PURE__*/memo(function (_ref) {
     className: cx(styles, className)
   }, props), {}, {
     children: [/*#__PURE__*/_jsxs(Space, {
-      size: 16,
-      direction: "vertical",
       align: "center",
+      direction: "vertical",
+      size: 16,
       children: [avatar, /*#__PURE__*/_jsx(Space, {
-        size: 8,
-        direction: "vertical",
         align: "center",
+        direction: "vertical",
+        size: 8,
         children: topActions
       })]
     }), /*#__PURE__*/_jsx(Space, {
-      size: 4,
-      direction: "vertical",
       align: "center",
+      direction: "vertical",
+      size: 4,
       children: bottomActions
     })]
   }));

package/es/Snippet/index.d.ts

@@ -6,19 +6,19 @@ export interface SnippetProps extends DivProps {
      */
     children: string;
     /**
-     * @description The symbol to be displayed before the content inside the Snippet component
+     * @description Whether the Snippet component is copyable or not
+     * @default true
      */
-    symbol?: string;
+    copyable?: boolean;
     /**
      * @description The language of the content inside the Snippet component
      * @default 'tsx'
      */
     language?: string;
     /**
-     * @description Whether the Snippet component is copyable or not
-     * @default true
+     * @description The symbol to be displayed before the content inside the Snippet component
      */
-    copyable?: boolean;
+    symbol?: string;
     /**
      * @description The type of the Snippet component
      * @default 'ghost'

package/es/Snippet/index.js

@@ -1,6 +1,8 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["symbol", "language", "children", "copyable", "type"];
+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 CopyButton from "../CopyButton";
 import { SyntaxHighlighter } from "../Highlighter";
@@ -26,11 +28,11 @@ var Snippet = /*#__PURE__*/memo(function (_ref) {
       language: language,
       children: [symbol, children].filter(Boolean).join(' ')
     }), copyable && /*#__PURE__*/_jsx(CopyButton, {
+      content: children,
       size: {
         fontSize: 14,
         blockSize: 24
-      },
-      content: children
+      }
     })]
   }));
 });

package/es/StroyBook/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { DivProps } from "../types";
 import { useControls, useCreateStore } from 'leva';
-export { useCreateStore, useControls };
+import { DivProps } from "../types";
+export { useControls, useCreateStore };
 export interface StroyBookProps extends DivProps {
     /**
      * @description The Leva store instance to be used by the component

package/es/StroyBook/index.js

@@ -1,6 +1,8 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["levaStore", "noPadding", "className", "children"];
+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 { useResponsive } from 'antd-style';
 import { LevaPanel, useControls, useCreateStore } from 'leva';
 import { memo } from 'react';
@@ -8,7 +10,7 @@ import DraggablePanel from "../DraggablePanel";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-export { useCreateStore, useControls };
+export { useControls, useCreateStore };
 export var StroyBook = /*#__PURE__*/memo(function (_ref) {
   var levaStore = _ref.levaStore,
     noPadding = _ref.noPadding,
@@ -31,15 +33,15 @@ export var StroyBook = /*#__PURE__*/memo(function (_ref) {
       children: children
     }), /*#__PURE__*/_jsx(DraggablePanel, {
       className: styles.right,
-      placement: mobile ? 'bottom' : 'right',
       minWidth: 280,
+      placement: mobile ? 'bottom' : 'right',
       children: /*#__PURE__*/_jsxs("div", {
         className: styles.leva,
         children: [/*#__PURE__*/_jsx(LevaPanel, {
           fill: true,
+          flat: true,
           store: levaStore,
-          titleBar: false,
-          flat: true
+          titleBar: false
         }), ' ']
       })
     })]

package/es/StroyBook/style.d.ts

@@ -1,6 +1,6 @@
 export declare const useStyles: (props?: {
-    noPadding: boolean;
     mobile: boolean;
+    noPadding: boolean;
 } | undefined) => import("antd-style").ReturnStyles<{
     editor: import("antd-style").SerializedStyles;
     left: import("antd-style").SerializedStyles;

package/es/Swatches/index.d.ts

@@ -1,14 +1,14 @@
 /// <reference types="react" />
 export interface SwatchesProps {
-    /**
-     * @description An array of colors to be displayed as swatches
-     */
-    colors: string[];
     /**
      * @description The currently active color
      * @default undefined
      */
     activeColor?: string;
+    /**
+     * @description An array of colors to be displayed as swatches
+     */
+    colors: string[];
     /**
      * @description A function to be called when a swatch is selected
      * @default undefined

package/es/Swatches/index.js

@@ -9,9 +9,12 @@ var Swatches = /*#__PURE__*/memo(function (_ref) {
     onSelect = _ref.onSelect;
   var theme = useTheme();
   return /*#__PURE__*/_jsxs(Flexbox, {
-    horizontal: true,
     gap: 8,
+    horizontal: true,
     children: [/*#__PURE__*/_jsx(Flexbox, {
+      onClick: function onClick() {
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(null);
+      },
       style: {
         width: 24,
         height: 24,
@@ -19,13 +22,13 @@ var Swatches = /*#__PURE__*/memo(function (_ref) {
         boxShadow: "inset 0 0 0px 2px ".concat(!activeColor ? theme.colorPrimary : 'rgba(0,0,0,0.1)'),
         borderRadius: '50%',
         cursor: 'pointer'
-      },
-      onClick: function onClick() {
-        onSelect === null || onSelect === void 0 ? void 0 : onSelect(null);
       }
     }), colors.map(function (c) {
       var borderColor = c === activeColor ? theme.colorPrimary : 'rgba(0,0,0,0.1)';
       return /*#__PURE__*/_jsx(Flexbox, {
+        onClick: function onClick() {
+          onSelect === null || onSelect === void 0 ? void 0 : onSelect(c);
+        },
         style: {
           width: 24,
           height: 24,
@@ -33,9 +36,6 @@ var Swatches = /*#__PURE__*/memo(function (_ref) {
           boxShadow: "inset 0 0 0px 2px ".concat(borderColor),
           borderRadius: '50%',
           cursor: 'pointer'
-        },
-        onClick: function onClick() {
-          onSelect === null || onSelect === void 0 ? void 0 : onSelect(c);
         }
       }, c);
     })]

package/es/TabsNav/index.d.ts

@@ -2,21 +2,21 @@
 import { TabsProps } from 'antd';
 export interface TabsNavProps {
     /**
-     * @description Additional className to apply to the component
+     * @description The key of the active tab
      */
-    className?: string;
+    activeKey?: TabsProps['activeKey'];
     /**
-     * @description Callback function that is triggered when a tab is changed
+     * @description Additional className to apply to the component
      */
-    onChange?: (activeKey: string) => void;
+    className?: string;
     /**
      * @description An array of objects representing the tabs to be rendered
      */
     items?: TabsProps['items'];
     /**
-     * @description The key of the active tab
+     * @description Callback function that is triggered when a tab is changed
      */
-    activeKey?: TabsProps['activeKey'];
+    onChange?: (activeKey: string) => void;
 }
 declare const TabsNav: import("react").NamedExoticComponent<TabsNavProps>;
 export default TabsNav;

package/es/TabsNav/index.js

@@ -1,6 +1,8 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 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; }
 import { Tabs } from 'antd';
 import { memo } from 'react';
 import { useStyles } from "./style";

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\", \"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 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\t  box-sizing: border-box;\n\t  vertical-align: baseline;\n  }\n\n  ::-webkit-scrollbar {\n\t  width: 0;\n\t  height: 4px;\n\t  background-color: transparent;\n\n\t  &-thumb {\n\t\t  background-color: transparent;\n\t\t  border-radius: 4px;\n\t\t  transition: background-color 500ms ", ";\n\t  }\n\n\t  &-corner {\n\t\t  display: none;\n\t  }\n  }\n\n  #root {\n\t  min-height: 100vh;\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\n  *:hover, *:focus {\n\t  ::-webkit-scrollbar {\n\t\t  &-thumb {\n\t\t\t  background-color: ", ";\n\t\t  }\n\t  }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.fontFamily;
 }, function (_ref2) {
@@ -15,9 +15,12 @@ var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
   return theme.colorBgLayout;
 }, function (_ref5) {
   var theme = _ref5.theme;
-  return theme.colorFill;
+  return theme.motionEaseOut;
 }, function (_ref6) {
   var theme = _ref6.theme;
   return theme.fontFamilyCode;
+}, function (_ref7) {
+  var theme = _ref7.theme;
+  return theme.colorFill;
 });
 export default GlobalStyle;

package/es/ThemeProvider/index.d.ts

@@ -2,21 +2,21 @@
 import { extractStaticStyle, type ThemeMode } from 'antd-style';
 export interface ThemeProviderProps {
     /**
-     * @description The children of the ThemeProvider component
+     * @description Cache for the extracted static styles
      */
-    children: React.ReactNode;
+    cache?: typeof extractStaticStyle.cache;
     /**
-     * @description The mode of the theme (light or dark)
+     * @description The children of the ThemeProvider component
      */
-    themeMode?: ThemeMode;
+    children: React.ReactNode;
     /**
      * @description Whether to inline the styles on server-side rendering or not
      */
     ssrInline?: boolean;
     /**
-     * @description Cache for the extracted static styles
+     * @description The mode of the theme (light or dark)
      */
-    cache?: typeof extractStaticStyle.cache;
+    themeMode?: ThemeMode;
 }
 declare const ThemeProvider: import("react").NamedExoticComponent<ThemeProviderProps>;
 export default ThemeProvider;

package/es/ThemeProvider/index.js

@@ -1,10 +1,10 @@
-import { lobeCustomStylish, lobeCustomToken, lobeTheme } from "../styles";
 import { App } from 'antd';
 import { ThemeProvider as AntdThemeProvider, StyleProvider, setupStyled } from 'antd-style';
 import { memo } from 'react';
 // @ts-ignore
 import ReactFontLoader from 'react-font-loader';
 import { ThemeContext } from 'styled-components';
+import { lobeCustomStylish, lobeCustomToken, lobeTheme } from "../styles";
 import GlobalStyle from "./GlobalStyle";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -17,10 +17,10 @@ var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
   return /*#__PURE__*/_jsx(StyleProvider, {
     speedy: process.env.NODE_ENV === 'production',
     children: /*#__PURE__*/_jsxs(AntdThemeProvider, {
-      themeMode: themeMode,
-      theme: lobeTheme,
       customStylish: lobeCustomStylish,
       customToken: lobeCustomToken,
+      theme: lobeTheme,
+      themeMode: themeMode,
       children: [/*#__PURE__*/_jsx(ReactFontLoader, {
         url: "https://raw.githubusercontent.com/IKKI2000/harmonyos-fonts/main/css/harmonyos_sans.css"
       }), /*#__PURE__*/_jsx(ReactFontLoader, {

package/es/ThemeSwitch/index.d.ts

@@ -3,6 +3,11 @@ import { type ActionIconSize } from "..";
 import { ThemeMode } from 'antd-style';
 import { DivProps } from "../types";
 export interface ThemeSwitchProps extends DivProps {
+    /**
+     * @description Callback function when the theme mode is switched
+     * @type {(themeMode: ThemeMode) => void}
+     */
+    onThemeSwitch: (themeMode: ThemeMode) => void;
     /**
      * @description Size of the action icon
      * @default {
@@ -17,11 +22,6 @@ export interface ThemeSwitchProps extends DivProps {
      * @type ThemeMode
      */
     themeMode: ThemeMode;
-    /**
-     * @description Callback function when the theme mode is switched
-     * @type {(themeMode: ThemeMode) => void}
-     */
-    onThemeSwitch: (themeMode: ThemeMode) => void;
 }
 declare const ThemeSwitch: import("react").NamedExoticComponent<ThemeSwitchProps>;
 export default ThemeSwitch;