@bundle-stats/ui 4.2.3-beta.0 → 4.2.3-beta.1

package/lib-esm/components/metric-run-info/metric-run-info.js

@@ -0,0 +1,52 @@
+import React, { useCallback, useMemo } from 'react';
+import { getGlobalMetricType, getMetricRunInfo } from '@bundle-stats/utils';
+import { Focusable } from 'ariakit/focusable';
+import { Stack } from '../../layout/stack';
+import { FlexStack } from '../../layout/flex-stack';
+import { Icon } from '../../ui/icon';
+import { RunInfo } from '../run-info';
+import css from './metric-run-info.module.css';
+const MetricHoverCard = ({ title, description, url }) => {
+    const onClick = useCallback((event) => {
+        if (!url) {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        window.open(url);
+    }, [url]);
+    return (React.createElement(Stack, { space: "xxsmall", className: css.metricHoverCard },
+        React.createElement("h3", { className: css.metricHoverCardTitle }, title),
+        React.createElement(Stack, { space: "xxxsmall" },
+            React.createElement("p", { className: css.metricHoverCardDescription }, description),
+            url && (React.createElement("div", null,
+                React.createElement(Focusable, { as: "span", onClick: onClick, className: css.readMoreLink },
+                    React.createElement(FlexStack, { alignItems: "center", space: "xxxsmall" },
+                        React.createElement("span", null, "Learn more"),
+                        React.createElement(Icon, { glyph: Icon.ICONS.EXTERNAL_LINK, size: "small" }))))))));
+};
+export const MetricRunInfo = (props) => {
+    const { metricId, current, baseline = 0, showDelta = true, showMetricDescription = true, showBaseline = true, titleWrapper: CustomTitleWrapper = React.Fragment, ...restProps } = props;
+    const metric = getGlobalMetricType(metricId);
+    const metricRunInfo = getMetricRunInfo(metric, current, baseline || 0);
+    const titleHoverCard = useMemo(() => {
+        if (showMetricDescription && (metric.description || metric.url)) {
+            return (React.createElement(MetricHoverCard, { title: metric.label, description: metric.description, url: metric.url }));
+        }
+        return null;
+    }, [showMetricDescription, metric]);
+    const title = useMemo(() => React.createElement(CustomTitleWrapper, null, metric.label), [CustomTitleWrapper, metric.label]);
+    const deltaProps = useMemo(() => {
+        if (!showDelta || metric.skipDelta || !('delta' in metricRunInfo)) {
+            return {};
+        }
+        return {
+            delta: metricRunInfo.displayDeltaPercentage,
+            deltaType: metricRunInfo.deltaType,
+        };
+    }, [metricRunInfo]);
+    return (React.createElement(RunInfo, { title: title, titleHoverCard: titleHoverCard, enhance: true, current: metricRunInfo.displayValue, showBaseline: showBaseline, ...(showBaseline && {
+            baseline: metric.formatter(baseline),
+        }), ...deltaProps, ...restProps }));
+};
+//# sourceMappingURL=metric-run-info.js.map

package/lib-esm/components/metric-run-info/metric-run-info.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"metric-run-info.js","sourceRoot":"","sources":["../../../src/components/metric-run-info/metric-run-info.tsx"],"names":[],"mappings":"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"}

package/lib-esm/components/metric-run-info/metric-run-info.module.css

@@ -0,0 +1,17 @@
+.metricHoverCardTitle {
+  font-weight: bold;
+  font-size: 1em;
+}
+
+.readMoreLink {
+  cursor: pointer;
+  color: var(--color-primary);
+  text-decoration: underline;
+}
+
+.readMoreLink:hover,
+.readMoreLink:focus,
+.readMoreLink:active {
+  color: var(--color-primary-dark);
+  text-decoration: none;
+}

package/lib-esm/components/metrics-display-selector/index.js

@@ -0,0 +1,2 @@
+export * from './metrics-display-selector';
+//# sourceMappingURL=index.js.map

package/lib-esm/components/metrics-display-selector/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/metrics-display-selector/index.tsx"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC"}

