@itwin/grouping-mapping-widget 0.25.2 → 0.26.1

package/lib/esm/components/Groups/GroupListItem.scss

@@ -11,3 +11,17 @@
   padding-bottom: 2px var(--iui-size-xs);
   padding-top: 2px var(--iui-size-xs);
 }
+
+.gmw-group-list-end {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  .gmw-group-menu-actions {
+    display: flex;
+    flex-grow: 1;
+  }
+  .gmw-overlap-progress {
+    width: 100%;
+  }
+}

package/lib/esm/components/Groups/GroupMenuActions.d.ts

@@ -1,14 +1,14 @@
 /// <reference types="react" />
-import type { Group } from "@itwin/insights-client";
+import type { GroupMinimal } from "@itwin/insights-client";
 import type { ContextCustomUI, GroupingCustomUI } from "../customUI/GroupingMappingCustomUI";
 import type { GroupsProps } from "./Groups";
 import "./GroupMenuActions.scss";
 export interface GroupMenuActionsProps extends Omit<GroupsProps, "onClickAddGroup" | "onClickGroupTitle"> {
-    group: Group;
+    group: GroupMinimal;
     groupUIs: GroupingCustomUI[];
     contextUIs: ContextCustomUI[];
-    setShowDeleteModal: (showDeleteModal: Group) => void;
-    setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: Group) => void;
+    setShowDeleteModal: (showDeleteModal: GroupMinimal) => void;
+    setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: GroupMinimal) => void;
 }
 export declare const GroupMenuActions: ({ mapping, group, actionButtonRenderers, onClickGroupModify, onClickRenderContextCustomUI, groupUIs, contextUIs, disableActions, setShowDeleteModal, setActiveOverlapInfoPanelGroup, }: GroupMenuActionsProps) => JSX.Element;
 //# sourceMappingURL=GroupMenuActions.d.ts.map

package/lib/esm/components/Groups/GroupMenuActions.js

@@ -24,8 +24,7 @@ export const GroupMenuActions = ({ mapping, group, actionButtonRenderers, onClic
                 : []),
             ...contextUIs.map((p) => {
                 return (React.createElement(MenuItem, { key: p.name, onClick: async () => {
-                        if (p.uiComponent &&
-                            onClickRenderContextCustomUI) {
+                        if (p.uiComponent && onClickRenderContextCustomUI) {
                             onClickRenderContextCustomUI(p.uiComponent, group, p.displayLabel);
                         }
                         if (p.onClick) {
@@ -46,12 +45,24 @@ export const GroupMenuActions = ({ mapping, group, actionButtonRenderers, onClic
                 }, icon: React.createElement(SvgInfo, null), "data-testid": "gmw-overlap-menu-item" }, "Overlap Info"));
         }
         return menuItems;
-    }, [groupUIs, disableActions, group, contextUIs, mapping, iModelId, showGroupColor, onModify, setActiveOverlapInfoPanelGroup, setShowDeleteModal, onClickGroupModify, onClickRenderContextCustomUI]);
+    }, [
+        groupUIs,
+        disableActions,
+        group,
+        contextUIs,
+        mapping,
+        iModelId,
+        showGroupColor,
+        onModify,
+        setActiveOverlapInfoPanelGroup,
+        setShowDeleteModal,
+        onClickGroupModify,
+        onClickRenderContextCustomUI,
+    ]);
     return (React.createElement("div", { className: "gmw-actions" },
-        actionButtonRenderers &&
-            actionButtonRenderers.map((actionButton, index) => React.createElement(React.Fragment, { key: index }, actionButton({ group }))),
+        actionButtonRenderers && actionButtonRenderers.map((actionButton, index) => React.createElement(React.Fragment, { key: index }, actionButton({ group }))),
         React.createElement(DropdownMenu, { className: "gmw-action-dropdown", disabled: disableActions, menuItems: createMenuItems },
-            React.createElement(IconButton, { disabled: disableActions, styleType: "borderless", "data-testid": "gmw-more-button", title: 'Group Options' },
+            React.createElement(IconButton, { disabled: disableActions, styleType: "borderless", "data-testid": "gmw-more-button", title: "Group Options" },
                 React.createElement(SvgMore, null)))));
 };
 //# sourceMappingURL=GroupMenuActions.js.map

package/lib/esm/components/Groups/GroupMenuActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupMenuActions.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupMenuActions.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*--------------------------------------------------------------------------------------------*/\nimport type { Group } from \"@itwin/insights-client\";\nimport { SvgDelete, SvgEdit, SvgInfo, SvgMore } from \"@itwin/itwinui-icons-react\";\nimport { DropdownMenu, IconButton, MenuItem } from \"@itwin/itwinui-react\";\nimport React, { useCallback } from \"react\";\nimport type { ContextCustomUI, GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport type { GroupsProps } from \"./Groups\";\nimport { useGroupingMappingApiConfig } from \"../context/GroupingApiConfigContext\";\nimport \"./GroupMenuActions.scss\";\nimport { useGroupHilitedElementsContext } from \"../context/GroupHilitedElementsContext\";\n\nexport interface GroupMenuActionsProps extends Omit<GroupsProps, \"onClickAddGroup\" | \"onClickGroupTitle\"> {\n  group: Group;\n  groupUIs: GroupingCustomUI[];\n  contextUIs: ContextCustomUI[];\n  setShowDeleteModal: (showDeleteModal: Group) => void;\n  setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: Group) => void;\n}\n\nexport const GroupMenuActions = ({\n  mapping,\n  group,\n  actionButtonRenderers,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  groupUIs,\n  contextUIs,\n  disableActions,\n  setShowDeleteModal,\n  setActiveOverlapInfoPanelGroup,\n}: GroupMenuActionsProps) => {\n  const { iModelId } = useGroupingMappingApiConfig();\n  const { showGroupColor } = useGroupHilitedElementsContext();\n  const onModify = useCallback(async (group: Group, type: string) => {\n    if (!onClickGroupModify) return;\n    onClickGroupModify(group, type);\n  }, [onClickGroupModify]);\n\n  const createMenuItems = useCallback((close: () => void) => {\n    const menuItems = [\n      ...(groupUIs.length > 0 && onClickGroupModify\n        ? [\n          <MenuItem\n            key={0}\n            icon={<SvgEdit />}\n            disabled={disableActions}\n            data-testid=\"gmw-context-menu-item\"\n            subMenuItems={groupUIs.map((p, index) => (\n              <MenuItem\n                key={p.name}\n                className=\"gmw-menu-item\"\n                data-testid={`gmw-edit-${index}`}\n                onClick={async () => {\n                  await onModify(group, p.name);\n                  close();\n                }}\n                icon={p.icon}\n              >\n                {p.displayLabel}\n              </MenuItem>\n            ))}\n          >\n            Edit\n          </MenuItem>,\n        ]\n        : []),\n      ...contextUIs.map((p) => {\n        return (\n          <MenuItem\n            key={p.name}\n            onClick={async () => {\n              if (\n                p.uiComponent &&\n                onClickRenderContextCustomUI\n              ) {\n                onClickRenderContextCustomUI(\n                  p.uiComponent,\n                  group,\n                  p.displayLabel\n                );\n              }\n              if (p.onClick) {\n                p.onClick(group, mapping, iModelId);\n              }\n              close();\n            }}\n            icon={p.icon}\n            data-testid=\"gmw-context-menu-item\"\n          >\n            {p.displayLabel}\n          </MenuItem>\n        );\n      }),\n      <MenuItem\n        key={2}\n        onClick={() => {\n          setShowDeleteModal(group);\n          close();\n        }}\n        icon={<SvgDelete />}\n        data-testid=\"gmw-context-menu-item\"\n      >\n        Remove\n      </MenuItem>,\n    ];\n\n    if (showGroupColor && setActiveOverlapInfoPanelGroup) {\n      menuItems.push(\n        <MenuItem\n          key={3}\n          onClick={() => {\n            setActiveOverlapInfoPanelGroup(group);\n            close();\n          }}\n          icon={<SvgInfo />}\n          data-testid=\"gmw-overlap-menu-item\"\n        >\n          Overlap Info\n        </MenuItem>);\n    }\n\n    return menuItems;\n  }, [groupUIs, disableActions, group, contextUIs, mapping, iModelId, showGroupColor, onModify, setActiveOverlapInfoPanelGroup, setShowDeleteModal, onClickGroupModify, onClickRenderContextCustomUI]);\n\n  return (\n    <div className=\"gmw-actions\">\n      {actionButtonRenderers &&\n        actionButtonRenderers.map((actionButton, index) =>\n          <React.Fragment key={index}>{actionButton({ group })}</React.Fragment>\n        )}\n      <DropdownMenu\n        className=\"gmw-action-dropdown\"\n        disabled={disableActions}\n        menuItems={createMenuItems}\n      >\n        <IconButton\n          disabled={disableActions}\n          styleType=\"borderless\"\n          data-testid=\"gmw-more-button\"\n          title='Group Options'\n        >\n          <SvgMore />\n        </IconButton>\n      </DropdownMenu>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"GroupMenuActions.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupMenuActions.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 *--------------------------------------------------------------------------------------------*/\nimport type { GroupMinimal } from \"@itwin/insights-client\";\nimport { SvgDelete, SvgEdit, SvgInfo, SvgMore } from \"@itwin/itwinui-icons-react\";\nimport { DropdownMenu, IconButton, MenuItem } from \"@itwin/itwinui-react\";\nimport React, { useCallback } from \"react\";\nimport type { ContextCustomUI, GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport type { GroupsProps } from \"./Groups\";\nimport { useGroupingMappingApiConfig } from \"../context/GroupingApiConfigContext\";\nimport \"./GroupMenuActions.scss\";\nimport { useGroupHilitedElementsContext } from \"../context/GroupHilitedElementsContext\";\n\nexport interface GroupMenuActionsProps extends Omit<GroupsProps, \"onClickAddGroup\" | \"onClickGroupTitle\"> {\n  group: GroupMinimal;\n  groupUIs: GroupingCustomUI[];\n  contextUIs: ContextCustomUI[];\n  setShowDeleteModal: (showDeleteModal: GroupMinimal) => void;\n  setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: GroupMinimal) => void;\n}\n\nexport const GroupMenuActions = ({\n  mapping,\n  group,\n  actionButtonRenderers,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  groupUIs,\n  contextUIs,\n  disableActions,\n  setShowDeleteModal,\n  setActiveOverlapInfoPanelGroup,\n}: GroupMenuActionsProps) => {\n  const { iModelId } = useGroupingMappingApiConfig();\n  const { showGroupColor } = useGroupHilitedElementsContext();\n  const onModify = useCallback(\n    async (group: GroupMinimal, type: string) => {\n      if (!onClickGroupModify) return;\n      onClickGroupModify(group, type);\n    },\n    [onClickGroupModify],\n  );\n\n  const createMenuItems = useCallback(\n    (close: () => void) => {\n      const menuItems = [\n        ...(groupUIs.length > 0 && onClickGroupModify\n          ? [\n              <MenuItem\n                key={0}\n                icon={<SvgEdit />}\n                disabled={disableActions}\n                data-testid=\"gmw-context-menu-item\"\n                subMenuItems={groupUIs.map((p, index) => (\n                  <MenuItem\n                    key={p.name}\n                    className=\"gmw-menu-item\"\n                    data-testid={`gmw-edit-${index}`}\n                    onClick={async () => {\n                      await onModify(group, p.name);\n                      close();\n                    }}\n                    icon={p.icon}\n                  >\n                    {p.displayLabel}\n                  </MenuItem>\n                ))}\n              >\n                Edit\n              </MenuItem>,\n            ]\n          : []),\n        ...contextUIs.map((p) => {\n          return (\n            <MenuItem\n              key={p.name}\n              onClick={async () => {\n                if (p.uiComponent && onClickRenderContextCustomUI) {\n                  onClickRenderContextCustomUI(p.uiComponent, group, p.displayLabel);\n                }\n                if (p.onClick) {\n                  p.onClick(group, mapping, iModelId);\n                }\n                close();\n              }}\n              icon={p.icon}\n              data-testid=\"gmw-context-menu-item\"\n            >\n              {p.displayLabel}\n            </MenuItem>\n          );\n        }),\n        <MenuItem\n          key={2}\n          onClick={() => {\n            setShowDeleteModal(group);\n            close();\n          }}\n          icon={<SvgDelete />}\n          data-testid=\"gmw-context-menu-item\"\n        >\n          Remove\n        </MenuItem>,\n      ];\n\n      if (showGroupColor && setActiveOverlapInfoPanelGroup) {\n        menuItems.push(\n          <MenuItem\n            key={3}\n            onClick={() => {\n              setActiveOverlapInfoPanelGroup(group);\n              close();\n            }}\n            icon={<SvgInfo />}\n            data-testid=\"gmw-overlap-menu-item\"\n          >\n            Overlap Info\n          </MenuItem>,\n        );\n      }\n\n      return menuItems;\n    },\n    [\n      groupUIs,\n      disableActions,\n      group,\n      contextUIs,\n      mapping,\n      iModelId,\n      showGroupColor,\n      onModify,\n      setActiveOverlapInfoPanelGroup,\n      setShowDeleteModal,\n      onClickGroupModify,\n      onClickRenderContextCustomUI,\n    ],\n  );\n\n  return (\n    <div className=\"gmw-actions\">\n      {actionButtonRenderers && actionButtonRenderers.map((actionButton, index) => <React.Fragment key={index}>{actionButton({ group })}</React.Fragment>)}\n      <DropdownMenu className=\"gmw-action-dropdown\" disabled={disableActions} menuItems={createMenuItems}>\n        <IconButton disabled={disableActions} styleType=\"borderless\" data-testid=\"gmw-more-button\" title=\"Group Options\">\n          <SvgMore />\n        </IconButton>\n      </DropdownMenu>\n    </div>\n  );\n};\n"]}

