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

package/lib-esm/components/delta/delta.module.css

@@ -1,6 +1,11 @@
 .root {
-  white-space: nowrap;
   color: var(--color-gray-ultra-light);
+  font-family: var(--font-family-fixed);
+  white-space: nowrap;
+}
+
+.CHANGE {
+  color: var(--color-info);
 }
 
 .HIGH_NEGATIVE {
@@ -28,11 +33,16 @@
 }
 
 .inverted {
-  border-radius: var(--radius-small);
+  padding: 0 2px;
+  border-radius: var(--radius-xsmall);
   background-color: var(--color-gray-ultra-light);
   color: var(--color-light);
 }
 
+.inverted.CHANGE {
+  background: var(--color-info-light);
+}
+
 .inverted.HIGH_NEGATIVE {
   background: var(--color-red-dark);
 }

package/lib-esm/components/entry-info/entry-info.i18n.js

@@ -0,0 +1,4 @@
+export const PATH = 'Path';
+export const CLOSE_TITLE = 'Close side panel';
+export const SIZE = 'Size';
+//# sourceMappingURL=entry-info.i18n.js.map

package/lib-esm/components/entry-info/entry-info.i18n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-info.i18n.js","sourceRoot":"","sources":["../../../src/components/entry-info/entry-info.i18n.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC;AAC3B,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC;AAC9C,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC"}

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

