declarations
Version:
[](https://www.npmjs.com/package/declarations)
1,218 lines (1,143 loc) • 360 kB
TypeScript
// 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, {}> {