@carbon/ibm-products 2.43.2-canary.22 → 2.43.2-canary.226

package/es/components/InlineTip/InlineTipButton.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-interface InlineTipButtonProps {
+export interface InlineTipButtonProps {
     /**
      * Provide an optional class to be applied to the containing node.
      */
@@ -21,4 +21,3 @@ interface InlineTipButtonProps {
 export declare let InlineTipButton: React.ForwardRefExoticComponent<InlineTipButtonProps & {
     children?: React.ReactNode;
 } & React.RefAttributes<HTMLButtonElement>>;
-export {};

package/es/components/InlineTip/InlineTipButton.js

@@ -7,9 +7,9 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
+import { Button } from '@carbon/react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
-import { Button } from '@carbon/react';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 

package/es/components/InlineTip/InlineTipLink.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { PropsWithChildren, ReactNode } from 'react';
-interface InlineTipLinkProps extends PropsWithChildren {
+export interface InlineTipLinkProps extends PropsWithChildren {
     /**
      * Provide the contents of the InlineTipLink.
      */
@@ -19,4 +19,3 @@ interface InlineTipLinkProps extends PropsWithChildren {
  * This is a standard Carbon link, styled specifically for use inside InlineTip.
  */
 export declare let InlineTipLink: React.ForwardRefExoticComponent<InlineTipLinkProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/es/components/InlineTip/InlineTipLink.js

@@ -7,10 +7,10 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
-import cx from 'classnames';
 import { Launch } from '@carbon/react/icons';
 import { Link } from '@carbon/react';
+import PropTypes from '../../node_modules/prop-types/index.js';
+import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 

package/es/components/InlineTip/index.d.ts

@@ -1,3 +1,12 @@
-export { InlineTip } from "./InlineTip";
-export { InlineTipButton } from "./InlineTipButton";
-export { InlineTipLink } from "./InlineTipLink";
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { InlineTip } from './InlineTip';
+export { InlineTipButton } from './InlineTipButton';
+export { InlineTipLink } from './InlineTipLink';
+export type { InlineTipProps } from './InlineTip';
+export type { InlineTipButtonProps } from './InlineTipButton';
+export type { InlineTipLinkProps } from './InlineTipLink';

package/es/components/InterstitialScreen/InterstitialScreen.d.ts

@@ -17,7 +17,7 @@ type Media = {
     render?: never;
     filePaths?: string[];
 });
-interface InterstitialScreenProps extends PropsWithChildren {
+export interface InterstitialScreenProps extends PropsWithChildren {
     /**
      * Provide the contents of the InterstitialScreen.
      */

package/es/components/InterstitialScreen/InterstitialScreen.js

@@ -6,16 +6,17 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { ComposedModal, ModalHeader, ProgressIndicator, ProgressStep, ModalBody, ModalFooter, FlexGrid, Row, Column, Button } from '@carbon/react';
 import React__default, { useRef, useState, Children, useCallback, useEffect, isValidElement } from 'react';
+import { ArrowRight } from '@carbon/react/icons';
+import { Carousel } from '../Carousel/Carousel.js';
+import '../Carousel/CarouselItem.js';
 import PropTypes from '../../node_modules/prop-types/index.js';
+import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia/SteppedAnimatedMedia.js';
+import { clamp } from 'lodash';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
-import { clamp } from 'lodash';
-import { ArrowRight } from '@carbon/react/icons';
-import { ComposedModal, ModalHeader, ProgressIndicator, ProgressStep, ModalBody, ModalFooter, FlexGrid, Row, Column, Button } from '@carbon/react';
-import { Carousel } from '../Carousel/Carousel.js';
-import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia/SteppedAnimatedMedia.js';
 
 var _excluded = ["children", "className", "closeIconDescription", "domainName", "hideProgressIndicator", "interstitialAriaLabel", "isFullScreen", "isOpen", "media", "nextButtonLabel", "onClose", "previousButtonLabel", "productName", "headerClassName", "headerTitle", "startButtonLabel", "skipButtonLabel"];
 

package/es/components/InterstitialScreen/index.d.ts

@@ -1 +1,8 @@
-export { InterstitialScreen } from "./InterstitialScreen";
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { InterstitialScreen } from './InterstitialScreen';
+export type { InterstitialScreenProps } from './InterstitialScreen';

package/es/components/InterstitialScreenView/InterstitialScreenView.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { PropsWithChildren, ReactNode } from 'react';
-interface InterstitialScreenViewProps extends PropsWithChildren {
+export interface InterstitialScreenViewProps extends PropsWithChildren {
     /**
      * Provide the contents of the InterstitialScreenView.
      */
@@ -23,4 +23,3 @@ interface InterstitialScreenViewProps extends PropsWithChildren {
  * An Onboarding component intended to be used as the child elements of the InterstitialScreen component.
  */
 export declare let InterstitialScreenView: React.ForwardRefExoticComponent<InterstitialScreenViewProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/es/components/InterstitialScreenView/index.d.ts

@@ -1 +1,8 @@
-export { InterstitialScreenView } from "./InterstitialScreenView";
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { InterstitialScreenView } from './InterstitialScreenView';
+export type { InterstitialScreenViewProps } from './InterstitialScreenView';

package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-interface InterstitialScreenViewModuleProps {
+export interface InterstitialScreenViewModuleProps {
     /**
      * Provide an optional class to be applied to the containing node.
      */
@@ -23,4 +23,3 @@ interface InterstitialScreenViewModuleProps {
  * View module to help in building interstitial screen views.
  */
 export declare let InterstitialScreenViewModule: React.ForwardRefExoticComponent<InterstitialScreenViewModuleProps & React.RefAttributes<HTMLElement>>;
-export {};

package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js

@@ -6,8 +6,8 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
+import React__default from 'react';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';

package/es/components/InterstitialScreenViewModule/index.d.ts

@@ -1 +1,8 @@
-export { InterstitialScreenViewModule } from "./InterstitialScreenViewModule";
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { InterstitialScreenViewModule } from './InterstitialScreenViewModule';
+export type { InterstitialScreenViewModuleProps } from './InterstitialScreenViewModule';

package/es/components/MultiAddSelect/MultiAddSelect.d.ts

@@ -28,7 +28,7 @@ type ItemType = {
     sortBy: string[];
     filterBy: string[];
 };
-interface MultiAddSelectProps {
+export interface MultiAddSelectProps {
     /**
      * optional class name
      */

package/es/components/MultiAddSelect/MultiAddSelect.js

@@ -7,10 +7,10 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { forwardRef } from 'react';
+import { AddSelect } from '../AddSelect/AddSelect.js';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
-import { AddSelect } from '../AddSelect/AddSelect.js';
 
 var componentName = 'MultiAddSelect';
 /**

package/es/components/MultiAddSelect/index.d.ts

@@ -1 +1,2 @@
-export { MultiAddSelect } from "./MultiAddSelect";
+export { MultiAddSelect } from './MultiAddSelect';
+export type { MultiAddSelectProps } from './MultiAddSelect';

package/es/components/Nav/NavItem.js

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef } from 'react';
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { useState, useEffect, useRef } from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
 import { pkg } from '../../settings.js';
@@ -51,11 +51,20 @@ var NavItem = function NavItem(_ref) {
     _ref$tabIndex = _ref.tabIndex,
     tabIndex = _ref$tabIndex === void 0 ? defaults.tabIndex : _ref$tabIndex,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    hrefHasDifferentHost = _useState2[0],
+    setHrefHasDifferentHost = _useState2[1];
+  useEffect(function () {
+    if ((href === null || href === void 0 ? void 0 : href.indexOf(window.location.host)) === -1) {
+      setHrefHasDifferentHost(true);
+    }
+  }, [href]);
   var internalId = useRef(uuidv4());
   var instanceId = "".concat(blockClass, "__").concat(internalId.current);
   var navItemId = id || instanceId;
   var isAbsoluteLink = new RegExp('^([a-z]+://|//)', 'i');
-  var externalLink = isAbsoluteLink.test(href) && href.indexOf(window.location.host) === -1;
+  var externalLink = isAbsoluteLink.test(href) && hrefHasDifferentHost;
   var linkClassName = "".concat(blockClass, "__link");
   var handleDisabled = function handleDisabled(action) {
     var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
@@ -144,6 +153,9 @@ NavItem.propTypes = {
    */
   tabIndex: PropTypes.number
 };
+
+// Return a placeholder if not released and not enabled by feature flag
+NavItem = pkg.checkComponentEnabled(NavItem, componentName);
 var NavItem$1 = NavItem;
 
 export { NavItem, blockClass, NavItem$1 as default };

package/es/components/Nav/NavList.js

@@ -163,6 +163,9 @@ NavList.propTypes = {
   title: propTypesExports.string
 };
 NavList.displayName = componentName;
+
+// Return a placeholder if not released and not enabled by feature flag
+NavList = pkg.checkComponentEnabled(NavList, componentName);
 var NavList$1 = NavList;
 
 export { NavList, blockClass, NavList$1 as default };

package/es/components/NonLinearReading/NonLinearReading.d.ts

@@ -6,7 +6,7 @@
  */
 import React, { ReactNode } from 'react';
 type Theme = 'light' | 'dark';
-interface NonLinearReadingProps {
+export interface NonLinearReadingProps {
     /**
      * The keyword of the component appears as a pill.
      */

package/es/components/NonLinearReading/NonLinearReading.js

@@ -7,12 +7,12 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useRef } from 'react';
+import { ChevronDown } from '@carbon/react/icons';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
-import { ChevronDown } from '@carbon/react/icons';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import uuidv4 from '../../global/js/utils/uuidv4.js';
 import { pkg } from '../../settings.js';
+import uuidv4 from '../../global/js/utils/uuidv4.js';
 
 var _ChevronDown;
 var _excluded = ["children", "className", "definition", "theme"];

package/es/components/NonLinearReading/index.d.ts

@@ -1 +1,8 @@
-export { NonLinearReading } from "./NonLinearReading";
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { NonLinearReading } from './NonLinearReading';
+export type { NonLinearReadingProps } from './NonLinearReading';

package/es/components/NotificationsPanel/NotificationsPanel.d.ts

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 /// <reference path="../../../src/custom-typings/index.d.ts" />
-import React from 'react';
 import { Link } from '@carbon/react';
+import React from 'react';
 interface Link {
     url: string;
     text: string;
@@ -21,7 +21,7 @@ interface Data {
     unread?: boolean;
     onNotificationClick?: () => void;
 }
-interface NotificationsPanelProps {
+export interface NotificationsPanelProps {
     /**
      * Provide an optional class to be applied to the containing node.
      */
@@ -158,6 +158,8 @@ interface NotificationsPanelProps {
      * Sets the yesterday label text
      */
     yesterdayLabel?: string;
+    /** Specify the CSS selectors that match the floating menus. */
+    selectorsFloatingMenus?: string[];
 }
 export declare let NotificationsPanel: React.ForwardRefExoticComponent<NotificationsPanelProps & React.RefAttributes<unknown>>;
 export {};

package/es/components/NotificationsPanel/NotificationsPanel.js

@@ -6,22 +6,23 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { usePrefix, Button, Toggle, Link, IconButton } from '@carbon/react';
+import { Settings, ErrorFilled, CheckmarkFilled, WarningAltFilled, InformationSquareFilled, Close, ChevronDown } from '@carbon/react/icons';
 import React__default, { useRef, useState, useEffect } from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
-import { timeAgo } from './utils.js';
 import { prepareProps } from '../../global/js/utils/props-helper.js';
+import { timeAgo } from './utils.js';
 import usePrefersReducedMotion from '../../global/js/hooks/usePrefersReducedMotion.js';
-import { Button, Toggle, Link, IconButton } from '@carbon/react';
-import { Settings, ErrorFilled, CheckmarkFilled, WarningAltFilled, InformationSquareFilled, Close, ChevronDown } from '@carbon/react/icons';
+import wrapFocus from '../../global/js/utils/wrapFocus.js';
 import { usePreviousValue } from '../../global/js/hooks/usePreviousValue.js';
 import { useClickOutside } from '../../global/js/hooks/useClickOutside.js';
 import { NotificationsEmptyState } from '../EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js';
 
 var _Close;
-var _excluded = ["className", "data", "daysAgoText", "dismissAllLabel", "dismissSingleNotificationIconDescription", "doNotDisturbDefaultToggled", "doNotDisturbLabel", "emptyStateLabel", "hourAgoText", "hoursAgoText", "minuteAgoText", "minutesAgoText", "monthAgoText", "monthsAgoText", "nowText", "onClickOutside", "onDismissAllNotifications", "onDismissSingleNotification", "onDoNotDisturbChange", "onSettingsClick", "onViewAllClick", "open", "previousLabel", "readLessLabel", "readMoreLabel", "secondsAgoText", "settingsIconDescription", "title", "todayLabel", "viewAllLabel", "yearAgoText", "yearsAgoText", "yesterdayAtText", "yesterdayLabel"];
+var _excluded = ["className", "data", "daysAgoText", "dismissAllLabel", "dismissSingleNotificationIconDescription", "doNotDisturbDefaultToggled", "doNotDisturbLabel", "emptyStateLabel", "hourAgoText", "hoursAgoText", "minuteAgoText", "minutesAgoText", "monthAgoText", "monthsAgoText", "nowText", "onClickOutside", "onDismissAllNotifications", "onDismissSingleNotification", "onDoNotDisturbChange", "onSettingsClick", "onViewAllClick", "open", "previousLabel", "readLessLabel", "readMoreLabel", "secondsAgoText", "settingsIconDescription", "title", "todayLabel", "viewAllLabel", "yearAgoText", "yearsAgoText", "yesterdayAtText", "yesterdayLabel", "selectorsFloatingMenus"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 var componentName = 'NotificationsPanel';
@@ -141,8 +142,12 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     yesterdayAtText = _ref$yesterdayAtText === void 0 ? defaults.yesterdayAtText : _ref$yesterdayAtText,
     _ref$yesterdayLabel = _ref.yesterdayLabel,
     yesterdayLabel = _ref$yesterdayLabel === void 0 ? defaults.yesterdayLabel : _ref$yesterdayLabel,
+    selectorsFloatingMenus = _ref.selectorsFloatingMenus,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var notificationPanelRef = useRef();
+  var notificationPanelRef = useRef(null);
+  var notificationPanelInnerRef = useRef(null);
+  var startSentinel = useRef(null);
+  var endSentinel = useRef(null);
   var _useState = useState(open),
     _useState2 = _slicedToArray(_useState, 2),
     shouldRender = _useState2[0],
@@ -155,6 +160,7 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     open: open
   });
   var reducedMotion = usePrefersReducedMotion();
+  var carbonPrefix = usePrefix();
   useEffect(function () {
     // Set the notifications passed to the state within this component
     setAllNotifications(data);
@@ -166,12 +172,56 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     // initialize the notification panel to open
     if (open) {
       setRender(true);
+      var observer = new MutationObserver(function () {
+        if (notificationPanelRef.current) {
+          var _querySelector;
+          var parentElement = notificationPanelRef.current;
+          parentElement === null || parentElement === void 0 || (_querySelector = parentElement.querySelector(".".concat(blockClass, "__dismiss-button"))) === null || _querySelector === void 0 || _querySelector.focus();
+          observer.disconnect();
+        }
+      });
+      if (notificationPanelRef.current) {
+        var parentElement = notificationPanelRef.current;
+        var button = parentElement === null || parentElement === void 0 ? void 0 : parentElement.querySelector(".".concat(blockClass, "__dismiss-button"));
+        button === null || button === void 0 || button.focus();
+      } else {
+        observer.observe(document.body, {
+          childList: true,
+          subtree: true
+        });
+      }
+      return function () {
+        return observer.disconnect();
+      };
     }
   }, [open]);
   var onAnimationEnd = function onAnimationEnd() {
     // initialize the notification panel to close
     !open && setRender(false);
   };
+  var handleBlur = function handleBlur(_ref2) {
+    var oldActiveNode = _ref2.target,
+      currentActiveNode = _ref2.relatedTarget;
+    if (open && currentActiveNode && oldActiveNode && notificationPanelInnerRef.current) {
+      var bodyNode = notificationPanelInnerRef.current;
+      var startSentinelNode = startSentinel.current;
+      var endSentinelNode = endSentinel.current;
+      wrapFocus({
+        bodyNode: bodyNode,
+        startTrapNode: startSentinelNode,
+        endTrapNode: endSentinelNode,
+        currentActiveNode: currentActiveNode,
+        oldActiveNode: oldActiveNode,
+        selectorsFloatingMenus: selectorsFloatingMenus === null || selectorsFloatingMenus === void 0 ? void 0 : selectorsFloatingMenus.filter(Boolean)
+      });
+    }
+  };
+  var handleKeydown = function handleKeydown(event) {
+    event.stopPropagation();
+    if (event.key === 'Escape') {
+      onClickOutside();
+    }
+  };
   useEffect(function () {
     if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion) {
       setRender(false);
@@ -310,7 +360,17 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     onDismissSingleNotification(notification);
   };
   var mainSectionClassName = cx(["".concat(blockClass, "__main-section"), _defineProperty({}, "".concat(blockClass, "__main-section-empty"), allNotifications && !allNotifications.length)]);
-  return shouldRender ? /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return shouldRender ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("button", {
+    type: "button",
+    className: "".concat(carbonPrefix, "--visually-hidden"),
+    ref: startSentinel
+  }, "Focus sentinel start"), /*#__PURE__*/React__default.createElement("div", _extends({
+    role: "dialog",
+    "aria-label": "Notification Panel",
+    onBlur: handleBlur,
+    tabIndex: 0,
+    onKeyDown: handleKeydown
+  }, rest, {
     id: blockClass,
     className: cx(blockClass, className, "".concat(blockClass, "__container")),
     style: {
@@ -319,6 +379,8 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     onAnimationEnd: onAnimationEnd,
     ref: ref || notificationPanelRef
   }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("div", {
+    ref: notificationPanelInnerRef
+  }, /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__header-container")
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__header-flex")
@@ -382,7 +444,11 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     onClick: function onClick() {
       return onSettingsClick();
     }
-  })) : null) : null;
+  })) : null)), /*#__PURE__*/React__default.createElement("button", {
+    type: "button",
+    className: "".concat(carbonPrefix, "--visually-hidden"),
+    ref: endSentinel
+  }, "Focus sentinel end")) : null;
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -513,6 +579,10 @@ NotificationsPanel.propTypes = {
    * Sets the `seconds ago` label text
    */
   secondsAgoText: PropTypes.func,
+  /**
+   * Specify the CSS selectors that match the floating menus
+   */
+  selectorsFloatingMenus: PropTypes.arrayOf(PropTypes.string.isRequired),
   /**
    * Sets the settings icon description text
    */

package/es/components/NotificationsPanel/index.d.ts

@@ -1 +1,8 @@
-export { NotificationsPanel } from "./NotificationsPanel";
+/**
+ * Copyright IBM Corp. 2020, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { NotificationsPanel } from './NotificationsPanel';
+export type { NotificationsPanelProps } from './NotificationsPanel';

package/es/components/OptionsTile/OptionsTile.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-interface OptionsTileProps {
+export interface OptionsTileProps {
     /**
      * Provide content to render as expandable OptionsTile. If no children
      * are present, the OptionsTile will render as its variant.
@@ -53,7 +53,7 @@ interface OptionsTileProps {
     /**
      * Define the size of the OptionsTile.
      */
-    size: 'lg' | 'xl';
+    size?: 'lg' | 'xl';
     /**
      * Optionally provide a text summarizing the current state of the content.
      */
@@ -76,4 +76,3 @@ interface OptionsTileProps {
     warnText?: string;
 }
 export declare let OptionsTile: React.ForwardRefExoticComponent<OptionsTileProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/es/components/OptionsTile/OptionsTile.js

@@ -6,15 +6,16 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import * as carbonMotion from '@carbon/motion';
+import { ChevronDown, Locked, WarningFilled, WarningAltFilled } from '@carbon/react/icons';
+import { Toggle, Layer } from '@carbon/react';
 import React__default, { useState, useRef } from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import uuidv4 from '../../global/js/utils/uuidv4.js';
 import { pkg } from '../../settings.js';
-import { Toggle, Layer } from '@carbon/react';
-import { ChevronDown, Locked, WarningFilled, WarningAltFilled } from '@carbon/react/icons';
-import * as carbonMotion from '@carbon/motion';
+import usePrefersReducedMotion from '../../global/js/hooks/usePrefersReducedMotion.js';
+import uuidv4 from '../../global/js/utils/uuidv4.js';
 import { useControllableState } from '../../global/js/hooks/useControllableState.js';
 
 var _Locked;
@@ -71,9 +72,7 @@ var OptionsTile = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var isInvalid = invalid;
   var isWarn = !isInvalid && warn;
   var isLocked = !isInvalid && !isWarn && locked;
-  var reducedMotion = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
-    matches: true
-  };
+  var shouldReduceMotion = usePrefersReducedMotion();
   if (open !== prevIsOpen) {
     if (isOpen && !open) {
       collapse();
@@ -83,7 +82,7 @@ var OptionsTile = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     setPrevIsOpen(open);
   }
   function expand() {
-    if (detailsRef.current && contentRef.current && !reducedMotion.matches) {
+    if (detailsRef.current && contentRef.current && !shouldReduceMotion) {
       setIsOpen(true);
       detailsRef.current.open = true;
       var _getComputedStyle = getComputedStyle(contentRef.current),
@@ -112,7 +111,7 @@ var OptionsTile = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     }
   }
   function collapse() {
-    if (contentRef.current && !reducedMotion.matches) {
+    if (contentRef.current && !shouldReduceMotion) {
       setClosing(true);
       var _getComputedStyle2 = getComputedStyle(contentRef.current),
         paddingTop = _getComputedStyle2.paddingTop,
@@ -164,6 +163,12 @@ var OptionsTile = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     var Icon = null;
     var text = summary;
     var summaryClasses = ["".concat(blockClass, "__summary")];
+    if (closing) {
+      summaryClasses.push("".concat(blockClass, "__summary--closing"));
+    }
+    if (isOpen) {
+      summaryClasses.push("".concat(blockClass, "__summary--open"));
+    }
     if (invalid) {
       Icon = WarningFilled;
       text = invalidText;
@@ -227,7 +232,7 @@ var OptionsTile = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     onClick: toggle
   }, /*#__PURE__*/React__default.createElement(ChevronDown, {
     size: 16,
-    className: "".concat(blockClass, "__chevron")
+    className: cx("".concat(blockClass, "__chevron"), _defineProperty(_defineProperty({}, "".concat(blockClass, "__chevron--open"), isOpen), "".concat(blockClass, "__chevron--closing"), closing))
   }), renderTitle()), /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__content"),
     ref: contentRef
@@ -299,7 +304,6 @@ OptionsTile.propTypes = {
   /**
    * Define the size of the OptionsTile.
    */
-  /**@ts-ignore*/
   size: PropTypes.oneOf(['lg', 'xl']),
   /**
    * Optionally provide a text summarizing the current state of the content.

package/es/components/OptionsTile/index.d.ts

@@ -1 +1,8 @@
-export { OptionsTile } from "./OptionsTile";
+/**
+ * Copyright IBM Corp. 2021, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { OptionsTile } from './OptionsTile';
+export type { OptionsTileProps } from './OptionsTile';

package/es/components/PageHeader/PageHeader.d.ts

@@ -1,7 +1,7 @@
 /// <reference path="../../../src/custom-typings/index.d.ts" />
-import React, { PropsWithChildren, ReactNode } from 'react';
 import { Tag } from '@carbon/react';
 import { ButtonProps, PopoverAlignment, TagProps } from '@carbon/type';
+import React, { PropsWithChildren, ReactNode } from 'react';
 interface ActionBarItem extends ButtonProps {
     iconDescription: string;
     onClick: () => void;
@@ -284,7 +284,7 @@ interface PageHeaderBaseProps extends PropsWithChildren {
      */
     hasBackgroundAlways?: boolean;
 }
-type PageHeaderProps = PageHeaderBaseProps & PageActionProps & CollapseHeaderProps & BreadcrumbProps & ActionBarOverflowAriaLabelProps;
+export type PageHeaderProps = PageHeaderBaseProps & PageActionProps & CollapseHeaderProps & BreadcrumbProps & ActionBarOverflowAriaLabelProps;
 export declare let PageHeader: React.ForwardRefExoticComponent<PageHeaderProps & React.RefAttributes<HTMLDivElement>>;
 export declare const deprecatedProps: {
     /**