Added logging, changed some directory structure

This commit is contained in:
2018-01-13 21:33:40 -05:00
parent f079a5f067
commit 8e72ffb917
73656 changed files with 35284 additions and 53718 deletions

View File

@@ -0,0 +1,21 @@
import * as React from 'react';
import { StandardProps } from '..';
export interface BottomNavigationProps extends StandardProps<
React.HTMLAttributes<HTMLDivElement>,
BottomNavigationClassKey,
'onChange'
> {
children: React.ReactNode;
onChange?: (event: React.ChangeEvent<{}>, value: any) => void;
showLabels?: boolean;
value?: any;
}
export type BottomNavigationClassKey =
| 'root'
;
declare const BottomNavigation: React.ComponentType<BottomNavigationProps>;
export default BottomNavigation;

View File

@@ -0,0 +1,124 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styles = undefined;
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _ref; // weak
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var styles = exports.styles = function styles(theme) {
return {
root: {
display: 'flex',
justifyContent: 'center',
height: 56,
backgroundColor: theme.palette.background.paper
}
};
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* The content of the component.
*/
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node.isRequired ? babelPluginFlowReactPropTypes_proptype_Node.isRequired : babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node).isRequired,
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
/**
* @ignore
*/
className: require('prop-types').string,
/**
* Callback fired when the value changes.
*
* @param {object} event The event source of the callback
* @param {any} value We default to the index of the child
*/
onChange: require('prop-types').func,
/**
* If `true`, all `BottomNavigationButton`s will show their labels.
* By default only the selected `BottomNavigationButton` will show its label.
*/
showLabels: require('prop-types').bool,
/**
* The value of the currently selected `BottomNavigationButton`.
*/
value: require('prop-types').any.isRequired
};
function BottomNavigation(props) {
var childrenProp = props.children,
classes = props.classes,
classNameProp = props.className,
onChange = props.onChange,
showLabels = props.showLabels,
value = props.value,
other = (0, _objectWithoutProperties3.default)(props, ['children', 'classes', 'className', 'onChange', 'showLabels', 'value']);
var className = (0, _classnames2.default)(classes.root, classNameProp);
var children = _react2.default.Children.map(childrenProp, function (child, childIndex) {
var childValue = child.props.value || childIndex;
return _react2.default.cloneElement(child, {
selected: childValue === value,
showLabel: child.props.showLabel !== undefined ? child.props.showLabel : showLabels,
value: childValue,
onChange: onChange
});
});
return _react2.default.createElement(
'div',
(0, _extends3.default)({ className: className }, other),
children
);
}
BottomNavigation.propTypes = process.env.NODE_ENV !== "production" ? (_ref = {
classes: require('prop-types').object.isRequired,
showLabels: require('prop-types').bool.isRequired,
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node.isRequired ? babelPluginFlowReactPropTypes_proptype_Node.isRequired : babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node).isRequired
}, (0, _defineProperty3.default)(_ref, 'classes', require('prop-types').object), (0, _defineProperty3.default)(_ref, 'className', require('prop-types').string), (0, _defineProperty3.default)(_ref, 'onChange', require('prop-types').func), (0, _defineProperty3.default)(_ref, 'showLabels', require('prop-types').bool), (0, _defineProperty3.default)(_ref, 'value', require('prop-types').any.isRequired), _ref) : {};
BottomNavigation.defaultProps = {
showLabels: false
};
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiBottomNavigation' })(BottomNavigation);

View File

@@ -0,0 +1,87 @@
// @flow weak
import React from 'react';
import type { Node } from 'react';
import classNames from 'classnames';
import withStyles from '../styles/withStyles';
export const styles = (theme: Object) => ({
root: {
display: 'flex',
justifyContent: 'center',
height: 56,
backgroundColor: theme.palette.background.paper,
},
});
type ProvidedProps = {
classes: Object,
showLabels: boolean,
};
export type Props = {
/**
* The content of the component.
*/
children: Node,
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
/**
* @ignore
*/
className?: string,
/**
* Callback fired when the value changes.
*
* @param {object} event The event source of the callback
* @param {any} value We default to the index of the child
*/
onChange?: Function,
/**
* If `true`, all `BottomNavigationButton`s will show their labels.
* By default only the selected `BottomNavigationButton` will show its label.
*/
showLabels?: boolean,
/**
* The value of the currently selected `BottomNavigationButton`.
*/
value: any,
};
function BottomNavigation(props: ProvidedProps & Props) {
const {
children: childrenProp,
classes,
className: classNameProp,
onChange,
showLabels,
value,
...other
} = props;
const className = classNames(classes.root, classNameProp);
const children = React.Children.map(childrenProp, (child, childIndex) => {
const childValue = child.props.value || childIndex;
return React.cloneElement(child, {
selected: childValue === value,
showLabel: child.props.showLabel !== undefined ? child.props.showLabel : showLabels,
value: childValue,
onChange,
});
});
return (
<div className={className} {...other}>
{children}
</div>
);
}
BottomNavigation.defaultProps = {
showLabels: false,
};
export default withStyles(styles, { name: 'MuiBottomNavigation' })(BottomNavigation);

