@sandlada/mdc
Version:
@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.
64 lines • 2.19 kB
TypeScript
/**
* @license
* Copyright 2026 Kai-Orion & Sandlada
* SPDX-License-Identifier: MIT
*
* @fileoverview
* Scope-based navigation state store used to synchronize navigation tabs
* across containers such as bar, rail, and drawer.
*
* @example
* ```ts
* import { GlobalNavigationStateStore } from '@sandlada/mdc/utils'
*
* const unsubscribe = GlobalNavigationStateStore.subscribe('main-nav', (mutation) => {
* console.log(mutation.activeValue, mutation.source, mutation.trigger)
* })
*
* GlobalNavigationStateStore.setActive('main-nav', '/home', {
* source: 'user',
* trigger: 'pointer',
* })
*
* unsubscribe()
* ```
*/
export type NavigationEventSource = 'user' | 'external';
export type NavigationEventTrigger = 'pointer' | 'keyboard' | 'programmatic';
export interface NavigationSetActiveOptions {
source?: NavigationEventSource;
trigger?: NavigationEventTrigger;
originId?: string | null;
}
export interface NavigationScopeMutation {
scope: string;
activeValue: string | null;
previousValue: string | null;
changed: boolean;
source: NavigationEventSource;
trigger: NavigationEventTrigger;
originId: string | null;
mutationId: number;
}
export type NavigationScopeListener = (mutation: NavigationScopeMutation) => void;
export declare class NavigationStateStore {
private constructor();
private static _Instance;
static get Instance(): NavigationStateStore;
private mutationCounter;
private readonly scopes;
/** Returns the current active value for a given scope. */
getActive(scope: string): string | null;
/**
* Subscribes to all mutations within a scope and returns an unsubscribe
* callback.
*/
subscribe(scope: string, listener: NavigationScopeListener): () => void;
setActive(scope: string, value: string | null, options?: NavigationSetActiveOptions): NavigationScopeMutation;
/** Removes all state and listeners for a scope. */
clearScope(scope: string): void;
private normalizeScope;
private getOrCreateScope;
}
export declare const GlobalNavigationStateStore: NavigationStateStore;
//# sourceMappingURL=navigation-state-store.d.ts.map