@bundle-stats/ui 4.17.0-beta.0 → 4.17.0-beta.2

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.
Files changed (51) hide show
  1. package/lib/components/asset-info/asset-info.js +13 -4
  2. package/lib/components/asset-info/asset-info.js.map +1 -1
  3. package/lib/components/asset-info/asset-info.module.css +9 -0
  4. package/lib/components/asset-meta-tag/asset-meta-tag.module.css +9 -8
  5. package/lib/components/asset-name/asset-name.js +2 -3
  6. package/lib/components/asset-name/asset-name.js.map +1 -1
  7. package/lib/components/asset-name/asset-name.module.css +4 -4
  8. package/lib/components/asset-not-predictive/asset-not-predictive.js +5 -5
  9. package/lib/components/asset-not-predictive/asset-not-predictive.js.map +1 -1
  10. package/lib/components/asset-not-predictive/asset-not-predictive.module.css +6 -1
  11. package/lib/components/bundle-assets/bundle-assets.utils.js +6 -1
  12. package/lib/components/bundle-assets/bundle-assets.utils.js.map +1 -1
  13. package/lib/components/entry-info/entry-info.js +3 -2
  14. package/lib/components/entry-info/entry-info.js.map +1 -1
  15. package/lib/components/preview-source/preview-source.js +1 -1
  16. package/lib/components/preview-source/preview-source.js.map +1 -1
  17. package/lib-esm/components/asset-info/asset-info.js +13 -4
  18. package/lib-esm/components/asset-info/asset-info.js.map +1 -1
  19. package/lib-esm/components/asset-info/asset-info.module.css +9 -0
  20. package/lib-esm/components/asset-meta-tag/asset-meta-tag.module.css +9 -8
  21. package/lib-esm/components/asset-name/asset-name.js +2 -3
  22. package/lib-esm/components/asset-name/asset-name.js.map +1 -1
  23. package/lib-esm/components/asset-name/asset-name.module.css +4 -4
  24. package/lib-esm/components/asset-not-predictive/asset-not-predictive.js +5 -5
  25. package/lib-esm/components/asset-not-predictive/asset-not-predictive.js.map +1 -1
  26. package/lib-esm/components/asset-not-predictive/asset-not-predictive.module.css +6 -1
  27. package/lib-esm/components/bundle-assets/bundle-assets.utils.js +6 -1
  28. package/lib-esm/components/bundle-assets/bundle-assets.utils.js.map +1 -1
  29. package/lib-esm/components/entry-info/entry-info.js +3 -2
  30. package/lib-esm/components/entry-info/entry-info.js.map +1 -1
  31. package/lib-esm/components/preview-source/preview-source.js +1 -1
  32. package/lib-esm/components/preview-source/preview-source.js.map +1 -1
  33. package/package.json +7 -7
  34. package/src/app/app.stories.tsx +1 -1
  35. package/src/components/asset-info/asset-info.module.css +9 -0
  36. package/src/components/asset-info/asset-info.tsx +32 -7
  37. package/src/components/asset-meta-tag/asset-meta-tag.module.css +9 -8
  38. package/src/components/asset-meta-tag/asset-meta-tag.tsx +1 -1
  39. package/src/components/asset-name/asset-name.module.css +4 -4
  40. package/src/components/asset-name/asset-name.tsx +3 -4
  41. package/src/components/asset-not-predictive/asset-not-predictive.module.css +6 -1
  42. package/src/components/asset-not-predictive/asset-not-predictive.tsx +10 -8
  43. package/src/components/bundle-assets/__tests__/add-metric-report-asset-row-data.ts +54 -0
  44. package/src/components/bundle-assets/bundle-assets.utils.js +9 -1
  45. package/src/components/entry-info/entry-info.tsx +17 -7
  46. package/src/components/preview-source/preview-source.tsx +11 -1
  47. package/types/components/asset-info/asset-info.d.ts +5 -4
  48. package/types/components/asset-meta-tag/asset-meta-tag.d.ts +1 -1
  49. package/types/components/asset-name/asset-name.d.ts +1 -1
  50. package/types/components/asset-not-predictive/asset-not-predictive.d.ts +2 -2
  51. package/types/components/entry-info/entry-info.d.ts +7 -1