package/lib-esm/components/metrics-display-selector/metrics-display-selector.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import cx from 'classnames';
+import { MetricsDisplayType, MetricsDisplayGroupByDefault, MetricsDisplayGroupBy, } from '../../constants';
+import { Button } from '../../ui/button';
+import { ControlGroup } from '../../ui/control-group';
+import { Dropdown, DropdownItem } from '../../ui/dropdown';
+import { Icon } from '../../ui/icon';
+import { FlexStack } from '../../layout/flex-stack';
+import css from './metrics-display-selector.module.css';
+const METRICS_DISPLAY_MAP = {
+    [MetricsDisplayType.TABLE]: {
+        glyph: Icon.ICONS.TABLE,
+        label: 'Table',
+    },
+    [MetricsDisplayType.TREEMAP]: {
+        glyph: Icon.ICONS.TREEMAP,
+        label: 'Treemap',
+    },
+};
+const displayTypes = Object.values(MetricsDisplayType);
+export const MetricsDisplaySelector = (props) => {
+    const { value, groupBy = MetricsDisplayGroupByDefault, groups = {}, onSelect, ...restProps } = props;
+    return (React.createElement(ControlGroup, { ...restProps }, displayTypes.map((displayType, index) => {
+        const displayGroups = groups === null || groups === void 0 ? void 0 : groups[displayType];
+        const displayProps = METRICS_DISPLAY_MAP[displayType];
+        const isFirst = index === 0;
+        const isLast = displayTypes.length - 1 === index;
+        const isActive = displayType === value;
+        if (!displayGroups || displayGroups.length === 0) {
+            return (React.createElement(Button, { outline: true, active: isActive, size: "small", type: "button", glyph: displayProps.glyph, onClick: () => onSelect(displayType), className: cx(isLast && css.itemLast), key: displayType }, displayProps.label));
+        }
+        const displayGroupsData = [
+            ...displayGroups.map((displayGroup) => ({
+                value: displayGroup,
+                label: `Group by ${displayGroup}`,
+            })),
+            {
+                value: MetricsDisplayGroupBy.NONE,
+                label: 'No group',
+            },
+        ];
+        const itemClassName = cx(css.dropdownGroup, isFirst && css.itemFirst, isLast && css.itemLast, isActive && css.itemActive);
+        return (React.createElement(FlexStack, { className: itemClassName, key: displayType },
+            React.createElement(Button, { size: "small", glyph: displayProps.glyph, onClick: () => onSelect(displayType), className: css.dropdownGroupButton }, displayProps.label),
+            React.createElement(Dropdown, { glyph: Icon.ICONS.CHEVRON_DOWN, placement: "bottom-end", shift: -1, className: css.dropdownGroupAnchor }, displayGroupsData.map((displayGroupData) => {
+                const isGroupActive = isActive && displayGroupData.value === groupBy;
+                return (React.createElement(DropdownItem, { onClick: () => onSelect(displayType, displayGroupData.value), isActive: isGroupActive, className: cx(css.dropdownItem, isGroupActive && css.dropdownItemActive), key: displayGroupData.value },
+                    React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center" },
+                        React.createElement(Icon, { glyph: Icon.ICONS.CHECK, size: "small", className: css.dropdownItemIcon }),
+                        React.createElement("span", null, displayGroupData.label))));
+            }))));
+    })));
+};
+//# sourceMappingURL=metrics-display-selector.js.map

package/lib-esm/components/metrics-display-selector/metrics-display-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"metrics-display-selector.js","sourceRoot":"","sources":["../../../src/components/metrics-display-selector/metrics-display-selector.tsx"],"names":[],"mappings":"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"}

package/lib-esm/components/metrics-display-selector/metrics-display-selector.module.css

