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

A UI component library from AppNexus.

import React, { useCallback } from 'react';
import { lucidClassNames } from '../../util/style-helpers';
import SingleSelect from '../SingleSelect/SingleSelect';
import { MeridiemType } from './TimeSelect';
var cx = lucidClassNames.bind('&-TimeSelect');
var Option = SingleSelect.Option;

var TimeSelectMeridiem = function TimeSelectMeridiem(_ref) {
  var hour = _ref.hour,
      meridiem = _ref.meridiem,
      time = _ref.time,
      isDisabled = _ref.isDisabled,
      onChange = _ref.onChange;
  var onMeridiemChange = useCallback(function (selectedIndex) {
    var nextMeridiem = selectedIndex === 0 ? MeridiemType.AM : MeridiemType.PM;

    if (meridiem === nextMeridiem) {
      return;
    }

    var updatedTime = new Date(time);

    if (nextMeridiem === MeridiemType.AM) {
      updatedTime.setHours(hour === 12 ? 0 : hour);
    } else {
      updatedTime.setHours(hour === 12 ? hour : hour + 12);
    }

    onChange(updatedTime);
  }, [time, hour]);
  return /*#__PURE__*/React.createElement(SingleSelect, {
    className: cx('&-meridiem'),
    isSelectionHighlighted: false,
    showIcon: false,
    selectedIndex: MeridiemType.AM === meridiem ? 0 : 1,
    isInvisible: true,
    onSelect: onMeridiemChange,
    isDisabled: isDisabled,
    hasReset: false
  }, /*#__PURE__*/React.createElement(Option, null, MeridiemType.AM), /*#__PURE__*/React.createElement(Option, null, MeridiemType.PM));
};

export default TimeSelectMeridiem;