@bundle-stats/ui 3.1.4-alpha.0 → 3.2.1-alpha.0

package/lib-esm/components/metrics-table-search/metrics-table-search.js

@@ -5,32 +5,30 @@ import cx from 'classnames';
 import { Icon } from '../../ui/icon';
 import { Input } from '../../ui/input';
 import css from './metrics-table-search.module.css';
-export var MetricsTableSearch = function MetricsTableSearch(props) {
-  var className = props.className,
-      placeholder = props.placeholder,
-      search = props.search,
-      updateSearch = props.updateSearch;
-  var rootClassname = cx(css.root, className);
+export const MetricsTableSearch = props => {
+  const {
+    className,
+    placeholder,
+    search,
+    updateSearch
+  } = props;
+  const rootClassname = cx(css.root, className);
+  const [value, setValue] = useState(search); // Update local state when initial value has changed
 
-  var _useState = useState(search),
-      value = _useState[0],
-      setValue = _useState[1]; // Update local state when initial value has changed
-
-
-  useEffect(function () {
+  useEffect(() => {
     setValue(search);
   }, [search]);
-  var debouncedUpdateSearch = useCallback(_debounce(updateSearch, 500), []);
-  var handleChangeValue = useCallback(function (event) {
-    var newValue = event.target.value;
+  const debouncedUpdateSearch = useCallback(_debounce(updateSearch, 500), []);
+  const handleChangeValue = useCallback(event => {
+    const newValue = event.target.value;
     setValue(newValue); // Update parent state when the local value has changed
 
     if (newValue !== search) {
       debouncedUpdateSearch(newValue);
     }
   }, [search]);
-  var handleClearValue = useCallback(function () {
-    var newValue = '';
+  const handleClearValue = useCallback(() => {
+    const newValue = '';
     setValue(newValue);
     updateSearch(newValue);
   }, []);
@@ -41,7 +39,8 @@ export var MetricsTableSearch = function MetricsTableSearch(props) {
     placeholder: placeholder,
     onChange: handleChangeValue,
     value: value,
-    size: "small"
+    size: "small",
+    autoComplete: "off"
   }), search && /*#__PURE__*/React.createElement("button", {
     className: css.cancelButton,
     type: "button",

package/lib-esm/components/metrics-table-search/metrics-table-search.module.css

@@ -5,6 +5,7 @@
 }
 
 .input {
+  height: var(--space-large);
   border-color: var(--color-outline);
 }
 
@@ -26,7 +27,7 @@
   padding: var(--space-xxsmall);
   width: var(--space-large);
   height: var(--space-large);
-  background: radial-gradient(var(--color-background), transparent 75%);
+  background: radial-gradient(var(--color-background) 50%, transparent);
   color: var(--color-text-ultra-light);
   transition: var(--transition-in);
 }

package/lib-esm/components/metrics-table-search/metrics-table-search.stories.js

@@ -2,14 +2,11 @@ import React, { useState } from 'react';
 import { storiesOf } from '@storybook/react';
 import { getWrapperDecorator } from '../../stories';
 import { MetricsTableSearch } from '.';
-var stories = storiesOf('Components/MetricsTableSearch', module);
+const stories = storiesOf('Components/MetricsTableSearch', module);
 stories.addDecorator(getWrapperDecorator());
 
-var MetricsTableWithState = function MetricsTableWithState() {
-  var _useState = useState(''),
-      search = _useState[0],
-      updateSearch = _useState[1];
-
+const MetricsTableWithState = () => {
+  const [search, updateSearch] = useState('');
   return /*#__PURE__*/React.createElement(MetricsTableSearch, {
     placeholder: "Search name",
     search: search,
@@ -17,6 +14,4 @@ var MetricsTableWithState = function MetricsTableWithState() {
   });
 };
 
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(MetricsTableWithState, null);
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(MetricsTableWithState, null));

package/lib-esm/components/metrics-table-title/metrics-table-title.js

@@ -6,13 +6,15 @@ import { FlexStack } from '../../layout/flex-stack';
 import { Stack } from '../../layout/stack';
 import { Popover } from '../../ui/popover';
 import css from './metrics-table-title.module.css';
-export var MetricsTableTitle = function MetricsTableTitle(props) {
-  var className = props.className,
-      title = props.title,
-      info = props.info,
-      popoverInfo = props.popoverInfo,
-      popoverHref = props.popoverHref;
-  var rootClassName = cx(css.root, className);
+export const MetricsTableTitle = props => {
+  const {
+    className,
+    title,
+    info,
+    popoverInfo,
+    popoverHref
+  } = props;
+  const rootClassName = cx(css.root, className);
   return /*#__PURE__*/React.createElement(Stack, {
     space: "xxxsmall",
     className: rootClassName

package/lib-esm/components/module-info/module-info.js

@@ -11,20 +11,22 @@ import { Stack } from '../../layout/stack';
 import { FileName } from '../../ui/file-name';
 import { ComponentLink } from '../component-link';
 import css from './module-info.module.css';
-export var ModuleInfo = function ModuleInfo(props) {
-  var className = props.className,
-      item = props.item,
-      labels = props.labels,
-      chunks = props.chunks,
-      chunkIds = props.chunkIds,
-      CustomComponentLink = props.customComponentLink,
-      onClick = props.onClick;
+export const ModuleInfo = props => {
+  const {
+    className,
+    item,
+    labels,
+    chunks,
+    chunkIds,
+    customComponentLink: CustomComponentLink,
+    onClick
+  } = props;
   return /*#__PURE__*/React.createElement(Stack, {
     space: "small",
     className: className
-  }, item.runs.map(function (run, index) {
-    var TitleComponent = index !== 0 ? 'h4' : 'h3';
-    var key = "module-info-" + ((run == null ? void 0 : run.name) || index) + "-" + index;
+  }, item.runs.map((run, index) => {
+    const TitleComponent = index !== 0 ? 'h4' : 'h3';
+    const key = `module-info-${(run == null ? void 0 : run.name) || index}-${index}`;
     return /*#__PURE__*/React.createElement(Stack, {
       space: "xxxsmall",
       key: key
@@ -32,8 +34,8 @@ export var ModuleInfo = function ModuleInfo(props) {
       className: css.chunks
     }, /*#__PURE__*/React.createElement("strong", {
       className: css.chunksTitle
-    }, "Chunks:"), run.chunkIds.map(function (chunkId) {
-      var chunk = _find(chunks, {
+    }, "Chunks:"), run.chunkIds.map(chunkId => {
+      const chunk = _find(chunks, {
         id: chunkId
       });
 

package/lib-esm/components/module-info/module-info.stories.js

@@ -2,26 +2,24 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { getWrapperDecorator } from '../../stories';
 import { ModuleInfo } from '.';
-var stories = storiesOf('Components/ModuleInfo', module);
+const stories = storiesOf('Components/ModuleInfo', module);
 stories.addDecorator(getWrapperDecorator());
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(ModuleInfo, {
-    item: {
-      runs: [{
-        key: './node_modules/lodash/fp/_baseConvert.js',
-        name: './node_modules/lodash/fp/_baseConvert.js',
-        chunkIds: ['2']
-      }, {
-        key: './node_modules/lodash/fp/_baseConvert.js',
-        name: './node_modules/lodash/fp/_baseConvert.js',
-        chunkIds: ['2']
-      }]
-    },
-    chunks: [{
-      id: '2',
-      name: 'vendors'
-    }],
-    chunkIds: ['1', '2'],
-    labels: ['Job #2', 'Job #1']
-  });
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(ModuleInfo, {
+  item: {
+    runs: [{
+      key: './node_modules/lodash/fp/_baseConvert.js',
+      name: './node_modules/lodash/fp/_baseConvert.js',
+      chunkIds: ['2']
+    }, {
+      key: './node_modules/lodash/fp/_baseConvert.js',
+      name: './node_modules/lodash/fp/_baseConvert.js',
+      chunkIds: ['2']
+    }]
+  },
+  chunks: [{
+    id: '2',
+    name: 'vendors'
+  }],
+  chunkIds: ['1', '2'],
+  labels: ['Job #2', 'Job #1']
+}));

package/lib-esm/components/summary/summary.js

@@ -1,13 +1,7 @@
 import _get from "lodash/get";
 
-var _PropTypes$shape;
-
-var _excluded = ["className"];
-
 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); }
 
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
@@ -18,48 +12,38 @@ import { FlexStack } from '../../layout/flex-stack';
 import { ComponentLink } from '../component-link';
 import { SummaryItem } from '../summary-item';
 import css from './summary.module.css';
-export var Summary = function Summary(_ref) {
-  var className = _ref.className,
-      size = _ref.size,
-      keys = _ref.keys,
-      data = _ref.data,
-      loading = _ref.loading,
-      showSummaryItemDelta = _ref.showSummaryItemDelta,
-      SummaryItemCustomLink = _ref.summaryItemLink;
-  return /*#__PURE__*/React.createElement(Box, {
-    outline: true,
-    className: cx(css.root, className)
-  }, /*#__PURE__*/React.createElement(FlexStack, {
-    className: css.items
-  }, Array.from(METRIC_COMPONENT_LINKS).filter(function (_ref2) {
-    var metricId = _ref2[0];
-    return keys.includes(metricId);
-  }).map(function (_ref3) {
-    var metricId = _ref3[0],
-        metricOptions = _ref3[1];
-    return /*#__PURE__*/React.createElement(SummaryItem, {
-      as: function as(_ref4) {
-        var itemClassName = _ref4.className,
-            itemProps = _objectWithoutPropertiesLoose(_ref4, _excluded);
-
-        return /*#__PURE__*/React.createElement(Box, _extends({
-          padding: ['xsmall', 'small'],
-          className: cx(itemClassName, css.summaryItemLink)
-        }, itemProps, {
-          as: SummaryItemCustomLink
-        }, metricOptions.link));
-      },
-      size: size,
-      key: metricId,
-      id: metricId,
-      data: _get(data, metricId),
-      loading: loading,
-      showMetricDescription: true,
-      showDelta: showSummaryItemDelta && metricOptions.showDelta !== false,
-      className: css.item
-    });
-  })));
-};
+export const Summary = ({
+  className,
+  size,
+  keys,
+  data,
+  loading,
+  showSummaryItemDelta,
+  summaryItemLink: SummaryItemCustomLink
+}) => /*#__PURE__*/React.createElement(Box, {
+  outline: true,
+  className: cx(css.root, className)
+}, /*#__PURE__*/React.createElement(FlexStack, {
+  className: css.items
+}, Array.from(METRIC_COMPONENT_LINKS).filter(([metricId]) => keys.includes(metricId)).map(([metricId, metricOptions]) => /*#__PURE__*/React.createElement(SummaryItem, {
+  as: ({
+    className: itemClassName,
+    ...itemProps
+  }) => /*#__PURE__*/React.createElement(Box, _extends({
+    padding: ['xsmall', 'small'],
+    className: cx(itemClassName, css.summaryItemLink)
+  }, itemProps, {
+    as: SummaryItemCustomLink
+  }, metricOptions.link)),
+  size: size,
+  key: metricId,
+  id: metricId,
+  data: _get(data, metricId),
+  loading: loading,
+  showMetricDescription: true,
+  showDelta: showSummaryItemDelta && metricOptions.showDelta !== false,
+  className: css.item
+}))));
 Summary.defaultProps = {
   className: '',
   data: null,
@@ -73,10 +57,12 @@ Summary.propTypes = {
   className: PropTypes.string,
   size: PropTypes.string,
   keys: PropTypes.arrayOf(PropTypes.string),
-  data: PropTypes.shape((_PropTypes$shape = {}, _PropTypes$shape[PropTypes.string] = PropTypes.shape({
-    baseline: PropTypes.number,
-    current: PropTypes.number
-  }), _PropTypes$shape)),
+  data: PropTypes.shape({
+    [PropTypes.string]: PropTypes.shape({
+      baseline: PropTypes.number,
+      current: PropTypes.number
+    })
+  }),
   loading: PropTypes.bool,
   showSummaryItemDelta: PropTypes.bool,
   summaryItemLink: PropTypes.elementType

package/lib-esm/components/summary/summary.stories.js

@@ -1,9 +1,5 @@
-var _excluded = ["keyProps"];
-
 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); }
 
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { createJobs } from '@bundle-stats/utils';
@@ -12,52 +8,38 @@ import currentData from '../../../__mocks__/webpack-stats.current.json';
 import { METRICS_WEBPACK_ASSETS } from '../../constants';
 import { getWrapperDecorator } from '../../stories';
 import { Summary } from '.';
-var MULTIPLE_JOBS = createJobs([{
+const MULTIPLE_JOBS = createJobs([{
   webpack: currentData
 }, {
   webpack: baselineData
 }]);
-var SINGLE_JOB = createJobs([{
+const SINGLE_JOB = createJobs([{
   webpack: currentData
 }]);
-var stories = storiesOf('Components/Summary', module);
+const stories = storiesOf('Components/Summary', module);
 stories.addDecorator(getWrapperDecorator());
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(Summary, {
-    data: MULTIPLE_JOBS[0].summary
-  });
-});
-stories.add('custom keys', function () {
-  return /*#__PURE__*/React.createElement(Summary, {
-    keys: METRICS_WEBPACK_ASSETS,
-    data: MULTIPLE_JOBS[0].summary
-  });
-});
-stories.add('loading', function () {
-  return /*#__PURE__*/React.createElement(Summary, {
-    loading: true
-  });
-});
-stories.add('single run', function () {
-  return /*#__PURE__*/React.createElement(Summary, {
-    data: SINGLE_JOB[0].summary,
-    showSummaryItemDelta: false
-  });
-});
-stories.add('with link', function () {
-  return /*#__PURE__*/React.createElement(Summary, {
-    data: MULTIPLE_JOBS[0].summary,
-    summaryItemLink: function summaryItemLink(_ref) {
-      var keyProps = _ref.keyProps,
-          props = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-      return /*#__PURE__*/React.createElement("button", _extends({
-        type: "button"
-      }, props, {
-        onClick: function onClick() {
-          return alert(JSON.stringify(keyProps));
-        }
-      }));
-    }
-  });
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(Summary, {
+  data: MULTIPLE_JOBS[0].summary
+}));
+stories.add('custom keys', () => /*#__PURE__*/React.createElement(Summary, {
+  keys: METRICS_WEBPACK_ASSETS,
+  data: MULTIPLE_JOBS[0].summary
+}));
+stories.add('loading', () => /*#__PURE__*/React.createElement(Summary, {
+  loading: true
+}));
+stories.add('single run', () => /*#__PURE__*/React.createElement(Summary, {
+  data: SINGLE_JOB[0].summary,
+  showSummaryItemDelta: false
+}));
+stories.add('with link', () => /*#__PURE__*/React.createElement(Summary, {
+  data: MULTIPLE_JOBS[0].summary,
+  summaryItemLink: ({
+    keyProps,
+    ...props
+  }) => /*#__PURE__*/React.createElement("button", _extends({
+    type: "button"
+  }, props, {
+    onClick: () => alert(JSON.stringify(keyProps))
+  }))
+}));

package/lib-esm/components/summary-item/summary-item.js

@@ -1,9 +1,5 @@
-var _excluded = ["className", "as", "size", "id", "data", "loading", "showDelta", "showMetricDescription"];
-
 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); }
 
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
@@ -16,12 +12,12 @@ import { Metric } from '../metric';
 import { Delta } from '../delta';
 import css from './summary-item.module.css';
 
-var MetricInfo = function MetricInfo(_ref) {
-  var description = _ref.description,
-      url = _ref.url;
-
+const MetricInfo = ({
+  description,
+  url
+}) => {
   // Workaround cases where the parent is a link
-  var readMoreOnClick = function readMoreOnClick() {
+  const readMoreOnClick = () => {
     window.open(url);
   };
 
@@ -41,28 +37,28 @@ MetricInfo.propTypes = {
 MetricInfo.defaultProps = {
   url: ''
 };
-export var SummaryItem = function SummaryItem(_ref2) {
-  var className = _ref2.className,
-      Component = _ref2.as,
-      size = _ref2.size,
-      id = _ref2.id,
-      data = _ref2.data,
-      loading = _ref2.loading,
-      showDelta = _ref2.showDelta,
-      showMetricDescription = _ref2.showMetricDescription,
-      props = _objectWithoutPropertiesLoose(_ref2, _excluded);
-
-  var _ref3 = data || {
+export const SummaryItem = ({
+  className,
+  as: Component,
+  size,
+  id,
+  data,
+  loading,
+  showDelta,
+  showMetricDescription,
+  ...props
+}) => {
+  const {
+    baseline,
+    current
+  } = data || {
     baseline: 0,
     current: 0
-  },
-      baseline = _ref3.baseline,
-      current = _ref3.current;
-
-  var metric = getGlobalMetricType(id);
-  var runInfo = getMetricRunInfo(metric, current, baseline);
-  var showMetricDescriptionTooltip = showMetricDescription && (metric == null ? void 0 : metric.description);
-  var rootClassName = cx(css.root, className, css[size], showMetricDescription && css.showMetricDescription, showMetricDescriptionTooltip && css.showMetricDescription, showDelta && css.showDelta);
+  };
+  const metric = getGlobalMetricType(id);
+  const runInfo = getMetricRunInfo(metric, current, baseline);
+  const showMetricDescriptionTooltip = showMetricDescription && (metric == null ? void 0 : metric.description);
+  const rootClassName = cx(css.root, className, css[size], showMetricDescription && css.showMetricDescription, showMetricDescriptionTooltip && css.showMetricDescription, showDelta && css.showDelta);
   return /*#__PURE__*/React.createElement(Stack, _extends({
     space: "xxsmall",
     as: Component,

package/lib-esm/components/summary-item/summary-item.stories.js

@@ -2,56 +2,46 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { getWrapperDecorator } from '../../stories';
 import { SummaryItem } from './summary-item';
-var stories = storiesOf('Components/SummaryItem', module);
+const stories = storiesOf('Components/SummaryItem', module);
 stories.addDecorator(getWrapperDecorator({
   maxWidth: '320px'
 }));
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(SummaryItem, {
-    loading: false,
-    id: "webpack.totalSizeByTypeALL",
-    data: {
-      current: 120 * 1000,
-      baseline: 100 * 1000
-    }
-  });
-});
-stories.add('size large', function () {
-  return /*#__PURE__*/React.createElement(SummaryItem, {
-    size: "large",
-    loading: false,
-    id: "webpack.totalSizeByTypeALL",
-    data: {
-      current: 120 * 1000,
-      baseline: 100 * 1000
-    }
-  });
-});
-stories.add('showMetricDescription', function () {
-  return /*#__PURE__*/React.createElement(SummaryItem, {
-    loading: false,
-    id: "webpack.totalSizeByTypeALL",
-    data: {
-      current: 120 * 1000,
-      baseline: 100 * 1000
-    },
-    showMetricDescription: true
-  });
-});
-stories.add('showDelta false', function () {
-  return /*#__PURE__*/React.createElement(SummaryItem, {
-    loading: false,
-    id: "webpack.totalSizeByTypeALL",
-    data: {
-      current: 120 * 1000,
-      baseline: 0
-    },
-    showDelta: false
-  });
-});
-stories.add('loading', function () {
-  return /*#__PURE__*/React.createElement(SummaryItem, {
-    loading: true,
-    id: "webpack.totalSizeByTypeALL"
-  });
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(SummaryItem, {
+  loading: false,
+  id: "webpack.totalSizeByTypeALL",
+  data: {
+    current: 120 * 1000,
+    baseline: 100 * 1000
+  }
+}));
+stories.add('size large', () => /*#__PURE__*/React.createElement(SummaryItem, {
+  size: "large",
+  loading: false,
+  id: "webpack.totalSizeByTypeALL",
+  data: {
+    current: 120 * 1000,
+    baseline: 100 * 1000
+  }
+}));
+stories.add('showMetricDescription', () => /*#__PURE__*/React.createElement(SummaryItem, {
+  loading: false,
+  id: "webpack.totalSizeByTypeALL",
+  data: {
+    current: 120 * 1000,
+    baseline: 100 * 1000
+  },
+  showMetricDescription: true
+}));
+stories.add('showDelta false', () => /*#__PURE__*/React.createElement(SummaryItem, {
+  loading: false,
+  id: "webpack.totalSizeByTypeALL",
+  data: {
+    current: 120 * 1000,
+    baseline: 0
+  },
+  showDelta: false
+}));
+stories.add('loading', () => /*#__PURE__*/React.createElement(SummaryItem, {
+  loading: true,
+  id: "webpack.totalSizeByTypeALL"
+}));

package/lib-esm/components/total-size-type-title/total-size-type-title.js

@@ -7,21 +7,20 @@ import { FlexStack } from '../../layout/flex-stack';
 import { Stack } from '../../layout/stack';
 import { Popover } from '../../ui/popover';
 import css from './total-size-type-title.module.css';
-export var TotalSizeTypeTitle = function TotalSizeTypeTitle(_ref) {
-  var className = _ref.className;
-  return /*#__PURE__*/React.createElement(FlexStack, {
-    space: "xxxsmall",
-    className: cx(css.title, className)
-  }, /*#__PURE__*/React.createElement("span", null, I18N.ASSET_TOTALS), /*#__PURE__*/React.createElement(Popover, {
-    icon: "help"
-  }, /*#__PURE__*/React.createElement(Stack, {
-    space: "xxxsmall"
-  }, /*#__PURE__*/React.createElement("p", null, I18N.ASSET_TOTALS_INFO), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("a", {
-    href: config.documentation.assets,
-    target: "_blank",
-    rel: "noreferrer"
-  }, I18N.READ_MORE)))));
-};
+export const TotalSizeTypeTitle = ({
+  className
+}) => /*#__PURE__*/React.createElement(FlexStack, {
+  space: "xxxsmall",
+  className: cx(css.title, className)
+}, /*#__PURE__*/React.createElement("span", null, I18N.ASSET_TOTALS), /*#__PURE__*/React.createElement(Popover, {
+  icon: "help"
+}, /*#__PURE__*/React.createElement(Stack, {
+  space: "xxxsmall"
+}, /*#__PURE__*/React.createElement("p", null, I18N.ASSET_TOTALS_INFO), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("a", {
+  href: config.documentation.assets,
+  target: "_blank",
+  rel: "noreferrer"
+}, I18N.READ_MORE)))));
 TotalSizeTypeTitle.propTypes = {
   className: PropTypes.string
 };