@bundle-stats/ui 4.4.0-beta.0 → 4.4.0-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/globals.d.ts +4 -0
- package/lib/app/app.js +26 -8
- package/lib/app/app.js.map +1 -1
- package/lib/app/app.module.css +8 -5
- package/lib/assets/icons.svg +17 -1
- package/lib/assets/icons.svg.js +12 -0
- package/lib/assets/icons.svg.js.map +1 -1
- package/lib/components/asset-info/asset-info.js +48 -44
- package/lib/components/asset-info/asset-info.js.map +1 -1
- package/lib/components/asset-info/asset-info.module.css +28 -6
- package/lib/components/asset-info/index.js.map +1 -1
- package/lib/components/asset-not-predictive/asset-not-predictive.js +28 -0
- package/lib/components/asset-not-predictive/asset-not-predictive.js.map +1 -0
- package/lib/components/asset-not-predictive/asset-not-predictive.module.css +3 -0
- package/lib/components/{duplicate-packages-insight → asset-not-predictive}/index.js +1 -1
- package/lib/components/asset-not-predictive/index.js.map +1 -0
- package/lib/components/bundle-assets/bundle-assets.js +31 -44
- package/lib/components/bundle-assets/bundle-assets.js.map +1 -1
- package/lib/components/bundle-assets/bundle-assets.module.css +11 -22
- package/lib/components/bundle-assets/bundle-assets.utils.js +3 -1
- package/lib/components/bundle-assets/bundle-assets.utils.js.map +1 -1
- package/lib/components/bundle-assets/index.js +4 -1
- package/lib/components/bundle-assets/index.js.map +1 -1
- package/lib/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.js +11 -7
- package/lib/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.js.map +1 -1
- package/lib/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.module.css +1 -1
- package/lib/components/bundle-modules/bundle-modules.js +30 -39
- package/lib/components/bundle-modules/bundle-modules.js.map +1 -1
- package/lib/components/bundle-modules/bundle-modules.module.css +3 -2
- package/lib/components/bundle-modules/bundle-modules.utils.js +5 -5
- package/lib/components/bundle-modules/bundle-modules.utils.js.map +1 -1
- package/lib/components/bundle-modules/index.js +5 -2
- package/lib/components/bundle-modules/index.js.map +1 -1
- package/lib/components/bundle-packages/bundle-packages.js +36 -61
- package/lib/components/bundle-packages/bundle-packages.js.map +1 -1
- package/lib/components/bundle-packages/bundle-packages.module.css +4 -0
- package/lib/components/bundle-packages/index.js +4 -1
- package/lib/components/bundle-packages/index.js.map +1 -1
- package/lib/components/delta/delta.module.css +2 -1
- package/lib/components/entry-info/entry-info.js +56 -0
- package/lib/components/entry-info/entry-info.js.map +1 -0
- package/lib/components/entry-info/entry-info.module.css +92 -0
- package/lib/components/{summary-item → entry-info}/index.js +1 -1
- package/lib/components/entry-info/index.js.map +1 -0
- package/lib/components/index.js +9 -7
- package/lib/components/index.js.map +1 -1
- package/lib/components/insight-icon/index.js +18 -0
- package/lib/components/insight-icon/index.js.map +1 -0
- package/lib/components/insight-icon/insight-icon.js +25 -0
- package/lib/components/insight-icon/insight-icon.js.map +1 -0
- package/lib/components/insight-icon/insight-icon.module.css +24 -0
- package/lib/components/{job-meta → insights}/index.js +1 -1
- package/lib/components/insights/index.js.map +1 -0
- package/lib/components/insights/insights.js +25 -0
- package/lib/components/insights/insights.js.map +1 -0
- package/lib/components/insights/insights.module.css +14 -0
- package/lib/components/job-header/job-header.js +12 -11
- package/lib/components/job-header/job-header.js.map +1 -1
- package/lib/components/jobs-header/index.js.map +1 -1
- package/lib/components/jobs-header/jobs-header.js +21 -14
- package/lib/components/jobs-header/jobs-header.js.map +1 -1
- package/lib/components/jobs-header/jobs-header.module.css +51 -4
- package/lib/components/metric/index.js.map +1 -1
- package/lib/components/metric/metric.js +7 -64
- package/lib/components/metric/metric.js.map +1 -1
- package/lib/components/metric/metric.module.css +3 -3
- package/lib/components/metric-run-info/index.js +18 -0
- package/lib/components/metric-run-info/index.js.map +1 -0
- package/lib/components/metric-run-info/metric-run-info.js +64 -0
- package/lib/components/metric-run-info/metric-run-info.js.map +1 -0
- package/lib/components/metric-run-info/metric-run-info.module.css +18 -0
- package/lib/components/metrics-table-options/metrics-table-options.js +1 -1
- package/lib/components/metrics-table-options/metrics-table-options.js.map +1 -1
- package/lib/components/metrics-table-search/metrics-table-search.module.css +0 -6
- package/lib/components/metrics-table-title/metrics-table-title.module.css +1 -0
- package/lib/components/module-info/index.js.map +1 -1
- package/lib/components/module-info/module-info.js +47 -47
- package/lib/components/module-info/module-info.js.map +1 -1
- package/lib/components/module-info/module-info.module.css +8 -33
- package/lib/components/package-info/index.js +18 -0
- package/lib/components/package-info/index.js.map +1 -0
- package/lib/components/package-info/package-info.js +77 -0
- package/lib/components/package-info/package-info.js.map +1 -0
- package/lib/components/package-info/package-info.module.css +13 -0
- package/lib/components/run-info/index.js +18 -0
- package/lib/components/run-info/index.js.map +1 -0
- package/lib/components/run-info/run-info.js +70 -0
- package/lib/components/run-info/run-info.js.map +1 -0
- package/lib/components/run-info/run-info.module.css +76 -0
- package/lib/components/summary/index.js.map +1 -1
- package/lib/components/summary/summary.js +10 -31
- package/lib/components/summary/summary.js.map +1 -1
- package/lib/components/summary/summary.module.css +27 -7
- package/lib/constants.js +1 -23
- package/lib/constants.js.map +1 -1
- package/lib/css/variables.css +18 -13
- package/lib/layout/box/box.js +3 -23
- package/lib/layout/box/box.js.map +1 -1
- package/lib/layout/box/box.module.css +11 -0
- package/lib/layout/box/index.js +15 -3
- package/lib/layout/box/index.js.map +1 -1
- package/lib/layout/flex-stack/flex-stack.js +3 -19
- package/lib/layout/flex-stack/flex-stack.js.map +1 -1
- package/lib/layout/flex-stack/index.js.map +1 -1
- package/lib/layout/stack/index.js.map +1 -1
- package/lib/layout/stack/stack.js +3 -16
- package/lib/layout/stack/stack.js.map +1 -1
- package/lib/tokens.js +38 -0
- package/lib/tokens.js.map +1 -0
- package/lib/ui/alert/alert.js +2 -12
- package/lib/ui/alert/alert.js.map +1 -1
- package/lib/ui/alert/index.js.map +1 -1
- package/lib/ui/container/container.js +1 -10
- package/lib/ui/container/container.js.map +1 -1
- package/lib/ui/container/index.js +15 -3
- package/lib/ui/container/index.js.map +1 -1
- package/lib/ui/dropdown/dropdown.module.css +1 -2
- package/lib/ui/file-name/file-name.js +1 -1
- package/lib/ui/file-name/file-name.js.map +1 -1
- package/lib/ui/filters/filters.module.css +1 -5
- package/lib/ui/horizontal-bar-chart/horizontal-bar-chart.module.css +2 -0
- package/lib/ui/hover-card/hover-card.js +3 -21
- package/lib/ui/hover-card/hover-card.js.map +1 -1
- package/lib/ui/hover-card/index.js.map +1 -1
- package/lib/ui/icon/icon.js +4 -0
- package/lib/ui/icon/icon.js.map +1 -1
- package/lib/ui/index.js +1 -3
- package/lib/ui/index.js.map +1 -1
- package/lib/ui/input/input.module.css +3 -4
- package/lib/ui/table/index.js.map +1 -1
- package/lib/ui/table/table.js +3 -17
- package/lib/ui/table/table.js.map +1 -1
- package/lib/ui/tag/index.js.map +1 -1
- package/lib/ui/tag/tag.js +5 -29
- package/lib/ui/tag/tag.js.map +1 -1
- package/lib/ui/tag/tag.module.css +15 -1
- package/lib/ui/tooltip/index.js.map +1 -1
- package/lib/ui/tooltip/tooltip.js +3 -23
- package/lib/ui/tooltip/tooltip.js.map +1 -1
- package/lib/ui/tooltip/tooltip.module.css +3 -4
- package/lib-esm/app/app.js +27 -9
- package/lib-esm/app/app.js.map +1 -1
- package/lib-esm/app/app.module.css +8 -5
- package/lib-esm/assets/icons.svg +17 -1
- package/lib-esm/assets/icons.svg.js +12 -0
- package/lib-esm/assets/icons.svg.js.map +1 -1
- package/lib-esm/components/asset-info/asset-info.js +27 -45
- package/lib-esm/components/asset-info/asset-info.js.map +1 -1
- package/lib-esm/components/asset-info/asset-info.module.css +28 -6
- package/lib-esm/components/asset-info/index.js.map +1 -1
- package/lib-esm/components/asset-not-predictive/asset-not-predictive.js +21 -0
- package/lib-esm/components/asset-not-predictive/asset-not-predictive.js.map +1 -0
- package/lib-esm/components/asset-not-predictive/asset-not-predictive.module.css +3 -0
- package/lib-esm/components/asset-not-predictive/index.js +2 -0
- package/lib-esm/components/asset-not-predictive/index.js.map +1 -0
- package/lib-esm/components/bundle-assets/bundle-assets.js +34 -49
- package/lib-esm/components/bundle-assets/bundle-assets.js.map +1 -1
- package/lib-esm/components/bundle-assets/bundle-assets.module.css +11 -22
- package/lib-esm/components/bundle-assets/bundle-assets.utils.js +3 -1
- package/lib-esm/components/bundle-assets/bundle-assets.utils.js.map +1 -1
- package/lib-esm/components/bundle-assets/index.js +5 -2
- package/lib-esm/components/bundle-assets/index.js.map +1 -1
- package/lib-esm/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.js +10 -8
- package/lib-esm/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.js.map +1 -1
- package/lib-esm/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.module.css +1 -1
- package/lib-esm/components/bundle-modules/bundle-modules.js +32 -41
- package/lib-esm/components/bundle-modules/bundle-modules.js.map +1 -1
- package/lib-esm/components/bundle-modules/bundle-modules.module.css +3 -2
- package/lib-esm/components/bundle-modules/bundle-modules.utils.js +3 -3
- package/lib-esm/components/bundle-modules/bundle-modules.utils.js.map +1 -1
- package/lib-esm/components/bundle-modules/index.js +7 -4
- package/lib-esm/components/bundle-modules/index.js.map +1 -1
- package/lib-esm/components/bundle-packages/bundle-packages.js +37 -62
- package/lib-esm/components/bundle-packages/bundle-packages.js.map +1 -1
- package/lib-esm/components/bundle-packages/bundle-packages.module.css +4 -0
- package/lib-esm/components/bundle-packages/index.js +5 -2
- package/lib-esm/components/bundle-packages/index.js.map +1 -1
- package/lib-esm/components/delta/delta.module.css +2 -1
- package/lib-esm/components/entry-info/entry-info.js +50 -0
- package/lib-esm/components/entry-info/entry-info.js.map +1 -0
- package/lib-esm/components/entry-info/entry-info.module.css +92 -0
- package/lib-esm/components/entry-info/index.js +2 -0
- package/lib-esm/components/entry-info/index.js.map +1 -0
- package/lib-esm/components/index.js +4 -3
- package/lib-esm/components/index.js.map +1 -1
- package/lib-esm/components/insight-icon/index.js +2 -0
- package/lib-esm/components/insight-icon/index.js.map +1 -0
- package/lib-esm/components/insight-icon/insight-icon.js +18 -0
- package/lib-esm/components/insight-icon/insight-icon.js.map +1 -0
- package/lib-esm/components/insight-icon/insight-icon.module.css +24 -0
- package/lib-esm/components/insights/index.js +2 -0
- package/lib-esm/components/insights/index.js.map +1 -0
- package/lib-esm/components/insights/insights.js +18 -0
- package/lib-esm/components/insights/insights.js.map +1 -0
- package/lib-esm/components/insights/insights.module.css +14 -0
- package/lib-esm/components/job-header/job-header.js +12 -11
- package/lib-esm/components/job-header/job-header.js.map +1 -1
- package/lib-esm/components/jobs-header/index.js.map +1 -1
- package/lib-esm/components/jobs-header/jobs-header.js +20 -13
- package/lib-esm/components/jobs-header/jobs-header.js.map +1 -1
- package/lib-esm/components/jobs-header/jobs-header.module.css +51 -4
- package/lib-esm/components/metric/index.js.map +1 -1
- package/lib-esm/components/metric/metric.js +7 -41
- package/lib-esm/components/metric/metric.js.map +1 -1
- package/lib-esm/components/metric/metric.module.css +3 -3
- package/lib-esm/components/metric-run-info/index.js +2 -0
- package/lib-esm/components/metric-run-info/index.js.map +1 -0
- package/lib-esm/components/metric-run-info/metric-run-info.js +34 -0
- package/lib-esm/components/metric-run-info/metric-run-info.js.map +1 -0
- package/lib-esm/components/metric-run-info/metric-run-info.module.css +18 -0
- package/lib-esm/components/metrics-table-options/metrics-table-options.js +1 -1
- package/lib-esm/components/metrics-table-options/metrics-table-options.js.map +1 -1
- package/lib-esm/components/metrics-table-search/metrics-table-search.module.css +0 -6
- package/lib-esm/components/metrics-table-title/metrics-table-title.module.css +1 -0
- package/lib-esm/components/module-info/index.js.map +1 -1
- package/lib-esm/components/module-info/module-info.js +26 -48
- package/lib-esm/components/module-info/module-info.js.map +1 -1
- package/lib-esm/components/module-info/module-info.module.css +8 -33
- package/lib-esm/components/package-info/index.js +2 -0
- package/lib-esm/components/package-info/index.js.map +1 -0
- package/lib-esm/components/package-info/package-info.js +48 -0
- package/lib-esm/components/package-info/package-info.js.map +1 -0
- package/lib-esm/components/package-info/package-info.module.css +13 -0
- package/lib-esm/components/run-info/index.js +2 -0
- package/lib-esm/components/run-info/index.js.map +1 -0
- package/lib-esm/components/run-info/run-info.js +40 -0
- package/lib-esm/components/run-info/run-info.js.map +1 -0
- package/lib-esm/components/run-info/run-info.module.css +76 -0
- package/lib-esm/components/summary/index.js.map +1 -1
- package/lib-esm/components/summary/summary.js +9 -30
- package/lib-esm/components/summary/summary.js.map +1 -1
- package/lib-esm/components/summary/summary.module.css +27 -7
- package/lib-esm/constants.js +0 -22
- package/lib-esm/constants.js.map +1 -1
- package/lib-esm/css/variables.css +18 -13
- package/lib-esm/layout/box/box.js +3 -23
- package/lib-esm/layout/box/box.js.map +1 -1
- package/lib-esm/layout/box/box.module.css +11 -0
- package/lib-esm/layout/box/index.js +1 -1
- package/lib-esm/layout/box/index.js.map +1 -1
- package/lib-esm/layout/flex-stack/flex-stack.js +3 -19
- package/lib-esm/layout/flex-stack/flex-stack.js.map +1 -1
- package/lib-esm/layout/flex-stack/index.js.map +1 -1
- package/lib-esm/layout/stack/index.js.map +1 -1
- package/lib-esm/layout/stack/stack.js +3 -16
- package/lib-esm/layout/stack/stack.js.map +1 -1
- package/lib-esm/tokens.js +35 -0
- package/lib-esm/tokens.js.map +1 -0
- package/lib-esm/ui/alert/alert.js +2 -12
- package/lib-esm/ui/alert/alert.js.map +1 -1
- package/lib-esm/ui/alert/index.js.map +1 -1
- package/lib-esm/ui/container/container.js +1 -10
- package/lib-esm/ui/container/container.js.map +1 -1
- package/lib-esm/ui/container/index.js +1 -1
- package/lib-esm/ui/container/index.js.map +1 -1
- package/lib-esm/ui/dropdown/dropdown.module.css +1 -2
- package/lib-esm/ui/file-name/file-name.js +1 -1
- package/lib-esm/ui/file-name/file-name.js.map +1 -1
- package/lib-esm/ui/filters/filters.module.css +1 -5
- package/lib-esm/ui/horizontal-bar-chart/horizontal-bar-chart.module.css +2 -0
- package/lib-esm/ui/hover-card/hover-card.js +3 -21
- package/lib-esm/ui/hover-card/hover-card.js.map +1 -1
- package/lib-esm/ui/hover-card/index.js.map +1 -1
- package/lib-esm/ui/icon/icon.js +4 -0
- package/lib-esm/ui/icon/icon.js.map +1 -1
- package/lib-esm/ui/index.js +0 -1
- package/lib-esm/ui/index.js.map +1 -1
- package/lib-esm/ui/input/input.module.css +3 -4
- package/lib-esm/ui/table/index.js.map +1 -1
- package/lib-esm/ui/table/table.js +3 -17
- package/lib-esm/ui/table/table.js.map +1 -1
- package/lib-esm/ui/tag/index.js.map +1 -1
- package/lib-esm/ui/tag/tag.js +4 -28
- package/lib-esm/ui/tag/tag.js.map +1 -1
- package/lib-esm/ui/tag/tag.module.css +15 -1
- package/lib-esm/ui/tooltip/index.js.map +1 -1
- package/lib-esm/ui/tooltip/tooltip.js +4 -23
- package/lib-esm/ui/tooltip/tooltip.js.map +1 -1
- package/lib-esm/ui/tooltip/tooltip.module.css +3 -4
- package/package.json +23 -29
- package/src/app/app.jsx +34 -9
- package/src/app/app.module.css +8 -5
- package/src/assets/icons/error.svg +6 -0
- package/src/assets/icons/external-link.svg +1 -0
- package/src/assets/icons/info.svg +6 -0
- package/src/assets/icons/more-vertical.svg +5 -0
- package/src/assets/icons.svg +17 -1
- package/src/assets/icons.svg.jsx +53 -0
- package/src/components/asset-info/asset-info.module.css +28 -6
- package/src/components/asset-info/asset-info.stories.tsx +74 -0
- package/src/components/asset-info/asset-info.tsx +159 -0
- package/src/components/asset-not-predictive/asset-not-predictive.module.css +3 -0
- package/src/components/asset-not-predictive/asset-not-predictive.stories.tsx +23 -0
- package/src/components/asset-not-predictive/asset-not-predictive.tsx +44 -0
- package/src/components/asset-not-predictive/index.ts +1 -0
- package/src/components/bundle-assets/bundle-assets.jsx +94 -107
- package/src/components/bundle-assets/bundle-assets.module.css +11 -22
- package/src/components/bundle-assets/bundle-assets.utils.js +3 -2
- package/src/components/bundle-assets/index.jsx +7 -1
- package/src/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.jsx +21 -17
- package/src/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.module.css +1 -1
- package/src/components/bundle-modules/bundle-modules.jsx +91 -100
- package/src/components/bundle-modules/bundle-modules.module.css +3 -2
- package/src/components/bundle-modules/bundle-modules.utils.js +5 -3
- package/src/components/bundle-modules/index.jsx +9 -3
- package/src/components/bundle-packages/bundle-packages.jsx +116 -179
- package/src/components/bundle-packages/bundle-packages.module.css +4 -0
- package/src/components/bundle-packages/index.jsx +7 -1
- package/src/components/delta/delta.module.css +2 -1
- package/src/components/entry-info/entry-info.module.css +92 -0
- package/src/components/entry-info/entry-info.stories.tsx +75 -0
- package/src/components/entry-info/entry-info.tsx +134 -0
- package/src/components/entry-info/index.ts +1 -0
- package/src/components/index.js +4 -3
- package/src/components/insight-icon/index.ts +1 -0
- package/src/components/insight-icon/insight-icon.module.css +24 -0
- package/src/components/insight-icon/insight-icon.tsx +25 -0
- package/src/components/insights/index.ts +1 -0
- package/src/components/insights/insights.module.css +14 -0
- package/src/components/insights/insights.stories.tsx +54 -0
- package/src/components/insights/insights.tsx +44 -0
- package/src/components/job-header/job-header.jsx +16 -13
- package/src/components/jobs-header/jobs-header.module.css +51 -4
- package/src/components/jobs-header/jobs-header.stories.tsx +51 -0
- package/src/components/jobs-header/jobs-header.tsx +90 -0
- package/src/components/metric/metric.module.css +3 -3
- package/src/components/metric/metric.stories.tsx +41 -0
- package/src/components/metric/metric.tsx +42 -0
- package/src/components/metric-run-info/index.ts +1 -0
- package/src/components/metric-run-info/metric-run-info.module.css +18 -0
- package/src/components/metric-run-info/metric-run-info.stories.tsx +34 -0
- package/src/components/metric-run-info/metric-run-info.tsx +85 -0
- package/src/components/metrics-table-options/metrics-table-options.jsx +1 -1
- package/src/components/metrics-table-search/metrics-table-search.module.css +0 -6
- package/src/components/metrics-table-title/metrics-table-title.module.css +1 -0
- package/src/components/module-info/module-info.module.css +8 -33
- package/src/components/module-info/module-info.stories.tsx +44 -0
- package/src/components/module-info/module-info.tsx +116 -0
- package/src/components/package-info/index.ts +1 -0
- package/src/components/package-info/package-info.module.css +13 -0
- package/src/components/package-info/package-info.stories.tsx +36 -0
- package/src/components/package-info/package-info.tsx +135 -0
- package/src/components/run-info/index.ts +1 -0
- package/src/components/run-info/run-info.module.css +76 -0
- package/src/components/run-info/run-info.stories.tsx +58 -0
- package/src/components/run-info/run-info.tsx +111 -0
- package/src/components/summary/summary.module.css +27 -7
- package/src/components/summary/summary.stories.tsx +57 -0
- package/src/components/summary/summary.tsx +103 -0
- package/src/constants.js +0 -24
- package/src/css/variables.css +18 -13
- package/src/layout/box/box.module.css +11 -0
- package/src/layout/box/box.stories.tsx +49 -0
- package/src/layout/box/box.tsx +49 -0
- package/src/layout/box/index.ts +1 -0
- package/src/layout/flex-stack/flex-stack.stories.tsx +59 -0
- package/src/layout/flex-stack/flex-stack.tsx +43 -0
- package/src/layout/stack/stack.stories.tsx +53 -0
- package/src/layout/stack/stack.tsx +22 -0
- package/src/tokens.ts +37 -0
- package/src/ui/alert/alert.stories.tsx +39 -0
- package/src/ui/alert/alert.tsx +23 -0
- package/src/ui/container/container.stories.tsx +29 -0
- package/src/ui/container/container.tsx +18 -0
- package/src/ui/container/index.ts +1 -0
- package/src/ui/dropdown/dropdown.module.css +1 -2
- package/src/ui/file-name/file-name.jsx +1 -1
- package/src/ui/filters/filters.module.css +1 -5
- package/src/ui/horizontal-bar-chart/horizontal-bar-chart.module.css +2 -0
- package/src/ui/hover-card/hover-card.stories.tsx +41 -0
- package/src/ui/hover-card/{hover-card.jsx → hover-card.tsx} +22 -30
- package/src/ui/icon/icon.jsx +4 -0
- package/src/ui/index.js +0 -1
- package/src/ui/input/input.module.css +3 -4
- package/src/ui/table/table.stories.tsx +238 -0
- package/src/ui/table/table.tsx +38 -0
- package/src/ui/tag/tag.module.css +15 -1
- package/src/ui/tag/tag.stories.tsx +32 -0
- package/src/ui/tag/tag.tsx +28 -0
- package/src/ui/tooltip/tooltip.module.css +3 -4
- package/src/ui/tooltip/tooltip.stories.tsx +30 -0
- package/src/ui/tooltip/tooltip.tsx +57 -0
- package/types/app/header/header.d.ts +5 -5
- package/types/components/asset-info/asset-info.d.ts +20 -23
- package/types/components/asset-info/index.d.ts +1 -1
- package/types/components/asset-not-predictive/asset-not-predictive.d.ts +8 -0
- package/types/components/asset-not-predictive/index.d.ts +1 -0
- package/types/components/browsertime-table/browsertime-table.d.ts +5 -5
- package/types/components/bundle-assets/bundle-assets.constants.d.ts +6 -6
- package/types/components/bundle-assets/bundle-assets.d.ts +28 -20
- package/types/components/bundle-assets/index.d.ts +11 -11
- package/types/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.d.ts +6 -6
- package/types/components/bundle-assets-totals-table/bundle-assets-totals-table.d.ts +7 -7
- package/types/components/bundle-modules/bundle-modules.constants.d.ts +6 -6
- package/types/components/bundle-modules/bundle-modules.d.ts +28 -24
- package/types/components/bundle-modules/bundle-modules.utils.d.ts +1 -1
- package/types/components/bundle-modules/index.d.ts +11 -11
- package/types/components/bundle-packages/bundle-packages.constants.d.ts +6 -6
- package/types/components/bundle-packages/bundle-packages.d.ts +24 -20
- package/types/components/bundle-packages/index.d.ts +11 -11
- package/types/components/component-link.d.ts +6 -6
- package/types/components/delta/delta.d.ts +7 -7
- package/types/components/entry-info/entry-info.d.ts +25 -0
- package/types/components/entry-info/index.d.ts +1 -0
- package/types/components/index.d.ts +4 -3
- package/types/components/insight-icon/index.d.ts +1 -0
- package/types/components/insight-icon/insight-icon.d.ts +7 -0
- package/types/components/insights/index.d.ts +1 -0
- package/types/components/insights/insights.d.ts +8 -0
- package/types/components/job-header/job-header.d.ts +9 -9
- package/types/components/job-name/job-name.d.ts +9 -9
- package/types/components/jobs-header/index.d.ts +1 -1
- package/types/components/jobs-header/jobs-header.d.ts +18 -15
- package/types/components/lighthouse-table/lighthouse-table.d.ts +5 -5
- package/types/components/metric/index.d.ts +1 -1
- package/types/components/metric/metric.d.ts +6 -32
- package/types/components/metric-run-info/index.d.ts +1 -0
- package/types/components/metric-run-info/metric-run-info.d.ts +13 -0
- package/types/components/metrics-table/metrics-table.d.ts +14 -14
- package/types/components/metrics-table-options/metrics-table-options.d.ts +7 -7
- package/types/components/metrics-table-search/metrics-table-search.d.ts +7 -7
- package/types/components/metrics-table-title/metrics-table-title.d.ts +10 -10
- package/types/components/module-info/index.d.ts +1 -1
- package/types/components/module-info/module-info.d.ts +19 -34
- package/types/components/package-info/index.d.ts +1 -0
- package/types/components/package-info/package-info.d.ts +15 -0
- package/types/components/run-info/index.d.ts +1 -0
- package/types/components/run-info/run-info.d.ts +16 -0
- package/types/components/summary/index.d.ts +1 -1
- package/types/components/summary/summary.d.ts +25 -36
- package/types/components/total-size-type-title/total-size-type-title.d.ts +3 -3
- package/types/constants.d.ts +4 -15
- package/types/i18n.d.ts +15 -15
- package/types/layout/box/box.d.ts +12 -25
- package/types/layout/box/index.d.ts +1 -1
- package/types/layout/flex-stack/flex-stack.d.ts +10 -33
- package/types/layout/flex-stack/index.d.ts +1 -1
- package/types/layout/footer/footer.d.ts +5 -5
- package/types/layout/separator.d.ts +4 -4
- package/types/layout/stack/index.d.ts +1 -1
- package/types/layout/stack/stack.d.ts +7 -20
- package/types/tokens.d.ts +23 -0
- package/types/ui/alert/alert.d.ts +7 -14
- package/types/ui/alert/index.d.ts +1 -1
- package/types/ui/container/container.d.ts +5 -17
- package/types/ui/container/index.d.ts +1 -1
- package/types/ui/dropdown/dropdown.d.ts +16 -16
- package/types/ui/empty-set/empty-set.d.ts +7 -7
- package/types/ui/file-name/file-name.d.ts +7 -7
- package/types/ui/filters/filters.d.ts +6 -6
- package/types/ui/filters/filters.utils.d.ts +2 -2
- package/types/ui/filters/index.d.ts +4 -4
- package/types/ui/horizontal-bar-chart/horizontal-bar-chart.d.ts +6 -6
- package/types/ui/hover-card/hover-card.d.ts +12 -26
- package/types/ui/hover-card/index.d.ts +1 -1
- package/types/ui/icon/icon.d.ts +26 -22
- package/types/ui/index.d.ts +0 -1
- package/types/ui/input/input.d.ts +5 -5
- package/types/ui/loader/loader.d.ts +8 -8
- package/types/ui/skeleton/skeleton.d.ts +7 -7
- package/types/ui/sort-dropdown/sort-dropdown.d.ts +11 -11
- package/types/ui/table/index.d.ts +1 -1
- package/types/ui/table/table.d.ts +14 -33
- package/types/ui/tabs/tabs.d.ts +10 -10
- package/types/ui/tag/index.d.ts +1 -1
- package/types/ui/tag/tag.d.ts +22 -33
- package/types/ui/toolbar/toolbar.d.ts +6 -6
- package/types/ui/tooltip/index.d.ts +1 -1
- package/types/ui/tooltip/tooltip.d.ts +10 -28
- package/lib/components/duplicate-packages-insight/duplicate-packages-insight.js +0 -31
- package/lib/components/duplicate-packages-insight/duplicate-packages-insight.js.map +0 -1
- package/lib/components/duplicate-packages-insight/duplicate-packages-insight.module.css +0 -18
- package/lib/components/duplicate-packages-insight/index.js.map +0 -1
- package/lib/components/job-meta/index.js.map +0 -1
- package/lib/components/job-meta/job-meta.js +0 -34
- package/lib/components/job-meta/job-meta.js.map +0 -1
- package/lib/components/job-meta/job-meta.module.css +0 -19
- package/lib/components/summary-item/index.js.map +0 -1
- package/lib/components/summary-item/summary-item.js +0 -97
- package/lib/components/summary-item/summary-item.js.map +0 -1
- package/lib/components/summary-item/summary-item.module.css +0 -58
- package/lib/ui/panels/index.js +0 -6
- package/lib/ui/panels/index.js.map +0 -1
- package/lib/ui/panels/panels.js +0 -28
- package/lib/ui/panels/panels.js.map +0 -1
- package/lib/ui/panels/panels.module.css +0 -23
- package/lib-esm/components/duplicate-packages-insight/duplicate-packages-insight.js +0 -24
- package/lib-esm/components/duplicate-packages-insight/duplicate-packages-insight.js.map +0 -1
- package/lib-esm/components/duplicate-packages-insight/duplicate-packages-insight.module.css +0 -18
- package/lib-esm/components/duplicate-packages-insight/index.js +0 -2
- package/lib-esm/components/duplicate-packages-insight/index.js.map +0 -1
- package/lib-esm/components/job-meta/index.js +0 -2
- package/lib-esm/components/job-meta/index.js.map +0 -1
- package/lib-esm/components/job-meta/job-meta.js +0 -27
- package/lib-esm/components/job-meta/job-meta.js.map +0 -1
- package/lib-esm/components/job-meta/job-meta.module.css +0 -19
- package/lib-esm/components/summary-item/index.js +0 -2
- package/lib-esm/components/summary-item/index.js.map +0 -1
- package/lib-esm/components/summary-item/summary-item.js +0 -67
- package/lib-esm/components/summary-item/summary-item.js.map +0 -1
- package/lib-esm/components/summary-item/summary-item.module.css +0 -58
- package/lib-esm/ui/panels/index.js +0 -2
- package/lib-esm/ui/panels/index.js.map +0 -1
- package/lib-esm/ui/panels/panels.js +0 -21
- package/lib-esm/ui/panels/panels.js.map +0 -1
- package/lib-esm/ui/panels/panels.module.css +0 -23
- package/src/components/asset-info/asset-info.jsx +0 -96
- package/src/components/duplicate-packages-insight/duplicate-packages-insight.module.css +0 -18
- package/src/components/duplicate-packages-insight/duplicate-packages-insight.stories.tsx +0 -66
- package/src/components/duplicate-packages-insight/duplicate-packages-insight.tsx +0 -81
- package/src/components/duplicate-packages-insight/index.ts +0 -1
- package/src/components/job-meta/index.js +0 -1
- package/src/components/job-meta/job-meta.jsx +0 -47
- package/src/components/job-meta/job-meta.module.css +0 -19
- package/src/components/jobs-header/jobs-header.jsx +0 -43
- package/src/components/metric/metric.jsx +0 -63
- package/src/components/module-info/module-info.jsx +0 -123
- package/src/components/summary/summary.jsx +0 -73
- package/src/components/summary-item/index.js +0 -1
- package/src/components/summary-item/summary-item.jsx +0 -142
- package/src/components/summary-item/summary-item.module.css +0 -58
- package/src/layout/box/box.jsx +0 -67
- package/src/layout/box/index.js +0 -1
- package/src/layout/flex-stack/flex-stack.jsx +0 -49
- package/src/layout/stack/stack.jsx +0 -32
- package/src/ui/alert/alert.jsx +0 -27
- package/src/ui/container/container.jsx +0 -24
- package/src/ui/container/index.js +0 -1
- package/src/ui/panels/index.js +0 -1
- package/src/ui/panels/panels.jsx +0 -39
- package/src/ui/panels/panels.module.css +0 -23
- package/src/ui/table/table.jsx +0 -37
- package/src/ui/tag/tag.jsx +0 -49
- package/src/ui/tooltip/tooltip.jsx +0 -67
- package/tsconfig.esm.json +0 -13
- package/tsconfig.json +0 -7
- package/tsconfig.lib.json +0 -9
- package/types/components/duplicate-packages-insight/duplicate-packages-insight.d.ts +0 -11
- package/types/components/duplicate-packages-insight/index.d.ts +0 -1
- package/types/components/job-meta/index.d.ts +0 -1
- package/types/components/job-meta/job-meta.d.ts +0 -18
- package/types/components/summary-item/index.d.ts +0 -1
- package/types/components/summary-item/summary-item.d.ts +0 -40
- package/types/ui/panels/index.d.ts +0 -1
- package/types/ui/panels/panels.d.ts +0 -18
- /package/src/components/asset-info/{index.js → index.ts} +0 -0
- /package/src/components/jobs-header/{index.js → index.ts} +0 -0
- /package/src/components/metric/{index.js → index.ts} +0 -0
- /package/src/components/module-info/{index.js → index.ts} +0 -0
- /package/src/components/summary/{index.js → index.ts} +0 -0
- /package/src/layout/flex-stack/{index.js → index.ts} +0 -0
- /package/src/layout/stack/{index.js → index.ts} +0 -0
- /package/src/ui/alert/{index.js → index.ts} +0 -0
- /package/src/ui/hover-card/{index.js → index.ts} +0 -0
- /package/src/ui/table/{index.js → index.ts} +0 -0
- /package/src/ui/tag/{index.js → index.ts} +0 -0
- /package/src/ui/tooltip/{index.js → index.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/module-info/index.
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/module-info/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}
|
|
@@ -1,63 +1,41 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
3
2
|
import cx from 'classnames';
|
|
4
3
|
import isEmpty from 'lodash/isEmpty';
|
|
5
4
|
import noop from 'lodash/noop';
|
|
6
|
-
import { getBundleModulesByChunk,
|
|
5
|
+
import { BUNDLE_MODULES_DUPLICATE, FILE_TYPE_LABELS, MODULE_SOURCE_TYPE_LABELS, getBundleModulesByChunk, getBundleModulesByFileTpe, getBundleModulesBySource, } from '@bundle-stats/utils';
|
|
7
6
|
import { Stack } from '../../layout/stack';
|
|
8
|
-
import { FlexStack } from '../../layout/flex-stack';
|
|
9
|
-
import { FileName } from '../../ui/file-name';
|
|
10
7
|
import { Tag } from '../../ui/tag';
|
|
11
8
|
import { ComponentLink } from '../component-link';
|
|
9
|
+
import { EntryInfo } from '../entry-info';
|
|
12
10
|
import css from './module-info.module.css';
|
|
13
11
|
export const ModuleInfo = (props) => {
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
var _a;
|
|
13
|
+
const { className = '', item, labels, chunks = [], chunkIds = [], customComponentLink: CustomComponentLink = ComponentLink, onClick = noop, onClose, } = props;
|
|
14
|
+
const rootClassName = cx(css.root, className);
|
|
15
|
+
const currentRun = (_a = item.runs) === null || _a === void 0 ? void 0 : _a[0];
|
|
16
|
+
const tags = useMemo(() => {
|
|
17
|
+
if (!item.duplicated) {
|
|
18
|
+
return null;
|
|
19
|
+
}
|
|
20
|
+
return (React.createElement("div", null,
|
|
21
|
+
React.createElement(Tag, { as: CustomComponentLink, ...BUNDLE_MODULES_DUPLICATE, kind: "danger" }, "Duplicate")));
|
|
22
|
+
}, [item]);
|
|
23
|
+
const fileTypeLabel = FILE_TYPE_LABELS[item.fileType];
|
|
24
|
+
const sourceTypeLabel = item.thirdParty
|
|
25
|
+
? MODULE_SOURCE_TYPE_LABELS.THIRD_PARTY
|
|
26
|
+
: MODULE_SOURCE_TYPE_LABELS.FIRST_PARTY;
|
|
27
|
+
return (React.createElement(EntryInfo, { item: item, labels: labels, tags: tags, onClose: onClose, className: rootClassName },
|
|
16
28
|
React.createElement(Stack, { space: "xxxsmall" },
|
|
17
|
-
|
|
18
|
-
React.createElement("span", null, labels[index]),
|
|
19
|
-
React.createElement(Tag, { className: css.titleTag }, index === 0 ? 'current' : 'baseline')),
|
|
20
|
-
React.createElement(FileName, { className: css.fileName, as: "code", name: (run === null || run === void 0 ? void 0 : run.name) || '-' })),
|
|
21
|
-
index === 0 && !isEmpty(run === null || run === void 0 ? void 0 : run.chunkIds) && (React.createElement(Stack, { className: css.chunks },
|
|
22
|
-
React.createElement("h5", null, "Chunks"),
|
|
23
|
-
React.createElement("ul", { className: css.list }, run.chunkIds.map((chunkId) => {
|
|
29
|
+
!isEmpty(currentRun === null || currentRun === void 0 ? void 0 : currentRun.chunkIds) && (React.createElement(EntryInfo.Meta, { label: "Chunks", className: css.chunks }, currentRun.chunkIds.map((chunkId) => {
|
|
24
30
|
const chunk = chunks === null || chunks === void 0 ? void 0 : chunks.find(({ id }) => id === chunkId);
|
|
25
31
|
if (!chunk) {
|
|
26
32
|
return null;
|
|
27
33
|
}
|
|
28
|
-
return (React.createElement(
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
React.createElement(
|
|
33
|
-
|
|
34
|
-
React.createElement(CustomComponentLink, { ...getBundleModulesBySearch(`^${reason}$`), onClick: onClick, className: css.reasonLink },
|
|
35
|
-
React.createElement(FileName, { name: reason, className: css.reason })))))))))))));
|
|
36
|
-
};
|
|
37
|
-
ModuleInfo.propTypes = {
|
|
38
|
-
className: PropTypes.string,
|
|
39
|
-
item: PropTypes.shape({
|
|
40
|
-
key: PropTypes.string,
|
|
41
|
-
runs: PropTypes.arrayOf(PropTypes.shape({
|
|
42
|
-
key: PropTypes.string,
|
|
43
|
-
name: PropTypes.string,
|
|
44
|
-
chunkIds: PropTypes.arrayOf(PropTypes.string),
|
|
45
|
-
})),
|
|
46
|
-
}).isRequired,
|
|
47
|
-
labels: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
48
|
-
chunks: PropTypes.arrayOf(PropTypes.shape({
|
|
49
|
-
id: PropTypes.string,
|
|
50
|
-
name: PropTypes.string,
|
|
51
|
-
})),
|
|
52
|
-
chunkIds: PropTypes.arrayOf(PropTypes.string),
|
|
53
|
-
customComponentLink: PropTypes.elementType,
|
|
54
|
-
onClick: PropTypes.func,
|
|
55
|
-
};
|
|
56
|
-
ModuleInfo.defaultProps = {
|
|
57
|
-
className: '',
|
|
58
|
-
chunks: [],
|
|
59
|
-
chunkIds: [],
|
|
60
|
-
customComponentLink: ComponentLink,
|
|
61
|
-
onClick: noop,
|
|
34
|
+
return (React.createElement(CustomComponentLink, { ...getBundleModulesByChunk(chunkIds, chunkId), className: css.chunksItem }, chunk.name));
|
|
35
|
+
}))),
|
|
36
|
+
(item === null || item === void 0 ? void 0 : item.fileType) && (React.createElement(EntryInfo.Meta, { label: "File type" },
|
|
37
|
+
React.createElement(CustomComponentLink, { ...getBundleModulesByFileTpe(item.fileType, fileTypeLabel) }, fileTypeLabel))),
|
|
38
|
+
React.createElement(EntryInfo.Meta, { label: "Source" },
|
|
39
|
+
React.createElement(CustomComponentLink, { ...getBundleModulesBySource(item.thirdParty || false, sourceTypeLabel), onClick: onClick }, sourceTypeLabel)))));
|
|
62
40
|
};
|
|
63
41
|
//# sourceMappingURL=module-info.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module-info.js","sourceRoot":"","sources":["../../../src/components/module-info/module-info.
|
|
1
|
+
{"version":3,"file":"module-info.js","sourceRoot":"","sources":["../../../src/components/module-info/module-info.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,40 +1,15 @@
|
|
|
1
|
-
.
|
|
2
|
-
|
|
3
|
-
background: var(--color-highlight);
|
|
4
|
-
color: var(--color-text-light);
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.run:first-child .title {
|
|
8
|
-
font-size: var(--size-xlarge);
|
|
1
|
+
.chunksItems {
|
|
2
|
+
display: inline;
|
|
9
3
|
}
|
|
10
4
|
|
|
11
5
|
.chunksItem {
|
|
12
6
|
overflow-wrap: break-word;
|
|
7
|
+
text-decoration: none;
|
|
8
|
+
text-transform: none;
|
|
9
|
+
font-weight: normal;
|
|
10
|
+
font-size: 1em;
|
|
13
11
|
}
|
|
14
12
|
|
|
15
|
-
.
|
|
16
|
-
|
|
17
|
-
padding: 2px;
|
|
18
|
-
background: var(--color-highlight-warning);
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
.reasonLink {
|
|
22
|
-
text-decoration: underline;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.reasonLink .reason {
|
|
26
|
-
text-decoration: inherit;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.reason {
|
|
30
|
-
display: inline;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
.list {
|
|
34
|
-
padding: 0 0 0 var(--space-small);
|
|
35
|
-
list-style: outside;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.list li::marker {
|
|
39
|
-
color: var(--color-text-ultra-light);
|
|
13
|
+
.chunksItem + .chunksItem {
|
|
14
|
+
margin-left: var(--space-xxxsmall);
|
|
40
15
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/package-info/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { BUNDLE_PACKAGES_DUPLICATE, PACKAGES_SEPARATOR, PACKAGE_ID_SEPARATOR, getBundleModulesBySearch, getBundlePackagesByNameComponentLink, } from '@bundle-stats/utils';
|
|
3
|
+
import { FlexStack } from '../../layout/flex-stack';
|
|
4
|
+
import { Stack } from '../../layout/stack';
|
|
5
|
+
import { ComponentLink } from '../component-link';
|
|
6
|
+
import { FileName } from '../../ui/file-name';
|
|
7
|
+
import { Tag } from '../../ui/tag';
|
|
8
|
+
import { EntryInfo } from '../entry-info';
|
|
9
|
+
import css from './package-info.module.css';
|
|
10
|
+
import { Icon } from '../../ui';
|
|
11
|
+
export const PackageInfo = (props) => {
|
|
12
|
+
var _a, _b;
|
|
13
|
+
const { className = '', item, labels, customComponentLink: CustomComponentLink = ComponentLink, onClose, } = props;
|
|
14
|
+
const packages = item.label.split(PACKAGES_SEPARATOR);
|
|
15
|
+
const name = packages[packages.length - 1];
|
|
16
|
+
const fallbackPackagePath = `node_modules/${item.label
|
|
17
|
+
.split(PACKAGES_SEPARATOR)
|
|
18
|
+
.join('/node_modules/')}`;
|
|
19
|
+
const normalizedPackagePath = `${((_b = (_a = item.runs) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.path) || fallbackPackagePath}/`;
|
|
20
|
+
const [normalizedName, packageId] = name.split(PACKAGE_ID_SEPARATOR);
|
|
21
|
+
const packageTitle = useMemo(() => (React.createElement("span", { className: css.packageTitle },
|
|
22
|
+
React.createElement("span", { className: css.packageTitleText }, normalizedName),
|
|
23
|
+
packageId && (React.createElement("span", { className: css.packageTitleId },
|
|
24
|
+
PACKAGE_ID_SEPARATOR,
|
|
25
|
+
packageId)))), [normalizedName, packageId]);
|
|
26
|
+
const tags = useMemo(() => {
|
|
27
|
+
if (!item.duplicate) {
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
30
|
+
return (React.createElement("div", null,
|
|
31
|
+
React.createElement(Tag, { as: CustomComponentLink, ...BUNDLE_PACKAGES_DUPLICATE, kind: "danger" }, "Duplicate")));
|
|
32
|
+
}, [item]);
|
|
33
|
+
return (React.createElement(EntryInfo, { itemTitle: packageTitle, item: item, labels: labels, tags: tags, runNameSelector: "path", onClose: onClose, className: className },
|
|
34
|
+
React.createElement(EntryInfo.Meta, { label: "Path" },
|
|
35
|
+
React.createElement(FileName, { name: normalizedPackagePath, className: css.fileName })),
|
|
36
|
+
React.createElement(Stack, { space: "xxxsmall" },
|
|
37
|
+
item.duplicate && (React.createElement("div", null,
|
|
38
|
+
React.createElement(CustomComponentLink, { ...getBundlePackagesByNameComponentLink(normalizedName) }, "View all duplicate instances"))),
|
|
39
|
+
React.createElement(CustomComponentLink, { ...getBundleModulesBySearch(normalizedPackagePath) }, "Search modules by package path")),
|
|
40
|
+
React.createElement(FlexStack, { space: "xsmall", alignItems: "center", className: css.external },
|
|
41
|
+
React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "a", href: `https://www.npmjs.com/package/${normalizedName}`, target: "_blank", rel: "noreferrer", className: css.externalLink },
|
|
42
|
+
React.createElement("span", null, "npmjs.com"),
|
|
43
|
+
React.createElement(Icon, { glyph: Icon.ICONS.EXTERNAL_LINK, size: "small" })),
|
|
44
|
+
React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "a", href: `https://bundlephobia.com/result?p=${normalizedName}`, target: "_blank", rel: "noreferrer", className: css.externalLink },
|
|
45
|
+
React.createElement("span", null, "bundlephobia.com"),
|
|
46
|
+
React.createElement(Icon, { glyph: Icon.ICONS.EXTERNAL_LINK, size: "small" })))));
|
|
47
|
+
};
|
|
48
|
+
//# sourceMappingURL=package-info.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"package-info.js","sourceRoot":"","sources":["../../../src/components/package-info/package-info.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/run-info/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import cx from 'classnames';
|
|
3
|
+
import { Icon } from '../../ui/icon';
|
|
4
|
+
import { HoverCard } from '../../ui/hover-card';
|
|
5
|
+
import { Tooltip } from '../../ui/tooltip';
|
|
6
|
+
import { Skeleton } from '../../ui/skeleton';
|
|
7
|
+
import { FlexStack } from '../../layout/flex-stack';
|
|
8
|
+
import { Stack } from '../../layout/stack';
|
|
9
|
+
import { Metric } from '../metric';
|
|
10
|
+
import { Delta } from '../delta';
|
|
11
|
+
import css from './run-info.module.css';
|
|
12
|
+
const EXTRACT_VALUE_UNIT_PATTERN = /([\d|.|,| ]*)(\w*|%)$/;
|
|
13
|
+
const getMetricParams = (value) => {
|
|
14
|
+
const matches = value.match(EXTRACT_VALUE_UNIT_PATTERN);
|
|
15
|
+
if (!matches) {
|
|
16
|
+
return [value];
|
|
17
|
+
}
|
|
18
|
+
return [matches[1], matches[2]];
|
|
19
|
+
};
|
|
20
|
+
export const RunInfo = ({ className = '', title = '', titleHoverCard = null, titleTooltip = null, current = '', baseline = '', delta = '', deltaType = '', as: Component = 'div', size = 'medium', showBaseline = true, loading = false, enhance = false, ...restProps }) => {
|
|
21
|
+
const rootClassName = cx(css.root, className, css[size], delta && css.showDelta);
|
|
22
|
+
const currentValueParams = useMemo(() => {
|
|
23
|
+
if (!enhance || typeof current !== 'string') {
|
|
24
|
+
return [current];
|
|
25
|
+
}
|
|
26
|
+
return getMetricParams(current);
|
|
27
|
+
}, [current, enhance]);
|
|
28
|
+
return (React.createElement(Component, { className: rootClassName, ...restProps },
|
|
29
|
+
title && (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "h3", className: css.title },
|
|
30
|
+
React.createElement("span", null, title),
|
|
31
|
+
titleHoverCard && (React.createElement(HoverCard, { label: React.createElement(Icon, { glyph: Icon.ICONS.HELP }), className: cx(css.titleIcon, css.titleHoverCardIcon) }, titleHoverCard)),
|
|
32
|
+
titleTooltip && (React.createElement(Tooltip, { title: titleTooltip, className: cx(css.titleIcon, css.titleTooltipIcon) },
|
|
33
|
+
React.createElement(Icon, { glyph: Icon.ICONS.HELP }))))),
|
|
34
|
+
!loading ? (React.createElement(Stack, { className: css.info },
|
|
35
|
+
React.createElement(Metric, { className: css.currentMetric, value: currentValueParams[0], unit: currentValueParams[1], inline: true }, delta && React.createElement(Delta, { className: css.delta, displayValue: delta, deltaType: deltaType })),
|
|
36
|
+
showBaseline && React.createElement(Metric, { className: css.baselineMetric, value: baseline }))) : (React.createElement(Stack, { className: css.info },
|
|
37
|
+
React.createElement(Skeleton, { as: "p", className: cx(css.currentMetric, css.loading) }),
|
|
38
|
+
showBaseline && React.createElement(Skeleton, { as: "p", className: cx(css.baselineMetric, css.loading) })))));
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=run-info.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"run-info.js","sourceRoot":"","sources":["../../../src/components/run-info/run-info.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
.title {
|
|
2
|
+
color: var(--color-text-ultra-light);
|
|
3
|
+
font-weight: bold;
|
|
4
|
+
font-size: var(--size-xsmall);
|
|
5
|
+
text-transform: uppercase;
|
|
6
|
+
white-space: nowrap;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.titleIcon {
|
|
10
|
+
flex: 0 0 var(--space-small);
|
|
11
|
+
margin-top: -4px !important;
|
|
12
|
+
margin-bottom: -4px !important;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.info {
|
|
16
|
+
margin-top: var(--space-xxsmall);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.currentMetric {
|
|
20
|
+
color: var(--color-heading);
|
|
21
|
+
font-size: var(--size-xxlarge);
|
|
22
|
+
line-height: var(--line-height-heading);
|
|
23
|
+
white-space: nowrap;
|
|
24
|
+
font-weight: bold;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.baselineMetric {
|
|
28
|
+
color: var(--color-text-light);
|
|
29
|
+
font-size: var(--size-small);
|
|
30
|
+
line-height: var(--line-height-heading);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
/* Loading state */
|
|
34
|
+
.loading.currentMetric {
|
|
35
|
+
width: 8em;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.loading.baselineMetric {
|
|
39
|
+
width: 5em;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/* Hover state */
|
|
43
|
+
.titleHoverCardIcon span[aria-controls=""],
|
|
44
|
+
.titleTooltipIcon[aria-controls=""] {
|
|
45
|
+
opacity: 0;
|
|
46
|
+
visibility: none;
|
|
47
|
+
transition: var(--ui-transition-out);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.root:hover .titleHoverCardIcon span,
|
|
51
|
+
.root:hover .titleTooltipIcon {
|
|
52
|
+
opacity: 1;
|
|
53
|
+
visibility: visible;
|
|
54
|
+
transition: var(--ui-transition-in);
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
/* Size variation */
|
|
58
|
+
.small .info {
|
|
59
|
+
margin-top: var(--space-xxxsmall);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.small .currentMetric {
|
|
63
|
+
font-size: var(--size-xlarge);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.large .info {
|
|
67
|
+
margin-top: var(--space-xxsmall);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.large .currentMetric {
|
|
71
|
+
font-size: var(--size-xxxlarge);
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.large .baselineMetric {
|
|
75
|
+
font-size: var(--size-medium);
|
|
76
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/summary/index.
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/summary/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}
|
|
@@ -1,40 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
2
|
import cx from 'classnames';
|
|
4
3
|
import get from 'lodash/get';
|
|
5
4
|
import { METRIC_COMPONENT_LINKS } from '@bundle-stats/utils';
|
|
6
5
|
import { METRICS_WEBPACK_GENERAL } from '../../constants';
|
|
7
6
|
import { Box } from '../../layout/box';
|
|
8
|
-
import { FlexStack } from '../../layout/flex-stack';
|
|
9
7
|
import { ComponentLink } from '../component-link';
|
|
10
|
-
import {
|
|
8
|
+
import { MetricRunInfo } from '../metric-run-info';
|
|
11
9
|
import css from './summary.module.css';
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
className: '',
|
|
19
|
-
data: null,
|
|
20
|
-
loading: false,
|
|
21
|
-
size: '',
|
|
22
|
-
keys: METRICS_WEBPACK_GENERAL,
|
|
23
|
-
showSummaryItemDelta: true,
|
|
24
|
-
summaryItemLink: ComponentLink,
|
|
25
|
-
};
|
|
26
|
-
Summary.propTypes = {
|
|
27
|
-
className: PropTypes.string,
|
|
28
|
-
size: PropTypes.string,
|
|
29
|
-
keys: PropTypes.arrayOf(PropTypes.string),
|
|
30
|
-
data: PropTypes.shape({
|
|
31
|
-
[PropTypes.string]: PropTypes.shape({
|
|
32
|
-
baseline: PropTypes.number,
|
|
33
|
-
current: PropTypes.number,
|
|
34
|
-
}),
|
|
35
|
-
}),
|
|
36
|
-
loading: PropTypes.bool,
|
|
37
|
-
showSummaryItemDelta: PropTypes.bool,
|
|
38
|
-
summaryItemLink: PropTypes.elementType,
|
|
10
|
+
const SummaryItem = (props) => {
|
|
11
|
+
const { className = '', metricId, data, customLink: SummaryItemCustomLink, size, loading, showDelta, showBaseline, } = props;
|
|
12
|
+
const componentLink = METRIC_COMPONENT_LINKS.get(metricId);
|
|
13
|
+
const metricData = get(data, metricId, { current: 0, baseline: 0 });
|
|
14
|
+
return (React.createElement(Box, { key: metricId, outline: true, outlineHover: true, padding: "small", as: SummaryItemCustomLink, ...componentLink === null || componentLink === void 0 ? void 0 : componentLink.link, className: className },
|
|
15
|
+
React.createElement(MetricRunInfo, { metricId: metricId, current: metricData.current, baseline: metricData.baseline, showDelta: showDelta && (componentLink === null || componentLink === void 0 ? void 0 : componentLink.showDelta), showBaseline: showBaseline, size: size, loading: loading })));
|
|
39
16
|
};
|
|
17
|
+
export const Summary = ({ className = '', size = 'medium', keys = METRICS_WEBPACK_GENERAL, data = null, loading = false, showSummaryItemDelta = true, showSummaryItemBaseline = true, summaryItemLink = ComponentLink, }) => (React.createElement(Box, { className: cx(css.root, className) },
|
|
18
|
+
React.createElement("div", { className: css.items }, keys.map((metricId) => (React.createElement(SummaryItem, { key: metricId, className: css.item, metricId: metricId, data: data, customLink: summaryItemLink, size: size, loading: loading, showDelta: showSummaryItemDelta, showBaseline: showSummaryItemBaseline }))))));
|
|
40
19
|
//# sourceMappingURL=summary.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"summary.js","sourceRoot":"","sources":["../../../src/components/summary/summary.
|
|
1
|
+
{"version":3,"file":"summary.js","sourceRoot":"","sources":["../../../src/components/summary/summary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,GAAG,MAAM,YAAY,CAAC;AAC7B,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAsB,MAAM,oBAAoB,CAAC;AACvE,OAAO,GAAG,MAAM,sBAAsB,CAAC;AAYvC,MAAM,WAAW,GAAG,CAAC,KAAqD,EAAE,EAAE;IAC5E,MAAM,EACJ,SAAS,GAAG,EAAE,EACd,QAAQ,EACR,IAAI,EACJ,UAAU,EAAE,qBAAqB,EACjC,IAAI,EACJ,OAAO,EACP,SAAS,EACT,YAAY,GACb,GAAG,KAAK,CAAC;IAEV,MAAM,aAAa,GAAG,sBAAsB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC3D,MAAM,UAAU,GAAG,GAAG,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAC;IAEpE,OAAO,CACL,oBAAC,GAAG,IACF,GAAG,EAAE,QAAQ,EACb,OAAO,QACP,YAAY,QACZ,OAAO,EAAC,OAAO,EACf,EAAE,EAAE,qBAAqB,KACrB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,IAAI,EACvB,SAAS,EAAE,SAAS;QAEpB,oBAAC,aAAa,IACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,UAAU,CAAC,OAAO,EAC3B,QAAQ,EAAE,UAAU,CAAC,QAAQ,EAC7B,SAAS,EAAE,SAAS,KAAI,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,CAAA,EAChD,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,GAChB,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAiBF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,SAAS,GAAG,EAAE,EACd,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,uBAAuB,EAC9B,IAAI,GAAG,IAAI,EACX,OAAO,GAAG,KAAK,EACf,oBAAoB,GAAG,IAAI,EAC3B,uBAAuB,GAAG,IAAI,EAC9B,eAAe,GAAG,aAAa,GACY,EAAE,EAAE,CAAC,CAChD,oBAAC,GAAG,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC;IACrC,6BAAK,SAAS,EAAE,GAAG,CAAC,KAAK,IACpB,IAAI,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CACtB,oBAAC,WAAW,IACV,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,GAAG,CAAC,IAAI,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,eAAe,EAC3B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,oBAAoB,EAC/B,YAAY,EAAE,uBAAuB,GACrC,CACH,CAAC,CACE,CACJ,CACP,CAAC"}
|
|
@@ -1,17 +1,37 @@
|
|
|
1
1
|
.root {
|
|
2
|
+
--summary-gap: var(--space-small);
|
|
2
3
|
width: 100%;
|
|
3
|
-
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.items {
|
|
7
|
+
display: flex;
|
|
8
|
+
flex-wrap: wrap;
|
|
9
|
+
width: calc(100% + var(--summary-gap));
|
|
10
|
+
margin-top: calc(0px - var(--summary-gap));
|
|
11
|
+
margin-left: calc(0px - var(--summary-gap));
|
|
4
12
|
}
|
|
5
13
|
|
|
6
14
|
.item {
|
|
15
|
+
margin: var(--summary-gap) 0 0 var(--summary-gap);
|
|
7
16
|
flex: 1 0 10%; /* force equal sizes */
|
|
8
|
-
min-width:
|
|
17
|
+
min-width: 14em;
|
|
9
18
|
text-decoration: none;
|
|
10
19
|
}
|
|
11
20
|
|
|
12
|
-
.
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
21
|
+
.readMoreLink {
|
|
22
|
+
appearance: none;
|
|
23
|
+
background: none;
|
|
24
|
+
margin: 0;
|
|
25
|
+
border: 0;
|
|
26
|
+
padding: 0;
|
|
27
|
+
color: var(--color-primary);
|
|
28
|
+
text-decoration: underline;
|
|
29
|
+
cursor: pointer;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.readMoreLink:hover,
|
|
33
|
+
.readMoreLink:active,
|
|
34
|
+
.readMoreLink:focus {
|
|
35
|
+
color: var(--color-primary-dark);
|
|
36
|
+
text-decoration: none;
|
|
17
37
|
}
|
package/lib-esm/constants.js
CHANGED
|
@@ -1,26 +1,4 @@
|
|
|
1
1
|
import { FILE_TYPES, SECTIONS } from '@bundle-stats/utils';
|
|
2
|
-
export const NO_SPACE = 'no-space';
|
|
3
|
-
export const SPACE_XXXSMALL = 'xxxsmall';
|
|
4
|
-
export const SPACE_XXSMALL = 'xxsmall';
|
|
5
|
-
export const SPACE_XSMALL = 'xsmall';
|
|
6
|
-
export const SPACE_SMALL = 'small';
|
|
7
|
-
export const SPACE_MEDIUM = 'medium';
|
|
8
|
-
export const SPACE_LARGE = 'large';
|
|
9
|
-
export const SPACE_XLARGE = 'xlarge';
|
|
10
|
-
export const SPACE_XXLARGE = 'xxlarge';
|
|
11
|
-
export const SPACE_XXXLARGE = 'xxxlarge';
|
|
12
|
-
export const SPACES = [
|
|
13
|
-
NO_SPACE,
|
|
14
|
-
SPACE_XXXSMALL,
|
|
15
|
-
SPACE_XXSMALL,
|
|
16
|
-
SPACE_XSMALL,
|
|
17
|
-
SPACE_SMALL,
|
|
18
|
-
SPACE_MEDIUM,
|
|
19
|
-
SPACE_LARGE,
|
|
20
|
-
SPACE_XLARGE,
|
|
21
|
-
SPACE_XXLARGE,
|
|
22
|
-
SPACE_XXXLARGE,
|
|
23
|
-
];
|
|
24
2
|
export const URLS = {
|
|
25
3
|
OVERVIEW: '/',
|
|
26
4
|
ASSETS: '/assets',
|
package/lib-esm/constants.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3D,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3D,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,QAAQ,EAAE,GAAG;IACb,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,UAAU;IACnB,QAAQ,EAAE,WAAW;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,QAAQ;IAChC,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,MAAM;IAC9B,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,OAAO;IAChC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;CACnC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,UAAU,CAAC,MAAM,CACzD,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC;IAClB,GAAG,GAAG;IACN,CAAC,gCAAgC,QAAQ,EAAE,CAAC,EAAE,QAAQ;CACvD,CAAC,EACF,EAAE,CACH,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,4BAA4B;IAC5B,4BAA4B;IAC5B,6BAA6B;IAC7B,2BAA2B;CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,oBAAoB,EAAE,oBAAoB,CAAC,CAAC;AACnF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,qBAAqB;IACrB,+BAA+B;IAC/B,uBAAuB;CACxB,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,sBAAsB,EAAE,gCAAgC,CAAC,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
:root {
|
|
2
|
-
--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
|
|
3
|
-
--font-family-fixed:
|
|
2
|
+
--font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
|
|
3
|
+
--font-family-fixed: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
4
4
|
|
|
5
5
|
/* Spaces */
|
|
6
6
|
--space-xxxsmall: 4px;
|
|
@@ -31,17 +31,18 @@
|
|
|
31
31
|
* https://coolors.co/287acc-da444e-55b950-f6e179-192339
|
|
32
32
|
* http://mcg.mbitson.com/#!?mcgpalette0=%23da444e&mcgpalette1=%2355b950&mcgpalette2=%23f6e179&mcgpalette3=%23505861&mcgpalette4=%23287acc&themename=mcgtheme
|
|
33
33
|
*/
|
|
34
|
-
--color-gray-25: #
|
|
35
|
-
--color-gray-50
|
|
36
|
-
--color-gray-100: #
|
|
37
|
-
--color-gray-200: #
|
|
38
|
-
--color-gray-300: #
|
|
39
|
-
--color-gray-400: #
|
|
40
|
-
--color-gray-500: #
|
|
41
|
-
--color-gray-600: #
|
|
42
|
-
--color-gray-700: #
|
|
43
|
-
--color-gray-800: #
|
|
44
|
-
--color-gray-900: #
|
|
34
|
+
--color-gray-25: #f7f7f9;
|
|
35
|
+
--color-gray-50: #ececee;
|
|
36
|
+
--color-gray-100: #ced0d4;
|
|
37
|
+
--color-gray-200: #aeb1b7;
|
|
38
|
+
--color-gray-300: #8e929a;
|
|
39
|
+
--color-gray-400: #757a85;
|
|
40
|
+
--color-gray-500: #5d636f;
|
|
41
|
+
--color-gray-600: #555b67;
|
|
42
|
+
--color-gray-700: #4b515c;
|
|
43
|
+
--color-gray-800: #414752;
|
|
44
|
+
--color-gray-900: #303540;
|
|
45
|
+
|
|
45
46
|
|
|
46
47
|
--color-gray-ultra-light: var(--color-gray-200);
|
|
47
48
|
--color-gray-light: var(--color-gray-300);
|
|
@@ -190,6 +191,10 @@
|
|
|
190
191
|
--radius-medium: 5px;
|
|
191
192
|
--radius-large: 9px;
|
|
192
193
|
|
|
194
|
+
--outline-hover: 0 0 0 3px var(--color-highlight);
|
|
195
|
+
|
|
193
196
|
/** Layout */
|
|
194
197
|
--max-width: 80rem;
|
|
198
|
+
--entry-info-width: 640px;
|
|
199
|
+
--entry-info-top: var(--header-height);
|
|
195
200
|
}
|