@itwin/itwinui-react 3.12.0 → 3.12.2

package/cjs/core/Slider/Track.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Track', {
 });
 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');
@@ -63,9 +62,10 @@ const Track = (props) => {
   _react.useEffect(() => {
     setSegments(generateSegments(values, sliderMin, sliderMax));
   }, [values, sliderMin, sliderMax]);
-  return (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
-    children:
-      'none' !== trackDisplayMode &&
+  return _react.createElement(
+    _react.Fragment,
+    null,
+    'none' !== trackDisplayMode &&
       segments.map((segment, index) => {
         const lowPercent =
           segment.left >= sliderMin && sliderMax !== sliderMin
@@ -76,31 +76,31 @@ const Track = (props) => {
             ? 100.0 -
               (100.0 * (segment.right - sliderMin)) / (sliderMax - sliderMin)
             : 100;
-        return (0, _jsxruntime.jsx)(
+        return _react.createElement(
           _react.Fragment,
           {
-            children: shouldDisplaySegment(index, trackDisplayMode)
-              ? (0, _jsxruntime.jsx)(_index.Box, {
-                  className: (0, _classnames.default)(
-                    'iui-slider-track',
-                    className,
-                  ),
-                  style: {
-                    ...(orientation === 'horizontal'
-                      ? {
-                          insetInlineStart: `${lowPercent}%`,
-                          insetInlineEnd: `${highPercent}%`,
-                        }
-                      : {
-                          insetBlockStart: `${highPercent}%`,
-                          insetBlockEnd: `${lowPercent}%`,
-                        }),
-                  },
-                })
-              : null,
+            key: index,
           },
-          index,
+          shouldDisplaySegment(index, trackDisplayMode)
+            ? _react.createElement(_index.Box, {
+                className: (0, _classnames.default)(
+                  'iui-slider-track',
+                  className,
+                ),
+                style: {
+                  ...(orientation === 'horizontal'
+                    ? {
+                        insetInlineStart: `${lowPercent}%`,
+                        insetInlineEnd: `${highPercent}%`,
+                      }
+                    : {
+                        insetBlockStart: `${highPercent}%`,
+                        insetBlockEnd: `${lowPercent}%`,
+                      }),
+                },
+              })
+            : null,
         );
       }),
-  });
+  );
 };

package/cjs/core/StatusMessage/StatusMessage.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'StatusMessage', {
 });
 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 _index = require('../../utils/index.js');
 const _classnames = _interop_require_default._(require('classnames'));
@@ -27,23 +26,24 @@ const StatusMessage = _react.forwardRef((props, ref) => {
   } = props;
   const icon = userStartIcon ?? (status && _index.StatusIconMap[status]());
   const shouldShowIcon = userStartIcon !== null && !!icon;
-  return (0, _jsxruntime.jsxs)(_index.Box, {
-    className: (0, _classnames.default)('iui-status-message', className),
-    'data-iui-status': status,
-    ref: ref,
-    ...rest,
-    children: [
-      shouldShowIcon
-        ? (0, _jsxruntime.jsx)(_Icon.Icon, {
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)('iui-status-message', className),
+      'data-iui-status': status,
+      ref: ref,
+      ...rest,
+    },
+    shouldShowIcon
+      ? _react.createElement(
+          _Icon.Icon,
+          {
             'aria-hidden': true,
             ...iconProps,
-            children: icon,
-          })
-        : null,
-      (0, _jsxruntime.jsx)(_index.Box, {
-        ...contentProps,
-        children: children,
-      }),
-    ],
-  });
+          },
+          icon,
+        )
+      : null,
+    _react.createElement(_index.Box, contentProps, children),
+  );
 });

package/cjs/core/Stepper/Stepper.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Stepper', {
 });
 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');
