@equinor/echo-framework 0.21.4-beta-0 → 0.21.4

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

@@ -0,0 +1,16 @@
+import React from 'react';
+import { LegendDataId } from '../../../types/legendType';
+interface LegendPositionItem {
+    itemId: LegendDataId;
+    positionString: string;
+    hasPointer: boolean;
+    popoverOffset: string;
+}
+interface LegendMarkersRendererWithPopoverProps {
+    positionItems: ReadonlyArray<LegendPositionItem>;
+}
+/**
+ * Renders all the position items, with markers for each legends. And has 1 popover which is the last active item clicked.
+ */
+export declare const LegendMarkersRendererWithPopover: React.FC<LegendMarkersRendererWithPopoverProps>;
+export {};

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

@@ -0,0 +1,39 @@
+import React from 'react';
+import { LegendDataId, LegendId } from '../../../types/legendType';
+interface MultipleMarkersByLegendsProps {
+    itemId: LegendDataId;
+    /**
+     * Flag to indicate if the marker should have a pointer, currently in lower right corner.
+     */
+    hasPointer: boolean;
+    popoverOffset: string;
+    setOpenItem: (value: PopoverContent | undefined) => void;
+    /**
+     * We use active for the icon. So several icons might be active if they have the same tagNo on the PDF, but only 1 of them is open.
+     */
+    activeItem: ActiveItem | undefined;
+}
+export interface PopoverContent {
+    elements: ReadonlyArray<JSX.Element>;
+    popoverOffset: string;
+    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;
+}
+/**
+ * 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 {string} popoverOffset - The offset for the popover.
+ * @param {(value: PopoverContent | undefined) => void} setOpenItem - Callback function to handle opening the popover.
+ * @param {ActiveItem | undefined} 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 declare const MultipleMarkersByLegendsComponent: React.FC<MultipleMarkersByLegendsProps>;
+export declare const MultipleMarkersByLegends: React.NamedExoticComponent<MultipleMarkersByLegendsProps>;
+export {};

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

@@ -0,0 +1,18 @@
+import { Point } from '@equinor/echo-utils';
+export declare const calculateIconScale: (currentPageScale: number) => number;
+export declare function calculatePopoverStyling(args: {
+    pdfZoom: number;
+    hasPointer: boolean;
+    position: Point;
+    pdfRotation: number;
+    currentPageScale: number;
+    markerHeight: number;
+}): string;
+export declare function iconPositionTransform(args: {
+    position: Point;
+    pdfRotation: number;
+    currentPageScale: number;
+    isMobileDevice: boolean;
+    pdfZoom: number;
+    hasPointer: boolean;
+}): string;

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

@@ -0,0 +1,19 @@
+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>;

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

@@ -0,0 +1,8 @@
+import './legendStrategies/workOrderStrategy/WorkOrderLegend';
+export { LegendList } from './components/LegendList';
+export { PositionalItem } from './components/pdfMarkers/PositionalItem';
+export { MultipleMarkersByLegends } from './components/pdfMarkers/subComponents/MultipleMarkersByLegends';
+export { legendFacade } from './legendFacade';
+export type { Badge, Marker } from './types/legendMarkerBadge.type';
+export type { LegendStrategy } from './types/legendStrategy.type';
+export type { LegendId } from './types/legendType';

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

@@ -0,0 +1,52 @@
+import { legendSnapShot, useAllLegends, useLegendById } from './legendStore';
+import { getLegendStrategy, injectLegendStrategy } from './legendStrategies/legendCollections';
+import { createLegendId } from './types/legendType';
+/**
+ * Public facade for the legend.
+ */
+export declare const legendFacade: Readonly<{
+    strategy: {
+        inject: typeof injectLegendStrategy;
+        get: typeof getLegendStrategy;
+    };
+    storeSnapshot: typeof legendSnapShot;
+    legend: {
+        createId: typeof createLegendId;
+        knownLegendIds: {
+            equipmentLegendId: import("./types/legendType").LegendId;
+            tagLegendId: import("./types/legendType").LegendId;
+            workOrderLegendId: import("./types/legendType").LegendId;
+        };
+        useBy: typeof useLegendById;
+        useAll: typeof useAllLegends;
+    };
+    visibleData: {
+        getBy: <T extends keyof {
+            Tag: import("./types/legendType").LegendTagId;
+            Equipment: import("./types/legendType").LegendEquipmentId;
+        }>(type: T) => {
+            Tag: import("./types/legendType").LegendTagId;
+            Equipment: import("./types/legendType").LegendEquipmentId;
+        }[T][];
+        getAll: () => import("./types/legendType").LegendDataId[];
+        useByType: <T extends keyof {
+            Tag: import("./types/legendType").LegendTagId;
+            Equipment: import("./types/legendType").LegendEquipmentId;
+        }>(type: T) => {
+            Tag: import("./types/legendType").LegendTagId;
+            Equipment: import("./types/legendType").LegendEquipmentId;
+        }[T][];
+        useAddWithAutoRemove: () => <T extends keyof {
+            Tag: import("./types/legendType").LegendTagId;
+            Equipment: import("./types/legendType").LegendEquipmentId;
+        }>(args: {
+            type: T;
+            key: string;
+            items: {
+                Tag: import("./types/legendType").LegendTagId;
+                Equipment: import("./types/legendType").LegendEquipmentId;
+            }[T][];
+            removePreviousItems?: boolean;
+        }) => void;
+    };
+}>;

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

