declarations
Version:
[](https://www.npmjs.com/package/declarations)
1,318 lines (1,197 loc) • 77.8 kB
TypeScript
// Type definitions for material-ui v0.12.1
// Project: https://github.com/callemall/material-ui
// Definitions by: Nathan Brown <https://github.com/ngbrown>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
///<reference path='../../react/react-0.13.3.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 Avatar = __MaterialUI.Avatar; // require('material-ui/lib/avatar');
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 DropDownIcon = __MaterialUI.DropDownIcon; // require('material-ui/lib/drop-down-icon');
export import DropDownMenu = __MaterialUI.DropDownMenu; // require('material-ui/lib/drop-down-menu');
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 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.Menu.Menu; // require('material-ui/lib/menu/menu');
export import MenuItem = __MaterialUI.Menu.MenuItem; // require('material-ui/lib/menu/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 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 Slider = __MaterialUI.Slider; // require('material-ui/lib/slider');
export import SvgIcon = __MaterialUI.SvgIcon; // require('material-ui/lib/svg-icon');
export import Icons = __MaterialUI.Icons;
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 ThemeWrapper = __MaterialUI.ThemeWrapper; // require('material-ui/lib/theme-wrapper');
export import Toggle = __MaterialUI.Toggle; // require('material-ui/lib/toggle');
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/');
// export type definitions
export type TouchTapEvent = __MaterialUI.TouchTapEvent;
export type TouchTapEventHandler = __MaterialUI.TouchTapEventHandler;
export type DialogAction = __MaterialUI.DialogAction;
}
declare namespace __MaterialUI {
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> { }
// more specific than React.HTMLAttributes
interface AppBarProps extends React.Props<AppBar> {
iconClassNameLeft?: string;
iconClassNameRight?: string;
iconElementLeft?: React.ReactElement<any>;
iconElementRight?: React.ReactElement<any>;
iconStyleRight?: string;
style?: React.CSSProperties;
showMenuIconButton?: boolean;
title?: React.ReactNode;
zDepth?: number;
onLeftIconButtonTouchTap?: TouchTapEventHandler;
onRightIconButtonTouchTap?: TouchTapEventHandler;
}
export class AppBar extends React.Component<AppBarProps, {}>{
}
interface AppCanvasProps extends React.Props<AppCanvas> {
}
export class AppCanvas extends React.Component<AppCanvasProps, {}> {
}
interface AvatarProps extends React.Props<Avatar> {
icon?: React.ReactElement<any>;
backgroundColor?: string;
color?: string;
size?: number;
src?: string;
style?: React.CSSProperties;
}
export class Avatar extends React.Component<AvatarProps, {}> {
}
interface BeforeAfterWrapperProps extends React.Props<BeforeAfterWrapper> {
beforeStyle?: React.CSSProperties;
afterStyle?: React.CSSProperties;
beforeElementType?: string;
afterElementType?: string;
elementType?: string;
}
export class BeforeAfterWrapper extends React.Component<BeforeAfterWrapperProps, {}> {
}
namespace Card {
interface CardProps extends React.Props<Card> {
expandable?: boolean;
initiallyExpanded?: boolean;
onExpandedChange?: (isExpanded: boolean) => void;
style?: React.CSSProperties;
}
export class Card extends React.Component<CardProps, {}> {
}
interface CardActionsProps extends React.Props<CardActions> {
expandable?: boolean;
showExpandableButton?: boolean;
}
export class CardActions extends React.Component<CardActionsProps, {}> {
}
interface CardExpandableProps extends React.Props<CardExpandable> {
onExpanding?: (isExpanded: boolean) => void;
expanded?: boolean;
}
export class CardExpandable extends React.Component<CardExpandableProps, {}> {
}
interface CardHeaderProps extends React.Props<CardHeader> {
expandable?: boolean;
showExpandableButton?: boolean;
title?: string | React.ReactElement<any>;
titleColor?: string;
titleStyle?: React.CSSProperties;
subtitle?: string | React.ReactElement<any>;
subtitleColor?: string;
subtitleStyle?: React.CSSProperties;
textStyle?: React.CSSProperties;
style?: React.CSSProperties;
avatar: React.ReactElement<any> | string;
}
export class CardHeader extends React.Component<CardHeaderProps, {}> {
}
interface CardMediaProps extends React.Props<CardMedia> {
expandable?: boolean;
overlay?: React.ReactNode;
overlayStyle?: React.CSSProperties;
overlayContainerStyle?: React.CSSProperties;
overlayContentStyle?: React.CSSProperties;
mediaStyle?: React.CSSProperties;
style?: React.CSSProperties;
}
export class CardMedia extends React.Component<CardMediaProps, {}> {
}
interface CardTextProps extends React.Props<CardText> {
expandable?: boolean;
color?: string;
style?: React.CSSProperties;
}
export class CardText extends React.Component<CardTextProps, {}> {
}
interface CardTitleProps extends React.Props<CardTitle> {
expandable?: boolean;
showExpandableButton?: boolean;
title?: string | React.ReactElement<any>;
titleColor?: string;
titleStyle?: React.CSSProperties;
subtitle?: string | React.ReactElement<any>;
subtitleColor?: string;
subtitleStyle?: React.CSSProperties;
textStyle?: React.CSSProperties;
style?: React.CSSProperties;
}
export class CardTitle extends React.Component<CardTitleProps, {}> {
}
}
// what's not commonly overridden by Checkbox, RadioButton, or Toggle
interface CommonEnhancedSwitchProps<T> extends React.HTMLAttributesBase<T> {
// <input/> is root element
id?: string;
iconStyle?: React.CSSProperties;
labelStyle?: React.CSSProperties;
rippleStyle?: React.CSSProperties;
thumbStyle?: React.CSSProperties;
trackStyle?: React.CSSProperties;
name?: string;
value?: string;
label?: string;
required?: boolean;
disabled?: boolean;
defaultSwitched?: boolean;
disableFocusRipple?: boolean;
disableTouchRipple?: boolean;
}
interface EnhancedSwitchProps extends CommonEnhancedSwitchProps<EnhancedSwitch> {
// <input/> is root element
inputType: string;
switchElement: React.ReactElement<any>;
onParentShouldUpdate: (isInputChecked: boolean) => void;
switched: boolean;
rippleColor?: string;
onSwitch?: (e: React.MouseEvent, isInputChecked: boolean) => void;
labelPosition?: string;
}
export class EnhancedSwitch extends React.Component<EnhancedSwitchProps, {}> {
isSwitched(): boolean;
setSwitched(newSwitchedValue: boolean): void;
getValue(): any;
isKeyboardFocused(): boolean;
}
interface CheckboxProps extends CommonEnhancedSwitchProps<Checkbox> {
// <EnhancedSwitch/> is root element
checkedIcon?: React.ReactElement<{ style?: React.CSSProperties }>; // Normally an SvgIcon
defaultChecked?: boolean;
iconStyle?: React.CSSProperties;
label?: string;
labelStyle?: React.CSSProperties;
labelPosition?: string;
style?: React.CSSProperties;
checked?: boolean;
unCheckedIcon?: React.ReactElement<{ style?: React.CSSProperties }>; // Normally an SvgIcon
disabled?: boolean;
valueLink?: ReactLink<boolean>;
checkedLink?: ReactLink<boolean>;
onCheck?: (event: React.MouseEvent, checked: boolean) => void;
}
export class Checkbox extends React.Component<CheckboxProps, {}> {
isChecked(): void;
setChecked(newCheckedValue: boolean): void;
}
interface CircularProgressProps extends React.Props<CircularProgress> {
mode?: string;
value?: number;
min?: number;
max?: number;
size?: number;
color?: string;
innerStyle?: React.CSSProperties;
}
export class CircularProgress extends React.Component<CircularProgressProps, {}> {
}
interface ClearFixProps extends React.Props<ClearFix> {
}
export class ClearFix extends React.Component<ClearFixProps, {}> {
}
namespace DatePicker {
interface DatePickerProps extends React.Props<DatePicker> {
autoOk?: boolean;
defaultDate?: Date;
formatDate?: string;
hideToolbarYearChange?: boolean;
maxDate?: Date;
minDate?: Date;
mode?: string;
onDismiss?: () => void;
// e is always null
onChange?: (e: any, d: Date) => void;
onFocus?: React.FocusEventHandler;
onShow?: () => void;
onTouchTap?: React.TouchEventHandler;
shouldDisableDate?: (day: Date) => boolean;
showYearSelector?: boolean;
textFieldStyle?: React.CSSProperties;
}
export class DatePicker extends React.Component<DatePickerProps, {}> {
}
interface DatePickerDialogProps extends React.Props<DatePickerDialog> {
disableYearSelection?: boolean;
initialDate?: Date;
maxDate?: Date;
minDate?: Date;
onAccept?: (d: Date) => void;
onClickAway?: () => void;
onDismiss?: () => void;
onShow?: () => void;
shouldDisableDate?: (day: Date) => boolean;
showYearSelector?: boolean;
}
export class DatePickerDialog extends React.Component<DatePickerDialogProps, {}> {
}
}
export interface DialogAction {
id?: string;
text: string;
ref?: string;
onTouchTap?: TouchTapEventHandler;
onClick?: React.MouseEventHandler;
}
interface DialogProps extends React.Props<Dialog> {
actions?: Array<DialogAction | React.ReactElement<any>>;
actionFocus?: string;
autoDetectWindowHeight?: boolean;
autoScrollBodyContent?: boolean;
bodyStyle?: React.CSSProperties;
contentClassName?: string;
contentInnerStyle?: React.CSSProperties;
contentStyle?: React.CSSProperties;
modal?: boolean;
openImmediately?: boolean;
repositionOnUpdate?: boolean;
title?: React.ReactNode;
onClickAway?: () => void;
onDismiss?: () => void;
onShow?: () => void;
}
export class Dialog extends React.Component<DialogProps, {}> {
dismiss(): void;
show(): void;
}
interface DropDownIconProps extends React.Props<DropDownIcon> {
menuItems: Menu.MenuItemRequest[];
closeOnMenuItemTouchTap?: boolean;
iconStyle?: React.CSSProperties;
iconClassName?: string;
iconLigature?: string;
onChange?: Menu.ItemTapEventHandler;
}
export class DropDownIcon extends React.Component<DropDownIconProps, {}> {
}
interface DropDownMenuProps extends React.Props<DropDownMenu> {
displayMember?: string;
valueMember?: string;
autoWidth?: boolean;
menuItems: Menu.MenuItemRequest[];
menuItemStyle?: React.CSSProperties;
selectedIndex?: number;
underlineStyle?: React.CSSProperties;
iconStyle?: React.CSSProperties;
labelStyle?: React.CSSProperties;
style?: React.CSSProperties;
disabled?: boolean;
valueLink?: ReactLink<any>;
value?: number;
onChange?: Menu.ItemTapEventHandler;
}
export class DropDownMenu extends React.Component<DropDownMenuProps, {}> {
}
// non generally overridden elements of EnhancedButton
interface SharedEnhancedButtonProps<T> extends React.HTMLAttributesBase<T> {
centerRipple?: boolean;
containerElement?: string | React.ReactElement<any>;
disabled?: boolean;
disableFocusRipple?: boolean;
disableKeyboardFocus?: boolean;
disableTouchRipple?: boolean;
keyboardFocused?: boolean;
linkButton?: boolean;
focusRippleColor?: string;
focusRippleOpacity?: number;
touchRippleOpacity?: number;
tabIndex?: number;
onBlur?: React.FocusEventHandler;
onFocus?: React.FocusEventHandler;
onKeyboardFocus?: (e: React.FocusEvent, isKeyboardFocused: boolean) => void;
onKeyDown?: React.KeyboardEventHandler;
onKeyUp?: React.KeyboardEventHandler;
onMouseEnter?: React.MouseEventHandler;
onMouseLeave?: React.MouseEventHandler;
onTouchStart?: React.TouchEventHandler;
onTouchEnd?: React.TouchEventHandler;
onTouchTap?: TouchTapEventHandler;
}
interface EnhancedButtonProps extends SharedEnhancedButtonProps<EnhancedButton> {
touchRippleColor?: string;
focusRippleColor?: string;
style?: React.CSSProperties;
}
export class EnhancedButton extends React.Component<EnhancedButtonProps, {}> {
}
interface FlatButtonProps extends SharedEnhancedButtonProps<FlatButton> {
hoverColor?: string;
label?: string;
labelPosition?: string;
labelStyle?: React.CSSProperties;
linkButton?: boolean;
primary?: boolean;
secondary?: boolean;
rippleColor?: string;
style?: React.CSSProperties;
}
export class FlatButton extends React.Component<FlatButtonProps, {}> {
}
interface FloatingActionButtonProps extends SharedEnhancedButtonProps<FloatingActionButton> {
backgroundColor?: string;
disabled?: boolean;
disabledColor?: string;
iconClassName?: string;
iconStyle?: React.CSSProperties;
mini?: boolean;
secondary?: boolean;
style?: React.CSSProperties;
}
export class FloatingActionButton extends React.Component<FloatingActionButtonProps, {}> {
}
interface FontIconProps extends React.Props<FontIcon> {
color?: string;
hoverColor?: string;
onMouseLeave?: React.MouseEventHandler;
onMouseEnter?: React.MouseEventHandler;
style?: React.CSSProperties;
className?: string;
}
export class FontIcon extends React.Component<FontIconProps, {}> {
}
interface IconButtonProps extends SharedEnhancedButtonProps<IconButton> {
iconClassName?: string;
iconStyle?: React.CSSProperties;
style?: React.CSSProperties;
tooltip?: string;
tooltipPosition?: string;
tooltipStyles?: React.CSSProperties;
touch?: boolean;
onBlur?: React.FocusEventHandler;
onFocus?: React.FocusEventHandler;
}
export class IconButton extends React.Component<IconButtonProps, {}> {
}
interface LeftNavProps extends React.Props<LeftNav> {
disableSwipeToOpen?: boolean;
docked?: boolean;
header?: React.ReactElement<any>;
menuItems: Menu.MenuItemRequest[];
onChange?: Menu.ItemTapEventHandler;
onNavOpen?: () => void;
onNavClose?: () => void;
openRight?: Boolean;
selectedIndex?: number;
menuItemClassName?: string;
menuItemClassNameSubheader?: string;
menuItemClassNameLink?: string;
}
export class LeftNav extends React.Component<LeftNavProps, {}> {
}
interface LinearProgressProps extends React.Props<LinearProgress> {
mode?: string;
value?: number;
min?: number;
max?: number;
}
export class LinearProgress extends React.Component<LinearProgressProps, {}> {
}
namespace Lists {
interface ListProps extends React.Props<List> {
insetSubheader?: boolean;
subheader?: string;
subheaderStyle?: React.CSSProperties;
zDepth?: number;
}
export class List extends React.Component<ListProps, {}> {
}
interface ListDividerProps extends React.Props<ListDivider> {
inset?: boolean;
}
export class ListDivider extends React.Component<ListDividerProps, {}> {
}
interface ListItemProps extends React.Props<ListItem> {
autoGenerateNestedIndicator?: boolean;
disableKeyboardFocus?: boolean;
initiallyOpen?: boolean;
innerDivStyle?: React.CSSProperties;
insetChildren?: boolean;
innerStyle?: React.CSSProperties;
leftAvatar?: React.ReactElement<any>;
leftCheckbox?: React.ReactElement<any>;
leftIcon?: React.ReactElement<any>;
nestedLevel?: number;
nestedItems?: React.ReactElement<any>[];
onKeyboardFocus?: React.FocusEventHandler;
onNestedListToggle?: (item: ListItem) => void;
rightAvatar?: React.ReactElement<any>;
rightIcon?: React.ReactElement<any>;
rightIconButton?: React.ReactElement<any>;
rightToggle?: React.ReactElement<any>;
primaryText?: React.ReactNode;
secondaryText?: React.ReactNode;
secondaryTextLines?: number;
}
export class ListItem extends React.Component<ListItemProps, {}> {
}
}
// Old menu implementation. Being replaced by new "menus".
namespace Menu {
interface ItemTapEventHandler {
(e: TouchTapEvent, index: number, menuItem: MenuItemRequest): void;
}
// almost extends MenuItemProps, but certain required items are generated in Menu and not passed here.
interface MenuItemRequest extends React.Props<MenuItem> {
// use value from MenuItem.Types.*
type?: string;
text?: string;
data?: string;
payload?: string;
icon?: React.ReactElement<any>;
attribute?: string;
number?: string;
toggle?: boolean;
onTouchTap?: TouchTapEventHandler;
isDisabled?: boolean;
// for MenuItems.Types.NESTED
items?: MenuItemRequest[];
// for custom text or payloads
[propertyName: string]: any;
}
interface MenuProps extends React.Props<Menu> {
index: number;
text?: string;
menuItems: MenuItemRequest[];
zDepth?: number;
active?: boolean;
onItemTap?: ItemTapEventHandler;
menuItemStyle?: React.CSSProperties;
}
export class Menu extends React.Component<MenuProps, {}> {
}
interface MenuItemProps extends React.Props<MenuItem> {
index: number;
icon?: React.ReactElement<any>;
iconClassName?: string;
iconRightClassName?: string;
iconStyle?: React.CSSProperties;
iconRightStyle?: React.CSSProperties;
attribute?: string;
number?: string;
data?: string;
toggle?: boolean;
onTouchTap?: (e: React.MouseEvent, key: number) => void;
onToggle?: (e: React.MouseEvent, key: number, toggled: boolean) => void;
selected?: boolean;
active?: boolean;
}
export class MenuItem extends React.Component<MenuItemProps, {}> {
static Types: { LINK: string, SUBHEADER: string, NESTED: string, }
}
}
export namespace Mixins {
interface ClickAwayable extends React.Mixin<any, any> {
}
var ClickAwayable: ClickAwayable;
interface WindowListenable extends React.Mixin<any, any> {
}
var WindowListenable: WindowListenable;
interface StylePropable extends React.Mixin<any, any> {
}
var StylePropable: StylePropable
interface StyleResizable extends React.Mixin<any, any> {
}
var StyleResizable: StyleResizable
}
interface OverlayProps extends React.Props<Overlay> {
autoLockScrolling?: boolean;
show?: boolean;
transitionEnabled?: boolean;
}
export class Overlay extends React.Component<OverlayProps, {}> {
}
interface PaperProps extends React.HTMLAttributesBase<Paper> {
circle?: boolean;
rounded?: boolean;
transitionEnabled?: boolean;
zDepth?: number;
}
export class Paper extends React.Component<PaperProps, {}> {
}
interface RadioButtonProps extends CommonEnhancedSwitchProps<RadioButton> {
// <EnhancedSwitch/> is root element
defaultChecked?: boolean;
iconStyle?: React.CSSProperties;
label?: string;
labelStyle?: React.CSSProperties;
labelPosition?: string;
style?: React.CSSProperties;
value?: string;
onCheck?: (e: React.FormEvent, selected: string) => void;
}
export class RadioButton extends React.Component<RadioButtonProps, {}> {
}
interface RadioButtonGroupProps extends React.Props<RadioButtonGroup> {
defaultSelected?: string;
labelPosition?: string;
name: string;
style?: React.CSSProperties;
valueSelected?: string;
onChange?: (e: React.FormEvent, selected: string) => void;
}
export class RadioButtonGroup extends React.Component<RadioButtonGroupProps, {}> {
getSelectedValue(): string;
setSelectedValue(newSelectionValue: string): void;
clearValue(): void;
}
interface RaisedButtonProps extends SharedEnhancedButtonProps<RaisedButton> {
className?: string;
disabled?: boolean;
label?: string;
primary?: boolean;
secondary?: boolean;
labelStyle?: React.CSSProperties;
backgroundColor?: string;
labelColor?: string;
disabledBackgroundColor?: string;
disabledLabelColor?: string;
fullWidth?: boolean;
}
export class RaisedButton extends React.Component<RaisedButtonProps, {}> {
}
interface RefreshIndicatorProps extends React.Props<RefreshIndicator> {
left: number;
percentage?: number;
size?: number;
status?: string;
top: number;
}
export class RefreshIndicator extends React.Component<RefreshIndicatorProps, {}> {
}
namespace Ripples {
interface CircleRippleProps extends React.Props<CircleRipple> {
color?: string;
opacity?: number;
}
export class CircleRipple extends React.Component<CircleRippleProps, {}> {
}
interface FocusRippleProps extends React.Props<FocusRipple> {
color?: string;
innerStyle?: React.CSSProperties;
opacity?: number;
show?: boolean;
}
export class FocusRipple extends React.Component<FocusRippleProps, {}> {
}
interface TouchRippleProps extends React.Props<TouchRipple> {
centerRipple?: boolean;
color?: string;
opacity?: number;
}
export class TouchRipple extends React.Component<TouchRippleProps, {}> {
}
}
interface SelectFieldProps extends React.Props<SelectField> {
// passed to TextField
errorStyle?: React.CSSProperties;
errorText?: string;
floatingLabelText?: string;
floatingLabelStyle?: React.CSSProperties;
fullWidth?: boolean;
hintText?: string | React.ReactElement<any>;
// passed to DropDownMenu
displayMember?: string;
valueMember?: string;
autoWidth?: boolean;
menuItems: Menu.MenuItemRequest[];
menuItemStyle?: React.CSSProperties;
selectedIndex?: number;
underlineStyle?: React.CSSProperties;
iconStyle?: React.CSSProperties;
labelStyle?: React.CSSProperties;
style?: React.CSSProperties;
disabled?: boolean;
valueLink?: ReactLink<any>;
value?: number;
onChange?: Menu.ItemTapEventHandler;
onEnterKeyDown?: React.KeyboardEventHandler;
// own properties
selectFieldRoot?: string;
multiLine?: boolean;
type?: string;
rows?: number;
inputStyle?: React.CSSProperties;
}
export class SelectField extends React.Component<SelectFieldProps, {}> {
}
interface SliderProps extends React.Props<Slider> {
name: string;
defaultValue?: number;
description?: string;
error?: string;
max?: number;
min?: number;
required?: boolean;
step?: number;
value?: number;
}
export class Slider extends React.Component<SliderProps, {}> {
}
interface SvgIconProps extends React.Props<SvgIcon> {
color?: string;
hoverColor?: string;
viewBox?: string;
}
export class SvgIcon extends React.Component<SvgIconProps, {}> {
}
export namespace Icons {
export import NavigationMenu = __MaterialUI.NavigationMenu;
export import NavigationChevronLeft = __MaterialUI.NavigationChevronLeft;
export import NavigationChevronRight = __MaterialUI.NavigationChevronRight;
}
interface NavigationMenuProps extends React.Props<NavigationMenu> {
}
export class NavigationMenu extends React.Component<NavigationMenuProps, {}> {
}
interface NavigationChevronLeftProps extends React.Props<NavigationChevronLeft> {
}
export class NavigationChevronLeft extends React.Component<NavigationChevronLeftProps, {}> {
}
interface NavigationChevronRightProps extends React.Props<NavigationChevronRight> {
}
export class NavigationChevronRight extends React.Component<NavigationChevronRightProps, {}> {
}
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;
}
interface ThemePalette {
primary1Color?: string;
primary2Color?: string;
primary3Color?: string;
accent1Color?: string;
accent2Color?: string;
accent3Color?: string;
textColor?: string;
canvasColor?: string;
borderColor?: string;
disabledColor?: string;
alternateTextColor?: string;
}
interface MuiTheme {
rawTheme: RawTheme;
static: boolean;
appBar?: {
color?: string,
textColor?: string,
height?: number
},
avatar?: {
borderColor?: string;
}
button?: {
height?: number,
minWidth?: number,
iconButtonSize?: number
},
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,
textColor?: string,
primaryTextColor?: string,
secondaryTextColor?: string,
disabledColor?: string
},
floatingActionButton?: {
buttonSize?: number,
miniSize?: number,
color?: string,
iconColor?: string,
secondaryColor?: string,
secondaryIconColor?: string,
disabledColor?: string,
disabledTextColor?: 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,
},
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,
handleSizeActive?: number,
handleSizeDisabled?: 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;
};
tableFooter?: {
borderColor?: string;
textColor?: string;
};
tableRow?: {
hoverColor?: string;
stripeColor?: string;
selectedColor?: string;
textColor?: string;
borderColor?: string;
};
tableRowColumn?: {
height?: number;
spacing?: number;
};
timePicker?: {
color?: string;
textColor?: string;
accentColor?: string;
clockColor?: string;
selectColor?: string;
selectTextColor?: string;
};
toggle?: {
thumbOnColor?: string,
thumbOffColor?: string,
thumbDisabledColor?: string,
thumbRequiredColor?: string,
trackOnColor?: string,
trackOffColor?: string,
trackDisabledColor?: string,
trackRequiredColor?: string,
labelColor?: string,
labelDisabledColor?: string
},
toolbar?: {
backgroundColor?: string,
height?: number,
titleFontSize?: number,
iconColor?: string,
separatorColor?: string,
menuHoverColor?: string,
};
tabs?: {
backgroundColor?: string;
};
textField?: {
textColor?: string;
hintColor?: string;
floatingLabelColor?: string;
disabledTextColor?: string;
errorColor?: string;
focusColor?: string;
backgroundColor?: string;
borderColor?: string;
};
}
interface RawTheme {
spacing: Spacing;
fontFamily?: string;
palette: ThemePalette;
}
export function ThemeDecorator(muiTheme: Styles.MuiTheme): <P>(Component: React.ComponentClass<P>) => React.ComponentClass<P>;
interface ThemeManager {
getMuiTheme(rawTheme: RawTheme): 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 SnackbarProps extends React.Props<Snackbar> {
message: string;
action?: string;
autoHideDuration?: number;
onActionTouchTap?: React.TouchEventHandler;
onShow?: () => void;
onDismiss?: () => void;
openOnMount?: boolean;
}
export class Snackbar extends React.Component<SnackbarProps, {}> {
}
namespace Tabs {
interface TabProps extends React.Props<Tab> {
label?: string;
value?: string;
selected?: boolean;
width?: string;
// Called by Tabs component
onActive?: (tab: Tab) => void;
onTouchTap?: (value: string, e: TouchTapEvent, tab: Tab) => void;
}
export class Tab extends React.Component<TabProps, {}> {
}
interface TabsProps extends React.Props<Tabs> {
contentContainerStyle?: React.CSSProperties;
initialSelectedIndex?: number;
inkBarStyle?: React.CSSProperties;
style?: React.CSSProperties;
tabItemContainerStyle?: React.CSSProperties;
tabWidth?: number;
value?: string | number;
onChange?: (value: string | number, e: React.FormEvent, tab: Tab) => void;
}
export class Tabs extends React.Component<TabsProps, {}> {
}
}
namespace Table {
interface TableProps extends React.Props<Table> {
allRowsSelected?: boolean;
fixedFooter?: boolean;
fixedHeader?: boolean;
height?: string;
multiSelectable?: boolean;
onCellClick?: (row: number, column: number) => void;
onCellHover?: (row: number, column: number) => void;
onCellHoverExit?: (row: number, column: number) => void;
onRowHover?: (row: number) => void;
onRowHoverExit?: (row: number) => void;
onRowSelection?: (selectedRows: number[])=> void;
selectable?: boolean;
}
export class Table extends React.Component<TableProps, {}> {
}
interface TableBodyProps extends React.Props<TableBody> {
allRowsSelected?: boolean;
deselectOnClickaway?: boolean;
displayRowCheckbox?: boolean;
multiSelectable?: boolean;
onCellClick?: (row: number, column: number) => void;
onCellHover?: (row: number, column: number) => void;
onCellHoverExit?: (row: number, column: number) => void;
onRowHover?: (row: number) => void;
onRowHoverExit?: (row: number) => void;
onRowSelection?: (selectedRows: number[])=> void;
preScanRows?: boolean;
selectable?: boolean;
showRowHover?: boolean;
stripedRows?: boolean;
}
export class TableBody extends React.Component<TableBodyProps, {}> {
}
interface TableFooterProps extends React.Props<TableFooter> {
adjustForCheckbox?: boolean;
}
export class TableFooter extends React.Component<TableFooterProps, {}> {
}
interface TableHeaderProps extends React.Props<TableHeader> {
adjustForCheckbox?: boolean;
displaySelectAll?: boolean;
enableSelectAll?: boolean;
onSelectAll?: (event: React.MouseEvent) => void;
selectAllSelected?: boolean;
}
export class TableHeader extends React.Component<TableHeaderProps, {}> {
}
interface TableHeaderColumnProps extends React.Props<TableHeaderColumn> {
columnNumber?: number;
onClick?: (e: React.MouseEvent, column: number) => void;
tooltip?: string;
tooltipStyle?: React.CSSProperties;
}
export class TableHeaderColumn extends React.Component<TableHeaderColumnProps, {}> {
}
interface TableRowProps extends React.Props<TableRow> {
displayBorder?: boolean;
hoverable?: boolean;
onCellClick?: (e: React.MouseEvent, row: number, column: number) => void;
onCellHover?: (e: React.MouseEvent, row: number, column: number) => void;
onCellHoverExit?: (e: React.MouseEvent, row: number, column: number) => void;
onRowClick?: (e: React.MouseEvent, row: number) => void;
onRowHover?: (e: React.MouseEvent, row: number) => void;
onRowHoverExit?: (e: React.MouseEvent, row: number) => void;
rowNumber?: number;
selectable?: boolean;
selected?: boolean;
striped?: boolean;
}
export class TableRow extends React.Component<TableRowProps, {}> {
}
interface TableRowColumnProps extends React.Props<TableRowColumn> {
columnNumber?: number;
hoverable?: boolean;
onHover?: (e: React.MouseEvent, column: number) => void;
onHoverExit?: (e: React.MouseEvent, column: number) => void;
}
export class TableRowColumn extends React.Component<TableRowColumnProps, {}> {
}
}
interface ThemeWrapperProps extends React.Props<ThemeWrapper> {
theme: Styles.MuiTheme;
}
export class ThemeWrapper extends React.Component<ThemeWrapperProps, {}> {
}
interface ToggleProps extends CommonEnhancedSwitchProps<Toggle> {
// <EnhancedSwitch/> is root element
elementStyle?: React.CSSProperties;
labelStyle?: React.CSSProperties;
onToggle?: (e: React.MouseEvent, isInputChecked: boolean) => void;
toggled?: boolean;
defaultToggled?: boolean;
}
export class Toggle extends React.Component<ToggleProps, {}> {
isToggled(): boolean;
setToggled(newToggledValue: boolean): void;
}
interface TimePickerProps extends React.Props<TimePicker> {
defaultTime?: Date;
format?: string;
pedantic?: boolean;
onFocus?: React.FocusEventHandler;
onTouchTap?: TouchTapEventHandler;
onChange?: (e: any, time: Date) => void;
onShow?: () => void;
onDismiss?: () => void;
}
export class TimePicker extends React.Component<TimePickerProps, {}> {
}
interface TextFieldProps extends React.Props<TextField> {
errorStyle?: React.CSSProperties;
errorText?: string;
floatingLabelText?: string;
floatingLabelStyle?: React.CSSProperties;
fullWidth?: boolean;
hintText?: string | React.ReactElement<any>;
id?: string;
inputStyle?: React.CSSProperties;
multiLine?: boolean;
onEnterKeyDown?: React.KeyboardEventHandler;
style?: React.CSSProperties;
rows?: number,
underlineStyle?: React.CSSProperties;
underlineFocusStyle?: React.CSSProperties;
underlineDisabledStyle?: React.CSSProperties;
type?: string;
disabled?: boolean;
isRtl?: boolean;
value?: string;
defaultValue?: string;
valueLink?: ReactLink<string>;
onBlur?: React.FocusEventHandler;
onChange?: React.FormEventHandler;
onFocus?: React.FocusEventHandler;
onKeyDown?: React.KeyboardEventHandler;
}
export class TextField extends React.Component<TextFieldProps, {}> {
blur(): void;
clearValue(): void;
focus(): void;
getValue(): string;
setErrorText(newErrorText: string): void;
setValue(newValue: string): void;
}
namespace Toolbar {
interface ToolbarProps extends React.Props<Toolbar> {
}
export class Toolbar extends React.Component<ToolbarProps, {}> {
}
interface ToolbarGroupProps extends React.Props<ToolbarGroup> {
float?: string;
}
export class ToolbarGroup extends React.Component<ToolbarGroupProps, {}> {
}
interface ToolbarSeparatorProps extends React.Props<ToolbarSeparator> {
}
export class ToolbarSeparator extends React.Component<ToolbarSeparatorProps, {}> {
}
interface ToolbarTitleProps extends React.HTMLAttributesBase<ToolbarTitle> {
text?: string;
}
export class ToolbarTitle extends React.Component<ToolbarTitleProps, {}> {
}
}
interface TooltipProps extends React.Props<Tooltip> {
label: string;
show?: boolean;
touch?: boolean;
verticalPosi