@primer/react
Version:
An implementation of GitHub's Primer Design System using React
106 lines • 3.65 kB
TypeScript
import React from 'react';
export type CardProps = React.ComponentPropsWithoutRef<'div'> & {
/**
* Provide an optional className to add to the outermost element rendered by
* the Card
*/
className?: string;
/**
* Controls the internal padding of the Card.
* @default 'normal'
*/
padding?: 'none' | 'condensed' | 'normal';
/**
* Controls the border radius of the Card.
* @default 'large'
*/
borderRadius?: 'medium' | 'large';
};
type HeadingLevel = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
type HeadingProps = React.ComponentPropsWithoutRef<'h3'> & {
/**
* The heading level to render. Defaults to 'h3'.
*/
as?: HeadingLevel;
children: React.ReactNode;
};
type DescriptionProps = React.ComponentPropsWithoutRef<'p'> & {
children: React.ReactNode;
};
type IconProps = {
/**
* An Octicon or custom SVG icon to render
*/
icon: React.ElementType;
/**
* Accessible label for the icon. When omitted, the icon is treated as decorative.
*/
'aria-label'?: string;
className?: string;
};
type ImageProps = React.ComponentPropsWithoutRef<'img'> & {
/**
* The image source URL
*/
src: string;
/**
* Alt text for accessibility
*/
alt?: string;
};
type MenuProps = {
children: React.ReactNode;
};
type MetadataProps = React.ComponentPropsWithoutRef<'div'> & {
children: React.ReactNode;
};
declare const CardImpl: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
/**
* Provide an optional className to add to the outermost element rendered by
* the Card
*/
className?: string;
/**
* Controls the internal padding of the Card.
* @default 'normal'
*/
padding?: "none" | "condensed" | "normal";
/**
* Controls the border radius of the Card.
* @default 'large'
*/
borderRadius?: "medium" | "large";
} & React.RefAttributes<HTMLDivElement>>;
declare const CardIcon: {
({ icon: IconComponent, "aria-label": ariaLabel, className }: IconProps): React.JSX.Element;
displayName: string;
};
declare const CardImage: {
({ src, alt, className, ...rest }: ImageProps): React.JSX.Element;
displayName: string;
};
declare const CardHeading: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
/**
* The heading level to render. Defaults to 'h3'.
*/
as?: HeadingLevel;
children: React.ReactNode;
} & React.RefAttributes<HTMLHeadingElement>>;
declare const CardDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
children: React.ReactNode;
} & React.RefAttributes<HTMLParagraphElement>>;
declare const CardMenu: {
({ children }: MenuProps): React.JSX.Element;
displayName: string;
};
declare const CardMetadata: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
children: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>>;
export { CardImpl, CardIcon, CardImage, CardHeading, CardDescription, CardMenu, CardMetadata };
export type { HeadingProps as CardHeadingProps };
export type { DescriptionProps as CardDescriptionProps };
export type { IconProps as CardIconProps };
export type { ImageProps as CardImageProps };
export type { MenuProps as CardMenuProps };
export type { MetadataProps as CardMetadataProps };
//# sourceMappingURL=Card.d.ts.map