@agentscope-ai/design 1.0.7 → 1.0.9

package/lib/components/commonComponents/CollapsePanel/index.style.d.ts

@@ -1,287 +1 @@
-export declare function getIndexStyleData(params: any): {
-    [x: string]: {
-        [x: string]: string | {
-            cursor: string;
-            display?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            display: string;
-            justifyContent: string;
-            background: string;
-            height: string;
-            lineHeight: string;
-            borderRadius: string;
-            alignItems: string;
-            userSelect: string;
-            position: string;
-            cursor: string;
-            padding: string;
-            '.collapsible:hover &': {
-                background: string;
-            };
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            display: string;
-            alignItems: string;
-            justifyContent: string;
-            float: string;
-            cursor?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            color: string;
-            fontSize: string;
-            display: string;
-            cursor?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            display: string;
-            alignItems: string;
-            justifyContent: string;
-            marginLeft: string;
-            cursor?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            fontSize: string;
-            transition: string;
-            cursor?: undefined;
-            display?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            marginLeft?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            position: string;
-            borderRadius: string;
-            transition: string;
-            overflow: string;
-            cursor?: undefined;
-            display?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            '&.scrollable': {
-                height: string;
-                overflowY: string;
-                scrollbarWidth: string;
-                scrollbarColor: string;
-                '&::-webkit-scrollbar': {
-                    width: string;
-                };
-                '&::-webkit-scrollbar-track': {
-                    background: string;
-                };
-                '&::-webkit-scrollbar-thumb': {
-                    backgroundColor: string;
-                    borderRadius: string;
-                };
-                '&::-webkit-scrollbar-thumb:hover': {
-                    backgroundColor: string;
-                };
-            };
-            cursor?: undefined;
-            display?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        } | {
-            position: string;
-            bottom: number;
-            left: number;
-            right: number;
-            height: string;
-            background: string;
-            pointerEvents: string;
-            opacity: number;
-            transition: string;
-            cursor?: undefined;
-            display?: undefined;
-            justifyContent?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-        } | {
-            [x: string]: {
-                opacity: number;
-            };
-            cursor?: undefined;
-            display?: undefined;
-            justifyContent?: undefined;
-            background?: undefined;
-            height?: undefined;
-            lineHeight?: undefined;
-            borderRadius?: undefined;
-            alignItems?: undefined;
-            userSelect?: undefined;
-            position?: undefined;
-            padding?: undefined;
-            '.collapsible:hover &'?: undefined;
-            float?: undefined;
-            color?: undefined;
-            fontSize?: undefined;
-            marginLeft?: undefined;
-            transition?: undefined;
-            overflow?: undefined;
-            '&.scrollable'?: undefined;
-            bottom?: undefined;
-            left?: undefined;
-            right?: undefined;
-            pointerEvents?: undefined;
-            opacity?: undefined;
-        };
-        width: string;
-        borderRadius: string;
-        border: string;
-        transition: string;
-        '&.collapsible:not(.expanded)': {
-            cursor: string;
-        };
-    };
-};
-declare const useIndexStyle: (props?: {}) => import("../../../config").CommonConfig;
-export default useIndexStyle;
+export declare const useStyle: () => () => import("react/jsx-runtime").JSX.Element;

package/lib/components/commonComponents/CollapsePanel/index.style.js