@@ -0,0 +1,67 @@
+import React from 'react';
+import cx from 'classnames';
+import { Portal } from 'ariakit/portal';
+import { METRIC_TYPE_CONFIGS, getMetricRunInfo } from '@bundle-stats/utils';
+import { Box } from '../../layout/box';
+import { FlexStack } from '../../layout/flex-stack';
+import { Stack } from '../../layout/stack';
+import { FileName } from '../../ui/file-name';
+import { Button } from '../../ui/button';
+import { Icon } from '../../ui/icon';
+import { Table } from '../../ui/table';
+import { RunInfo } from '../run-info';
+import * as I18N from './entry-info.i18n';
+import css from './entry-info.module.css';
+import { CopyToClipboard, Tooltip } from '../../ui';
+export const EntryInfoMetaLink = (props) => {
+    const { as: BaseComponent = 'a', className = '', ...restProps } = props;
+    return React.createElement(BaseComponent, { className: cx(css.metaLink, className), ...restProps });
+};
+const EntryInfoMeta = ({ className = '', label, tooltip, children, }) => (React.createElement("div", { className: cx(css.meta, className) },
+    React.createElement("span", { className: css.metaLabel },
+        label,
+        tooltip && (React.createElement(Tooltip, { title: tooltip, className: css.metaLabelTooltip },
+            React.createElement(Icon, { glyph: "help" })))),
+    React.createElement("div", { className: css.metaContent }, children)));
+function defaultRenderRunInfo(item) {
+    var _a, _b, _c;
+    const baselineRun = item.runs.length > 1 ? (_a = item.runs) === null || _a === void 0 ? void 0 : _a[item.runs.length - 1] : null;
+    const metricRunInfo = getMetricRunInfo(METRIC_TYPE_CONFIGS.METRIC_TYPE_FILE_SIZE, ((_c = (_b = item.runs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.value) || 0, (baselineRun === null || baselineRun === void 0 ? void 0 : baselineRun.value) || 0);
+    return (React.createElement(RunInfo, { current: metricRunInfo.displayValue, delta: metricRunInfo.displayDeltaPercentage, deltaPercentage: metricRunInfo.displayDelta, deltaType: metricRunInfo.deltaType, baseline: (baselineRun === null || baselineRun === void 0 ? void 0 : baselineRun.displayValue) || '0B', size: "large" }));
+}
+export const EntryInfo = (props) => {
+    const { className = '', itemTitle = null, item, labels, runNameSelector = 'name', runNameLabel = I18N.PATH, runSizeLabel = I18N.SIZE, tags = null, onClose, renderRunInfo = defaultRenderRunInfo, RunName = React.Fragment, children, } = props;
+    return (React.createElement(Portal, { className: cx(css.root, className) },
+        React.createElement(Box, { padding: "medium", as: "header", className: css.header },
+            React.createElement(Stack, { space: "small" },
+                React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "h3", className: css.label },
+                    React.createElement(FileName, { as: "code", name: itemTitle || item.label, className: css.fileName }),
+                    React.createElement(CopyToClipboard, { text: item.label, size: "small" })),
+                React.createElement("div", null, renderRunInfo(item))),
+            React.createElement(Button, { radius: "circle", type: "button", onClick: onClose, "aria-label": I18N.CLOSE_TITLE, className: css.headerClose },
+                React.createElement(Icon, { glyph: Icon.ICONS.CLOSE, size: "large" }))),
+        React.createElement(Box, { padding: "medium", as: "main", className: css.contentWrapper },
+            React.createElement(Stack, { space: "small", className: css.content },
+                tags && React.createElement("div", null, tags),
+                children,
+                React.createElement(Table, { outline: true, compact: true, className: css.runs },
+                    React.createElement(Table.THead, null,
+                        React.createElement(Table.Tr, null,
+                            React.createElement(Table.Th, { className: cx(css.runsCell, css.runsColJob) }, "\u00A0"),
+                            React.createElement(Table.Th, { className: cx(css.runsCell, css.runsColName) }, runNameLabel),
+                            React.createElement(Table.Th, { className: cx(css.runsCell, css.runsColSize) }, runSizeLabel))),
+                    React.createElement(Table.TBody, null, item.runs.map((run, index) => {
+                        const key = `info-${(run === null || run === void 0 ? void 0 : run.name) || index}-${index}`;
+                        const rowRun = run;
+                        return (React.createElement(Table.Tr, { key: key },
+                            React.createElement(Table.Th, { className: cx(css.runsCell, css.runsColJob) }, labels[index]),
+                            React.createElement(Table.Td, { className: cx(css.runsCell, css.runsColName) }, (rowRun === null || rowRun === void 0 ? void 0 : rowRun[runNameSelector]) ? (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", className: css.label },
+                                React.createElement(RunName, { run: rowRun, nameSelector: runNameSelector },
+                                    React.createElement(FileName, { as: "code", name: rowRun[runNameSelector], className: className })),
+                                React.createElement(CopyToClipboard, { text: item.label, size: "small" }))) : ('-')),
+                            React.createElement(Table.Td, { className: cx(css.runsCell, css.runsColSize) },
+                                React.createElement("span", { className: css.size }, typeof (run === null || run === void 0 ? void 0 : run.value) !== 'undefined' ? run.value : '-'))));
+                    })))))));
+};
+EntryInfo.Meta = EntryInfoMeta;
+//# sourceMappingURL=entry-info.js.map

package/lib-esm/components/entry-info/entry-info.js.map

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

package/lib-esm/components/entry-info/entry-info.module.css

