@next-core/brick-kit 2.103.3 → 2.103.7

package/dist/index.esm.js

@@ -3,8 +3,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _asyncToGenerator$4 from '@babel/runtime/helpers/asyncToGenerator';
 import _defineProperty$1 from '@babel/runtime/helpers/defineProperty';
-import * as React from 'react';
-import React__default, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, useContext, createContext } from 'react';
+import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, useContext, createContext } from 'react';
 import lodash, { set, get, difference, identity, cloneDeep, isNil, sortBy, merge, clamp, uniqueId, orderBy, omit, isEmpty } from 'lodash';
 import { toPath, computeRealRoutePath, hasOwnProperty, isObject, isEvaluable, transformAndInject, transform, trackContext, scanPermissionActionsInStoryboard, precookFunction, cook, shouldAllowRecursiveEvaluations, preevaluate, inject, deepFreeze, createProviderClass, scanRouteAliasInStoryboard, loadScript, getTemplateDepsOfStoryboard, getDllAndDepsOfStoryboard, asyncProcessStoryboard, prefetchScript, scanBricksInBrickConf, scanProcessorsInAny, getDllAndDepsByResource, resolveContextConcurrently, matchPath, asyncProcessBrick, restoreDynamicTemplates, mapCustomApisToNameAndNamespace, scanCustomApisInStoryboard } from '@next-core/brick-utils';
 import { http, HttpResponseError, HttpFetchError } from '@next-core/brick-http';
@@ -16,7 +15,7 @@ import yaml from 'js-yaml';
 import { Modal, message, Empty, ConfigProvider } from 'antd';
 import { ExclamationCircleOutlined } from '@ant-design/icons';
 import { withTranslation } from 'react-i18next';
-import _extends$2 from '@babel/runtime/helpers/esm/extends';
+import _extends from '@babel/runtime/helpers/esm/extends';
 import { getIllustration } from '@next-core/illustrations';
 import _decorate from '@babel/runtime/helpers/decorate';
 