@@ -0,0 +1,52 @@
+import { PersistOptions } from 'zustand/middleware';
+import { LegendId, LegendState } from './types/legendType';
+type LegendsDictionary = Record<LegendId, LegendState>;
+interface LegendStoreData {
+    legends: LegendsDictionary;
+}
+interface LegendStoreActions {
+    updateLegend: (legendId: LegendId, updates: Partial<LegendState>) => void;
+    setHiddenMarker: (args: {
+        legendId: LegendId;
+        marker: string;
+        isHidden: boolean;
+    }) => void;
+    setHiddenBadge: (args: {
+        legendId: LegendId;
+        badge: string;
+        isHidden: boolean;
+    }) => void;
+    getLegendById: (legendId: LegendId) => LegendState | undefined;
+}
+type LegendStore = LegendStoreData & LegendStoreActions;
+export declare const useLegendStore: import("zustand").UseBoundStore<Omit<Omit<Omit<Omit<import("zustand").StoreApi<LegendStore>, "setState"> & {
+    setState<A extends string | {
+        type: string;
+    }>(partial: LegendStore | Partial<LegendStore> | ((state: LegendStore) => LegendStore | Partial<LegendStore>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "subscribe"> & {
+    subscribe: {
+        (listener: (selectedState: LegendStore, previousSelectedState: LegendStore) => void): () => void;
+        <U>(selector: (state: LegendStore) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
+            equalityFn?: ((a: U, b: U) => boolean) | undefined;
+            fireImmediately?: boolean;
+        } | undefined): () => void;
+    };
+}, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<PersistOptions<LegendStore, LegendStore>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void> | void;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: LegendStore) => void) => () => void;
+        onFinishHydration: (fn: (state: LegendStore) => void) => () => void;
+        getOptions: () => Partial<PersistOptions<LegendStore, LegendStore>>;
+    };
+}, "setState"> & {
+    setState(nextStateOrUpdater: LegendStore | Partial<LegendStore> | ((state: import("immer").WritableDraft<LegendStore>) => void), shouldReplace?: boolean | undefined, action?: string | {
+        type: string;
+    } | undefined): void;
+}>;
+export declare function useLegendById(legendId: LegendId): LegendState;
+export declare function useAllLegends(): LegendState[];
+export declare function legendSnapShot(): LegendStore;
+export {};