package/lib/esm/components/Groups/GroupMenuActions.scss

@@ -6,6 +6,8 @@
 .gmw-actions {
   display: flex;
   flex-direction: row;
+  align-self: center;
+  flex-shrink: 1;
   .gmw-action-dropdown {
     width: calc(var(--iui-size-3xl) + var(--iui-size-xl));
   }

package/lib/esm/components/Groups/GroupOverlapProgressBar.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
-import type { Group } from "@itwin/insights-client";
+import type { GroupMinimal } from "@itwin/insights-client";
 import type { OverlappedInfo } from "../context/GroupHilitedElementsContext";
 interface OverlapProgressProps {
-    group: Group;
+    group: GroupMinimal;
     groupElementsInfo: Map<string, number>;
     overlappedElementsInfo: Map<string, OverlappedInfo[]>;
 }

package/lib/esm/components/Groups/GroupOverlapProgressBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupOverlapProgressBar.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupOverlapProgressBar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,sBAAsB,EAAwB,EAAE,EAAE;IAC5G,MAAM,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;IACzB,MAAM,aAAa,GAAG,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,MAAM,cAAc,GAAG,sBAAsB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACjE,MAAM,kBAAkB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACnG,MAAM,iBAAiB,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,kBAAkB,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;IAEzF,OAAO,CACL,oBAAC,cAAc,IACb,KAAK,EAAE,GAAG,kBAAkB,WAAW,kBAAkB,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,uBAAuB,aAAa,GAAG,EACjH,KAAK,EAAE,iBAAiB,EACxB,UAAU,QACV,MAAM,EAAC,UAAU,GACjB,CACH,CAAC;AACJ,CAAC,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*--------------------------------------------------------------------------------------------*/\nimport type { Group } from \"@itwin/insights-client\";\nimport { ProgressLinear } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport type { OverlappedInfo } from \"../context/GroupHilitedElementsContext\";\n\ninterface OverlapProgressProps {\n  group: Group;\n  groupElementsInfo: Map<string, number>;\n  overlappedElementsInfo: Map<string, OverlappedInfo[]>;\n}\n\nexport const OverlapProgress = ({ group, groupElementsInfo, overlappedElementsInfo }: OverlapProgressProps) => {\n  const groupId = group.id;\n  const totalElements = groupElementsInfo.get(groupId) || 0;\n  const overlappedInfo = overlappedElementsInfo.get(groupId) || [];\n  const overlappedElements = overlappedInfo.reduce((count, info) => count + info.elements.length, 0);\n  const overlapPercentage = (totalElements ? overlappedElements / totalElements : 0) * 100;\n\n  return (\n    <ProgressLinear\n      title={`${overlappedElements} element${overlappedElements === 1 ? \"\" : \"s\"} overlapping out of ${totalElements} `}\n      value={overlapPercentage}\n      isAnimated\n      status=\"negative\"\n    />\n  );\n};\n"]}
+{"version":3,"file":"GroupOverlapProgressBar.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupOverlapProgressBar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,sBAAsB,EAAwB,EAAE,EAAE;IAC5G,MAAM,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;IACzB,MAAM,aAAa,GAAG,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,MAAM,cAAc,GAAG,sBAAsB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACjE,MAAM,kBAAkB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACnG,MAAM,iBAAiB,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,kBAAkB,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;IAEzF,OAAO,CACL,oBAAC,cAAc,IACb,KAAK,EAAE,GAAG,kBAAkB,WAAW,kBAAkB,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,uBAAuB,aAAa,GAAG,EACjH,KAAK,EAAE,iBAAiB,EACxB,UAAU,QACV,MAAM,EAAC,UAAU,GACjB,CACH,CAAC;AACJ,CAAC,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 *--------------------------------------------------------------------------------------------*/\nimport type { GroupMinimal } from \"@itwin/insights-client\";\nimport { ProgressLinear } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport type { OverlappedInfo } from \"../context/GroupHilitedElementsContext\";\n\ninterface OverlapProgressProps {\n  group: GroupMinimal;\n  groupElementsInfo: Map<string, number>;\n  overlappedElementsInfo: Map<string, OverlappedInfo[]>;\n}\n\nexport const OverlapProgress = ({ group, groupElementsInfo, overlappedElementsInfo }: OverlapProgressProps) => {\n  const groupId = group.id;\n  const totalElements = groupElementsInfo.get(groupId) || 0;\n  const overlappedInfo = overlappedElementsInfo.get(groupId) || [];\n  const overlappedElements = overlappedInfo.reduce((count, info) => count + info.elements.length, 0);\n  const overlapPercentage = (totalElements ? overlappedElements / totalElements : 0) * 100;\n\n  return (\n    <ProgressLinear\n      title={`${overlappedElements} element${overlappedElements === 1 ? \"\" : \"s\"} overlapping out of ${totalElements} `}\n      value={overlapPercentage}\n      isAnimated\n      status=\"negative\"\n    />\n  );\n};\n"]}

package/lib/esm/components/Groups/Groups.d.ts