@@ -0,0 +1,63 @@
+.dropdownGroup {
+  border: 1px solid var(--color-outline);
+  transition: var(--transition-out);
+}
+
+.dropdownGroupButton {
+  padding: calc(var(--space-xxsmall) - 1px);
+}
+
+.dropdownGroupAnchor {
+  border: none;
+  border-radius: 0;
+  position: relative;
+}
+
+.dropdownGroupAnchor::before {
+  content: '';
+  display: block;
+  width: 1px;
+  background: var(--color-outline-dark);
+  position: absolute;
+  left: 0;
+  top: var(--space-xxxsmall);
+  bottom: var(--space-xxxsmall);
+}
+
+.dropdownGroupAnchor:hover,
+.dropdownGroupAnchor:focus,
+.dropdownGroupAnchor:active {
+  border-color: var(--color-outline);
+  box-shadow: none;
+  background: none;
+}
+
+.dropdownGroup:hover {
+  border-color: var(--color-outline-dark);
+  transition: var(--transition-in);
+}
+
+.itemActive {
+  background: var(--color-highlight);
+}
+
+/* explicit ControlGroup last item styles to override ariakit injected sibling nodes */
+.itemFirst {
+  border-top-left-radius: var(--radius-small) !important;
+  border-bottom-left-radius: var(--radius-small) !important;
+}
+
+.itemLast {
+  border-top-right-radius: var(--radius-small) !important;
+  border-bottom-right-radius: var(--radius-small) !important;
+}
+
+.dropdownItemIcon {
+  opacity: 0;
+  transition: var(--transition-out);
+}
+
+.dropdownItemActive .dropdownItemIcon {
+  opacity: 1;
+  transition: var(--transition-in);
+}

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

