@databiosphere/findable-ui 34.0.0 → 35.0.1

package/lib/providers/exploreState/actions/urlToState/dispatch.js

@@ -0,0 +1,12 @@
+import { ExploreActionKind } from "../../../exploreState";
+/**
+ * Action creator for URL >> state sync.
+ * @param payload - Payload.
+ * @returns Action with payload and action type.
+ */
+export function urlToState(payload) {
+    return {
+        payload,
+        type: ExploreActionKind.UrlToState,
+    };
+}

package/lib/providers/exploreState/actions/urlToState/types.d.ts

@@ -0,0 +1,9 @@
+import { NextRouter } from "next/router";
+import { ExploreActionKind } from "../../../exploreState";
+export type UrlToStateAction = {
+    payload: UrlToStatePayload;
+    type: ExploreActionKind.UrlToState;
+};
+export type UrlToStatePayload = {
+    query: NextRouter["query"];
+};

package/lib/providers/exploreState/actions/urlToState/types.js

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

package/lib/providers/exploreState/actions/urlToState/utils.d.ts

@@ -0,0 +1,7 @@
+import { SelectedFilter } from "../../../../common/entities";
+/**
+ * Returns the selected filters from the filter parameter value.
+ * @param paramValue - The filter parameter value.
+ * @returns The selected filters or an empty array.
+ */
+export declare function decodeFilterParamValue(paramValue: string | string[] | undefined): SelectedFilter[];

package/lib/providers/exploreState/actions/urlToState/utils.js

@@ -0,0 +1,13 @@
+/**
+ * Returns the selected filters from the filter parameter value.
+ * @param paramValue - The filter parameter value.
+ * @returns The selected filters or an empty array.
+ */
+export function decodeFilterParamValue(paramValue) {
+    if (typeof paramValue === "string") {
+        // Return decoded filter param value if it is a string.
+        return JSON.parse(decodeURIComponent(paramValue));
+    }
+    // Default to an empty array.
+    return [];
+}

package/lib/providers/exploreState/entities/query/buildQuery.d.ts

@@ -0,0 +1,30 @@
+import { NextRouter } from "next/router";
+import { SelectedFilter } from "../../../../common/entities";
+import { EntityState } from "../types";
+/**
+ * Builds a query object from entity related state.
+ * State values are expected to be undefined, string, or an array.
+ * Undefined values and empty arrays are not included in the query.
+ * @param entityListType - Entity list type.
+ * @param state - Entity related state.
+ * @returns A query object.
+ */
+export declare function buildQuery(entityListType: string, state: EntityState): NextRouter["query"];
+/**
+ * Extracts URL-relevant values from the ExploreState for query parameter synchronization.
+ *
+ * This function maps specific properties from the full ExploreState to the
+ * ExploreQueryState interface, which contains only the subset of state that
+ * should be synchronized with the URL.
+ *
+ * The extracted properties are:
+ * - catalog: Current catalog selection (string | undefined)
+ * - entityListType: Entity list type (string)
+ * - ff: Feature flag state (string | undefined)
+ * - filter: Applied filters (SelectedFilter[])
+ *
+ * @param entityListType - Entity list type.
+ * @param state - Entity related state.
+ * @returns Subset of state used for URL query parameters.
+ */
+export declare function getQueryState(entityListType: string, state: EntityState): Record<string, string | SelectedFilter[] | undefined>;

package/lib/providers/exploreState/entities/query/buildQuery.js

