@ukic/canary-web-components 2.0.0-canary.11 → 2.0.0-canary.12

package/dist/types/components/ic-date-picker/ic-date-picker.d.ts

@@ -1,251 +0,0 @@
-import { EventEmitter } from "../../stencil-public-runtime";
-import { IcWeekDays, IcDateFormat, IcSizes, IcInformationStatusOrEmpty } from "../../utils/types";
-interface IcDateInputProps {
-    dateFormat?: IcDateFormat;
-    disabled?: boolean;
-    disableDays?: IcWeekDays[];
-    disableDaysMessage?: string;
-    disableFuture?: boolean;
-    disableFutureMessage?: string;
-    disablePast?: boolean;
-    disablePastMessage?: string;
-    helperText?: string;
-    inputId?: string;
-    label: string;
-    max?: string | Date;
-    min?: string | Date;
-    name?: string;
-    required?: boolean;
-    showClearButton?: boolean;
-    showCalendarButton?: boolean;
-    size?: IcSizes;
-    value?: string | Date;
-    validationStatus?: IcInformationStatusOrEmpty;
-    validationText?: string;
-}
-export declare class DatePicker {
-    private inputEl;
-    private clearButtonEl;
-    private daysOfWeek;
-    private dayButtonFocussed;
-    private dayPickerKeyboardNav;
-    private decadeStart;
-    private decadeEnd;
-    private dialogDescription;
-    private focusDay;
-    private focussedYearEl;
-    private liveRegionEl;
-    private monthButtonEl;
-    private monthNames;
-    private monthInViewUpdateHandled;
-    private myCalendarButtonClicked;
-    private showPickerAbove;
-    private today;
-    private todayButtonEl;
-    private yearButtonEl;
-    private yearButtonFocussed;
-    el: HTMLIcDatePickerElement;
-    calendarOpen: boolean;
-    currMonthView: Date[];
-    currYearPickerView: number[];
-    dateInputProps: IcDateInputProps;
-    decadeView: number[];
-    focussedDate: Date;
-    focussedDay: number;
-    focussedDayEl: HTMLButtonElement;
-    focussedMonth: number;
-    focussedMonthEl: HTMLIcButtonElement;
-    focussedYear: number;
-    maxDate: Date;
-    minDate: Date;
-    monthInView: number;
-    monthPickerVisible: boolean;
-    orderedDaysOfWeek: string[];
-    selectedDate: Date;
-    yearInView: number;
-    yearPickerVisible: boolean;
-    /**
-     * The format in which the date will be displayed.
-     */
-    dateFormat?: IcDateFormat;
-    /**
-     * If `true`, the disabled state will be set.
-     */
-    disabled?: boolean;
-    /**
-     * The days of the week to disable.
-     */
-    disableDays?: IcWeekDays[];
-    /**
-     * The text to display as the validation message when `disableDays` is `true` and a disabled date is entered.
-     */
-    disableDaysMessage?: string;
-    /**
-     * If `true`, dates in the future are not allowed. A validation message will appear if a date in the future is entered.
-     */
-    disableFuture?: boolean;
-    /**
-     * The text to display as the validation message when `disableFuture` is `true` and a date in the future is entered.
-     */
-    disableFutureMessage?: string;
-    /**
-     * If `true`, dates in the past are not allowed. A validation message will appear if a date in the past is entered.
-     */
-    disablePast?: boolean;
-    /**
-     * The text to display as the validation message when `disablePast` is `true` and a date in the past is entered.
-     */
-    disablePastMessage?: string;
-    /**
-     * The helper text that will be displayed for additional field guidance. This will default to the text "Use format" along with the `dateFormat` value.
-     */
-    helperText?: string;
-    /**
-     * The ID for the input field. The default will be an automatically generated value.
-     */
-    inputId?: string;
-    /**
-     * The label for the date input.
-     */
-    label: string;
-    /**
-     * The latest date that will be allowed. The value can be in any format supported as `dateFormat`, in ISO 8601 date string format (`yyyy-mm-dd`) or as a JavaScript `Date` object.
-     * The value of this prop is ignored if `disableFuture` is set to `true`.
-     */
-    max?: string | Date;
-    watchMaxHandler(): void;
-    /**
-     * The earliest date that will be allowed. The value can be in any format supported as `dateFormat`, in ISO 8601 date string format (`yyyy-mm-dd`) or as a JavaScript `Date` object.
-     * The value of this prop is ignored if `disablePast` is set to `true`.
-     */
-    min?: string | Date;
-    watchMinHandler(): void;
-    /**
-     * The name of the control, which is submitted with the form data.
-     */
-    name?: string;
-    /**
-     * The date visible when the calendar opens. Used if no date is currently selected.
-     * The value can be in any format supported as `dateFormat`, in ISO 8601 date string format (`yyyy-mm-dd`) or as a JavaScript `Date` object.
-     */
-    openAtDate: string | Date;
-    /**
-     * If `true`, the input will require a value.
-     */
-    required?: boolean;
-    /**
-     * If `true`, days outside the current month will be visible in the date picker.
-     */
-    showDaysOutsideMonth?: boolean;
-    /**
-     * If `true`, the `Clear` button on the date picker will be visible.
-     */
-    showPickerClearButton?: boolean;
-    /**
-     * If `true`, the `Go to today` button on the date picker will be visible.
-     */
-    showPickerTodayButton?: boolean;
-    /**
-     * The size of the date picker to be displayed.
-     */
-    size?: IcSizes;
-    /**
-     * The first day of the week. `0` for Sunday, `1` for Monday, etc.
-     * Default is Monday.
-     */
-    startOfWeek?: IcWeekDays;
-    /**
-     * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
-     */
-    validationStatus?: IcInformationStatusOrEmpty;
-    /**
-     * The text to display as the validation message. This will override the built-in date validation.
-     */
-    validationText?: string;
-    /**
-     * The value of the date picker. The value can be in any format supported as `dateFormat`, in ISO 8601 date string format (`yyyy-mm-dd`) or as a JavaScript `Date` object.
-     */
-    value?: string | Date | null | undefined;
-    watchOpenHandler(): void;
-    watchFocussedDateHandler(current: Date, previous: Date): void;
-    watchMonthInViewHandler(): void;
-    watchYearInViewHandler(): void;
-    watchYearPickerVisibleHandler(): void;
-    watchMonthPickerVisibleHandler(): void;
-    watchFocussedDayEl(): void;
-    /**
-     * Emitted when the value has changed.
-     */
-    icChange: EventEmitter<{
-        value: Date;
-    }>;
-    componentWillLoad(): void;
-    localCalendarButtonClickHandler(ev: CustomEvent): void;
-    calendarButtonClickHandler(): void;
-    private setDecadeView;
-    private setSelectedDate;
-    private handleCalendarMouseDown;
-    private handleCalendarClick;
-    private handleDocumentClick;
-    private keyDownHandler;
-    private closeButtonClickHandler;
-    private focusFirstElement;
-    private focusLastElement;
-    private focusFocussedDay;
-    private monthButtonClickHandler;
-    private yearButtonClickHandler;
-    private todayButtonClickHandler;
-    private todayButtonKeyDownHandler;
-    private clearButtonClickHandler;
-    private setMonthSelectedLiveRegionText;
-    private setYearSelectedLiveRegionText;
-    private getMonthInViewText;
-    private getDecadeInViewText;
-    private setAriaLiveRegionText;
-    private clearDialogDescription;
-    private clearButtonKeyDownHandler;
-    private goToPreviousMonth;
-    private goToNextMonth;
-    private goToPreviousYear;
-    private goToNextYear;
-    private navButtonMouseDownHandler;
-    private renderMonthYearNavButton;
-    private monthYearNavClickHandler;
-    private previousMonthButton;
-    private nextMonthButton;
-    private previousYearButton;
-    private nextYearButton;
-    private isPrevYearAllowed;
-    private isNextYearAllowed;
-    private isYearAllowed;
-    private getMonthView;
-    private isCurrentMonth;
-    private updateMonthInView;
-    private handleSelectDay;
-    private handleSelectMonth;
-    private handleSelectYear;
-    private monthPickerKeyDownHandler;
-    private yearPickerKeyDownHandler;
-    private onYearButtonFocusHandler;
-    private onYearButtonBlurHandler;
-    private monthButtonKeyDownHandler;
-    private yearButtonKeyDownHandler;
-    private handleCalendarKeyDown;
-    private calendarTabHandler;
-    private onDayButtonFocusHandler;
-    private onDayButtonBlurHandler;
-    private getNextDayToFocus;
-    private moveDays;
-    private moveMonths;
-    private moveYears;
-    private updateFocussedMonth;
-    private updateFocussedYear;
-    private setFocussedDate;
-    private setFocussedDayEl;
-    private setFocussedMonthEl;
-    private setFocussedYearEl;
-    private setFocussedYear;
-    private setDateInputProps;
-    render(): any;
-}
-export {};

