pouncejs/dist/cjs/components/DateRangeInput/DoubleTextInput.js

A collection of UI components from Panther labs

"use strict";

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 _react = _interopRequireDefault(require("react"));

var _Box = _interopRequireDefault(require("../Box"));

var _Flex = _interopRequireDefault(require("../Flex"));

var _helpers = require("../../utils/helpers");

var _Input = require("../utils/Input");

var getIdentifier = function getIdentifier(id, name, label, suffix) {
  if (id) {
    return id + "-" + suffix;
  }

  if (name) {
    return name + "-" + suffix;
  }

  return (0, _helpers.slugify)(label) + "-" + suffix;
};

var DoubleTextInput = /*#__PURE__*/_react.default.forwardRef(function DoubleTextInput(_ref, ref) {
  var labelFrom = _ref.labelFrom,
      labelTo = _ref.labelTo,
      invalid = _ref.invalid,
      required = _ref.required,
      disabled = _ref.disabled,
      id = _ref.id,
      hidden = _ref.hidden,
      name = _ref.name,
      _ref$variant = _ref.variant,
      variant = _ref$variant === void 0 ? 'outline' : _ref$variant,
      from = _ref.from,
      to = _ref.to,
      placeholderFrom = _ref.placeholderFrom,
      placeholderTo = _ref.placeholderTo,
      _ref$onChangeFrom = _ref.onChangeFrom,
      onChangeFrom = _ref$onChangeFrom === void 0 ? _helpers.noop : _ref$onChangeFrom,
      _ref$onChangeTo = _ref.onChangeTo,
      onChangeTo = _ref$onChangeTo === void 0 ? _helpers.noop : _ref$onChangeTo,
      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["labelFrom", "labelTo", "invalid", "required", "disabled", "id", "hidden", "name", "variant", "from", "to", "placeholderFrom", "placeholderTo", "onChangeFrom", "onChangeTo"]);
  var identifierFrom = getIdentifier(id, name, labelFrom, 'from');
  var identifierTo = getIdentifier(id, name, labelTo, 'to');
  return /*#__PURE__*/_react.default.createElement(_Box.default, {
    position: "relative",
    as: "fieldset"
  }, /*#__PURE__*/_react.default.createElement(_Input.InputControl, {
    invalid: invalid,
    disabled: disabled,
    required: required,
    hidden: hidden,
    variant: variant
  }, /*#__PURE__*/_react.default.createElement(_Flex.default, {
    align: "center"
  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
    position: "relative"
  }, /*#__PURE__*/_react.default.createElement(_Input.InputElement, (0, _extends2.default)({
    as: "input",
    type: "text",
    id: identifierFrom,
    name: identifierFrom,
    value: from
  }, rest, {
    placeholder: placeholderFrom,
    onChange: onChangeFrom,
    ref: ref
  })), /*#__PURE__*/_react.default.createElement(_Input.InputLabel, {
    raised: !!from,
    htmlFor: identifierFrom
  }, labelFrom)), /*#__PURE__*/_react.default.createElement(_Box.default, {
    position: "relative"
  }, /*#__PURE__*/_react.default.createElement(_Input.InputElement, (0, _extends2.default)({
    as: "input",
    type: "text",
    id: identifierTo,
    name: identifierTo,
    value: to
  }, rest, {
    placeholder: placeholderTo,
    onChange: onChangeTo,
    ref: ref
  })), /*#__PURE__*/_react.default.createElement(_Input.InputLabel, {
    raised: !!to,
    htmlFor: identifierTo
  }, labelTo)))));
});

var _default = /*#__PURE__*/_react.default.memo(DoubleTextInput);

exports.default = _default;