@itwin/itwinui-react 1.31.0 → 1.33.0

package/esm/core/index.js

@@ -34,6 +34,7 @@ export { RadioTile, RadioTileGroup } from './RadioTiles';
 export { Select } from './Select';
 export { SideNavigation, SidenavButton, SidenavSubmenu, SidenavSubmenuHeader, } from './SideNavigation';
 export { Slider } from './Slider';
+export { StatusMessage } from './StatusMessage';
 export { Table, tableFilters, FilterButtonBar, DefaultCell, EditableCell, TablePaginator, } from './Table';
 export { Tag, TagContainer } from './Tag';
 export { Textarea } from './Textarea';
@@ -43,6 +44,7 @@ export { default as toaster } from './Toast';
 export { ThemeProvider } from './ThemeProvider';
 export { ToggleSwitch } from './ToggleSwitch';
 export { Tooltip } from './Tooltip';
+export { Tree, TreeNode, TreeNodeExpander } from './Tree';
 export { Anchor, Body, Headline, Leading, Small, Subheading, Title, Blockquote, Code, Kbd, KbdKeys, Text, } from './Typography';
 export { UserIcon } from './UserIcon';
 export { UserIconGroup } from './UserIconGroup';

package/esm/core/utils/components/InputContainer.d.ts

@@ -9,6 +9,7 @@ export declare type InputContainerProps<T extends React.ElementType = 'div'> = {
     icon?: JSX.Element;
     isLabelInline?: boolean;
     isIconInline?: boolean;
+    statusMessage?: React.ReactNode;
 } & React.ComponentPropsWithoutRef<T>;
 /**
  * Input container to wrap inputs with label, and add optional message and icon.

package/esm/core/utils/components/InputContainer.js

@@ -33,22 +33,23 @@ import cx from 'classnames';
 export var InputContainer = function (props) {
     var _a;
     var _b;
-    var _c = props.as, Element = _c === void 0 ? 'div' : _c, label = props.label, disabled = props.disabled, required = props.required, status = props.status, message = props.message, icon = props.icon, isLabelInline = props.isLabelInline, isIconInline = props.isIconInline, children = props.children, className = props.className, style = props.style, rest = __rest(props, ["as", "label", "disabled", "required", "status", "message", "icon", "isLabelInline", "isIconInline", "children", "className", "style"]);
+    var _c = props.as, Element = _c === void 0 ? 'div' : _c, label = props.label, disabled = props.disabled, required = props.required, status = props.status, message = props.message, icon = props.icon, isLabelInline = props.isLabelInline, isIconInline = props.isIconInline, children = props.children, className = props.className, style = props.style, statusMessage = props.statusMessage, rest = __rest(props, ["as", "label", "disabled", "required", "status", "message", "icon", "isLabelInline", "isIconInline", "children", "className", "style", "statusMessage"]);
     return (React.createElement(Element, __assign({ className: cx('iui-input-container', (_a = {
                 'iui-disabled': disabled
             },
             _a["iui-" + status] = !!status,
             _a['iui-inline-label'] = isLabelInline,
             _a['iui-inline-icon'] = isIconInline,
-            _a['iui-with-message'] = !!message && !isLabelInline,
+            _a['iui-with-message'] = (!!message || !!icon || !!statusMessage) && !isLabelInline,
             _a), className), style: style }, rest),
         label && (React.createElement("div", { className: cx('iui-label', {
                 'iui-required': required,
             }) }, label)),
         children,
-        icon &&
-            React.cloneElement(icon, {
-                className: cx('iui-input-icon', (_b = icon.props) === null || _b === void 0 ? void 0 : _b.className),
-            }),
-        message && !isLabelInline && (React.createElement("div", { className: 'iui-message' }, message))));
+        statusMessage ? (statusMessage) : (React.createElement(React.Fragment, null,
+            icon &&
+                React.cloneElement(icon, {
+                    className: cx('iui-input-icon', (_b = icon.props) === null || _b === void 0 ? void 0 : _b.className),
+                }),
+            message && !isLabelInline && (React.createElement("div", { className: 'iui-message' }, message))))));
 };

package/esm/core/utils/components/Popover.js

@@ -53,7 +53,7 @@ export var Popover = React.forwardRef(function (props, ref) {
             },
         }); },
     };
-    var computedProps = __assign(__assign({ allowHTML: true, animation: false, appendTo: 'parent', arrow: false, duration: 0, interactive: true, role: undefined, offset: [0, 0], maxWidth: '' }, props), { className: cx('iui-popover', props.className), plugins: __spreadArray([
+    var computedProps = __assign(__assign({ allowHTML: true, animation: false, appendTo: function (el) { return el.ownerDocument.body; }, arrow: false, duration: 0, interactive: true, role: undefined, offset: [0, 0], maxWidth: '', zIndex: 99999 }, props), { className: cx('iui-popover', props.className), plugins: __spreadArray([
             lazyLoad,
             removeTabIndex,
             hideOnEscOrTab

package/esm/core/utils/functions/focusable.js

@@ -12,7 +12,9 @@ export var getTabbableElements = function (container) {
     }
     var elements = container.querySelectorAll(tabbableElementsSelector);
     return Array.from(elements).filter(function (el) {
-        return !el.hasAttribute('disabled') && !el.classList.contains('iui-disabled');
+        return !el.hasAttribute('disabled') &&
+            !el.classList.contains('iui-disabled') &&
+            el.getAttribute('aria-disabled') !== 'true';
     });
 };
 /**
@@ -24,6 +26,8 @@ export var getFocusableElements = function (container) {
     }
     var elements = container.querySelectorAll(tabbableElementsSelector + ", [tabindex=\"-1\"]");
     return Array.from(elements).filter(function (el) {
-        return !el.hasAttribute('disabled') && !el.classList.contains('iui-disabled');
+        return !el.hasAttribute('disabled') &&
+            !el.classList.contains('iui-disabled') &&
+            el.getAttribute('aria-disabled') !== 'true';
     });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/itwinui-react",
-  "version": "1.31.0",
+  "version": "1.33.0",
   "author": "Bentley Systems",
   "license": "MIT",
   "main": "cjs/index.js",
@@ -40,7 +40,7 @@
     "build-storybook": "build-storybook"
   },
   "dependencies": {
-    "@itwin/itwinui-css": "^0.47.0",
+    "@itwin/itwinui-css": "^0.50.0",
     "@itwin/itwinui-icons-react": "^1.5.0",
     "@itwin/itwinui-illustrations-react": "^1.0.1",
     "@tippyjs/react": "^4.2.5",