alaska-field-number - npm Package Compare versions

Comparing version 0.3.0 to 0.4.0

lib/view.js

@@ -13,16 +13,6 @@ 'use strict';
 
-var _getMuiTheme = require('material-ui/lib/styles/getMuiTheme');
+var _alaskaAdminView = require('alaska-admin-view');
 
-var _getMuiTheme2 = _interopRequireDefault(_getMuiTheme);
+var _reactBootstrap = require('react-bootstrap');
 
-var _contextPure = require('material-ui/lib/mixins/context-pure');
-
-var _contextPure2 = _interopRequireDefault(_contextPure);
-
-var _textField = require('material-ui/lib/text-field');
-
-var _textField2 = _interopRequireDefault(_textField);
-
-var _alaskaAdminView = require('alaska-admin-view');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -45,3 +35,3 @@
 
-  function NumberFieldView(props, context) {
+  function NumberFieldView(props) {
     _classCallCheck(this, NumberFieldView);
@@ -51,13 +41,38 @@
 
-    _this.handleChange = _this.handleChange.bind(_this);
-    _this.handleFocus = _this.handleFocus.bind(_this);
-    _this.handleBlur = _this.handleBlur.bind(_this);
+    _this.handleChange = function (event) {
+      var display = event.target.value;
+      _this.setState({ display: display });
+    };
+
+    _this.handleFocus = function () {
+      _this.focused = true;
+    };
+
+    _this.handleBlur = function () {
+      _this.focused = false;
+      var field = _this.props.field;
+      var value = _this.state.display;
+      var unfomarted = undefined;
+      if (field.format) {
+        unfomarted = numeral().unformat(value);
+        if (isNaN(unfomarted)) {
+          unfomarted = 0;
+        }
+        _this.setState({ display: numeral(unfomarted).format(field.format) });
+      } else {
+        unfomarted = parseFloat(value) || '';
+        if (unfomarted != value) {
+          _this.setState({ display: unfomarted });
+        }
+      }
+      if (unfomarted !== _this.props.value) {
+        _this.props.onChange && _this.props.onChange(unfomarted);
+      }
+    };
+
     _this.state = {
-      muiTheme: context.muiTheme ? context.muiTheme : (0, _getMuiTheme2.default)(),
-      views: context.views,
-      value: props.value,
       display: props.value
     };
     if (props.field.format) {
-      _this.state.value = _this.state.display = numeral(props.value).format(props.field.format);
+      _this.state.display = numeral(props.value).format(props.field.format);
     }
@@ -68,19 +83,5 @@ return _this;
   _createClass(NumberFieldView, [{
-    key: 'getChildContext',
-    value: function getChildContext() {
-      return {
-        muiTheme: this.state.muiTheme,
-        views: this.context.views
-      };
-    }
-  }, {
     key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps, nextContext) {
+    value: function componentWillReceiveProps(nextProps) {
       var newState = {};
-      if (nextContext.muiTheme) {
-        newState.muiTheme = nextContext.muiTheme;
-      }
-      if (nextContext.views) {
-        newState.views = nextContext.views;
-      }
       if (nextProps.value) {
@@ -107,45 +108,2 @@ newState.value = nextProps.value;
   }, {
-    key: 'handleChange',
-    value: function handleChange(event) {
-      var field = this.props.field;
-      var display = event.target.value;
-      if (field.format && !/^\d*\.?\d*$/.test(display)) {
-        display = numeral().unformat(display);
-        if (isNaN(display)) {
-          display = parseFloat(event.target.display) || '';
-        }
-      }
-      if (field.max !== undefined && display > field.max) {
-        display = field.max;
-      }
-      if (field.min !== undefined && display < field.min) {
-        display = field.min;
-      }
-      if (this.props.onChange) {
-        this.props.onChange(display);
-      }
-    }
-  }, {
-    key: 'handleFocus',
-    value: function handleFocus() {
-      this.focused = true;
-    }
-  }, {
-    key: 'handleBlur',
-    value: function handleBlur() {
-      this.focused = false;
-      var field = this.props.field;
-      var unfomarted = undefined;
-      if (field.format) {
-        var value = numeral(this.props.value).format(field.format);
-        this.setState({ value: value, display: value });
-        unfomarted = numeral().unformat(value);
-      } else {
-        unfomarted = parseFloat(this.props.value) || '';
-      }
-      if (unfomarted !== this.props.value) {
-        this.props.onChange && this.props.onChange(unfomarted);
-      }
-    }
-  }, {
     key: 'render',
@@ -156,26 +114,22 @@ value: function render() {
       var disabled = _props.disabled;
-      var _state = this.state;
-      var muiTheme = _state.muiTheme;
-      var display = _state.display;
+      var errorText = _props.errorText;
+      var display = this.state.display;
 
-      var noteElement = field.note ? _react2.default.createElement(
-        'div',
-        { style: field.fullWidth ? muiTheme.fieldNote : muiTheme.fieldNoteInline },
-        field.note
-      ) : null;
-      return _react2.default.createElement(
-        'div',
-        null,
-        _react2.default.createElement(_textField2.default, {
-          ref: 'input',
-          value: display,
-          fullWidth: field.fullWidth,
-          floatingLabelText: field.label,
-          onChange: this.handleChange,
-          disabled: disabled,
-          onFocus: this.handleFocus,
-          onBlur: this.handleBlur
-        }),
-        noteElement
-      );
+      var help = errorText ? _react2.default.createElement(
+        'span',
+        { className: 'text-danger' },
+        errorText
+      ) : field.note ? field.note : null;
+      return _react2.default.createElement(_reactBootstrap.Input, {
+        type: 'text',
+        value: display,
+        label: field.label,
+        onChange: this.handleChange,
+        disabled: disabled,
+        onFocus: this.handleFocus,
+        onBlur: this.handleBlur,
+        labelClassName: 'col-xs-2',
+        wrapperClassName: 'col-xs-10',
+        help: help
+      });
     }
@@ -190,11 +144,2 @@ }]);
 };
-NumberFieldView.contextTypes = {
-  muiTheme: _react2.default.PropTypes.object,
-  views: _react2.default.PropTypes.object
-};
-NumberFieldView.childContextTypes = {
-  muiTheme: _react2.default.PropTypes.object,
-  views: _react2.default.PropTypes.object
-};
-NumberFieldView.mixins = [_contextPure2.default];
 exports.default = NumberFieldView;

package.json

 {
   "name": "alaska-field-number",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Alaska number field",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

16934

decreased by-9.8%

Lines of code

241

decreased by-18.03%

No dependency changes