@@ -3204,8 +3203,8 @@ function handleHttpError(error) {
     }
 
     unauthenticatedConfirmModal = Modal.confirm({
-      icon: /*#__PURE__*/React__default.createElement(ExclamationCircleOutlined, null),
-      content: /*#__PURE__*/React__default.createElement(LoginTimeoutMessage, null),
+      icon: /*#__PURE__*/React.createElement(ExclamationCircleOutlined, null),
+      content: /*#__PURE__*/React.createElement(LoginTimeoutMessage, null),
       okText: i18next.t("".concat(NS_BRICK_KIT, ":").concat(K.MODAL_OK)),
       cancelText: i18next.t("".concat(NS_BRICK_KIT, ":").concat(K.MODAL_CANCEL)),
       onOk: () => {
@@ -3223,7 +3222,7 @@ function handleHttpError(error) {
 
   return Modal.error({
     title: i18next.t("".concat(NS_BRICK_KIT, ":").concat(K.REQUEST_FAILED)),
-    content: /*#__PURE__*/React__default.createElement("div", {
+    content: /*#__PURE__*/React.createElement("div", {
       style: {
         whiteSpace: "pre-wrap"
       }
@@ -3232,13 +3231,13 @@ function handleHttpError(error) {
   });
 }
 function LoginTimeoutMessage() {
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     // Unset confirm modal when it's destroyed.
     return () => {
       unauthenticatedConfirmModal = undefined;
     };
   }, []);
-  return /*#__PURE__*/React__default.createElement("div", null, i18next.t("".concat(NS_BRICK_KIT, ":").concat(K.LOGIN_TIMEOUT_MESSAGE)));
+  return /*#__PURE__*/React.createElement("div", null, i18next.t("".concat(NS_BRICK_KIT, ":").concat(K.LOGIN_TIMEOUT_MESSAGE)));
 }
 
 class WebsocketMessageRequest {
@@ -7053,7 +7052,7 @@ presetPalettes.magenta;
 presetPalettes.grey;
 
 function getStyleByBaseColors(theme, baseColors, backgroundColor) {
-  return (theme === "dark" ? getDarkStyle : getLightStyle)(getCssVariableDefinitionsByPalettes(generatePalettes(baseColors, theme, backgroundColor)));
+  return (theme === "dark" ? getDarkStyle : getLightStyle)("".concat(getCssVariableDefinitionsByPalettes(generatePalettes(baseColors, theme, backgroundColor)), "\n").concat(getMigratedCssVariableDefinitions(theme, baseColors, backgroundColor)));
 }
 function getStyleByBrandColor(theme, brandColor) {
   return (theme === "dark" ? getDarkStyle : getLightStyle)(getCssVariableDefinitionsByBrand(brandColor));
@@ -7117,6 +7116,33 @@ function ensureBaseColorName(name) {
   }
 }
 
+function getMigratedCssVariableDefinitions(theme, baseColors, backgroundColor) {
+  var migrateMap = {
+    green: "green",
+    red: "red",
+    blue: "blue",
+    orange: "orange",
+    cyan: "cyan",
+    purple: "purple",
+    geekblue: "indigo"
+  };
+  return Object.entries(migrateMap).flatMap(_ref4 => {
+    var [legacyColorName, newColorName] = _ref4;
+    return ["  --theme-".concat(legacyColorName, "-color-rgb-channel: ").concat(getRgbChannel(getActualBaseColor(baseColors[newColorName], theme, backgroundColor)), ";"), ...(theme === "dark" ? [] : ["  --theme-".concat(legacyColorName, "-color: var(--palette-").concat(newColorName, "-6);"), "  --theme-".concat(legacyColorName, "-border-color: var(--palette-").concat(newColorName, "-3);")]), "  --theme-".concat(legacyColorName, "-background: var(--palette-").concat(newColorName, "-").concat(theme === "dark" ? 2 : 1, ");"), ""];
+  }).join("\n");
+}
+
+function getRgbChannel(color) {
+  return color.match(/[0-9a-fA-F]{2}/g).map(hex => parseInt(hex, 16)).join(", ");
+}
+
+function getActualBaseColor(baseColor, theme, backgroundColor) {
+  return theme === "dark" ? generate(baseColor, {
+    theme,
+    backgroundColor
+  })[5] : baseColor;
+}
+
 function applyColorTheme(options) {
   var style = [];
   var themes = ["light", "dark"];
@@ -10681,7 +10707,7 @@ function getRuntime() {
 }
 
 // Ref https://reactjs.org/docs/error-boundaries.html
-class LegacyErrorBoundary extends React__default.Component {
+class LegacyErrorBoundary extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -10704,9 +10730,9 @@ class LegacyErrorBoundary extends React__default.Component {
   render() {
     if (this.state.error) {
       // You can render any custom fallback UI
-      return /*#__PURE__*/React__default.createElement("div", {
+      return /*#__PURE__*/React.createElement("div", {
         "data-testid": "error-boundary"
-      }, /*#__PURE__*/React__default.createElement("h3", null, this.props.t(K.SOMETHING_WENT_WRONG)), /*#__PURE__*/React__default.createElement("p", null, httpErrorToString(this.state.error)));
+      }, /*#__PURE__*/React.createElement("h3", null, this.props.t(K.SOMETHING_WENT_WRONG)), /*#__PURE__*/React.createElement("p", null, httpErrorToString(this.state.error)));
     }
 
     return this.props.children;
@@ -10901,8 +10927,8 @@ function useApplyPageTitle(pageTitle) {
 /** @internal */
 
 function useRecentApps() {
-  var [recentApps, setRecentApps] = React__default.useState(getRuntime().getRecentApps());
-  React__default.useEffect(() => {
+  var [recentApps, setRecentApps] = React.useState(getRuntime().getRecentApps());
+  React.useEffect(() => {
     var listener = event => {
       setRecentApps(event.detail);
     };
@@ -10936,8 +10962,8 @@ function useCurrentApp() {
 
 function useLocation() {
   var history = getHistory();
-  var [location, setLocation] = React__default.useState(history.location);
-  React__default.useEffect(() => {
+  var [location, setLocation] = React.useState(history.location);
+  React.useEffect(() => {
     var unlisten = history.listen(location => setLocation(location));
     return unlisten;
   }, [history]);
@@ -11088,7 +11114,7 @@ var handleProxyOfParentTemplate = (brick, tplContextId, tplContext) => {
  * @param props - 属性。
  */
 
-var SingleBrickAsComponent = /*#__PURE__*/React__default.memo(function SingleBrickAsComponent(_ref2) {
+var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsComponent(_ref2) {
   var {
     useBrick,
     data,
@@ -11101,7 +11127,7 @@ var SingleBrickAsComponent = /*#__PURE__*/React__default.memo(function SingleBri
 
   var template;
   var brick;
-  var isBrickAvailable = React__default.useMemo(() => {
+  var isBrickAvailable = React.useMemo(() => {
     if (isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
       // eslint-disable-next-line
       console.warn("Currently resolvable-if in `useBrick` is not supported.");
@@ -11115,7 +11141,7 @@ var SingleBrickAsComponent = /*#__PURE__*/React__default.memo(function SingleBri
 
     return true;
   }, [useBrick, data]);
-  var runtimeBrick = React__default.useMemo( /*#__PURE__*/_asyncToGenerator$4(function* () {
+  var runtimeBrick = React.useMemo( /*#__PURE__*/_asyncToGenerator$4(function* () {
     if (!isBrickAvailable) {
       return null;
     } // If the router state is initial, ignore rendering the sub-brick.
@@ -11154,7 +11180,7 @@ var SingleBrickAsComponent = /*#__PURE__*/React__default.memo(function SingleBri
 
     return brick;
   }), [useBrick, data, isBrickAvailable]);
-  var innerRefCallback = React__default.useCallback( /*#__PURE__*/function () {
+  var innerRefCallback = React.useCallback( /*#__PURE__*/function () {
     var _ref5 = _asyncToGenerator$4(function* (element) {
       immediatelyRefCallback === null || immediatelyRefCallback === void 0 ? void 0 : immediatelyRefCallback(element);
 
@@ -11209,24 +11235,24 @@ var SingleBrickAsComponent = /*#__PURE__*/React__default.memo(function SingleBri
   }
 
   if (template) {
-    return /*#__PURE__*/React__default.createElement(template.brick, {
+    return /*#__PURE__*/React.createElement(template.brick, {
       ref: innerRefCallback
     }, ...slotsToChildren(template.slots).map((item, index) => {
-      return /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+      return /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
         key: index,
         useBrick: item,
         data: data
       });
     }));
   } else {
-    return /*#__PURE__*/React__default.createElement(useBrick.brick, {
+    return /*#__PURE__*/React.createElement(useBrick.brick, {
       ref: innerRefCallback
     }, ...slotsToChildren(useBrick.slots).map((item, index) => {
       if (useBrick[symbolForTplContextId] && !item[symbolForTplContextId]) {
         item[symbolForTplContextId] = useBrick[symbolForTplContextId];
       }
 
-      return /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+      return /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
         key: index,
         useBrick: item,
         data: data
@@ -11262,7 +11288,7 @@ function BrickAsComponent(_ref6) {
   } = _ref6;
 
   if (Array.isArray(useBrick)) {
-    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, useBrick.map((item, index) => /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, useBrick.map((item, index) => /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
       key: index,
       useBrick: item,
       data: data,
@@ -11270,7 +11296,7 @@ function BrickAsComponent(_ref6) {
     })));
   }
 
-  return /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+  return /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
     useBrick: useBrick,
     data: data,
     parentRefForUseBrickInPortal: parentRefForUseBrickInPortal
@@ -11303,7 +11329,7 @@ function transformEvents(data, events) {
 // eslint-disable-next-line react/display-name
 
 
-var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default.memo( /*#__PURE__*/forwardRef(function LegacySingleBrickAsComponent(_ref8, ref) {
+var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/forwardRef(function LegacySingleBrickAsComponent(_ref8, ref) {
   var {
     useBrick,
     data,
@@ -11316,7 +11342,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default.memo( /*#__PU
 
   var template;
   var brick;
-  var isBrickAvailable = React__default.useMemo(() => {
+  var isBrickAvailable = React.useMemo(() => {
     if (isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
       // eslint-disable-next-line
       console.warn("Currently resolvable-if in `useBrick` is not supported.");
@@ -11333,7 +11359,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default.memo( /*#__PU
   useImperativeHandle(ref, () => {
     return brickRef.current;
   });
-  var runtimeBrick = React__default.useMemo( /*#__PURE__*/_asyncToGenerator$4(function* () {
+  var runtimeBrick = React.useMemo( /*#__PURE__*/_asyncToGenerator$4(function* () {
     if (!isBrickAvailable) {
       return null;
     } // If the router state is initial, ignore rendering the sub-brick.
@@ -11374,7 +11400,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default.memo( /*#__PU
     listenOnTrackingContext(brick, trackingContextList, runtimeContext);
     return brick;
   }), [useBrick, data, isBrickAvailable]);
-  var innerRefCallback = React__default.useCallback( /*#__PURE__*/function () {
+  var innerRefCallback = React.useCallback( /*#__PURE__*/function () {
     var _ref11 = _asyncToGenerator$4(function* (element) {
       brickRef.current = element;
 
@@ -11429,24 +11455,24 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default.memo( /*#__PU
   }
 
   if (template) {
-    return /*#__PURE__*/React__default.createElement(template.brick, {
+    return /*#__PURE__*/React.createElement(template.brick, {
       ref: innerRefCallback
     }, ...slotsToChildren(template.slots).map((item, index) => {
-      return /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+      return /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
         key: index,
         useBrick: item,
         data: data
       });
     }));
   } else {
-    return /*#__PURE__*/React__default.createElement(useBrick.brick, {
+    return /*#__PURE__*/React.createElement(useBrick.brick, {
       ref: innerRefCallback
     }, ...slotsToChildren(useBrick.slots).map((item, index) => {
       if (useBrick[symbolForTplContextId] && !item[symbolForTplContextId]) {
         item[symbolForTplContextId] = useBrick[symbolForTplContextId];
       }
 
-      return /*#__PURE__*/React__default.createElement(SingleBrickAsComponent, {
+      return /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
         key: index,
         useBrick: item,
         data: data
@@ -11506,7 +11532,7 @@ var locale$4 = {
 var TimePicker$1 = locale$4;
 
 var locale$3 = {
-  lang: _extends$2({
+  lang: _extends({
     placeholder: '请选择日期',
     yearPlaceholder: '请选择年份',
     quarterPlaceholder: '请选择季度',
@@ -11517,7 +11543,7 @@ var locale$3 = {
     rangeMonthPlaceholder: ['开始月份', '结束月份'],
     rangeWeekPlaceholder: ['开始周', '结束周']
   }, locale$5),
-  timePickerLocale: _extends$2({}, TimePicker$1)
+  timePickerLocale: _extends({}, TimePicker$1)
 }; // should add whitespace between char in Button
 
 locale$3.lang.ok = '确 定'; // All settings at:
@@ -11703,7 +11729,7 @@ var locale$1 = {
 var TimePicker = locale$1;
 
 var locale = {
-  lang: _extends$2({
+  lang: _extends({
     placeholder: 'Select date',
     yearPlaceholder: 'Select year',
     quarterPlaceholder: 'Select quarter',
@@ -11714,7 +11740,7 @@ var locale = {
     rangeMonthPlaceholder: ['Start month', 'End month'],
     rangeWeekPlaceholder: ['Start week', 'End week']
   }, locale$2),
-  timePickerLocale: _extends$2({}, TimePicker)
+  timePickerLocale: _extends({}, TimePicker)
 }; // All settings at:
 // https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
 
@@ -11847,288 +11873,276 @@ var localeValues = {
 };
 var defaultLocale = localeValues;
 
-function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
-
-var _ref$1 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "5.718%",
-  y1: "4.311%",
-  x2: "83.05%",
-  y2: "88.915%",
-  id: "empty-image_svg__a"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#D4D8E4",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#A9B0C4",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "0%",
-  y1: "11.08%",
-  x2: "80.548%",
-  y2: "107.704%",
-  id: "empty-image_svg__d"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#C2C7DA",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#8F96B3",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M23.672 23.607h2.492a4 4 0 0 1 4 4v2.491a4 4 0 0 1-4 4h-2.492a4 4 0 0 1-4-4v-2.491a4 4 0 0 1 4-4z",
-  id: "empty-image_svg__c"
-}), /*#__PURE__*/React.createElement("filter", {
-  x: "-57.2%",
-  y: "-47.7%",
-  width: "233.4%",
-  height: "233.4%",
-  filterUnits: "objectBoundingBox",
-  id: "empty-image_svg__b"
-}, /*#__PURE__*/React.createElement("feOffset", {
-  dx: 1,
-  dy: 2,
-  in: "SourceAlpha",
-  result: "shadowOffsetOuter1"
-}), /*#__PURE__*/React.createElement("feGaussianBlur", {
-  stdDeviation: 2,
-  in: "shadowOffsetOuter1",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feComposite", {
-  in: "shadowBlurOuter1",
-  in2: "SourceAlpha",
-  operator: "out",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feColorMatrix", {
-  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.22 0",
-  in: "shadowBlurOuter1"
-})), /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "41.823%",
-  y1: "24.795%",
-  x2: "8.813%",
-  y2: "86.427%",
-  id: "empty-image_svg__g"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#CCD0DD",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#9DA3B9",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M37.311 12.459a4 4 0 0 1 4 4v3.419l-7.418-7.419h3.418z",
-  id: "empty-image_svg__f"
-}), /*#__PURE__*/React.createElement("filter", {
-  x: "-94.4%",
-  y: "-121.3%",
-  width: "288.7%",
-  height: "288.7%",
-  filterUnits: "objectBoundingBox",
-  id: "empty-image_svg__e"
-}, /*#__PURE__*/React.createElement("feOffset", {
-  dy: -2,
-  in: "SourceAlpha",
-  result: "shadowOffsetOuter1"
-}), /*#__PURE__*/React.createElement("feGaussianBlur", {
-  stdDeviation: 2,
-  in: "shadowOffsetOuter1",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feColorMatrix", {
-  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0",
-  in: "shadowBlurOuter1"
-})));
-
-var _ref2$1 = /*#__PURE__*/React.createElement("g", {
-  fill: "none",
-  fillRule: "evenodd"
-}, /*#__PURE__*/React.createElement("path", {
-  d: "M39.682 33.967H10.81a2.8 2.8 0 0 0-1.94.782l-5.197 4.999v6.98a5.6 5.6 0 0 0 5.6 5.6H41.22a5.6 5.6 0 0 0 5.6-5.6v-6.98l-5.196-4.999a2.8 2.8 0 0 0-1.942-.782z",
-  fill: "#A6AAC3"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M33.893 12.459l7.418 7.419v22.568a2.8 2.8 0 0 1-2.8 2.8h-26.53a2.8 2.8 0 0 1-2.8-2.8V18.459a6 6 0 0 1 6-6h18.712z",
-  fill: "url(#empty-image_svg__a)"
-}), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("use", {
-  fill: "#000",
-  filter: "url(#empty-image_svg__b)",
-  xlinkHref: "#empty-image_svg__c"
-}), /*#__PURE__*/React.createElement("path", {
-  stroke: "#FFF",
-  d: "M26.164 24.107c.966 0 1.841.391 2.475 1.025a3.489 3.489 0 0 1 1.025 2.475h0v2.491c0 .967-.392 1.842-1.025 2.475a3.489 3.489 0 0 1-2.475 1.025h0-2.492a3.489 3.489 0 0 1-2.475-1.025 3.489 3.489 0 0 1-1.025-2.475h0v-2.491c0-.967.392-1.842 1.025-2.475a3.489 3.489 0 0 1 2.475-1.025h0z",
-  strokeLinejoin: "square",
-  fill: "url(#empty-image_svg__d)"
-})), /*#__PURE__*/React.createElement("g", {
-  transform: "rotate(180 37.602 16.168)"
-}, /*#__PURE__*/React.createElement("use", {
-  fill: "#000",
-  filter: "url(#empty-image_svg__e)",
-  xlinkHref: "#empty-image_svg__f"
-}), /*#__PURE__*/React.createElement("use", {
-  fill: "url(#empty-image_svg__g)",
-  xlinkHref: "#empty-image_svg__f"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M54.164 27.541c.253 0 .459.205.459.459v.918h.918a.459.459 0 1 1 0 .918h-.918v.918a.459.459 0 0 1-.918 0v-.918h-.918a.459.459 0 0 1 0-.918h.918V28c0-.254.205-.459.459-.459zM1.377 20.197c.19 0 .344.154.344.344v.574h.574a.459.459 0 1 1 0 .918h-.574v.574a.344.344 0 0 1-.688 0l-.001-.574H.459a.459.459 0 0 1 0-.918h.573v-.574c0-.19.155-.344.345-.344z",
-  fill: "#D6D8E4",
-  opacity: 0.3
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M24.787 43.53h.014c7.087.143 9.817-3.834 12.785-4.046l.19-.008h9.044v10.052a2.8 2.8 0 0 1-2.63 2.795l-.17.005H6.472l-.17-.005a2.8 2.8 0 0 1-2.63-2.795V39.475h8.126l.144-.004c2.485.004 5.214 3.898 12.83 4.06l.015-.002z",
-  fill: "#D6D8E4"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M13.77 2.2s2.308-.555 2.962-2.2c.943 1.35 1.429 1.933 2.547 2.189-1.522.453-2.183.963-2.704 2.401-.598-1.695-1.142-1.914-2.805-2.39",
-  fill: "#D6D8E4",
-  opacity: 0.5
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M41.311 6.64S47.464 5.194 49.21.917c2.514 3.508 3.81 5.025 6.791 5.691-4.059 1.18-5.822 2.503-7.21 6.243-1.594-4.406-3.045-4.976-7.479-6.213",
-  fill: "#D6D8E4",
-  opacity: 0.8
-}));
+function EmptySvg(props) {
+  var prefix = uniqueId();
 
-function SvgEmptyImage(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$1({
-    width: 56,
-    height: 53,
-    viewBox: "0 0 56 53",
-    xmlns: "http://www.w3.org/2000/svg",
-    xmlnsXlink: "http://www.w3.org/1999/xlink"
-  }, props), _ref$1, _ref2$1);
-}
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-var _ref = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "5.718%",
-  y1: "4.311%",
-  x2: "83.05%",
-  y2: "88.915%",
-  id: "big-empty-image_svg__a"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#D4D8E4",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#A9B0C4",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "0%",
-  y1: "11.08%",
-  x2: "80.548%",
-  y2: "107.704%",
-  id: "big-empty-image_svg__d"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#C2C7DA",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#8F96B3",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M34 36h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4h-8a4 4 0 0 1-4-4v-8a4 4 0 0 1 4-4z",
-  id: "big-empty-image_svg__c"
-}), /*#__PURE__*/React.createElement("filter", {
-  x: "-37.5%",
-  y: "-31.3%",
-  width: "187.5%",
-  height: "187.5%",
-  filterUnits: "objectBoundingBox",
-  id: "big-empty-image_svg__b"
-}, /*#__PURE__*/React.createElement("feOffset", {
-  dx: 1,
-  dy: 2,
-  in: "SourceAlpha",
-  result: "shadowOffsetOuter1"
-}), /*#__PURE__*/React.createElement("feGaussianBlur", {
-  stdDeviation: 2,
-  in: "shadowOffsetOuter1",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feComposite", {
-  in: "shadowBlurOuter1",
-  in2: "SourceAlpha",
-  operator: "out",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feColorMatrix", {
-  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.22 0",
-  in: "shadowBlurOuter1"
-})), /*#__PURE__*/React.createElement("linearGradient", {
-  x1: "41.823%",
-  y1: "24.795%",
-  x2: "8.813%",
-  y2: "86.427%",
-  id: "big-empty-image_svg__g"
-}, /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#CCD0DD",
-  offset: "0%"
-}), /*#__PURE__*/React.createElement("stop", {
-  stopColor: "#9DA3B9",
-  offset: "100%"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M59 19a4 4 0 0 1 4 4v7.314L51.686 19H59z",
-  id: "big-empty-image_svg__f"
-}), /*#__PURE__*/React.createElement("filter", {
-  x: "-61.9%",
-  y: "-79.5%",
-  width: "223.7%",
-  height: "223.7%",
-  filterUnits: "objectBoundingBox",
-  id: "big-empty-image_svg__e"
-}, /*#__PURE__*/React.createElement("feOffset", {
-  dy: -2,
-  in: "SourceAlpha",
-  result: "shadowOffsetOuter1"
-}), /*#__PURE__*/React.createElement("feGaussianBlur", {
-  stdDeviation: 2,
-  in: "shadowOffsetOuter1",
-  result: "shadowBlurOuter1"
-}), /*#__PURE__*/React.createElement("feColorMatrix", {
-  values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0",
-  in: "shadowBlurOuter1"
-})));
-
-var _ref2 = /*#__PURE__*/React.createElement("g", {
-  fill: "none",
-  fillRule: "evenodd"
-}, /*#__PURE__*/React.createElement("path", {
-  d: "M61.108 51.8H15.892a2.8 2.8 0 0 0-1.941.782L5.6 60.615V74.2a5.6 5.6 0 0 0 5.6 5.6h54.6a5.6 5.6 0 0 0 5.6-5.6V60.615l-8.35-8.033a2.8 2.8 0 0 0-1.942-.782z",
-  fill: "#A6AAC3"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M51.686 19L63 30.314V66.2a2.8 2.8 0 0 1-2.8 2.8H16.8a2.8 2.8 0 0 1-2.8-2.8V25a6 6 0 0 1 6-6h31.686z",
-  fill: "url(#big-empty-image_svg__a)"
-}), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("use", {
-  fill: "#000",
-  filter: "url(#big-empty-image_svg__b)",
-  xlinkHref: "#big-empty-image_svg__c"
-}), /*#__PURE__*/React.createElement("path", {
-  stroke: "#FFF",
-  d: "M42 36.5c.966 0 1.841.392 2.475 1.025A3.489 3.489 0 0 1 45.5 40h0v8c0 .966-.392 1.841-1.025 2.475A3.489 3.489 0 0 1 42 51.5h0-8a3.489 3.489 0 0 1-2.475-1.025A3.489 3.489 0 0 1 30.5 48h0v-8c0-.966.392-1.841 1.025-2.475A3.489 3.489 0 0 1 34 36.5h0z",
-  strokeLinejoin: "square",
-  fill: "url(#big-empty-image_svg__d)"
-})), /*#__PURE__*/React.createElement("g", {
-  transform: "rotate(180 57.343 24.657)"
-}, /*#__PURE__*/React.createElement("use", {
-  fill: "#000",
-  filter: "url(#big-empty-image_svg__e)",
-  xlinkHref: "#big-empty-image_svg__f"
-}), /*#__PURE__*/React.createElement("use", {
-  fill: "url(#big-empty-image_svg__g)",
-  xlinkHref: "#big-empty-image_svg__f"
-})), /*#__PURE__*/React.createElement("path", {
-  d: "M82.6 42a.7.7 0 0 1 .7.7v1.399l1.4.001a.7.7 0 0 1 0 1.4l-1.4-.001V46.9a.7.7 0 0 1-1.4 0v-1.401l-1.4.001a.7.7 0 0 1 0-1.4l1.4-.001V42.7a.7.7 0 0 1 .7-.7zM2.1 30.8c.29 0 .525.235.525.525l-.001.874.876.001a.7.7 0 0 1 0 1.4h-.876l.001.875a.525.525 0 1 1-1.05 0l-.001-.875H.7a.7.7 0 0 1 0-1.4l.874-.001.001-.874c0-.29.235-.525.525-.525z",
-  fill: "#D6D8E4",
-  opacity: 0.3
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M8.4 79.8l-.17-.005A2.8 2.8 0 0 1 5.6 77V60.2h12.393l.175-.006c3.802-.04 7.95 5.943 19.61 6.19l.022-.002.022.002c10.856.218 15.009-5.902 19.558-6.175l.227-.009H71.4V77a2.8 2.8 0 0 1-2.63 2.795l-.17.005H8.4z",
-  fill: "#D6D8E4"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M21 3.356S24.518 2.509 25.516 0c1.438 2.057 2.18 2.947 3.884 3.338-2.321.692-3.33 1.468-4.123 3.662-.912-2.584-1.741-2.919-4.277-3.644",
-  fill: "#D6D8E4",
-  opacity: 0.5
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M63 10.125S72.382 7.923 75.044 1.4c3.834 5.35 5.81 7.663 10.356 8.68-6.19 1.797-8.878 3.816-10.995 9.52-2.43-6.72-4.643-7.59-11.405-9.475",
-  fill: "#D6D8E4",
-  opacity: 0.8
-}));
+  var createNewId = id => {
+    return prefix + id;
+  };
 
-function SvgBigEmptyImage(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
+  return props.isBig ? /*#__PURE__*/React.createElement("svg", {
     width: 86,
     height: 80,
-    viewBox: "0 0 86 80",
     xmlns: "http://www.w3.org/2000/svg",
     xmlnsXlink: "http://www.w3.org/1999/xlink"
-  }, props), _ref, _ref2);
+  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "5.718%",
+    y1: "4.311%",
+    x2: "83.05%",
+    y2: "88.915%",
+    id: createNewId("a")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#D4D8E4",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#A9B0C4",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "0%",
+    y1: "11.08%",
+    x2: "80.548%",
+    y2: "107.704%",
+    id: createNewId("d")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#C2C7DA",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#8F96B3",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "41.823%",
+    y1: "24.795%",
+    x2: "8.813%",
+    y2: "86.427%",
+    id: createNewId("g")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#CCD0DD",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#9DA3B9",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("filter", {
+    x: "-37.5%",
+    y: "-31.3%",
+    width: "187.5%",
+    height: "187.5%",
+    filterUnits: "objectBoundingBox",
+    id: createNewId("b")
+  }, /*#__PURE__*/React.createElement("feOffset", {
+    dx: 1,
+    dy: 2,
+    in: "SourceAlpha",
+    result: "shadowOffsetOuter1"
+  }), /*#__PURE__*/React.createElement("feGaussianBlur", {
+    stdDeviation: 2,
+    in: "shadowOffsetOuter1",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feComposite", {
+    in: "shadowBlurOuter1",
+    in2: "SourceAlpha",
+    operator: "out",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feColorMatrix", {
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.22 0",
+    in: "shadowBlurOuter1"
+  })), /*#__PURE__*/React.createElement("filter", {
+    x: "-61.9%",
+    y: "-79.5%",
+    width: "223.7%",
+    height: "223.7%",
+    filterUnits: "objectBoundingBox",
+    id: createNewId("e")
+  }, /*#__PURE__*/React.createElement("feOffset", {
+    dy: -2,
+    in: "SourceAlpha",
+    result: "shadowOffsetOuter1"
+  }), /*#__PURE__*/React.createElement("feGaussianBlur", {
+    stdDeviation: 2,
+    in: "shadowOffsetOuter1",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feColorMatrix", {
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0",
+    in: "shadowBlurOuter1"
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M34 36h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4h-8a4 4 0 0 1-4-4v-8a4 4 0 0 1 4-4Z",
+    id: createNewId("c")
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M59 19a4 4 0 0 1 4 4v7.314L51.686 19H59Z",
+    id: createNewId("f")
+  })), /*#__PURE__*/React.createElement("g", {
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M61.108 51.8H15.892a2.8 2.8 0 0 0-1.941.782L5.6 60.615V74.2a5.6 5.6 0 0 0 5.6 5.6h54.6a5.6 5.6 0 0 0 5.6-5.6V60.615l-8.35-8.033a2.8 2.8 0 0 0-1.942-.782Z",
+    fill: "#A6AAC3"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M51.686 19 63 30.314V66.2a2.8 2.8 0 0 1-2.8 2.8H16.8a2.8 2.8 0 0 1-2.8-2.8V25a6 6 0 0 1 6-6h31.686Z",
+    fill: "url(#".concat(createNewId("a"), ")")
+  }), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("use", {
+    fill: "#000",
+    filter: "url(#".concat(createNewId("b"), ")"),
+    xlinkHref: "#".concat(createNewId("c"))
+  }), /*#__PURE__*/React.createElement("path", {
+    stroke: "#FFF",
+    d: "M42 36.5c.966 0 1.841.392 2.475 1.025A3.489 3.489 0 0 1 45.5 40v8c0 .966-.392 1.841-1.025 2.475A3.489 3.489 0 0 1 42 51.5h-8a3.489 3.489 0 0 1-2.475-1.025A3.489 3.489 0 0 1 30.5 48v-8c0-.966.392-1.841 1.025-2.475A3.489 3.489 0 0 1 34 36.5Z",
+    strokeLinejoin: "round",
+    fill: "url(#".concat(createNewId("d"), ")")
+  })), /*#__PURE__*/React.createElement("g", {
+    transform: "rotate(180 57.343 24.657)"
+  }, /*#__PURE__*/React.createElement("use", {
+    fill: "#000",
+    filter: "url(#".concat(createNewId("e"), ")"),
+    xlinkHref: "#".concat(createNewId("f"))
+  }), /*#__PURE__*/React.createElement("use", {
+    fill: "url(#".concat(createNewId("g"), ")"),
+    xlinkHref: "#".concat(createNewId("f"))
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M82.6 42a.7.7 0 0 1 .7.7v1.399l1.4.001a.7.7 0 0 1 0 1.4l-1.4-.001V46.9a.7.7 0 0 1-1.4 0v-1.401l-1.4.001a.7.7 0 0 1 0-1.4l1.4-.001V42.7a.7.7 0 0 1 .7-.7ZM2.1 30.8c.29 0 .525.235.525.525l-.001.874.876.001a.7.7 0 0 1 0 1.4h-.876l.001.875a.525.525 0 1 1-1.05 0l-.001-.875H.7a.7.7 0 0 1 0-1.4l.874-.001.001-.874c0-.29.235-.525.525-.525Z",
+    fill: "#D6D8E4",
+    opacity: 0.3
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "m8.4 79.8-.17-.005A2.8 2.8 0 0 1 5.6 77V60.2h12.393l.175-.006c3.802-.04 7.95 5.943 19.61 6.19l.022-.002.022.002c10.856.218 15.009-5.902 19.558-6.175l.227-.009H71.4V77a2.8 2.8 0 0 1-2.63 2.795l-.17.005H8.4Z",
+    fill: "#D6D8E4"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M21 3.356S24.518 2.509 25.516 0c1.438 2.057 2.18 2.947 3.884 3.338-2.321.692-3.33 1.468-4.123 3.662-.912-2.584-1.741-2.919-4.277-3.644",
+    fill: "#D6D8E4",
+    opacity: 0.5
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M63 10.125S72.382 7.923 75.044 1.4c3.834 5.35 5.81 7.663 10.356 8.68-6.19 1.797-8.878 3.816-10.995 9.52-2.43-6.72-4.643-7.59-11.405-9.475",
+    fill: "#D6D8E4",
+    opacity: 0.8
+  }))) : /*#__PURE__*/React.createElement("svg", {
+    width: 56,
+    height: 53,
+    xmlns: "http://www.w3.org/2000/svg",
+    xmlnsXlink: "http://www.w3.org/1999/xlink"
+  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "5.718%",
+    y1: "4.311%",
+    x2: "83.05%",
+    y2: "88.915%",
+    id: createNewId("a")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#D4D8E4",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#A9B0C4",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "0%",
+    y1: "11.08%",
+    x2: "80.548%",
+    y2: "107.704%",
+    id: createNewId("d")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#C2C7DA",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#8F96B3",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    x1: "41.823%",
+    y1: "24.795%",
+    x2: "8.813%",
+    y2: "86.427%",
+    id: createNewId("g")
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#CCD0DD",
+    offset: "0%"
+  }), /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#9DA3B9",
+    offset: "100%"
+  })), /*#__PURE__*/React.createElement("filter", {
+    x: "-57.2%",
+    y: "-47.7%",
+    width: "233.4%",
+    height: "233.4%",
+    filterUnits: "objectBoundingBox",
+    id: createNewId("b")
+  }, /*#__PURE__*/React.createElement("feOffset", {
+    dx: 1,
+    dy: 2,
+    in: "SourceAlpha",
+    result: "shadowOffsetOuter1"
+  }), /*#__PURE__*/React.createElement("feGaussianBlur", {
+    stdDeviation: 2,
+    in: "shadowOffsetOuter1",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feComposite", {
+    in: "shadowBlurOuter1",
+    in2: "SourceAlpha",
+    operator: "out",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feColorMatrix", {
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.22 0",
+    in: "shadowBlurOuter1"
+  })), /*#__PURE__*/React.createElement("filter", {
+    x: "-94.4%",
+    y: "-121.3%",
+    width: "288.7%",
+    height: "288.7%",
+    filterUnits: "objectBoundingBox",
+    id: createNewId("e")
+  }, /*#__PURE__*/React.createElement("feOffset", {
+    dy: -2,
+    in: "SourceAlpha",
+    result: "shadowOffsetOuter1"
+  }), /*#__PURE__*/React.createElement("feGaussianBlur", {
+    stdDeviation: 2,
+    in: "shadowOffsetOuter1",
+    result: "shadowBlurOuter1"
+  }), /*#__PURE__*/React.createElement("feColorMatrix", {
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0",
+    in: "shadowBlurOuter1"
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M23.672 23.607h2.492a4 4 0 0 1 4 4v2.491a4 4 0 0 1-4 4h-2.492a4 4 0 0 1-4-4v-2.491a4 4 0 0 1 4-4Z",
+    id: createNewId("c")
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M37.311 12.459a4 4 0 0 1 4 4v3.419l-7.418-7.419h3.418Z",
+    id: createNewId("f")
+  })), /*#__PURE__*/React.createElement("g", {
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M39.682 33.967H10.81a2.8 2.8 0 0 0-1.94.782l-5.197 4.999v6.98a5.6 5.6 0 0 0 5.6 5.6H41.22a5.6 5.6 0 0 0 5.6-5.6v-6.98l-5.196-4.999a2.8 2.8 0 0 0-1.942-.782Z",
+    fill: "#A6AAC3"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "m33.893 12.459 7.418 7.419v22.568a2.8 2.8 0 0 1-2.8 2.8h-26.53a2.8 2.8 0 0 1-2.8-2.8V18.459a6 6 0 0 1 6-6h18.712Z",
+    fill: "url(#".concat(createNewId("a"), ")")
+  }), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("use", {
+    fill: "#000",
+    filter: "url(#".concat(createNewId("b"), ")"),
+    xlinkHref: "#".concat(createNewId("c"))
+  }), /*#__PURE__*/React.createElement("path", {
+    stroke: "#FFF",
+    d: "M26.164 24.107c.966 0 1.841.391 2.475 1.025a3.489 3.489 0 0 1 1.025 2.475v2.491c0 .967-.392 1.842-1.025 2.475a3.489 3.489 0 0 1-2.475 1.025h-2.492a3.489 3.489 0 0 1-2.475-1.025 3.489 3.489 0 0 1-1.025-2.475v-2.491c0-.967.392-1.842 1.025-2.475a3.489 3.489 0 0 1 2.475-1.025Z",
+    strokeLinejoin: "round",
+    fill: "url(#d)"
+  })), /*#__PURE__*/React.createElement("g", {
+    transform: "rotate(180 37.602 16.168)"
+  }, /*#__PURE__*/React.createElement("use", {
+    fill: "#000",
+    filter: "url(#".concat(createNewId("e"), ")"),
+    xlinkHref: "#".concat(createNewId("f"))
+  }), /*#__PURE__*/React.createElement("use", {
+    fill: "url(#".concat(createNewId("g"), ")"),
+    xlinkHref: "#".concat(createNewId("f"))
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M54.164 27.541c.253 0 .459.205.459.459v.918h.918a.459.459 0 1 1 0 .918h-.918v.918a.459.459 0 0 1-.918 0v-.918h-.918a.459.459 0 0 1 0-.918h.918V28c0-.254.205-.459.459-.459ZM1.377 20.197c.19 0 .344.154.344.344v.574h.574a.459.459 0 1 1 0 .918h-.574v.574a.344.344 0 0 1-.688 0l-.001-.574H.459a.459.459 0 0 1 0-.918h.573v-.574c0-.19.155-.344.345-.344Z",
+    fill: "#D6D8E4",
+    opacity: 0.3
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M24.787 43.53h.014c7.087.143 9.817-3.834 12.785-4.046l.19-.008h9.044v10.052a2.8 2.8 0 0 1-2.63 2.795l-.17.005H6.472l-.17-.005a2.8 2.8 0 0 1-2.63-2.795V39.475h8.126l.144-.004c2.485.004 5.214 3.898 12.83 4.06l.015-.002Z",
+    fill: "#D6D8E4"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M13.77 2.2s2.308-.555 2.962-2.2c.943 1.35 1.429 1.933 2.547 2.189-1.522.453-2.183.963-2.704 2.401-.598-1.695-1.142-1.914-2.805-2.39",
+    fill: "#D6D8E4",
+    opacity: 0.5
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M41.311 6.64S47.464 5.194 49.21.917c2.514 3.508 3.81 5.025 6.791 5.691-4.059 1.18-5.822 2.503-7.21 6.243-1.594-4.406-3.045-4.976-7.479-6.213",
+    fill: "#D6D8E4",
+    opacity: 0.8
+  })));
 }
 
 /**
@@ -12138,14 +12152,13 @@ function EasyopsEmpty(props) {
   var _props$imageStyle;
 
   var illustration = useMemo(() => props.illustration && getIllustration(props.illustration), [props.illustration]);
-
-  var _emptyImage = props.useBigEmptyImage ? SvgBigEmptyImage : SvgEmptyImage;
-
-  var image = props.illustration ? illustration : /*#__PURE__*/React__default.createElement(_emptyImage);
+  var image = props.illustration ? illustration : /*#__PURE__*/React.createElement(EmptySvg, {
+    isBig: props.useBigEmptyImage
+  });
   var imageStyle = (_props$imageStyle = props.imageStyle) !== null && _props$imageStyle !== void 0 ? _props$imageStyle : props.useBigEmptyImage ? undefined : {
     height: "60px"
   };
-  return /*#__PURE__*/React__default.createElement(Empty, {
+  return /*#__PURE__*/React.createElement(Empty, {
     image: image,
     imageStyle: imageStyle,
     description: props.description,
@@ -12159,7 +12172,7 @@ function EasyopsEmpty(props) {
  */
 
 function renderEasyopsEmpty() {
-  return /*#__PURE__*/React__default.createElement(EasyopsEmpty, null);
+  return /*#__PURE__*/React.createElement(EasyopsEmpty, null);
 }
 
 var FeatureFlagsContext = /*#__PURE__*/createContext(null);
@@ -12229,7 +12242,7 @@ function useFeatureFlags(name) {
 
 function DisplayByFeatureFlags(props) {
   var featureFlags = useFeatureFlags(props.name);
-  return featureFlags.every(flag => !!flag) ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, props.children) : props !== null && props !== void 0 && props.fallback ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, props === null || props === void 0 ? void 0 : props.fallback) : null;
+  return featureFlags.every(flag => !!flag) ? /*#__PURE__*/React.createElement(React.Fragment, null, props.children) : props !== null && props !== void 0 && props.fallback ? /*#__PURE__*/React.createElement(React.Fragment, null, props === null || props === void 0 ? void 0 : props.fallback) : null;
 }
 
 /**
@@ -12239,15 +12252,15 @@ function BrickWrapper(props) {
   var locale = i18next.language && i18next.language.split("-")[0] === "en" ? defaultLocale : zhCN; // istanbul ignore next
 
   var featureFlags = process.env.NODE_ENV === "test" ? {} : getRuntime().getFeatureFlags();
-  return /*#__PURE__*/React__default.createElement(ErrorBoundary, null, /*#__PURE__*/React__default.createElement(FeatureFlagsProvider, {
+  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(FeatureFlagsProvider, {
     value: featureFlags
-  }, /*#__PURE__*/React__default.createElement(ConfigProvider, {
+  }, /*#__PURE__*/React.createElement(ConfigProvider, {
     locale: locale,
     autoInsertSpaceInButton: false,
     renderEmpty: () => {
       var _props$wrapperConfig;
 
-      return /*#__PURE__*/React__default.createElement(EasyopsEmpty, (_props$wrapperConfig = props.wrapperConfig) === null || _props$wrapperConfig === void 0 ? void 0 : _props$wrapperConfig.empty);
+      return /*#__PURE__*/React.createElement(EasyopsEmpty, (_props$wrapperConfig = props.wrapperConfig) === null || _props$wrapperConfig === void 0 ? void 0 : _props$wrapperConfig.empty);
     }
   }, props.children)));
 }