coreui/lib/components/NumberPickerInput/NumberPickerInput.js

Platform Core UI

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Shared = require('../../Shared');

var _Shared2 = _interopRequireDefault(_Shared);

var _reactWidgets = require('coreui-deps/lib/react-widgets');

var _reactWidgets2 = _interopRequireDefault(_reactWidgets);

var _NumberPickerInput = require('../../theme/components/NumberPickerInput');

var _NumberPickerInput2 = _interopRequireDefault(_NumberPickerInput);

var _dedupe = require('classnames/dedupe');

var _dedupe2 = _interopRequireDefault(_dedupe);

var _mapProps = require('recompose/mapProps');

var _mapProps2 = _interopRequireDefault(_mapProps);

var _ramda = require('ramda');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

var RWNumberPicker = _reactWidgets2.default.NumberPicker;

var systemStyles = {};

var NumberPickerInputContainer = (0, _mapProps2.default)(function (_ref) {
  var className = _ref.className,
      sheet = _ref.sheet,
      style = _ref.style,
      theme = _ref.theme,
      rest = _objectWithoutProperties(_ref, ['className', 'sheet', 'style', 'theme']);

  return _extends({
    className: (0, _dedupe2.default)(sheet.classes.numberPickerInput, theme.classes.numberPickerInput, className),
    style: (0, _ramda.merge)(theme.styles.numberPickerInput, style)
  }, rest);
})(RWNumberPicker);

var StyledNumberPickerInput = _Shared2.default.injectSheet(systemStyles)(NumberPickerInputContainer);

/**
 * Spinner for selecting numbers. The NumberPicker is a _localized_ widget and so *requires* a localizer to be specified.  You can read more about localizers here: [localization](http://jquense.github.io/react-widgets/docs/#/i18n).
 */
var NumberPickerInput = function NumberPickerInput(props) {
  return _react2.default.createElement(
    StyledNumberPickerInput,
    props,
    props.children
  );
};

var classes = _NumberPickerInput2.default.classes;
var options = _NumberPickerInput2.default.options;
var styles = _NumberPickerInput2.default.styles;

NumberPickerInput.defaultProps = {
  theme: { classes: classes, options: options, styles: styles }
};

NumberPickerInput.displayName = 'NumberPickerInput';

NumberPickerInput.propTypes = {
  autoFocus: _react.PropTypes.bool,

  children: _react.PropTypes.node,

  culture: _react.PropTypes.string,

  disabled: _react.PropTypes.oneOfType([_react.PropTypes.array, _react.PropTypes.bool]),
  /**
   * A format string used to display the number value. Localizer dependent, read [localization](i18n) for more info.
   */
  format: _react.PropTypes.string,
  /**
   * mark whether the widget should render right-to-left. This property can also be implicitly passed to the widget through a `childContext` prop (`isRtl`) this allows higher level application components to specify the direction.
   */
  isRtl: _react.PropTypes.bool,
  /**
   * The maximum number that the NumberPickerInput value.
   */
  max: _react.PropTypes.number,
  /**
   * Object hash containing display text and/or text for screen readers. Use the `messages` object to localize widget text and increase accessibility.
   */
  messages: _react.PropTypes.shape({
    /**
     * Number picker spinner up button text for screen readers
     */
    increment: _react.PropTypes.string,
    /**
     * Number picker spinner down button text for screen readers
     */
    decrement: _react.PropTypes.string
  }),
  /**
   * The minimum number that the NumberPickerInput value.
   */
  min: _react.PropTypes.number,

  name: _react.PropTypes.string,
  /**
   * Change event Handler that is called when the value is changed. The handler is called with the current numeric value or null.
   */
  onChange: _react.PropTypes.func,
  /**
   * Determines how the NumberPickerInput parses a number from the localized string representation. You can also provide a parser `Function` to pair with a custom `format`.
   */
  parse: _react.PropTypes.func,

  placeholder: _react.PropTypes.string,
  /**
   * Specify how precise the `value` should be when typing, incrementing, or decrementing the value. When empty, precision is parsed from the current `format` and culture.
   */
  precision: _react.PropTypes.number,

  readOnly: _react.PropTypes.oneOfType([_react.PropTypes.array, _react.PropTypes.bool]),
  /**
   * Amount to increase or decrease value when using the spinner buttons.
   */
  step: _react.PropTypes.number,

  theme: _react.PropTypes.oneOfType([_react.PropTypes.bool, _react.PropTypes.object]),
  /**
   * The current value of the NumberPickerInput.
   */
  value: _react.PropTypes.number
};

_Shared2.default.registerComponent('NumberPickerInput', NumberPickerInput);

exports.default = NumberPickerInput;