@itwin/grouping-mapping-widget 0.13.0 → 0.15.0

package/lib/esm/widget/components/GroupAction.js

@@ -1,21 +1,17 @@
-import { Presentation } from "@itwin/presentation-frontend";
-import { useActiveIModelConnection } from "@itwin/appui-react";
 import { Button, toaster, } from "@itwin/itwinui-react";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { handleError, LoadingSpinner, } from "./utils";
 import "./GroupAction.scss";
 import useValidator from "../hooks/useValidator";
-import { clearEmphasizedElements, clearOverriddenElements, transparentOverriddenElements, visualizeElementsByQuery, zoomToElements, } from "./viewerUtils";
 import { useGroupingMappingApiConfig } from "./context/GroupingApiConfigContext";
 import { useMappingClient } from "./context/MappingClientContext";
 import { useGroupingMappingCustomUI } from "./context/GroupingMappingCustomUIContext";
 import { GroupingMappingCustomUIType } from "./customUI/GroupingMappingCustomUI";
-import { useGroupHilitedElementsContext } from "./context/GroupHilitedElementsContext";
-import { visualizeGroupColors } from "./groupsHelpers";
 import { QueryBuilderStep } from "./QueryBuilderStep";
 import { GroupDetailsStep } from "./GroupDetailsStep";
 import { QueryBuilderActionPanel } from "./QueryBuilderActionPanel";
 import { GroupDetailsActionPanel } from "./GroupDetailsActionPanel";
+import { useVisualization } from "../hooks/useVisualization";
 const defaultDisplayStrings = {
     groupDetails: "Group Details",
     groupBy: "Group By",
@@ -27,9 +23,10 @@ var GroupActionStep;
 })(GroupActionStep || (GroupActionStep = {}));
 export const GroupAction = (props) => {
     var _a, _b, _c, _d;
-    const iModelConnection = useActiveIModelConnection();
-    const { showGroupColor, groups, hiddenGroupsIds, hilitedElementsQueryCache } = useGroupHilitedElementsContext();
-    const { getAccessToken, iModelId } = useGroupingMappingApiConfig();
+    const { getAccessToken, iModelId, iModelConnection } = useGroupingMappingApiConfig();
+    if (!iModelConnection) {
+        throw new Error("This component requires an active iModelConnection.");
+    }
     const mappingClient = useMappingClient();
     const groupUIs = useGroupingMappingCustomUI().customUIs
         .filter((p) => p.type === GroupingMappingCustomUIType.Grouping);
@@ -38,66 +35,51 @@ export const GroupAction = (props) => {
         description: (_d = (_c = props.group) === null || _c === void 0 ? void 0 : _c.description) !== null && _d !== void 0 ? _d : "",
     });
     const [query, setQuery] = useState("");
-    const [simpleSelectionQuery, setSimpleSelectionQuery] = useState("");
+    const [queryRowCount, setQueryRowCount] = useState(0);
     const [validator, setShowValidationMessage] = useValidator();
     const [isLoading, setIsLoading] = useState(false);
-    const [isRendering, setIsRendering] = useState(false);
     const [queryGenerationType, setQueryGenerationType] = useState(props.queryGenerationType);
+    const { isRendering, setIsRendering, simpleSelectionQuery, setSimpleSelectionQuery, clearPresentationSelection, resetView, } = useVisualization(props.shouldVisualize, iModelConnection, query, queryGenerationType);
     const isUpdating = isLoading || isRendering;
     const [currentStep, setCurrentStep] = React.useState(GroupActionStep.QueryBuilder);
-    useEffect(() => {
-        if (!iModelConnection) {
-            throw new Error("This component requires an active iModelConnection.");
-        }
-    }, [iModelConnection]);
     const displayStrings = React.useMemo(() => ({ ...defaultDisplayStrings, ...props.displayStrings }), [props.displayStrings]);
     useEffect(() => setQueryGenerationType(props.queryGenerationType), [props.queryGenerationType]);
