5.0.0

Design System [5.0.0]

🚨 Breaking changes

• Removed previously deprecated props (props with long-standing deprecation warnings) (#2168)

  
  

  • Button
  • Choice
  • ChoiceList
  • Dialog
  • HelpDrawer
  • StepList
  • Table
• Refactored the `Dialog` component to use the new HTML <dialog> element (#2175)

  
  

  We are no longer using the react-aria-modal library under the hood, which means we've removed props that were specific to that implementation.

  Props that were added: backdropClickExists, id, and all valid attributes of the <dialog> element

  Props that were removed:

  • applicationNode
  • dialogClass
  • dialogId
  • dialogStyle
  • escapeExits
  • focusDialog
  • focusTrapOptions
  • focusTrapPaused
  • includeDefaultStyles
  • initialFocus
  • mounted
  • scrollDisabled
  • titleId,
  • titleText
  • underlayClass
  • underlayClickExits
  • underlayColor
  • underlayStyle
  • verticallyCenter

• Changed desktop layout of the StepList component to match the mobile layout in order to improve screen-reader experience (#2254, #2260)

💅 Changed

• Refactored HelpDrawer analytics (#2144)
• Converted Alert from class-based to functional component (#2145)
• Removed unneeded Alert analytics (#2164)
• Removed max-height and y-overflow for Accordion (#2177)
• Updated Choice wrapper max width to use the measure-wide token variable instead of form__max-width (#2208)

🛠 Fixed

• Updated Choice component to allow pass-through of aria-live, aria-relevant and aria-atomic props so they can be overridden (#2191)
• Added box-sizing rule to address small checkbox icon bug (#2198)
• Removed focus on Drawer heading text (#2200)
• Removed padding from clear button in Autocomplete (#2063)
• Fixed underline on ghost variation anchor buttons (#2209)
• Fixed Tooltip not dismissing when focus moves (#2228)
• Upgraded focus-trap-react and its use in Tooltip to resolve React peer-dependency errors (#2210)
• Improved the screen-reader experience for FilterChip (#2241)
• Fixed error readout for form fields (#2245)

📦 Internal

List of internal changes

• Reinstated visual regression tests (#2155)
• Added full-page visual regression tests (#2219)
• Implemented forced-color-mode checks in visual regression testing (#2166)
• Updated unit tests to use React Testing Library (RTL) (#2064, #2072, #2086, #2089, #2087, #2094, #2097, #2095, #2100, #2101, #2113, #2130, #2134, #2140 )
• Updated accessibility tests (#2053)
• Updated repo PR template (#2054, #2096)
• Removed commands to build child documentation sites (#2057)
• Removed leftover scanDependents dependencies (#2060)
• Cleaned up linting rules and delinted code (#2071, #2148, #2181, #2216)
• Fixed demoDeploy script and converted to Typescript (#2077)
• Moved test configs out of the design-system-scripts package (#2111)
• Removed tsconfig settings, no longer needed (#2143)
• Fixed yarn test script and lock file (#2156)
• Made checking for visual regressions a mandatory part of PR process (#2157)
• Updated deploy-docs with new subcommands (#2173)
• Fixed broken link in release process README (#2171)
• Consolidated and cleaned up build-system code and removed the design-system-scripts package (#2188)
• Added yarn clean npm script (#2211)
• Removed documentation about a loki-runner error in README (#2220)
• Updated the example projects and removed nonessential ones (#2221)
• Removed the old design-system-docs package with all its content (#2053)
• Reorganized doc-site folder structure (#2159)

Healthcare.gov Design System [9.0.0]

All changes from the core design system and...

🚀 Added

• Added one-column page to documentation (#2135)

💅 Changed

• Converted unit tests to use React Testing Library (RTL) (#2147)

Medicare.gov Design System [7.0.0]

All changes from the core design system and...

🚨 Breaking changes

• Removed deprecated GlobalHeader, Navbar, and NavigationMenu components (#2202, #2212)

💅 Changed

• Updated typography styles to use tokens (#2079)

🛠 Fixed

• Fixed failing build by exporting the Medicare.gov logo (#2065)

Updated dependencies

• Upgraded to React 17 (#2176)
• Upgraded focus-trap-react (#2210)
• Upgraded Storybook to 6.5.12 (#2217)

Documentation site

🚀 Added

• Added a component-maturity checklist to all component pages (#2165, #2174, #2179, #2205, #2213, #2230)
• Created COMPONENT_MATURITY.md (#2193, #2201)
• Added on-dark stories for typography (#2222)
• Added documentation for pass-through props (the extra props that are passed down to underlying HTML elements) (#2237)
• Added accessibility guidance for Healthcare.gov Alert (#2246)
• Added Medicare.gov-specific Button guidance (#2252)
• Added more guidance on the form-validation pattern (#2250)

💅 Changed

• Updated margin and padding examples (#2178)
• Added typography Stories to support visual regression testing (#2093, #2204)
• Removed light/dark backgrounds from Storybook, update breakpoints to match DS breakpoints (#2194)
• Rewrote the developer getting-started docs and consolidated them into a single page (#2239)

🛠 Fixed

• Fixed contact link pointing to old feedback route in table of contents (#2080)
• Fixed color swatch hex values not syncing with theme (#2170)
• Added missing image file and alt text (#2227)
• Updated background color in Storybook to reflect theme color (#2132)
• Fixed errors rendering in Storybook (#2169)
• Improved controls and action logging in Storybook (#2195)

---

Sketch UI Toolkits

Built with Sketch version 93

🚨 Breaking changes for all UI kits

• Updated alert symbol to be a single alert symbol with overrides to change styling and icons for the alert and fixed alert to adapt to small screens without overlapping text

Design System Sketch UI Toolkit (Core) [3.0.0]

• Added spinner symbol and is using color variables (tokens) and layer styles
• Updated typography to use color variables (tokens)

Healthcare.gov Design System Sketch UI Toolkit [3.0.0]

• Added spinner symbol and is using color variables (tokens) and layer styles
• Updated typography to use color variables (tokens)
• Updated help drawer footer color to use color-secondary-lightest
• Added single column layout template for 320px, 1024px and 1280px breakpoints
• Updated the Radio symbol for light and dark to adapt responsively without overlapping text.

Medicare.gov Design System Sketch UI Toolkit [3.0.0]

• Added spinner symbol and is using color variables (tokens) and layer styles
• Fixed the radio button layer styles for Medicare to ensure the design is matching code

5.0.0-beta.1

See Release 5.0.0 notes.

4.0.5

Design System [4.0.5]

• No changes

Healthcare.gov Design System [8.0.5]

• No changes

Medicare.gov Design System [6.0.5]

Changed:

• Updated 'Using this site' link to : https://www.medicare.gov/about-us/using-this-site (#2180)

@cmsgov/ds-healthcare-gov 7.8.1

Healthcare.gov Design System [7.8.1]

💅 Changed

• Updated focus color and hover/active link/button text color to match version 8.0 for Open Enrollment season (#2172). Color variables that changed:
  • focus-dark
  • primary-darker
  • primary-darkest
  • primary-alt-dark
  • primary-alt-darkest
  • primary-alt-light
  • primary-alt-lightest
  • secondary-dark
  • secondary-darker
  • secondary-darkest
  • secondary-light
  • secondary-lighter
  • secondary-lightest
    

4.0.4

Design System [4.0.4]

• No changes

Healthcare.gov Design System [8.0.4]

🛠 Fixed

• Added isMenuOpen and onMenuToggle props to Header to allow for fully controlled operation of the Header state. (#2153)

Medicare.gov Design System [6.0.4]

• No changes

4.0.3

Design System [4.0.3]

🛠 Fixed

• Duplicate HelpDrawer analytics event name, added Story for testing (#2114)
• StepList Axe accessibility errors (#2109)
• Axe accessibility error cleanup for Drawer, HelpDrawer, Pagination (#2120)
• Added z-index style to Drawer component (#2128)
• Color of text in Buttons using anchor tags when receiving keyboard focus (#2127)
• Color of text in Buttons using anchor tags when embedded in Alerts (#2129)

📦 Internal

• Reorganize typography and layout grid examples in Storybook (#2112)
• Update update-snapshots script (#2109)
• Update Axe dependency (#2120)

Documentation site

💅 Changed

• Headings page content (#2103)
• Moved Phone Number pattern guidance to its own page (#2118)
• References from master branch to main branch through documentation (#2124)
• Badge and Alert content has been updated (#2125)
• Added a fallback for missing background colors on variables without a fill utility (#2122)
• Privacy Settings button style in documentation site footer (#2104)
• Color swatches not updating when theme is changed (#2117)

Healthcare.gov Design System [8.0.3]

All changes from the core design system.

Medicare.gov Design System [6.0.3]

All changes from the core design system.

4.0.2

Design System [4.0.2]

🛠️  Fixed

• Fix Drawer close button showing white text on white background on hover (#2098)
• Fix cmsds-migrate script failing in dependent projects (#2099)
• Fix cmsds-migrate script naming"ghost" buttons "link" buttons (#2102)

📦 Internal

• Updates to the documentation site (#2091)

Healthcare.gov Design System [8.0.2]

All changes from the core design system

Medicare.gov Design System [6.0.2]

All changes from the core design system and...

🛠️  Fixed

• Fix medicare-default icons for Dialog and HelpDrawerToggle, and export the IconCircleIconOutline (#2092)

4.0.1

Design System [4.0.1]

🛠️  Fixed

• Reduced number of nav elements in VerticalNav to one, which is better for screen readers (#1854)
• Remove role="banner" from Dialog. Dialogs already have an accessibility role (#2062)
• Fix a style override for Medicare that referenced an obsolete button class, which made it ineffective (#2074)

📦 Internal

• Updates to the documentation site (#2029, #2045, #2047, #2049, #2051, #2052, #2061, #2067, #2070, #2073, #2074, #2076, #2078)

Healthcare.gov Design System [8.0.1]

All changes from the core design system and...

🛠️  Fixed

• Reduced number of nav elements in Header and made sure each navigation landmark is unique, which is better for screen readers (#1854)

Medicare.gov Design System [6.0.1]

All changes from the core design system

4.0.0

Design System [4.0.0]

🚨 Breaking changes

• Button architecture changes (#2012) 
   - The variation prop accepted values are now solid & ghost. "Danger" & "Success" buttons have been removed and are no longer supported
   - inversed prop is no longer valid. Instead use onDark prop.

See the migration guide page for more details on what changes occurred and how to update your application.

We have also provided a migration script to help make these updates. See documentation on how to use the script here.

🚀 Added

• Token updates to add white & black alpha tokens (#1968)

💅 Changed

• The following token values were updated for core (#1950)
   - primary-alt-lightest
• Updated Tooltip component to add state styling to tooltip trigger. These styles were originally based on the activeClassName prop and now also use psuedo elements. (#1922)

🛠️  Fixed

• Updated invalid markup in UsaBanner component (#2011)

📦 Internal

• Updated internal scanDependents script
   - Made compatible with node 16 (#1955)
   - Expanded functionality to scan through a subset of repos & search for specific dependencies (#1966) 
• Visual regression test updates to account for consolidated Storybook instance (#1972)
• Updated release scripts so Lerna version bumps use exact versions of the core DS as child DS dependencies (#1995)
• Additional Storybook stories were added to demonstrate grid examples (#1997) 
• Consolidated Storybook from three instances to one instance with a theme switcher (#1948)
  
• Added theme switcher to documentation site so the documentation and variations for different brands can be seen in one location (#1948)
  

Healthcare.gov Design System [8.0.0]

All changes from the core design system and...

🚨 Breaking changes

• As part of button architecture work in v8.0.0, the value of secondary is no longer accepted for the <Button> component's variation prop (#2025)
• Button architecture changes (#2012) 
   - The variation prop accepted values are now solid & ghost. "Danger" & "Success" buttons have been removed and are no longer supported
   - inversed prop is no longer valid. Instead use onDark prop.

See the migration guide page for more details on what changes occurred and how to update your application.

We have also provided a migration script to help make these updates. See documentation on how to use the script here.

💅 Changed

• The following token values were updated for healthcare (#1950)
   - focus-dark
   - primary-darker
   - primary-darkest
   - primary-alt-dark
   - primary-alt-darkest
   - primary-alt-light
   - primary-alt-lightest
   - secondary-dark
   - secondary-darker
   - secondary-darkest
   - secondary-light
   - secondary-lighter
   - secondary-lightest
   

Medicare.gov Design System [6.0.0]

All changes from the core design system and...

🚨 Breaking changes

• Button architecture changes (#2012) 
   - The variation prop accepted values are now solid & ghost. "Danger" & "Success" buttons have been removed and are no longer supported
   - inversed prop is no longer valid. Instead use onDark prop.

See the migration guide page for more details on what changes occurred and how to update your application.

We have also provided a migration script to help make these updates. See documentation on how to use the script here.

💅 Changed

• The following token values were updated for medicare (#1950)
   - primary-dark
   - primary-darker
   - primary-darkest
   - primary-alt-dark
   - primary-alt-darker
   - primary-alt-darkest
   - primary-alt-light
   - primary-alt-lightest
   - secondary-dark
   - secondary-darker
   - secondary-darkest
   - secondary-light
   - secondary-lightest

🤖 Updated dependencies

• Bump file-type from 16.5.3 to 16.5.4 (#1991)
• Bump moment from 2.29.2 to 2.29.4 (#1947)

---

Sketch UI Toolkits

Built with Sketch version 89

🚨 Breaking changes for all UI kits : Button architecture changes

• New button architecture uses solid, outline and ghost button naming
• Each button type has a main and alternate color variation
• Each button type has an on light and on dark variation
• Deprecated buttons: primary, secondary tertiary, success, inverse
• See the migration guide for more details

Design System Sketch UI Toolkit (Core) [2.0.0]

• Added tints to icons
• Mapped layer styles to theme tokens

Healthcare.gov Design System Sketch UI Toolkit [2.0.0]

All changes from the core design system and...

• Removed header and logo symbols not being used in the Design System.

Medicare.gov Design System Sketch UI Toolkit [2.0.0]

All changes from the core design system and...

• Added Help drawer component symbol

4.0.0-beta.3

Healthcare.gov Design System [8.0.0-beta.3]

🚨 Breaking changes

• As part of button architecture work in v8.0.0-beta.2, the value of secondary is no longer accepted for the <Button> component's variation prop (#2025)