@@ -1 +1 @@
1
- {"version":3,"file":"entry-info.js","sourceRoot":"","sources":["../../../src/components/entry-info/entry-info.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5E,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,IAAI,MAAM,mBAAmB,CAAC;AAC1C,OAAO,GAAG,MAAM,yBAAyB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAMpD,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAAyD,EAAE,EAAE;IAC7F,MAAM,EAAE,EAAE,EAAE,aAAa,GAAG,GAAG,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACxE,OAAO,oBAAC,aAAa,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,SAAS,GAAI,CAAC;AAClF,CAAC,CAAC;AAOF,MAAM,aAAa,GAAG,CAAC,EACrB,SAAS,GAAG,EAAE,EACd,KAAK,EACL,OAAO,EACP,QAAQ,GACuC,EAAE,EAAE,CAAC,CACpD,6BAAK,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC;IACrC,8BAAM,SAAS,EAAE,GAAG,CAAC,SAAS;QAC3B,KAAK;QACL,OAAO,IAAI,CACV,oBAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,CAAC,gBAAgB;YACtD,oBAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,CACb,CACX,CACI;IACP,6BAAK,SAAS,EAAE,GAAG,CAAC,WAAW,IAAG,QAAQ,CAAO,CAC7C,CACP,CAAC;AAEF,SAAS,oBAAoB,CAAC,IAAqB;;IACjD,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAA,IAAI,CAAC,IAAI,0CAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAGpF,MAAM,aAAa,GAAG,gBAAgB,CACpC,mBAAmB,CAAC,qBAAqB,EACzC,CAAA,MAAA,MAAA,IAAI,CAAC,IAAI,0CAAG,CAAC,CAAC,0CAAE,KAAK,KAAI,CAAC,EAC1B,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,KAAI,CAAC,CACP,CAAC;IAEnB,OAAO,CACL,oBAAC,OAAO,IACN,OAAO,EAAE,aAAa,CAAC,YAAY,EACnC,KAAK,EAAE,aAAa,CAAC,sBAAsB,EAC3C,eAAe,EAAE,aAAa,CAAC,YAAY,EAC3C,SAAS,EAAE,aAAa,CAAC,SAAS,EAClC,QAAQ,EAAE,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,YAAY,KAAI,IAAI,EAC3C,IAAI,EAAC,OAAO,GACZ,CACH,CAAC;AACJ,CAAC;AAcD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAmD,EAAE,EAAE;IAC/E,MAAM,EACJ,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,IAAI,EAChB,IAAI,EACJ,MAAM,EACN,eAAe,GAAG,MAAM,EACxB,YAAY,GAAG,IAAI,CAAC,IAAI,EACxB,YAAY,GAAG,IAAI,CAAC,IAAI,EACxB,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,OAAO,EACP,aAAa,GAAG,oBAAoB,GACrC,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,oBAAC,MAAM,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC;QACxC,oBAAC,GAAG,IAAC,OAAO,EAAC,QAAQ,EAAC,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAE,GAAG,CAAC,MAAM;YACrD,oBAAC,KAAK,IAAC,KAAK,EAAC,OAAO;gBAClB,oBAAC,SAAS,IAAC,KAAK,EAAC,UAAU,EAAC,UAAU,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,SAAS,EAAE,GAAG,CAAC,KAAK;oBAC1E,oBAAC,QAAQ,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAE,SAAS,IAAI,IAAI,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,QAAQ,GAAI;oBAC9E,oBAAC,eAAe,IAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,OAAO,GAAG,CACxC;gBACZ,iCAAM,aAAa,CAAC,IAAI,CAAC,CAAO,CAC1B;YACR,oBAAC,MAAM,IACL,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,gBACJ,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,GAAG,CAAC,WAAW;gBAE1B,oBAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,EAAC,OAAO,GAAG,CACvC,CACL;QACN,oBAAC,GAAG,IAAC,OAAO,EAAC,QAAQ,EAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAE,GAAG,CAAC,cAAc;YAC3D,oBAAC,KAAK,IAAC,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,GAAG,CAAC,OAAO;gBACxC,IAAI,IAAI,iCAAM,IAAI,CAAO;gBAEzB,QAAQ;gBAET,oBAAC,KAAK,IAAC,OAAO,QAAC,OAAO,QAAC,SAAS,EAAE,GAAG,CAAC,IAAI;oBACxC,oBAAC,KAAK,CAAC,KAAK;wBACV,oBAAC,KAAK,CAAC,EAAE;4BACP,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,UAAU,CAAC,aAAmB;4BACxE,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC,IAAG,YAAY,CAAY;4BACjF,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC,IAAG,YAAY,CAAY,CACxE,CACC;oBACd,oBAAC,KAAK,CAAC,KAAK,QACT,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;wBAC5B,MAAM,GAAG,GAAG,QAAQ,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,IAAI,KAAI,KAAK,IAAI,KAAK,EAAE,CAAC;wBAClD,MAAM,MAAM,GAAG,GAAU,CAAC;wBAE1B,OAAO,CACL,oBAAC,KAAK,CAAC,EAAE,IAAC,GAAG,EAAE,GAAG;4BAChB,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,UAAU,CAAC,IAClD,MAAM,CAAC,KAAK,CAAC,CACL;4BACX,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC,IACnD,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,eAAe,CAAC,EAAC,CAAC,CAAC,CAC3B,oBAAC,SAAS,IAAC,KAAK,EAAC,UAAU,EAAC,UAAU,EAAC,QAAQ,EAAC,SAAS,EAAE,GAAG,CAAC,KAAK;gCAClE,oBAAC,QAAQ,IACP,EAAE,EAAC,MAAM,EACT,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,EAC7B,SAAS,EAAE,GAAG,CAAC,QAAQ,GACvB;gCACF,oBAAC,eAAe,IAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,OAAO,GAAG,CACxC,CACb,CAAC,CAAC,CAAC,CACF,GAAG,CACJ,CACQ;4BACX,oBAAC,KAAK,CAAC,EAAE,IAAC,SAAS,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC;gCACpD,8BAAM,SAAS,EAAE,GAAG,CAAC,IAAI,IACtB,OAAO,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,KAAK,CAAA,KAAK,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAC/C,CACE,CACF,CACZ,CAAC;oBACJ,CAAC,CAAC,CACU,CACR,CACF,CACJ,CACC,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,CAAC,IAAI,GAAG,aAAa,CAAC"}
1
+ {"version":3,"file":"entry-info.js","sourceRoot":"","sources":["../../../src/components/entry-info/entry-info.tsx"],"names":[],"mappings":"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"}
@@ -16,6 +16,6 @@ export const PreviewSource = (props) => {
16
16
  React.createElement(CopyToClipboard, { outline: true, size: "small", text: source }),
17
17
  download && (React.createElement(Tooltip, { title: `Download ${download}`, className: css.downloadTooltip },
18
18
  React.createElement(Button, { outline: true, rightGlyph: BUTTON_GLYPHS.DOWNLOAD, size: "small", as: "a", href: `data:application/json,${encodeURIComponent(source)}`, download: download }))))),