@@ -38,60 +37,61 @@ const Stepper = _react.forwardRef((props, ref) => {
     Math.max(0, currentStep ?? 0),
     steps.length - 1,
   );
-  return (0, _jsxruntime.jsxs)(_index.Box, {
-    className: 'iui-stepper',
-    ref: ref,
-    ...rest,
-    children: [
-      (0, _jsxruntime.jsx)('ol', {
-        children: steps.map((s, index) => {
-          const thisStepProps = stepProps?.(index);
-          const thisTrackContentProps = trackContentProps?.(index);
-          const thisCircleProps = circleProps?.(index);
-          const thisNameProps = nameProps?.(index);
-          return (0, _jsxruntime.jsx)(
-            _StepperStep.StepperStep,
-            {
-              stepProps: thisStepProps,
-              trackContentProps: thisTrackContentProps,
-              circleProps: thisCircleProps,
-              nameProps: thisNameProps,
-              index: index,
-              title: type === 'long' ? '' : s.name,
-              currentStepNumber: boundedCurrentStep,
-              totalSteps: steps.length,
-              type: type,
-              onClick: onStepClick,
-              description: s.description,
-            },
-            index,
-          );
-        }),
+  return _react.createElement(
+    _index.Box,
+    {
+      className: 'iui-stepper',
+      ref: ref,
+      ...rest,
+    },
+    _react.createElement(
+      'ol',
+      null,
+      steps.map((s, index) => {
+        const thisStepProps = stepProps?.(index);
+        const thisTrackContentProps = trackContentProps?.(index);
+        const thisCircleProps = circleProps?.(index);
+        const thisNameProps = nameProps?.(index);
+        return _react.createElement(_StepperStep.StepperStep, {
+          stepProps: thisStepProps,
+          trackContentProps: thisTrackContentProps,
+          circleProps: thisCircleProps,
+          nameProps: thisNameProps,
+          key: index,
+          index: index,
+          title: type === 'long' ? '' : s.name,
+          currentStepNumber: boundedCurrentStep,
+          totalSteps: steps.length,
+          type: type,
+          onClick: onStepClick,
+          description: s.description,
+        });
       }),
-      type === 'long' &&
-        (0, _jsxruntime.jsxs)(_index.Box, {
+    ),
+    type === 'long' &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'div',
           ...labelProps,
           className: (0, _classnames.default)(
             'iui-stepper-steps-label',
             labelProps?.className,
           ),
-          children: [
-            (0, _jsxruntime.jsx)(_index.Box, {
-              as: 'span',
-              ...labelCountProps,
-              className: (0, _classnames.default)(
-                'iui-stepper-steps-label-count',
-                labelCountProps?.className,
-              ),
-              children: localization.stepsCountLabel(
-                boundedCurrentStep + 1,
-                steps.length,
-              ),
-            }),
-            steps[boundedCurrentStep].name,
-          ],
-        }),
-    ],
-  });
+        },
+        _react.createElement(
+          _index.Box,
+          {
+            as: 'span',
+            ...labelCountProps,
+            className: (0, _classnames.default)(
+              'iui-stepper-steps-label-count',
+              labelCountProps?.className,
+            ),
+          },
+          localization.stepsCountLabel(boundedCurrentStep + 1, steps.length),
+        ),
+        steps[boundedCurrentStep].name,
+      ),
+  );
 });

package/cjs/core/Stepper/StepperStep.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'StepperStep', {
 });
 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 _Tooltip = require('../Tooltip/Tooltip.js');
@@ -51,63 +50,76 @@ const StepperStep = _react.forwardRef((props, forwardedRef) => {
       onCompletedClick();
     }
   };
-  const stepShape = (0, _jsxruntime.jsxs)(_index.Box, {
-    as: 'li',
-    ...stepProps,
-    className: (0, _classnames.default)(
-      'iui-stepper-step',
-      {
-        'iui-current': isActive,
-        'iui-clickable': isClickable,
+  const stepShape = _react.createElement(
+    _index.Box,
+    {
+      as: 'li',
+      ...stepProps,
+      className: (0, _classnames.default)(
+        'iui-stepper-step',
+        {
+          'iui-current': isActive,
+          'iui-clickable': isClickable,
+        },
+        className,
+        stepProps?.className,
+      ),
+      style: {
+        inlineSize: type === 'default' ? `${100 / totalSteps}%` : undefined,
+        ...style,
+        ...stepProps?.style,
       },
-      className,
-      stepProps?.className,
-    ),
-    style: {
-      inlineSize: type === 'default' ? `${100 / totalSteps}%` : undefined,
-      ...style,
-      ...stepProps?.style,
+      onClick: onCompletedClick,
+      onKeyDown: onKeyDown,
+      'aria-current': isActive ? 'step' : undefined,
+      tabIndex: isClickable ? 0 : undefined,
+      ref: forwardedRef,
+      ...rest,
     },
-    onClick: onCompletedClick,
-    onKeyDown: onKeyDown,
-    'aria-current': isActive ? 'step' : undefined,
-    tabIndex: isClickable ? 0 : undefined,
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      (0, _jsxruntime.jsx)(_index.Box, {
+    _react.createElement(
+      _index.Box,
+      {
         as: 'div',
         ...trackContentProps,
         className: (0, _classnames.default)(
           'iui-stepper-track-content',
           trackContentProps?.className,
         ),
-        children: (0, _jsxruntime.jsx)(_index.Box, {
+      },
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           ...circleProps,
           className: (0, _classnames.default)(
             'iui-stepper-circle',
             circleProps?.className,
           ),
-          children: index + 1,
-        }),
-      }),
-      type === 'default' &&
-        (0, _jsxruntime.jsx)(_index.Box, {
+        },
+        index + 1,
+      ),
+    ),
+    type === 'default' &&
+      _react.createElement(
+        _index.Box,
+        {
           as: 'span',
           ...nameProps,
           className: (0, _classnames.default)(
             'iui-stepper-step-name',
             nameProps?.className,
           ),
-          children: title,
-        }),
-    ],
-  });
+        },
+        title,
+      ),
+  );
   return description
