import * as React from 'react';
import { Calendar, DayOfWeek, defaultDayPickerStrings, DateRangeType } from '@uifabric/date-time';
import { addDays } from '@fluentui/date-time-utilities';
import { mergeStyleSets } from '@uifabric/styling';
var styles = mergeStyleSets({
    wrapper: { height: 360 },
    button: { margin: '17px 10px 0 0' },
    dropdown: { width: 230 },
});
export var CalendarInlineMarkedDaysExample = function () {
    var _a = React.useState(new Date()), selectedDate = _a[0], setSelectedDate = _a[1];
    return (React.createElement("div", { className: styles.wrapper },
        React.createElement("div", null,
            "Selected date(s): ",
            React.createElement("span", null, !selectedDate ? 'Not set' : selectedDate.toLocaleString())),
        React.createElement(Calendar, { dateRangeType: DateRangeType.Day, showGoToToday: true, onSelectDate: setSelectedDate, value: selectedDate, firstDayOfWeek: DayOfWeek.Sunday, strings: defaultDayPickerStrings, calendarDayProps: { getMarkedDays: getMarkedDays } })));
};
function getMarkedDays(startingDate, endingDate) {
    return [addDays(startingDate, 3), addDays(startingDate, 4)];
}
//# sourceMappingURL=Calendar.Inline.MarkedDays.Example.js.map