19
- React.createElement(Textarea, { readOnly: true, rows: rows, value: source, className: css.content })));
19
+ React.createElement(Textarea, { rows: rows, value: source, readOnly: true, autoComplete: "off", autoCorrect: "off", autoCapitalize: "off", spellCheck: "false", translate: "no", className: css.content })));
20
20
  };
21
21
  //# sourceMappingURL=preview-source.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"preview-source.js","sourceRoot":"","sources":["../../../src/components/preview-source/preview-source.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,GAAG,MAAM,6BAA6B,CAAC;AAE9C,MAAM,YAAY,GAAG,EAAE,CAAC;AAgBxB,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IACzD,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,MAAM,EAAE,IAAI,GAAG,YAAY,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAE9F,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC;IACxB,MAAM,aAAa,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,CAAC;IAEtE,OAAO,CACL,6BAAK,SAAS,EAAE,aAAa,KAAM,SAAS;QACzC,MAAM,IAAI,CACT,oBAAC,YAAY,IAAC,SAAS,EAAE,GAAG,CAAC,OAAO;YAClC,oBAAC,eAAe,IAAC,OAAO,QAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,MAAM,GAAI;YACrD,QAAQ,IAAI,CACX,oBAAC,OAAO,IAAC,KAAK,EAAE,YAAY,QAAQ,EAAE,EAAE,SAAS,EAAE,GAAG,CAAC,eAAe;gBACpE,oBAAC,MAAM,IACL,OAAO,QACP,UAAU,EAAE,aAAa,CAAC,QAAQ,EAClC,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,GAAG,EACN,IAAI,EAAE,yBAAyB,kBAAkB,CAAC,MAAM,CAAC,EAAE,EAC3D,QAAQ,EAAE,QAAQ,GAClB,CACM,CACX,CACY,CAChB;QACD,oBAAC,QAAQ,IAAC,QAAQ,QAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,CAAC,OAAO,GAAI,CACpE,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"preview-source.js","sourceRoot":"","sources":["../../../src/components/preview-source/preview-source.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,GAAG,MAAM,6BAA6B,CAAC;AAE9C,MAAM,YAAY,GAAG,EAAE,CAAC;AAgBxB,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IACzD,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,MAAM,EAAE,IAAI,GAAG,YAAY,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAE9F,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC;IACxB,MAAM,aAAa,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,CAAC;IAEtE,OAAO,CACL,6BAAK,SAAS,EAAE,aAAa,KAAM,SAAS;QACzC,MAAM,IAAI,CACT,oBAAC,YAAY,IAAC,SAAS,EAAE,GAAG,CAAC,OAAO;YAClC,oBAAC,eAAe,IAAC,OAAO,QAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,MAAM,GAAI;YACrD,QAAQ,IAAI,CACX,oBAAC,OAAO,IAAC,KAAK,EAAE,YAAY,QAAQ,EAAE,EAAE,SAAS,EAAE,GAAG,CAAC,eAAe;gBACpE,oBAAC,MAAM,IACL,OAAO,QACP,UAAU,EAAE,aAAa,CAAC,QAAQ,EAClC,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,GAAG,EACN,IAAI,EAAE,yBAAyB,kBAAkB,CAAC,MAAM,CAAC,EAAE,EAC3D,QAAQ,EAAE,QAAQ,GAClB,CACM,CACX,CACY,CAChB;QACD,oBAAC,QAAQ,IACP,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,EACb,QAAQ,QACR,YAAY,EAAC,KAAK,EAClB,WAAW,EAAC,KAAK,EACjB,cAAc,EAAC,KAAK,EACpB,UAAU,EAAC,OAAO,EAClB,SAAS,EAAC,IAAI,EACd,SAAS,EAAE,GAAG,CAAC,OAAO,GACtB,CACE,CACP,CAAC;AACJ,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bundle-stats/ui",
