@bundle-stats/ui 3.2.0-beta.1 → 3.2.1-beta.3

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

@@ -1,6 +1,4 @@
-import _sum from "lodash/fp/sum";
-import _map from "lodash/fp/map";
-import _flow from "lodash/fp/flow";
+import _sum from "lodash/sum";
 import _isEmpty from "lodash/isEmpty";
 import _get from "lodash/get";
 import React, { useMemo } from 'react';
@@ -12,98 +10,95 @@ import { Metric } from '../metric';
 import { Delta } from '../delta';
 import { JobName } from '../job-name';
 import styles from './metrics-table.module.css';
-var METRIC_TYPE_DATA = getGlobalMetricType(null, METRIC_TYPE_FILE_SIZE);
+const METRIC_TYPE_DATA = getGlobalMetricType(null, METRIC_TYPE_FILE_SIZE);
 
-var getRowsRunTotal = function getRowsRunTotal(rows, runIndex) {
-  return _flow(_map(function (row) {
-    return _get(row, "runs[" + runIndex + "].value", 0);
-  }), _sum)(rows);
-};
-
-var getHeaderLabelCells = function getHeaderLabelCells(rows) {
-  return function (run, runIndex, runs) {
-    var isBaseline = runIndex === runs.length - 1;
-    var className = cx(styles.value, isBaseline ? styles.baseline : styles.current);
+const getRowsRunTotal = (rows, runIndex) => _sum(rows.map(row => _get(row, `runs[${runIndex}].value`, 0)));
 
-    if (!run) {
-      return [{
-        children: '-',
-        className: className
-      }].concat(!isBaseline ? [{
-        children: ' ',
-        className: styles.delta
-      }] : []);
-    }
+const getHeaderLabelCells = rows => (run, runIndex, runs) => {
+  const isBaseline = runIndex === runs.length - 1;
+  const className = cx(styles.value, isBaseline ? styles.baseline : styles.current);
 
-    var label = run.label,
-        internalBuildNumber = run.internalBuildNumber;
-    var jobName = /*#__PURE__*/React.createElement(JobName, {
-      title: runIndex === 0 ? 'Current' : 'Baseline',
-      internalBuildNumber: internalBuildNumber,
-      className: styles.jobName
-    }, label);
-    return [// Value column
-    {
-      children: jobName,
-      className: className
-    }].concat(!isBaseline ? [{
+  if (!run) {
+    return [{
+      children: '-',
+      className
+    }, ...(!isBaseline ? [{
       children: ' ',
-      className: cx(styles.delta)
-    }] : []);
-  };
-};
-
-var getHeaderTotalCells = function getHeaderTotalCells(rows) {
-  return function (run, runIndex, runs) {
-    var isBaseline = runIndex === runs.length - 1;
-    var className = cx(styles.value, isBaseline ? styles.baseline : styles.current);
-    var currentRunTotal = getRowsRunTotal(rows, runIndex);
-    var baselineRunTotal = !isBaseline && getRowsRunTotal(rows, runIndex + 1);
-    var infoTotal = getMetricRunInfo(METRIC_TYPE_DATA, currentRunTotal, baselineRunTotal);
-    return [// Value column
-    {
-      children: /*#__PURE__*/React.createElement(Metric, {
-        className: styles.tableHeaderRunMetric,
-        value: infoTotal.displayValue
-      }),
-      className: className
-    }].concat(!isBaseline ? [{
-      children: /*#__PURE__*/React.createElement(Delta, {
-        displayValue: infoTotal.displayDeltaPercentage,
-        deltaType: infoTotal.deltaType
-      }),
       className: styles.delta
-    }] : []);
-  };
+    }] : [])];
+  }
+
+  const {
+    label,
+    internalBuildNumber
+  } = run;
+  const jobName = /*#__PURE__*/React.createElement(JobName, {
+    title: runIndex === 0 ? 'Current' : 'Baseline',
+    internalBuildNumber: internalBuildNumber,
+    className: styles.jobName
+  }, label);
+  return [// Value column
+  {
+    children: jobName,
+    className
+  }, // Delta column
+  ...(!isBaseline ? [{
+    children: ' ',
+    className: cx(styles.delta)
+  }] : [])];
 };
 
-var getHeaderRows = function getHeaderRows(runs, items, showHeaderSum, title) {
-  return [{
-    className: styles.headerRowColumns,
-    cells: [// Metric name column - one empty strying to render the column
-    {
-      children: title || ' ',
-      className: styles.metricName,
-      rowSpan: showHeaderSum ? 2 : 1
-    }].concat(runs.map(getHeaderLabelCells(items)).flat())
-  }].concat(showHeaderSum ? [{
-    className: styles.headerRowTotals,
-    cells: runs.map(getHeaderTotalCells(items)).flat()
-  }] : []);
+const getHeaderTotalCells = rows => (run, runIndex, runs) => {
+  const isBaseline = runIndex === runs.length - 1;
+  const className = cx(styles.value, isBaseline ? styles.baseline : styles.current);
+  const currentRunTotal = getRowsRunTotal(rows, runIndex);
+  const baselineRunTotal = !isBaseline && getRowsRunTotal(rows, runIndex + 1);
+  const infoTotal = getMetricRunInfo(METRIC_TYPE_DATA, currentRunTotal, baselineRunTotal);
+  return [// Value column
+  {
+    children: /*#__PURE__*/React.createElement(Metric, {
+      className: styles.tableHeaderRunMetric,
+      value: infoTotal.displayValue
+    }),
+    className
+  }, // Delta column
+  ...(!isBaseline ? [{
+    children: /*#__PURE__*/React.createElement(Delta, {
+      displayValue: infoTotal.displayDeltaPercentage,
+      deltaType: infoTotal.deltaType
+    }),
+    className: styles.delta
+  }] : [])];
 };
 
-var generateRowCells = function generateRowCells(item, index, items) {
-  var isBaseline = index === items.length - 1; // eslint-disable-next-line react/destructuring-assignment
+const getHeaderRows = (runs, items, showHeaderSum, title) => [{
+  className: styles.headerRowColumns,
+  cells: [// Metric name column - one empty strying to render the column
+  {
+    children: title || ' ',
+    className: styles.metricName,
+    rowSpan: showHeaderSum ? 2 : 1
+  }, // Runs
+  ...runs.map(getHeaderLabelCells(items)).flat()]
+}, ...(showHeaderSum ? [{
+  className: styles.headerRowTotals,
+  cells: runs.map(getHeaderTotalCells(items)).flat()
+}] : [])];
+
+const generateRowCells = (item, index, items) => {
+  const isBaseline = index === items.length - 1; // eslint-disable-next-line react/destructuring-assignment
 
   if (!item || typeof item.value === 'undefined') {
-    return ['-'].concat(!isBaseline ? [''] : []);
+    return ['-', ...(!isBaseline ? [''] : [])];
   }
 
-  var displayValue = item.displayValue,
-      deltaPercentage = item.deltaPercentage,
-      displayDeltaPercentage = item.displayDeltaPercentage,
-      deltaType = item.deltaType;
-  var cells = [/*#__PURE__*/React.createElement(Metric, {
+  const {
+    displayValue,
+    deltaPercentage,
+    displayDeltaPercentage,
+    deltaType
+  } = item;
+  const cells = [/*#__PURE__*/React.createElement(Metric, {
     value: displayValue
   })];
 
@@ -117,72 +112,68 @@ var generateRowCells = function generateRowCells(item, index, items) {
   return cells;
 };
 
-var getRows = function getRows(runs, items, renderRowHeader) {
-  return items.map(function (item, index) {
-    var changed = item.changed;
-    return {
-      key: (item == null ? void 0 : item.key) || index,
-      className: changed ? '' : styles.unchanged,
-      cells: [// Metric name
-      renderRowHeader(item)].concat(item.runs.map(generateRowCells).flat())
-    };
-  });
-};
-
-export var MetricsTable = function MetricsTable(_ref) {
-  var className = _ref.className,
-      renderRowHeader = _ref.renderRowHeader,
-      runs = _ref.runs,
-      items = _ref.items,
-      emptyMessage = _ref.emptyMessage,
-      showHeaderSum = _ref.showHeaderSum,
-      headerRows = _ref.headerRows,
-      title = _ref.title;
-
-  var _useMemo = useMemo(function () {
-    var headerColumns = getHeaderRows(runs, items, showHeaderSum, title);
+const getRows = (runs, items, renderRowHeader) => items.map((item, index) => {
+  const {
+    changed
+  } = item;
+  return {
+    key: (item == null ? void 0 : item.key) || index,
+    className: changed ? '' : styles.unchanged,
+    cells: [// Metric name
+    renderRowHeader(item), // Metric item values
+    ...item.runs.map(generateRowCells).flat()]
+  };
+});
+
+export const MetricsTable = _ref => {
+  let {
+    className,
+    renderRowHeader,
+    runs,
+    items,
+    emptyMessage,
+    showHeaderSum,
+    headerRows,
+    title
+  } = _ref;
+  const {
+    headers,
+    columnClassNames
+  } = useMemo(() => {
+    const headerColumns = getHeaderRows(runs, items, showHeaderSum, title);
     return {
-      headers: [].concat(headerRows, headerColumns),
+      headers: [...headerRows, ...headerColumns],
       // First header row has the column class names
-      columnClassNames: headerColumns[0].cells.map(function (headerColumn) {
-        return headerColumn.className;
-      })
+      columnClassNames: headerColumns[0].cells.map(headerColumn => headerColumn.className)
     };
-  }, [headerRows, runs, items, showHeaderSum, title]),
-      headers = _useMemo.headers,
-      columnClassNames = _useMemo.columnClassNames;
-
-  var rows = useMemo(function () {
-    return getRows(runs, items, renderRowHeader);
-  }, [runs, items, renderRowHeader]);
-  var rootClassName = cx(styles.root, className, runs.length > 1 && styles.multipleRuns, showHeaderSum && styles.showHeaderSum);
+  }, [headerRows, runs, items, showHeaderSum, title]);
+  const rows = useMemo(() => getRows(runs, items, renderRowHeader), [runs, items, renderRowHeader]);
+  const rootClassName = cx(styles.root, className, runs.length > 1 && styles.multipleRuns, showHeaderSum && styles.showHeaderSum);
   return /*#__PURE__*/React.createElement(Table, {
     className: rootClassName,
     compact: true
-  }, /*#__PURE__*/React.createElement(Table.THead, null, headers.map(function (headerRow) {
-    var _ref2 = headerRow.cells ? headerRow : {
+  }, /*#__PURE__*/React.createElement(Table.THead, null, headers.map(headerRow => {
+    const {
+      cells,
+      className: rowClassName
+    } = headerRow.cells ? headerRow : {
       cells: headerRow
-    },
-        cells = _ref2.cells,
-        rowClassName = _ref2.className;
-
+    };
     return /*#__PURE__*/React.createElement(Table.Tr, {
       className: rowClassName
-    }, cells.map(function (header) {
-      return /*#__PURE__*/React.createElement(Table.Th, header);
-    }));
-  })), /*#__PURE__*/React.createElement(Table.TBody, null, !_isEmpty(rows) ? rows.map(function (_ref3) {
-    var key = _ref3.key,
-        rowClassName = _ref3.className,
-        cells = _ref3.cells;
+    }, cells.map(header => /*#__PURE__*/React.createElement(Table.Th, header)));
+  })), /*#__PURE__*/React.createElement(Table.TBody, null, !_isEmpty(rows) ? rows.map(_ref2 => {
+    let {
+      key,
+      className: rowClassName,
+      cells
+    } = _ref2;
     return /*#__PURE__*/React.createElement(Table.Tr, {
       key: key,
       className: rowClassName
-    }, cells.map(function (cell, index) {
-      return /*#__PURE__*/React.createElement(Table.Td, {
-        className: columnClassNames[index]
-      }, cell);
-    }));
+    }, cells.map((cell, index) => /*#__PURE__*/React.createElement(Table.Td, {
+      className: columnClassNames[index]
+    }, cell)));
   }) : /*#__PURE__*/React.createElement(Table.Tr, null, /*#__PURE__*/React.createElement(Table.Td, {
     className: styles.empty,
     colSpan: (columnClassNames == null ? void 0 : columnClassNames.length) || 1
@@ -190,9 +181,7 @@ export var MetricsTable = function MetricsTable(_ref) {
 };
 MetricsTable.defaultProps = {
   className: '',
-  renderRowHeader: function renderRowHeader(item) {
-    return item.label;
-  },
+  renderRowHeader: item => item.label,
   emptyMessage: 'No entries found.',
   showHeaderSum: false,
   headerRows: [],

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

@@ -2,7 +2,7 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { getWrapperDecorator } from '../../stories';
 import { MetricsTable } from '.';
-var RUNS = [{
+const RUNS = [{
   internalBuildNumber: 2,
   label: 'Job #2'
 }, {
@@ -11,7 +11,7 @@ var RUNS = [{
     href: "#noop"
   }, "Job #1")
 }];
-var ITEMS_SINGLE_RUN = [{
+const ITEMS_SINGLE_RUN = [{
   key: 'webpack.assets.totalSizeByTypeALL',
   label: 'Total Size',
   biggerIsBetter: false,
@@ -57,7 +57,7 @@ var ITEMS_SINGLE_RUN = [{
     displayValue: '80'
   }]
 }];
-var ITEMS_MULTIPLE_RUNS = [{
+const ITEMS_MULTIPLE_RUNS = [{
   key: 'webpack.assets.totalSizeByTypeALL',
   label: 'Total Size',
   biggerIsBetter: false,
@@ -157,36 +157,28 @@ var ITEMS_MULTIPLE_RUNS = [{
     displayValue: '80'
   }]
 }];
-var stories = storiesOf('Components/MetricsTable', module);
+const stories = storiesOf('Components/MetricsTable', module);
 stories.addDecorator(getWrapperDecorator());
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(MetricsTable, {
-    runs: RUNS.slice(0, 1),
-    items: ITEMS_SINGLE_RUN
-  });
-});
-stories.add('multiple runs', function () {
-  return /*#__PURE__*/React.createElement(MetricsTable, {
-    runs: RUNS,
-    items: ITEMS_MULTIPLE_RUNS
-  });
-});
-stories.add('with header rows', function () {
-  return /*#__PURE__*/React.createElement(MetricsTable, {
-    runs: RUNS,
-    items: ITEMS_MULTIPLE_RUNS,
-    headerRows: [['Metric', {
-      children: 'Colspan',
-      colSpan: 1 + (RUNS.length - 1) * 2 + 1,
-      style: {
-        textAlign: 'center'
-      }
-    }]]
-  });
-});
-stories.add('empty', function () {
-  return /*#__PURE__*/React.createElement(MetricsTable, {
-    runs: RUNS,
-    items: []
-  });
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(MetricsTable, {
+  runs: RUNS.slice(0, 1),
+  items: ITEMS_SINGLE_RUN
+}));
+stories.add('multiple runs', () => /*#__PURE__*/React.createElement(MetricsTable, {
+  runs: RUNS,
+  items: ITEMS_MULTIPLE_RUNS
+}));
+stories.add('with header rows', () => /*#__PURE__*/React.createElement(MetricsTable, {
+  runs: RUNS,
+  items: ITEMS_MULTIPLE_RUNS,
+  headerRows: [['Metric', {
+    children: 'Colspan',
+    colSpan: 1 + (RUNS.length - 1) * 2 + 1,
+    style: {
+      textAlign: 'center'
+    }
+  }]]
+}));
+stories.add('empty', () => /*#__PURE__*/React.createElement(MetricsTable, {
+  runs: RUNS,
+  items: []
+}));

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

@@ -1,32 +1,29 @@
-var _excluded = ["className", "handleViewAll", "handleResetFilters"];
-
 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 I18N from '../../i18n';
 import { Dropdown } from '../../ui/dropdown';
-export var MetricsTableOptions = function MetricsTableOptions(props) {
-  var className = props.className,
-      handleViewAll = props.handleViewAll,
-      handleResetFilters = props.handleResetFilters,
-      restProps = _objectWithoutPropertiesLoose(props, _excluded);
-
+export const MetricsTableOptions = props => {
+  const {
+    className,
+    handleViewAll,
+    handleResetFilters,
+    ...restProps
+  } = props;
   return /*#__PURE__*/React.createElement(Dropdown, _extends({
     className: className,
     glyph: "menu"
-  }, restProps), function (_ref) {
-    var MenuItem = _ref.MenuItem,
-        menu = _ref.menu,
-        menuItemClassName = _ref.menuItemClassName;
+  }, restProps), _ref => {
+    let {
+      MenuItem,
+      menu,
+      menuItemClassName
+    } = _ref;
 
-    var getButtonOnClick = function getButtonOnClick(handler) {
-      return function () {
-        handler();
-        menu.toggle();
-      };
+    const getButtonOnClick = handler => () => {
+      handler();
+      menu.toggle();
     };
 
     return /*#__PURE__*/React.createElement(React.Fragment, null, handleResetFilters && /*#__PURE__*/React.createElement(MenuItem, _extends({}, menu, {

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

@@ -2,16 +2,10 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { getWrapperDecorator } from '../../stories';
 import { MetricsTableOptions } from '.';
-var stories = storiesOf('Components/MetricsTableOptions', module);
+const stories = storiesOf('Components/MetricsTableOptions', module);
 stories.addDecorator(getWrapperDecorator());
-stories.add('default', function () {
-  return /*#__PURE__*/React.createElement(MetricsTableOptions, {
-    align: "left",
-    handleResetFilters: function handleResetFilters() {
-      return console.log('reset');
-    },
-    handleViewAll: function handleViewAll() {
-      return console.log('view all');
-    }
-  });
-});
+stories.add('default', () => /*#__PURE__*/React.createElement(MetricsTableOptions, {
+  align: "left",
+  handleResetFilters: () => console.log('reset'),
+  handleViewAll: () => console.log('view all')
+}));

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
       });