@carbon/ibm-products 2.65.0 → 2.66.0

package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js

@@ -18,31 +18,31 @@ var EmptyStateContent = require('../EmptyStateContent.js');
 var NotFoundIllustration = require('../assets/NotFoundIllustration.js');
 var EmptyState = require('../EmptyState.js');
 
-var _excluded = ["action", "className", "illustrationPosition", "illustrationTheme", "illustrationDescription", "link", "size", "headingAs", "subtitle", "title"];
-
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--empty-state");
-var componentName = 'NotFoundEmptyState';
+const blockClass = `${settings.pkg.prefix}--empty-state`;
+const componentName = 'NotFoundEmptyState';
 /**
  * The `EmptyState` component follows the Carbon guidelines for empty states with some added specifications around illustration usage. For additional usage guidelines and documentation please refer to the links above.
  */
-exports.NotFoundEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var action = _ref.action,
-    className = _ref.className,
-    _ref$illustrationPosi = _ref.illustrationPosition,
-    illustrationPosition = _ref$illustrationPosi === void 0 ? EmptyState.defaults.position : _ref$illustrationPosi,
-    illustrationTheme = _ref.illustrationTheme,
-    illustrationDescription = _ref.illustrationDescription,
-    link = _ref.link,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? EmptyState.defaults.size : _ref$size,
-    _ref$headingAs = _ref.headingAs,
-    headingAs = _ref$headingAs === void 0 ? EmptyState.defaults.headingAs : _ref$headingAs,
-    subtitle = _ref.subtitle,
-    title = _ref.title,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+exports.NotFoundEmptyState = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    action,
+    className,
+    illustrationPosition = EmptyState.defaults.position,
+    illustrationTheme,
+    illustrationDescription,
+    link,
+    size = EmptyState.defaults.size,
+    headingAs = EmptyState.defaults.headingAs,
+    subtitle,
+    title,
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref;
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
-    className: cx(blockClass, className, "".concat(blockClass, "-position--").concat(illustrationPosition), "".concat(blockClass, "-type--notFound")),
+    className: cx(blockClass, className, `${blockClass}-position--${illustrationPosition}`, `${blockClass}-type--notFound`),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(NotFoundIllustration.NotFoundIllustration, {
     theme: illustrationTheme,
@@ -72,13 +72,15 @@ exports.NotFoundEmptyState.propTypes = {
   /**
    * Empty state action button
    */
-  action: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
+  action: index.default.shape({
+    /**@ts-ignore*/
+    ...react.Button.propTypes,
     kind: index.default.oneOf(['primary', 'secondary', 'tertiary']),
     renderIcon: index.default.oneOfType([index.default.func, index.default.object]),
     /**@ts-ignore*/
     onClick: react.Button.propTypes.onClick,
     text: index.default.string
-  })),
+  }),
   /**
    * Provide an optional class to be applied to the containing node.
    */
@@ -106,10 +108,11 @@ exports.NotFoundEmptyState.propTypes = {
    * Empty state link object
    */
   /**@ts-ignore*/
-  link: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Link.propTypes), {}, {
+  link: index.default.shape({
+    ...react.Link.propTypes,
     text: index.default.oneOfType([index.default.string, index.default.node]),
     href: index.default.string
-  })),
+  }),
   /**
    * Empty state size
    */

package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js

@@ -18,31 +18,31 @@ var EmptyStateContent = require('../EmptyStateContent.js');
 var NotificationsIllustration = require('../assets/NotificationsIllustration.js');
 var EmptyState = require('../EmptyState.js');
 
-var _excluded = ["action", "className", "illustrationPosition", "illustrationTheme", "illustrationDescription", "link", "size", "headingAs", "subtitle", "title"];
-
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--empty-state");
-var componentName = 'NotificationsEmptyState';
+const blockClass = `${settings.pkg.prefix}--empty-state`;
+const componentName = 'NotificationsEmptyState';
 /**
  * The `EmptyState` component follows the Carbon guidelines for empty states with some added specifications around illustration usage. For additional usage guidelines and documentation please refer to the links above.
  */
