Skip to content

v4.21.0

Choose a tag to compare

@anuradha9712 anuradha9712 released this 18 Mar 23:57
· 151 commits to master since this release

4.21.0 (2026-03-19)

Highlights

  • feat: add accessibility in design system components based on WCAG 2.2 AA guidelines

Breaking changes

NA

Migration guide

NA

Deprecations

NA

Features

  • feat(slider): add keyboard navigation (0e88dab)
  • feat(stepper): keyboard accessibility — Arrow navigation, Home/End (8c3c67b)
  • feat(chip): update action icon button in chip component (ddc4dc7)
  • feat(select): add wrap behavior story (7f9aec6)
  • feat(VerticalNav): add Tree View keyboard accessibility (WAI-ARIA) (14def7c)
  • feat(chatInput): fixed the bg color on hover to fix placeholder contrast issue (e6d709f)
  • feat(verticalNav): enhance focus and active states for menu items (c983af2)
  • feat(calendar): update calendar colors for WCAG 2.2 compliance (817f71c)
  • feat(stories): add a11y props in all component stories (1c84fdc)
  • feat(chip): add ally props in chip family components (cf1f729)
  • feat(styles): update focus states across multiple components to use consistent outline styling (5009577)
  • feat(select): update touchpoint of action icon button (8c0d3bc)
  • feat(editableInput): update space key behavior (2a10d98)
  • feat(input): update focus state for input component (6bfa7ab)
  • feat(input): update touchpoint area for icon in input component (e296a09)
  • feat(tabs): update touchpoint area for icon in tabs component (7c77359)
  • feat(AIChip): update focus ring to outline-based style (1ad8825)
  • feat(textarea): update focus styles to use outline-based focus ring (bb815bb)
  • feat(metricInput): update focus style for metricInput (910096c)
  • feat(chip): updated focus states for chips and updated with new outline and background colors (ae4d60e)
  • feat(modal): add a11y (92e118f)
  • feat(verticalNav): add a11y support in vertical nav (6da6a6e)
  • feat(horizontalNav): add a11y support in horizontal nav (77bbe04)
  • feat(tabs): update a11y for tabs component (23d820f, abf9bcc)
  • feat(modal): add aria-labelledBy prop in modal component (c8efaa7)
  • feat(tabs): updated focus and tab click handler (30b8002)
  • feat(sidesheet): add focus trap support in sidesheet component (456df25)
  • feat(horizontalNav): update focus states for horizontal navigation (5b8607c)
  • feat(listbox): update focus outlines for Listbox items to improve accessibility (e293273)
  • feat(modal): add focus trap support in modal component (1445837)
  • feat(switch): enhance focus and existing states with outlines and border adjustments (a10d42a)
  • feat(link): enhance focus state for Link (0e0baa5)
  • feat(linkButton): update focus styles for LinkButton (116dcf9)
  • feat(ai button): updated focus styles for ai buttons (1840940)
  • feat(AI Response): made accessibility changes to AI Response Component (b1b2b36)

Fixes

  • fix(docs): update wcag a11y images in docs (607d58c)
  • fix(select): fixes custom trigger story in select (47901c2)
  • fix(chip): update selected chip states visually (ca2d7af)
  • fix(patterns): fixed a11y issues in patterns example (e7cc027)
  • fix(link): update border styles for default and subtle link states (b3574c9)
  • fix(checkbox, radio): gap between label and radio, checkbox interactive (d864047)
  • fix(icons): prevent role/tabIndex to non-interactive icons to avoid nested controls (dc8ad26)
  • fix(patterns): update patterns stories with a11y issues (fda590a)
  • fix(dropzone): keyboard accessibility improvements (b33dbd3)
  • fix(switch,selectionCard): keyboard accessibility improvements (78193e5)
  • fix(segmentedControl): update border style for improved visual consistency (a721a8c)

Improvements

  • style(stepper): add stroke to the activated and activated completed state (fda7b58)
  • style(horizontalNav): update states visually for improving accessibility (2b28ebb)
  • style(button): enhance box-shadow for selected button states on focus and active (16027e8)
  • style(button): update box-shadow for selected active button states (7115dd8)
  • style: update hexcode with color tokens (52f2a4d)
  • refactor: remove design token usage rules file (7d40eee)
  • chore(deps-dev): bump svgo from 2.8.0 to 2.8.2 (4f8dba1)
  • chore(deps-dev): bump minimatch from 3.1.2 to 3.1.5 (4d064aa)
  • chore(deps-dev): bump rollup from 2.79.2 to 2.80.0 (dde5b8c)

Documentation

  • docs(linkButton): add a11y guidelines for link button (e092daf)
  • chore(images): add an accessibility tab in Input and a guideline (cd2b298)
  • feat(inputs): add 'Accessibility' tab to inputs documentation and guidelines (8d5973d)
  • feat(linkButton): add Accessibility tab to usage documentation and a guideline inside it (5f38dc9)
  • feat(icons): add 'Accessibility' tab to icon usage documentation and a guideline for accessibility (edc440e)
  • feat(select): add Accessibility tab to usage documentation and a guideline (653fde9)
  • feat(radio): add Accessibility tab to radio usage documentation and a guidline inside it (fd9ed4c)
  • feat(badges): add Accessibility tab to badges usage documentation and a guideline for accessibility (55a0ff9)
  • feat(links): add Accessibility tab to links usage documentation and a guideline inside it (c2cce3e)
  • feat(chips): add Accessibility tab to usage documentation and a guideline inside it (3a6f036)
  • feat(usage): add Accessibility tab to inline editable fields documentation and a guideline inside it (0138cdd)
  • feat(breadcrumbs): add Accessibility tab to usage documentation and a guideline inside (7296f92)
  • feat(checkbox): add 'Accessibility' tab to usage documentation and an error guideline (789fceb)