UNPKG

declarations

Version:

[![npm version](https://badge.fury.io/js/declarations.svg)](https://www.npmjs.com/package/declarations)

1,218 lines (1,143 loc) 360 kB
// Type definitions for material-ui v0.14.4 // Project: https://github.com/callemall/material-ui // Definitions by: Nathan Brown <https://github.com/ngbrown>, Oliver Herrmann <https://github.com/herrmanno> // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped ///<reference path='../../react/react.d.ts' /> declare module "material-ui" { export import AppBar = __MaterialUI.AppBar; // require('material-ui/lib/app-bar'); export import AppCanvas = __MaterialUI.AppCanvas; // require('material-ui/lib/app-canvas'); export import AutoComplete = __MaterialUI.AutoComplete; // require('material-ui/lib/auto-complete'); export import Avatar = __MaterialUI.Avatar; // require('material-ui/lib/avatar'); export import Badge = __MaterialUI.Badge; // require('material-ui/lib/badge'); export import BeforeAfterWrapper = __MaterialUI.BeforeAfterWrapper; // require('material-ui/lib/before-after-wrapper'); export import Card = __MaterialUI.Card.Card; // require('material-ui/lib/card/card'); export import CardActions = __MaterialUI.Card.CardActions; // require('material-ui/lib/card/card-actions'); export import CardExpandable = __MaterialUI.Card.CardExpandable; // require('material-ui/lib/card/card-expandable'); export import CardHeader = __MaterialUI.Card.CardHeader; // require('material-ui/lib/card/card-header'); export import CardMedia = __MaterialUI.Card.CardMedia; // require('material-ui/lib/card/card-media'); export import CardText = __MaterialUI.Card.CardText; // require('material-ui/lib/card/card-text'); export import CardTitle = __MaterialUI.Card.CardTitle; // require('material-ui/lib/card/card-title'); export import Checkbox = __MaterialUI.Checkbox; // require('material-ui/lib/checkbox'); export import CircularProgress = __MaterialUI.CircularProgress; // require('material-ui/lib/circular-progress'); export import ClearFix = __MaterialUI.ClearFix; // require('material-ui/lib/clearfix'); export import DatePicker = __MaterialUI.DatePicker.DatePicker; // require('material-ui/lib/date-picker/date-picker'); export import DatePickerDialog = __MaterialUI.DatePicker.DatePickerDialog; // require('material-ui/lib/date-picker/date-picker-dialog'); export import Dialog = __MaterialUI.Dialog // require('material-ui/lib/dialog'); export import Divider = __MaterialUI.Divider // require('material-ui/lib/divider'); export import DropDownMenu = __MaterialUI.Menus.DropDownMenu; // require('material-ui/lib/DropDownMenu/DropDownMenu'); export import EnhancedButton = __MaterialUI.EnhancedButton; // require('material-ui/lib/enhanced-button'); export import FlatButton = __MaterialUI.FlatButton; // require('material-ui/lib/flat-button'); export import FloatingActionButton = __MaterialUI.FloatingActionButton; // require('material-ui/lib/floating-action-button'); export import FontIcon = __MaterialUI.FontIcon; // require('material-ui/lib/font-icon'); export import GridList = __MaterialUI.GridList.GridList; // require('material-ui/lib/gridlist/grid-list'); export import GridTile = __MaterialUI.GridList.GridTile; // require('material-ui/lib/gridlist/grid-tile'); export import IconButton = __MaterialUI.IconButton; // require('material-ui/lib/icon-button'); export import IconMenu = __MaterialUI.Menus.IconMenu; // require('material-ui/lib/menus/icon-menu'); export import LeftNav = __MaterialUI.LeftNav; // require('material-ui/lib/left-nav'); export import LinearProgress = __MaterialUI.LinearProgress; // require('material-ui/lib/linear-progress'); export import List = __MaterialUI.Lists.List; // require('material-ui/lib/lists/list'); export import ListDivider = __MaterialUI.Lists.ListDivider; // require('material-ui/lib/lists/list-divider'); export import ListItem = __MaterialUI.Lists.ListItem; // require('material-ui/lib/lists/list-item'); export import Menu = __MaterialUI.Menus.Menu; // require('material-ui/lib/menus/menu'); export import MenuItem = __MaterialUI.Menus.MenuItem; // require('material-ui/lib/menus/menu-item'); export import Mixins = __MaterialUI.Mixins; // require('material-ui/lib/mixins'); export import Overlay = __MaterialUI.Overlay; // require('material-ui/lib/overlay'); export import Paper = __MaterialUI.Paper; // require('material-ui/lib/paper'); export import Popover = __MaterialUI.Popover.Popover; // require('material-ui/lib/popover/popover'); export import RadioButton = __MaterialUI.RadioButton; // require('material-ui/lib/radio-button'); export import RadioButtonGroup = __MaterialUI.RadioButtonGroup; // require('material-ui/lib/radio-button-group'); export import RaisedButton = __MaterialUI.RaisedButton; // require('material-ui/lib/raised-button'); export import RefreshIndicator = __MaterialUI.RefreshIndicator; // require('material-ui/lib/refresh-indicator'); export import Ripples = __MaterialUI.Ripples; // require('material-ui/lib/ripples'); export import SelectField = __MaterialUI.SelectField; // require('material-ui/lib/select-field'); export import SelectableContainerEnhance = __MaterialUI.Hoc.SelectableContainerEnhance; // require('material-ui/lib/hoc/selectable-enhance'); export import Slider = __MaterialUI.Slider; // require('material-ui/lib/slider'); export import SvgIcon = __MaterialUI.SvgIcon; // require('material-ui/lib/svg-icon'); export import Styles = __MaterialUI.Styles; // require('material-ui/lib/styles'); export import Snackbar = __MaterialUI.Snackbar; // require('material-ui/lib/snackbar'); export import Tab = __MaterialUI.Tabs.Tab; // require('material-ui/lib/tabs/tab'); export import Tabs = __MaterialUI.Tabs.Tabs; // require('material-ui/lib/tabs/tabs'); export import Table = __MaterialUI.Table.Table; // require('material-ui/lib/table/table'); export import TableBody = __MaterialUI.Table.TableBody; // require('material-ui/lib/table/table-body'); export import TableFooter = __MaterialUI.Table.TableFooter; // require('material-ui/lib/table/table-footer'); export import TableHeader = __MaterialUI.Table.TableHeader; // require('material-ui/lib/table/table-header'); export import TableHeaderColumn = __MaterialUI.Table.TableHeaderColumn; // require('material-ui/lib/table/table-header-column'); export import TableRow = __MaterialUI.Table.TableRow; // require('material-ui/lib/table/table-row'); export import TableRowColumn = __MaterialUI.Table.TableRowColumn; // require('material-ui/lib/table/table-row-column'); export import Toggle = __MaterialUI.Toggle; // require('material-ui/lib/toggle'); export import ThemeWrapper = __MaterialUI.ThemeWrapper; // require('material-ui/lib/theme-wrapper'); export import TimePicker = __MaterialUI.TimePicker; // require('material-ui/lib/time-picker'); export import TextField = __MaterialUI.TextField; // require('material-ui/lib/text-field'); export import Toolbar = __MaterialUI.Toolbar.Toolbar; // require('material-ui/lib/toolbar/toolbar'); export import ToolbarGroup = __MaterialUI.Toolbar.ToolbarGroup; // require('material-ui/lib/toolbar/toolbar-group'); export import ToolbarSeparator = __MaterialUI.Toolbar.ToolbarSeparator; // require('material-ui/lib/toolbar/toolbar-separator'); export import ToolbarTitle = __MaterialUI.Toolbar.ToolbarTitle; // require('material-ui/lib/toolbar/toolbar-title'); export import Tooltip = __MaterialUI.Tooltip; // require('material-ui/lib/tooltip'); export import Utils = __MaterialUI.Utils; // require('material-ui/lib/utils'); // svg icons import NavigationMenu = __MaterialUI.SvgIcon; // require('material-ui/lib/svg-icon/navigation/menu'); import NavigationChevronLeft = __MaterialUI.SvgIcon; // require('material-ui/lib/svg-icon/navigation/chevron-left'); import NavigationChevronRight = __MaterialUI.SvgIcon; // require('material-ui/lib/svg-icon/navigation/chevron-right'); export const Icons: { NavigationMenu: NavigationMenu, NavigationChevronLeft: NavigationChevronLeft, NavigationChevronRight: NavigationChevronRight, }; // export type definitions export type TouchTapEvent = __MaterialUI.TouchTapEvent; export type TouchTapEventHandler = __MaterialUI.TouchTapEventHandler; export type DialogAction = __MaterialUI.DialogAction; } declare namespace __MaterialUI { export import React = __React; // ReactLink is from "react/addons" interface ReactLink<T> { value: T; requestChange(newValue: T): void; } // What's common between React.TouchEvent and React.MouseEvent interface TouchTapEvent extends React.SyntheticEvent { altKey: boolean; ctrlKey: boolean; getModifierState(key: string): boolean; metaKey: boolean; shiftKey: boolean; } // What's common between React.TouchEventHandler and React.MouseEventHandler interface TouchTapEventHandler extends React.EventHandler<TouchTapEvent> { } interface ThemeWrapperProps extends React.Props<ThemeWrapper> { theme: Styles.MuiTheme; } export class ThemeWrapper extends React.Component<ThemeWrapperProps, {}> { } export namespace Styles { interface AutoPrefix { all(styles: React.CSSProperties): React.CSSProperties; set(style: React.CSSProperties, key: string, value: string | number): void; single(key: string): string; singleHyphened(key: string): string; } export var AutoPrefix: AutoPrefix; interface Spacing { iconSize?: number; desktopGutter?: number; desktopGutterMore?: number; desktopGutterLess?: number; desktopGutterMini?: number; desktopKeylineIncrement?: number; desktopDropDownMenuItemHeight?: number; desktopDropDownMenuFontSize?: number; desktopLeftNavMenuItemHeight?: number; desktopSubheaderHeight?: number; desktopToolbarHeight?: number; } export var Spacing: Spacing; interface ThemePalette { primary1Color?: string; primary2Color?: string; primary3Color?: string; accent1Color?: string; accent2Color?: string; accent3Color?: string; textColor?: string; alternateTextColor?: string; canvasColor?: string; borderColor?: string; disabledColor?: string; pickerHeaderColor?: string; clockCircleColor?: string; shadowColor?: string; } interface MuiTheme { isRtl?: boolean; userAgent?: any; zIndex?: zIndex; baseTheme?: RawTheme; rawTheme?: RawTheme; appBar?: { color?: string, textColor?: string, height?: number, }; avatar?: { borderColor?: string, } badge?: { color?: string, textColor?: string, primaryColor?: string, primaryTextColor?: string, secondaryColor?: string, secondaryTextColor?: string, }, button?: { height?: number, minWidth?: number, iconButtonSize?: number, }, cardText?: { textColor?: string, }, checkbox?: { boxColor?: string, checkedColor?: string, requiredColor?: string, disabledColor?: string, labelColor?: string, labelDisabledColor?: string, }, datePicker?: { color?: string, textColor?: string, calendarTextColor?: string, selectColor?: string, selectTextColor?: string, }, dropDownMenu?: { accentColor?: string, }, flatButton?: { color?: string, buttonFilterColor?: string, disabledColor?: string, textColor?: string, primaryTextColor?: string, secondaryTextColor?: string, }, floatingActionButton?: { buttonSize?: number, miniSize?: number, color?: string, iconColor?: string, secondaryColor?: string, secondaryIconColor?: string, disabledColor?: string, disabledTextColor?: string, }, gridTile?: { textColor?: string, }, inkBar?: { backgroundColor?: string, }, leftNav?: { width?: number, color?: string, }, listItem?: { nestedLevelDepth?: number, }, menu?: { backgroundColor?: string, containerBackgroundColor?: string, }, menuItem?: { dataHeight?: number, height?: number, hoverColor?: string, padding?: number, selectedTextColor?: string, }, menuSubheader?: { padding?: number, borderColor?: string, textColor?: string, }, paper?: { backgroundColor?: string, zDepthShadows?: string[], }, radioButton?: { borderColor?: string, backgroundColor?: string, checkedColor?: string, requiredColor?: string, disabledColor?: string, size?: number, labelColor?: string, labelDisabledColor?: string, }, raisedButton?: { color?: string, textColor?: string, primaryColor?: string, primaryTextColor?: string, secondaryColor?: string, secondaryTextColor?: string, disabledColor?: string, disabledTextColor?: string, }, refreshIndicator?: { strokeColor?: string, loadingStrokeColor?: string, }; slider?: { trackSize?: number, trackColor?: string, trackColorSelected?: string, handleSize?: number, handleSizeDisabled?: number, handleSizeActive?: number, handleColorZero?: string, handleFillColor?: string, selectionColor?: string, rippleColor?: string, }, snackbar?: { textColor?: string, backgroundColor?: string, actionColor?: string, }, table?: { backgroundColor?: string; }; tableHeader?: { borderColor?: string; }; tableHeaderColumn?: { textColor?: string; height?: number; spacing?: number; }; tableFooter?: { borderColor?: string; textColor?: string; }; tableRow?: { hoverColor?: string; stripeColor?: string; selectedColor?: string; textColor?: string; borderColor?: string; height?: number; }; tableRowColumn?: { height?: number; spacing?: number; }; timePicker?: { color?: string; textColor?: string; accentColor?: string; clockColor?: string; clockCircleColor?: string; headerColor?: string; selectColor?: string; selectTextColor?: string; }; toggle?: { thumbOnColor?: string, thumbOffColor?: string, thumbDisabledColor?: string, thumbRequiredColor?: string, trackOnColor?: string, trackOffColor?: string, trackDisabledColor?: string, labelColor?: string, labelDisabledColor?: string trackRequiredColor?: string, }, toolbar?: { backgroundColor?: string, height?: number, titleFontSize?: number, iconColor?: string, separatorColor?: string, menuHoverColor?: string, }; tabs?: { backgroundColor?: string, textColor?: string, selectedTextColor?: string, }; textField?: { textColor?: string; hintColor?: string; floatingLabelColor?: string; disabledTextColor?: string; errorColor?: string; focusColor?: string; backgroundColor?: string; borderColor?: string; }; } interface zIndex { menu: number; appBar: number; leftNavOverlay: number; leftNav: number; dialogOverlay: number; dialog: number; layer: number; popover: number; snackbar: number; tooltip: number; } export var zIndex: zIndex; interface RawTheme { spacing?: Spacing; fontFamily?: string; palette?: ThemePalette; zIndex?: zIndex; } var lightBaseTheme: RawTheme; var darkBaseTheme: RawTheme; export function ThemeDecorator(muiTheme: Styles.MuiTheme): <TFunction extends Function>(Component: TFunction) => TFunction; export function getMuiTheme(baseTheme: RawTheme, muiTheme ?: MuiTheme): MuiTheme; interface ThemeManager { getMuiTheme(baseTheme: RawTheme, muiTheme?: MuiTheme): MuiTheme; modifyRawThemeSpacing(muiTheme: MuiTheme, newSpacing: Spacing): MuiTheme; modifyRawThemePalette(muiTheme: MuiTheme, newPaletteKeys: ThemePalette): MuiTheme; modifyRawThemeFontFamily(muiTheme: MuiTheme, newFontFamily: string): MuiTheme; } export var ThemeManager: ThemeManager; interface Transitions { easeOut(duration?: string, property?: string | string[], delay?: string, easeFunction?: string): string; create(duration?: string, property?: string, delay?: string, easeFunction?: string): string; easeOutFunction: string; easeInOutFunction: string; } export var Transitions: Transitions; interface Typography { textFullBlack: string; textDarkBlack: string; textLightBlack: string; textMinBlack: string; textFullWhite: string; textDarkWhite: string; textLightWhite: string; // font weight fontWeightLight: number; fontWeightNormal: number; fontWeightMedium: number; fontStyleButtonFontSize: number; } export var Typography: Typography; export var DarkRawTheme: RawTheme; export var LightRawTheme: RawTheme; } interface AppBarProps extends React.Props<AppBar> { className?: string; iconClassNameLeft?: string; iconClassNameRight?: string; iconElementLeft?: React.ReactElement<any>; iconElementRight?: React.ReactElement<any>; iconStyleRight?: string; onLeftIconButtonTouchTap?: TouchTapEventHandler; onRightIconButtonTouchTap?: TouchTapEventHandler; onTitleTouchTap?: TouchTapEventHandler; showMenuIconButton?: boolean; style?: React.CSSProperties; title?: React.ReactNode; titleStyle?: React.CSSProperties; zDepth?: number; } export class AppBar extends React.Component<AppBarProps, {}>{ } interface AppCanvasProps extends React.Props<AppCanvas> { } export class AppCanvas extends React.Component<AppCanvasProps, {}> { } interface Origin { horizontal: string; // oneOf(['left', 'middle', 'right']) vertical: string; // oneOf(['top', 'center', 'bottom']) } type AutoCompleteDataItem = { text: string, value: React.ReactNode } | string; type AutoCompleteDataSource = { text: string, value: React.ReactNode }[] | string[]; interface AutoCompleteProps extends React.Props<AutoComplete> { anchorOrigin?: Origin; animated?: boolean; dataSource?: AutoCompleteDataSource; disableFocusRipple?: boolean; errorStyle?: React.CSSProperties; errorText?: string; filter?: (searchText: string, key: string, item: AutoCompleteDataItem) => boolean; floatingLabelText?: string; fullWidth?: boolean; hintText?: string; listStyle?: React.CSSProperties; menuCloseDelay?: number; menuProps?: any; menuStyle?: React.CSSProperties; onNewRequest?: (chosenRequest: string, index: number) => void; onUpdateInput?: (searchText: string, dataSource: AutoCompleteDataSource) => void; open?: boolean; searchText?: string; /** @deprecated use noFilter instead */ showAllItems?: boolean; style?: React.CSSProperties; targetOrigin?: Origin; touchTapCloseDelay?: number; triggerUpdateOnFocus?: boolean; /** @deprecated updateWhenFocused has been renamed to triggerUpdateOnFocus */ updateWhenFocused?: boolean; } export class AutoComplete extends React.Component<AutoCompleteProps, {}> { static noFilter: () => boolean; static defaultFilter: (searchText: string, key: string) => boolean; static caseSensitiveFilter: (searchText: string, key: string) => boolean; static caseInsensitiveFilter: (searchText: string, key: string) => boolean; static levenshteinDistanceFilter(distanceLessThan: number): (searchText: string, key: string) => boolean; static fuzzyFilter: (searchText: string, key: string) => boolean; static Item: Menus.MenuItem; static Divider: Divider; } interface AvatarProps extends React.Props<Avatar> { backgroundColor?: string; className?: string; color?: string; icon?: React.ReactElement<any>; size?: number; src?: string; style?: React.CSSProperties; } export class Avatar extends React.Component<AvatarProps, {}> { } interface BadgeProps extends React.Props<Badge> { badgeContent: React.ReactNode; badgeStyle?: React.CSSProperties; className?: string; primary?: boolean; secondary?: boolean; style?: React.CSSProperties; } export class Badge extends React.Component<BadgeProps, {}> { } interface BeforeAfterWrapperProps extends React.Props<BeforeAfterWrapper> { afterElementType?: string; afterStyle?: React.CSSProperties; beforeElementType?: string; beforeStyle?: React.CSSProperties; elementType?: string; style?: React.CSSProperties; } export class BeforeAfterWrapper extends React.Component<BeforeAfterWrapperProps, {}> { } // non generally overridden elements of EnhancedButton interface SharedEnhancedButtonProps<T> extends React.Props<T> { centerRipple?: boolean; disableFocusRipple?: boolean; disableKeyboardFocus?: boolean; disableTouchRipple?: boolean; focusRippleColor?: string; focusRippleOpacity?: number; keyboardFocused?: boolean; linkButton?: boolean; onBlur?: React.FocusEventHandler; onFocus?: React.FocusEventHandler; onKeyboardFocus?: (e: React.FocusEvent, isKeyboardFocused: boolean) => void; onKeyDown?: React.KeyboardEventHandler; onKeyUp?: React.KeyboardEventHandler; onTouchTap?: TouchTapEventHandler; style?: React.CSSProperties; tabIndex?: number; touchRippleColor?: string; touchRippleOpacity?: number; type?: string; } interface EnhancedButtonProps extends React.HTMLAttributes, SharedEnhancedButtonProps<EnhancedButton> { // container element, <button/>, or <span/>(if disabled link) is the element that get the 'other' properties containerElement?: React.ReactNode | string; disabled?: boolean; } export class EnhancedButton extends React.Component<EnhancedButtonProps, {}> { } interface FlatButtonProps extends React.DOMAttributes, SharedEnhancedButtonProps<FlatButton> { // <EnhancedButton/> is the element that get the 'other' properties backgroundColor?: string; disabled?: boolean; hoverColor?: string; href?: string; icon?: React.ReactNode; label?: string; labelPosition?: string; // oneOf(['left', 'right']) labelStyle?: React.CSSProperties; linkButton?: boolean; onKeyboardFocus?: (e: React.FocusEvent, isKeyboardFocused: boolean) => void; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; onTouchStart?: React.TouchEventHandler; primary?: boolean; rippleColor?: string; secondary?: boolean; style?: React.CSSProperties; } export class FlatButton extends React.Component<FlatButtonProps, {}> { } interface RaisedButtonProps extends SharedEnhancedButtonProps<RaisedButton> { // <EnhancedButton/> is the element that get the 'other' properties backgroundColor?: string; className?: string; disabled?: boolean; disabledBackgroundColor?: string; disabledLabelColor?: string; fullWidth?: boolean; href?: string; icon?: React.ReactNode; label?: string; labelColor?: string; labelPosition?: string; // oneOf(['left', 'right']) labelStyle?: React.CSSProperties; linkButton?: boolean; onMouseDown?: React.MouseEventHandler; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; onMouseUp?: React.MouseEventHandler; onTouchEnd?: React.TouchEventHandler; onTouchStart?: React.TouchEventHandler; primary?: boolean; rippleStyle?: React.CSSProperties; secondary?: boolean; style?: React.CSSProperties; } export class RaisedButton extends React.Component<RaisedButtonProps, {}> { } interface FloatingActionButtonProps extends React.HTMLAttributes, SharedEnhancedButtonProps<FloatingActionButton> { // <EnhancedButton/> is the element that get the 'other' properties backgroundColor?: string; className?: string; disabled?: boolean; disabledColor?: string; href?: string; iconClassName?: string; iconStyle?: React.CSSProperties; linkButton?: boolean; mini?: boolean; onMouseDown?: React.MouseEventHandler; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; onMouseUp?: React.MouseEventHandler; onTouchEnd?: React.TouchEventHandler; onTouchStart?: React.TouchEventHandler; secondary?: boolean; style?: React.CSSProperties; zDepth?: number; } export class FloatingActionButton extends React.Component<FloatingActionButtonProps, {}> { } interface IconButtonProps extends React.HTMLAttributes, SharedEnhancedButtonProps<IconButton> { // <EnhancedButton/> is the element that get the 'other' properties className?: string; disabled?: boolean; iconClassName?: string; iconStyle?: React.CSSProperties; onBlur?: React.FocusEventHandler; onFocus?: React.FocusEventHandler; onKeyboardFocus?: (e: React.FocusEvent, isKeyboardFocused: boolean) => void; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; style?: React.CSSProperties; tooltip?: string; tooltipPosition?: string; tooltipStyles?: React.CSSProperties; touch?: boolean; } export class IconButton extends React.Component<IconButtonProps, {}> { } namespace Card { interface CardProps extends React.Props<Card> { actAsExpander?: boolean; expandable?: boolean; initiallyExpanded?: boolean; onExpandChange?: (isExpanded: boolean) => void; showExpandableButton?: boolean; style?: React.CSSProperties; } export class Card extends React.Component<CardProps, {}> { } interface CardActionsProps extends React.Props<CardActions> { actAsExpander?: boolean; expandable?: boolean; showExpandableButton?: boolean; style?: React.CSSProperties; } export class CardActions extends React.Component<CardActionsProps, {}> { } interface CardExpandableProps extends React.Props<CardExpandable> { expanded?: boolean; onExpanding?: (isExpanded: boolean) => void; style?: React.CSSProperties; } export class CardExpandable extends React.Component<CardExpandableProps, {}> { } interface CardHeaderProps extends React.Props<CardHeader> { actAsExpander?: boolean; avatar?: React.ReactNode; expandable?: boolean; showExpandableButton?: boolean; style?: React.CSSProperties; subtitle?: React.ReactNode; subtitleColor?: string; subtitleStyle?: React.CSSProperties; textStyle?: React.CSSProperties; title?: React.ReactNode; titleColor?: string; titleStyle?: React.CSSProperties; } export class CardHeader extends React.Component<CardHeaderProps, {}> { } interface CardMediaProps extends React.Props<CardMedia> { actAsExpander?: boolean; expandable?: boolean; mediaStyle?: React.CSSProperties; overlay?: React.ReactNode; overlayContainerStyle?: React.CSSProperties; overlayContentStyle?: React.CSSProperties; overlayStyle?: React.CSSProperties; style?: React.CSSProperties; } export class CardMedia extends React.Component<CardMediaProps, {}> { } interface CardTextProps extends React.Props<CardText> { actAsExpander?: boolean; color?: string; expandable?: boolean; style?: React.CSSProperties; } export class CardText extends React.Component<CardTextProps, {}> { } interface CardTitleProps extends React.Props<CardTitle> { actAsExpander?: boolean; expandable?: boolean; showExpandableButton?: boolean; style?: React.CSSProperties; subtitle?: React.ReactNode; subtitleColor?: string; subtitleStyle?: React.CSSProperties; title?: React.ReactNode; titleColor?: string; titleStyle?: React.CSSProperties; } export class CardTitle extends React.Component<CardTitleProps, {}> { } } namespace DatePicker { interface DatePickerProps extends React.Props<DatePicker> { // <TextField/> is the element that get the 'other' properties DateTimeFormat?: Intl.DateTimeFormat; autoOk?: boolean; container?: string; // oneOf(['dialog', 'inline']) defaultDate?: Date; disableYearSelection?: boolean; disabled?: boolean; firstDayOfWeek?: number; formatDate?: (date: Date) => string; locale?: string; maxDate?: Date; minDate?: Date; mode?: string; onChange?: (e: any, date: Date) => void; // e is always null onDismiss?: () => void; onFocus?: React.FocusEventHandler; onShow?: () => void; onTouchTap?: React.TouchEventHandler; shouldDisableDate?: (day: Date) => boolean; /** @deprecated use noFilter instead */ showYearSelector?: boolean; style?: React.CSSProperties; textFieldStyle?: React.CSSProperties; value?: Date; valueLink?: ReactLink<Date>; wordings?: {ok: string, cancel: string}; // From <TextField /> className?: string; defaultValue?: string; errorStyle?: React.CSSProperties; errorText?: React.ReactNode; floatingLabelStyle?: React.CSSProperties; floatingLabelText?: React.ReactNode; fullWidth?: boolean; hintStyle?: React.CSSProperties; hintText?: React.ReactNode; id?: string; inputStyle?: React.CSSProperties; onBlur?: React.FocusEventHandler; onKeyDown?: React.KeyboardEventHandler; rows?: number, rowsMax?: number, type?: string; underlineDisabledStyle?: React.CSSProperties; underlineFocusStyle?: React.CSSProperties; underlineShow?: boolean; underlineStyle?: React.CSSProperties; } export class DatePicker extends React.Component<DatePickerProps, {}> { } interface DatePickerDialogProps extends React.Props<DatePickerDialog> { // <Container/> is the element that get the 'other' properties DateTimeFormat?: Intl.DateTimeFormat; autoOk?: boolean; container?: string; // oneOf(['dialog', 'inline']) disableYearSelection?: boolean; firstDayOfWeek?: number; initialDate?: Date; locale?: string; maxDate?: Date; minDate?: Date; mode?: string; onAccept?: (d: Date) => void; onDismiss?: () => void; onShow?: () => void; shouldDisableDate?: (day: Date) => boolean; showYearSelector?: boolean; style?: React.CSSProperties; wordings?: { ok: string, cancel: string }; } export class DatePickerDialog extends React.Component<DatePickerDialogProps, {}> { } } /** @deprecated use array of components instead */ export interface DialogAction { id?: string; onClick?: React.MouseEventHandler; onTouchTap?: TouchTapEventHandler; ref?: string; text: string; } interface DialogProps extends React.DOMAttributes, React.Props<Dialog> { /** @deprecated use a custom `actions` property instead */ actionFocus?: string; actions?: Array<DialogAction | React.ReactElement<any>>; actionsContainerClassName?: string; actionsContainerStyle?: React.CSSProperties; autoDetectWindowHeight?: boolean; autoScrollBodyContent?: boolean; bodyClassName?: string; bodyStyle?: React.CSSProperties; className?: string; contentClassName?: string; contentStyle?: React.CSSProperties; modal?: boolean; onRequestClose?: (buttonClicked: boolean) => void; open: boolean; overlayClassName?: string; overlayStyle?: React.CSSProperties; repositionOnUpdate?: boolean; style?: React.CSSProperties; title?: React.ReactNode; titleClassName?: string; titleStyle?: React.CSSProperties; /** @deprecated use the contentStyle instead */ width?: string | number; } export class Dialog extends React.Component<DialogProps, {}> { } interface DividerProps extends React.Props<Divider> { className?: string; inset?: boolean; style?: React.CSSProperties; } export class Divider extends React.Component<DividerProps, {}>{ } namespace GridList { interface GridListProps extends React.Props<GridList> { cellHeight?: number; cols?: number; padding?: number; style?: React.CSSProperties; } export class GridList extends React.Component<GridListProps, {}>{ } interface GridTileProps extends React.Props<GridTile> { actionIcon?: React.ReactElement<any>; actionPosition?: string; //"left"|"right" cols?: number; rootClass?: string | React.Component<any, any>; rows?: number; style?: React.CSSProperties; subtitle?: React.ReactNode; title?: React.ReactNode; titleBackground?: string; titlePosition?: string; //"top"|"bottom" } export class GridTile extends React.Component<GridTileProps, {}>{ } } interface FontIconProps extends React.HTMLAttributes, React.Props<FontIcon> { // <span/> is the element that get the 'other' properties color?: string; hoverColor?: string; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; style?: React.CSSProperties; } export class FontIcon extends React.Component<FontIconProps, {}> { } interface SvgIconProps extends React.SVGAttributes, React.Props<SvgIcon> { // <svg/> is the element that get the 'other' properties color?: string; hoverColor?: string; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; style?: React.CSSProperties; viewBox?: string; } export class SvgIcon extends React.Component<SvgIconProps, {}> { } interface LeftNavProps extends React.Props<LeftNav> { className?: string; containerClassName?: string; containerStyle?: React.CSSProperties; disableSwipeToOpen?: boolean; docked?: boolean; /** @deprecated use composability instead */ header?: React.ReactElement<any>; /** @deprecated It will be removed with menuItems */ menuItemClassName?: string; /** @deprecated It will be removed with menuItems */ menuItemClassNameLink?: string; /** @deprecated It will be removed with menuItems */ menuItemClassNameSubheader?: string; /** @deprecated use composability instead */ menuItems?: any[]; /** @deprecated It will be removed with menuItems */ onChange?: () => void; /** @deprecated use onRequestChange instead */ onNavClose?: () => void; /** @deprecated use onRequestChange instead */ onNavOpen?: () => void; onRequestChange?: (opening: boolean, reason: string) => void; open?: boolean; openRight?: Boolean; overlayClassName?: string; overlayStyle?: React.CSSProperties; /** @deprecated It will be removed with menuItems */ selectedIndex?: number; style?: React.CSSProperties; swipeAreaWidth?: number; width?: number; } export class LeftNav extends React.Component<LeftNavProps, {}> { /** @deprecated using methods on left nav has been deprecated */ toggle(): void; /** @deprecated using methods on left nav has been deprecated */ close(): void; /** @deprecated using methods on left nav has been deprecated */ open(): void; } namespace Lists { interface ListProps extends React.Props<List> { // <Paper/> is the element that get the 'other' properties insetSubheader?: boolean; style?: React.CSSProperties; subheader?: string; subheaderStyle?: React.CSSProperties; zDepth?: number; } export class List extends React.Component<ListProps, {}> { } /** @deprecated Use Divider */ interface ListDividerProps extends React.Props<ListDivider> { inset?: boolean; } /** @deprecated Use Divider */ export class ListDivider extends React.Component<ListDividerProps, {}> { } interface ListItemProps extends React.HTMLAttributes, React.Props<ListItem> { // <EnhancedButton/> is the element that get the 'other' properties autoGenerateNestedIndicator?: boolean; disableKeyboardFocus?: boolean; disabled?: boolean; initiallyOpen?: boolean; innerDivStyle?: React.CSSProperties; insetChildren?: boolean; leftAvatar?: React.ReactElement<any>; leftCheckbox?: React.ReactElement<any>; leftIcon?: React.ReactElement<any>; nestedItems?: React.ReactElement<ListItemProps>[]; nestedLevel?: number; nestedListStyle?: React.CSSProperties; onKeyboardFocus?: React.FocusEventHandler; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; onNestedListToggle?: (item: ListItem) => void; onTouchStart?: React.TouchEventHandler; onTouchTap?: TouchTapEventHandler; primaryText?: React.ReactNode; primaryTogglesNestedList?: boolean; rightAvatar?: React.ReactElement<any>; rightIcon?: React.ReactElement<any>; rightIconButton?: React.ReactElement<any>; rightToggle?: React.ReactElement<any>; secondaryText?: React.ReactNode; secondaryTextLines?: number; // 1 or 2 style?: React.CSSProperties; } export class ListItem extends React.Component<ListItemProps, {}> { } } namespace Menus { interface MenuProps extends React.Props<Menu> { // <List/> is the element that get the 'other' properties animated?: boolean; autoWidth?: boolean; desktop?: boolean; initiallyKeyboardFocused?: boolean; listStyle?: React.CSSProperties; maxHeight?: number; multiple?: boolean; onChange?: (e: TouchTapEvent, itemValue: any | any[]) => void; onEscKeyDown?: React.KeyboardEventHandler; onItemTouchTap?: (e: TouchTapEvent, item: MenuItem) => void; onKeyDown?: React.KeyboardEventHandler; openDirection?: string; selectedMenuItemStyle?: React.CSSProperties; style?: React.CSSProperties; value?: any | any[]; valueLink?: ReactLink<any | any[]>; width?: string | number; zDepth?: number; } export class Menu extends React.Component<MenuProps, {}>{ } interface MenuItemProps extends React.HTMLAttributes, React.Props<MenuItem> { // <ListItem/> is the element that get the 'other' properties checked?: boolean; desktop?: boolean; disabled?: boolean; focusState?: string; // 'none', 'focused', or 'keyboard-focused' innerDivStyle?: React.CSSProperties; insetChildren?: boolean; leftIcon?: React.ReactElement<any>; menuItems?: React.ReactNode; onTouchTap?: TouchTapEventHandler; rightIcon?: React.ReactElement<any>; secondaryText?: React.ReactNode; style?: React.CSSProperties; value?: any; // useful attributes passed to <ListItem/> primaryText?: React.ReactNode; secondaryTextLines?: number; // 1 or 2 } export class MenuItem extends React.Component<MenuItemProps, {}>{ } interface IconMenuProps extends React.Props<IconMenu> { // <Menu/> is the element that get the 'other' properties anchorOrigin?: Origin; className?: string; closeOnItemTouchTap?: boolean; iconButtonElement: React.ReactElement<IconButtonProps>; iconStyle?: React.CSSProperties; menuStyle?: React.CSSProperties; onItemTouchTap?: (e: TouchTapEvent, item: MenuItem) => void; onKeyboardFocus?: React.FocusEventHandler; onMouseDown?: React.MouseEventHandler; onMouseEnter?: React.MouseEventHandler; onMouseLeave?: React.MouseEventHandler; onMouseUp?: React.MouseEventHandler; onRequestChange?: (opening: boolean, reason: string) => void; onTouchTap?: TouchTapEventHandler; open?: boolean; style?: React.CSSProperties; targetOrigin?: Origin; touchTapCloseDelay?: number; // Other properties from <Menu/> autoWidth?: boolean; desktop?: boolean; listStyle?: React.CSSProperties; maxHeight?: number; multiple?: boolean; onChange?: (e: TouchTapEvent, itemValue: any | any[]) => void; onKeyDown?: React.KeyboardEventHandler; openDirection?: string; selectedMenuItemStyle?: React.CSSProperties; value?: any | any[]; valueLink?: ReactLink<any | any[]>; width?: string | number; } export class IconMenu extends React.Component<IconMenuProps, {}> { } interface DropDownMenuProps extends React.Props<DropDownMenu> { // <div/> is the element that gets the 'other' properties autoWidth?: boolean; className?: string; disabled?: boolean; /** @deprecated use composability instead */ displayMember?: string; iconStyle?: any; /** @deprecated use composability instead */ labelMember?: string; labelStyle?: any; maxHeight?: number; /** @deprecated use composability instead */ menuItems?: any[]; menuStyle?: any; onChange?: (e: TouchTapEvent, index: number, menuItemValue: any) => void; openImmediately?: boolean; /** @deprecated use value instead */ selectedIndex?: number; style?: any; underlineStyle?: any; value?: any; /** @deprecated It's deprecated by React too. */ valueLink?: ReactLink<any>; /** @deprecated use composability instead */ valueMember?: string; } export class DropDownMenu extends React.Component<DropDownMenuProps, {}> { } } interface OverlayProps extends React.Props<Overlay> { autoLockScrolling?: boolean; show?: boolean; transitionEnabled?: boolean; } export class Overlay extends React.Component<OverlayProps, {}> { } interface PaperProps extends React.HTMLAttributes, React.Props<Paper> { circle?: boolean; rounded?: boolean; style?: React.CSSProperties; transitionEnabled?: boolean; zDepth?: number; } export class Paper extends React.Component<PaperProps, {}> { } namespace Popover { interface PopoverAnimationProps { open: boolean; style?: React.CSSProperties; } interface PopoverProps extends React.Props<Popover> { anchorEl?: React.ReactInstance; anchorOrigin?: Origin; animated?: boolean; animation?: React.ComponentClass<PopoverAnimationProps>; autoCloseWhenOffScreen?: boolean; canAutoPosition?: boolean; className?: string; onRequestClose?: (reason: string) => void; open?: boolean; style?: React.CSSProperties; targetOrigin?: Origin; useLayerForClickAway?: boolean; zDepth?: number; } export class Popover extends React.Component<PopoverProps, {}>{ } interface PopoverAnimationFromTopProps extends PopoverAnimationProps, React.Props<PopoverAnimationFromTop> { className?: string; targetOrigin?: Origin; zDepth?: number; } export class PopoverAnimationFromTop extends React.Component<PopoverAnimationFromTopProps, {}>{ } interface PopoverDefaultAnimationProps extends PopoverAnimationProps, React.Props<PopoverDefaultAnimation> { className?: string; targetOrigin?: Origin; zDepth?: number; } export class PopoverDefaultAnimation extends React.Component<PopoverDefaultAnimationProps, {}>{ } } interface CircularProgressProps extends React.Props<CircularProgress> { color?: string; innerStyle?: React.CSSProperties; max?: number; min?: number; mode?: string; size?: number; style?: React.CSSProperties; value?: number; } export class CircularProgress extends React.Component<CircularProgressProps, {}> {