@instructure/ui-calendar 8.51.0 → 8.51.1-snapshot-5

package/types/Calendar/__new-tests__/Calendar.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom';
+//# sourceMappingURL=Calendar.test.d.ts.map

package/types/Calendar/__new-tests__/Calendar.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.test.d.ts","sourceRoot":"","sources":["../../../src/Calendar/__new-tests__/Calendar.test.tsx"],"names":[],"mappings":"AA0BA,OAAO,2BAA2B,CAAA"}

package/types/Calendar/index.d.ts

@@ -1,38 +1,58 @@
 /** @jsx jsx */
-import React, { Component } from 'react';
+import React, { Component, MouseEvent } from 'react';
 import { jsx } from '@instructure/emotion';
+import { ApplyLocaleContext } from '@instructure/ui-i18n';
+import type { Moment } from '@instructure/ui-i18n';
 import { Day } from './Day';
-import type { CalendarProps } from './props';
+import type { CalendarProps, CalendarState } from './props';
+import { Renderable } from '@instructure/shared-types';
 /**
 ---
 category: components
 ---
 **/
-declare class Calendar extends Component<CalendarProps> {
+declare class Calendar extends Component<CalendarProps, CalendarState> {
     static readonly componentId = "Calendar";
+    context: React.ContextType<typeof ApplyLocaleContext>;
+    static contextType: React.Context<{
+        locale?: string | undefined;
+        timezone?: string | undefined;
+    }>;
     static Day: typeof Day;
     static DAY_COUNT: number;
     static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
-        children?: React.ReactElement<import("./Day/props").CalendarDayProps, string | React.JSXElementConstructor<any>>[] | undefined;
-        renderNextMonthButton?: import("@instructure/shared-types").Renderable;
-        renderPrevMonthButton?: import("@instructure/shared-types").Renderable;
-        renderNavigationLabel?: import("@instructure/shared-types").Renderable;
-        renderWeekdayLabels: import("@instructure/shared-types").Renderable[];
-        onRequestRenderNextMonth?: ((e: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onRequestRenderPrevMonth?: ((e: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
         as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        children?: React.ReactElement<import("./Day/props").CalendarDayProps, string | React.JSXElementConstructor<any>>[] | undefined;
+        currentDate?: string | undefined;
+        disabledDates?: string[] | ((isoDateToCheck: string) => boolean) | undefined;
+        locale?: string | undefined;
+        onDateSelected?: ((dateString: string, momentDate: Moment, e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        onRequestRenderNextMonth?: ((e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        onRequestRenderPrevMonth?: ((e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        renderNavigationLabel?: Renderable;
+        renderNextMonthButton?: Renderable;
+        renderPrevMonthButton?: Renderable;
+        renderWeekdayLabels?: Renderable[] | undefined;
         role?: "table" | "listbox" | undefined;
+        selectedDate?: string | undefined;
+        timezone?: string | undefined;
     }>;
     static allowedProps: readonly (keyof {
-        children?: React.ReactElement<import("./Day/props").CalendarDayProps, string | React.JSXElementConstructor<any>>[] | undefined;
-        renderNextMonthButton?: import("@instructure/shared-types").Renderable;
-        renderPrevMonthButton?: import("@instructure/shared-types").Renderable;
-        renderNavigationLabel?: import("@instructure/shared-types").Renderable;
-        renderWeekdayLabels: import("@instructure/shared-types").Renderable[];
-        onRequestRenderNextMonth?: ((e: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onRequestRenderPrevMonth?: ((e: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
         as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        children?: React.ReactElement<import("./Day/props").CalendarDayProps, string | React.JSXElementConstructor<any>>[] | undefined;
+        currentDate?: string | undefined;
+        disabledDates?: string[] | ((isoDateToCheck: string) => boolean) | undefined;
+        locale?: string | undefined;
+        onDateSelected?: ((dateString: string, momentDate: Moment, e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        onRequestRenderNextMonth?: ((e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        onRequestRenderPrevMonth?: ((e: React.MouseEvent<Element, globalThis.MouseEvent>) => void) | undefined;
+        renderNavigationLabel?: Renderable;
+        renderNextMonthButton?: Renderable;
+        renderPrevMonthButton?: Renderable;
+        renderWeekdayLabels?: Renderable[] | undefined;
         role?: "table" | "listbox" | undefined;
+        selectedDate?: string | undefined;
+        timezone?: string | undefined;
     })[];
     static defaultProps: {
         as: string;
@@ -40,14 +60,32 @@ declare class Calendar extends Component<CalendarProps> {
     };
     ref: Element | null;
     private _weekdayHeaderIds;
+    constructor(props: CalendarProps);
     handleRef: (el: Element | null) => void;
     componentDidMount(): void;
-    componentDidUpdate(): void;
+    componentDidUpdate(prevProps: CalendarProps): void;
+    calculateState: (locale: string, timezone: string, currentDate?: string) => {
+        renderedDate: Moment;
+        today: Moment;
+    };
     get role(): "listbox" | undefined;
+    renderMonthNavigationButtons: () => {
+        prevButton: any;
+        nextButton: any;
+    };
+    handleMonthChange: (direction: 'prev' | 'next') => (e: React.MouseEvent) => void;
     renderHeader(): jsx.JSX.Element;
     renderBody(): jsx.JSX.Element;
     renderWeekdayHeaders(): jsx.JSX.Element;
+    get defaultWeekdays(): Renderable<never>[];
     renderDays(): jsx.JSX.Element[];
+    locale(): string;
+    timezone(): string;
+    handleDayClick: (event: MouseEvent<any>, { date }: {
+        date: string;
+    }) => void;
+    isDisabledDate(date: Moment): boolean;
+    renderDefaultdays(): jsx.JSX.Element[];
     render(): jsx.JSX.Element;
 }
 export default Calendar;

package/types/Calendar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Calendar/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,KAAK,EAAE,EAAY,SAAS,EAAgB,MAAM,OAAO,CAAA;AAchE,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAG3B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C;;;;GAIG;AACH,cAEM,QAAS,SAAQ,SAAS,CAAC,aAAa,CAAC;IAC7C,MAAM,CAAC,QAAQ,CAAC,WAAW,cAAa;IAExC,MAAM,CAAC,GAAG,aAAM;IAChB,MAAM,CAAC,SAAS,SAAK;IAErB,MAAM,CAAC,SAAS;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;MAGlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAC1B,OAAO,CAAC,iBAAiB,CAKxB;IAED,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAIjB,kBAAkB;IAIlB,IAAI,IAAI,0BAEP;IAED,YAAY;IAqCZ,UAAU;IASV,oBAAoB;IA0BpB,UAAU;IAgCV,MAAM;CAoBP;AAED,eAAe,QAAQ,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Calendar/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,KAAK,EAAE,EAAY,SAAS,EAAgB,UAAU,EAAE,MAAM,OAAO,CAAA;AAe5E,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,EAAoB,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAC3E,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAKlD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAG3B,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAQtD;;;;GAIG;AACH,cAEM,QAAS,SAAQ,SAAS,CAAC,aAAa,EAAE,aAAa,CAAC;IAC5D,MAAM,CAAC,QAAQ,CAAC,WAAW,cAAa;IAEhC,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,OAAO,kBAAkB,CAAC,CAAA;IAC7D,MAAM,CAAC,WAAW;;;OAAqB;IACvC,MAAM,CAAC,GAAG,aAAM;IAChB,MAAM,CAAC,SAAS,SAAK;IAErB,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;MAGlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAC1B,OAAO,CAAC,iBAAiB,CAInB;gBACM,KAAK,EAAE,aAAa;IAUhC,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAIjB,kBAAkB,CAAC,SAAS,EAAE,aAAa;IAoB3C,cAAc,WACJ,MAAM,YACJ,MAAM,gBACF,MAAM;;;MAQpB;IAEF,IAAI,IAAI,0BAEP;IAED,4BAA4B;;;MA2B3B;IAED,iBAAiB,cAAe,MAAM,GAAG,MAAM,SAAS,gBAAgB,UAkBvE;IAED,YAAY;IAqCZ,UAAU;IASV,oBAAoB;IA2BpB,IAAI,eAAe,wBAgClB;IAED,UAAU;IAmCV,MAAM,IAAI,MAAM;IAShB,QAAQ;IAUR,cAAc,UAAW,WAAW,GAAG,CAAC;cAAoB,MAAM;eAKjE;IAED,cAAc,CAAC,IAAI,EAAE,MAAM;IAgB3B,iBAAiB;IAiCjB,MAAM;CAoBP;AAED,eAAe,QAAQ,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/types/Calendar/props.d.ts

@@ -3,12 +3,55 @@ import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
 import React, { ReactElement } from 'react';
 import type { CalendarDayProps } from './Day/props';
 import { Renderable } from '@instructure/shared-types';
+import type { Moment } from '@instructure/ui-i18n';
 type CalendarOwnProps = {
+    /**
+     * The element to render as the `Calendar` root, `span` by default
+     */
+    as?: AsElementType;
     /**
      * children of type `<Calendar.Day />` There should be exactly 42 provided (6
      * weeks).
      */
     children?: ReactElement<CalendarDayProps>[];
+    /**
+     * ISO date string for the current date if necessary. Defaults to the current
+     * date in the user's timezone.
+     */
+    currentDate?: string;
+    disabledDates?: string[] | ((isoDateToCheck: string) => boolean);
+    /**
+     * A standard language identifier.
+     *
+     * See [Moment.js](https://momentjs.com/timezone/docs/#/using-timezones/parsing-in-zone/) for
+     * more details.
+     *
+     * This property can also be set via a context property and if both are set
+     * then the component property takes precedence over the context property.
+     *
+     * The web browser's locale will be used if no value is set via a component
+     * property or a context property.
+     **/
+    locale?: string;
+    /**
+     * Callback fired when a day has been selected.
+     */
+    onDateSelected?: (dateString: string, momentDate: Moment, e: React.MouseEvent) => void;
+    /**
+     * Callback fired when the next month button is clicked in the navigation
+     * header, requesting to render the next month.
+     */
+    onRequestRenderNextMonth?: (e: React.MouseEvent) => void;
+    /**
+     * Callback fired when the previous month button is clicked in the navigation
+     * header, requesting to render the previous month.
+     */
+    onRequestRenderPrevMonth?: (e: React.MouseEvent) => void;
+    /**
+     * Content to render in the navigation header. The recommendation is to include
+     * the name of the current rendered month along with the year.
+     */
+    renderNavigationLabel?: Renderable;
     /**
      * A button to render in the navigation header. The recommendation is to
      * compose it with the [IconButton](#IconButton) component by setting the `size`
@@ -23,11 +66,6 @@ type CalendarOwnProps = {
      * `renderIcon` to [IconArrowOpenStart](#iconography).
      */
     renderPrevMonthButton?: Renderable;
-    /**
-     * Content to render in the navigation header. The recommendation is to include
-     * the name of the current rendered month along with the year.
-     */
-    renderNavigationLabel?: Renderable;
     /**
      * An array of labels containing the name of each day of the week. The visible
      * portion of the label should be abbreviated (no longer than three characters).
@@ -37,26 +75,29 @@ type CalendarOwnProps = {
      * full day name for assistive technologies and the children containing the
      * abbreviation. ex. `[<AccessibleContent alt="Sunday">Sun</AccessibleContent>, ...]`
      */
-    renderWeekdayLabels: Renderable[];
+    renderWeekdayLabels?: Renderable[];
     /**
-     * Callback fired when the next month button is clicked in the navigation
-     * header, requesting to render the next month.
-     */
-    onRequestRenderNextMonth?: (e: React.MouseEvent) => void;
-    /**
-     * Callback fired when the previous month button is clicked in the navigation
-     * header, requesting to render the previous month.
+     * The role of the underlying table. This can be set to 'listbox' when
+     * assistive technologies need to read the `<Calendar.Day />` children as a list.
      */
-    onRequestRenderPrevMonth?: (e: React.MouseEvent) => void;
+    role?: 'table' | 'listbox';
     /**
-     * The element to render as the `Calendar` root, `span` by default
+     * ISO date string for the selected date. It needs onDateSelected to be specified too.
      */
-    as?: AsElementType;
+    selectedDate?: string;
     /**
-     * The role of the underlying table. This can be set to 'listbox' when
-     * assistive technologies need to read the `<Calendar.Day />` children as a list.
+     * A timezone identifier in the format: *Area/Location*
+     *
+     * See [List of tz database time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) for the list
+     * of possible options.
+     *
+     * This property can also be set via a context property and if both are set
+     * then the component property takes precedence over the context property.
+     *
+     * The web browser's timezone will be used if no value is set via a component
+     * property or a context property.
      */
-    role?: 'table' | 'listbox';
+    timezone?: string;
 };
 type PropKeys = keyof CalendarOwnProps;
 type AllowedPropKeys = Readonly<Array<PropKeys>>;
@@ -64,6 +105,10 @@ type CalendarProps = CalendarOwnProps & WithStyleProps<CalendarTheme, CalendarSt
 type CalendarStyle = ComponentStyle<'navigation' | 'navigationWithButtons' | 'weekdayHeader'>;
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { CalendarProps, CalendarStyle };
+type CalendarState = {
+    renderedDate: Moment;
+    today: Moment;
+};
+export type { CalendarProps, CalendarStyle, CalendarState };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Calendar/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Calendar/props.ts"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,aAAa,EACb,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAEtD,KAAK,gBAAgB,GAAG;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,gBAAgB,CAAC,EAAE,CAAA;IAC3C;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;OAGG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;;;;;;OAQG;IACH,mBAAmB,EAAE,UAAU,EAAE,CAAA;IACjC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACxD;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACxD;;OAEG;IACH,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC3B,CAAA;AAED,KAAK,QAAQ,GAAG,MAAM,gBAAgB,CAAA;AAEtC,KAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,KAAK,aAAa,GAAG,gBAAgB,GACnC,cAAc,CAAC,aAAa,EAAE,aAAa,CAAC,GAC5C,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEvC,KAAK,aAAa,GAAG,cAAc,CACjC,YAAY,GAAG,uBAAuB,GAAG,eAAe,CACzD,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAYvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAUnB,CAAA;AAED,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Calendar/props.ts"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,aAAa,EACb,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AACtD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAElD,KAAK,gBAAgB,GAAG;IACtB;;OAEG;IACH,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,gBAAgB,CAAC,EAAE,CAAA;IAC3C;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IAMpB,aAAa,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC,cAAc,EAAE,MAAM,KAAK,OAAO,CAAC,CAAA;IAChE;;;;;;;;;;;QAWI;IACJ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;OAEG;IACH,cAAc,CAAC,EAAE,CACf,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,EAClB,CAAC,EAAE,KAAK,CAAC,UAAU,KAChB,IAAI,CAAA;IACT;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACxD;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACxD;;;OAGG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,UAAU,CAAA;IAClC;;;;;;;;OAQG;IACH,mBAAmB,CAAC,EAAE,UAAU,EAAE,CAAA;IAClC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;;;;;;;;;;OAWG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,KAAK,QAAQ,GAAG,MAAM,gBAAgB,CAAA;AAEtC,KAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,KAAK,aAAa,GAAG,gBAAgB,GACnC,cAAc,CAAC,aAAa,EAAE,aAAa,CAAC,GAC5C,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEvC,KAAK,aAAa,GAAG,cAAc,CACjC,YAAY,GAAG,uBAAuB,GAAG,eAAe,CACzD,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAkBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAgBnB,CAAA;AAED,KAAK,aAAa,GAAG;IACnB,YAAY,EAAE,MAAM,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAC3D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}