Initial cut at creating TypeScript declarations for react-toolbox

react-toolbox.d.ts

// Type definitions for react-toolbox 0.12.11
// Project: http://react-toolbox.com/
// Definitions by: @xogeny (Michael M. Tiller)

///<reference path='../react/react.d.ts' />

declare namespace __RT {
  import React = __React;

	// Properties that all components have
	export interface Props {
		className?: string // Sets a class to give customized styles to the checkbox field.
	}

	// Properties of modal components (Drawer, Dialog)
	export interface Modal {
    active: boolean // If true, the dialog will be active.
    onOverlayClick?: Function // Callback to be invoked when the dialog overlay is clicked.
	}

	// Interface for components with icons
	export interface Iconic {
    icon?: string // Value of the icon (See icon component).
	}

	export interface Conditional {
    disabled?: boolean	// If true, component will be disabled (false)
	}

	// Properties of components that have values that can be changed (T is the type of the value)
	export interface Changeable<T> {
    onChange?: (v: T) => void // Callback called when the picker value is changed.
	}

	// Properties of components that can be clicked
	export interface Clickable {
		onClick?: Function // Callback called when the button is clicked.
	}

	export interface Option<T> {
		label: string,
		value: T
	}

	////////////////////////////////
	/// Component definitions
	////////////////////////////////

	export interface ButtonProps extends Props, Clickable, Conditional, Iconic {
		accent?: boolean // Indicates if the button should have accent color. (false)
		className?: string // Set a class to style the Component. ('')
		flat?: boolean // If true, the button will have a flat look. (false)
		floating?: boolean // If true, the button will have a floating look. (false)
		label?: string // The text string to use for the name of the button.
		loading?: boolean // If true, component will be disabled and show a loading animation. (false)
		mini?: boolean // To be used with floating button. If true the button will be smaller. (false)
		primary?: boolean // Indicates if the button should have primary color. (false)
		raised?: boolean  // If true, the button will have a raised look. (false)
		ripple?: boolean // If true, component will have a ripple effect on click. (true)
		toggle?: boolean // If true, the button will have a toggle icon look. (false)
		tooptip?: string // The value will be shown as a tooltip when the button is hovered.
	}
	export var Button: React.ClassicComponentClass<ButtonProps>;

	export interface CardProps extends Props, Clickable {
		actions?: Array<ButtonProps> // Array of objects describing actions. These actions will be rendered as buttons and the object fields will be transferred to those. ([])
		color?: string // Sets HEX or RGBA color to add a colored layer to the heading.
		image?: string // URL to sets a background image in the heading.
		loading?: boolean // If true, component will be disabled and showing a loading animation. (false)
		subtitle?: string // Sets a complementary smaller text under the title.
		text?: string // Sets a complementary text display as a card description.
		title?: string // Sets the title of the card.
		type?: string // Type of the component to display general modifications. It can be 'wide' for a larger card, 'image' if it's an image card or 'event' which shows just a title on top.
	}
	export var Card: React.ClassicComponentClass<CardProps>;

	export interface CheckboxProps extends Props, Changeable<boolean>, Conditional {
		checked: boolean // Value for the checkbox, can be true or false.
		label?: string // Text label to attach next to the checkbox element.
		name?: string // The name of the field to set in the input checkbox.
		onBlur?: Function // Callback called when the checkbox is blurred.
		onFocus?: Function // Callback called when the checkbox is focused
	}
	export var Checkbox: React.ClassicComponentClass<CheckboxProps>;

	export interface DatePickerProps extends Changeable<Date> {
		maxDate?: Date // Date object with the maximum selectable date.
		minDate?: Date // Date object with the minimum selectable date.
		placeholder?: string // The text string to use like a input placeholder.
		value?: Date // Date object with the currently selected date.
	}
	export var DatePicker: React.ClassicComponentClass<DatePickerProps>;

	export interface DialogProps extends Props, Modal {
		actions?: Array<ButtonProps> // An array of objects representing the buttons for the dialog navigation area. The properties will be transferred to the buttons.
		title?: string // The text string to use as standar title of the dialog.
		type?: string // Used to determine the size of the dialog. It can be small, normal or large.
	}
	export var Dialog: React.ClassicComponentClass<DialogProps>;

	export interface DrawerProps extends Props, Modal {
		type?: string // Type of drawer. It can be 'left' or 'right' to display the drawer on the left or right side of the screen.
	}
	export var Drawer: React.ClassicComponentClass<DrawerProps>;

	export interface DropdownProps extends Props, Changeable<any>, Conditional {
		auto?: boolean // If true, the dropdown will open up or down depending on the position in the screen .
		label?: string // The text string to use for the floating label element.
		source: Array<Option<any>> // Array of data objects with the data to represent in the dropdown.
		template?: Function // Callback function that returns a JSX template to represent the element.
		value: string // Default value using JSON data.
	}
	export var Dropdown: React.ClassicComponentClass<DropdownProps>;

	export interface FontIconProps extends Props {
		value: string
	}
	export var FontIcon: React.ClassicComponentClass<FontIconProps>;