@@ -1,97 +1,42 @@
-var _excluded = ["css"];
-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); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-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; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-import createStyle from "../../../libs/createStyle";
-export function getIndexStyleData(params) {
-  var antPrefix = params.antPrefix,
-    sparkPrefix = params.sparkPrefix;
-  return _defineProperty({}, ".".concat(sparkPrefix, "-collapse-panel"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
-    width: '100%',
-    borderRadius: '8px',
-    border: "1px solid var(--".concat(antPrefix, "-color-border-secondary)"),
-    transition: 'all 0.3s ease',
-    '&.collapsible:not(.expanded)': {
-      cursor: 'pointer'
-    }
-  }, ".".concat(sparkPrefix, "-collapse-panel-header"), {
-    display: 'flex',
-    justifyContent: 'space-between',
-    background: "var(--".concat(antPrefix, "-color-fill-secondary)"),
-    height: '32px',
-    lineHeight: '32px',
-    borderRadius: '7px 7px 0 0',
-    alignItems: 'center',
-    userSelect: 'none',
-    position: 'relative',
-    cursor: 'pointer',
-    padding: '0 12px',
-    '.collapsible:hover &': {
-      background: '#f0f2f3'
-    }
-  }), ".".concat(sparkPrefix, "-collapse-panel-extra"), {
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    float: 'right'
-  }), ".".concat(sparkPrefix, "-collapse-panel-title"), {
-    color: "var(--".concat(antPrefix, "-color-text)"),
-    fontSize: '14px',
-    display: 'flex'
-  }), ".".concat(sparkPrefix, "-collapse-panel-icon-wrapper"), {
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginLeft: '4px'
-  }), ".".concat(sparkPrefix, "-collapse-panel-icon"), {
-    fontSize: '18px',
-    transition: 'transform 0.3s ease'
-  }), ".".concat(sparkPrefix, "-collapse-panel-content"), {
-    position: 'relative',
-    borderRadius: '0 0 6px 6px',
-    transition: 'height 0.3s cubic-bezier(0.4, 0, 0.2, 1)',
-    overflow: 'hidden'
-  }), ".".concat(sparkPrefix, "-collapse-panel-contentWrapper"), {
-    '&.scrollable': {
-      height: '100%',
-      overflowY: 'auto',
-      scrollbarWidth: 'thin',
-      scrollbarColor: "var(--".concat(antPrefix, "-color-fill) transparent"),
-      '&::-webkit-scrollbar': {
-        width: '6px'
-      },
-      '&::-webkit-scrollbar-track': {
-        background: 'transparent'
-      },
-      '&::-webkit-scrollbar-thumb': {
-        backgroundColor: "var(--".concat(antPrefix, "-color-fill)"),
-        borderRadius: '3px'
-      },
-      '&::-webkit-scrollbar-thumb:hover': {
-        backgroundColor: "var(--".concat(antPrefix, "-color-fill)")
-      }
-    }
-  }), ".".concat(sparkPrefix, "-collapse-panel-mask"), {
-    position: 'absolute',
-    bottom: 0,
-    left: 0,
-    right: 0,
-    height: '60px',
-    background: "linear-gradient(\n            to bottom,\n            rgba(255, 255, 255, 0) 0%,\n            var(--".concat(antPrefix, "-color-bg-base) 100%\n        )"),
-    pointerEvents: 'none',
-    opacity: 1,
-    transition: 'opacity 0.3s ease'
-  }), ".".concat(sparkPrefix, "-collapse-panel-expanded"), _defineProperty({}, ".".concat(sparkPrefix, "-collapse-panel-mask"), {
-    opacity: 0
-  })));
-}
-var useIndexStyle = createStyle(function (_ref2) {
-  var css = _ref2.css,
-    params = _objectWithoutProperties(_ref2, _excluded);
-  var result = css(getIndexStyleData(params));
-  return result;
-});
-export default useIndexStyle;
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import createGlobalStyle from "../../../libs/newCreateStyle";
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-collapse-panel {\n  width: 100%;\n  border-radius: 8px;\n  border: 1px solid var(--", "-color-border-secondary);\n  transition: all 0.3s ease;\n  background-color: var(--", "-color-bg-base);\n  \n  &.collapsible:not(.expanded) {\n    cursor: pointer;\n  }\n  \n  .", "-collapse-panel-header {\n    display: flex;\n    justify-content: space-between;\n    background: var(--", "-color-fill-secondary);\n    height: 32px;\n    line-height: 32px;\n    border-radius: 7px 7px 0 0;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    cursor: pointer;\n    padding: 0 12px;\n    \n    .collapsible:hover & {\n      background: #f0f2f3;\n    }\n  }\n  \n  .", "-collapse-panel-extra {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    float: right;\n  }\n  \n  .", "-collapse-panel-title {\n    color: var(--", "-color-text);\n    font-size: 14px;\n    display: flex;\n  }\n  \n  .", "-collapse-panel-icon-wrapper {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    margin-left: 4px;\n  }\n  \n  .", "-collapse-panel-icon {\n    font-size: 18px;\n    transition: transform 0.3s ease;\n  }\n  \n  .", "-collapse-panel-content {\n    position: relative;\n    border-radius: 0 0 6px 6px;\n    transition: height 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n    overflow: hidden;\n  }\n  \n  .", "-collapse-panel-contentWrapper {\n    &.scrollable {\n      height: 100%;\n      overflow-y: auto;\n      scrollbar-width: thin;\n      scrollbar-color: var(--", "-color-fill) transparent;\n      \n      &::-webkit-scrollbar {\n        width: 6px;\n      }\n      \n      &::-webkit-scrollbar-track {\n        background: transparent;\n      }\n      \n      &::-webkit-scrollbar-thumb {\n        background-color: var(--", "-color-fill);\n        border-radius: 3px;\n      }\n      \n      &::-webkit-scrollbar-thumb:hover {\n        background-color: var(--", "-color-fill);\n      }\n    }\n  }\n  \n  .", "-collapse-panel-mask {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 60px;\n    background: linear-gradient(\n      to bottom,\n      rgba(255, 255, 255, 0) 0%,\n      var(--", "-color-bg-base) 100%\n    );\n    pointer-events: none;\n    opacity: 1;\n    transition: opacity 0.3s ease;\n  }\n  \n  .", "-collapse-panel-expanded {\n    .", "-collapse-panel-mask {\n      opacity: 0;\n    }\n  }\n}\n"])), function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+}, function (p) {
+  return p.sparkPrefix;
+});

package/lib/components/commonComponents/ConfigProvider/index.js

@@ -13,6 +13,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useIndexStyle } from "../../../antd/styles/index.style";
 import $i18n from "../../../i18n";
 import { App, ConfigProvider, message, theme } from 'antd';
 import { ConfigContext } from 'antd/es/config-provider/context';
