[Snyk] Upgrade @uswds/uswds from 3.8.0 to 3.8.1

[lane-formio]

This PR was automatically created by Snyk using the credentials of a real user.


Snyk has created this PR to upgrade @uswds/uswds from 3.8.0 to 3.8.1.

ℹ️ Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project.

---

• The recommended version is 1 version ahead of your current version.

• The recommended version was released on 22 days ago.

Issues fixed by the recommended upgrade:

	Issue	Score	Exploit Maturity
	Template Injection SNYK-JS-DOMPURIFY-6474511	372	Proof of Concept

Release notes

Package name: @uswds/uswds

• 3.8.1 - 2024-05-31
  

  What's new in USWDS 3.8.1

  Bug fixes

  Package	A11Y	Breaking	Markup change	Description
  usa-button-group	—	—	—	Improved styles for nested button groups. Now, nested button groups should match the height of their parents. (#5885)
  usa-footer	—	—	—	Restored the usa-layout-grid dependency in the footer package and removed layout grid styles from the footer stylesheet. This update prevents visual regressions in footer and other components with layout grid utility classes in their markup. (#5930)
  usa-identifier	—	—	Yes	Fixed a bug that added the English word "An" to Spanish variants of the identifier component. This was accidentally added to our component preview templates because of a data error. (#5857)
  usa-in-page-navigation	—	—	—	Updated an outdated reference to the data-header-selector attribute in an in-page navigation JavaScript error message. The error message now correctly references the data-heading-elements attribute. (#5856)
  usa-input-mask	—	—	—	Fixed a bug that caused input mask to break when it is not a direct child of a form. Nested input masks will now initialize and work properly. Thanks @ chrislarrycarl! (#5518)
  usa-tooltip	Yes	—	—	Updated the behavior of the tooltip component to allow users to hover over tooltip content. This allows the component to meet the "hoverable" standard outlined in WCAG 1.4.13. (#5919)
  usa-tooltip	Yes	—	—	Updated tooltip component behavior to close active tooltips when the escape key is pressed. This allows the component to meet the "dismissible" standard outlined in WCAG 1.4.13. (#5909)
  usa-validation	Yes	—	—	Fixed a bug that caused non-interactive checklist items in the validation component to receive focus. Now, only the interactive input will receive focus. (#5835)
  uswds-utilities	—	—	—	Updated the code comments on utility Sass partials. These comments now reflect the correct utility class names and values. Thanks @ aduth! (#5859)

  Dependencies and security

  Dependency name	Previous version	New version
  @ 18f/identity-stylelint-config	2.0.0	4.0.0
  @ babel/core	7.23.6	7.24.5
  @ babel/preset-env	7.23.6	7.24.5
  @ types/node	20.10.4	20.12.11
  autoprefixer	10.4.16	10.4.19
  axe-core	4.8.2	4.9.1
  eslint	8.55.0	8.56.0
  eslint-plugin-import	2.29.0	2.29.1
  html-webpack-plugin	5.5.4	5.6.0
  mocha	10.2.0	10.4.0
  postcss	8.4.32	8.4.38
  postcss-discard-comments	6.0.0	6.0.2
  postcss-preset-env	9.3.0	9.5.11
  prettier	2.8.8	3.2.5
  sass	1.69.5	1.77.0
  sass-embedded	1.69.5	1.77.0
  snyk	1.1262.0	1.1291.0
  stylelint	15.11.0	16.5.0
  svgo	3.1.0	3.3.2
  typescript	5.3.3	5.4.5
  webpack	5.89.0	5.91.0

  Thanks @ anselmbradford for the dependency updates!

  0 vulnerabilities in regular dependencies (dependencies for USWDS projects installed with npm install @ uswds/uswds)
  13 moderate, 28 high vulnerabilities in devDependencies (development dependencies).

  Release TGZ SHA-256 hash: a86fa133b842ce28d1eed2226216c478debf31bf6c16ffcd96fecf061fdf4583

• 3.8.0 - 2024-03-11
  

  Features

  Package	A11y	Breaking	Markup change	Description
  usa-checkbox, uswds-core	-	-	-	Added styles for indeterminate checkboxes. Checkboxes will now display as indeterminate when you set input.indeterminate = true via JavaScript or add the data-indeterminate attribute. This is only a style addition and does not affect checkbox functionality. Thanks @ lpsinger! (#5713)
  usa-in-page-nav	-	-	-	Added the ability to customize which headings will be pulled into the in-page navigation link list. Use the optional data-heading-selector attribute to designate the heading levels that should be included in the component. By default, the component will pull all H2 and H3 headers. (#5444)
  usa-table, uswds-core	-	-	-	Added a sticky header variant to the table component. Use the new .usa-table--sticky-header class to enable sticky positioning on table headers. Use the new $theme-table-sticky-top-offset setting to set the value of the top offset for sticky table headers. (#5420) Thanks @ etanb!
  usa-table, uswds-core				Added the ability to customize the table background color at a theme level. Use the $theme-table-background-color setting to set your desired table background color. (#5420)
  usa-validation	-	-	-	Added textarea support to the validation component. (#5233) Thanks @ danbrady!
  usa-layout-docs, uswds-core	Yes	Yes	Yes	Added $theme-sidenav-reorder for documentation page sidenav. Use $theme-sidenav-reorder to support old CSS order functionality. This setting can introduce usability issues, so we suggest that teams update their sidenav markup instead. (#5807)

  Bug fixes

  Package	A11y	Breaking	Markup change	Description
  usa-button, uswds-core	-	-	-	Improved the vertical alignment of usa-icon elements inside of usa-button. Use the new $theme-button-icon-gap setting to set the width of the horizontal gap between the button's text and icon. (#5398)
  usa-button, usa-checkbox, usa-combo-box, usa-file-input, usa-radio, uswds-core	Yes	-	-	Added automated color contrast checks for disabled tokens. On compilation, USWDS will test disabled element color contrast and provide a fallback color if minimum contrast is not met. If the fallback also fails to meet minimum contrast requirements, the system will provide a warning in the terminal. (#5455)
  usa-button-group	-	-	-	Improved the appearance of button groups when button text wraps to multiple lines. Now, every button in the group will be the same height. (#5657) Thanks @ aduth!
  usa-date-picker	Yes	-	-	Added focus styles to the calendar button in high contrast mode. Now, the calendar icon changes to the highlight high contrast token on focus. (#5701)
  usa-footer	-	-	-	Fixed a bug that caused some grid utility classes to be ignored when used inside usa-footer. (#5675)
  usa-layout-docs, uswds-core	Yes	Yes	Yes	Updated the order of the side navigation markup on the documentation page template. Now, the HTML order of the page matches the visual order at narrow screen widths. (#5794)
  usa-table	Yes	-	Yes	Simplified the structure of the scrollable table component example. This removes some accessibility errors related to incomplete table markup. (#5783)

  Breaking changes

  Documentation page template

  We're updating the documentation template to better match the HTML order of the side navigation to the visual order at mobile widths. Before USWDS 3.8.0 we used CSS to re-order the sidenav at mobile widths, placing it below the page's main text content. Starting with USWDS 3.8.0, our default styles no longer use CSS to re-order the side navigation. Now, we suggest including a duplicate sidenav after the main text content, using utility classes to hide/show the sidenavs at the proper widths. The example below shows a before/after.

  <div class="grid-container">
    <div class="grid-row grid-gap">
  -   <div class="usa-layout-docs__sidenav">
  +   <!-- One of two sidenav's only shown in desktop breakpoints. --> 
  +   <div class="usa-layout-docs__sidenav display-none desktop:display-block desktop:grid-col-3">
        {{ SIDENAV_MARKUP }}
      </div>
  -   <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content">
  +   <main class="desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content">
        {{ MAIN_CONTENT }}
      </main>
    </div>
  + <!-- New duplicate section only shown on mobile. -->
  +  <div class="usa-layout-docs__sidenav desktop:display-none">
  +    {{ SIDENAV_MARKUP }}
  +  </div>
  </div>

  Teams that wish to maintain the old CSS order functionality can temporarily add $theme-sidenav-reorder: true to their project settings. This setting reinstates the CSS re-ordering. As we mentioned, this setting can introduce usability issues, so the best long-term solution is to update the sidenav markup instead.

  Dependencies and security

  Dependency name	Previous version	New version
  @ babel/core	7.23.2	7.23.6
  @ babel/preset-env	7.23.2	7.23.6
  @ types/node	20.8.9	20.10.4
  eslint	8.52.0	8.55.0
  eslint-config-prettier	9.0.0	9.1.0
  gulp-mocha	8.0.0	9.0.0
  handlebars-helpers	0.10.0	--
  html-webpack-plugin	5.5.3	5.5.4
  postcss	8.4.31	8.4.32
  postcss-import	--	15.1.0
  postcss-preset-env	9.2.0	9.3.0
  postcss-sass-loader	1.1.0	--
  resolve-url-loader	4.0.0	5.0.0
  sass	--	1.69.5
  snyk	1.1237.0	1.1262.0
  svgo	3.0.2	3.1.0
  typescript	5.2.2	5.3.3

  0 vulnerabilities in regular dependencies (dependencies for USWDS projects installed with npm install @ uswds/uswds)
  15 moderate, 25 high vulnerabilities in devDependencies (development dependencies).

  Release TGZ SHA-256 hash: 072f0f8333b1aa000183e00676616d9ff5a174e27ca8d35c130ca70ea5d4f66d

from @uswds/uswds GitHub release notes

---

Important

• Check the changes in this PR to ensure they won't cause issues with your project.
• This PR was automatically created by Snyk using the credentials of a real user.
• Max score is 1000. Note that the real score may have changed since the PR was raised.

---

Note: You are seeing this because you or someone else with access to this repository has authorized Snyk to open upgrade PRs.

For more information:

• 🧐 View latest project report
• 📜 Customise PR templates
• 🛠 Adjust upgrade PR settings
• 🔕 Ignore this dependency or unsubscribe from future upgrade PRs