@itwin/itwinui-react 3.13.3 → 3.14.0

package/DEV-cjs/core/ComboBox/ComboBoxMenu.js

@@ -1,100 +1,139 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "ComboBoxMenu", {
-    enumerable: true,
-    get: function() {
-        return ComboBoxMenu;
-    }
+Object.defineProperty(exports, 'ComboBoxMenu', {
+  enumerable: true,
+  get: function () {
+    return ComboBoxMenu;
+  },
 });
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _classnames = _interop_require_default._(require("classnames"));
-const _index = require("../../utils/index.js");
-const _helpers = require("./helpers.js");
-const _List = require("../List/List.js");
-const VirtualizedComboBoxMenu = (props)=>{
-    let { children, ...rest } = props;
-    let { filteredOptions, getMenuItem, focusedIndex } = (0, _index.useSafeContext)(_helpers.ComboBoxStateContext);
-    let { menuRef } = (0, _index.useSafeContext)(_helpers.ComboBoxRefsContext);
-    let mostlySubLabeled = _react.useMemo(()=>{
-        let numberOfSubLabels = 0;
-        for(let i = 0; i < Math.min(5, filteredOptions.length); i++)if (filteredOptions[i].sublabel) numberOfSubLabels++;
-        return numberOfSubLabels >= Math.min(3, filteredOptions.length);
-    }, [
-        filteredOptions
-    ]);
-    let focusedVisibleIndex = _react.useMemo(()=>{
-        let currentElement = menuRef.current?.querySelector(`[data-iui-index="${focusedIndex}"]`);
-        if (!currentElement) return focusedIndex;
-        return Number(currentElement.getAttribute('data-iui-filtered-index') ?? focusedIndex);
-    }, [
-        focusedIndex,
-        menuRef
-    ]);
-    let { virtualizer, css: virtualizerCss } = (0, _index.useVirtualScroll)({
-        count: filteredOptions.length || 1,
-        getScrollElement: ()=>menuRef.current,
-        estimateSize: ()=>mostlySubLabeled ? 48 : 36,
-        gap: -1
-    });
-    (0, _index.useLayoutEffect)(()=>{
-        virtualizer.scrollToIndex(focusedVisibleIndex);
-    }, [
-        virtualizer,
-        focusedVisibleIndex
-    ]);
-    let virtualItemRenderer = _react.useCallback((virtualItem)=>{
-        let menuItem = filteredOptions.length > 0 ? getMenuItem(filteredOptions[virtualItem.index], virtualItem.index) : children;
-        return _react.cloneElement(menuItem, {
-            key: virtualItem.key,
-            ref: virtualizer.measureElement,
-            'data-iui-virtualizer': 'item',
-            style: {
-                width: '100%',
-                transform: `translateY(${virtualItem.start}px)`
-            }
-        });
-    }, [
-        filteredOptions,
-        getMenuItem,
-        children,
-        virtualizer.measureElement
-    ]);
-    return _react.createElement(_react.Fragment, null, _react.createElement(_index.ShadowRoot, {
-        css: virtualizerCss
-    }, _react.createElement(_index.Box, {
-        as: "div",
-        "data-iui-virtualizer": "root",
-        ...rest,
+const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _classnames = _interop_require_default._(require('classnames'));
+const _index = require('../../utils/index.js');
+const _helpers = require('./helpers.js');
+const _List = require('../List/List.js');
+const VirtualizedComboBoxMenu = (props) => {
+  let { children, ...rest } = props;
+  let { filteredOptions, getMenuItem, focusedIndex } = (0,
+  _index.useSafeContext)(_helpers.ComboBoxStateContext);
+  let { menuRef } = (0, _index.useSafeContext)(_helpers.ComboBoxRefsContext);
+  let mostlySubLabeled = _react.useMemo(() => {
+    let numberOfSubLabels = 0;
+    for (let i = 0; i < Math.min(5, filteredOptions.length); i++)
+      if (filteredOptions[i].sublabel) numberOfSubLabels++;
+    return numberOfSubLabels >= Math.min(3, filteredOptions.length);
+  }, [filteredOptions]);
+  let focusedVisibleIndex = _react.useMemo(() => {
+    let currentElement = menuRef.current?.querySelector(
+      `[data-iui-index="${focusedIndex}"]`,
+    );
+    if (!currentElement) return focusedIndex;
+    return Number(
+      currentElement.getAttribute('data-iui-filtered-index') ?? focusedIndex,
+    );
+  }, [focusedIndex, menuRef]);
+  let { virtualizer, css: virtualizerCss } = (0, _index.useVirtualScroll)({
+    count: filteredOptions.length || 1,
+    getScrollElement: () => menuRef.current,
+    estimateSize: () => (mostlySubLabeled ? 48 : 36),
+    gap: -1,
+  });
+  (0, _index.useLayoutEffect)(() => {
+    virtualizer.scrollToIndex(focusedVisibleIndex);
+  }, [virtualizer, focusedVisibleIndex]);
+  let virtualItemRenderer = _react.useCallback(
+    (virtualItem) => {
+      let menuItem =
+        filteredOptions.length > 0
+          ? getMenuItem(filteredOptions[virtualItem.index], virtualItem.index)
+          : children;
+      return _react.cloneElement(menuItem, {
+        key: virtualItem.key,
+        ref: virtualizer.measureElement,
+        'data-iui-virtualizer': 'item',
         style: {
+          width: '100%',
+          transform: `translateY(${virtualItem.start}px)`,
+        },
+      });
+    },
+    [filteredOptions, getMenuItem, children, virtualizer.measureElement],
+  );
+  return _react.createElement(
+    _react.Fragment,
+    null,
+    _react.createElement(
+      _index.ShadowRoot,
+      {
+        css: virtualizerCss,
+      },
+      _react.createElement(
+        _index.Box,
+        {
+          as: 'div',
+          'data-iui-virtualizer': 'root',
+          ...rest,
+          style: {
             minBlockSize: virtualizer.getTotalSize(),
-            ...props.style
-        }
-    }, _react.createElement("slot", null))), _react.createElement(_react.Fragment, null, virtualizer.getVirtualItems().map((virtualItem)=>virtualItemRenderer(virtualItem))));
+            ...props.style,
+          },
+        },
+        _react.createElement('slot', null),
+      ),
+    ),
+    _react.createElement(
+      _react.Fragment,
+      null,
+      virtualizer
+        .getVirtualItems()
+        .map((virtualItem) => virtualItemRenderer(virtualItem)),
+    ),
+  );
 };
-const ComboBoxMenu = _react.forwardRef((props, forwardedRef)=>{
-    let { className, children, style, ...rest } = props;
-    let { id, enableVirtualization, popover } = (0, _index.useSafeContext)(_helpers.ComboBoxStateContext);
-    let { menuRef } = (0, _index.useSafeContext)(_helpers.ComboBoxRefsContext);
-    let refs = (0, _index.useMergedRefs)(popover.refs.setFloating, forwardedRef, menuRef);
-    return popover.open && _react.createElement(_index.Portal, {
-        portal: true
-    }, _react.createElement(_List.List, {
-        as: "div",
-        className: (0, _classnames.default)('iui-menu', className),
-        id: `${id}-list`,
-        role: "listbox",
-        ref: refs,
-        ...popover.getFloatingProps({
-            style: enableVirtualization ? {
-                maxInlineSize: 0,
-                ...style
-            } : style,
-            ...rest
-        })
-    }, enableVirtualization ? _react.createElement(VirtualizedComboBoxMenu, null, children) : children));
+const ComboBoxMenu = _react.forwardRef((props, forwardedRef) => {
+  let { className, children, style, ...rest } = props;
+  let { id, enableVirtualization, popover } = (0, _index.useSafeContext)(
+    _helpers.ComboBoxStateContext,
+  );
+  let { menuRef } = (0, _index.useSafeContext)(_helpers.ComboBoxRefsContext);
+  let refs = (0, _index.useMergedRefs)(
+    popover.refs.setFloating,
+    forwardedRef,
+    menuRef,
+  );
+  return (
+    popover.open &&
+    _react.createElement(
+      _index.Portal,
+      {
+        portal: true,
+      },
+      _react.createElement(
+        _List.List,
+        {
+          as: 'div',
+          className: (0, _classnames.default)('iui-menu', className),
+          id: `${id}-list`,
+          role: 'listbox',
+          ref: refs,
+          ...popover.getFloatingProps({
+            style: enableVirtualization
+              ? {
+                  maxInlineSize: 0,
+                  ...style,
+                }
+              : style,
+            ...rest,
+          }),
+        },
+        enableVirtualization
+          ? _react.createElement(VirtualizedComboBoxMenu, null, children)
+          : children,
+      ),
+    )
+  );
 });
 ComboBoxMenu.displayName = 'ComboBoxMenu';

package/DEV-cjs/core/ComboBox/ComboBoxMenuItem.js

@@ -1,48 +1,89 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "ComboBoxMenuItem", {
-    enumerable: true,
-    get: function() {
-        return ComboBoxMenuItem;
-    }
+Object.defineProperty(exports, 'ComboBoxMenuItem', {
+  enumerable: true,
+  get: function () {
+    return ComboBoxMenuItem;
+  },
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _index = require("../../utils/index.js");
-const _helpers = require("./helpers.js");
-const _ListItem = require("../List/ListItem.js");
-const ComboBoxMenuItem = _react.memo(_react.forwardRef((props, forwardedRef)=>{
-    let { children, isSelected, disabled, value, onClick, sublabel, size = sublabel ? 'large' : 'default', startIcon, endIcon, role = 'option', index, ...rest } = props;
-    let { focusedIndex, enableVirtualization } = (0, _index.useSafeContext)(_helpers.ComboBoxStateContext);
-    let focusRef = (el)=>{
-        if (!enableVirtualization && focusedIndex === index) el?.scrollIntoView({
-            block: 'nearest'
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _index = require('../../utils/index.js');
+const _helpers = require('./helpers.js');
+const _ListItem = require('../List/ListItem.js');
+const ComboBoxMenuItem = _react.memo(
+  _react.forwardRef((props, forwardedRef) => {
+    let {
+      children,
+      isSelected,
+      disabled,
+      value,
+      onClick,
+      sublabel,
+      size = sublabel ? 'large' : 'default',
+      startIcon,
+      endIcon,
+      role = 'option',
+      index,
+      ...rest
+    } = props;
+    let { focusedIndex, enableVirtualization } = (0, _index.useSafeContext)(
+      _helpers.ComboBoxStateContext,
+    );
+    let focusRef = (el) => {
+      if (!enableVirtualization && focusedIndex === index)
+        el?.scrollIntoView({
+          block: 'nearest',
         });
     };
     let refs = (0, _index.useMergedRefs)(forwardedRef, focusRef);
-    return _react.createElement(_ListItem.ListItem, {
-        as: "div",
+    return _react.createElement(
+      _ListItem.ListItem,
+      {
+        as: 'div',
         actionable: true,
         size: size,
         active: isSelected,
         disabled: disabled,
         focused: focusedIndex === index,
         ref: refs,
-        onClick: ()=>onClick?.(value),
+        onClick: () => onClick?.(value),
         role: role,
         tabIndex: 'presentation' === role ? void 0 : -1,
-        "aria-selected": isSelected,
-        "aria-disabled": disabled,
-        "data-iui-index": index,
-        ...rest
-    }, startIcon && _react.createElement(_ListItem.ListItem.Icon, {
-        as: "span",
-        "aria-hidden": true
-    }, startIcon), _react.createElement(_ListItem.ListItem.Content, null, children, sublabel && _react.createElement(_ListItem.ListItem.Description, null, sublabel)), endIcon || isSelected && _react.createElement(_ListItem.ListItem.Icon, {
-        as: "span",
-        "aria-hidden": true
-    }, endIcon ?? _react.createElement(_index.SvgCheckmark, null)));
-}));
+        'aria-selected': isSelected,
+        'aria-disabled': disabled,
+        'data-iui-index': index,
+        ...rest,
+      },
+      startIcon &&
+        _react.createElement(
+          _ListItem.ListItem.Icon,
+          {
+            as: 'span',
+            'aria-hidden': true,
+          },
+          startIcon,
+        ),
+      _react.createElement(
+        _ListItem.ListItem.Content,
+        null,
+        children,
+        sublabel &&
+          _react.createElement(_ListItem.ListItem.Description, null, sublabel),
+      ),
+      endIcon ||
+        (isSelected &&
+          _react.createElement(
+            _ListItem.ListItem.Icon,
+            {
+              as: 'span',
+              'aria-hidden': true,
+            },
+            endIcon ?? _react.createElement(_index.SvgCheckmark, null),
+          )),
+    );
+  }),
+);
 ComboBoxMenuItem.displayName = 'ComboBoxMenuItem';

package/DEV-cjs/core/ComboBox/ComboBoxMultipleContainer.js

@@ -1,22 +1,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "ComboBoxMultipleContainer", {
-    enumerable: true,
-    get: function() {
-        return ComboBoxMultipleContainer;
-    }
+Object.defineProperty(exports, 'ComboBoxMultipleContainer', {
+  enumerable: true,
+  get: function () {
+    return ComboBoxMultipleContainer;
+  },
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _SelectTagContainer = require("../Select/SelectTagContainer.js");
-const ComboBoxMultipleContainer = _react.forwardRef((props, ref)=>{
-    let { selectedItems = [], ...rest } = props;
-    return _react.createElement(_SelectTagContainer.SelectTagContainer, {
-        ref: ref,
-        tags: selectedItems,
-        ...rest
-    });
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _SelectTagContainer = require('../Select/SelectTagContainer.js');
+const ComboBoxMultipleContainer = _react.forwardRef((props, ref) => {
+  let { selectedItems = [], ...rest } = props;
+  return _react.createElement(_SelectTagContainer.SelectTagContainer, {
+    ref: ref,
+    tags: selectedItems,
+    ...rest,
+  });
 });
 ComboBoxMultipleContainer.displayName = 'ComboBoxMultipleContainer';

package/DEV-cjs/core/ComboBox/helpers.js

@@ -1,23 +1,24 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
 function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
+  for (var name in all)
+    Object.defineProperty(target, name, {
+      enumerable: true,
+      get: all[name],
     });
 }
 _export(exports, {
-    ComboBoxRefsContext: function() {
-        return ComboBoxRefsContext;
-    },
-    ComboBoxStateContext: function() {
-        return ComboBoxStateContext;
-    }
+  ComboBoxRefsContext: function () {
+    return ComboBoxRefsContext;
+  },
+  ComboBoxStateContext: function () {
+    return ComboBoxStateContext;
+  },
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
 const ComboBoxRefsContext = _react.createContext(void 0);
 ComboBoxRefsContext.displayName = 'ComboBoxRefsContext';
 const ComboBoxStateContext = _react.createContext(void 0);