-    const resetView = useCallback(async () => {
-        if (showGroupColor) {
-            await visualizeGroupColors(iModelConnection, groups, groups, hiddenGroupsIds, hilitedElementsQueryCache);
-        }
-        else {
-            clearOverriddenElements();
-        }
-        clearEmphasizedElements();
-    }, [groups, hiddenGroupsIds, hilitedElementsQueryCache, iModelConnection, showGroupColor]);
     useEffect(() => {
-        const removeListener = Presentation.selection.selectionChange.addListener(async (evt, selectionProvider) => {
-            if (queryGenerationType === "Selection") {
-                const selection = selectionProvider.getSelection(evt.imodel, evt.level);
-                const query = selection.instanceKeys.size > 0
-                    ? `SELECT ECInstanceId FROM ${selection.instanceKeys.keys().next().value}`
-                    : "";
-                setSimpleSelectionQuery(query);
-            }
-        });
-        return () => {
-            removeListener();
-        };
-    }, [iModelConnection, queryGenerationType]);
-    useEffect(() => {
-        const reemphasize = async () => {
+        const fetchQueryRowCount = async () => {
             try {
                 if (!query || query === "") {
+                    setQueryRowCount(0);
                     return;
                 }
-                setIsRendering(true);
-                transparentOverriddenElements();
-                const resolvedHiliteIds = await visualizeElementsByQuery(query, "red", iModelConnection);
-                await zoomToElements(resolvedHiliteIds);
+                setIsLoading(true);
+                const result = await iModelConnection.queryRowCount(query);
+                setQueryRowCount(result);
             }
             catch {
-                toaster.negative("Sorry, we have failed to generate a valid query. 😔");
+                toaster.negative("Query failed to resolve.");
             }
             finally {
-                setIsRendering(false);
+                setIsLoading(false);
             }
         };
-        void reemphasize();
-    }, [iModelConnection, query]);
-    useEffect(() => {
-        Presentation.selection.clearSelection("GroupingMappingWidget", iModelConnection);
-    }, [iModelConnection]);
+        void fetchQueryRowCount();
+    }, [iModelConnection, query, setIsRendering]);
+    const isBlockingActions = !(details.groupName &&
+        (query || simpleSelectionQuery) &&
+        !isRendering &&
+        !isLoading);
+    const getOptions = useMemo(() => groupUIs.map((ui) => ({
+        label: ui.displayLabel,
+        value: ui.name,
+        icon: ui.icon,
+    })), [groupUIs]);
+    const onChange = useCallback(async (value) => {
+        setQueryGenerationType(value);
+        clearPresentationSelection();
+        setQuery("");
+        setSimpleSelectionQuery("");
+        await resetView();
+    }, [clearPresentationSelection, resetView, setSimpleSelectionQuery]);
     const save = useCallback(async () => {
         var _a, _b, _c, _d, _e;
         if (!validator.allValid()) {
@@ -114,7 +96,7 @@ export const GroupAction = (props) => {
                     ...details,
                     query: currentQuery,
                 });
-            Presentation.selection.clearSelection("GroupingMappingWidget", iModelConnection);
+            clearPresentationSelection();
             setDetails({
                 groupName: (_c = (_b = props.group) === null || _b === void 0 ? void 0 : _b.groupName) !== null && _c !== void 0 ? _c : "",
                 description: (_e = (_d = props.group) === null || _d === void 0 ? void 0 : _d.description) !== null && _e !== void 0 ? _e : "",
@@ -129,36 +111,20 @@ export const GroupAction = (props) => {
         finally {
             setIsLoading(false);
         }
-    }, [validator, setShowValidationMessage, query, simpleSelectionQuery, getAccessToken, props, mappingClient, iModelId, details, iModelConnection]);
-    const isBlockingActions = !(details.groupName &&
-        (query || simpleSelectionQuery) &&
-        !isRendering &&
-        !isLoading);
-    const getOptions = useMemo(() => groupUIs.map((ui) => ({
-        label: ui.displayLabel,
-        value: ui.name,
-        icon: ui.icon,
-    })), [groupUIs]);
-    const onChange = useCallback(async (value) => {
-        setQueryGenerationType(value);
-        Presentation.selection.clearSelection("GroupingMappingWidget", iModelConnection);
-        setQuery("");
-        setSimpleSelectionQuery("");
-        await resetView();
-    }, [iModelConnection, resetView]);
+    }, [validator, setShowValidationMessage, query, simpleSelectionQuery, getAccessToken, props, mappingClient, iModelId, details, clearPresentationSelection]);
     const isQueryBuilderStep = currentStep === GroupActionStep.QueryBuilder;
     const isGroupDetailsStep = currentStep === GroupActionStep.GroupDetails;
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: "gmw-group-add-modify-container" },
-            React.createElement(QueryBuilderStep, { isHidden: !isQueryBuilderStep, queryGenerationType: queryGenerationType, groupUIs: groupUIs, isUpdating: isUpdating, resetView: resetView, setQuery: setQuery, onChange: onChange, getOptions: getOptions, displayStrings: { ...displayStrings } }),
+            React.createElement(QueryBuilderStep, { queryRowCount: queryRowCount, isHidden: !isQueryBuilderStep, queryGenerationType: queryGenerationType, groupUIs: groupUIs, isUpdating: isUpdating, resetView: resetView, setQuery: setQuery, onChange: onChange, getOptions: getOptions, displayStrings: { ...displayStrings }, group: props.group }),
             isGroupDetailsStep && React.createElement(GroupDetailsStep, { details: details, setDetails: setDetails, validator: validator, displayStrings: { ...displayStrings } })),
         React.createElement("div", { className: 'gmw-action-panel' },
             isLoading &&
                 React.createElement(LoadingSpinner, null),
             isQueryBuilderStep && (React.createElement(QueryBuilderActionPanel, { onClickNext: () => setCurrentStep(GroupActionStep.GroupDetails) })),
             isGroupDetailsStep && (React.createElement(GroupDetailsActionPanel, { isSaveDisabled: isBlockingActions, onClickSave: save, onClickBack: () => setCurrentStep(GroupActionStep.QueryBuilder) })),
-            props.onClickCancel && React.createElement(Button, { type: 'button', id: 'cancel', onClick: async () => {
-                    Presentation.selection.clearSelection("GroupingMappingWidget", iModelConnection);
+            props.onClickCancel && React.createElement(Button, { type: 'button', id: 'cancel', onClick: () => {
+                    clearPresentationSelection();
                     props.onClickCancel && props.onClickCancel();
                 } }, "Cancel"))));
 };

