glass-app-manager/target/.yalc/@informatica/droplets-core/src/components/datepicker/CalendarTimePicker.js

Informatica's Glass Framework CLI for bootstrapping

// @flow

import * as React from "react";

import moment from "moment";
import momentLocalizer from "react-widgets-moment";
import { Calendar, DateTimePicker } from "react-widgets";

export type CalendarTimePickerProps = {
    /**
     * Callback to execute after date has been changed.
     */
    onDateChange: (args: any) => void,

    /**
     * Callback to execute after the time has been changed.
     */
    onTimeChange: (args: any) => void,

    /**
     * Optionally specify the locale of the date range picker.
     */
    locale: string,

    /**
     * Restrict the minimum time allowed as a Date object.
     */
    min?: Date,

    /**
     * Restrict the maximum time allowed as a Date object.
     */
    max?: Date,

    /**
     * Additional className values to pass to the component.
     */
    className?: string,

    /**
     * The value to show for the calendar or time component.
     */
    value: Date,

    /**
     * Additional props to pass to the `calendar` or `time` component.
     */
    rwProps?: {},
};

/**
 * A small, pure function component to render the calendar + time picker combo.
 * @param {CalendarTimePickerProps} props
 */
export default function CalendarTimePicker(props: CalendarTimePickerProps) {
    const { locale, min, max, value, onDateChange, onTimeChange, rwProps } = props;

    moment.locale(locale);
    momentLocalizer();

    return (
        <>
            <Calendar culture={locale} value={value} onChange={onDateChange} min={min} max={max} {...rwProps} />
            <DateTimePicker
                culture={locale}
                value={value}
                date={false}
                className="date-range-picker__time"
                onChange={onTimeChange}
                min={min}
                max={max}
                {...rwProps}
            />
        </>
    );
}