Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 

139 строки
4.0 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _simpleAssign = require('simple-assign');
  6. var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
  7. var _react = require('react');
  8. var _react2 = _interopRequireDefault(_react);
  9. var _propTypes = require('prop-types');
  10. var _propTypes2 = _interopRequireDefault(_propTypes);
  11. var _transitions = require('../styles/transitions');
  12. var _transitions2 = _interopRequireDefault(_transitions);
  13. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  14. var propTypes = {
  15. /**
  16. * True if the parent `TextField` is disabled.
  17. */
  18. disabled: _propTypes2.default.bool,
  19. /**
  20. * Override the inline-styles of the underline when parent `TextField` is disabled.
  21. */
  22. disabledStyle: _propTypes2.default.object,
  23. /**
  24. * True if the parent `TextField` has an error.
  25. */
  26. error: _propTypes2.default.bool,
  27. /**
  28. * Override the inline-styles of the underline when parent `TextField` has an error.
  29. */
  30. errorStyle: _propTypes2.default.object,
  31. /**
  32. * True if the parent `TextField` is focused.
  33. */
  34. focus: _propTypes2.default.bool,
  35. /**
  36. * Override the inline-styles of the underline when parent `TextField` is focused.
  37. */
  38. focusStyle: _propTypes2.default.object,
  39. /**
  40. * @ignore
  41. * The material-ui theme applied to this component.
  42. */
  43. muiTheme: _propTypes2.default.object.isRequired,
  44. /**
  45. * Override the inline-styles of the root element.
  46. */
  47. style: _propTypes2.default.object
  48. };
  49. var defaultProps = {
  50. disabled: false,
  51. disabledStyle: {},
  52. error: false,
  53. errorStyle: {},
  54. focus: false,
  55. focusStyle: {},
  56. style: {}
  57. };
  58. var TextFieldUnderline = function TextFieldUnderline(props) {
  59. var disabled = props.disabled,
  60. disabledStyle = props.disabledStyle,
  61. error = props.error,
  62. errorStyle = props.errorStyle,
  63. focus = props.focus,
  64. focusStyle = props.focusStyle,
  65. muiTheme = props.muiTheme,
  66. style = props.style;
  67. var errorStyleColor = errorStyle.color;
  68. var prepareStyles = muiTheme.prepareStyles,
  69. _muiTheme$textField = muiTheme.textField,
  70. borderColor = _muiTheme$textField.borderColor,
  71. disabledTextColor = _muiTheme$textField.disabledTextColor,
  72. errorColor = _muiTheme$textField.errorColor,
  73. focusColor = _muiTheme$textField.focusColor;
  74. var styles = {
  75. root: {
  76. borderTop: 'none',
  77. borderLeft: 'none',
  78. borderRight: 'none',
  79. borderBottomStyle: 'solid',
  80. borderBottomWidth: 1,
  81. borderColor: borderColor,
  82. bottom: 8,
  83. boxSizing: 'content-box',
  84. margin: 0,
  85. position: 'absolute',
  86. width: '100%'
  87. },
  88. disabled: {
  89. borderBottomStyle: 'dotted',
  90. borderBottomWidth: 2,
  91. borderColor: disabledTextColor
  92. },
  93. focus: {
  94. borderBottomStyle: 'solid',
  95. borderBottomWidth: 2,
  96. borderColor: focusColor,
  97. transform: 'scaleX(0)',
  98. transition: _transitions2.default.easeOut()
  99. },
  100. error: {
  101. borderColor: errorStyleColor ? errorStyleColor : errorColor,
  102. transform: 'scaleX(1)'
  103. }
  104. };
  105. var underline = (0, _simpleAssign2.default)({}, styles.root, style);
  106. var focusedUnderline = (0, _simpleAssign2.default)({}, underline, styles.focus, focusStyle);
  107. if (disabled) underline = (0, _simpleAssign2.default)({}, underline, styles.disabled, disabledStyle);
  108. if (focus) focusedUnderline = (0, _simpleAssign2.default)({}, focusedUnderline, { transform: 'scaleX(1)' });
  109. if (error) focusedUnderline = (0, _simpleAssign2.default)({}, focusedUnderline, styles.error);
  110. return _react2.default.createElement(
  111. 'div',
  112. null,
  113. _react2.default.createElement('hr', { 'aria-hidden': 'true', style: prepareStyles(underline) }),
  114. _react2.default.createElement('hr', { 'aria-hidden': 'true', style: prepareStyles(focusedUnderline) })
  115. );
  116. };
  117. TextFieldUnderline.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
  118. TextFieldUnderline.defaultProps = defaultProps;
  119. exports.default = TextFieldUnderline;