package/dist/types/components/ic-date-picker/ic-day-button.d.ts

@@ -1,16 +0,0 @@
-import { FunctionalComponent } from "../../stencil-public-runtime";
-export type DayButtonProps = {
-    focussed: boolean;
-    today: boolean;
-    day: Date;
-    monthInView: number;
-    onFocusDay: () => void;
-    onBlurDay: () => void;
-    onSelectDay: (day: Date) => void;
-    selected: boolean;
-    focussedDayRef?: (element: HTMLButtonElement) => void;
-    inRange: boolean;
-    showDaysOutsideMonth: boolean;
-    disableDay: boolean;
-};
-export declare const DayButton: FunctionalComponent<DayButtonProps>;

package/dist/types/components/ic-date-picker/ic-month-picker.d.ts

@@ -1,14 +0,0 @@
-import { FunctionalComponent } from "../../stencil-public-runtime";
-import { IcSizes } from "../../utils/types";
-export type MonthPickerProps = {
-    size: IcSizes;
-    focussedMonth: number;
-    monthInView: number;
-    yearInView: number;
-    onSelectMonth: (month: number) => void;
-    onKeyDown: (ev: KeyboardEvent) => void;
-    focussedMonthRef: (element: HTMLIcButtonElement) => void;
-    minDate: Date;
-    maxDate: Date;
-};
-export declare const MonthPicker: FunctionalComponent<MonthPickerProps>;

