@sbb-esta/lyne-elements 0.0.0 → 0.52.0

package/calendar/calendar.d.ts

@@ -0,0 +1,216 @@
+import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
+import { SbbDateLike } from '../core/interfaces.js';
+
+export interface Day {
+    value: string;
+    dayValue: string;
+    monthValue: string;
+    yearValue: string;
+}
+export interface Month {
+    value: string;
+    longValue: string;
+    monthValue: number;
+}
+export interface Weekday {
+    long: string;
+    narrow: string;
+}
+export type CalendarView = 'day' | 'month' | 'year';
+/**
+ * It displays a calendar which allows to choose a date.
+ *
+ * @event {CustomEvent<T>} dateSelected - Event emitted on date selection.
+ */
+export declare class SbbCalendarElement<T = Date> extends LitElement {
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly dateSelected: "dateSelected";
+    };
+    /** If set to true, two months are displayed */
+    wide: boolean;
+    /** The minimum valid date. Takes T Object, ISOString, and Unix Timestamp (number of seconds since Jan 1, 1970). */
+    set min(value: SbbDateLike<T> | null);
+    get min(): T | null;
+    private _min?;
+    /** The maximum valid date. Takes T Object, ISOString, and Unix Timestamp (number of seconds since Jan 1, 1970). */
+    set max(value: SbbDateLike<T> | undefined);
+    get max(): T | null;
+    private _max?;
+    /** A configured date which acts as the current date instead of the real current date. Recommended for testing purposes. */
+    set now(value: SbbDateLike<T> | undefined);
+    get now(): T;
+    private _now;
+    /** The selected date. Takes T Object, ISOString, and Unix Timestamp (number of seconds since Jan 1, 1970). */
+    set selected(value: SbbDateLike<T> | undefined);
+    get selected(): T | null;
+    private _selectedDate?;
+    /** A function used to filter out dates. */
+    dateFilter?: (date: T | null) => boolean;
+    private _dateAdapter;
+    /** Event emitted on date selection. */
+    private _dateSelected;
+    /** The currently active date. */
+    private _activeDate;
+    /** The selected date as ISOString. */
+    private _selected?;
+    /** The current wide property considering property value and breakpoints. From zero to small `wide` has always to be false. */
+    private set _wide(value);
+    private get _wide();
+    private _calendarView;
+    private _nextCalendarView;
+    /** A list of days, in two formats (long and single char). */
+    private _weekdays;
+    /** Grid of calendar cells representing the dates of the month. */
+    private _weeks;
+    /** Grid of calendar cells representing months. */
+    private _months;
+    /** Grid of calendar cells representing years. */
+    private _years;
+    /** Grid of calendar cells representing years for the wide view. */
+    private _nextMonthYears;
+    /** Grid of calendar cells representing the dates of the next month. */
+    private _nextMonthWeeks;
+    /** An array containing all the month names in the current language. */
+    private _monthNames;
+    /** A list of buttons corresponding to days, months or years depending on the view. */
+    private get _cells();
+    /** The chosen year in the year selection view. */
+    private _chosenYear?;
+    /** The chosen month in the year selection view. */
+    private _chosenMonth?;
+    /** Whether the focus should be reset on focusCell. */
+    private _resetFocus;
+    private _initialized;
+    private _abort;
+    private _language;
+    constructor();
+    private get _dateFilter();
+    /** Resets the active month according to the new state of the calendar. */
+    resetPosition(): void;
+    connectedCallback(): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected updated(changedProperties: PropertyValues<this>): void;
+    /** Initializes the component. */
+    private _init;
+    /** Focuses on a day cell prioritizing the selected day, the current day, and lastly, the first selectable day. */
+    private _focusCell;
+    /** Creates the array of weekdays. */
+    private _setWeekdays;
+    /** Creates the rows for each week. */
+    private _createWeekRows;
+    /** Creates the rows for the month selection view. */
+    private _createMonthRows;
+    /** Creates the rows for the year selection view. */
+    private _createYearRows;
+    /**
+     * Calculates the first year that will be shown in the year selection panel.
+     * If `minDate` and `maxDate` are both null, the starting year is calculated as
+     * the multiple of YEARS_PER_PAGE closest to and less than activeDate,
+     * e.g., with `YEARS_PER_PAGE` = 24 and `activeDate` = 2020, the function will return 2016 (24 * 83),
+     * while with `activeDate` = 2000, the function will return 1992 (24 * 82).
+     * If `minDate` is not null, it returns the corresponding year; if `maxDate` is not null,
+     * it returns the corresponding year minus `YEARS_PER_PAGE`, so that the `maxDate` is the last rendered year.
+     * If both are not null, `maxDate` has priority over `minDate`.
+     */
+    private _getStartValueYearView;
+    /** Checks if date is within the min-max range. */
+    private _isDayInRange;
+    private _isMonthInRange;
+    private _isYearInRange;
+    private _isMonthFilteredOut;
+    private _isYearFilteredOut;
+    /** Emits the selected date and sets it internally. */
+    private _selectDate;
+    private _assignActiveDate;
+    /** Goes to the month identified by the shift. */
+    private _goToDifferentMonth;
+    private _goToDifferentYear;
+    private _goToDifferentYearRange;
+    private _prevDisabled;
+    private _nextDisabled;
+    /** Checks if the "previous month" button should be disabled. */
+    private _previousMonthDisabled;
+    /** Checks if the "next month" button should be disabled. */
+    private _nextMonthDisabled;
+    private _previousYearDisabled;
+    private _nextYearDisabled;
+    private _previousYearRangeDisabled;
+    private _nextYearRangeDisabled;
+    private _handleTableBlur;
+    private _setTabIndex;
+    private _getFirstFocusable;
+    private _handleKeyboardEvent;
+    /**
+     * Gets the index of the element to move to, based on a list of elements (which can be potentially disabled),
+     * the keyboard input and the position of the current element in the list.
+     * In the day view, the `day?: Day` parameter is mandatory for calculation,
+     * while in month and year view it's not due to the fixed amount of rendered cells.
+     */
+    private _navigateByKeyboard;
+    /**
+     * Calculates the parameter needed in keyboard navigation.
+     * Since three views are now available, the function creates and returns the correct parameters for each of them
+     * by considering the number of cells per each row and the correction for the wide mode.
+     * @param cells The array of rendered table cells; they are buttons that can represent days, months or years.
+     * @param index The starting element's index in the cell array.
+     * @param day (optional) Only in the day view, the day represented by the starting cell.
+     */
+    private _calculateParametersForKeyboardNavigation;
+    /**
+     * Gets the next element of the provided array starting from `index` by adding `delta`.
+     * If the found element is disabled, it continues adding `delta` until it finds an enabled one in the array bounds.
+     */
+    private _findNext;
+    /** Find the first enabled element in the provided array. */
+    private _findFirst;
+    /** Find the last enabled element in the provided array. */
+    private _findLast;
+    /** Find the first enabled element in the same column of the provided array. */
+    private _findFirstOnColumn;
+    /** Find the last enabled element in the same column of the provided array. */
+    private _findLastOnColumn;
+    private _resetToDayView;
+    /** Render the view for the day selection. */
+    private _renderDayView;
+    /** Creates the label with the month for the daily view. */
+    private _createLabelForDayView;
+    /** Creates the aria-label for the daily view. */
+    private _createAriaLabelForDayView;
+    /** Creates the calendar table for the daily view. */
+    private _createDayTable;
+    /** Creates the table header with the month header cells. */
+    private _createDayTableHeader;
+    /** Creates the table body with the day cells. For the first row, it also considers the possible day's offset. */
+    private _createDayTableBody;
+    /** Creates the cells for the daily view. */
+    private _createDayCells;
+    /** Render the view for the month selection. */
+    private _renderMonthView;
+    /** Creates the label with the year for the monthly view. */
+    private _createLabelForMonthView;
+    /** Creates the table for the month selection view. */
+    private _createMonthTable;
+    /** Select the month and change the view to day selection. */
+    private _onMonthSelection;
+    /** Render the view for the year selection. */
+    private _renderYearView;
+    /** Creates the button arrow for all the views. */
+    private _getArrow;
+    /** Creates the label with the year range for the yearly view. */
+    private _createLabelForYearView;
+    /** Creates the table for the year selection view. */
+    private _createYearTable;
+    /** Select the year and change the view to month selection. */
+    private _onYearSelection;
+    private get _getView();
+    private _tableAnimationEnd;
+    private _removeTable;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-calendar': SbbCalendarElement;
+    }
+}
+//# sourceMappingURL=calendar.d.ts.map

package/calendar/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/elements/calendar/calendar.ts"],"names":[],"mappings":"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"}

package/calendar.d.ts

@@ -0,0 +1,2 @@
+export * from './calendar/calendar.js';
+//# sourceMappingURL=calendar.d.ts.map

package/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../src/elements/calendar.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}