@planningcenter/tapestry-react 3.0.0 → 4.0.0-rc.2

package/dist/cjs/Input/InputBox.js

@@ -1,352 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _tabbable = require("tabbable");
-
-var _Box = _interopRequireDefault(require("../Box"));
-
-var _Button = _interopRequireDefault(require("../Button"));
-
-var _system = require("../system");
-
-var _hooks = require("../hooks");
-
-var _Spinner = _interopRequireDefault(require("../Spinner"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-var _InputContext = _interopRequireDefault(require("./InputContext"));
-
-var _utils = require("./utils");
-
-var _designTokens = require("../designTokens");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-// temporary until InputBox is converted to a functional component
-function DocumentEscape(_ref) {
-  var onEscape = _ref.onEscape;
-  (0, _hooks.useDocumentEvent)('keydown', function (event) {
-    if (event.keyCode === 27) {
-      onEscape();
-    }
-  });
-  return null;
-}
-
-var InputBox = /*#__PURE__*/function (_Component) {
-  (0, _inheritsLoose2["default"])(InputBox, _Component);
-
-  function InputBox(props) {
-    var _this;
-
-    _this = _Component.call(this, props) || this;
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setNode", function (node) {
-      _this.node = node;
-
-      if (_this.props.innerRef) {
-        _this.props.innerRef(node);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getBoxStyles", function () {
-      // allow child components (InputField) to access parent size info
-      return (0, _system.getBoxSize)(_this.props.size);
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "focus", function (index) {
-      if (index === void 0) {
-        index = _this.props.focusChildIndex;
-      }
-
-      var node = _this.node;
-
-      if (node && index !== undefined) {
-        var tabbableChildren = (0, _tabbable.tabbable)(node);
-
-        if (tabbableChildren.length > 0) {
-          node = tabbableChildren[index];
-        }
-      }
-
-      if (node && node.focus) {
-        node.focus();
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "blur", function () {
-      if ((0, _utils.isTabbable)(_this.node)) {
-        _this.node.blur();
-      } else {
-        _this.setState({
-          isFocused: false
-        });
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleFocus", function (e) {
-      // only call focus method if focus was obtained by this element and not
-      // an inner element that can obtain focus
-      if (_this.props.focusChildrenOnFocus && e.target === _this.node) {
-        _this.focus();
-      }
-
-      if (_this.props.onFocus) {
-        _this.props.onFocus(e);
-      }
-
-      _this.setState({
-        isFocused: true
-      });
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBlur", function (e) {
-      if (_this.props.onBlur) {
-        _this.props.onBlur(e);
-      }
-
-      _this.setState({
-        isFocused: false
-      });
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClear", function (e) {
-      if (_this.props.onClear) {
-        _this.props.onClear(e);
-      }
-
-      _this.focus();
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseOver", function (e) {
-      if (_this.props.onMouseOver) {
-        _this.props.onMouseOver(e);
-      }
-
-      _this.setState({
-        isHovered: true
-      });
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseOut", function (e) {
-      if (_this.props.onMouseOut) {
-        _this.props.onMouseOut(e);
-      }
-
-      _this.setState({
-        isHovered: false
-      });
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDocumentEscape", function () {
-      _this.props.onClear();
-    });
-
-    if (props.id) {
-      _utils.inputs[props.id] = (0, _assertThisInitialized2["default"])(_this);
-    }
-
-    _this.state = {
-      isFocused: false,
-      isHovered: false
-    };
-    return _this;
-  }
-
-  var _proto = InputBox.prototype;
-
-  _proto.componentWillUnmount = function componentWillUnmount() {
-    if (this.props.id) {
-      delete _utils.inputs[this.props.id];
-    }
-  };
-
-  _proto.render = function render() {
-    var _this$props = this.props,
-        _this$props$backgroun = _this$props.backgroundColor,
-        backgroundColor = _this$props$backgroun === void 0 ? 'surface' : _this$props$backgroun,
-        children = _this$props.children,
-        disabled = _this$props.disabled,
-        evenPadding = _this$props.evenPadding,
-        focusChildIndex = _this$props.focusChildIndex,
-        focusChildrenOnFocus = _this$props.focusChildrenOnFocus,
-        id = _this$props.id,
-        innerRef = _this$props.innerRef,
-        includeSpacing = _this$props.includeSpacing,
-        isLoading = _this$props.isLoading,
-        naked = _this$props.naked,
-        onClear = _this$props.onClear,
-        onBlur = _this$props.onBlur,
-        onFocus = _this$props.onFocus,
-        renderLeft = _this$props.renderLeft,
-        renderRight = _this$props.renderRight,
-        _this$props$secondary = _this$props.secondaryStroke,
-        secondaryStroke = _this$props$secondary === void 0 ? true : _this$props$secondary,
-        size = _this$props.size,
-        state = _this$props.state,
-        subdued = _this$props.subdued,
-        _this$props$tabIndex = _this$props.tabIndex,
-        tabIndex = _this$props$tabIndex === void 0 ? -1 : _this$props$tabIndex,
-        restProps = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["backgroundColor", "children", "disabled", "evenPadding", "focusChildIndex", "focusChildrenOnFocus", "id", "innerRef", "includeSpacing", "isLoading", "naked", "onClear", "onBlur", "onFocus", "renderLeft", "renderRight", "secondaryStroke", "size", "state", "subdued", "tabIndex"]);
-    var _this$state = this.state,
-        isFocused = _this$state.isFocused,
-        isHovered = _this$state.isHovered;
-
-    var _this$getBoxStyles = this.getBoxStyles(),
-        boxSize = _this$getBoxStyles.boxSize,
-        fontSize = _this$getBoxStyles.fontSize,
-        lineHeight = _this$getBoxStyles.lineHeight,
-        paddingHorizontal = _this$getBoxStyles.paddingHorizontal,
-        paddingVertical = _this$getBoxStyles.paddingVertical;
-
-    var dynamicProps = {
-      backgroundColor: backgroundColor,
-      paddingVertical: paddingVertical,
-      fontSize: fontSize,
-      lineHeight: lineHeight,
-      tabIndex: tabIndex,
-      zIndex: isFocused || isHovered ? 2 : 1
-    };
-    var renderSideProps = {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      width: boxSize,
-      height: '100%',
-      position: 'absolute',
-      top: 0
-    };
-    var spacingLeft = renderLeft ? boxSize : paddingHorizontal;
-    var spacingRight = renderRight ? boxSize : paddingHorizontal;
-
-    if (restProps.radius === 'pill') {
-      dynamicProps.paddingLeft = spacingLeft;
-      dynamicProps.paddingRight = spacingRight;
-    } else if (restProps.radius === 'pill-left') {
-      dynamicProps.paddingLeft = spacingLeft;
-      dynamicProps.paddingRight = spacingRight;
-    } else if (restProps.radius === 'pill-right') {
-      dynamicProps.paddingLeft = spacingLeft;
-      dynamicProps.paddingRight = spacingRight;
-    } else {
-      dynamicProps.paddingLeft = spacingLeft;
-      dynamicProps.paddingRight = spacingRight;
-    }
-
-    if (isLoading || onClear) {
-      dynamicProps.paddingRight = boxSize;
-    }
-
-    if (subdued) {
-      dynamicProps.backgroundColor = !disabled && isFocused ? 'highlightSecondary' : !disabled && isHovered ? state ? state + "-1" : 'highlight' : state ? state + "-0" : 'surfaceTertiary';
-    } else if (!naked) {
-      if (secondaryStroke) {
-        dynamicProps.boxShadow = !disabled && isFocused ? '0px 0px 0px 2px var(--colors-separator-focus-secondary)' : undefined;
-      }
-
-      dynamicProps.strokeAlign = 'inside';
-      dynamicProps.strokeWeight = 1;
-      dynamicProps.stroke = !disabled && isFocused ? state || 'separatorFocus' : state || (!disabled && isHovered ? 'separatorHover' : 'separatorSecondary');
-    }
-
-    if (id) {
-      dynamicProps['aria-labelledby'] = id + "-label";
-    }
-
-    if (evenPadding) {
-      dynamicProps.paddingLeft = dynamicProps.paddingVertical;
-      dynamicProps.paddingRight = dynamicProps.paddingVertical;
-    }
-
-    if (includeSpacing) {
-      dynamicProps.spacing = evenPadding ? dynamicProps.paddingVertical : paddingHorizontal;
-    }
-
-    if (disabled) {
-      restProps.cursor = 'not-allowed';
-      restProps.tabIndex = undefined;
-      restProps.opacity = 0.64;
-    } else if (!naked) {
-      if (isHovered && restProps.hover) {
-        Object.assign(restProps, restProps.hover);
-      }
-
-      if (isFocused && restProps.focus) {
-        Object.assign(restProps, restProps.focus);
-      }
-
-      restProps = _objectSpread(_objectSpread({}, restProps), {}, {
-        hover: _objectSpread({
-          strokeAlign: 'inside',
-          strokeWeight: 1
-        }, restProps.hover),
-        focus: _objectSpread({
-          strokeAlign: 'inside',
-          strokeWeight: 1
-        }, restProps.focus)
-      });
-    }
-
-    return /*#__PURE__*/_react["default"].createElement(_InputContext["default"].Provider, {
-      value: this
-    }, /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-      innerRef: this.setNode,
-      id: id,
-      axis: _StackView["default"].HORIZONTAL,
-      alignment: _StackView["default"].CENTER,
-      shrink: 0,
-      minHeight: boxSize,
-      radius: _designTokens.designTokens.input.borderRadius,
-      position: "relative",
-      cursor: "text",
-      outline: 0,
-      onFocus: this.handleFocus,
-      onBlur: this.handleBlur,
-      onMouseOver: this.handleMouseOver,
-      onMouseOut: this.handleMouseOut,
-      children: children
-    }, dynamicProps, restProps), renderLeft && /*#__PURE__*/_react["default"].createElement(_Box["default"], (0, _extends2["default"])({}, renderSideProps, {
-      left: 0
-    }), typeof renderLeft === 'function' ? renderLeft(size) : /*#__PURE__*/(0, _react.cloneElement)(renderLeft, {
-      size: renderLeft.props && renderLeft.props.size || size
-    })), children, (isLoading || onClear || renderRight) && /*#__PURE__*/_react["default"].createElement(_Box["default"], (0, _extends2["default"])({}, renderSideProps, {
-      right: 0
-    }), isLoading ? /*#__PURE__*/_react["default"].createElement(_Spinner["default"], {
-      size: size
-    }) : onClear ? /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      icon: {
-        name: 'general.x'
-      },
-      title: "clear input value",
-      size: size,
-      theme: false,
-      onClick: this.handleClear
-    }) : typeof renderRight === 'function' ? renderRight(size) : /*#__PURE__*/(0, _react.cloneElement)(renderRight, {
-      size: renderRight.props && renderRight.props.size || size
-    })), onClear && /*#__PURE__*/_react["default"].createElement(DocumentEscape, {
-      onEscape: this.handleDocumentEscape
-    })));
-  };
-
-  return InputBox;
-}(_react.Component);
-
-(0, _defineProperty2["default"])(InputBox, "defaultProps", {
-  focusChildrenOnFocus: true,
-  focusChildIndex: 0,
-  size: 'md'
-});
-InputBox.displayName = 'Input.InputBox';
-var _default = InputBox;
-exports["default"] = _default;