package/lib/esm/widget/components/GroupAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupAction.js","sourceRoot":"","sources":["../../../../src/widget/components/GroupAction.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 { IModelConnection } from \"@itwin/core-frontend\";\nimport type {\n  ISelectionProvider,\n  SelectionChangeEventArgs,\n} from \"@itwin/presentation-frontend\";\nimport { Presentation } from \"@itwin/presentation-frontend\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport type {\n  SelectOption,\n} from \"@itwin/itwinui-react\";\nimport {\n  Button,\n  toaster,\n} from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n  handleError,\n  LoadingSpinner,\n} from \"./utils\";\nimport \"./GroupAction.scss\";\nimport useValidator from \"../hooks/useValidator\";\nimport {\n  clearEmphasizedElements,\n  clearOverriddenElements,\n  transparentOverriddenElements,\n  visualizeElementsByQuery,\n  zoomToElements,\n} from \"./viewerUtils\";\nimport { useGroupingMappingApiConfig } from \"./context/GroupingApiConfigContext\";\nimport { useMappingClient } from \"./context/MappingClientContext\";\nimport { useGroupingMappingCustomUI } from \"./context/GroupingMappingCustomUIContext\";\nimport type { GroupingCustomUI } from \"./customUI/GroupingMappingCustomUI\";\nimport { GroupingMappingCustomUIType } from \"./customUI/GroupingMappingCustomUI\";\nimport type { Group } from \"@itwin/insights-client\";\nimport { useGroupHilitedElementsContext } from \"./context/GroupHilitedElementsContext\";\nimport { visualizeGroupColors } from \"./groupsHelpers\";\nimport { QueryBuilderStep } from \"./QueryBuilderStep\";\nimport { GroupDetailsStep } from \"./GroupDetailsStep\";\nimport { QueryBuilderActionPanel } from \"./QueryBuilderActionPanel\";\nimport { GroupDetailsActionPanel } from \"./GroupDetailsActionPanel\";\n\nconst defaultDisplayStrings = {\n  groupDetails: \"Group Details\",\n  groupBy: \"Group By\",\n};\n\nenum GroupActionStep {\n  QueryBuilder,\n  GroupDetails,\n}\n\nexport interface GroupActionProps {\n  mappingId: string;\n  group?: Group;\n  queryGenerationType: string;\n  onSaveSuccess: () => void;\n  onClickCancel?: () => void;\n  displayStrings?: Partial<typeof defaultDisplayStrings>;\n}\n\nexport const GroupAction = (props: GroupActionProps) => {\n  const iModelConnection = useActiveIModelConnection() as IModelConnection;\n  const { showGroupColor, groups, hiddenGroupsIds, hilitedElementsQueryCache } = useGroupHilitedElementsContext();\n  const { getAccessToken, iModelId } = useGroupingMappingApiConfig();\n  const mappingClient = useMappingClient();\n  const groupUIs: GroupingCustomUI[] = useGroupingMappingCustomUI().customUIs\n    .filter((p) => p.type === GroupingMappingCustomUIType.Grouping) as GroupingCustomUI[];\n  const [details, setDetails] = useState({\n    groupName: props.group?.groupName ?? \"\",\n    description: props.group?.description ?? \"\",\n  });\n  const [query, setQuery] = useState<string>(\"\");\n  const [simpleSelectionQuery, setSimpleSelectionQuery] = useState<string>(\"\");\n  const [validator, setShowValidationMessage] = useValidator();\n  const [isLoading, setIsLoading] = useState<boolean>(false);\n  const [isRendering, setIsRendering] = useState<boolean>(false);\n  const [queryGenerationType, setQueryGenerationType] = useState(\n    props.queryGenerationType,\n  );\n  const isUpdating = isLoading || isRendering;\n  const [currentStep, setCurrentStep] = React.useState(GroupActionStep.QueryBuilder);\n\n  useEffect(() => {\n    if (!iModelConnection) {\n      throw new Error(\"This component requires an active iModelConnection.\");\n    }\n  }, [iModelConnection]);\n\n  const displayStrings = React.useMemo(\n    () => ({ ...defaultDisplayStrings, ...props.displayStrings }),\n    [props.displayStrings]\n  );\n\n  useEffect(() => setQueryGenerationType(props.queryGenerationType), [props.queryGenerationType]);\n\n  const resetView = useCallback(async () => {\n    if (showGroupColor) {\n      await visualizeGroupColors(iModelConnection, groups, groups, hiddenGroupsIds, hilitedElementsQueryCache);\n    } else {\n      clearOverriddenElements();\n    }\n    clearEmphasizedElements();\n  }, [groups, hiddenGroupsIds, hilitedElementsQueryCache, iModelConnection, showGroupColor]);\n\n  useEffect(() => {\n    const removeListener = Presentation.selection.selectionChange.addListener(\n      async (\n        evt: SelectionChangeEventArgs,\n        selectionProvider: ISelectionProvider,\n      ) => {\n        if (queryGenerationType === \"Selection\") {\n          const selection = selectionProvider.getSelection(\n            evt.imodel,\n            evt.level,\n          );\n          const query = selection.instanceKeys.size > 0\n            ? `SELECT ECInstanceId FROM ${selection.instanceKeys.keys().next().value}`\n            : \"\";\n          setSimpleSelectionQuery(query);\n        }\n      },\n    );\n    return () => {\n      removeListener();\n    };\n  }, [iModelConnection, queryGenerationType]);\n\n  useEffect(() => {\n    const reemphasize = async () => {\n      try {\n        if (!query || query === \"\") {\n          return;\n        }\n        setIsRendering(true);\n        transparentOverriddenElements();\n        const resolvedHiliteIds = await visualizeElementsByQuery(\n          query,\n          \"red\",\n          iModelConnection,\n        );\n        await zoomToElements(resolvedHiliteIds);\n      } catch {\n        toaster.negative(\"Sorry, we have failed to generate a valid query. 😔\");\n      } finally {\n        setIsRendering(false);\n      }\n    };\n\n    void reemphasize();\n  }, [iModelConnection, query]);\n\n  useEffect(() => {\n    Presentation.selection.clearSelection(\n      \"GroupingMappingWidget\",\n      iModelConnection,\n    );\n  }, [iModelConnection]);\n\n  const save = useCallback(async () => {\n    if (!validator.allValid()) {\n      setShowValidationMessage(true);\n      return;\n    }\n    try {\n      setIsLoading(true);\n      const currentQuery = query || simpleSelectionQuery;\n\n      const accessToken = await getAccessToken();\n\n      props.group\n        ? await mappingClient.updateGroup(\n          accessToken,\n          iModelId,\n          props.mappingId,\n          props.group.id ?? \"\",\n          { ...details, query: currentQuery },\n        )\n        : await mappingClient.createGroup(\n          accessToken,\n          iModelId,\n          props.mappingId,\n          {\n            ...details,\n            query: currentQuery,\n          },\n        );\n      Presentation.selection.clearSelection(\n        \"GroupingMappingWidget\",\n        iModelConnection,\n      );\n      setDetails({\n        groupName: props.group?.groupName ?? \"\",\n        description: props.group?.description ?? \"\",\n      });\n      setCurrentStep(GroupActionStep.QueryBuilder);\n      setShowValidationMessage(false);\n      props.onSaveSuccess();\n    } catch (error: any) {\n      handleError(error.status);\n    } finally {\n      setIsLoading(false);\n    }\n  }, [validator, setShowValidationMessage, query, simpleSelectionQuery, getAccessToken, props, mappingClient, iModelId, details, iModelConnection]);\n\n  const isBlockingActions = !(\n    details.groupName &&\n    (query || simpleSelectionQuery) &&\n    !isRendering &&\n    !isLoading\n  );\n\n  const getOptions = useMemo(\n    (): SelectOption<string>[] =>\n      groupUIs.map((ui) => ({\n        label: ui.displayLabel,\n        value: ui.name,\n        icon: ui.icon,\n      })),\n    [groupUIs]\n  );\n\n  const onChange = useCallback(\n    async (value: string) => {\n      setQueryGenerationType(value);\n      Presentation.selection.clearSelection(\n        \"GroupingMappingWidget\",\n        iModelConnection,\n      );\n      setQuery(\"\");\n      setSimpleSelectionQuery(\"\");\n      await resetView();\n    },\n    [iModelConnection, resetView]\n  );\n\n  const isQueryBuilderStep = currentStep === GroupActionStep.QueryBuilder;\n  const isGroupDetailsStep = currentStep === GroupActionStep.GroupDetails;\n  return (\n    <>\n      <div className=\"gmw-group-add-modify-container\">\n        <QueryBuilderStep\n          isHidden={!isQueryBuilderStep}\n          queryGenerationType={queryGenerationType}\n          groupUIs={groupUIs}\n          isUpdating={isUpdating}\n          resetView={resetView}\n          setQuery={setQuery}\n          onChange={onChange}\n          getOptions={getOptions}\n          displayStrings={{ ...displayStrings }}\n        />\n        {isGroupDetailsStep && <GroupDetailsStep\n          details={details}\n          setDetails={setDetails}\n          validator={validator}\n          displayStrings={{ ...displayStrings }}\n        />}\n      </div>\n      <div className='gmw-action-panel'>\n        {isLoading &&\n          <LoadingSpinner />\n        }\n        {isQueryBuilderStep && (\n          <QueryBuilderActionPanel onClickNext={() => setCurrentStep(GroupActionStep.GroupDetails)} />\n        )}\n        {isGroupDetailsStep && (\n          <GroupDetailsActionPanel\n            isSaveDisabled={isBlockingActions}\n            onClickSave={save}\n            onClickBack={() => setCurrentStep(GroupActionStep.QueryBuilder)}\n          />\n        )}\n        {props.onClickCancel && <Button\n          type='button'\n          id='cancel'\n          onClick={async () => {\n            Presentation.selection.clearSelection(\n              \"GroupingMappingWidget\",\n              iModelConnection,\n            );\n            props.onClickCancel && props.onClickCancel();\n          }}\n        >\n          Cancel\n        </Button>}\n      </div>\n    </>\n  );\n};\n"]}
+{"version":3,"file":"GroupAction.js","sourceRoot":"","sources":["../../../../src/widget/components/GroupAction.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 {\n  SelectOption,\n} from \"@itwin/itwinui-react\";\nimport {\n  Button,\n  toaster,\n} from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n  handleError,\n  LoadingSpinner,\n} from \"./utils\";\nimport \"./GroupAction.scss\";\nimport useValidator from \"../hooks/useValidator\";\nimport { useGroupingMappingApiConfig } from \"./context/GroupingApiConfigContext\";\nimport { useMappingClient } from \"./context/MappingClientContext\";\nimport { useGroupingMappingCustomUI } from \"./context/GroupingMappingCustomUIContext\";\nimport type { GroupingCustomUI } from \"./customUI/GroupingMappingCustomUI\";\nimport { GroupingMappingCustomUIType } from \"./customUI/GroupingMappingCustomUI\";\nimport type { Group } from \"@itwin/insights-client\";\nimport { QueryBuilderStep } from \"./QueryBuilderStep\";\nimport { GroupDetailsStep } from \"./GroupDetailsStep\";\nimport { QueryBuilderActionPanel } from \"./QueryBuilderActionPanel\";\nimport { GroupDetailsActionPanel } from \"./GroupDetailsActionPanel\";\nimport { useVisualization } from \"../hooks/useVisualization\";\n\nconst defaultDisplayStrings = {\n  groupDetails: \"Group Details\",\n  groupBy: \"Group By\",\n};\n\nenum GroupActionStep {\n  QueryBuilder,\n  GroupDetails,\n}\n\nexport interface GroupActionProps {\n  mappingId: string;\n  shouldVisualize: boolean;\n  group?: Group;\n  queryGenerationType: string;\n  onSaveSuccess: () => void;\n  onClickCancel?: () => void;\n  displayStrings?: Partial<typeof defaultDisplayStrings>;\n}\n\nexport const GroupAction = (props: GroupActionProps) => {\n  const { getAccessToken, iModelId, iModelConnection } = useGroupingMappingApiConfig();\n  if (!iModelConnection) {\n    throw new Error(\"This component requires an active iModelConnection.\");\n  }\n  const mappingClient = useMappingClient();\n  const groupUIs: GroupingCustomUI[] = useGroupingMappingCustomUI().customUIs\n    .filter((p) => p.type === GroupingMappingCustomUIType.Grouping) as GroupingCustomUI[];\n  const [details, setDetails] = useState({\n    groupName: props.group?.groupName ?? \"\",\n    description: props.group?.description ?? \"\",\n  });\n  const [query, setQuery] = useState<string>(\"\");\n  const [queryRowCount, setQueryRowCount] = useState<number>(0);\n\n  const [validator, setShowValidationMessage] = useValidator();\n  const [isLoading, setIsLoading] = useState<boolean>(false);\n\n  const [queryGenerationType, setQueryGenerationType] = useState(\n    props.queryGenerationType,\n  );\n  const {\n    isRendering,\n    setIsRendering,\n    simpleSelectionQuery,\n    setSimpleSelectionQuery,\n    clearPresentationSelection,\n    resetView,\n  } = useVisualization(\n    props.shouldVisualize,\n    iModelConnection,\n    query,\n    queryGenerationType\n  );\n  const isUpdating = isLoading || isRendering;\n  const [currentStep, setCurrentStep] = React.useState(GroupActionStep.QueryBuilder);\n\n  const displayStrings = React.useMemo(\n    () => ({ ...defaultDisplayStrings, ...props.displayStrings }),\n    [props.displayStrings]\n  );\n\n  useEffect(() => setQueryGenerationType(props.queryGenerationType), [props.queryGenerationType]);\n\n  useEffect(() => {\n    const fetchQueryRowCount = async () => {\n      try {\n        if (!query || query === \"\") {\n          setQueryRowCount(0);\n          return;\n        }\n        setIsLoading(true);\n        const result = await iModelConnection.queryRowCount(query);\n        setQueryRowCount(result);\n      } catch {\n        toaster.negative(\"Query failed to resolve.\");\n      } finally {\n        setIsLoading(false);\n      }\n    };\n\n    void fetchQueryRowCount();\n  }, [iModelConnection, query, setIsRendering]);\n\n  const isBlockingActions = !(\n    details.groupName &&\n    (query || simpleSelectionQuery) &&\n    !isRendering &&\n    !isLoading\n  );\n\n  const getOptions = useMemo(\n    (): SelectOption<string>[] =>\n      groupUIs.map((ui) => ({\n        label: ui.displayLabel,\n        value: ui.name,\n        icon: ui.icon,\n      })),\n    [groupUIs]\n  );\n\n  const onChange = useCallback(\n    async (value: string) => {\n      setQueryGenerationType(value);\n      clearPresentationSelection();\n      setQuery(\"\");\n      setSimpleSelectionQuery(\"\");\n      await resetView();\n    },\n    [clearPresentationSelection, resetView, setSimpleSelectionQuery]\n  );\n\n  const save = useCallback(async () => {\n    if (!validator.allValid()) {\n      setShowValidationMessage(true);\n      return;\n    }\n    try {\n      setIsLoading(true);\n      const currentQuery = query || simpleSelectionQuery;\n\n      const accessToken = await getAccessToken();\n\n      props.group\n        ? await mappingClient.updateGroup(\n          accessToken,\n          iModelId,\n          props.mappingId,\n          props.group.id ?? \"\",\n          { ...details, query: currentQuery },\n        )\n        : await mappingClient.createGroup(\n          accessToken,\n          iModelId,\n          props.mappingId,\n          {\n            ...details,\n            query: currentQuery,\n          },\n        );\n      clearPresentationSelection();\n      setDetails({\n        groupName: props.group?.groupName ?? \"\",\n        description: props.group?.description ?? \"\",\n      });\n      setCurrentStep(GroupActionStep.QueryBuilder);\n      setShowValidationMessage(false);\n      props.onSaveSuccess();\n    } catch (error: any) {\n      handleError(error.status);\n    } finally {\n      setIsLoading(false);\n    }\n  }, [validator, setShowValidationMessage, query, simpleSelectionQuery, getAccessToken, props, mappingClient, iModelId, details, clearPresentationSelection]);\n\n  const isQueryBuilderStep = currentStep === GroupActionStep.QueryBuilder;\n  const isGroupDetailsStep = currentStep === GroupActionStep.GroupDetails;\n  return (\n    <>\n      <div className=\"gmw-group-add-modify-container\">\n        <QueryBuilderStep\n          queryRowCount={queryRowCount}\n          isHidden={!isQueryBuilderStep}\n          queryGenerationType={queryGenerationType}\n          groupUIs={groupUIs}\n          isUpdating={isUpdating}\n          resetView={resetView}\n          setQuery={setQuery}\n          onChange={onChange}\n          getOptions={getOptions}\n          displayStrings={{ ...displayStrings }}\n          group={props.group}\n        />\n        {isGroupDetailsStep && <GroupDetailsStep\n          details={details}\n          setDetails={setDetails}\n          validator={validator}\n          displayStrings={{ ...displayStrings }}\n        />}\n      </div>\n      <div className='gmw-action-panel'>\n        {isLoading &&\n          <LoadingSpinner />\n        }\n        {isQueryBuilderStep && (\n          <QueryBuilderActionPanel onClickNext={() => setCurrentStep(GroupActionStep.GroupDetails)} />\n        )}\n        {isGroupDetailsStep && (\n          <GroupDetailsActionPanel\n            isSaveDisabled={isBlockingActions}\n            onClickSave={save}\n            onClickBack={() => setCurrentStep(GroupActionStep.QueryBuilder)}\n          />\n        )}\n        {props.onClickCancel && <Button\n          type='button'\n          id='cancel'\n          onClick={() => {\n            clearPresentationSelection();\n            props.onClickCancel && props.onClickCancel();\n          }}\n        >\n          Cancel\n        </Button>}\n      </div>\n    </>\n  );\n};\n"]}

