@itwin/itwinui-react 3.12.0 → 3.12.2

package/cjs/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, 'NumberRangeFilter', {
   },
 });
 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 _FilterButtonBar = require('../FilterButtonBar.js');
@@ -45,31 +44,30 @@ const NumberRangeFilter = (props) => {
       setFilter([parseInputValue(from), parseInputValue(to)]);
     }
   };
-  return (0, _jsxruntime.jsxs)(_BaseFilter.BaseFilter, {
-    children: [
-      (0, _jsxruntime.jsx)(_LabeledInput.LabeledInput, {
-        ref: inputRef,
-        label: translatedStrings.from,
-        value: from,
-        onChange: (e) => setFrom(e.target.value),
-        onKeyDown: onKeyDown,
-        type: 'number',
-        displayStyle: 'inline',
-      }),
-      (0, _jsxruntime.jsx)(_LabeledInput.LabeledInput, {
-        label: translatedStrings.to,
-        value: to,
-        onChange: (e) => setTo(e.target.value),
-        type: 'number',
-        displayStyle: 'inline',
-        onKeyDown: onKeyDown,
-      }),
-      (0, _jsxruntime.jsx)(_FilterButtonBar.FilterButtonBar, {
-        setFilter: () =>
-          setFilter([parseInputValue(from), parseInputValue(to)]),
-        clearFilter: clearFilter,
-        translatedLabels: translatedLabels,
-      }),
-    ],
-  });
+  return _react.createElement(
+    _BaseFilter.BaseFilter,
+    null,
+    _react.createElement(_LabeledInput.LabeledInput, {
+      ref: inputRef,
+      label: translatedStrings.from,
+      value: from,
+      onChange: (e) => setFrom(e.target.value),
+      onKeyDown: onKeyDown,
+      type: 'number',
+      displayStyle: 'inline',
+    }),
+    _react.createElement(_LabeledInput.LabeledInput, {
+      label: translatedStrings.to,
+      value: to,
+      onChange: (e) => setTo(e.target.value),
+      type: 'number',
+      displayStyle: 'inline',
+      onKeyDown: onKeyDown,
+    }),
+    _react.createElement(_FilterButtonBar.FilterButtonBar, {
+      setFilter: () => setFilter([parseInputValue(from), parseInputValue(to)]),
+      clearFilter: clearFilter,
+      translatedLabels: translatedLabels,
+    }),
+  );
 };

package/cjs/core/Table/filters/TextFilter/TextFilter.d.ts

@@ -1,6 +1,7 @@
+import * as React from 'react';
 import type { FilterButtonBarTranslation } from '../FilterButtonBar.js';
 import type { TableFilterProps } from '../types.js';
 export type TextFilterProps<T extends Record<string, unknown>> = TableFilterProps<T> & {
     translatedLabels?: FilterButtonBarTranslation;
 };
-export declare const TextFilter: <T extends Record<string, unknown>>(props: TextFilterProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const TextFilter: <T extends Record<string, unknown>>(props: TextFilterProps<T>) => React.JSX.Element;

package/cjs/core/Table/filters/TextFilter/TextFilter.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, 'TextFilter', {
   },
 });
 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 _Input = require('../../../Input/Input.js');
@@ -33,19 +32,19 @@ const TextFilter = (props) => {
       setFilter(text);
     }
   };
-  return (0, _jsxruntime.jsxs)(_BaseFilter.BaseFilter, {
-    children: [
-      (0, _jsxruntime.jsx)(_Input.Input, {
-        ref: inputRef,
-        value: text,
-        onChange: (e) => setText(e.target.value),
-        onKeyDown: onKeyDown,
-      }),
-      (0, _jsxruntime.jsx)(_FilterButtonBar.FilterButtonBar, {
-        setFilter: () => setFilter(text),
-        clearFilter: clearFilter,
-        translatedLabels: translatedLabels,
-      }),
-    ],
-  });
+  return _react.createElement(
+    _BaseFilter.BaseFilter,
+    null,
+    _react.createElement(_Input.Input, {
+      ref: inputRef,
+      value: text,
+      onChange: (e) => setText(e.target.value),
+      onKeyDown: onKeyDown,
+    }),
+    _react.createElement(_FilterButtonBar.FilterButtonBar, {
+      setFilter: () => setFilter(text),
+      clearFilter: clearFilter,
+      translatedLabels: translatedLabels,
+    }),
+  );
 };