-exports.NotificationsEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var action = _ref.action,
-    className = _ref.className,
-    _ref$illustrationPosi = _ref.illustrationPosition,
-    illustrationPosition = _ref$illustrationPosi === void 0 ? EmptyState.defaults.position : _ref$illustrationPosi,
-    illustrationTheme = _ref.illustrationTheme,
-    illustrationDescription = _ref.illustrationDescription,
-    link = _ref.link,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? EmptyState.defaults.size : _ref$size,
-    _ref$headingAs = _ref.headingAs,
-    headingAs = _ref$headingAs === void 0 ? EmptyState.defaults.headingAs : _ref$headingAs,
-    subtitle = _ref.subtitle,
-    title = _ref.title,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+exports.NotificationsEmptyState = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    action,
+    className,
+    illustrationPosition = EmptyState.defaults.position,
+    illustrationTheme,
+    illustrationDescription,
+    link,
+    size = EmptyState.defaults.size,
+    headingAs = EmptyState.defaults.headingAs,
+    subtitle,
+    title,
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref;
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
-    className: cx(blockClass, className, "".concat(blockClass, "-position--").concat(illustrationPosition), "".concat(blockClass, "-type--notifications")),
+    className: cx(blockClass, className, `${blockClass}-position--${illustrationPosition}`, `${blockClass}-type--notifications`),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(NotificationsIllustration.NotificationsIllustration, {
     size: size,
@@ -72,13 +72,15 @@ exports.NotificationsEmptyState.propTypes = {
   /**
    * Empty state action button
    */
-  action: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
+  action: index.default.shape({
+    /**@ts-ignore*/
+    ...react.Button.propTypes,
     kind: index.default.oneOf(['primary', 'secondary', 'tertiary']),
     renderIcon: index.default.oneOfType([index.default.func, index.default.object]),
     /**@ts-ignore*/
     onClick: react.Button.propTypes.onClick,
     text: index.default.string
-  })),
+  }),
   /**
    * Provide an optional class to be applied to the containing node.
    */
@@ -106,10 +108,11 @@ exports.NotificationsEmptyState.propTypes = {
    * Empty state link object
    */
   /**@ts-ignore*/
-  link: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Link.propTypes), {}, {
+  link: index.default.shape({
+    ...react.Link.propTypes,
     text: index.default.oneOfType([index.default.string, index.default.node]),
     href: index.default.string
-  })),
+  }),
   /**
    * Empty state size
    */

package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js

@@ -18,31 +18,31 @@ var EmptyStateContent = require('../EmptyStateContent.js');
 var UnauthorizedIllustration = require('../assets/UnauthorizedIllustration.js');
 var EmptyState = require('../EmptyState.js');
 
-var _excluded = ["action", "className", "illustrationPosition", "illustrationTheme", "illustrationDescription", "link", "size", "headingAs", "subtitle", "title"];
-
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--empty-state");
-var componentName = 'UnauthorizedEmptyState';
+const blockClass = `${settings.pkg.prefix}--empty-state`;
+const componentName = 'UnauthorizedEmptyState';
 /**
  * The `EmptyState` component follows the Carbon guidelines for empty states with some added specifications around illustration usage. For additional usage guidelines and documentation please refer to the links above.
  */
