first commit

node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.styles.d.ts

@@ -0,0 +1,2 @@
+import type { ICalendarPickerStyleProps, ICalendarPickerStyles } from './CalendarPicker.types';
+export declare const getStyles: (props: ICalendarPickerStyleProps) => ICalendarPickerStyles;

node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.styles.js

@@ -0,0 +1,186 @@
+import { __assign } from "tslib";
+import { normalize, FontSizes, FontWeights, getFocusStyle, AnimationStyles, HighContrastSelector, getHighContrastNoAdjustStyle, } from '@fluentui/style-utilities';
+import { AnimationDirection } from '../Calendar.types';
+export var getStyles = function (props) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    var className = props.className, theme = props.theme, hasHeaderClickCallback = props.hasHeaderClickCallback, highlightCurrent = props.highlightCurrent, highlightSelected = props.highlightSelected, animateBackwards = props.animateBackwards, animationDirection = props.animationDirection;
+    var palette = theme.palette;
+    var animationStyle = {};
+    if (animateBackwards !== undefined) {
+        if (animationDirection === AnimationDirection.Horizontal) {
+            animationStyle = animateBackwards ? AnimationStyles.slideRightIn20 : AnimationStyles.slideLeftIn20;
+        }
+        else {
+            animationStyle = animateBackwards ? AnimationStyles.slideDownIn20 : AnimationStyles.slideUpIn20;
+        }
+    }
+    var headerAnimationStyle = animateBackwards !== undefined ? AnimationStyles.fadeIn200 : {};
+    return {
+        root: [
+            normalize,
+            {
+                width: 196,
+                padding: 12,
+                boxSizing: 'content-box',
+                overflow: 'hidden',
+            },
+            className,
+        ],
+        headerContainer: {
+            display: 'flex',
+        },
+        currentItemButton: [
+            getFocusStyle(theme, { inset: -1 }),
+            __assign(__assign({}, headerAnimationStyle), { fontSize: FontSizes.medium, fontWeight: FontWeights.semibold, fontFamily: 'inherit', textAlign: 'left', color: 'inherit', backgroundColor: 'transparent', flexGrow: 1, padding: '0 4px 0 10px', border: 'none', overflow: 'visible' }),
+            hasHeaderClickCallback && {
+                selectors: {
+                    '&:hover, &:active': {
+                        cursor: !hasHeaderClickCallback ? 'default' : 'pointer',
+                        color: palette.neutralDark,
+                        outline: '1px solid transparent',
+                        backgroundColor: palette.neutralLight,
+                    },
+                },
+            },
+        ],
+        navigationButtonsContainer: {
+            display: 'flex',
+            alignItems: 'center',
+        },
+        navigationButton: [
+            getFocusStyle(theme, { inset: -1 }),
+            {
+                fontFamily: 'inherit',
+                width: 28,
+                minWidth: 28,
+                height: 28,
+                minHeight: 28,
+                display: 'block',
+                textAlign: 'center',
+                lineHeight: 28,
+                fontSize: FontSizes.small,
+                color: palette.neutralPrimary,
+                borderRadius: 2,
+                position: 'relative',
+                backgroundColor: 'transparent',
+                border: 'none',
+                padding: 0,
+                overflow: 'visible', // explicitly specify for IE11
+                selectors: {
+                    '&:hover': {
+                        color: palette.neutralDark,
+                        cursor: 'pointer',
+                        outline: '1px solid transparent',
+                        backgroundColor: palette.neutralLight,
+                    },
+                },
+            },
+        ],
+        gridContainer: {
+            marginTop: 4,
+        },
+        buttonRow: __assign(__assign({}, animationStyle), { marginBottom: 16, selectors: {
+                '&:nth-child(n + 3)': {
+                    marginBottom: 0,
+                },
+            } }),
+        itemButton: [
+            getFocusStyle(theme, { inset: -1 }),
+            {
+                width: 40,
+                height: 40,
+                minWidth: 40,
+                minHeight: 40,
+                lineHeight: 40,
+                fontSize: FontSizes.small,
+                fontFamily: 'inherit',
+                padding: 0,
+                margin: '0 12px 0 0',
+                color: palette.neutralPrimary,
+                backgroundColor: 'transparent',
+                border: 'none',
+                borderRadius: 2,
+                overflow: 'visible', // explicitly specify for IE11
+                selectors: {
+                    '&:nth-child(4n + 4)': {
+                        marginRight: 0,
+                    },
+                    '&:nth-child(n + 9)': {
+                        marginBottom: 0,
+                    },
+                    '& div': {
+                        fontWeight: FontWeights.regular,
+                    },
+                    '&:hover': {
+                        color: palette.neutralDark,
+                        backgroundColor: palette.neutralLight,
+                        cursor: 'pointer',
+                        outline: '1px solid transparent',
+                        selectors: (_a = {},
+                            _a[HighContrastSelector] = __assign({ background: 'Window', color: 'WindowText', outline: '1px solid Highlight' }, getHighContrastNoAdjustStyle()),
+                            _a),
+                    },
+                    '&:active': {
+                        backgroundColor: palette.themeLight,
+                        selectors: (_b = {},
+                            _b[HighContrastSelector] = __assign({ background: 'Window', color: 'Highlight' }, getHighContrastNoAdjustStyle()),
+                            _b),
+                    },
+                },
+            },
+        ],
+        current: highlightCurrent
+            ? {
+                color: palette.white,
+                backgroundColor: palette.themePrimary,
+                selectors: (_c = {
+                        '& div': {
+                            fontWeight: FontWeights.semibold,
+                        },
+                        '&:hover': {
+                            backgroundColor: palette.themePrimary,
+                            selectors: (_d = {},
+                                _d[HighContrastSelector] = __assign({ backgroundColor: 'WindowText', color: 'Window' }, getHighContrastNoAdjustStyle()),
+                                _d),
+                        }
+                    },
+                    _c[HighContrastSelector] = __assign({ backgroundColor: 'WindowText', color: 'Window' }, getHighContrastNoAdjustStyle()),
+                    _c),
+            }
+            : {},
+        selected: highlightSelected
+            ? {
+                color: palette.neutralPrimary,
+                backgroundColor: palette.themeLight,
+                fontWeight: FontWeights.semibold,
+                selectors: (_e = {
+                        '& div': {
+                            fontWeight: FontWeights.semibold,
+                        },
+                        '&:hover, &:active': {
+                            backgroundColor: palette.themeLight,
+                            selectors: (_f = {},
+                                _f[HighContrastSelector] = __assign({ color: 'Window', background: 'Highlight' }, getHighContrastNoAdjustStyle()),
+                                _f),
+                        }
+                    },
+                    _e[HighContrastSelector] = __assign({ background: 'Highlight', color: 'Window' }, getHighContrastNoAdjustStyle()),
+                    _e),
+            }
+            : {},
+        disabled: {
+            selectors: (_g = {
+                    '&, &:disabled, & button': {
+                        color: palette.neutralTertiaryAlt,
+                        pointerEvents: 'none',
+                    }
+                },
+                _g[HighContrastSelector] = {
+                    color: 'GrayText',
+                    forcedColorAdjust: 'none',
+                },
+                _g),
+        },
+    };
+};
+//# sourceMappingURL=CalendarPicker.styles.js.map