	export interface InputProps extends Props, Conditional, Changeable<string>, Iconic {
		error?: string // Give an error string to display under the field.
		floating?: boolean // Indicates if the label is floating in the input field or not.
		label?: string // The text string to use for the floating label element.
		maxLength?: number // Specifies the maximum number of characters allowed in the component.
		multiline?: boolean // If true, a textarea element will be rendered. The textarea also grows and shrinks according to the number of lines.
		onBlur?: Function // callback function that is fired when components is blurred.
		onFocus?: Function // Callback function that is fired when components is focused.
		onKeyPress?: Function // Callback function that is fired when a key is pressed.
		required?: boolean // If true, the html input has a required value.
		type?: string // Type of the input element. It can be a valid HTML5 input type
		value: string // Current value of the input element.
	}
	export var Input: React.ClassicComponentClass<InputProps>;

	export interface LinkProps extends Props, Iconic {
		href: string
		label: string // The text string used for the text content of the link.
		count?: number // Sets a count number useful to display in the page how many times was visited for example.
	}
	export var Link: React.ClassicComponentClass<LinkProps>;

	export interface ListProps extends Props {
		ripple?: boolean // If true, each element in the list will have a ripple effect on click
		selectable?: boolean // If true, the elements in the list will display a hover effect and a pointer cursor.
	}
	export var List: React.ClassicComponentClass<ListProps>;

	export interface ListItemProps extends Props, Conditional {
		avatar?: string // A string URL to specify an avatar in the left side of the item.
		caption?: string // Main text of the item. Required.
		leftIcon?: string // A string key of a font icon to display an icon in the left side of the item.
		legend?: string // Secondary text to display under the caption.
		rightIcon?: string // The same as the leftIcon but in this case the icon is displayed in the right side.
		ripple?: boolean // If true, the item displays a ripple effect on click. By default it's inherited from the parent element.
		selectable?: boolean // If true, the elements in the list will display a hover effect and a pointer cursor. Inherited from the parent
	}
	export var ListItemProps: React.ClassicComponentClass<ListItemProps>;

	export interface ListCheckboxProps extends Props, Conditional, Changeable<boolean> {
		caption?: string // Main text of the item. Required.
		checked: boolean // If true the checkbox appears checked by default.
		legend?: string // Secondary text to display under the caption.
		name?: string // Name for the checkbox input item.
		onBlur?: Function // Callback called when the input element is blurred.
		onFocus?: Function // Callback called when the input element is focused.
	}
	export var ListCheckboxProps: React.ClassicComponentClass<ListCheckboxProps>;

	export interface ListHeaderProps {
		caption: string;
	}
	export var ListHeaderProps: React.ClassicComponentClass<ListHeaderProps>;

	export interface ListDividerProps {
		inset: boolean;
	}
	export var ListDividerProps: React.ClassicComponentClass<ListDividerProps>;

	export interface MenuProps extends Props {
		active?: boolean // If true, the menu will be displayed as opened by default.
		onHide?: Function // callback that will be called when the menu is being hid.
		onShow?: Function // Callback that will be invoked when the menu is being shown.
		outline?: boolean // If true the menu wrapper will show an outline with a soft shadow.
		position?: string // Determine the position of the menu. With static value the menu will be always shown, auto means that the it will decide the opening direction based on the current position. To force a position use top-left, top-right, bottom-left, bottom-right.
		ripple?: boolean // If true, the menu items will show a ripple effect on click.
		selectable?: boolean // If true, the menu will keep a value to highlight the active child item.
		value?: boolean // Used for selectable menus and indicates the initial value so the child item with this value can be highlighted.
	}
	export var MenuProps: React.ClassicComponentClass<MenuProps>;

	export interface IconMenuProps extends Props, Iconic {
		iconRipple?: string // If true, the icon will show a ripple when is clicked.
		menuRipple?: string // Transferred to the Menu component.
		onClick?: Function // callback that will be called when the icon is clicked.
		onHide?: Function // Callback that will be called when the menu is being hid.
		onShow?: Function // Callback that will be invoked when the menu is being shown.
		onSelect?: Function // Callback that will be invoked when a menu item is selected.
		position?: string // Determine the position of the menu. This property is transferred to the inner Menu component.
		selectable?: boolean // If true, the menu will keep a value to highlight the active child item. Transferred to the Menu
	}
	export var IconMenuProps: React.ClassicComponentClass<IconMenuProps>;

	export interface MenuItemProps extends Props, Conditional, Iconic {
		caption?: string // The text to include in the menu item.
		ripple?: boolean // If true, the item will show a ripple effect when it's clicked. Inherited from the parent.
		selected?: boolean // Transferred from the Menu component for selectable menus. Indicates if it's the current active option.
	}
	export var MenuItemProps: React.ClassicComponentClass<MenuItemProps>;

	export var MenuDivider: React.ClassicComponentClass<void>;