package/cjs/core/Table/filters/tableFilters.d.ts

@@ -29,7 +29,7 @@ export declare const tableFilters: {
      * Basic filter with a single input field.
      * @param translatedLabels Translated filter labels.
      */
-    TextFilter: (translatedLabels?: FilterButtonBarTranslation) => <T extends Record<string, unknown>>(props: TableFilterProps<T>) => import("react/jsx-runtime").JSX.Element;
+    TextFilter: (translatedLabels?: FilterButtonBarTranslation) => <T extends Record<string, unknown>>(props: TableFilterProps<T>) => React.JSX.Element;
     /**
      * Date range filter.
      *
@@ -40,7 +40,7 @@ export declare const tableFilters: {
      * If your data is different type e.g. `string`, you can use `accessor` property in column description:
      * `accessor: (rowData) => new Date(rowData.date)`.
      */
-    DateRangeFilter: (options?: DateRangeFilterOptions) => <T extends Record<string, unknown>>(props: TableFilterProps<T>) => import("react/jsx-runtime").JSX.Element;
+    DateRangeFilter: (options?: DateRangeFilterOptions) => <T extends Record<string, unknown>>(props: TableFilterProps<T>) => React.JSX.Element;
     /**
      * Number range filter.
      *
@@ -49,5 +49,5 @@ export declare const tableFilters: {
      * `accessor: (rowData) => Number(rowData.numberProp)`.
      * @param translatedLabels Translated filter labels.
      */
-    NumberRangeFilter: (translatedLabels?: NumberRangeTranslation & FilterButtonBarTranslation) => <T extends Record<string, unknown>>(props: NumberRangeFilterProps<T>) => import("react/jsx-runtime").JSX.Element;
+    NumberRangeFilter: (translatedLabels?: NumberRangeTranslation & FilterButtonBarTranslation) => <T extends Record<string, unknown>>(props: NumberRangeFilterProps<T>) => React.JSX.Element;
 };

package/cjs/core/Table/filters/tableFilters.js

