calcite-design-system
calcite-design-system copied to clipboard
Expose typings string union type with all the valid icons accepted by <calcite-icon>
Check existing issues
- [X] I have checked for existing issues to avoid duplicates
Description
In the Maps SDK we use icons extensively and we are looking into how we can have type safe icon names. For now we've created a script which generates typescript definitions from the currently-installed asset files, but it seems like it would be better if Calcite exposed typings directly.
Acceptance Criteria
-
components.d.ts
should expose aCalciteIconName
string union with all the valid icon names. - (optionally)
CalciteIcon.icon
should be typed asicon?: CalciteIconName
instead oficon?: string
. In some cases the icon can be aboolean
, in which case it would be type asicon?: CalciteIcon | boolean
.
Relevant Info
calcite-ui-icons
already exposes some typings: https://github.com/Esri/calcite-ui-icons/blob/master/index.d.ts
They are generated with https://github.com/Esri/calcite-ui-icons/blob/master/bin/path-data.js#L113-L123
For Calcite Components we'd need to convert to kebab case.
Which Component
Example Use Case
We're planning on using it in the Maps SDK for JavaScript to validate the names of all the default icons used in widgets.
Priority impact
p4 - not time sensitive
Calcite package
- [X] @esri/calcite-components
- [X] @esri/calcite-components-angular
- [X] @esri/calcite-components-react
- [ ] @esri/calcite-design-tokens
- [ ] @esri/eslint-plugin-calcite-components
Esri team
ArcGIS Maps SDK for JavaScript