@itwin/itwinui-react 3.16.0 → 3.16.2

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Changelog
 
+## 3.16.2
+
+### Patch Changes
+
+- [#2378](https://github.com/iTwin/iTwinUI/pull/2378): Fixed folder variant `Tile`'s broken layout when it has a long name.
+
+## 3.16.1
+
+### Patch Changes
+
+- [#2362](https://github.com/iTwin/iTwinUI/pull/2362): `Select` with "small" size now has the same height (`24px`) as other input elements with "small" size (e.g. `ComboBox`)
+- [#2370](https://github.com/iTwin/iTwinUI/pull/2370): Fixed `Panels` animations not working in some rare cases.
+- [#2374](https://github.com/iTwin/iTwinUI/pull/2374): Fixed `HeaderButton`'s `startIcon` and `endIcon` fill color.
+- [#2359](https://github.com/iTwin/iTwinUI/pull/2359): `Tooltip` now remains visible when hovered up to `4px` outside its border.
+
 ## 3.16.0
 
 ### Minor Changes

package/DEV-cjs/core/Header/HeaderDropdownButton.js

@@ -8,15 +8,13 @@ Object.defineProperty(exports, 'HeaderDropdownButton', {
     return HeaderDropdownButton;
   },
 });
-const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _DropdownMenu = require('../DropdownMenu/DropdownMenu.js');
 const _index = require('../../utils/index.js');
 const _HeaderBasicButton = require('./HeaderBasicButton.js');
 const HeaderDropdownButton = _react.forwardRef((props, ref) => {
-  let { menuItems, className, children, ...rest } = props;
+  let { menuItems, children, ...rest } = props;
   let [isMenuOpen, setIsMenuOpen] = _react.useState(false);
   let [menuWidth, setMenuWidth] = _react.useState(0);
   let buttonRef = _react.useRef(null);
@@ -36,10 +34,6 @@ const HeaderDropdownButton = _react.forwardRef((props, ref) => {
     _react.createElement(
       _HeaderBasicButton.HeaderBasicButton,
       {
-        className: (0, _classnames.default)(
-          'iui-header-breadcrumb-button',
-          className,
-        ),
         ref: refs,
         'aria-label': 'Dropdown',
         endIcon: isMenuOpen

package/DEV-cjs/core/Panels/Panels.js

@@ -53,11 +53,14 @@ const PanelsWrapper = _react.forwardRef((props, forwardedRef) => {
         return;
       _reactdom.flushSync(() => setActivePanelId(newActiveId));
       onActiveIdChange.current?.(newActiveId);
-      ref.current?.ownerDocument.getElementById(newActiveId)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'center',
-        behavior: motionOk ? 'smooth' : 'instant',
-      });
+      ref.current
+        ?.getRootNode()
+        .getElementById(newActiveId)
+        ?.scrollIntoView({
+          block: 'nearest',
+          inline: 'center',
+          behavior: motionOk ? 'smooth' : 'instant',
+        });
     },
     [activePanelId, motionOk, onActiveIdChange],
   );

package/DEV-cjs/styles.js

@@ -1,6 +1,6 @@
 'use strict';
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const e = '3.16.0';
+const e = '3.16.2';
 const u = new Proxy(
   {},
   {

package/DEV-esm/core/Header/HeaderDropdownButton.js

@@ -1,4 +1,3 @@
-import cx from 'classnames';
 import * as React from 'react';
 import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 import {
@@ -8,7 +7,7 @@ import {
 } from '../../utils/index.js';
 import { HeaderBasicButton } from './HeaderBasicButton.js';
 export const HeaderDropdownButton = React.forwardRef((props, ref) => {
-  let { menuItems, className, children, ...rest } = props;
+  let { menuItems, children, ...rest } = props;
   let [isMenuOpen, setIsMenuOpen] = React.useState(false);
   let [menuWidth, setMenuWidth] = React.useState(0);
   let buttonRef = React.useRef(null);
@@ -28,7 +27,6 @@ export const HeaderDropdownButton = React.forwardRef((props, ref) => {
     React.createElement(
       HeaderBasicButton,
       {
-        className: cx('iui-header-breadcrumb-button', className),
         ref: refs,
         'aria-label': 'Dropdown',
         endIcon: isMenuOpen

package/DEV-esm/core/Panels/Panels.js

@@ -39,11 +39,14 @@ export const PanelsWrapper = React.forwardRef((props, forwardedRef) => {
         return;
       ReactDOM.flushSync(() => setActivePanelId(newActiveId));
       onActiveIdChange.current?.(newActiveId);
-      ref.current?.ownerDocument.getElementById(newActiveId)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'center',
-        behavior: motionOk ? 'smooth' : 'instant',
-      });
+      ref.current
+        ?.getRootNode()
+        .getElementById(newActiveId)
+        ?.scrollIntoView({
+          block: 'nearest',
+          inline: 'center',
+          behavior: motionOk ? 'smooth' : 'instant',
+        });
     },
     [activePanelId, motionOk, onActiveIdChange],
   );

package/DEV-esm/styles.js

@@ -1,4 +1,4 @@
-const t = '3.16.0';
+const t = '3.16.2';
 const u = new Proxy(
   {},
   {

package/cjs/core/Header/HeaderDropdownButton.js

@@ -8,15 +8,13 @@ Object.defineProperty(exports, 'HeaderDropdownButton', {
     return HeaderDropdownButton;
   },
 });
-const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _classnames = _interop_require_default._(require('classnames'));
 const _react = _interop_require_wildcard._(require('react'));
 const _DropdownMenu = require('../DropdownMenu/DropdownMenu.js');
 const _index = require('../../utils/index.js');
 const _HeaderBasicButton = require('./HeaderBasicButton.js');
 const HeaderDropdownButton = _react.forwardRef((props, ref) => {
-  let { menuItems, className, children, ...rest } = props;
+  let { menuItems, children, ...rest } = props;
   let [isMenuOpen, setIsMenuOpen] = _react.useState(false);
   let [menuWidth, setMenuWidth] = _react.useState(0);
   let buttonRef = _react.useRef(null);
@@ -36,10 +34,6 @@ const HeaderDropdownButton = _react.forwardRef((props, ref) => {
     _react.createElement(
       _HeaderBasicButton.HeaderBasicButton,
       {
-        className: (0, _classnames.default)(
-          'iui-header-breadcrumb-button',
-          className,
-        ),
         ref: refs,
         'aria-label': 'Dropdown',
         endIcon: isMenuOpen

package/cjs/core/Panels/Panels.js

@@ -53,11 +53,14 @@ const PanelsWrapper = _react.forwardRef((props, forwardedRef) => {
         return;
       _reactdom.flushSync(() => setActivePanelId(newActiveId));
       onActiveIdChange.current?.(newActiveId);
-      ref.current?.ownerDocument.getElementById(newActiveId)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'center',
-        behavior: motionOk ? 'smooth' : 'instant',
-      });
+      ref.current
+        ?.getRootNode()
+        .getElementById(newActiveId)
+        ?.scrollIntoView({
+          block: 'nearest',
+          inline: 'center',
+          behavior: motionOk ? 'smooth' : 'instant',
+        });
     },
     [activePanelId, motionOk, onActiveIdChange],
   );

package/cjs/core/ProgressIndicators/ProgressLinear.d.ts

@@ -8,7 +8,7 @@ type ProgressLinearProps = {
     /**
      * Progress variant. If true, `value` will be ignored.
      *
-     * Defaults to true if `value` is passed, otherwise false.
+     * Defaults to false if `value` is passed, otherwise true.
      */
     indeterminate?: boolean;
     /**

package/cjs/core/Tree/Tree.d.ts

@@ -42,7 +42,8 @@ export type TreeProps<T> = {
     /**
      * Render function that should return the node element.
      * Recommended to use `TreeNode` component.
-     * Must be memoized.
+     *
+     ***Note**: When virtualization is enabled, the return value of `nodeRenderer()` is cloned and a `ref` is passed to it. Thus, you would need a `React.forwardRef` in the component returned by `nodeRenderer()`, except if you are returning `TreeNode` since that already forwards its ref.
      * @example
      * const nodeRenderer = React.useCallback(({ node, ...rest }: NodeRenderProps<DataType>) => (
      *   <TreeNode

package/cjs/styles.js

@@ -1,6 +1,6 @@
 'use strict';
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const e = '3.16.0';
+const e = '3.16.2';
 const u = new Proxy(
   {},
   {

package/esm/core/Header/HeaderDropdownButton.js

@@ -1,4 +1,3 @@
-import cx from 'classnames';
 import * as React from 'react';
 import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 import {
@@ -8,7 +7,7 @@ import {
 } from '../../utils/index.js';
 import { HeaderBasicButton } from './HeaderBasicButton.js';
 export const HeaderDropdownButton = React.forwardRef((props, ref) => {
-  let { menuItems, className, children, ...rest } = props;
+  let { menuItems, children, ...rest } = props;
   let [isMenuOpen, setIsMenuOpen] = React.useState(false);
   let [menuWidth, setMenuWidth] = React.useState(0);
   let buttonRef = React.useRef(null);
@@ -28,7 +27,6 @@ export const HeaderDropdownButton = React.forwardRef((props, ref) => {
     React.createElement(
       HeaderBasicButton,
       {
-        className: cx('iui-header-breadcrumb-button', className),
         ref: refs,
         'aria-label': 'Dropdown',
         endIcon: isMenuOpen

package/esm/core/Panels/Panels.js

@@ -39,11 +39,14 @@ export const PanelsWrapper = React.forwardRef((props, forwardedRef) => {
         return;
       ReactDOM.flushSync(() => setActivePanelId(newActiveId));
       onActiveIdChange.current?.(newActiveId);
-      ref.current?.ownerDocument.getElementById(newActiveId)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'center',
-        behavior: motionOk ? 'smooth' : 'instant',
-      });
+      ref.current
+        ?.getRootNode()
+        .getElementById(newActiveId)
+        ?.scrollIntoView({
+          block: 'nearest',
+          inline: 'center',
+          behavior: motionOk ? 'smooth' : 'instant',
+        });
     },
     [activePanelId, motionOk, onActiveIdChange],
   );

package/esm/core/ProgressIndicators/ProgressLinear.d.ts

@@ -8,7 +8,7 @@ type ProgressLinearProps = {
     /**
      * Progress variant. If true, `value` will be ignored.
      *
-     * Defaults to true if `value` is passed, otherwise false.
+     * Defaults to false if `value` is passed, otherwise true.
      */
     indeterminate?: boolean;
     /**

package/esm/core/Tree/Tree.d.ts

@@ -42,7 +42,8 @@ export type TreeProps<T> = {
     /**
      * Render function that should return the node element.
      * Recommended to use `TreeNode` component.
-     * Must be memoized.
+     *
+     ***Note**: When virtualization is enabled, the return value of `nodeRenderer()` is cloned and a `ref` is passed to it. Thus, you would need a `React.forwardRef` in the component returned by `nodeRenderer()`, except if you are returning `TreeNode` since that already forwards its ref.
      * @example
      * const nodeRenderer = React.useCallback(({ node, ...rest }: NodeRenderProps<DataType>) => (
      *   <TreeNode

package/esm/styles.js

@@ -1,4 +1,4 @@
-const t = '3.16.0';
+const t = '3.16.2';
 const u = new Proxy(
   {},
   {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/itwinui-react",
-  "version": "3.16.0",
+  "version": "3.16.2",
   "author": "Bentley Systems",
   "license": "MIT",
   "type": "module",