-exports.UnauthorizedEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var action = _ref.action,
-    className = _ref.className,
-    _ref$illustrationPosi = _ref.illustrationPosition,
-    illustrationPosition = _ref$illustrationPosi === void 0 ? EmptyState.defaults.position : _ref$illustrationPosi,
-    illustrationTheme = _ref.illustrationTheme,
-    illustrationDescription = _ref.illustrationDescription,
-    link = _ref.link,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? EmptyState.defaults.size : _ref$size,
-    _ref$headingAs = _ref.headingAs,
-    headingAs = _ref$headingAs === void 0 ? EmptyState.defaults.headingAs : _ref$headingAs,
-    subtitle = _ref.subtitle,
-    title = _ref.title,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+exports.UnauthorizedEmptyState = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    action,
+    className,
+    illustrationPosition = EmptyState.defaults.position,
+    illustrationTheme,
+    illustrationDescription,
+    link,
+    size = EmptyState.defaults.size,
+    headingAs = EmptyState.defaults.headingAs,
+    subtitle,
+    title,
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref;
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
-    className: cx(blockClass, className, "".concat(blockClass, "-position--").concat(illustrationPosition), "".concat(blockClass, "-type--unauthorized")),
+    className: cx(blockClass, className, `${blockClass}-position--${illustrationPosition}`, `${blockClass}-type--unauthorized`),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(UnauthorizedIllustration.UnauthorizedIllustration, {
     size: size,
@@ -72,13 +72,15 @@ exports.UnauthorizedEmptyState.propTypes = {
   /**
    * Empty state action button
    */
-  action: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
+  action: index.default.shape({
+    /**@ts-ignore*/
+    ...react.Button.propTypes,
     kind: index.default.oneOf(['primary', 'secondary', 'tertiary']),
     renderIcon: index.default.oneOfType([index.default.func, index.default.object]),
     /**@ts-ignore*/
     onClick: react.Button.propTypes.onClick,
     text: index.default.string
-  })),
+  }),
   /**
    * Provide an optional class to be applied to the containing node.
    */
@@ -106,10 +108,11 @@ exports.UnauthorizedEmptyState.propTypes = {
    * Empty state link object
    */
   /**@ts-ignore*/
-  link: index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Link.propTypes), {}, {
+  link: index.default.shape({
+    ...react.Link.propTypes,
     text: index.default.oneOfType([index.default.string, index.default.node]),
     href: index.default.string
-  })),
+  }),
   /**
    * Empty state size
    */

package/lib/components/EmptyStates/assets/ErrorIllustration.js

@@ -17,26 +17,27 @@ var settings = require('../../../settings.js');
 var useId = require('../../../global/js/utils/useId.js');
 
 var _stop, _stop2, _stop3, _stop4, _stop5, _stop6, _stop7, _stop8, _path, _path2, _path3, _stop9, _stop10, _stop11, _stop12, _stop13, _stop14, _stop15, _stop16, _stop17, _stop18, _stop19, _stop20, _stop21, _stop22, _stop23, _stop24, _stop25, _stop26, _path4;
