@itwin/itwinui-react 3.12.0 → 3.12.1

package/cjs/core/ButtonGroup/ButtonGroup.js

@@ -19,7 +19,6 @@ _export(exports, {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
@@ -40,52 +39,60 @@ const ButtonGroup = _react.forwardRef((props, forwardedRef) => {
     }
     return _react.Children.map(childrenProp, (child, index) =>
       _react.isValidElement(child)
-        ? (0, _jsxruntime.jsx)(
-            _react1.CompositeItem,
-            {
-              render: child,
-            },
-            index,
-          )
+        ? _react.createElement(_react1.CompositeItem, {
+            key: index,
+            render: child,
+          })
         : child,
     );
   }, [childrenProp, props.role]);
   const node = overflowButton
-    ? (0, _jsxruntime.jsx)(OverflowGroup, {
-        orientation: orientation,
-        overflowButton: overflowButton,
-        overflowPlacement: overflowPlacement,
-        ref: forwardedRef,
-        ...rest,
-        children: children,
-      })
-    : (0, _jsxruntime.jsx)(BaseGroup, {
-        orientation: orientation,
-        ref: forwardedRef,
-        ...rest,
-        children: children,
-      });
-  return (0, _jsxruntime.jsx)(_react1.FloatingDelayGroup, {
-    delay: {
-      open: 50,
-      close: 250,
+    ? _react.createElement(
+        OverflowGroup,
+        {
+          orientation: orientation,
+          overflowButton: overflowButton,
+          overflowPlacement: overflowPlacement,
+          ref: forwardedRef,
+          ...rest,
+        },
+        children,
+      )
+    : _react.createElement(
+        BaseGroup,
+        {
+          orientation: orientation,
+          ref: forwardedRef,
+          ...rest,
+        },
+        children,
+      );
+  return _react.createElement(
+    _react1.FloatingDelayGroup,
+    {
+      delay: {
+        open: 50,
+        close: 250,
+      },
     },
-    children: (0, _jsxruntime.jsx)(ButtonGroupContext.Provider, {
-      value: orientation,
-      children:
-        props.role === 'toolbar'
-          ? (0, _jsxruntime.jsx)(_react1.Composite, {
-              orientation: orientation,
-              render: node,
-              disabledIndices: [],
-            })
-          : node,
-    }),
-  });
+    _react.createElement(
+      ButtonGroupContext.Provider,
+      {
+        value: orientation,
+      },
+      props.role === 'toolbar'
+        ? _react.createElement(_react1.Composite, {
+            orientation: orientation,
+            render: node,
+            disabledIndices: [],
+          })
+        : node,
+    ),
+  );
 });
 const BaseGroup = _react.forwardRef((props, forwardedRef) => {
   const { orientation, className, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.Box, {
+  return _react.createElement(_index.Box, {
     className: (0, _classnames.default)('iui-button-group', className),
     'data-iui-orientation':
       orientation === 'vertical' ? orientation : undefined,
@@ -110,18 +117,21 @@ const OverflowGroup = _react.forwardRef((props, forwardedRef) => {
     !overflowButton,
     orientation,
   );
-  return (0, _jsxruntime.jsx)(BaseGroup, {
-    orientation: orientation,
-    ...rest,
-    className: (0, _classnames.default)(
-      {
-        'iui-button-group-overflow-x':
-          !!overflowButton && orientation === 'horizontal',
-      },
-      props.className,
-    ),
-    ref: (0, _index.useMergedRefs)(forwardedRef, overflowRef),
-    children: (() => {
+  return _react.createElement(
+    BaseGroup,
+    {
+      orientation: orientation,
+      ...rest,
+      className: (0, _classnames.default)(
+        {
+          'iui-button-group-overflow-x':
+            !!overflowButton && orientation === 'horizontal',
+        },
+        props.className,
+      ),
+      ref: (0, _index.useMergedRefs)(forwardedRef, overflowRef),
+    },
+    (() => {
       if (!(visibleCount < items.length)) {
         return items;
       }
@@ -129,19 +139,19 @@ const OverflowGroup = _react.forwardRef((props, forwardedRef) => {
         overflowPlacement === 'start'
           ? items.length - visibleCount
           : visibleCount - 1;
-      return (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-        children: [
-          overflowButton &&
-            overflowPlacement === 'start' &&
-            overflowButton(overflowStart),
-          overflowPlacement === 'start'
-            ? items.slice(overflowStart + 1)
-            : items.slice(0, Math.max(0, overflowStart)),
-          overflowButton &&
-            overflowPlacement === 'end' &&
-            overflowButton(overflowStart),
-        ],
-      });
+      return _react.createElement(
+        _react.Fragment,
+        null,
+        overflowButton &&
+          overflowPlacement === 'start' &&
+          overflowButton(overflowStart),
+        overflowPlacement === 'start'
+          ? items.slice(overflowStart + 1)
+          : items.slice(0, Math.max(0, overflowStart)),
+        overflowButton &&
+          overflowPlacement === 'end' &&
+          overflowButton(overflowStart),
+      );
     })(),
-  });
+  );
 });

package/cjs/core/Buttons/Button.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Button', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
@@ -33,22 +32,26 @@ const Button = _react.forwardRef((props, ref) => {
     ...rest
   } = props;
   const hasPopoverOpen = _react.useContext(_Popover.PopoverOpenContext);
-  return (0, _jsxruntime.jsxs)(_index.ButtonBase, {
-    ref: ref,
-    className: (0, _classnames.default)('iui-button', 'iui-field', className),
-    'data-iui-variant': styleType !== 'default' ? styleType : undefined,
-    'data-iui-size': size,
-    'data-iui-loading': loading ? 'true' : undefined,
-    'data-iui-has-popover': hasPopoverOpen ? 'open' : undefined,
-    disabled: disabledProp || loading,
-    ...rest,
-    style: {
-      '--_iui-width': stretched ? '100%' : undefined,
-      ...props.style,
+  return _react.createElement(
+    _index.ButtonBase,
+    {
+      ref: ref,
+      className: (0, _classnames.default)('iui-button', 'iui-field', className),
+      'data-iui-variant': styleType !== 'default' ? styleType : undefined,
+      'data-iui-size': size,
+      'data-iui-loading': loading ? 'true' : undefined,
+      'data-iui-has-popover': hasPopoverOpen ? 'open' : undefined,
+      disabled: disabledProp || loading,
+      ...rest,
+      style: {
+        '--_iui-width': stretched ? '100%' : undefined,
+        ...props.style,
+      },
     },
-    children: [
-      startIcon &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+    startIcon &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           'aria-hidden': true,
           ...startIconProps,
@@ -56,20 +59,26 @@ const Button = _react.forwardRef((props, ref) => {
             'iui-button-icon',
             startIconProps?.className,
           ),
-          children: startIcon,
-        }),
-      children &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+        },
+        startIcon,
+      ),
+    children &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           ...labelProps,
           className: (0, _classnames.default)(
             'iui-button-label',
             labelProps?.className,
           ),
-          children: children,
-        }),
-      endIcon &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+        },
+        children,
+      ),
+    endIcon &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           'aria-hidden': true,
           ...endIconProps,
@@ -77,14 +86,14 @@ const Button = _react.forwardRef((props, ref) => {
             'iui-button-icon',
             endIconProps?.className,
           ),
-          children: endIcon,
-        }),
-      loading &&
-        (0, _jsxruntime.jsx)(_ProgressRadial.ProgressRadial, {
-          size: size === 'small' ? 'x-small' : 'small',
-          className: 'iui-button-spinner',
-          'aria-hidden': true,
-        }),
-    ],
-  });
+        },
+        endIcon,
+      ),
+    loading &&
+      _react.createElement(_ProgressRadial.ProgressRadial, {
+        size: size === 'small' ? 'x-small' : 'small',
+        className: 'iui-button-spinner',
+        'aria-hidden': true,
+      }),
+  );
 });

