import * as React from 'react';
import { ExtractProps } from '@workday/canvas-kit-react/common';
import { Heading, TypeLevelProps } from '@workday/canvas-kit-react/text';
export interface SidePanelHeadingProps extends Omit<ExtractProps<typeof Heading, never>, 'size'> {
    /**
     * The size of the heading.
     * @default 'small'
     */
    size?: TypeLevelProps['size'];
    children?: React.ReactNode;
}
export declare const sidePanelHeadingStencil: import("@workday/canvas-kit-styling").Stencil<{
    origin: {
        end: {
            paddingInlineStart: string;
        };
        start: {};
    };
}, {}, {}, import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, import("@workday/canvas-kit-styling").Stencil<{
    typeLevel: {
        'title.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-title-lg, var(--cnvs-sys-font-size-title-large, 3.5rem))";
            lineHeight: "var(--cnvs-sys-line-height-title-lg, var(--cnvs-sys-line-height-title-large, 4rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'title.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-title-md, var(--cnvs-sys-font-size-title-medium, 3rem))";
            lineHeight: "var(--cnvs-sys-line-height-title-md, var(--cnvs-sys-line-height-title-medium, 3.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'title.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            lineHeight: "var(--cnvs-sys-line-height-title-sm, var(--cnvs-sys-line-height-title-small, 3rem))";
            fontSize: "var(--cnvs-sys-font-size-title-sm, var(--cnvs-sys-font-size-title-small, 2.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-lg, var(--cnvs-sys-font-size-heading-large, 2rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-lg, var(--cnvs-sys-line-height-heading-large, 2.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-md, var(--cnvs-sys-font-size-heading-medium, 1.75rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-md, var(--cnvs-sys-line-height-heading-medium, 2.25rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-sm, var(--cnvs-sys-font-size-heading-small, 1.5rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-sm, var(--cnvs-sys-line-height-heading-small, 2rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'body.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-lg, var(--cnvs-sys-font-size-body-large, 1.25rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-lg, var(--cnvs-sys-line-height-body-large, 1.75rem))";
            color: "--cnvs-sys-color-fg-default";
        };
        'body.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-md, var(--cnvs-sys-font-size-body-medium, 1.125rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-md, var(--cnvs-sys-line-height-body-medium, 1.75rem))";
            color: "--cnvs-sys-color-fg-default";
        };
        'body.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-sm, var(--cnvs-sys-font-size-body-small, 1rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-sm, var(--cnvs-sys-line-height-body-small, 1.5rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-body-sm, var(--cnvs-sys-type-letter-spacing-body-small))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-md, var(--cnvs-sys-font-size-subtext-medium, 0.75rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-md, var(--cnvs-sys-line-height-subtext-medium, 1rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-md, var(--cnvs-sys-type-letter-spacing-subtext-medium))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-sm, var(--cnvs-sys-font-size-subtext-small, 0.625rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-sm, var(--cnvs-sys-line-height-subtext-small, 1rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-sm, var(--cnvs-sys-type-letter-spacing-subtext-small))";
            color: "--cnvs-sys-color-fg-default";
        };
    };
    variant: {
        error: {
            color: "var(--cnvs-sys-color-brand-fg-critical-default, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1)))";
        };
        hint: {
            color: "--cnvs-sys-color-fg-muted-default";
        };
        inverse: {
            color: "--cnvs-sys-color-fg-inverse";
        };
    };
}, {}, {}, never, never>>, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
    typeLevel: {
        'title.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-title-lg, var(--cnvs-sys-font-size-title-large, 3.5rem))";
            lineHeight: "var(--cnvs-sys-line-height-title-lg, var(--cnvs-sys-line-height-title-large, 4rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'title.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-title-md, var(--cnvs-sys-font-size-title-medium, 3rem))";
            lineHeight: "var(--cnvs-sys-line-height-title-md, var(--cnvs-sys-line-height-title-medium, 3.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'title.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            lineHeight: "var(--cnvs-sys-line-height-title-sm, var(--cnvs-sys-line-height-title-small, 3rem))";
            fontSize: "var(--cnvs-sys-font-size-title-sm, var(--cnvs-sys-font-size-title-small, 2.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-lg, var(--cnvs-sys-font-size-heading-large, 2rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-lg, var(--cnvs-sys-line-height-heading-large, 2.5rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-md, var(--cnvs-sys-font-size-heading-medium, 1.75rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-md, var(--cnvs-sys-line-height-heading-medium, 2.25rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'heading.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-bold";
            fontSize: "var(--cnvs-sys-font-size-heading-sm, var(--cnvs-sys-font-size-heading-small, 1.5rem))";
            lineHeight: "var(--cnvs-sys-line-height-heading-sm, var(--cnvs-sys-line-height-heading-small, 2rem))";
            color: "--cnvs-sys-color-fg-strong";
        };
        'body.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-lg, var(--cnvs-sys-font-size-body-large, 1.25rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-lg, var(--cnvs-sys-line-height-body-large, 1.75rem))";
            color: "--cnvs-sys-color-fg-default";
        };
        'body.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-md, var(--cnvs-sys-font-size-body-medium, 1.125rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-md, var(--cnvs-sys-line-height-body-medium, 1.75rem))";
            color: "--cnvs-sys-color-fg-default";
        };
        'body.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-body-sm, var(--cnvs-sys-font-size-body-small, 1rem))";
            lineHeight: "var(--cnvs-sys-line-height-body-sm, var(--cnvs-sys-line-height-body-small, 1.5rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-body-sm, var(--cnvs-sys-type-letter-spacing-body-small))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.large': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.medium': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-md, var(--cnvs-sys-font-size-subtext-medium, 0.75rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-md, var(--cnvs-sys-line-height-subtext-medium, 1rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-md, var(--cnvs-sys-type-letter-spacing-subtext-medium))";
            color: "--cnvs-sys-color-fg-default";
        };
        'subtext.small': {
            fontFamily: "--cnvs-sys-font-family-default";
            fontWeight: "--cnvs-sys-font-weight-normal";
            fontSize: "var(--cnvs-sys-font-size-subtext-sm, var(--cnvs-sys-font-size-subtext-small, 0.625rem))";
            lineHeight: "var(--cnvs-sys-line-height-subtext-sm, var(--cnvs-sys-line-height-subtext-small, 1rem))";
            letterSpacing: "var(--cnvs-sys-letter-spacing-subtext-sm, var(--cnvs-sys-type-letter-spacing-subtext-small))";
            color: "--cnvs-sys-color-fg-default";
        };
    };
    variant: {
        error: {
            color: "var(--cnvs-sys-color-brand-fg-critical-default, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1)))";
        };
        hint: {
            color: "--cnvs-sys-color-fg-muted-default";
        };
        inverse: {
            color: "--cnvs-sys-color-fg-inverse";
        };
    };
}, {}, {}, never, never>, never>, never>;
/**
 * Adds the necessary props to the SidePanelHeading subcomponent.
 * This sets the `id` to the `labelId` from the model for accessibility purposes,
 * and hides the heading when the panel is not expanded.
 */
export declare const useSidePanelHeading: import("@workday/canvas-kit-react/common").BehaviorHook<{
    state: {
        panelId: string;
        labelId: string;
        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        origin: "end" | "start";
        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
    };
    events: {
        expand(): void;
        collapse(): void;
        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
        handleAnimationStart(): undefined;
    };
}, {
    readonly id: string;
    readonly hidden: boolean;
}>;
/**
 * `SidePanel.Heading` is a styled heading component that provides the accessible name
 * for the SidePanel. The heading's `id` is automatically set to the model's `labelId`,
 * which is used by the panel's `aria-labelledby` attribute.
 *
 * The heading is automatically hidden when the panel is collapsed.
 */
export declare const SidePanelHeading: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"h2", TypeLevelProps>, SidePanelHeadingProps, {
    state: {
        panelId: string;
        labelId: string;
        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        origin: "end" | "start";
        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
    };
    events: {
        expand(): void;
        collapse(): void;
        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
        handleAnimationStart(): undefined;
    };
}>;
//# sourceMappingURL=SidePanelHeading.d.ts.map