lucid-ui
Version:
A UI component library from Xandr.
27 lines • 1.37 kB
JavaScript
import React, { useCallback } from 'react';
import { lucidClassNames } from '../../util/style-helpers';
import SingleSelect from '../SingleSelect/SingleSelect';
import { MeridiemType } from './TimeSelect';
const cx = lucidClassNames.bind('&-TimeSelect');
const { Option } = SingleSelect;
const TimeSelectMeridiem = ({ hour, meridiem, time, isDisabled, onChange, }) => {
const onMeridiemChange = useCallback((selectedIndex) => {
const nextMeridiem = selectedIndex === 0 ? MeridiemType.AM : MeridiemType.PM;
if (meridiem === nextMeridiem) {
return;
}
const 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 (React.createElement(SingleSelect, { className: cx('&-meridiem'), isSelectionHighlighted: false, showIcon: false, selectedIndex: MeridiemType.AM === meridiem ? 0 : 1, isInvisible: true, onSelect: onMeridiemChange, isDisabled: isDisabled, hasReset: false },
React.createElement(Option, null, MeridiemType.AM),
React.createElement(Option, null, MeridiemType.PM)));
};
export default TimeSelectMeridiem;
//# sourceMappingURL=TimeSelectMeridiem.js.map