@itwin/appui-react 5.15.0 → 5.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/lib/appui-react/toolbar/new-toolbars/GroupItem.d.ts +5 -0
- package/lib/appui-react/toolbar/new-toolbars/GroupItem.d.ts.map +1 -1
- package/lib/appui-react/toolbar/new-toolbars/GroupItem.js +10 -4
- package/lib/appui-react/toolbar/new-toolbars/GroupItem.js.map +1 -1
- package/lib/appui-react/toolbar/new-toolbars/GroupItem.scss +9 -0
- package/lib/appui-react/toolbar/new-toolbars/OverflowButton.js +3 -3
- package/lib/appui-react/toolbar/new-toolbars/OverflowButton.js.map +1 -1
- package/lib/cjs/appui-react/toolbar/new-toolbars/GroupItem.scss +9 -0
- package/lib/esm/appui-react/toolbar/new-toolbars/GroupItem.scss +9 -0
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# Change Log - @itwin/appui-react
|
|
2
2
|
|
|
3
|
+
## 5.15.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 655ca63: Removed height limit that caused vertical overflow in menu of `Toolbar` component.
|
|
8
|
+
- Updated dependencies [b930ab8]
|
|
9
|
+
- Updated dependencies [3781110]
|
|
10
|
+
- @itwin/imodel-components-react@5.15.1
|
|
11
|
+
- @itwin/components-react@5.15.1
|
|
12
|
+
- @itwin/core-react@5.15.1
|
|
13
|
+
|
|
3
14
|
## 5.15.0
|
|
4
15
|
|
|
5
16
|
### Minor Changes
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
/** @packageDocumentation
|
|
2
2
|
* @module Toolbar
|
|
3
3
|
*/
|
|
4
|
+
import "./GroupItem.scss";
|
|
4
5
|
import * as React from "react";
|
|
6
|
+
import { DropdownMenu } from "@itwin/itwinui-react";
|
|
5
7
|
import type { ToolbarItem } from "../../toolbar/ToolbarItem.js";
|
|
6
8
|
import { type ToolbarGroupItem } from "../../toolbar/ToolbarItem.js";
|
|
7
9
|
interface GroupItemProps {
|
|
@@ -17,5 +19,8 @@ interface GroupMenuItemProps {
|
|
|
17
19
|
}
|
|
18
20
|
/** @internal */
|
|
19
21
|
export declare function GroupMenuItem({ item, onClose }: GroupMenuItemProps): React.JSX.Element | null;
|
|
22
|
+
type ToolbarMenuProps = React.ComponentProps<typeof DropdownMenu>;
|
|
23
|
+
/** @internal */
|
|
24
|
+
export declare const ToolbarMenu: React.ForwardRefExoticComponent<React.PropsWithoutRef<ToolbarMenuProps> & React.RefAttributes<HTMLDivElement>>;
|
|
20
25
|
export {};
|
|
21
26
|
//# sourceMappingURL=GroupItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupItem.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/GroupItem.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"GroupItem.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/GroupItem.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAA8B,MAAM,sBAAsB,CAAC;AAChF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,8BAA8B,CAAC;AAStC,UAAU,cAAc;IACtB,IAAI,EAAE,gBAAgB,CAAC;CACxB;AAED,gBAAgB;AAChB,eAAO,MAAM,SAAS,0FAyBrB,CAAC;AAEF,gBAAgB;AAChB,wBAAgB,mBAAmB,sHAGlC;AAED,UAAU,kBAAkB;IAC1B,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,gBAAgB;AAChB,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,kBAAkB,4BA6ClE;AAkBD,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,CAAC;AAElE,gBAAgB;AAChB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,yBAAyB,CACvD,KAAK,CAAC,eAAe,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAe7E,CAAC"}
|
|
@@ -5,6 +5,8 @@
|
|
|
5
5
|
/** @packageDocumentation
|
|
6
6
|
* @module Toolbar
|
|
7
7
|
*/
|
|
8
|
+
import "./GroupItem.scss";
|
|
9
|
+
import classnames from "classnames";
|
|
8
10
|
import * as React from "react";
|
|
9
11
|
import { Icon } from "@itwin/core-react";
|
|
10
12
|
import { DropdownMenu, MenuExtraContent, MenuItem } from "@itwin/itwinui-react";
|
|
@@ -24,7 +26,7 @@ export const GroupItem = React.forwardRef(function GroupItem({ item }, ref) {
|
|
|
24
26
|
if (overflowContext) {
|
|
25
27
|
return React.createElement(GroupMenuItem, { item: item, onClose: overflowContext.onClose });
|
|
26
28
|
}
|
|
27
|
-
return (React.createElement(
|
|
29
|
+
return (React.createElement(ToolbarMenu, { menuItems: (close) => {
|
|
28
30
|
return toMenuItems(item, close);
|
|
29
31
|
}, placement: placement, onVisibleChange: (newVisible) => {
|
|
30
32
|
setPopoverOpen(newVisible);
|
|
@@ -53,13 +55,13 @@ export function GroupMenuItem({ item, onClose }) {
|
|
|
53
55
|
const startIcon = item.iconNode ? (React.createElement(React.Fragment, null, item.iconNode)) : (
|
|
54
56
|
// eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
55
57
|
React.createElement(Icon, { iconSpec: iconSpec }));
|
|
56
|
-
return (React.createElement(MenuItem, { startIcon: startIcon, disabled: isDisabled, subMenuItems: subMenuItems, onClick: ()
|
|
57
|
-
|
|
58
|
+
return (React.createElement(MenuItem, { className: "uifw-toolbar-newToolbars-groupItem_menuItem", startIcon: startIcon, disabled: isDisabled, subMenuItems: subMenuItems, onClick: isToolbarActionItem(item)
|
|
59
|
+
? () => {
|
|
58
60
|
item.execute();
|
|
59
61
|
onItemExecuted?.(item);
|
|
60
62
|
onClose?.();
|
|
61
63
|
}
|
|
62
|
-
|
|
64
|
+
: undefined,
|
|
63
65
|
// eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
64
66
|
isSelected: isActiveCondition ?? item.isActive, "data-item-id": item.id },
|
|
65
67
|
React.createElement(Badge, { badge: item.badge, badgeKind: item.badgeKind }),
|
|
@@ -78,4 +80,8 @@ function toMenuItems(item, onClose) {
|
|
|
78
80
|
}
|
|
79
81
|
return [];
|
|
80
82
|
}
|
|
83
|
+
/** @internal */
|
|
84
|
+
export const ToolbarMenu = React.forwardRef(function DropdownMenu1(props, ref) {
|
|
85
|
+
return (React.createElement(DropdownMenu, { ...props, className: classnames("uifw-toolbar-newToolbars-groupItem_menu", props.className), ref: ref }));
|
|
86
|
+
});
|
|
81
87
|
//# sourceMappingURL=GroupItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupItem.js","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/GroupItem.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhF,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,kBAAkB,GAEnB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAM/D,gBAAgB;AAChB,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACvC,SAAS,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE,GAAG;IAC9B,MAAM,SAAS,GAAG,mBAAmB,EAAE,CAAC;IACxC,MAAM,EAAE,cAAc,EAAE,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;IAC1D,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAwB,CAAC,CAAC;IAEnE,IAAI,eAAe,EAAE,CAAC;QACpB,OAAO,oBAAC,aAAa,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,eAAe,CAAC,OAAO,GAAI,CAAC;IACzE,CAAC;IACD,OAAO,CACL,oBAAC,
|
|
1
|
+
{"version":3,"file":"GroupItem.js","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/GroupItem.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Toolbar\n */\n\nimport \"./GroupItem.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { DropdownMenu, MenuExtraContent, MenuItem } from \"@itwin/itwinui-react\";\nimport type { ToolbarItem } from \"../../toolbar/ToolbarItem.js\";\nimport {\n isToolbarActionItem,\n isToolbarCustomItem,\n isToolbarGroupItem,\n type ToolbarGroupItem,\n} from \"../../toolbar/ToolbarItem.js\";\nimport { useConditionalProp } from \"../../hooks/useConditionalProp.js\";\nimport { ExpandIndicator } from \"./ExpandIndicator.js\";\nimport { Item } from \"./Item.js\";\nimport { Badge } from \"./Badge.js\";\nimport { ToolGroupOverflowContext } from \"./OverflowButton.js\";\nimport { ToolbarContext } from \"./Toolbar.js\";\nimport { useSafeContext } from \"../../hooks/useSafeContext.js\";\n\ninterface GroupItemProps {\n item: ToolbarGroupItem;\n}\n\n/** @internal */\nexport const GroupItem = React.forwardRef<HTMLButtonElement, GroupItemProps>(\n function GroupItem({ item }, ref) {\n const placement = usePopoverPlacement();\n const { setPopoverOpen } = useSafeContext(ToolbarContext);\n const overflowContext = React.useContext(ToolGroupOverflowContext);\n\n if (overflowContext) {\n return <GroupMenuItem item={item} onClose={overflowContext.onClose} />;\n }\n return (\n <ToolbarMenu\n menuItems={(close) => {\n return toMenuItems(item, close);\n }}\n placement={placement}\n onVisibleChange={(newVisible) => {\n setPopoverOpen(newVisible);\n }}\n >\n <Item item={item} ref={ref}>\n <ExpandIndicator />\n </Item>\n </ToolbarMenu>\n );\n }\n);\n\n/** @internal */\nexport function usePopoverPlacement() {\n const { expandsTo, panelAlignment } = useSafeContext(ToolbarContext);\n return `${expandsTo}-${panelAlignment}` as const;\n}\n\ninterface GroupMenuItemProps {\n item: ToolbarItem;\n onClose?: () => void;\n}\n\n/** @internal */\nexport function GroupMenuItem({ item, onClose }: GroupMenuItemProps) {\n const { onItemExecuted } = useSafeContext(ToolbarContext);\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n const iconSpec = useConditionalProp(item.icon);\n const label = useConditionalProp(item.label);\n const isDisabled = useConditionalProp(item.isDisabled);\n const isHidden = useConditionalProp(item.isHidden);\n const isActiveCondition = useConditionalProp(item.isActiveCondition);\n\n if (isHidden) {\n return null;\n }\n\n const subMenuItems = isDisabled ? undefined : toMenuItems(item, onClose);\n const startIcon = item.iconNode ? (\n <>{item.iconNode}</>\n ) : (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n <Icon iconSpec={iconSpec} />\n );\n\n return (\n <MenuItem\n className=\"uifw-toolbar-newToolbars-groupItem_menuItem\"\n startIcon={startIcon}\n disabled={isDisabled}\n subMenuItems={subMenuItems}\n onClick={\n isToolbarActionItem(item)\n ? () => {\n item.execute();\n onItemExecuted?.(item);\n onClose?.();\n }\n : undefined\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n isSelected={isActiveCondition ?? item.isActive}\n data-item-id={item.id}\n >\n {/* eslint-disable-next-line @typescript-eslint/no-deprecated */}\n <Badge badge={item.badge} badgeKind={item.badgeKind} />\n {label}\n </MenuItem>\n );\n}\n\nfunction toMenuItems(item: ToolbarItem, onClose?: () => void) {\n if (isToolbarGroupItem(item)) {\n return item.items.map((groupItem) => {\n return (\n <GroupMenuItem key={groupItem.id} item={groupItem} onClose={onClose} />\n );\n });\n }\n if (isToolbarCustomItem(item)) {\n return [\n <MenuExtraContent key={item.id}>{item.panelContent}</MenuExtraContent>,\n ];\n }\n return [];\n}\n\ntype ToolbarMenuProps = React.ComponentProps<typeof DropdownMenu>;\n\n/** @internal */\nexport const ToolbarMenu: React.ForwardRefExoticComponent<\n React.PropsWithoutRef<ToolbarMenuProps> & React.RefAttributes<HTMLDivElement>\n> = React.forwardRef<HTMLDivElement, ToolbarMenuProps>(function DropdownMenu1(\n props,\n ref\n) {\n return (\n <DropdownMenu\n {...props}\n className={classnames(\n \"uifw-toolbar-newToolbars-groupItem_menu\",\n props.className\n )}\n ref={ref}\n />\n );\n});\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/*---------------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
3
|
+
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
4
|
+
*--------------------------------------------------------------------------------------------*/
|
|
5
|
+
.uifw-toolbar-newToolbars-groupItem_menu,
|
|
6
|
+
// Can not customize iTwinUI submenu directly, so we use :has() to workaround it.
|
|
7
|
+
[role="menu"]:has(.uifw-toolbar-newToolbars-groupItem_menuItem) {
|
|
8
|
+
--iui-menu-max-height: 100%;
|
|
9
|
+
}
|
|
@@ -6,10 +6,10 @@
|
|
|
6
6
|
* @module Toolbar
|
|
7
7
|
*/
|
|
8
8
|
import * as React from "react";
|
|
9
|
-
import {
|
|
9
|
+
import { IconButton } from "@itwin/itwinui-react";
|
|
10
10
|
import { SvgMore } from "@itwin/itwinui-icons-react";
|
|
11
11
|
import { useLabelProps } from "./Item.js";
|
|
12
|
-
import { usePopoverPlacement } from "./GroupItem.js";
|
|
12
|
+
import { ToolbarMenu, usePopoverPlacement } from "./GroupItem.js";
|
|
13
13
|
import { ToolbarContext } from "./Toolbar.js";
|
|
14
14
|
import { useSafeContext } from "../../hooks/useSafeContext.js";
|
|
15
15
|
/** @internal */
|
|
@@ -19,7 +19,7 @@ export const OverflowButton = React.forwardRef(function OverflowButton(props, re
|
|
|
19
19
|
const placement = usePopoverPlacement();
|
|
20
20
|
const labelProps = useLabelProps();
|
|
21
21
|
const { setPopoverOpen } = useSafeContext(ToolbarContext);
|
|
22
|
-
return (React.createElement(
|
|
22
|
+
return (React.createElement(ToolbarMenu, { menuItems: (close) => {
|
|
23
23
|
return [
|
|
24
24
|
React.createElement(OverflowMenu, { key: 0, onClose: close }, props.children),
|
|
25
25
|
];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverflowButton.js","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/OverflowButton.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"OverflowButton.js","sourceRoot":"","sources":["../../../../src/appui-react/toolbar/new-toolbars/OverflowButton.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAM/D,gBAAgB;AAChB,MAAM,CAAC,MAAM,wBAAwB,GAAG,KAAK,CAAC,aAAa,CAEzD,SAAS,CAAC,CAAC;AAMb,gBAAgB;AAChB,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAG5C,SAAS,cAAc,CAAC,KAAK,EAAE,GAAG;IAClC,MAAM,SAAS,GAAG,mBAAmB,EAAE,CAAC;IACxC,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IACnC,MAAM,EAAE,cAAc,EAAE,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;IAE1D,OAAO,CACL,oBAAC,WAAW,IACV,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE;YACnB,OAAO;gBACL,oBAAC,YAAY,IAAC,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,IACjC,KAAK,CAAC,QAAQ,CACF;aAChB,CAAC;QACJ,CAAC,EACD,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,CAAC,UAAU,EAAE,EAAE;YAC9B,cAAc,CAAC,UAAU,CAAC,CAAC;QAC7B,CAAC;QAED,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAC,MAAM,EACZ,UAAU,EAAE,UAAU,EACtB,SAAS,EAAC,YAAY;YAEtB,oBAAC,OAAO,OAAG,CACA,CACD,CACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAOH,SAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAqB;IAC5D,OAAO,CACL,oBAAC,wBAAwB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAClD,QAAQ,CACyB,CACrC,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Toolbar\n */\n\nimport * as React from \"react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { SvgMore } from \"@itwin/itwinui-icons-react\";\nimport { useLabelProps } from \"./Item.js\";\nimport { ToolbarMenu, usePopoverPlacement } from \"./GroupItem.js\";\nimport { ToolbarContext } from \"./Toolbar.js\";\nimport { useSafeContext } from \"../../hooks/useSafeContext.js\";\n\ninterface ToolGroupOverflow {\n onClose?: () => void;\n}\n\n/** @internal */\nexport const ToolGroupOverflowContext = React.createContext<\n ToolGroupOverflow | undefined\n>(undefined);\n\ninterface OverflowButtonProps {\n children?: React.ReactNode;\n}\n\n/** @internal */\nexport const OverflowButton = React.forwardRef<\n HTMLButtonElement,\n OverflowButtonProps\n>(function OverflowButton(props, ref) {\n const placement = usePopoverPlacement();\n const labelProps = useLabelProps();\n const { setPopoverOpen } = useSafeContext(ToolbarContext);\n\n return (\n <ToolbarMenu\n menuItems={(close) => {\n return [\n <OverflowMenu key={0} onClose={close}>\n {props.children}\n </OverflowMenu>,\n ];\n }}\n placement={placement}\n onVisibleChange={(newVisible) => {\n setPopoverOpen(newVisible);\n }}\n >\n <IconButton\n ref={ref}\n label=\"More\"\n labelProps={labelProps}\n styleType=\"borderless\"\n >\n <SvgMore />\n </IconButton>\n </ToolbarMenu>\n );\n});\n\ninterface OverflowMenuProps {\n children?: React.ReactNode;\n onClose?: () => void;\n}\n\nfunction OverflowMenu({ children, onClose }: OverflowMenuProps) {\n return (\n <ToolGroupOverflowContext.Provider value={{ onClose }}>\n {children}\n </ToolGroupOverflowContext.Provider>\n );\n}\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/*---------------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
3
|
+
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
4
|
+
*--------------------------------------------------------------------------------------------*/
|
|
5
|
+
.uifw-toolbar-newToolbars-groupItem_menu,
|
|
6
|
+
// Can not customize iTwinUI submenu directly, so we use :has() to workaround it.
|
|
7
|
+
[role="menu"]:has(.uifw-toolbar-newToolbars-groupItem_menuItem) {
|
|
8
|
+
--iui-menu-max-height: 100%;
|
|
9
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/*---------------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
3
|
+
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
4
|
+
*--------------------------------------------------------------------------------------------*/
|
|
5
|
+
.uifw-toolbar-newToolbars-groupItem_menu,
|
|
6
|
+
// Can not customize iTwinUI submenu directly, so we use :has() to workaround it.
|
|
7
|
+
[role="menu"]:has(.uifw-toolbar-newToolbars-groupItem_menuItem) {
|
|
8
|
+
--iui-menu-max-height: 100%;
|
|
9
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itwin/appui-react",
|
|
3
|
-
"version": "5.15.
|
|
3
|
+
"version": "5.15.1",
|
|
4
4
|
"description": "A react component library for AppUI framework",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"types": "./lib/appui-react.d.ts",
|
|
@@ -45,9 +45,9 @@
|
|
|
45
45
|
"react-dom": "^18.0.0",
|
|
46
46
|
"react-redux": "^7.2.2 || ^8.0.0 || ^9.0.0",
|
|
47
47
|
"redux": "^4.1.0 || ^5.0.0",
|
|
48
|
-
"@itwin/components-react": "5.15.
|
|
49
|
-
"@itwin/core-react": "5.15.
|
|
50
|
-
"@itwin/imodel-components-react": "5.15.
|
|
48
|
+
"@itwin/components-react": "5.15.1",
|
|
49
|
+
"@itwin/core-react": "5.15.1",
|
|
50
|
+
"@itwin/imodel-components-react": "5.15.1"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
53
|
"@itwin/appui-abstract": "^5.1.0",
|
|
@@ -91,9 +91,9 @@
|
|
|
91
91
|
"typescript": "~5.6.2",
|
|
92
92
|
"upath": "^2.0.1",
|
|
93
93
|
"vitest": "^3.0.6",
|
|
94
|
-
"@itwin/
|
|
95
|
-
"@itwin/
|
|
96
|
-
"@itwin/
|
|
94
|
+
"@itwin/core-react": "5.15.1",
|
|
95
|
+
"@itwin/imodel-components-react": "5.15.1",
|
|
96
|
+
"@itwin/components-react": "5.15.1"
|
|
97
97
|
},
|
|
98
98
|
"dependencies": {
|
|
99
99
|
"@itwin/itwinui-icons-react": "^2.8.0",
|