material-components-web
material-components-web copied to clipboard
MDCChipSet seems to lack a convenient API to handle dynamically adding chips after initialisation
Feature Request
MDCChipSet has an addChip(index) call, but this seems to be intended for animating a chip already in the DOM/ AFAIKs the only way to dynamically add a new chip (i.e get a new entry in the private this.chips) after the chipset was initialised is to manually add it to the dom, and then call initialize() again, which seems unfortunate.
Proposed solution
Provide an appendNewChip call which takes a dom element and puts it into the this.chips array (optionally taking an index position). If you want to keep the user in charge of managing the dom, which seems to be the design assumption with chipset, then assume the element was already added by the user, and doesn't need injecting into the chip set container.
Note that there is already API to trigger the removal of a single chip, so it seems strange there is no way to add one without a full re-initialisation, but perhaps I'm missing an API call?
If calling the initialize() call after adding a new chip post-initial initialisation is the intended method of dynamically adding new chips, then documenting this would be useful.
Actually, unsurprisingly using initialize() as a workaround for the lack of an add api has issues (event handling seemed to have problems when calling initialize multiple times). I've shifted to throwing away the chipset and re-rendering whenever II need to add a new chip. Please let me know if someone can point me at a better approach (or the relevant docs section if I'm missing an obvious way of doing this that is already documented).
Pat, could you take a look? Seems like support for appending a new chip was added internally in cl/387908492 but not sure if it was intentional to not add support directly in the foundation for this.