package/cjs/core/Buttons/DropdownButton.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'DropdownButton', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _classnames = _interop_require_default._(require('classnames'));
 const _Button = require('./Button.js');
@@ -27,29 +26,35 @@ const DropdownButton = _react.forwardRef((props, forwardedRef) => {
     ...rest
   } = props;
   const [isMenuOpen, setIsMenuOpen] = _react.useState(false);
-  return (0, _jsxruntime.jsx)(_DropdownMenu.DropdownMenu, {
-    menuItems: menuItems,
-    matchWidth: true,
-    visible: isMenuOpen,
-    ...dropdownMenuProps,
-    onVisibleChange: (open) => {
-      setIsMenuOpen(open);
-      dropdownMenuProps?.onVisibleChange?.(open);
+  return _react.createElement(
+    _DropdownMenu.DropdownMenu,
+    {
+      menuItems: menuItems,
+      matchWidth: true,
+      visible: isMenuOpen,
+      ...dropdownMenuProps,
+      onVisibleChange: (open) => {
+        setIsMenuOpen(open);
+        dropdownMenuProps?.onVisibleChange?.(open);
+      },
     },
-    children: (0, _jsxruntime.jsx)(_Button.Button, {
-      className: (0, _classnames.default)('iui-button-dropdown', className),
-      size: size,
-      styleType: styleType,
-      endIcon: isMenuOpen
-        ? (0, _jsxruntime.jsx)(_index.SvgCaretUpSmall, {
-            'aria-hidden': true,
-          })
-        : (0, _jsxruntime.jsx)(_index.SvgCaretDownSmall, {
-            'aria-hidden': true,
-          }),
-      ref: forwardedRef,
-      ...rest,
-      children: children,
-    }),
-  });
+    _react.createElement(
+      _Button.Button,
+      {
+        className: (0, _classnames.default)('iui-button-dropdown', className),
+        size: size,
+        styleType: styleType,
+        endIcon: isMenuOpen
+          ? _react.createElement(_index.SvgCaretUpSmall, {
+              'aria-hidden': true,
+            })
+          : _react.createElement(_index.SvgCaretDownSmall, {
+              'aria-hidden': true,
+            }),
+        ref: forwardedRef,
+        ...rest,
+      },
+      children,
+    ),
+  );
 });

