UNPKG

@6thquake/react-material

Version:

React components that implement Google's Material Design.

141 lines (114 loc) 4.08 kB
"use strict"; var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard"); var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _react = _interopRequireWildcard(require("react")); var _compose = _interopRequireDefault(require("recompose/compose")); var _propTypes = _interopRequireDefault(require("prop-types")); var _pickers = require("@material-ui/pickers"); var _withStyles = _interopRequireDefault(require("../styles/withStyles")); var _yellow = _interopRequireDefault(require("../colors/yellow")); var _LocaleProvider = require("../LocaleProvider"); /** * @ignore - do not document. */ var style = function style(theme) { return { root: {}, // input: {} label: { color: theme.palette.grey[300], '&$labelForcus': { // color: `${theme.palette.common.white}` color: "".concat(_yellow.default[500]) } }, labelForcus: { color: "".concat(_yellow.default[500], " !important") }, inputText: { color: theme.palette.common.white, '&$disabled': { color: theme.palette.grey[200] } }, underline: { '&:after': { borderBottomColor: _yellow.default[500] }, '&:before': { borderBottomColor: theme.palette.grey[300] } // '&$disabled:before': { // borderBottomColor: theme.palette.grey[200], // }, // '&:hover:not($disabled):not($focused):not($error):before': { // borderBottomColor: 'red', // }, } }; }; var DatePickerWrapper = /*#__PURE__*/ function (_Component) { (0, _inherits2.default)(DatePickerWrapper, _Component); function DatePickerWrapper(props) { var _this; (0, _classCallCheck2.default)(this, DatePickerWrapper); _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(DatePickerWrapper).call(this, props)); _this.state = {}; return _this; } (0, _createClass2.default)(DatePickerWrapper, [{ key: "render", value: function render() { var _this$props = this.props, classes = _this$props.classes, isDark = _this$props.isDark, others = (0, _objectWithoutProperties2.default)(_this$props, ["classes", "isDark"]); var inputProps = isDark ? { InputProps: { classes: { root: classes.inputText, underline: classes.underline } }, InputLabelProps: { classes: { root: classes.label, focused: classes.labelForcus } } } : {}; return _react.default.createElement(_pickers.DatePicker, (0, _extends2.default)({}, inputProps, others)); } }]); return DatePickerWrapper; }(_react.Component); DatePickerWrapper.propTypes = { /** * Override or extend the styles applied to the component. * See [CSS API](#css-api) below for more details. */ classes: _propTypes.default.object.isRequired, /** * background is dark */ isDark: _propTypes.default.bool }; DatePickerWrapper.defaultProps = { isDark: false }; var _default = (0, _compose.default)((0, _LocaleProvider.withLocale)({ name: 'DatePicker' }), (0, _withStyles.default)(style))(DatePickerWrapper); exports.default = _default;