UNPKG

antd

Version:

An enterprise-class UI design language and React components implementation

1,302 lines (1,232 loc) 4.57 MB
/*! * * antd v5.24.5 * * Copyright 2015-present, Alipay, Inc. * All rights reserved. * */ (function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require("react"), require("react-dom"), require("dayjs")); else if(typeof define === 'function' && define.amd) define(["react", "react-dom", "dayjs"], factory); else if(typeof exports === 'object') exports["antd"] = factory(require("react"), require("react-dom"), require("dayjs")); else root["antd"] = factory(root["React"], root["ReactDOM"], root["dayjs"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_react__, __WEBPACK_EXTERNAL_MODULE_react_dom__, __WEBPACK_EXTERNAL_MODULE_dayjs__) { return /******/ (function() { // webpackBootstrap /******/ var __webpack_modules__ = ({ /***/ "./alias/cssinjs.js": /*!**************************!*\ !*** ./alias/cssinjs.js ***! \**************************/ /***/ (function(module, __unused_webpack_exports, __webpack_require__) { /* eslint-disable no-restricted-globals */ // This is a alias proxy, which will use global `@ant-design/cssinjs` first. // Use local if global not found. let cssinjs; if (typeof window !== 'undefined' && window.antdCssinjs) { // Use window UMD version cssinjs = window.antdCssinjs; } else if (typeof __webpack_require__.g !== 'undefined' && __webpack_require__.g.antdCssinjs) { // Use global UMD version cssinjs = __webpack_require__.g.antdCssinjs; } else { // Use local version. // Use relative path since webpack will also replace module here. // eslint-disable-next-line antfu/no-import-node-modules-by-path cssinjs = __webpack_require__(/*! ../node_modules/@ant-design/cssinjs */ "./node_modules/@ant-design/cssinjs/es/index.js"); } module.exports = cssinjs; /***/ }), /***/ "./components sync recursive ^\\.\\/[^_][\\w-]+\\/style\\/index\\.tsx?$": /*!***************************************************************!*\ !*** ./components/ sync ^\.\/[^_][\w-]+\/style\/index\.tsx?$ ***! \***************************************************************/ /***/ (function(module, __unused_webpack_exports, __webpack_require__) { var map = { "./affix/style/index.ts": "./components/affix/style/index.ts", "./alert/style/index.ts": "./components/alert/style/index.ts", "./anchor/style/index.ts": "./components/anchor/style/index.ts", "./app/style/index.ts": "./components/app/style/index.ts", "./avatar/style/index.ts": "./components/avatar/style/index.ts", "./back-top/style/index.ts": "./components/back-top/style/index.ts", "./badge/style/index.ts": "./components/badge/style/index.ts", "./breadcrumb/style/index.ts": "./components/breadcrumb/style/index.ts", "./button/style/index.ts": "./components/button/style/index.ts", "./calendar/style/index.ts": "./components/calendar/style/index.ts", "./card/style/index.ts": "./components/card/style/index.ts", "./carousel/style/index.ts": "./components/carousel/style/index.ts", "./cascader/style/index.ts": "./components/cascader/style/index.ts", "./checkbox/style/index.ts": "./components/checkbox/style/index.ts", "./col/style/index.ts": "./components/col/style/index.ts", "./collapse/style/index.ts": "./components/collapse/style/index.ts", "./color-picker/style/index.ts": "./components/color-picker/style/index.ts", "./config-provider/style/index.ts": "./components/config-provider/style/index.ts", "./date-picker/style/index.ts": "./components/date-picker/style/index.ts", "./descriptions/style/index.ts": "./components/descriptions/style/index.ts", "./divider/style/index.ts": "./components/divider/style/index.ts", "./drawer/style/index.ts": "./components/drawer/style/index.ts", "./dropdown/style/index.ts": "./components/dropdown/style/index.ts", "./empty/style/index.ts": "./components/empty/style/index.ts", "./flex/style/index.ts": "./components/flex/style/index.ts", "./float-button/style/index.ts": "./components/float-button/style/index.ts", "./form/style/index.ts": "./components/form/style/index.ts", "./grid/style/index.ts": "./components/grid/style/index.ts", "./image/style/index.ts": "./components/image/style/index.ts", "./input-number/style/index.ts": "./components/input-number/style/index.ts", "./input/style/index.ts": "./components/input/style/index.ts", "./layout/style/index.ts": "./components/layout/style/index.ts", "./list/style/index.ts": "./components/list/style/index.ts", "./mentions/style/index.ts": "./components/mentions/style/index.ts", "./menu/style/index.ts": "./components/menu/style/index.ts", "./message/style/index.ts": "./components/message/style/index.ts", "./modal/style/index.ts": "./components/modal/style/index.ts", "./notification/style/index.ts": "./components/notification/style/index.ts", "./pagination/style/index.ts": "./components/pagination/style/index.ts", "./popconfirm/style/index.ts": "./components/popconfirm/style/index.ts", "./popover/style/index.ts": "./components/popover/style/index.ts", "./progress/style/index.ts": "./components/progress/style/index.ts", "./qr-code/style/index.ts": "./components/qr-code/style/index.ts", "./qrcode/style/index.ts": "./components/qrcode/style/index.ts", "./radio/style/index.ts": "./components/radio/style/index.ts", "./rate/style/index.ts": "./components/rate/style/index.ts", "./result/style/index.ts": "./components/result/style/index.ts", "./row/style/index.ts": "./components/row/style/index.ts", "./segmented/style/index.ts": "./components/segmented/style/index.ts", "./select/style/index.ts": "./components/select/style/index.ts", "./skeleton/style/index.ts": "./components/skeleton/style/index.ts", "./slider/style/index.ts": "./components/slider/style/index.ts", "./space/style/index.ts": "./components/space/style/index.ts", "./spin/style/index.ts": "./components/spin/style/index.ts", "./splitter/style/index.ts": "./components/splitter/style/index.ts", "./statistic/style/index.ts": "./components/statistic/style/index.ts", "./steps/style/index.ts": "./components/steps/style/index.ts", "./switch/style/index.ts": "./components/switch/style/index.ts", "./table/style/index.ts": "./components/table/style/index.ts", "./tabs/style/index.ts": "./components/tabs/style/index.ts", "./tag/style/index.ts": "./components/tag/style/index.ts", "./timeline/style/index.ts": "./components/timeline/style/index.ts", "./tooltip/style/index.ts": "./components/tooltip/style/index.ts", "./tour/style/index.ts": "./components/tour/style/index.ts", "./transfer/style/index.ts": "./components/transfer/style/index.ts", "./tree-select/style/index.ts": "./components/tree-select/style/index.ts", "./tree/style/index.ts": "./components/tree/style/index.ts", "./typography/style/index.ts": "./components/typography/style/index.ts", "./upload/style/index.ts": "./components/upload/style/index.ts" }; function webpackContext(req) { var id = webpackContextResolve(req); return __webpack_require__(id); } function webpackContextResolve(req) { if(!__webpack_require__.o(map, req)) { var e = new Error("Cannot find module '" + req + "'"); e.code = 'MODULE_NOT_FOUND'; throw e; } return map[req]; } webpackContext.keys = function webpackContextKeys() { return Object.keys(map); }; webpackContext.resolve = webpackContextResolve; module.exports = webpackContext; webpackContext.id = "./components sync recursive ^\\.\\/[^_][\\w-]+\\/style\\/index\\.tsx?$"; /***/ }), /***/ "./components/_util/hooks/useZIndex.ts": /*!*********************************************!*\ !*** ./components/_util/hooks/useZIndex.ts ***! \*********************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ CONTAINER_MAX_OFFSET: function() { return /* binding */ CONTAINER_MAX_OFFSET; }, /* harmony export */ useZIndex: function() { return /* binding */ useZIndex; } /* harmony export */ }); /* unused harmony exports containerBaseZIndexOffset, consumerBaseZIndexOffset */ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _theme_useToken__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../theme/useToken */ "./components/theme/useToken.ts"); /* harmony import */ var _warning__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../warning */ "./components/_util/warning.ts"); /* harmony import */ var _zindexContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../zindexContext */ "./components/_util/zindexContext.ts"); // Z-Index control range // Container: 1000 + offset 100 (max base + 10 * offset = 2000) // Popover: offset 50 // Notification: Container Max zIndex + componentOffset const CONTAINER_OFFSET = 100; const CONTAINER_OFFSET_MAX_COUNT = 10; const CONTAINER_MAX_OFFSET = CONTAINER_OFFSET * CONTAINER_OFFSET_MAX_COUNT; /** * Static function will default be the `CONTAINER_MAX_OFFSET`. * But it still may have children component like Select, Dropdown. * So the warning zIndex should exceed the `CONTAINER_MAX_OFFSET`. */ const CONTAINER_MAX_OFFSET_WITH_CHILDREN = CONTAINER_MAX_OFFSET + CONTAINER_OFFSET; const containerBaseZIndexOffset = { Modal: CONTAINER_OFFSET, Drawer: CONTAINER_OFFSET, Popover: CONTAINER_OFFSET, Popconfirm: CONTAINER_OFFSET, Tooltip: CONTAINER_OFFSET, Tour: CONTAINER_OFFSET, FloatButton: CONTAINER_OFFSET }; const consumerBaseZIndexOffset = { SelectLike: 50, Dropdown: 50, DatePicker: 50, Menu: 50, ImagePreview: 1 }; function isContainerType(type) { return type in containerBaseZIndexOffset; } const useZIndex = (componentType, customZIndex) => { const [, token] = (0,_theme_useToken__WEBPACK_IMPORTED_MODULE_1__["default"])(); const parentZIndex = react__WEBPACK_IMPORTED_MODULE_0___default().useContext(_zindexContext__WEBPACK_IMPORTED_MODULE_2__["default"]); const isContainer = isContainerType(componentType); let result; if (customZIndex !== undefined) { result = [customZIndex, customZIndex]; } else { let zIndex = parentZIndex !== null && parentZIndex !== void 0 ? parentZIndex : 0; if (isContainer) { zIndex += // Use preset token zIndex by default but not stack when has parent container (parentZIndex ? 0 : token.zIndexPopupBase) + // Container offset containerBaseZIndexOffset[componentType]; } else { zIndex += consumerBaseZIndexOffset[componentType]; } result = [parentZIndex === undefined ? customZIndex : zIndex, zIndex]; } if (true) { const warning = (0,_warning__WEBPACK_IMPORTED_MODULE_3__.devUseWarning)(componentType); const maxZIndex = token.zIndexPopupBase + CONTAINER_MAX_OFFSET_WITH_CHILDREN; const currentZIndex = result[0] || 0; true ? warning(customZIndex !== undefined || currentZIndex <= maxZIndex, 'usage', '`zIndex` is over design token `zIndexPopupBase` too much. It may cause unexpected override.') : 0; } return result; }; /***/ }), /***/ "./components/_util/motion.ts": /*!************************************!*\ !*** ./components/_util/motion.ts ***! \************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ getTransitionName: function() { return /* binding */ getTransitionName; } /* harmony export */ }); /* harmony import */ var _config_provider__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../config-provider */ "./components/config-provider/context.ts"); // ================== Collapse Motion ================== const getCollapsedHeight = () => ({ height: 0, opacity: 0 }); const getRealHeight = node => { const { scrollHeight } = node; return { height: scrollHeight, opacity: 1 }; }; const getCurrentHeight = node => ({ height: node ? node.offsetHeight : 0 }); const skipOpacityTransition = (_, event) => (event === null || event === void 0 ? void 0 : event.deadline) === true || event.propertyName === 'height'; const initCollapseMotion = function () { let rootCls = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _config_provider__WEBPACK_IMPORTED_MODULE_0__.defaultPrefixCls; return { motionName: `${rootCls}-motion-collapse`, onAppearStart: getCollapsedHeight, onEnterStart: getCollapsedHeight, onAppearActive: getRealHeight, onEnterActive: getRealHeight, onLeaveStart: getCurrentHeight, onLeaveActive: getCollapsedHeight, onAppearEnd: skipOpacityTransition, onEnterEnd: skipOpacityTransition, onLeaveEnd: skipOpacityTransition, motionDeadline: 500 }; }; const _SelectPlacements = ['bottomLeft', 'bottomRight', 'topLeft', 'topRight']; const getTransitionName = (rootPrefixCls, motion, transitionName) => { if (transitionName !== undefined) { return transitionName; } return `${rootPrefixCls}-${motion}`; }; /* harmony default export */ __webpack_exports__["default"] = (initCollapseMotion); /***/ }), /***/ "./components/_util/reactNode.ts": /*!***************************************!*\ !*** ./components/_util/reactNode.ts ***! \***************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ cloneElement: function() { return /* binding */ cloneElement; }, /* harmony export */ isFragment: function() { return /* binding */ isFragment; }, /* harmony export */ replaceElement: function() { return /* binding */ replaceElement; } /* harmony export */ }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); function isFragment(child) { return child && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().isValidElement(child) && child.type === (react__WEBPACK_IMPORTED_MODULE_0___default().Fragment); } const replaceElement = (element, replacement, props) => { if (! /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().isValidElement(element)) { return replacement; } return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().cloneElement(element, typeof props === 'function' ? props(element.props || {}) : props); }; function cloneElement(element, props) { return replaceElement(element, element, props); } /***/ }), /***/ "./components/_util/warning.ts": /*!*************************************!*\ !*** ./components/_util/warning.ts ***! \*************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ WarningContext: function() { return /* binding */ WarningContext; }, /* harmony export */ devUseWarning: function() { return /* binding */ devUseWarning; } /* harmony export */ }); /* unused harmony exports noop, resetWarned */ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js"); function noop() {} let deprecatedWarnList = null; function resetWarned() { deprecatedWarnList = null; (0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_1__.resetWarned)(); } // eslint-disable-next-line import/no-mutable-exports let warning = noop; if (true) { warning = (valid, component, message) => { (0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_1__["default"])(valid, `[antd: ${component}] ${message}`); // StrictMode will inject console which will not throw warning in React 17. if (false) {} }; } const WarningContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext({}); /** * This is a hook but we not named as `useWarning` * since this is only used in development. * We should always wrap this in `if (process.env.NODE_ENV !== 'production')` condition */ const devUseWarning = true ? component => { const { strict } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(WarningContext); const typeWarning = (valid, type, message) => { if (!valid) { if (strict === false && type === 'deprecated') { const existWarning = deprecatedWarnList; if (!deprecatedWarnList) { deprecatedWarnList = {}; } deprecatedWarnList[component] = deprecatedWarnList[component] || []; if (!deprecatedWarnList[component].includes(message || '')) { deprecatedWarnList[component].push(message || ''); } // Warning for the first time if (!existWarning) { console.warn('[antd] There exists deprecated usage in your code:', deprecatedWarnList); } } else { true ? warning(valid, component, message) : 0; } } }; typeWarning.deprecated = (valid, oldProp, newProp, message) => { typeWarning(valid, 'deprecated', `\`${oldProp}\` is deprecated. Please use \`${newProp}\` instead.${message ? ` ${message}` : ''}`); }; return typeWarning; } : 0; /* harmony default export */ __webpack_exports__["default"] = (warning); /***/ }), /***/ "./components/_util/zindexContext.ts": /*!*******************************************!*\ !*** ./components/_util/zindexContext.ts ***! \*******************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); const zIndexContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createContext(undefined); if (true) { zIndexContext.displayName = 'zIndexContext'; } /* harmony default export */ __webpack_exports__["default"] = (zIndexContext); /***/ }), /***/ "./components/affix/style/index.ts": /*!*****************************************!*\ !*** ./components/affix/style/index.ts ***! \*****************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); // ============================== Shared ============================== const genSharedAffixStyle = token => { const { componentCls } = token; return { [componentCls]: { position: 'fixed', zIndex: token.zIndexPopup } }; }; const prepareComponentToken = token => ({ zIndexPopup: token.zIndexBase + 10 }); // ============================== Export ============================== /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_0__.genStyleHooks)('Affix', genSharedAffixStyle, prepareComponentToken)); /***/ }), /***/ "./components/alert/style/index.ts": /*!*****************************************!*\ !*** ./components/alert/style/index.ts ***! \*****************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ genActionStyle: function() { return /* binding */ genActionStyle; }, /* harmony export */ genBaseStyle: function() { return /* binding */ genBaseStyle; }, /* harmony export */ genTypeStyle: function() { return /* binding */ genTypeStyle; }, /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @ant-design/cssinjs */ "./alias/cssinjs.js"); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../style */ "./components/style/index.tsx"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); const genAlertTypeStyle = (bgColor, borderColor, iconColor, token, alertCls) => ({ background: bgColor, border: `${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(token.lineWidth)} ${token.lineType} ${borderColor}`, [`${alertCls}-icon`]: { color: iconColor } }); const genBaseStyle = token => { const { componentCls, motionDurationSlow: duration, marginXS, marginSM, fontSize, fontSizeLG, lineHeight, borderRadiusLG: borderRadius, motionEaseInOutCirc, withDescriptionIconSize, colorText, colorTextHeading, withDescriptionPadding, defaultPadding } = token; return { [componentCls]: Object.assign(Object.assign({}, (0,_style__WEBPACK_IMPORTED_MODULE_1__.resetComponent)(token)), { position: 'relative', display: 'flex', alignItems: 'center', padding: defaultPadding, wordWrap: 'break-word', borderRadius, [`&${componentCls}-rtl`]: { direction: 'rtl' }, [`${componentCls}-content`]: { flex: 1, minWidth: 0 }, [`${componentCls}-icon`]: { marginInlineEnd: marginXS, lineHeight: 0 }, '&-description': { display: 'none', fontSize, lineHeight }, '&-message': { color: colorTextHeading }, [`&${componentCls}-motion-leave`]: { overflow: 'hidden', opacity: 1, transition: `max-height ${duration} ${motionEaseInOutCirc}, opacity ${duration} ${motionEaseInOutCirc}, padding-top ${duration} ${motionEaseInOutCirc}, padding-bottom ${duration} ${motionEaseInOutCirc}, margin-bottom ${duration} ${motionEaseInOutCirc}` }, [`&${componentCls}-motion-leave-active`]: { maxHeight: 0, marginBottom: '0 !important', paddingTop: 0, paddingBottom: 0, opacity: 0 } }), [`${componentCls}-with-description`]: { alignItems: 'flex-start', padding: withDescriptionPadding, [`${componentCls}-icon`]: { marginInlineEnd: marginSM, fontSize: withDescriptionIconSize, lineHeight: 0 }, [`${componentCls}-message`]: { display: 'block', marginBottom: marginXS, color: colorTextHeading, fontSize: fontSizeLG }, [`${componentCls}-description`]: { display: 'block', color: colorText } }, [`${componentCls}-banner`]: { marginBottom: 0, border: '0 !important', borderRadius: 0 } }; }; const genTypeStyle = token => { const { componentCls, colorSuccess, colorSuccessBorder, colorSuccessBg, colorWarning, colorWarningBorder, colorWarningBg, colorError, colorErrorBorder, colorErrorBg, colorInfo, colorInfoBorder, colorInfoBg } = token; return { [componentCls]: { '&-success': genAlertTypeStyle(colorSuccessBg, colorSuccessBorder, colorSuccess, token, componentCls), '&-info': genAlertTypeStyle(colorInfoBg, colorInfoBorder, colorInfo, token, componentCls), '&-warning': genAlertTypeStyle(colorWarningBg, colorWarningBorder, colorWarning, token, componentCls), '&-error': Object.assign(Object.assign({}, genAlertTypeStyle(colorErrorBg, colorErrorBorder, colorError, token, componentCls)), { [`${componentCls}-description > pre`]: { margin: 0, padding: 0 } }) } }; }; const genActionStyle = token => { const { componentCls, iconCls, motionDurationMid, marginXS, fontSizeIcon, colorIcon, colorIconHover } = token; return { [componentCls]: { '&-action': { marginInlineStart: marginXS }, [`${componentCls}-close-icon`]: { marginInlineStart: marginXS, padding: 0, overflow: 'hidden', fontSize: fontSizeIcon, lineHeight: (0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(fontSizeIcon), backgroundColor: 'transparent', border: 'none', outline: 'none', cursor: 'pointer', [`${iconCls}-close`]: { color: colorIcon, transition: `color ${motionDurationMid}`, '&:hover': { color: colorIconHover } } }, '&-close-text': { color: colorIcon, transition: `color ${motionDurationMid}`, '&:hover': { color: colorIconHover } } } }; }; const prepareComponentToken = token => { const paddingHorizontal = 12; // Fixed value here. return { withDescriptionIconSize: token.fontSizeHeading3, defaultPadding: `${token.paddingContentVerticalSM}px ${paddingHorizontal}px`, withDescriptionPadding: `${token.paddingMD}px ${token.paddingContentHorizontalLG}px` }; }; /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_2__.genStyleHooks)('Alert', token => [genBaseStyle(token), genTypeStyle(token), genActionStyle(token)], prepareComponentToken)); /***/ }), /***/ "./components/anchor/style/index.ts": /*!******************************************!*\ !*** ./components/anchor/style/index.ts ***! \******************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @ant-design/cssinjs */ "./alias/cssinjs.js"); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../style */ "./components/style/index.tsx"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../theme/internal */ "./node_modules/@ant-design/cssinjs-utils/es/index.js"); // ============================== Shared ============================== const genSharedAnchorStyle = token => { const { componentCls, holderOffsetBlock, motionDurationSlow, lineWidthBold, colorPrimary, lineType, colorSplit, calc } = token; return { [`${componentCls}-wrapper`]: { marginBlockStart: calc(holderOffsetBlock).mul(-1).equal(), paddingBlockStart: holderOffsetBlock, // delete overflow: auto // overflow: 'auto', [componentCls]: Object.assign(Object.assign({}, (0,_style__WEBPACK_IMPORTED_MODULE_0__.resetComponent)(token)), { position: 'relative', paddingInlineStart: lineWidthBold, [`${componentCls}-link`]: { paddingBlock: token.linkPaddingBlock, paddingInline: `${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(token.linkPaddingInlineStart)} 0`, '&-title': Object.assign(Object.assign({}, _style__WEBPACK_IMPORTED_MODULE_0__.textEllipsis), { position: 'relative', display: 'block', marginBlockEnd: token.anchorTitleBlock, color: token.colorText, transition: `all ${token.motionDurationSlow}`, '&:only-child': { marginBlockEnd: 0 } }), [`&-active > ${componentCls}-link-title`]: { color: token.colorPrimary }, // link link [`${componentCls}-link`]: { paddingBlock: token.anchorPaddingBlockSecondary } } }), [`&:not(${componentCls}-wrapper-horizontal)`]: { [componentCls]: { '&::before': { position: 'absolute', insetInlineStart: 0, top: 0, height: '100%', borderInlineStart: `${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(lineWidthBold)} ${lineType} ${colorSplit}`, content: '" "' }, [`${componentCls}-ink`]: { position: 'absolute', insetInlineStart: 0, display: 'none', transform: 'translateY(-50%)', transition: `top ${motionDurationSlow} ease-in-out`, width: lineWidthBold, backgroundColor: colorPrimary, [`&${componentCls}-ink-visible`]: { display: 'inline-block' } } } }, [`${componentCls}-fixed ${componentCls}-ink ${componentCls}-ink`]: { display: 'none' } } }; }; const genSharedAnchorHorizontalStyle = token => { const { componentCls, motionDurationSlow, lineWidthBold, colorPrimary } = token; return { [`${componentCls}-wrapper-horizontal`]: { position: 'relative', '&::before': { position: 'absolute', left: { _skip_check_: true, value: 0 }, right: { _skip_check_: true, value: 0 }, bottom: 0, borderBottom: `${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(token.lineWidth)} ${token.lineType} ${token.colorSplit}`, content: '" "' }, [componentCls]: { overflowX: 'scroll', position: 'relative', display: 'flex', scrollbarWidth: 'none' /* Firefox */, '&::-webkit-scrollbar': { display: 'none' /* Safari and Chrome */ }, [`${componentCls}-link:first-of-type`]: { paddingInline: 0 }, [`${componentCls}-ink`]: { position: 'absolute', bottom: 0, transition: `left ${motionDurationSlow} ease-in-out, width ${motionDurationSlow} ease-in-out`, height: lineWidthBold, backgroundColor: colorPrimary } } } }; }; const prepareComponentToken = token => ({ linkPaddingBlock: token.paddingXXS, linkPaddingInlineStart: token.padding }); // ============================== Export ============================== /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_2__.genStyleHooks)('Anchor', token => { const { fontSize, fontSizeLG, paddingXXS, calc } = token; const anchorToken = (0,_theme_internal__WEBPACK_IMPORTED_MODULE_3__.mergeToken)(token, { holderOffsetBlock: paddingXXS, anchorPaddingBlockSecondary: calc(paddingXXS).div(2).equal(), anchorTitleBlock: calc(fontSize).div(14).mul(3).equal(), anchorBallSize: calc(fontSizeLG).div(2).equal() }); return [genSharedAnchorStyle(anchorToken), genSharedAnchorHorizontalStyle(anchorToken)]; }, prepareComponentToken)); /***/ }), /***/ "./components/app/style/index.ts": /*!***************************************!*\ !*** ./components/app/style/index.ts ***! \***************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); // =============================== Base =============================== const genBaseStyle = token => { const { componentCls, colorText, fontSize, lineHeight, fontFamily } = token; return { [componentCls]: { color: colorText, fontSize, lineHeight, fontFamily, [`&${componentCls}-rtl`]: { direction: 'rtl' } } }; }; const prepareComponentToken = () => ({}); // ============================== Export ============================== /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_0__.genStyleHooks)('App', genBaseStyle, prepareComponentToken)); /***/ }), /***/ "./components/avatar/style/index.ts": /*!******************************************!*\ !*** ./components/avatar/style/index.ts ***! \******************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @ant-design/cssinjs */ "./alias/cssinjs.js"); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../style */ "./components/style/index.tsx"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../theme/internal */ "./node_modules/@ant-design/cssinjs-utils/es/index.js"); const genBaseStyle = token => { const { antCls, componentCls, iconCls, avatarBg, avatarColor, containerSize, containerSizeLG, containerSizeSM, textFontSize, textFontSizeLG, textFontSizeSM, borderRadius, borderRadiusLG, borderRadiusSM, lineWidth, lineType } = token; // Avatar size style const avatarSizeStyle = (size, fontSize, radius) => ({ width: size, height: size, borderRadius: '50%', [`&${componentCls}-square`]: { borderRadius: radius }, [`&${componentCls}-icon`]: { fontSize, [`> ${iconCls}`]: { margin: 0 } } }); return { [componentCls]: Object.assign(Object.assign(Object.assign(Object.assign({}, (0,_style__WEBPACK_IMPORTED_MODULE_0__.resetComponent)(token)), { position: 'relative', display: 'inline-flex', justifyContent: 'center', alignItems: 'center', overflow: 'hidden', color: avatarColor, whiteSpace: 'nowrap', textAlign: 'center', verticalAlign: 'middle', background: avatarBg, border: `${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(lineWidth)} ${lineType} transparent`, '&-image': { background: 'transparent' }, [`${antCls}-image-img`]: { display: 'block' } }), avatarSizeStyle(containerSize, textFontSize, borderRadius)), { '&-lg': Object.assign({}, avatarSizeStyle(containerSizeLG, textFontSizeLG, borderRadiusLG)), '&-sm': Object.assign({}, avatarSizeStyle(containerSizeSM, textFontSizeSM, borderRadiusSM)), '> img': { display: 'block', width: '100%', height: '100%', objectFit: 'cover' } }) }; }; const genGroupStyle = token => { const { componentCls, groupBorderColor, groupOverlapping, groupSpace } = token; return { [`${componentCls}-group`]: { display: 'inline-flex', [componentCls]: { borderColor: groupBorderColor }, '> *:not(:first-child)': { marginInlineStart: groupOverlapping } }, [`${componentCls}-group-popover`]: { [`${componentCls} + ${componentCls}`]: { marginInlineStart: groupSpace } } }; }; const prepareComponentToken = token => { const { controlHeight, controlHeightLG, controlHeightSM, fontSize, fontSizeLG, fontSizeXL, fontSizeHeading3, marginXS, marginXXS, colorBorderBg } = token; return { containerSize: controlHeight, containerSizeLG: controlHeightLG, containerSizeSM: controlHeightSM, textFontSize: Math.round((fontSizeLG + fontSizeXL) / 2), textFontSizeLG: fontSizeHeading3, textFontSizeSM: fontSize, groupSpace: marginXXS, groupOverlapping: -marginXS, groupBorderColor: colorBorderBg }; }; /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_2__.genStyleHooks)('Avatar', token => { const { colorTextLightSolid, colorTextPlaceholder } = token; const avatarToken = (0,_theme_internal__WEBPACK_IMPORTED_MODULE_3__.mergeToken)(token, { avatarBg: colorTextPlaceholder, avatarColor: colorTextLightSolid }); return [genBaseStyle(avatarToken), genGroupStyle(avatarToken)]; }, prepareComponentToken)); /***/ }), /***/ "./components/back-top/style/index.ts": /*!********************************************!*\ !*** ./components/back-top/style/index.ts ***! \********************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; } /* harmony export */ }); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @ant-design/cssinjs */ "./alias/cssinjs.js"); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../style */ "./components/style/index.tsx"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../theme/internal */ "./node_modules/@ant-design/cssinjs-utils/es/index.js"); // ============================== Shared ============================== const genSharedBackTopStyle = token => { const { componentCls, backTopFontSize, backTopSize, zIndexPopup } = token; return { [componentCls]: Object.assign(Object.assign({}, (0,_style__WEBPACK_IMPORTED_MODULE_0__.resetComponent)(token)), { position: 'fixed', insetInlineEnd: token.backTopInlineEnd, insetBlockEnd: token.backTopBlockEnd, zIndex: zIndexPopup, width: 40, height: 40, cursor: 'pointer', '&:empty': { display: 'none' }, [`${componentCls}-content`]: { width: backTopSize, height: backTopSize, overflow: 'hidden', color: token.backTopColor, textAlign: 'center', backgroundColor: token.backTopBackground, borderRadius: backTopSize, transition: `all ${token.motionDurationMid}`, '&:hover': { backgroundColor: token.backTopHoverBackground, transition: `all ${token.motionDurationMid}` } }, // change to .backtop .backtop-icon [`${componentCls}-icon`]: { fontSize: backTopFontSize, lineHeight: (0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(backTopSize) } }) }; }; const genMediaBackTopStyle = token => { const { componentCls, screenMD, screenXS, backTopInlineEndMD, backTopInlineEndXS } = token; return { [`@media (max-width: ${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(screenMD)})`]: { [componentCls]: { insetInlineEnd: backTopInlineEndMD } }, [`@media (max-width: ${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_1__.unit)(screenXS)})`]: { [componentCls]: { insetInlineEnd: backTopInlineEndXS } } }; }; const prepareComponentToken = token => ({ zIndexPopup: token.zIndexBase + 10 }); // ============================== Export ============================== /* harmony default export */ __webpack_exports__["default"] = ((0,_theme_internal__WEBPACK_IMPORTED_MODULE_2__.genStyleHooks)('BackTop', token => { const { fontSizeHeading3, colorTextDescription, colorTextLightSolid, colorText, controlHeightLG, calc } = token; const backTopToken = (0,_theme_internal__WEBPACK_IMPORTED_MODULE_3__.mergeToken)(token, { backTopBackground: colorTextDescription, backTopColor: colorTextLightSolid, backTopHoverBackground: colorText, backTopFontSize: fontSizeHeading3, backTopSize: controlHeightLG, backTopBlockEnd: calc(controlHeightLG).mul(1.25).equal(), backTopInlineEnd: calc(controlHeightLG).mul(2.5).equal(), backTopInlineEndMD: calc(controlHeightLG).mul(1.5).equal(), backTopInlineEndXS: calc(controlHeightLG).mul(0.5).equal() }); return [genSharedBackTopStyle(backTopToken), genMediaBackTopStyle(backTopToken)]; }, prepareComponentToken)); /***/ }), /***/ "./components/badge/style/index.ts": /*!*****************************************!*\ !*** ./components/badge/style/index.ts ***! \*****************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ prepareComponentToken: function() { return /* binding */ prepareComponentToken; }, /* harmony export */ prepareToken: function() { return /* binding */ prepareToken; } /* harmony export */ }); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @ant-design/cssinjs */ "./alias/cssinjs.js"); /* harmony import */ var _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../style */ "./components/style/index.tsx"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genPresetColor.ts"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../theme/internal */ "./node_modules/@ant-design/cssinjs-utils/es/index.js"); /* harmony import */ var _theme_internal__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../theme/internal */ "./components/theme/util/genStyleUtils.ts"); const antStatusProcessing = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antStatusProcessing', { '0%': { transform: 'scale(0.8)', opacity: 0.5 }, '100%': { transform: 'scale(2.4)', opacity: 0 } }); const antZoomBadgeIn = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antZoomBadgeIn', { '0%': { transform: 'scale(0) translate(50%, -50%)', opacity: 0 }, '100%': { transform: 'scale(1) translate(50%, -50%)' } }); const antZoomBadgeOut = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antZoomBadgeOut', { '0%': { transform: 'scale(1) translate(50%, -50%)' }, '100%': { transform: 'scale(0) translate(50%, -50%)', opacity: 0 } }); const antNoWrapperZoomBadgeIn = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antNoWrapperZoomBadgeIn', { '0%': { transform: 'scale(0)', opacity: 0 }, '100%': { transform: 'scale(1)' } }); const antNoWrapperZoomBadgeOut = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antNoWrapperZoomBadgeOut', { '0%': { transform: 'scale(1)' }, '100%': { transform: 'scale(0)', opacity: 0 } }); const antBadgeLoadingCircle = new _ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.Keyframes('antBadgeLoadingCircle', { '0%': { transformOrigin: '50%' }, '100%': { transform: 'translate(50%, -50%) rotate(360deg)', transformOrigin: '50%' } }); const genSharedBadgeStyle = token => { const { componentCls, iconCls, antCls, badgeShadowSize, textFontSize, textFontSizeSM, statusSize, dotSize, textFontWeight, indicatorHeight, indicatorHeightSM, marginXS, calc } = token; const numberPrefixCls = `${antCls}-scroll-number`; const colorPreset = (0,_theme_internal__WEBPACK_IMPORTED_MODULE_1__["default"])(token, (colorKey, _ref) => { let { darkColor } = _ref; return { [`&${componentCls} ${componentCls}-color-${colorKey}`]: { background: darkColor, [`&:not(${componentCls}-count)`]: { color: darkColor }, 'a:hover &': { background: darkColor } } }; }); return { [componentCls]: Object.assign(Object.assign(Object.assign(Object.assign({}, (0,_style__WEBPACK_IMPORTED_MODULE_2__.resetComponent)(token)), { position: 'relative', display: 'inline-block', width: 'fit-content', lineHeight: 1, [`${componentCls}-count`]: { display: 'inline-flex', justifyContent: 'center', zIndex: token.indicatorZIndex, minWidth: indicatorHeight, height: indicatorHeight, color: token.badgeTextColor, fontWeight: textFontWeight, fontSize: textFontSize, lineHeight: (0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(indicatorHeight), whiteSpace: 'nowrap', textAlign: 'center', background: token.badgeColor, borderRadius: calc(indicatorHeight).div(2).equal(), boxShadow: `0 0 0 ${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(badgeShadowSize)} ${token.badgeShadowColor}`, transition: `background ${token.motionDurationMid}`, a: { color: token.badgeTextColor }, 'a:hover': { color: token.badgeTextColor }, 'a:hover &': { background: token.badgeColorHover } }, [`${componentCls}-count-sm`]: { minWidth: indicatorHeightSM, height: indicatorHeightSM, fontSize: textFontSizeSM, lineHeight: (0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(indicatorHeightSM), borderRadius: calc(indicatorHeightSM).div(2).equal() }, [`${componentCls}-multiple-words`]: { padding: `0 ${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(token.paddingXS)}`, bdi: { unicodeBidi: 'plaintext' } }, [`${componentCls}-dot`]: { zIndex: token.indicatorZIndex, width: dotSize, minWidth: dotSize, height: dotSize, background: token.badgeColor, borderRadius: '100%', boxShadow: `0 0 0 ${(0,_ant_design_cssinjs__WEBPACK_IMPORTED_MODULE_0__.unit)(badgeShadowSize)} ${token.badgeShadowColor}` }, [`${componentCls}-count, ${componentCls}-dot, ${numberPrefixCls}-custom-component`]: { position: 'absolute', top: 0, insetInlineEnd: 0, transform: 'translate(50%, -50%)', transformOrigin: '100% 0%', [`&${iconCls}-spin`]: { animationName: antBadgeLoadingCircle, animationDuration: '1s', animationIterationCount: 'infinite', animationTimingFunction: 'linear' } }, [`&${componentCls}-status`]: { lineHeight: 'inherit', verticalAlign: 'baseline', [`${componentCls}-status-dot`]: { position: 'relative', top: -1, // Magic number, but seems better experience display: 'inline-block', width: statusSize, height: statusSize, verticalAlign: 'middle', borderRadius: '50%' }, [`${componentCls}-status-success`]: { backgroundColor: token.colorSuccess }, [`${componentCls}-status-processing`]: { overflow: 'visible', color: token.colorInfo, backgroundColor: token.colorInfo, borderColor: 'currentcolor', '&::after': { position: 'absolute', top: 0, insetInlineStart: 0, width: '100%', height: '100%', borderWidth: badgeShado