-    ? (0, _jsxruntime.jsx)(_Tooltip.Tooltip, {
-        content: description,
-        children: stepShape,
-      })
+    ? _react.createElement(
+        _Tooltip.Tooltip,
+        {
+          content: description,
+        },
+        stepShape,
+      )
     : stepShape;
 });

package/cjs/core/Stepper/WorkflowDiagram.js

@@ -10,33 +10,35 @@ Object.defineProperty(exports, 'WorkflowDiagram', {
 });
 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 _WorkflowDiagramStep = require('./WorkflowDiagramStep.js');
 const WorkflowDiagram = _react.forwardRef((props, ref) => {
   const { steps, className, contentProps, wrapperProps, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    as: 'div',
-    ...wrapperProps,
-    ref: ref,
-    children: (0, _jsxruntime.jsx)(_index.Box, {
-      as: 'ol',
-      className: (0, _classnames.default)('iui-workflow-diagram', className),
-      ...rest,
-      children: steps.map((s, index) => {
+  return _react.createElement(
+    _index.Box,
+    {
+      as: 'div',
+      ...wrapperProps,
+      ref: ref,
+    },
+    _react.createElement(
+      _index.Box,
+      {
+        as: 'ol',
+        className: (0, _classnames.default)('iui-workflow-diagram', className),
+        ...rest,
+      },
+      steps.map((s, index) => {
         const thisContentProps = contentProps?.(index);
-        return (0, _jsxruntime.jsx)(
-          _WorkflowDiagramStep.WorkflowDiagramStep,
-          {
-            contentProps: thisContentProps,
-            title: s.name,
-            description: s.description,
-          },
-          index,
-        );
+        return _react.createElement(_WorkflowDiagramStep.WorkflowDiagramStep, {
+          contentProps: thisContentProps,
+          key: index,
+          title: s.name,
+          description: s.description,
+        });
       }),
-    }),
-  });
+    ),
+  );
 });

package/cjs/core/Stepper/WorkflowDiagramStep.d.ts

@@ -7,4 +7,4 @@ export type WorkflowDiagramStepProps = {
      */
     contentProps?: React.ComponentProps<'span'>;
 } & Pick<StepperStepProps, 'title' | 'description'> & Omit<CommonProps, 'title'>;
-export declare const WorkflowDiagramStep: (props: WorkflowDiagramStepProps) => import("react/jsx-runtime").JSX.Element;
+export declare const WorkflowDiagramStep: (props: WorkflowDiagramStepProps) => React.JSX.Element;

package/cjs/core/Stepper/WorkflowDiagramStep.js

@@ -10,32 +10,43 @@ Object.defineProperty(exports, 'WorkflowDiagramStep', {
 });
 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 _Tooltip = require('../Tooltip/Tooltip.js');
 const _index = require('../../utils/index.js');
 const WorkflowDiagramStep = (props) => {
   const { title, description, className, style, contentProps, ...rest } = props;
-  const stepShape = (0, _jsxruntime.jsx)(_index.Box, {
-    as: 'li',
-    className: (0, _classnames.default)('iui-workflow-diagram-step', className),
-    style: style,
-    ...rest,
-    children: (0, _jsxruntime.jsx)(_index.Box, {
-      as: 'span',
-      ...contentProps,
+  const stepShape = _react.createElement(
+    _index.Box,
+    {
+      as: 'li',
       className: (0, _classnames.default)(
-        'iui-workflow-diagram-content',
-        contentProps?.className,
+        'iui-workflow-diagram-step',
+        className,
       ),
-      children: title,
-    }),
-  });
+      style: style,
+      ...rest,
+    },
+    _react.createElement(
+      _index.Box,
+      {
+        as: 'span',
+        ...contentProps,
+        className: (0, _classnames.default)(
+          'iui-workflow-diagram-content',
+          contentProps?.className,
+        ),
+      },
+      title,
+    ),
+  );
   return description
-    ? (0, _jsxruntime.jsx)(_Tooltip.Tooltip, {
-        content: description,
-        children: stepShape,
-      })
+    ? _react.createElement(
+        _Tooltip.Tooltip,
+        {
+          content: description,
+        },
+        stepShape,
+      )
     : stepShape;
 };

package/cjs/core/Surface/Surface.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, 'Surface', {
 });
 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');