package/dist/types/components/ic-date-picker/ic-year-picker.d.ts

@@ -1,16 +0,0 @@
-import { FunctionalComponent } from "../../stencil-public-runtime";
-import { IcSizes } from "../../utils/types";
-export type YearPickerProps = {
-    decadeView: number[];
-    size: IcSizes;
-    focussedYear: number;
-    yearInView: number;
-    onSelectYear: (year: number) => void;
-    onKeyDown: (ev: KeyboardEvent) => void;
-    onFocusYear: () => void;
-    onBlurYear: () => void;
-    minDate: Date;
-    maxDate: Date;
-    focussedYearRef: (element: HTMLIcButtonElement) => void;
-};
-export declare const YearPicker: FunctionalComponent<YearPickerProps>;

package/dist/types/components/ic-date-picker/story-data.d.ts

@@ -1,22 +0,0 @@
-export declare const DATE_PICKER_LABEL = "When would you like to collect your coffee?";
-export declare const createDatePickerElement: () => HTMLIcDatePickerElement;
-export declare const Default: () => HTMLIcDatePickerElement;
-export declare const Small: () => HTMLIcDatePickerElement;
-export declare const Large: () => HTMLIcDatePickerElement;
-export declare const Sizes: () => HTMLElement;
-export declare const MaxWidth: () => HTMLElement;
-export declare const MonthFirst: () => HTMLIcDatePickerElement;
-export declare const YearFirst: () => HTMLIcDatePickerElement;
-export declare const DateFormats: () => HTMLElement;
-export declare const Value: () => HTMLIcDatePickerElement;
-export declare const OpenAt: () => HTMLIcDatePickerElement;
-export declare const WeekStart: () => HTMLIcDatePickerElement;
-export declare const WorkingWeek: () => HTMLIcDatePickerElement;
-export declare const MaxMin: () => HTMLIcDatePickerElement;
-export declare const Disabled: () => HTMLIcDatePickerElement;
-export declare const DisablePast: () => HTMLIcDatePickerElement;
-export declare const DisableFuture: () => HTMLIcDatePickerElement;
-export declare const HideOutsideMonth: () => HTMLIcDatePickerElement;
-export declare const HideButtons: () => HTMLIcDatePickerElement;
-export declare const JSDates: () => HTMLIcDatePickerElement;
-export declare const IcChangeDate: () => HTMLElement;

package/dist/types/utils/date-helpers.d.ts

@@ -1,22 +0,0 @@
-import { IcDateFormat, IcWeekDays } from "../utils/types";
-export declare const isMonthFirstFormat: (dateString: string) => boolean;
-export declare const isDayFirstFormat: (dateString: string) => boolean;
-export declare const createDate: (date: string | Date, dateFormat: IcDateFormat) => Date;
-export declare const isDateOrEpoch: (date: Date | string) => boolean;
-export declare const extractDateFromZuluDateTime: (zuluDateTime: string) => string;
-export declare const splitStringDate: (date: string, dateFormat: IcDateFormat) => string[];
-export declare const convertToDoubleDigits: (value: string | number) => string;
-export declare const getWeekStart: (date: Date, startDay: IcWeekDays) => Date;
-export declare const getWeekEnd: (date: Date, startDay: IcWeekDays) => Date;
-export declare const getMonthStart: (date: Date) => Date;
-export declare const getMonthEnd: (date: Date) => Date;
-/**
- * Compare if two dates are equal exactly equal
- */
-export declare const dateMatches: (a: Date, b: Date) => boolean;
-export declare const clampDate: (date: Date, min: Date, max: Date) => Date;
-/**
- * Compare if date is within specified range
- */
-export declare const dateInRange: (date: Date, min: Date, max: Date) => boolean;
-export declare const yearInRange: (year: number, min: Date, max: Date) => boolean;