The latest additions, improvements, and fixes to the design system.

February 20, 2025 (2.252.0)

  • New optional moreButtonMenuClassName property for HeaderCommandBar.
  • New optional menuClassName property for ResizeGroup.

January 24, 2025 (2.251.0)

  • New optional iconWrapperClass prop for WorkItemTypeIcon
  • Improvements to drag operation for List component

January 7, 2025 (2.250.0)

  • Improvements to column resize behavior
  • New optional principalName property for Coin component.
  • Various accessibility improvements to the design system website.

October 22, 2024 (2.246.0)

  • Added an optional property onFocus to the Tabs component.

September 27, 2024 (2.245.0)

  • Added an optional ariaDescrbedBy property to Dropdown and DropdownExpandable.
  • Added an optional property ariaLabelledBy in List component.

August 27, 2024 (2.244.0)

  • Added an optional property ariaLabelledBy in Link component.
  • Added an optional property ariaDescribedBy in toggle component.

June 28, 2024 (2.241.1)

  • Added more support to use new imageUrlResolver within IdentityPicker components
  • Added optional prop imageUrlResolver to CustomIdentityPickerDropdown, SharedIdentityPicker, and IdentityPickerSuggestionsList

June 6, 2024 (2.240.0)

  • Added an optional on load callback prop for Image and Coin components
  • Added an optional image URL resolver prop for Personas in the IdentityCard
  • Added an optional aria label prop for the suggestions container in the IdentityPickerDropdown

May 28, 2024 (2.239.0)

  • Added a prop to set container class in editable dropdown.
  • Added an optional role prop to MessageCard and MessageBar.
  • Added a prop for optional callback on image load in VssPersona.
  • The mapping between predefined VssPersonaSize classes and pixel values is now public.

April 30, 2024 (2.238.0)

  • Fixed duplicative announcements when filtering in dropdown
  • Fixed dropdown selected filter item from clearing on reload or navigating between pages
  • Updated FormItem required field text to be visible only to screen readers
  • Fixed DropdownList component styling
  • Added ability to use aria-current in Tree component

April 15, 2024 (2.237.0)

  • Fix auto-scrolling bug in LogViewer
  • Added Fingerprint icon

March 21, 2024 (2.236.0)

  • Fixed an issue in Dropdown with Windows High Contrast mode
  • Adds a prop to set the aria-label of the suggestions container in TagPicker and IdentityPicker
  • Adds a prop to GroupedItemProvider to omit dividers
  • Adds a prop to set the maximum suggestion count in IdentityPicker
  • Better clarified required fields in FormItem
  • Width calculation fixes to Splitter component
  • Addition of a few utility functions to facilitate string manipulation

March 1, 2024 (2.235.0)

  • Fixed issues with DropdownList cell markup.
  • Added the ability to set a custom aria-role for the Dropdown, Persona, and ExpandableTextField components.
  • Added the ability to set a custom aria-label for the TextFilterBarItem.
  • Added an optional prop to Portal to bypass a default action of returning focus to the previously active element when the Portal is unmounted.
  • Added a prop to Pill to specify an explicit tab index.
  • Introduced a new substring helper which takes surrogate characters into consideration.

February 5, 2024 (2.234.0)

  • Links are now underlined by default due to accessibility requirements. To remove the underline, pass in the removeUnderline prop.
  • A new component, DropdownList, is now available. Markup-wise, it represents a list vs the ListBox's table.
  • We've improved the keyboard interaction with the Table's column sizers and reduced verbosity for screen reader users.

May 26, 2023 (2.167.72)

  • Removed ResponsiveLayout from the list of utilities as it is mainly to be a base component for ResizeGroup. It is still available, but we encourage you to use ResizeGroup for this purpose as it maintains the items hidden in an accessible way.
  • Various fixes for accessibility on the design system website and inner components.

February 14, 2023 (2.167.60)

Updated inner dependencies

January 3, 2023 (2.167.53)

  • Updated inner dependencies
  • Fixed issue with link to button commponent.

December 6, 2022 (2.167.52)

Removed erroneous dependencies and updated workflow for Webpack 5

November 8, 2021 (2.167.22)

Breaking change The Observer component now has stricter typechecking for its children. In particular, it now only accepts a function child, and not a component child. There is now a UncheckedObserver component in VSSUI/Observer that preserves the old, un-typechecked behavior.

January 17, 2020 (2.164.0)

Breaking change

Global CSS styles were moved out of Core/core.css and into an Core/overrides.css file. The global overrides are no longer included by components by default. So sites that relied on these styles will need to import azure-devops-ui/Core/override.css on thier pages. Azure DevOps extensions should generally import this in order to get the same look and feel as Azure DevOps pages.

import "azure-devops-ui/Core/override.css";

