import * as React from 'react';

export interface AppProps {
    library?: any;
    docs: Object;
    parents?: Object;
    sections?: Object;
    themes?: Object;
    icons?: Object;
    descriptions?: Object;
    trayWidth?: number;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class App extends React.Component<AppProps, any> {
    render(): JSX.Element;

}




export interface CodePenButtonProps {
    code: string;
    title: string;
    language: string;
    render?: boolean;
    options?: Object;
}

export class CodePenButton extends React.Component<CodePenButtonProps, any> {
    render(): JSX.Element;

}




export interface ColorBandProps {
    height?: string;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class ColorBand extends React.Component<ColorBandProps, any> {
    render(): JSX.Element;

}




export interface ColorCardProps {
    hex: string;
    name?: string;
    minimal?: boolean;
}

export class ColorCard extends React.Component<ColorCardProps, any> {
    render(): JSX.Element;

}




export interface ColorNameProps {
    name: string;
}

export class ColorName extends React.Component<ColorNameProps, any> {
    render(): JSX.Element;

}




export type ColorSwatchColor = string | number;

export interface ColorSwatchProps {
    color: ColorSwatchColor;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class ColorSwatch extends React.Component<ColorSwatchProps, any> {
    render(): JSX.Element;

}




export interface ComponentThemeProps {
    componentTheme: Object;
    themeVariables: Object;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class ComponentTheme extends React.Component<ComponentThemeProps, any> {
    render(): JSX.Element;

}




export interface ContentWrapProps {
    children?: React.ReactNode;
    maxWidth?: string;
    padding?: any;
}

export class ContentWrap extends React.Component<ContentWrapProps, any> {
    render(): JSX.Element;

}




export interface DescriptionProps {
    id: string;
    content: string;
    title: string;
}

export class Description extends React.Component<DescriptionProps, any> {
    render(): JSX.Element;

}




export interface DocumentProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    doc?: any;
    description?: string;
    themeVariables?: Object;
    repository?: string;
    layout?: string;
}

export class Document extends React.Component<DocumentProps, any> {
    render(): JSX.Element;

}




export type FigureRecommendation = "yes" | "no" | "a11y" | "none";

export type FigureFloat = "start" | "end" | "none";

export interface FigureProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    title?: React.ReactNode;
    caption?: React.ReactNode;
    recommendation?: FigureRecommendation;
    iconTitle?: string;
    float?: FigureFloat;
    children?: any;
}

export class Figure extends React.Component<FigureProps, any> {
    render(): JSX.Element;

}




export interface GlyphProps {
    name: string;
    variants: Object;
    onClick: (...args: any[])=>any;
    rtl?: boolean;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class Glyph extends React.Component<GlyphProps, any> {
    render(): JSX.Element;

}




export interface GuidelinesProps {
    children?: React.ReactNode;
}

export class Guidelines extends React.Component<GuidelinesProps, any> {
    render(): JSX.Element;

}




export interface HeaderProps {
    name: string;
    version?: string;
}

export class Header extends React.Component<HeaderProps, any> {
    render(): JSX.Element;

}




declare const Heading: React.FC;

export default Heading;




export type HeroLayout = "small" | "medium" | "large" | "x-large";

export interface HeroProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    name: string;
    repository: string;
    version: string;
    layout: HeroLayout;
    description?: string;
    docs?: Object;
}

export class Hero extends React.Component<HeroProps, any> {
    render(): JSX.Element;

}




export interface IconsProps {
    selectedFormat: string;
    formats: Object;
    packageName: string;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class Icons extends React.Component<IconsProps, any> {
    render(): JSX.Element;

}




declare const Link: React.FC;

export default Link;




export interface MethodsProps {
    methods: any[];
}

export class Methods extends React.Component<MethodsProps, any> {
    render(): JSX.Element;

}




export interface NavProps {
    docs: Object;
    sections: Object;
    themes?: Object;
    icons?: Object;
    selected?: string;
}

export class Nav extends React.Component<NavProps, any> {
    render(): JSX.Element;

}




export type NavToggleVariant = "section" | "category";

export interface NavToggleProps {
    summary: string;
    variant?: NavToggleVariant;
    children?: React.ReactNode;
}

export class NavToggle extends React.Component<NavToggleProps, any> {
    render(): JSX.Element;

}




export interface ParamsProps {
    params: any[];
    layout?: string;
}

export class Params extends React.Component<ParamsProps, any> {
    render(): JSX.Element;

}




export type PlaygroundBackground = "checkerboard" | "checkerboard-inverse" | "light" | "inverse" | "none";

export interface PlaygroundProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    title: string;
    code: string;
    language: string;
    render?: boolean;
    background?: PlaygroundBackground;
    readOnly?: boolean;
}

export class Playground extends React.Component<PlaygroundProps, any> {
    render(): JSX.Element;

}




export type PreviewBackground = "checkerboard" | "checkerboard-inverse" | "inverse" | "light" | "none";

export interface PreviewProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    code: string;
    render?: boolean;
    language: string;
    fullscreen?: boolean;
    frameless?: boolean;
    inverse?: boolean;
    rtl?: boolean;
    background?: PreviewBackground;
    themes?: Object;
    themeKey?: string;
}

export class Preview extends React.Component<PreviewProps, any> {
    render(): JSX.Element;

}




export interface PropertiesProps {
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
    props: Object;
    layout?: string;
}

export class Properties extends React.Component<PropertiesProps, any> {
    render(): JSX.Element;

}




export interface ReturnsProps {
    types: any[];
}

export class Returns extends React.Component<ReturnsProps, any> {
    render(): JSX.Element;

}




export interface SearchProps {
    options?: Object;
}

export class Search extends React.Component<SearchProps, any> {
    render(): JSX.Element;

}




export type SearchStatusStatus = "inactive" | "active";

export interface SearchStatusProps {
    size?: string;
    status?: SearchStatusStatus;
    makeStyles?: (...args: any[])=>any;
    styles?: Object;
}

export class SearchStatus extends React.Component<SearchStatusProps, any> {
    render(): JSX.Element;

}




export interface SectionProps {
    id?: string;
    heading?: string;
    children?: React.ReactNode;
}

export class Section extends React.Component<SectionProps, any> {
    render(): JSX.Element;

}




export type SelectRenderLabel = React.ReactNode | ((...args: any[])=>any);

export type SelectRenderBeforeInput = React.ReactNode | ((...args: any[])=>any);

export interface SelectProps {
    name: string;
    renderLabel: SelectRenderLabel;
    renderBeforeInput?: SelectRenderBeforeInput;
    id?: string;
    value?: string;
    onChange?: (...args: any[])=>any;
    children?: React.ReactNode;
}

export class Select extends React.Component<SelectProps, any> {
    render(): JSX.Element;

}




export interface ThemeProps {
    themeKey: string;
    variables: Object;
    requirePath: string;
    description?: string;
}

export class Theme extends React.Component<ThemeProps, any> {
    render(): JSX.Element;

}




export interface ThemeColorsProps {
    colors: Object;
}

export class ThemeColors extends React.Component<ThemeColorsProps, any> {
    render(): JSX.Element;

}




export interface ToggleBlockquoteProps {
    summary: React.ReactNode;
    children?: React.ReactNode;
}

export class ToggleBlockquote extends React.Component<ToggleBlockquoteProps, any> {
    render(): JSX.Element;

}