@@ -0,0 +1,51 @@
+/**
+ * Builds a query object from entity related state.
+ * State values are expected to be undefined, string, or an array.
+ * Undefined values and empty arrays are not included in the query.
+ * @param entityListType - Entity list type.
+ * @param state - Entity related state.
+ * @returns A query object.
+ */
+export function buildQuery(entityListType, state) {
+    const query = {};
+    for (const [key, value] of Object.entries(getQueryState(entityListType, state))) {
+        // Handle the undefined case.
+        if (value === undefined)
+            continue;
+        // Handle the string case.
+        if (typeof value === "string") {
+            query[key] = value;
+            continue;
+        }
+        // Handle the array case.
+        if (value.length === 0)
+            continue;
+        query[key] = JSON.stringify(value);
+    }
+    return query;
+}
+/**
+ * Extracts URL-relevant values from the ExploreState for query parameter synchronization.
+ *
+ * This function maps specific properties from the full ExploreState to the
+ * ExploreQueryState interface, which contains only the subset of state that
+ * should be synchronized with the URL.
+ *
+ * The extracted properties are:
+ * - catalog: Current catalog selection (string | undefined)
+ * - entityListType: Entity list type (string)
+ * - ff: Feature flag state (string | undefined)
+ * - filter: Applied filters (SelectedFilter[])
+ *
+ * @param entityListType - Entity list type.
+ * @param state - Entity related state.
+ * @returns Subset of state used for URL query parameters.
+ */
+export function getQueryState(entityListType, state) {
+    return {
+        catalog: state.catalogState,
+        entityListType,
+        ff: state.featureFlagState,
+        filter: state.filterState,
+    };
+}

package/lib/providers/exploreState/entities/state.d.ts

@@ -0,0 +1,10 @@
+import { ExploreState } from "../../exploreState";
+import { EntitiesContext, EntityState } from "./types";
+/**
+ * Builds the next entities context.
+ * @param state - State.
+ * @param entityListType - Entity list type.
+ * @param nextEntityState - Next entity state.
+ * @returns Next entities context.
+ */
+export declare function buildNextEntities(state: ExploreState, entityListType: string, nextEntityState: Pick<EntityState, "filterState">): EntitiesContext;

package/lib/providers/exploreState/entities/state.js

@@ -0,0 +1,36 @@
+import { buildQuery } from "./query/buildQuery";
+/**
+ * Builds the next entities context.
+ * @param state - State.
+ * @param entityListType - Entity list type.
+ * @param nextEntityState - Next entity state.
+ * @returns Next entities context.
+ */
+export function buildNextEntities(state, entityListType, nextEntityState) {
+    // Get the entity key for the current entity.
+    // Other entities may share the same key and therefore filter state.
+    const key = state.entities[entityListType].entityKey;
+    const entities = {};
+    for (const [entityPath, entity] of Object.entries(state.entities)) {
+        // Grab the entity key for the entity.
+        const entityKey = entity.entityKey;
+        if (entityKey !== key) {
+            // For entities that do not share the same key, leave the context unchanged.
+            entities[entityPath] = entity;
+            continue;
+        }
+        // Clone the entity context.
+        const entityContext = { ...entity };
+        // Update entity context with "shared" context (e.g. filterState).
+        entityContext.query = buildQuery(entityPath, {
+            ...nextEntityState,
+            catalogState: state.catalogState,
+            featureFlagState: state.featureFlagState,
+        });
+        // At some point, we may need to update the entity context with additional properties that
+        // are not "shared" (e.g. column grouping).
+        // For now, this is not needed and so we update entities with the updated entity context and continue.
+        entities[entityPath] = entityContext;
+    }
+    return entities;
+}

package/lib/providers/exploreState/entities/types.d.ts

@@ -0,0 +1,16 @@
+import { NextRouter } from "next/router";
+import { SelectedFilter } from "../../../common/entities";
+import { EntityPath } from "../../../config/entities";
+import { CatalogState, FeatureFlagState } from "../../exploreState";
+export interface EntitiesContext {
+    [key: EntityPath]: EntityContext;
+}
+export interface EntityContext {
+    entityKey: string;
+    query: NextRouter["query"];
+}
+export interface EntityState {
+    catalogState: CatalogState;
+    featureFlagState: FeatureFlagState;
+    filterState: SelectedFilter[];
+}

package/lib/providers/exploreState/entities/types.js

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

package/lib/providers/exploreState/entities.d.ts

@@ -4,7 +4,7 @@ import { CategoryView } from "../../common/categories/views/types";
 import { CategoryValueKey, SelectCategory, SelectedFilter } from "../../common/entities";
 import { RowPreviewState } from "../../components/Table/features/RowPreview/entities";
 import { CategoryGroup, CategoryGroupConfig, EntityPath, SavedFilter } from "../../config/entities";