package/lib/esm/widget/components/GroupColorLegend.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { Group } from "@itwin/insights-client";
+import "./GroupColorLegend.scss";
+interface GroupColorLegendProps {
+    group: Group;
+    groups: Group[];
+}
+export declare const GroupColorLegend: ({ group, groups }: GroupColorLegendProps) => JSX.Element;
+export {};
+//# sourceMappingURL=GroupColorLegend.d.ts.map

package/lib/esm/widget/components/GroupColorLegend.js

@@ -0,0 +1,13 @@
+/*---------------------------------------------------------------------------------------------
+* 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 { IconButton } from "@itwin/itwinui-react";
+import { getGroupColor } from "./groupsHelpers";
+import "./GroupColorLegend.scss";
+export const GroupColorLegend = ({ group, groups }) => (React.createElement(IconButton, { styleType: "borderless" },
+    React.createElement("div", { className: "gmw-color-legend", style: {
+            backgroundColor: getGroupColor(groups.findIndex((g) => g.id === group.id)),
+        } })));
+//# sourceMappingURL=GroupColorLegend.js.map

package/lib/esm/widget/components/GroupColorLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupColorLegend.js","sourceRoot":"","sources":["../../../../src/widget/components/GroupColorLegend.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,yBAAyB,CAAC;AAOjC,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,EAAyB,EAAE,EAAE,CAAC,CAC5E,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY;IAChC,6BACE,SAAS,EAAC,kBAAkB,EAC5B,KAAK,EAAE;YACL,eAAe,EAAE,aAAa,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,CAAC,CAAC;SAC3E,GACD,CACS,CACd,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 { IconButton } from \"@itwin/itwinui-react\";\nimport type { Group } from \"@itwin/insights-client\";\nimport { getGroupColor } from \"./groupsHelpers\";\nimport \"./GroupColorLegend.scss\";\n\ninterface GroupColorLegendProps {\n  group: Group;\n  groups: Group[];\n}\n\nexport const GroupColorLegend = ({ group, groups }: GroupColorLegendProps) => (\n  <IconButton styleType=\"borderless\">\n    <div\n      className=\"gmw-color-legend\"\n      style={{\n        backgroundColor: getGroupColor(groups.findIndex((g) => g.id === group.id)),\n      }}\n    />\n  </IconButton>\n);\n"]}

package/lib/esm/widget/components/GroupColorLegend.scss

@@ -0,0 +1,9 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+.gmw-color-legend {
+  border: 1px solid black;
+}

package/lib/esm/widget/components/GroupColorToggle.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { ToggleSwitchProps } from "@itwin/itwinui-react";
+import type { Group } from "@itwin/insights-client";
+export interface GroupColorToggleProps extends Partial<ToggleSwitchProps> {
+    color: string;
+    group: Group;
+}
+export declare const GroupColorToggle: ({ color, group, ...rest }: GroupColorToggleProps) => JSX.Element;
+//# sourceMappingURL=GroupColorToggle.d.ts.map

package/lib/esm/widget/components/GroupColorToggle.js

@@ -0,0 +1,46 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+import React, { useEffect, useState } from "react";
+import { toaster, ToggleSwitch } from "@itwin/itwinui-react";
+import { clearEmphasizedOverriddenElements, visualizeElements, zoomToElements } from "./viewerUtils";
+import { getHiliteIdsAndKeysetFromGroup } from "./groupsHelpers";
+import { Presentation } from "@itwin/presentation-frontend";
+import { useGroupHilitedElementsContext } from "./context/GroupHilitedElementsContext";
+import { usePropertiesContext } from "./context/PropertiesContext";
+import { useGroupingMappingApiConfig } from "./context/GroupingApiConfigContext";
+export const GroupColorToggle = ({ color, group, ...rest }) => {
+    const [isLoading, setIsLoading] = useState(false);
+    const { iModelConnection } = useGroupingMappingApiConfig();
+    if (!iModelConnection) {
+        throw new Error("This component requires an active iModelConnection.");
+    }
+    const { hilitedElementsQueryCache } = useGroupHilitedElementsContext();
+    const { showGroupColor, setShowGroupColor } = usePropertiesContext();
+    useEffect(() => {
+        const visualize = async () => {
+            try {
+                setIsLoading(true);
+                clearEmphasizedOverriddenElements();
+                if (showGroupColor) {
+                    const result = await getHiliteIdsAndKeysetFromGroup(iModelConnection, group, hilitedElementsQueryCache);
+                    Presentation.selection.clearSelection("GroupingMappingWidget", iModelConnection);
+                    visualizeElements(result.ids, color);
+                    await zoomToElements(result.ids);
+                }
+            }
+            catch (error) {
+                toaster.negative("There was an error visualizing group.");
+                /* eslint-disable no-console */
+                console.error(error);
+            }
+            finally {
+                setIsLoading(false);
+            }
+        };
+        void visualize();
+    }, [iModelConnection, group.query, group.groupName, group, hilitedElementsQueryCache, showGroupColor, color]);
+    return (React.createElement(ToggleSwitch, { label: "Color Group", disabled: isLoading, checked: showGroupColor, onChange: () => setShowGroupColor((b) => !b), ...rest }));
+};
+//# sourceMappingURL=GroupColorToggle.js.map

