Changelog for 5.0 | Calcite Design System

February 2026

Breaking changes

action: update to 5.0 design (#13252) (a3979b4), closes #10759
action-bar, action, block, card, dialog, flow-item, panel, shell, tile: drop deprecated slots (#13255) (97e3c8b), closes #13265
color-picker: remove deprecated allowEmpty property (#13246) (cd38674), closes #13086
combobox-item: remove textLabel prop and update heading and value properties (#13427) (49ae75e), closes #9989
drop deprecated CDN namespace (#12546)
drop deprecated component custom CSS props (#13287) (6f60468), closes #13291 #12904
drop legacy custom CSS props deprecated at v2 (#13089) (fc9cb47), closes #11807
drop legacy VS Code IntelliSense file (#13072) (5f15e51), closes #13082
icon: enforce IconName for icon prop (#12920) (527c310), closes #12357
inline-editable: no longer sets the component's scale to the slotted calcite-input's scale (#12241) (b399ab7), closes #10466
input: drop textarea type (#13359) (f350d50), closes #13079
input, input-number, input-text: update prefix and suffix visuals for 5.0 (#13226) (b24c754)
migrate Sass imports (#12216) (22a0da0), closes #10585 #10583
modal, shell-center-row, tile-select, tile-select-group, tip, tip-group, tip-manager: drop deprecated components (#13074) (64d5460), closes #13078
radio-button-group: remove deprecated "grid" layout type (#13005) (48fe83f), closes #12831
restore --calcite-color-focus in index.(s)css (#13398)
shell-panel: layout and position properties are no longer required (#12248) (de8c602), closes #8306
stepper: remove calciteStepperItemChange deprecated event (#13329) (668da6f), closes #13080
tokens: Ensure components inherit font-family css overrides (#13209) (ef30113), closes #7175
use the popover attribute to place floating components in the top-layer (#12904) (1bf3b3b), closes #10208 #13099

Features

accordion-item: Update action slot spacing (#13416) (56a383a)
accordion-item: Update header to use semantic button instead of div (#13664) (4022e50)
accordion-item: Update heading and description styling for system consistency for 5.0 (#13642) (4626f64)
action-bar, action-pad, action-group: Implement ARIA toolbar pattern with configurable selection modes (#13386) (285fb5e)
action: Adjust indicator size and position on small scale (#13558) (e8172bb)
action: Update to 5.0 design (#13252) (a3979b4)
Add topLayerDisabled property to additional components (#13730) (44a99f8)
alert, autocomplete, combobox, dropdown, input-date-picker, popover, tooltip: Add topLayerDisabled prop (#13604) (f37d836)
alert: Remove title slot bottom margin on large scale (#13646) (6946535)
alert: Update to action 5.0 spacing (#13417) (2275e25)
alert: Use filled status icon for consistency (#13665) (d743d0d)
Apply user-provided locale (lang) and supported t9n locale in appropriate contexts (#13315) (c054ecd)
autocomplete: Add token for max menu height (#13616) (75eaf0d)
autocomplete-item-group: update design for 4.0 (#12965) (5cef2b8), closes #12177
block: Add content-end slot (#13348) (077852c)
block: Update heading styling for system consistency (#13326) (5410977)
block: Update to Action 5.0 spacing (#13429) (fe4aaab)
button, chip, stepper-item, swatch, table: Adjust border color for consistency (#13263) (733a632)
card: Update heading and description spacing (#13320) (4b85af9)
card: Update selection state styling for 5.0 (#13341) (bcf0def)
carousel: Add paginationDisabled property (#13704) (efd2573)
carousel: Add paginationStatus to messages (#13710) (f671ef3)
carousel: Improve single Carousel Item display (#13644) (109ec94)
carousel: Ensure icon tokens are correctly applied (#12902) (bb32814), closes #12876
chip: Update to Action 5 spacing (#13445) (ecd6d53)
color-picker, date-picker: adjust outline color for 4.0 (#12990) (7af0410), closes #10768
combobox-item: Remove textLabel prop and update heading and value properties (#13427) (49ae75e)
combobox-item: Set heading as fallback for a11y props and value (#13460) (602abec)
combobox-item-group: update group design for 4.0 (#12933) (48b882e), closes #10780
combobox: Add placement prop (#13471) (a3acef1)
date-picker, input-date-picker: Add support for fr-CA (#13371) (d4c69cb)
date-picker, table-cell: update to use color-surface-highlight token (#12888) (60dc765), closes #12482
dialog, flow-item, panel: Update to Action 5.0 spacing (#13437) (3b8f82f)
dialog, sheet: Add topLayerDisabled prop (#13600) (2ed7eb7)
dialog: Add fullscreenDisabled prop to prevent full screen layout (#13753) (20c3031)
dropdown-item: Reduce height in small & medium scale. (#13391) (6198029)
dropdown: Update selection appearance (#13571) (dcf7a36)
dropdown-group: update design for 4.0 (#12899) (06cb190), closes #10783
flow-item: Remove border from back button (#13449) (41f1fb8)
input-time-picker: Support French Canadian (fr-CA) locale (#13355) (7307cd0)
input, input-number, input-text: Update prefix and suffix visuals for 5.0 (#13226) (b24c754)
list, list-item: Update action slot spacing for 5.0 (#13463) (73bddc3)
list: Add highlight selection appearance (#13570) (81ad34e)
list-item-group: update design for 4.0 (#12977) (c86419c), closes #10764
menu-item: Update dropdown action spacing (#13440) (010a0c5)
menu: Update vertical layout design (#13576) (06f0913)
navigation: Update navigation action spacing (#13434) (be3c2a5)
notice: Add css property for shadow (#13791) (a4f2ecd)
notice: Add neutral kind & appearance property (#13406) (1adc3f2)
notice: Add token for customizing border-radius (#13447) (abc14be)
notice: Update close button to action component & update actions-end slot spacing (#13432) (9b041c0)
popover: Update to Action 5.0 spacing (#13433) (9493dd6)
sheet, dialog: Add size override capability (#13502) (da3914b)
shell-panel: Add border for resize handle (#13697) (43bfac7)
shell-panel: Add size override capability (#13280) (172ca34)
shell-panel: Improve layout and height functionalities for float all display mode (#13517) (3c02440)
shell-panel: Improve support for adjusting height of float-all display (#13410) (1e09a92)
shell-panel: Improve support for height setting of float-all display mode (#13442) (3cc19c4)
shell-panel: Update default max height for slotted calcite-panel (#13454) (e793b37)
shell-panel: Update min-height to avoid content being cut off (#13561) (391999c)
shell-panel: layout and position properties are no longer required (#12248) (de8c602), closes #8306
split-button: Add hover, focus and press background-color css custom property tokens (#13588) (f6a847a)
stepper-item: Reduce height and update styling for improved UX (#13656) (6486b3d)
tab-title: Update to Action 5.0 spacing (#13444) (6010c7d)
table: Update to Action 5.0 spacing (#13436) (0dec108)
table: allow the user to set a specific page to display (#12558) (4ae2dce), closes #8913
tab-nav: improve overflow UX (#12850) (55e1809), closes #10177 #12970
table-cell: remove border styling from selected cell (#13231) (ee6d1cc), closes #10770
text-area: Add loading property (#13679) (d0c9b6a)
tile: Add highlight type for selectionAppearance prop (#13565) (9c0d2a2)
tile: Add headingLevel property (#13501) (a5f56b3)
tile: Fix excess margins with headingLevel property (#13512) (6e5b252)
tokens: Ensure components inherit font-family css overrides (#13209) (ef30113), closes #7175
tree-item: Update to Action 5.0 spacing (#13435) (2cd46be)
tree-item: add calciteTreeItemSelect event (#12851) (afc3ba8), closes #10978
tree: Update selection appearance (#13572) (dd27a3c)
use the popover attribute to place floating components in the top-layer (#12904) (1bf3b3b), closes #10208 #13099

Bug fixes

accordion-item: Enable support for deprecated icon color variable (#13523) (2df8e24)
action-bar, action-pad: Remove topLayerDisabled property (#13809) (e80fdc0)
action-bar, action-pad: add new selectionAppearance property for 4.0 (#13023) (61f0f05), closes #10758
action-group: Skip ARIA attributes when selectionMode is none (#13522) (528f528)
action-menu: Clicking in between actions doesn't close popup (#13680) (ca8ef20)
action-pad: Avoid collapsing unrelated actions (#13828) (68d234e)
action: Allow background color to be changed with transparent appearance (#13527) (d87955f)
action: Drop extra opacity styles when disabled (#13510) (0f375d0)
action: Enable customizing background-color on hover & active when appearance="transparent" (#13466) (c6953d2)
action: Remove text color change for loading state (#13498) (52311c0)
action: Resolve specificity conflict between selection-mode="highlight" and appearance="transparent" (#13686) (25f6965)
action: Support transparent and highlight active background colors (#13699) (6e2e3f1)
action: set aria-expanded for actions used for expanding and collapsing (#12579) (d116114), closes #7003 #10411
alert: Disable dismissProgress animation when reduced motion preferred (#13583) (bb93ee0)
alert: Enable visibilty of dismiss-progress element (#13582) (4379ca8)
block-section: Fix inconsistent interaction states (#13788) (96c53a7)
button: add backward compatibility for --calcite-ui-icon-color token (#13058) (f07c3e4), closes #13038
button: Ensure --calcite-button-icon-color is applied (#13013) (2875ab4), closes #12843
chip: Enable support for deprecated icon color variable (#13478) (96e9a42)
color-picker: fix initial setting of alpha object color values (#12934) (0048395), closes #12871
combobox, filter, list: Stop warning when filtering on empty data source (#13352) (c46edb0)
combobox: Avoid removing unrelated chips while deleting a chip via keyboard interaction (#13688) (aa5ce4c)
combobox: add description for input accessibility (#13047) (6981654), closes #10633
combobox-item: emit calciteComboboxItemChange event on Enter key (#13051) (0c27b47), closes #12647
dialog, input-date-picker, popover, sheet: Skip restoring focus when closing a focus-trap with no previously focused related element (#13324) (4cb245b)
dialog: Allow resizing when resizable and fullscreenDisabled (#13830) (46e4087)
dialog: exclude dialog content from keyboard focus (#13015) (c74c1f8), closes #13000 #12569
dropdown: fix scroller size when setting max-items (#12967) (05ade56), closes #12737
dropdown: ignore selection-mode=none items when closeOnSelectDisabled=true (#12927) (2a982d7), closes #10821
Don't import from undeclared lit-html dependency (#13702) (648c96a)
dropdown-item: Enable customizing icon color with --calcite-dropdown-item-text-color token (#13727) (67d61b6)
Ensure popovers are toggled outside animations (#13490) (89955ce)
flow-item: Back button action uses the provided scale (#13638) (1d71e76)
inline-editable: no longer sets the component's scale to the slotted calcite-input's scale (#12241) (b399ab7), closes #10466
inline-editable: prevent interaction with start-editing button when hidden (#12903) (ff7e420), closes #12858
input-date-picker: Fix border display in RTL (#13755) (f157845)
input-date-picker: Fix trailing border for vertical layout in RTL direction (#13747) (99f0a0f)
input-message: Enable support for deprecated icon color variable (#13586) (2e23dac)
input-number: Enable support for deprecated icon color variable (#13585) (c2e27d8)
input-date-picker: correct token assignments and CSS setup (#12883) (0fcfbb8), closes #12885
input-time-picker, time-picker: Align time display closer to the browser's intended format (#13372) (7d24300)
input-time-picker: Enable support for deprecated icon color variable (#13623) (f6f80bf)
input-time-picker: Ensure popup fields match input fields (#13802) (7b97908)
input, input-number, input-text: Correctly style affix when readOnly is set (#13796) (9269304)
input, input-number, input-text: Update color of prefix and suffix (#13682) (7b77dcd)
input, input-number: Stop active nudging when readOnly is set (#13751) (92d93ec)
input-time-picker: always emit change event when user commits changes even when the value is directly set before or after the user commits the change (#13216) (5332461), closes #12391 #12889
list: fix loader scrim height for empty list (#12961) (e2c2806), closes #12943
list-item: Don't vertically stretch slotted action and dropdown component trigger buttons (#13693) (f9e5d39)
list-item: Fix icon start position when custom content is slotted (#13749) (8c5f9f4)
list-item: Fix spacing issues to match Action 5 design (#13659) (41f0808)
list-item: Maintain vertical alignment of slotted elements on focus (#13425) (242c3db)
list-item: fix memory leak caused by focusing before disconnecting (#12956) (de813f3), closes #12818
menu-item: Enable support for deprecated icon color variable (#13626) (fc69633)
navigation-logo: Enable support for deprecated icon color variable (#13633) (8c6746a)
notice: Allow customizing backgroundColor of close action (#13467) (6e03202)
notice: Apply correct colors for close action when hovered or active (#13605) (7de7bec)
notice: No longer changes close action backgroundColor on focus (#13625) (c53594f)
option: replace line breaks within text content (#13205) (eb96b78), closes #12156
option: improve whitespace handling (#13076) (e89a9b8), closes #12146
pagination, table: fix page number when page size > total items (#13007) (4bc835a), closes #12975 #12569
panel, action-menu: Pass scale down to nested calcite-popover (#13731) (aee39f5)
panel, dialog: Calcite dialog header fails to wrap for the longer text (#13004) (44b0871), closes #12964
panel: Enable support for deprecated icon color variable (#13635) (812aa5a)
panel: Ensure content-top and action-bar slots are visible (#12963) (bad18b4), closes #12894
Remove invalid CSS files from component package exports (#13401) (447e7fd)
Remove remaining references to legacy cdn output dir (#13415) (90ca9cc)
Restore --calcite-color-focus in index.(s)css (#13398) (cb63f5f)
sheet: Improve scrolling behavior for slotted content (#13754) (29f61a1)
shell-panel: Configure component height with user-defined css properties (#13461) (51b59e3)
slider: Ensure value is updated correctly on calciteSliderInput event (#13700) (0b826b4)
slider: Handle falsy values to reset (#13766) (59f13d3)
sort-handle: update Ukranian translation (#12944) (3192789)
tab-title: Enable support for deprecated icon color variable, add "press" variables (#13681) (3d73ed5)
tab-title: fix timing issue when emitting internal and public tab close events (#12935) (6f05ba1), closes #11789
table-row: add deprecated background token as fallback (#13025) (adae123), closes #13024
tile: center text content for short headings (#13213) (b207c63), closes #12606 #12606
tile-group: Make horizontal layout always go horizontal (#13260) (f915c8e)
Update initial floating-ui styles to handle RTL top-layer positioning (#13489) (73442ca)

Performance improvements

combobox: Drop redundant repositioning after each render (#13756) (abe8702)
filter: return all matches early when input is empty string (#12926) (adc0f1f)

Deprecations

action: Deprecate appearance property (d87955f)
input-message: Deprecate component (#13419) (26dbc05)
list: Deprecate border value for selectionAppearance prop (81ad34e)
semantic-tokens: Deprecate foreground and background colors (b2e5420)
semantic-tokens: Deprecate tokens named with multiple xs in favor of replacements with 2xs, 2xl, etc.s (d08aedc)

Code refactoring

action-bar, action, block, card, dialog, flow-item, panel, shell, tile: Drop deprecated slots (#13255) (97e3c8b)
color-picker: remove deprecated allowEmpty property (#13246) (cd38674), closes #13086
Drop deprecated component custom CSS props (#13287) (6f60468)
drop legacy custom CSS props deprecated at v2 (#13089) (fc9cb47), closes #11807
drop legacy VS Code IntelliSense file (#13072) (5f15e51), closes #13082
drop undocumented util classes (#13223) (6e8b324)
icon: enforce IconName for icon prop (#12920) (527c310), closes #12357
input: Drop textarea type (#13359) (f350d50)
migrate Sass imports (#12216) (22a0da0), closes #10585 #10583
modal, shell-center-row, tile-select, tile-select-group, tip, tip-group, tip-manager: drop deprecated components (#13074) (64d5460), closes #13078
radio-button-group: remove deprecated "grid" layout type (#13005) (48fe83f), closes #12831
stepper: Remove calciteStepperItemChange deprecated event (#13329) (668da6f)

Compatibility

The 4.34 release of the ArcGIS Maps SDK for JavaScript supports Calcite version 3.3.2. In your application, we recommend using the same version or any minor version greater than ^3.3.2.

If you are using version 4.33 it is recommended to use Calcite's 3.2.1, or any minor version greater than ^3.2.1.