-import { META_COMMAND } from "./hooks/UseMetaCommands/types";
+import { META_COMMAND } from "../../hooks/stateSyncManager/hooks/UseMetaCommands/types";
 export interface EntityPageState {
     categoryGroupConfigKey: CategoryGroupConfigKey;
     columnVisibility: VisibilityState;

package/lib/providers/exploreState/initializer/constants.js

@@ -22,6 +22,7 @@ export const DEFAULT_PAGINATION_STATE = {
 export const INITIAL_STATE = {
     catalogState: undefined,
     categoryViews: [],
+    entities: {},
     entityPageState: {},
     entityStateByCategoryGroupConfigKey: new Map(),
     featureFlagState: undefined,

package/lib/providers/exploreState/initializer/utils.js

@@ -1,5 +1,6 @@
 import { getInitialColumnVisibilityState } from "../../../components/TableCreator/options/initialState/columnVisibility";
 import { SELECT_CATEGORY_KEY } from "../constants";
+import { buildNextEntities } from "../entities/state";
 import { getEntityCategoryGroupConfigKey, getFilterCount } from "../utils";
 import { DEFAULT_CATEGORY_GROUP_SAVED_FILTERS, DEFAULT_ENTITY_STATE, INITIAL_STATE, } from "./constants";
 /**
@@ -130,6 +131,22 @@ function initEntityPageState(config) {
         };
     }, {});
 }
+/**
+ * Initializes entities context.
+ * @param entityPageState - Entity page state.
+ * @returns Entities context.
+ */
+function initEntities(entityPageState) {
+    return Object.keys(entityPageState).reduce((acc, entityPath) => {
+        return {
+            ...acc,
+            [entityPath]: {
+                entityKey: entityPageState[entityPath].categoryGroupConfigKey,
+                query: {},
+            },
+        };
+    }, {});
+}
 /**
  * Initializes entity state by category group config key.
  * @param config - Site config.
@@ -209,10 +226,13 @@ export function initReducerArguments(config, entityListType, decodedFilterParam,
     const categoryGroupConfigKey = getEntityCategoryGroupConfigKey(entityListType, entityPageState);
     const entityStateByCategoryGroupConfigKey = initEntityStateByCategoryGroupConfigKey(config, categoryGroupConfigKey, filterState);
     const categoryGroups = initCategoryGroups(entityStateByCategoryGroupConfigKey, categoryGroupConfigKey);
-    return {
+    const entities = initEntities(entityPageState);
+    // Initialize state.
+    const state = {
         ...INITIAL_STATE,
         catalogState: decodedCatalogParam,
         categoryGroups,
+        entities,
         entityPageState,
         entityStateByCategoryGroupConfigKey,
         featureFlagState: decodedFeatureFlagParam,
@@ -220,4 +240,9 @@ export function initReducerArguments(config, entityListType, decodedFilterParam,
         filterState,
         tabValue: entityListType,
     };
+    // Return state with entities (updated by initial state).
+    return {
+        ...state,
+        entities: buildNextEntities(state, entityListType, { filterState }),
+    };
 }

package/lib/providers/exploreState.d.ts

@@ -5,10 +5,12 @@ import { SelectedFilter } from "../common/entities";
 import { RowPreviewState } from "../components/Table/features/RowPreview/entities";
 import { CategoryGroup, SiteConfig } from "../config/entities";
 import { ClearMetaAction } from "./exploreState/actions/clearMeta/types";
-import { SyncStateFromUrlAction } from "./exploreState/actions/syncStateFromUrl/types";
+import { StateToUrlAction } from "./exploreState/actions/stateToUrl/types";
 import { UpdateGroupingAction } from "./exploreState/actions/updateGrouping/types";
 import { UpdateColumnVisibilityAction } from "./exploreState/actions/updateVisibility/types";
+import { UrlToStateAction } from "./exploreState/actions/urlToState/types";
 import { EntityPageStateMapper, EntityStateByCategoryGroupConfigKey, ListItem, Meta } from "./exploreState/entities";
+import { EntitiesContext } from "./exploreState/entities/types";
 import { ApplySavedFilterPayload, PaginateTablePayload, PatchExploreResponsePayload, ProcessExploreResponsePayload, ResetExploreResponsePayload, UpdateEntityFiltersPayload, UpdateEntityViewAccessPayload, UpdateFilterPayload, UpdateRowPreviewPayload, UpdateRowSelectionPayload, UpdateSortingPayload } from "./exploreState/payloads/entities";
 export type CatalogState = string | undefined;
 /**
@@ -25,6 +27,7 @@ export type ExploreState = {
     catalogState: CatalogState;
     categoryGroups?: CategoryGroup[];
     categoryViews: CategoryView[];
+    entities: EntitiesContext;
     entityPageState: EntityPageStateMapper;
     entityStateByCategoryGroupConfigKey: EntityStateByCategoryGroupConfigKey;
     featureFlagState: FeatureFlagState;
@@ -106,7 +109,7 @@ export declare enum ExploreActionKind {
     ResetExploreResponse = "RESET_EXPLORE_RESPONSE",
     ResetState = "RESET_STATE",
     SelectEntityType = "SELECT_ENTITY_TYPE",
-    SyncStateFromUrl = "SYNC_STATE_FROM_URL",
+    StateToUrl = "STATE_TO_URL",
     UpdateColumnVisibility = "UPDATE_COLUMN_VISIBILITY",
     UpdateEntityFilters = "UPDATE_ENTITY_FILTERS",
     UpdateEntityViewAccess = "UPDATE_ENTITY_VIEW_ACCESS",
@@ -114,12 +117,13 @@ export declare enum ExploreActionKind {
     UpdateGrouping = "UPDATE_GROUPING",
     UpdateRowPreview = "UPDATE_ROW_PREVIEW",
     UpdateRowSelection = "UPDATE_ROW_SELECTION",
-    UpdateSorting = "UPDATE_SORTING"
+    UpdateSorting = "UPDATE_SORTING",
+    UrlToState = "URL_TO_STATE"
 }
 /**
  * Explore action.
  */
-export type ExploreAction = ApplySavedFilterAction | ClearFiltersAction | ClearMetaAction | PaginateTableAction | PatchExploreResponseAction | ProcessExploreResponseAction | ResetExploreResponseAction | ResetStateAction | SelectEntityTypeAction | SyncStateFromUrlAction | UpdateColumnVisibilityAction | UpdateEntityFiltersAction | UpdateEntityViewAccessAction | UpdateFilterAction | UpdateGroupingAction | UpdateRowPreviewAction | UpdateRowSelectionAction | UpdateSortingAction;
+export type ExploreAction = ApplySavedFilterAction | ClearFiltersAction | ClearMetaAction | PaginateTableAction | PatchExploreResponseAction | ProcessExploreResponseAction | ResetExploreResponseAction | ResetStateAction | SelectEntityTypeAction | StateToUrlAction | UpdateColumnVisibilityAction | UpdateEntityFiltersAction | UpdateEntityViewAccessAction | UpdateFilterAction | UpdateGroupingAction | UpdateRowPreviewAction | UpdateRowSelectionAction | UpdateSortingAction | UrlToStateAction;
 /**
  * Apply saved filter action.
  */

package/lib/providers/exploreState.js

@@ -1,15 +1,15 @@
 import React, { createContext, useEffect, useMemo, useReducer, useState, } from "react";
 import { useToken } from "../hooks/authentication/token/useToken";
+import { META_COMMAND } from "../hooks/stateSyncManager/hooks/UseMetaCommands/types";
 import { buildCategoryViews, buildNextFilterState, } from "../hooks/useCategoryFilter";
 import { useConfig } from "../hooks/useConfig";
 import { useURLFilterParams } from "../hooks/useURLFilterParams";
 import { clearMetaAction } from "./exploreState/actions/clearMeta/action";
-import { syncStateFromUrlAction } from "./exploreState/actions/syncStateFromUrl/action";
+import { stateToUrlAction } from "./exploreState/actions/stateToUrl/action";
 import { updateGroupingAction } from "./exploreState/actions/updateGrouping/action";
 import { updateColumnVisibilityAction } from "./exploreState/actions/updateVisibility/action";
-import { useBeforePopState } from "./exploreState/hooks/UseBeforePopState/useBeforePopState";
-import { META_COMMAND } from "./exploreState/hooks/UseMetaCommands/types";
-import { useMetaCommands } from "./exploreState/hooks/UseMetaCommands/useMetaCommands";
+import { urlToStateAction } from "./exploreState/actions/urlToState/action";
+import { buildNextEntities } from "./exploreState/entities/state";
 import { DEFAULT_PAGINATION_STATE, INITIAL_STATE, } from "./exploreState/initializer/constants";
 import { initReducerArguments } from "./exploreState/initializer/utils";
 import { buildEntityStateSavedFilterState, buildNextSavedFilterState, closeRowPreview, getEntityCategoryGroupConfigKey, getEntityState, getEntityStateSavedProperty, getFilterCount, patchEntityListItems, resetPage, updateEntityPageState, updateEntityPageStateWithCommonCategoryGroupConfigKey, updateEntityStateByCategoryGroupConfigKey, updateSelectColumnVisibility, } from "./exploreState/utils";
@@ -56,10 +56,6 @@ export function ExploreStateProvider({ children, entityListType, }) {
             type: ExploreActionKind.ResetExploreResponse,
         });
     }, [exploreDispatch, token]);