package/lib/esm/widget/components/GroupColorToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupColorToggle.js","sourceRoot":"","sources":["../../../../src/widget/components/GroupColorToggle.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAE7D,OAAO,EAAE,iCAAiC,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACrG,OAAO,EAAE,8BAA8B,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,8BAA8B,EAAE,MAAM,uCAAuC,CAAC;AACvF,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,2BAA2B,EAAE,MAAM,oCAAoC,CAAC;AAOjF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,KAAK,EACL,KAAK,EACL,GAAG,IAAI,EACe,EAAE,EAAE;IAC1B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC3D,MAAM,EAAE,gBAAgB,EAAE,GAAG,2BAA2B,EAAE,CAAC;IAC3D,IAAI,CAAC,gBAAgB,EAAE;QACrB,MAAM,IAAI,KAAK,CAAC,qDAAqD,CAAC,CAAC;KACxE;IACD,MAAM,EAAE,yBAAyB,EAAE,GAAG,8BAA8B,EAAE,CAAC;IACvE,MAAM,EAAE,cAAc,EAAE,iBAAiB,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE;YAC3B,IAAI;gBACF,YAAY,CAAC,IAAI,CAAC,CAAC;gBACnB,iCAAiC,EAAE,CAAC;gBACpC,IAAI,cAAc,EAAE;oBAClB,MAAM,MAAM,GAAG,MAAM,8BAA8B,CAAC,gBAAgB,EAAE,KAAK,EAAE,yBAAyB,CAAC,CAAC;oBACxG,YAAY,CAAC,SAAS,CAAC,cAAc,CACnC,uBAAuB,EACvB,gBAAgB,CACjB,CAAC;oBACF,iBAAiB,CAAC,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;oBACrC,MAAM,cAAc,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;iBAClC;aACF;YAAC,OAAO,KAAK,EAAE;gBACd,OAAO,CAAC,QAAQ,CAAC,uCAAuC,CAAC,CAAC;gBAC1D,+BAA+B;gBAC/B,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;aACtB;oBAAS;gBACR,YAAY,CAAC,KAAK,CAAC,CAAC;aACrB;QACH,CAAC,CAAC;QACF,KAAK,SAAS,EAAE,CAAC;IACnB,CAAC,EAAE,CAAC,gBAAgB,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,KAAK,EAAE,yBAAyB,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC;IAE9G,OAAO,CACL,oBAAC,YAAY,IACX,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KACxC,IAAI,GACM,CACjB,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, { useEffect, useState } from \"react\";\nimport type { ToggleSwitchProps } from \"@itwin/itwinui-react\";\nimport { toaster, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport type { Group } from \"@itwin/insights-client\";\nimport { clearEmphasizedOverriddenElements, visualizeElements, zoomToElements } from \"./viewerUtils\";\nimport { getHiliteIdsAndKeysetFromGroup } from \"./groupsHelpers\";\nimport { Presentation } from \"@itwin/presentation-frontend\";\nimport { useGroupHilitedElementsContext } from \"./context/GroupHilitedElementsContext\";\nimport { usePropertiesContext } from \"./context/PropertiesContext\";\nimport { useGroupingMappingApiConfig } from \"./context/GroupingApiConfigContext\";\n\nexport interface GroupColorToggleProps extends Partial<ToggleSwitchProps> {\n  color: string;\n  group: Group;\n}\n\nexport const GroupColorToggle = ({\n  color,\n  group,\n  ...rest\n}: GroupColorToggleProps) => {\n  const [isLoading, setIsLoading] = useState<boolean>(false);\n  const { iModelConnection } = useGroupingMappingApiConfig();\n  if (!iModelConnection) {\n    throw new Error(\"This component requires an active iModelConnection.\");\n  }\n  const { hilitedElementsQueryCache } = useGroupHilitedElementsContext();\n  const { showGroupColor, setShowGroupColor } = usePropertiesContext();\n\n  useEffect(() => {\n    const visualize = async () => {\n      try {\n        setIsLoading(true);\n        clearEmphasizedOverriddenElements();\n        if (showGroupColor) {\n          const result = await getHiliteIdsAndKeysetFromGroup(iModelConnection, group, hilitedElementsQueryCache);\n          Presentation.selection.clearSelection(\n            \"GroupingMappingWidget\",\n            iModelConnection,\n          );\n          visualizeElements(result.ids, color);\n          await zoomToElements(result.ids);\n        }\n      } catch (error) {\n        toaster.negative(\"There was an error visualizing group.\");\n        /* eslint-disable no-console */\n        console.error(error);\n      } finally {\n        setIsLoading(false);\n      }\n    };\n    void visualize();\n  }, [iModelConnection, group.query, group.groupName, group, hilitedElementsQueryCache, showGroupColor, color]);\n\n  return (\n    <ToggleSwitch\n      label=\"Color Group\"\n      disabled={isLoading}\n      checked={showGroupColor}\n      onChange={() => setShowGroupColor((b) => !b)}\n      {...rest}\n    ></ToggleSwitch>\n  );\n};\n"]}