package/dist/cjs/Input/InputContext.js

@@ -1,10 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _react = require("react");
-
-var InputContext = /*#__PURE__*/(0, _react.createContext)();
-var _default = InputContext;
-exports["default"] = _default;

package/dist/cjs/Input/InputField.js

@@ -1,290 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _Box = _interopRequireDefault(require("../Box"));
-
-var _system = require("../system");
-
-var _utils = require("../utils");
-
-var _InputContext = _interopRequireDefault(require("./InputContext"));
-
-var _utils2 = require("./utils");
-
-var resetStyles = {
-  appearance: 'none',
-  outline: 0,
-  boxShadow: 'none',
-  MozAppearance: 'textfield',
-  '::-ms-clear': {
-    display: 'none'
-  },
-  '::-webkit-clear-button': {
-    display: 'none'
-  },
-  '::-webkit-inner-spin-button, ::-webkit-outer-spin-button': {
-    display: 'none'
-  },
-  '::-webkit-search-cancel-button': {
-    display: 'none'
-  }
-};
-
-var InputField = /*#__PURE__*/function (_Component) {
-  (0, _inheritsLoose2["default"])(InputField, _Component);
-
-  function InputField(props) {
-    var _this;
-
-    _this = _Component.call(this, props) || this;
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setNode", function (node) {
-      _this.node = node;
-
-      if (_this.props.innerRef) {
-        _this.props.innerRef(node);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getAutoWidthValue", function (defaultValue) {
-      return _this.props.autoWidth === true ? _this.props.value !== null && _this.props.value !== undefined ? _this.props.value : defaultValue : _this.props.autoWidth;
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "preventFocus", function (event) {
-      if (_this.props.highlightOnInteraction && event.target === document.activeElement) {
-        event.preventDefault();
-        (0, _utils.selectFullTextRange)(event.target);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleChange", function (event) {
-      if (_this.props.autoWidth !== undefined) {
-        if (_this.props.autoWidth === true) {
-          _this.setWidth(event.target.value);
-        } else {
-          _this.shouldUpdateWidth = true;
-        }
-      }
-
-      if (_this.props.onChange) {
-        _this.props.onChange(event);
-      }
-
-      _this.canHighlight = true;
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function (event) {
-      _this.canHighlight = true;
-
-      if (_this.props.onKeyDown) {
-        _this.props.onKeyDown(event);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleFocus", function (event) {
-      if (_this.props.highlightOnInteraction) {
-        (0, _utils.selectFullTextRange)(event.target);
-      }
-
-      if (_this.inputBox) {
-        _this.inputBox.setState({
-          isFocused: true
-        });
-      }
-
-      if (_this.props.onFocus) {
-        _this.props.onFocus(event);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBlur", function (event) {
-      _this.canHighlight = false;
-
-      if (_this.props.highlightOnInteraction) {
-        (0, _utils.deselectCurrentTextRange)();
-      }
-
-      if (_this.inputBox) {
-        _this.inputBox.setState({
-          isFocused: false
-        });
-      }
-
-      if (_this.props.autoWidth !== undefined && _this.props.placeholder !== undefined && event.target.value === '') {
-        _this.setWidth(_this.props.placeholder);
-      }
-
-      if (_this.props.onBlur) {
-        _this.props.onBlur(event);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "focus", function () {
-      _this.node.focus();
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "blur", function () {
-      _this.node.blur();
-    });
-    _this.state = {
-      isHovered: false
-    };
-    _this.shouldUpdateWidth = false;
-
-    if (props.id) {
-      _utils2.inputs[props.id] = (0, _assertThisInitialized2["default"])(_this);
-    }
-
-    return _this;
-  }
-
-  var _proto = InputField.prototype;
-
-  _proto.componentDidMount = function componentDidMount() {
-    if (this.props.autoWidth !== undefined) {
-      var autoWidthValue = this.getAutoWidthValue(this.props.defaultValue !== undefined ? this.props.defaultValue : this.props.placeholder);
-
-      if (autoWidthValue !== undefined) {
-        this.setWidth(autoWidthValue);
-      }
-    }
-  };
-
-  _proto.componentDidUpdate = function componentDidUpdate(lastProps) {
-    if (this.shouldUpdateWidth || this.props.autoWidth !== undefined && this.props.value !== undefined && this.props.value !== lastProps.value) {
-      this.setWidth(this.getAutoWidthValue(this.props.placeholder));
-      this.shouldUpdateWidth = false;
-    }
-
-    if (this.canHighlight && this.props.highlightOnInteraction) {
-      (0, _utils.selectFullTextRange)(this.node);
-      this.canHighlight = false;
-    }
-  };
-
-  _proto.componentWillUnmount = function componentWillUnmount() {
-    if (this.props.id) {
-      delete _utils2.inputs[this.props.id];
-    }
-  };
-
-  _proto.setWidth = function setWidth(text) {
-    var autoWidthType = this.props.autoWidthType;
-    var textWidth = (0, _utils.getTextWidth)(text, this.node);
-
-    if (textWidth !== this._lastTextWidth) {
-      var cursorWidth = 1;
-
-      var _getComputedStyle = getComputedStyle(this.node),
-          borderLeftWidth = _getComputedStyle.borderLeftWidth,
-          borderRightWidth = _getComputedStyle.borderRightWidth,
-          paddingLeft = _getComputedStyle.paddingLeft,
-          paddingRight = _getComputedStyle.paddingRight;
-
-      var totalWidth = [borderLeftWidth, borderRightWidth, cursorWidth, paddingLeft, paddingRight, textWidth].reduce(function (total, val) {
-        return total + parseInt(val, 10);
-      }, 0);
-
-      if (autoWidthType === 'width' || autoWidthType === 'both') {
-        this.node.style.width = totalWidth + "px";
-      }
-
-      if (autoWidthType === 'basis' || autoWidthType === 'both') {
-        this.node.style.flexBasis = totalWidth + "px";
-      }
-
-      this._lastTextWidth = textWidth;
-    }
-  };
-
-  _proto.render = function render() {
-    var _this2 = this;
-
-    var _this$props = this.props,
-        autoWidth = _this$props.autoWidth,
-        autoWidthType = _this$props.autoWidthType,
-        css = _this$props.css,
-        disabled = _this$props.disabled,
-        innerRef = _this$props.innerRef,
-        onBlur = _this$props.onBlur,
-        onChange = _this$props.onChange,
-        onFocus = _this$props.onFocus,
-        onKeyDown = _this$props.onKeyDown,
-        onMouseDown = _this$props.onMouseDown,
-        onMouseUp = _this$props.onMouseUp,
-        placeholderColor = _this$props.placeholderColor,
-        highlightOnInteraction = _this$props.highlightOnInteraction,
-        size = _this$props.size,
-        restProps = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["autoWidth", "autoWidthType", "css", "disabled", "innerRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onMouseDown", "onMouseUp", "placeholderColor", "highlightOnInteraction", "size"]);
-    var placeholderColorStyles = {
-      '::placeholder': {
-        color: placeholderColor
-      },
-      '::-webkit-input-placeholder': {
-        color: placeholderColor
-      },
-      ':-moz-placeholder': {
-        color: placeholderColor
-      },
-      ':-ms-input-placeholder': {
-        color: placeholderColor
-      }
-    };
-    return /*#__PURE__*/_react["default"].createElement(_InputContext["default"].Consumer, null, function (inputBox) {
-      var _ref = inputBox ? inputBox.getBoxStyles() : (0, _system.getBoxSize)(size),
-          fontSize = _ref.fontSize,
-          lineHeight = _ref.lineHeight;
-
-      if (!_this2.inputBox) {
-        _this2.inputBox = inputBox;
-      }
-
-      if (_utils2.inputLabels[_this2.props.id]) {
-        restProps['aria-labelledby'] = _this2.props.id + "-label";
-      }
-
-      if (_this2.state.isHovered && restProps.hover) {
-        Object.assign(restProps, restProps.hover);
-      }
-
-      return /*#__PURE__*/_react["default"].createElement(_Box["default"], (0, _extends2["default"])({
-        as: "input",
-        innerRef: _this2.setNode,
-        disabled: disabled,
-        grow: 1,
-        padding: 0,
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap",
-        fontSize: fontSize,
-        lineHeight: lineHeight,
-        minHeight: lineHeight,
-        onFocus: _this2.handleFocus,
-        onBlur: _this2.handleBlur,
-        onChange: _this2.handleChange,
-        onKeyDown: _this2.handleKeyDown,
-        onMouseDown: _this2.preventFocus,
-        onMouseUp: _this2.preventFocus,
-        css: [resetStyles, placeholderColorStyles, css]
-      }, restProps));
-    });
-  };
-
-  return InputField;
-}(_react.Component);
-
-(0, _defineProperty2["default"])(InputField, "defaultProps", {
-  placeholderColor: 'foregroundTertiary',
-  autoWidthType: 'both'
-});
-InputField.displayName = 'Input.InputField';
-var _default = InputField;
-exports["default"] = _default;