@amsterdam/design-system-react/dist/PageHeader/PageHeader.d.ts

All React components from the Amsterdam Design System. Use it to compose pages in your website or application.

/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */
import type { AnchorHTMLAttributes, ComponentType, HTMLAttributes, ReactNode } from 'react';
import type { LogoBrand } from '../Logo';
export type PageHeaderProps = {
    /** The name of the application. */
    brandName?: string;
    /** The accessible name of the logo. */
    logoAccessibleName?: string;
    /** The name of the brand for which to display the logo. */
    logoBrand?: LogoBrand;
    /** The url for the link on the logo. */
    logoLink?: string;
    /** The React component to use for the logo link. */
    logoLinkComponent?: ComponentType<AnchorHTMLAttributes<HTMLAnchorElement>>;
    /** The accessible text for the link on the logo. */
    logoLinkTitle?: string;
    /** The text for the menu button. */
    menuButtonText?: string;
    /** A slot for the menu items. Use PageHeader.MenuLink here. */
    menuItems?: ReactNode;
    /** The accessible label for the navigation section. */
    navigationLabel?: string;
    /** Whether the menu button is visible on wide screens.  */
    noMenuButtonOnWideWindow?: boolean;
} & HTMLAttributes<HTMLElement>;
/**
 * @see {@link https://designsystem.amsterdam/?path=/docs/components-containers-page-header--docs Page Header docs at Amsterdam Design System}
 */
export declare const PageHeader: import("react").ForwardRefExoticComponent<{
    /** The name of the application. */
    brandName?: string;
    /** The accessible name of the logo. */
    logoAccessibleName?: string;
    /** The name of the brand for which to display the logo. */
    logoBrand?: LogoBrand;
    /** The url for the link on the logo. */
    logoLink?: string;
    /** The React component to use for the logo link. */
    logoLinkComponent?: ComponentType<AnchorHTMLAttributes<HTMLAnchorElement>>;
    /** The accessible text for the link on the logo. */
    logoLinkTitle?: string;
    /** The text for the menu button. */
    menuButtonText?: string;
    /** A slot for the menu items. Use PageHeader.MenuLink here. */
    menuItems?: ReactNode;
    /** The accessible label for the navigation section. */
    navigationLabel?: string;
    /** Whether the menu button is visible on wide screens.  */
    noMenuButtonOnWideWindow?: boolean;
} & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>> & {
    GridCellNarrowWindowOnly: import("react").ForwardRefExoticComponent<import("..").GridCellProps & import("react").RefAttributes<HTMLElement>>;
    MenuLink: import("react").ForwardRefExoticComponent<{
        fixed?: boolean;
    } & AnchorHTMLAttributes<HTMLAnchorElement> & {
        children?: ReactNode | undefined;
    } & import("react").RefAttributes<HTMLAnchorElement>>;
};