package/src/lib/feature/legend/legendStrategies/legendCollections.d.ts

@@ -0,0 +1,4 @@
+import { LegendStrategy } from '../types/legendStrategy.type';
+import { LegendState } from '../types/legendType';
+export declare function injectLegendStrategy(strategy: LegendStrategy, properties: Partial<LegendState>): void;
+export declare function getLegendStrategy(strategyTypeName: string): LegendStrategy;

package/src/lib/feature/legend/legendStrategies/workOrderStrategy/WorkOrderLegend.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,2 @@
+export declare function subscribeToLegendDataChanged(): void;
+export declare const sleep: (ms: number) => Promise<unknown>;

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

@@ -0,0 +1,71 @@
+import { LegendDataId, LegendEquipmentId, LegendTagId } from './types/legendType';
+/**
+ * Maps (string) keyword to the data type.
+ * We don't have any other sources so far, pdf has TagNo and EquipmentId (ecm)
+ */
+type KnownDataTypes = {
+    Tag: LegendTagId;
+    Equipment: LegendEquipmentId;
+};
+type KnownDataTypeKeys = keyof KnownDataTypes;
+type ResolvedDataType<T extends KnownDataTypeKeys> = KnownDataTypes[T];
+/**
+ * Data structure:
+ * Data
+ * - Tag
+ *   - key1: [data1, data2, ...]
+ *   - key2: [data1, data2, ...]
+ * - Equipment
+ *   - key1: [data1, data2, ...]
+ * ...
+ */
+interface LegendVisibleData {
+    data: LegendVisibleDataState;
+}
+type LegendVisibleDataState = {
+    [K in KnownDataTypeKeys]: {
+        [key: string]: ResolvedDataType<K>[];
+    };
+};
+interface LegendVisibleDataStoreActions {
+    addData: <T extends KnownDataTypeKeys>(type: T, key: string, value: ResolvedDataType<T>[]) => void;
+    removeData: (key: string) => void;
+    getData: <T extends KnownDataTypeKeys>(type: T) => ResolvedDataType<T>[];
+    useDataByType: <T extends KnownDataTypeKeys>(type: T) => ResolvedDataType<T>[];
+    getAll(): LegendDataId[];
+}
+type LegendVisibleDataStore = LegendVisibleData & LegendVisibleDataStoreActions;
+export declare const useLegendVisibleDataStore: import("zustand").UseBoundStore<Omit<Omit<Omit<import("zustand").StoreApi<LegendVisibleDataStore>, "setState"> & {
+    setState<A extends string | {
+        type: string;
+    }>(partial: LegendVisibleDataStore | Partial<LegendVisibleDataStore> | ((state: LegendVisibleDataStore) => LegendVisibleDataStore | Partial<LegendVisibleDataStore>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "subscribe"> & {
+    subscribe: {
+        (listener: (selectedState: LegendVisibleDataStore, previousSelectedState: LegendVisibleDataStore) => void): () => void;
+        <U>(selector: (state: LegendVisibleDataStore) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
+            equalityFn?: ((a: U, b: U) => boolean) | undefined;
+            fireImmediately?: boolean;
+        } | undefined): () => void;
+    };
+}, "setState"> & {
+    setState(nextStateOrUpdater: LegendVisibleDataStore | Partial<LegendVisibleDataStore> | ((state: import("immer").WritableDraft<LegendVisibleDataStore>) => void), shouldReplace?: boolean | undefined, action?: string | {
+        type: string;
+    } | undefined): void;
+}>;
+/**
+ * Visible items are all items on screen that should be affected by the legend.
+ * @returns A function for adding visible items by type and key, which is automatically removed when the component unmounts.
+ */
+declare function useAddWithAutoRemove(): <T extends KnownDataTypeKeys>(args: {
+    type: T;
+    key: string;
+    items: ResolvedDataType<T>[];
+    removePreviousItems?: boolean;
+}) => void;
+export declare const visibleData: {
+    getBy: <T extends KnownDataTypeKeys>(type: T) => ResolvedDataType<T>[];
+    getAll: () => LegendDataId[];
+    useByType: <T extends KnownDataTypeKeys>(type: T) => ResolvedDataType<T>[];
+    useAddWithAutoRemove: typeof useAddWithAutoRemove;
+};
+export {};

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

@@ -0,0 +1,11 @@
+export interface Marker {
+    getTitle: () => string;
+    getColor: () => string;
+    getIcon: () => string;
+    badges: Badge[];
+}
+export declare function markerKey(marker: Marker): string;
+export interface Badge {
+    getColor: () => string;
+    getTitle: () => string;
+}

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

@@ -0,0 +1,37 @@
+import { Marker } from './legendMarkerBadge.type';
+import { LegendDataId, LegendId } from './legendType';
+/**
+ * A general interface for the legend strategy. This enables us to automatically render all the legend ui parts: the ui with selectable options, the markers & the badges.
+ * The specific implementation (like tagStrategy, equipmentStrategy, etc) will implement this, and inject it with legendFacade.injectLegendStrategy.
+ */
+export interface LegendStrategy {
+    /**
+     * A unique identifier for the legend. Use a friendly UI name since it's displayed in legend component.
+     */
+    legendId: LegendId;
+    /**
+     * not implemented yet TODO #155599 - Data Service
+     * Idea is to notify the legend that it should batch fetch data for the given visibleItemIds, and we will automatically show loading status in UI.
+     */
+    fetchData?: (visibleItemIds: ReadonlyArray<LegendDataId>) => Promise<void>;
+    /**
+     * Marker options that is selectable by the user.
+     */
+    markerOptions?: ReadonlyArray<string>;
+    /**
+     * Badge options that is selectable by the user.
+     */
+    badgeOptions?: ReadonlyArray<string>;
+    /**
+     * Returns ONE marker per itemId.
+     */
+    useMarkers: (itemIds: ReadonlyArray<LegendDataId>) => ReadonlyArray<Marker>;
+    /**
+     * Returns the paginable popover content for the given itemId. One tagId can for example have multiple work-orders.
+     */
+    popoverContent: (itemId: LegendDataId) => React.JSX.Element | ReadonlyArray<React.JSX.Element>;
+    /**
+     * Returns the custom legend component for the legend, if this is omitted the default basicLegendRenderer will be used
+     */
+    customLegendComponent?: () => React.JSX.Element;
+}

package/src/lib/feature/legend/types/legendType.d.ts

@@ -0,0 +1,26 @@
+import { Brand } from '@equinor/echo-utils';
+import { GlobalSelectionTypes } from '../../globalSelection';
+type TemporaryLegendIdsForTesting = 'Fake Tag Legend' | 'Work Orders with Custom UI';
+export type KnownLegendIds = 'Equipment' | TemporaryLegendIdsForTesting;
+export type LegendId = KnownLegendIds | Brand<string, 'LegendId'>;
+export declare function createLegendId(id: string): LegendId;
+export declare const knownLegendIds: {
+    equipmentLegendId: LegendId;
+    tagLegendId: LegendId;
+    workOrderLegendId: LegendId;
+};
+export interface LegendState {
+    legendId: LegendId;
+    isEnabled: boolean;
+    isLoading: boolean;
+    hiddenMarkers: string[];
+    hiddenBadges: string[];
+    selectedMarkerOption: string;
+    selectedBadgeOption: string;
+    isExpanded: boolean;
+}
+export type LegendTagId = GlobalSelectionTypes.TagId;
+export type LegendEquipmentId = GlobalSelectionTypes.EquipmentId;
+export type LegendWorkOrderId = GlobalSelectionTypes.WorkOrderId;
+export type LegendDataId = LegendTagId | LegendEquipmentId | LegendWorkOrderId;
+export {};