V13 Releases
v13.3.0
Components
Icons
- 9 new default Core and NRMA Help icons added in all 3 weights.
- 11 new and 1 updated default and NRMA Help Product icons.
InputFormat
Prevents input that starts with a dot and ensures correct handling of
values.valuein theonChangeevent, improving input validation and reliability.
ProgressLoader
- Added accessible name to the Progress Loader.
Documentation
- Removed Babel config that is no longer needed for Docusaurus.
Build Configuration
Dependencies
Updates the paths for the
@iag/chroma-react-ui.icondependency in thedrawerandmodalcomponents'package.jsonfiles. This ensures correct dependency resolution and prevents potential issues related to missing or incorrect icon imports.
Figma
- ProgressLoader (Inline) bugfix: 25% value updated to have correct border radius on progress bar.
Components
Icons
- 9 new default Core and NRMA Help icons added in all 3 weights.
- 11 new and 1 updated default and NRMA Help Product icons
v13.2.0
Brand
IAG
- Updated Favicons.
Components
Accordion
Updated
<Accordion />component inverse variant icon on hover to pull global token.
Button
Icon Button min-width added to ensure
border-radiusis properly applied.
Drawer
disablePortalprop added.
Modal
Converted the
<Modal />from@mui/joyto@mui/material.
Notification Counter
- New component added to the library.
Tab
- Updated import paths for better clarity and maintainability.
Added support for text value for the
initialprop as well as a string number to select a Tab on render.
Toggle
Removed the
defaultCheckedprop from the<Toggle />component as this should be a controlled component.
Documentation
- Docusaurus updated to 3.8.1
- Updated Figma links in Component pages
- Corrected link to Github repo on homepage.
Updated documentation for the Logo component examples and usage guidelines. The changes improve developer understanding of when and how to use different Logo variants.
Fixed the broken links to Brand Colours and System Colours in the Using Tailwind Classes Alert on the Start Developing page.
- Updated copy on the Start Designing page.
v13.1.1
New <Toggle /> component was missing from the chroma-components package dependencies object causing the component to be unavailable when installing into an app. This has now been corrected with this patch release.
v13.1.1
New <Toggle /> component was missing from the chroma-components package dependencies object causing the component to be unavailable when installing into an app. This has now been corrected with this patch release.
v13.1.0
Brand
New Zealand Seniors
- New brand added to the library.
OneChoice
- New brand added to the library.
Components
Toggle
- New component added to the library.
Tab
Added new token definitions for tab icon colors to ensure all states (default, hover, focus, selected, inverse) are customisable.
Progress Indicator
- Added support for customizing the font family of step indicators.
Link
Simplified the
Linkcomponent's variant logic inlink.tsxby reducing redundant style mappings and introducing a new.link-buttonclass for button link variants.Added hover styles for
.link-buttoninlink.module.cssto ensure consistent behavior (removes visible link underline in the Button Link variant).
Accordion
Updated hover styling to match the text for Icons added to an Accordion item
Documentation
Fixed a bug in the Typography page which was causing a color reference for headline elements
Changed the
brandprop in logo examples to use "iag" instead of "nrma" for consistency.
Build Configuration
Updated the step from "Check for Alpha Release" to "Check for Alpha or RC Release," and expanded the condition to include -rc. in addition to alpha when determining if the workflow should stop. The corresponding log message was also updated to reflect this change.
Code scanning fixes
- Fixed various code scanning issues reported by GitHub.
v13.0.0
Brand
Mighty Ape
- New brand added to the library.
View brand documentation
.
Heritage Bank
- New Logo only brand added to the library.
View brand documentation
.
Monochroma
- Updated secondary colour to be accessible with white.
View brand documentation
.
NRMA Help
Progress Loader - border removed, backdrop colour updated and inline variant updated with different label position.
Progress Indicator - Step sizes reduced, numbers removed, active step border added and mobile label position updated.
- Icons - Core and Product Icons updated.
Background colour added to Progress Loader and Progress Indicator docs examples.
Components
Drawer, Modal, Tooltip
Updated class name attribute to include theme name where necessary for correct token scoping
Icons
- 32 new icons added to Core Icon set
- 50 new icons added to Product Icon set
Input Group
- Accessibility fix, moved the
idprop to the correct place to allow theFormGroupto create the correct association between the<label for>attribute and the<Input id>
Logo
- New brands added.
heritage-bankmighty-ape
Progress Indicator
- Added ability to show final step as checked
Progress Loader
- New inline variant
backdroptoken added for brand styling.- Updated Usage documentation.
Tab
New Tab component using the MUI Tab component. Component has a new API and is not backwards compatible with the old component.
- Removed Block variant on mobile in place of new Scrolling variant.
See our Tab migration guide for more information on how to migrate from the old Tab component to the new one.
Documentation
- Update
<Spinner />example page with a live region update for Accessibility. - Added Tab migration guide.
- Old Tab component added to the
deprecatedsection in the docs with information on how to continue to use the old version although this is not recommended. - Updated
<Button>usage guidelines - Updated Accessibility page with general recommendations to follow when developing your application.
- Fixed
<Alert>validation example with correctidattributes. - Refactored
SVGspage to allow assets to render for local and dev environments. - Added new Outage Mitigation Guide to Guides section.
Build Configuration
Dependencies
Consolidated
@muijoyandmaterialpackage versions so that multiple versions are not included in the library.@muimaterial packages updated to v7.
Code scanning fixes
- Added
DOMPurify.sanitize()function to brand selector in the docs redirectUrlnow constructed usingnew URL()to ensure it is constructed safely and cannot be exploited by malicious input.
Figma only
- Body Bold font weights for Chroma and NZI updated from 700 to 600.
- Deprecated Mode added.
- Theme dropdown organised into alphabetical order.
Checkbox Outline Bugfix: Selected border colour updated from default to selected token and border radius token updated to pull theme tokens instead of global tokens for ASB, Bendigo Bank, Lumley, NAC and State.
Radio Outline Bugfix: Border radius token updated to pull theme tokens instead of global tokens for for ASB, Bendigo Bank, Lumley, NAC and State.
- NAC Bugfix: Input border radius updated to 4px to align with code.