@@ -2,6 +2,6 @@ import React, { useState } from 'react';
 import { MetricsTable as BaseComponent } from './metrics-table';
 export const MetricsTable = (props) => {
     const [showAllItems, setShowAllItems] = useState(false);
-    return (React.createElement(BaseComponent, { ...props, showAllItems: showAllItems, setShowAllItems: setShowAllItems }));
+    return React.createElement(BaseComponent, { ...props, showAllItems: showAllItems, setShowAllItems: setShowAllItems });
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/metrics-table/index.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,YAAY,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,EAAE;IACpC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,OAAO,CACL,oBAAC,aAAa,OAAK,KAAK,EAAE,YAAY,EAAE,YAAY,EAAG,eAAe,EAAE,eAAe,GAAI,CAC5F,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/metrics-table/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,YAAY,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAOhE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAE,EAAE;IACvD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,OAAO,oBAAC,aAAa,OAAK,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,eAAe,EAAE,eAAe,GAAI,CAAC;AACpG,CAAC,CAAC"}

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

@@ -0,0 +1,4 @@
+export const EMPTY_MESSAGE = 'No items found.';
+export const SHOW_ALL = 'Show all';
+export const SHOW_LESS = 'Show less';
+//# sourceMappingURL=metrics-table.i18n.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"metrics-table.i18n.js","sourceRoot":"","sources":["../../../src/components/metrics-table/metrics-table.i18n.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG,iBAAiB,CAAC;AAC/C,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC;AACnC,MAAM,CAAC,MAAM,SAAS,GAAG,WAAW,CAAC"}

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

@@ -1,163 +1,55 @@
-import React, { useMemo } from 'react';
-import PropTypes from 'prop-types';
+import React from 'react';
 import cx from 'classnames';
 import isEmpty from 'lodash/isEmpty';
-import sum from 'lodash/sum';
-import { METRIC_TYPE_FILE_SIZE, getGlobalMetricType, getMetricRunInfo } from '@bundle-stats/utils';
+import { Button } from '../../ui/button';
+import { Icon } from '../../ui/icon';
 import { Table } from '../../ui/table';
+import { Stack } from '../../layout/stack';
 import { Metric } from '../metric';
 import { Delta } from '../delta';
-import { JobName } from '../job-name';
-import styles from './metrics-table.module.css';
-const METRIC_TYPE_DATA = getGlobalMetricType(null, METRIC_TYPE_FILE_SIZE);
+import { MetricsTableHeader } from '../metrics-table-header';
+import * as I18N from './metrics-table.i18n';
+import css from './metrics-table.module.css';
 const VISIBLE_COUNT = 500;
-const getRowsRunTotal = (rows, runIndex) => sum(rows.map((row) => { var _a, _b; return ((_b = (_a = row === null || row === void 0 ? void 0 : row.runs) === null || _a === void 0 ? void 0 : _a[runIndex]) === null || _b === void 0 ? void 0 : _b.value) || 0; }));
-const getHeaderLabelCells = (rows) => (run, runIndex, runs) => {
-    const isBaseline = runIndex === runs.length - 1;
-    const className = cx(styles.value, isBaseline ? styles.baseline : styles.current);
-    if (!run) {
-        return [
-            { children: '-', className },
-            ...(!isBaseline ? [{ children: ' ', className: styles.delta }] : []),
-        ];
-    }
-    const { label, internalBuildNumber } = run;
-    const jobName = (React.createElement(JobName, { title: runIndex === 0 ? 'Current' : 'Baseline', internalBuildNumber: internalBuildNumber, className: styles.jobName }, label));
-    return [
-        { children: jobName, className },
-        ...(!isBaseline ? [{ children: ' ', className: cx(styles.delta) }] : []),
-    ];
-};
-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 [
-        {
-            children: React.createElement(Metric, { className: styles.tableHeaderRunMetric, value: infoTotal.displayValue }),
-            className,
-        },
-        ...(!isBaseline
-            ? [
-                {
-                    children: (React.createElement(Delta, { displayValue: infoTotal.displayDeltaPercentage, deltaType: infoTotal.deltaType })),
-                    className: styles.delta,
-                },
-            ]
-            : []),
-    ];
-};
-const getHeaderRows = (runs, items, showHeaderSum, title) => [
-    {
-        className: styles.headerRowColumns,
-        cells: [
-            {
-                children: title || ' ',
-                className: styles.metricName,
-                rowSpan: showHeaderSum ? 2 : 1,
-            },
-            ...runs.map(getHeaderLabelCells(items)).flat(),
-        ],
-    },
-    ...(showHeaderSum
-        ? [
-            {
-                className: styles.headerRowTotals,
-                cells: runs.map(getHeaderTotalCells(items)).flat(),
-            },
-        ]
-        : []),
-];
-const MetricsTableRow = ({ item, renderRowHeader }) => (React.createElement(Table.Tr, { className: cx(!item.changed && styles.unchanged) },
-    React.createElement(Table.Th, { className: styles.metricName }, renderRowHeader(item)),
+const BASELINE_COLUMN_SPAN = 1;
+const CURRENT_COLUMN_SPAN = 3;
+const Row = ({ className = '', item, renderHeader, ...restProps }) => (React.createElement(Table.Tr, { className: cx(!item.changed && css.unchanged, className), ...restProps },
+    React.createElement(Table.Th, { className: css.metricName }, renderHeader(item)),
     item.runs.map((run, index) => {
         const isBaseline = index === item.runs.length - 1;
-        const valueClassName = cx(styles.value, !isBaseline && styles.current);
+        const valueClassName = cx(css.value, !isBaseline && css.current);
         if (!run || typeof run.value === 'undefined') {
             return (React.createElement(React.Fragment, null,
                 React.createElement(Table.Td, { className: valueClassName }, "-"),
-                !isBaseline && React.createElement(Table.Td, { className: styles.delta })));
+                !isBaseline && React.createElement(Table.Td, { className: css.delta }),
+                !isBaseline && React.createElement(Table.Td, { className: cx(css.delta, css.deltaPercentage) })));
         }
-        const { displayValue, deltaPercentage, displayDeltaPercentage, deltaType } = run;
         return (React.createElement(React.Fragment, null,
             React.createElement(Table.Td, { className: valueClassName },
-                React.createElement(Metric, { value: displayValue })),
-            !isBaseline && typeof deltaPercentage === 'number' && (React.createElement(Table.Td, { className: styles.delta },
-                React.createElement(Delta, { displayValue: displayDeltaPercentage, deltaType: deltaType })))));
+                React.createElement(Metric, { value: run.displayValue })),
+            !isBaseline && (React.createElement(React.Fragment, null,
+                React.createElement(Table.Td, { className: css.delta }, 'delta' in run && (React.createElement(Delta, { displayValue: run.displayDelta, deltaType: run.deltaType }))),
+                React.createElement(Table.Td, { className: cx(css.delta, css.deltaPercentage) }, 'delta' in run && (React.createElement(Delta, { displayValue: run.displayDeltaPercentage, deltaType: run.deltaType })))))));
     })));