-var _excluded = ["theme", "size", "alt"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--empty-state");
-var ErrorIllustration = function ErrorIllustration(_ref) {
-  var theme = _ref.theme,
-    size = _ref.size,
-    alt = _ref.alt,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var svgId = useId.useId();
+const blockClass = `${settings.pkg.prefix}--empty-state`;
+const ErrorIllustration = _ref => {
+  let {
+    theme,
+    size,
+    alt,
+    ...rest
+  } = _ref;
+  const svgId = useId.useId();
   return /*#__PURE__*/React.createElement("svg", _rollupPluginBabelHelpers.extends({}, rest, {
     xmlns: "http://www.w3.org/2000/svg",
     width: 80,
     height: 80,
     viewBox: "0 0 80 80",
-    className: cx(["".concat(blockClass, "__illustration"), "".concat(blockClass, "__illustration-error"), "".concat(blockClass, "__illustration--").concat(size)]),
+    className: cx([`${blockClass}__illustration`, `${blockClass}__illustration-error`, `${blockClass}__illustration--${size}`]),
     role: "img",
     "aria-hidden": "true"
   }), /*#__PURE__*/React.createElement("title", null, alt), theme === 'dark' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__a_dark_".concat(svgId),
+    id: `prefix__a_dark_${svgId}`,
     x1: 38.9,
     y1: 77.08,
     x2: 38.9,
@@ -49,7 +50,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 1,
     stopColor: "#393939"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__b_dark_".concat(svgId),
+    id: `prefix__b_dark_${svgId}`,
     x1: 12.43,
     y1: 10.8,
     x2: 76.33,
@@ -68,7 +69,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 0.99,
     stopColor: "#161616"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__c_dark_".concat(svgId),
+    id: `prefix__c_dark_${svgId}`,
     x1: 39.38,
     y1: 31.37,
     x2: 52.04,
@@ -89,18 +90,18 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     d: "M59.91 78.34l-43-24.83 4.86-2.81 43 24.83-4.86 2.81z"
   })), /*#__PURE__*/React.createElement("path", {
     d: "M39 6.92c12.15 7 22 24 21.92 38S51 64.49 38.83 57.48s-22-24-21.92-38S26.83-.09 39 6.92z",
-    fill: "url(#prefix__a_dark_".concat(svgId, ")")
+    fill: `url(#prefix__a_dark_${svgId})`
   }), /*#__PURE__*/React.createElement("path", {
     d: "M42.85 4.68C36.74 1.15 31.2.82 27.2 3.15l-3.66 2.13C27.52 3.08 33 3.45 39 6.92c12.15 7 22 24 21.92 38 0 6.77-2.35 11.58-6.13 13.94h-.07c-.32.2 3.66-2.1 3.66-2.1 4-2.3 6.39-7.18 6.41-14.12C64.81 28.7 55 11.69 42.85 4.68z",
-    fill: "url(#prefix__b_dark_".concat(svgId, ")")
+    fill: `url(#prefix__b_dark_${svgId})`
   }), /*#__PURE__*/React.createElement("path", {
     d: "M29.11 3.91v.36a19.59 19.59 0 019.68 3c12 6.94 21.78 23.84 21.74 37.65 0 9.4-4.56 15.23-11.83 15.23a19.54 19.54 0 01-9.68-3C27 50.21 17.24 33.32 17.28 19.5c0-9.39 4.56-15.23 11.83-15.23v-.36m0 0c-7.21 0-12.17 5.71-12.2 15.59 0 14 9.77 31 21.92 38a20.12 20.12 0 009.87 3c7.21 0 12.17-5.71 12.2-15.6 0-13.95-9.77-30.95-21.92-38a20 20 0 00-9.87-3z",
-    fill: "url(#prefix__c_dark_".concat(svgId, ")")
+    fill: `url(#prefix__c_dark_${svgId})`
   }), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
     d: "M38.93 49.79a6.9 6.9 0 01-2.66-2.51 6.11 6.11 0 01-.81-3v-1a2.26 2.26 0 01.81-2c.54-.35 1.43-.17 2.66.54a6.71 6.71 0 012.61 2.5 6.06 6.06 0 01.81 3v1a2.24 2.24 0 01-.81 2.05c-.54.29-1.41.12-2.61-.58zm-1.16-11.63L36 22.77V13l5.81 3.36v9.73l-1.64 13.46z",
     fill: "#525252"
   }))) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__a_".concat(svgId),
+    id: `prefix__a_${svgId}`,
     x1: 29.96,
     y1: 45.68,
     x2: 53.15,
@@ -114,7 +115,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 1,
     stopOpacity: 0.1
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__b_".concat(svgId),
+    id: `prefix__b_${svgId}`,
     x1: 38.9,
     y1: 52.59,
     x2: 38.9,
@@ -127,7 +128,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 0.78,
     stopColor: "#e0e0e0"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__c_".concat(svgId),
+    id: `prefix__c_${svgId}`,
     x1: 18.07,
     y1: 14.06,
     x2: 71.64,
@@ -155,7 +156,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 1,
     stopColor: "#8d8d8d"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__d_".concat(svgId),
+    id: `prefix__d_${svgId}`,
     x1: 27.94,
     y1: 51.19,
     x2: 49.87,
@@ -173,7 +174,7 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     offset: 0.94,
     stopColor: "#fff"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__e_".concat(svgId),
+    id: `prefix__e_${svgId}`,
     x1: 28.66,
     y1: 26.33,
     x2: 47.15,
@@ -195,20 +196,20 @@ var ErrorIllustration = function ErrorIllustration(_ref) {
     fill: "none",
     d: "M0 0h80v80H0z"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__a_".concat(svgId, ")"),
