@primer/react-brand
Version:
Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.
23 lines (22 loc) • 1.5 kB
TypeScript
import { type ReactElement, type SVGAttributes } from 'react';
import { type Icon as OcticonProps } from '@primer/octicons-react';
import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon/colors.css';
import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes.css';
export declare const namedIconSizes: readonly ["small", "medium", "large"];
export type NamedIconSize = (typeof namedIconSizes)[number];
export declare const numericIconSizes: readonly [20, 24, 28, 32, 36, 40, 44];
export type NumericIconSize = (typeof numericIconSizes)[number];
export declare const iconSizes: readonly ["small", "medium", "large", 20, 24, 28, 32, 36, 40, 44];
export type IconSize = (typeof iconSizes)[number];
export declare const defaultIconSize: "small";
export declare const iconSizeMap: Record<NamedIconSize, NumericIconSize>;
export declare const iconColors: readonly ["default", "blue", "coral", "green", "gray", "indigo", "lemon", "lime", "orange", "pink", "purple", "red", "teal", "yellow"];
export type IconColor = (typeof iconColors)[number];
export declare const defaultIconColor: "default";
export type IconProps = SVGAttributes<SVGElement> & {
icon: OcticonProps | ReactElement<OcticonProps>;
color?: IconColor;
hasBackground?: boolean;
size?: IconSize;
};
export declare const Icon: ({ icon: Octicon, className, color, hasBackground, size, ...rest }: IconProps) => import("react/jsx-runtime").JSX.Element;