-    // Meta-command related side effects.
-    useMetaCommands({ exploreDispatch, exploreState });
-    // Before pop state related side effects (forward / backward navigation by browser buttons).
-    useBeforePopState({ exploreDispatch, exploreState });
     return (React.createElement(ExploreStateContext.Provider, { value: exploreContextValue }, children));
 }
 /**
@@ -76,7 +72,7 @@ export var ExploreActionKind;
     ExploreActionKind["ResetExploreResponse"] = "RESET_EXPLORE_RESPONSE";
     ExploreActionKind["ResetState"] = "RESET_STATE";
     ExploreActionKind["SelectEntityType"] = "SELECT_ENTITY_TYPE";
-    ExploreActionKind["SyncStateFromUrl"] = "SYNC_STATE_FROM_URL";
+    ExploreActionKind["StateToUrl"] = "STATE_TO_URL";
     ExploreActionKind["UpdateColumnVisibility"] = "UPDATE_COLUMN_VISIBILITY";
     ExploreActionKind["UpdateEntityFilters"] = "UPDATE_ENTITY_FILTERS";
     ExploreActionKind["UpdateEntityViewAccess"] = "UPDATE_ENTITY_VIEW_ACCESS";
@@ -85,6 +81,7 @@ export var ExploreActionKind;
     ExploreActionKind["UpdateRowPreview"] = "UPDATE_ROW_PREVIEW";
     ExploreActionKind["UpdateRowSelection"] = "UPDATE_ROW_SELECTION";
     ExploreActionKind["UpdateSorting"] = "UPDATE_SORTING";
+    ExploreActionKind["UrlToState"] = "URL_TO_STATE";
 })(ExploreActionKind || (ExploreActionKind = {}));
 /**
  * Explore reducer.
@@ -115,10 +112,11 @@ function exploreReducer(state, action, exploreContext) {
             });
             return {
                 ...state,
+                entities: buildNextEntities(state, state.tabValue, { filterState }),
                 entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(state, { grouping, rowPreview, rowSelection, sorting }),
                 filterCount: getFilterCount(filterState),
                 filterState,
-                meta: { command: META_COMMAND.NAVIGATE_TO_FILTERS },
+                meta: { command: META_COMMAND.STATE_TO_URL_PUSH },
                 paginationState: resetPage(state.paginationState),
                 rowPreview,
             };
@@ -138,10 +136,11 @@ function exploreReducer(state, action, exploreContext) {
             });
             return {
                 ...state,
+                entities: buildNextEntities(state, state.tabValue, { filterState }),
                 entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(state, { rowPreview, rowSelection }),
                 filterCount,
                 filterState,
-                meta: { command: META_COMMAND.NAVIGATE_TO_FILTERS },
+                meta: { command: META_COMMAND.STATE_TO_URL_PUSH },
                 paginationState: resetPage(state.paginationState),
                 rowPreview,
             };
@@ -233,8 +232,7 @@ function exploreReducer(state, action, exploreContext) {
          **/
         case ExploreActionKind.SelectEntityType: {
             if (payload === state.tabValue) {
-                // Update meta to match command "REPLACE_TO_FILTERS" - facilitates navigation to filters on return back to entity from elsewhere.
-                return { ...state, meta: { command: META_COMMAND.REPLACE_TO_FILTERS } };
+                return state;
             }
             const entityState = getEntityState(state, getEntityCategoryGroupConfigKey(payload, state.entityPageState));
             const rowPreview = closeRowPreview(state.rowPreview); // Close row preview, without updating the entity page state row preview.
@@ -246,17 +244,16 @@ function exploreReducer(state, action, exploreContext) {
                 filterState: entityState.filterState,
                 listItems: [],
                 loading: true,
-                meta: { command: META_COMMAND.REPLACE_TO_FILTERS },
                 paginationState: { ...resetPage(state.paginationState), rows: 0 },
                 rowPreview,
                 tabValue: payload,
             };
         }
         /**
-         * Sync state from URL.
+         * State >> URL sync
          */
