@itwin/itwinui-react 3.12.0 → 3.12.1

package/cjs/core/Select/SelectTagContainer.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'SelectTagContainer', {
 });
 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');
@@ -19,18 +18,24 @@ const SelectTagContainer = _react.forwardRef((props, ref) => {
   const { tags, className, ...rest } = props;
   const [containerRef, visibleCount] = (0, _index.useOverflow)(tags);
   const refs = (0, _index.useMergedRefs)(ref, containerRef);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)('iui-select-tag-container', className),
-    ref: refs,
-    ...rest,
-    children: (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-      children: [
-        visibleCount < tags.length ? tags.slice(0, visibleCount - 1) : tags,
-        visibleCount < tags.length &&
-          (0, _jsxruntime.jsx)(_SelectTag.SelectTag, {
-            label: `+${tags.length - visibleCount + 1} item(s)`,
-          }),
-      ],
-    }),
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-select-tag-container',
+        className,
+      ),
+      ref: refs,
+      ...rest,
+    },
+    _react.createElement(
+      _react.Fragment,
+      null,
+      visibleCount < tags.length ? tags.slice(0, visibleCount - 1) : tags,
+      visibleCount < tags.length &&
+        _react.createElement(_SelectTag.SelectTag, {
+          label: `+${tags.length - visibleCount + 1} item(s)`,
+        }),
+    ),
+  );
 });

package/cjs/core/SideNavigation/SideNavigation.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');
@@ -45,28 +44,38 @@ const SideNavigation = _react.forwardRef((props, forwardedRef) => {
     false,
     isExpandedProp,
   );
-  const ExpandButton = (0, _jsxruntime.jsx)(_IconButton.IconButton, {
-    label: 'Toggle icon labels',
-    'aria-expanded': isExpanded,
-    className: 'iui-sidenav-button iui-expand',
-    size: 'small',
-    onClick: _react.useCallback(() => {
-      setIsExpanded((expanded) => !expanded);
-      onExpanderClick?.();
-    }, [onExpanderClick, setIsExpanded]),
-    children: (0, _jsxruntime.jsx)(_index.SvgChevronRight, {}),
-  });
-  return (0, _jsxruntime.jsx)(SidenavExpandedContext.Provider, {
-    value: isExpanded,
-    children: (0, _jsxruntime.jsxs)(_index.Box, {
-      ...wrapperProps,
-      className: (0, _classnames.default)(
-        'iui-side-navigation-wrapper',
-        wrapperProps?.className,
-      ),
-      ref: forwardedRef,
-      children: [
-        (0, _jsxruntime.jsxs)(_index.Box, {
+  const ExpandButton = _react.createElement(
+    _IconButton.IconButton,
+    {
+      label: 'Toggle icon labels',
+      'aria-expanded': isExpanded,
+      className: 'iui-sidenav-button iui-expand',
+      size: 'small',
+      onClick: _react.useCallback(() => {
+        setIsExpanded((expanded) => !expanded);
+        onExpanderClick?.();
+      }, [onExpanderClick, setIsExpanded]),
+    },
+    _react.createElement(_index.SvgChevronRight, null),
+  );
+  return _react.createElement(
+    SidenavExpandedContext.Provider,
+    {
+      value: isExpanded,
+    },
+    _react.createElement(
+      _index.Box,
+      {
+        ...wrapperProps,
+        className: (0, _classnames.default)(
+          'iui-side-navigation-wrapper',
+          wrapperProps?.className,
+        ),
+        ref: forwardedRef,
+      },
+      _react.createElement(
+        _index.Box,
+        {
           as: 'div',
           className: (0, _classnames.default)(
             'iui-side-navigation',
@@ -77,48 +86,56 @@ const SideNavigation = _react.forwardRef((props, forwardedRef) => {
             className,
           ),
           ...rest,
-          children: [
-            expanderPlacement === 'top' && ExpandButton,
-            (0, _jsxruntime.jsxs)(_index.Box, {
+        },
+        expanderPlacement === 'top' && ExpandButton,
+        _react.createElement(
+          _index.Box,
+          {
+            as: 'div',
+            ...contentProps,
+            className: (0, _classnames.default)(
+              'iui-sidenav-content',
+              contentProps?.className,
+            ),
+          },
+          _react.createElement(
+            _index.Box,
+            {
               as: 'div',
-              ...contentProps,
+              ...topProps,
               className: (0, _classnames.default)(
-                'iui-sidenav-content',
-                contentProps?.className,
+                'iui-top',
+                topProps?.className,
               ),
-              children: [
-                (0, _jsxruntime.jsx)(_index.Box, {
-                  as: 'div',
-                  ...topProps,
-                  className: (0, _classnames.default)(
-                    'iui-top',
-                    topProps?.className,
-                  ),
-                  children: items,
-                }),
-                (0, _jsxruntime.jsx)(_index.Box, {
-                  as: 'div',
-                  ...bottomProps,
-                  className: (0, _classnames.default)(
-                    'iui-bottom',
-                    bottomProps?.className,
-                  ),
-                  children: secondaryItems,
-                }),
-              ],
-            }),
-            expanderPlacement === 'bottom' && ExpandButton,
-          ],
-        }),
-        submenu &&
-          (0, _jsxruntime.jsx)(_index.WithCSSTransition, {
+            },
+            items,
+          ),
+          _react.createElement(
+            _index.Box,
+            {
+              as: 'div',
+              ...bottomProps,
+              className: (0, _classnames.default)(
+                'iui-bottom',
+                bottomProps?.className,
+              ),
+            },
+            secondaryItems,
+          ),
+        ),
+        expanderPlacement === 'bottom' && ExpandButton,
+      ),
+      submenu &&
+        _react.createElement(
+          _index.WithCSSTransition,
+          {
             in: isSubmenuOpen,
             dimension: 'width',
             timeout: 200,
             classNames: 'iui',
-            children: submenu,
-          }),
-      ],
-    }),
-  });
+          },
+          submenu,
+        ),
+    ),
+  );
 });

package/cjs/core/SideNavigation/SidenavButton.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'SidenavButton', {
 });
 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('../Buttons/Button.js');
