calcite-design-system icon indicating copy to clipboard operation
calcite-design-system copied to clipboard

Expose typings string union type with all the valid icons accepted by <calcite-icon>

Open hcampos-professional opened this issue 11 months ago • 0 comments

Check existing issues

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 a CalciteIconName string union with all the valid icon names.
  • (optionally) CalciteIcon.icon should be typed as icon?: CalciteIconName instead of icon?: string. In some cases the icon can be a boolean, in which case it would be type as icon?: 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

hcampos-professional avatar Mar 01 '24 07:03 hcampos-professional