-        case ExploreActionKind.SyncStateFromUrl: {
-            return syncStateFromUrlAction(state, payload);
+        case ExploreActionKind.StateToUrl: {
+            return stateToUrlAction(state, payload);
         }
         /**
          * Update column visibility
@@ -287,6 +284,7 @@ function exploreReducer(state, action, exploreContext) {
             }, categoryGroupConfigKey);
             return {
                 ...state,
+                entities: buildNextEntities(state, entityListType, { filterState }),
                 entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(state, { grouping, rowPreview, rowSelection, sorting }, categoryGroupConfigKey),
                 rowPreview: closeRowPreview(state.rowPreview),
                 ...(payload.entityListType === state.tabValue
@@ -321,10 +319,11 @@ function exploreReducer(state, action, exploreContext) {
             });
             return {
                 ...state,
+                entities: buildNextEntities(state, state.tabValue, { filterState }),
                 entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(state, { rowPreview, rowSelection }),
                 filterCount: getFilterCount(filterState),
                 filterState,
-                meta: { command: META_COMMAND.NAVIGATE_TO_FILTERS },
+                meta: { command: META_COMMAND.STATE_TO_URL_PUSH },
                 paginationState: resetPage(state.paginationState),
                 rowPreview,
             };
@@ -369,6 +368,12 @@ function exploreReducer(state, action, exploreContext) {
                 rowPreview,
             };
         }
+        /**
+         * URL >> state sync.
+         */
+        case ExploreActionKind.UrlToState: {
+            return urlToStateAction(state, payload);
+        }
         default:
             return state;
     }

