@starasia/admin 11.2.0 → 11.4.0

package/dist/components/PageLayout/index.d.ts

@@ -49,6 +49,31 @@ export interface PageLayoutProps extends PropsWithChildren {
      * (e.g. tab switches) or when the slide-in fights another transition.
      */
     disableAnimation?: boolean;
+    /**
+     * Make PageLayout its own vertical scroll container: it fills the parent's
+     * height (`height: 100%`) and scrolls its content with `overflow: auto`.
+     *
+     * With this on, the header + subHeaders scroll away together with the body,
+     * and any `position: sticky; top: 0` element in the body (e.g. a table header)
+     * pins to the top of the page — right below the app navbar. Without it
+     * (default) PageLayout just grows with its content and relies on an ancestor
+     * (app shell / body) to scroll.
+     *
+     * Requires the parent to have a definite height (the app content slot usually
+     * does). Defaults to `false`.
+     *
+     * Note: a child that needs its OWN horizontal scroll (e.g. a very wide table
+     * wrapped in `overflow-x: auto`) will also capture vertical scrolling, so its
+     * sticky header pins within that child, not the page. For those, keep the
+     * scroll on the child instead of enabling `scrollable` here.
+     */
+    scrollable?: boolean;
+    /**
+     * When `scrollable` is on, keep the header region (title + subHeaders) pinned
+     * to the top instead of letting it scroll away — a sticky page header below
+     * the navbar. No effect unless `scrollable` is also set. Defaults to `false`.
+     */
+    stickyHeader?: boolean;
     /**
      * Extra header rows rendered below the main header. Each row gets the same
      * padding as the main header (paddingBlock "sm" / paddingInline "md"), an
@@ -62,5 +87,5 @@ export interface PageLayoutProps extends PropsWithChildren {
     containerProps?: Omit<BoxProps, "variant" | "gap">;
     headerProps?: Omit<BoxProps, "gap">;
 }
-export declare const PageLayout: React.MemoExoticComponent<({ backButton, title, titleIcon, titleTag, children, header, headerBorder, disableAnimation, subHeaders, action, titleTagProps, containerProps, headerProps, }: PageLayoutProps) => React.JSX.Element>;
+export declare const PageLayout: React.MemoExoticComponent<({ backButton, title, titleIcon, titleTag, children, header, headerBorder, disableAnimation, scrollable, stickyHeader, subHeaders, action, titleTagProps, containerProps, headerProps, }: PageLayoutProps) => React.JSX.Element>;
 export {};