@itwin/itwinui-react 3.12.2 → 3.13.0

package/cjs/core/NonIdealState/NonIdealState.js

@@ -14,7 +14,7 @@ const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _classnames = _interop_require_default._(require('classnames'));
 const NonIdealState = _react.forwardRef((props, forwardedRef) => {
-  const {
+  let {
     className,
     svg,
     heading,

package/cjs/core/NotificationMarker/NotificationMarker.js

@@ -14,7 +14,7 @@ const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _classnames = _interop_require_default._(require('classnames'));
 const NotificationMarker = _react.forwardRef((props, ref) => {
-  const {
+  let {
     className,
     children,
     status = 'primary',

package/cjs/core/Overlay/Overlay.js

@@ -12,7 +12,7 @@ const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildc
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const OverlayComponent = _react.forwardRef((props, forwardedRef) => {
-  const { content, children, ...rest } = props;
+  let { content, children, ...rest } = props;
   return _react.createElement(
     OverlayWrapper,
     {
@@ -23,9 +23,8 @@ const OverlayComponent = _react.forwardRef((props, forwardedRef) => {
     _react.createElement(OverlayHiddenContent, null, children),
   );
 });
-OverlayComponent.displayName = 'Overlay';
 const OverlayHiddenContent = _react.forwardRef((props, ref) => {
-  const { children, ...rest } = props;
+  let { children, ...rest } = props;
   useInertPolyfill();
   return _react.createElement(
     _index.Box,
@@ -37,26 +36,25 @@ const OverlayHiddenContent = _react.forwardRef((props, ref) => {
     children,
   );
 });
-OverlayHiddenContent.displayName = 'Overlay.HiddenContent';
 const OverlayOverlay = (0, _index.polymorphic)('iui-overlay');
-OverlayOverlay.displayName = 'Overlay.Overlay';
 const OverlayWrapper = (0, _index.polymorphic)('iui-overlay-wrapper');
-OverlayWrapper.displayName = 'Overlay.Wrapper';
 const Overlay = Object.assign(OverlayComponent, {
   Wrapper: OverlayWrapper,
   HiddenContent: OverlayHiddenContent,
   Overlay: OverlayOverlay,
 });
 const useInertPolyfill = () => {
-  const loaded = _react.useRef(false);
-  const modulePath =
+  let loaded = _react.useRef(false);
+  let modulePath =
     'https://cdn.jsdelivr.net/npm/wicg-inert@3.1.2/dist/inert.min.js';
   _react.useEffect(() => {
     (async () => {
-      if (!HTMLElement.prototype.hasOwnProperty('inert') && !loaded.current) {
-        await Promise.resolve(modulePath).then((p) =>
-          _interop_require_wildcard._(require(p)),
-        );
+      if (
+        !HTMLElement.prototype.hasOwnProperty('inert') &&
+        !loaded.current &&
+        !_index.isUnitTest
+      ) {
+        await new Function('url', 'return import(url)')(modulePath);
         loaded.current = true;
       }
     })();

package/cjs/core/Popover/Popover.js

@@ -28,9 +28,9 @@ const _react1 = require('@floating-ui/react');
 const _index = require('../../utils/index.js');
 const _Portal = require('../../utils/components/Portal.js');
 const _ThemeProvider = require('../ThemeProvider/ThemeProvider.js');
-const PopoverOpenContext = _react.createContext(undefined);
+const PopoverOpenContext = _react.createContext(void 0);
 const usePopover = (options) => {
-  const {
+  let {
     placement = 'bottom-start',
     visible,
     onVisibleChange,
@@ -41,20 +41,18 @@ const usePopover = (options) => {
     role,
     ...rest
   } = options;
-  const mergedInteractions = _react.useMemo(
+  let mergedInteractions = _react.useMemo(
     () => ({
-      ...{
-        click: true,
-        dismiss: true,
-        hover: false,
-        focus: false,
-      },
+      click: true,
+      dismiss: true,
+      hover: false,
+      focus: false,
       ...interactionsProp,
     }),
     [interactionsProp],
   );
-  const tree = (0, _react1.useFloatingTree)();
-  const middleware = _react.useMemo(
+  let tree = (0, _react1.useFloatingTree)();
+  let middleware = _react.useMemo(
     () => ({
       flip: true,
       shift: true,
@@ -62,12 +60,12 @@ const usePopover = (options) => {
     }),
     [options.middleware],
   );
-  const [open, onOpenChange] = (0, _index.useControlledState)(
+  let [open, onOpenChange] = (0, _index.useControlledState)(
     false,
     visible,
     onVisibleChange,
   );
-  const floating = (0, _react1.useFloating)({
+  let floating = (0, _react1.useFloating)({
     placement,
     open,
     onOpenChange,
@@ -75,14 +73,14 @@ const usePopover = (options) => {
       () =>
         open
           ? (...args) => (0, _react1.autoUpdate)(...args, autoUpdateOptions)
-          : undefined,
+          : void 0,
       [autoUpdateOptions, open],
     ),
     ...rest,
     middleware: _react.useMemo(
       () =>
         [
-          middleware.offset !== undefined &&
+          void 0 !== middleware.offset &&
             (0, _react1.offset)(middleware.offset),
           middleware.flip && (0, _react1.flip)(),
           middleware.shift && (0, _react1.shift)(),
@@ -99,7 +97,7 @@ const usePopover = (options) => {
       [matchWidth, middleware],
     ),
   });
-  const interactions = (0, _react1.useInteractions)([
+  let interactions = (0, _react1.useInteractions)([
     (0, _react1.useClick)(floating.context, {
       enabled: !!mergedInteractions.click,
       ...mergedInteractions.click,
@@ -107,7 +105,7 @@ const usePopover = (options) => {
     (0, _react1.useDismiss)(floating.context, {
       enabled: !!mergedInteractions.dismiss,
       outsidePress: closeOnOutsideClick,
-      bubbles: tree != null,
+      bubbles: null != tree,
       ...mergedInteractions.dismiss,
     }),
     (0, _react1.useHover)(floating.context, {
@@ -129,8 +127,8 @@ const usePopover = (options) => {
       enabled: !!role,
     }),
   ]);
-  const [referenceWidth, setReferenceWidth] = _react.useState();
-  const getFloatingProps = _react.useCallback(
+  let [referenceWidth, setReferenceWidth] = _react.useState();
+  let getFloatingProps = _react.useCallback(
     (userProps) =>
       interactions.getFloatingProps({
         ...userProps,
@@ -140,7 +138,7 @@ const usePopover = (options) => {
           ...(matchWidth && referenceWidth
             ? {
                 minInlineSize: `${referenceWidth}px`,
-                maxInlineSize: `min(${referenceWidth * 2}px, 90vw)`,
+                maxInlineSize: `min(${2 * referenceWidth}px, 90vw)`,
               }
             : {}),
           ...userProps?.style,
@@ -148,14 +146,12 @@ const usePopover = (options) => {
       }),
     [floating.floatingStyles, interactions, matchWidth, referenceWidth],
   );
-  const getReferenceProps = _react.useCallback(
+  let getReferenceProps = _react.useCallback(
     (userProps) =>
       interactions.getReferenceProps({
         ...userProps,
         onClick: (0, _index.mergeEventHandlers)(userProps?.onClick, () => {
-          if (!!mergedInteractions.click && visible) {
-            onOpenChange(false);
-          }
+          if (!!mergedInteractions.click && visible) onOpenChange(false);
         }),
       }),
     [interactions, mergedInteractions.click, visible, onOpenChange],
@@ -172,7 +168,7 @@ const usePopover = (options) => {
   );
 };
 const Popover = _react.forwardRef((props, forwardedRef) => {
-  const {
+  let {
     portal = true,
     visible,
     placement = 'bottom-start',
@@ -186,7 +182,7 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
     applyBackground = false,
     ...rest
   } = props;
-  const popover = usePopover({
+  let popover = usePopover({
     visible,
     placement,
     onVisibleChange,
@@ -194,18 +190,16 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
     role: 'dialog',
     middleware,
   });
-  const [popoverElement, setPopoverElement] = _react.useState();
-  const popoverRef = (0, _index.useMergedRefs)(
+  let [popoverElement, setPopoverElement] = _react.useState();
+  let popoverRef = (0, _index.useMergedRefs)(
     popover.refs.setFloating,
     forwardedRef,
     setPopoverElement,
   );
-  const triggerId = `${(0, _index.useId)()}-trigger`;
-  const hasAriaLabel = !!props['aria-labelledby'] || !!props['aria-label'];
+  let triggerId = `${(0, _index.useId)()}-trigger`;
+  let hasAriaLabel = !!props['aria-labelledby'] || !!props['aria-label'];
   (0, _index.useLayoutEffect)(() => {
-    if (!positionReference) {
-      return;
-    }
+    if (!positionReference) return;
     popover.refs.setPositionReference(positionReference);
     return () => void popover.refs.setPositionReference(null);
   }, [popover.refs, positionReference]);
@@ -251,9 +245,9 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
                     },
                     className,
                   ),
-                  'aria-labelledby': !hasAriaLabel
-                    ? popover.refs.domReference.current?.id
-                    : undefined,
+                  'aria-labelledby': hasAriaLabel
+                    ? void 0
+                    : popover.refs.domReference.current?.id,
                   ...popover.getFloatingProps(rest),
                   ref: popoverRef,
                 },
@@ -266,7 +260,7 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
   );
 });
 const PopoverPortal = ({ children, portal = true }) => {
-  const portalTo = (0, _Portal.usePortalTo)(portal);
+  let portalTo = (0, _Portal.usePortalTo)(portal);
   return _react.createElement(
     _react1.FloatingPortal,
     {
@@ -277,8 +271,8 @@ const PopoverPortal = ({ children, portal = true }) => {
     children,
   );
 };
-const DisplayContents = _react.memo(() => {
-  return _react.createElement(
+const DisplayContents = _react.memo(() =>
+  _react.createElement(
     _index.ShadowRoot,
     {
       css: `
@@ -288,5 +282,5 @@ const DisplayContents = _react.memo(() => {
       `,
     },
     _react.createElement('slot', null),
-  );
-});
+  ),
+);

package/cjs/core/ProgressIndicators/ProgressLinear.js

@@ -15,9 +15,9 @@ const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
 const _VisuallyHidden = require('../VisuallyHidden/VisuallyHidden.js');
 const ProgressLinear = _react.forwardRef((props, forwardedRef) => {
-  const {
+  let {
     value,
-    indeterminate = value === undefined,
+    indeterminate = void 0 === value,
     labels = [],
     isAnimated = false,
     status,
@@ -25,7 +25,7 @@ const ProgressLinear = _react.forwardRef((props, forwardedRef) => {
     labelGroupProps,
     ...rest
   } = props;
-  const boundedValue = (0, _index.getBoundedValue)(value ?? 100, 0, 100);
+  let boundedValue = (0, _index.getBoundedValue)(value ?? 100, 0, 100);
   return _react.createElement(
     _index.Box,
     {
@@ -35,8 +35,8 @@ const ProgressLinear = _react.forwardRef((props, forwardedRef) => {
       ),
       ref: forwardedRef,
       'data-iui-status': status,
-      'data-iui-indeterminate': indeterminate ? 'true' : undefined,
-      'data-iui-animated': isAnimated ? 'true' : undefined,
+      'data-iui-indeterminate': indeterminate ? 'true' : void 0,
+      'data-iui-animated': isAnimated ? 'true' : void 0,
       style: {
         '--iui-progress-percentage': `${boundedValue}%`,
       },
@@ -45,7 +45,7 @@ const ProgressLinear = _react.forwardRef((props, forwardedRef) => {
     _react.createElement(
       _index.ShadowRoot,
       null,
-      value !== 100 &&
+      100 !== value &&
         _react.createElement(_VisuallyHidden.VisuallyHidden, null, 'Loading.'),
       _react.createElement('slot', null),
     ),

package/cjs/core/ProgressIndicators/ProgressRadial.js

@@ -15,9 +15,9 @@ const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _VisuallyHidden = require('../VisuallyHidden/VisuallyHidden.js');
 const ProgressRadial = _react.forwardRef((props, forwardedRef) => {
-  const {
+  let {
     value,
-    indeterminate = value === undefined,
+    indeterminate = void 0 === value,
     status,
     size,
     className,
@@ -25,7 +25,7 @@ const ProgressRadial = _react.forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  const statusMap = {
+  let statusMap = {
     negative: _react.createElement(_index.SvgImportantSmall, {
       'aria-hidden': true,
     }),
@@ -45,10 +45,10 @@ const ProgressRadial = _react.forwardRef((props, forwardedRef) => {
       ),
       'data-iui-size': size,
       'data-iui-status': status,
-      'data-iui-indeterminate': indeterminate ? 'true' : undefined,
+      'data-iui-indeterminate': indeterminate ? 'true' : void 0,
       ref: forwardedRef,
       style: {
-        ...(value !== undefined && {
+        ...(void 0 !== value && {
           '--iui-progress-percentage': `${(0, _index.getBoundedValue)(
             value,
             0,
@@ -62,12 +62,10 @@ const ProgressRadial = _react.forwardRef((props, forwardedRef) => {
     _react.createElement(
       _index.ShadowRoot,
       null,
-      value !== 100 &&
+      100 !== value &&
         _react.createElement(_VisuallyHidden.VisuallyHidden, null, 'Loading.'),
       _react.createElement('slot', null),
     ),
-    size !== 'x-small'
-      ? children ?? (!!status ? statusMap[status] : null)
-      : null,
+    'x-small' !== size ? children ?? (status ? statusMap[status] : null) : null,
   );
 });

package/cjs/core/Radio/Radio.js

@@ -14,7 +14,7 @@ const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const Radio = _react.forwardRef((props, ref) => {
-  const {
+  let {
     className,
     disabled = false,
     label,
@@ -24,9 +24,9 @@ const Radio = _react.forwardRef((props, ref) => {
     style,
     ...rest
   } = props;
-  const inputElementRef = _react.useRef(null);
-  const refs = (0, _index.useMergedRefs)(inputElementRef, ref);
-  const radio = _react.createElement(_index.Box, {
+  let inputElementRef = _react.useRef(null);
+  let refs = (0, _index.useMergedRefs)(inputElementRef, ref);
+  let radio = _react.createElement(_index.Box, {
     as: 'input',
     className: (0, _classnames.default)('iui-radio', className),
     style: style,
@@ -35,9 +35,8 @@ const Radio = _react.forwardRef((props, ref) => {
     ref: refs,
     ...rest,
   });
-  return !label
-    ? radio
-    : _react.createElement(
+  return label
+    ? _react.createElement(
         _index.Box,
         {
           as: 'label',
@@ -65,5 +64,6 @@ const Radio = _react.forwardRef((props, ref) => {
             },
             label,
           ),
-      );
+      )
+    : radio;
 });

package/cjs/core/RadioTiles/RadioTile.js

@@ -14,7 +14,7 @@ const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const RadioTile = _react.forwardRef((props, ref) => {
-  const {
+  let {
     icon,
     label,
     description,
@@ -26,13 +26,13 @@ const RadioTile = _react.forwardRef((props, ref) => {
     style,
     ...rest
   } = props;
-  const inputElementRef = _react.useRef(null);
-  const refs = (0, _index.useMergedRefs)(inputElementRef, ref);
+  let inputElementRef = _react.useRef(null);
+  let refs = (0, _index.useMergedRefs)(inputElementRef, ref);
   return _react.createElement(
     _index.Box,
     {
       as: 'label',
-      'data-iui-disabled': props.disabled ? 'true' : undefined,
+      'data-iui-disabled': props.disabled ? 'true' : void 0,
       ...wrapperProps,
       className: (0, _classnames.default)(
         'iui-radio-tile',

package/cjs/core/RadioTiles/RadioTileGroup.js

@@ -13,7 +13,7 @@ const _react = _interop_require_wildcard._(require('react'));
 const _InputGroup = require('../InputGroup/InputGroup.js');
 const _index = require('../../utils/index.js');
 const RadioTileGroup = _react.forwardRef((props, forwardedRef) => {
-  const { children, label, ...rest } = props;
+  let { children, label, ...rest } = props;
   return _react.createElement(
     _InputGroup.InputGroup,
     {

package/cjs/core/SearchBox/SearchBox.js

@@ -13,9 +13,9 @@ const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildc
 const _react = _interop_require_wildcard._(require('react'));
 const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
-const SearchBoxContext = _react.createContext(undefined);
+const SearchBoxContext = _react.createContext(void 0);
 const SearchBoxComponent = _react.forwardRef((props, ref) => {
-  const {
+  let {
     size,
     expandable = false,
     isDisabled = false,
@@ -27,13 +27,13 @@ const SearchBoxComponent = _react.forwardRef((props, ref) => {
     className,
     ...rest
   } = props;
-  const uid = (0, _index.useId)();
-  const [inputId, setInputId] = _react.useState(uid);
-  const inputRef = _react.useRef(null);
-  const openButtonRef = _react.useRef(null);
-  const [localExpanded, setLocalExpanded] = _react.useState(isExpandedProp);
-  const isExpanded = isExpandedProp ?? localExpanded;
-  const onCollapse = () => {
+  let uid = (0, _index.useId)();
+  let [inputId, setInputId] = _react.useState(uid);
+  let inputRef = _react.useRef(null);
+  let openButtonRef = _react.useRef(null);
+  let [localExpanded, setLocalExpanded] = _react.useState(isExpandedProp);
+  let isExpanded = isExpandedProp ?? localExpanded;
+  let onCollapse = () => {
     setLocalExpanded(false);
     onCollapseProp?.();
     queueMicrotask(() =>
@@ -42,7 +42,7 @@ const SearchBoxComponent = _react.forwardRef((props, ref) => {
       }),
     );
   };
-  const onExpand = () => {
+  let onExpand = () => {
     setLocalExpanded(true);
     onExpandProp?.();
     queueMicrotask(() =>
@@ -106,31 +106,21 @@ const SearchBoxComponent = _react.forwardRef((props, ref) => {
   );
 });
 const SearchBoxCollapsedState = ({ children }) => {
-  const { isExpanded, expandable } = (0, _index.useSafeContext)(
-    SearchBoxContext,
-  );
-  if (!expandable || isExpanded) {
-    return null;
-  }
+  let { isExpanded, expandable } = (0, _index.useSafeContext)(SearchBoxContext);
+  if (!expandable || isExpanded) return null;
   return _react.createElement(
     _react.Fragment,
     null,
     children ?? _react.createElement(SearchBoxExpandButton, null),
   );
 };
-SearchBoxCollapsedState.displayName = 'SearchBox.CollapsedState';
 const SearchBoxExpandedState = ({ children }) => {
-  const { isExpanded, expandable } = (0, _index.useSafeContext)(
-    SearchBoxContext,
-  );
-  if (expandable && !isExpanded) {
-    return null;
-  }
+  let { isExpanded, expandable } = (0, _index.useSafeContext)(SearchBoxContext);
+  if (expandable && !isExpanded) return null;
   return _react.createElement(_react.Fragment, null, children);
 };
-SearchBoxExpandedState.displayName = 'SearchBox.ExpandedState';
 const SearchBoxIcon = _react.forwardRef((props, ref) => {
-  const { className, children, ...rest } = props;
+  let { className, children, ...rest } = props;
   return _react.createElement(
     _index.InputFlexContainerIcon,
     {
@@ -142,15 +132,12 @@ const SearchBoxIcon = _react.forwardRef((props, ref) => {
     children ?? _react.createElement(_index.SvgSearch, null),
   );
 });
-SearchBoxIcon.displayName = 'SearchBox.Icon';
 const SearchBoxInput = _react.forwardRef((props, ref) => {
-  const { className, id: idProp, ...rest } = props;
-  const { inputId, setInputId, isDisabled, inputRef } = (0,
+  let { className, id: idProp, ...rest } = props;
+  let { inputId, setInputId, isDisabled, inputRef } = (0,
   _index.useSafeContext)(SearchBoxContext);
   _react.useEffect(() => {
-    if (idProp && idProp !== inputId) {
-      setInputId(idProp);
-    }
+    if (idProp && idProp !== inputId) setInputId(idProp);
   }, [idProp, inputId, setInputId]);
   return _react.createElement(_index.Box, {
     as: 'input',
@@ -163,10 +150,9 @@ const SearchBoxInput = _react.forwardRef((props, ref) => {
     ...rest,
   });
 });
-SearchBoxInput.displayName = 'SearchBox.Input';
 const SearchBoxButton = _react.forwardRef((props, ref) => {
-  const { children, ...rest } = props;
-  const { size: sizeContext, isDisabled } = (0, _index.useSafeContext)(
+  let { children, ...rest } = props;
+  let { size: sizeContext, isDisabled } = (0, _index.useSafeContext)(
     SearchBoxContext,
   );
   return _react.createElement(
@@ -180,10 +166,9 @@ const SearchBoxButton = _react.forwardRef((props, ref) => {
     children ?? _react.createElement(_index.SvgSearch, null),
   );
 });
-SearchBoxButton.displayName = 'SearchBox.Button';
 const SearchBoxCollapseButton = _react.forwardRef((props, ref) => {
-  const { children, onClick: onClickProp, ...rest } = props;
-  const {
+  let { children, onClick: onClickProp, ...rest } = props;
+  let {
     onCollapse,
     size: sizeContext,
     isDisabled,
@@ -201,10 +186,9 @@ const SearchBoxCollapseButton = _react.forwardRef((props, ref) => {
     children ?? _react.createElement(_index.SvgCloseSmall, null),
   );
 });
-SearchBoxCollapseButton.displayName = 'SearchBox.CollapseButton';
 const SearchBoxExpandButton = _react.forwardRef((props, ref) => {
-  const { children, onClick: onClickProp, ...rest } = props;
-  const {
+  let { children, onClick: onClickProp, ...rest } = props;
+  let {
     onExpand,
     size: sizeContext,
     isDisabled,
@@ -224,7 +208,6 @@ const SearchBoxExpandButton = _react.forwardRef((props, ref) => {
     children ?? _react.createElement(_index.SvgSearch, null),
   );
 });
-SearchBoxExpandButton.displayName = 'SearchBox.ExpandButton';
 const SearchBox = Object.assign(SearchBoxComponent, {
   Icon: SearchBoxIcon,
   Input: SearchBoxInput,
@@ -234,4 +217,3 @@ const SearchBox = Object.assign(SearchBoxComponent, {
   ExpandedState: SearchBoxExpandedState,
   CollapsedState: SearchBoxCollapsedState,
 });
-SearchBox.displayName = 'SearchBox';