@@ -27,27 +26,33 @@ const SidenavButton = _react.forwardRef((props, ref) => {
   } = props;
   const isExpanded =
     _react.useContext(_SideNavigation.SidenavExpandedContext) === true;
-  const sidenavButton = (0, _jsxruntime.jsx)(_Button.Button, {
-    className: (0, _classnames.default)(
-      'iui-sidenav-button',
-      {
-        'iui-submenu-open': isSubmenuOpen,
-      },
-      className,
-    ),
-    'data-iui-active': isActive,
-    size: 'large',
-    disabled: disabled,
-    ref: ref,
-    ...rest,
-    children: children,
-  });
+  const sidenavButton = _react.createElement(
+    _Button.Button,
+    {
+      className: (0, _classnames.default)(
+        'iui-sidenav-button',
+        {
+          'iui-submenu-open': isSubmenuOpen,
+        },
+        className,
+      ),
+      'data-iui-active': isActive,
+      size: 'large',
+      disabled: disabled,
+      ref: ref,
+      ...rest,
+    },
+    children,
+  );
   return !isExpanded
-    ? (0, _jsxruntime.jsx)(_Tooltip.Tooltip, {
-        content: children,
-        placement: 'right',
-        ariaStrategy: 'none',
-        children: sidenavButton,
-      })
+    ? _react.createElement(
+        _Tooltip.Tooltip,
+        {
+          content: children,
+          placement: 'right',
+          ariaStrategy: 'none',
+        },
+        sidenavButton,
+      )
     : sidenavButton;
 });

package/cjs/core/SideNavigation/SidenavSubmenu.js

@@ -10,22 +10,27 @@ Object.defineProperty(exports, 'SidenavSubmenu', {
 });
 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 SidenavSubmenu = _react.forwardRef((props, ref) => {
   const { children, className, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)(
-      'iui-side-navigation-submenu',
-      className,
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-side-navigation-submenu',
+        className,
+      ),
+      ref: ref,
+      ...rest,
+    },
+    _react.createElement(
+      _index.Box,
+      {
+        className: 'iui-side-navigation-submenu-content',
+      },
+      children,
     ),
-    ref: ref,
-    ...rest,
-    children: (0, _jsxruntime.jsx)(_index.Box, {
-      className: 'iui-side-navigation-submenu-content',
-      children: children,
-    }),
-  });
+  );
 });

package/cjs/core/SideNavigation/SidenavSubmenuHeader.js

