// Type definitions for material-ui v0.14.4 // Project: https://github.com/callemall/material-ui // Definitions by: Nathan Brown , Oliver Herrmann // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped /// 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 { 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 { } interface ThemeWrapperProps extends React.Props { theme: Styles.MuiTheme; } export class ThemeWrapper extends React.Component { } 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): (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 { className?: string; iconClassNameLeft?: string; iconClassNameRight?: string; iconElementLeft?: React.ReactElement; iconElementRight?: React.ReactElement; 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{ } interface AppCanvasProps extends React.Props { } export class AppCanvas extends React.Component { } 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 { 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 { 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 { backgroundColor?: string; className?: string; color?: string; icon?: React.ReactElement; size?: number; src?: string; style?: React.CSSProperties; } export class Avatar extends React.Component { } interface BadgeProps extends React.Props { badgeContent: React.ReactNode; badgeStyle?: React.CSSProperties; className?: string; primary?: boolean; secondary?: boolean; style?: React.CSSProperties; } export class Badge extends React.Component { } interface BeforeAfterWrapperProps extends React.Props { afterElementType?: string; afterStyle?: React.CSSProperties; beforeElementType?: string; beforeStyle?: React.CSSProperties; elementType?: string; style?: React.CSSProperties; } export class BeforeAfterWrapper extends React.Component { } // non generally overridden elements of EnhancedButton interface SharedEnhancedButtonProps extends React.Props { 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 { // container element,