@itwin/itwinui-react 3.12.0 → 3.12.2

package/esm/core/InputGroup/InputGroup.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import cx from 'classnames';
 import { Box } from '../../utils/index.js';
@@ -21,37 +20,44 @@ export const InputGroup = React.forwardRef((props, forwardedRef) => {
     messageProps,
     ...rest
   } = props;
-  return _jsxs(InputGrid, {
-    ref: forwardedRef,
-    as: 'div',
-    labelPlacement: displayStyle,
-    className: cx('iui-input-group-wrapper', className),
-    'data-iui-status': status,
-    ...rest,
-    children: [
-      label &&
-        _jsx(Label, {
+  return React.createElement(
+    InputGrid,
+    {
+      ref: forwardedRef,
+      as: 'div',
+      labelPlacement: displayStyle,
+      className: cx('iui-input-group-wrapper', className),
+      'data-iui-status': status,
+      ...rest,
+    },
+    label &&
+      React.createElement(
+        Label,
+        {
           as: 'label',
           required: required,
           disabled: disabled,
           ...labelProps,
-          children: label,
-        }),
-      _jsx(Box, {
+        },
+        label,
+      ),
+    React.createElement(
+      Box,
+      {
         as: 'div',
         ...innerProps,
         className: cx('iui-input-group', innerProps?.className),
-        children: children,
-      }),
-      _jsx(BottomMessage, {
-        message: message,
-        status: status,
-        svgIcon: svgIcon,
-        displayStyle: displayStyle,
-        messageProps: messageProps,
-      }),
-    ],
-  });
+      },
+      children,
+    ),
+    React.createElement(BottomMessage, {
+      message: message,
+      status: status,
+      svgIcon: svgIcon,
+      displayStyle: displayStyle,
+      messageProps: messageProps,
+    }),
+  );
 });
 const BottomMessage = (props) => {
   const { message, status, svgIcon, displayStyle, messageProps } = props;
@@ -59,15 +65,18 @@ const BottomMessage = (props) => {
     return message;
   }
   if (message || status || svgIcon) {
-    return _jsx(StatusMessage, {
-      iconProps: {
-        'aria-hidden': true,
+    return React.createElement(
+      StatusMessage,
+      {
+        iconProps: {
+          'aria-hidden': true,
+        },
+        startIcon: svgIcon,
+        status: status,
+        ...messageProps,
       },
-      startIcon: svgIcon,
-      status: status,
-      ...messageProps,
-      children: displayStyle !== 'inline' && message,
-    });
+      displayStyle !== 'inline' && message,
+    );
   }
   return null;
 };

package/esm/core/InputWithDecorations/InputWithDecorations.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import {
   Box,
@@ -10,26 +9,32 @@ import {
 const InputWithDecorationsContext = React.createContext(undefined);
 const InputWithDecorationsComponent = React.forwardRef((props, ref) => {
   const { children, size, isDisabled, ...rest } = props;
-  return _jsx(InputWithDecorationsContext.Provider, {
-    value: {
-      size,
-      isDisabled,
+  return React.createElement(
+    InputWithDecorationsContext.Provider,
+    {
+      value: {
+        size,
+        isDisabled,
+      },
     },
-    children: _jsx(InputFlexContainer, {
-      isDisabled: isDisabled,
-      size: size,
-      ref: ref,
-      ...rest,
-      children: children,
-    }),
-  });
+    React.createElement(
+      InputFlexContainer,
+      {
+        isDisabled: isDisabled,
+        size: size,
+        ref: ref,
+        ...rest,
+      },
+      children,
+    ),
+  );
 });
 const InputWithDecorationsInput = React.forwardRef((props, ref) => {
   const { id: idProp, size, disabled: localDisabled, ...rest } = props;
   const { size: contextSize, isDisabled } = useSafeContext(
     InputWithDecorationsContext,
   );
-  return _jsx(Box, {
+  return React.createElement(Box, {
     as: 'input',
     ref: ref,
     'data-iui-size': size ?? contextSize,
@@ -44,13 +49,16 @@ const InputWithDecorationsButton = React.forwardRef((props, ref) => {
   const { size: contextSize, isDisabled } = useSafeContext(
     InputWithDecorationsContext,
   );
-  return _jsx(InputFlexContainerButton, {
-    ref: ref,
-    size: size ?? contextSize,
-    disabled: localDisabled ?? isDisabled,
-    ...rest,
-    children: children,
-  });
+  return React.createElement(
+    InputFlexContainerButton,
+    {
+      ref: ref,
+      size: size ?? contextSize,
+      disabled: localDisabled ?? isDisabled,
+      ...rest,
+    },
+    children,
+  );
 });
 InputWithDecorationsButton.displayName = 'InputWithDecorations.Button';
 const InputWithDecorationsIcon = InputFlexContainerIcon;

package/esm/core/Label/Label.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import cx from 'classnames';
 import { Box } from '../../utils/index.js';
@@ -11,19 +10,22 @@ export const Label = React.forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  return _jsx(Box, {
-    as: 'label',
-    className: cx(
-      'iui-input-label',
-      {
-        'iui-inline': displayStyle === 'inline',
-        'iui-required': required,
-      },
-      className,
-    ),
-    'data-iui-disabled': disabled ? true : undefined,
-    ref: forwardedRef,
-    ...rest,
-    children: children,
-  });
+  return React.createElement(
+    Box,
+    {
+      as: 'label',
+      className: cx(
+        'iui-input-label',
+        {
+          'iui-inline': displayStyle === 'inline',
+          'iui-required': required,
+        },
+        className,
+      ),
+      'data-iui-disabled': disabled ? true : undefined,
+      ref: forwardedRef,
+      ...rest,
+    },
+    children,
+  );
 });

package/esm/core/LabeledInput/LabeledInput.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Input } from '../Input/Input.js';
 import { InputWithIcon, StatusIconMap } from '../../utils/index.js';
@@ -25,45 +24,54 @@ export const LabeledInput = React.forwardRef((props, ref) => {
   } = props;
   const icon = svgIcon ?? (status && StatusIconMap[status]());
   const shouldShowIcon = svgIcon !== null && (svgIcon || (status && !message));
-  return _jsxs(InputGrid, {
-    labelPlacement: displayStyle,
-    'data-iui-status': status,
-    ...wrapperProps,
-    children: [
-      label &&
-        _jsx(Label, {
+  return React.createElement(
+    InputGrid,
+    {
+      labelPlacement: displayStyle,
+      'data-iui-status': status,
+      ...wrapperProps,
+    },
+    label &&
+      React.createElement(
+        Label,
+        {
           as: 'label',
           required: required,
           disabled: disabled,
           ...labelProps,
-          children: label,
-        }),
-      _jsxs(InputWithIcon, {
-        ...inputWrapperProps,
-        children: [
-          _jsx(Input, {
-            disabled: disabled,
-            required: required,
-            ref: ref,
-            ...rest,
-          }),
-          shouldShowIcon &&
-            _jsx(Icon, {
-              fill: status,
-              ...iconProps,
-              className: cx('iui-end-icon', iconProps?.className),
-              children: icon,
-            }),
-        ],
+        },
+        label,
+      ),
+    React.createElement(
+      InputWithIcon,
+      inputWrapperProps,
+      React.createElement(Input, {
+        disabled: disabled,
+        required: required,
+        ref: ref,
+        ...rest,
       }),
-      typeof message === 'string'
-        ? _jsx(StatusMessage, {
+      shouldShowIcon &&
+        React.createElement(
+          Icon,
+          {
+            fill: status,
+            ...iconProps,
+            className: cx('iui-end-icon', iconProps?.className),
+          },
+          icon,
+        ),
+    ),
+    typeof message === 'string'
+      ? React.createElement(
+          StatusMessage,
+          {
             status: status,
             iconProps: iconProps,
             contentProps: messageContentProps,
-            children: message,
-          })
-        : message,
-    ],
-  });
+          },
+          message,
+        )
+      : message,
+  );
 });

package/esm/core/LabeledSelect/LabeledSelect.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Select } from '../Select/Select.js';
 import { StatusMessage } from '../StatusMessage/StatusMessage.js';
@@ -21,39 +20,46 @@ export const LabeledSelect = React.forwardRef((props, forwardedRef) => {
     messageIconProps,
     ...rest
   } = props;
-  return _jsxs(InputGrid, {
-    labelPlacement: displayStyle,
-    'data-iui-status': status,
-    ...wrapperProps,
-    children: [
-      label &&
-        _jsx(Label, {
+  return React.createElement(
+    InputGrid,
+    {
+      labelPlacement: displayStyle,
+      'data-iui-status': status,
+      ...wrapperProps,
+    },
+    label &&
+      React.createElement(
+        Label,
+        {
           as: 'div',
           required: required,
           disabled: disabled,
           ...labelProps,
-          children: label,
-        }),
-      _jsx(Select, {
-        disabled: disabled,
-        className: className,
-        style: style,
-        required: props.native ? required : undefined,
-        ...rest,
-        ref: forwardedRef,
-        ...{
-          styleType: 'default',
         },
-      }),
-      typeof message === 'string'
-        ? _jsx(StatusMessage, {
+        label,
+      ),
+    React.createElement(Select, {
+      disabled: disabled,
+      className: className,
+      style: style,
+      required: props.native ? required : undefined,
+      ...rest,
+      ref: forwardedRef,
+      ...{
+        styleType: 'default',
+      },
+    }),
+    typeof message === 'string'
+      ? React.createElement(
+          StatusMessage,
+          {
             status: status,
             startIcon: svgIcon,
             iconProps: messageIconProps,
             contentProps: messageContentProps,
-            children: message,
-          })
-        : message,
-    ],
-  });
+          },
+          message,
+        )
+      : message,
+  );
 });

package/esm/core/LabeledSelect/LabeledSelect.types-test.js

@@ -1,10 +1,11 @@
-import { jsx as _jsx, Fragment as _Fragment } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import { LabeledSelect } from './LabeledSelect.js';
 () => {
   const ref = useRef(null);
-  return _jsx(_Fragment, {
-    children: _jsx(LabeledSelect, {
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(LabeledSelect, {
       options: [
         {
           value: 1,
@@ -25,11 +26,13 @@ import { LabeledSelect } from './LabeledSelect.js';
       },
       ref: ref,
     }),
-  });
+  );
 };
 () => {
-  return _jsx(_Fragment, {
-    children: _jsx(LabeledSelect, {
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(LabeledSelect, {
       options: [
         {
           value: 1,
@@ -49,11 +52,13 @@ import { LabeledSelect } from './LabeledSelect.js';
         return returnValue;
       },
     }),
-  });
+  );
 };
 () => {
-  return _jsx(_Fragment, {
-    children: _jsx(LabeledSelect, {
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(LabeledSelect, {
       label: 'Select Label',
       options: [
         {
@@ -74,11 +79,13 @@ import { LabeledSelect } from './LabeledSelect.js';
         return returnValue;
       },
     }),
-  });
+  );
 };
 () => {
-  return _jsx(_Fragment, {
-    children: _jsx(LabeledSelect, {
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(LabeledSelect, {
       label: 'Select Label',
       options: [
         {
@@ -91,5 +98,5 @@ import { LabeledSelect } from './LabeledSelect.js';
         return returnValue;
       },
     }),
-  });
+  );
 };

package/esm/core/LabeledTextarea/LabeledTextarea.js

@@ -1,8 +1,7 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { LabeledInput } from '../LabeledInput/LabeledInput.js';
 export const LabeledTextarea = React.forwardRef((props, forwardedRef) => {
-  return _jsx(LabeledInput, {
+  return React.createElement(LabeledInput, {
     as: 'textarea',
     rows: 3,
     ref: forwardedRef,

package/esm/core/LinkAction/LinkAction.js

@@ -1,11 +1,10 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import cx from 'classnames';
 import { polymorphic } from '../../utils/functions/polymorphic.js';
 import { Box } from '../../utils/components/index.js';
 export const LinkAction = React.forwardRef((props, forwardedRef) => {
   const { as: asProp = !!props.href ? 'a' : 'button' } = props;
-  return _jsx(Box, {
+  return React.createElement(Box, {
     ...props,
     as: asProp,
     className: cx('iui-link-action', props.className),

package/esm/core/List/ListItem.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import cx from 'classnames';
 import { polymorphic, Box } from '../../utils/index.js';
@@ -13,7 +12,7 @@ const ListItemComponent = React.forwardRef((props, ref) => {
     className,
     ...rest
   } = props;
-  return _jsx(Box, {
+  return React.createElement(Box, {
     as: 'li',
     className: cx('iui-list-item', className),
     'data-iui-active': active ? 'true' : undefined,

package/esm/core/Menu/Menu.js

@@ -1,8 +1,3 @@
-import {
-  jsx as _jsx,
-  jsxs as _jsxs,
-  Fragment as _Fragment,
-} from 'react/jsx-runtime';
 import * as React from 'react';
 import cx from 'classnames';
 import {
@@ -169,40 +164,55 @@ export const Menu = React.forwardRef((props, ref) => {
   );
   const floating =
     popover.open &&
-    _jsx(Portal, {
-      portal: portal,
-      children: _jsx(Box, {
-        as: 'div',
-        className: cx('iui-menu', className),
-        ref: refs,
-        ...getFloatingProps(
-          popover.getFloatingProps({
-            role: 'menu',
-            ...rest,
-          }),
-        ),
-        children: children,
-      }),
-    });
-  return _jsx(_Fragment, {
-    children: _jsxs(MenuContext.Provider, {
-      value: {
-        popoverGetItemProps,
-        focusableElements,
+    React.createElement(
+      Portal,
+      {
+        portal: portal,
+      },
+      React.createElement(
+        Box,
+        {
+          as: 'div',
+          className: cx('iui-menu', className),
+          ref: refs,
+          ...getFloatingProps(
+            popover.getFloatingProps({
+              role: 'menu',
+              ...rest,
+            }),
+          ),
+        },
+        children,
+      ),
+    );
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(
+      MenuContext.Provider,
+      {
+        value: {
+          popoverGetItemProps,
+          focusableElements,
+        },
       },
-      children: [
-        _jsx(PopoverOpenContext.Provider, {
+      React.createElement(
+        PopoverOpenContext.Provider,
+        {
           value: popover.open,
-          children: reference,
-        }),
-        tree != null
-          ? _jsx(FloatingNode, {
+        },
+        reference,
+      ),
+      tree != null
+        ? React.createElement(
+            FloatingNode,
+            {
               id: nodeId,
-              children: floating,
-            })
-          : floating,
-      ],
-    }),
-  });
+            },
+            floating,
+          )
+        : floating,
+    ),
+  );
 });
 export const MenuContext = React.createContext(undefined);