@itwin/itwinui-react 3.12.0 → 3.12.2

package/esm/core/FileUpload/FileEmptyCard.js

@@ -1,40 +1,33 @@
-import {
-  jsx as _jsx,
-  jsxs as _jsxs,
-  Fragment as _Fragment,
-} from 'react/jsx-runtime';
 import * as React from 'react';
 import { Box, polymorphic, SvgUpload } from '../../utils/index.js';
 import cx from 'classnames';
 import { FileUploadCard } from './FileUploadCard.js';
 const FileEmptyCardIcon = polymorphic.span('iui-file-card-empty-icon', {
-  children: _jsx(SvgUpload, {}),
+  children: React.createElement(SvgUpload, null),
 });
 const FileEmptyCardText = polymorphic.span('iui-file-card-empty-action');
 const FileEmptyCardComponent = React.forwardRef((props, ref) => {
   const { children, className, ...rest } = props;
-  return _jsx(Box, {
-    className: cx('iui-file-card-empty', className),
-    ref: ref,
-    ...rest,
-    children:
-      children ??
-      _jsxs(_Fragment, {
-        children: [
-          _jsx(FileEmptyCard.Icon, {}),
-          _jsxs(FileEmptyCard.Text, {
-            children: [
-              _jsx(FileUploadCard.InputLabel, {
-                children: 'Choose a file',
-              }),
-              _jsx('div', {
-                children: 'to upload.',
-              }),
-            ],
-          }),
-        ],
-      }),
-  });
+  return React.createElement(
+    Box,
+    {
+      className: cx('iui-file-card-empty', className),
+      ref: ref,
+      ...rest,
+    },
+    children ??
+      React.createElement(
+        React.Fragment,
+        null,
+        React.createElement(FileEmptyCard.Icon, null),
+        React.createElement(
+          FileEmptyCard.Text,
+          null,
+          React.createElement(FileUploadCard.InputLabel, null, 'Choose a file'),
+          React.createElement('div', null, 'to upload.'),
+        ),
+      ),
+  );
 });
 export const FileEmptyCard = Object.assign(FileEmptyCardComponent, {
   Icon: FileEmptyCardIcon,

package/esm/core/FileUpload/FileUpload.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, mergeEventHandlers } from '../../utils/index.js';
@@ -31,36 +30,43 @@ export const FileUpload = React.forwardRef((props, forwardedRef) => {
       onFileDropped(e.dataTransfer?.files, e);
     }
   };
-  return _jsxs(Box, {
-    ...rest,
-    className: cx(
-      'iui-file-upload',
-      {
-        'iui-drag': isDragActive,
-      },
-      props?.className,
-    ),
-    ref: forwardedRef,
-    onDragEnter: mergeEventHandlers(props.onDragEnter, onDragEnterHandler),
-    onDragOver: mergeEventHandlers(props.onDragOver, onDragOverHandler),
-    onDragLeave: mergeEventHandlers(props.onDragLeave, onDragLeaveHandler),
-    onDrop: mergeEventHandlers(props.onDrop, onDropHandler),
-    children: [
-      dragContent
-        ? children
-        : _jsx(Box, {
+  return React.createElement(
+    Box,
+    {
+      ...rest,
+      className: cx(
+        'iui-file-upload',
+        {
+          'iui-drag': isDragActive,
+        },
+        props?.className,
+      ),
+      ref: forwardedRef,
+      onDragEnter: mergeEventHandlers(props.onDragEnter, onDragEnterHandler),
+      onDragOver: mergeEventHandlers(props.onDragOver, onDragOverHandler),
+      onDragLeave: mergeEventHandlers(props.onDragLeave, onDragLeaveHandler),
+      onDrop: mergeEventHandlers(props.onDrop, onDropHandler),
+    },
+    dragContent
+      ? children
+      : React.createElement(
+          Box,
+          {
             as: 'div',
             ...contentProps,
             className: cx('iui-content', contentProps?.className),
-            children: children,
-          }),
-      dragContent &&
-        _jsx(Box, {
+          },
+          children,
+        ),
+    dragContent &&
+      React.createElement(
+        Box,
+        {
           as: 'div',
           ...contentProps,
           className: cx('iui-content', contentProps?.className),
-          children: dragContent,
-        }),
-    ],
-  });
+        },
+        dragContent,
+      ),
+  );
 });