package/lib/providers/layoutState.d.ts

@@ -0,0 +1,40 @@
+import React, { Dispatch, ReactNode } from "react";
+export declare const DEFAULT_LAYOUT_STATE: {
+    headerHeight: number;
+};
+/**
+ * Layout state.
+ */
+export type LayoutState = {
+    headerHeight: number;
+};
+/**
+ * Model of layout state context.
+ */
+export type LayoutStateContextProps = {
+    layoutDispatch: Dispatch<LayoutAction>;
+    layoutState: LayoutState;
+};
+export declare const LayoutStateContext: React.Context<LayoutStateContextProps>;
+export interface LayoutStateProps {
+    children: ReactNode | ReactNode[];
+}
+export declare function LayoutStateProvider({ children, }: LayoutStateProps): JSX.Element;
+/**
+ * Layout action kind.
+ */
+export declare enum LayoutActionKind {
+    UpdateHeaderHeight = "UPDATE_HEADER_HEIGHT"
+}
+/**
+ * Layout action.
+ */
+export type LayoutAction = UpdateHeaderHeightAction;
+/**
+ * Update header height action.
+ */
+type UpdateHeaderHeightAction = {
+    payload?: number;
+    type: LayoutActionKind.UpdateHeaderHeight;
+};
+export {};

package/lib/providers/layoutState.js

