carbon-design-system / carbon-preprocess-svelte

Svelte preprocessors for the Carbon Design System
Apache License 2.0
68 stars 6 forks source link

feat!: library rewrite #54

Closed metonym closed 5 months ago

metonym commented 6 months ago

Closes #50, closes #44, closes #46, closes #53, closes #52, closes #48, closes #47, closes #46, closes #40, closes #26, closes #24, closes #19, closes #18, closes #17, closes #28

Breaking Changes


optimizeImports

Notes: for best DX, also instruct Vite to optimizeDeps.ignore

optimizeCss

Steps:

The potential for false positives is too high (relying on any and all selectors). Instead, focus on class names as this is much more defensive (e.g., .bx--). The goal is to still remove the bulk of unused .bx-- selectors without needing to stress about false positives.

  1. Pre-index the used class names per Carbon component.
  2. Gather the resolved component names in the plugin.transform hook.
  3. In the generateBundle hook, read in all generated .css files.
  4. Traverse the CSS AST and remove all .bx-- selectors that are not included in the map.
metonym commented 6 months ago

What's blocking this PR is that some Carbon components that employ custom styling (e.g., HeaderSearch) does not correctly prune this.