vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

Merge pull request #609 from react-toolbox/update-react 

Update to react 15.2.0
old
Javi Velasco 2016-07-05 10:23:39 +02:00 committed by GitHub
parent 83b202ab68 f43dac68be
commit cd0c72cbd6
45 changed files with 93 additions and 2512 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/autocomplete/Autocomplete.js
View File

@ -270,7 +270,11 @@ const factory = (Chip, Input) => {
}
render () {
const {error, label, theme, ...other} = this.props;
const {
error, label, source, suggestionMatch, //eslint-disable-line no-unused-vars
selectedPosition, showSuggestionsWhenValueIsSet, //eslint-disable-line no-unused-vars
theme, ...other
} = this.props;
const className = classnames(theme.autocomplete, {
[theme.focus]: this.state.focus
}, this.props.className);

3
components/avatar/Avatar.js
View File

@ -1,11 +1,12 @@
import React, { PropTypes } from 'react';
import classnames from 'classnames';
import { themr } from 'react-css-themr';
import { AVATAR } from '../identifiers.js';
import InjectFontIcon from '../font_icon/FontIcon.js';
const factory = (FontIcon) => {
const Avatar = ({children, className, icon, image, theme, title, ...other}) => (
<div data-react-toolbox='avatar' className={`${theme.avatar} ${className}`} {...other}>
<div data-react-toolbox='avatar' className={classnames(theme.avatar, className)} {...other}>
{children}
{typeof image === 'string' ? <img className={theme.image} src={image} title={title} /> : image}
{typeof icon === 'string' ? <FontIcon className={theme.letter} value={icon} /> : icon}

2
components/dropdown/Dropdown.js
View File

@ -141,7 +141,7 @@ const factory = (Input) => {
}
render () {
const {template, theme, source, ...others} = this.props;
const {template, theme, source, allowBlank, auto, ...others} = this.props; //eslint-disable-line no-unused-vars
const selected = this.getSelectedItem();
const className = classnames(theme.dropdown, {
[theme.up]: this.state.up,

12
components/list/ListItem.js
View File

@ -42,16 +42,20 @@ const factory = (ripple, ListItemLayout, ListItemContent) => {
if (!React.isValidElement(child)) {
return;
}
if (child.props.listItemIgnore) {
children.ignored.push(child);
const { listItemIgnore, ...rest } = child.props;
const strippedChild = { ...child, ...{ props: rest } };
if (listItemIgnore) {
children.ignored.push(strippedChild);
return;
}
if (child.type === ListItemContent) {
children.itemContent = child;
children.itemContent = strippedChild;
return;
}
const bucket = children.itemContent ? 'rightActions' : 'leftActions';
children[bucket].push({...child, key: i});
children[bucket].push({...strippedChild, key: i});
});
return children;

1
components/ripple/Ripple.js
View File

@ -113,6 +113,7 @@ const rippleFactory = (options = {}) => {
const {
children,
ripple, //eslint-disable-line no-unused-vars
onRippleEnded, //eslint-disable-line no-unused-vars
rippleClassName: className,
rippleCentered: centered, //eslint-disable-line no-unused-vars
rippleSpread: spread, //eslint-disable-line no-unused-vars

6
docs/package.json
View File

@ -13,9 +13,9 @@
"classnames": "^2.2.5",
"codemirror": "^5.14.2",
"history": "^2.1.1",
"react": "^15.0.2",
"react-css-themr": "^1.1.0",
"react-dom": "^15.0.2",
"react": "^15.2.0",
"react-css-themr": "^1.1.2",
"react-dom": "^15.2.0",
"react-router": "^2.4.0"
},
"devDependencies": {

58
lib/app_bar/index.d.ts vendored
View File

@ -1,58 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface AppBarProps extends Props {
/**
* If true, the AppBar shows a shadow.
* @default false
*/
flat?: boolean,
/**
* Determine if the bar should have position fixed (true) or relative (false)
* @default false
*/
fixed?: boolean,
}
/**
* The app bar is a special kind of toolbar that<EFBFBD>s used for branding, navigation, search, and actions.
* Usually it contains controls on the right and left side and a title with the current section or app name.
* You should give the content with children elements.
*/
export class AppBar extends React.Component<AppBarProps, {}> {
render(): React.DOMElement<any, any>;
}
export default AppBar;

10
lib/autocomplete/Autocomplete.js
View File

@ -393,9 +393,15 @@ var factory = function factory(Chip, Input) {
var _props = this.props;
var error = _props.error;
var label = _props.label;
var theme = _props.theme;
var source = _props.source;
var suggestionMatch = _props.suggestionMatch;
var //eslint-disable-line no-unused-vars
selectedPosition = _props.selectedPosition;
var showSuggestionsWhenValueIsSet = _props.showSuggestionsWhenValueIsSet;
var //eslint-disable-line no-unused-vars
theme = _props.theme;
var other = _objectWithoutProperties(_props, ['error', 'label', 'theme']);
var other = _objectWithoutProperties(_props, ['error', 'label', 'source', 'suggestionMatch', 'selectedPosition', 'showSuggestionsWhenValueIsSet', 'theme']);
var className = (0, _classnames5.default)(theme.autocomplete, _defineProperty({}, theme.focus, this.state.focus), this.props.className);

97
lib/autocomplete/index.d.ts vendored
View File

@ -1,97 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface AutocompleteProps extends Props, Conditional, Changeable<string | Array<any>> {
/**
* Sets the error string for the internal input element.
*/
error?: string,
/**
* The text string to use for the floating label element.
*/
label?: string,
/**
* If true, component can hold multiple values.
* @default true
*/
multiple?: boolean,
/**
* Object of key/values or array representing all items suggested.
*/
source: Object | Array<any>,
/**
* If true, the list of suggestions will not be filtered when a value is selected, until the query is modified.
* @default false
*/
showSuggestionsWhenValueIsSet?: boolean,
/**
* Type of the input element. It can be a valid HTML5 input type
* @default text
*/
type?: string,
/**
* Value or array of values currently selected component.Current value of the input element.
*/
value?: string | Array<any>,
}
/**
* An input field with a set of predeterminated labeled values. When it's focused it shows a list of hints that are filtered by label as the user types.
* They can be simple or multiple depending on the amount of values that can be selected.
* The opening direction is determined at opening time depending on the current position.
*/
export class Autocomplete extends React.Component<AutocompleteProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Autocomplete;

6
lib/avatar/Avatar.js
View File

@ -11,6 +11,10 @@ var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _reactCssThemr = require('react-css-themr');
var _identifiers = require('../identifiers.js');
@ -36,7 +40,7 @@ var factory = function factory(FontIcon) {
return _react2.default.createElement(
'div',
_extends({ 'data-react-toolbox': 'avatar', className: theme.avatar + ' ' + className }, other),
_extends({ 'data-react-toolbox': 'avatar', className: (0, _classnames2.default)(theme.avatar, className) }, other),
children,
typeof image === 'string' ? _react2.default.createElement('img', { className: theme.image, src: image, title: title }) : image,
typeof icon === 'string' ? _react2.default.createElement(FontIcon, { className: theme.letter, value: icon }) : icon,

57
lib/avatar/index.d.ts vendored
View File

@ -1,57 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | React.ReactElement<any> | React.ReactHTMLElement<any>,
}
export interface AvatarProps extends Props, Iconic {
children?: any,
image?: string | React.ReactElement<any> | React.ReactHTMLElement<any> | React.ClassicComponent<any, any>,
title?: string | boolean,
}
/**
* Avatars can be used to represent people.
* For personal avatars, offer personalization options.
* As users may choose not to personalize an avatar, provide delightful defaults.
* When used with a specific logo, avatars can also be used to represent brand.
*/
export class Avatar extends React.Component<AvatarProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Avatar;

124
lib/button/index.d.ts vendored
View File

@ -1,124 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
// Interface for components with icons
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | React.ReactElement<any> | React.ReactHTMLElement<any>,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that can be clicked
*/
export interface Clickable {
/**
* Callback called when the button is clicked.
*/
onClick?: Function
}
export interface ButtonProps extends Props, Clickable, Conditional, Iconic {
/**
* Indicates if the button should have accent color.
* @default false
*/
accent?: boolean,
/**
* If true, the button will have a flat look.
* @default false
*/
flat?: boolean,
/**
* If true, the button will have a floating look.
* @default false
*/
floating?: boolean,
/**
* If specified, the button will be rendered as an <a>
*/
href?: string,
/**
* The text string to use for the name of the button.
*/
label?: string,
/**
* If true, component will be disabled and show a loading animation.
* @default false
*/
loading?: boolean,
/**
* To be used with floating button. If true the button will be smaller.
* @default false
*/
mini?: boolean,
/**
* Indicates if the button should have primary color.
* @default false
*/
primary?: boolean,
/**
* If true, the button will have a raised look.
* @default false
*/
raised?: boolean,
/**
* If true, component will have a ripple effect on click.
* @default true
*/
ripple?: boolean,
}
/**
* A button clearly communicates what action will occur when the user touches it.
* It consists of text, an image, or both, designed in accordance with your app’s color theme.
*/
export class Button extends React.Component<ButtonProps, {}> {
render(): React.DOMElement<any, any>;
}
export class IconButton extends React.Component<ButtonProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Button;

225
lib/card/index.d.ts vendored
View File

@ -1,225 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that can be clicked
*/
export interface Clickable {
/**
* Callback called when the button is clicked.
*/
onClick?: Function
}
export interface ButtonProps extends Props, Clickable, Conditional, Iconic {
/**
* Indicates if the button should have accent color.
* @default false
*/
accent?: boolean,
/**
* If true, the button will have a flat look.
* @default false
*/
flat?: boolean,
/**
* If true, the button will have a floating look.
* @default false
*/
floating?: boolean,
/**
* If specified, the button will be rendered as an <a>
*/
href?: string,
/**
* The text string to use for the name of the button.
*/
label?: string,
/**
* If true, component will be disabled and show a loading animation.
* @default false
*/
loading?: boolean,
/**
* To be used with floating button. If true the button will be smaller.
* @default false
*/
mini?: boolean,
/**
* Indicates if the button should have primary color.
* @default false
*/
primary?: boolean,
/**
* If true, the button will have a raised look.
* @default false
*/
raised?: boolean,
/**
* If true, component will have a ripple effect on click.
* @default true
*/
ripple?: boolean,
}
export interface CardProps extends Props, Clickable {
/**
* Child components, usually Card subcomponents.
*/
children?: any,
/**
* Increases the shadow depth to appear elevated.
*/
raised?: boolean,
/**
* Array of objects describing actions. These actions will be rendered as buttons and the object fields will be transferred to those.
* @default []
*/
actions?: Array<ButtonProps>,
/**
* Sets HEX or RGBA color to add a colored layer to the heading.
*/
color?: string,
/**
* URL to set as a background image in the heading.
*/
image?: 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.
*/
type?: string,
}
/**
* A Card is a piece of paper with unique related data that serves as an entry point to more detailed information.
* For example, a card could contain a photo, text, and a link about a single subject.
* Cards are composed of multiple subcomponents in React Toolbox.
* You can combine each of the subcomponents to create all different Material Design Cards given in the spec.
*/
export class Card extends React.Component<CardProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface CardTitleProps extends Props {
avatar?: string | React.ReactElement<any> | React.ReactHTMLElement<any> | React.ClassicComponent<any, any>,
/**
* Children to pass through the component.
*/
children?: any,
/**
* Sets a complementary smaller text under the title.
*/
subtitle?: string,
/**
* Sets the title of the card.
*/
title?: string | boolean,
}
/**
* A versatile title block that can be used in various places on the card, including the media area.
* This component can also display an avatar next to the title content.
*/
export class CardTitle extends React.Component<CardTitleProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface CardMediaProps extends Props {
/**
* Forces a ('wide' 16:9) or ('square' 1:1) aspect ratio respectively.
* Unset, the media area will have a flexible height.
* @default ''
*/
aspectRatio?: string,
/**
* Usually an image/video element or a <CardTitle> component.
*/
children?: any,
/**
* Sets the background color
*/
color?: string,
/**
* Creates a dark overlay underneath the child components.
*/
contentOverlay?: boolean,
/**
* Can be used instead of children. Accepts an element or a URL string.
*/
image?: string | React.ReactElement<any> | React.ReactHTMLElement<any> | React.ClassicComponent<any, any>,
}
/**
* Used for displaying media such as images or videos on a card.
* Can also be used with a solid background color instead of an image.
*/
export class CardMedia extends React.Component<CardMediaProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface CardTextProps extends Props {
/**
* Children to pass through the component.
*/
children?: any,
}
/**
* Basic card content container.
* Good for small descriptions or other supplementary text.
*/
export class CardText extends React.Component<CardTextProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface CardActionsProps extends Props {
/**
* Children to pass through the component.
*/
children?: any,
}
/**
* This component is used as a container for supplemental card actions.
* Supplemental actions within the card are explicitly called out using icons, text, and UI controls, typically placed at the bottom of the card.
*/
export class CardActions extends React.Component<CardActionsProps, {}> {
render(): React.DOMElement<any, any>;
}

82
lib/checkbox/index.d.ts vendored
View File

@ -1,82 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface CheckboxProps extends Props, Changeable<boolean>, Conditional {
/**
* Value for the checkbox, can be true or false.
* @default false
*/
checked?: boolean,
/**
* Text label to attach next to the checkbox element.
*/
label?: string,
/**
* The name of the field to set in the input checkbox.
*/
name?: string,
/**
* Callback called when the checkbox is blurred.
*/
onBlur?: Function,
/**
* Callback called when the checkbox is focused
*/
onFocus?: Function,
}
export class Checkbox extends React.Component<CheckboxProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Checkbox;

68
lib/chip/index.d.ts vendored
View File

@ -1,68 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
export interface ChipProps extends Props {
/**
* Child components, usually Avatar and inline elements
*/
children?: React.ReactNode;
/**
* If true, the chip will be rendered with a delete icon.
*/
deletable?: boolean;
/**
* Callback to be invoked when the delete icon is clicked.
*/
onDeleteClick?: React.MouseEventHandler
}
/**
* Avatars can be used to represent people.
* For personal avatars, offer personalization options.
* As users may choose not to personalize an avatar, provide delightful defaults.
* When used with a specific logo, avatars can also be used to represent brand.
*/
export class Chip extends React.Component<ChipProps, {}> {
render(): React.ReactElement<any>;
}
export default Chip;

69
lib/date_picker/index.d.ts vendored
View File

@ -1,69 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface DatePickerProps extends Props, Changeable<Date> {
/**
* Date object with the maximum selectable date.
*/
maxDate?: Date,
/**
* Date object with the minimum selectable date.
*/
minDate?: Date,
/**
* The text string to use like a input placeholder.
*/
placeholder?: string,
/**
* Date object with the currently selected date.
*/
value?: Date,
}
export class DatePicker extends React.Component<DatePickerProps, {}> {
render(): React.DOMElement<any, any>;
}
export default DatePicker;

159
lib/dialog/index.d.ts vendored
View File

@ -1,159 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that can be clicked
*/
export interface Clickable {
/**
* Callback called when the button is clicked.
*/
onClick?: Function
}
/**
* Properties of modal components (Drawer, Dialog)
*/
export interface Modal {
/**
* If true, the dialog will be active.
*/
active: boolean,
/**
* Callback called when the ESC key is pressed with the overlay active.
*/
onEscKeyDown?: Function,
/**
* Callback to be invoked when the dialog overlay is clicked.
*/
onOverlayClick?: Function,
/**
* Callback called when the mouse button is pressed on the overlay.
*/
onOverlayMouseDown?: Function,
/**
* Callback called when the mouse is moving over the overlay.
*/
onOverlayMouseMove?: Function,
/**
* Callback called when the mouse button is released over the overlay.
*/
onOverlayMouseUp?: Function,
}
export interface ButtonProps extends Props, Clickable, Conditional, Iconic {
/**
* Indicates if the button should have accent color.
* @default false
*/
accent?: boolean,
/**
* If true, the button will have a flat look.
* @default false
*/
flat?: boolean,
/**
* If true, the button will have a floating look.
* @default false
*/
floating?: boolean,
/**
* If specified, the button will be rendered as an <a>
*/
href?: string,
/**
* The text string to use for the name of the button.
*/
label?: string,
/**
* If true, component will be disabled and show a loading animation.
* @default false
*/
loading?: boolean,
/**
* To be used with floating button. If true the button will be smaller.
* @default false
*/
mini?: boolean,
/**
* Indicates if the button should have primary color.
* @default false
*/
primary?: boolean,
/**
* If true, the button will have a raised look.
* @default false
*/
raised?: boolean,
/**
* If true, component will have a ripple effect on click.
* @default true
*/
ripple?: boolean,
}
export interface DialogProps extends Props, Modal {
/**
* An array of objects representing the buttons for the dialog navigation area. The properties will be transferred to the buttons.
* @default []
*/
actions?: Array<ButtonProps>,
/**
* The text string to use as standar title of the dialog.
*/
title?: string | boolean,
/**
* Used to determine the size of the dialog. It can be small, normal or large.
* @default normal
*/
type?: string,
}
export class Dialog extends React.Component<DialogProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Dialog;

76
lib/drawer/index.d.ts vendored
View File

@ -1,76 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
/**
* Properties of modal components (Drawer, Dialog)
*/
export interface Modal {
/**
* If true, the dialog will be active.
*/
active: boolean,
/**
* Callback called when the ESC key is pressed with the overlay active.
*/
onEscKeyDown?: Function,
/**
* Callback to be invoked when the dialog overlay is clicked.
*/
onOverlayClick?: Function,
/**
* Callback called when the mouse button is pressed on the overlay.
*/
onOverlayMouseDown?: Function,
/**
* Callback called when the mouse is moving over the overlay.
*/
onOverlayMouseMove?: Function,
/**
* Callback called when the mouse button is released over the overlay.
*/
onOverlayMouseUp?: Function,
}
export interface DrawerProps extends Props, Modal {
/**
* Type of drawer. It can be 'left' or 'right' to display the drawer on the left or right side of the screen.
* @default left
*/
type?: string
}
export class Drawer extends React.Component<DrawerProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Drawer;

7
lib/dropdown/Dropdown.js
View File

@ -190,8 +190,11 @@ var factory = function factory(Input) {
var template = _props.template;
var theme = _props.theme;
var source = _props.source;
var allowBlank = _props.allowBlank;
var auto = _props.auto;
var others = _objectWithoutProperties(_props, ['template', 'theme', 'source', 'allowBlank', 'auto']); //eslint-disable-line no-unused-vars
var others = _objectWithoutProperties(_props, ['template', 'theme', 'source']);
var selected = this.getSelectedItem();
var className = (0, _classnames4.default)(theme.dropdown, (_classnames2 = {}, _defineProperty(_classnames2, theme.up, this.state.up), _defineProperty(_classnames2, theme.active, this.state.active), _defineProperty(_classnames2, theme.disabled, this.props.disabled), _classnames2), this.props.className);
@ -204,7 +207,7 @@ var factory = function factory(Input) {
onMouseDown: this.handleMouseDown,
readOnly: true,
type: template && selected ? 'hidden' : null,
value: selected && selected.label
value: selected && selected.label ? selected.label : ''
})),
template && selected ? this.renderTemplateValue(selected) : null,
_react2.default.createElement(

84
lib/dropdown/index.d.ts vendored
View File

@ -1,84 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
export interface Option<T> {
label: string,
value: T,
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface DropdownProps extends Props, Changeable<any>, Conditional {
/**
* If true, the dropdown will open up or down depending on the position in the screen.
*/
auto?: boolean,
/**
* The text string to use for the floating label element.
*/
label?: string,
/**
* Array of data objects with the data to represent in the dropdown.
*/
source: Array<Option<any>>,
/**
* Callback function that returns a JSX template to represent the element.
*/
template?: Function,
/**
* Default value using JSON data.
*/
value: string,
}
export class Dropdown extends React.Component<DropdownProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Dropdown;

44
lib/font_icon/index.d.ts vendored
View File

@ -1,44 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface FontIconProps extends Props {
value: string
}
export class FontIcon extends React.Component<FontIconProps, {}> {
render(): React.DOMElement<any, any>;
}
export default FontIcon;

13
lib/hoc/ActivableRenderer.d.ts vendored
View File

@ -1,13 +0,0 @@
import * as React from 'react';
export interface ActivableRendererOptions {
/**
* @default 500
*/
delay?: number;
}
export interface ActivableRendererProps {
active: boolean;
children?: any;
delay?: number
}
export default function ActivableRendererFactory<P>(options?: ActivableRendererOptions): (componentClass: React.ComponentClass<P>) => React.ComponentClass<P & ActivableRendererProps>

1
lib/identifiers.js
View File

@ -16,6 +16,7 @@ var INPUT = exports.INPUT = 'RTInput';
var LAYOUT = exports.LAYOUT = 'RTLayout';
var LINK = exports.LINK = 'RTLink';
var LIST = exports.LIST = 'RTList';
var MENU = exports.MENU = 'RTMenu';
var NAVIGATION = exports.NAVIGATION = 'RTNavigation';
var OVERLAY = exports.OVERLAY = 'RTOverlay';
var PROGRESS_BAR = exports.PROGRESS_BAR = 'RTProgressBar';

31
lib/input/Input.js
View File

@ -53,11 +53,42 @@ var factory = function factory(FontIcon) {
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Input)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleChange = function (event) {
if (_this.props.multiline) {
_this.handleAutoresize();
}
if (_this.props.onChange) _this.props.onChange(event.target.value, event);
}, _this.handleAutoresize = function () {
var element = _this.refs.input;
// compute the height difference between inner height and outer height
var style = getComputedStyle(element, null);
var heightOffset = style.boxSizing === 'content-box' ? -(parseFloat(style.paddingTop) + parseFloat(style.paddingBottom)) : parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
// resize the input to its content size
element.style.height = 'auto';
element.style.height = element.scrollHeight + heightOffset + 'px';
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Input, [{
key: 'componentDidMount',
value: function componentDidMount() {
window.addEventListener('resize', this.handleAutoresize);
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (!this.props.multiline && nextProps.multiline) {
window.addEventListener('resize', this.handleAutoresize);
} else if (this.props.multiline && !nextProps.multiline) {
window.removeEventListener('resize', this.handleAutoresize);
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
window.removeEventListener('resize', this.handleAutoresize);
}
}, {
key: 'blur',
value: function blur() {
this.refs.input.blur();

124
lib/input/index.d.ts vendored
View File

@ -1,124 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface InputProps extends Props, Conditional, Changeable<string>, Iconic {
/**
* Give an error string to display under the field.
*/
error?: string,
/**
* Indicates if the label is floating in the input field or not.
* @default true
*/
floating?: boolean,
/**
* The text string to use for the floating label element.
*/
label?: string,
/**
* Specifies the maximum number of characters allowed in the component.
*/
maxLength?: number,
/**
* If true, a textarea element will be rendered. The textarea also grows and shrinks according to the number of lines.
* @default false
*/
multiline?: boolean,
/**
* Callback function that is fired when components is blurred.
*/
onBlur?: Function,
/**
* Callback function that is fired when components is focused.
*/
onFocus?: Function,
/**
* Callback function that is fired when a key is pressed down.
*/
onKeyDown?: Function,
/**
* Callback function that is fired when a key is pressed.
*/
onKeyPress?: Function,
/**
* Callback function that is fired when a key is released.
*/
onKeyUp?: Function,
/**
* If true, the html input has a required value.
* @default false
*/
required?: boolean,
/**
* Type of the input element. It can be a valid HTML5 input type
* @default text
*/
type?: string,
/**
* Current value of the input element.
*/
value?: string,
}
export class Input extends React.Component<InputProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Input;

43
lib/layout/index.d.ts vendored
View File

@ -1,43 +0,0 @@
import * as React from 'react';
export interface LayoutProps {
className?:string
}
export interface NavDrawerProps {
width?:'normal' | 'wide',
active?:boolean,
pinned?:boolean,
permanentAt?:'sm'|'md'|'lg'|'xl'|'xxl'|'xxxl',
onOverlayClick?:() => void,
scrollY?:boolean,
className?:string
}
export interface PanelProps {
scrollY?:boolean,
className?:string
}
export interface SidebarProps {
width?:'1'|'2'|'3'|'4'|'5'|'6'|'7'|'8'|'9'|'10'|'11'|'12'|'25'|'33'|'50'|'66'|'75'|'100'
pinned?:boolean,
scrollY?:boolean,
className?:string
}
export class Layout extends React.Component<LayoutProps, {}> {
render():React.DOMElement<any, any>;
}
export class NavDrawer extends React.Component<NavDrawerProps, {}> {
render():React.DOMElement<any, any>;
}
export class Panel extends React.Component<PanelProps, {}> {
render():React.DOMElement<any, any>;
}
export class Sidebar extends React.Component<SidebarProps, {}> {
render():React.DOMElement<any, any>;
}

58
lib/link/index.d.ts vendored
View File

@ -1,58 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface LinkProps extends Props, Iconic {
href: string,
/**
* The text string used for the text content of the link.
*/
label: string,
/**
* Sets a count number useful to display in the page how many times was visited for example.
*/
count?: number,
}
export class Link extends React.Component<LinkProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Link;

16
lib/list/ListItem.js
View File

@ -74,16 +74,24 @@ var factory = function factory(ripple, ListItemLayout, ListItemContent) {
if (!_react2.default.isValidElement(child)) {
return;
}
if (child.props.listItemIgnore) {
children.ignored.push(child);
var _child$props = child.props;
var listItemIgnore = _child$props.listItemIgnore;
var rest = _objectWithoutProperties(_child$props, ['listItemIgnore']);
var strippedChild = _extends({}, child, { props: rest });
if (listItemIgnore) {
children.ignored.push(strippedChild);
return;
}
if (child.type === ListItemContent) {
children.itemContent = child;
children.itemContent = strippedChild;
return;
}
var bucket = children.itemContent ? 'rightActions' : 'leftActions';
children[bucket].push(_extends({}, child, { key: i }));
children[bucket].push(_extends({}, strippedChild, { key: i }));
});
return children;

180
lib/list/index.d.ts vendored
View File

@ -1,180 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
export interface Clickable {
/**
* Callback called when the button is clicked.
*/
onClick?: Function
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface ListProps extends Props {
/**
* If true, each element in the list will have a ripple effect on click
* @default false
*/
ripple?: boolean,
/**
* If true, the elements in the list will display a hover effect and a pointer cursor.
* @default false
*/
selectable?: boolean,
}
export class List extends React.Component<ListProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface ListItemProps extends Props, Conditional, Clickable {
/**
* A string URL to specify an avatar in the left side of the item.
*/
avatar?: string,
/**
* Main text of the item. Required.
*/
caption?: string,
/**
* An element that will be displayed as the item. If set, this will override `caption` and `legend`.
*/
itemContent?: React.ReactElement<any>,
/**
* A list of elements that are placed on the left side of the item and after the avatar attribute.
*/
leftActions?: React.ReactElement<any>[],
/**
* A string key of a font icon to display an icon in the left side of the item.
*/
leftIcon?: string,
/**
* Secondary text to display under the caption.
*/
legend?: string,
/**
* A list of elements that are placed on the right side of the item and after the rightIcon attribute.
*/
rightActions?: React.ReactElement<any>[],
/**
* The same as the leftIcon but in this case the icon is displayed in the right side.
*/
rightIcon?: string,
/**
* If true, the item displays a ripple effect on click. By default it's inherited from the parent element.
* @default false
*/
ripple?: boolean,
/**
* If true, the elements in the list will display a hover effect and a pointer cursor. Inherited from the parent
* @default false
*/
selectable?: boolean,
/**
* In case you want to provide the item as a link, you can pass this property to specify the href.
*/
to?: string;
}
export class ListItem extends React.Component<ListItemProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface ListCheckboxProps extends Props, Conditional, Changeable<boolean> {
/**
* Main text of the item. Required.
*/
caption?: string,
/**
* If true the checkbox appears checked by default.
* @default false
*/
checked: boolean,
/**
* Secondary text to display under the caption.
*/
legend?: string,
/**
* Name for the checkbox input item.
*/
name?: string,
/**
* Callback called when the input element is blurred.
*/
onBlur?: Function,
/**
* Callback called when the input element is focused.
*/
onFocus?: Function,
}
export class ListCheckbox extends React.Component<ListCheckboxProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface ListSubHeaderProps extends Props {
/**
* List header caption.
*/
caption: string;
}
export class ListSubHeader extends React.Component<ListSubHeaderProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface ListDividerProps extends Props {
/**
* Indicates if the divider should be full width or should leave a space on the left side.
*/
inset: boolean;
}
export class ListDivider extends React.Component<ListDividerProps, {}> {
render(): React.DOMElement<any, any>;
}

150
lib/menu/index.d.ts vendored
View File

@ -1,150 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface MenuProps extends Props {
/**
* If true, the menu will be displayed as opened by default.
* @default false
*/
active?: boolean,
/**
* Callback that will be called when the menu is being hidden.
*/
onHide?: Function,
/**
* Callback that will be called when the menu is being shown.
*/
onShow?: Function,
/**
* If true the menu wrapper will show an outline with a soft shadow.
* @default true
*/
outline?: boolean,
/**
* 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.
* @default static
*/
position?: string,
/**
* If true, the menu items will show a ripple effect on click.
*/
ripple?: boolean,
/**
* If true, the menu will keep a value to highlight the active child item.
*/
selectable?: boolean,
/**
* Used for selectable menus and indicates the initial value so the child item with this value can be highlighted.
*/
value?: boolean,
}
export class Menu extends React.Component<MenuProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface IconMenuProps extends Props, Iconic {
/**
* If true, the icon will show a ripple when is clicked.
*/
iconRipple?: boolean,
/**
* Transferred to the Menu component.
* @default true
*/
menuRipple?: boolean,
/**
* Callback that will be called when the icon is clicked.
*/
onClick?: Function,
/**
* Callback that will be called when the menu is being hidden.
*/
onHide?: Function,
/**
* Callback that will be called when the menu is being shown.
*/
onShow?: Function,
/**
* Callback that will be called when a menu item is selected.
*/
onSelect?: Function,
/**
* Determine the position of the menu. This property is transferred to the inner Menu component.
* @default auto
*/
position?: string,
/**
* If true, the menu will keep a value to highlight the active child item. Transferred to the Menu
*/
selectable?: boolean,
}
export class IconMenu extends React.Component<IconMenuProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface MenuItemProps extends Props, Conditional, Iconic {
/**
* The text to include in the menu item.
*/
caption?: string,
/**
* If true, the item will show a ripple effect when it's clicked. Inherited from the parent.
*/
ripple?: boolean,
/**
* Transferred from the Menu component for selectable menus. Indicates if it's the current active option.
*/
selected?: boolean,
}
export class MenuItem extends React.Component<MenuItemProps, {}> {
render(): React.DOMElement<any, any>;
}
export class MenuDivider extends React.Component<any, {}> {
render(): React.DOMElement<any, any>;
}

58
lib/navigation/index.d.ts vendored
View File

@ -1,58 +0,0 @@
import * as React from 'react';
import { ButtonProps } from '../button'
import { LinkProps } from '../link'
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface NavigationProps extends Props {
/**
* Array of objects that represent buttons so the keys will be transferred as properties to those.
*/
actions?: Array<ButtonProps>,
/**
* Array of objects similar to actions but that will be rendered as <Link/> component definition.
*/
routes?: Array<LinkProps>,
/**
* Type of the navigation, it can be 'vertical' or 'horizontal'.
*/
type?: string,
}
export class Navigation extends React.Component<NavigationProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Navigation;

51
lib/overlay/index.d.ts vendored
View File

@ -1,51 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface OverlayProps extends Props {
active?: boolean;
children?: any;
/**
* Sets a CSS class on the component.
*/
className?: string;
invisible?: boolean;
onClick?: Function;
onEscKeyDown?: Function
}
export class Overlay extends React.Component<OverlayProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Overlay;

71
lib/progress_bar/index.d.ts vendored
View File

@ -1,71 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface ProgressBarProps extends Props {
/**
* Value of a secondary progress bar useful for buffering.
*/
buffer?: number,
/**
* Maximum value permitted.
*/
max?: number, //
/**
* minimum value permitted.
*/
min?: number, //
/**
* Mode of the progress bar, it can be determinate or indeterminate.
*/
mode?: string, //
/**
* If true, the circular progress bar will be changing its color.
*/
multicolor?: boolean, //
/**
* Type of the progress bar, it can be circular or linear.
* @default linear
*/
type?: string,
/**
* Value of the current progress.
*/
value?: number,
}
export class ProgressBar extends React.Component<ProgressBarProps, {}> {
render(): React.DOMElement<any, any>;
}
export default ProgressBar;

101
lib/radio/index.d.ts vendored
View File

@ -1,101 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface RadioGroupProps extends Props, Conditional, Changeable<any> {
/**
* Name for the input element group.
*/
name?: string,
/**
* Default value selected in the radio group.
*/
value?: any,
}
export class RadioGroup extends React.Component<RadioGroupProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface RadioButtonProps extends Props, Conditional {
/**
* If true, the input element will be selected by default. Transferred from the parent.
*/
checked?: boolean,
/**
* Label for the radio button.
*/
label?: string;
/**
* Name for the input element.
*/
name?: string,
/**
* Callback function that will be invoked when the input is blurred.
*/
onBlur?: Function,
/**
* Callback function that will be invoked when the value changes.
*/
onChange?: Function,
/**
* Callback function that will be invoked when the input is focused.
*/
onFocus?: Function,
/**
* Value for the radio button.
*/
value: any,
}
export class RadioButton extends React.Component<RadioButtonProps, {}> {
render(): React.DOMElement<any, any>;
}
export default RadioButton;

4
lib/ripple/Ripple.js
View File

@ -166,11 +166,13 @@ var rippleFactory = function rippleFactory() {
var _props2 = this.props;
var children = _props2.children;
var ripple = _props2.ripple;
var //eslint-disable-line no-unused-vars
onRippleEnded = _props2.onRippleEnded;
var className = _props2.rippleClassName;
var centered = _props2.rippleCentered;
var spread = _props2.rippleSpread;
var other = _objectWithoutProperties(_props2, ['children', 'ripple', 'rippleClassName', 'rippleCentered', 'rippleSpread']);
var other = _objectWithoutProperties(_props2, ['children', 'ripple', 'onRippleEnded', 'rippleClassName', 'rippleCentered', 'rippleSpread']);
var rippleClassName = (0, _classnames3.default)(this.props.theme.ripple, (_classnames = {}, _defineProperty(_classnames, this.props.theme.rippleActive, this.state.active), _defineProperty(_classnames, this.props.theme.rippleRestarting, this.state.restarting), _classnames), className);

20
lib/ripple/index.d.ts vendored
View File

@ -1,20 +0,0 @@
import * as React from 'react';
export interface RippleProps {
centered?:boolean,
className?:boolean,
onRippleEnded:() => void,
spread?:number,
theme?:{
ripple?:string,
rippleActive?:string,
rippleRestarting?:string,
rippleWrapper?:string
}
}
export class Ripple extends React.Component<RippleProps, {}> {
render():React.DOMElement<any, any>;
}
export default Ripple;

74
lib/slider/index.d.ts vendored
View File

@ -1,74 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface SliderProps extends Props {
/**
* If true, an input is shown and the user can set the slider from keyboard value.
*/
editable?: boolean,
/**
* Maximum value permitted.
*/
max?: number,
/**
* Minimum value permitted.
*/
min?: number,
/**
* Callback function that will be invoked when the slider value changes.
*/
onChange?: Function,
/**
* 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.
*/
pinned?: boolean,
/**
* If true, the slider thumb snaps to tick marks evenly spaced based on the step property value.
*/
snaps?: boolean,
/**
* Amount to vary the value when the knob is moved or increase/decrease is called.
*/
step?: number,
/**
* Current value of the slider.
*/
value: number,
}
export class Slider extends React.Component<SliderProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Slider;

100
lib/snackbar/index.d.ts vendored
View File

@ -1,100 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Iconic {
/**
* Value of the icon (See icon component).
*/
icon?: string | __React.ReactElement<any> | __React.ReactHTMLElement<any>,
}
export interface Modal {
/**
* If true, the dialog will be active.
*/
active: boolean,
/**
* Callback called when the ESC key is pressed with the overlay active.
*/
onEscKeyDown?: Function,
/**
* Callback to be invoked when the dialog overlay is clicked.
*/
onOverlayClick?: Function,
/**
* Callback called when the mouse button is pressed on the overlay.
*/
onOverlayMouseDown?: Function,
/**
* Callback called when the mouse is moving over the overlay.
*/
onOverlayMouseMove?: Function,
/**
* Callback called when the mouse button is released over the overlay.
*/
onOverlayMouseUp?: Function,
}
export interface SnackbarProps extends Props, Modal, Iconic {
/**
* For the action component inside the Snackbar.
*/
action?: string,
/**
* Text to display in the content.
*/
label?: string,
/**
* Callback function that will be called when the button action is clicked.
*/
onClick?: Function,
/**
* Callback function when finish the set timeout.
*/
onTimeout?: Function,
/**
* amount of time after the Snackbar will be automatically hidden.
*/
timeout?: number,
/**
* Indicates the action type. Can be 'accept', 'warning' or 'cancel'
*/
type?: string,
}
export class Snackbar extends React.Component<SnackbarProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Snackbar;

77
lib/switch/index.d.ts vendored
View File

@ -1,77 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
export interface SwitchProps extends Props, Conditional {
/**
* If true, the switch will be enabled.
*/
checked: boolean,
/**
* If true, component will be disabled.
*/
disabled?: boolean,
/**
* The text string to use for the floating label element.
*/
label?: string,
/**
* The text string used as name of the input.
*/
name?: string,
/**
* Callback function that is fired when when the switch is blurred.
*/
onBlur?: Function,
/**
* Callback function that is fired when the components's value changes.
*/
onChange?: Function,
/**
* Callback function fire when the switch is focused.
*/
onFocus?: Function,
}
export class Switch extends React.Component<SwitchProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Switch;

66
lib/table/index.d.ts vendored
View File

@ -1,66 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface TableProps extends Props {
/**
* If true, component will show a heading using model field names.
*/
heading?: boolean,
/**
* Object describing the data model that represents each object in the source.
*/
model?: { [key: string]: string },
/**
* Callback function that is fired when an item in a row changes. If set, rows are editable.
*/
onChange?: Function,
/**
* Callback function invoked when the row selection changes.
*/
onSelect?: Function,
/**
* Array of indexes of the items in the source that should appear as selected.
*/
selected?: Array<number>,
/**
* Array of objects representing each item to show.
*/
source?: Array<{ [key: string]: any }>,
}
export class Table extends React.Component<TableProps, {}> {
render(): React.DOMElement<any, any>;
}
export default Table;

84
lib/tabs/index.d.ts vendored
View File

@ -1,84 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
export interface Conditional {
/**
* If true, component will be disabled
* @default false
*/
disabled?: boolean
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface TabsProps extends Props, Changeable<number> {
/**
* Current
*/
index: number,
}
export class Tabs extends React.Component<TabsProps, {}> {
render(): React.DOMElement<any, any>;
}
export interface TabProps extends Props, Conditional {
/**
* If true, the current component is visible.
* @default false
*/
active?: boolean,
/**
* If true, the current component is not visible.
* @default false
*/
hidden?: boolean,
/**
* Label text for navigation header
*/
label?: string,
/**
* Callback function that is fired when the tab is activated.
*/
onActive?: Function,
}
export class Tab extends React.Component<TabProps, {}> {
render(): React.DOMElement<any, any>;
}

61
lib/time_picker/index.d.ts vendored
View File

@ -1,61 +0,0 @@
import * as React from 'react';
export interface Props {
/**
* Sets a CSS class on the component.
*/
className?: string,
id?: string;
/**
* A key used to uniquely identify the element within an Array
*/
key?: string,
/**
* Inline style
*/
style?: any,
/**
* Tooltip text
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltip?: string,
/**
* Amount of time in miliseconds spent before the tooltip is visible.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipDelay?: number,
/**
* If true, the Tooltip hides after a click in the host component.
* APPLIES ONLY IF THE COMPONENT IS WRAPPED WITH Tooltip.
* @default true
* @see http://react-toolbox.com/#/components/tooltip
*/
tooltipHideOnClick?: boolean,
}
/**
* Properties of components that have values that can be changed (T is the type of the value)
*/
export interface Changeable<T> {
/**
* Callback called when the picker value is changed.
* @param v Type of the value
*/
onChange?: (v: T) => void
}
export interface TimePickerProps extends Props, Changeable<Date> {
/**
* Format to display the clock. It can be 24hr or ampm.
* @default 24hr
*/
format?: string,
/**
* Datetime object with currrently selected time
*/
value?: Date,
}
export class TimePicker extends React.Component<TimePickerProps, {}> {
render(): React.DOMElement<any, any>;
}
export default TimePicker;

10
lib/tooltip/index.d.ts vendored
View File

@ -1,10 +0,0 @@
import * as React from 'react';
export class TooltipComponent<P, S> extends React.Component<P, S> {
getDecoratedComponentInstance(): React.Component<P, S>;
}
export interface TooltipComponentClass<P> extends React.ComponentClass<P> {
new (props?: P, context?: any): TooltipComponent<P, any>;
}
export default function Tooltip<P>(componentClass: React.ComponentClass<P>): TooltipComponentClass<P>;

14
package.json
View File

@ -38,7 +38,7 @@
"dependencies": {
"classnames": "^2.2.5",
"core-js": "^2.4.0",
"react-css-themr": "^1.1.0"
"react-css-themr": "^1.1.2"
},
"devDependencies": {
"autoprefixer": "^6.3.6",
@ -75,11 +75,11 @@
"phantomjs-polyfill": "0.0.2",
"phantomjs-prebuilt": "^2.1.7",
"postcss-loader": "^0.9.1",
"react": "^15.0.2",
"react-addons-css-transition-group": "^15.0.2",
"react": "^15.2.0",
"react-addons-css-transition-group": "^15.2.0",
"react-addons-test-utils": "^15.0.2",
"react-docgen": "^2.8.2",
"react-dom": "^15.0.2",
"react-dom": "^15.2.0",
"react-transform-catch-errors": "^1.0.2",
"react-transform-hmr": "^1.0.4",
"redbox-react": "^1.2.4",
@ -114,8 +114,8 @@
"peerDependencies": {
"classnames": "^2.2.0",
"normalize.css": "^4.0.0",
"react": "^0.14 || ^15.0.1",
"react-addons-css-transition-group": "^0.14.0 || ^15.0.1",
"react-dom": "^0.14.0 || ^15.0.1"
"react": "^0.14 || ^15.2.0",
"react-addons-css-transition-group": "^0.14.0 || ^15.2.0",
"react-dom": "^0.14.0 || ^15.2.0"
}
}

2
spec/components/avatar.js
View File

@ -9,7 +9,7 @@ const AvatarTest = () => (
<Avatar style={{backgroundColor: 'deepskyblue'}} icon="folder" />
<Avatar icon={<GithubIcon />}/>
<Avatar><img src="https://placeimg.com/80/80/animals"/></Avatar>
<Avatar title="Javier" img="https://placeimg.com/80/80/animals"/>
<Avatar title="Javier"/>
<Avatar style={{backgroundColor: 'yellowgreen'}}><GithubIcon /></Avatar>
</section>
);