package/cjs/core/Buttons/IconButton.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'IconButton', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
@@ -34,17 +33,21 @@ const IconButton = _react.forwardRef((props, ref) => {
     _ButtonGroup.ButtonGroupContext,
   );
   const hasPopoverOpen = _react.useContext(_Popover.PopoverOpenContext);
-  const button = (0, _jsxruntime.jsxs)(_index.ButtonBase, {
-    ref: ref,
-    className: (0, _classnames.default)('iui-button', 'iui-field', className),
-    'data-iui-variant': styleType !== 'default' ? styleType : undefined,
-    'data-iui-size': size,
-    'data-iui-active': isActive,
-    'data-iui-has-popover': hasPopoverOpen ? 'open' : undefined,
-    'aria-pressed': isActive,
-    ...rest,
-    children: [
-      (0, _jsxruntime.jsx)(_index.Box, {
+  const button = _react.createElement(
+    _index.ButtonBase,
+    {
+      ref: ref,
+      className: (0, _classnames.default)('iui-button', 'iui-field', className),
+      'data-iui-variant': styleType !== 'default' ? styleType : undefined,
+      'data-iui-size': size,
+      'data-iui-active': isActive,
+      'data-iui-has-popover': hasPopoverOpen ? 'open' : undefined,
+      'aria-pressed': isActive,
+      ...rest,
+    },
+    _react.createElement(
+      _index.Box,
+      {
         as: 'span',
         'aria-hidden': true,
         ...iconProps,
@@ -52,22 +55,23 @@ const IconButton = _react.forwardRef((props, ref) => {
           'iui-button-icon',
           iconProps?.className,
         ),
-        children: children,
-      }),
-      label
-        ? (0, _jsxruntime.jsx)(_VisuallyHidden.VisuallyHidden, {
-            children: label,
-          })
-        : null,
-    ],
-  });
+      },
+      children,
+    ),
+    label
+      ? _react.createElement(_VisuallyHidden.VisuallyHidden, null, label)
+      : null,
+  );
   return label
-    ? (0, _jsxruntime.jsx)(_Tooltip.Tooltip, {
-        placement: buttonGroupOrientation === 'vertical' ? 'right' : 'top',
-        ...labelProps,
-        content: label,
-        ariaStrategy: 'none',
-        children: button,
-      })
+    ? _react.createElement(
+        _Tooltip.Tooltip,
+        {
+          placement: buttonGroupOrientation === 'vertical' ? 'right' : 'top',
+          ...labelProps,
+          content: label,
+          ariaStrategy: 'none',
+        },
+        button,
+      )
     : button;
 });

package/cjs/core/Buttons/IdeasButton.js

