@itwin/itwinui-react/esm/core/Header/HeaderButton.d.ts

A react component library for iTwinUI

import * as React from 'react';
import type { ButtonProps } from '../Buttons/Button.js';
import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
import type { DropdownButtonProps } from '../Buttons/DropdownButton.js';
type HeaderButtonProps = {
    /**
     * Main label of the header button.
     */
    name: React.ReactNode;
    /**
     * Description shown below the main label, will be hidden in `Header` slim mode.
     */
    description?: React.ReactNode;
    /**
     * Is the menu active.
     * @default false
     */
    isActive?: boolean;
    /**
     * Modify the native `name` attribute of the `<button>` element.
     */
    htmlName?: string;
} & Partial<Pick<DropdownButtonProps, 'menuItems'>> & Pick<ButtonProps, 'startIcon' | 'endIcon'>;
/**
 * Header button that handles slim state of the `Header` it's in.
 * When in slim mode, will only display the name and reduce icon size.
 * Will display an arrow on the right if `menuItems` prop is provided.
 * @example
 * <HeaderButton name='Project A' description='0n00434' menuItems={...} />
 * <HeaderButton name='Project B' description='0n00434' startIcon={<SvgImodelHollow />} />
 * <HeaderButton name='Project C' startIcon={<img style={{ objectFit: 'cover' }} src='project.png' />} />
 * <HeaderButton name='Project D' isActive />
 */
export declare const HeaderButton: PolymorphicForwardRefComponent<"button", HeaderButtonProps>;
export {};