import React, { PropsWithChildren, type JSX } from 'react'; import { HeadingProps, type ImageProps, LinkProps } from '..'; import type { BaseProps } from '../component-helpers'; /** * Design tokens */ import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pillar/colors-with-modes.css'; export declare const PillarIconColors: readonly ["default", "blue", "coral", "green", "gray", "indigo", "lemon", "lime", "orange", "pink", "purple", "red", "teal", "yellow"]; export declare const defaultPillarIconColor: "default"; export type PillarProps = React.HTMLAttributes & { /** * The HTML element used to render the Pillar. */ as?: C | 'div' | 'article'; /** * Aligns the pillar content */ align?: 'start' | 'center'; /** * Enables optional border around the pillar content */ hasBorder?: boolean; } & (C extends 'article' ? PropsWithChildren> : PropsWithChildren>); type PillarImageProps = ImageProps; declare function PillarImage({ className, ...rest }: PillarImageProps): import("react/jsx-runtime").JSX.Element; type IconComponent = React.ComponentType<{ size?: number; }>; type PillarIconProps = BaseProps & { icon: React.ReactNode | IconComponent; color?: (typeof PillarIconColors)[number]; }; declare function PillarIcon({ icon: Icon, className, color, ...rest }: PillarIconProps): import("react/jsx-runtime").JSX.Element; type PillarHeadingProps = BaseProps & { children: React.ReactNode | React.ReactNode[]; as?: Exclude; } & HeadingProps; type PillarDescriptionProps = PropsWithChildren>; type PillarLinkProps = { href: string; } & Omit & BaseProps; /** * Pillar component: * {@link https://primer.style/brand/components/Pillar/ See usage examples}. */ export declare const Pillar: React.ForwardRefExoticComponent>, "ref"> & React.RefAttributes> & { Icon: typeof PillarIcon; Image: typeof PillarImage; Heading: React.ForwardRefExoticComponent & React.RefAttributes>; Description: React.ForwardRefExoticComponent & React.RefAttributes>; Link: React.ForwardRefExoticComponent & React.RefAttributes>; }; export {};