node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.types.d.ts

@@ -0,0 +1,54 @@
+import { AnimationDirection } from '../Calendar.types';
+import type { IStyle, ITheme } from '@fluentui/style-utilities';
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarPickerStyleProps {
+    /**
+     * Theme provided by High-Order Component.
+     */
+    theme: ITheme;
+    /**
+     * Accept custom classNames
+     */
+    className?: string;
+    /**
+     * Whether the header can be clicked
+     */
+    hasHeaderClickCallback?: boolean;
+    /**
+     * Whether the picker should highlight the current item
+     */
+    highlightCurrent?: boolean;
+    /**
+     * Whether the picker should highlight the selected item
+     */
+    highlightSelected?: boolean;
+    /**
+     * The cardinal directions for animation to occur during transitions, either horizontal or veritcal
+     */
+    animationDirection?: AnimationDirection;
+    /**
+     * Whether grid entering animation should be forwards or backwards
+     */
+    animateBackwards?: boolean;
+}
+/**
+ * {@docCategory Calendar}
+ */
+export interface ICalendarPickerStyles {
+    /**
+     * Style for the root element.
+     */
+    root: IStyle;
+    headerContainer: IStyle;
+    currentItemButton: IStyle;
+    navigationButtonsContainer: IStyle;
+    navigationButton: IStyle;
+    gridContainer: IStyle;
+    buttonRow: IStyle;
+    itemButton: IStyle;
+    current: IStyle;
+    selected: IStyle;
+    disabled: IStyle;
+}

node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=CalendarPicker.types.js.map

node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPicker.types.js","sourceRoot":"../src/","sources":["components/Calendar/CalendarPicker/CalendarPicker.types.ts"],"names":[],"mappings":"","sourcesContent":["import { AnimationDirection } from '../Calendar.types';\nimport type { IStyle, ITheme } from '@fluentui/style-utilities';\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarPickerStyleProps {\n  /**\n   * Theme provided by High-Order Component.\n   */\n  theme: ITheme;\n\n  /**\n   * Accept custom classNames\n   */\n  className?: string;\n\n  /**\n   * Whether the header can be clicked\n   */\n  hasHeaderClickCallback?: boolean;\n\n  /**\n   * Whether the picker should highlight the current item\n   */\n  highlightCurrent?: boolean;\n\n  /**\n   * Whether the picker should highlight the selected item\n   */\n  highlightSelected?: boolean;\n\n  /**\n   * The cardinal directions for animation to occur during transitions, either horizontal or veritcal\n   */\n  animationDirection?: AnimationDirection;\n\n  /**\n   * Whether grid entering animation should be forwards or backwards\n   */\n  animateBackwards?: boolean;\n}\n\n/**\n * {@docCategory Calendar}\n */\nexport interface ICalendarPickerStyles {\n  /**\n   * Style for the root element.\n   */\n  root: IStyle;\n\n  headerContainer: IStyle;\n\n  currentItemButton: IStyle;\n\n  navigationButtonsContainer: IStyle;\n\n  navigationButton: IStyle;\n\n  gridContainer: IStyle;\n\n  buttonRow: IStyle;\n\n  itemButton: IStyle;\n\n  current: IStyle;\n\n  selected: IStyle;\n\n  disabled: IStyle;\n}\n"]}