@itwin/itwinui-react 3.12.0 → 3.12.2

package/esm/core/Menu/MenuItem.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 {
   SvgCaretRightSmall,
@@ -65,70 +60,79 @@ export const MenuItem = React.forwardRef((props, forwardedRef) => {
   const focusableItemIndex = parentMenu?.focusableElements.findIndex(
     (el) => el === menuItemRef.current,
   );
-  const trigger = _jsxs(ListItem, {
-    as: 'button',
-    type: 'button',
-    className: cx('iui-button-base', className),
-    actionable: true,
-    size: size,
-    active: isSelected,
-    disabled: disabled,
-    ref: useMergedRefs(menuItemRef, forwardedRef),
-    role: role,
-    tabIndex: isSelected ? 0 : -1,
-    'aria-selected': isSelected,
-    'aria-haspopup': subMenuItems.length > 0 ? 'true' : undefined,
-    'aria-controls': subMenuItems.length > 0 ? submenuId : undefined,
-    'aria-disabled': disabled,
-    ...(parentMenu?.popoverGetItemProps != null
-      ? parentMenu.popoverGetItemProps({
-          focusableItemIndex,
-          userProps: handlers,
-        })
-      : handlers),
-    ...rest,
-    children: [
-      startIcon &&
-        _jsx(ListItem.Icon, {
+  const trigger = React.createElement(
+    ListItem,
+    {
+      as: 'button',
+      type: 'button',
+      className: cx('iui-button-base', className),
+      actionable: true,
+      size: size,
+      active: isSelected,
+      disabled: disabled,
+      ref: useMergedRefs(menuItemRef, forwardedRef),
+      role: role,
+      tabIndex: isSelected ? 0 : -1,
+      'aria-selected': isSelected,
+      'aria-haspopup': subMenuItems.length > 0 ? 'true' : undefined,
+      'aria-controls': subMenuItems.length > 0 ? submenuId : undefined,
+      'aria-disabled': disabled,
+      ...(parentMenu?.popoverGetItemProps != null
+        ? parentMenu.popoverGetItemProps({
+            focusableItemIndex,
+            userProps: handlers,
+          })
+        : handlers),
+      ...rest,
+    },
+    startIcon &&
+      React.createElement(
+        ListItem.Icon,
+        {
           as: 'span',
           'aria-hidden': true,
-          children: startIcon,
-        }),
-      _jsxs(ListItem.Content, {
-        children: [
-          _jsx('div', {
-            children: children,
-          }),
-          sublabel &&
-            _jsx(ListItem.Description, {
-              children: sublabel,
-            }),
-        ],
-      }),
-      !endIcon &&
-        subMenuItems.length > 0 &&
-        _jsx(ListItem.Icon, {
+        },
+        startIcon,
+      ),
+    React.createElement(
+      ListItem.Content,
+      null,
+      React.createElement('div', null, children),
+      sublabel && React.createElement(ListItem.Description, null, sublabel),
+    ),
+    !endIcon &&
+      subMenuItems.length > 0 &&
+      React.createElement(
+        ListItem.Icon,
+        {
           as: 'span',
           'aria-hidden': true,
-          children: _jsx(SvgCaretRightSmall, {}),
-        }),
-      endIcon &&
-        _jsx(ListItem.Icon, {
+        },
+        React.createElement(SvgCaretRightSmall, null),
+      ),
+    endIcon &&
+      React.createElement(
+        ListItem.Icon,
+        {
           as: 'span',
           'aria-hidden': true,
-          children: endIcon,
-        }),
-    ],
-  });
-  return _jsx(_Fragment, {
-    children:
-      subMenuItems.length > 0 && !disabled
-        ? _jsx(Menu, {
+        },
+        endIcon,
+      ),
+  );
+  return React.createElement(
+    React.Fragment,
+    null,
+    subMenuItems.length > 0 && !disabled
+      ? React.createElement(
+          Menu,
+          {
             id: submenuId,
             trigger: trigger,
             popoverProps: popoverProps,
-            children: subMenuItems,
-          })
-        : trigger,
-  });
+          },
+          subMenuItems,
+        )
+      : trigger,
+  );
 });

package/esm/core/Menu/MenuItemSkeleton.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';
@@ -15,41 +14,41 @@ export const MenuItemSkeleton = React.forwardRef((props, forwardedRef) => {
     style,
     ...rest
   } = props;
-  return _jsxs(Box, {
-    className: cx('iui-menu-item-skeleton', className),
-    'data-iui-size': hasSublabel && 'large',
-    style: {
-      ...{
-        '--iui-menu-item-content-skeleton-max-width': contentWidth,
+  return React.createElement(
+    Box,
+    {
+      className: cx('iui-menu-item-skeleton', className),
+      'data-iui-size': hasSublabel && 'large',
+      style: {
+        ...{
+          '--iui-menu-item-content-skeleton-max-width': contentWidth,
+        },
+        ...style,
       },
-      ...style,
+      ref: forwardedRef,
+      ...rest,
     },
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      hasIcon &&
-        _jsx(Box, {
-          className: 'iui-icon iui-skeleton',
-          'aria-hidden': true,
-        }),
-      _jsxs(Box, {
+    hasIcon &&
+      React.createElement(Box, {
+        className: 'iui-icon iui-skeleton',
+        'aria-hidden': true,
+      }),
+    React.createElement(
+      Box,
+      {
         as: 'span',
         className: 'iui-content',
-        children: [
-          _jsx(Box, {
-            className: 'iui-menu-label iui-skeleton',
-            'aria-hidden': true,
-          }),
-          hasSublabel &&
-            _jsx(Box, {
-              className: 'iui-menu-description iui-skeleton',
-              'aria-hidden': true,
-            }),
-          _jsx(VisuallyHidden, {
-            children: translatedStrings.loading,
-          }),
-        ],
+      },
+      React.createElement(Box, {
+        className: 'iui-menu-label iui-skeleton',
+        'aria-hidden': true,
       }),
-    ],
-  });
+      hasSublabel &&
+        React.createElement(Box, {
+          className: 'iui-menu-description iui-skeleton',
+          'aria-hidden': true,
+        }),
+      React.createElement(VisuallyHidden, null, translatedStrings.loading),
+    ),
+  );
 });

package/esm/core/Modal/Modal.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Dialog } from '../Dialog/Dialog.js';
 export const Modal = React.forwardRef((props, forwardedRef) => {
@@ -16,33 +15,33 @@ export const Modal = React.forwardRef((props, forwardedRef) => {
     titleBarProps,
     ...rest
   } = props;
-  return _jsxs(Dialog, {
-    isOpen: isOpen,
-    closeOnEsc: closeOnEsc,
-    closeOnExternalClick: closeOnExternalClick,
-    isDismissible: isDismissible,
-    onClose: onClose,
-    preventDocumentScroll: true,
-    trapFocus: true,
-    setFocus: true,
-    ref: forwardedRef,
-    portal: portal,
-    ...wrapperProps,
-    children: [
-      _jsx(Dialog.Backdrop, {
-        ...backdropProps,
-      }),
-      _jsxs(Dialog.Main, {
+  return React.createElement(
+    Dialog,
+    {
+      isOpen: isOpen,
+      closeOnEsc: closeOnEsc,
+      closeOnExternalClick: closeOnExternalClick,
+      isDismissible: isDismissible,
+      onClose: onClose,
+      preventDocumentScroll: true,
+      trapFocus: true,
+      setFocus: true,
+      ref: forwardedRef,
+      portal: portal,
+      ...wrapperProps,
+    },
+    React.createElement(Dialog.Backdrop, backdropProps),
+    React.createElement(
+      Dialog.Main,
+      {
         'aria-modal': true,
         ...rest,
-        children: [
-          _jsx(Dialog.TitleBar, {
-            titleText: title,
-            ...titleBarProps,
-          }),
-          children,
-        ],
+      },
+      React.createElement(Dialog.TitleBar, {
+        titleText: title,
+        ...titleBarProps,
       }),
-    ],
-  });
+      children,
+    ),
+  );
 });

package/esm/core/NonIdealState/ErrorPage.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 { Button } from '../Buttons/Button.js';
 import { NonIdealState } from './NonIdealState.js';
@@ -68,33 +63,33 @@ export const ErrorPage = React.forwardRef((props, forwardedRef) => {
       case '305':
       case '307':
       case '308': {
-        return _jsx(SvgRedirect, {});
+        return React.createElement(SvgRedirect, null);
       }
       case '401': {
-        return _jsx(Svg401, {});
+        return React.createElement(Svg401, null);
       }
       case '403': {
-        return _jsx(Svg403, {});
+        return React.createElement(Svg403, null);
       }
       case '404': {
-        return _jsx(Svg404, {});
+        return React.createElement(Svg404, null);
       }
       case '408':
       case '504': {
-        return _jsx(SvgTimedOut, {});
+        return React.createElement(SvgTimedOut, null);
       }
       case '500': {
-        return _jsx(Svg500, {});
+        return React.createElement(Svg500, null);
       }
       case '502': {
-        return _jsx(Svg502, {});
+        return React.createElement(Svg502, null);
       }
       case '503': {
-        return _jsx(Svg503, {});
+        return React.createElement(Svg503, null);
       }
       case 'generic':
       default: {
-        return _jsx(SvgError, {});
+        return React.createElement(SvgError, null);
       }
     }
   }
@@ -145,21 +140,27 @@ export const ErrorPage = React.forwardRef((props, forwardedRef) => {
     if (!primaryButtonHandle || !primaryButtonLabel) {
       return null;
     }
-    return _jsx(Button, {
-      styleType: 'high-visibility',
-      onClick: primaryButtonHandle,
-      children: primaryButtonLabel,
-    });
+    return React.createElement(
+      Button,
+      {
+        styleType: 'high-visibility',
+        onClick: primaryButtonHandle,
+      },
+      primaryButtonLabel,
+    );
   }
   function getSecondaryButton() {
     if (!secondaryButtonHandle || !secondaryButtonLabel) {
       return null;
     }
-    return _jsx(Button, {
-      styleType: 'default',
-      onClick: secondaryButtonHandle,
-      children: secondaryButtonLabel,
-    });
+    return React.createElement(
+      Button,
+      {
+        styleType: 'default',
+        onClick: secondaryButtonHandle,
+      },
+      secondaryButtonLabel,
+    );
   }
   function getActions() {
     const primaryButton = getPrimaryButton();
@@ -167,15 +168,21 @@ export const ErrorPage = React.forwardRef((props, forwardedRef) => {
     if (!primaryButton && !secondaryButton) {
       return null;
     }
-    return _jsxs(_Fragment, {
-      children: [primaryButton, secondaryButton],
-    });
+    return React.createElement(
+      React.Fragment,
+      null,
+      primaryButton,
+      secondaryButton,
+    );
   }
-  return _jsx(NonIdealState, {
-    svg: _jsx(React.Suspense, {
-      fallback: _jsx(ProgressRadial, {}),
-      children: getErrorIcon(),
-    }),
+  return React.createElement(NonIdealState, {
+    svg: React.createElement(
+      React.Suspense,
+      {
+        fallback: React.createElement(ProgressRadial, null),
+      },
+      getErrorIcon(),
+    ),
     heading: getHeadingMessage(),
     description: errorMessage,
     actions: getActions(),

package/esm/core/NonIdealState/NonIdealState.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Box } from '../../utils/index.js';
 import cx from 'classnames';
@@ -15,44 +14,57 @@ export const NonIdealState = React.forwardRef((props, forwardedRef) => {
     actionsProps,
     ...rest
   } = props;
-  return _jsxs(Box, {
-    className: cx('iui-non-ideal-state', className),
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      _jsx(Box, {
+  return React.createElement(
+    Box,
+    {
+      className: cx('iui-non-ideal-state', className),
+      ref: forwardedRef,
+      ...rest,
+    },
+    React.createElement(
+      Box,
+      {
         as: 'div',
         ...illustrationProps,
         className: cx(
           'iui-non-ideal-state-illustration',
           illustrationProps?.className,
         ),
-        children: svg,
-      }),
-      heading &&
-        _jsx(Box, {
+      },
+      svg,
+    ),
+    heading &&
+      React.createElement(
+        Box,
+        {
           as: 'div',
           ...titleProps,
           className: cx('iui-non-ideal-state-title', titleProps?.className),
-          children: heading,
-        }),
-      description &&
-        _jsx(Box, {
+        },
+        heading,
+      ),
+    description &&
+      React.createElement(
+        Box,
+        {
           as: 'div',
           ...descriptionProps,
           className: cx(
             'iui-non-ideal-state-description',
             descriptionProps?.className,
           ),
-          children: description,
-        }),
-      actions &&
-        _jsx(Box, {
+        },
+        description,
+      ),
+    actions &&
+      React.createElement(
+        Box,
+        {
           as: 'div',
           ...actionsProps,
           className: cx('iui-non-ideal-state-actions', actionsProps?.className),
-          children: actions,
-        }),
-    ],
-  });
+        },
+        actions,
+      ),
+  );
 });

package/esm/core/NotificationMarker/NotificationMarker.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Box } from '../../utils/index.js';
 import cx from 'classnames';
@@ -11,18 +10,21 @@ export const NotificationMarker = React.forwardRef((props, ref) => {
     enabled = true,
     ...rest
   } = props;
-  return _jsx(Box, {
-    as: 'span',
-    ref: ref,
-    className: cx(
-      {
-        'iui-notification-marker': enabled,
-      },
-      className,
-    ),
-    'data-iui-variant': enabled ? status : null,
-    'data-iui-urgent': enabled ? pulsing : null,
-    ...rest,
-    children: children,
-  });
+  return React.createElement(
+    Box,
+    {
+      as: 'span',
+      ref: ref,
+      className: cx(
+        {
+          'iui-notification-marker': enabled,
+        },
+        className,
+      ),
+      'data-iui-variant': enabled ? status : null,
+      'data-iui-urgent': enabled ? pulsing : null,
+      ...rest,
+    },
+    children,
+  );
 });

package/esm/core/Overlay/Overlay.js

@@ -1,31 +1,30 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Box, polymorphic } from '../../utils/index.js';
 const OverlayComponent = React.forwardRef((props, forwardedRef) => {
   const { content, children, ...rest } = props;
-  return _jsxs(OverlayWrapper, {
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      _jsx(OverlayOverlay, {
-        children: content,
-      }),
-      _jsx(OverlayHiddenContent, {
-        children: children,
-      }),
-    ],
-  });
+  return React.createElement(
+    OverlayWrapper,
+    {
+      ref: forwardedRef,
+      ...rest,
+    },
+    React.createElement(OverlayOverlay, null, content),
+    React.createElement(OverlayHiddenContent, null, children),
+  );
 });
 OverlayComponent.displayName = 'Overlay';
 const OverlayHiddenContent = React.forwardRef((props, ref) => {
   const { children, ...rest } = props;
   useInertPolyfill();
-  return _jsx(Box, {
-    inert: '',
-    ref: ref,
-    ...rest,
-    children: children,
-  });
+  return React.createElement(
+    Box,
+    {
+      inert: '',
+      ref: ref,
+      ...rest,
+    },
+    children,
+  );
 });
 OverlayHiddenContent.displayName = 'Overlay.HiddenContent';
 const OverlayOverlay = polymorphic('iui-overlay');