October 2026

Initiatives

Inline editing support across Input components

Inline editing functionality has been added to the Input, Input Text, and Input Number components via the inlineEdit property. The new mode keeps the component borders to a minimum when not engaged and supports "confirm" and "cancel" editing workflows. Inline editing was supported by the Inline Editable component, but with the built-in functionality across Input components, the Inline Editable component is deprecated for removal to create a more streamlined developer experience.

By default, the inlineEdit property renders confirm and cancel controls at the end of the Input while editing. The controls function without additional configuration, but can be customized via the associated events, properties, and styles. To disable the controls, set inlineEdit to "controls-disabled". For more information, refer to the Inputs' individual pages.

Use dark colors for code blocksCopy
1
<calcite-input inline-edit value="Business District Tree Survey" placeholder="Business District Tree Survey"></calcite-input>
Three Panels with each featuring its own map and header using an inlineEdit Input in default, edit, and edit without controls states.

Scale across components

The Menu and Menu Item components now support different sizes through the scale property. Sizing aligns closely with patterns used across Calcite, where the "m" (medium) scale value preserves the same visual appearance prior to the introduction of the scale property.

With its addition to Menu and Menu Item, the scale property offers consistency across the design system, ensuring uniform sizing and spacing throughout applications.

Three Menu components with scales of small, medium, and large.

CSS light-dark() function

Calcite's mode classes have been deprecated, in favor of supporting the light-dark() CSS function and color-scheme property. Combined together, these features allow for a more native and flexible approach to theme switching, detection, and customization.