@@ -0,0 +1,136 @@
+.root {
+  position: fixed;
+  right: 0;
+  top: var(--entry-info-top);
+  bottom: 0;
+  width: 100vw;
+  max-width: var(--entry-info-width);
+  z-index: calc(var(--layer-high) - 1);
+  background: #fff;
+  box-shadow: var(--shadow-layer-high);
+}
+
+/** layout - full height content */
+.root {
+  display: flex;
+  flex-flow: column;
+}
+
+.header {
+  flex: 0 0 auto;
+}
+
+.contentWrapper {
+  flex: 1 1 auto;
+  overflow: auto;
+}
+
+/** header */
+.header {
+  /** space for close icon */
+  padding-right: calc(var(--space-xlarge) + var(--space-xxxsmall) + var(--space-xsmall));
+  border-bottom: 1px solid var(--color-outline);
+}
+
+.headerClose {
+  position: absolute;
+  right: calc(var(--space-small) - var(--space-xxxsmall));
+  top: calc(var(--space-small) - var(--space-xxxsmall));
+  color: var(--color-text-ultra-light);
+}
+
+.headerClose:hover,
+.headerClose:active,
+.headerClose:focus {
+  color: var(--color-text-light);
+}
+
+/** comon components */
+.fileName {
+  max-width: 100%;
+  padding: 0 2px;
+  background: var(--color-highlight-warning);
+  line-height: var(--line-height);
+}
+
+.label {
+  font-size: var(--size-medium);
+}
+
+.runs {
+  font-size: var(--size-small);
+}
+
+.runs .runsColJob {
+  white-space: nowrap;
+}
+
+.runs .runsColName {
+  width: 100%;
+}
+
+.runs .runsColSize {
+  text-align: right;
+  white-space: nowrap;
+}
+
+.size {
+  font-family: var(--font-family-fixed);
+}
+
+/**
+ * Meta element
+ */
+.meta {}
+
+.metaLabel {
+  margin-right: var(--space-xxxsmall);
+  min-width: 8em;
+  flex: 0 1 6em;
+  color: var(--color-text-light);
+}
+
+.metaLabelTooltip {
+  margin-left: var(--space-xxxsmall);
+  color: var(--color-text-ultra-light);
+}
+
+.metaContent {
+  padding: 1px 0;
+  flex: 0 1 auto;
+}
+
+.metaLink {
+  padding: 1px var(--space-xxxsmall);
+  display: inline-block;
+  line-height: var(--line-height-heading);
+  border-radius: var(--radius-small);
+  background: var(--color-highlight);
+  transition: var(--transition-out);
+
+  text-decoration: none;
+  text-transform: none;
+  font-weight: normal;
+  max-width: 16em;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.metaLink {
+  margin-right: var(--space-xxxsmall);
+}
+
+.metaLink:hover,
+.metaLink:active,
+.metaLink:focus {
+  background: var(--color-outline);
+  color: var(--color-primary-dark);
+}
+
+@media (min-width: 640px) {
+  .meta {
+    display: flex;
+    align-items: flex-start;
+  }
+}

package/lib-esm/components/entry-info/index.js

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

package/lib-esm/components/entry-info/index.js.map

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

package/lib-esm/components/index.js

@@ -1,7 +1,6 @@
 export { BrowsertimeTable } from './browsertime-table';
 export { BundleAssets } from './bundle-assets';
-export { BundleAssetsTotalsTable } from './bundle-assets-totals-table';
-export { BundleAssetsTotalsChartBars } from './bundle-assets-totals-chart-bars';
+export { BundleAssetsTotals } from './bundle-assets-totals';
 export { BundlePackages } from './bundle-packages';
 export { BundleModules } from './bundle-modules';
 export { ComponentLink } from './component-link';
@@ -9,16 +8,14 @@ export { Delta } from './delta';
 export { InsightIcon } from './insight-icon';
 export { Insights } from './insights';
 export { JobName } from './job-name';
-export { JobHeader } from './job-header';
 export { JobsHeader } from './jobs-header';
 export { LighthouseTable } from './lighthouse-table';
 export { Metric } from './metric';
+export { MetricRunInfo } from './metric-run-info';
 export { MetricsTable } from './metrics-table';
 export { MetricsTableOptions } from './metrics-table-options';
-export { MetricsTableSearch } from './metrics-table-search';
 export { MetricsTableTitle } from './metrics-table-title';
 export { ModuleInfo } from './module-info';
-export { SummaryItem } from './summary-item';
+export { RunInfo } from './run-info';
 export { Summary } from './summary';
-export { TotalSizeTypeTitle } from './total-size-type-title';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,aAAa,EAAsB,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAgB,MAAM,YAAY,CAAC;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}

