@primer/react-brand/lib/SubdomainNavBar/SubdomainNavBar.d.ts

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

import React, { PropsWithChildren } from 'react';
/**
 * Design tokens
 */
import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes.css';
export type SubdomainNavBarProps = {
    /**
     * Valid child elements are `SubdomainNavBar.Link`, `SubdomainNavBar.PrimaryAction`,
     * `SubdomainNavBar.SecondaryAction` and `SubdomainNavBar.Search`
     */
    children?: React.ReactNode | React.ReactElement<SubdomainNavBarLinkProps> | React.ReactElement<SearchProps> | React.ReactElement<CTAActionProps>;
    /**
     * Forward a custom HTML class attribute
     */
    className?: string;
    /**
     * Fixes the navigation bar to the top of the viewport. Defaults to `true`.
     */
    fixed?: boolean;
    /**
     * Fill the maximum width of the parent container. Defaults to `false`.
     */
    fullWidth?: boolean;
    /**
     * The title or name of the subdomain. Appears adjacent to the logo and is required for communicating content to assisitive technologies.
     */
    title: string;
    /**
     * The URL for the site. Typically used to link the titleText prop value to the site root.
     */
    titleHref?: string;
    /**
     * Optionally change the URL of the logo
     */
    logoHref?: string;
    /**
     * When the menu is opened or closed on narrow viewports, this callback is called with the new open state.
     */
    onNarrowMenuToggle?: (isOpen: boolean) => void;
};
declare function Root({ children, className, fixed, fullWidth, logoHref, title, titleHref, onNarrowMenuToggle, ...rest }: SubdomainNavBarProps): import("react/jsx-runtime").JSX.Element;
export type SubdomainNavBarLinkProps = {
    href: string;
    isExternal?: boolean;
    'data-navitemid'?: string;
} & React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>;
declare function Link({ href, className, children, isExternal, ...rest }: PropsWithChildren<SubdomainNavBarLinkProps>): import("react/jsx-runtime").JSX.Element;
export type SubdomainNavBarSearchResultProps = {
    title: string;
    description: string;
    url: string;
    date: string;
    category?: string;
};
type HandlerEvent = MouseEvent | TouchEvent | FocusEvent;
type SearchProps = {
    onSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
    onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
    ref: React.RefObject<HTMLInputElement>;
    active?: boolean;
    title?: string;
    handlerFn?: (event: HandlerEvent) => void;
    autoComplete?: boolean;
    searchResults?: SubdomainNavBarSearchResultProps[];
    searchTerm?: string;
};
type CTAActionProps = {
    href: string;
} & React.HTMLAttributes<HTMLAnchorElement>;
declare function PrimaryAction({ children, href, ...rest }: PropsWithChildren<CTAActionProps>): import("react/jsx-runtime").JSX.Element;
declare function SecondaryAction({ children, href, ...rest }: PropsWithChildren<CTAActionProps>): import("react/jsx-runtime").JSX.Element;
export declare const SubdomainNavBar: typeof Root & {
    Link: typeof Link;
    Search: React.ForwardRefExoticComponent<Omit<SearchProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
    PrimaryAction: typeof PrimaryAction;
    SecondaryAction: typeof SecondaryAction;
    testIds: {
        root: string;
        readonly innerContainer: string;
        readonly menuButton: string;
        readonly menuLinks: string;
        readonly liveRegion: string;
    };
};
export {};