@platformbuilders/fluid-react/dist/components/DatePicker/index.js

Builders React for Fluid Design System

import { jsx as _jsx } from "react/jsx-runtime";
import { useRef } from 'react';
import TextInput from '../TextInput';
import localeCalendar from './locale_calendar.json';
import { CustomCalendar } from './styles';
const DatePickerComponent = ({ value, onChange, minDate, maxDate, disableMonthPicker, disableYearPicker, workDays, holidays, name, id, inputVariant = 'outlined', disabledInput = false, }) => {
    const datePickerRef = useRef();
    return (_jsx(CustomCalendar, { locale: localeCalendar, ref: datePickerRef, render: (value, openCalendar, onChange) => {
            return (_jsx(TextInput, { name: name, id: id, value: value, onClick: openCalendar, onChange: (e) => (disabledInput ? value : onChange(e)), iconRight: "ChevronDownIcon", onClickIconRight: openCalendar, variant: inputVariant }));
        }, format: "DD/MM/YYYY", headerOrder: ['MONTH_YEAR', 'LEFT_BUTTON', 'RIGHT_BUTTON'], value: value, arrow: false, minDate: minDate, maxDate: maxDate, onChange: onChange, disableMonthPicker: disableMonthPicker, disableYearPicker: disableYearPicker, mapDays: (days) => {
            const isWeekend = [0, 6].includes(days.date.weekDay.index);
            const isDisabled = holidays?.includes(days.date.toDate().toISOString().slice(0, 10));
            if ((isWeekend && workDays) || isDisabled) {
                return {
                    disabled: isWeekend,
                };
            }
            return {
                disabled: false,
            };
        } }));
};
export default DatePickerComponent;