@patreon/studio/module/components/MediaLockup/index.d.ts

Patreon Studio Design System

import type { AriaAttributes } from 'react';
import React from 'react';
import type { AvatarProps } from '~/components/Avatar/types';
import type { IconProps } from '~/components/Icon/types';
import type { ImageProps } from '~/components/Image/types';
import type { LoadingSpinnerProps } from '~/components/LoadingSpinner/types';
import type { BaseProps, ChildrenProps, StylableProps } from '~/types/component';
type Variant = 'body' | 'heading' | 'custom';
type Size = 'xs' | 'sm' | 'md' | 'lg';
type MediaComponent = {
    type: 'icon';
    component: React.FC<IconProps>;
    props?: IconProps;
} | {
    type: 'avatar';
    component: React.FC<AvatarProps>;
    props?: AvatarProps;
} | {
    type: 'image';
    component: React.FC<ImageProps>;
    props: ImageProps;
} | {
    type: 'loading';
    component: React.FC<LoadingSpinnerProps>;
    props?: LoadingSpinnerProps;
};
export interface MediaLockupProps extends BaseProps, ChildrenProps, StylableProps, AriaAttributes {
    /** The variant of the media lockup. */
    variant: Variant;
    /** The size of the media lockup. */
    size: Size;
    /** The media to display before the children. */
    leadingMedia?: MediaComponent;
    /** The media to display after the children. */
    trailingMedia?: MediaComponent;
}
export declare function MediaLockup({ children, 'data-tag': dataTag, id, size, variant, leadingMedia, trailingMedia, className, style, ...props }: MediaLockupProps): React.JSX.Element;
declare function MediaComponent({ variant, size, media }: {
    variant: Variant;
    size: Size;
    media: MediaComponent;
}): React.JSX.Element | null;
export {};