npm - @skyscanner/backpack-web - Versions diffs - 25.1.0 → 25.3.0 - Mend

@skyscanner/backpack-web 25.1.0 → 25.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/bpk-component-datepicker/src/BpkDatepicker.d.ts ADDED Viewed

@@ -0,0 +1,533 @@
+/*
+ * Backpack - Skyscanner's Design System
+ *
+ * Copyright 2016 Skyscanner Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Component } from 'react';
+import type { DaysOfWeek, ReactComponent, SelectionConfiguration } from '../../bpk-component-calendar';
+type Props = {
+    changeMonthLabel: string;
+    closeButtonText: string;
+    daysOfWeek: DaysOfWeek;
+    formatDate: (date: Date) => string;
+    formatDateFull: (date: Date) => string;
+    formatMonth: (date: Date) => string;
+    id: string;
+    title: string;
+    getApplicationElement: () => HTMLElement | null;
+    nextMonthLabel: string;
+    previousMonthLabel: string;
+    weekStartsOn: number;
+    calendarComponent: ReactComponent;
+    inputComponent: ReactComponent;
+    dateModifiers?: {};
+    fixedWidth?: boolean;
+    inputProps?: {};
+    markOutsideDays?: boolean;
+    markToday?: boolean;
+    maxDate?: Date;
+    minDate?: Date;
+    onDateSelect?: ((date: Date, newDate?: Date) => void) | null;
+    onMonthChange?: ((event: UIEvent, { month, source }: {
+        month: Date;
+        source: string;
+    }) => void) | null;
+    onOpenChange?: (arg0: boolean) => void | null;
+    selectionConfiguration?: SelectionConfiguration;
+    initiallyFocusedDate?: Date;
+    renderTarget?: null | HTMLElement | (() => null | HTMLElement);
+    isOpen?: boolean;
+    valid?: boolean;
+    onClose?: () => void;
+};
+type State = {
+    isOpen: boolean;
+};
+declare class BpkDatepicker extends Component<Props, State> {
+    inputRef: React.RefObject<HTMLInputElement>;
+    static defaultProps: {
+        calendarComponent: {
+            new (props: {
+                className?: string | null | undefined;
+                id: string;
+                changeMonthLabel?: string | null | undefined;
+                formatMonth: (date: Date) => string | Date;
+                maxDate: Date;
+                minDate: Date;
+                nextMonthLabel?: string | null | undefined;
+                onMonthChange?: (((event: UIEvent, { month, source }: {
+                    month: Date;
+                    source: string;
+                }) => void) & ((event: UIEvent, { month, source }: {
+                    month: Date;
+                    source: string;
+                }) => void)) | null | undefined;
+                previousMonthLabel?: string | null | undefined;
+                preventKeyboardFocus?: boolean | undefined;
+                dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                formatDateFull: (date: Date) => string | Date;
+                markToday?: boolean | undefined;
+                markOutsideDays?: boolean | undefined;
+                weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                dateProps?: {} | null | undefined;
+                focusedDate?: Date | null | undefined;
+                selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                weekDayKey?: string | undefined;
+                daysOfWeek: DaysOfWeek;
+                fixedWidth: boolean;
+                gridClassName?: string | null | undefined;
+                gridProps?: {} | null | undefined;
+                headerProps?: {} | null | undefined;
+                navProps?: {} | null | undefined;
+                onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                initiallyFocusedDate: Date | null;
+            }): {
+                UNSAFE_componentWillReceiveProps(nextProps: {
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }): void;
+                handleDateFocus: (event: UIEvent, { date, source }: {
+                    date: Date;
+                    source: string;
+                }) => void;
+                handleDateSelect: (date: Date) => void;
+                handleMonthChange: (event: UIEvent, { month, source }: {
+                    month: Date;
+                    source: string;
+                }) => void;
+                handleDateKeyDown: (event: KeyboardEvent) => void;
+                render(): JSX.Element;
+                context: any;
+                setState<K extends keyof {
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>(state: {
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                } | ((prevState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>, props: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>) => {
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                } | Pick<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }, K> | null) | Pick<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }, K> | null, callback?: (() => void) | undefined): void;
+                forceUpdate(callback?: (() => void) | undefined): void;
+                readonly props: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }> & Readonly<{
+                    children?: import("react").ReactNode;
+                }>;
+                state: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>;
+                refs: {
+                    [key: string]: import("react").ReactInstance;
+                };
+                componentDidMount?(): void;
+                shouldComponentUpdate?(nextProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, nextState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>, nextContext: any): boolean;
+                componentWillUnmount?(): void;
+                componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
+                getSnapshotBeforeUpdate?(prevProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, prevState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>): any;
+                componentDidUpdate?(prevProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, prevState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>, snapshot?: any): void;
+                componentWillMount?(): void;
+                UNSAFE_componentWillMount?(): void;
+                componentWillReceiveProps?(nextProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, nextContext: any): void;
+                componentWillUpdate?(nextProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, nextState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>, nextContext: any): void;
+                UNSAFE_componentWillUpdate?(nextProps: Readonly<{
+                    className?: string | null | undefined;
+                    id: string;
+                    changeMonthLabel?: string | null | undefined;
+                    formatMonth: (date: Date) => string | Date;
+                    maxDate: Date;
+                    minDate: Date;
+                    nextMonthLabel?: string | null | undefined;
+                    onMonthChange?: (((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void) & ((event: UIEvent, { month, source }: {
+                        month: Date;
+                        source: string;
+                    }) => void)) | null | undefined;
+                    previousMonthLabel?: string | null | undefined;
+                    preventKeyboardFocus?: boolean | undefined;
+                    dateModifiers?: import("../../bpk-component-calendar/src/custom-proptypes").DateModifiers | undefined;
+                    formatDateFull: (date: Date) => string | Date;
+                    markToday?: boolean | undefined;
+                    markOutsideDays?: boolean | undefined;
+                    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+                    dateProps?: {} | null | undefined;
+                    focusedDate?: Date | null | undefined;
+                    selectionConfiguration: import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationSingle | import("../../bpk-component-calendar/src/custom-proptypes").SelectionConfigurationRange;
+                    weekDayKey?: string | undefined;
+                    daysOfWeek: DaysOfWeek;
+                    fixedWidth: boolean;
+                    gridClassName?: string | null | undefined;
+                    gridProps?: {} | null | undefined;
+                    headerProps?: {} | null | undefined;
+                    navProps?: {} | null | undefined;
+                    onDateSelect?: ((date: Date, newDate?: Date | undefined) => void) | null | undefined;
+                    initiallyFocusedDate: Date | null;
+                }>, nextState: Readonly<{
+                    preventKeyboardFocus: boolean;
+                    focusedDate: Date;
+                }>, nextContext: any): void;
+            };
+            defaultProps: {
+                fixedWidth: boolean;
+                maxDate: Date;
+                minDate: Date;
+                onDateSelect: null;
+                onMonthChange: null;
+                selectionConfiguration: {
+                    type: "single";
+                    date: null;
+                };
+                initiallyFocusedDate: null;
+                markToday: boolean;
+                markOutsideDays: boolean;
+            };
+            contextType?: import("react").Context<any> | undefined;
+        };
+        inputComponent: null;
+        dateModifiers: {};
+        inputProps: {};
+        fixedWidth: boolean;
+        markOutsideDays: boolean;
+        markToday: boolean;
+        maxDate: Date;
+        minDate: Date;
+        nextMonthLabel: null;
+        onDateSelect: null;
+        onOpenChange: null;
+        onMonthChange: null;
+        previousMonthLabel: null;
+        selectionConfiguration: {
+            type: "single";
+            date: null;
+        };
+        initiallyFocusedDate: null;
+        renderTarget: null;
+        isOpen: boolean;
+        valid: null;
+    };
+    constructor(props: Props);
+    componentDidUpdate(prevProps: Props, prevState: State): void;
+    onOpen: () => void;
+    onClose: () => void;
+    /**
+     * Gets the correct label for the input field to be supplied to the aria-label
+     * @param {Object} selectionConfiguration current selection configuration
+     * @param {Function} formatDateFull function supplied to format date
+     * @returns {String} date string
+     */
+    getLabel: (selectionConfiguration: SelectionConfiguration, formatDateFull: (date: Date) => string) => string;
+    /**
+     * Gets the correct value for the input field
+     * @param {Object} selectionConfiguration current selection configuration
+     * @param {Function} formatDate function supplied to format date
+     * @returns {String} date value
+     */
+    getValue: (selectionConfiguration: SelectionConfiguration, formatDate: (date: Date) => string) => string;
+    handleDateSelect: (startDate: Date, endDate?: Date | null) => void;
+    render(): JSX.Element;
+}
+export default BpkDatepicker;

