@ojiepermana/angular 22.1.11 → 22.1.13

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

@@ -1 +1,129 @@
-export * from '@ojiepermana/angular-theme/layout';
+import * as _angular_core from '@angular/core';
+import { LayoutService, LayoutLoadingService } from '@ojiepermana/angular/theme/layout/services';
+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 } from '@ojiepermana/angular/theme/layout/services';
+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, LayoutAppearance, LayoutContextValue, LayoutSurface, LayoutType, LayoutWidth, isUiLayoutAppearance, isUiLayoutSurface, isUiLayoutType, isUiLayoutWidth } from '@ojiepermana/angular/theme/layout/types';
+
+declare class LayoutComponent {
+    protected readonly layout: LayoutService;
+    readonly surface: _angular_core.InputSignal<"flat" | "grid" | "grid-line" | "honeycomb" | "matrix" | "circuit" | "line-vertical" | "line-horizontal" | null>;
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail" | null>;
+    readonly layoutAppearanceAttribute: _angular_core.InputSignal<"flat" | "border-rail" | null>;
+    readonly width: _angular_core.InputSignal<"full" | "wide" | "container" | "fluid" | null>;
+    /**
+     * Layout type (`vertical` | `horizontal` | `empty` | `fluid`). When set it is the
+     * source of truth and overrides the projected `Layout*` variant; `null` leaves the
+     * variant in charge.
+     */
+    readonly type: _angular_core.InputSignal<"fluid" | "vertical" | "horizontal" | "empty" | null>;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly appearanceInput: _angular_core.Signal<"flat" | "border-rail" | null>;
+    protected readonly resolvedSurface: _angular_core.Signal<"flat" | "grid" | "grid-line" | "honeycomb" | "matrix" | "circuit" | "line-vertical" | "line-horizontal">;
+    protected readonly resolvedAppearance: _angular_core.Signal<"flat" | "border-rail">;
+    protected readonly resolvedWidth: _angular_core.Signal<"full" | "wide" | "container" | "fluid">;
+    protected readonly resolvedType: _angular_core.Signal<"fluid" | "vertical" | "horizontal" | "empty">;
+    protected readonly isBorderRail: _angular_core.Signal<boolean>;
+    protected readonly isFluidFrame: _angular_core.Signal<boolean>;
+    protected readonly isFullFlat: _angular_core.Signal<boolean>;
+    protected readonly isGridLineSurface: _angular_core.Signal<boolean>;
+    protected readonly showsInsetRails: _angular_core.Signal<boolean>;
+    protected readonly frameStageClasses: _angular_core.Signal<string>;
+    protected readonly railAnchorClasses: _angular_core.Signal<string>;
+    protected readonly contentShellClasses: _angular_core.Signal<string>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly frameClasses: _angular_core.Signal<string>;
+    protected readonly frameLayerClasses: _angular_core.Signal<string>;
+    constructor();
+    private surfaceClasses;
+    private widthPaddingClasses;
+    private frameSizeClasses;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutComponent, "Layout", never, { "surface": { "alias": "surface"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "layoutAppearanceAttribute": { "alias": "layout-appearance"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "type": { "alias": "layout-type"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutVerticalComponent {
+    private readonly layout;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutVerticalComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutVerticalComponent, "LayoutVertical", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutHorizontalComponent {
+    private readonly layout;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutHorizontalComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutHorizontalComponent, "LayoutHorizontal", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutEmptyComponent {
+    private readonly layout;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutEmptyComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutEmptyComponent, "LayoutEmpty", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutFluidComponent {
+    private readonly layout;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutFluidComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutFluidComponent, "LayoutFluid", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutNavigationComponent {
+    protected readonly layout: LayoutService;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /** Turn off when the child `<Navigation>` is already the semantic navigation landmark. */
+    readonly landmark: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutNavigationComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutNavigationComponent, "LayoutNavigation", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "landmark": { "alias": "landmark"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class LayoutContentComponent {
+    protected readonly layout: LayoutService;
+    private readonly document;
+    private readonly host;
+    private readonly router;
+    readonly class: _angular_core.InputSignal<string>;
+    /** Stable target for the skip link. */
+    readonly contentId: _angular_core.InputSignal<string>;
+    /** Move focus to the main landmark after NavigationEnd (opt-in). */
+    readonly focusOnNavigation: _angular_core.InputSignal<boolean>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutContentComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutContentComponent, "LayoutContent", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "contentId": { "alias": "content-id"; "required": false; "isSignal": true; }; "focusOnNavigation": { "alias": "focus-on-navigation"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * A thin progress line along the top edge of the viewport, running left to right.
+ * `Layout` renders it automatically and `LayoutLoadingService` drives it, so it
+ * turns itself on while a route navigation or a data load is in flight.
+ *
+ * It can also be placed at the application root, so the bar is already up during
+ * the first navigation; any extra instance inside `Layout` goes inert on its own,
+ * and the line is never drawn twice.
+ */
+declare class LayoutLoadingComponent {
+    protected readonly loading: LayoutLoadingService;
+    private readonly hostId;
+    readonly class: _angular_core.InputSignal<string>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    protected readonly isPrimary: _angular_core.Signal<boolean>;
+    protected readonly state: _angular_core.Signal<"inert" | "active" | "idle">;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly roundedProgress: _angular_core.Signal<number>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutLoadingComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayoutLoadingComponent, "LayoutLoading", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { LayoutComponent, LayoutContentComponent, LayoutEmptyComponent, LayoutFluidComponent, LayoutHorizontalComponent, LayoutLoadingComponent, LayoutNavigationComponent, LayoutVerticalComponent };

package/types/ojiepermana-angular-theme-page-core.d.ts

@@ -1 +1,157 @@
-export * from '@ojiepermana/angular-theme/page/core';
+import * as _angular_core from '@angular/core';
+import { Signal } from '@angular/core';
+
+declare const PAGE_VARIANTS: readonly ["stacked", "side"];
+declare const PAGE_SIDE_POSITIONS: readonly ["left", "right"];
+declare const PAGE_SIDE_MODES: readonly ["sticky", "drawer", "overlay"];
+declare const PAGE_SCROLL_VALUES: readonly ["content", "page"];
+declare const PAGE_HEIGHT_VALUES: readonly ["auto", "fix"];
+/** Visual appearance shared with the layout/navigation axes — unifies borders. */
+declare const PAGE_APPEARANCES: readonly ["flat", "border-rail"];
+/** `PageFilter` placement: `stacked` = a bar between header and content; `side` = a column beside content. */
+declare const PAGE_FILTER_PLACEMENTS: readonly ["stacked", "side"];
+type PageVariant = (typeof PAGE_VARIANTS)[number];
+type PageSidePosition = (typeof PAGE_SIDE_POSITIONS)[number];
+type PageSideMode = (typeof PAGE_SIDE_MODES)[number];
+type PageScroll = (typeof PAGE_SCROLL_VALUES)[number];
+type PageHeight = (typeof PAGE_HEIGHT_VALUES)[number];
+type PageAppearance = (typeof PAGE_APPEARANCES)[number];
+type PageFilterPlacement = (typeof PAGE_FILTER_PLACEMENTS)[number];
+declare const PAGE_DEFAULT_VARIANT: PageVariant;
+declare const PAGE_DEFAULT_SIDE_POSITION: PageSidePosition;
+declare const PAGE_DEFAULT_SIDE_MODE: PageSideMode;
+declare const PAGE_DEFAULT_SCROLL: PageScroll;
+declare const PAGE_DEFAULT_HEIGHT: PageHeight;
+declare const PAGE_DEFAULT_APPEARANCE: PageAppearance;
+declare const PAGE_DEFAULT_SIDE_WIDTH = "16rem";
+/** Placement default `PageFilter`. */
+declare const PAGE_DEFAULT_FILTER_PLACEMENT: PageFilterPlacement;
+/** Default `PageFilter` mode under `placement="side"`; `stacked` always behaves as `sticky`. */
+declare const PAGE_DEFAULT_FILTER_MODE: PageSideMode;
+/** Default position of the `PageFilter` column under `placement="side"`. */
+declare const PAGE_DEFAULT_FILTER_POSITION: PageSidePosition;
+/** Default width of the `PageFilter` column under `placement="side"` (sticky/drawer/overlay). */
+declare const PAGE_DEFAULT_FILTER_WIDTH = "18rem";
+declare function isUiPageVariant(value: string | null): value is PageVariant;
+declare function isUiPageSidePosition(value: string | null): value is PageSidePosition;
+declare function isUiPageSideMode(value: string | null): value is PageSideMode;
+declare function isUiPageScroll(value: string | null): value is PageScroll;
+declare function isUiPageHeight(value: string | null): value is PageHeight;
+declare function isUiPageAppearance(value: string | null): value is PageAppearance;
+declare function isUiPageFilterPlacement(value: string | null): value is PageFilterPlacement;
+
+declare class PageStateService {
+    private readonly variantState;
+    private readonly heightState;
+    private readonly scrollState;
+    private readonly appearanceState;
+    private readonly positionState;
+    private readonly sideModeState;
+    private readonly internalSideOpenState;
+    private readonly controlledSideOpenState;
+    private readonly sideWidthState;
+    private readonly sideIdState;
+    private readonly sideOpenRequestState;
+    private readonly sideOpenRequestVersionState;
+    private sideReturnFocus;
+    /** Aktif saat apps-launcher mengambang di atas `PageHeader`; header memesan ruang kanan agar isinya tidak tertimpa. */
+    private readonly appsLauncherReserveState;
+    private readonly filterPlacementState;
+    private readonly filterModeState;
+    private readonly filterPositionState;
+    private readonly filterWidthState;
+    private readonly filterIdState;
+    private readonly internalFilterOpenState;
+    private readonly controlledFilterOpenState;
+    private readonly filterOpenRequestState;
+    private readonly filterOpenRequestVersionState;
+    private filterReturnFocus;
+    readonly variant: _angular_core.Signal<"stacked" | "side">;
+    readonly height: _angular_core.Signal<"auto" | "fix">;
+    readonly scroll: _angular_core.Signal<"content" | "page">;
+    readonly appearance: _angular_core.Signal<"flat" | "border-rail">;
+    readonly position: _angular_core.Signal<"left" | "right">;
+    readonly sideMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    readonly sideWidth: _angular_core.Signal<string>;
+    readonly sideId: _angular_core.Signal<string | null>;
+    readonly sideOpenRequest: _angular_core.Signal<boolean | null>;
+    readonly sideOpenRequestVersion: _angular_core.Signal<number>;
+    readonly appsLauncherReserve: _angular_core.Signal<boolean>;
+    readonly sideOpen: _angular_core.Signal<boolean>;
+    readonly isSideInteractive: _angular_core.Signal<boolean>;
+    readonly isSideVisible: _angular_core.Signal<boolean>;
+    readonly filterPlacement: _angular_core.Signal<"stacked" | "side">;
+    readonly filterMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    readonly filterPosition: _angular_core.Signal<"left" | "right">;
+    readonly filterWidth: _angular_core.Signal<string>;
+    readonly filterId: _angular_core.Signal<string | null>;
+    readonly filterOpenRequest: _angular_core.Signal<boolean | null>;
+    readonly filterOpenRequestVersion: _angular_core.Signal<number>;
+    readonly filterOpen: _angular_core.Signal<boolean>;
+    readonly isFilterInteractive: _angular_core.Signal<boolean>;
+    readonly isFilterVisible: _angular_core.Signal<boolean>;
+    registerRoot(config: {
+        variant: PageVariant;
+        height: PageHeight;
+        scroll: PageScroll;
+        appearance: PageAppearance;
+        position: PageSidePosition;
+        sideMode: PageSideMode;
+        sideWidth: string;
+    }): void;
+    registerSide(config: {
+        mode: PageSideMode;
+        position: PageSidePosition;
+        width: string;
+        id: string;
+    }): void;
+    setAppsLauncherReserve(reserve: boolean): void;
+    setControlledSideOpen(open: boolean | null): void;
+    setSideOpen(open: boolean): void;
+    openSide(): boolean;
+    closeSide(): boolean;
+    toggleSide(): boolean;
+    /** Stores the concrete trigger before opening so restoration is not browser-timing dependent. */
+    setSideReturnFocus(element: HTMLElement): void;
+    takeSideReturnFocus(): HTMLElement | null;
+    private requestSideOpenChange;
+    registerFilter(config: {
+        placement: PageFilterPlacement;
+        mode: PageSideMode;
+        position: PageSidePosition;
+        width: string;
+        id: string;
+    }): void;
+    setControlledFilterOpen(open: boolean | null): void;
+    setFilterOpen(open: boolean): void;
+    openFilter(): boolean;
+    closeFilter(): boolean;
+    toggleFilter(): boolean;
+    /** Mirrors side focus ownership for filter drawer/overlay triggers. */
+    setFilterReturnFocus(element: HTMLElement): void;
+    takeFilterReturnFocus(): HTMLElement | null;
+    private requestFilterOpenChange;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageStateService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<PageStateService>;
+}
+
+/**
+ * Accessibility management for the Page panels.
+ *
+ * A drawer only gets initial focus and focus restoration. An overlay is a modal dialog:
+ * focus is trapped, the background is made inert, and document scrolling is locked until
+ * the panel closes. Must be called from an injection context, because it uses `effect`.
+ */
+/** @internal */
+declare function ɵsetupOverlayFocusManagement(config: {
+    document: Document | null;
+    host: HTMLElement;
+    isOpen: Signal<boolean>;
+    isInteractive: Signal<boolean>;
+    isModal: Signal<boolean>;
+    /** Optional trigger captured at the open gesture, before a modal makes it inert. */
+    takeReturnFocus?: () => HTMLElement | null;
+}): void;
+
+export { PAGE_APPEARANCES, PAGE_DEFAULT_APPEARANCE, PAGE_DEFAULT_FILTER_MODE, PAGE_DEFAULT_FILTER_PLACEMENT, PAGE_DEFAULT_FILTER_POSITION, PAGE_DEFAULT_FILTER_WIDTH, PAGE_DEFAULT_HEIGHT, PAGE_DEFAULT_SCROLL, PAGE_DEFAULT_SIDE_MODE, PAGE_DEFAULT_SIDE_POSITION, PAGE_DEFAULT_SIDE_WIDTH, PAGE_DEFAULT_VARIANT, PAGE_FILTER_PLACEMENTS, PAGE_HEIGHT_VALUES, PAGE_SCROLL_VALUES, PAGE_SIDE_MODES, PAGE_SIDE_POSITIONS, PAGE_VARIANTS, PageStateService, isUiPageAppearance, isUiPageFilterPlacement, isUiPageHeight, isUiPageScroll, isUiPageSideMode, isUiPageSidePosition, isUiPageVariant, ɵsetupOverlayFocusManagement };
+export type { PageAppearance, PageFilterPlacement, PageHeight, PageScroll, PageSideMode, PageSidePosition, PageVariant };

package/types/ojiepermana-angular-theme-page-filter.d.ts

@@ -1 +1,77 @@
-export * from '@ojiepermana/angular-theme/page/filter';
+import * as _angular_core from '@angular/core';
+import { PageStateService } from '@ojiepermana/angular/theme/page/core';
+
+/**
+ * `PageFilter` — the filter slot between `PageHeader` and `PageContent`
+ * (`placement="stacked"`) or beside `PageContent` (`placement="side"`). Stacked, the
+ * filter pushes content down and content takes the remaining height. Side, it pushes
+ * content across, in `sticky | drawer | overlay` mode, following the `PageSide` pattern.
+ *
+ * `placement="stacked"` always behaves as `sticky` — `drawer` and `overlay` apply to
+ * `side` only.
+ */
+declare class PageFilterComponent {
+    private readonly document;
+    private readonly host;
+    protected readonly page: PageStateService;
+    protected readonly resolvedId: string;
+    readonly placement: _angular_core.InputSignal<"stacked" | "side">;
+    readonly mode: _angular_core.InputSignal<"sticky" | "drawer" | "overlay">;
+    readonly position: _angular_core.InputSignal<"left" | "right" | null>;
+    readonly width: _angular_core.InputSignal<string | null>;
+    readonly closeOnEsc: _angular_core.InputSignal<boolean>;
+    /**
+     * `placement="stacked"` only: let `PageFilterToggle` open and close the bar (closed by
+     * default). Closed, the bar is hidden and content reclaims its space. Ignored under
+     * `placement="side"` — use `mode="drawer"` or `mode="overlay"` for a dismissible side.
+     */
+    readonly collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Accessible name for the panel in `drawer`/`overlay` mode (set as the dialog's `aria-label`). */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedPlacement: _angular_core.Signal<"stacked" | "side">;
+    /** `stacked` adalah bar horizontal — tidak punya drawer/overlay, jadi mode efektifnya selalu `sticky`. */
+    protected readonly effectiveMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    protected readonly resolvedPosition: _angular_core.Signal<"left" | "right">;
+    protected readonly resolvedWidth: _angular_core.Signal<string>;
+    protected readonly resolvedScroll: _angular_core.Signal<"content" | "page">;
+    protected readonly isStacked: _angular_core.Signal<boolean>;
+    /** Bar stacked yang dapat ditutup dan sedang tertutup → disembunyikan dari layout. */
+    protected readonly isCollapsedStacked: _angular_core.Signal<boolean>;
+    protected readonly isSticky: _angular_core.Signal<boolean>;
+    protected readonly isDrawer: _angular_core.Signal<boolean>;
+    protected readonly isOverlay: _angular_core.Signal<boolean>;
+    /** Mode mengambang (drawer/overlay) — bersifat dialog dan butuh manajemen fokus + `inert` saat tertutup. */
+    protected readonly isInteractive: _angular_core.Signal<boolean>;
+    /** Drawer/overlay yang tertutup disembunyikan dari pohon aksesibilitas. */
+    protected readonly ariaHidden: _angular_core.Signal<"true" | null>;
+    /** Saat panel mengambang tertutup, `inert` mengeluarkan isinya dari tab order & pohon aksesibilitas (AXE). */
+    protected readonly inertWhenClosed: _angular_core.Signal<"" | null>;
+    protected readonly dialogRole: _angular_core.Signal<"dialog" | null>;
+    protected readonly ariaModal: _angular_core.Signal<"true" | null>;
+    protected readonly dialogLabel: _angular_core.Signal<string | null>;
+    protected readonly dialogTabindex: _angular_core.Signal<"-1" | null>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageFilterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageFilterComponent, "PageFilter", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "closeOnEsc": { "alias": "closeOnEsc"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * `PageFilterToggle` — the button that opens and closes a `PageFilter` in `drawer` or
+ * `overlay` mode. Projected content replaces the label or icon; the fallback is the
+ * built-in funnel icon.
+ */
+declare class PageFilterToggleComponent {
+    protected readonly page: PageStateService;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly class: _angular_core.InputSignal<string>;
+    readonly toggled: _angular_core.OutputEmitterRef<boolean>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly buttonClasses: _angular_core.Signal<string>;
+    protected handleClick(event: MouseEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageFilterToggleComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageFilterToggleComponent, "PageFilterToggle", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, { "toggled": "toggled"; }, never, ["*"], true, never>;
+}
+
+export { PageFilterComponent, PageFilterToggleComponent };

package/types/ojiepermana-angular-theme-page-root.d.ts

@@ -1 +1,88 @@
-export * from '@ojiepermana/angular-theme/page/root';
+import * as _ojiepermana_angular_theme_layout_wrapper from '@ojiepermana/angular/theme/layout/wrapper';
+import * as _angular_core from '@angular/core';
+import { NavigationItem } from '@ojiepermana/angular/navigation/types';
+import { PageFilterComponent } from '@ojiepermana/angular/theme/page/filter';
+import { PageHeaderComponent } from '@ojiepermana/angular/theme/page/slots';
+import { PageSideComponent } from '@ojiepermana/angular/theme/page/side';
+import { PageStateService } from '@ojiepermana/angular/theme/page/core';
+
+declare class PageComponent {
+    protected readonly page: PageStateService;
+    private readonly layout;
+    private readonly navigation;
+    private readonly identity;
+    protected readonly projectedSide: _angular_core.Signal<PageSideComponent | undefined>;
+    protected readonly projectedHeader: _angular_core.Signal<PageHeaderComponent | undefined>;
+    protected readonly projectedFilter: _angular_core.Signal<PageFilterComponent | undefined>;
+    readonly variant: _angular_core.InputSignal<"stacked" | "side">;
+    readonly height: _angular_core.InputSignal<"auto" | "fix">;
+    readonly scroll: _angular_core.InputSignal<"content" | "page">;
+    /** Visual appearance shared with the layout (`flat | border-rail`); unifies header/footer borders. */
+    readonly appearance: _angular_core.InputSignal<"flat" | "border-rail">;
+    readonly position: _angular_core.InputSignal<"left" | "right">;
+    readonly sideMode: _angular_core.InputSignal<"sticky" | "drawer" | "overlay">;
+    readonly sideOpen: _angular_core.InputSignal<boolean | null>;
+    readonly sideWidth: _angular_core.InputSignal<string>;
+    /** Controlled state for a drawer/overlay `PageFilter`. `null` is uncontrolled — the toggle, backdrop, and Esc drive it. */
+    readonly filterOpen: _angular_core.InputSignal<boolean | null>;
+    readonly class: _angular_core.InputSignal<string>;
+    readonly sideOpenChange: _angular_core.OutputEmitterRef<boolean>;
+    readonly filterOpenChange: _angular_core.OutputEmitterRef<boolean>;
+    /** Under the `empty` layout, show the apps button (a flyout of the main navigation) in the top-right corner. `false` turns it off. */
+    readonly appsLauncher: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Id of the navigation the apps launcher surfaces (`main` by default). */
+    readonly appsNavId: _angular_core.InputSignal<string>;
+    /** Material symbol for the apps launcher button. */
+    readonly appsIcon: _angular_core.InputSignal<string>;
+    /** Label and `aria-label` for the icon-only apps launcher button. */
+    readonly appsLabel: _angular_core.InputSignal<string>;
+    /** Accessible name for the backdrop button that dismisses an open overlay panel. */
+    readonly overlayCloseLabel: _angular_core.InputSignal<string>;
+    /** Id unik untuk instance `<Navigation>` apps-launcher; tak boleh memakai id `main` (akan bentrok `claimId`). */
+    protected readonly launcherNavId: string;
+    protected readonly resolvedPosition: _angular_core.Signal<"left" | "right">;
+    protected readonly resolvedSideMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    protected readonly isLeftSide: _angular_core.Signal<boolean>;
+    protected readonly isRightSide: _angular_core.Signal<boolean>;
+    protected readonly hasFilter: _angular_core.Signal<boolean>;
+    protected readonly filterPlacement: _angular_core.Signal<"stacked" | "side">;
+    /** Mode efektif: `stacked` selalu `sticky`; `side` memakai mode pada `PageFilter`. */
+    protected readonly filterMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    protected readonly filterPosition: _angular_core.Signal<"left" | "right">;
+    protected readonly filterWidthVar: _angular_core.Signal<string>;
+    protected readonly showsSideOverlayBackdrop: _angular_core.Signal<boolean>;
+    protected readonly showsFilterOverlayBackdrop: _angular_core.Signal<boolean>;
+    protected readonly showsOverlayBackdrop: _angular_core.Signal<boolean>;
+    /** Signal data untuk id yang dipilih; di-recompute hanya saat `appsNavId` berubah. */
+    private readonly appsNavSource;
+    protected readonly appsNavData: _angular_core.Signal<readonly NavigationItem[]>;
+    /** Apps-launcher hanya muncul di layout `empty`, saat diaktifkan, dan saat nav target punya data. */
+    protected readonly showsAppsLauncher: _angular_core.Signal<boolean>;
+    /**
+     * Host `<Navigation>` launcher di-absolute ke pojok kanan-atas (hanya membungkus tombol trigger;
+     * panel flyout tetap membentang selebar `Page` lewat pengukuran container). Saat ada `PageHeader`,
+     * tombol menyatu di dalam pita header (offset rapat); tanpa header, mengambang di atas konten.
+     */
+    protected readonly appsLauncherHostClass: _angular_core.Signal<string>;
+    /** Appearance flyout mengikuti layout (seperti shell flyout); fallback ke appearance `Page`. */
+    protected readonly appsLauncherAppearance: _angular_core.Signal<"flat" | "border-rail">;
+    /** Brand/user untuk header & footer flyout — sama seperti shell flyout; `null` saat tak ada shell. */
+    protected readonly appsBrand: _angular_core.Signal<_ojiepermana_angular_theme_layout_wrapper.BrandIdentity | null>;
+    protected readonly appsUser: _angular_core.Signal<_ojiepermana_angular_theme_layout_wrapper.UserIdentity | null>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly shellClasses: _angular_core.Signal<string>;
+    protected readonly bodyClasses: _angular_core.Signal<string>;
+    /**
+     * Wrapper di sekitar `PageFilter` + `PageContent`. Tanpa filter, memakai `display: contents`
+     * agar transparan (perilaku body lama dipertahankan persis). Dengan filter, menjadi grid/flex
+     * yang menata filter (baris untuk `stacked`, kolom untuk `side`); drawer/overlay menjadikannya
+     * `relative` sebagai positioning context untuk panel yang mengambang.
+     */
+    protected readonly contentRegionClasses: _angular_core.Signal<string>;
+    constructor();
+    protected handleBackdropClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageComponent, "Page", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "scroll": { "alias": "scroll"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "sideMode": { "alias": "sideMode"; "required": false; "isSignal": true; }; "sideOpen": { "alias": "sideOpen"; "required": false; "isSignal": true; }; "sideWidth": { "alias": "sideWidth"; "required": false; "isSignal": true; }; "filterOpen": { "alias": "filterOpen"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "appsLauncher": { "alias": "appsLauncher"; "required": false; "isSignal": true; }; "appsNavId": { "alias": "appsNavId"; "required": false; "isSignal": true; }; "appsIcon": { "alias": "appsIcon"; "required": false; "isSignal": true; }; "appsLabel": { "alias": "appsLabel"; "required": false; "isSignal": true; }; "overlayCloseLabel": { "alias": "overlayCloseLabel"; "required": false; "isSignal": true; }; }, { "sideOpenChange": "sideOpenChange"; "filterOpenChange": "filterOpenChange"; }, ["projectedSide", "projectedHeader", "projectedFilter"], ["PageHeader", "PageSideToggle, PageFilterToggle", "PageSide", "PageFilter", "PageContent, PageDashboard", "PageFooter"], true, never>;
+}
+
+export { PageComponent };

package/types/ojiepermana-angular-theme-page-side.d.ts

@@ -1 +1,50 @@
-export * from '@ojiepermana/angular-theme/page/side';
+import * as _angular_core from '@angular/core';
+import { PageStateService } from '@ojiepermana/angular/theme/page/core';
+
+declare class PageSideComponent {
+    private readonly document;
+    private readonly host;
+    protected readonly page: PageStateService;
+    protected readonly resolvedId: string;
+    readonly mode: _angular_core.InputSignal<"sticky" | "drawer" | "overlay" | null>;
+    readonly position: _angular_core.InputSignal<"left" | "right" | null>;
+    readonly width: _angular_core.InputSignal<string | null>;
+    readonly closeOnEsc: _angular_core.InputSignal<boolean>;
+    /** Accessible name for the panel in `drawer`/`overlay` mode (set as the dialog's `aria-label`). */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedMode: _angular_core.Signal<"sticky" | "drawer" | "overlay">;
+    protected readonly resolvedPosition: _angular_core.Signal<"left" | "right">;
+    protected readonly resolvedWidth: _angular_core.Signal<string>;
+    protected readonly isSticky: _angular_core.Signal<boolean>;
+    protected readonly isDrawer: _angular_core.Signal<boolean>;
+    protected readonly isOverlay: _angular_core.Signal<boolean>;
+    /** Mode mengambang (drawer/overlay) — bersifat dialog dan butuh manajemen fokus + `inert` saat tertutup. */
+    protected readonly isInteractive: _angular_core.Signal<boolean>;
+    protected readonly resolvedScroll: _angular_core.Signal<"content" | "page">;
+    protected readonly ariaHidden: _angular_core.Signal<"true" | null>;
+    /** Saat panel mengambang tertutup, `inert` mengeluarkan isinya dari tab order & pohon aksesibilitas (AXE). */
+    protected readonly inertWhenClosed: _angular_core.Signal<"" | null>;
+    protected readonly dialogRole: _angular_core.Signal<"dialog" | null>;
+    protected readonly ariaModal: _angular_core.Signal<"true" | null>;
+    protected readonly dialogLabel: _angular_core.Signal<string | null>;
+    protected readonly dialogTabindex: _angular_core.Signal<"-1" | null>;
+    protected readonly classes: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageSideComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageSideComponent, "PageSide", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "closeOnEsc": { "alias": "closeOnEsc"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class PageSideToggleComponent {
+    protected readonly page: PageStateService;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly class: _angular_core.InputSignal<string>;
+    readonly toggled: _angular_core.OutputEmitterRef<boolean>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly buttonClasses: _angular_core.Signal<string>;
+    protected handleClick(event: MouseEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageSideToggleComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageSideToggleComponent, "PageSideToggle", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, { "toggled": "toggled"; }, never, ["*"], true, never>;
+}
+
+export { PageSideComponent, PageSideToggleComponent };

package/types/ojiepermana-angular-theme-page-slots.d.ts

@@ -1 +1,40 @@
-export * from '@ojiepermana/angular-theme/page/slots';
+import * as _angular_core from '@angular/core';
+
+declare class PageHeaderComponent {
+    private readonly page;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedHeight: _angular_core.Signal<"auto" | "fix">;
+    /** Saat tombol apps mengambang di atas header, sisakan ruang kanan agar isi header tidak tertimpa. */
+    protected readonly reservesAppsLauncher: _angular_core.Signal<boolean>;
+    /** Lebar tombol apps (h-9 w-9 = 36px) + offset kanan (right-2 = 8px) + jarak aman; `null` = tak memesan. */
+    protected readonly appsLauncherReservePadding: _angular_core.Signal<"3.5rem" | null>;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageHeaderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageHeaderComponent, "PageHeader", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+declare class PageContentComponent {
+    private readonly page;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedScroll: _angular_core.Signal<"content" | "page">;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageContentComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageContentComponent, "PageContent", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+declare class PageDashboardComponent {
+    private readonly page;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedScroll: _angular_core.Signal<"content" | "page">;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageDashboardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageDashboardComponent, "PageDashboard", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+declare class PageFooterComponent {
+    private readonly page;
+    readonly class: _angular_core.InputSignal<string>;
+    protected readonly resolvedHeight: _angular_core.Signal<"auto" | "fix">;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PageFooterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageFooterComponent, "PageFooter", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+export { PageContentComponent, PageDashboardComponent, PageFooterComponent, PageHeaderComponent };

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

@@ -1 +1,5 @@
-export * from '@ojiepermana/angular-theme/page';
+export { PAGE_APPEARANCES, PAGE_DEFAULT_APPEARANCE, PAGE_DEFAULT_FILTER_MODE, PAGE_DEFAULT_FILTER_PLACEMENT, PAGE_DEFAULT_FILTER_POSITION, PAGE_DEFAULT_FILTER_WIDTH, PAGE_DEFAULT_HEIGHT, PAGE_DEFAULT_SCROLL, PAGE_DEFAULT_SIDE_MODE, PAGE_DEFAULT_SIDE_POSITION, PAGE_DEFAULT_SIDE_WIDTH, PAGE_DEFAULT_VARIANT, PAGE_FILTER_PLACEMENTS, PAGE_HEIGHT_VALUES, PAGE_SCROLL_VALUES, PAGE_SIDE_MODES, PAGE_SIDE_POSITIONS, PAGE_VARIANTS, PageAppearance, PageFilterPlacement, PageHeight, PageScroll, PageSideMode, PageSidePosition, PageVariant, isUiPageAppearance, isUiPageFilterPlacement, isUiPageHeight, isUiPageScroll, isUiPageSideMode, isUiPageSidePosition, isUiPageVariant } from '@ojiepermana/angular/theme/page/core';
+export { PageFilterComponent, PageFilterToggleComponent } from '@ojiepermana/angular/theme/page/filter';
+export { PageComponent } from '@ojiepermana/angular/theme/page/root';
+export { PageSideComponent, PageSideToggleComponent } from '@ojiepermana/angular/theme/page/side';
+export { PageContentComponent, PageDashboardComponent, PageFooterComponent, PageHeaderComponent } from '@ojiepermana/angular/theme/page/slots';