lucid-ui/lib/components/TimeSelect/TimeSelectInput.js

A UI component library from AppNexus.

import _get from "lodash/get";
import _toString from "lodash/toString";
import React, { useCallback } from 'react';
import { lucidClassNames } from '../../util/style-helpers';
var cx = lucidClassNames.bind('&-TimeSelect');

var TimeSelectInput = function TimeSelectInput(_ref) {
  var className = _ref.className,
      value = _ref.value,
      step = _ref.step,
      name = _ref.name,
      disabled = _ref.disabled,
      onChange = _ref.onChange;
  var cleanedValue = value !== null ? _toString(value).padStart(2, '0') : '00';
  var cleanOnChange = useCallback(function (event) {
    return onChange(_get(event, 'target.value', 0));
  }, [onChange]);
  var isDisabledClass = disabled ? '&-time-disabled' : '';
  return /*#__PURE__*/React.createElement("input", {
    className: cx('&-time', className, isDisabledClass),
    key: "input",
    "aria-label": name,
    autoComplete: "off",
    "data-input": "true",
    disabled: disabled,
    max: 60,
    min: -15,
    name: name,
    onChange: cleanOnChange,
    step: step,
    type: "number",
    value: cleanedValue
  });
};

TimeSelectInput.defaultProps = {
  step: 1
};
export default TimeSelectInput;