@equinor/echo-framework 2.2.0 → 2.2.2

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@equinor/echo-framework",
-  "version": "2.2.0",
+  "version": "2.2.2",
   "peerDependencies": {
-    "@equinor/echo-base": ">= 2.2.0 < 3.0.0",
-    "@equinor/echo-components": ">= 2.2.0 < 3.0.0",
-    "@equinor/echo-core": ">= 2.2.0 < 3.0.0",
-    "@equinor/echo-search": ">= 2.2.0 < 3.0.0",
-    "@equinor/echo-utils": ">= 2.2.0 < 3.0.0",
+    "@equinor/echo-base": ">= 2.2.1 < 3.0.0",
+    "@equinor/echo-components": ">= 2.2.2 < 3.0.0",
+    "@equinor/echo-core": ">= 2.2.1 < 3.0.0",
+    "@equinor/echo-search": ">= 2.2.2 < 3.0.0",
+    "@equinor/echo-utils": ">= 2.2.2 < 3.0.0",
     "@equinor/eds-core-react": "0.49.0",
     "@equinor/eds-icons": "0.22.0",
     "react": ">= 17.0.2",
@@ -18,14 +18,15 @@
     "lodash": "4.17.21",
     "react-router-dom": "5.3.4",
     "zustand": ">= 4.4.7 < 5",
-    "immer": "10.1.3"
+    "immer": "10.1.3",
+    "msw": "2.11.6"
   },
   "dependencies": {
     "dexie": "4.2.1",
     "mark.js": "8.11.1",
-    "ag-charts-community": "12.2.0",
-    "ag-charts-react": "12.2.0",
-    "ag-charts-enterprise": "12.2.0"
+    "ag-charts-community": "12.3.1",
+    "ag-charts-react": "12.3.1",
+    "ag-charts-enterprise": "12.3.1"
   },
   "main": "./index.cjs.js",
   "type": "commonjs",

package/src/lib/components/contextualAppLinks/index.d.ts

@@ -1,5 +1,5 @@
 import LinksWrapper from './contextualAppLinks';
-import { ExternalAppsMenu } from './externalAppsMenu';
+import { ExternalAppsMenu } from './ExternalAppsMenu';
 import { AllExternalLinks } from './externalLinkButtons/allExternalLinks';
 import { InternalAppLinks } from './internalAppLinks';
 import { LinkButton } from './linkButton';

package/src/lib/feature/globalSelection/globalSelectionColorService.d.ts

@@ -48,7 +48,7 @@ export { UNIFIED_COLOR_POOL };
  * Returns the color associated with a given `GlobalSelectionItemType`.
  *
  * This function maps specific item types to their corresponding selection colors,
- * as defined in the `echoPrimitives.seletionColorsSelectioncolor*` constants.
+ * as defined in the `echoPrimitives.miscSelectionSelectioncolor*` constants.
  * If the provided `itemType` does not match any known type, a default color (`#FF6F00`) is returned.
  *
  * @param itemType - The type of the global selection item for which to retrieve the color.

package/src/lib/feature/globalSelection/index.d.ts

@@ -8,6 +8,7 @@ export { useGlobalSelectionItemsByType } from './hooks/useGlobalSelectionItemsBy
 export { useGlobalSelectionLists } from './hooks/useGlobalSelectionLists';
 export { useGlobalSelectionTags } from './hooks/useGlobalSelectionTags';
 export { useGlobalSelectionWorkOrders } from './hooks/useGlobalSelectionWorkOrders';
+export { useIsInGlobalSelection } from './hooks/useIsInGlobalSelection';
 export { useSelectionCategoriesByGroupId } from './hooks/useSelectionCategoriesByGroupId';
 export { useCurrentSelectionId } from './selectionMenu/hooks/useCurrentSelectionId';
 export { useFetchSelectionHistory } from './selectionMenu/hooks/useFetchSelectionHistory';

package/src/lib/feature/legend/components/pdfMarkers/subComponents/LegendColoredMarkerIcon.d.ts

