@itwin/itwinui-react 3.17.0-dev.2 → 3.17.0

package/cjs/utils/icons/SvgUpload.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, 'SvgUpload', {
   },
 });
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
 const _Svg = require('./Svg.js');
 const SvgUpload = (props) =>
   _react.createElement(

package/cjs/utils/props.d.ts

@@ -15,14 +15,14 @@ export type CommonProps = {
  *   // ...
  * }) as PolymorphicForwardRefComponent<'button', ButtonOwnProps>;
  */
-export interface PolymorphicForwardRefComponent<DefaultAs, OwnProps = {}> extends React.ForwardRefExoticComponent<Merge<DefaultAs extends React.ElementType ? React.ComponentPropsWithRef<DefaultAs> : never, OwnProps & {
+export interface PolymorphicForwardRefComponent<DefaultAs, OwnProps = {}> extends React.ForwardRefExoticComponent<Merge<DefaultAs extends React.ElementType<any> ? React.ComponentPropsWithRef<DefaultAs> : never, OwnProps & {
     as?: DefaultAs;
 }>> {
-    <As = DefaultAs>(props: As extends keyof JSX.IntrinsicElements ? Merge<JSX.IntrinsicElements[As], OwnProps & {
+    <As = DefaultAs>(props: As extends keyof React.JSX.IntrinsicElements ? Merge<React.JSX.IntrinsicElements[As], OwnProps & {
         as: As;
     }> : As extends React.ComponentType<infer P> ? Merge<P, OwnProps & {
         as: As;
-    }> : never): React.ReactElement | null;
+    }> : never): React.ReactElement<any> | null;
 }
 type Merge<P1, P2> = Omit<P1, keyof P2> & P2;
 export {};

package/cjs/utils/providers/HydrationProvider.js

@@ -18,7 +18,7 @@ _export(exports, {
   },
 });
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
 const _index = require('../hooks/index.js');
 const HydrationContext = _react.createContext(false);
 const noopSubscribe = () => () => {};

package/cjs/utils/providers/ScopeProvider.d.ts

