material-components
[mdc-chip] css not applied to mdc-evolution-chip elements
Bug report
No CSS gets applied to the elements of of class mdc-evolution-chip-set and mdc-evolution-chip.
Steps to reproduce
- Go to https://codepen.io/Sergiu-Starciuc/pen/bGQdgXY
- See that the chips are not displayed properly
Actual behavior
Chips look like simple buttons.
Expected behavior
The elements of the chips should be displayed properly, and not as simple buttons.
Screenshots
Your Environment:
| Software | Version(s) |
|---|---|
| MDC Web | v14.0.0 |
| Browser | Chrome 114 |
| Operating System | Ubuntu 22.04.2 LTS (Linux 5.15.0-74-generic) |
Additional context
I've noticed that elements with a class starting with the mdc-evolution-chip... prefix do not have the appropriate CSS applied.
Also, there aren't any ...-evolution-... entries in the CSS provided at <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">.
Possible solution
Include the relevant CSS for "evolution chips" in <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">.
Same issue here, although what's interesting, is while the mdc-evolution-chip CSS isn't totally present, parts of it are, or are otherwise now changed.
Specifically classes such as:
mdc-chip-setmdc-chipmdc-chip__ripplemdc-chip__text
All exist. Although, not all of the classes from the example here (which link back to this repo) are available under this new naming scheme.
Otherwise, what I've done, and what may be applicable to you as well is utilizing the CSS viewable on the example site here.
It was intentional, see this commit: https://github.com/material-components/material-components-web/commit/9c5662c27f644acee1e5f61f430a928b28572049