package/esm/core/FileUpload/FileUploadCard.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 {
   getWindow,
@@ -31,7 +26,7 @@ const toDate = (dateNumber) => {
   return date.toDateString() + ' ' + date.toLocaleTimeString();
 };
 const FileUploadCardIcon = polymorphic.span('iui-file-card-icon', {
-  children: _jsx(SvgDocument, {}),
+  children: React.createElement(SvgDocument, null),
 });
 FileUploadCardIcon.displayName = 'FileUploadCard.Icon';
 const FileUploadCardInfo = polymorphic.span('iui-file-card-text');
@@ -41,13 +36,16 @@ const FileUploadCardTitle = React.forwardRef((props, ref) => {
   const { files } = useSafeContext(FileUploadCardContext);
   const title =
     files.length > 1 ? files.length + ' files selected' : files[0].name;
-  return _jsx(Box, {
-    as: 'span',
-    className: cx('iui-file-card-title', className),
-    ref: ref,
-    ...rest,
-    children: children ?? title,
-  });
+  return React.createElement(
+    Box,
+    {
+      as: 'span',
+      className: cx('iui-file-card-title', className),
+      ref: ref,
+      ...rest,
+    },
+    children ?? title,
+  );
 });
 FileUploadCardTitle.displayName = 'FileUploadCard.Title';
 const FileUploadCardDescription = React.forwardRef((props, ref) => {
@@ -60,13 +58,16 @@ const FileUploadCardDescription = React.forwardRef((props, ref) => {
   if (files.length > 2) {
     description += ', and ' + (files.length - 2) + ' others';
   }
-  return _jsx(Box, {
-    as: 'span',
-    className: cx('iui-file-card-description', className),
-    ref: ref,
-    ...rest,
-    children: children ?? description,
-  });
+  return React.createElement(
+    Box,
+    {
+      as: 'span',
+      className: cx('iui-file-card-description', className),
+      ref: ref,
+      ...rest,
+    },
+    children ?? description,
+  );
 });
 FileUploadCardDescription.displayName = 'FileUploadCard.Description';
 const FileUploadCardAction = polymorphic.div('iui-file-card-action');
@@ -74,13 +75,16 @@ FileUploadCardAction.displayName = 'FileUploadCard.Action';
 const FileUploadCardInputLabel = React.forwardRef((props, ref) => {
   const { children, ...rest } = props;
   const { inputId } = useSafeContext(FileUploadCardContext);
-  return _jsx(Anchor, {
-    as: 'label',
-    ref: ref,
-    htmlFor: inputId,
-    ...rest,
-    children: children,
-  });
+  return React.createElement(
+    Anchor,
+    {
+      as: 'label',
+      ref: ref,
+      htmlFor: inputId,
+      ...rest,
+    },
+    children,
+  );
 });
 FileUploadCardInputLabel.displayName = 'FileUploadCard.InputLabel';
 const FileUploadCardInput = React.forwardRef((props, ref) => {
@@ -105,24 +109,24 @@ const FileUploadCardInput = React.forwardRef((props, ref) => {
       setInputId(id);
     }
   }, [id, inputId, setInputId]);
-  return _jsxs(_Fragment, {
-    children: [
-      _jsx(VisuallyHidden, {
-        as: 'input',
-        type: 'file',
-        unhideOnFocus: false,
-        onChange: mergeEventHandlers(onChange, (e) => {
-          const _files = Array.from(e.currentTarget.files || []);
-          onFilesChange?.(_files);
-          setInternalFiles(_files);
-        }),
-        ref: refs,
-        id: id ?? inputId,
-        ...rest,
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(VisuallyHidden, {
+      as: 'input',
+      type: 'file',
+      unhideOnFocus: false,
+      onChange: mergeEventHandlers(onChange, (e) => {
+        const _files = Array.from(e.currentTarget.files || []);
+        onFilesChange?.(_files);
+        setInternalFiles(_files);
       }),
-      children,
-    ],
-  });
+      ref: refs,
+      id: id ?? inputId,
+      ...rest,
+    }),
+    children,
+  );
 });
 FileUploadCardInput.displayName = 'FileUploadCard.Input';
 const FileUploadCardComponent = React.forwardRef((props, ref) => {
@@ -131,7 +135,7 @@ const FileUploadCardComponent = React.forwardRef((props, ref) => {
     children,
     files: filesProp,
     onFilesChange,
-    emptyCard = _jsx(FileEmptyCard, {}),
+    emptyCard = React.createElement(FileEmptyCard, null),
     input,
     ...rest
   } = props;
@@ -139,43 +143,46 @@ const FileUploadCardComponent = React.forwardRef((props, ref) => {
   const uid = useId();
   const [inputId, setInputId] = React.useState(uid);
   const files = filesProp ?? internalFiles ?? [];
-  return _jsxs(FileUploadCardContext.Provider, {
-    value: {
-      files,
-      onFilesChange,
-      setInternalFiles,
-      inputId,
-      setInputId,
+  return React.createElement(
+    FileUploadCardContext.Provider,
+    {
+      value: {
+        files,
+        onFilesChange,
+        setInternalFiles,
+        inputId,
+        setInputId,
+      },
     },
-    children: [
-      files?.length
-        ? _jsx(Box, {
+    files?.length
+      ? React.createElement(
+          Box,
+          {
             className: cx('iui-file-card', className),
             ref: ref,
             ...rest,
-            children:
-              children ??
-              _jsxs(_Fragment, {
-                children: [
-                  _jsx(FileUploadCard.Icon, {}),
-                  _jsxs(FileUploadCard.Info, {
-                    children: [
-                      _jsx(FileUploadCard.Title, {}),
-                      _jsx(FileUploadCard.Description, {}),
-                    ],
-                  }),
-                  _jsx(FileUploadCard.Action, {
-                    children: _jsx(FileUploadCard.InputLabel, {
-                      children: 'Replace',
-                    }),
-                  }),
-                ],
-              }),
-          })
-        : emptyCard,
-      input ?? _jsx(FileUploadCard.Input, {}),
-    ],
-  });
+          },
+          children ??
+            React.createElement(
+              React.Fragment,
+              null,
+              React.createElement(FileUploadCard.Icon, null),
+              React.createElement(
+                FileUploadCard.Info,
+                null,
+                React.createElement(FileUploadCard.Title, null),
+                React.createElement(FileUploadCard.Description, null),
+              ),
+              React.createElement(
+                FileUploadCard.Action,
+                null,
+                React.createElement(FileUploadCard.InputLabel, null, 'Replace'),
+              ),
+            ),
+        )
+      : emptyCard,
+    input ?? React.createElement(FileUploadCard.Input, null),
+  );
 });
 export const FileUploadCard = Object.assign(FileUploadCardComponent, {
   Icon: FileUploadCardIcon,

package/esm/core/FileUpload/FileUploadTemplate.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 { SvgUpload, Box } from '../../utils/index.js';
@@ -14,38 +13,39 @@ export const FileUploadTemplate = React.forwardRef((props, ref) => {
     className,
     ...rest
   } = props;
-  return _jsxs(Box, {
-    className: cx('iui-file-upload-template', className),
-    ref: ref,
-    ...rest,
-    children: [
-      _jsx(SvgUpload, {
-        className: 'iui-template-icon',
-        'aria-hidden': true,
-      }),
-      _jsxs(Box, {
+  return React.createElement(
+    Box,
+    {
+      className: cx('iui-file-upload-template', className),
+      ref: ref,
+      ...rest,
+    },
+    React.createElement(SvgUpload, {
+      className: 'iui-template-icon',
+      'aria-hidden': true,
+    }),
+    React.createElement(
+      Box,
+      {
         className: 'iui-template-text',
-        children: [
-          _jsxs(Anchor, {
-            as: 'label',
-            children: [
-              _jsx(Box, {
-                as: 'input',
-                className: 'iui-browse-input',
-                type: 'file',
-                onChange: onChange,
-                multiple: acceptMultiple,
-                accept: acceptType,
-              }),
-              label,
-            ],
-          }),
-          _jsx('div', {
-            children: subtitle,
-          }),
-          children,
-        ],
-      }),
-    ],
-  });
+      },
+      React.createElement(
+        Anchor,
+        {
+          as: 'label',
+        },
+        React.createElement(Box, {
+          as: 'input',
+          className: 'iui-browse-input',
+          type: 'file',
+          onChange: onChange,
+          multiple: acceptMultiple,
+          accept: acceptType,
+        }),
+        label,
+      ),
+      React.createElement('div', null, subtitle),
+      children,
+    ),
+  );
 });

package/esm/core/Flex/Flex.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/components/Box.js';
@@ -21,7 +20,7 @@ const FlexComponent = React.forwardRef((props, ref) => {
     style,
     ...rest
   } = props;
-  return _jsx(Box, {
+  return React.createElement(Box, {
     className: cx('iui-flex', className),
     style: {
       '--iui-flex-display': display,
@@ -39,7 +38,7 @@ const FlexComponent = React.forwardRef((props, ref) => {
 FlexComponent.displayName = 'Flex';
 const FlexSpacer = React.forwardRef((props, ref) => {
   const { flex, className, style, ...rest } = props;
-  return _jsx(Box, {
+  return React.createElement(Box, {
     className: cx('iui-flex-spacer', className),
     style: {
       '--iui-flex-spacer-flex': flex,
@@ -66,7 +65,7 @@ const FlexItem = React.forwardRef((props, ref) => {
     }),
     ...style,
   };
-  return _jsx(Box, {
+  return React.createElement(Box, {
     className: cx('iui-flex-item', className),
     ref: ref,
     style: _style,

package/esm/core/Footer/Footer.d.ts

@@ -52,7 +52,7 @@ export declare const defaultFooterElements: FooterElement[];
  * @example <caption>Changing a url</caption>
  * <Footer customElements={(defaultElements) => defaultElements.map(element => ({ ...element, url: element.key === 'privacy' ? customPrivacyUrl : element.url }))} />
  */
-export declare const Footer: ((props: FooterProps) => import("react/jsx-runtime").JSX.Element) & {
+export declare const Footer: ((props: FooterProps) => React.JSX.Element) & {
     List: import("../../utils/props.js").PolymorphicForwardRefComponent<"ul", {}>;
     Item: import("../../utils/props.js").PolymorphicForwardRefComponent<"li", {}>;
     Separator: import("../../utils/props.js").PolymorphicForwardRefComponent<"li", {}>;

package/esm/core/Footer/Footer.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';
@@ -69,36 +68,44 @@ export const Footer = Object.assign(
           ? customElements(translatedElements)
           : [...translatedElements, ...customElements];
     }
-    return _jsx(Box, {
-      as: 'footer',
-      className: cx('iui-legal-footer', className),
-      ...rest,
-      children: children
+    return React.createElement(
+      Box,
+      {
+        as: 'footer',
+        className: cx('iui-legal-footer', className),
+        ...rest,
+      },
+      children
         ? children
-        : _jsx(FooterList, {
-            children: elements.map((element, index) => {
-              return _jsxs(
+        : React.createElement(
+            FooterList,
+            null,
+            elements.map((element, index) => {
+              return React.createElement(
                 React.Fragment,
                 {
-                  children: [
-                    index > 0 && _jsx(FooterSeparator, {}),
-                    _jsx(FooterItem, {
-                      children: element.url
-                        ? _jsx(Anchor, {
-                            href: element.url,
-                            target: '_blank',
-                            rel: 'noreferrer',
-                            children: element.title,
-                          })
-                        : element.title,
-                    }),
-                  ],
+                  key: element.key || `${element.title}-${index}`,
                 },
-                element.key || `${element.title}-${index}`,
+                index > 0 && React.createElement(FooterSeparator, null),
+                React.createElement(
+                  FooterItem,
+                  null,
+                  element.url
+                    ? React.createElement(
+                        Anchor,
+                        {
+                          href: element.url,
+                          target: '_blank',
+                          rel: 'noreferrer',
+                        },
+                        element.title,
+                      )
+                    : element.title,
+                ),
               );
             }),
-          }),
-    });
+          ),
+    );
   },
   {
     List: FooterList,

package/esm/core/Header/Header.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
 import cx from 'classnames';
 import * as React from 'react';
 import { IconButton } from '../Buttons/IconButton.js';
@@ -23,46 +22,58 @@ export const Header = React.forwardRef((props, forwardedRef) => {
     ...defaultTranslations,
     ...translatedStrings,
   };
-  return _jsxs(Box, {
-    as: 'header',
-    className: cx('iui-page-header', className),
-    'data-iui-size': isSlim ? 'slim' : undefined,
-    ref: forwardedRef,
-    ...rest,
-    children: [
-      _jsxs(Box, {
+  return React.createElement(
+    Box,
+    {
+      as: 'header',
+      className: cx('iui-page-header', className),
+      'data-iui-size': isSlim ? 'slim' : undefined,
+      ref: forwardedRef,
+      ...rest,
+    },
+    React.createElement(
+      Box,
+      {
         className: 'iui-page-header-left',
-        children: [
-          appLogo,
-          breadcrumbs &&
-            _jsx(Box, {
-              className: 'iui-page-header-divider',
-            }),
-          breadcrumbs,
-        ],
-      }),
-      children &&
-        _jsx(Box, {
-          className: 'iui-page-header-center',
-          children: children,
+      },
+      appLogo,
+      breadcrumbs &&
+        React.createElement(Box, {
+          className: 'iui-page-header-divider',
         }),
-      _jsxs(Box, {
+      breadcrumbs,
+    ),
+    children &&
+      React.createElement(
+        Box,
+        {
+          className: 'iui-page-header-center',
+        },
+        children,
+      ),
+    React.createElement(
+      Box,
+      {
         className: 'iui-page-header-right',
-        children: [
-          actions,
-          menuItems &&
-            _jsx(DropdownMenu, {
-              menuItems: menuItems,
-              children: _jsx(IconButton, {
-                styleType: 'borderless',
-                'aria-label': headerTranslations.moreOptions,
-                children: _jsx(SvgMoreVertical, {
-                  'aria-hidden': true,
-                }),
-              }),
+      },
+      actions,
+      menuItems &&
+        React.createElement(
+          DropdownMenu,
+          {
+            menuItems: menuItems,
+          },
+          React.createElement(
+            IconButton,
+            {
+              styleType: 'borderless',
+              'aria-label': headerTranslations.moreOptions,
+            },
+            React.createElement(SvgMoreVertical, {
+              'aria-hidden': true,
             }),
-        ],
-      }),
-    ],
-  });
+          ),
+        ),
+    ),
+  );
 });