@@ -1,19 +1,27 @@
 import React from "react";
-import type { Group, Mapping } from "@itwin/insights-client";
+import type { GroupMinimal, Mapping } from "@itwin/insights-client";
 import type { ContextCustomUI } from "../customUI/GroupingMappingCustomUI";
 import type { ActionButtonRenderer, ProgressConfig } from "./GroupsView";
 import { Alert } from "@itwin/itwinui-react";
+/**
+ * Props for the {@link Groups} component.
+ * @public
+ */
 export interface GroupsProps {
     mapping: Mapping;
     actionButtonRenderers?: ActionButtonRenderer[];
     onClickAddGroup?: (queryGenerationType: string) => void;
-    onClickGroupTitle?: (group: Group) => void;
-    onClickGroupModify?: (group: Group, queryGenerationType: string) => void;
-    onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI["uiComponent"], undefined>, group: Group, displayLabel: string) => void;
+    onClickGroupTitle?: (group: GroupMinimal) => void;
+    onClickGroupModify?: (group: GroupMinimal, queryGenerationType: string) => void;
+    onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI["uiComponent"], undefined>, group: GroupMinimal, displayLabel: string) => void;
     disableActions?: boolean;
     isVisualizing?: boolean;
     progressConfig?: ProgressConfig;
     alert?: React.ReactElement<typeof Alert>;
 }
+/**
+ * Component to list groups and handle basic operations.
+ * @public
+ */
 export declare const Groups: ({ mapping, actionButtonRenderers, onClickAddGroup, onClickGroupTitle, onClickGroupModify, onClickRenderContextCustomUI, disableActions, progressConfig, alert, }: GroupsProps) => JSX.Element;
 //# sourceMappingURL=Groups.d.ts.map

package/lib/esm/components/Groups/Groups.js

@@ -1,11 +1,15 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import React, { useCallback } from "react";
 import { GroupsView } from "./GroupsView";
 import { useGroupsOperations } from "./hooks/useGroupsOperations";
 import { Alert } from "@itwin/itwinui-react";