View File

@@ -0,0 +1,32 @@
import * as React from 'react';
import { StandardProps } from '..';
import { ButtonBaseProps, ButtonBaseClassKey } from '../ButtonBase';
export interface BottomNavigationButtonProps extends StandardProps<
ButtonBaseProps,
BottomNavigationButtonClassKey,
'onChange'
> {
icon?: string | React.ReactElement<any>;
label?: React.ReactNode;
onChange?: (event: React.ChangeEvent<{}>, value: any) => void;
onClick?: React.ReactEventHandler<any>;
selected?: boolean;
showLabel?: boolean;
value?: any;
}
export type BottomNavigationButtonClassKey =
| ButtonBaseClassKey
| 'selected'
| 'selectedIconOnly'
| 'wrapper'
| 'label'
| 'selectedLabel'
| 'hiddenLabel'
| 'icon'
;
declare const BottomNavigationButton: React.ComponentType<BottomNavigationButtonProps>;
export default BottomNavigationButton;

View File

@@ -0,0 +1,251 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styles = undefined;
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
var _ButtonBase = require('../ButtonBase');
var _ButtonBase2 = _interopRequireDefault(_ButtonBase);
var _Icon = require('../Icon');
var _Icon2 = _interopRequireDefault(_Icon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Element = require('react').babelPluginFlowReactPropTypes_proptype_Element || require('prop-types').any;
// @inheritedComponent ButtonBase
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var styles = exports.styles = function styles(theme) {
return {
root: {
transition: theme.transitions.create(['color', 'padding-top'], {
duration: theme.transitions.duration.short
}),
paddingTop: 8,
paddingBottom: 10,
paddingLeft: 12,
paddingRight: 12,
minWidth: 80,
maxWidth: 168,
color: theme.palette.text.secondary,
flex: '1'
},
selected: {
paddingTop: 6,
color: theme.palette.primary[500]
},
selectedIconOnly: {
paddingTop: theme.spacing.unit * 2
},
wrapper: {
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
width: '100%',
flexDirection: 'column'
},
label: {
fontFamily: theme.typography.fontFamily,
fontSize: theme.typography.pxToRem(theme.typography.fontSize - 2),
opacity: 1,
transition: 'font-size 0.2s, opacity 0.2s',
transitionDelay: '0.1s'
},
selectedLabel: {
fontSize: theme.typography.pxToRem(theme.typography.fontSize)
},
hiddenLabel: {
opacity: 0,
transitionDelay: '0s'
},
icon: {
display: 'block',
margin: 'auto'
}
};
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
/**
* @ignore
*/
className: require('prop-types').string,
/**
* The icon element. If a string is provided, it will be used as a font ligature.
*/
icon: require('prop-types').oneOfType([require('prop-types').string, typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element)]),
/**
* The label element.
*/
label: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
/**
* @ignore
*/
onChange: require('prop-types').func,
/**
* @ignore
*/
onClick: require('prop-types').func,
/**
* @ignore
*/
selected: require('prop-types').bool,
/**
* If `true`, the BottomNavigationButton will show its label.
*/
showLabel: require('prop-types').bool,
/**
* You can provide your own value. Otherwise, we fallback to the child position index.
*/
value: require('prop-types').any
};
var BottomNavigationButton = function (_React$Component) {
(0, _inherits3.default)(BottomNavigationButton, _React$Component);
function BottomNavigationButton() {
var _ref;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, BottomNavigationButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = BottomNavigationButton.__proto__ || (0, _getPrototypeOf2.default)(BottomNavigationButton)).call.apply(_ref, [this].concat(args))), _this), _this.handleChange = function (event) {
var _this$props = _this.props,
onChange = _this$props.onChange,
value = _this$props.value,
onClick = _this$props.onClick;
if (onChange) {
onChange(event, value);
}
if (onClick) {
onClick(event);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(BottomNavigationButton, [{
key: 'render',
value: function render() {
var _classNames, _classNames2;
var _props = this.props,
label = _props.label,
iconProp = _props.icon,
selected = _props.selected,
classes = _props.classes,
classNameProp = _props.className,
showLabelProp = _props.showLabel,
onChange = _props.onChange,
value = _props.value,
other = (0, _objectWithoutProperties3.default)(_props, ['label', 'icon', 'selected', 'classes', 'className', 'showLabel', 'onChange', 'value']);
var className = (0, _classnames2.default)(classes.root, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.selected, selected), (0, _defineProperty3.default)(_classNames, classes.selectedIconOnly, !showLabelProp && !selected), _classNames), classNameProp);
var icon = null;
if (iconProp) {
if (_react2.default.isValidElement(iconProp) && typeof iconProp !== 'string') {
icon = _react2.default.cloneElement(iconProp, {
className: (0, _classnames2.default)(classes.icon, iconProp.props.className)
});
} else {
icon = _react2.default.createElement(
_Icon2.default,
null,
iconProp
);
}
}
var labelClassName = (0, _classnames2.default)(classes.label, (_classNames2 = {}, (0, _defineProperty3.default)(_classNames2, classes.selectedLabel, selected), (0, _defineProperty3.default)(_classNames2, classes.hiddenLabel, !showLabelProp && !selected), _classNames2));
return _react2.default.createElement(
_ButtonBase2.default,
(0, _extends3.default)({ className: className, focusRipple: true }, other, { onClick: this.handleChange }),
_react2.default.createElement(
'span',
{ className: classes.wrapper },
icon,
_react2.default.createElement(
'span',
{ className: labelClassName },
label
)
)
);
}
}]);
return BottomNavigationButton;
}(_react2.default.Component);
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiBottomNavigationButton' })(BottomNavigationButton);