3
- "version": "4.17.0-beta.0",
3
+ "version": "4.17.0-beta.2",
4
4
  "description": "UI components for BundleStats projects.",
5
5
  "main": "lib/index.js",
6
6
  "module": "lib-esm/index.js",
@@ -39,10 +39,10 @@
39
39
  "@babel/preset-env": "7.26.0",
40
40
  "@babel/preset-react": "7.25.9",
41
41
  "@babel/preset-typescript": "7.26.0",
42
- "@storybook/addon-essentials": "8.3.6",
42
+ "@storybook/addon-essentials": "8.4.2",
43
43
  "@storybook/addon-webpack5-compiler-babel": "3.0.3",
44
- "@storybook/react": "8.3.6",
45
- "@storybook/react-webpack5": "8.3.6",
44
+ "@storybook/react": "8.4.2",
45
+ "@storybook/react-webpack5": "8.4.2",
46
46
  "@types/d3": "7.4.3",
47
47
  "@types/react": "18.3.12",
48
48
  "@types/react-router-dom": "5.3.3",
@@ -61,7 +61,7 @@
61
61
  "react-dom": "18.3.1",
62
62
  "react-router-dom": "5.3.4",
63
63
  "rimraf": "6.0.1",
64
- "storybook": "8.3.6",
64
+ "storybook": "8.4.2",
65
65
  "typescript": "5.6.3",
66
66
  "typescript-plugin-css-modules": "5.1.0"
67
67
  },
@@ -74,7 +74,7 @@
74
74
  "react-router-dom": "^5.0.0"
75
75
  },
76
76
  "dependencies": {
77
- "@bundle-stats/utils": "4.17.0-beta.0",
77
+ "@bundle-stats/utils": "4.17.0-beta.2",
78
78
  "ariakit": "2.0.0-next.44",
79
79
  "d3": "7.9.0",
80
80
  "modern-css-reset": "1.4.0",
@@ -82,5 +82,5 @@
82
82
  "snarkdown": "2.0.0",
83
83
  "use-query-params": "2.2.1"
84
84
  },
85
- "gitHead": "c9d149e59d4e955b2933f858679ce5b7cf99289a"
85
+ "gitHead": "f81f1d37f9a616c43a9a4c779830b5fe46c0a72e"
86
86
  }
@@ -111,7 +111,7 @@ export const AssetMetaChanges: Story = {
111
111
  };
112
112
 
113
113
  export const NoBaseline: Story = {
114
- render: (args) => <App jobs={createJobs[CURRENT_SOURCE]} {...args} />,
114
+ render: (args) => <App jobs={createJobs([CURRENT_SOURCE])} {...args} />,
115
115
  };
116
116
 
117
117
  export const EmptyBaseline: Story = {
@@ -29,3 +29,12 @@
29
29
  content: ' ';
30
30
  }
31
31
 
32
+ .runNameTags {
33
+ display: flex;
34
+ align-items: center;
35
+ gap: calc(var(--space-xxxsmall) / 2);
36
+ }
37
+
38
+ .runNameTags:empty {
39
+ display: block;
40
+ }
@@ -1,3 +1,4 @@
1
+ import type { ComponentProps, ElementType, ReactNode } from 'react';
1
2
  import React, { useMemo } from 'react';
2
3
  import cx from 'classnames';
3
4
  import noop from 'lodash/noop';
@@ -9,17 +10,17 @@ import {
9
10
  getBundleAssetsFileTypeComponentLink,
10
11
  getModuleFileType,
11
12
  } from '@bundle-stats/utils';
12
- import { Asset, MetaChunk } from '@bundle-stats/utils/types/webpack';
13
+ import type { AssetMetricRun, MetaChunk } from '@bundle-stats/utils/types/webpack';
13
14
 
15
+ import type { ReportMetricAssetRow } from '../../types';
14
16
  import { FlexStack } from '../../layout/flex-stack';
15
- import { Tag } from '../../ui/tag';
16
17
  import { AssetMetaTag } from '../asset-meta-tag';
17
18
  import { ComponentLink } from '../component-link';
18
19
  import { EntryInfo, EntryInfoMetaLink } from '../entry-info';
19
20
  import css from './asset-info.module.css';
20
21
 
