@ds-mo/ui 12.8.0 → 13.0.0

package/dist/types/components/ShellApp/ShellApp.d.ts

@@ -1,8 +1,20 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import type { NavChromeStyle } from '../../shell/nav-chrome';
+import type { PanelToolsToolId } from '../PanelTools/panel-tools-types';
+import type { BreadcrumbSelectDetail } from '../Breadcrumb/breadcrumb-types';
 import { type ShellGradientPreset } from '../../shell/shell-gradient-presets';
 import { type MobileDestination, type ShellResponsiveMode } from '../../shell/shell-responsive';
+import type { PanelNavUserActionDetail } from '../PanelNav/panel-nav-types';
+import type { ShellAppComposition, ShellNavigationConfig, ShellPageChromeConfig, ShellToolsConfig } from './shell-app-types';
 export declare class ShellApp {
+    /** Managed renders the complete responsive chrome; slotted exposes the advanced composition. */
+    composition: ShellAppComposition;
+    /** Router-owned navigation data used by managed composition. */
+    navigation: ShellNavigationConfig;
+    /** Route-owned page title and section data used by managed composition. */
+    pageChrome: ShellPageChromeConfig;
+    /** Product-owned global tool definitions used by managed composition. */
+    tools: ShellToolsConfig;
     /** Chrome style propagated to slotted `ds-panel-nav` and `ds-bar-nav`. */
     navStyle: NavChromeStyle;
     /**
@@ -20,9 +32,52 @@ export declare class ShellApp {
     dsResponsiveModeChange: EventEmitter<{
         mode: ShellResponsiveMode;
     }>;
+    /** Managed primary-navigation intent; the application router performs navigation. */
+    dsNavSelect: EventEmitter<string>;
+    /** Managed desktop BarNav or mobile section-selection intent. */
+    dsTabChange: EventEmitter<string>;
+    /** Managed page-subsection intent from BarTitle or MobileHeader. */
+    dsSubsectionChange: EventEmitter<string>;
+    /** Managed page-level Back intent. */
+    dsPageBack: EventEmitter<MouseEvent>;
+    /** Managed breadcrumb intent from BarTitle. */
+    dsBreadcrumbSelect: EventEmitter<BreadcrumbSelectDetail>;
+    /** Managed page action intent from BarTitle. */
+    dsPageAction: EventEmitter<string>;
+    /** Managed tools selection state. */
+    dsToolChange: EventEmitter<{
+        id: PanelToolsToolId;
+        selected: boolean;
+    }>;
+    /** Managed tool-header Back intent. */
+    dsHeaderBack: EventEmitter<{
+        tool: PanelToolsToolId;
+    }>;
+    /** Managed tool-header action intent. */
+    dsHeaderAction: EventEmitter<{
+        tool: PanelToolsToolId;
+        id: string;
+    }>;
+    /** Managed drawer/fullscreen presentation state. */
+    dsPresentationChange: EventEmitter<{
+        presentation: 'drawer' | 'fullscreen';
+    }>;
+    /** Managed mobile Dashboard/Settings browsing intent. */
+    dsBrowseContextChange: EventEmitter<NavChromeStyle>;
+    /** Managed account-footer action intent. */
+    dsNavFooterAction: EventEmitter<void>;
+    /** Managed user/account trigger intent. */
+    dsNavUserAction: EventEmitter<PanelNavUserActionDetail>;
     el: HTMLElement;
     private toolsFullscreen;
     private resolvedMode;
+    private managedToolsOpen;
+    private managedActiveTool;
+    private managedToolPresentation;
+    private managedMobileDestination;
+    private managedMobileSheetNavOpen;
+    private managedInboxTool;
+    private managedBrowseContext;
     private resizeObserver;
     private hasLoaded;
     private readonly panelNavTransition;
@@ -32,6 +87,12 @@ export declare class ShellApp {
     private cachedViewportHeight;
     private onWindowResize;
     private onVisualViewportChange;
+    private get managed();
+    private get effectiveMobileDestination();
+    private get effectiveMobileSheetNavOpen();
+    private get resolvedNavigationGroups();
+    private get resolvedToolItems();
+    private get availableInboxTools();
     componentWillLoad(): void;
     componentDidLoad(): void;
     handleToolsPresentation(event: CustomEvent<{
@@ -39,6 +100,8 @@ export declare class ShellApp {
     }>): void;
     disconnectedCallback(): void;
     onShellPropsChange(): void;
+    handleNavigationChange(): void;
+    handleToolsChange(): void;
     onMobileStateChange(_next: unknown, previous: unknown): void;
     private updateResponsiveMode;
     private onChromeTransitionStart;
@@ -60,7 +123,42 @@ export declare class ShellApp {
     private resolveViewportDimensions;
     private chromeLayerActive;
     handleWindowKeyDown(e: KeyboardEvent): void;
+    /** Open or toggle a managed global tool from application-owned UI. */
+    activateTool(id: PanelToolsToolId): Promise<void>;
+    /** Close whichever managed global surface is currently visible. */
+    closeGlobalSurface(): Promise<void>;
+    /** Request drawer or fullscreen presentation for the active managed tool. */
+    setToolPresentation(presentation: 'drawer' | 'fullscreen'): Promise<void>;
+    private handleManagedNavSelect;
+    private handleManagedTabChange;
+    private handleManagedPageBack;
+    private handleManagedBreadcrumbSelect;
+    private handleManagedSubsectionChange;
+    private handleManagedPageAction;
+    private handleManagedToolChange;
+    private handleManagedPresentationChange;
+    private handleManagedHeaderBack;
+    private handleManagedHeaderAction;
+    private handleManagedSheetToggle;
+    private handleManagedMobileDestination;
+    private handleManagedAreaSelect;
+    private handleManagedBrowseContext;
+    private handleManagedSheetClose;
+    private handleManagedNavFooterAction;
+    private handleManagedNavUserAction;
+    private get currentArea();
+    private toolDot;
     private syncChrome;
+    private renderManagedPanelNav;
+    private renderManagedBarNav;
+    private renderManagedToolSlots;
+    private renderManagedTools;
+    private renderManagedMobileSheetNav;
+    private renderManagedMobileBarNav;
+    private renderManagedMobileLeading;
+    private renderManagedMobileActions;
+    private renderManagedPage;
+    private renderSlottedShell;
     render(): any;
 }
 //# sourceMappingURL=ShellApp.d.ts.map

package/dist/types/components/ShellApp/shell-app-types.d.ts

@@ -0,0 +1,92 @@
+import type { BarNavTab } from '../BarNav/bar-nav-types';
+import type { BarTitleActionItem, BarTitlePrimaryAction } from '../BarTitle/bar-title-types';
+import type { BreadcrumbItem } from '../Breadcrumb/breadcrumb-types';
+import type { MobileHeaderTone } from '../MobileHeader/mobile-header-types';
+import type { PanelNavGroup, PanelNavItem, PanelNavRouterMode } from '../PanelNav/panel-nav-types';
+import type { PanelToolsHeaders, PanelToolsHeaderAction, PanelToolsItem } from '../PanelTools/panel-tools-types';
+import type { NavChromeStyle } from '../../shell/nav-chrome';
+export type ShellAppComposition = 'managed' | 'slotted';
+/**
+ * Router-owned application navigation supplied to managed ShellApp.
+ * ShellApp renders the responsive chrome but never performs route changes.
+ */
+export interface ShellNavigationConfig {
+    /** Groups shown in the current desktop/tablet PanelNav context. */
+    groups?: PanelNavGroup[];
+    /** Complete Dashboard collection used by the mobile navigation sheet. */
+    dashboardGroups?: PanelNavGroup[];
+    /** Complete Settings collection used by the mobile navigation sheet. */
+    settingsGroups?: PanelNavGroup[];
+    /** Current application URL used for active-item matching. */
+    currentUrl?: string;
+    /** Optional explicit active destination when URL matching is unavailable. */
+    activeId?: string;
+    /** Current Dashboard or Settings browsing context. */
+    browseContext?: NavChromeStyle;
+    /** Managed shells default to event routing so the application router stays authoritative. */
+    routerMode?: PanelNavRouterMode;
+    /** Persisted desktop PanelNav collapse preference key. */
+    storageKey?: string;
+    userName?: string;
+    userInitial?: string;
+    accountMenuExpanded?: boolean;
+    dashboardLabel?: string;
+    settingsLabel?: string;
+    accountLabel?: string;
+    navigationLabel?: string;
+    dashboardNavigationLabel?: string;
+    settingsNavigationLabel?: string;
+}
+/**
+ * Route-owned page chrome. The same data drives desktop BarNav/BarTitle and
+ * the intentionally different mobile MobileHeader presentation.
+ */
+export interface ShellPageChromeConfig {
+    heading?: string;
+    /** Desktop/tablet route-navigation heading when it differs from the page h1. */
+    routeHeading?: string;
+    description?: string;
+    headingLevel?: 'h1' | 'h2';
+    tabs?: BarNavTab[];
+    value?: string;
+    basePath?: string;
+    currentUrl?: string;
+    sectionsAriaLabel?: string;
+    subsections?: BarNavTab[];
+    subvalue?: string;
+    subsectionsAriaLabel?: string;
+    showBack?: boolean;
+    backAriaLabel?: string;
+    backIcon?: string;
+    backLabel?: string;
+    breadcrumbs?: BreadcrumbItem[];
+    breadcrumbAriaLabel?: string;
+    primaryAction?: BarTitlePrimaryAction | null;
+    actions?: BarTitleActionItem[];
+    /** Icon actions rendered in the mobile header's trailing lane. */
+    mobileActions?: PanelToolsHeaderAction[];
+    actionsAriaLabel?: string;
+    tone?: MobileHeaderTone;
+    contentInset?: 'default' | 'none';
+}
+/**
+ * Product-owned global tools supplied to managed ShellApp. Tool view content
+ * remains mounted in the corresponding named `*-view` slots.
+ */
+export interface ShellToolsConfig {
+    items?: PanelToolsItem[];
+    headers?: PanelToolsHeaders;
+    storageKey?: string;
+    fullscreenHeaderMode?: 'shared' | 'split';
+    toolsLabel?: string;
+    toolShortcutsLabel?: string;
+    inboxLabel?: string;
+    inboxNavigationLabel?: string;
+    /** Temporarily conceal the mobile bar while a tool-owned keyboard interaction needs the space. */
+    mobileBarHidden?: boolean;
+}
+export interface ShellNavigationSelectDetail {
+    id: string;
+    item?: PanelNavItem;
+}
+//# sourceMappingURL=shell-app-types.d.ts.map

package/dist/types/components/ShellPage/ShellPage.d.ts

@@ -24,18 +24,23 @@ export declare class ShellPage {
     private headerMutationObserver;
     private headerRevealFrame;
     private headerGeometryFrame;
+    private reconnectFrame;
     private scrollRoot;
+    private hasLoaded;
     handleHeaderContractChange(): void;
     handleResponsiveModeChange(): void;
     componentDidLoad(): void;
     componentDidRender(): void;
+    connectedCallback(): void;
     disconnectedCallback(): void;
+    private connectRuntime;
     private get effectiveVariant();
     private get headerContractResolved();
     private get isScrollCompacted();
     private composedParent;
     private findScrollRoot;
     private connectScrollRoot;
+    private get scrollRootResolved();
     private handleScroll;
     private findHeader;
     private get compactHeaderHeight();

package/dist/types/components/ShellTools/ShellTools.d.ts

@@ -10,9 +10,7 @@ export declare class ShellTools {
     presentation: 'drawer' | 'fullscreen';
     fullscreenHeaderMode: 'shared' | 'split';
     items: PanelToolsItem[];
-    itemsJson: string;
     headers: PanelToolsHeaders;
-    headersJson: string;
     storageKey: string;
     toolsLabel: string;
     toolShortcutsLabel: string;
@@ -36,6 +34,8 @@ export declare class ShellTools {
     private panelToolsEl;
     private get resolvedItems();
     private get availableInboxTools();
+    private get mobileViewOrder();
+    private toolLabel;
     private get mobileActiveTool();
     componentWillLoad(): void;
     handleItemsChange(): void;