@carbon-labs/react-ui-shell 0.85.0 → 0.87.0

package/es/__stories__/AppIcons.d.ts

@@ -0,0 +1,4 @@
+export function CarbonDesignSystem(): import("react/jsx-runtime").JSX.Element;
+export function CarbonIBMDotCom(): import("react/jsx-runtime").JSX.Element;
+export function CarbonforIBMProducts(): import("react/jsx-runtime").JSX.Element;
+export function IBMTelemetry(): import("react/jsx-runtime").JSX.Element;

package/es/components/HeaderPopover.js

@@ -105,9 +105,11 @@ function HeaderPopover({
     align: align,
     autoAlign: autoAlign,
     as: as,
+    backgroundToken: "background",
+    border: true,
     isTabTip: true,
     className: className,
-    dropShadow: false,
+    dropShadow: true,
     highContrast: false,
     open: open,
     onKeyDown: onKeyDown,

package/lib/__stories__/AppIcons.d.ts

@@ -0,0 +1,4 @@
+export function CarbonDesignSystem(): import("react/jsx-runtime").JSX.Element;
+export function CarbonIBMDotCom(): import("react/jsx-runtime").JSX.Element;
+export function CarbonforIBMProducts(): import("react/jsx-runtime").JSX.Element;
+export function IBMTelemetry(): import("react/jsx-runtime").JSX.Element;

package/lib/components/HeaderPopover.js

@@ -107,9 +107,11 @@ function HeaderPopover({
     align: align,
     autoAlign: autoAlign,
     as: as,
+    backgroundToken: "background",
+    border: true,
     isTabTip: true,
     className: className,
-    dropShadow: false,
+    dropShadow: true,
     highContrast: false,
     open: open,
     onKeyDown: onKeyDown,

package/lib/es/_virtual/_rollupPluginBabelHelpers.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright IBM Corp. 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.
+ */
+declare function _extends(...args: any[]): any;
+export { _extends as extends, _extends as extends };

package/lib/es/components/HeaderContainer.d.ts

@@ -0,0 +1,20 @@
+export function HeaderContainer({ render: Children, isSideNavExpanded, isSwitcherExpanded, isProfileExpanded, themeSetting, ...rest }: {
+    [x: string]: any;
+    render: any;
+    isSideNavExpanded?: boolean | undefined;
+    isSwitcherExpanded?: boolean | undefined;
+    isProfileExpanded?: boolean | undefined;
+    themeSetting: any;
+}): React__default.CElement<any, React__default.Component<any, any, any>>;
+export namespace HeaderContainer {
+    namespace propTypes {
+        let isProfileExpanded: PropTypes.Requireable<boolean>;
+        let isSideNavExpanded: PropTypes.Requireable<boolean>;
+        let isSwitcherExpanded: PropTypes.Requireable<boolean>;
+        let render: PropTypes.Validator<NonNullable<PropTypes.ReactComponentLike>>;
+    }
+    let displayName: string;
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';
+export { HeaderContainer as default };

package/lib/es/components/HeaderDivider.d.ts

@@ -0,0 +1,12 @@
+export function HeaderDivider({ className }: {
+    className: any;
+}): React__default.DetailedReactHTMLElement<{
+    className: string;
+}, HTMLElement>;
+export namespace HeaderDivider {
+    namespace propTypes {
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/HeaderOverflowPanel.d.ts

@@ -0,0 +1,2 @@
+export const HeaderOverflowPanel: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';

package/lib/es/components/HeaderPopover.d.ts

@@ -0,0 +1,64 @@
+/**
+ * Used as a container for the button and content of a toggletip. This component
+ * is responsible for coordinating between interactions with the button and the
+ * visibility of the content
+ */
+export function HeaderPopover({ align, as, autoAlign, className: customClassName, children, defaultOpen, ...rest }: {
+    [x: string]: any;
+    align: any;
+    as: any;
+    autoAlign: any;
+    className: any;
+    children: any;
+    defaultOpen?: boolean | undefined;
+}): React__default.DetailedReactHTMLElement<React__default.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
+export namespace HeaderPopover {
+    namespace propTypes {
+        let align: PropTypes.Requireable<string>;
+        let alignmentAxisOffset: PropTypes.Requireable<number>;
+        let as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
+        let autoAlign: PropTypes.Requireable<boolean>;
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let defaultOpen: PropTypes.Requireable<boolean>;
+    }
+}
+/**
+ * `ToggletipActions` is a container for one or two actions present at the base
+ * of a toggletip. It is used for layout of these items.
+ */
+export const HeaderPopoverActions: typeof ToggletipActions;
+/**
+ * `ToggletipButton` controls the visibility of the Toggletip through mouse
+ * clicks and keyboard interactions.
+ */
+export function HeaderPopoverButton({ children, className: customClassName, label, as: BaseComponent, ...rest }: {
+    [x: string]: any;
+    children: any;
+    className: any;
+    label?: string | undefined;
+    as: any;
+}): React__default.DetailedReactHTMLElement<React__default.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
+export namespace HeaderPopoverButton {
+    export namespace propTypes_1 {
+        let children_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        export { children_1 as children };
+        let className_1: PropTypes.Requireable<string>;
+        export { className_1 as className };
+        export let label: PropTypes.Requireable<string>;
+    }
+    export { propTypes_1 as propTypes };
+}
+/**
+ * `ToggletipContent` is a wrapper around `PopoverContent`. It places the
+ * `children` passed in as a prop inside of `PopoverContent` so that they will
+ * be rendered inside of the popover for this component.
+ */
+export function HeaderPopoverContent({ children, className, ...rest }: {
+    [x: string]: any;
+    children: any;
+    className: any;
+}): React__default.FunctionComponentElement<import("@carbon/react").ToggletipContentProps & React__default.RefAttributes<HTMLDivElement>>;
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { ToggletipActions } from '@carbon/react';

package/lib/es/components/Link.d.ts

@@ -0,0 +1,20 @@
+export namespace LinkPropTypes {
+    let as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
+    let element: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
+    let isSideNavExpanded: PropTypes.Requireable<boolean>;
+}
+/**
+ * Link is a custom component that allows us to supporting rendering elements
+ * other than `a` in our markup. The goal is to allow users to support passing
+ * in their own components to support use-cases like `react-router` or
+ * `@reach/router`
+ */
+declare const Link: React__default.ForwardRefExoticComponent<Omit<{
+    [x: string]: any;
+    element: any;
+    as: any;
+    isSideNavExpanded: any;
+}, "ref"> & React__default.RefAttributes<any>>;
+import PropTypes from 'prop-types';
+import React__default from 'react';
+export { Link as default };

package/lib/es/components/Profile.d.ts

@@ -0,0 +1,12 @@
+export const Profile: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+export const ProfileReadOnly: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+export const ProfileUserInfo: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+export const ReadOnly: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+/**
+ * -------
+ * Exports
+ * -------
+ */
+export const Root: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+export const UserInfo: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';

package/lib/es/components/SharkFinIcon.d.ts

@@ -0,0 +1,12 @@
+export function SharkFinIcon({ className: customClassName }: {
+    className: any;
+}): React__default.ReactSVGElement;
+export namespace SharkFinIcon {
+    namespace propTypes {
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let small: PropTypes.Requireable<boolean>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/SideNav.d.ts

@@ -0,0 +1,36 @@
+export let SIDE_NAV_TYPE: {};
+export const SideNav: React__default.ForwardRefExoticComponent<Omit<{
+    [x: string]: any;
+    expanded: any;
+    defaultExpanded?: boolean | undefined;
+    isChildOfHeader?: boolean | undefined;
+    "aria-label": any;
+    "aria-labelledby": any;
+    children: any;
+    onToggle: any;
+    className: any;
+    hideRailBreakpointDown: any;
+    href: any;
+    isFixedNav?: boolean | undefined;
+    isRail: any;
+    isPersistent?: boolean | undefined;
+    isTreeview: any;
+    navType?: any;
+    addFocusListeners?: boolean | undefined;
+    addMouseListeners?: boolean | undefined;
+    onOverlayClick: any;
+    onSideNavBlur: any;
+    enterDelayMs?: number | undefined;
+    isCollapsible?: boolean | undefined;
+    hideOverlay?: boolean | undefined;
+    translateWithId?: ((id: any) => string) | undefined;
+    headerOverflowPanel: any;
+}, "ref"> & React__default.RefAttributes<any>>;
+export const SideNavContext: React__default.Context<{}>;
+export const translationIds: {
+    'collapse.sidenav': string;
+    'expand.sidenav': string;
+    'enable.autoexpand': string;
+    'disable.autoexpand': string;
+};
+import React__default from 'react';

package/lib/es/components/SideNavFlyoutMenu.d.ts

@@ -0,0 +1,34 @@
+export function SideNavFlyoutMenu({ align, className: customClassName, children, label, description, enterDelayMs, leaveDelayMs, defaultOpen, dropShadow, highContrast, menuContent, selected, title, ...rest }: {
+    [x: string]: any;
+    align?: string | undefined;
+    className: any;
+    children: any;
+    label: any;
+    description: any;
+    enterDelayMs?: number | undefined;
+    leaveDelayMs?: number | undefined;
+    defaultOpen?: boolean | undefined;
+    dropShadow?: boolean | undefined;
+    highContrast?: boolean | undefined;
+    menuContent: any;
+    selected?: boolean | undefined;
+    title: any;
+}): React__default.FunctionComponentElement<import("@carbon/react").PopoverProps<React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>>>;
+export namespace SideNavFlyoutMenu {
+    namespace propTypes {
+        let align: PropTypes.Requireable<string>;
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let defaultOpen: PropTypes.Requireable<boolean>;
+        let description: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let dropShadow: PropTypes.Requireable<boolean>;
+        let enterDelayMs: PropTypes.Requireable<number>;
+        let label: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let leaveDelayMs: PropTypes.Requireable<number>;
+        let menuContent: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let selected: PropTypes.Requireable<boolean>;
+        let title: PropTypes.Requireable<string>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/SideNavItems.d.ts

@@ -0,0 +1,16 @@
+export function SideNavItems({ className: customClassName, children, isSideNavExpanded, accessibilityLabel: accessibilityLabel }: {
+    className: any;
+    children: any;
+    isSideNavExpanded: any;
+    accessibilityLabel: any;
+}): React__default.DetailedReactHTMLElement<any, HTMLElement>;
+export namespace SideNavItems {
+    let displayName: string;
+    namespace propTypes {
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let isSideNavExpanded: PropTypes.Requireable<boolean>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/SideNavLink.d.ts

@@ -0,0 +1,3 @@
+export const SideNavLink: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';
+export { SideNavLink as default };

package/lib/es/components/SideNavLinkPopover.d.ts

@@ -0,0 +1,26 @@
+export function SideNavLinkPopover({ className, children, ...rest }: {
+    [x: string]: any;
+    className: any;
+    children: any;
+}): React__default.FunctionComponentElement<import("@carbon/react").IconButtonProps & React__default.RefAttributes<unknown>>;
+export namespace SideNavLinkPopover {
+    namespace propTypes {
+        let align: PropTypes.Requireable<string>;
+        let autoAlign: PropTypes.Requireable<boolean>;
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let closeOnActivation: PropTypes.Requireable<boolean>;
+        let defaultOpen: PropTypes.Requireable<boolean>;
+        let disabled: PropTypes.Requireable<boolean>;
+        let enterDelayMs: PropTypes.Requireable<number>;
+        let href: PropTypes.Requireable<string>;
+        let isSelected: PropTypes.Requireable<boolean>;
+        let label: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        let leaveDelayMs: PropTypes.Requireable<number>;
+        let size: PropTypes.Requireable<string>;
+        let wrapperClasses: PropTypes.Requireable<string>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';
+export { SideNavLinkPopover as default };

package/lib/es/components/SideNavMenu.d.ts

@@ -0,0 +1,2 @@
+export const SideNavMenu: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';

package/lib/es/components/SideNavMenuItem.d.ts

@@ -0,0 +1,2 @@
+export const SideNavMenuItem: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';

package/lib/es/components/SideNavSlot.d.ts

@@ -0,0 +1,16 @@
+export function SideNavSlot({ children, className: customClassName, renderIcon: IconElement }: {
+    children: any;
+    className: any;
+    renderIcon: any;
+}): React__default.DetailedReactHTMLElement<{
+    className: string;
+}, HTMLElement>;
+export namespace SideNavSlot {
+    namespace propTypes {
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+        let renderIcon: PropTypes.Requireable<object>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/SideNavTitle.d.ts

@@ -0,0 +1,14 @@
+export function SideNavTitle({ children, className: customClassName }: {
+    children: any;
+    className: any;
+}): React__default.FunctionComponentElement<{
+    children?: React__default.ReactNode | undefined;
+}>;
+export namespace SideNavTitle {
+    namespace propTypes {
+        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/SideNavToggle.d.ts

@@ -0,0 +1,3 @@
+export const SideNavToggle: React__default.ForwardRefExoticComponent<React__default.RefAttributes<any>>;
+import React__default from 'react';
+export { SideNavToggle as default };

package/lib/es/components/TrialCountdown.d.ts

@@ -0,0 +1,18 @@
+export function TrialCountdown({ className, count, text, warning }: {
+    className: any;
+    count: any;
+    text?: string | undefined;
+    warning?: boolean | undefined;
+}): React__default.DetailedReactHTMLElement<{
+    className: string;
+}, HTMLElement>;
+export namespace TrialCountdown {
+    namespace propTypes {
+        let className: PropTypes.Requireable<string>;
+        let count: PropTypes.Validator<number>;
+        let text: PropTypes.Requireable<string>;
+        let warning: PropTypes.Requireable<boolean>;
+    }
+}
+import React__default from 'react';
+import PropTypes from 'prop-types';

package/lib/es/components/_utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 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 const CARBON_SIDENAV_ITEMS: string[];

package/lib/es/index.d.ts

@@ -0,0 +1,16 @@
+export { SideNavItems } from "./components/SideNavItems.js";
+export { SideNavLink } from "./components/SideNavLink.js";
+export { SideNavLinkPopover } from "./components/SideNavLinkPopover.js";
+export { SideNavMenu } from "./components/SideNavMenu.js";
+export { SideNavMenuItem } from "./components/SideNavMenuItem.js";
+export { HeaderContainer } from "./components/HeaderContainer.js";
+export { SharkFinIcon } from "./components/SharkFinIcon.js";
+export { HeaderDivider } from "./components/HeaderDivider.js";
+export { TrialCountdown } from "./components/TrialCountdown.js";
+export { Profile };
+export { HeaderOverflowPanel } from "./components/HeaderOverflowPanel.js";
+export { SideNavSlot } from "./components/SideNavSlot.js";
+export { SideNavTitle } from "./components/SideNavTitle.js";
+import * as Profile from './components/Profile.js';
+export { SIDE_NAV_TYPE, SideNav } from "./components/SideNav.js";
+export { HeaderPopover, HeaderPopoverActions, HeaderPopoverButton, HeaderPopoverContent } from "./components/HeaderPopover.js";

package/lib/es/internal/environment.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Indicate whether current execution environment can access the DOM.
+ *
+ * @see https://github.com/facebook/fbjs/blob/4d1751311d3f67af2dcce2e40df8512a23c7b9c6/packages/fbjs/src/core/ExecutionEnvironment.js#L12
+ */
+export const canUseDOM: boolean;

package/lib/es/internal/keyboard/keys.d.ts

@@ -0,0 +1,96 @@
+export namespace ArrowDown {
+    let key: string;
+    let which: number;
+    let keyCode: number;
+    let code: string;
+}
+export namespace ArrowLeft {
+    let key_1: string;
+    export { key_1 as key };
+    let which_1: number;
+    export { which_1 as which };
+    let keyCode_1: number;
+    export { keyCode_1 as keyCode };
+    let code_1: string;
+    export { code_1 as code };
+}
+export namespace ArrowRight {
+    let key_2: string;
+    export { key_2 as key };
+    let which_2: number;
+    export { which_2 as which };
+    let keyCode_2: number;
+    export { keyCode_2 as keyCode };
+    let code_2: string;
+    export { code_2 as code };
+}
+export namespace ArrowUp {
+    let key_3: string;
+    export { key_3 as key };
+    let which_3: number;
+    export { which_3 as which };
+    let keyCode_3: number;
+    export { keyCode_3 as keyCode };
+    let code_3: string;
+    export { code_3 as code };
+}
+export namespace End {
+    let key_4: string;
+    export { key_4 as key };
+    let which_4: number;
+    export { which_4 as which };
+    let keyCode_4: number;
+    export { keyCode_4 as keyCode };
+    let code_4: string;
+    export { code_4 as code };
+}
+export namespace Enter {
+    let key_5: string;
+    export { key_5 as key };
+    let which_5: number;
+    export { which_5 as which };
+    let keyCode_5: number;
+    export { keyCode_5 as keyCode };
+    let code_5: string;
+    export { code_5 as code };
+}
+export namespace Escape {
+    let key_6: string[];
+    export { key_6 as key };
+    let which_6: number;
+    export { which_6 as which };
+    let keyCode_6: number;
+    export { keyCode_6 as keyCode };
+    let code_6: string;
+    export { code_6 as code };
+}
+export namespace Home {
+    let key_7: string;
+    export { key_7 as key };
+    let which_7: number;
+    export { which_7 as which };
+    let keyCode_7: number;
+    export { keyCode_7 as keyCode };
+    let code_7: string;
+    export { code_7 as code };
+}
+export namespace Space {
+    let key_8: string;
+    export { key_8 as key };
+    let which_8: number;
+    export { which_8 as which };
+    let keyCode_8: number;
+    export { keyCode_8 as keyCode };
+    let code_8: string;
+    export { code_8 as code };
+}
+export namespace Tab {
+    let key_9: string;
+    export { key_9 as key };
+    let which_9: number;
+    export { which_9 as which };
+    let keyCode_9: number;
+    export { keyCode_9 as keyCode };
+    let code_9: string;
+    export { code_9 as code };
+}

package/lib/es/internal/keyboard/match.d.ts

@@ -0,0 +1,61 @@
+export type Key = {
+    key: Array<string> | string;
+    which: number;
+    keyCode: number;
+};
+/**
+ * Check to see if the given key matches the corresponding keyboard event. Also
+ * supports passing in the value directly if you can't used the given event.
+ *
+ * @example
+ * import * as keys from '../keys';
+ * import { matches } from '../match';
+ *
+ * function handleOnKeyDown(event) {
+ *   if (match(event, keys.Enter) {
+ *     // ...
+ *   }
+ * }
+ *
+ * @param {React.SyntheticEvent|Event|number|string} eventOrCode
+ * @param {Key} key
+ * @returns {boolean}
+ */
+export function match(eventOrCode: React.SyntheticEvent | Event | number | string, { key, which, keyCode, code }?: Key): boolean;
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Copyright IBM Corp. 2016, 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.
+ */
+/**
+ * @typedef Key
+ * @property key {Array<string>|string}
+ * @property which {number}
+ * @property keyCode {number}
+ */
+/**
+ * Check to see if at least one key code matches the key code of the
+ * given event.
+ *
+ * @example
+ * import * as keys from '../keys';
+ * import { matches } from '../match';
+ *
+ * function handleOnKeyDown(event) {
+ *   if (matches(event, [keys.Enter, keys.Space]) {
+ *     // ...
+ *   }
+ * }
+ *
+ * @param {Event|React.SyntheticEvent} event
+ * @param {Array<Key>} keysToMatch
+ * @returns {boolean}
+ */
+export function matches(event: Event | React.SyntheticEvent, keysToMatch: Array<Key>): boolean;

package/lib/es/internal/setupGetInstanceId.d.ts

@@ -0,0 +1,12 @@
+export { setupGetInstanceId as default };
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Generic utility to initialize a method that will return a unique instance id
+ * for a component.
+ */
+declare function setupGetInstanceId(): () => number;

package/lib/es/internal/useDelayedState.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Copyright IBM Corp. 2016, 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.
+ */
+/**
+ * `useDelayedState` mirrors `useState` but also allows you to add a delay to
+ * when your state updates. You can provide a second argument to `setState`,
+ * `delayMs`, which will be the time in milliseconds after which the state is
+ * updated.
+ *
+ * This hook will clean up pending timers in `useEffect` and will cancel any
+ * pending timers when a `setState` is called before the state is updated from
+ * a previous call
+ */
+export function useDelayedState(initialState: any): any[];

package/lib/es/internal/useEvent.d.ts

@@ -0,0 +1,17 @@
+export type WindowEventCallback<E extends keyof WindowEventMap> = (event: WindowEventMap[E]) => void;
+/**
+ * Copyright IBM Corp. 2016, 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.
+ */
+/**
+ * @template {keyof WindowEventMap} E
+ * @typedef {(event: WindowEventMap[E]) => void} WindowEventCallback
+ */
+/**
+ * @template {keyof WindowEventMap} E
+ * @param {E} eventName
+ * @param {WindowEventCallback<E>} callback
+ */
+export function useWindowEvent<E extends keyof WindowEventMap>(eventName: E, callback: WindowEventCallback<E>): void;

package/lib/es/internal/useId.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Generate a unique ID for React <=17 with an optional prefix prepended to it.
+ * This is an internal utility, not intended for public usage.
+ * @param {string} [prefix] the optional prefix id
+ * @returns {string}
+ */
+export function useCompatibleId(prefix?: string): string;
+/**
+ * Generate a unique ID for React >=18 with an optional prefix prepended to it.
+ * This is an internal utility, not intended for public usage.
+ * @param {string} [prefix] the optional prefix id
+ * @returns {string}
+ */
+export function useId(prefix?: string): string;

package/lib/es/internal/useIdPrefix.d.ts

@@ -0,0 +1,6 @@
+export const IdPrefixContext: React__default.Context<null>;
+/**
+ *
+ */
+export function useIdPrefix(): null;
+import React__default from 'react';

package/lib/es/internal/useMatchMedia.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 2016, 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 function useMatchMedia(mediaQueryString: any): boolean;

package/lib/es/internal/useMergedRefs.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2016, 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.
+ */
+/**
+ * Combine multiple refs into a single ref. This use useful when you have two
+ * refs from both `React.forwardRef` and `useRef` that you would like to add to
+ * the same node.
+ */
+export function useMergedRefs(refs: any): (node: any) => void;

package/lib/es/internal/usePrefix.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Copyright IBM Corp. 2016, 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 const PrefixContext: React__default.Context<string>;
+/**
+ * An internal function to return the prefix used in components and styles.
+ *
+ * @returns a react context including the prefix
+ */
+export function usePrefix(): string;
+import React__default from 'react';

package/lib/es/internal/warning.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Copyright IBM Corp. 2016, 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 function warning(condition: any, format: any, ...args: any[]): void;

package/lib/es/prop-types/AriaPropTypes.d.ts

@@ -0,0 +1 @@
+export const AriaLabelPropType: [key: string];

package/lib/es/prop-types/deprecate.d.ts

@@ -0,0 +1,2 @@
+export { deprecate as default };
+declare function deprecate(propType: any, message: any): (props: any, propName: any, componentName: any, ...rest: any[]) => any;

package/lib/es/prop-types/isRequiredOneOf.d.ts

@@ -0,0 +1,20 @@
+export { isRequiredOneOf as default };
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Copyright IBM Corp. 2016, 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.
+ */
+/**
+ * @param {[key: string]: Function)} propTypes The list of type checkers, keyed by prop names.
+ * @returns {[key: string]: Function}
+ *   The new prop type checkers that checks if one of the given props exist,
+ *   in addition to the original type checkings.
+ */
+declare function isRequiredOneOf(propTypes: any): [key: string];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carbon-labs/react-ui-shell",
-  "version": "0.85.0",
+  "version": "0.87.0",
   "publishConfig": {
     "access": "public",
     "provenance": true
@@ -42,5 +42,5 @@
   "dependencies": {
     "@ibm/telemetry-js": "^1.10.2"
   },
-  "gitHead": "e07b9ac0be185323c42826941d40632329004ee3"
+  "gitHead": "68b4b10b88ccd2c993eae3b172358c840a590808"
 }

package/scss/styles/_content.scss

@@ -5,10 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/breakpoint' as *;
+@use '@carbon/react/scss/utilities/convert' as convert;
+@use '@carbon/react/scss/motion' as *;
+@use '@carbon/react/scss/spacing' as *;
+@use '@carbon/react/scss/breakpoint' as *;
 
 $prefix: 'cds' !default;
 

package/scss/styles/_header-divider.scss

@@ -4,8 +4,8 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-@use '@carbon/styles/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/react/scss/utilities/convert' as convert;
+@use '@carbon/react/scss/theme' as *;
 
 $prefix: 'cds' !default;
 
@@ -14,4 +14,5 @@ $prefix: 'cds' !default;
   background: $border-subtle;
   block-size: convert.to-rem(24px);
   inline-size: 1px;
+  margin-inline: -1px;
 }

package/scss/styles/_header-overflow-panel.scss

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/react/scss/spacing' as *;
+@use '@carbon/react/scss/theme' as *;
 @use '@carbon/react/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/breakpoint' as *;
-@use '@carbon/styles/scss/type' as *;
+@use '@carbon/react/scss/breakpoint' as *;
+@use '@carbon/react/scss/type' as *;
 
 $prefix: 'cds' !default;
 

package/scss/styles/_header.scss

@@ -5,12 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/motion' as *;
+@use '@carbon/react/scss/spacing' as *;
+@use '@carbon/react/scss/theme' as *;
+@use '@carbon/react/scss/motion' as *;
 @use '@carbon/react/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/utilities/custom-property' as custom-property;
-@use '@carbon/styles/scss/breakpoint' as *;
+@use '@carbon/react/scss/utilities/custom-property' as custom-property;
+@use '@carbon/react/scss/utilities/z-index' as *;
+@use '@carbon/react/scss/breakpoint' as *;
 
 $prefix: 'cds' !default;
 
@@ -48,7 +49,24 @@ $prefix: 'cds' !default;
 
 .#{$prefix}--header-action.#{$prefix}--popover--open
   .#{$prefix}--header-action__button {
-  background-color: $layer;
+  z-index: z('header') + 2;
+  background-color: $background;
+  border-inline-end: 1px solid $border-subtle;
+  border-inline-start: 1px solid $border-subtle;
+}
+
+.#{$prefix}--header-action.#{$prefix}--popover--border
+  > .#{$prefix}--popover
+  > .#{$prefix}--popover-content {
+  border: 1px solid $border-subtle;
+  border-block-start: none;
+  outline: none;
+}
+
+.#{$prefix}--popover--border.#{$prefix}--header-action
+  .#{$prefix}--tooltip
+  .#{$prefix}--tooltip-content {
+  outline: none;
 }
 
 .#{$prefix}--header-action .#{$prefix}--toggletip-content {

package/scss/styles/_profile.scss

@@ -5,27 +5,20 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/type' as *;
-@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/react/scss/spacing' as *;
+@use '@carbon/react/scss/type' as *;
+@use '@carbon/react/scss/theme' as *;
 @use '@carbon/react/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/utilities/custom-property' as custom-property;
+@use '@carbon/react/scss/utilities/custom-property' as custom-property;
 @use '@carbon/ibm-products/scss/components/UserAvatar';
 
 $prefix: 'cds' !default;
 
 // profile
 
-.#{$prefix}--profile.#{$prefix}--popover--open {
-  background-color: $background;
-}
-
 .#{$prefix}--header-overflow-panel .#{$prefix}--toggletip-content,
 .#{$prefix}--profile .#{$prefix}--toggletip-content {
   padding: 0;
-  background-color: $background;
-  border-block-end: 1px solid $border-subtle;
-  border-inline-start: 1px solid $border-subtle;
   gap: 0;
   inline-size: convert.to-rem(256px);
   max-block-size: 100vh;
@@ -39,7 +32,10 @@ $prefix: 'cds' !default;
   .clabs--theme-settings {
     padding: $spacing-05;
     border-block-end: convert.to-rem(0.5px) solid $border-subtle;
-    border-block-start: convert.to-rem(0.5px) solid $border-subtle;
+
+    &:not(:first-child) {
+      border-block-start: convert.to-rem(0.5px) solid $border-subtle;
+    }
   }
 }
 
@@ -82,8 +78,3 @@ $prefix: 'cds' !default;
 .#{$prefix}--header-action__content .#{$prefix}--contained-list--on-page {
   padding: 0;
 }
-
-// TODO: remove when https://github.com/carbon-design-system/carbon/pull/19813 is released
-.#{$prefix}--header-action__content .#{$prefix}--contained-list__header {
-  display: none;
-}

package/scss/styles/_shark-fin-icon.scss

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/react/scss/theme' as *;
 
 $prefix: 'cds' !default;
 

package/scss/styles/_side-nav.scss

@@ -5,18 +5,18 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/utilities/convert' as convert;
-@use '@carbon/styles/scss/utilities/custom-property' as custom-property;
-@use '@carbon/styles/scss/utilities/button-reset' as button-reset;
-@use '@carbon/styles/scss/utilities/focus-outline' as *;
-@use '@carbon/styles/scss/breakpoint' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/type' as *;
-@use '@carbon/styles/scss/utilities/z-index' as *;
+@use '@carbon/react/scss/utilities/convert' as convert;
+@use '@carbon/react/scss/utilities/custom-property' as custom-property;
+@use '@carbon/react/scss/utilities/button-reset' as button-reset;
+@use '@carbon/react/scss/utilities/focus-outline' as *;
+@use '@carbon/react/scss/breakpoint' as *;
+@use '@carbon/react/scss/theme' as *;
+@use '@carbon/react/scss/motion' as *;
+@use '@carbon/react/scss/type' as *;
+@use '@carbon/react/scss/utilities/z-index' as *;
 @use '@carbon/styles/scss/components/ui-shell/mixins' as *;
 @use '@carbon/styles/scss/components/ui-shell/functions' as *;
-@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/react/scss/spacing' as *;
 
 $prefix: 'cds' !default;
 

package/scss/styles/_trial-countdown.scss

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/type' as *;
-@use '@carbon/styles/scss/colors' as *;
-@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/react/scss/theme' as *;
+@use '@carbon/react/scss/type' as *;
+@use '@carbon/react/scss/colors' as *;
+@use '@carbon/react/scss/spacing' as *;
 
 $prefix: 'cds' !default;
 
 :root {
-  // these should be set up as component tokens if/when moved to @carbon/styles
+  // these should be set up as component tokens if/when moved to @carbon/react
   --trial-countdown-start: #{$blue-60};
   --trial-countdown-end: #{$purple-50};
 }