@ojiepermana/angular 22.1.10 → 22.1.12

package/types/ojiepermana-angular-theme-component-settings.d.ts

@@ -1 +1,154 @@
-export * from '@ojiepermana/angular-theme/component/settings';
+import * as _angular_core from '@angular/core';
+import { InjectionToken, Signal, Provider, EnvironmentProviders } from '@angular/core';
+import * as _ojiepermana_angular_theme_component_settings from '@ojiepermana/angular/theme/component/settings';
+import { DrawerSide } from '@ojiepermana/angular/component/drawer';
+import { LayoutAppearance, LayoutSurface, LayoutType, LayoutWidth } from '@ojiepermana/angular/theme/layout/types';
+import { NavigationType } from '@ojiepermana/angular/navigation/types';
+import { ShellMode } from '@ojiepermana/angular/theme/shell/types';
+
+/** Native control styling exposed by the settings trigger. */
+type ThemeSettingsTrigger = 'button' | 'link';
+/** A navigation-aligned, right-side inspector for runtime theme and shell settings. */
+declare class ThemeSettingsComponent {
+    /**
+     * Present only when the app provided an adapter. It is a render gate here: the
+     * Layout and Navigation sections inject the token non-optionally, so a
+     * theme-only consumer simply gets the Theme and Shell sections.
+     */
+    protected readonly settings: _ojiepermana_angular_theme_component_settings.ThemeSettingsAdapter | null;
+    readonly open: _angular_core.ModelSignal<boolean>;
+    readonly trigger: _angular_core.InputSignal<ThemeSettingsTrigger>;
+    readonly triggerLabel: _angular_core.InputSignal<string>;
+    readonly triggerIconOnly: _angular_core.InputSignal<boolean>;
+    readonly showTrigger: _angular_core.InputSignal<boolean>;
+    readonly side: _angular_core.InputSignal<DrawerSide>;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly triggerClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThemeSettingsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThemeSettingsComponent, "ThemeSettings", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "trigger": { "alias": "trigger"; "required": false; "isSignal": true; }; "triggerLabel": { "alias": "triggerLabel"; "required": false; "isSignal": true; }; "triggerIconOnly": { "alias": "trigger-icon-only"; "required": false; "isSignal": true; }; "showTrigger": { "alias": "show-trigger"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, never, true, never>;
+}
+
+/**
+ * Navigation choices exposed by an application shell.
+ *
+ * `desktop` is intentionally not part of the navigation primitive's
+ * `NavigationType`: it does not register a fifth navigation renderer. It tells
+ * the horizontal desktop shell to use its native titlebar and render the
+ * content-focused path used by an empty layout.
+ */
+type ThemeSettingsNavigationType = NavigationType | 'desktop';
+/**
+ * The presentation modes meaningful to the currently selected navigation type.
+ * Sidebar uses `default`/`collapsed`; dockbar uses `default` (sticky) / `drawer`.
+ */
+type ThemeSettingsNavigationMode = 'default' | 'collapsed' | 'drawer';
+/**
+ * Optional consumer bridge for the layout and navigation portions of
+ * `ThemeSettings`. Keeping this contract at the edge lets the component remain
+ * portable: theme-only consumers do not need to provide application shell state.
+ */
+interface ThemeSettingsAdapter {
+    readonly appearance: Signal<LayoutAppearance>;
+    readonly surface: Signal<LayoutSurface>;
+    readonly layoutType: Signal<LayoutType>;
+    readonly width: Signal<LayoutWidth>;
+    readonly navType: Signal<ThemeSettingsNavigationType>;
+    readonly navTypeMode: Signal<ThemeSettingsNavigationMode>;
+    setAppearance(value: LayoutAppearance): void;
+    setSurface(value: LayoutSurface): void;
+    setLayoutType(value: LayoutType): void;
+    setWidth(value: LayoutWidth): void;
+    setNavType(value: ThemeSettingsNavigationType): void;
+    setNavTypeMode(value: ThemeSettingsNavigationMode): void;
+}
+/** Provide this from an application's persisted layout-settings facade. */
+declare const THEME_SETTINGS_ADAPTER: InjectionToken<ThemeSettingsAdapter>;
+
+/** Storage key for the persisted navigation type. Owned by the package. */
+declare const NAV_TYPE_STORAGE_KEY = "nav-type";
+/** Storage key for the persisted navigation presentation mode. Owned by the package. */
+declare const NAV_TYPE_MODE_STORAGE_KEY = "nav-type-mode";
+/**
+ * Nav types valid for a layout/shell pair — mirrors `LayoutWrapperDefault`
+ * (`navbar`/`flyout` → web horizontal, `sidebar`/`dockbar` → vertical).
+ * A desktop-mode horizontal shell owns exactly one navigation shape: `desktop`.
+ * `empty` and `fluid` shells are brand-only, so no nav type applies.
+ */
+declare function allowedNavTypes(layoutType: LayoutType, shellMode: ShellMode): readonly ThemeSettingsNavigationType[];
+/**
+ * Presentation modes meaningful to a navigation type: sidebar collapses, dockbar
+ * turns into a drawer, and every other type has one presentation only.
+ */
+declare function allowedNavTypeModes(navType: ThemeSettingsNavigationType): readonly ThemeSettingsNavigationMode[];
+/** `fluid` width only has an effect when the layout type is also `fluid`. */
+declare function isWidthEnabled(layoutType: LayoutType, width: LayoutWidth): boolean;
+/**
+ * Default `ThemeSettingsAdapter`: the axis coherence rules that make runtime
+ * layout and navigation switching safe, published so every consumer shares one
+ * tested implementation instead of copying it.
+ *
+ * - `surface` / `appearance` / `width` delegate to the library `LayoutService`
+ *   (already reactive and persisted, with no nav-derived override to drift from).
+ * - `layoutType` / `navType` / `navTypeMode` are owned here: `<Layout>` writes
+ *   `type` back to the service (`persist: false`) to follow nav orientation, so
+ *   reading `layout.type()` would drift from the operator's choice. Nav type is
+ *   not `LayoutService` territory at all.
+ *
+ * Incoherent axis pairs auto-correct, so the shell never renders an impossible
+ * state. Only presentation choices are stored, never identity or session data,
+ * and storage that is unavailable or holds a foreign value falls back to the
+ * default without throwing.
+ *
+ * Install with {@link provideThemeSettingsAdapter}.
+ */
+declare class ThemeSettingsDefaultAdapter implements ThemeSettingsAdapter {
+    private readonly platformId;
+    private readonly storage;
+    private readonly layout;
+    private readonly shell;
+    readonly surface: _angular_core.Signal<"flat" | "grid" | "grid-line" | "honeycomb" | "matrix" | "circuit" | "line-vertical" | "line-horizontal">;
+    readonly appearance: _angular_core.Signal<"flat" | "border-rail">;
+    readonly width: _angular_core.Signal<"fluid" | "full" | "wide" | "container">;
+    private readonly layoutTypeState;
+    private readonly navTypeState;
+    private readonly navTypeModeState;
+    readonly layoutType: _angular_core.Signal<"vertical" | "horizontal" | "empty" | "fluid">;
+    readonly navType: _angular_core.Signal<ThemeSettingsNavigationType>;
+    readonly navTypeMode: _angular_core.Signal<ThemeSettingsNavigationMode>;
+    /** Shell mode the nav-type constraints are resolved against. */
+    readonly shellMode: _angular_core.Signal<"desktop" | "web" | "tablet" | "mobile">;
+    constructor();
+    setSurface(surface: LayoutSurface): void;
+    setAppearance(appearance: LayoutAppearance): void;
+    setWidth(width: LayoutWidth): void;
+    setLayoutType(type: LayoutType): void;
+    setNavType(type: ThemeSettingsNavigationType): void;
+    setNavTypeMode(mode: ThemeSettingsNavigationMode): void;
+    /**
+     * Auto-correct the lower-priority axes a layout type invalidates, so the
+     * rendered shell never lands in an inconsistent state (e.g. `vertical` +
+     * `navbar`). Idempotent — only writes when a value is actually out of range.
+     */
+    private enforceConstraints;
+    private enforceNavTypeMode;
+    private readStoredNavType;
+    private readStoredNavTypeMode;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThemeSettingsDefaultAdapter, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ThemeSettingsDefaultAdapter>;
+}
+/**
+ * Install the published {@link ThemeSettingsDefaultAdapter} on
+ * `THEME_SETTINGS_ADAPTER`, which turns on the layout and navigation sections of
+ * `<ThemeSettings>`:
+ *
+ * ```ts
+ * providers: [provideThemeSettingsAdapter()];
+ * ```
+ *
+ * Additive: consumers that provide their own adapter, or none at all, are
+ * unaffected.
+ */
+declare function provideThemeSettingsAdapter(): (Provider | EnvironmentProviders)[];
+
+export { NAV_TYPE_MODE_STORAGE_KEY, NAV_TYPE_STORAGE_KEY, THEME_SETTINGS_ADAPTER, ThemeSettingsComponent, ThemeSettingsDefaultAdapter, allowedNavTypeModes, allowedNavTypes, isWidthEnabled, provideThemeSettingsAdapter };
+export type { ThemeSettingsAdapter, ThemeSettingsNavigationMode, ThemeSettingsNavigationType, ThemeSettingsTrigger };

package/types/ojiepermana-angular-theme-layout-services.d.ts

@@ -1 +1,147 @@
-export * from '@ojiepermana/angular-theme/layout/services';
+import * as _angular_core from '@angular/core';
+import { LayoutSurface, LayoutAppearance, LayoutType, LayoutWidth } from '@ojiepermana/angular/theme/layout/types';
+import { HttpContextToken, HttpInterceptorFn } from '@angular/common/http';
+
+interface LayoutMutationOptions {
+    persist?: boolean;
+}
+declare class LayoutService {
+    private readonly platformId;
+    private readonly storage;
+    private readonly shell;
+    private readonly surfaceState;
+    private readonly typeState;
+    private readonly appearanceState;
+    private readonly widthState;
+    readonly surface: _angular_core.Signal<"flat" | "grid" | "grid-line" | "honeycomb" | "matrix" | "circuit" | "line-vertical" | "line-horizontal">;
+    readonly type: _angular_core.Signal<"vertical" | "horizontal" | "empty" | "fluid">;
+    readonly appearance: _angular_core.Signal<"flat" | "border-rail">;
+    /**
+     * `true` on every shell mode but `web`. An app that owns its whole surface has
+     * no page to be inset within, so the width axis is not the user's to choose
+     * there — see {@link LAYOUT_LOCKED_WIDTH}.
+     */
+    readonly widthLocked: _angular_core.Signal<boolean>;
+    /**
+     * The width in effect. While `widthLocked()`, this reports the locked width and
+     * `widthState` keeps the user's own choice aside, so returning to `web` restores
+     * it instead of silently flattening it to `full`.
+     */
+    readonly width: _angular_core.Signal<"fluid" | "full" | "wide" | "container">;
+    /** The stored preference, ignoring the lock. */
+    readonly preferredWidth: _angular_core.Signal<"fluid" | "full" | "wide" | "container">;
+    /**
+     * Seed several axes at once. See {@link registerSurface} for what "register"
+     * means here — an omitted axis is left exactly as it was.
+     */
+    registerDefaults(defaults: {
+        surface?: LayoutSurface;
+        appearance?: LayoutAppearance;
+        type?: LayoutType;
+        width?: LayoutWidth;
+    }): this;
+    /**
+     * Seed the axis with a default, unless the user already stored a choice of
+     * their own — that one always wins.
+     *
+     * Registering deliberately does NOT persist. Storage is the record of what the
+     * USER picked, and writing a seeded default into it would make the two
+     * indistinguishable: a bare `<Layout>` would record a library default nobody
+     * asked for, and neither the library nor the consumer could ever change their
+     * own default again for anyone who had merely rendered the component once.
+     * Only {@link setSurface} and its siblings — the settings UI — write.
+     */
+    registerSurface(surface: LayoutSurface): void;
+    /** Seeds the axis without persisting — see {@link registerSurface}. */
+    registerType(type: LayoutType): void;
+    /** Seeds the axis without persisting — see {@link registerSurface}. */
+    registerAppearance(appearance: LayoutAppearance): void;
+    /** Seeds the axis without persisting — see {@link registerSurface}. */
+    registerWidth(width: LayoutWidth): void;
+    setSurface(surface: LayoutSurface, options?: LayoutMutationOptions): void;
+    setType(type: LayoutType, options?: LayoutMutationOptions): void;
+    setAppearance(appearance: LayoutAppearance, options?: LayoutMutationOptions): void;
+    setWidth(width: LayoutWidth, options?: LayoutMutationOptions): void;
+    getStoredSurface(): LayoutSurface;
+    getStoredType(): LayoutType;
+    getStoredAppearance(): LayoutAppearance;
+    getStoredWidth(): LayoutWidth;
+    private readStoredAppearance;
+    private getStoredAppearanceOrDefault;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LayoutService>;
+}
+
+/** Progress the bar starts at, so the line is visibly moving the moment it appears. */
+declare const LAYOUT_LOADING_INITIAL_PROGRESS = 8;
+/** Batas atas progres trickle; sisanya menunggu seluruh pekerjaan selesai. */
+declare const LAYOUT_LOADING_TRICKLE_CEILING = 90;
+/** How often the trickle raises progress while work is still outstanding. */
+declare const LAYOUT_LOADING_TRICKLE_INTERVAL_MS = 250;
+/** Delay after progress reaches 100% before the bar is hidden, so the finish reads. */
+declare const LAYOUT_LOADING_HIDE_DELAY_MS = 200;
+/**
+ * Global loading tracker behind the progress line at the top of the viewport.
+ *
+ * It turns on by itself when the router starts a navigation and while an HTTP
+ * request runs through `layoutLoadingInterceptor`. Any other source — a manual
+ * data load, say — can join in through the ref-counted `start()`/`done()` pair.
+ */
+declare class LayoutLoadingService {
+    private readonly platformId;
+    private readonly router;
+    private readonly pendingCount;
+    private readonly activeState;
+    private readonly progressState;
+    /** The bar is on screen, including the short finish to 100%. */
+    readonly active: _angular_core.Signal<boolean>;
+    /** Progres garis 0–100. */
+    readonly progress: _angular_core.Signal<number>;
+    /** Work (a navigation, a request, a data load) is still outstanding. */
+    readonly pending: _angular_core.Signal<boolean>;
+    private readonly hostRegistry;
+    /**
+     * The earliest registered `LayoutLoading` host, which is the one that draws the
+     * bar. Every other instance — the one inside `Layout` when the app root also
+     * mounts `LayoutLoading` — goes inert, so the line is never drawn twice.
+     */
+    readonly primaryHostId: _angular_core.Signal<number>;
+    private trickleTimer;
+    private hideTimer;
+    private navigationPending;
+    private nextHostId;
+    constructor();
+    /** Mark one unit of work started; the bar appears with the first one. */
+    start(): void;
+    /** Mark one unit of work finished; the bar completes when the count returns to zero. */
+    done(): void;
+    /** Register one `LayoutLoading` host; returns the id used to unregister it. */
+    registerHost(): number;
+    /** Release a host; the next registered one becomes primary on its own. */
+    unregisterHost(hostId: number): void;
+    /** Force the progress value (0–100) while the bar is active, e.g. for a large upload. */
+    setProgress(value: number): void;
+    private observeRouterNavigation;
+    private show;
+    private finish;
+    private hide;
+    private startTrickle;
+    private stopTrickle;
+    private cancelScheduledHide;
+    private isBrowser;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutLoadingService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LayoutLoadingService>;
+}
+
+/**
+ * Set `true` on a request's `HttpContext` to keep it out of the progress line —
+ * a poll or a heartbeat that must not raise a loading indicator.
+ */
+declare const LAYOUT_LOADING_SKIP: HttpContextToken<boolean>;
+/**
+ * Interceptor that lights the `LayoutLoading` progress line while an HTTP
+ * request is in flight. Register it through `withInterceptors([...])`.
+ */
+declare const layoutLoadingInterceptor: HttpInterceptorFn;
+
+export { LAYOUT_LOADING_HIDE_DELAY_MS, LAYOUT_LOADING_INITIAL_PROGRESS, LAYOUT_LOADING_SKIP, LAYOUT_LOADING_TRICKLE_CEILING, LAYOUT_LOADING_TRICKLE_INTERVAL_MS, LayoutLoadingService, LayoutService, layoutLoadingInterceptor };

package/types/ojiepermana-angular-theme-layout-types.d.ts

@@ -1 +1,40 @@
-export * from '@ojiepermana/angular-theme/layout/types';
+import { Signal } from '@angular/core';
+
+declare const LAYOUT_TYPES: readonly ["vertical", "horizontal", "empty", "fluid"];
+declare const LAYOUT_SURFACES: readonly ["flat", "grid", "grid-line", "honeycomb", "matrix", "circuit", "line-vertical", "line-horizontal"];
+declare const LAYOUT_APPEARANCES: readonly ["flat", "border-rail"];
+declare const LAYOUT_WIDTHS: readonly ["full", "wide", "container", "fluid"];
+type LayoutType = (typeof LAYOUT_TYPES)[number];
+type LayoutSurface = (typeof LAYOUT_SURFACES)[number];
+type LayoutAppearance = (typeof LAYOUT_APPEARANCES)[number];
+type LayoutWidth = (typeof LAYOUT_WIDTHS)[number];
+declare const LAYOUT_DEFAULT_SURFACE: LayoutSurface;
+declare const LAYOUT_DEFAULT_TYPE: LayoutType;
+declare const LAYOUT_DEFAULT_APPEARANCE: LayoutAppearance;
+declare const LAYOUT_DEFAULT_WIDTH: LayoutWidth;
+/**
+ * The width forced whenever the shell mode is not `web`.
+ *
+ * Only a browser page can be narrower than the surface it sits on. On desktop,
+ * tablet, and mobile the app *is* the surface, so a wide/container/fluid frame
+ * would leave dead canvas inside the window — `LayoutService` locks the axis here
+ * and keeps the user's own choice aside for when they return to `web`.
+ */
+declare const LAYOUT_LOCKED_WIDTH: LayoutWidth;
+declare const LAYOUT_SURFACE_STORAGE_KEY = "layout-surface";
+declare const LAYOUT_APPEARANCE_STORAGE_KEY = "layout-appearance";
+declare const LAYOUT_TYPE_STORAGE_KEY = "layout-type";
+declare const LAYOUT_WIDTH_STORAGE_KEY = "layout-width";
+interface LayoutContextValue {
+    surface: Signal<LayoutSurface>;
+    type: Signal<LayoutType>;
+    appearance: Signal<LayoutAppearance>;
+    width: Signal<LayoutWidth>;
+}
+declare function isUiLayoutSurface(value: string | null): value is LayoutSurface;
+declare function isUiLayoutType(value: string | null): value is LayoutType;
+declare function isUiLayoutAppearance(value: string | null): value is LayoutAppearance;
+declare function isUiLayoutWidth(value: string | null): value is LayoutWidth;
+
+export { LAYOUT_APPEARANCES, LAYOUT_APPEARANCE_STORAGE_KEY, LAYOUT_DEFAULT_APPEARANCE, LAYOUT_DEFAULT_SURFACE, LAYOUT_DEFAULT_TYPE, LAYOUT_DEFAULT_WIDTH, LAYOUT_LOCKED_WIDTH, LAYOUT_SURFACES, LAYOUT_SURFACE_STORAGE_KEY, LAYOUT_TYPES, LAYOUT_TYPE_STORAGE_KEY, LAYOUT_WIDTHS, LAYOUT_WIDTH_STORAGE_KEY, isUiLayoutAppearance, isUiLayoutSurface, isUiLayoutType, isUiLayoutWidth };
+export type { LayoutAppearance, LayoutContextValue, LayoutSurface, LayoutType, LayoutWidth };

package/types/ojiepermana-angular-theme-layout-wrapper.d.ts

@@ -1 +1,299 @@
-export * from '@ojiepermana/angular-theme/layout/wrapper';
+import * as _angular_core from '@angular/core';
+import { ElementRef } from '@angular/core';
+import { ThemeSettingsNavigationMode, ThemeSettingsNavigationType } from '@ojiepermana/angular/theme/component/settings';
+import * as _ojiepermana_angular_navigation from '@ojiepermana/angular/navigation';
+import { NavigationDockbarRouteContext } from '@ojiepermana/angular/navigation';
+import { NavigationDockbarRouteContext as NavigationDockbarRouteContext$1, NavigationItem, NavigationType } from '@ojiepermana/angular/navigation/types';
+
+/**
+ * The identity shape the layout wrappers consume. The library defines the structure
+ * only; the concrete brand and user values come from the consumer as inputs.
+ */
+interface BrandIdentity {
+    /** Name behind the initials and the accessible name in the header slot. */
+    readonly name: string;
+    /** Material symbol used as the logo; `null` falls back to initials from `name`. */
+    readonly icon: string | null;
+    /** Judul brand. */
+    readonly title: string;
+    /** Subjudul brand. */
+    readonly subtitle: string;
+}
+interface UserIdentity {
+    /** Nama lengkap user (inisial + judul footer). */
+    readonly name: string;
+    /** Email, or the footer's secondary line. */
+    readonly email: string;
+}
+
+/** Registry key used only while `LayoutWrapperDefault` renders its desktop nav. */
+declare const LAYOUT_DESKTOP_NAVIGATION_DATA_ID = "__layout-desktop-navigation";
+/**
+ * Registry of the brand and user identity a shell publishes (`LayoutWrapperDefault`, for
+ * one). Other surfaces — the apps launcher in `Page`, say — read it so they show the same
+ * brand and user as the nav flyout without taking inputs of their own.
+ */
+declare class LayoutIdentityService {
+    private readonly brandState;
+    private readonly userState;
+    readonly brand: _angular_core.Signal<BrandIdentity | null>;
+    readonly user: _angular_core.Signal<UserIdentity | null>;
+    setBrand(brand: BrandIdentity | null): void;
+    setUser(user: UserIdentity | null): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutIdentityService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LayoutIdentityService>;
+}
+
+/**
+ * The brand slot for `<NavigationHeader>`: initials or logo plus a title. Purely
+ * input-driven.
+ *
+ * `compact` (dockbar, or an icon-only rail) hides the title. `host.class = 'contents'`
+ * keeps `NavigationHeaderInitial` and `NavigationHeaderTitle` as direct flex children of
+ * the header row; the title still auto-hides on a collapsed sidebar, because
+ * `NAVIGATION_SHELL` reaches `<Navigation>` through the live injector tree.
+ */
+declare class LayoutBrand {
+    /** Identitas brand (nama, ikon, judul, subjudul). */
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    /** Sembunyikan judul, sisakan inisial saja (dockbar / rail ikon-only). */
+    readonly compact: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutBrand, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutBrand, "LayoutBrand", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * The user slot for `<NavigationFooter>`: an optional identity plus the logout action.
+ * Purely input-driven.
+ *
+ * `detailed` shows initials and name (a full sidebar); without it, only the logout
+ * button. `host.class = 'contents'` makes the children direct flex children of the
+ * footer, so `ml-auto` and the auto-hide on collapse (through `NAVIGATION_SHELL`) still
+ * apply.
+ *
+ * The logout button only emits `(logout)`. Endpoint, cookie, and redirect target differ
+ * per application, so the effect is entirely the consumer's — the library calls no
+ * endpoint and performs no navigation. A consumer that never binds `(logout)` still
+ * renders without error; the button simply does nothing, exactly as before this output
+ * existed.
+ */
+declare class LayoutUser {
+    /** Identitas user (nama + email). */
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Show the user identity (initials and name), not only the logout button. */
+    readonly detailed: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Accessible name for the logout button. */
+    readonly logoutLabel: _angular_core.InputSignal<string>;
+    /** Material symbol for the logout button. */
+    readonly logoutIcon: _angular_core.InputSignal<string>;
+    /** The user pressed logout. The effect is the consumer's; the library does not navigate. */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutUser, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutUser, "LayoutUser", never, { "user": { "alias": "user"; "required": true; "isSignal": true; }; "detailed": { "alias": "detailed"; "required": false; "isSignal": true; }; "logoutLabel": { "alias": "logoutLabel"; "required": false; "isSignal": true; }; "logoutIcon": { "alias": "logoutIcon"; "required": false; "isSignal": true; }; }, { "logout": "logout"; }, never, never, true, never>;
+}
+
+/**
+ * Nav type: a collapsible vertical sidebar (the default). Brand in the header, user
+ * identity in the footer.
+ *
+ * Horizontal dividers: the sidebar ALWAYS uses the borders `NavigationHeader`
+ * (`border-b`) and `NavigationFooter` (`border-t`) bring, `border-rail` included.
+ * Layout's inset accent rail (`top-12`/`bottom-12`) sits behind a frame that is now
+ * solid (`bg-background`) and is therefore invisible inside it; those explicit borders
+ * are what keep the header and footer lines visible and running straight into the
+ * content column (both `h-12`), consistent with {@link LayoutNavDockbar}.
+ *
+ * `host.class = 'contents'` makes `<NavigationSidebar>` an effective child of
+ * `<Navigation>` (h-full, shell classes), while `NAVIGATION_SHELL` still reaches it
+ * through the live injector tree and `<NavigationHeader>` stays a direct child for the
+ * library's content projection.
+ */
+declare class LayoutNavSidebar {
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Appearance from the shell (`[appearance]`); decides the separator border weight. */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    readonly navTypeMode: _angular_core.InputSignal<ThemeSettingsNavigationMode>;
+    /** Forwarded from `<LayoutUser>`; the effect is the consumer's. */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    protected readonly isBorderRail: _angular_core.Signal<boolean>;
+    protected readonly isCollapsed: _angular_core.Signal<boolean>;
+    /** Border kanan pemisah; ketebalan ikut appearance: `border-rail` = `--layout-rail-width` (selaras rail layout), `flat` 1px. */
+    protected readonly shellClass: _angular_core.Signal<"border-r-[length:var(--layout-rail-width)] border-border" | "border-r border-border">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavSidebar, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavSidebar, "LayoutNavSidebar", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "user": { "alias": "user"; "required": true; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "navTypeMode": { "alias": "nav-type-mode"; "required": false; "isSignal": true; }; }, { "logout": "logout"; }, never, never, true, never>;
+}
+
+/**
+ * Nav type: a vertical icon rail (dockbar). A compact brand (initials only) in the
+ * header, the user's initials in the rail footer (title and actions auto-hide, because
+ * the rail is always collapsed), and the full identity (name, email, logout) in the
+ * aside footer — together with the rail initials they form one footer row, like an
+ * expanded sidebar.
+ *
+ * Horizontal dividers: unlike the sidebar, which leaves the separator to Layout's inset
+ * accent rail at `top-12`/`bottom-12` under `border-rail`, the dockbar ALWAYS uses the
+ * borders `NavigationHeader`/`NavigationFooter` bring. The dockbar aside covers the inset
+ * rail line with its own opaque background, so those explicit borders are what keep the
+ * separator running straight from rail to aside (header and footer are both `h-12`).
+ * See {@link LayoutNavSidebar} for why `host.class = 'contents'`.
+ */
+declare class LayoutNavDockbar {
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Appearance from the shell (`[appearance]`); decides the separator border weight. */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    readonly navTypeMode: _angular_core.InputSignal<ThemeSettingsNavigationMode>;
+    /** Opt-in route-aware header; ketika aktif, header route menggantikan compact brand. */
+    readonly dockbarRouteContext: _angular_core.InputSignal<NavigationDockbarRouteContext | null>;
+    /** The generic badge registry forwarded to `NavigationDockbar`. */
+    readonly dockbarBadgeContext: _angular_core.InputSignal<Readonly<Record<string, _ojiepermana_angular_navigation.NavigationBadgeSource>>>;
+    /** Forwarded from the rail and aside footer logout buttons; the effect is the consumer's. */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    protected readonly isBorderRail: _angular_core.Signal<boolean>;
+    protected readonly dockbarMode: _angular_core.Signal<"drawer" | "sticky">;
+    protected readonly routeContextEnabled: _angular_core.Signal<boolean>;
+    /** Border kanan pemisah; ketebalan ikut appearance: `border-rail` = `--layout-rail-width` (selaras rail layout), `flat` 1px. */
+    protected readonly shellClass: _angular_core.Signal<"border-r-[length:var(--layout-rail-width)] border-border" | "border-r border-border">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavDockbar, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavDockbar, "LayoutNavDockbar", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "user": { "alias": "user"; "required": true; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "navTypeMode": { "alias": "nav-type-mode"; "required": false; "isSignal": true; }; "dockbarRouteContext": { "alias": "dockbar-route-context"; "required": false; "isSignal": true; }; "dockbarBadgeContext": { "alias": "dockbar-badge"; "required": false; "isSignal": true; }; }, { "logout": "logout"; }, never, never, true, never>;
+}
+
+/**
+ * Nav type: a top bar with inline items (navbar, horizontal). `appearance` follows the
+ * shell (`flat | border-rail`). See {@link LayoutNavSidebar} for why
+ * `host.class = 'contents'`.
+ */
+declare class LayoutNavNavbar {
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Appearance from the shell (`[nav-type-style]`). */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    /** Forwarded from `<LayoutUser>`; the effect is the consumer's. */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavNavbar, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavNavbar, "LayoutNavNavbar", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "user": { "alias": "user"; "required": true; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; }, { "logout": "logout"; }, never, never, true, never>;
+}
+
+/**
+ * Nav type: a top bar with a flyout trigger button (horizontal). `appearance` follows the
+ * shell. See {@link LayoutNavSidebar} for why `host.class = 'contents'`.
+ */
+declare class LayoutNavFlyout {
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Appearance from the shell (`[nav-type-style]`). */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    /** Forwarded from `<LayoutUser>`; the effect is the consumer's. */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavFlyout, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavFlyout, "LayoutNavFlyout", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "user": { "alias": "user"; "required": true; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; }, { "logout": "logout"; }, never, never, true, never>;
+}
+
+/**
+ * Nav type: a brand-only sidebar for the `empty` and `fluid` variants, where
+ * `LayoutNavigation` hides the nav — so no collapse and no footer. See
+ * {@link LayoutNavSidebar} for why `host.class = 'contents'`.
+ */
+declare class LayoutNavMinimal {
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavMinimal, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavMinimal, "LayoutNavMinimal", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/** The nav type `@switch (navKind())` renders. `brand` = header-only sidebar (empty/fluid). */
+type NavKind = NavigationType | 'brand';
+/**
+ * A ready-made layout shell — the consumer supplies data through inputs instead of
+ * assembling `Layout > LayoutVertical/Horizontal/Empty/Fluid > LayoutNavigation >
+ * Navigation > nav type` by hand.
+ *
+ * ```html
+ * <LayoutWrapperDefault
+ *   [surface]="surface" [layout-appearance]="appearance" [width]="width"
+ *   [layout-type]="layoutType" [nav-type]="navType"
+ *   [data]="navItems" [brand]="brand" [user]="user"
+ *   (logout)="signOut()"
+ * >
+ *   <router-outlet />   <!-- page content is projected into LayoutContent -->
+ * </LayoutWrapperDefault>
+ * ```
+ *
+ * The `register*` defaults (LayoutService) stay the consumer's job; this wrapper is purely
+ * presentational — two axes (`effectiveLayoutType` → wrapper, `navKind` → nav type) over one
+ * shared skeleton. Injection stays sound: `<Navigation>` provides `NAVIGATION_SHELL` inside
+ * `#body`, and each nav type is `display:contents`, so `<NavigationXxx>` is an effective child
+ * of `<Navigation>`.
+ */
+declare class LayoutWrapperDefault {
+    /** Surface latar shell (mis. `grid`, `flat`). */
+    readonly surface: _angular_core.InputSignal<"flat" | "grid" | "grid-line" | "honeycomb" | "matrix" | "circuit" | "line-vertical" | "line-horizontal">;
+    /** Appearance shell & nav (`flat | border-rail`). */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    /** Frame width (`full`, `container`, and so on). */
+    readonly width: _angular_core.InputSignal<"full" | "wide" | "container" | "fluid">;
+    /** Tipe layout dasar (`vertical | horizontal | empty | fluid`); `empty`/`fluid` override nav. */
+    readonly layoutType: _angular_core.InputSignal<"fluid" | "vertical" | "horizontal" | "empty">;
+    /**
+     * The shell's navigation type. `desktop` only means anything on a horizontal frame:
+     * the titlebar becomes the primary chrome and the navigation area follows the
+     * content-focused `empty` behaviour.
+     */
+    readonly navType: _angular_core.InputSignal<ThemeSettingsNavigationType>;
+    /** Presentation mode for the active nav type (`collapsed` sidebar / `drawer` dockbar). */
+    readonly navTypeMode: _angular_core.InputSignal<ThemeSettingsNavigationMode>;
+    /** Opt-in route-aware dockbar state; ignored by other navigation types. */
+    readonly dockbarRouteContext: _angular_core.InputSignal<NavigationDockbarRouteContext$1 | null>;
+    /** Generic dockbar badge registry; ignored by sidebar/navbar/flyout. */
+    readonly dockbarBadgeContext: _angular_core.InputSignal<Readonly<Record<string, _ojiepermana_angular_navigation.NavigationBadgeSource>>>;
+    /** Item navigasi. */
+    readonly data: _angular_core.InputSignal<readonly NavigationItem[]>;
+    /** Identitas brand. */
+    readonly brand: _angular_core.InputSignal<BrandIdentity>;
+    /** Identitas user. */
+    readonly user: _angular_core.InputSignal<UserIdentity>;
+    /** Id landmark konten utama sekaligus target skip link. */
+    readonly contentId: _angular_core.InputSignal<string>;
+    /** Skip-link label; the consumer can localise it. */
+    readonly skipLinkLabel: _angular_core.InputSignal<string>;
+    /** Fokuskan landmark utama setelah route selesai berubah. */
+    readonly focusOnNavigation: _angular_core.InputSignal<boolean>;
+    /** Controlled/uncontrolled state drawer navigasi mobile. */
+    readonly mobileNavOpen: _angular_core.ModelSignal<boolean>;
+    readonly mobileNavLabel: _angular_core.InputSignal<string>;
+    readonly closeMobileNavLabel: _angular_core.InputSignal<string>;
+    /**
+     * The user pressed logout in the navigation footer. Forwarded from every nav type that
+     * shows the user identity (`sidebar`, `dockbar`, `navbar`, `flyout`), the mobile drawer
+     * included, so one binding covers all of them. The library calls no endpoint and performs
+     * no navigation; what happens next is entirely the consumer's.
+     */
+    readonly logout: _angular_core.OutputEmitterRef<void>;
+    private readonly identity;
+    private readonly navigation;
+    private readonly desktopNavigationDataOwner;
+    private readonly document;
+    protected readonly mobileNavTriggerRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    constructor();
+    /**
+     * Classes for `<LayoutContent>`, chosen by the consumer (padding, say). Empty by
+     * default: the library no longer forces `p-6`; the consumer or `<Page>` decides spacing.
+     */
+    readonly contentClassInput: _angular_core.InputSignal<string>;
+    /** Wrapper layout & nilai `<Layout [layout-type]>`: navbar/flyout = horizontal, sisanya vertical. */
+    protected readonly effectiveLayoutType: _angular_core.Signal<"fluid" | "vertical" | "horizontal" | "empty">;
+    /** Tipe nav di dalam `#body`: `empty`/`fluid` → `brand` (header-only); selain itu `nav-type`. */
+    protected readonly navKind: _angular_core.Signal<NavKind>;
+    /** Lebar host `<Navigation>`: penuh-tinggi (vertical) atau penuh-lebar (horizontal). */
+    protected readonly navClass: _angular_core.Signal<"w-full" | "h-full">;
+    protected readonly showsMobileNavigation: _angular_core.Signal<boolean>;
+    /** Internal shell owns responsive placement while primitives remain composition-safe. */
+    protected readonly defaultShellClasses: _angular_core.Signal<string>;
+    /** Kelas `<LayoutContent>`: `fluid` membatasi lebar & memusatkan; padding diserahkan ke consumer. */
+    protected readonly contentClass: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutWrapperDefault, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutWrapperDefault, "LayoutWrapperDefault", never, { "surface": { "alias": "surface"; "required": false; "isSignal": true; }; "appearance": { "alias": "layout-appearance"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "layoutType": { "alias": "layout-type"; "required": false; "isSignal": true; }; "navType": { "alias": "nav-type"; "required": false; "isSignal": true; }; "navTypeMode": { "alias": "nav-type-mode"; "required": false; "isSignal": true; }; "dockbarRouteContext": { "alias": "dockbar-route-context"; "required": false; "isSignal": true; }; "dockbarBadgeContext": { "alias": "dockbar-badge"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": true; "isSignal": true; }; "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "user": { "alias": "user"; "required": true; "isSignal": true; }; "contentId": { "alias": "content-id"; "required": false; "isSignal": true; }; "skipLinkLabel": { "alias": "skip-link-label"; "required": false; "isSignal": true; }; "focusOnNavigation": { "alias": "focus-on-navigation"; "required": false; "isSignal": true; }; "mobileNavOpen": { "alias": "mobile-nav-open"; "required": false; "isSignal": true; }; "mobileNavLabel": { "alias": "mobile-nav-label"; "required": false; "isSignal": true; }; "closeMobileNavLabel": { "alias": "close-mobile-nav-label"; "required": false; "isSignal": true; }; "contentClassInput": { "alias": "content-class"; "required": false; "isSignal": true; }; }, { "mobileNavOpen": "mobile-nav-openChange"; "logout": "logout"; }, never, ["*"], true, never>;
+}
+
+export { LAYOUT_DESKTOP_NAVIGATION_DATA_ID, LayoutBrand, LayoutIdentityService, LayoutNavDockbar, LayoutNavFlyout, LayoutNavMinimal, LayoutNavNavbar, LayoutNavSidebar, LayoutUser, LayoutWrapperDefault };
+export type { BrandIdentity, UserIdentity };