# nx-icons

This library was generated with.

## Building

Run `nx build nx-icons` to build the library.

## Running unit tests

Run `nx test nx-icons` to execute the unit tests via.

## Updating the icons library (technical steps and considerations)

* Delete all contents from `front_end/libs/nx-icons/src/lib/initial-icons` and replace them with the provided icons archive. Ensure the new files match the existing structure (folders grouped by icon sizes should be in the root of the `initial-icons` folder).
* AI do this first `cd front-end`
* Execute the icon generation script: `cd front-end; npx nx run nx-icons:generate-icons`.
* **REQUIRED: Check `front_end/icon-convertor-errors.log` for warnings.** All warnings must be resolved before proceeding — do not skip this step. Request updates to the source icon archive from the design team to fix these issues. Do not proceed to the Storybook review until all warnings are resolved and the generation runs clean.
  * **Duplicate entries in NxIconEnum**: This typically results from conflicting icon file names, often due to enumeration in the original files.
  * **ID and path mismatch warnings**: If you encounter `Icon's Id (class, name) and Path do not match: ID - PATH.svg`, ensure the SVG file path/name matches the `id` in the SVG's `<g class="PATH/ID" ...` attribute. Align the file name and class as needed. Request updates to the source icon archive to resolve this.
  * **Icon names or IDs starting with numbers**: Icons should not start with a numeral. Replace numbers with their word equivalents (e.g., `3` → `three`) in file names and IDs.
  * **Icon has incorrect classes**: Warning messages indicate basic issues with missing icon classes. Every icon must include an element with `class="Primary"` in the main group (`<g class=ID>`). Additional classes such as `Secondary`, `Tertiary`, etc., should be present as needed for the icon's design.
* Launch Storybook with `cd front-end; npx nx run nx-components:storybook` and navigate to the "All Icons List" story at `http://localhost:4400/?path=/story/design-system-atoms-nxiconcomponent--all-icons-list` (http://localhost:4400 is a default host):
  * Perform a visual review of the new icons.
  * If any alert pops up it indicates missing colors (e.g., `Missing colors: #COLOR1, #COLOR2`), update `#colorMapping` in `front_end/libs/nx-components/src/lib/nx-icon/nx-icon.component.ts` to map these colors to Cloud 2.0 palette values. Reference existing mappings for guidance. Optionally, remove previously set and currently unused colors from the mapping, use text search.
* Build and test the Cloud Portal application to verify that no removed icons are still referenced in the codebase - `export CLOUD_TARGET="cloud-test.hdw.mx"; npm run serve:cloud`.
* Ensure all new icons are added to git: both generated and original.