package/lib/esm/widget/components/GroupItem.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type { Group } from "@itwin/insights-client";
+import type { ContextCustomUI, GroupingCustomUI } from "./customUI/GroupingMappingCustomUI";
+import type { GroupingProps } from "./Grouping";
+export interface GroupItemProps extends Omit<GroupingProps, "onClickAddGroup"> {
+    group: Group;
+    groupUIs: GroupingCustomUI[];
+    contextUIs: ContextCustomUI[];
+    setShowDeleteModal: (showDeleteModal: Group) => void;
+}
+export declare const GroupItem: ({ onClickGroupTitle, disableActions, group, ...rest }: GroupItemProps) => JSX.Element;
+//# sourceMappingURL=GroupItem.d.ts.map

package/lib/esm/widget/components/GroupItem.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { HorizontalTile } from "./HorizontalTile";
+import { GroupMenuActions } from "./GroupMenuActions";
+export const GroupItem = ({ onClickGroupTitle, disableActions, group, ...rest }) => {
+    const onTitleClick = () => {
+        if (onClickGroupTitle) {
+            onClickGroupTitle(group);
+        }
+    };
+    return (React.createElement(HorizontalTile, { title: group.groupName, subText: group.description, actionGroup: React.createElement(GroupMenuActions, { group: group, disableActions: disableActions, ...rest }), onClickTitle: onClickGroupTitle && !disableActions ? onTitleClick : undefined }));
+};
+//# sourceMappingURL=GroupItem.js.map

