refactor(Dropdown): ariaLabel to aria-label (#13272)

* refactor(Dropdown): ariaLabel to aria-label

* fix(menu): fix arrow key navigation when onClose is called but not closed (#13195)

* fix(menu): only clear registered items when root is closing

* fix(menu): auto-cleanup registered items

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(theme): add $icon-interactive token (#13219)

* feat(theme): add $icon-interactive token

* Update packages/themes/src/tokens/v11TokenGroup.js

Co-authored-by: Alison Joseph <[email protected]>

* Update packages/themes/src/tokens/__tests__/metadata-test.js

Co-authored-by: Alison Joseph <[email protected]>

* Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap

* Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap

* chore(snapshot): update snapshots

---------

Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* feat(TextInput): add typescript types (#13142)

* feat(TextInput): add typescript types

* fix(Text Input): submcompnent workaround + add helperID prop

* chore(format): format `Popover`, `Listbox` files (#13284)

* chore(format): format Popover file

* chore(format): format ListBox files

* chore(format): update format command

* chore(release): v11.24.0 (#13282)

Co-authored-by: tay1orjones <[email protected]>

* fix(toggle): make props.labelText optional (#13196)

* fix(toggle): make props.labelText optional

* docs(toggle): add 'with accessible labels' story

* test(toggle): update public api snapshot

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(ListBox): a11y - move filter tag as sibling of menu trigger, esc key improvements (#13173)

* fix(MultiSelect): a11y - move filter tag as sibling of menu trigger

* fix(Multiselect): remove tag from tab order

* fix(FilterableMultiselect): remove clear, tag from tab order

* fix(ComboBox): retain input value when menu is open and esc is pressed

* fix(FilterableMultiSelect): a few more UX tweaks

* style(MultiSelect): update styles to fix invalid issues when focused

* style(FluidMultiselect): adjust focus styles when invalid

* chore(log): remove console log

---------

Co-authored-by: Andrea N. Cardona <[email protected]>

* docs(style): add section on authoring inline styles (#13289)

* docs(style): add section on authoring inline styles

* docs(style): rephrase inline style docs

* docs(style): typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(ComboBox): ariaLabel to aria-label (#13273)

* refactor(ComboBox): ariaLabel to aria-label

* fix: formatting

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: Andrea N. Cardona <[email protected]>

* fix(tabs): remove max-width (#13247)

* fix(tabs): remove max-width

* docs(tabs): add max width guidance

* docs(tabs): format

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(ListBox): Standardize `ListBox` menu open behavior (#13268)

* style(MultiSelect): update styles to fix invalid issues when focused

* style(FluidMultiselect): adjust focus styles when invalid

* chore(log): remove console log

* fix(ListBox): align open behaviors across ListBox components

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* Add Typescript annotations to Select, SelectItem and SelectItemGroup (#13235)

* refactor(typescript): type annotations on Select*

Add Typescript annotations to Select, SelectItem and SelectItemGroup.

* fix(lint): removed unused imports

Left SelectItem and SelectItemGroup in the imports after using them for
testing. Removed.

* fix(Select-test): update label to labelText

Previously removed label as it was not a property of Select.
On recommendation of maintainers reintroduced using labelText.

* Apply suggestions from code review

Co-authored-by: Andrea N. Cardona <[email protected]>

* Follow up to change suggestions

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(FilterableMultiSelect): ariaLabel to aria-label (#13276)

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>

* fix(SkeletonText): prevent negative px width values (#13270)

Co-authored-by: Alessandra Davila <[email protected]>

* feat(Popover): add `isTabTip` prop to `Popover` (#13283)

* feat(tabTipPopover): add tabTip to Popover

* feat(tabTipPopover): add tab-tip styles, story

* test(Popover): add e2e tests

* style(Popover): adjust storybook styles

* fix(Popover): add new prop to proptypes

* chore(snapshot): update snapshots

* docs(Popover): add close on esc to story

* docs(Popover): fix typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* chore(deps): bump minimist in /packages/react/examples/react-router (#13254)

Bumps [minimist](https://github.com/minimistjs/minimist) from 1.2.5 to 1.2.8.
- [Release notes](https://github.com/minimistjs/minimist/releases)
- [Changelog](https://github.com/minimistjs/minimist/blob/main/CHANGELOG.md)
- [Commits](minimistjs/minimist@v1.2.5...v1.2.8)

---
updated-dependencies:
- dependency-name: minimist
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(StructuredList): ariaLabel to aria-label (#13261)

* refactor(StructuredListWrapper): ariaLabel to aria-label

* fix(StructuredList test): use 'aria-label'

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(DataTable): add rowIds to the sortRows extra params list (#13236)

Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(typescript): add various typescript typings (#13234)

* feat(TableToolbar): add typescript typings

* feat(TableToolbarAction): add typescript typings

* feat(TableToolbarContent): change to `tsx`

* feat(TableToolbarMenu): add typescript typings

* feat(OverflowMenuItem): add typescript typings

* fix: format

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* fix(RadioTile): forward ref to input node (#13130)

Forward ref to input node of RadioTile,
such that it behaves the same as other form inputs.

Co-authored-by: Francine Lucca <[email protected]>

* feat: migration examples prefix selectors (#13264)

* feat(ContentSwitcher): preliminary unstable refactor

* feat: added prefix and id prefix examples

* fix: delete content switcher directory

* feat: update demos

* Update examples/id-prefix/src/App.jsx

Co-authored-by: Francine Lucca <[email protected]>

* Update packages/react/src/components/IdPrefix/index.js

* feat: added docs

* fix: update context

* fix: yarn install

* fix: update context 2

* chore: update yarn packages

* chore: udpate yarn carbon/react

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(DataTableSkeleton): 12513 - Add TS types for props (#13245)

* feat(DataTableSkeleton): 12513 - Add TS types for props

* fix: yarn run format

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* test(datatable): refactor to use RTL (#13294)

* chore: wip

* chore: wip

* test(datatable): refactor to use RTL

* chore: typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(modal): aria-label a11y bug (#13242)

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* test(HeaderSideNavItems): add tests (#13303)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* docs(Storybook): update storybook config so actions display properly (#13302)

* docs(Storybook): update storybook config so actions display properly

* fix(DatePicker): change action names

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(tabs): deprecate light prop (#13262)

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(menu): focus first item when opened (#13277)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(CodeSnippet): a11y tabstop + attributes (#13310)

* fix(CodeSnippet): a11y tabstop + attributes

* fix(CSS): add Carbon CSS to focus outline

* refactor(CodeSnippet): relocate parens

* refactor(OverflowMenu): ariaLabel to aria-label (NEW) (#13280)

* fix(CodeSnippet): a11y tabstop + attributes

* fix(CSS): add Carbon CSS to focus outline

* refactor(OverflowMenu): ariaLabel to aria-label NEW

* Delete CodeSnippet.js

error from a rebase/merge

* Delete _code-snippet.scss

error from rebase/merge

* revert(missingFiles): they'll be ignored on merge

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* chore(test): remove enzyme (#13316)

* test(accordion): refactor from enzyme to RTL

* chore(test): remove enzyme

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(CodeSnippet): ariaLabel to aria-label (#13274)

Co-authored-by: Taylor Jones <[email protected]>

* feat(TextArea): add warning state (#13293)

* feat(TextArea): add warning state

* chore: update snapshots

* fix: textarea error bottom border and default value in story

* chore: hide resize fluid textarea invalid and warn

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor: convert TextAreaSkeleton to TypeScript (#13275)

* refactor: convert TextAreaSkeleton to TypeScript

* chore: remove unneeded omit

* chore: remove unneeded omit

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(batchToolTips): make tooltips on batch visible (#13328)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(Notification): ariaLabel to aria-label (#13281)

* refactor(Notification): ariaLabel to aria-label

* fix(Notification): rm stories default dupes

* fix(InlineNotification): rm deprecated prop

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(format): tsx formatting

---------

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: Jan Hassel <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Bianca Sparxs <[email protected]>
Co-authored-by: carbon-automation[bot] <103539138+carbon-automation[bot]@users.noreply.github.com>
Co-authored-by: tay1orjones <[email protected]>
Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: jpsorensen <[email protected]>
Co-authored-by: andrew <[email protected]>
Co-authored-by: Alessandra Davila <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Chris Knabe <[email protected]>
Co-authored-by: GalvinGao <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: remolueoend <[email protected]>
Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Sierra Wetmore <[email protected]>
Co-authored-by: Austin <[email protected]>

packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap

@@ -2692,9 +2692,10 @@ Map {
       "type": "default",
     },
     "propTypes": Object {
-      "ariaLabel": Object {
+      "aria-label": Object {
         "type": "string",
       },
+      "ariaLabel": [Function],
       "className": Object {
         "type": "string",
       },

packages/react/src/components/Dropdown/Dropdown.tsx

@@ -61,8 +61,15 @@ export interface OnChangeData<ItemType> {
 export interface DropdownProps<ItemType>
   extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttributes> {
   /**
+   * Specify a label to be read by screen readers on the container node
    * 'aria-label' of the ListBox component.
    */
+  ['aria-label']?: string;
+
+  /**
+   * @deprecated please use `aria-label` instead.
+   * Specify a label to be read by screen readers on the container note.
+   */
   ariaLabel?: string;
 
   /**
@@ -206,7 +213,8 @@ const Dropdown = React.forwardRef(
       direction,
       items,
       label,
-      ariaLabel,
+      ['aria-label']: ariaLabel,
+      ariaLabel: deprecatedAriaLabel,
       itemToString = defaultItemToString,
       itemToElement,
       renderSelectedItem,
@@ -358,7 +366,7 @@ const Dropdown = React.forwardRef(
         <ListBox
           onFocus={handleFocus}
           onBlur={handleFocus}
-          aria-label={ariaLabel}
+          aria-label={deprecatedAriaLabel || ariaLabel}
           size={size}
           className={className}
           invalid={invalid}
@@ -466,8 +474,18 @@ Dropdown.displayName = 'Dropdown';
 Dropdown.propTypes = {
   /**
    * 'aria-label' of the ListBox component.
+   * Specify a label to be read by screen readers on the container node
+   */
+  ['aria-label']: PropTypes.string,
+
+  /**
+   * Deprecated, please use `aria-label` instead.
+   * Specify a label to be read by screen readers on the container note.
    */
-  ariaLabel: PropTypes.string,
+  ariaLabel: deprecate(
+    PropTypes.string,
+    'This prop syntax has been deprecated. Please use the new `aria-label`.'
+  ),
 
   /**
    * Provide a custom className to be applied on the bx--dropdown node