+    fill: `url(#prefix__a_${svgId})`,
     d: "M59.91 78.34l-43-24.83 4.86-2.81 43 24.83-4.86 2.81z"
   }), /*#__PURE__*/React.createElement("path", {
     d: "M39 6.92c12.15 7 22 24 21.92 38S51 64.49 38.83 57.48s-22-24-21.92-38S26.83-.09 39 6.92z",
-    fill: "url(#prefix__b_".concat(svgId, ")")
+    fill: `url(#prefix__b_${svgId})`
   }), /*#__PURE__*/React.createElement("path", {
     d: "M42.85 4.68C36.74 1.15 31.2.82 27.2 3.15l-3.66 2.13C27.52 3.08 33 3.45 39 6.92c12.15 7 22 24 21.92 38 0 6.77-2.35 11.58-6.13 13.94h-.07c-.32.2 3.66-2.1 3.66-2.1 4-2.3 6.39-7.18 6.41-14.12C64.81 28.7 55 11.69 42.85 4.68z",
-    fill: "url(#prefix__c_".concat(svgId, ")")
+    fill: `url(#prefix__c_${svgId})`
   }), /*#__PURE__*/React.createElement("path", {
     d: "M29.11 3.91v.36a19.59 19.59 0 019.68 3c12 6.94 21.78 23.84 21.74 37.65 0 9.4-4.56 15.23-11.83 15.23a19.54 19.54 0 01-9.68-3C27 50.21 17.24 33.32 17.28 19.5c0-9.39 4.56-15.23 11.83-15.23v-.36m0 0c-7.21 0-12.17 5.71-12.2 15.59 0 14 9.77 31 21.92 38a20.12 20.12 0 009.87 3c7.21 0 12.17-5.71 12.2-15.6 0-13.95-9.77-30.95-21.92-38a20 20 0 00-9.87-3z",
-    fill: "url(#prefix__d_".concat(svgId, ")")
+    fill: `url(#prefix__d_${svgId})`
   }), /*#__PURE__*/React.createElement("path", {
     d: "M38.93 49.79a6.9 6.9 0 01-2.66-2.51 6.11 6.11 0 01-.81-3v-1a2.26 2.26 0 01.81-2c.54-.35 1.43-.17 2.66.54a6.71 6.71 0 012.61 2.5 6.06 6.06 0 01.81 3v1a2.24 2.24 0 01-.81 2.05c-.54.29-1.41.12-2.61-.58zm-1.16-11.63L36 22.77V13l5.81 3.36v9.73l-1.64 13.46z",
-    fill: "url(#prefix__e_".concat(svgId, ")")
+    fill: `url(#prefix__e_${svgId})`
   })));
 };
 ErrorIllustration.propTypes = {

package/lib/components/EmptyStates/assets/NoDataIllustration.js

@@ -17,26 +17,27 @@ var settings = require('../../../settings.js');
 var useId = require('../../../global/js/utils/useId.js');
 
 var _stop, _stop2, _stop3, _stop4, _stop5, _stop6, _path, _path2, _path3, _path4, _path5, _stop7, _stop8, _stop9, _stop10, _stop11, _stop12, _stop13, _stop14, _path6, _path7, _path8;
-var _excluded = ["theme", "size", "alt"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--empty-state");
-var NoDataIllustration = function NoDataIllustration(_ref) {
-  var theme = _ref.theme,
-    size = _ref.size,
-    alt = _ref.alt,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var svgId = useId.useId();
+const blockClass = `${settings.pkg.prefix}--empty-state`;
+const NoDataIllustration = _ref => {
+  let {
+    theme,
+    size,
+    alt,
+    ...rest
+  } = _ref;
+  const svgId = useId.useId();
   return /*#__PURE__*/React.createElement("svg", _rollupPluginBabelHelpers.extends({}, rest, {
     xmlns: "http://www.w3.org/2000/svg",
     width: 80,
     height: 80,
     viewBox: "0 0 80 80",
-    className: cx(["".concat(blockClass, "__illustration"), "".concat(blockClass, "__illustration-noData"), "".concat(blockClass, "__illustration--").concat(size)]),
+    className: cx([`${blockClass}__illustration`, `${blockClass}__illustration-noData`, `${blockClass}__illustration--${size}`]),
     role: "img",
     "aria-hidden": "true"
   }), /*#__PURE__*/React.createElement("title", null, alt), theme === 'dark' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__a_dark_".concat(svgId),
+    id: `prefix__a_dark_${svgId}`,
     x1: 11.12,
     y1: 43.34,
     x2: 40,
@@ -49,7 +50,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     offset: 1,
     stopColor: "#262626"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__b_dark_".concat(svgId),
+    id: `prefix__b_dark_${svgId}`,
     x1: 40,
     y1: 43.34,
     x2: 68.88,
@@ -62,7 +63,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     offset: 1,
     stopColor: "#262626"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__c_dark_".concat(svgId),
+    id: `prefix__c_dark_${svgId}`,
     x1: 32.78,
     y1: 30.83,
     x2: 47.22,
@@ -81,13 +82,13 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     opacity: 0.25,
     d: "M40 78.34L11.13 61.67 40 45.01l28.86 16.66L40 78.34z"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__a_dark_".concat(svgId, ")"),
+    fill: `url(#prefix__a_dark_${svgId})`,
     d: "M40 68.35L11.12 51.68l.01-33.35L40 34.99v33.36z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__b_dark_".concat(svgId, ")"),
+    fill: `url(#prefix__b_dark_${svgId})`,
     d: "M68.88 51.68L40 68.35V34.99l28.87-16.66.01 33.35z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__c_dark_".concat(svgId, ")"),
+    fill: `url(#prefix__c_dark_${svgId})`,
     d: "M40 34.99L11.13 18.33 40 1.66l28.87 16.67L40 34.99z"
   }), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
     fill: "#262626",
@@ -99,7 +100,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     fill: "#525252",
     d: "M21.49 33.33l-8.2-4.73.01-5.69 8.19 4.74v5.68z"
   }))) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__a_".concat(svgId),