package/lib/esm/widget/components/GroupItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupItem.js","sourceRoot":"","sources":["../../../../src/widget/components/GroupItem.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAStD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,iBAAiB,EACjB,cAAc,EACd,KAAK,EACL,GAAG,IAAI,EACQ,EAAE,EAAE;IAEnB,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,iBAAiB,EAAE;YACrB,iBAAiB,CAAC,KAAK,CAAC,CAAC;SAC1B;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,cAAc,IACb,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,OAAO,EAAE,KAAK,CAAC,WAAW,EAC1B,WAAW,EACT,oBAAC,gBAAgB,IACf,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,KAC1B,IAAI,GACR,EAEJ,YAAY,EAAE,iBAAiB,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,GAC7E,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 React from \"react\";\nimport { HorizontalTile } from \"./HorizontalTile\";\nimport type { ContextCustomUI, GroupingCustomUI } from \"./customUI/GroupingMappingCustomUI\";\nimport type { GroupingProps } from \"./Grouping\";\nimport { GroupMenuActions } from \"./GroupMenuActions\";\n\nexport interface GroupItemProps extends Omit<GroupingProps, \"onClickAddGroup\"> {\n  group: Group;\n  groupUIs: GroupingCustomUI[];\n  contextUIs: ContextCustomUI[];\n  setShowDeleteModal: (showDeleteModal: Group) => void;\n}\n\nexport const GroupItem = ({\n  onClickGroupTitle,\n  disableActions,\n  group,\n  ...rest\n}: GroupItemProps) => {\n\n  const onTitleClick = () => {\n    if (onClickGroupTitle) {\n      onClickGroupTitle(group);\n    }\n  };\n\n  return (\n    <HorizontalTile\n      title={group.groupName}\n      subText={group.description}\n      actionGroup={\n        <GroupMenuActions\n          group={group}\n          disableActions={disableActions}\n          {...rest}\n        />\n      }\n      onClickTitle={onClickGroupTitle && !disableActions ? onTitleClick : undefined}\n    />\n  );\n};\n"]}

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

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

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

