Merge branch 'main' into interactive-tags

carbon-design-system · Feb 23, 2024 · fe91fae · fe91fae
2 parents 481f9c8 + 582901c
commit fe91fae
Show file tree

Hide file tree

Showing 15 changed files with 481 additions and 188 deletions.
diff --git a/docs/migration/v11.md b/docs/migration/v11.md
diff --git a/e2e/icons-react/__snapshots__/PublicAPI-test.js.snap b/e2e/icons-react/__snapshots__/PublicAPI-test.js.snap
@@ -1550,6 +1550,10 @@ Array [
   "Rewind_10",
   "Rewind_30",
   "Rewind_5",
+  "RightPanelClose",
+  "RightPanelCloseFilled",
+  "RightPanelOpen",
+  "RightPanelOpenFilled",
   "Road",
   "RoadWeather",
   "Roadmap",

diff --git a/e2e/icons-vue/__snapshots__/PublicAPI-test.js.snap b/e2e/icons-vue/__snapshots__/PublicAPI-test.js.snap
@@ -6176,6 +6176,22 @@ Array [
   "Rewind_520",
   "Rewind_524",
   "Rewind_532",
+  "RightPanelClose16",
+  "RightPanelClose20",
+  "RightPanelClose24",
+  "RightPanelClose32",
+  "RightPanelCloseFilled16",
+  "RightPanelCloseFilled20",
+  "RightPanelCloseFilled24",
+  "RightPanelCloseFilled32",
+  "RightPanelOpen16",
+  "RightPanelOpen20",
+  "RightPanelOpen24",
+  "RightPanelOpen32",
+  "RightPanelOpenFilled16",
+  "RightPanelOpenFilled20",
+  "RightPanelOpenFilled24",
+  "RightPanelOpenFilled32",
   "Road16",
   "Road20",
   "Road24",

diff --git a/e2e/icons/__snapshots__/PublicAPI-test.js.snap b/e2e/icons/__snapshots__/PublicAPI-test.js.snap
@@ -6175,6 +6175,22 @@ Array [
   "Rewind_520",
   "Rewind_524",
   "Rewind_532",
+  "RightPanelClose16",
+  "RightPanelClose20",
+  "RightPanelClose24",
+  "RightPanelClose32",
+  "RightPanelCloseFilled16",
+  "RightPanelCloseFilled20",
+  "RightPanelCloseFilled24",
+  "RightPanelCloseFilled32",
+  "RightPanelOpen16",
+  "RightPanelOpen20",
+  "RightPanelOpen24",
+  "RightPanelOpen32",
+  "RightPanelOpenFilled16",
+  "RightPanelOpenFilled20",
+  "RightPanelOpenFilled24",
+  "RightPanelOpenFilled32",
   "Road16",
   "Road20",
   "Road24",

diff --git a/packages/icons/categories.yml b/packages/icons/categories.yml
@@ -42,6 +42,10 @@ categories:
           - rewind--10
           - rewind--30
           - rewind--5
+          - right-panel--close
+          - right-panel--close--filled
+          - right-panel--open
+          - right-panel--open--filled
           - settings
           - settings--adjust
           - settings--check

diff --git a/packages/icons/icons.yml b/packages/icons/icons.yml
@@ -17188,6 +17188,72 @@
     - previous
     - past
     - reverse
+- name: right-panel--close
+  friendly_name: Right panel close
+  sizes:
+    - 32
+  aliases:
+    - controls
+    - side panel
+    - side bar
+    - close
+    - arrow right
+    - open
+    - panel
+    - navigation
+    - side nav
+    - ui
+    - nav
+- name: right-panel--close--filled
+  friendly_name: Right panel close filled
+  sizes:
+    - 32
+  aliases:
+    - controls
+    - side panel
+    - side bar
+    - close
+    - arrow right
+    - open
+    - panel
+    - navigation
+    - side nav
+    - ui
+    - nav
+    - filled
+- name: right-panel--open
+  friendly_name: Right panel open
+  sizes:
+    - 32
+  aliases:
+    - controls
+    - side panel
+    - side bar
+    - open
+    - arrow right
+    - open
+    - panel
+    - navigation
+    - side nav
+    - ui
+    - nav
+- name: right-panel--open--filled
+  friendly_name: Right panel open filled
+  sizes:
+    - 32
+  aliases:
+    - controls
+    - side panel
+    - side bar
+    - close
+    - arrow right
+    - open
+    - panel
+    - navigation
+    - side nav
+    - ui
+    - nav
+    - filled
 - name: road
   friendly_name: Road
   aliases:

diff --git a/packages/icons/src/svg/32/right-panel--close--filled.svg b/packages/icons/src/svg/32/right-panel--close--filled.svg
diff --git a/packages/icons/src/svg/32/right-panel--close.svg b/packages/icons/src/svg/32/right-panel--close.svg
diff --git a/packages/icons/src/svg/32/right-panel--open--filled.svg b/packages/icons/src/svg/32/right-panel--open--filled.svg
diff --git a/packages/icons/src/svg/32/right-panel--open.svg b/packages/icons/src/svg/32/right-panel--open.svg
diff --git a/...es/react/src/components/UIShell/Header.js → ...s/react/src/components/UIShell/Header.tsx b/...es/react/src/components/UIShell/Header.js → ...s/react/src/components/UIShell/Header.tsx
@@ -7,13 +7,33 @@
 
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { AriaLabelPropType } from '../../prop-types/AriaPropTypes';
 import { usePrefix } from '../../internal/usePrefix';
 
-const Header = ({ className: customClassName, children, ...rest }) => {
+interface HeaderProps {
+  children?: ReactNode;
+  /**
+   * Required props for the accessibility label of the header
+   */
+  'aria-label'?: string;
+  /**
+   * Required props for the accessibility label of the header
+   */
+  'aria-labelledby'?: string;
+  /**
+   * Optionally provide a custom class name that is applied to the underlying <header>
+   */
+  className?: string;
+}
+
+const Header: React.FC<HeaderProps> = ({
+  className: customClassName,
+  children,
+  ...rest
+}) => {
   const prefix = usePrefix();
-  const className = cx(`${prefix}--header`, customClassName);
+  const className = cx(`${prefix}--header`, customClassName as string);
 
   return (
     <header {...rest} className={className}>

diff --git a/packages/react/src/components/UIShell/HeaderGlobalAction.js b/packages/react/src/components/UIShell/HeaderGlobalAction.js