@@ -10,22 +10,24 @@ Object.defineProperty(exports, 'IdeasButton', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _Button = require('./Button.js');
 const IdeasButton = _react.forwardRef((props, ref) => {
   const { feedbackLabel = 'Feedback', className, onClick, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_Button.Button, {
-    ref: ref,
-    className: (0, _classnames.default)('iui-button-idea', className),
-    'data-iui-variant': 'high-visibility',
-    onClick: onClick,
-    startIcon: (0, _jsxruntime.jsx)(_index.SvgSmileyHappy, {
-      'aria-hidden': true,
-    }),
-    ...rest,
-    children: feedbackLabel,
-  });
+  return _react.createElement(
+    _Button.Button,
+    {
+      ref: ref,
+      className: (0, _classnames.default)('iui-button-idea', className),
+      'data-iui-variant': 'high-visibility',
+      onClick: onClick,
+      startIcon: _react.createElement(_index.SvgSmileyHappy, {
+        'aria-hidden': true,
+      }),
+      ...rest,
+    },
+    feedbackLabel,
+  );
 });

package/cjs/core/Buttons/SplitButton.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'SplitButton', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _Button = require('./Button.js');
@@ -45,30 +44,37 @@ const SplitButton = _react.forwardRef((props, forwardedRef) => {
     matchWidth: true,
   };
   const labelId = (0, _index.useId)();
-  const trigger = (0, _jsxruntime.jsx)(_IconButton.IconButton, {
-    styleType: styleType,
-    size: size,
-    disabled: props.disabled,
-    'aria-labelledby': props.labelProps?.id || labelId,
-    ...menuButtonProps,
-    children: visible
-      ? (0, _jsxruntime.jsx)(_index.SvgCaretUpSmall, {})
-      : (0, _jsxruntime.jsx)(_index.SvgCaretDownSmall, {}),
-  });
+  const trigger = _react.createElement(
+    _IconButton.IconButton,
+    {
+      styleType: styleType,
+      size: size,
+      disabled: props.disabled,
+      'aria-labelledby': props.labelProps?.id || labelId,
+      ...menuButtonProps,
+    },
+    visible
+      ? _react.createElement(_index.SvgCaretUpSmall, null)
+      : _react.createElement(_index.SvgCaretDownSmall, null),
+  );
   const [positionReference, setPositionReference] = _react.useState(null);
-  return (0, _jsxruntime.jsxs)(_index.Box, {
-    as: 'div',
-    ...wrapperProps,
-    ref: setPositionReference,
-    className: (0, _classnames.default)(
-      'iui-button-split',
+  return _react.createElement(
+    _index.Box,
+    {
+      as: 'div',
+      ...wrapperProps,
+      ref: setPositionReference,
+      className: (0, _classnames.default)(
+        'iui-button-split',
+        {
+          'iui-disabled': props.disabled,
+        },
+        wrapperProps?.className,
+      ),
+    },
+    _react.createElement(
+      _Button.Button,
       {
-        'iui-disabled': props.disabled,
-      },
-      wrapperProps?.className,
-    ),
-    children: [
-      (0, _jsxruntime.jsx)(_Button.Button, {
         className: className,
         styleType: styleType,
         size: size,
@@ -79,9 +85,12 @@ const SplitButton = _react.forwardRef((props, forwardedRef) => {
           id: labelId,
           ...props.labelProps,
         },
-        children: children,
-      }),
-      (0, _jsxruntime.jsx)(_Menu.Menu, {
+      },
+      children,
+    ),
+    _react.createElement(
+      _Menu.Menu,
+      {
         popoverProps: popoverProps,
         trigger: trigger,
         portal: portal,
@@ -91,8 +100,8 @@ const SplitButton = _react.forwardRef((props, forwardedRef) => {
             setVisible(false);
           }
         },
-        children: menuContent,
-      }),
-    ],
-  });
+      },
+      menuContent,
+    ),
+  );
 });

package/cjs/core/Carousel/Carousel.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Carousel', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
@@ -48,26 +47,32 @@ const CarouselComponent = _react.forwardRef((props, ref) => {
   _react.useEffect(() => {
     userOnSlideChange.current?.(currentIndex);
   }, [userOnSlideChange, currentIndex]);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    as: 'section',
-    'aria-roledescription': 'carousel',
-    ref: refs,
-    className: (0, _classnames.default)('iui-carousel', className),
-    ...rest,
-    id: id,
-    children: (0, _jsxruntime.jsx)(_CarouselContext.CarouselContext.Provider, {
-      value: {
-        currentIndex,
-        setCurrentIndex,
-        slideCount,
-        setSlideCount,
-        idPrefix: id,
-        isManuallyUpdating,
-        scrollToSlide,
+  return _react.createElement(
+    _index.Box,
+    {
+      as: 'section',
+      'aria-roledescription': 'carousel',
+      ref: refs,
+      className: (0, _classnames.default)('iui-carousel', className),
+      ...rest,
+      id: id,
+    },
+    _react.createElement(
+      _CarouselContext.CarouselContext.Provider,
+      {
+        value: {
+          currentIndex,
+          setCurrentIndex,
+          slideCount,
+          setSlideCount,
+          idPrefix: id,
+          isManuallyUpdating,
+          scrollToSlide,
+        },
       },
-      children: children,
-    }),
-  });
+      children,
+    ),
+  );
 });
 const Carousel = Object.assign(CarouselComponent, {
   Slider: _CarouselSlider.CarouselSlider,

package/cjs/core/Carousel/CarouselDot.js

@@ -10,13 +10,12 @@ Object.defineProperty(exports, 'CarouselDot', {
 });
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
 const CarouselDot = _react.forwardRef((props, ref) => {
   const { isActive, isSmaller, isSmall, className, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.ButtonBase, {
+  return _react.createElement(_index.ButtonBase, {
     role: 'tab',
     tabIndex: isActive ? 0 : -1,
     className: (0, _classnames.default)(