package/lib-esm/components/insight-icon/insight-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"insight-icon.js","sourceRoot":"","sources":["../../../src/components/insight-icon/insight-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAErC,OAAO,GAAG,MAAM,2BAA2B,CAAC;AAE5C,MAAM,kBAAkB,GAAG,IAAI,GAAG,CAAC;IACjC,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IACrC,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;IACzC,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;CACpC,CAAC,CAAC;AAMH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;IACrD,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAClC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC;IAC5F,MAAM,aAAa,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,YAAY,CAAC,EAAE,SAAS,CAAC,CAAC;IACjE,MAAM,KAAK,GAAG,kBAAkB,CAAC,GAAG,CAAC,YAAY,CAAW,CAAC;IAE7D,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,GAAI,CAAC;AAC1D,CAAC,CAAC"}
+{"version":3,"file":"insight-icon.js","sourceRoot":"","sources":["../../../src/components/insight-icon/insight-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,OAAO,EAAE,IAAI,EAAa,MAAM,eAAe,CAAC;AAChD,OAAO,GAAG,MAAM,2BAA2B,CAAC;AAE5C,MAAM,kBAAkB,GAAG,IAAI,GAAG,CAAC;IACjC,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IACrC,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;IACzC,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;CACpC,CAAC,CAAC;AAMH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;IACrD,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAClC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC;IAC5F,MAAM,aAAa,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,YAAY,CAAC,EAAE,SAAS,CAAC,CAAC;IACjE,MAAM,KAAK,GAAG,kBAAkB,CAAC,GAAG,CAAC,YAAY,CAAc,CAAC;IAEhE,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,GAAI,CAAC;AAC1D,CAAC,CAAC"}

package/lib-esm/components/insight-icon/insight-icon.module.css

@@ -13,7 +13,7 @@
 
 .warning {
   padding-top: 1px;
-  background: var(--color-yellow-200);
+  background: var(--color-yellow-100);
   color: var(--color-yellow-900);
 }
 

package/lib-esm/components/insights/insights.js.map

@@ -1 +1 @@
-{"version":3,"file":"insights.js","sourceRoot":"","sources":["../../../src/components/insights/insights.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAEtE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAOxC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC/C,MAAM,EACJ,QAAQ,EACR,mBAAmB,EAAE,mBAAmB,GAAG,aAAa,EACxD,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,WAAW,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;IAE7C,OAAO,CACL,oBAAC,KAAK,IAAC,KAAK,EAAC,SAAS,KAAK,SAAS,IACjC,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3C,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,IAAwB,CAAC;QAClD,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,IAAI,EACT,KAAK,EAAC,SAAS,EACf,UAAU,EAAC,QAAQ,EACnB,EAAE,EAAE,mBAAmB,KACnB,IAAI,EACR,SAAS,EAAE,GAAG,CAAC,KAAK;YAEpB,oBAAC,WAAW,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,SAAS,EAAE,GAAG,CAAC,IAAI,GAAI;YACxD,kCAAO,IAAI,CAAQ,CACT,CACb,CAAC;IACJ,CAAC,CAAC,CACI,CACT,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"insights.js","sourceRoot":"","sources":["../../../src/components/insights/insights.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAEtE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAOxC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC/C,MAAM,EACJ,QAAQ,EACR,mBAAmB,EAAE,mBAAmB,GAAG,aAAa,EACxD,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,WAAW,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;IAE7C,OAAO,CACL,oBAAC,KAAK,IAAC,KAAK,EAAC,SAAS,KAAK,SAAS,IACjC,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3C,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,IAAwB,CAAC;QAClD,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,IAAI,EACT,KAAK,EAAC,SAAS,EACf,UAAU,EAAC,QAAQ,EACnB,EAAE,EAAE,mBAAmB,KACnB,IAAI,EACR,SAAS,EAAE,GAAG,CAAC,KAAK;YAEpB,oBAAC,WAAW,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,SAAS,EAAE,GAAG,CAAC,IAAI,GAAI;YACxD,kCAAO,IAAI,CAAQ,CACT,CACb,CAAC;IACJ,CAAC,CAAC,CACI,CACT,CAAC;AACJ,CAAC,CAAC"}

package/lib-esm/components/insights/insights.module.css

@@ -4,6 +4,7 @@
 
 .entry {
   color: inherit;
+  line-height: var(--line-height-heading);
   text-decoration: none;
 }
 

package/lib-esm/components/job-name/job-name.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Tooltip } from '../../ui/tooltip';
 import css from './job-name.module.css';
-export const JobName = ({ as: Component, title, internalBuildNumber, children, ...restProps }) => (React.createElement(Tooltip, { className: css.root, as: Component, title: title, ...restProps }, children || `Job #${internalBuildNumber}`));
+export const JobName = ({ as: Component = 'span', title, internalBuildNumber, children, ...restProps }) => (React.createElement(Tooltip, { className: css.root, as: Component, title: title, ...restProps }, children || `Job #${internalBuildNumber}`));
 JobName.defaultProps = {
     as: 'span',
     title: '',

package/lib-esm/components/job-name/job-name.js.map

@@ -1 +1 @@
-{"version":3,"file":"job-name.js","sourceRoot":"","sources":["../../../src/components/job-name/job-name.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAExC,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,mBAAmB,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE,CAAC,CAChG,oBAAC,OAAO,IAAC,SAAS,EAAE,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,KAAM,SAAS,IACrE,QAAQ,IAAI,QAAQ,mBAAmB,EAAE,CAClC,CACX,CAAC;AAEF,OAAO,CAAC,YAAY,GAAG;IACrB,EAAE,EAAE,MAAM;IACV,KAAK,EAAE,EAAE;IACT,mBAAmB,EAAE,IAAI;IACzB,QAAQ,EAAE,IAAI;CACf,CAAC;AAEF,OAAO,CAAC,SAAS,GAAG;IAElB,EAAE,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC;IAG3D,KAAK,EAAE,SAAS,CAAC,MAAM;IAGvB,mBAAmB,EAAE,SAAS,CAAC,MAAM;IAGrC,QAAQ,EAAE,SAAS,CAAC,IAAI;CACzB,CAAC"}
+{"version":3,"file":"job-name.js","sourceRoot":"","sources":["../../../src/components/job-name/job-name.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAExC,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,EAAE,EAAE,SAAS,GAAG,MAAM,EACtB,KAAK,EACL,mBAAmB,EACnB,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,EAAE,CAAC,CACJ,oBAAC,OAAO,IAAC,SAAS,EAAE,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,KAAM,SAAS,IACrE,QAAQ,IAAI,QAAQ,mBAAmB,EAAE,CAClC,CACX,CAAC;AAEF,OAAO,CAAC,YAAY,GAAG;IACrB,EAAE,EAAE,MAAM;IACV,KAAK,EAAE,EAAE;IACT,mBAAmB,EAAE,IAAI;IACzB,QAAQ,EAAE,IAAI;CACf,CAAC;AAEF,OAAO,CAAC,SAAS,GAAG;IAElB,EAAE,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC;IAG3D,KAAK,EAAE,SAAS,CAAC,MAAM;IAGvB,mBAAmB,EAAE,SAAS,CAAC,MAAM;IAGrC,QAAQ,EAAE,SAAS,CAAC,IAAI;CACzB,CAAC"}

package/lib-esm/components/jobs-header/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/jobs-header/index.js"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/jobs-header/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/lib-esm/components/jobs-header/jobs-header.js

@@ -1,23 +1,30 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import cx from 'classnames';
+import { formatDateTime } from '@bundle-stats/utils';
 import I18N from '../../i18n';
 import { FlexStack } from '../../layout/flex-stack';
-import { JobHeader } from '../job-header';
+import { Icon } from '../../ui/icon';
+import { Tag } from '../../ui/tag';
 import css from './jobs-header.module.css';
+export const Item = (props) => {
+    var _a;
+    const { className, tag, job } = props;
+    const { builtAt, hash } = ((_a = job.meta) === null || _a === void 0 ? void 0 : _a.webpack) || {};
+    const rootClassName = cx(css.item, className);
+    return (React.createElement(FlexStack, { space: "xsmall", alignItems: "center", className: rootClassName },
+        React.createElement(FlexStack, { space: "xxsmall", as: "h1", className: css.itemTitle },
+            React.createElement("span", null, `#${job.internalBuildNumber}`),
+            tag && React.createElement(Tag, { className: css.itemTag }, tag)),
+        builtAt && (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", inline: true, as: "span", title: builtAt, className: css.itemMeta },
+            React.createElement(Icon, { glyph: Icon.ICONS.CLOCK, className: css.itemMetaIcon }),
+            React.createElement("span", { className: css.itemMetaText }, formatDateTime({ dateStyle: 'medium', timeStyle: 'medium' }, builtAt)))),
+        hash && (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", inline: true, as: "span", title: "Webpack bundle hash", className: css.itemMeta },
+            React.createElement(Icon, { glyph: Icon.ICONS.COMMIT, className: css.itemMetaIcon }),
+            React.createElement("span", { className: css.itemMetaText }, hash.slice(0, 7))))));
+};
 export const JobsHeader = (props) => {
     const { className, jobs } = props;
     const rootClassName = cx(css.root, className);
-    return (React.createElement(FlexStack, { className: rootClassName, space: "none" }, jobs === null || jobs === void 0 ? void 0 : jobs.map((job, index) => (React.createElement(JobHeader, { key: job.internalBuildNumber || index, className: css.item, job: job, tag: index === 0 ? I18N.CURRENT : I18N.BASELINE })))));
-};
-JobsHeader.propTypes = {
-    className: PropTypes.string,
-    jobs: PropTypes.arrayOf(PropTypes.shape({
-        internalBuildNumber: PropTypes.number,
-    })),
-};
-JobsHeader.defaultProps = {
-    className: '',
-    jobs: null,
+    return (React.createElement("header", { className: rootClassName }, jobs === null || jobs === void 0 ? void 0 : jobs.map((job, index) => (React.createElement(Item, { key: job.internalBuildNumber || index, job: job, tag: index === 0 ? I18N.CURRENT : I18N.BASELINE })))));
 };
 //# sourceMappingURL=jobs-header.js.map

package/lib-esm/components/jobs-header/jobs-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"jobs-header.js","sourceRoot":"","sources":["../../../src/components/jobs-header/jobs-header.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,GAAG,MAAM,0BAA0B,CAAC;AAE3C,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,EAAE;IAClC,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAClC,MAAM,aAAa,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE9C,OAAO,CACL,oBAAC,SAAS,IAAC,SAAS,EAAE,aAAa,EAAE,KAAK,EAAC,MAAM,IAC9C,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CACzB,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAC,mBAAmB,IAAI,KAAK,EACrC,SAAS,EAAE,GAAG,CAAC,IAAI,EACnB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,GAC/C,CACH,CAAC,CACQ,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,SAAS,GAAG;IAErB,SAAS,EAAE,SAAS,CAAC,MAAM;IAG3B,IAAI,EAAE,SAAS,CAAC,OAAO,CACrB,SAAS,CAAC,KAAK,CAAC;QACd,mBAAmB,EAAE,SAAS,CAAC,MAAM;KACtC,CAAC,CACH;CACF,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG;IACxB,SAAS,EAAE,EAAE;IACb,IAAI,EAAE,IAAI;CACX,CAAC"}
+{"version":3,"file":"jobs-header.js","sourceRoot":"","sources":["../../../src/components/jobs-header/jobs-header.tsx"],"names":[],"mappings":"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"}

package/lib-esm/components/jobs-header/jobs-header.module.css

@@ -1,16 +1,60 @@
 .root {
-  align-items: stretch;
-  flex-wrap: wrap;
   padding: var(--space-small) 0;
+  width: 100%;
+  display: flex;
 }
 
 .item {
-  flex: 0 0 auto;
-  padding: 0 var(--space-medium);
+  position: relative;
+  flex: 1 0 10%;
+  max-width: 50%;
+  overflow: hidden;
+  padding: 0 var(--space-small);
   border-left: 1px solid var(--color-outline);
 }
 
+.item::after {
+  content: '';
+  display: block;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: var(--space-xxsmall);
+  background: linear-gradient(90deg, transparent, var(--color-background));
+}
+
 .item:first-child {
   border-left: 0;
   padding-left: 0;
 }
+
+.itemTitle {
+  font-size: var(--size-xlarge);
+  line-height: 1;
+  font-weight: bold;
+  vertical-align: top;
+}
+
+.itemTag {
+  margin-left: var(--space-xxsmall);
+  vertical-align: top;
+  outline: 1px solid var(--color-outline);
+  background: var(--color-highlight);
+  color: var(--color-text-light);
+}
+
+.itemMeta {
+  color: var(--color-text-light);
+  font-size: var(--size-small);
+}
+
+.itemMetaIcon {
+  flex: 0 0 auto;
+  color: var(--color-text-ultra-light);
+}
+
+.itemMetaText {
+  flex: 0 0 auto;
+  white-space: nowrap;
+}

package/lib-esm/components/metric/index.js.map

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

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

@@ -1,47 +1,13 @@
-import React, { useMemo } from 'react';
-import PropTypes from 'prop-types';
+import React from 'react';
 import cx from 'classnames';
 import css from './metric.module.css';
-const EXTRACT_VALUE_UNIT_PATTERN = /([\d|.|,| ]*)(\w*|%)$/;
-export const Metric = ({ className, value, formatter, inline, children, enhanced }) => {
-    const { displayValue, displayUnit } = useMemo(() => {
-        const formattedValue = formatter === null || formatter === void 0 ? void 0 : formatter(value);
-        if (!formattedValue) {
-            return { displayValue: value };
-        }
-        if (!enhanced) {
-            return { displayValue: formattedValue };
-        }
-        const matches = formattedValue.match(EXTRACT_VALUE_UNIT_PATTERN);
-        if (!matches) {
-            return { displayValue: value };
-        }
-        return {
-            displayUnit: matches[2],
-            displayValue: matches[1],
-        };
-    }, [formatter, value]);
+export const Metric = (props) => {
+    const { className = '', value = '0', unit = '', inline = false, children = null, ...restProps } = props;
     const rootClassName = cx(className, css.root, inline && css.inline);
-    return (React.createElement("div", { className: rootClassName },
+    return (React.createElement("div", { className: rootClassName, ...restProps },
         React.createElement("div", { className: css.display },
-            React.createElement("span", { className: css.displayValue }, displayValue),
-            displayUnit && React.createElement("span", { className: css.displayUnit }, displayUnit)),
-        React.createElement("div", { className: css.delta }, children)));
-};
-Metric.defaultProps = {
-    className: '',
-    enhanced: false,
-    inline: false,
-    value: 0,
-    children: [],
-    formatter: (val) => val,
-};
-Metric.propTypes = {
-    className: PropTypes.string,
-    enhanced: PropTypes.bool,
-    inline: PropTypes.bool,
-    value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    formatter: PropTypes.func,
-    children: PropTypes.node,
+            React.createElement("span", { className: css.displayValue }, value),
+            unit && React.createElement("span", { className: css.displayUnit }, unit)),
+        children && React.createElement("div", { className: css.content }, children)));
 };
 //# sourceMappingURL=metric.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"metric.js","sourceRoot":"","sources":["../../../src/components/metric/metric.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,GAAG,MAAM,qBAAqB,CAAC;AAGtC,MAAM,0BAA0B,GAAG,uBAAuB,CAAC;AAE3D,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpF,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE;QACjD,MAAM,cAAc,GAAG,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,KAAK,CAAC,CAAC;QAE1C,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC;SAChC;QAED,IAAI,CAAC,QAAQ,EAAE;YACb,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,CAAC;SACzC;QAED,MAAM,OAAO,GAAG,cAAc,CAAC,KAAK,CAAC,0BAA0B,CAAC,CAAC;QAEjE,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC;SAChC;QAED,OAAO;YACL,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC;YACvB,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC;SACzB,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;IAEvB,MAAM,aAAa,GAAG,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,IAAI,EAAE,MAAM,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC;IAEpE,OAAO,CACL,6BAAK,SAAS,EAAE,aAAa;QAC3B,6BAAK,SAAS,EAAE,GAAG,CAAC,OAAO;YACzB,8BAAM,SAAS,EAAE,GAAG,CAAC,YAAY,IAAG,YAAY,CAAQ;YACvD,WAAW,IAAI,8BAAM,SAAS,EAAE,GAAG,CAAC,WAAW,IAAG,WAAW,CAAQ,CAClE;QACN,6BAAK,SAAS,EAAE,GAAG,CAAC,KAAK,IAAG,QAAQ,CAAO,CACvC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,YAAY,GAAG;IACpB,SAAS,EAAE,EAAE;IACb,QAAQ,EAAE,KAAK;IACf,MAAM,EAAE,KAAK;IACb,KAAK,EAAE,CAAC;IACR,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG;CACxB,CAAC;AAEF,MAAM,CAAC,SAAS,GAAG;IACjB,SAAS,EAAE,SAAS,CAAC,MAAM;IAC3B,QAAQ,EAAE,SAAS,CAAC,IAAI;IACxB,MAAM,EAAE,SAAS,CAAC,IAAI;IACtB,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAChE,SAAS,EAAE,SAAS,CAAC,IAAI;IACzB,QAAQ,EAAE,SAAS,CAAC,IAAI;CACzB,CAAC"}
+{"version":3,"file":"metric.js","sourceRoot":"","sources":["../../../src/components/metric/metric.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,GAAG,MAAM,qBAAqB,CAAC;AAiBtC,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAgD,EAAE,EAAE;IACzE,MAAM,EACJ,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,GAAG,EACX,IAAI,GAAG,EAAE,EACT,MAAM,GAAG,KAAK,EACd,QAAQ,GAAG,IAAI,EACf,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,aAAa,GAAG,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,IAAI,EAAE,MAAM,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC;IAEpE,OAAO,CACL,6BAAK,SAAS,EAAE,aAAa,KAAM,SAAS;QAC1C,6BAAK,SAAS,EAAE,GAAG,CAAC,OAAO;YACzB,8BAAM,SAAS,EAAE,GAAG,CAAC,YAAY,IAAG,KAAK,CAAQ;YAChD,IAAI,IAAI,8BAAM,SAAS,EAAE,GAAG,CAAC,WAAW,IAAG,IAAI,CAAQ,CACpD;QACL,QAAQ,IAAI,6BAAK,SAAS,EAAE,GAAG,CAAC,OAAO,IAAG,QAAQ,CAAO,CACtD,CACP,CAAC;AACJ,CAAC,CAAC"}

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

@@ -1,12 +1,13 @@
 .root {
-  letter-spacing: 0.05em;
+  font-family: var(--font-family-fixed);
+  line-height: 1;
 }
 
 .displayUnit {
   font-size: var(--size-small);
 }
 
-.delta {
+.content {
   font-size: var(--size-small);
 }
 
@@ -14,7 +15,7 @@
   display: inline-block;
 }
 
-.inline .delta {
+.inline .content {
   display: inline-block;
-  margin: 0 0 0 var(--space-xxxsmall);
+  margin: 0 0 0 var(--space-xxsmall);
 }

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/metric-run-info/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}