@@ -9,24 +9,23 @@ Object.defineProperty(exports, 'tableFilters', {
   },
 });
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _jsxruntime = require('react/jsx-runtime');
 const _react = _interop_require_wildcard._(require('react'));
 const _DateRangeFilter = require('./DateRangeFilter/DateRangeFilter.js');
 const _NumberRangeFilter = require('./NumberRangeFilter/NumberRangeFilter.js');
 const _TextFilter = require('./TextFilter/TextFilter.js');
 const tableFilters = {
   TextFilter: (translatedLabels) => (props) =>
-    (0, _jsxruntime.jsx)(_TextFilter.TextFilter, {
+    _react.createElement(_TextFilter.TextFilter, {
       ...props,
       translatedLabels: translatedLabels,
     }),
   DateRangeFilter: (options) => (props) =>
-    (0, _jsxruntime.jsx)(_DateRangeFilter.DateRangeFilter, {
+    _react.createElement(_DateRangeFilter.DateRangeFilter, {
       ...props,
       ...options,
     }),
   NumberRangeFilter: (translatedLabels) => (props) =>
-    (0, _jsxruntime.jsx)(_NumberRangeFilter.NumberRangeFilter, {
+    _react.createElement(_NumberRangeFilter.NumberRangeFilter, {
       ...props,
       translatedLabels: translatedLabels,
     }),

package/cjs/core/Table/hooks/useExpanderCell.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, 'useExpanderCell', {
   },
 });
 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('../columns/index.js');
 const useExpanderCell =
@@ -33,9 +32,11 @@ const useExpanderCell =
           ...expanderColumn,
           Cell: expanderCell
             ? (cellProps) =>
-                (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
-                  children: expanderCell(cellProps),
-                })
+                _react.createElement(
+                  _react.Fragment,
+                  null,
+                  expanderCell(cellProps),
+                )
             : expanderColumn.Cell,
         },
         ...columns,

package/cjs/core/Tabs/Tabs.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 _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _index = require('../../utils/index.js');
@@ -45,34 +44,40 @@ const TabsWrapper = _react.forwardRef((props, ref) => {
   const [stripeProperties, setStripeProperties] = _react.useState({});
   const [hasSublabel, setHasSublabel] = _react.useState(false);
   const idPrefix = (0, _index.useId)();
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)(
-      'iui-tabs-wrapper',
-      `iui-${orientation}`,
-      className,
-    ),
-    ...rest,
-    style: {
-      ...stripeProperties,
-      ...props?.style,
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-tabs-wrapper',
+        `iui-${orientation}`,
+        className,
+      ),
+      ...rest,
+      style: {
+        ...stripeProperties,
+        ...props?.style,
+      },
+      ref: ref,
     },
-    ref: ref,
-    children: (0, _jsxruntime.jsx)(TabsContext.Provider, {
-      value: {
-        orientation,
-        type,
-        activeValue,
-        setActiveValue,
-        setStripeProperties,
-        idPrefix,
-        focusActivationMode,
-        hasSublabel,
-        setHasSublabel,
-        color,
+    _react.createElement(
+      TabsContext.Provider,
+      {
+        value: {
+          orientation,
+          type,
+          activeValue,
+          setActiveValue,
+          setStripeProperties,
+          idPrefix,
+          focusActivationMode,
+          hasSublabel,
+          setHasSublabel,
+          color,
+        },
       },
-      children: children,
-    }),
-  });
+      children,
+    ),
+  );
 });
 TabsWrapper.displayName = 'Tabs.Wrapper';
 const TabList = _react.forwardRef((props, ref) => {
@@ -89,29 +94,35 @@ const TabList = _react.forwardRef((props, ref) => {
     tablistSizeRef,
     useScrollbarGutter(),
   );
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)(
-      'iui-tabs',
-      `iui-${type}`,
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-tabs',
+        `iui-${type}`,
+        {
+          'iui-green': color === 'green',
+          'iui-animated': type !== 'default' && isClient,
+          'iui-not-animated': type !== 'default' && !isClient,
+          'iui-large': hasSublabel,
+        },
+        className,
+      ),
+      role: 'tablist',
+      ref: refs,
+      ...rest,
+    },
+    _react.createElement(
+      TabListContext.Provider,
       {
-        'iui-green': color === 'green',
-        'iui-animated': type !== 'default' && isClient,
-        'iui-not-animated': type !== 'default' && !isClient,
-        'iui-large': hasSublabel,
+        value: {
+          tabsWidth,
+          tablistRef,
+        },
       },
-      className,
+      children,
     ),
-    role: 'tablist',
-    ref: refs,
-    ...rest,
-    children: (0, _jsxruntime.jsx)(TabListContext.Provider, {
-      value: {
-        tabsWidth,
-        tablistRef,
-      },
-      children: children,
-    }),
-  });
+  );
 });
 TabList.displayName = 'Tabs.TabList';
 const Tab = _react.forwardRef((props, forwardedRef) => {
@@ -223,38 +234,37 @@ const Tab = _react.forwardRef((props, forwardedRef) => {
     },
     [activeValue, setActiveValue, value],
   );
-  return (0, _jsxruntime.jsx)(_index.ButtonBase, {
-    className: (0, _classnames.default)('iui-tab', className),
-    role: 'tab',
-    tabIndex: isActive ? 0 : -1,
-    'aria-selected': isActive,
-    'aria-controls': `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
-    ref: (0, _index.useMergedRefs)(tabRef, forwardedRef, setInitialActiveRef),
-    ...rest,
-    id: `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
-    onClick: (0, _index.mergeEventHandlers)(props.onClick, () =>
-      setActiveValue(value),
-    ),
-    onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, onKeyDown),
-    onFocus: (0, _index.mergeEventHandlers)(props.onFocus, () => {
-      tabRef.current?.scrollIntoView({
-        block: 'nearest',
-        inline: 'nearest',
-      });
-      if (focusActivationMode === 'auto' && !props.disabled) {
-        setActiveValue(value);
-      }
-    }),
-    children: label
-      ? (0, _jsxruntime.jsx)(Tabs.TabLabel, {
-          children: label,
-        })
-      : children,
-  });
+  return _react.createElement(
+    _index.ButtonBase,
+    {
+      className: (0, _classnames.default)('iui-tab', className),
+      role: 'tab',
+      tabIndex: isActive ? 0 : -1,
+      'aria-selected': isActive,
+      'aria-controls': `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
+      ref: (0, _index.useMergedRefs)(tabRef, forwardedRef, setInitialActiveRef),
+      ...rest,
+      id: `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
+      onClick: (0, _index.mergeEventHandlers)(props.onClick, () =>
+        setActiveValue(value),
+      ),
+      onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, onKeyDown),
+      onFocus: (0, _index.mergeEventHandlers)(props.onFocus, () => {
+        tabRef.current?.scrollIntoView({
+          block: 'nearest',
+          inline: 'nearest',
+        });
+        if (focusActivationMode === 'auto' && !props.disabled) {
+          setActiveValue(value);
+        }
+      }),
+    },
+    label ? _react.createElement(Tabs.TabLabel, null, label) : children,
+  );
 });
 Tab.displayName = 'Tabs.Tab';
 const TabIcon = _react.forwardRef((props, ref) => {
-  return (0, _jsxruntime.jsx)(_Icon.Icon, {
+  return _react.createElement(_Icon.Icon, {
     ...props,
     className: (0, _classnames.default)('iui-tab-icon', props?.className),
     ref: ref,
@@ -273,45 +283,57 @@ const TabDescription = _react.forwardRef((props, ref) => {
       setHasSublabel(true);
     }
   }, [hasSublabel, setHasSublabel]);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    as: 'span',
-    className: (0, _classnames.default)('iui-tab-description', className),
-    ref: ref,
-    ...rest,
-    children: children,
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      as: 'span',
+      className: (0, _classnames.default)('iui-tab-description', className),
+      ref: ref,
+      ...rest,
+    },
+    children,
+  );
 });
 TabDescription.displayName = 'Tabs.TabDescription';
 const TabsActions = _react.forwardRef((props, ref) => {
   const { wrapperProps, className, children, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    ...wrapperProps,
-    className: (0, _classnames.default)(
-      'iui-tabs-actions-wrapper',
-      wrapperProps?.className,
+  return _react.createElement(
+    _index.Box,
+    {
+      ...wrapperProps,
+      className: (0, _classnames.default)(
+        'iui-tabs-actions-wrapper',
+        wrapperProps?.className,
+      ),
+    },
+    _react.createElement(
+      _index.Box,
+      {
+        className: (0, _classnames.default)('iui-tabs-actions', className),
+        ref: ref,
+        ...rest,
+      },
+      children,
     ),
-    children: (0, _jsxruntime.jsx)(_index.Box, {
-      className: (0, _classnames.default)('iui-tabs-actions', className),
-      ref: ref,
-      ...rest,
-      children: children,
-    }),
-  });
+  );
 });
 TabsActions.displayName = 'Tabs.Actions';
 const TabsPanel = _react.forwardRef((props, ref) => {
   const { value, className, children, ...rest } = props;
   const { activeValue, idPrefix } = (0, _index.useSafeContext)(TabsContext);
-  return (0, _jsxruntime.jsx)(_index.Box, {
-    className: (0, _classnames.default)('iui-tabs-content', className),
-    'aria-labelledby': `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
-    role: 'tabpanel',
-    hidden: activeValue !== value ? true : undefined,
-    ref: ref,
-    ...rest,
-    id: `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
-    children: children,
-  });
+  return _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)('iui-tabs-content', className),
+      'aria-labelledby': `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
+      role: 'tabpanel',
+      hidden: activeValue !== value ? true : undefined,
+      ref: ref,
+      ...rest,
+      id: `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
+    },
+    children,
+  );
 });
 TabsPanel.displayName = 'Tabs.Panel';
 const LegacyTabsComponent = _react.forwardRef((props, forwardedRef) => {
@@ -340,70 +362,66 @@ const LegacyTabsComponent = _react.forwardRef((props, forwardedRef) => {
     activeIndexProp,
     onTabSelected,
   );
-  return (0, _jsxruntime.jsxs)(TabsWrapper, {
-    className: wrapperClassName,
-    focusActivationMode: focusActivationMode,
-    color: color,
-    value: `${activeIndex}`,
-    onValueChange: (value) => setActiveIndex(Number(value)),
-    ...rest,
-    children: [
-      (0, _jsxruntime.jsx)(TabList, {
+  return _react.createElement(
+    TabsWrapper,
+    {
+      className: wrapperClassName,
+      focusActivationMode: focusActivationMode,
+      color: color,
+      value: `${activeIndex}`,
+      onValueChange: (value) => setActiveIndex(Number(value)),
+      ...rest,
+    },
+    _react.createElement(
+      TabList,
+      {
         className: tabsClassName,
         ref: forwardedRef,
-        children: labels.map((label, index) => {
-          const tabValue = `${index}`;
-          return _react.isValidElement(label)
-            ? _react.cloneElement(label, {
-                value: tabValue,
-              })
-            : (0, _jsxruntime.jsx)(
-                LegacyTab,
-                {
-                  value: tabValue,
-                  label: label,
-                },
-                index,
-              );
-        }),
+      },
+      labels.map((label, index) => {
+        const tabValue = `${index}`;
+        return _react.isValidElement(label)
+          ? _react.cloneElement(label, {
+              value: tabValue,
+            })
+          : _react.createElement(LegacyTab, {
+              key: index,
+              value: tabValue,
+              label: label,
+            });
       }),
-      actions &&
-        (0, _jsxruntime.jsx)(TabsActions, {
-          children: actions,
-        }),
-      children &&
-        (0, _jsxruntime.jsx)(TabsPanel, {
+    ),
+    actions && _react.createElement(TabsActions, null, actions),
+    children &&
+      _react.createElement(
+        TabsPanel,
+        {
           value: `${activeIndex}`,
           className: contentClassName,
-          children: children,
-        }),
-    ],
-  });
+        },
+        children,
+      ),
+  );
 });
 LegacyTabsComponent.displayName = 'Tabs';
 const LegacyTab = _react.forwardRef((props, forwardedRef) => {
   const { label, sublabel, startIcon, children, value, ...rest } = props;
-  return (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
-    children: (0, _jsxruntime.jsxs)(Tab, {
-      ...rest,
-      value: value,
-      ref: forwardedRef,
-      children: [
-        startIcon &&
-          (0, _jsxruntime.jsx)(TabIcon, {
-            children: startIcon,
-          }),
-        (0, _jsxruntime.jsx)(TabLabel, {
-          children: label,
-        }),
-        sublabel &&
-          (0, _jsxruntime.jsx)(TabDescription, {
-            children: sublabel,
-          }),
-        children,
-      ],
-    }),
-  });
+  return _react.createElement(
+    _react.Fragment,
+    null,
+    _react.createElement(
+      Tab,
+      {
+        ...rest,
+        value: value,
+        ref: forwardedRef,
+      },
+      startIcon && _react.createElement(TabIcon, null, startIcon),
+      _react.createElement(TabLabel, null, label),
+      sublabel && _react.createElement(TabDescription, null, sublabel),
+      children,
+    ),
+  );
 });
 const Tabs = Object.assign(LegacyTabsComponent, {
   Wrapper: TabsWrapper,