package/bpk-component-datepicker/src/BpkDatepicker.js CHANGED Viewed

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = require("react");
 var _bpkComponentInput = _interopRequireWildcard(require("../../bpk-component-input"));
 var _bpkComponentModal = _interopRequireDefault(require("../../bpk-component-modal"));
@@ -15,9 +14,9 @@ var _bpkComponentCalendar = require("../../bpk-component-calendar");
 var _BpkDatepickerModule = _interopRequireDefault(require("./BpkDatepicker.module.css"));
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["calendarComponent", "changeMonthLabel", "closeButtonText", "dateModifiers", "daysOfWeek", "fixedWidth", "formatDate", "formatDateFull", "formatMonth", "getApplicationElement", "id", "initiallyFocusedDate", "inputComponent", "inputProps", "markOutsideDays", "markToday", "maxDate", "minDate", "nextMonthLabel", "onMonthChange", "previousMonthLabel", "renderTarget", "selectionConfiguration", "title", "valid", "weekStartsOn"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -40,13 +39,14 @@ function _toPrimitive(input, hint) { if (typeof input !== "object" || input ===
                                                                                                                                                                                                                                                                                                                                                                                            * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
                                                                                                                                                                                                                                                                                                                                                                                            * See the License for the specific language governing permissions and
                                                                                                                                                                                                                                                                                                                                                                                            * limitations under the License.
-                                                                                                                                                                                                                                                                                                                                                                                           */
+                                                                                                                                                                                                                                                                                                                                                                                           */ // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 const getClassName = (0, _bpkReactUtils.cssModules)(_BpkDatepickerModule.default);
 const Input = (0, _bpkComponentInput.withOpenEvents)(_bpkComponentInput.default);
 const DefaultCalendar = (0, _bpkComponentCalendar.withCalendarState)((0, _bpkComponentCalendar.composeCalendar)(_bpkComponentCalendar.BpkCalendarNav, _bpkComponentCalendar.BpkCalendarGridHeader, _bpkComponentCalendar.BpkCalendarGrid, _bpkComponentCalendar.BpkCalendarDate));
 class BpkDatepicker extends _react.Component {
   constructor(props) {
     super(props);
+    _defineProperty(this, "inputRef", void 0);
     _defineProperty(this, "onOpen", () => {
       this.setState({
         isOpen: true
@@ -115,13 +115,13 @@ class BpkDatepicker extends _react.Component {
       // When the calendar is a single date we always want to close it when a date is selected
       // or if its a range calendar we only want to close the calendar when a range is selected.
       // If a custom onClose function is provided then we don't want to run the internal version.
-      if ((selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.single || selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.range && endDate) && !onClose) {
+      if (selectionConfiguration && (selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.single || selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.range && endDate) && !onClose) {
         this.onClose();
       }
       if (onDateSelect) {
         const newStartDate = _bpkComponentCalendar.DateUtils.dateToBoundaries(startDate, _bpkComponentCalendar.DateUtils.startOfDay(minDate), _bpkComponentCalendar.DateUtils.startOfDay(maxDate));
         const newEndDate = _bpkComponentCalendar.DateUtils.dateToBoundaries(endDate, _bpkComponentCalendar.DateUtils.startOfDay(minDate), _bpkComponentCalendar.DateUtils.startOfDay(maxDate));
-        if (selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.range && selectionConfiguration.startDate && !selectionConfiguration.endDate && (_bpkComponentCalendar.DateUtils.isAfter(newEndDate, selectionConfiguration.startDate) || _bpkComponentCalendar.DateUtils.isSameDay(newEndDate, selectionConfiguration.startDate))) {
+        if (selectionConfiguration && selectionConfiguration.type === _bpkComponentCalendar.CALENDAR_SELECTION_TYPE.range && selectionConfiguration.startDate && !selectionConfiguration.endDate && (_bpkComponentCalendar.DateUtils.isAfter(newEndDate, selectionConfiguration.startDate) || _bpkComponentCalendar.DateUtils.isSameDay(newEndDate, selectionConfiguration.startDate))) {
           onDateSelect(selectionConfiguration.startDate, newEndDate);
         } else {
           onDateSelect(newStartDate);
@@ -249,50 +249,13 @@ class BpkDatepicker extends _react.Component {
     });
   }
 }
-BpkDatepicker.propTypes = {
-  // Required
-  changeMonthLabel: _propTypes.default.string.isRequired,
-  closeButtonText: _propTypes.default.string.isRequired,
-  daysOfWeek: _bpkComponentCalendar.CustomPropTypes.DaysOfWeek.isRequired,
-  formatDate: _propTypes.default.func.isRequired,
-  formatDateFull: _propTypes.default.func.isRequired,
-  formatMonth: _propTypes.default.func.isRequired,
-  id: _propTypes.default.string.isRequired,
-  title: _propTypes.default.string.isRequired,
-  getApplicationElement: _propTypes.default.func.isRequired,
-  nextMonthLabel: _propTypes.default.string.isRequired,
-  previousMonthLabel: _propTypes.default.string.isRequired,
-  weekStartsOn: _propTypes.default.number.isRequired,
-  // Optional
-  calendarComponent: _propTypes.default.elementType,
-  inputComponent: _propTypes.default.elementType,
-  dateModifiers: _bpkComponentCalendar.CustomPropTypes.DateModifiers,
-  fixedWidth: _propTypes.default.bool,
-  inputProps: _propTypes.default.object,
-  // eslint-disable-line react/forbid-prop-types
-  markOutsideDays: _propTypes.default.bool,
-  markToday: _propTypes.default.bool,
-  maxDate: _propTypes.default.instanceOf(Date),
-  minDate: _propTypes.default.instanceOf(Date),
-  onDateSelect: _propTypes.default.func,
-  onOpenChange: _propTypes.default.func,
-  onMonthChange: _propTypes.default.func,
-  selectionConfiguration: _bpkComponentCalendar.CustomPropTypes.SelectionConfiguration,
-  initiallyFocusedDate: _propTypes.default.instanceOf(Date),
-  renderTarget: _propTypes.default.func,
-  isOpen: _propTypes.default.bool,
-  valid: _propTypes.default.bool,
-  // Disabling this as if we set a default property for this value it causes the internal onClose function to stop working for default setup
-  // eslint-disable-next-line react/require-default-props
-  onClose: _propTypes.default.func
-};
-BpkDatepicker.defaultProps = {
+_defineProperty(BpkDatepicker, "defaultProps", {
   calendarComponent: DefaultCalendar,
   inputComponent: null,
-  dateModifiers: DefaultCalendar.defaultProps.dateModifiers,
+  dateModifiers: {},
   inputProps: {},
   fixedWidth: true,
-  markOutsideDays: DefaultCalendar.defaultProps.markOutsideDays,
+  markOutsideDays: true,
   markToday: DefaultCalendar.defaultProps.markToday,
   maxDate: DefaultCalendar.defaultProps.maxDate,
   minDate: DefaultCalendar.defaultProps.minDate,
@@ -309,6 +272,6 @@ BpkDatepicker.defaultProps = {
   renderTarget: null,
   isOpen: false,
   valid: null
-};
+});
 var _default = BpkDatepicker;
 exports.default = _default;

package/bpk-component-datepicker/src/themeAttributes.js CHANGED Viewed

@@ -24,5 +24,6 @@ var _bpkComponentPopover = require("../../bpk-component-popover");
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 var _default = [..._bpkComponentCalendar.themeAttributes, ..._bpkComponentPopover.themeAttributes, ..._bpkComponentModal.themeAttributes].filter((attribute, index, attributes) => attributes.indexOf(attribute) === index);
 exports.default = _default;