+/**
+ * Component to list groups and handle basic operations.
+ * @public
+ */
 export const Groups = ({ mapping, actionButtonRenderers, onClickAddGroup, onClickGroupTitle, onClickGroupModify, onClickRenderContextCustomUI, disableActions, progressConfig, alert, }) => {
     const { groups, isLoading, refresh, onDeleteGroup, setShowDeleteModal, showDeleteModal, groupUIs, contextUIs, errorMessage, setErrorMessage, activeOverlapInfoPanelGroup, setActiveOverlapInfoPanelGroup, overlappedElementsInfo, } = useGroupsOperations({ mappingId: mapping.id });
     const addGroup = useCallback((type) => {

package/lib/esm/components/Groups/Groups.js.map

@@ -1 +1 @@
-{"version":3,"file":"Groups.js","sourceRoot":"","sources":["../../../../src/components/Groups/Groups.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAM3C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAmB7C,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,OAAO,EACP,qBAAqB,EACrB,eAAe,EACf,iBAAiB,EACjB,kBAAkB,EAClB,4BAA4B,EAC5B,cAAc,EACd,cAAc,EACd,KAAK,GACO,EAAE,EAAE;IAChB,MAAM,EACJ,MAAM,EACN,SAAS,EACT,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,eAAe,EACf,QAAQ,EACR,UAAU,EACV,YAAY,EACZ,eAAe,EACf,2BAA2B,EAC3B,8BAA8B,EAC9B,sBAAsB,GACvB,GAAG,mBAAmB,CAAC,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;IAEnD,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,IAAY,EAAE,EAAE;QAC5C,IAAI,CAAC,eAAe;YAAE,OAAO;QAC7B,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,IAAI,CAAC,YAAY,EAAE;YACjB,OAAO,KAAK,CAAC;SACd;QACD,OAAO,CACL,oBAAC,KAAK,IAAC,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,SAAS,CAAC,IAC7D,YAAY,CACP,CACT,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;IAE3C,OAAO,CACL,oBAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,IAAI,EAAE,EACpB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,eAAe,EAAE,QAAQ,EACzB,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,EACtC,4BAA4B,EAAE,4BAA4B,EAC1D,cAAc,EAAE,cAAc,EAC9B,wBAAwB,EAAE,eAAe,EACzC,2BAA2B,EAAE,kBAAkB,EAC/C,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,SAAS,CAAC,EACvD,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,WAAW,EAAE,EACpB,8BAA8B,EAAE,8BAA8B,EAC9D,2BAA2B,EAAE,2BAA2B,EACxD,sBAAsB,EAAE,sBAAsB,GAC9C,CACH,CAAC;AACJ,CAAC,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*--------------------------------------------------------------------------------------------*/\nimport React, { useCallback } from \"react\";\nimport type { Group, Mapping } from \"@itwin/insights-client\";\nimport type {\n  ContextCustomUI,\n} from \"../customUI/GroupingMappingCustomUI\";\nimport type { ActionButtonRenderer, ProgressConfig } from \"./GroupsView\";\nimport { GroupsView } from \"./GroupsView\";\nimport { useGroupsOperations } from \"./hooks/useGroupsOperations\";\nimport { Alert } from \"@itwin/itwinui-react\";\n\nexport interface GroupsProps {\n  mapping: Mapping;\n  actionButtonRenderers?: ActionButtonRenderer[];\n  onClickAddGroup?: (queryGenerationType: string) => void;\n  onClickGroupTitle?: (group: Group) => void;\n  onClickGroupModify?: (group: Group, queryGenerationType: string) => void;\n  onClickRenderContextCustomUI?: (\n    contextCustomUI: Exclude<ContextCustomUI[\"uiComponent\"], undefined>,\n    group: Group,\n    displayLabel: string,\n  ) => void;\n  disableActions?: boolean;\n  isVisualizing?: boolean;\n  progressConfig?: ProgressConfig;\n  alert?: React.ReactElement<typeof Alert>;\n}\n\nexport const Groups = ({\n  mapping,\n  actionButtonRenderers,\n  onClickAddGroup,\n  onClickGroupTitle,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  disableActions,\n  progressConfig,\n  alert,\n}: GroupsProps) => {\n  const {\n    groups,\n    isLoading,\n    refresh,\n    onDeleteGroup,\n    setShowDeleteModal,\n    showDeleteModal,\n    groupUIs,\n    contextUIs,\n    errorMessage,\n    setErrorMessage,\n    activeOverlapInfoPanelGroup,\n    setActiveOverlapInfoPanelGroup,\n    overlappedElementsInfo,\n  } = useGroupsOperations({ mappingId: mapping.id });\n\n  const addGroup = useCallback((type: string) => {\n    if (!onClickAddGroup) return;\n    onClickAddGroup(type);\n  }, [onClickAddGroup]);\n\n  const renderAlert = useCallback(() => {\n    if (!errorMessage) {\n      return alert;\n    }\n    return (\n      <Alert type=\"negative\" onClose={() => setErrorMessage(undefined)}>\n        {errorMessage}\n      </Alert>\n    );\n  }, [alert, errorMessage, setErrorMessage]);\n\n  return (\n    <GroupsView\n      mapping={mapping}\n      groups={groups ?? []}\n      isLoading={isLoading}\n      onRefresh={refresh}\n      groupUIs={groupUIs}\n      actionButtonRenderers={actionButtonRenderers}\n      onClickAddGroup={addGroup}\n      onClickGroupTitle={onClickGroupTitle}\n      onClickGroupModify={onClickGroupModify}\n      onClickRenderContextCustomUI={onClickRenderContextCustomUI}\n      disableActions={disableActions}\n      selectedGroupForDeletion={showDeleteModal}\n      setSelectedGroupForDeletion={setShowDeleteModal}\n      onDeleteGroup={onDeleteGroup}\n      onCloseDeleteModal={() => setShowDeleteModal(undefined)}\n      contextUIs={contextUIs}\n      progressConfig={progressConfig}\n      alert={renderAlert()}\n      setActiveOverlapInfoPanelGroup={setActiveOverlapInfoPanelGroup}\n      activeOverlapInfoPanelGroup={activeOverlapInfoPanelGroup}\n      overlappedElementsInfo={overlappedElementsInfo}\n    />\n  );\n};\n"]}
+{"version":3,"file":"Groups.js","sourceRoot":"","sources":["../../../../src/components/Groups/Groups.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAI3C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAmB7C;;;GAGG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,OAAO,EACP,qBAAqB,EACrB,eAAe,EACf,iBAAiB,EACjB,kBAAkB,EAClB,4BAA4B,EAC5B,cAAc,EACd,cAAc,EACd,KAAK,GACO,EAAE,EAAE;IAChB,MAAM,EACJ,MAAM,EACN,SAAS,EACT,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,eAAe,EACf,QAAQ,EACR,UAAU,EACV,YAAY,EACZ,eAAe,EACf,2BAA2B,EAC3B,8BAA8B,EAC9B,sBAAsB,GACvB,GAAG,mBAAmB,CAAC,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;IAEnD,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,IAAY,EAAE,EAAE;QACf,IAAI,CAAC,eAAe;YAAE,OAAO;QAC7B,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,IAAI,CAAC,YAAY,EAAE;YACjB,OAAO,KAAK,CAAC;SACd;QACD,OAAO,CACL,oBAAC,KAAK,IAAC,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,SAAS,CAAC,IAC7D,YAAY,CACP,CACT,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;IAE3C,OAAO,CACL,oBAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,IAAI,EAAE,EACpB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,eAAe,EAAE,QAAQ,EACzB,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,EACtC,4BAA4B,EAAE,4BAA4B,EAC1D,cAAc,EAAE,cAAc,EAC9B,wBAAwB,EAAE,eAAe,EACzC,2BAA2B,EAAE,kBAAkB,EAC/C,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,SAAS,CAAC,EACvD,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,WAAW,EAAE,EACpB,8BAA8B,EAAE,8BAA8B,EAC9D,2BAA2B,EAAE,2BAA2B,EACxD,sBAAsB,EAAE,sBAAsB,GAC9C,CACH,CAAC;AACJ,CAAC,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 *--------------------------------------------------------------------------------------------*/\nimport React, { useCallback } from \"react\";\nimport type { GroupMinimal, Mapping } from \"@itwin/insights-client\";\nimport type { ContextCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport type { ActionButtonRenderer, ProgressConfig } from \"./GroupsView\";\nimport { GroupsView } from \"./GroupsView\";\nimport { useGroupsOperations } from \"./hooks/useGroupsOperations\";\nimport { Alert } from \"@itwin/itwinui-react\";\n\n/**\n * Props for the {@link Groups} component.\n * @public\n */\nexport interface GroupsProps {\n  mapping: Mapping;\n  actionButtonRenderers?: ActionButtonRenderer[];\n  onClickAddGroup?: (queryGenerationType: string) => void;\n  onClickGroupTitle?: (group: GroupMinimal) => void;\n  onClickGroupModify?: (group: GroupMinimal, queryGenerationType: string) => void;\n  onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI[\"uiComponent\"], undefined>, group: GroupMinimal, displayLabel: string) => void;\n  disableActions?: boolean;\n  isVisualizing?: boolean;\n  progressConfig?: ProgressConfig;\n  alert?: React.ReactElement<typeof Alert>;\n}\n\n/**\n * Component to list groups and handle basic operations.\n * @public\n */\nexport const Groups = ({\n  mapping,\n  actionButtonRenderers,\n  onClickAddGroup,\n  onClickGroupTitle,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  disableActions,\n  progressConfig,\n  alert,\n}: GroupsProps) => {\n  const {\n    groups,\n    isLoading,\n    refresh,\n    onDeleteGroup,\n    setShowDeleteModal,\n    showDeleteModal,\n    groupUIs,\n    contextUIs,\n    errorMessage,\n    setErrorMessage,\n    activeOverlapInfoPanelGroup,\n    setActiveOverlapInfoPanelGroup,\n    overlappedElementsInfo,\n  } = useGroupsOperations({ mappingId: mapping.id });\n\n  const addGroup = useCallback(\n    (type: string) => {\n      if (!onClickAddGroup) return;\n      onClickAddGroup(type);\n    },\n    [onClickAddGroup],\n  );\n\n  const renderAlert = useCallback(() => {\n    if (!errorMessage) {\n      return alert;\n    }\n    return (\n      <Alert type=\"negative\" onClose={() => setErrorMessage(undefined)}>\n        {errorMessage}\n      </Alert>\n    );\n  }, [alert, errorMessage, setErrorMessage]);\n\n  return (\n    <GroupsView\n      mapping={mapping}\n      groups={groups ?? []}\n      isLoading={isLoading}\n      onRefresh={refresh}\n      groupUIs={groupUIs}\n      actionButtonRenderers={actionButtonRenderers}\n      onClickAddGroup={addGroup}\n      onClickGroupTitle={onClickGroupTitle}\n      onClickGroupModify={onClickGroupModify}\n      onClickRenderContextCustomUI={onClickRenderContextCustomUI}\n      disableActions={disableActions}\n      selectedGroupForDeletion={showDeleteModal}\n      setSelectedGroupForDeletion={setShowDeleteModal}\n      onDeleteGroup={onDeleteGroup}\n      onCloseDeleteModal={() => setShowDeleteModal(undefined)}\n      contextUIs={contextUIs}\n      progressConfig={progressConfig}\n      alert={renderAlert()}\n      setActiveOverlapInfoPanelGroup={setActiveOverlapInfoPanelGroup}\n      activeOverlapInfoPanelGroup={activeOverlapInfoPanelGroup}\n      overlappedElementsInfo={overlappedElementsInfo}\n    />\n  );\n};\n"]}

package/lib/esm/components/Groups/GroupsAddButton.d.ts

@@ -6,5 +6,5 @@ export interface GroupsDropdownMenuProps {
     groupUIs: GroupingCustomUI[];
     onClickAddGroup: (type: string) => void;
 }
-export declare const GroupsAddButton: ({ disabled, groupUIs, onClickAddGroup, }: GroupsDropdownMenuProps) => JSX.Element;
+export declare const GroupsAddButton: ({ disabled, groupUIs, onClickAddGroup }: GroupsDropdownMenuProps) => JSX.Element;
 //# sourceMappingURL=GroupsAddButton.d.ts.map

package/lib/esm/components/Groups/GroupsAddButton.js

@@ -1,12 +1,12 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import { Button, DropdownMenu, MenuItem, Text } from "@itwin/itwinui-react";
 import React from "react";
 import "./GroupsAddButton.scss";
 import { SvgCaretDownSmall } from "@itwin/itwinui-icons-react";
-export const GroupsAddButton = ({ disabled, groupUIs, onClickAddGroup, }) => (React.createElement(DropdownMenu, { className: "gmw-custom-ui-dropdown", disabled: disabled, menuItems: () => groupUIs.map((p, index) => (React.createElement(MenuItem, { key: index, onClick: () => onClickAddGroup(p.name), icon: p.icon, "data-testid": `gmw-add-${index}` }, p.displayLabel))) },
+export const GroupsAddButton = ({ disabled, groupUIs, onClickAddGroup }) => (React.createElement(DropdownMenu, { className: "gmw-custom-ui-dropdown", disabled: disabled, menuItems: () => groupUIs.map((p, index) => (React.createElement(MenuItem, { key: index, onClick: () => onClickAddGroup(p.name), icon: p.icon, "data-testid": `gmw-add-${index}` }, p.displayLabel))) },
     React.createElement(Button, { "data-testid": "gmw-add-group-button", styleType: "high-visibility", disabled: disabled, endIcon: React.createElement(SvgCaretDownSmall, null) },
         React.createElement(Text, null, "Add Group"))));
 //# sourceMappingURL=GroupsAddButton.js.map

package/lib/esm/components/Groups/GroupsAddButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupsAddButton.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsAddButton.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAQ/D,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAC9B,QAAQ,EACR,QAAQ,EACR,eAAe,GACS,EAAE,EAAE,CAAC,CAC7B,oBAAC,YAAY,IACX,SAAS,EAAC,wBAAwB,EAClC,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,GAAG,EAAE,CACd,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACzB,oBAAC,QAAQ,IACP,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,EACtC,IAAI,EAAE,CAAC,CAAC,IAAI,iBACC,WAAW,KAAK,EAAE,IAE9B,CAAC,CAAC,YAAY,CACN,CACZ,CAAC;IAGJ,oBAAC,MAAM,mBACO,sBAAsB,EAClC,SAAS,EAAC,iBAAiB,EAC3B,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,oBAAC,iBAAiB,OAAG;QAE9B,oBAAC,IAAI,oBAAiB,CACf,CACI,CAChB,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*--------------------------------------------------------------------------------------------*/\nimport { Button, DropdownMenu, MenuItem, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport type { GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport \"./GroupsAddButton.scss\";\nimport { SvgCaretDownSmall } from \"@itwin/itwinui-icons-react\";\n\nexport interface GroupsDropdownMenuProps {\n  disabled?: boolean;\n  groupUIs: GroupingCustomUI[];\n  onClickAddGroup: (type: string) => void;\n}\n\nexport const GroupsAddButton = ({\n  disabled,\n  groupUIs,\n  onClickAddGroup,\n}: GroupsDropdownMenuProps) => (\n  <DropdownMenu\n    className=\"gmw-custom-ui-dropdown\"\n    disabled={disabled}\n    menuItems={() =>\n      groupUIs.map((p, index) => (\n        <MenuItem\n          key={index}\n          onClick={() => onClickAddGroup(p.name)}\n          icon={p.icon}\n          data-testid={`gmw-add-${index}`}\n        >\n          {p.displayLabel}\n        </MenuItem>\n      ))\n    }\n  >\n    <Button\n      data-testid=\"gmw-add-group-button\"\n      styleType=\"high-visibility\"\n      disabled={disabled}\n      endIcon={<SvgCaretDownSmall />}\n    >\n      <Text>Add Group</Text>\n    </Button>\n  </DropdownMenu>\n);\n"]}
+{"version":3,"file":"GroupsAddButton.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsAddButton.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAQ/D,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,eAAe,EAA2B,EAAE,EAAE,CAAC,CACnG,oBAAC,YAAY,IACX,SAAS,EAAC,wBAAwB,EAClC,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,GAAG,EAAE,CACd,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACzB,oBAAC,QAAQ,IAAC,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,iBAAe,WAAW,KAAK,EAAE,IACxG,CAAC,CAAC,YAAY,CACN,CACZ,CAAC;IAGJ,oBAAC,MAAM,mBAAa,sBAAsB,EAAC,SAAS,EAAC,iBAAiB,EAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,oBAAC,iBAAiB,OAAG;QACvH,oBAAC,IAAI,oBAAiB,CACf,CACI,CAChB,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 *--------------------------------------------------------------------------------------------*/\nimport { Button, DropdownMenu, MenuItem, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport type { GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport \"./GroupsAddButton.scss\";\nimport { SvgCaretDownSmall } from \"@itwin/itwinui-icons-react\";\n\nexport interface GroupsDropdownMenuProps {\n  disabled?: boolean;\n  groupUIs: GroupingCustomUI[];\n  onClickAddGroup: (type: string) => void;\n}\n\nexport const GroupsAddButton = ({ disabled, groupUIs, onClickAddGroup }: GroupsDropdownMenuProps) => (\n  <DropdownMenu\n    className=\"gmw-custom-ui-dropdown\"\n    disabled={disabled}\n    menuItems={() =>\n      groupUIs.map((p, index) => (\n        <MenuItem key={index} onClick={() => onClickAddGroup(p.name)} icon={p.icon} data-testid={`gmw-add-${index}`}>\n          {p.displayLabel}\n        </MenuItem>\n      ))\n    }\n  >\n    <Button data-testid=\"gmw-add-group-button\" styleType=\"high-visibility\" disabled={disabled} endIcon={<SvgCaretDownSmall />}>\n      <Text>Add Group</Text>\n    </Button>\n  </DropdownMenu>\n);\n"]}

package/lib/esm/components/Groups/GroupsAddButton.scss

@@ -5,4 +5,4 @@
 
 .gmw-custom-ui-dropdown {
   width: calc(var(--iui-size-3xl) + var(--iui-size-2xl));
-}
+}

package/lib/esm/components/Groups/GroupsShowHideButtons.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { Group } from "@itwin/insights-client";
+import type { GroupMinimal } from "@itwin/insights-client";
 interface GroupsShowHideButtonsProps {
-    group: Group;
+    group: GroupMinimal;
     isLoadingQuery: boolean;
-    showGroup: (group: Group) => void;
-    hideGroup: (group: Group) => void;
+    showGroup: (group: GroupMinimal) => void;
+    hideGroup: (group: GroupMinimal) => void;
 }
-export declare const GroupsShowHideButtons: ({ group, isLoadingQuery, showGroup, hideGroup, }: GroupsShowHideButtonsProps) => JSX.Element;
+export declare const GroupsShowHideButtons: ({ group, isLoadingQuery, showGroup, hideGroup }: GroupsShowHideButtonsProps) => JSX.Element;
 export {};
 //# sourceMappingURL=GroupsShowHideButtons.d.ts.map

package/lib/esm/components/Groups/GroupsShowHideButtons.js

@@ -2,7 +2,7 @@ import { SvgVisibilityHide, SvgVisibilityShow } from "@itwin/itwinui-icons-react
 import { IconButton } from "@itwin/itwinui-react";
 import React, { useCallback, useMemo } from "react";
 import { useGroupHilitedElementsContext } from "../context/GroupHilitedElementsContext";
-export const GroupsShowHideButtons = ({ group, isLoadingQuery, showGroup, hideGroup, }) => {
+export const GroupsShowHideButtons = ({ group, isLoadingQuery, showGroup, hideGroup }) => {
     const { hiddenGroupsIds, setHiddenGroupsIds } = useGroupHilitedElementsContext();
     const isGroupHidden = useMemo(() => group.id && hiddenGroupsIds.has(group.id), [group.id, hiddenGroupsIds]);
     const toggleGroupVisibility = useCallback(() => {
@@ -17,6 +17,6 @@ export const GroupsShowHideButtons = ({ group, isLoadingQuery, showGroup, hideGr
             }
         }
     }, [group, hiddenGroupsIds, hideGroup, isGroupHidden, setHiddenGroupsIds, showGroup]);
-    return (React.createElement(IconButton, { disabled: isLoadingQuery, styleType: "borderless", onClick: toggleGroupVisibility, title: 'Toggle Group Visibility' }, isGroupHidden ? React.createElement(SvgVisibilityHide, null) : React.createElement(SvgVisibilityShow, null)));
+    return (React.createElement(IconButton, { disabled: isLoadingQuery, styleType: "borderless", onClick: toggleGroupVisibility, title: "Toggle Group Visibility" }, isGroupHidden ? React.createElement(SvgVisibilityHide, null) : React.createElement(SvgVisibilityShow, null)));
 };
 //# sourceMappingURL=GroupsShowHideButtons.js.map

package/lib/esm/components/Groups/GroupsShowHideButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupsShowHideButtons.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsShowHideButtons.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAClF,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAC;AASxF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EACpC,KAAK,EACL,cAAc,EACd,SAAS,EACT,SAAS,GACkB,EAAE,EAAE;IAC/B,MAAM,EAAE,eAAe,EAAE,kBAAkB,EAAE,GAAG,8BAA8B,EAAE,CAAC;IACjF,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,EAAE,eAAe,CAAC,CAAC,CAAC;IAE5G,MAAM,qBAAqB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7C,IAAI,aAAa,EAAE;YACjB,SAAS,CAAC,KAAK,CAAC,CAAC;YACjB,kBAAkB,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SACnF;aAAM;YACL,SAAS,CAAC,KAAK,CAAC,CAAC;YACjB,IAAI,KAAK,CAAC,EAAE,EAAE;gBACZ,kBAAkB,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;aAC7D;SACF;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,kBAAkB,EAAE,SAAS,CAAC,CAAC,CAAC;IAEtF,OAAO,CACL,oBAAC,UAAU,IACT,QAAQ,EAAE,cAAc,EACxB,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,qBAAqB,EAC9B,KAAK,EAAC,yBAAyB,IAE9B,aAAa,CAAC,CAAC,CAAC,oBAAC,iBAAiB,OAAG,CAAC,CAAC,CAAC,oBAAC,iBAAiB,OAAG,CACnD,CACd,CAAC;AACJ,CAAC,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*--------------------------------------------------------------------------------------------*/\nimport type { Group } from \"@itwin/insights-client\";\nimport { SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useMemo } from \"react\";\nimport { useGroupHilitedElementsContext } from \"../context/GroupHilitedElementsContext\";\n\ninterface GroupsShowHideButtonsProps {\n  group: Group;\n  isLoadingQuery: boolean;\n  showGroup: (group: Group) => void;\n  hideGroup: (group: Group) => void;\n}\n\nexport const GroupsShowHideButtons = ({\n  group,\n  isLoadingQuery,\n  showGroup,\n  hideGroup,\n}: GroupsShowHideButtonsProps) => {\n  const { hiddenGroupsIds, setHiddenGroupsIds } = useGroupHilitedElementsContext();\n  const isGroupHidden = useMemo(() => group.id && hiddenGroupsIds.has(group.id), [group.id, hiddenGroupsIds]);\n\n  const toggleGroupVisibility = useCallback(() => {\n    if (isGroupHidden) {\n      showGroup(group);\n      setHiddenGroupsIds(new Set([...hiddenGroupsIds].filter((id) => group.id !== id)));\n    } else {\n      hideGroup(group);\n      if (group.id) {\n        setHiddenGroupsIds(new Set([...hiddenGroupsIds, group.id]));\n      }\n    }\n  }, [group, hiddenGroupsIds, hideGroup, isGroupHidden, setHiddenGroupsIds, showGroup]);\n\n  return (\n    <IconButton\n      disabled={isLoadingQuery}\n      styleType=\"borderless\"\n      onClick={toggleGroupVisibility}\n      title='Toggle Group Visibility'\n    >\n      {isGroupHidden ? <SvgVisibilityHide /> : <SvgVisibilityShow />}\n    </IconButton>\n  );\n};\n"]}
+{"version":3,"file":"GroupsShowHideButtons.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsShowHideButtons.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAClF,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAC;AASxF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAA8B,EAAE,EAAE;IACnH,MAAM,EAAE,eAAe,EAAE,kBAAkB,EAAE,GAAG,8BAA8B,EAAE,CAAC;IACjF,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,EAAE,eAAe,CAAC,CAAC,CAAC;IAE5G,MAAM,qBAAqB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7C,IAAI,aAAa,EAAE;YACjB,SAAS,CAAC,KAAK,CAAC,CAAC;YACjB,kBAAkB,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SACnF;aAAM;YACL,SAAS,CAAC,KAAK,CAAC,CAAC;YACjB,IAAI,KAAK,CAAC,EAAE,EAAE;gBACZ,kBAAkB,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;aAC7D;SACF;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,kBAAkB,EAAE,SAAS,CAAC,CAAC,CAAC;IAEtF,OAAO,CACL,oBAAC,UAAU,IAAC,QAAQ,EAAE,cAAc,EAAE,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,qBAAqB,EAAE,KAAK,EAAC,yBAAyB,IACzH,aAAa,CAAC,CAAC,CAAC,oBAAC,iBAAiB,OAAG,CAAC,CAAC,CAAC,oBAAC,iBAAiB,OAAG,CACnD,CACd,CAAC;AACJ,CAAC,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 *--------------------------------------------------------------------------------------------*/\nimport type { GroupMinimal } from \"@itwin/insights-client\";\nimport { SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useMemo } from \"react\";\nimport { useGroupHilitedElementsContext } from \"../context/GroupHilitedElementsContext\";\n\ninterface GroupsShowHideButtonsProps {\n  group: GroupMinimal;\n  isLoadingQuery: boolean;\n  showGroup: (group: GroupMinimal) => void;\n  hideGroup: (group: GroupMinimal) => void;\n}\n\nexport const GroupsShowHideButtons = ({ group, isLoadingQuery, showGroup, hideGroup }: GroupsShowHideButtonsProps) => {\n  const { hiddenGroupsIds, setHiddenGroupsIds } = useGroupHilitedElementsContext();\n  const isGroupHidden = useMemo(() => group.id && hiddenGroupsIds.has(group.id), [group.id, hiddenGroupsIds]);\n\n  const toggleGroupVisibility = useCallback(() => {\n    if (isGroupHidden) {\n      showGroup(group);\n      setHiddenGroupsIds(new Set([...hiddenGroupsIds].filter((id) => group.id !== id)));\n    } else {\n      hideGroup(group);\n      if (group.id) {\n        setHiddenGroupsIds(new Set([...hiddenGroupsIds, group.id]));\n      }\n    }\n  }, [group, hiddenGroupsIds, hideGroup, isGroupHidden, setHiddenGroupsIds, showGroup]);\n\n  return (\n    <IconButton disabled={isLoadingQuery} styleType=\"borderless\" onClick={toggleGroupVisibility} title=\"Toggle Group Visibility\">\n      {isGroupHidden ? <SvgVisibilityHide /> : <SvgVisibilityShow />}\n    </IconButton>\n  );\n};\n"]}

package/lib/esm/components/Groups/GroupsView.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
 import type { Alert } from "@itwin/itwinui-react";
 import "./GroupsView.scss";
-import type { Group, Mapping } from "@itwin/insights-client";
+import type { GroupMinimal, Mapping } from "@itwin/insights-client";
 import type { ContextCustomUI, GroupingCustomUI } from "../customUI/GroupingMappingCustomUI";
 import type { OverlappedInfo } from "../context/GroupHilitedElementsContext";
 export interface ActionButtonRendererProps {
-    group: Group;
+    group: GroupMinimal;
 }
 export declare type ActionButtonRenderer = (props: ActionButtonRendererProps) => React.ReactNode;
 export interface ProgressConfig {
@@ -16,28 +16,36 @@ export interface ProgressConfig {
     baseProgress?: number;
     maxDynamicProgress?: number;
 }
+/**
+ * Props for the {@link GroupsView} component.
+ * @internal
+ */
 export interface GroupsViewProps {
     mapping: Mapping;
-    groups: Group[];
+    groups: GroupMinimal[];
     isLoading: boolean;
     onRefresh: () => Promise<void>;
     groupUIs: GroupingCustomUI[];
     actionButtonRenderers?: ActionButtonRenderer[];
     contextUIs: ContextCustomUI[];
     onClickAddGroup?: (queryGenerationType: string) => void;
-    onClickGroupTitle?: (group: Group) => void;
-    onClickGroupModify?: (group: Group, queryGenerationType: string) => void;
-    onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI["uiComponent"], undefined>, group: Group, displayLabel: string) => void;
+    onClickGroupTitle?: (group: GroupMinimal) => void;
+    onClickGroupModify?: (group: GroupMinimal, queryGenerationType: string) => void;
+    onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI["uiComponent"], undefined>, group: GroupMinimal, displayLabel: string) => void;
     disableActions?: boolean;
-    selectedGroupForDeletion?: Group;
-    setSelectedGroupForDeletion: (group: Group) => void;
-    onDeleteGroup: (group: Group) => Promise<void>;
+    selectedGroupForDeletion?: GroupMinimal;
+    setSelectedGroupForDeletion: (group: GroupMinimal) => void;
+    onDeleteGroup: (group: GroupMinimal) => Promise<void>;
     onCloseDeleteModal: () => void;
     alert?: React.ReactElement<typeof Alert>;
-    setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: Group | undefined) => void;
-    activeOverlapInfoPanelGroup?: Group | undefined;
+    setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: GroupMinimal | undefined) => void;
+    activeOverlapInfoPanelGroup?: GroupMinimal | undefined;
     overlappedElementsInfo?: Map<string, OverlappedInfo[]>;
     progressConfig?: ProgressConfig;
 }