	export interface NavigationProps extends Props {
		actions?: Array<ButtonProps> // Array of objects that represent buttons so the keys will be transferred as properties to those.
		routes?: Array<LinkProps> // Array of objects similar to actions but that will be rendered as <Link/> component definition.
		type?: string // Type of the navigation, it can be 'vertical' or 'horizontal'.
	}
	export var NavigationProps: React.ClassicComponentClass<NavigationProps>;

	export interface ProgressBarProps extends Props {
		buffer?: number // value of a secondary progress bar useful for buffering.
		max?: number // maximum value permitted.
		min?: number // minimum value permitted.
		mode?: string // Mode of the progress bar, it can be determinate or indeterminate.
		multicolor?: boolean // If true, the circular progress bar will be changing its color.
		type?: string // linear	Type of the progress bar, it can be circular or linear.
		value?: number // Value of the current progress.
	}
	export var ProgressBar: React.ClassicComponentClass<ProgressBarProps>;

	export interface RadioGroupProps extends Props, Conditional, Changeable<any> {
		name?: string // Name for the input element group.
		value?: any // Default value selected in the radio group.
	}
	export var RadioGroup: React.ClassicComponentClass<RadioGroupProps>;

	export interface RadioButtonProps extends Props, Conditional {
		checked: boolean // If true, the input element will be selected by default. Transferred from the parent.
		name?: string // Name for the input element.
		onBlur?: Function // Callback function that will be invoked when the input is blurred.
		onChange?: Function // Callback function that will be invoked when the value changes.
		onFocus?: Function // Callback function that will be invoked when the input is focused.
		value: any // Value for the radio button.
	}
	export var RadioButton: React.ClassicComponentClass<RadioButtonProps>;

	export interface SliderProps extends Props {
		editable?: boolean // If true, an input is shown and the user can set the slider from keyboard value.
		max?: number // Maximum value permitted.
		min?: number // Minimum value permitted.
		onChange?: Function // Callback function that will be invoked when the slider value changes.
		pinned?: boolean // If true, a pin with numeric value label is shown when the slider thumb is pressed. Use for settings for which users need to know the exact value of the setting.
		snaps?: boolean // If true, the slider thumb snaps to tick marks evenly spaced based on the step property value.
		step?: number // Amount to vary the value when the knob is moved or increase/decrease is called.
		value: number // current valud of the slider.
	}
	export var Slider: React.ClassicComponentClass<SliderProps>;

	export interface SnackbarProps extends Props, Modal, Iconic {
		action?: string // for the action component inside the Snackbar.
		label?: string // Text to display in the content.
		onClick?: Function // Callback function that will be called when the button action is clicked.
		onTimeout?: Function // callback function when finish the set timeout.
		timeout?: number // amount of time after the Snackbar will be automatically hidden.
		type?: string // Indicates the action type. Can be 'accept', 'warning' or 'cancel'
	}
	export var Snackbar: React.ClassicComponentClass<SnackbarProps>;

	export interface SwitchProps extends Props, Conditional {
		checked: boolean // If true, the switch will be enabled.
		disabled: boolean // If true, component will be disabled.
		label?: string // The text string to use for the floating label element.
		name?: string // The text string used as name of the input.
		onBlur?: Function // Callback function that is fired when when the switch is blurred.
		onChange?: Function // Callback function that is fired when the components's value changes.
		onFocus?: Function // Callback function fire when the switch is focused.
	}
	export var Switch: React.ClassicComponentClass<SwitchProps>;

	export interface TableProps extends Props {
		heading?: boolean // If true, component will show a heading using model field names.
		model?: { [key: string]: string} // Object describing the data model that represents each object in the source.
		onChange?: Function // Callback function that is fired when an item in a row changes. If set, rows are editable.
		onSelect?: Function // Callback function invoked when the row selection changes.
		selected?: Array<number> // Array of indexes of the items in the source that should appear as selected.
		source?: Array<{ [key: string]: any }> // Array of objects representing each item to show.
	}
	export var Table: React.ClassicComponentClass<TableProps>;

	export interface TabsProps extends Props, Changeable<number> {
		index: number // Current
	}

	export var Tabs: React.ClassicComponentClass<TabsProps>;

	export interface TabProps extends Props, Conditional {
		active?: boolean // If true, the current component is visible.
		disabled?: boolean // If true, the current component is not clickable.
		hidden?: boolean // If true, the current component is not visible.
		label?: string // Label text for navigation header
		onActive?: Function // Callback function that is fired when the tab is activated.
	}
	export var Tab: React.ClassicComponentClass<TabProps>;

	export interface TooltipProps extends Props {
		label: string // The text string to use for the tooltip.
	}
	export var Tooltip: React.ClassicComponentClass<TooltipProps>;

	export interface TimePickerProps extends Props {
		format?: string // Format to display the clock. It can be 24hr or ampm.
		onChange?: Function // Callback called when the picker value is changed.
		value: Date // Datetime object with currrently selected time
	}
	export var TimePicker: React.ClassicComponentClass<TimePickerProps>;
}

declare module "react-toolbox" {
	export = __RT;
}

I did some cleanup and updates here: https://gist.github.com/hsrobflavorus/925373f6224679302948