@@ -49,12 +48,15 @@ const SurfaceHeader = _react.forwardRef((props, ref) => {
       setHasLayout(true);
     }
   }, [setHasLayout]);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)('iui-surface-header', className),
-    ref: ref,
-    ...rest,
-    children: children,
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)('iui-surface-header', className),
+      ref: ref,
+      ...rest,
+    },
+    children,
+  );
 });
 const SurfaceBody = _react.forwardRef((props, ref) => {
   const { children, className, isPadded, ...rest } = props;
@@ -64,13 +66,16 @@ const SurfaceBody = _react.forwardRef((props, ref) => {
       setHasLayout(true);
     }
   }, [setHasLayout]);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)('iui-surface-body', className),
-    ref: ref,
-    'data-iui-padded': isPadded ? 'true' : undefined,
-    ...rest,
-    children: children,
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)('iui-surface-body', className),
+      ref: ref,
+      'data-iui-padded': isPadded ? 'true' : undefined,
+      ...rest,
+    },
+    children,
+  );
 });
 const Surface = Object.assign(
   _react.forwardRef((props, ref) => {
@@ -88,19 +93,25 @@ const Surface = Object.assign(
       '--iui-surface-border': getBorderValue(border),
       ...style,
     };
-    return (0, _jsxruntime.jsx)(_index.Box, {
-      className: (0, _classnames.default)('iui-surface', className),
-      style: _style,
-      ref: ref,
-      'data-iui-layout': hasLayout ? 'true' : undefined,
-      ...rest,
-      children: (0, _jsxruntime.jsx)(SurfaceContext.Provider, {
-        value: {
-          setHasLayout,
+    return _react.createElement(
+      _index.Box,
+      {
+        className: (0, _classnames.default)('iui-surface', className),
+        style: _style,
+        ref: ref,
+        'data-iui-layout': hasLayout ? 'true' : undefined,
+        ...rest,
+      },
+      _react.createElement(
+        SurfaceContext.Provider,
+        {
+          value: {
+            setHasLayout,
+          },
         },
-        children: children,
-      }),
-    });
+        children,
+      ),
+    );
   }),
   {
     Header: SurfaceHeader,

package/cjs/core/Table/SubRowExpander.d.ts

@@ -8,4 +8,4 @@ export type SubRowExpanderProps<T extends Record<string, unknown>> = {
     density?: 'default' | 'condensed' | 'extra-condensed';
     [k: string]: unknown;
 };
-export declare const SubRowExpander: <T extends Record<string, unknown>>(props: SubRowExpanderProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const SubRowExpander: <T extends Record<string, unknown>>(props: SubRowExpanderProps<T>) => React.JSX.Element;

package/cjs/core/Table/SubRowExpander.js

@@ -9,36 +9,40 @@ Object.defineProperty(exports, 'SubRowExpander', {
   },
 });
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
 const _IconButton = require('../Buttons/IconButton.js');
 const SubRowExpander = (props) => {
   const { cell, isDisabled, cellProps, expanderCell, density, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
-    children: expanderCell
+  return _react.createElement(
+    _react.Fragment,
+    null,
+    expanderCell
       ? expanderCell(cellProps)
-      : (0, _jsxruntime.jsx)(_IconButton.IconButton, {
-          'aria-label': 'Toggle sub row',
-          'aria-expanded': cell.row.isExpanded ? 'true' : 'false',
-          style: {
-            marginInlineEnd:
-              density === 'default' || density === undefined ? 8 : 4,
-          },
-          className: 'iui-table-row-expander',
-          styleType: 'borderless',
-          size: 'small',
-          onClick: (e) => {
-            e.stopPropagation();
-            cell.row.toggleRowExpanded();
+      : _react.createElement(
+          _IconButton.IconButton,
+          {
+            'aria-label': 'Toggle sub row',
+            'aria-expanded': cell.row.isExpanded ? 'true' : 'false',
+            style: {
+              marginInlineEnd:
+                density === 'default' || density === undefined ? 8 : 4,
+            },
+            className: 'iui-table-row-expander',
+            styleType: 'borderless',
+            size: 'small',
+            onClick: (e) => {
+              e.stopPropagation();
+              cell.row.toggleRowExpanded();
+            },
+            disabled: isDisabled,
+            ...rest,
           },
-          disabled: isDisabled,
-          ...rest,
-          children: (0, _jsxruntime.jsx)(_index.SvgChevronRight, {
+          _react.createElement(_index.SvgChevronRight, {
             style: {
               transform: cell.row.isExpanded ? 'rotate(90deg)' : undefined,
             },
           }),
-        }),
-  });
+        ),
+  );
 };