@@ -10,29 +10,35 @@ Object.defineProperty(exports, 'SidenavSubmenuHeader', {
 });
 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 SidenavSubmenuHeader = _react.forwardRef((props, forwardedRef) => {
   const { children, actions, className, ...rest } = props;
-  return (0, _jsxruntime.jsxs)(_index.Box, {
-    className: (0, _classnames.default)(
-      'iui-side-navigation-submenu-header',
-      className,
-    ),
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      (0, _jsxruntime.jsx)(_index.Box, {
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-side-navigation-submenu-header',
+        className,
+      ),
+      ref: forwardedRef,
+      ...rest,
+    },
+    _react.createElement(
+      _index.Box,
+      {
         className: 'iui-side-navigation-submenu-header-label',
-        children: children,
-      }),
-      actions &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+      },
+      children,
+    ),
+    actions &&
+      _react.createElement(
+        _index.Box,
+        {
           className: 'iui-side-navigation-submenu-header-actions',
-          children: actions,
-        }),
-    ],
-  });
+        },
+        actions,
+      ),
+  );
 });

package/cjs/core/SkipToContentLink/SkipToContentLink.js

@@ -10,17 +10,22 @@ Object.defineProperty(exports, 'SkipToContentLink', {
 });
 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 SkipToContentLink = _react.forwardRef((props, ref) => {
   const { children = 'Skip to main content', className, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    as: 'a',
-    ref: ref,
-    className: (0, _classnames.default)('iui-skip-to-content-link', className),
-    ...rest,
-    children: children,
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      as: 'a',
+      ref: ref,
+      className: (0, _classnames.default)(
+        'iui-skip-to-content-link',
+        className,
+      ),
+      ...rest,
+    },
+    children,
+  );
 });

package/cjs/core/Slider/Slider.js

@@ -10,9 +10,8 @@ Object.defineProperty(exports, 'Slider', {
 });
 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 _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _Track = require('./Track.js');
 const _Thumb = require('./Thumb.js');
@@ -275,15 +274,18 @@ const Slider = _react.forwardRef((props, ref) => {
       return null;
     }
     if (Array.isArray(tickLabels)) {
-      return (0, _jsxruntime.jsx)(_index.Box, {
-        as: 'div',
-        ...ticksProps,
-        className: (0, _classnames.default)(
-          'iui-slider-ticks',
-          ticksProps?.className,
-        ),
-        children: tickLabels.map((label, index) =>
-          (0, _react.createElement)(
+      return _react.createElement(
+        _index.Box,
+        {
+          as: 'div',
+          ...ticksProps,
+          className: (0, _classnames.default)(
+            'iui-slider-ticks',
+            ticksProps?.className,
+          ),
+        },
+        tickLabels.map((label, index) =>
+          _react.createElement(
             _index.Box,
             {
               as: 'span',
@@ -297,7 +299,7 @@ const Slider = _react.forwardRef((props, ref) => {
             label,
           ),
         ),
-      });
+      );
     }
     return tickLabels;
   }, [tickLabels, tickProps, ticksProps]);
@@ -313,24 +315,31 @@ const Slider = _react.forwardRef((props, ref) => {
     },
     [getNumDecimalPlaces, step, tooltipProps],
   );
-  return (0, _jsxruntime.jsxs)(_index.Box, {
-    ref: ref,
-    className: (0, _classnames.default)('iui-slider-container', className),
-    'data-iui-orientation': orientation,
-    'data-iui-disabled': disabled ? 'true' : undefined,
-    ...rest,
-    children: [
-      minValueLabel &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+  return _react.createElement(
+    _index.Box,
+    {
+      ref: ref,
+      className: (0, _classnames.default)('iui-slider-container', className),
+      'data-iui-orientation': orientation,
+      'data-iui-disabled': disabled ? 'true' : undefined,
+      ...rest,
+    },
+    minValueLabel &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           ...minProps,
           className: (0, _classnames.default)(
             'iui-slider-min',
             minProps?.className,
           ),
-          children: minValueLabel,
-        }),
-      (0, _jsxruntime.jsxs)(_index.Box, {
+        },
+        minValueLabel,
+      ),
+    _react.createElement(
+      _index.Box,
+      {
         ref: containerRef,
         ...trackContainerProps,
         className: (0, _classnames.default)(
@@ -341,51 +350,49 @@ const Slider = _react.forwardRef((props, ref) => {
           trackContainerProps?.className,
         ),
         onPointerDown: handlePointerDownOnSlider,
-        children: [
-          currentValues.map((thumbValue, index) => {
-            const [minVal, maxVal] = getAllowableThumbRange(index);
-            const thisThumbProps = thumbProps?.(index);
-            return (0, _jsxruntime.jsx)(
-              _Thumb.Thumb,
-              {
-                index: index,
-                disabled: disabled,
-                isActive: activeThumbIndex === index,
-                onThumbActivated: onThumbActivated,
-                onThumbValueChanged: onThumbValueChanged,
-                minVal: minVal,
-                maxVal: maxVal,
-                value: thumbValue,
-                tooltipProps: generateTooltipProps(index, thumbValue),
-                thumbProps: thisThumbProps,
-                step: step,
-                sliderMin: min,
-                sliderMax: max,
-              },
-              thisThumbProps?.id ?? index,
-            );
-          }),
-          (0, _jsxruntime.jsx)(_Track.Track, {
-            trackDisplayMode: trackDisplay,
-            sliderMin: min,
-            sliderMax: max,
-            values: currentValues,
-            orientation: orientation,
-            ...trackProps,
-          }),
-        ],
+      },
+      currentValues.map((thumbValue, index) => {
+        const [minVal, maxVal] = getAllowableThumbRange(index);
+        const thisThumbProps = thumbProps?.(index);
+        return _react.createElement(_Thumb.Thumb, {
+          key: thisThumbProps?.id ?? index,
+          index: index,
+          disabled: disabled,
+          isActive: activeThumbIndex === index,
+          onThumbActivated: onThumbActivated,
+          onThumbValueChanged: onThumbValueChanged,
+          minVal: minVal,
+          maxVal: maxVal,
+          value: thumbValue,
+          tooltipProps: generateTooltipProps(index, thumbValue),
+          thumbProps: thisThumbProps,
+          step: step,
+          sliderMin: min,
+          sliderMax: max,
+        });
+      }),
+      _react.createElement(_Track.Track, {
+        trackDisplayMode: trackDisplay,
+        sliderMin: min,
+        sliderMax: max,
+        values: currentValues,
+        orientation: orientation,
+        ...trackProps,
       }),
-      tickMarkArea,
-      maxValueLabel &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+    ),
+    tickMarkArea,
+    maxValueLabel &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           ...maxProps,
           className: (0, _classnames.default)(
             'iui-slider-max',
             maxProps?.className,
           ),
-          children: maxValueLabel,
-        }),
-    ],
-  });
+        },
+        maxValueLabel,
+      ),
+  );
 });