View File

@@ -0,0 +1,165 @@
// @flow
// @inheritedComponent ButtonBase
import React from 'react';
import type { Node, Element } from 'react';
import classNames from 'classnames';
import withStyles from '../styles/withStyles';
import ButtonBase from '../ButtonBase';
import Icon from '../Icon';
export const styles = (theme: Object) => ({
root: {
transition: theme.transitions.create(['color', 'padding-top'], {
duration: theme.transitions.duration.short,
}),
paddingTop: 8,
paddingBottom: 10,
paddingLeft: 12,
paddingRight: 12,
minWidth: 80,
maxWidth: 168,
color: theme.palette.text.secondary,
flex: '1',
},
selected: {
paddingTop: 6,
color: theme.palette.primary[500],
},
selectedIconOnly: {
paddingTop: theme.spacing.unit * 2,
},
wrapper: {
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
width: '100%',
flexDirection: 'column',
},
label: {
fontFamily: theme.typography.fontFamily,
fontSize: theme.typography.pxToRem(theme.typography.fontSize - 2),
opacity: 1,
transition: 'font-size 0.2s, opacity 0.2s',
transitionDelay: '0.1s',
},
selectedLabel: {
fontSize: theme.typography.pxToRem(theme.typography.fontSize),
},
hiddenLabel: {
opacity: 0,
transitionDelay: '0s',
},
icon: {
display: 'block',
margin: 'auto',
},
});
type ProvidedProps = {
classes: Object,
};
export type Props = {
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
/**
* @ignore
*/
className?: string,
/**
* The icon element. If a string is provided, it will be used as a font ligature.
*/
icon?: string | Element<any>,
/**
* The label element.
*/
label?: Node,
/**
* @ignore
*/
onChange?: Function,
/**
* @ignore
*/
onClick?: Function,
/**
* @ignore
*/
selected?: boolean,
/**
* If `true`, the BottomNavigationButton will show its label.
*/
showLabel?: boolean,
/**
* You can provide your own value. Otherwise, we fallback to the child position index.
*/
value?: any,
};
class BottomNavigationButton extends React.Component<ProvidedProps & Props> {
handleChange = event => {
const { onChange, value, onClick } = this.props;
if (onChange) {
onChange(event, value);
}
if (onClick) {
onClick(event);
}
};
render() {
const {
label,
icon: iconProp,
selected,
classes,
className: classNameProp,
showLabel: showLabelProp,
onChange,
value,
...other
} = this.props;
const className = classNames(
classes.root,
{
[classes.selected]: selected,
[classes.selectedIconOnly]: !showLabelProp && !selected,
},
classNameProp,
);
let icon = null;
if (iconProp) {
if (React.isValidElement(iconProp) && typeof iconProp !== 'string') {
icon = React.cloneElement(iconProp, {
className: classNames(classes.icon, iconProp.props.className),
});
} else {
icon = <Icon>{iconProp}</Icon>;
}
}
const labelClassName = classNames(classes.label, {
[classes.selectedLabel]: selected,
[classes.hiddenLabel]: !showLabelProp && !selected,
});
return (
<ButtonBase className={className} focusRipple {...other} onClick={this.handleChange}>
<span className={classes.wrapper}>
{icon}
<span className={labelClassName}>{label}</span>
</span>
</ButtonBase>
);
}
}
export default withStyles(styles, { name: 'MuiBottomNavigationButton' })(BottomNavigationButton);

View File

@@ -0,0 +1,4 @@
export { default } from './BottomNavigation';
export * from './BottomNavigation';
export { default as BottomNavigationButton } from './BottomNavigationButton';
export * from './BottomNavigationButton';

View File

@@ -0,0 +1,25 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _BottomNavigation = require('./BottomNavigation');
Object.defineProperty(exports, 'default', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_BottomNavigation).default;
}
});
var _BottomNavigationButton = require('./BottomNavigationButton');
Object.defineProperty(exports, 'BottomNavigationButton', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_BottomNavigationButton).default;
}
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

View File

@@ -0,0 +1,4 @@
// @flow
export { default } from './BottomNavigation';
export { default as BottomNavigationButton } from './BottomNavigationButton';