+/**
+ * Component to list groups.
+ * @internal
+ */
 export declare const GroupsView: ({ mapping, groups, isLoading, onRefresh, groupUIs, actionButtonRenderers, onClickAddGroup, onClickGroupTitle, onClickGroupModify, onClickRenderContextCustomUI, disableActions, selectedGroupForDeletion, onDeleteGroup, onCloseDeleteModal, setSelectedGroupForDeletion, contextUIs, alert, setActiveOverlapInfoPanelGroup, activeOverlapInfoPanelGroup, overlappedElementsInfo, progressConfig, }: GroupsViewProps) => JSX.Element;
 //# sourceMappingURL=GroupsView.d.ts.map

package/lib/esm/components/Groups/GroupsView.js

@@ -1,10 +1,10 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import React from "react";
-import { ButtonGroup, IconButton, InformationPanelWrapper, List, ProgressLinear, } from "@itwin/itwinui-react";
-import { SvgRefresh, } from "@itwin/itwinui-icons-react";
+import { ButtonGroup, IconButton, InformationPanelWrapper, List, ProgressLinear } from "@itwin/itwinui-react";
+import { SvgRefresh } from "@itwin/itwinui-icons-react";
 import DeleteModal from "../SharedComponents/DeleteModal";
 import "./GroupsView.scss";
 import { EmptyMessage } from "../SharedComponents/EmptyMessage";