-MetricsTableRow.propTypes = {
-    item: PropTypes.shape({
-        changed: PropTypes.bool,
-        runs: PropTypes.arrayOf(PropTypes.shape({
-            value: PropTypes.number,
-            displayValue: PropTypes.string,
-            deltaPercentage: PropTypes.number,
-            displayDeltaPercentage: PropTypes.string,
-            deltaType: PropTypes.string,
-        })),
-    }).isRequired,
-    renderRowHeader: PropTypes.func.isRequired,
-};
-export const MetricsTable = ({ className, renderRowHeader, runs, items, emptyMessage, showHeaderSum, headerRows, title, showAllItems, setShowAllItems, ...restProps }) => {
-    const { headers, columnClassNames } = useMemo(() => {
-        const headerColumns = getHeaderRows(runs, items, showHeaderSum, title);
-        return {
-            headers: [...headerRows, ...headerColumns],
-            columnClassNames: headerColumns[0].cells.map((headerColumn) => headerColumn.className),
-        };
-    }, [headerRows, runs, items, showHeaderSum, title]);
-    const rootClassName = cx(styles.root, className, runs.length > 1 && styles.multipleRuns, showHeaderSum && styles.showHeaderSum);
+export const MetricsTable = ({ className = '', runs, items, showHeaderSum = false, title, sort, updateSort, renderRowHeader = (item) => item.label, emptyMessage = I18N.EMPTY_MESSAGE, showAllItems, setShowAllItems, ...restProps }) => {
+    const columnCount = (runs.length - 1) * CURRENT_COLUMN_SPAN + BASELINE_COLUMN_SPAN + 1;
+    const rootClassName = cx(css.root, className, runs.length > 1 && css.multipleRuns);
     const showEmpty = isEmpty(items);
     const showItems = !showEmpty;
     const hasHiddenItems = (items === null || items === void 0 ? void 0 : items.length) > VISIBLE_COUNT;
     const visibleItems = !hasHiddenItems || showAllItems ? items : items === null || items === void 0 ? void 0 : items.slice(0, VISIBLE_COUNT);
     return (React.createElement(Table, { className: rootClassName, compact: true, ...restProps },
-        React.createElement(Table.THead, null, headers.map((headerRow) => {
-            const { cells, className: rowClassName } = headerRow.cells
-                ? headerRow
-                : { cells: headerRow };
-            return (React.createElement(Table.Tr, { className: rowClassName }, cells.map((header) => (React.createElement(Table.Th, { ...header })))));
-        })),
+        React.createElement(MetricsTableHeader, { metricTitle: title, showSum: showHeaderSum, jobs: runs, rows: items, sort: sort, updateSort: updateSort }),
         React.createElement(Table.TBody, null,
             showEmpty && (React.createElement(Table.Tr, null,
-                React.createElement(Table.Td, { className: styles.empty, colSpan: (columnClassNames === null || columnClassNames === void 0 ? void 0 : columnClassNames.length) || 1 }, emptyMessage))),
+                React.createElement(Table.Td, { className: css.empty, colSpan: columnCount },
+                    React.createElement(Stack, { space: "xxsmall" },
+                        React.createElement("div", null,
+                            React.createElement(Icon, { glyph: Icon.ICONS.INFO, className: css.emptyIcon, size: "large" })),
+                        emptyMessage)))),
             showItems && (React.createElement(React.Fragment, null,
-                visibleItems.map((item) => (React.createElement(MetricsTableRow, { key: item.key, item: item, renderRowHeader: renderRowHeader }))),
+                visibleItems.map((item) => (React.createElement(Row, { key: item.key, item: item, renderHeader: renderRowHeader }))),
                 hasHiddenItems && (React.createElement(Table.Tr, null,
-                    React.createElement(Table.Td, { className: styles.showAllItems, colSpan: (columnClassNames === null || columnClassNames === void 0 ? void 0 : columnClassNames.length) || 1 }, showAllItems ? (React.createElement("button", { onClick: () => setShowAllItems(false), type: "button", className: styles.showAllItemsButton }, "Show less")) : (React.createElement("button", { onClick: () => setShowAllItems(true), type: "button", className: styles.showAllItemsButton }, "Show all"))))))))));
-};
-MetricsTable.defaultProps = {
-    className: '',
-    renderRowHeader: (item) => item.label,
-    emptyMessage: 'No entries found.',
-    showHeaderSum: false,
-    headerRows: [],
-    title: '',
-};
-MetricsTable.propTypes = {
-    className: PropTypes.string,
-    renderRowHeader: PropTypes.func,
-    runs: PropTypes.arrayOf(PropTypes.shape({
-        internalBuildNumber: PropTypes.number,
-    })).isRequired,
-    items: PropTypes.arrayOf(PropTypes.shape({
-        key: PropTypes.string,
-        label: PropTypes.string,
-        runs: PropTypes.arrayOf(PropTypes.shape({
-            displayValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-            displayDelta: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-        })),
-    })).isRequired,
-    emptyMessage: PropTypes.element,
-    showHeaderSum: PropTypes.bool,
-    headerRows: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.oneOfType([
-        PropTypes.element,
-        PropTypes.shape({
-            children: PropTypes.node,
-        }),
-    ]))),
-    title: PropTypes.element,
+                    React.createElement(Table.Td, { className: css.showAllItems, colSpan: columnCount }, showAllItems ? (React.createElement(Button, { padding: "small", kind: "primary", onClick: () => setShowAllItems(false), type: "button" }, I18N.SHOW_LESS)) : (React.createElement(Button, { padding: "small", kind: "primary", onClick: () => setShowAllItems(true), type: "button" }, I18N.SHOW_ALL))))))))));
 };
 //# sourceMappingURL=metrics-table.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"metrics-table.js","sourceRoot":"","sources":["../../../src/components/metrics-table/metrics-table.jsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"metrics-table.js","sourceRoot":"","sources":["../../../src/components/metrics-table/metrics-table.tsx"],"names":[],"mappings":"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"}

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