package/cjs/core/Slider/Thumb.d.ts

@@ -59,5 +59,5 @@ type ThumbProps = {
  * Only one Thumb can be active at a time. A Thumb is made active when the user selects
  * it with pointer. Whenever a Thumb is active, focused, or hovered its tooltip is shown.
  */
-export declare const Thumb: (props: ThumbProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Thumb: (props: ThumbProps) => React.JSX.Element;
 export {};

package/cjs/core/Slider/Thumb.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Thumb', {
 });
 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 _Tooltip = require('../Tooltip/Tooltip.js');
@@ -86,14 +85,17 @@ const Thumb = (props) => {
     return (100.0 * (adjustedValue - sliderMin)) / (sliderMax - sliderMin);
   }, [adjustedValue, sliderMax, sliderMin]);
   const { style, className, ...rest } = thumbProps || {};
-  return (0, _jsxruntime.jsx)(_Tooltip.Tooltip, {
-    placement: 'top',
-    autoUpdateOptions: {
-      animationFrame: true,
+  return _react.createElement(
+    _Tooltip.Tooltip,
+    {
+      placement: 'top',
+      autoUpdateOptions: {
+        animationFrame: true,
+      },
+      ariaStrategy: 'none',
+      ...tooltipProps,
     },
-    ariaStrategy: 'none',
-    ...tooltipProps,
-    children: (0, _jsxruntime.jsx)(_index.Box, {
+    _react.createElement(_index.Box, {
       ...rest,
       ref: (0, _index.useMergedRefs)(thumbRef, thumbProps?.ref),
       style: {
@@ -117,5 +119,5 @@ const Thumb = (props) => {
       onKeyDown: (event) => handleOnKeyboardEvent(event, false),
       onKeyUp: (event) => handleOnKeyboardEvent(event, true),
     }),
-  });
+  );
 };

package/cjs/core/Slider/Track.d.ts

@@ -11,4 +11,4 @@ export type TrackProps = {
  * Track displays color segments above Rail. Which, if any, segments that are
  * colorized is based on `trackDisplayMode`.
  */
-export declare const Track: (props: TrackProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Track: (props: TrackProps) => React.JSX.Element;