@itwin/itwinui-react 3.0.0-dev.1 → 3.0.0-dev.3

package/cjs/core/Toast/Toaster.js

@@ -22,137 +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 () => {
-            var _a, _b;
-            if (this.isInitialized) {
-                return;
-            }
-            const container = (_a = (0, index_js_1.getContainer)(TOASTS_CONTAINER_ID)) !== null && _a !== void 0 ? _a : (_b = (0, index_js_1.getDocument)()) === null || _b === void 0 ? void 0 : _b.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) {
-        var _a, _b, _c;
-        (_a = newSettings.placement) !== null && _a !== void 0 ? _a : (newSettings.placement = this.settings.placement);
-        (_b = newSettings.order) !== null && _b !== void 0 ? _b : (newSettings.order = ((_c = newSettings.placement) === null || _c === void 0 ? void 0 : _c.startsWith('bottom'))
-            ? 'ascending'
-            : 'descending');
-        this.settings = newSettings;
-        this.asyncInit().then(() => {
-            var _a, _b;
-            (_a = this.toastsRef.current) === null || _a === void 0 ? void 0 : _a.setPlacement((_b = this.settings.placement) !== null && _b !== void 0 ? _b : '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: () => {
-                    var _a;
-                    this.removeToast(currentId);
-                    (_a = options === null || options === void 0 ? void 0 : options.onRemove) === null || _a === void 0 ? void 0 : _a.call(options);
-                },
-                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(() => {
-            var _a;
-            (_a = this.toastsRef.current) === null || _a === void 0 ? void 0 : _a.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/TransferList/TransferList.js

@@ -36,10 +36,9 @@ const TransferListListbox = react_1.default.forwardRef((props, ref) => {
         return focusableItems.filter((i) => !focusableItems.some((p) => p.contains(i.parentElement)));
     }, []);
     react_1.default.useEffect(() => {
-        var _a;
         const items = getFocusableNodes();
         if (focusedIndex != null) {
-            (_a = items === null || items === void 0 ? void 0 : items[focusedIndex]) === null || _a === void 0 ? void 0 : _a.focus();
+            items?.[focusedIndex]?.focus();
             return;
         }
     }, [focusedIndex, getFocusableNodes]);
@@ -48,10 +47,10 @@ const TransferListListbox = react_1.default.forwardRef((props, ref) => {
             return;
         }
         const items = getFocusableNodes();
-        if (!(items === null || items === void 0 ? void 0 : items.length)) {
+        if (!items?.length) {
             return;
         }
-        const currentIndex = focusedIndex !== null && focusedIndex !== void 0 ? focusedIndex : 0;
+        const currentIndex = focusedIndex ?? 0;
         switch (event.key) {
             case 'ArrowDown': {
                 setFocusedIndex(Math.min(currentIndex + 1, items.length - 1));

package/cjs/core/Tree/Tree.js

@@ -102,10 +102,10 @@ const Tree = (props) => {
             return;
         }
         const items = getFocusableNodes();
-        if (!(items === null || items === void 0 ? void 0 : items.length)) {
+        if (!items?.length) {
             return;
         }
-        const activeIndex = items.findIndex((el) => { var _a; return el.contains((_a = treeRef.current) === null || _a === void 0 ? void 0 : _a.ownerDocument.activeElement); });
+        const activeIndex = items.findIndex((el) => el.contains(treeRef.current?.ownerDocument.activeElement));
         const currentIndex = activeIndex > -1 ? activeIndex : 0;
         switch (event.key) {
             case 'ArrowUp': {
@@ -155,20 +155,18 @@ const Tree = (props) => {
         return [flatList, firstLevelNodes];
     }, [data, getNode]);
     const itemRenderer = React.useCallback((index) => {
-        var _a, _b, _c, _d;
         const node = flatNodesList[index];
         return (React.createElement(TreeContext_js_1.TreeContext.Provider, { key: node.nodeProps.nodeId, value: {
                 nodeDepth: node.depth,
                 subNodeIds: node.subNodeIds,
                 groupSize: node.depth === 0
                     ? firstLevelNodesList.length
-                    : (_c = (_b = (_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.subNodeIds) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0,
+                    : node.parentNode?.subNodeIds?.length ?? 0,
                 indexInGroup: node.indexInGroup,
-                parentNodeId: (_d = node.parentNode) === null || _d === void 0 ? void 0 : _d.nodeProps.nodeId,
+                parentNodeId: node.parentNode?.nodeProps.nodeId,
                 scrollToParent: node.parentNode
                     ? () => {
-                        var _a;
-                        const parentNodeId = (_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.nodeProps.nodeId;
+                        const parentNodeId = node.parentNode?.nodeProps.nodeId;
                         const parentNodeIndex = flatNodesList.findIndex((n) => n.nodeProps.nodeId === parentNodeId);
                         setScrollToIndex(parentNodeIndex);
                     }
@@ -182,11 +180,10 @@ const Tree = (props) => {
     }, [flatNodesList]);
     React.useEffect(() => {
         setTimeout(() => {
-            var _a;
             if (scrollToIndex !== undefined) {
                 const nodeId = flatNodesListRef.current[scrollToIndex].nodeProps.nodeId;
-                const nodeElement = (_a = treeRef.current) === null || _a === void 0 ? void 0 : _a.ownerDocument.querySelector(`#${nodeId}`);
-                nodeElement === null || nodeElement === void 0 ? void 0 : nodeElement.focus();
+                const nodeElement = treeRef.current?.ownerDocument.querySelector(`#${nodeId}`);
+                nodeElement?.focus();
                 // Need to reset that if navigating with mouse and keyboard,
                 // e.g. pressing arrow left to go to parent node and then with mouse
                 // clicking some other child node and then pressing arrow left
@@ -195,13 +192,12 @@ const Tree = (props) => {
         });
     }, [scrollToIndex]);
     const handleFocus = (event) => {
-        var _a, _b;
-        if ((_a = treeRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.relatedTarget)) {
+        if (treeRef.current?.contains(event.relatedTarget)) {
             return;
         }
         const items = getFocusableNodes();
         if (items.length > 0) {
-            (_b = items[focusedIndex.current]) === null || _b === void 0 ? void 0 : _b.focus();
+            items[focusedIndex.current]?.focus();
         }
     };
     return (React.createElement(React.Fragment, null, enableVirtualization ? (React.createElement(VirtualizedTree, { flatNodesList: flatNodesList, itemRenderer: itemRenderer, scrollToIndex: scrollToIndex, onFocus: handleFocus, onKeyDown: handleKeyDown, ref: treeRef, className: className, style: style, ...rest })) : (React.createElement(TreeElement, { onKeyDown: handleKeyDown, onFocus: handleFocus, className: className, style: style, ref: treeRef, ...rest }, flatNodesList.map((_, i) => itemRenderer(i))))));

package/cjs/core/Tree/TreeNode.js

@@ -61,11 +61,10 @@ const TreeNode = (props) => {
     const [isFocused, setIsFocused] = React.useState(false);
     const nodeRef = React.useRef(null);
     const onKeyDown = (event) => {
-        var _a, _b, _c, _d, _e, _f;
         if (event.altKey) {
             return;
         }
-        const isNodeFocused = nodeRef.current === ((_a = nodeRef.current) === null || _a === void 0 ? void 0 : _a.ownerDocument.activeElement);
+        const isNodeFocused = nodeRef.current === nodeRef.current?.ownerDocument.activeElement;
         switch (event.key) {
             case 'ArrowLeft': {
                 event.preventDefault();
@@ -75,19 +74,19 @@ const TreeNode = (props) => {
                         break;
                     }
                     if (parentNodeId) {
-                        scrollToParent === null || scrollToParent === void 0 ? void 0 : scrollToParent();
+                        scrollToParent?.();
                         break;
                     }
                     // If it is top level node (doesn't have parent node), then do nothing.
                     break;
                 }
                 const focusableElements = (0, index_js_1.getFocusableElements)(nodeRef.current);
-                const currentIndex = focusableElements.indexOf((_b = nodeRef.current) === null || _b === void 0 ? void 0 : _b.ownerDocument.activeElement);
+                const currentIndex = focusableElements.indexOf(nodeRef.current?.ownerDocument.activeElement);
                 if (currentIndex === 0) {
-                    (_c = nodeRef.current) === null || _c === void 0 ? void 0 : _c.focus();
+                    nodeRef.current?.focus();
                 }
                 else {
-                    (_d = focusableElements[currentIndex - 1]) === null || _d === void 0 ? void 0 : _d.focus();
+                    focusableElements[currentIndex - 1]?.focus();
                 }
                 break;
             }
@@ -99,10 +98,10 @@ const TreeNode = (props) => {
                         onExpanded(nodeId, true);
                         break;
                     }
-                    (_e = focusableElements[0]) === null || _e === void 0 ? void 0 : _e.focus();
+                    focusableElements[0]?.focus();
                     break;
                 }
-                const currentIndex = focusableElements.indexOf((_f = nodeRef.current) === null || _f === void 0 ? void 0 : _f.ownerDocument.activeElement);
+                const currentIndex = focusableElements.indexOf(nodeRef.current?.ownerDocument.activeElement);
                 if (currentIndex < focusableElements.length - 1) {
                     focusableElements[currentIndex + 1].focus();
                     break;
@@ -118,7 +117,7 @@ const TreeNode = (props) => {
                 }
                 event.preventDefault();
                 if (!isDisabled) {
-                    onSelected === null || onSelected === void 0 ? void 0 : onSelected(nodeId, !isSelected);
+                    onSelected?.(nodeId, !isSelected);
                 }
                 break;
             }
@@ -140,7 +139,7 @@ const TreeNode = (props) => {
         React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-tree-node', {
                 'iui-active': isSelected,
                 'iui-disabled': isDisabled,
-            }), style: { '--level': nodeDepth }, onClick: () => !isDisabled && (onSelected === null || onSelected === void 0 ? void 0 : onSelected(nodeId, !isSelected)) },
+            }), style: { '--level': nodeDepth }, onClick: () => !isDisabled && onSelected?.(nodeId, !isSelected) },
             checkbox && (React.createElement(index_js_1.Box, { className: 'iui-tree-node-checkbox' }, React.isValidElement(checkbox)
                 ? React.cloneElement(checkbox, {
                     tabIndex: isFocused ? 0 : -1,

package/cjs/core/index.d.ts

@@ -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';

package/cjs/core/index.js

@@ -1,10 +1,7 @@
 "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.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 = 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;
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
@@ -155,7 +152,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");

package/cjs/core/utils/color/ColorValue.js

@@ -116,27 +116,24 @@ class ColorValue {
      * This allows component builders to know if they received bad input from user.
      */
     static fromString(val, defaultColorIfNotParsed) {
-        const [tbgr, hue] = this.computeTbgrFromString(val, defaultColorIfNotParsed === null || defaultColorIfNotParsed === void 0 ? void 0 : defaultColorIfNotParsed.toTbgr());
+        const [tbgr, hue] = this.computeTbgrFromString(val, defaultColorIfNotParsed?.toTbgr());
         return new ColorValue(tbgr, hue);
     }
     /** Create a ColorValue from hue, saturation, lightness values.  */
     static fromHSL(hsl) {
-        var _a;
-        const alpha = (_a = hsl.a) !== null && _a !== void 0 ? _a : 1;
+        const alpha = hsl.a ?? 1;
         return new ColorValue(this.computeTbgrFromHSL(hsl.h / 360, hsl.s / 100, hsl.l / 100, Math.round((1 - alpha) * 255)), hsl.h);
     }
     /** Create a ColorValue from an RgbColor */
     static fromRGB(rgb) {
-        var _a;
-        const alpha = (_a = rgb.a) !== null && _a !== void 0 ? _a : 1;
+        const alpha = rgb.a ?? 1;
         return ColorValue.fromRgbt(rgb.r, rgb.g, rgb.b, Math.round((1 - alpha) * 255));
     }
     /**
      * Create a ColorValue from an HsvColor
      */
     static fromHSV(hsv) {
-        var _a;
-        const alpha = (_a = hsv.a) !== null && _a !== void 0 ? _a : 1;
+        const alpha = hsv.a ?? 1;
         const transparency = Math.round((1 - alpha) * 255);
         // Check for simple case first.
         if (!hsv.s || hsv.h === -1) {
@@ -487,33 +484,30 @@ class ColorValue {
     }
     /** Convert the 0xTTBBGGRR color to a string of the form "rgba(r,g,b,a)" where the color components are specified in decimal and the alpha component is a fraction. */
     toRgbString(includeAlpha) {
-        var _a;
         const rgb = this.toRgbColor();
         const rgbString = `${rgb.r}, ${rgb.g}, ${rgb.b}`;
         if (includeAlpha) {
-            const alpha = (_a = rgb.a) !== null && _a !== void 0 ? _a : 1;
+            const alpha = rgb.a ?? 1;
             return `rgba(${rgbString}, ${ColorValue.getFormattedColorNumber(alpha, 2)})`;
         }
         return `rgb(${rgbString})`;
     }
     /** Convert this ColorValue to a string in the form "hsl(h,s,l) or hsla(h,s,l,a)" - i.e hsl(120,50%,50%). */
     toHslString(includeAlpha) {
-        var _a, _b;
         const hsl = this.toHslColor();
-        const hslString = `${ColorValue.getFormattedColorNumber((_a = this._hue) !== null && _a !== void 0 ? _a : hsl.h)}, ${ColorValue.getFormattedColorNumber(hsl.s)}%, ${ColorValue.getFormattedColorNumber(hsl.l)}%`;
+        const hslString = `${ColorValue.getFormattedColorNumber(this._hue ?? hsl.h)}, ${ColorValue.getFormattedColorNumber(hsl.s)}%, ${ColorValue.getFormattedColorNumber(hsl.l)}%`;
         if (includeAlpha) {
-            const alpha = (_b = hsl.a) !== null && _b !== void 0 ? _b : 1;
+            const alpha = hsl.a ?? 1;
             return `hsla(${hslString}, ${ColorValue.getFormattedColorNumber(alpha, 2)})`;
         }
         return `hsl(${hslString})`;
     }
     /** Convert this ColorValue to a string in the form "hsv(h,s,v) or hsva(h,s,v,a)" - i.e hsv(120,50%,50%). */
     toHsvString(includeAlpha) {
-        var _a, _b;
         const hsv = this.toHsvColor();
-        const hsvString = `${(_a = this._hue) !== null && _a !== void 0 ? _a : hsv.h}, ${hsv.s}%, ${hsv.v}%`;
+        const hsvString = `${this._hue ?? hsv.h}, ${hsv.s}%, ${hsv.v}%`;
         if (includeAlpha) {
-            const alpha = (_b = hsv.a) !== null && _b !== void 0 ? _b : 1;
+            const alpha = hsv.a ?? 1;
             return `hsva(${hsvString}, ${ColorValue.getFormattedColorNumber(alpha, 2)})`;
         }
         return `hsv(${hsvString})`;

package/cjs/core/utils/components/AutoclearingHiddenLiveRegion.js

@@ -42,10 +42,9 @@ const index_js_1 = require("../functions/index.js");
 const AutoclearingHiddenLiveRegion = ({ text = '' }) => {
     const [maybeText, setMaybeText] = React.useState(text);
     React.useEffect(() => {
-        var _a;
         setMaybeText(text);
-        const timeout = (_a = (0, index_js_1.getWindow)()) === null || _a === void 0 ? void 0 : _a.setTimeout(() => setMaybeText(''), 5000);
-        return () => { var _a; return void ((_a = (0, index_js_1.getWindow)()) === null || _a === void 0 ? void 0 : _a.clearTimeout(timeout)); };
+        const timeout = (0, index_js_1.getWindow)()?.setTimeout(() => setMaybeText(''), 5000);
+        return () => void (0, index_js_1.getWindow)()?.clearTimeout(timeout);
     }, [text]);
     return (React.createElement(VisuallyHidden_js_1.VisuallyHidden, { as: 'div', "aria-live": 'polite', "aria-atomic": 'true' }, maybeText));
 };

package/cjs/core/utils/components/FocusTrap.js

@@ -47,19 +47,19 @@ const FocusTrap = (props) => {
     const onFirstFocus = (event) => {
         const [firstElement, lastElement] = getFirstLastFocusables();
         if (event.relatedTarget === firstElement) {
-            lastElement === null || lastElement === void 0 ? void 0 : lastElement.focus();
+            lastElement?.focus();
         }
         else {
-            firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+            firstElement?.focus();
         }
     };
     const onLastFocus = (event) => {
         const [firstElement, lastElement] = getFirstLastFocusables();
         if (event.relatedTarget === lastElement) {
-            firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+            firstElement?.focus();
         }
         else {
-            lastElement === null || lastElement === void 0 ? void 0 : lastElement.focus();
+            lastElement?.focus();
         }
     };
     return (React.createElement(React.Fragment, null,

package/cjs/core/utils/components/MiddleTextTruncation.js

@@ -48,7 +48,6 @@ const ELLIPSIS_CHAR = '…';
  * />
  */
 const MiddleTextTruncation = (props) => {
-    var _a;
     const { text, endCharsCount = 6, textRenderer, style, ...rest } = props;
     const [ref, visibleCount] = (0, useOverflow_js_1.useOverflow)(text);
     const truncatedText = React.useMemo(() => {
@@ -65,7 +64,7 @@ const MiddleTextTruncation = (props) => {
             flexGrow: 1,
             whiteSpace: 'nowrap',
             ...style,
-        }, ref: ref, ...rest }, (_a = textRenderer === null || textRenderer === void 0 ? void 0 : textRenderer(truncatedText, text)) !== null && _a !== void 0 ? _a : truncatedText));
+        }, ref: ref, ...rest }, textRenderer?.(truncatedText, text) ?? truncatedText));
 };
 exports.MiddleTextTruncation = MiddleTextTruncation;
 exports.default = exports.MiddleTextTruncation;

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.