21
22
  interface ChunkModulesLinkProps {
22
- as: React.ElementType;
23
+ as: ElementType;
23
24
  chunks: Array<MetaChunk>;
24
25
  chunkId: string;
25
26
  name: string;
@@ -31,7 +32,7 @@ const ChunkModulesLink = ({
31
32
  chunkId,
32
33
  name,
33
34
  onClick,
34
- }: ChunkModulesLinkProps & React.ComponentProps<'a'>) => {
35
+ }: ChunkModulesLinkProps & ComponentProps<'a'>) => {
35
36
  const chunk = chunks?.find(({ id }) => id === chunkId);
36
37
 
37
38
  if (!chunk) {
@@ -52,6 +53,26 @@ const ChunkModulesLink = ({
52
53
  );
53
54
  };
54
55
 
56
+ type AssetRunNameProps = {
57
+ run: ReportMetricAssetRow;
58
+ children: ReactNode;
59
+ };
60
+
61
+ const AssetRunName = (props: AssetRunNameProps) => {
62
+ const { run, children } = props;
63
+
64
+ return (
65
+ <>
66
+ <span className={css.runNameTags}>
67
+ {run.isEntry && <AssetMetaTag tag="entry" title="Entry" size="small" />}
68
+ {run.isInitial && <AssetMetaTag tag="initial" title="Initial" size="small" />}
69
+ {run.isChunk && <AssetMetaTag tag="chunk" title="Chunk" size="small" />}
70
+ </span>
71
+ {children}
72
+ </>
73
+ );
74
+ };
75
+
55
76
  interface AssetInfoProps {
56
77
  item: {
57
78
  label: string;
@@ -61,15 +82,15 @@ interface AssetInfoProps {
61
82
  isInitial?: boolean;
62
83
  isNotPredictive?: boolean;
63
84
  fileType?: string;
64
- runs: Array<Asset & MetricRunInfo>;
85
+ runs: Array<AssetMetricRun & MetricRunInfo>;
65
86
  };
66
87
  chunks?: Array<MetaChunk>;
67
88
  labels: Array<string>;
68
- customComponentLink?: React.ElementType;
89
+ customComponentLink?: ElementType;
69
90
  onClose: () => void;
70
91
  }
71
92
 
72
- export const AssetInfo = (props: AssetInfoProps & React.ComponentProps<'div'>) => {
93
+ export const AssetInfo = (props: AssetInfoProps & ComponentProps<'div'>) => {
73
94
  const {
74
95
  className = '',
75
96
  chunks = null,
@@ -95,6 +116,7 @@ export const AssetInfo = (props: AssetInfoProps & React.ComponentProps<'div'>) =
95
116
  {...getBundleAssetsByEntryType('entry')}
96
117
  onClick={onClick}
97
118
  tag="entry"
119
+ size="medium"
98
120
  status={item.isEntry}
99
121
  className={css.assetNameTag}
100
122
  >
@@ -107,6 +129,7 @@ export const AssetInfo = (props: AssetInfoProps & React.ComponentProps<'div'>) =
107
129
  {...getBundleAssetsByEntryType('initial')}
108
130
  onClick={onClick}
109
131
  tag="initial"
132
+ size="medium"
110
133
  status={item.isInitial}
111
134
  className={cx(css.assetNameTag, css.assetNameTagInitial)}
112
135
  >
@@ -119,6 +142,7 @@ export const AssetInfo = (props: AssetInfoProps & React.ComponentProps<'div'>) =
119
142
  {...getBundleAssetsByEntryType('chunk')}
120
143
  onClick={onClick}
121
144
  tag="chunk"
145
+ size="medium"
122
146
  status={item.isChunk}
123
147
  className={cx(css.assetNameTag, css.assetNameTagChunk)}
124
148
  >
@@ -137,6 +161,7 @@ export const AssetInfo = (props: AssetInfoProps & React.ComponentProps<'div'>) =
137
161
  labels={labels}
138
162
  tags={tags}
139
163
  onClose={onClose}
164
+ RunName={AssetRunName}
140
165
  className={cx(css.root, className)}
141
166
  >
142
167
  {item.fileType && (
@@ -20,14 +20,6 @@
20
20
  vertical-align: middle;
21
21
  }
22
22
 
23
- .added {
24
- background: linear-gradient(-45deg, var(--color-danger) 50%, var(--background-color) 50%);
25
- }
26
-
27
- .removed {
28
- background: linear-gradient(135deg, var(--color-danger) 50%, var(--background-color) 50%);
29
- }
30
-
31
23
  /* tag */
32
24
  .entry {
33
25
  --background-color: var(--color-info-dark);
@@ -53,3 +45,12 @@
53
45
  content: 'c';
54
46
  }
55
47
 
48
+ /* status */
49
+ .added {
50
+ background: linear-gradient(-45deg, var(--color-danger-light) 50%, var(--background-color) 50%) !important;
51
+ }
52
+
53
+ .removed {
54
+ background: linear-gradient(135deg, var(--color-danger-light) 50%, var(--background-color) 50%) !important;
55
+ }
56
+
@@ -8,7 +8,7 @@ import type { ReportMetricAssetRowMetaStatus } from '../../types';
8
8
 
9
9
  export type AssetMetaTagProps = {
10
10
  tag: 'entry' | 'initial' | 'chunk';
11
- status: ReportMetricAssetRowMetaStatus | boolean;
11
+ status?: ReportMetricAssetRowMetaStatus | boolean;
12
12
  } & TagProps;
13
13
 
14
14
  export const AssetMetaTag = (props: AssetMetaTagProps) => {
@@ -1,5 +1,3 @@
1
- .root {}
2
-
3
1
  .notPredictive {
4
2
  margin-right: var(--space-xxsmall);
5
3
  display: inline-block;
@@ -7,12 +5,14 @@
7
5
  height: var(--space-small);
8
6
  }
9
7
 
10
- .notPredictiveAnchor {}
11
-
12
8
  .notPredictiveIcon {
13
9
  color: var(--color-warning-dark);
14
10
  }
15
11
 
12
+ .notPredictiveHoverCard {
13
+ max-width: 480px;
14
+ }
15
+
16
16
  .metaTags {
17
17
  display: inline;
18
18
  margin-right: var(--space-xxxsmall);
@@ -1,12 +1,11 @@
1
1
  import React, { ElementType } from 'react';
2
- import cx from 'classnames';
3
2
 
4
3
  import { Icon } from '../../ui/icon';
5
4
  import { FileName } from '../../ui/file-name';
6
5
  import { HoverCard } from '../../ui/hover-card';
7
6
  import { AssetNotPredictive } from '../asset-not-predictive';
8
7
 
9
- import { ReportMetricAssetRow } from '../../types';
8
+ import type { ReportMetricAssetRow } from '../../types';
10
9
  import { AssetMetaTag } from '../asset-meta-tag';
11
10
  import css from './asset-name.module.css';
12
11
 
@@ -25,12 +24,12 @@ export const AssetName = (props: AssetNameProps) => {
25
24
  const { label, isNotPredictive, runs, isChunk, isEntry, isInitial } = row;
26
25
 
27
26
  return (
28
- <span className={cx(css.root, className)}>
27
+ <span className={className}>
29
28
  {isNotPredictive && (
30
29
  <HoverCard
31
30
  label={<Icon className={css.notPredictiveIcon} glyph={Icon.ICONS.WARNING} />}
32
31
  className={css.notPredictive}
33
- anchorClassName={css.notPredictiveAnchor}
32
+ hoverCardClassName={css.notPredictiveHoverCard}
34
33
  >
35
34
  <AssetNotPredictive runs={runs} labels={RUNS_LABELS} />
36
35
  </HoverCard>
@@ -1,3 +1,8 @@
1
- .tableValue {
1
+ .colName {
2
+ width: 100%;
3
+ overflow: hidden;
4
+ }
5
+
6
+ .colValue {
2
7
  text-align: right;
3
8
  }
@@ -1,14 +1,15 @@
1
1
  import type { ComponentProps } from 'react';
2
2
  import React from 'react';
3
3
  import cx from 'classnames';
4
- import type { Asset } from '@bundle-stats/utils/types/webpack';
4
+ import type { AssetMetricRun } from '@bundle-stats/utils/types/webpack';
5
5
 
6
6
  import { Stack } from '../../layout/stack';
7
7
  import { Table } from '../../ui/table';
8
8
  import css from './asset-not-predictive.module.css';
9
+ import { Alert } from '../../ui';
9
10
 
10
11
  export type AssetNotPredictiveProps = {
11
- runs?: Array<Asset>;
12
+ runs?: Array<AssetMetricRun>;
12
13
  labels?: Array<string>;
13
14
  } & ComponentProps<'div'>;
14
15
 
@@ -17,10 +18,11 @@ export const AssetNotPredictive = (props: AssetNotPredictiveProps) => {
17
18
 
18
19
  return (
19
20
  <Stack space="small" {...restProps} className={cx(css.root, className)}>
20
- <Stack space="xxxsmall">
21
- <h3>Asset hash is not predictive</h3>
22
- <p className={css.text}>File names are equal, but the size is different.</p>
23
- </Stack>
21
+ <h3>Asset hash is not predictive</h3>
22
+ <Alert kind="warning">
23
+ File names are identical, but the size is different. Content changes without a hash change
24
+ can cause runtime errors.
25
+ </Alert>
24
26
  {runs && (
25
27
  <Table outline compact>
26
28
  <Table.THead>
@@ -34,8 +36,8 @@ export const AssetNotPredictive = (props: AssetNotPredictiveProps) => {
34
36
  {runs.map(({ name, value }, index) => (
35
37
  <Table.Tr key={name}>
36
38
  <Table.Th>{labels?.[index]}</Table.Th>
37
- <Table.Td>{name}</Table.Td>
38
- <Table.Td className={css.tableValue}>{value}</Table.Td>
39
+ <Table.Td className={css.colName}>{name}</Table.Td>
40
+ <Table.Td className={css.colvalue}>{value}</Table.Td>
39
41
  </Table.Tr>
40
42
  ))}
41
43
  </Table.TBody>
@@ -178,4 +178,58 @@ describe('BundleAssets / addMetricReportAssetRowData', () => {
178
178
  ],
179
179
  });
180
180
  });
181
+
182
+ test('should flag as changed when only meta changes', () => {
183
+ expect(
184
+ addMetricReportAssetRowData({
185
+ key: 'assets/main.js',
186
+ label: 'assets/main.js',
187
+ biggerIsBetter: false,
188
+ changed: false,
189
+ runs: [
190
+ {
191
+ name: 'assets/main.abc123.js',
192
+ value: 1024 * 10,
193
+ isEntry: true,
194
+ isChunk: true,
195
+ isInitial: false,
196
+ },
197
+ {
198
+ name: 'assets/main.abc123.js',
199
+ value: 1024 * 10,
200
+ isEntry: true,
201
+ isChunk: true,
202
+ isInitial: true,
203
+ },
204
+ ],
205
+ }),
206
+ ).toEqual({
207
+ key: 'assets/main.js',
208
+ label: 'assets/main.js',
209
+ biggerIsBetter: false,
210
+ changed: true,
211
+ fileType: 'JS',
212
+ isAsset: false,
213
+ isChunk: true,
214
+ isEntry: true,
215
+ isInitial: 'removed',
216
+ isNotPredictive: false,
217
+ runs: [
218
+ {
219
+ name: 'assets/main.abc123.js',
220
+ value: 1024 * 10,
221
+ isEntry: true,
222
+ isChunk: true,
223
+ isInitial: false,
224
+ },
225
+ {
226
+ name: 'assets/main.abc123.js',
227
+ value: 1024 * 10,
228
+ isEntry: true,
229
+ isChunk: true,
230
+ isInitial: true,
231
+ },
232
+ ],
233
+ });
234
+ });
181
235
  });
@@ -77,7 +77,7 @@ export const getAssetMetaStatus = (values) => {
77
77
  * @returns {ReportMetricAssetRow}
78
78
  */
79
79
  export const addMetricReportAssetRowData = (row) => {
80
- const { runs } = row;
80
+ const { changed, runs } = row;
81
81
 
82
82
  // Collect meta for each run
83
83
  const runsEntry = [];
@@ -97,8 +97,16 @@ export const addMetricReportAssetRowData = (row) => {
97
97
  const isNotPredictive = getIsNotPredictive(row);
98
98
  const fileType = getFileType(row.key);
99
99
 
100
+ // Flag asset as changed if name and value are identical, if one of the meta tags is changed
101
+ const assetChanged =
102
+ changed ||
103
+ typeof isEntry !== 'boolean' ||
104
+ typeof isInitial !== 'boolean' ||
105
+ typeof isChunk !== 'boolean';
106
+
100
107
  return {
101
108
  ...row,
109
+ changed: assetChanged,
102
110
  isEntry,
103
111
  isInitial,
104
112
  isChunk,
@@ -2,7 +2,7 @@ import type { ElementType, ReactNode } from 'react';
2
2
  import React from 'react';
3
3
  import cx from 'classnames';
4
4
  import { Portal } from 'ariakit/portal';
5
- import type { MetricRunInfo, ReportMetricRow } from '@bundle-stats/utils';
5
+ import type { MetricRunInfo, ReportMetricRow, ReportMetricRun } from '@bundle-stats/utils';
6
6
  import { METRIC_TYPE_CONFIGS, getMetricRunInfo } from '@bundle-stats/utils';
7
7
 
8
8
  import { Box } from '../../layout/box';
@@ -72,6 +72,12 @@ function defaultRenderRunInfo(item: ReportMetricRow) {
72
72
  );
73
73
  }
74
74
 
75
+ export type RenderRunNameProps<T extends ReportMetricRun = ReportMetricRun> = {
76
+ className?: string;
77
+ run: T;
78
+ runSelector: string;
79
+ };
80
+
75
81
  interface EntryInfoProps {
76
82
  itemTitle?: React.ReactNode;
77
83
  item: ReportMetricRow;
@@ -82,6 +88,7 @@ interface EntryInfoProps {
82
88
  tags?: React.ReactNode;
83
89
  onClose: () => void;
84
90
  renderRunInfo?: (item: ReportMetricRow) => React.ReactNode;
91
+ RunName?: React.ElementType;
85
92
  }
86
93
 
87
94
  export const EntryInfo = (props: EntryInfoProps & React.ComponentProps<'div'>) => {
@@ -93,10 +100,11 @@ export const EntryInfo = (props: EntryInfoProps & React.ComponentProps<'div'>) =
93
100
  runNameSelector = 'name',
94
101
  runNameLabel = I18N.PATH,
95
102
  runSizeLabel = I18N.SIZE,
96
- children,
97
103
  tags = null,
98
104
  onClose,
99
105
  renderRunInfo = defaultRenderRunInfo,
106
+ RunName = React.Fragment,
107
+ children,
100
108
  } = props;
101
109
 
102
110
  return (
@@ -146,11 +154,13 @@ export const EntryInfo = (props: EntryInfoProps & React.ComponentProps<'div'>) =
146
154
  <Table.Td className={cx(css.runsCell, css.runsColName)}>
147
155
  {rowRun?.[runNameSelector] ? (
148
156
  <FlexStack space="xxxsmall" alignItems="center" className={css.label}>
149
- <FileName
150
- as="code"
151
- name={rowRun[runNameSelector]}
152
- className={css.fileName}
153
- />
157
+ <RunName run={rowRun} nameSelector={runNameSelector}>
158
+ <FileName
159
+ as="code"
160
+ name={rowRun[runNameSelector]}
161
+ className={className}
162
+ />
163
+ </RunName>
154
164
  <CopyToClipboard text={item.label} size="small" />
155
165
  </FlexStack>
156
166
  ) : (
@@ -50,7 +50,17 @@ export const PreviewSource = (props: PreviewSourceProps) => {
50
50
  )}
51
51
  </ControlGroup>
52
52
  )}
53
- <Textarea readOnly rows={rows} value={source} className={css.content} />
53
+ <Textarea
54
+ rows={rows}
55
+ value={source}
56
+ readOnly
57
+ autoComplete="off"
58
+ autoCorrect="off"
59
+ autoCapitalize="off"
60
+ spellCheck="false"
61
+ translate="no"
62
+ className={css.content}
63
+ />
54
64
  </div>
55
65
  );
56
66
  };
@@ -1,6 +1,7 @@
1
+ import type { ComponentProps, ElementType } from 'react';
1
2
  import React from 'react';
2
3
  import { MetricRunInfo } from '@bundle-stats/utils';
3
- import { Asset, MetaChunk } from '@bundle-stats/utils/types/webpack';
4
+ import type { AssetMetricRun, MetaChunk } from '@bundle-stats/utils/types/webpack';
4
5
  interface AssetInfoProps {
5
6
  item: {
6
7
  label: string;
@@ -10,12 +11,12 @@ interface AssetInfoProps {
10
11
  isInitial?: boolean;
11
12
  isNotPredictive?: boolean;
12
13
  fileType?: string;
13
- runs: Array<Asset & MetricRunInfo>;
14
+ runs: Array<AssetMetricRun & MetricRunInfo>;
14
15
  };
15
16
  chunks?: Array<MetaChunk>;
16
17
  labels: Array<string>;
17
- customComponentLink?: React.ElementType;
18
+ customComponentLink?: ElementType;
18
19
  onClose: () => void;
19
20
  }
20
- export declare const AssetInfo: (props: AssetInfoProps & React.ComponentProps<"div">) => React.JSX.Element;
21
+ export declare const AssetInfo: (props: AssetInfoProps & ComponentProps<"div">) => React.JSX.Element;
21
22
  export {};
@@ -3,6 +3,6 @@ import type { TagProps } from '../../ui/tag';
3
3
  import type { ReportMetricAssetRowMetaStatus } from '../../types';
4
4
  export type AssetMetaTagProps = {
5
5
  tag: 'entry' | 'initial' | 'chunk';
6
- status: ReportMetricAssetRowMetaStatus | boolean;
6
+ status?: ReportMetricAssetRowMetaStatus | boolean;
7
7
  } & TagProps;
8
8
  export declare const AssetMetaTag: (props: AssetMetaTagProps) => React.JSX.Element;
@@ -1,5 +1,5 @@
1
1
  import React, { ElementType } from 'react';
2
- import { ReportMetricAssetRow } from '../../types';
2
+ import type { ReportMetricAssetRow } from '../../types';
3
3
  export type AssetNameProps = {
4
4
  className?: string;
5
5
  row: ReportMetricAssetRow;
@@ -1,8 +1,8 @@
1
1
  import type { ComponentProps } from 'react';
2
2
  import React from 'react';
3
- import type { Asset } from '@bundle-stats/utils/types/webpack';
3
+ import type { AssetMetricRun } from '@bundle-stats/utils/types/webpack';
4
4
  export type AssetNotPredictiveProps = {
5
- runs?: Array<Asset>;
5
+ runs?: Array<AssetMetricRun>;
6
6
  labels?: Array<string>;
7
7
  } & ComponentProps<'div'>;
8
8
  export declare const AssetNotPredictive: (props: AssetNotPredictiveProps) => React.JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import type { ElementType, ReactNode } from 'react';
2
2
  import React from 'react';
3
- import type { ReportMetricRow } from '@bundle-stats/utils';
3
+ import type { ReportMetricRow, ReportMetricRun } from '@bundle-stats/utils';
4
4
  interface EntryInfoMetaLinkProps {
5
5
  as?: ElementType;
6
6
  }
@@ -9,6 +9,11 @@ interface EntryInfoMetaProps {
9
9
  label: string;
10
10
  tooltip?: ReactNode;
11
11
  }
12
+ export type RenderRunNameProps<T extends ReportMetricRun = ReportMetricRun> = {
13
+ className?: string;
14
+ run: T;
15
+ runSelector: string;
16
+ };
12
17
  interface EntryInfoProps {
13
18
  itemTitle?: React.ReactNode;
14
19
  item: ReportMetricRow;
@@ -19,6 +24,7 @@ interface EntryInfoProps {
19
24
  tags?: React.ReactNode;
20
25
  onClose: () => void;
21
26
  renderRunInfo?: (item: ReportMetricRow) => React.ReactNode;
27
+ RunName?: React.ElementType;
22
28
  }
23
29
  export declare const EntryInfo: {
24
30
  (props: EntryInfoProps & React.ComponentProps<"div">): React.JSX.Element;