first commit

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.base.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { ICalendarDayProps } from './CalendarDay.types';
+export declare const CalendarDayBase: React.FunctionComponent<ICalendarDayProps>;

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.base.js

@@ -0,0 +1,82 @@
+define(["require", "exports", "tslib", "react", "@fluentui/utilities", "../../../Icon", "@fluentui/date-time-utilities", "../../CalendarDayGrid/CalendarDayGrid", "@fluentui/react-hooks"], function (require, exports, tslib_1, React, utilities_1, Icon_1, date_time_utilities_1, CalendarDayGrid_1, react_hooks_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.CalendarDayBase = void 0;
+    var getClassNames = (0, utilities_1.classNamesFunction)();
+    var CalendarDayBase = function (props) {
+        var dayGrid = React.useRef(null);
+        React.useImperativeHandle(props.componentRef, function () { return ({
+            focus: function () {
+                var _a, _b;
+                (_b = (_a = dayGrid.current) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.call(_a);
+            },
+        }); }, []);
+        var strings = props.strings, navigatedDate = props.navigatedDate, dateTimeFormatter = props.dateTimeFormatter, styles = props.styles, theme = props.theme, className = props.className, onHeaderSelect = props.onHeaderSelect, showSixWeeksByDefault = props.showSixWeeksByDefault, minDate = props.minDate, maxDate = props.maxDate, restrictedDates = props.restrictedDates, onNavigateDate = props.onNavigateDate, showWeekNumbers = props.showWeekNumbers, dateRangeType = props.dateRangeType, animationDirection = props.animationDirection;
+        var monthAndYearId = (0, react_hooks_1.useId)();
+        var classNames = getClassNames(styles, {
+            theme: theme,
+            className: className,
+            headerIsClickable: !!onHeaderSelect,
+            showWeekNumbers: showWeekNumbers,
+            animationDirection: animationDirection,
+        });
+        var monthAndYear = dateTimeFormatter.formatMonthYear(navigatedDate, strings);
+        var HeaderButtonComponentType = onHeaderSelect ? 'button' : 'div';
+        var headerAriaLabel = strings.yearPickerHeaderAriaLabel
+            ? (0, utilities_1.format)(strings.yearPickerHeaderAriaLabel, monthAndYear)
+            : monthAndYear;
+        return (React.createElement("div", { className: classNames.root },
+            React.createElement("div", { className: classNames.header },
+                React.createElement(HeaderButtonComponentType, { "aria-label": onHeaderSelect ? headerAriaLabel : undefined, className: classNames.monthAndYear, onClick: onHeaderSelect, "data-is-focusable": !!onHeaderSelect, tabIndex: onHeaderSelect ? 0 : -1, onKeyDown: onButtonKeyDown(onHeaderSelect), type: "button" },
+                    React.createElement("span", { id: monthAndYearId, "aria-live": "polite", "aria-atomic": "true" }, monthAndYear)),
+                React.createElement(CalendarDayNavigationButtons, tslib_1.__assign({}, props, { classNames: classNames }))),
+            React.createElement(CalendarDayGrid_1.CalendarDayGrid, tslib_1.__assign({}, props, { styles: styles, componentRef: dayGrid, strings: strings, navigatedDate: navigatedDate, weeksToShow: showSixWeeksByDefault ? 6 : undefined, dateTimeFormatter: dateTimeFormatter, minDate: minDate, maxDate: maxDate, restrictedDates: restrictedDates, onNavigateDate: onNavigateDate, labelledBy: monthAndYearId, dateRangeType: dateRangeType }))));
+    };
+    exports.CalendarDayBase = CalendarDayBase;
+    exports.CalendarDayBase.displayName = 'CalendarDayBase';
+    var CalendarDayNavigationButtons = function (props) {
+        var _a, _b;
+        var minDate = props.minDate, maxDate = props.maxDate, navigatedDate = props.navigatedDate, allFocusable = props.allFocusable, strings = props.strings, navigationIcons = props.navigationIcons, showCloseButton = props.showCloseButton, classNames = props.classNames, onNavigateDate = props.onNavigateDate, onDismiss = props.onDismiss;
+        var onSelectNextMonth = function () {
+            onNavigateDate((0, date_time_utilities_1.addMonths)(navigatedDate, 1), false);
+        };
+        var onSelectPrevMonth = function () {
+            onNavigateDate((0, date_time_utilities_1.addMonths)(navigatedDate, -1), false);
+        };
+        var leftNavigationIcon = navigationIcons.leftNavigation;
+        var rightNavigationIcon = navigationIcons.rightNavigation;
+        var closeNavigationIcon = navigationIcons.closeIcon;
+        // determine if previous/next months are in bounds
+        var prevMonthInBounds = minDate ? (0, date_time_utilities_1.compareDatePart)(minDate, (0, date_time_utilities_1.getMonthStart)(navigatedDate)) < 0 : true;
+        var nextMonthInBounds = maxDate ? (0, date_time_utilities_1.compareDatePart)((0, date_time_utilities_1.getMonthEnd)(navigatedDate), maxDate) < 0 : true;
+        // use aria-disabled instead of disabled so focus is not lost
+        // when a prev/next button becomes disabled after being clicked
+        return (React.createElement("div", { className: classNames.monthComponents },
+            React.createElement("button", { className: (0, utilities_1.css)(classNames.headerIconButton, (_a = {},
+                    _a[classNames.disabledStyle] = !prevMonthInBounds,
+                    _a)), tabIndex: prevMonthInBounds ? undefined : allFocusable ? 0 : -1, "aria-disabled": !prevMonthInBounds, onClick: prevMonthInBounds ? onSelectPrevMonth : undefined, onKeyDown: prevMonthInBounds ? onButtonKeyDown(onSelectPrevMonth) : undefined, title: strings.prevMonthAriaLabel
+                    ? strings.prevMonthAriaLabel + ' ' + strings.months[(0, date_time_utilities_1.addMonths)(navigatedDate, -1).getMonth()]
+                    : undefined, type: "button" },
+                React.createElement(Icon_1.Icon, { iconName: leftNavigationIcon })),
+            React.createElement("button", { className: (0, utilities_1.css)(classNames.headerIconButton, (_b = {},
+                    _b[classNames.disabledStyle] = !nextMonthInBounds,
+                    _b)), tabIndex: nextMonthInBounds ? undefined : allFocusable ? 0 : -1, "aria-disabled": !nextMonthInBounds, onClick: nextMonthInBounds ? onSelectNextMonth : undefined, onKeyDown: nextMonthInBounds ? onButtonKeyDown(onSelectNextMonth) : undefined, title: strings.nextMonthAriaLabel
+                    ? strings.nextMonthAriaLabel + ' ' + strings.months[(0, date_time_utilities_1.addMonths)(navigatedDate, 1).getMonth()]
+                    : undefined, type: "button" },
+                React.createElement(Icon_1.Icon, { iconName: rightNavigationIcon })),
+            showCloseButton && (React.createElement("button", { className: (0, utilities_1.css)(classNames.headerIconButton), onClick: onDismiss, onKeyDown: onButtonKeyDown(onDismiss), title: strings.closeButtonAriaLabel, type: "button" },
+                React.createElement(Icon_1.Icon, { iconName: closeNavigationIcon })))));
+    };
+    CalendarDayNavigationButtons.displayName = 'CalendarDayNavigationButtons';
+    var onButtonKeyDown = function (callback) {
+        return function (ev) {
+            // eslint-disable-next-line @typescript-eslint/no-deprecated
+            switch (ev.which) {
+                case utilities_1.KeyCodes.enter:
+                    callback === null || callback === void 0 ? void 0 : callback();
+                    break;
+            }
+        };
+    };
+});
+//# sourceMappingURL=CalendarDay.base.js.map

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { ICalendarDayProps } from './CalendarDay.types';
+export declare const CalendarDay: React.FunctionComponent<ICalendarDayProps>;

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.js

@@ -0,0 +1,9 @@
+define(["require", "exports", "./CalendarDay.base", "./CalendarDay.styles", "../../../Utilities"], function (require, exports, CalendarDay_base_1, CalendarDay_styles_1, Utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.CalendarDay = void 0;
+    exports.CalendarDay = (0, Utilities_1.styled)(CalendarDay_base_1.CalendarDayBase, CalendarDay_styles_1.styles, undefined, {
+        scope: 'CalendarDay',
+    });
+});
+//# sourceMappingURL=CalendarDay.js.map

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarDay.js","sourceRoot":"../src/","sources":["components/Calendar/CalendarDay/CalendarDay.tsx"],"names":[],"mappings":";;;;IAMa,QAAA,WAAW,GAA+C,IAAA,kBAAM,EAAC,kCAAe,EAAE,2BAAM,EAAE,SAAS,EAAE;QAChH,KAAK,EAAE,aAAa;KACrB,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { CalendarDayBase } from './CalendarDay.base';\nimport { styles } from './CalendarDay.styles';\nimport { styled } from '../../../Utilities';\nimport type { ICalendarDayProps } from './CalendarDay.types';\n\nexport const CalendarDay: React.FunctionComponent<ICalendarDayProps> = styled(CalendarDayBase, styles, undefined, {\n  scope: 'CalendarDay',\n});\n"]}

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.styles.d.ts

@@ -0,0 +1,2 @@
+import type { ICalendarDayStyleProps, ICalendarDayStyles } from './CalendarDay.types';
+export declare const styles: (props: ICalendarDayStyleProps) => ICalendarDayStyles;

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.styles.js

@@ -0,0 +1,91 @@
+define(["require", "exports", "tslib", "@fluentui/style-utilities"], function (require, exports, tslib_1, style_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.styles = void 0;
+    var styles = function (props) {
+        var _a;
+        var className = props.className, theme = props.theme, headerIsClickable = props.headerIsClickable, showWeekNumbers = props.showWeekNumbers;
+        var palette = theme.palette;
+        var disabledStyle = {
+            selectors: (_a = {
+                    '&, &:disabled, & button': {
+                        color: palette.neutralTertiaryAlt,
+                        pointerEvents: 'none',
+                    }
+                },
+                _a[style_utilities_1.HighContrastSelector] = {
+                    color: 'GrayText',
+                    forcedColorAdjust: 'none',
+                },
+                _a),
+        };
+        return {
+            root: [
+                style_utilities_1.normalize,
+                {
+                    width: 196,
+                    padding: 12,
+                    boxSizing: 'content-box',
+                },
+                showWeekNumbers && {
+                    width: 226,
+                },
+                className,
+            ],
+            header: {
+                position: 'relative',
+                display: 'inline-flex',
+                height: 28,
+                lineHeight: 44,
+                width: '100%',
+            },
+            monthAndYear: [
+                (0, style_utilities_1.getFocusStyle)(theme, { inset: 1 }),
+                tslib_1.__assign(tslib_1.__assign({}, style_utilities_1.AnimationStyles.fadeIn200), { alignItems: 'center', fontSize: style_utilities_1.FontSizes.medium, fontFamily: 'inherit', color: palette.neutralPrimary, display: 'inline-block', flexGrow: 1, fontWeight: style_utilities_1.FontWeights.semibold, padding: '0 4px 0 10px', border: 'none', backgroundColor: 'transparent', borderRadius: 2, lineHeight: 28, overflow: 'hidden', whiteSpace: 'nowrap', textAlign: 'left', textOverflow: 'ellipsis' }),
+                headerIsClickable && {
+                    selectors: {
+                        '&:hover': {
+                            cursor: 'pointer',
+                            background: palette.neutralLight,
+                            color: palette.black,
+                        },
+                    },
+                },
+            ],
+            monthComponents: {
+                display: 'inline-flex',
+                alignSelf: 'flex-end',
+            },
+            headerIconButton: [
+                (0, style_utilities_1.getFocusStyle)(theme, { inset: -1 }),
+                {
+                    width: 28,
+                    height: 28,
+                    display: 'block',
+                    textAlign: 'center',
+                    lineHeight: 28,
+                    fontSize: style_utilities_1.FontSizes.small,
+                    fontFamily: 'inherit',
+                    color: palette.neutralPrimary,
+                    borderRadius: 2,
+                    position: 'relative',
+                    backgroundColor: 'transparent',
+                    border: 'none',
+                    padding: 0,
+                    overflow: 'visible', // explicitly specify for IE11
+                    selectors: {
+                        '&:hover': {
+                            color: palette.neutralDark,
+                            backgroundColor: palette.neutralLight,
+                            cursor: 'pointer',
+                            outline: '1px solid transparent',
+                        },
+                    },
+                },
+            ],
+            disabledStyle: disabledStyle,
+        };
+    };
+    exports.styles = styles;
+});
+//# sourceMappingURL=CalendarDay.styles.js.map

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.types.d.ts

@@ -0,0 +1,145 @@
+import type { IBaseProps, IRefObject, IStyleFunctionOrObject } from '@fluentui/utilities';
+import type { ICalendarNavigationIcons } from '../Calendar.types';
+import type { IStyle, ITheme } from '@fluentui/style-utilities';
+import type { ICalendarDayGridProps, ICalendarDayGridStyleProps, ICalendarDayGridStyles } from '../../CalendarDayGrid/CalendarDayGrid.types';
+import type { ICalendarStrings, IDateFormatting } from '@fluentui/date-time-utilities';
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarDay {
+    focus(): void;
+}
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarDayProps extends IBaseProps<ICalendarDay>, ICalendarDayGridProps {
+    /**
+     * Optional callback to access the ICalendarDay interface. Use this instead of ref for accessing
+     * the public methods and properties of the component.
+     */
+    componentRef?: IRefObject<ICalendarDay>;
+    /**
+     * Customized styles for the calendar day component
+     */
+    styles?: IStyleFunctionOrObject<ICalendarDayStyleProps, ICalendarDayStyles>;
+    /**
+     * Theme (provided through customization).
+     */
+    theme?: ITheme;
+    /**
+     * Additional CSS class(es) to apply to the CalendarDay.
+     */
+    className?: string;
+    /**
+     * Localized strings to use in the Calendar
+     */
+    strings: ICalendarStrings;
+    /**
+     * The currently navigated date
+     */
+    navigatedDate: Date;
+    /**
+     * Callback issued when a date in the calendar is navigated
+     * @param date - The date that is navigated to
+     * @param focusOnNavigatedDay - Whether to set the focus to the navigated date.
+     */
+    onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
+    /**
+     * Callback issued when calendar day is closed
+     */
+    onDismiss?: () => void;
+    /**
+     * Custom navigation icons.
+     */
+    navigationIcons: ICalendarNavigationIcons;
+    /**
+     * Callback function when the header is selected
+     */
+    onHeaderSelect?: () => void;
+    /**
+     * Whether the calendar should show the week number (weeks 1 to 53) before each week row
+     * @defaultvalue false
+     */
+    showWeekNumbers?: boolean;
+    /**
+     * Apply additional formatting to dates, for example localized date formatting.
+     */
+    dateTimeFormatter: IDateFormatting;
+    /**
+     * Whether the calendar should show 6 weeks by default.
+     * @defaultvalue false
+     */
+    showSixWeeksByDefault?: boolean;
+    /**
+     * If set the Calendar will not allow navigation to or selection of a date earlier than this value.
+     */
+    minDate?: Date;
+    /**
+     * If set the Calendar will not allow navigation to or selection of a date later than this value.
+     */
+    maxDate?: Date;
+    /**
+     * If set the Calendar will not allow selection of dates in this array.
+     */
+    restrictedDates?: Date[];
+    /**
+     * Whether the close button should be shown or not
+     * @defaultvalue false
+     */
+    showCloseButton?: boolean;
+    /**
+     * Allows all dates and buttons to be focused, including disabled ones
+     * @defaultvalue false
+     */
+    allFocusable?: boolean;
+}
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarDayStyleProps extends ICalendarDayGridStyleProps {
+    /**
+     * Theme provided by High-Order Component.
+     */
+    theme: ITheme;
+    /**
+     * Accept custom classNames
+     */
+    className?: string;
+    /**
+     * Whether the header is clickable
+     */
+    headerIsClickable?: boolean;
+    /**
+     * Whether week numbers are being shown
+     */
+    showWeekNumbers?: boolean;
+}
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarDayStyles extends Partial<ICalendarDayGridStyles> {
+    /**
+     * Style for the root element.
+     */
+    root: IStyle;
+    /**
+     * The style for the header button and forward/back navigation button container
+     */
+    header: IStyle;
+    /**
+     * The style for the title text inside the header
+     */
+    monthAndYear: IStyle;
+    /**
+     * The style for the wrapper around forward/back/close buttons
+     */
+    monthComponents: IStyle;
+    /**
+     * The style for the forward/back/close buttons
+     */
+    headerIconButton: IStyle;
+    /**
+     * The style to apply for disabled elements
+     */
+    disabledStyle: IStyle;
+}

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.types.js

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=CalendarDay.types.js.map

node_modules/@fluentui/react/lib-amd/components/Calendar/CalendarDay/CalendarDay.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarDay.types.js","sourceRoot":"../src/","sources":["components/Calendar/CalendarDay/CalendarDay.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { IBaseProps, IRefObject, IStyleFunctionOrObject } from '@fluentui/utilities';\nimport type { ICalendarNavigationIcons } from '../Calendar.types';\nimport type { IStyle, ITheme } from '@fluentui/style-utilities';\nimport type {\n  ICalendarDayGridProps,\n  ICalendarDayGridStyleProps,\n  ICalendarDayGridStyles,\n} from '../../CalendarDayGrid/CalendarDayGrid.types';\nimport type { ICalendarStrings, IDateFormatting } from '@fluentui/date-time-utilities';\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarDay {\n  focus(): void;\n}\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarDayProps extends IBaseProps<ICalendarDay>, ICalendarDayGridProps {\n  /**\n   * Optional callback to access the ICalendarDay interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: IRefObject<ICalendarDay>;\n\n  /**\n   * Customized styles for the calendar day component\n   */\n  styles?: IStyleFunctionOrObject<ICalendarDayStyleProps, ICalendarDayStyles>;\n\n  /**\n   * Theme (provided through customization).\n   */\n  theme?: ITheme;\n\n  /**\n   * Additional CSS class(es) to apply to the CalendarDay.\n   */\n  className?: string;\n\n  /**\n   * Localized strings to use in the Calendar\n   */\n  strings: ICalendarStrings;\n\n  /**\n   * The currently navigated date\n   */\n  navigatedDate: Date;\n\n  /**\n   * Callback issued when a date in the calendar is navigated\n   * @param date - The date that is navigated to\n   * @param focusOnNavigatedDay - Whether to set the focus to the navigated date.\n   */\n  onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;\n\n  /**\n   * Callback issued when calendar day is closed\n   */\n  onDismiss?: () => void;\n\n  /**\n   * Custom navigation icons.\n   */\n  navigationIcons: ICalendarNavigationIcons;\n\n  /**\n   * Callback function when the header is selected\n   */\n  onHeaderSelect?: () => void;\n\n  /**\n   * Whether the calendar should show the week number (weeks 1 to 53) before each week row\n   * @defaultvalue false\n   */\n  showWeekNumbers?: boolean;\n\n  /**\n   * Apply additional formatting to dates, for example localized date formatting.\n   */\n  dateTimeFormatter: IDateFormatting;\n\n  /**\n   * Whether the calendar should show 6 weeks by default.\n   * @defaultvalue false\n   */\n  showSixWeeksByDefault?: boolean;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date earlier than this value.\n   */\n  minDate?: Date;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date later than this value.\n   */\n  maxDate?: Date;\n\n  /**\n   * If set the Calendar will not allow selection of dates in this array.\n   */\n  restrictedDates?: Date[];\n\n  /**\n   * Whether the close button should be shown or not\n   * @defaultvalue false\n   */\n  showCloseButton?: boolean;\n\n  /**\n   * Allows all dates and buttons to be focused, including disabled ones\n   * @defaultvalue false\n   */\n  allFocusable?: boolean;\n}\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarDayStyleProps extends ICalendarDayGridStyleProps {\n  /**\n   * Theme provided by High-Order Component.\n   */\n  theme: ITheme;\n\n  /**\n   * Accept custom classNames\n   */\n  className?: string;\n\n  // Insert CalendarDay style props below\n\n  /**\n   * Whether the header is clickable\n   */\n  headerIsClickable?: boolean;\n\n  /**\n   * Whether week numbers are being shown\n   */\n  showWeekNumbers?: boolean;\n}\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarDayStyles extends Partial<ICalendarDayGridStyles> {\n  /**\n   * Style for the root element.\n   */\n  root: IStyle;\n\n  /**\n   * The style for the header button and forward/back navigation button container\n   */\n  header: IStyle;\n\n  /**\n   * The style for the title text inside the header\n   */\n  monthAndYear: IStyle;\n\n  /**\n   * The style for the wrapper around forward/back/close buttons\n   */\n  monthComponents: IStyle;\n\n  /**\n   * The style for the forward/back/close buttons\n   */\n  headerIconButton: IStyle;\n\n  /**\n   * The style to apply for disabled elements\n   */\n  disabledStyle: IStyle;\n}\n"]}