@@ -20,12 +21,14 @@ import useTheme from 'antd/es/config-provider/hooks/useTheme';
 import classNames from 'classnames';
 import { useContext, useLayoutEffect, useMemo, useState } from 'react';
 import { DEFAULT_SPARK_PREFIX, getCommonConfig, setCommonConfig } from "../../../config";
-import useSparkStyle from "../spark.style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-function SparkGlobalStyle(props) {
-  useSparkStyle(props);
-  return null;
+function SparkGlobalStyle() {
+  // 使用统一的全局样式（包含 antd 样式 + 滚动条 + 动画）
+  var GlobalStyle = useIndexStyle();
+
+  // 直接渲染，让 CSS-in-JS 库处理去重和性能优化
+  return /*#__PURE__*/_jsx(GlobalStyle, {});
 }
 var empty = {};
 function SparkConfigProvider(props) {
@@ -132,10 +135,7 @@ function SparkConfigProvider(props) {
     wave: {
       disabled: true
     },
-    children: [/*#__PURE__*/_jsx(SparkGlobalStyle, {
-      antPrefix: antPrefix,
-      sparkPrefix: sparkPrefix
-    }), /*#__PURE__*/_jsx(App, {
+    children: [/*#__PURE__*/_jsx(SparkGlobalStyle, {}), /*#__PURE__*/_jsx(App, {
       className: classNames("spark", props.className),
       style: _objectSpread({}, props.style),
       children: hasInit ? children : null
@@ -147,5 +147,8 @@ SparkConfigProvider.config = function (props) {
   ConfigProvider.config(props);
 };
 SparkConfigProvider.useConfig = ConfigProvider.useConfig;
+
+// CSS-in-JS 库自动处理样式去重和性能优化，不需要手动管理
+
 export * from 'antd/lib/config-provider';
 export default SparkConfigProvider;

package/lib/components/commonComponents/DatePicker/index.js

@@ -13,8 +13,10 @@ import { SparkDateLine } from '@agentscope-ai/icons';
 import { DatePicker as AntdDatePicker, ConfigProvider, theme } from 'antd';
 import classNames from 'classnames';
 import React from 'react';
-import useIndexStyle from "./index.style";
+import { useStyle } from "./index.style";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var DatePicker = function DatePicker(props) {
   var className = props.className,
     popupClassName = props.popupClassName,
@@ -23,25 +25,27 @@ var DatePicker = function DatePicker(props) {
     token = _theme$useToken.token;
   var commonConfig = getCommonConfig();
   var sparkPrefix = commonConfig.sparkPrefix;
-  useIndexStyle();
-  return /*#__PURE__*/_jsx(ConfigProvider, {
-    theme: {
-      components: {
-        DatePicker: {
-          activeBorderColor: token.colorPrimary,
-          paddingInline: 8
+  var Style = useStyle();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(ConfigProvider, {
+      theme: {
+        components: {
+          DatePicker: {
+            activeBorderColor: token.colorPrimary,
+            paddingInline: 8
+          }
         }
-      }
-    },
-    children: /*#__PURE__*/_jsx(AntdDatePicker, _objectSpread({
-      suffixIcon: /*#__PURE__*/_jsx(SparkDateLine, {
-        style: {
-          fontSize: '20px'
-        }
-      }),
-      className: classNames("".concat(sparkPrefix, "-picker"), className),
-      popupClassName: classNames("".concat(sparkPrefix, "-picker-dropdown"), popupClassName)
-    }, restProps))
+      },
+      children: /*#__PURE__*/_jsx(AntdDatePicker, _objectSpread({
+        suffixIcon: /*#__PURE__*/_jsx(SparkDateLine, {
+          style: {
+            fontSize: '20px'
+          }
+        }),
+        className: classNames("".concat(sparkPrefix, "-picker"), className),
+        popupClassName: classNames("".concat(sparkPrefix, "-picker-dropdown"), popupClassName)
+      }, restProps))
+    })]
   });
 };
 var RangePicker = function RangePicker(props) {
@@ -52,28 +56,30 @@ var RangePicker = function RangePicker(props) {
     token = _theme$useToken2.token;
   var commonConfig = getCommonConfig();
   var sparkPrefix = commonConfig.sparkPrefix;
-  useIndexStyle();
-  return /*#__PURE__*/_jsx(ConfigProvider, {
-    theme: {
-      components: {
-        DatePicker: {
-          activeBorderColor: token.colorPrimary,
-          paddingInline: 8
+  var Style = useStyle();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(ConfigProvider, {
+      theme: {
+        components: {
+          DatePicker: {
+            activeBorderColor: token.colorPrimary,
+            paddingInline: 8
+          }
         }
-      }
-    },
-    children: /*#__PURE__*/_jsx(AntdDatePicker.RangePicker, _objectSpread({
-      suffixIcon: /*#__PURE__*/_jsx(SparkDateLine, {
-        style: {
-          fontSize: '20px'
+      },
+      children: /*#__PURE__*/_jsx(AntdDatePicker.RangePicker, _objectSpread({
+        suffixIcon: /*#__PURE__*/_jsx(SparkDateLine, {
+          style: {
+            fontSize: '20px'
+          }
+        }),
+        className: classNames("".concat(sparkPrefix, "-picker"), className),
+        popupClassName: classNames("".concat(sparkPrefix, "-picker-dropdown"), popupClassName),
+        popupStyle: {
+          padding: 0
         }
-      }),
-      className: classNames("".concat(sparkPrefix, "-picker"), className),
-      popupClassName: classNames("".concat(sparkPrefix, "-picker-dropdown"), popupClassName),
-      popupStyle: {
-        padding: 0
-      }
-    }, restProps))
+      }, restProps))
+    })]
   });
 };
 DatePicker.RangePicker = RangePicker;