@@ -1,13 +1,33 @@
 import { ItemMarkerSize } from '@equinor/echo-components';
 import React from 'react';
-import { LegendDataId, LegendId } from '../../../types/legendType';
+import { Marker } from '../../../types/legendMarkerBadge.type';
 interface LegendColoredMarkerIconProps {
-    legendId: LegendId;
-    itemId: LegendDataId;
     hasPointer: boolean;
     isActive: boolean;
     onClick: () => void;
+    hiddenBadges: string[];
+    marker: Marker;
 }
-export declare const MemoizedLegendColoredMarkerIcon: React.NamedExoticComponent<LegendColoredMarkerIconProps>;
+/**
+ * Renders a colored marker icon with optional pointer and badges.
+ *
+ * @param {boolean} hasPointer - Flag to indicate if the marker should have a pointer, currently in lower right corner.
+ * @param {boolean} isActive - Flag to indicate if the marker is active (selected).
+ * @param {() => void} onClick - Callback invoked when the marker is clicked.
+ * @param {string[]} hiddenBadges - Array of badge titles that should be hidden.
+ * @param {Marker} marker - The marker data to be rendered.
+ *
+ * @returns {JSX.Element | null} The rendered colored marker icon or null if no marker is provided.
+ *
+ * @example
+ * <LegendColoredMarkerIcon
+ *   hasPointer={true}
+ *   isActive={false}
+ *   onClick={() => console.log('Marker clicked')}
+ *   hiddenBadges={['Badge1', 'Badge2']}
+ *   marker={markerData}
+ * />
+ */
+export declare const LegendColoredMarkerIcon: React.FC<LegendColoredMarkerIconProps>;
 export declare const MARKER_ICON_WIDTH = ItemMarkerSize.Default;
 export {};