@@ -0,0 +1,47 @@
+import React, { createContext, useReducer } from "react";
+import { HEADER_HEIGHT } from "../components/Layout/components/Header/common/constants";
+// Default layout state.
+export const DEFAULT_LAYOUT_STATE = {
+    headerHeight: HEADER_HEIGHT + 1, // 1px for bottom border.
+};
+export const LayoutStateContext = createContext({
+    // eslint-disable-next-line @typescript-eslint/no-empty-function -- allow dummy function for default state.
+    layoutDispatch: () => { },
+    layoutState: DEFAULT_LAYOUT_STATE,
+});
+export function LayoutStateProvider({ children, }) {
+    // Layout state.
+    const [layoutState, layoutDispatch] = useReducer((s, a) => layoutReducer(s, a), DEFAULT_LAYOUT_STATE);
+    return (React.createElement(LayoutStateContext.Provider, { value: {
+            layoutDispatch,
+            layoutState,
+        } }, children));
+}
+/**
+ * Layout action kind.
+ */
+export var LayoutActionKind;
+(function (LayoutActionKind) {
+    LayoutActionKind["UpdateHeaderHeight"] = "UPDATE_HEADER_HEIGHT";
+})(LayoutActionKind || (LayoutActionKind = {}));
+/**
+ * Layout reducer.
+ * @param state - Layout state.
+ * @param action - Layout action.
+ * @returns layout state.
+ */
+function layoutReducer(state, action) {
+    const { payload, type } = action;
+    // eslint-disable-next-line sonarjs/no-small-switch -- allow small switch.
+    switch (type) {
+        // Updates header height.
+        case LayoutActionKind.UpdateHeaderHeight: {
+            return {
+                ...state,
+                headerHeight: payload ?? state.headerHeight,
+            };
+        }
+        default:
+            return state;
+    }
+}

package/lib/providers/services/provider.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+/**
+ * ServicesProvider is a component that initializes and provides access to various service-related
+ * functionality throughout the application.
+ *
+ * This provider:
+ * 1. Registers the pop state bus to handle browser navigation events.
+ * 2. Provides the WasPopProvider context to track browser back/forward navigation
+ *
+ * This provider should be placed at the _app root level to ensure all components have access to these services.
+ */
+export declare function ServicesProvider({ children, }: {
+    children: ReactNode;
+}): JSX.Element;

package/lib/providers/services/provider.js

@@ -0,0 +1,18 @@
+import React from "react";
+import { usePopStateBus } from "../../services/beforePopState/usePopStateBus";
+import { WasPopProvider } from "./wasPop/provider";
+/**
+ * ServicesProvider is a component that initializes and provides access to various service-related
+ * functionality throughout the application.
+ *
+ * This provider:
+ * 1. Registers the pop state bus to handle browser navigation events.
+ * 2. Provides the WasPopProvider context to track browser back/forward navigation
+ *
+ * This provider should be placed at the _app root level to ensure all components have access to these services.
+ */
+export function ServicesProvider({ children, }) {
+    // Register the pop state bus.
+    usePopStateBus();
+    return React.createElement(WasPopProvider, null, children);
+}

package/lib/providers/services/wasPop/context.d.ts

@@ -0,0 +1,2 @@
+import { WasPopContextProps } from "./types";
+export declare const WasPopContext: import("react").Context<WasPopContextProps>;

package/lib/providers/services/wasPop/context.js

@@ -0,0 +1,5 @@
+import { createContext } from "react";
+export const WasPopContext = createContext({
+    onClearPopRef: () => { },
+    popRef: { current: undefined },
+});

package/lib/providers/services/wasPop/hook.d.ts

@@ -0,0 +1,2 @@
+import { WasPopContextProps } from "./types";
+export declare const useWasPop: () => WasPopContextProps;

package/lib/providers/services/wasPop/hook.js

@@ -0,0 +1,5 @@
+import { useContext } from "react";
+import { WasPopContext } from "./context";
+export const useWasPop = () => {
+    return useContext(WasPopContext);
+};

package/lib/providers/services/wasPop/provider.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from "react";
+/**
+ * WasPopProvider tracks browser navigation events to determine if the current route change
+ * was triggered by a popstate event (browser back/forward navigation).
+ *
+ * This provider:
+ * 1. Registers callbacks for route change events.
+ * 2. Tracks when navigation occurs via browser back/forward buttons
+ * 3. Provides this state via context to child components
+ *
+ * This allows components to respond differently to user-initiated navigation versus
+ * browser history navigation.
+ */
+export declare function WasPopProvider({ children, }: {
+    children: ReactNode;
+}): JSX.Element;