@@ -12,6 +12,10 @@ import { LoadingOverlay } from "../SharedComponents/LoadingOverlay";
 import { GroupListItem } from "./GroupListItem";
 import { GroupsAddButton } from "./GroupsAddButton";
 import { OverlappedElementsInformationPanel } from "./OverlappedElementsInformationPanel";
+/**
+ * Component to list groups.
+ * @internal
+ */
 export const GroupsView = ({ mapping, groups, isLoading, onRefresh, groupUIs, actionButtonRenderers, onClickAddGroup, onClickGroupTitle, onClickGroupModify, onClickRenderContextCustomUI, disableActions, selectedGroupForDeletion, onDeleteGroup, onCloseDeleteModal, setSelectedGroupForDeletion, contextUIs, alert, setActiveOverlapInfoPanelGroup, activeOverlapInfoPanelGroup, overlappedElementsInfo, progressConfig, }) => {
     /**
      * UX Progress Bar Logic:
@@ -23,18 +27,16 @@ export const GroupsView = ({ mapping, groups, isLoading, onRefresh, groupUIs, ac
     const { baseProgress = 25, maxDynamicProgress = 65, hilitedGroupsProgress } = progressConfig || {};
     return (React.createElement(InformationPanelWrapper, { className: "gmw-groups-container" },
         React.createElement("div", { className: "gmw-toolbar" },
-            onClickAddGroup && groupUIs.length > 0 && (React.createElement(GroupsAddButton, { disabled: disableActions, groupUIs: groupUIs, onClickAddGroup: onClickAddGroup })),
+            onClickAddGroup && groupUIs.length > 0 && React.createElement(GroupsAddButton, { disabled: disableActions, groupUIs: groupUIs, onClickAddGroup: onClickAddGroup }),
             React.createElement(ButtonGroup, { className: "gmw-toolbar-buttons" },
                 React.createElement(IconButton, { title: "Refresh", onClick: onRefresh, disabled: isLoading || disableActions, styleType: "borderless" },
                     React.createElement(SvgRefresh, null)))),
         alert,
-        React.createElement("div", { className: 'gmw-groups-border' }),
-        !!hilitedGroupsProgress &&
-            React.createElement("div", { className: "gmw-group-progress-bar" },
-                React.createElement(ProgressLinear, { value: baseProgress + (hilitedGroupsProgress.currentHilitedGroups / hilitedGroupsProgress.totalNumberOfGroups * maxDynamicProgress) })),
+        React.createElement("div", { className: "gmw-groups-border" }),
+        !!hilitedGroupsProgress && (React.createElement("div", { className: "gmw-group-progress-bar" },
+            React.createElement(ProgressLinear, { value: baseProgress + (hilitedGroupsProgress.currentHilitedGroups / hilitedGroupsProgress.totalNumberOfGroups) * maxDynamicProgress }))),
         isLoading ? (React.createElement(LoadingOverlay, null)) : groups.length === 0 ? (React.createElement(EmptyMessage, { message: "No Groups available." })) : (React.createElement(List, { className: "gmw-group-list" }, groups.map((group) => (React.createElement(GroupListItem, { key: group.id, mapping: mapping, group: group, groupUIs: groupUIs, actionButtonRenderers: actionButtonRenderers, onClickGroupTitle: onClickGroupTitle, onClickGroupModify: onClickGroupModify, onClickRenderContextCustomUI: onClickRenderContextCustomUI, disableActions: disableActions, setShowDeleteModal: setSelectedGroupForDeletion, contextUIs: contextUIs, setActiveOverlapInfoPanelGroup: setActiveOverlapInfoPanelGroup }))))),
-        overlappedElementsInfo && setActiveOverlapInfoPanelGroup &&
-            React.createElement(OverlappedElementsInformationPanel, { group: activeOverlapInfoPanelGroup, onClose: () => setActiveOverlapInfoPanelGroup(undefined), overlappedElementsInfo: overlappedElementsInfo, groups: groups }),
+        overlappedElementsInfo && setActiveOverlapInfoPanelGroup && (React.createElement(OverlappedElementsInformationPanel, { group: activeOverlapInfoPanelGroup, onClose: () => setActiveOverlapInfoPanelGroup(undefined), overlappedElementsInfo: overlappedElementsInfo, groups: groups })),
         selectedGroupForDeletion && (React.createElement(DeleteModal, { entityName: selectedGroupForDeletion.groupName, onClose: onCloseDeleteModal, onDelete: async () => {
                 await onDeleteGroup(selectedGroupForDeletion);
             } }))));

package/lib/esm/components/Groups/GroupsView.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupsView.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsView.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EACL,WAAW,EACX,UAAU,EACV,uBAAuB,EACvB,IAAI,EACJ,cAAc,GACf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,UAAU,GACX,MAAM,4BAA4B,CAAC;AACpC,OAAO,WAAW,MAAM,iCAAiC,CAAC;AAC1D,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEpE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,kCAAkC,EAAE,MAAM,sCAAsC,CAAC;AAgD1F,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAS,EACT,QAAQ,EACR,qBAAqB,EACrB,eAAe,EACf,iBAAiB,EACjB,kBAAkB,EAClB,4BAA4B,EAC5B,cAAc,EACd,wBAAwB,EACxB,aAAa,EACb,kBAAkB,EAClB,2BAA2B,EAC3B,UAAU,EACV,KAAK,EACL,8BAA8B,EAC9B,2BAA2B,EAC3B,sBAAsB,EACtB,cAAc,GACE,EAAE,EAAE;IACpB;;;;;;OAMG;IACH,MAAM,EAAE,YAAY,GAAG,EAAE,EAAE,kBAAkB,GAAG,EAAE,EAAE,qBAAqB,EAAE,GAAG,cAAc,IAAI,EAAE,CAAC;IAEnG,OAAO,CACL,oBAAC,uBAAuB,IAAC,SAAS,EAAC,sBAAsB;QACvD,6BAAK,SAAS,EAAC,aAAa;YACzB,eAAe,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACzC,oBAAC,eAAe,IACd,QAAQ,EAAE,cAAc,EACxB,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,GAChC,CACH;YACD,oBAAC,WAAW,IAAC,SAAS,EAAC,qBAAqB;gBAC1C,oBAAC,UAAU,IACT,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,SAAS,IAAI,cAAc,EACrC,SAAS,EAAC,YAAY;oBAEtB,oBAAC,UAAU,OAAG,CACH,CACD,CACV;QACL,KAAK;QACN,6BAAK,SAAS,EAAC,mBAAmB,GAAG;QACpC,CAAC,CAAC,qBAAqB;YACtB,6BAAK,SAAS,EAAC,wBAAwB;gBACrC,oBAAC,cAAc,IACb,KAAK,EAAE,YAAY,GAAG,CAAC,qBAAqB,CAAC,oBAAoB,GAAG,qBAAqB,CAAC,mBAAmB,GAAG,kBAAkB,CAAC,GACnI,CACE;QACP,SAAS,CAAC,CAAC,CAAC,CACX,oBAAC,cAAc,OAAG,CACnB,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CACxB,oBAAC,YAAY,IAAC,OAAO,EAAC,sBAAsB,GAAG,CAChD,CAAC,CAAC,CAAC,CACF,oBAAC,IAAI,IAAC,SAAS,EAAC,gBAAgB,IAC7B,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,oBAAC,aAAa,IACZ,GAAG,EAAE,KAAK,CAAC,EAAE,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,EACtC,4BAA4B,EAAE,4BAA4B,EAC1D,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,2BAA2B,EAC/C,UAAU,EAAE,UAAU,EACtB,8BAA8B,EAAE,8BAA8B,GAC9D,CACH,CAAC,CACG,CACR;QACA,sBAAsB,IAAI,8BAA8B;YACvD,oBAAC,kCAAkC,IACjC,KAAK,EAAE,2BAA2B,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,8BAA8B,CAAC,SAAS,CAAC,EACxD,sBAAsB,EAAE,sBAAsB,EAC9C,MAAM,EAAE,MAAM,GACd;QACH,wBAAwB,IAAI,CAC3B,oBAAC,WAAW,IACV,UAAU,EAAE,wBAAwB,CAAC,SAAS,EAC9C,OAAO,EAAE,kBAAkB,EAC3B,QAAQ,EAAE,KAAK,IAAI,EAAE;gBACnB,MAAM,aAAa,CAAC,wBAAwB,CAAC,CAAC;YAChD,CAAC,GACD,CACH,CACuB,CAC3B,CAAC;AACJ,CAAC,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*--------------------------------------------------------------------------------------------*/\nimport React from \"react\";\nimport type {\n  Alert,\n} from \"@itwin/itwinui-react\";\nimport {\n  ButtonGroup,\n  IconButton,\n  InformationPanelWrapper,\n  List,\n  ProgressLinear,\n} from \"@itwin/itwinui-react\";\nimport {\n  SvgRefresh,\n} from \"@itwin/itwinui-icons-react\";\nimport DeleteModal from \"../SharedComponents/DeleteModal\";\nimport \"./GroupsView.scss\";\nimport { EmptyMessage } from \"../SharedComponents/EmptyMessage\";\nimport { LoadingOverlay } from \"../SharedComponents/LoadingOverlay\";\nimport type { Group, Mapping } from \"@itwin/insights-client\";\nimport { GroupListItem } from \"./GroupListItem\";\nimport type { ContextCustomUI, GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport { GroupsAddButton } from \"./GroupsAddButton\";\nimport { OverlappedElementsInformationPanel } from \"./OverlappedElementsInformationPanel\";\nimport type { OverlappedInfo } from \"../context/GroupHilitedElementsContext\";\n\nexport interface ActionButtonRendererProps {\n  group: Group;\n}\n\nexport type ActionButtonRenderer = (\n  props: ActionButtonRendererProps\n) => React.ReactNode;\n\nexport interface ProgressConfig {\n  hilitedGroupsProgress?: {\n    currentHilitedGroups: number;\n    totalNumberOfGroups: number;\n  };\n  baseProgress?: number;\n  maxDynamicProgress?: number;\n}\n\nexport interface GroupsViewProps {\n  mapping: Mapping;\n  groups: Group[];\n  isLoading: boolean;\n  onRefresh: () => Promise<void>;\n  groupUIs: GroupingCustomUI[];\n  actionButtonRenderers?: ActionButtonRenderer[];\n  contextUIs: ContextCustomUI[];\n  onClickAddGroup?: (queryGenerationType: string) => void;\n  onClickGroupTitle?: (group: Group) => void;\n  onClickGroupModify?: (group: Group, queryGenerationType: string) => void;\n  onClickRenderContextCustomUI?: (\n    contextCustomUI: Exclude<ContextCustomUI[\"uiComponent\"], undefined>,\n    group: Group,\n    displayLabel: string,\n  ) => void;\n  disableActions?: boolean;\n  selectedGroupForDeletion?: Group;\n  setSelectedGroupForDeletion: (group: Group) => void;\n  onDeleteGroup: (group: Group) => Promise<void>;\n  onCloseDeleteModal: () => void;\n  alert?: React.ReactElement<typeof Alert>;\n  setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: Group | undefined) => void;\n  activeOverlapInfoPanelGroup?: Group | undefined;\n  overlappedElementsInfo?: Map<string, OverlappedInfo[]>;\n  progressConfig?: ProgressConfig;\n}\n\nexport const GroupsView = ({\n  mapping,\n  groups,\n  isLoading,\n  onRefresh,\n  groupUIs,\n  actionButtonRenderers,\n  onClickAddGroup,\n  onClickGroupTitle,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  disableActions,\n  selectedGroupForDeletion,\n  onDeleteGroup,\n  onCloseDeleteModal,\n  setSelectedGroupForDeletion,\n  contextUIs,\n  alert,\n  setActiveOverlapInfoPanelGroup,\n  activeOverlapInfoPanelGroup,\n  overlappedElementsInfo,\n  progressConfig,\n}: GroupsViewProps) => {\n  /**\n   * UX Progress Bar Logic:\n   * - Start non-zero for immediate feedback.\n   * - Restrict motion to a range (e.g., 25-90%) for perceived continuity.\n   * - Disappear when compplete.\n   * Goal: Smooth experience for unpredictable durations.\n   */\n  const { baseProgress = 25, maxDynamicProgress = 65, hilitedGroupsProgress } = progressConfig || {};\n\n  return (\n    <InformationPanelWrapper className=\"gmw-groups-container\">\n      <div className=\"gmw-toolbar\">\n        {onClickAddGroup && groupUIs.length > 0 && (\n          <GroupsAddButton\n            disabled={disableActions}\n            groupUIs={groupUIs}\n            onClickAddGroup={onClickAddGroup}\n          />\n        )}\n        <ButtonGroup className=\"gmw-toolbar-buttons\">\n          <IconButton\n            title=\"Refresh\"\n            onClick={onRefresh}\n            disabled={isLoading || disableActions}\n            styleType=\"borderless\"\n          >\n            <SvgRefresh />\n          </IconButton>\n        </ButtonGroup>\n      </div>\n      {alert}\n      <div className='gmw-groups-border' />\n      {!!hilitedGroupsProgress &&\n        <div className=\"gmw-group-progress-bar\">\n          <ProgressLinear\n            value={baseProgress + (hilitedGroupsProgress.currentHilitedGroups / hilitedGroupsProgress.totalNumberOfGroups * maxDynamicProgress)}\n          />\n        </div>}\n      {isLoading ? (\n        <LoadingOverlay />\n      ) : groups.length === 0 ? (\n        <EmptyMessage message=\"No Groups available.\" />\n      ) : (\n        <List className=\"gmw-group-list\">\n          {groups.map((group) => (\n            <GroupListItem\n              key={group.id}\n              mapping={mapping}\n              group={group}\n              groupUIs={groupUIs}\n              actionButtonRenderers={actionButtonRenderers}\n              onClickGroupTitle={onClickGroupTitle}\n              onClickGroupModify={onClickGroupModify}\n              onClickRenderContextCustomUI={onClickRenderContextCustomUI}\n              disableActions={disableActions}\n              setShowDeleteModal={setSelectedGroupForDeletion}\n              contextUIs={contextUIs}\n              setActiveOverlapInfoPanelGroup={setActiveOverlapInfoPanelGroup}\n            />\n          ))}\n        </List>\n      )}\n      {overlappedElementsInfo && setActiveOverlapInfoPanelGroup &&\n        <OverlappedElementsInformationPanel\n          group={activeOverlapInfoPanelGroup}\n          onClose={() => setActiveOverlapInfoPanelGroup(undefined)}\n          overlappedElementsInfo={overlappedElementsInfo}\n          groups={groups}\n        />}\n      {selectedGroupForDeletion && (\n        <DeleteModal\n          entityName={selectedGroupForDeletion.groupName}\n          onClose={onCloseDeleteModal}\n          onDelete={async () => {\n            await onDeleteGroup(selectedGroupForDeletion);\n          }}\n        />\n      )}\n    </InformationPanelWrapper>\n  );\n};\n"]}
+{"version":3,"file":"GroupsView.js","sourceRoot":"","sources":["../../../../src/components/Groups/GroupsView.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 *--------------------------------------------------------------------------------------------*/\nimport React from \"react\";\nimport type { Alert } from \"@itwin/itwinui-react\";\nimport { ButtonGroup, IconButton, InformationPanelWrapper, List, ProgressLinear } from \"@itwin/itwinui-react\";\nimport { SvgRefresh } from \"@itwin/itwinui-icons-react\";\nimport DeleteModal from \"../SharedComponents/DeleteModal\";\nimport \"./GroupsView.scss\";\nimport { EmptyMessage } from \"../SharedComponents/EmptyMessage\";\nimport { LoadingOverlay } from \"../SharedComponents/LoadingOverlay\";\nimport type { GroupMinimal, Mapping } from \"@itwin/insights-client\";\nimport { GroupListItem } from \"./GroupListItem\";\nimport type { ContextCustomUI, GroupingCustomUI } from \"../customUI/GroupingMappingCustomUI\";\nimport { GroupsAddButton } from \"./GroupsAddButton\";\nimport { OverlappedElementsInformationPanel } from \"./OverlappedElementsInformationPanel\";\nimport type { OverlappedInfo } from \"../context/GroupHilitedElementsContext\";\n\nexport interface ActionButtonRendererProps {\n  group: GroupMinimal;\n}\n\nexport type ActionButtonRenderer = (props: ActionButtonRendererProps) => React.ReactNode;\n\nexport interface ProgressConfig {\n  hilitedGroupsProgress?: {\n    currentHilitedGroups: number;\n    totalNumberOfGroups: number;\n  };\n  baseProgress?: number;\n  maxDynamicProgress?: number;\n}\n\n/**\n * Props for the {@link GroupsView} component.\n * @internal\n */\nexport interface GroupsViewProps {\n  mapping: Mapping;\n  groups: GroupMinimal[];\n  isLoading: boolean;\n  onRefresh: () => Promise<void>;\n  groupUIs: GroupingCustomUI[];\n  actionButtonRenderers?: ActionButtonRenderer[];\n  contextUIs: ContextCustomUI[];\n  onClickAddGroup?: (queryGenerationType: string) => void;\n  onClickGroupTitle?: (group: GroupMinimal) => void;\n  onClickGroupModify?: (group: GroupMinimal, queryGenerationType: string) => void;\n  onClickRenderContextCustomUI?: (contextCustomUI: Exclude<ContextCustomUI[\"uiComponent\"], undefined>, group: GroupMinimal, displayLabel: string) => void;\n  disableActions?: boolean;\n  selectedGroupForDeletion?: GroupMinimal;\n  setSelectedGroupForDeletion: (group: GroupMinimal) => void;\n  onDeleteGroup: (group: GroupMinimal) => Promise<void>;\n  onCloseDeleteModal: () => void;\n  alert?: React.ReactElement<typeof Alert>;\n  setActiveOverlapInfoPanelGroup?: (activeOverlapInfoPanelGroup: GroupMinimal | undefined) => void;\n  activeOverlapInfoPanelGroup?: GroupMinimal | undefined;\n  overlappedElementsInfo?: Map<string, OverlappedInfo[]>;\n  progressConfig?: ProgressConfig;\n}\n\n/**\n * Component to list groups.\n * @internal\n */\nexport const GroupsView = ({\n  mapping,\n  groups,\n  isLoading,\n  onRefresh,\n  groupUIs,\n  actionButtonRenderers,\n  onClickAddGroup,\n  onClickGroupTitle,\n  onClickGroupModify,\n  onClickRenderContextCustomUI,\n  disableActions,\n  selectedGroupForDeletion,\n  onDeleteGroup,\n  onCloseDeleteModal,\n  setSelectedGroupForDeletion,\n  contextUIs,\n  alert,\n  setActiveOverlapInfoPanelGroup,\n  activeOverlapInfoPanelGroup,\n  overlappedElementsInfo,\n  progressConfig,\n}: GroupsViewProps) => {\n  /**\n   * UX Progress Bar Logic:\n   * - Start non-zero for immediate feedback.\n   * - Restrict motion to a range (e.g., 25-90%) for perceived continuity.\n   * - Disappear when compplete.\n   * Goal: Smooth experience for unpredictable durations.\n   */\n  const { baseProgress = 25, maxDynamicProgress = 65, hilitedGroupsProgress } = progressConfig || {};\n\n  return (\n    <InformationPanelWrapper className=\"gmw-groups-container\">\n      <div className=\"gmw-toolbar\">\n        {onClickAddGroup && groupUIs.length > 0 && <GroupsAddButton disabled={disableActions} groupUIs={groupUIs} onClickAddGroup={onClickAddGroup} />}\n        <ButtonGroup className=\"gmw-toolbar-buttons\">\n          <IconButton title=\"Refresh\" onClick={onRefresh} disabled={isLoading || disableActions} styleType=\"borderless\">\n            <SvgRefresh />\n          </IconButton>\n        </ButtonGroup>\n      </div>\n      {alert}\n      <div className=\"gmw-groups-border\" />\n      {!!hilitedGroupsProgress && (\n        <div className=\"gmw-group-progress-bar\">\n          <ProgressLinear\n            value={baseProgress + (hilitedGroupsProgress.currentHilitedGroups / hilitedGroupsProgress.totalNumberOfGroups) * maxDynamicProgress}\n          />\n        </div>\n      )}\n      {isLoading ? (\n        <LoadingOverlay />\n      ) : groups.length === 0 ? (\n        <EmptyMessage message=\"No Groups available.\" />\n      ) : (\n        <List className=\"gmw-group-list\">\n          {groups.map((group) => (\n            <GroupListItem\n              key={group.id}\n              mapping={mapping}\n              group={group}\n              groupUIs={groupUIs}\n              actionButtonRenderers={actionButtonRenderers}\n              onClickGroupTitle={onClickGroupTitle}\n              onClickGroupModify={onClickGroupModify}\n              onClickRenderContextCustomUI={onClickRenderContextCustomUI}\n              disableActions={disableActions}\n              setShowDeleteModal={setSelectedGroupForDeletion}\n              contextUIs={contextUIs}\n              setActiveOverlapInfoPanelGroup={setActiveOverlapInfoPanelGroup}\n            />\n          ))}\n        </List>\n      )}\n      {overlappedElementsInfo && setActiveOverlapInfoPanelGroup && (\n        <OverlappedElementsInformationPanel\n          group={activeOverlapInfoPanelGroup}\n          onClose={() => setActiveOverlapInfoPanelGroup(undefined)}\n          overlappedElementsInfo={overlappedElementsInfo}\n          groups={groups}\n        />\n      )}\n      {selectedGroupForDeletion && (\n        <DeleteModal\n          entityName={selectedGroupForDeletion.groupName}\n          onClose={onCloseDeleteModal}\n          onDelete={async () => {\n            await onDeleteGroup(selectedGroupForDeletion);\n          }}\n        />\n      )}\n    </InformationPanelWrapper>\n  );\n};\n"]}

package/lib/esm/components/Groups/GroupsView.scss

@@ -35,7 +35,7 @@
     height: 1px;
   }
 
-  .gmw-overlap-alert{
+  .gmw-overlap-alert {
     font-size: small;
   }
 

package/lib/esm/components/Groups/GroupsVisualization.d.ts

@@ -1,9 +1,17 @@
 /// <reference types="react" />
 import type { GroupsProps } from "./Groups";
 import "./GroupsVisualization.scss";
+/**
+ * Props for the {@link GroupsVisualization} component.
+ * @public
+ */
 export interface GroupsVisualizationProps extends GroupsProps {
     isNonEmphasizedSelectable?: boolean;
     emphasizeElements?: boolean;
 }
+/**
+ * Component to visualize groups and their elements.
+ * @public
+ */
 export declare const GroupsVisualization: ({ emphasizeElements, isNonEmphasizedSelectable, onClickGroupModify, onClickAddGroup, mapping, ...rest }: GroupsVisualizationProps) => JSX.Element;
 //# sourceMappingURL=GroupsVisualization.d.ts.map