@@ -0,0 +1,45 @@
+import { SvgDelete, SvgEdit, SvgMore } from "@itwin/itwinui-icons-react";
+import { DropdownMenu, IconButton, MenuItem } from "@itwin/itwinui-react";
+import React, { useCallback } from "react";
+import { useGroupingMappingApiConfig } from "./context/GroupingApiConfigContext";
+import "./GroupMenuActions.scss";
+export const GroupMenuActions = ({ mapping, group, actionButtonRenderers, onClickGroupModify, onClickRenderContextCustomUI, groupUIs, contextUIs, disableActions, setShowDeleteModal, }) => {
+    const { iModelId } = useGroupingMappingApiConfig();
+    const onModify = useCallback(async (group, type) => {
+        if (!onClickGroupModify)
+            return;
+        onClickGroupModify(group, type);
+    }, [onClickGroupModify]);
+    return (React.createElement("div", { className: "gmw-actions" },
+        actionButtonRenderers &&
+            actionButtonRenderers.map((actionButton, index) => React.createElement(React.Fragment, { key: index }, actionButton({ group }))),
+        React.createElement(DropdownMenu, { className: "gmw-action-dropdown", disabled: disableActions, menuItems: (close) => [
+                ...(groupUIs.length > 0 && onClickGroupModify
+                    ? [
+                        React.createElement(MenuItem, { key: 0, icon: React.createElement(SvgEdit, null), disabled: disableActions, "data-testid": "gmw-context-menu-item", subMenuItems: groupUIs.map((p, index) => (React.createElement(MenuItem, { key: p.name, className: "gmw-menu-item", "data-testid": `gmw-edit-${index}`, onClick: async () => {
+                                    await onModify(group, p.name);
+                                    close();
+                                }, icon: p.icon }, p.displayLabel))) }, "Edit"),
+                    ]
+                    : []),
+                ...contextUIs.map((p) => {
+                    return (React.createElement(MenuItem, { key: p.name, onClick: async () => {
+                            if (p.uiComponent &&
+                                onClickRenderContextCustomUI) {
+                                onClickRenderContextCustomUI(p.uiComponent, group, p.displayLabel);
+                            }
+                            if (p.onClick) {
+                                p.onClick(group, mapping, iModelId);
+                            }
+                            close();
+                        }, icon: p.icon, "data-testid": "gmw-context-menu-item" }, p.displayLabel));
+                }),
+                React.createElement(MenuItem, { key: 2, onClick: () => {
+                        setShowDeleteModal(group);
+                        close();
+                    }, icon: React.createElement(SvgDelete, null), "data-testid": "gmw-context-menu-item" }, "Remove"),
+            ] },
+            React.createElement(IconButton, { disabled: disableActions, styleType: "borderless", "data-testid": "gmw-more-button" },
+                React.createElement(SvgMore, null)))));
+};
+//# sourceMappingURL=GroupMenuActions.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GroupMenuActions.js","sourceRoot":"","sources":["../../../../src/widget/components/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, 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 { GroupingProps } from \"./Grouping\";\nimport { useGroupingMappingApiConfig } from \"./context/GroupingApiConfigContext\";\nimport \"./GroupMenuActions.scss\";\n\nexport interface GroupMenuActionsProps extends Omit<GroupingProps, \"onClickAddGroup\" | \"onClickGroupTitle\"> {\n  group: Group;\n  groupUIs: GroupingCustomUI[];\n  contextUIs: ContextCustomUI[];\n  setShowDeleteModal: (showDeleteModal: 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}: GroupMenuActionsProps) => {\n  const { iModelId } = useGroupingMappingApiConfig();\n\n  const onModify = useCallback(async (group: Group, type: string) => {\n    if (!onClickGroupModify) return;\n    onClickGroupModify(group, type);\n  }, [onClickGroupModify]);\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={(close: () => void) => [\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        <IconButton\n          disabled={disableActions}\n          styleType=\"borderless\"\n          data-testid=\"gmw-more-button\"\n        >\n          <SvgMore />\n        </IconButton>\n      </DropdownMenu>\n    </div>\n  );\n};\n"]}

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

@@ -0,0 +1,13 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+.gmw-actions {
+  display: flex;
+  flex-direction: row;
+  .gmw-action-dropdown {
+    width: $iui-3xl + $iui-xl;
+  }
+}

package/lib/esm/widget/components/GroupPropertyAction.js

@@ -4,7 +4,6 @@
 *--------------------------------------------------------------------------------------------*/
 import { renderToStaticMarkup } from "react-dom/server";
 import { PropertyValueFormat } from "@itwin/presentation-common";
-import { useActiveIModelConnection } from "@itwin/appui-react";
 import { Alert, Button, Fieldset, IconButton, Label, LabeledInput, LabeledSelect, Modal, ModalButtonBar, Small, Surface, Text, } from "@itwin/itwinui-react";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import ActionPanel from "./ActionPanel";
@@ -34,8 +33,7 @@ export const quantityTypesSelectionOptions = [
     { value: QuantityType.Undefined, label: "No Quantity Type" },
 ];
 export const GroupPropertyAction = ({ mappingId, group, groupProperty, onSaveSuccess, onClickCancel, }) => {
-    const iModelConnection = useActiveIModelConnection();
-    const { getAccessToken, iModelId } = useGroupingMappingApiConfig();
+    const { getAccessToken, iModelId, iModelConnection } = useGroupingMappingApiConfig();
     const mappingClient = useMappingClient();
     const { hilitedElementsQueryCache } = useGroupHilitedElementsContext();
     const [propertyName, setPropertyName] = useState("");