@@ -18,9 +18,9 @@ export declare const ScopeProvider: ({ children }: {
  *
  * @private
  */
-export declare const useScopedAtom: <T>(atom: Atom<T>) => readonly [Awaited<T>, (...args: unknown[]) => unknown];
+export declare const useScopedAtom: <T>(atom: Atom<T>) => readonly [Awaited<T>, (...args: T[]) => void];
 /**
  * Wrapper over `useSetAtom` that uses the store from the nearest `ScopeProvider`.
  * @private
  */
-export declare const useScopedSetAtom: <T>(atom: WritableAtom<T, unknown[], unknown>) => (...args: unknown[]) => unknown;
+export declare const useScopedSetAtom: <T>(atom: WritableAtom<T, T[], void>) => (...args: T[]) => void;

package/cjs/utils/providers/ScopeProvider.js

@@ -21,7 +21,7 @@ _export(exports, {
   },
 });
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
 const _jotai = require('jotai');
 const ScopeContext = _react.createContext({
   store: (0, _jotai.createStore)(),

package/esm/core/Alert/Alert.d.ts

@@ -52,9 +52,7 @@ export declare const Alert: PolymorphicForwardRefComponent<"div", AlertOwnProps
     /**
      * 	Alert icon subcomponent
      */
-    Icon: PolymorphicForwardRefComponent<"span", Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-        ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
-    }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
+    Icon: PolymorphicForwardRefComponent<"span", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
         size?: "auto" | "small" | "medium" | "large" | import("../../utils/types.js").AnyString;
         fill?: "default" | "positive" | "informational" | "negative" | "warning" | import("../../utils/types.js").AnyString;
         padded?: boolean;

package/esm/core/Avatar/Avatar.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { SoftBackgrounds } from '../../utils/index.js';
 import type { AnyString, PolymorphicForwardRefComponent } from '../../utils/index.js';
 export type AvatarStatus = 'online' | 'busy' | 'away' | 'offline';
@@ -25,7 +26,7 @@ type AvatarProps = {
     /**
      * User image to be displayed. Can be `<img>` or `<svg>` or anything else.
      */
-    image?: JSX.Element;
+    image?: React.JSX.Element;
     /**
      * Color of the icon. You can use `getUserColor` function to generate color from user name or email. If not provided, default background color from CSS styling will be used (hsl(72, 51%, 56%) / olive green).
      */

package/esm/core/ButtonGroup/ButtonGroup.js

@@ -6,6 +6,7 @@ import {
   CompositeItem,
   FloatingDelayGroup,
 } from '@floating-ui/react';
+import { defaultTooltipDelay } from '../Tooltip/Tooltip.js';
 export const ButtonGroupContext = React.createContext(void 0);
 export const ButtonGroup = React.forwardRef((props, forwardedRef) => {
   let {
@@ -50,10 +51,7 @@ export const ButtonGroup = React.forwardRef((props, forwardedRef) => {
   return React.createElement(
     FloatingDelayGroup,
     {
-      delay: {
-        open: 50,
-        close: 250,
-      },
+      delay: defaultTooltipDelay,
     },
     React.createElement(
       ButtonGroupContext.Provider,

package/esm/core/Buttons/Button.d.ts

@@ -15,11 +15,11 @@ export type ButtonProps = {
     /**
      * Icon shown before the main button content.
      */
-    startIcon?: JSX.Element;
+    startIcon?: React.JSX.Element;
     /**
      * Icon shown after the main button content.
      */
-    endIcon?: JSX.Element;
+    endIcon?: React.JSX.Element;
     /**
      * Passes props to the button label.
      */

package/esm/core/Buttons/DropdownButton.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { ButtonProps } from './Button.js';
 import type { DropdownMenuProps } from '../DropdownMenu/DropdownMenu.js';
 import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
@@ -7,7 +8,7 @@ export type DropdownButtonProps = {
      * Pass a function that takes the `close` argument (to close the menu),
      * and returns a list of `MenuItem` components.
      */
-    menuItems: (close: () => void) => JSX.Element[];
+    menuItems: (close: () => void) => React.JSX.Element[];
     /**
      * Style of the dropdown button.
      * Use 'borderless' to hide outline.

package/esm/core/Buttons/SplitButton.d.ts

@@ -10,7 +10,7 @@ export type SplitButtonProps = ButtonProps & {
      * Pass a function that takes the `close` argument (to close the menu),
      * and returns a list of `MenuItem` components.
      */
-    menuItems: (close: () => void) => JSX.Element[];
+    menuItems: (close: () => void) => React.JSX.Element[];
     /**
      * Placement of the dropdown menu.
      * @default 'bottom-end'

package/esm/core/Carousel/Carousel.d.ts

@@ -40,9 +40,7 @@ export declare const Carousel: PolymorphicForwardRefComponent<"section", Carouse
      * Contains the dots and previous/next buttons for navigating the slides. Must be present _before_ the slides in DOM.
      */
     Navigation: PolymorphicForwardRefComponent<"div", {}> & {
-        PreviousButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-            ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-        }, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+        PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
             isActive?: boolean;
             label?: React.ReactNode;
             labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
@@ -51,9 +49,7 @@ export declare const Carousel: PolymorphicForwardRefComponent<"section", Carouse
         } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
             as?: "button" | undefined;
         }>;
-        NextButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-            ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-        }, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+        NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
             isActive?: boolean;
             label?: React.ReactNode;
             labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;

package/esm/core/Carousel/CarouselNavigation.d.ts

@@ -7,9 +7,7 @@ import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
  * `children` can be specified to override what is shown in this navigation section.
  */
 export declare const CarouselNavigation: PolymorphicForwardRefComponent<"div", {}> & {
-    PreviousButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
@@ -18,9 +16,7 @@ export declare const CarouselNavigation: PolymorphicForwardRefComponent<"div", {
     } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
         as?: "button" | undefined;
     }>;
-    NextButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;

package/esm/core/Carousel/CarouselSlide.js

@@ -32,7 +32,7 @@ export const CarouselSlide = React.forwardRef((props, ref) => {
       'aria-roledescription': 'slide',
       tabIndex: index === currentIndex ? 0 : void 0,
       ref: refs,
-      inert: index !== currentIndex ? '' : void 0,
+      inert: index !== currentIndex ? 'true' : void 0,
       ...rest,
       onKeyDown: mergeEventHandlers(props.onKeyDown, (event) => {
         if ('ArrowLeft' === event.key || 'ArrowRight' === event.key)

package/esm/core/Carousel/CarouselSlider.js

@@ -41,7 +41,7 @@ export const CarouselSlider = React.forwardRef((props, ref) => {
       behavior: instant || !motionOk ? 'instant' : 'smooth',
     });
   };
-  let scrollTimeout = React.useRef();
+  let scrollTimeout = React.useRef(void 0);
   let handleOnScroll = React.useCallback(() => {
     if (scrollTimeout.current) getWindow()?.clearTimeout(scrollTimeout.current);
     scrollTimeout.current = getWindow()?.setTimeout(() => {

package/esm/core/Checkbox/Checkbox.js

@@ -21,8 +21,9 @@ export const Checkbox = React.forwardRef((props, ref) => {
   React.useEffect(() => {
     if (inputElementRef.current) {
       inputElementRef.current.indeterminate = indeterminate;
-      inputElementRef.current.checked =
-        !indeterminate && inputElementRef.current.checked;
+      inputElementRef.current.checked = indeterminate
+        ? false
+        : inputElementRef.current.checked;
     }
   });
   let checkbox = React.createElement(

package/esm/core/ColorPicker/ColorBuilder.js

@@ -27,7 +27,7 @@ export const ColorBuilder = React.forwardRef((props, ref) => {
     hueSliderProps,
     ...rest
   } = props;
-  let builderRef = React.useRef();
+  let builderRef = React.useRef(void 0);
   let refs = useMergedRefs(builderRef, ref);
   let {
     activeColor,

package/esm/core/ComboBox/ComboBox.d.ts

@@ -80,7 +80,7 @@ export type ComboBoxProps<T> = {
     endIconProps?: React.ComponentProps<typeof ComboBoxEndIcon>;
     /**
      * Message shown when no options are available.
-     * If `JSX.Element` is provided, it will be rendered as is and won't be wrapped with `MenuExtraContent`.
+     * If `React.JSX.Element` is provided, it will be rendered as is and won't be wrapped with `MenuExtraContent`.
      * @default 'No options found'
      */
     emptyStateMessage?: React.ReactNode;
@@ -96,7 +96,7 @@ export type ComboBoxProps<T> = {
         isFocused: boolean;
         id: string;
         index: number;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     /**
      * If enabled, virtualization is used for the scrollable dropdown list.
      * Use it if you expect a very long list of items.
@@ -128,5 +128,5 @@ export type ComboBoxProps<T> = {
  */
 export declare const ComboBox: <T>(props: ComboBoxProps<T> & {
     ref?: React.ForwardedRef<HTMLElement>;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export {};

package/esm/core/ComboBox/ComboBoxInput.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Input } from '../Input/Input.js';
 import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type ComboBoxInputProps = {
-    selectTags?: JSX.Element[];
+    selectTags?: React.JSX.Element[];
 } & React.ComponentProps<typeof Input>;
 export declare const ComboBoxInput: PolymorphicForwardRefComponent<"input", ComboBoxInputProps>;
 export {};

package/esm/core/ComboBox/ComboBoxMenuItem.d.ts

@@ -1,8 +1,20 @@
 import * as React from 'react';
-import type { MenuItemProps } from '../Menu/MenuItem.js';
-import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
-type ComboBoxMenuItemProps = MenuItemProps & {
+export declare const ComboBoxMenuItem: React.NamedExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "children" | "as" | "role" | "onClick" | "size" | "icon" | "disabled" | "value" | "startIcon" | "endIcon" | "index" | "focused" | "isSelected" | "sublabel" | "badge" | "subMenuItems"> & {
+    isSelected?: boolean;
+    disabled?: boolean;
+    value?: unknown;
+    onClick?: (value?: unknown) => void;
+    size?: "default" | "large";
+    sublabel?: React.ReactNode;
+    startIcon?: React.JSX.Element;
+    icon?: React.JSX.Element;
+    endIcon?: React.JSX.Element;
+    badge?: React.JSX.Element;
+    role?: string;
+    subMenuItems?: React.JSX.Element[];
+    children?: React.ReactNode;
+} & Pick<import("../List/ListItem.js").ListItemOwnProps, "focused"> & {
     index: number;
-};
-export declare const ComboBoxMenuItem: React.MemoExoticComponent<PolymorphicForwardRefComponent<"div", ComboBoxMenuItemProps>>;
-export {};
+} & {
+    as?: "div" | undefined;
+}>;

package/esm/core/ComboBox/helpers.d.ts

@@ -2,8 +2,8 @@ import * as React from 'react';
 import type { SelectOption } from '../Select/Select.js';
 import type { usePopover } from '../Popover/Popover.js';
 export declare const ComboBoxRefsContext: React.Context<{
-    inputRef: React.RefObject<HTMLInputElement>;
-    menuRef: React.RefObject<HTMLElement>;
+    inputRef: React.RefObject<HTMLInputElement | null>;
+    menuRef: React.RefObject<HTMLElement | null>;
     optionsExtraInfo: Record<string, {
         __originalIndex: number;
     }>;
@@ -14,7 +14,7 @@ type ComboBoxStateContextProps<T = unknown> = {
     enableVirtualization: boolean;
     filteredOptions: SelectOption<T>[];
     onClickHandler?: (prop: number) => void;
-    getMenuItem: (option: SelectOption<T>, filteredIndex?: number) => JSX.Element;
+    getMenuItem: (option: SelectOption<T>, filteredIndex?: number) => React.JSX.Element;
     focusedIndex: number;
     setFocusedIndex: React.Dispatch<React.SetStateAction<number>>;
     multiple?: boolean;

package/esm/core/Dialog/DialogContext.d.ts

@@ -83,7 +83,7 @@ export type DialogContextProps = {
     /**
      * Dialog root ref. For internal use.
      */
-    dialogRootRef?: React.RefObject<HTMLDivElement>;
+    dialogRootRef?: React.RefObject<HTMLDivElement | null>;
     /**
      * Determines the positioning of Dialog on page.
      */

package/esm/core/Dialog/DialogMain.js

@@ -35,7 +35,7 @@ export const DialogMain = React.forwardRef((props, ref) => {
   } = props;
   let { dialogRootRef } = dialogContext;
   let dialogRef = React.useRef(null);
-  let previousFocusedElement = React.useRef();
+  let previousFocusedElement = React.useRef(null);
   let [style, setStyle] = React.useState();
   let hasBeenResized = React.useRef(false);
   let originalBodyOverflow = React.useRef('');

package/esm/core/DropdownMenu/DropdownMenu.d.ts

@@ -6,7 +6,7 @@ export type DropdownMenuProps = {
      * List of menu items. Recommended to use MenuItem component.
      * You can pass function that takes argument `close` that closes the dropdown menu, or a list of MenuItems.
      */
-    menuItems: ((close: () => void) => JSX.Element[]) | JSX.Element[] | JSX.Element;
+    menuItems: ((close: () => void) => React.JSX.Element[]) | React.JSX.Element[] | React.JSX.Element;
     /**
      * ARIA role. Role of menu. For menu use 'menu', for select use 'listbox'.
      * @default 'menu'

package/esm/core/ExpandableBlock/ExpandableBlock.d.ts

@@ -103,9 +103,7 @@ export declare const ExpandableBlock: PolymorphicForwardRefComponent<"div", Expa
      *    <ExpandableBlock.EndIcon> <SvgIcon/> </ExpandableBlock.EndIcon>
      * <ExpandableBlock.Trigger/>
      */
-    EndIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-        ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
-    }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
+    EndIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
         size?: "auto" | "small" | "medium" | "large" | import("../../utils/types.js").AnyString;
         fill?: "default" | "positive" | "informational" | "negative" | "warning" | import("../../utils/types.js").AnyString;
         padded?: boolean;

package/esm/core/Header/Header.d.ts

@@ -53,7 +53,7 @@ type HeaderProps = {
      * Pass a function that takes the `close` argument (to close the menu),
      * and returns a list of `MenuItem` components.
      */
-    menuItems?: (close: () => void) => JSX.Element[];
+    menuItems?: (close: () => void) => React.JSX.Element[];
     /**
      * If true, the header height is reduced, typically used when viewing 3D content.
      * @default false

package/esm/core/Header/HeaderLogo.d.ts

@@ -1,9 +1,10 @@
+import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type HeaderLogoOwnProps = {
     /**
      * Logo shown before the main content.
      */
-    logo: JSX.Element;
+    logo: React.JSX.Element;
     /**
      * Click event handler.
      * If passed, the component will be rendered as a `<button>` rather than `<div>`.

package/esm/core/InputWithDecorations/InputWithDecorations.d.ts

@@ -15,9 +15,7 @@ import type { InputProps } from '../Input/Input.js';
  *    </InputWithDecorations.Icon>
  * </InputWithDecorations>
  */
-export declare const InputWithDecorations: PolymorphicForwardRefComponent<"div", Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "as" | keyof import("../../utils/index.js").InputFlexContainerProps> & import("../../utils/index.js").InputFlexContainerProps & {
+export declare const InputWithDecorations: PolymorphicForwardRefComponent<"div", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "as" | keyof import("../../utils/index.js").InputFlexContainerProps> & import("../../utils/index.js").InputFlexContainerProps & {
     as?: "div" | undefined;
 }> & {
     /**
@@ -30,9 +28,7 @@ export declare const InputWithDecorations: PolymorphicForwardRefComponent<"div",
      * Although similar to `IconButton`, this subcomponent additionally collapses the padding between the button and the input/textarea
      * in `InputWithDecorations`.
      */
-    Button: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & Omit<import("../Buttons/IconButton.js").IconButtonProps, "styleType"> & {
+    Button: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & Omit<import("../Buttons/IconButton.js").IconButtonProps, "styleType"> & {
         styleType?: import("../Buttons/IconButton.js").IconButtonProps["styleType"];
     } & {
         as?: "button" | undefined;

package/esm/core/Label/Label.js

@@ -22,7 +22,7 @@ export const Label = React.forwardRef((props, forwardedRef) => {
         },
         className,
       ),
-      'data-iui-disabled': !!disabled || void 0,
+      'data-iui-disabled': disabled ? true : void 0,
       ref: forwardedRef,
       ...rest,
     },

package/esm/core/LabeledInput/LabeledInput.d.ts

@@ -19,7 +19,7 @@ export type LabeledInputProps = {
     /**
      * Custom svg icon. Will override status icon if specified.
      */
-    svgIcon?: JSX.Element | null;
+    svgIcon?: React.JSX.Element | null;
     /**
      * Pass props to wrapper element.
      */

package/esm/core/LabeledSelect/LabeledSelect.d.ts

@@ -38,7 +38,7 @@ export type LabeledSelectProps<T> = {
      *
      * Custom svg icon. Will override status icon if specified.
      */
-    svgIcon?: JSX.Element;
+    svgIcon?: React.JSX.Element;
     /**
      * If true, shows a red asterisk.
      *
@@ -104,4 +104,4 @@ export type LabeledSelectProps<T> = {
  */
 export declare const LabeledSelect: <T>(props: LabeledSelectProps<T> & {
     ref?: React.ForwardedRef<HTMLElement>;
-}) => JSX.Element;
+}) => React.JSX.Element;

package/esm/core/List/List.d.ts

@@ -1 +1,2 @@
-export declare const List: import("../../utils/props.js").PolymorphicForwardRefComponent<"div", {}>;
+import { type PolymorphicForwardRefComponent } from '../../utils/index.js';
+export declare const List: PolymorphicForwardRefComponent<"div">;

package/esm/core/List/List.js

@@ -1,4 +1,21 @@
-import { polymorphic } from '../../utils/index.js';
-export const List = polymorphic.div('iui-list', {
-  role: 'list',
+import * as React from 'react';
+import { Box } from '../../utils/index.js';
+import { FloatingDelayGroup } from '@floating-ui/react';
+import { defaultTooltipDelay } from '../Tooltip/Tooltip.js';
+import cx from 'classnames';
+export const List = React.forwardRef((props, ref) => {
+  let { className, ...rest } = props;
+  return React.createElement(
+    FloatingDelayGroup,
+    {
+      delay: defaultTooltipDelay,
+    },
+    React.createElement(Box, {
+      as: 'div',
+      ref: ref,
+      role: 'list',
+      ...rest,
+      className: cx('iui-list', className),
+    }),
+  );
 });

package/esm/core/Menu/MenuItem.d.ts

@@ -32,21 +32,21 @@ export type MenuItemProps = {
     /**
      * SVG icon component shown on the left.
      */
-    startIcon?: JSX.Element;
+    startIcon?: React.JSX.Element;
     /**
      * @deprecated Use startIcon.
      * SVG icon component shown on the left.
      */
-    icon?: JSX.Element;
+    icon?: React.JSX.Element;
     /**
      * SVG icon component shown on the right.
      */
-    endIcon?: JSX.Element;
+    endIcon?: React.JSX.Element;
     /**
      * @deprecated Use endIcon.
      * SVG icon component shown on the right.
      */
-    badge?: JSX.Element;
+    badge?: React.JSX.Element;
     /**
      * ARIA role. For menu item use 'menuitem', for select item use 'option'.
      * @default 'menuitem'
@@ -55,7 +55,7 @@ export type MenuItemProps = {
     /**
      * Items to be shown in the submenu when hovered over the item.
      */
-    subMenuItems?: JSX.Element[];
+    subMenuItems?: React.JSX.Element[];
     /**
      * Content of the menu item.
      */

package/esm/core/Overlay/Overlay.js

@@ -17,7 +17,7 @@ let OverlayHiddenContent = React.forwardRef((props, ref) => {
   return React.createElement(
     Box,
     {
-      inert: '',
+      inert: 'true',
       ref: ref,
       ...rest,
     },

package/esm/core/Panels/Panels.d.ts

@@ -46,7 +46,7 @@ type PanelProps = {
 };
 type PanelTriggerProps = {
     for: string;
-    children: React.ReactElement;
+    children: React.ReactElement<any>;
 };
 type PanelHeaderProps = {
     titleProps?: React.ComponentProps<typeof Text>;
@@ -134,7 +134,7 @@ export declare const Panels: {
      * </ListItem>
      */
     Trigger: {
-        (props: PanelTriggerProps): string | number | true | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null;
+        (props: PanelTriggerProps): string | number | bigint | true | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null;
         displayName: string;
     };
     /**

package/esm/core/Panels/Panels.js

@@ -132,7 +132,7 @@ let Panel = React.forwardRef((props, forwardedRef) => {
           className: cx('iui-panel', className),
           'aria-labelledby': `${id}-header-title`,
           role: 'group',
-          inert: isInert ? '' : void 0,
+          inert: isInert ? 'true' : void 0,
           'data-iui-transitioning': isTransitioning ? 'true' : void 0,
           ...rest,
         },

package/esm/core/Popover/Popover.d.ts

@@ -142,7 +142,7 @@ export declare const usePopover: (options: PopoverOptions & PopoverInternalProps
         events: import("@floating-ui/react").FloatingEvents;
         dataRef: React.MutableRefObject<import("@floating-ui/react").ContextData>;
         nodeId: string | undefined;
-        floatingId: string;
+        floatingId: string | undefined;
         refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
         elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
     };

package/esm/core/Popover/Popover.js

@@ -321,7 +321,7 @@ let PopoverPortal = ({ children, portal = true }) => {
     FloatingPortal,
     {
       key: portalTo?.id,
-      root: portalTo,
+      root: portalTo ?? void 0,
     },
     React.createElement(DisplayContents, null),
     children,

package/esm/core/RadioTiles/RadioTile.d.ts

@@ -4,7 +4,7 @@ type RadioTileProps = {
     /**
      * Icon to be used.
      */
-    icon?: JSX.Element;
+    icon?: React.JSX.Element;
     /**
      * Label of the Radio tile.
      */