Use the color-scheme property to control the theme of an application or specific component(s), and the light-dark() function to define both a light and dark value for a given CSS property at once. Explore the mode core concepts to learn more about theme switching.

Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
:root {
  color-scheme: light;
  --calcite-color-brand: light-dark(#00c291, #00dea6);
}

calcite-navigation {
  color-scheme: dark;
}

Consistent open and expand properties

The properties that control the visibility of content have been standardized across components, improving clarity and consistency in the developer experience. Related properties, events, and styles also follow the same naming convention. For example, Block's collapsible property has been deprecated and replaced with expandable, in alignment with its expanded property.

The following guidelines have been applied to the naming of visibility properties:

  • When toggling the visibility of an entire component, or its menu, the open or closed property is provided.
  • When toggling the visibility of a component's content, the expand or collapse property is provided.

corner-radius design token inheritance

Throughout Calcite components, support for inheriting the --calcite-corner-radius design token has been improved. While many components have a dedicated corner radius token, inheriting the semantic token allows for a quick and consistent way to set the corner radius at the application level.

Use dark colors for code blocksCopy
1
2
3
:root {
  --calcite-corner-radius: 8px;
}
Many Calcite components arranged in a grid, all with rounded corners set by the semantic corner radius token.

Feature enhancements

Action Bar overflowMode

Action Bar now supports overflowMode to control how Actions respond when horizontal space is limited. By default, "collapse" moves Actions into an overflow menu as space becomes constrained. Set it to "wrap" to place Actions on additional rows, or "none" to disable automatic overflow handling.

Action Bars comparing collapse, wrap, and none overflow-mode as the available width changes.

Table's sticky header

Table can now keep its header visible while users scroll by enabling the stickyHeader property. The first row in the table-header slot remains in view, helping users keep column context.

Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
<calcite-table caption="Simple table" bordered sticky-header style="block-size: 20rem">
    <calcite-table-row slot="table-header">
        <calcite-table-header heading="Plot"></calcite-table-header>
        <calcite-table-header heading="Sunny days" description="(yearly)"></calcite-table-header>
        <calcite-table-header heading="Size" description="(area in ft)" alignment="end"></calcite-table-header>
        <calcite-table-header heading="Fruits" description="(yield in lbs)" alignment="end"></calcite-table-header>
        <calcite-table-header heading="Vegetables" description="(yield in lbs)" alignment="end"></calcite-table-header>
    </calcite-table-row>
  ...
</calcite-table>
Table displaying plot data with column headings remaining visible while users scroll through the rows.

Date and Time Picker enhancements

placeholder property

Custom placeholder text can now be displayed in Input Date Picker, Input Time Picker, and Input Time Zone through the placeholder property. The text appears when no value is selected to provide extra context for input workflows. For alignment with native HTML input behavior, the placeholder value is announced to assistive technologies when no label is provided. When a label is defined, it takes precedence, and when both properties are defined they are each announced to assistive technologies.

Input Date Picker, Input Time Picker, and Input Time Zone displaying custom placeholders.

clearable behavior

The clearable property allows users to clear selected values in Input Date Picker and Input Time Picker with a dedicated button. For date ranges, one button clears both dates.

Input Date Picker and Input Time Picker with selected values being cleared using their clear buttons.

Shell Panel resizing mobile support

On mobile devices, users can now resize Shell Panel by dragging its handle when the resizable property is enabled. Resizing on mobile devices gives users more control over the space available for Panel content and the main view.

A bottom Shell Panel containing layer controls being resized by dragging its handle on a mobile device.

Tabs usability improvements for last closable Tab

Tabs now include a lastTabClosable property, allowing the last visible Tab Title with closable enabled to retain its close button. By default, the close button remains hidden on the last visible tab. The new property supports workflows where users need to close all tabs.

Tabs for Watercraft, Automobiles, and Aircraft being closed, including the last remaining tab with lastTabClosable property enabled.

Action's --calcite-action-loader-color token

The --calcite-action-loader-color token lets you customize the progress ring color of the loading indicator in Action. The token is applied across default, active, and disabled states to match an application's theme.

Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
.loading-action {
  --calcite-action-loader-color: green;
}
.loading-action[active] {
  --calcite-action-loader-color: red;
}
.loading-action[disabled] {
  --calcite-action-loader-color: black;
}
Actions displaying customized loading indicators in default, active, and disabled states.

Sheet non-modal offering

Sheet now supports non-modal behavior with the modalDisabled property. When enabled, the page-blocking scrim is removed, allowing users to interact with other page content while the Sheet remains open. Sheet retains its modal behavior by default.

Use dark colors for code blocksCopy
1
2
3
4
5
<calcite-sheet label="Application menu" modal-disabled>
  <calcite-panel closable heading="Application menu" id="modal-panel">
      ...
    </calcite-panel>
</calcite-sheet>
Comparison of modal and non-modal Sheets, showing the page-blocking scrim for the modal Sheet and access to page content with the non-modal Sheet open.

Flow Item's collapseDirection

Flow Item now supports the collapseDirection property to customize the direction of its collapse icon. This provides flexibility when embedding the component in different layouts, allowing the icon to align with surrounding components and user expectations.

Feature overlays Flow Item showing collapseDirection down and up in expanded and collapsed states.

Link now uses native CSS text-decoration: underline, aligning the component's underline and text colors across interaction states and typefaces. Icons will no longer be underlined.

Block's nesting improvements

Block now supports a children slot for nesting Blocks and Block Groups. Nested Blocks organize related content into a clear hierarchy, making settings easier to scan and letting users expand only the sections they need.

Account settings organized into Profile, Notifications, and Security Blocks. Notifications is expanded to show Email notifications and Push notifications Blocks. Email notifications is further expanded with Switches for Marketing communications and Order updates.

Block's toggleDisplay

The new toggleDisplay property supports "button" and "switch" controls, providing more flexibility for expandable content. Blocks without content no longer reveal empty padding when expanded.

Block toggleDisplay = "button"Block toggleDisplay = "switch"
Beginner pottery Block expanded and Advanced pottery Block collapsed using button toggles. Input components with consistent clear affordance.

Block Group's expandMode

Block Group adds the expandMode property to control the expansion of its child Blocks. For instance, when "single", only one Block is expanded at a time.

Breakfast, lunch, and dinner Blocks open one at a time.
When expandMode is "single", opening a Block closes the previously expanded Block.

Dialog, Panel, and Flow Item's header-top slot

Dialog, Panel, and Flow Item now support a header-top slot for placing custom content, such as pagination, in a full-width row at the top of the header. The slot offers the ability to add crucial controls, providing additional guidance and a consistent experience.

Service request dialog with a Notice in the header-top slot.

Autocomplete's highlight improvements

Autocomplete now keeps the highlighted Autocomplete Item in sync with its value, making it easier for users to identify the matching option when viewing suggestions.

Favorite hiking trail Autocomplete with the selected trail highlighted in the list of trails.

Dropdown now offers the --calcite-dropdown-max-height CSS variable. The variable allows the customization of the maximum height of its menu comprised of Dropdown Items, which allows the ability to adjust content to the available space in a UI.

Map layer Dropdown with Parcels, Roads, Elevation, and Hydrology, where Hydrology is only partially shown due to the component's max height.
The Dropdown's menu maximum height can be modified using the --calcite-dropdown-max-height, such as accommodating areas with limited space in the UI.

Action Bar's expandToggleDisabled

Action Bar offers a new expandToggleDisabled property to control whether the expand toggle is displayed, which deprecates the expandDisabled property. The property was added to support the intent of hiding the component's toggle rather than preventing expansion when its layout changes.

One action bar with and one without expandToggleDisabled.

Accessibility and internationalization

Slider's label property

Slider offers a label property to communicate additional context on its purpose to assistive technologies. The new label property can be used when its context is not necessary to be represented visually, but should still be conveyed to assistive technologies. Learn more about accessibility with forms and labels.

Use dark colors for code blocksCopy
1
<calcite-slider value="30" label="Park boundary layer transparency"></calcite-slider>

Pagination's improved structure

Pagination features new key structural improvements. The component was refactored so its child elements include native <ul> and <li> HTML elements providing an expected keyboard experience and communicate more effectively with assistive technologies.

Tile's keyboard support for href

Tile supports keyboard and mouse interactions when its href property is set. The update ensures more audiences can interact with a specified link via click or pressing the Enter key when the component is focused.

Switch's high contrast improvements

High contrast support has been added to Switch to ensure the component's contrast is supported regardless if the component is checked or focused when the forced-colors CSS media feature is active.

Switch displays sufficient contrast when forced colors is active, inactive, and when toggling its checked state.

Slider's RTL support for negative numbers

Slider now supports right-to-left (RTL) layouts for negative numbers, ensuring the component communicates proper context to more locales and maintains expected visual alignment in RTL contexts.

Explore internationalization and RTL support to learn more about bidirectional support for languages.

Input Time Picker's alignment for RTL languages

The Input Time Picker supports right-to-left (RTL) languages alignment, ensuring the component maintains proper visual alignment and usability for RTL locales.

Button's loading improvements

Button now provides improved loading state support, where the component communicates its status effectively to users and assistive technologies. The component now adds the aria-busy attribute when loading, otherwise the attribute is not communicated to provide an expected experience to more individuals.

Date Picker day support in NVDA

Date Picker offers improved support for the NVDA screen reader, ensuring individual days within the calendar are keyboard navigable and communicated to assistive technologies, offering the same experience previously offered with JAWS and VoiceOver.

Changes since May 2026

Below is a full list of changes since May, which include:

Features

  • action-bar: Add expandPosition and actionsStartGroupLabel properties and actions-start slot (#13995) (56722f2)
  • action-bar: Add expandToggleDisabled property (#14793) (b6ecc16)
  • action-bar: Add overflow-mode property supporting collapse, wrap, and none (#14799) (b38edeb)
  • action-group: Add calciteActionGroupChange for selection tracking (#13969) (cc39f0d)
  • action-group: Add overflow-actions-disabled (#14430) (5dcd697)
  • action: Add --calcite-action-loader-color CSS token (#14783) (781a2fb)
  • action: Add overflow-disabled property (#14438) (4feb078)
  • Add custom Stylelint plugin as private package (#14107) (178de12)
  • Add non-modal behavior to Sheet (#15012) (588a3ae)
  • autocomplete-item: Add selected property (#14137) (1f0b079)
  • autocomplete, filter, input-date-picker, input-time-picker, progress, segmented-control, slider, time-picker: Enable default corner-radius inheritance across components (#15071) (918e177)
  • block, block-group: Enhance nesting support with expandMode property & children slot (#14733) (1bef6ef)
  • block: Add background color token (#15099) (14357b4)
  • block: Add expandable icon color tokens (#15156) (e8eaf0a)
  • block: Deprecate collapsible in favor of expandable (#15091) (da2250b)
  • button, split-button, card, input, input-number, input-text, input-time-picker, color-picker, date-picker, select, table: Enable default corner-radius inheritance across components (#14890) (a3d3e0e)
  • card, card-group: Add scale prop (#14299) (c8d507b)
  • card: Update scale prop from private to public (#14342) (7acb44b)
  • carousel: Add pagination-position property (#14276) (dbe559b)
  • combobox, input-time-zone, segmented-control: Add corner-radius tokens (#14402) (210d619)
  • combobox: Add selectionAppearance property (#14043) (0199108)
  • components: Add theme fallbacks for deprecated color tokens (#15034) (b5fd1db)
  • components: Add theme fallbacks for deprecated corner-radius tokens (#15033) (b9c228e)
  • components: Add theme fallbacks for deprecated font weight token (#15032) (cb90450)
  • components: Add theme fallbacks for deprecated spacing tokens (#15035) (f47722a)
  • dropdown, split-button, sort-handle: Add additional placement options (#14132) (7cb3def)
  • dropdown: Add referenceElement property (#14172) (c1bfd78)
  • dropdown: Add max-height css token (#14680) (350a5b7)
  • floating-ui: Apply semantic shadow tokens to components (#14337) (fb75394)
  • flow-item: Add collapseDirection property (#14588) (b8a5855)
  • inline-editable: Remove extra space between input field and inline-editable controls (#15231) (da6e703)
  • input-date-picker, input-time-picker: Add clearable behavior (#14758) (4d1fedd)
  • input-date-picker: Add placeholder property (#14748) (3ec7225)
  • input-date-picker: Update vertical layout divider line padding (#14842) (1fabb42)
  • input-time-picker: Add placeholder property (#14613) (71cf9f4)
  • input-time-zone: Add label property (#15390) (1c9ee53)
  • input-time-zone: Add placeholder property (#14794) (976dc74)
  • input, input-number, input-text: Add inline-editable functionality (#14623) (99fd01a)
  • input, input-number, input-text: Add inline-editable functionality (#15122) (36e0f0b)
  • label: Skip label focus behavior if click event is canceled (#14412) (cdd67b4)
  • link: Refine interaction visuals and reduce icon spacing (#15237) (aa09aef)
  • link: Replace gradient underline with native text decoration (#15204) (508f2f2)
  • list, list-item-group: Stick list item group header to the top of the list (#14030) (2cce8ce)
  • menu, menu-item: Add scales, update padding, spacing, font-sizes (#14797) (955ea75)
  • menu: Propagate scale to menu items (#15056) (f4a6539)
  • navigation-logo, navigation-user: Remove heading's padding top when there is no description (#14374) (a3d99f5)
  • navigation-logo: Update standalone heading font size (#14480) (5238f34)
  • navigation, navigation-logo, navigation-user: Add scale prop (#14265) (6506874)
  • navigation: Set scale on nested calcite navigation (#14428) (977deab)
  • panel, dialog, flow: Add space tokens for "content-top" and "content-bottom" slots (#13999) (0b73c1d)
  • panel, flow-item, dialog: Add header-top slot (#15028) (dde3d3f)
  • panel, flow-item, dialog: Add rich heading and description slots (#14179) (daa8b51)
  • panel, flow-item: Add dialog role and focus trap support when closable (#14685) (800ec12)
  • shell: Add variables for box-shadow and border-radius (corner radius) (#14769) (2c65bf4)
  • slider: Add accessible label support (#14845) (0c5d518)
  • sort-handle: Hide reorder group title when no sibling groups; disable boundary items instead of hiding (#14105) (2ffec6b)
  • Support one referenceElement having multiple popovers or tooltips (#13960) (af02a90)
  • switch: Add validity property (#14791) (beeef0c)
  • tab-title: Add beforeClose property to support prevention of tab close (#15314) (8ba3fa4)
  • table: Enable sticky header (#13906) (ac26d72)
  • tabs: Add last-tab-closable functionality (#14446) (b8144a8)
  • tooltip: Add pointerDisabled and scale properties (#14078) (064ba80)
  • tree-item: Restore selection icon to bullet when selection-mode='single'|'single-persist'|'children' (b0d28f4)

Bug Fixes

  • action-bar, action-pad: Ensure actions remain tabbable when tabbed through (#14429) (1dfdf94)
  • action-bar: Account for nested action-menu items in overflow sizing (#14968) (dfddde2)
  • action-bar: Hide leading group border for action-start slot when wrapping (#14879) (4d9e55a)
  • action-bar: Remove attributeFilter from MutationObserver (#14476) (24fe334)
  • action-bar: Support shadow-slotted actions and groups (#14818) (6eb7168)
  • action: Avoid double screen reader label (#14926) (dddae7b)
  • AssetPathChanged must be true after defineCustomElement's resourcesUrl (#15068) (479740c)
  • autocomplete: Synchronize item selection with value (#15049) (7460629)
  • autocomplete: Track slotted group items via internal updates (#14891) (70082c6)
  • avatar, meter, table, text area, time picker: Apply line-height (#14161) (654dc86)
  • block: Adjust deprecation message for expanded state events (#15386) (352ba76)
  • block: Independently style icons based on CSS tokens (#14423) (b1f0c25)
  • block: Restore padding for default slotted text (#15112) (aa44d07)
  • Bump [@arcgis](https://github.com/arcgis) deps to improve performance (#15132) (598b171)
  • button: Focus no longer overrides hover/active state colors (#15137) (9364cfd)
  • button: Omit empty aria-label when label is not set (#15253) (0c78c2b)
  • carousel: Avoid rendering pagination when disabled (#15296) (780bfeb)
  • checkbox: Use danger token color when invalid and hovered (#14586) (94cc480)
  • combobox, input-time-zone: Only cancel Escape key event when open or clearing text (#14382) (6c35a23)
  • combobox, menu, textarea: Apply line-height (#14236) (a5eaecf)
  • combobox: Correct fit selection count chip (#14243) (4801091)
  • combobox: Ensure custom values are appended to value regardless of DOM order (#14522) (0f75394)
  • combobox: Honor max-items property (#13959) (9cda075)
  • combobox: Improve disabled chip handling and select-all behavior (#14144) (eb33a56)
  • combobox: Improve disabled chip handling and select-all behavior (#14517) (10a8352)
  • combobox: Keep active selection unchanged when expanded and collapsed with keyboard (#14479) (691e849)
  • combobox: Prevent parent selection from selecting children in ancestors mode (#14750) (28f9630)
  • combobox: Warn only about clearDisabled in development builds (#15242) (c4cea44)
  • components: Harden sortable touch drag ghost lifecycle (#14717) (1849698)
  • components: Use layoutViewport boundary for floating-ui positioning (#14809) (1570842)
  • date-picker, date-picker-day, date-picker-month: Enable arrow navigation with NVDA (#15304) (b42ed41)
  • date-picker: Clear date when value is unset (#14796) (1bb7680)
  • date-picker: Preserve selected month for same-day ranges (#15291) (38e0094)
  • date-picker: Set appropriate scale for month header actions (#13922) (48d2099)
  • date-picker: Show adjacent-month days in single-calendar range (#14111) (36922b5)
  • date-picker: Update calendar when activeDate is set in range (#14527) (7de0b06)
  • date-picker: Update selected day text color fallback (#14470) (75bf589)
  • date-picker: Update the calendar view when a programmatic range value follows a manual selection (#15153) (348ae19)
  • dropdown: Auto-close when another dropdown opens (#14997) (376638d)
  • dropdown: Avoid scrollbar when max-items matches item count (#14985) (e94e161)
  • dropdown: Fix virtual element positioning on first render (#14518) (dc75b7e)
  • dropdown: Focus the first item when opening instead of the first selected item (#14131) (197aefc)
  • dropdown: Keep focus on trigger with single-component keyboard navigation (#14079) (d308547)
  • dropdown: Sync virtual-focus aria relationships across trigger and groups (#14924) (15db207)
  • filter: Do not cancel Escape when value is empty (#13975) (6f36776)
  • flow-item: Support overriding collapse message (#14305) (8836712)
  • flow: Track only top-level slotted items and harden custom selector fallback (#14880) (be7614b)
  • Handle Escape in expected order with focus-trapping and non-focus-trapping hierarchies (#14313) (b832222)
  • icon: Ensure icon names match documented names (#14927) (f2fbe71)
  • icon: Fix icon type (#14889) (f581cc3)
  • icon: Fix resolution of number-suffixed icons (#14711) (6e3d87b)
  • input-date-picker: Bump focus-trap to pick up shadow DOM focus-handling fix (#14381) (4a068c2)
  • input-date-picker: Honor minAsDate & maxAsDate properties when set (#14375) (8bd57bd)
  • input-date-picker: Make vertical dropdown toggle not visible in readOnly mode (#15106) (8c6a427)
  • input-date-picker: Remove redundant border in vertical layout when range enabled (#14576) (95c5ba7)
  • input-number, input-text: Apply placeholder text color token (#14595) (78a284e)
  • input-number, input: Unable to enter decimals with inline-edit defined (#15372) (bf2c5f0)
  • input-text: Restore focus when it is the first invalid element on form submit (#14086) (ac8f0db)
  • input-time-picker: Ensure time part input placement aligns with page direction (#14901) (46635d5)
  • input-time-picker: Keep time picker parts within bounds when narrow (#15297) (11117c0)
  • input-time-zone: Ensure item labels update on locale/reference date change (#14365) (dc0b91e)
  • input, input-number, input-text: When inline-edit is defined, editing places cursor at beginning of existing value (#15396) (cc165ae)
  • input, input-number, input-text: When inline-editing is initially set, canceling clears the initial value (#15392) (a847008)
  • input, input-number: Fix handling of input for locales with same group and decimal separators (#14112) (2dae3be)
  • input: Fix file selection validation for input[type=file] (#14569) (6eaed05)
  • input: Remove Microsoft Edge type="password" reveal icon (#15038) (deac24e)
  • label: Set default layout to block (#15037) (76a6a43)
  • link, alert, notice: Slotted link display value (#14310) (3041297)
  • link: Display underline properly when text breaks to multiple lines (#13784) (ab5840a)
  • link: Prevent redirect on empty href (#14318) (c2bb69b)
  • list-item: Only emit internal change event when metadata values differ (#14580) (a2a51ab)
  • list: Ensure filter input displays over sticky headers (#14469) (65d7f38)
  • list: Fix nested list-item property inheritance in calcite-list (#14344) (ea798c8)
  • list: Preserve filter input value across rerenders before debounce sync (#14453) (376234c)
  • list: Preserve filter input value during rapid item loading (#14523) (05a9eea)
  • list: Refresh filter item data when list item and group properties change (#14442) (d9b4e0d)
  • list: Remove interactive states for interaction-mode=static (#14433) (fc9b45f)
  • list: Reset sticky heading offset when filter is disabled (#14505) (97ee4c8)
  • menu-item: Adjust href arrow (#15391) (8311980)
  • menu-item: Fix item layout (#15060) (44f17aa)
  • menu-item: Fix scales and padding (#15303) (971cf72)
  • meter: Update border color (#14167) (573aaf9)
  • navigation-logo, navigation-user: Remove transitions (#15013) (28a1ec6)
  • Omit aria-busy when false (#15142) (c27a51e)
  • Only initialize useSortable if dragEnabled is true (#14261) (48aac6e)
  • pagination: Ignore truncation indicators in screen readers (#14677) (629ebb4)
  • popover, tooltip: Correctly assign aria properties (#14098) (30b7d23)
  • popover: Implement missing extraContainers parameter on updateFocusTrapElements() (#13940) (f86bab8)
  • popover: Omit aria-expanded for disabled triggers (#15141) (3a0f4ab)
  • radio-button-group: Sync group disabled only when set (#15084) (ca6c3ad)
  • radio-button: Display validation message and invalid border color (#14465) (8c2ed0d)
  • rating: Fix block size to not encroach on neighboring elements (#14709) (0c7291f)
  • select: Match chevron alignment to combobox (#14411) (e86cd3d)
  • sheet, shell-panel: Fix mouse resizing when direction is changed dynamically (#14279) (bf713a5)
  • sheet: Close on Escape when focus trapping is disabled (#15061) (f8086d5)
  • sheet: Restore shadow (#14439) (718d293)
  • shell-panel: Clamp resizable max size to account for action bars, sibling components, borders, float-all spacing (#14787) (626db9f)
  • shell-panel: Enable resizing on mobile/touch screens (#14773) (074df8f)
  • shell-panel: Reset resize state when layout changes (#14364) (00dc777)
  • shell-panel: Update resize-handling logic when layout is updated dynamically (#14306) (06fa373)
  • slider: Consider dir when displaying formatted values with negative sign (#15270) (4299d22)
  • slider: Honor numbering-system negative sign direction (#15164) (cef4e90)
  • slider: Prevent width collapse in flex containers (#15388) (b0b2ac7)
  • stepper, stepper-item: Fix box sizing to prevent scrollbar from being displayed (#14018) (86d7ed0)
  • stepper: Fix updating items when component is used within a shadow dom and items are slotted (#14021) (bc7a74a)
  • stepper: Only stepper content should expand to available height (#14001) (4e27c10)
  • swatch: Preserve layout when slotted in button (#15177) (1e726c0)
  • switch: Remove double focus ring in certain browsers (#14156) (7176ed0)
  • switch: Update styles to work in high contrast mode (#15262) (f3d4ce6)
  • tab-nav: Do not prevent vertical page scrolling when tab titles do not overflow (#15158) (aa35cf5)
  • tab-nav: Keep navigation chevron actions up to date (#15025) (5972aa3)
  • tabs: Ensure tabs and titles are loaded before syncing ARIA state (#14493) (462d153)
  • text-area: Prevent repeated textarea height growth (#14841) (e8110a0)
  • text-area: Use correct corner-radius fallback (#15259) (ecef5f3)
  • tile: Preserve native Enter behavior for href tiles (#15160) (bda7b6a)
  • tile: Restore top/bottom slot spacing (#15101) (5b6785b)
  • tree-item: Ensure content grows to full height when expanded (#14308) (4fd6aba)
  • tree-item: Restore selection icon to bullet when selection-mode='single'|'single-persist'|'children' (b0d28f4)
  • tree-item: Smooth out expanding items transition (#13712) (f00f58c)
  • tree: Fix content clipping (#14262) (b95ec84)
  • tree: Only emit calciteTreeSelect when selection changes (#15051) (878cb28)
  • tree: Restore lines containment (#14251) (6c983f3)
  • tree: Restore tabbing through items (#14441) (637ce35)
  • Use fully specified calcite-design-tokens imports (#14995) (a17ec53)
  • useForm: Ignore disabled components when updating validity (#14400) (b936cda)
  • useForm: Update validity when disabled (#14549) (7117063)
  • useSortable: Fix DragDetail typings (#14223) (5e26124)

Deprecations

  • accordion, accordion-item, block-section: Deprecate component (1bef6ef)
  • action-bar: Overflow-actions-disabled (b38edeb)
  • block: Deprecate [before]Open/Close events (#15373) (c269b7f)
  • block: Deprecate collapsible-icon-color tokens (e8eaf0a)
  • dom: Deprecate hasVisibleContent utility (#14380) (d8cdb26)
  • dropdown: Deprecate hover type (#15331) (3434d53)
  • inline-editable: Deprecate component (99fd01a)
  • segmented-control: Deprecate appearance property (#15265) (be19a7b)
  • type-variables: Deprecate unmaintained type variables (#14121) (d7ec14f)

Compatibility

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

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

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.