@@ -10,52 +10,9 @@
   text-decoration: underline;
 }
 
-/* columns */
-.metricName {
-  width: 100%;
-}
-
-.tableHeaderRunMetric {
-  text-transform: none;
-}
-
-.root .value {
-  padding-left: var(--space-large);
-  text-align: right;
-  vertical-align: baseline;
-}
-
+.root .value,
 .root .delta {
-  padding-left: 0;
-  text-align: left;
-  font-size: var(--size-xsmall);
-  vertical-align: baseline;
-}
-
-.root tbody .delta {
-  line-height: 1.6rem; /* baseline alignment with the value */
-}
-
-.root .value.current {
-  padding-right: var(--space-xxsmall);
-}
-
-.jobName {
-  white-space: nowrap;
-}
-
-/* columns overrides for showHeaderSum */
-.showHeaderSum .headerRowColumns .value,
-.showHeaderSum .headerRowColumns .delta {
-  border-bottom: 0;
-  padding-bottom: 0;
-}
-
-.headerRowTotals th {
-  padding-top: 0 !important;
-  font-weight: normal;
-  font-size: var(--size-xsmall);
-  vertical-align: middle;
+  text-align: right;
 }
 
 /** rows */
@@ -66,34 +23,22 @@
 
 .root .empty {
   background: none !important;
-  padding-top: var(--space-xxxlarge);
-  padding-bottom: var(--space-xxxlarge);
+  padding-top: calc(var(--space-xxxlarge) * 2);
+  padding-bottom: calc(var(--space-xxxlarge) * 2);
   text-align: center;
 }
 
+.emptyIcon {
+  color: var(--color-outline-dark);
+  width: var(--space-large);
+  height: var(--space-large);
+}
+
 .root .showAllItems {
   background: none !important;
   text-align: center;
 }
 
-/** show all */
-.showAllItemsButton {
-  appearance: none;
-  background: none;
-  margin: 0;
-  border: 0;
-  padding: var(--space-xxxsmall);
-  color: var(--color-primary);
-  text-decoration: underline;
-  cursor: pointer;
-}
-
-.showAllItemsButton:hover,
-.showAllItemsButton:focus,
-.showAllItemsButton:active {
-  color: var(--color-primary-dark);
-}
-
 /** Breakpoints */
 .root tr {
   display: flex;

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

@@ -0,0 +1,2 @@
+export * from './metrics-table-export';
+//# sourceMappingURL=index.js.map

package/lib-esm/components/metrics-table-export/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/metrics-table-export/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}