@itwin/itwinui-react 3.0.0-dev.2 → 3.0.0-dev.4

package/cjs/core/Toast/Toaster.js

@@ -22,132 +22,107 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToasterStateContext = exports.ToastProvider = exports.Toaster = exports.useToaster = void 0;
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 const React = __importStar(require("react"));
-const ReactDOM = __importStar(require("react-dom"));
+const classnames_1 = __importDefault(require("classnames"));
 const index_js_1 = require("../utils/index.js");
-const ToastWrapper_js_1 = require("./ToastWrapper.js");
-const TOASTS_CONTAINER_ID = 'iui-toasts-container';
-class Toaster {
-    constructor() {
-        this.toasts = [];
-        this.lastId = 0;
-        this.settings = {
-            order: 'descending',
+const Toast_js_1 = require("./Toast.js");
+// ----------------------------------------------------------------------------
+const useToaster = () => {
+    const dispatch = (0, index_js_1.useSafeContext)(ToasterDispatchContext);
+    const showToast = React.useCallback((category) => (content, options) => {
+        const id = nextId();
+        dispatch({
+            type: 'add',
+            toast: { ...options, id, content, category },
+        });
+        return { close: () => dispatch({ type: 'remove', id }) };
+    }, [dispatch]);
+    return {
+        positive: showToast('positive'),
+        informational: showToast('informational'),
+        negative: showToast('negative'),
+        warning: showToast('warning'),
+        closeAll: () => {
+            dispatch({ type: 'close-all' });
+        },
+        setSettings: (settings) => {
+            dispatch({ type: 'settings', settings });
+        },
+    };
+};
+exports.useToaster = useToaster;
+// ----------------------------------------------------------------------------
+const Toaster = () => {
+    const { toasts, settings } = (0, index_js_1.useSafeContext)(exports.ToasterStateContext);
+    return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)(`iui-toast-wrapper`, `iui-placement-${settings.placement}`) }, toasts.map((toastProps) => {
+        return React.createElement(Toast_js_1.Toast, { key: toastProps.id, ...toastProps });
+    })));
+};
+exports.Toaster = Toaster;
+// ----------------------------------------------------------------------------
+const ToastProvider = ({ children }) => {
+    const [toasterState, dispatch] = React.useReducer(toastReducer, {
+        toasts: [],
+        settings: {
+            order: 'auto',
             placement: 'top',
+        },
+    });
+    return (React.createElement(ToasterDispatchContext.Provider, { value: dispatch },
+        React.createElement(exports.ToasterStateContext.Provider, { value: toasterState }, children)));
+};
+exports.ToastProvider = ToastProvider;
+const toastReducer = (state, action) => {
+    if (action.type === 'add') {
+        let order = state.settings.order;
+        if (order === 'auto') {
+            order = state.settings.placement.startsWith('top')
+                ? 'descending'
+                : 'ascending';
+        }
+        return {
+            ...state,
+            toasts: [
+                ...(order === 'ascending' ? state.toasts : []),
+                action.toast,
+                ...(order === 'descending' ? state.toasts : []),
+            ],
         };
-        this.toastsRef = React.createRef();
-        this.isInitialized = false;
-        // Create container on demand.
-        // Cannot do it in constructor, because SSG/SSR apps would fail.
-        this.asyncInit = async () => {
-            if (this.isInitialized) {
-                return;
-            }
-            const container = (0, index_js_1.getContainer)(TOASTS_CONTAINER_ID) ?? (0, index_js_1.getDocument)()?.body;
-            if (!container) {
-                return;
-            }
-            this.isInitialized = true;
-            const toastWrapper = React.createElement(ToastWrapper_js_1.ToastWrapper, { ref: this.toastsRef });
-            const _ReactDOM = ReactDOM; // eslint-disable-line @typescript-eslint/no-explicit-any
-            // v18 mode
-            if (_ReactDOM.createRoot) {
-                const _ReactDOMInternals = _ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-                // suppress warning about importing createRoot from react-dom/client
-                if (_ReactDOMInternals) {
-                    _ReactDOMInternals.usingClientEntryPoint = true;
-                }
-                const root = _ReactDOM.createRoot(container);
-                root.render(toastWrapper);
-                // revert suppression, not to influence users app
-                if (_ReactDOMInternals) {
-                    _ReactDOMInternals.usingClientEntryPoint = false;
-                }
-            }
-            else {
-                // v17 and before
-                ReactDOM.render(toastWrapper, container);
-            }
-        };
-    }
-    /**
-     * Set global Toaster settings for toasts order and placement.
-     * Settings will be applied to new toasts on the page.
-     */
-    setSettings(newSettings) {
-        newSettings.placement ?? (newSettings.placement = this.settings.placement);
-        newSettings.order ?? (newSettings.order = newSettings.placement?.startsWith('bottom')
-            ? 'ascending'
-            : 'descending');
-        this.settings = newSettings;
-        this.asyncInit().then(() => {
-            this.toastsRef.current?.setPlacement(this.settings.placement ?? 'top');
-        });
-    }
-    positive(content, options) {
-        return this.createToast(content, 'positive', options);
-    }
-    informational(content, options) {
-        return this.createToast(content, 'informational', options);
     }
-    negative(content, options) {
-        return this.createToast(content, 'negative', options);
-    }
-    warning(content, options) {
-        return this.createToast(content, 'warning', options);
-    }
-    createToast(content, category, options) {
-        ++this.lastId;
-        const currentId = this.lastId;
-        this.toasts = [
-            ...(this.settings.order === 'ascending' ? this.toasts : []),
-            {
-                ...options,
-                content,
-                category,
-                onRemove: () => {
-                    this.removeToast(currentId);
-                    options?.onRemove?.();
-                },
-                id: currentId,
-                isVisible: true,
-            },
-            ...(this.settings.order === 'descending' ? this.toasts : []),
-        ];
-        this.updateView();
-        return { close: () => this.closeToast(currentId) };
-    }
-    removeToast(id) {
-        this.toasts = this.toasts.filter((toast) => toast.id !== id);
-        this.updateView();
-    }
-    updateView() {
-        this.asyncInit().then(() => {
-            this.toastsRef.current?.setToasts(this.toasts);
-        });
+    if (action.type === 'remove') {
+        return {
+            ...state,
+            toasts: state.toasts.filter((toast) => toast.id !== action.id),
+        };
     }
-    closeToast(toastId) {
-        this.toasts = this.toasts.map((toast) => {
-            return {
-                ...toast,
-                isVisible: toast.id !== toastId,
-            };
-        });
-        this.updateView();
+    if (action.type === 'close-all') {
+        return {
+            ...state,
+            toasts: state.toasts.map((toast) => ({ ...toast, isVisible: false })),
+        };
     }
-    closeAll() {
-        this.toasts = this.toasts.map((toast) => {
-            return {
-                ...toast,
-                isVisible: false,
-            };
-        });
-        this.updateView();
+    if (action.type === 'settings') {
+        return { ...state, settings: { ...state.settings, ...action.settings } };
     }
-}
-exports.default = Toaster;
+    return state;
+};
+// ----------------------------------------------------------------------------
+exports.ToasterStateContext = React.createContext(undefined);
+exports.ToasterStateContext.displayName = 'ToasterStateContext';
+// ----------------------------------------------------------------------------
+const ToasterDispatchContext = React.createContext(undefined);
+ToasterDispatchContext.displayName = 'ToasterDispatchContext';
+// ----------------------------------------------------------------------------
+const nextId = (() => {
+    let count = 0;
+    return () => ++count;
+})();

package/cjs/core/Toast/index.d.ts

@@ -1,4 +1 @@
-import Toaster from './Toaster.js';
-export type { ToastOptions } from './Toaster.js';
-declare const toaster: Toaster;
-export default toaster;
+export { useToaster } from './Toaster.js';

package/cjs/core/Toast/index.js

@@ -1,12 +1,9 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.useToaster = void 0;
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-const Toaster_js_1 = __importDefault(require("./Toaster.js"));
-const toaster = new Toaster_js_1.default();
-exports.default = toaster;
+var Toaster_js_1 = require("./Toaster.js");
+Object.defineProperty(exports, "useToaster", { enumerable: true, get: function () { return Toaster_js_1.useToaster; } });

package/cjs/core/Tooltip/Tooltip.d.ts

@@ -1,6 +1,49 @@
 import * as React from 'react';
-import type { CommonProps, PopoverProps } from '../utils/index.js';
-export declare type TooltipProps = {
+import type { Placement } from '@floating-ui/react';
+import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+declare type TooltipOptions = {
+    /**
+     * Placement of the Tooltip
+     * @default 'top'
+     */
+    placement?: Placement;
+    /**
+     * Property for manual visibility control
+     */
+    visible?: boolean;
+    /**
+     * autoUpdate options that recalculates position
+     * to ensure the floating element remains anchored
+     * to its reference element, such as when scrolling
+     * and resizing the screen
+     *
+     * https://floating-ui.com/docs/autoUpdate#options
+     */
+    autoUpdateOptions?: {
+        ancestorScroll?: boolean;
+        ancestorResize?: boolean;
+        elementResize?: boolean;
+        /**
+         * Use this if you want Tooltip to follow moving trigger element
+         */
+        animationFrame?: boolean;
+        layoutShift?: boolean;
+    };
+    /**
+     * Tooltip middleware options.
+     * https://floating-ui.com/docs/offset
+     */
+    middleware?: {
+        offset?: number;
+        flip?: boolean;
+        shift?: boolean;
+        size?: boolean;
+        autoPlacement?: boolean;
+        hide?: boolean;
+        inline?: boolean;
+    };
+};
+declare type TooltipOwnProps = {
     /**
      * Content of the tooltip.
      */
@@ -9,18 +52,35 @@ export declare type TooltipProps = {
      * Element to have tooltip on. Has to be a valid JSX element and needs to forward its ref.
      * If not specified, the `reference` prop should be used instead.
      */
-    children?: JSX.Element;
-} & Omit<PopoverProps, 'className'> & Omit<CommonProps, 'title'>;
+    children?: React.ReactNode;
+    /**
+     * Element to portal tooltip to.
+     * Portals to ThemeProvider portalContainerRef by default.
+     * @default true;
+     */
+    portal?: boolean | {
+        to: HTMLElement;
+    };
+    /**
+     * Sets reference point to user provided element.
+     * @example
+     * const buttonRef = React.useRef();
+     * ...
+     * <Button ref={buttonRef} />
+     * <Tooltip content='tooltip text' reference={buttonRef} />
+     */
+    reference?: React.RefObject<HTMLElement>;
+};
 /**
  * Basic tooltip component to display informative content when an element is hovered or focused.
- * Uses the {@link Popover} component, which is a wrapper around [tippy.js](https://atomiks.github.io/tippyjs).
+ * Uses [FloatingUI](https://floating-ui.com/).
  * @example
- * <Tooltip content='tooltip text' placement='top'><div>Hover here</div></Tooltip>
+ * <Tooltip content='tooltip text' placement='top'>Hover here</Tooltip>
  * @example
  * const buttonRef = React.useRef();
  * ...
  * <Button ref={buttonRef} />
  * <Tooltip content='tooltip text' reference={buttonRef} />
  */
-export declare const Tooltip: (props: TooltipProps) => JSX.Element;
+export declare const Tooltip: PolymorphicForwardRefComponent<"div", TooltipOwnProps & TooltipOptions>;
 export default Tooltip;

package/cjs/core/Tooltip/Tooltip.js

@@ -33,21 +33,110 @@ exports.Tooltip = void 0;
  *--------------------------------------------------------------------------------------------*/
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("@floating-ui/react");
 const index_js_1 = require("../utils/index.js");
+const react_dom_1 = __importDefault(require("react-dom"));
+const useTooltip = (options = {}) => {
+    const { placement, visible: controlledOpen, middleware = {
+        flip: true,
+        shift: true,
+    }, autoUpdateOptions = {}, } = options;
+    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);
+    const open = controlledOpen ?? uncontrolledOpen;
+    const data = (0, react_1.useFloating)({
+        placement,
+        open,
+        onOpenChange: setUncontrolledOpen,
+        whileElementsMounted: (referenceEl, floatingEl, update) => (0, react_1.autoUpdate)(referenceEl, floatingEl, update, {
+            animationFrame: autoUpdateOptions.animationFrame,
+            ancestorScroll: autoUpdateOptions.ancestorScroll,
+            ancestorResize: autoUpdateOptions.ancestorResize,
+            elementResize: autoUpdateOptions.elementResize,
+            layoutShift: autoUpdateOptions.layoutShift,
+        }),
+        middleware: [
+            middleware.offset !== undefined ? (0, react_1.offset)(middleware.offset) : (0, react_1.offset)(4),
+            middleware.flip && (0, react_1.flip)(),
+            middleware.shift && (0, react_1.shift)(),
+            middleware.size && (0, react_1.size)(),
+            middleware.autoPlacement && (0, react_1.autoPlacement)(),
+            middleware.inline && (0, react_1.inline)(),
+            middleware.hide && (0, react_1.hide)(),
+        ].filter(Boolean),
+    });
+    const context = data.context;
+    const hover = (0, react_1.useHover)(context, {
+        enabled: controlledOpen == null,
+        delay: {
+            open: 50,
+            close: 250,
+        },
+        handleClose: (0, react_1.safePolygon)({ buffer: -Infinity }),
+    });
+    const focus = (0, react_1.useFocus)(context, {
+        enabled: controlledOpen == null,
+    });
+    const click = (0, react_1.useClick)(context, {
+        enabled: controlledOpen == null,
+    });
+    const dismiss = (0, react_1.useDismiss)(context, {
+        enabled: controlledOpen == null,
+    });
+    const role = (0, react_1.useRole)(context, { role: 'tooltip' });
+    const interactions = (0, react_1.useInteractions)([click, hover, focus, dismiss, role]);
+    return React.useMemo(() => ({
+        open,
+        setUncontrolledOpen,
+        ...interactions,
+        ...data,
+    }), [open, interactions, data]);
+};
 /**
  * Basic tooltip component to display informative content when an element is hovered or focused.
- * Uses the {@link Popover} component, which is a wrapper around [tippy.js](https://atomiks.github.io/tippyjs).
+ * Uses [FloatingUI](https://floating-ui.com/).
  * @example
- * <Tooltip content='tooltip text' placement='top'><div>Hover here</div></Tooltip>
+ * <Tooltip content='tooltip text' placement='top'>Hover here</Tooltip>
  * @example
  * const buttonRef = React.useRef();
  * ...
  * <Button ref={buttonRef} />
  * <Tooltip content='tooltip text' reference={buttonRef} />
  */
-const Tooltip = (props) => {
-    const { content, children, className, style, visible, ref, id, ...rest } = props;
-    return (React.createElement(index_js_1.Popover, { visible: visible, interactive: false, content: React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-tooltip', className), style: style, role: 'tooltip', id: id }, content), offset: [0, 4], ref: ref, ...rest }, children && React.cloneElement(children, { title: undefined })));
-};
-exports.Tooltip = Tooltip;
+exports.Tooltip = React.forwardRef((props, forwardRef) => {
+    const { content, children, portal = true, placement = 'top', autoUpdateOptions, middleware, style, className, visible, reference, ...rest } = props;
+    const tooltip = useTooltip({
+        placement,
+        visible,
+        autoUpdateOptions,
+        middleware,
+    });
+    const context = (0, index_js_1.useGlobals)();
+    React.useEffect(() => {
+        if (reference) {
+            tooltip.refs.setReference(reference.current);
+        }
+    }, [reference, tooltip.refs]);
+    const portalTo = typeof portal !== 'boolean'
+        ? portal.to
+        : portal
+            ? context?.portalContainerRef?.current ?? (0, index_js_1.getDocument)()?.body
+            : null;
+    const contentBox = (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-tooltip', className), ref: (0, index_js_1.useMergedRefs)(tooltip.refs.setFloating, forwardRef), style: { ...tooltip.floatingStyles, ...style }, ...tooltip.getFloatingProps(), ...rest }, content));
+    const childrenRef = React.isValidElement(children) &&
+        (0, index_js_1.mergeRefs)(tooltip.refs.setReference, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        children.ref);
+    return (React.createElement(React.Fragment, null,
+        React.isValidElement(children)
+            ? React.cloneElement(children, tooltip.getReferenceProps({
+                ref: childrenRef,
+                ...children.props,
+            }))
+            : null,
+        tooltip.open
+            ? portalTo
+                ? react_dom_1.default.createPortal(contentBox, portalTo)
+                : contentBox
+            : null));
+});
 exports.default = exports.Tooltip;

package/cjs/core/index.d.ts

@@ -1,6 +1,6 @@
 export { Alert } from './Alert/index.js';
-export { Avatar, UserIcon } from './Avatar/index.js';
-export { AvatarGroup, UserIconGroup } from './AvatarGroup/index.js';
+export { Avatar } from './Avatar/index.js';
+export { AvatarGroup } from './AvatarGroup/index.js';
 export { Backdrop } from './Backdrop/index.js';
 export { Badge } from './Badge/index.js';
 export { Breadcrumbs } from './Breadcrumbs/index.js';
@@ -23,7 +23,7 @@ export type { FooterElement, TitleTranslations } from './Footer/index.js';
 export { Header, HeaderBreadcrumbs, HeaderButton, HeaderLogo, } from './Header/index.js';
 export { List, ListItem } from './List/index.js';
 export { TransferList } from './TransferList/index.js';
-export { VerticalTabs, Tabs, Tab, HorizontalTabs } from './Tabs/index.js';
+export { Tabs, Tab } from './Tabs/index.js';
 export { InformationPanel, InformationPanelWrapper, InformationPanelHeader, InformationPanelBody, InformationPanelContent, } from './InformationPanel/index.js';
 export { Input } from './Input/index.js';
 export { Label } from './Label/index.js';
@@ -51,8 +51,7 @@ export { Textarea } from './Textarea/index.js';
 export { Tile } from './Tile/index.js';
 export { TimePicker } from './TimePicker/index.js';
 export type { MeridiemType } from './TimePicker/index.js';
-export { default as toaster } from './Toast/index.js';
-export type { ToastOptions } from './Toast/index.js';
+export { useToaster } from './Toast/index.js';
 export { ThemeProvider } from './ThemeProvider/index.js';
 export type { ThemeType } from './ThemeProvider/index.js';
 export { ToggleSwitch } from './ToggleSwitch/index.js';
@@ -60,7 +59,7 @@ export { Tooltip } from './Tooltip/index.js';
 export { Tree, TreeNode, TreeNodeExpander } from './Tree/index.js';
 export type { NodeData, NodeRenderProps } from './Tree/index.js';
 export { Anchor, Blockquote, Code, Kbd, KbdKeys, Text, } from './Typography/index.js';
-export { Wizard, Stepper, WorkflowDiagram } from './Stepper/index.js';
-export type { StepProperties, WizardType, WizardLocalization, StepperLocalization, } from './Stepper/index.js';
+export { Stepper, WorkflowDiagram } from './Stepper/index.js';
+export type { StepProperties, StepperLocalization } from './Stepper/index.js';
 export { SearchBox } from './SearchBox/index.js';
 export { getUserColor, ColorValue, MiddleTextTruncation, LinkBox, LinkAction, Icon, Flex, VisuallyHidden, Divider, } from './utils/index.js';

package/cjs/core/index.js

@@ -1,11 +1,8 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InformationPanelHeader = exports.InformationPanelWrapper = exports.InformationPanel = exports.HorizontalTabs = exports.Tab = exports.Tabs = exports.VerticalTabs = exports.TransferList = exports.ListItem = exports.List = exports.HeaderLogo = exports.HeaderButton = exports.HeaderBreadcrumbs = exports.Header = exports.defaultFooterElements = exports.Footer = exports.FileEmptyCard = exports.FileUploadCard = exports.FileUploadTemplate = exports.FileUpload = exports.Fieldset = exports.ExpandableBlock = exports.NonIdealState = exports.ErrorPage = exports.DropdownMenu = exports.Dialog = exports.generateLocalizedStrings = exports.DatePicker = exports.ComboBox = exports.ColorPalette = exports.ColorInputPanel = exports.ColorBuilder = exports.ColorSwatch = exports.ColorPicker = exports.Checkbox = exports.Carousel = exports.ButtonGroup = exports.SplitButton = exports.IdeasButton = exports.IconButton = exports.DropdownButton = exports.Button = exports.Breadcrumbs = exports.Badge = exports.Backdrop = exports.UserIconGroup = exports.AvatarGroup = exports.UserIcon = exports.Avatar = exports.Alert = void 0;
-exports.Tooltip = exports.ToggleSwitch = exports.ThemeProvider = exports.toaster = exports.TimePicker = exports.Tile = exports.Textarea = exports.TagContainer = exports.Tag = exports.SelectionColumn = exports.ExpanderColumn = exports.ActionColumn = exports.TablePaginator = exports.EditableCell = exports.DefaultCell = exports.FilterButtonBar = exports.BaseFilter = exports.tableFilters = exports.Table = exports.Surface = exports.StatusMessage = exports.Slider = exports.SkipToContentLink = exports.SidenavSubmenuHeader = exports.SidenavSubmenu = exports.SidenavButton = exports.SideNavigation = exports.Select = exports.RadioTileGroup = exports.RadioTile = exports.Radio = exports.ProgressRadial = exports.ProgressLinear = exports.NotificationMarker = exports.ModalContent = exports.ModalButtonBar = exports.Modal = exports.MenuItemSkeleton = exports.MenuExtraContent = exports.MenuDivider = exports.MenuItem = exports.Menu = exports.LabeledTextarea = exports.LabeledSelect = exports.InputGroup = exports.LabeledInput = exports.Label = exports.Input = exports.InformationPanelContent = exports.InformationPanelBody = void 0;
-exports.Divider = exports.VisuallyHidden = exports.Flex = exports.Icon = exports.LinkAction = exports.LinkBox = exports.MiddleTextTruncation = exports.ColorValue = exports.getUserColor = exports.SearchBox = exports.WorkflowDiagram = exports.Stepper = exports.Wizard = exports.Text = exports.KbdKeys = exports.Kbd = exports.Code = exports.Blockquote = exports.Anchor = exports.TreeNodeExpander = exports.TreeNode = exports.Tree = void 0;
+exports.Label = exports.Input = exports.InformationPanelContent = exports.InformationPanelBody = exports.InformationPanelHeader = exports.InformationPanelWrapper = exports.InformationPanel = exports.Tab = exports.Tabs = exports.TransferList = exports.ListItem = exports.List = exports.HeaderLogo = exports.HeaderButton = exports.HeaderBreadcrumbs = exports.Header = exports.defaultFooterElements = exports.Footer = exports.FileEmptyCard = exports.FileUploadCard = exports.FileUploadTemplate = exports.FileUpload = exports.Fieldset = exports.ExpandableBlock = exports.NonIdealState = exports.ErrorPage = exports.DropdownMenu = exports.Dialog = exports.generateLocalizedStrings = exports.DatePicker = exports.ComboBox = exports.ColorPalette = exports.ColorInputPanel = exports.ColorBuilder = exports.ColorSwatch = exports.ColorPicker = exports.Checkbox = exports.Carousel = exports.ButtonGroup = exports.SplitButton = exports.IdeasButton = exports.IconButton = exports.DropdownButton = exports.Button = exports.Breadcrumbs = exports.Badge = exports.Backdrop = exports.AvatarGroup = exports.Avatar = exports.Alert = void 0;
+exports.Anchor = exports.TreeNodeExpander = exports.TreeNode = exports.Tree = exports.Tooltip = exports.ToggleSwitch = exports.ThemeProvider = exports.useToaster = exports.TimePicker = exports.Tile = exports.Textarea = exports.TagContainer = exports.Tag = exports.SelectionColumn = exports.ExpanderColumn = exports.ActionColumn = exports.TablePaginator = exports.EditableCell = exports.DefaultCell = exports.FilterButtonBar = exports.BaseFilter = exports.tableFilters = exports.Table = exports.Surface = exports.StatusMessage = exports.Slider = exports.SkipToContentLink = exports.SidenavSubmenuHeader = exports.SidenavSubmenu = exports.SidenavButton = exports.SideNavigation = exports.Select = exports.RadioTileGroup = exports.RadioTile = exports.Radio = exports.ProgressRadial = exports.ProgressLinear = exports.NotificationMarker = exports.ModalContent = exports.ModalButtonBar = exports.Modal = exports.MenuItemSkeleton = exports.MenuExtraContent = exports.MenuDivider = exports.MenuItem = exports.Menu = exports.LabeledTextarea = exports.LabeledSelect = exports.InputGroup = exports.LabeledInput = void 0;
+exports.Divider = exports.VisuallyHidden = exports.Flex = exports.Icon = exports.LinkAction = exports.LinkBox = exports.MiddleTextTruncation = exports.ColorValue = exports.getUserColor = exports.SearchBox = exports.WorkflowDiagram = exports.Stepper = exports.Text = exports.KbdKeys = exports.Kbd = exports.Code = exports.Blockquote = void 0;
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
@@ -14,10 +11,8 @@ var index_js_1 = require("./Alert/index.js");
 Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return index_js_1.Alert; } });
 var index_js_2 = require("./Avatar/index.js");
 Object.defineProperty(exports, "Avatar", { enumerable: true, get: function () { return index_js_2.Avatar; } });
-Object.defineProperty(exports, "UserIcon", { enumerable: true, get: function () { return index_js_2.UserIcon; } });
 var index_js_3 = require("./AvatarGroup/index.js");
 Object.defineProperty(exports, "AvatarGroup", { enumerable: true, get: function () { return index_js_3.AvatarGroup; } });
-Object.defineProperty(exports, "UserIconGroup", { enumerable: true, get: function () { return index_js_3.UserIconGroup; } });
 var index_js_4 = require("./Backdrop/index.js");
 Object.defineProperty(exports, "Backdrop", { enumerable: true, get: function () { return index_js_4.Backdrop; } });
 var index_js_5 = require("./Badge/index.js");
@@ -77,10 +72,8 @@ Object.defineProperty(exports, "ListItem", { enumerable: true, get: function ()
 var index_js_23 = require("./TransferList/index.js");
 Object.defineProperty(exports, "TransferList", { enumerable: true, get: function () { return index_js_23.TransferList; } });
 var index_js_24 = require("./Tabs/index.js");
-Object.defineProperty(exports, "VerticalTabs", { enumerable: true, get: function () { return index_js_24.VerticalTabs; } });
 Object.defineProperty(exports, "Tabs", { enumerable: true, get: function () { return index_js_24.Tabs; } });
 Object.defineProperty(exports, "Tab", { enumerable: true, get: function () { return index_js_24.Tab; } });
-Object.defineProperty(exports, "HorizontalTabs", { enumerable: true, get: function () { return index_js_24.HorizontalTabs; } });
 var index_js_25 = require("./InformationPanel/index.js");
 Object.defineProperty(exports, "InformationPanel", { enumerable: true, get: function () { return index_js_25.InformationPanel; } });
 Object.defineProperty(exports, "InformationPanelWrapper", { enumerable: true, get: function () { return index_js_25.InformationPanelWrapper; } });
@@ -155,7 +148,7 @@ Object.defineProperty(exports, "Tile", { enumerable: true, get: function () { re
 var index_js_48 = require("./TimePicker/index.js");
 Object.defineProperty(exports, "TimePicker", { enumerable: true, get: function () { return index_js_48.TimePicker; } });
 var index_js_49 = require("./Toast/index.js");
-Object.defineProperty(exports, "toaster", { enumerable: true, get: function () { return __importDefault(index_js_49).default; } });
+Object.defineProperty(exports, "useToaster", { enumerable: true, get: function () { return index_js_49.useToaster; } });
 var index_js_50 = require("./ThemeProvider/index.js");
 Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return index_js_50.ThemeProvider; } });
 var index_js_51 = require("./ToggleSwitch/index.js");
@@ -174,7 +167,6 @@ Object.defineProperty(exports, "Kbd", { enumerable: true, get: function () { ret
 Object.defineProperty(exports, "KbdKeys", { enumerable: true, get: function () { return index_js_54.KbdKeys; } });
 Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return index_js_54.Text; } });
 var index_js_55 = require("./Stepper/index.js");
-Object.defineProperty(exports, "Wizard", { enumerable: true, get: function () { return index_js_55.Wizard; } });
 Object.defineProperty(exports, "Stepper", { enumerable: true, get: function () { return index_js_55.Stepper; } });
 Object.defineProperty(exports, "WorkflowDiagram", { enumerable: true, get: function () { return index_js_55.WorkflowDiagram; } });
 var index_js_56 = require("./SearchBox/index.js");

package/cjs/core/utils/components/Popover.d.ts

@@ -25,7 +25,7 @@ export declare type PopoverProps = {
  * with pre-configured props and plugins (e.g. lazy mounting, focus, etc).
  * @private
  */
-export declare const Popover: React.ForwardRefExoticComponent<Pick<PopoverProps, "disabled" | "className" | "role" | "offset" | "children" | "content" | "plugins" | "theme" | "placement" | "trigger" | "visible" | "render" | "animateFill" | "appendTo" | "aria" | "delay" | "duration" | "followCursor" | "getReferenceClientRect" | "hideOnClick" | "ignoreAttributes" | "inlinePositioning" | "interactive" | "interactiveBorder" | "interactiveDebounce" | "moveTransition" | "popperOptions" | "showOnCreate" | "sticky" | "touch" | "triggerTarget" | "onAfterUpdate" | "onBeforeUpdate" | "onCreate" | "onDestroy" | "onHidden" | "onHide" | "onMount" | "onShow" | "onShown" | "onTrigger" | "onUntrigger" | "onClickOutside" | "allowHTML" | "animation" | "arrow" | "inertia" | "maxWidth" | "zIndex" | "singleton" | "reference"> & React.RefAttributes<unknown>>;
+export declare const Popover: React.ForwardRefExoticComponent<Pick<PopoverProps, "disabled" | "className" | "role" | "offset" | "children" | "content" | "plugins" | "placement" | "trigger" | "visible" | "render" | "animateFill" | "appendTo" | "aria" | "delay" | "duration" | "followCursor" | "getReferenceClientRect" | "hideOnClick" | "ignoreAttributes" | "inlinePositioning" | "interactive" | "interactiveBorder" | "interactiveDebounce" | "moveTransition" | "popperOptions" | "showOnCreate" | "sticky" | "touch" | "triggerTarget" | "onAfterUpdate" | "onBeforeUpdate" | "onCreate" | "onDestroy" | "onHidden" | "onHide" | "onMount" | "onShow" | "onShown" | "onTrigger" | "onUntrigger" | "onClickOutside" | "allowHTML" | "animation" | "arrow" | "inertia" | "maxWidth" | "theme" | "zIndex" | "singleton" | "reference"> & React.RefAttributes<unknown>>;
 /**
  * Plugin to hide Popover when either Esc key is pressed,
  * or when the content inside is not tabbable and Tab key is pressed.

package/cjs/core/utils/functions/dom.d.ts

@@ -1,12 +1,4 @@
 /// <reference types="react" />
-/**
- * Get the container as a child of body, or create one if it doesn't exist.
- * Mostly used for dynamic components like Modal or Toast.
- *
- * @param containerId id of the container to find or create
- * @param ownerDocument Can be changed if the container should be in a different document (e.g. in popup).
- */
-export declare const getContainer: (containerId: string, ownerDocument?: Document | undefined) => HTMLElement | undefined;
 /**
  * Get document if it is defined.
  * Used to support SSR/SSG applications.

package/cjs/core/utils/functions/dom.js

@@ -3,31 +3,8 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTranslateValues = exports.mergeEventHandlers = exports.getWindow = exports.getDocument = exports.getContainer = void 0;
-const styles_js_1 = __importDefault(require("../../../styles.js"));
-/**
- * Get the container as a child of body, or create one if it doesn't exist.
- * Mostly used for dynamic components like Modal or Toast.
- *
- * @param containerId id of the container to find or create
- * @param ownerDocument Can be changed if the container should be in a different document (e.g. in popup).
- */
-const getContainer = (containerId, ownerDocument = (0, exports.getDocument)()) => {
-    let container = ownerDocument?.getElementById(containerId) ?? undefined;
-    if (container == null && !!ownerDocument) {
-        container = ownerDocument.createElement('div');
-        container.setAttribute('id', containerId);
-        const root = ownerDocument.querySelector(`.${styles_js_1.default['iui-root']}`) ??
-            ownerDocument.body;
-        root.appendChild(container);
-    }
-    return container;
-};
-exports.getContainer = getContainer;
+exports.getTranslateValues = exports.mergeEventHandlers = exports.getWindow = exports.getDocument = void 0;
 /**
  * Get document if it is defined.
  * Used to support SSR/SSG applications.