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

321 строка
11 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends2 = require('babel-runtime/helpers/extends');
  6. var _extends3 = _interopRequireDefault(_extends2);
  7. var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
  8. var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
  9. var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
  10. var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
  11. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  12. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  13. var _createClass2 = require('babel-runtime/helpers/createClass');
  14. var _createClass3 = _interopRequireDefault(_createClass2);
  15. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  16. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  17. var _inherits2 = require('babel-runtime/helpers/inherits');
  18. var _inherits3 = _interopRequireDefault(_inherits2);
  19. var _simpleAssign = require('simple-assign');
  20. var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
  21. var _react = require('react');
  22. var _react2 = _interopRequireDefault(_react);
  23. var _propTypes = require('prop-types');
  24. var _propTypes2 = _interopRequireDefault(_propTypes);
  25. var _TextField = require('../TextField');
  26. var _TextField2 = _interopRequireDefault(_TextField);
  27. var _DropDownMenu = require('../DropDownMenu');
  28. var _DropDownMenu2 = _interopRequireDefault(_DropDownMenu);
  29. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  30. function getStyles(props) {
  31. return {
  32. label: {
  33. paddingLeft: 0,
  34. top: props.floatingLabelText ? 6 : -4
  35. },
  36. icon: {
  37. right: 0,
  38. top: props.floatingLabelText ? 8 : 0
  39. },
  40. hideDropDownUnderline: {
  41. borderTop: 'none'
  42. },
  43. dropDownMenu: {
  44. display: 'block'
  45. }
  46. };
  47. }
  48. var SelectField = function (_Component) {
  49. (0, _inherits3.default)(SelectField, _Component);
  50. function SelectField() {
  51. (0, _classCallCheck3.default)(this, SelectField);
  52. return (0, _possibleConstructorReturn3.default)(this, (SelectField.__proto__ || (0, _getPrototypeOf2.default)(SelectField)).apply(this, arguments));
  53. }
  54. (0, _createClass3.default)(SelectField, [{
  55. key: 'render',
  56. value: function render() {
  57. var _props = this.props,
  58. autoWidth = _props.autoWidth,
  59. multiple = _props.multiple,
  60. children = _props.children,
  61. style = _props.style,
  62. labelStyle = _props.labelStyle,
  63. iconStyle = _props.iconStyle,
  64. id = _props.id,
  65. underlineDisabledStyle = _props.underlineDisabledStyle,
  66. underlineFocusStyle = _props.underlineFocusStyle,
  67. menuItemStyle = _props.menuItemStyle,
  68. selectedMenuItemStyle = _props.selectedMenuItemStyle,
  69. underlineStyle = _props.underlineStyle,
  70. dropDownMenuProps = _props.dropDownMenuProps,
  71. errorStyle = _props.errorStyle,
  72. disabled = _props.disabled,
  73. floatingLabelFixed = _props.floatingLabelFixed,
  74. floatingLabelText = _props.floatingLabelText,
  75. floatingLabelStyle = _props.floatingLabelStyle,
  76. hintStyle = _props.hintStyle,
  77. hintText = _props.hintText,
  78. fullWidth = _props.fullWidth,
  79. errorText = _props.errorText,
  80. listStyle = _props.listStyle,
  81. maxHeight = _props.maxHeight,
  82. menuStyle = _props.menuStyle,
  83. onFocus = _props.onFocus,
  84. onBlur = _props.onBlur,
  85. onChange = _props.onChange,
  86. selectionRenderer = _props.selectionRenderer,
  87. value = _props.value,
  88. other = (0, _objectWithoutProperties3.default)(_props, ['autoWidth', 'multiple', 'children', 'style', 'labelStyle', 'iconStyle', 'id', 'underlineDisabledStyle', 'underlineFocusStyle', 'menuItemStyle', 'selectedMenuItemStyle', 'underlineStyle', 'dropDownMenuProps', 'errorStyle', 'disabled', 'floatingLabelFixed', 'floatingLabelText', 'floatingLabelStyle', 'hintStyle', 'hintText', 'fullWidth', 'errorText', 'listStyle', 'maxHeight', 'menuStyle', 'onFocus', 'onBlur', 'onChange', 'selectionRenderer', 'value']);
  89. var styles = getStyles(this.props, this.context);
  90. return _react2.default.createElement(
  91. _TextField2.default,
  92. (0, _extends3.default)({}, other, {
  93. style: style,
  94. disabled: disabled,
  95. floatingLabelFixed: floatingLabelFixed,
  96. floatingLabelText: floatingLabelText,
  97. floatingLabelStyle: floatingLabelStyle,
  98. hintStyle: hintStyle,
  99. hintText: !hintText && !floatingLabelText ? ' ' : hintText,
  100. fullWidth: fullWidth,
  101. errorText: errorText,
  102. underlineStyle: underlineStyle,
  103. errorStyle: errorStyle,
  104. onFocus: onFocus,
  105. onBlur: onBlur,
  106. id: id,
  107. underlineDisabledStyle: underlineDisabledStyle,
  108. underlineFocusStyle: underlineFocusStyle
  109. }),
  110. _react2.default.createElement(
  111. _DropDownMenu2.default,
  112. (0, _extends3.default)({
  113. disabled: disabled,
  114. style: (0, _simpleAssign2.default)(styles.dropDownMenu, menuStyle),
  115. labelStyle: (0, _simpleAssign2.default)(styles.label, labelStyle),
  116. iconStyle: (0, _simpleAssign2.default)(styles.icon, iconStyle),
  117. menuItemStyle: menuItemStyle,
  118. selectedMenuItemStyle: selectedMenuItemStyle,
  119. underlineStyle: styles.hideDropDownUnderline,
  120. listStyle: listStyle,
  121. autoWidth: autoWidth,
  122. value: value,
  123. onChange: onChange,
  124. maxHeight: maxHeight,
  125. multiple: multiple,
  126. selectionRenderer: selectionRenderer
  127. }, dropDownMenuProps),
  128. children
  129. )
  130. );
  131. }
  132. }]);
  133. return SelectField;
  134. }(_react.Component);
  135. SelectField.defaultProps = {
  136. autoWidth: false,
  137. disabled: false,
  138. fullWidth: false,
  139. multiple: false
  140. };
  141. SelectField.contextTypes = {
  142. muiTheme: _propTypes2.default.object.isRequired
  143. };
  144. SelectField.propTypes = process.env.NODE_ENV !== "production" ? {
  145. /**
  146. * If true, the width will automatically be set according to the
  147. * items inside the menu.
  148. * To control the width in CSS instead, leave this prop set to `false`.
  149. */
  150. autoWidth: _propTypes2.default.bool,
  151. /**
  152. * The `MenuItem` elements to populate the select field with.
  153. * If the menu items have a `label` prop, that value will
  154. * represent the selected menu item in the rendered select field.
  155. */
  156. children: _propTypes2.default.node,
  157. /**
  158. * If true, the select field will be disabled.
  159. */
  160. disabled: _propTypes2.default.bool,
  161. /**
  162. * Object that can handle and override any property of component DropDownMenu.
  163. */
  164. dropDownMenuProps: _propTypes2.default.object,
  165. /**
  166. * Override the inline-styles of the error element.
  167. */
  168. errorStyle: _propTypes2.default.object,
  169. /**
  170. * The error content to display.
  171. */
  172. errorText: _propTypes2.default.node,
  173. /**
  174. * If true, the floating label will float even when no value is selected.
  175. */
  176. floatingLabelFixed: _propTypes2.default.bool,
  177. /**
  178. * Override the inline-styles of the floating label.
  179. */
  180. floatingLabelStyle: _propTypes2.default.object,
  181. /**
  182. * The content of the floating label.
  183. */
  184. floatingLabelText: _propTypes2.default.node,
  185. /**
  186. * If true, the select field will take up the full width of its container.
  187. */
  188. fullWidth: _propTypes2.default.bool,
  189. /**
  190. * Override the inline-styles of the hint element.
  191. */
  192. hintStyle: _propTypes2.default.object,
  193. /**
  194. * The hint content to display.
  195. */
  196. hintText: _propTypes2.default.node,
  197. /**
  198. * Override the inline-styles of the icon element.
  199. */
  200. iconStyle: _propTypes2.default.object,
  201. /**
  202. * The id prop for the text field.
  203. */
  204. id: _propTypes2.default.string,
  205. /**
  206. * Override the label style when the select field is inactive.
  207. */
  208. labelStyle: _propTypes2.default.object,
  209. /**
  210. * Override the inline-styles of the underlying `List` element.
  211. */
  212. listStyle: _propTypes2.default.object,
  213. /**
  214. * Override the default max-height of the underlying `DropDownMenu` element.
  215. */
  216. maxHeight: _propTypes2.default.number,
  217. /**
  218. * Override the inline-styles of menu items.
  219. */
  220. menuItemStyle: _propTypes2.default.object,
  221. /**
  222. * Override the inline-styles of the underlying `DropDownMenu` element.
  223. */
  224. menuStyle: _propTypes2.default.object,
  225. /**
  226. * If true, `value` must be an array and the menu will support
  227. * multiple selections.
  228. */
  229. multiple: _propTypes2.default.bool,
  230. /** @ignore */
  231. onBlur: _propTypes2.default.func,
  232. /**
  233. * Callback function fired when a menu item is selected.
  234. *
  235. * @param {object} event Click event targeting the menu item
  236. * that was selected.
  237. * @param {number} key The index of the selected menu item, or undefined
  238. * if `multiple` is true.
  239. * @param {any} payload If `multiple` is true, the menu's `value`
  240. * array with either the menu item's `value` added (if
  241. * it wasn't already selected) or omitted (if it was already selected).
  242. * Otherwise, the `value` of the menu item.
  243. */
  244. onChange: _propTypes2.default.func,
  245. /** @ignore */
  246. onFocus: _propTypes2.default.func,
  247. /**
  248. * Override the inline-styles of selected menu items.
  249. */
  250. selectedMenuItemStyle: _propTypes2.default.object,
  251. /**
  252. * Customize the rendering of the selected item.
  253. *
  254. * @param {any} value If `multiple` is true, the menu's `value`
  255. * array with either the menu item's `value` added (if
  256. * it wasn't already selected) or omitted (if it was already selected).
  257. * Otherwise, the `value` of the menu item.
  258. * @param {any} menuItem The selected `MenuItem`.
  259. * If `multiple` is true, this will be an array with the `MenuItem`s matching the `value`s parameter.
  260. */
  261. selectionRenderer: _propTypes2.default.func,
  262. /**
  263. * Override the inline-styles of the root element.
  264. */
  265. style: _propTypes2.default.object,
  266. /**
  267. * Override the inline-styles of the underline element when the select
  268. * field is disabled.
  269. */
  270. underlineDisabledStyle: _propTypes2.default.object,
  271. /**
  272. * Override the inline-styles of the underline element when the select field
  273. * is focused.
  274. */
  275. underlineFocusStyle: _propTypes2.default.object,
  276. /**
  277. * Override the inline-styles of the underline element.
  278. */
  279. underlineStyle: _propTypes2.default.object,
  280. /**
  281. * If `multiple` is true, an array of the `value`s of the selected
  282. * menu items. Otherwise, the `value` of the selected menu item.
  283. * If provided, the menu will be a controlled component.
  284. */
  285. value: _propTypes2.default.any
  286. } : {};
  287. exports.default = SelectField;