+    id: `prefix__a_${svgId}`,
     x1: 18.35,
     y1: 74.17,
     x2: 61.65,
@@ -113,7 +114,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     offset: 1,
     stopOpacity: 0.1
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__b_".concat(svgId),
+    id: `prefix__b_${svgId}`,
     x1: 15.16,
     y1: 43.34,
     x2: 40.31,
@@ -126,7 +127,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     offset: 1,
     stopColor: "#c6c6c6"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__c_".concat(svgId),
+    id: `prefix__c_${svgId}`,
     x1: 40,
     y1: 43.34,
     x2: 68.88,
@@ -139,7 +140,7 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     offset: 1,
     stopColor: "#c6c6c6"
   }))), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "prefix__d_".concat(svgId),
+    id: `prefix__d_${svgId}`,
     x1: 18.35,
     y1: 30.83,
     x2: 61.65,
@@ -155,16 +156,16 @@ var NoDataIllustration = function NoDataIllustration(_ref) {
     fill: "none",
     d: "M0 0h80v80H0z"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__a_".concat(svgId, ")"),
+    fill: `url(#prefix__a_${svgId})`,
     d: "M40 78.34L11.13 61.67 40 45.01l28.86 16.66L40 78.34z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__b_".concat(svgId, ")"),
+    fill: `url(#prefix__b_${svgId})`,
     d: "M40 68.35L11.12 51.68l.01-33.35L40 34.99v33.36z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__c_".concat(svgId, ")"),
+    fill: `url(#prefix__c_${svgId})`,
     d: "M68.88 51.68L40 68.35V34.99l28.87-16.66.01 33.35z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__d_".concat(svgId, ")"),
+    fill: `url(#prefix__d_${svgId})`,
     d: "M40 34.99L11.13 18.33 40 1.66l28.87 16.67L40 34.99z"
   }), _path7 || (_path7 = /*#__PURE__*/React.createElement("path", {
     fill: "#c6c6c6",