text: "use strict";
  Object.defineProperty(exports, "__esModule", { value: true });
  var tslib_1 = require("tslib");
  var React = require("react");
  var Button_1 = require("office-ui-fabric-react/lib/Button");
  var TextField_1 = require("office-ui-fabric-react/lib/TextField");
  var Stack_1 = require("office-ui-fabric-react/lib/Stack");
  /**
   * Custom extension of TextField which only accepts numbers as valid values.
   */
  var NumberTextField = /** @class */ (function (_super) {
      tslib_1.__extends(NumberTextField, _super);
      function NumberTextField(props) {
          var _this = _super.call(this, props) || this;
          _this._textField = React.createRef();
          _this._validateNumber = function (value) {
              return isNaN(Number(value)) ? "The value should be a number, actual is " + value + "." : '';
          };
          _this._onChange = function (ev, value) {
              _this.setState({ value: value });
          };
          _this._restore = function () {
              _this.setState({
                  value: _this.props.initialValue
              }, function () {
                  if (_this._textField && _this._textField.current) {
                      _this._textField.current.focus();
                  }
              });
          };
          _this.state = {
              value: props.initialValue
          };
          return _this;
      }
      NumberTextField.prototype.render = function () {
          return (React.createElement("div", { className: "NumberTextField" },
              React.createElement(TextField_1.TextField, { className: "NumberTextField-textField", label: this.props.label, value: this.state.value, onChange: this._onChange, onGetErrorMessage: this._validateNumber, componentRef: this._textField }),
              React.createElement("div", { className: "NumberTextField-restoreButton" },
                  React.createElement(Button_1.DefaultButton, { onClick: this._restore }, "Restore"))));
      };
      return NumberTextField;
  }(React.Component));
  exports.NumberTextFieldExample = function () {
      return (React.createElement(Stack_1.Stack, { gap: 15, maxWidth: 300 },
          React.createElement(NumberTextField, { label: "Number TextField with valid initial value", initialValue: "100" }),
          React.createElement(NumberTextField, { label: "Number TextField with invalid initial value", initialValue: "Not a number" })));
  };
  //# sourceMappingURL=TextField.Number.Example.js.map