import React from 'react'; import { type HeadingProps, type TextProps } from '..'; import type { BaseProps } from '../component-helpers'; /** * Design tokens */ import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes.css'; export type MediaPlaylistProps = React.PropsWithChildren<{ /** * The index of the item to be selected by default. This is ignored if `selectedIndex` is provided. */ defaultSelectedIndex?: number; /** * The index of the currently selected item. This makes the component controlled. */ selectedIndex?: number; /** * Callback fired when the selected index changes. */ onChange?: (selectedIndex: number) => void; 'data-testid'?: string; }> & Omit, 'onChange'>; export type MediaPlaylistHeadingProps = React.PropsWithChildren<{ as?: Exclude; }> & BaseProps; type MediaPlaylistHeadingInternalProps = { activeIndex?: number | null; itemCount?: number; }; declare function MediaPlaylistHeading({ activeIndex, as, children, className, id, itemCount, ...props }: MediaPlaylistHeadingProps & MediaPlaylistHeadingInternalProps): React.JSX.Element; export type MediaPlaylistItemProps = React.PropsWithChildren<{ /** * An optional thumbnail to be shown in the playlist for this item. */ thumbnail?: React.ReactNode; } & BaseProps>; declare function MediaPlaylistItem({ children }: MediaPlaylistItemProps): React.JSX.Element; export type MediaPlaylistItemHeadingProps = Omit & { children?: React.ReactNode; description?: React.ReactNode; title?: React.ReactNode; }; declare function MediaPlaylistItemHeading({ children, className, description, font, size, title, variant, weight, ...props }: MediaPlaylistItemHeadingProps): React.JSX.Element; export type MediaPlaylistItemContentProps = React.HTMLAttributes; declare function MediaPlaylistItemContent({ children, className, ...props }: MediaPlaylistItemContentProps): React.JSX.Element; export type MediaPlaylistItemMediaProps = React.HTMLAttributes; /** * Use MediaPlaylist to pair media playback with an itemized, thumbnail-backed playlist. */ export declare const MediaPlaylist: React.ForwardRefExoticComponent<{ /** * The index of the item to be selected by default. This is ignored if `selectedIndex` is provided. */ defaultSelectedIndex?: number; /** * The index of the currently selected item. This makes the component controlled. */ selectedIndex?: number; /** * Callback fired when the selected index changes. */ onChange?: (selectedIndex: number) => void; 'data-testid'?: string; } & { children?: React.ReactNode | undefined; } & Omit, "onChange"> & React.RefAttributes> & { Heading: typeof MediaPlaylistHeading; Item: typeof MediaPlaylistItem; ItemHeading: typeof MediaPlaylistItemHeading; ItemContent: typeof MediaPlaylistItemContent; ItemMedia: React.ForwardRefExoticComponent>; testIds: { root: string; }; }; export {};