package/src/lib/feature/legend/components/pdfMarkers/subComponents/MultipleMarkersByLegends.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { LegendDataId, LegendId } from '../../../types/legendType';
+import { LegendDataId } from '../../../types/legendType';
+import { PopoverContent, RequestPopoverHandler } from './hooks/usePopoverHandler.types';
 interface MultipleMarkersByLegendsProps {
     itemId: LegendDataId;
     hasPointer: boolean;
@@ -8,28 +8,5 @@ interface MultipleMarkersByLegendsProps {
     currentPopover?: PopoverContent;
     positionString: string;
 }
-export type RequestPopoverHandler = (itemId: LegendDataId, legendId: LegendId, positionString: string, fetchPopoverContent: () => Promise<ReadonlyArray<React.JSX.Element>>) => void;
-export interface PopoverContent {
-    elements: ReadonlyArray<JSX.Element>;
-    activeItem: ActiveItem;
-}
-/**
- * We use active for the icon. Several icons might be active if they have the same tagNo on the PDF, but only 1 of them is open.
- */
-interface ActiveItem {
-    itemId: LegendDataId;
-    legendId: LegendId;
-    positionString: string;
-}
-/**
- * Renders 1 marker for each legend.
- *
- * @param {LegendDataId} itemId - The ID of the legend item.
- * @param {boolean} hasPointer - Flag to indicate if the marker should have a pointer, currently in lower right corner.
- * @param {RequestPopoverHandler} onOpenPopover - Callback invoked when a marker is clicked; fetchPopoverContent should be called to fetch/populate the popover.
- * @param {() => void} onClosePopover - Callback invoked to close the popover
- * @param {(value: PopoverContent | undefined) => void} setOpenItem - Callback function to handle opening the popover.
- */
-export declare const MultipleMarkersByLegendsComponent: React.FC<MultipleMarkersByLegendsProps>;
-export declare const MultipleMarkersByLegends: React.NamedExoticComponent<MultipleMarkersByLegendsProps>;
+export declare const MultipleMarkersByLegends: import("react").MemoExoticComponent<(props: MultipleMarkersByLegendsProps) => import("react/jsx-runtime").JSX.Element>;
 export {};

package/src/lib/feature/legend/components/pdfMarkers/subComponents/MultipleMarkersBySingleLegend.d.ts

@@ -0,0 +1,10 @@
+import { LegendDataId, LegendId } from '../../../types/legendType';
+interface MultipleMarkersBySingleLegendComponentProps {
+    legendId: LegendId;
+    itemId: LegendDataId;
+    hasPointer: boolean;
+    isActive: boolean;
+    onClick: () => void;
+}
+export declare const MultipleMarkersBySingleLegend: import("react").MemoExoticComponent<(props: MultipleMarkersBySingleLegendComponentProps) => import("react/jsx-runtime").JSX.Element[] | null>;
+export {};

package/src/lib/feature/legend/components/pdfMarkers/subComponents/hooks/usePopoverHandler.d.ts

@@ -1,5 +1,5 @@
 import { LegendDataId, LegendId } from '../../../../types/legendType';
-import { PopoverContent } from '../MultipleMarkersByLegends';
+import { PopoverContent } from './usePopoverHandler.types';
 export declare function usePopoverHandler(): {
     currentPopover: PopoverContent | undefined;
     handleOpenPopover: (itemId: LegendDataId, legendId: LegendId, positionString: string, fetchPopoverContent: () => Promise<ReadonlyArray<React.JSX.Element>>) => Promise<void>;

package/src/lib/feature/legend/components/pdfMarkers/subComponents/hooks/usePopoverHandler.types.d.ts

@@ -0,0 +1,14 @@
+import { LegendDataId, LegendId } from '../../../../types/legendType';
+export type RequestPopoverHandler = (itemId: LegendDataId, legendId: LegendId, positionString: string, fetchPopoverContent: () => Promise<ReadonlyArray<React.JSX.Element>>) => void;
+export interface PopoverContent {
+    elements: ReadonlyArray<JSX.Element>;
+    activeItem: ActiveItem;
+}
+/**
+ * We use active for the icon. Several icons might be active if they have the same tagNo on the PDF, but only 1 of them is open.
+ */
+export interface ActiveItem {
+    itemId: LegendDataId;
+    legendId: LegendId;
+    positionString: string;
+}

package/src/lib/feature/legend/components/pdfMarkers/utils/splitMarkerByBadgeSelectionGroup.d.ts

@@ -0,0 +1,22 @@
+import { SelectionGroup } from '../../../../globalSelection';
+import { Marker } from '../../../types/legendMarkerBadge.type';
+import { GroupedMarker } from './splitMarkerByBadgeSelectionGroup.types';
+/**
+ * Splits a marker into multiple variants based on badge selection groups.
+ *
+ * Each variant represents a selection group and contains only badges from that group.
+ *
+ * Example: Marker with 3 equipment badges at Tag1 position:
+ * - Badge A (in SelectionGroupRed)
+ * - Badge B (in SelectionGroupRed)
+ * - Badge C (in SelectionGroupBlue)
+ *
+ * Returns 2 marker variants:
+ * - Marker variant 1: Badges [A, B], red highlight
+ * - Marker variant 2: Badge [C], blue highlight
+ *
+ * @param marker - The marker to split by badge selection groups
+ * @param selectionGroups - Global selection groups
+ * @returns Array of marker variants (one per selection group found in badges)
+ */
+export declare function splitMarkerByBadgeSelectionGroup(selectionGroups: SelectionGroup[], marker?: Marker): GroupedMarker[];

package/src/lib/feature/legend/components/pdfMarkers/utils/splitMarkerByBadgeSelectionGroup.types.d.ts

@@ -0,0 +1,19 @@
+import { Guid } from '@equinor/echo-utils';
+import { Badge, Marker } from '../../../types/legendMarkerBadge.type';
+export interface GroupKey {
+    /** Helper to get the full string representation of the group key based on groupId and color */
+    toString: () => string;
+    groupId: Guid;
+    color: string;
+}
+export interface BadgeGroup {
+    groupKey: GroupKey;
+    highlightColor: string;
+    badges: Badge[];
+}
+/**
+ * Markers that has been processed based on Selection Groups will have a group key.
+ */
+export interface GroupedMarker extends Marker {
+    getGroupKey: () => GroupKey;
+}

package/src/lib/feature/legend/components/selectionLegend/SelectionLegend.d.ts

@@ -0,0 +1 @@
+export declare const SelectionLegendRenderer: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;

package/src/lib/feature/legend/components/selectionLegend/SelectionLegendChip.d.ts

@@ -0,0 +1,7 @@
+interface LegendItemProps {
+    label: string;
+    backgroundColor?: string;
+    onClick: (isDisabled: boolean) => void;
+}
+export declare const SelectionLegendChip: import("react").MemoExoticComponent<(props: LegendItemProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/src/lib/feature/legend/components/selectionLegend/hooks/useIsSelectionLegendVisible.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Decides if selection legend should be visible or not.
+ * Will be visible if Selection has items. Does not check if Selection has items
+ * that are visible on the current PDF.
+ */
+export declare const useIsSelectionLegendVisible: () => boolean;

package/src/lib/feature/legend/components/selectionLegend/selectionLegend.utils.d.ts

@@ -0,0 +1,34 @@
+import { Guid } from '@equinor/echo-utils';
+import { GlobalSelectionTypes, SelectionGroup } from '../../../globalSelection';
+import { GroupKey } from '../pdfMarkers/utils/splitMarkerByBadgeSelectionGroup.types';
+/**
+ * TODO: Remove this flag when Selection Legend is stable and ready for production
+ * Flag to enable/disable Selection Legend feature
+ */
+export declare const isSelectionLegendEnabled: () => boolean;
+/**
+ * Key used for badges that don't belong to any selection group
+ */
+export declare const NOT_IN_SELECTION_GROUP_KEY: GroupKey;
+/**
+ * Extracts all item IDs from selection group categories
+ */
+export declare const extractSelectionGroupItemIds: (selectionGroup: SelectionGroup) => GlobalSelectionTypes.ItemId[];
+/**
+ * Gets the most frequently used color for a selection group
+ */
+export declare const getSelectionGroupMostUsedColor: (selectionGroup: SelectionGroup, allGroups: SelectionGroup[]) => string | undefined;
+/**
+ * Creates a standardized group key for a selection group.
+ * This key is used across the legend system to:
+ * - Identify marker variants split by selection groups (viewport)
+ * - Toggle visibility of selection groups (SelectionLegendRenderer)
+ * - Filter hidden selection groups (groupMarkersBySelection)
+ *
+ * Format as string: `group_${groupId}_${color}`
+ *
+ * @param groupId - The unique identifier of the selection group
+ * @param color - The highlight color for the group
+ * @returns The standardized group key
+ */
+export declare const createSelectionGroupKey: (groupId: Guid, color: string) => GroupKey;

package/src/lib/feature/legend/components/selectionLegend/useAllGroupedMarkersForLegends.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Returns all markers for all legends with grouping. Hidden markers are included.
+ */
+export declare const useAllGroupedMarkersForLegends: () => import("../pdfMarkers/utils/splitMarkerByBadgeSelectionGroup.types").GroupedMarker[] | undefined;

package/src/lib/feature/legend/hooks/useGroupedMarkers.d.ts

@@ -0,0 +1,16 @@
+import { GroupedMarker } from '../components/pdfMarkers/utils/splitMarkerByBadgeSelectionGroup.types';
+import { Marker } from '../types/legendMarkerBadge.type';
+import { LegendId } from '../types/legendType';
+/**
+ * Will process markers and group them based on groups in Selection.
+ * This also adds additional logic for counting badges where this is needed.
+ * @param legendId
+ * @param markers
+ * @param includeHiddenMarkers If enabled hidden markers will also be returned
+ * @returns
+ */
+export declare const useGroupedMarkers: (args: {
+    legendId: LegendId;
+    markers: Marker[];
+    includeHiddenMarkers: boolean;
+}) => GroupedMarker[] | undefined;

package/src/lib/feature/legend/hooks/useLegendMarker/useLegendMarker.d.ts

@@ -0,0 +1,10 @@
+import { Marker } from '../../types/legendMarkerBadge.type';
+import { LegendDataId, LegendId } from '../../types/legendType';
+export interface UseLegendMarkerProps {
+    legendId: LegendId;
+    itemIds: LegendDataId[];
+}
+/**
+ * Returns the visible markers for the given legendId and itemId.
+ */
+export declare function useLegendMarker(props: UseLegendMarkerProps): Marker | undefined;

package/src/lib/feature/legend/hooks/useLegendMarker/useLegendMarker.utils.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Utility functions for legend visible markers functionality.
+ *
+ * This module contains shared utilities, helper functions, and debugging tools
+ * used across the legend marker hooks.
+ */
+import { Marker } from '../../types/legendMarkerBadge.type';
+import { LegendDataId, LegendId } from '../../types/legendType';
+/**
+ * Development helper to track hook calls
+ */
+export declare const trackMarkerCallsInDevelopment: () => void;
+/**
+ * Helper to get unique data from the legend visible data store
+ */
+export declare const useUniqueVisibleData: () => LegendDataId[];
+/**
+ * Common logic for creating markers from data using strategy.
+ * Selection-based grouping is handled at the viewport rendering level.
+ */
+export declare const useCreateMarkers: (legendId: LegendId, data: LegendDataId[], isViewport?: boolean) => ReadonlyArray<Marker>;

package/src/lib/feature/legend/hooks/useLegendUniqueBadges.d.ts

@@ -0,0 +1,9 @@
+import { Badge } from '../types/legendMarkerBadge.type';
+import { LegendId } from '../types/legendType';
+/**
+ * Returns all unique badges for the given legendId, determined by unique title + color.
+ * This will also return markers that are not visible on screen.
+ */
+export declare function useLegendUniqueBadges(legendId: LegendId, options?: {
+    isViewport?: boolean;
+}): ReadonlyArray<Badge>;

package/src/lib/feature/legend/hooks/useLegendUniqueMarkers.d.ts

@@ -0,0 +1,9 @@
+import { Marker } from '../types/legendMarkerBadge.type';
+import { LegendId } from '../types/legendType';
+/**
+ * Returns all unique markers for the given legendId, determined by unique displayKey (title + color).
+ * This will also return markers that are not visible on screen.
+ */
+export declare function useLegendUniqueMarkers(legendId: LegendId, options?: {
+    isViewport?: boolean;
+}): ReadonlyArray<Marker>;

package/src/lib/feature/legend/index.d.ts

@@ -13,4 +13,6 @@ export type { Badge, Marker } from './types/legendMarkerBadge.type';
 export type { LegendStrategy } from './types/legendStrategy.type';
 export type { LegendId, LegendOptionConfig } from './types/legendType';
 export { useLegendVisibleDataStore } from './../legend/legendVisibleDataStore';
-export { useLegendUniqueBadges, useLegendUniqueMarkers } from './hooks/useLegendMarkers';
+export { useLegendUniqueBadges } from './hooks/useLegendUniqueBadges';
+export { useLegendUniqueMarkers } from './hooks/useLegendUniqueMarkers';
+export { COUNT_MODE_KEYWORD } from './logic/normalizeBadges';

package/src/lib/feature/legend/logic/normalizeBadges.d.ts

@@ -0,0 +1,33 @@
+import { Badge } from '../types/legendMarkerBadge.type';
+/**
+ * Keyword used to identify count mode in badge text options. This changes
+ * the way we normalize badges.
+ */
+export declare const COUNT_MODE_KEYWORD = "Count";
+/**
+ * Determines if count mode should be enabled based on badge text options.
+ * Count mode is enabled when any option value exactly equals 'Count'.
+ *
+ * @param badgeTextOptions - Badge text configuration options from legend state
+ * @returns Whether count mode should be enabled
+ */
+export declare function isCountMode(badgeTextOptions: Record<string, string> | undefined): boolean;
+/**
+ * Creates badges with count displayed as title.
+ * Takes all badges (including duplicates) and unique badges, and returns unique badges
+ * with their titles replaced by the count of how many times they appear.
+ *
+ * @param allBadges - All badges including duplicates
+ * @param uniqueBadges - Unique badges to be displayed
+ * @returns Array of badges with count as title
+ */
+export declare function createBadgesWithCount(allBadges: ReadonlyArray<Badge>, uniqueBadges: ReadonlyArray<Badge>): Badge[];
+/**
+ * Normalizes badges for display by removing duplicates and optionally applying count mode.
+ * Count mode is determined from the badge text options configuration.
+ *
+ * @param badges - Array of badges to normalize
+ * @param badgeTextOptions - Badge text configuration options from legend state
+ * @returns Normalized array of badges
+ */
+export declare function normalizeBadges(badges: ReadonlyArray<Badge>, badgeTextOptions: Record<string, string> | undefined): Badge[];

package/src/lib/feature/legend/types/legendMarkerBadge.type.d.ts

@@ -1,12 +1,11 @@
+import { GlobalSelectionTypes } from '../../globalSelection';
 export interface Marker {
     getTitle: () => string;
     getColor: () => string;
     getIcon: () => string;
-    /**
-     * Returns a key that can be used for clustering or grouping markers together if they share the same key.
-     */
-    getGroupKey: () => string;
-    badges: Badge[];
+    getDisplayKey: () => string;
+    getHighlightColor: () => string;
+    badges: ReadonlyArray<Badge>;
     showAsPlainLabel?: boolean;
 }
 export interface Badge {
@@ -15,5 +14,6 @@ export interface Badge {
     /**
      * Returns a key that can be used for clustering or grouping badges together if they share the same key.
      */
-    getGroupKey: () => string;
+    getDisplayKey: () => string;
+    getItemId: () => GlobalSelectionTypes.ItemId;
 }

package/src/lib/feature/legend/types/legendStrategy.type.d.ts

@@ -19,9 +19,14 @@ export interface LegendStrategy {
     badgeOptions?: ReadonlyArray<LegendOptionConfig>;
     getBadgeTextOptions?: (selectedBadgeOption: LegendOptionConfig) => ReadonlyArray<string> | undefined;
     /**
-     * Returns ONE marker per itemId.
+     * Returns 1 marker with badges for each incoming itemId. The viewport will make them unique when needed, and
+     * also split into groups based on (global) selection tree
+     *
+     * @param itemIds - The legend data IDs to create markers for
+     * @param isViewport - Optional use this for rendering different markers/badges in viewport compared to legendRenderer. For example equipmentLegend, where we render part-type name in legendRenderer, but id in viewport.
+     * @returns Array of markers with badges, 1 marker with badges for each incoming itemId
      */
-    useMarkers: (itemIds: ReadonlyArray<LegendDataId>) => ReadonlyArray<Marker>;
+    useMarkers: (itemIds: ReadonlyArray<LegendDataId>, isViewport?: boolean) => ReadonlyArray<Marker>;
     /**
      * Returns popover content that supports pagination for the given itemId.
      *

package/src/lib/feature/legend/hooks/useLegendMarkers.d.ts

@@ -1,19 +0,0 @@
-import { Badge, Marker } from '../types/legendMarkerBadge.type';
-import { LegendDataId, LegendId } from '../types/legendType';
-/**
- * Returns the marker for the given legendId and itemId.
- */
-export declare function useLegendMarker(args: {
-    legendId: LegendId;
-    itemId: LegendDataId;
-}): Marker | undefined;
-/**
- * Returns all unique markers for the given legendId, determined by unique markerKey (title + color).
- */
-export declare function useLegendUniqueMarkers(args: {
-    legendId: LegendId;
-}): ReadonlyArray<Marker>;
-/**
- * Returns all unique badges for the given legendId, determined by unique title + color.
- */
-export declare function useLegendUniqueBadges(legendId: LegendId): ReadonlyArray<Badge>;