The styles in override.css include things like styling the body tag with the font family and size used by Azure DevOps pages, and styling all a (anchor) tags with color: inherit. These global styles made it difficult to use azure-devops-ui components within some web sites.

Improvements and updates

  • Accessibility improvements

Fixed

  • Components did not previously respond well to users changing their browser's font-size preference.

November 13, 2019 (1.160.3)

Improvements and updates

  • Updated tabs component docs
  • Accessibility improvements
  • Added “apply mode” to filter component

Fixed

November 6, 2019 (1.160.1 and 1.160.2)

Improvements and updates

  • New icons added to icon set
  • Added expand/collapse button to splitter component
  • Accessibility improvements

Fixed

  • Fixed spacing in expandable card

October 28, 2019 (1.160.0)

Improvements and updates

  • Updated design system name
  • Updated illustrations on homepage
  • Added props to card to allow collapsing
  • Further accessibility improvements

October 14, 2019 (1.159.0)

Improvements and updates

  • Accessibility fixes and improvements
  • Updated filter component docs

October 3, 2019 (1.158.2)

Improvements and updates

  • Accessibility fixes and improvements

September 23, 2019 (1.158.0 and 158.1)

New

Improvements and updates

Fixes

September 8, 2019 (1.157.0)

Improvements and updates

  • More accessibility improvements on several components including dropdown and editable dropdown
  • Added justification prop to table columns and ability to have sorting arrow to the left of the header (for right aligned columns)
  • Added new icons to the icon font

August 20, 2019 (1.156.1)

Improvements and updates

  • Responsive improvements for several components (header, tabs, filter, panel, dialog, card, message card, and table)
  • Added the generalized spacing for margin/padding for 4px/8px/16px values
  • Expose focus() method on HeaderCommandBar
  • Allow for custom tooltip in Persona / Coin
  • More accessibility improvements and fixes on a number of components

August 13, 2019 (1.156.0)

New

Improvements and updates

July 22, 2019 (1.155.0)

Improvements and updates

July 1, 2019 (1.154.0)

New

  • Responsive page header and navigation
  • Mobile/responsive updates

Improvements and updates

  • Updated dropdown examples and docs
  • Updated constants for responsive breakpoints
  • Updated message card line height and spacing
  • Accessibility improvements and fixes

June 25, 2019 (1.153.5)

Improvements and updates

June 21, 2019 (1.153.4)

Improvements and updates

  • Mobile improvements on the panel component
  • Continued to close accessibility bugs and improvements

June 20, 2019 (1.153.3)

New

  • Added page progress bar
  • Added mobile feature flag

Improvements and updates

  • Allowing text selection in lists and tables
  • Accessibility improvements
  • Mobile responsive nav bar
  • Updated panel docs
  • Added Microsoft, Yammer, and Dynamics365 logos to icon set
  • Added $spacing-24 variable

Fixes

June 10, 2019 (1.153.2)

Improvements and updates

  • Added disabled prop to dropdown
  • If text overflows in a menu item, it will now show a tooltip

June 6, 2019 (1.153.1)

Improvements and updates

  • Added support for observable tab names
  • Updated icon sizing logic
  • Updated text field docs

June 3, 2019 (1.153.0)

New

Improvements and updates

  • Improved dropdown component
  • More accessibility improvements on various components

May 24, 2019 (1.152.3)

Improvements and updates

  • Improved dialog docs
  • Continued accessibility improvements throughout

Fixes

  • Overflow button in header component is now in default style (instead of subtle)

May 17, 2019 (1.152.2)

Improvements and updates

  • Icon default font size is now 16 pixels

May 16, 2019 (1.152.1)

Improvements and updates

  • Continued accessibility improvements throughout

May 14, 2019 (1.152.0)

New

  • We now have an Azure DevOps subset for our icon font

Improvements and updates

Fixes

May 3, 2019 (1.151.5 / 1.151.6)

New

  • Added color documentation to the design basics section

Improvements and updates

Updated checkbox examples

April 26, 2019 (1.151.1)

New

Improvements and updates

  • Changed the buttonClassName prop to className in the dropdown component

April 20, 2019 (1.150.2)

New

  • Added icons and shell documentation to the design basics section

Improvements and updates

  • Now using bolt-table-card in table examples
  • Several accessibility improvements to the design system site, including: added alt values for images, focus and selected states, aria labels, and more
  • Added two icons to our set: “processing” and “add reaction”

April 12, 2019 (1.150.1)

Improvements and updates

April 2, 2019 (1.150.0)

March 12, 2019 (1.149.2)

  • Added support for reusable component classes (e.g. table styles)
  • Added common styles for reuse
  • Removed multi-select people picker sample, replacement coming with 1.150.0 release

February 16, 2019 (1.148.0)

January 25, 2019 (1.147.1)