Package Exports
- @ipohjs/calendar
- @ipohjs/calendar/dist/calendar.d.ts
- @ipohjs/calendar/dist/calendar.d.ts.map
- @ipohjs/calendar/dist/calendar.js
- @ipohjs/calendar/dist/calendar.js.map
- @ipohjs/calendar/dist/helpers/from-parts-to-utc-date.d.ts
- @ipohjs/calendar/dist/helpers/from-parts-to-utc-date.d.ts.map
- @ipohjs/calendar/dist/helpers/from-parts-to-utc-date.js
- @ipohjs/calendar/dist/helpers/from-parts-to-utc-date.js.map
- @ipohjs/calendar/dist/helpers/get-formatter.d.ts
- @ipohjs/calendar/dist/helpers/get-formatter.d.ts.map
- @ipohjs/calendar/dist/helpers/get-formatter.js
- @ipohjs/calendar/dist/helpers/get-formatter.js.map
- @ipohjs/calendar/dist/helpers/get-week-number.d.ts
- @ipohjs/calendar/dist/helpers/get-week-number.d.ts.map
- @ipohjs/calendar/dist/helpers/get-week-number.js
- @ipohjs/calendar/dist/helpers/get-week-number.js.map
- @ipohjs/calendar/dist/helpers/get-weekdays.d.ts
- @ipohjs/calendar/dist/helpers/get-weekdays.d.ts.map
- @ipohjs/calendar/dist/helpers/get-weekdays.js
- @ipohjs/calendar/dist/helpers/get-weekdays.js.map
- @ipohjs/calendar/dist/helpers/normalize-weekday.d.ts
- @ipohjs/calendar/dist/helpers/normalize-weekday.d.ts.map
- @ipohjs/calendar/dist/helpers/normalize-weekday.js
- @ipohjs/calendar/dist/helpers/normalize-weekday.js.map
- @ipohjs/calendar/dist/helpers/to-day-difference-inclusive.d.ts
- @ipohjs/calendar/dist/helpers/to-day-difference-inclusive.d.ts.map
- @ipohjs/calendar/dist/helpers/to-day-difference-inclusive.js
- @ipohjs/calendar/dist/helpers/to-day-difference-inclusive.js.map
- @ipohjs/calendar/dist/helpers/to-utc-date.d.ts
- @ipohjs/calendar/dist/helpers/to-utc-date.d.ts.map
- @ipohjs/calendar/dist/helpers/to-utc-date.js
- @ipohjs/calendar/dist/helpers/to-utc-date.js.map
- @ipohjs/calendar/dist/helpers/to-valid-weekday.d.ts
- @ipohjs/calendar/dist/helpers/to-valid-weekday.d.ts.map
- @ipohjs/calendar/dist/helpers/to-valid-weekday.js
- @ipohjs/calendar/dist/helpers/to-valid-weekday.js.map
- @ipohjs/calendar/dist/helpers/types.d.ts
- @ipohjs/calendar/dist/helpers/types.d.ts.map
- @ipohjs/calendar/dist/helpers/types.js
- @ipohjs/calendar/dist/helpers/types.js.map
- @ipohjs/calendar/dist/types.d.ts
- @ipohjs/calendar/dist/types.d.ts.map
- @ipohjs/calendar/dist/types.js
- @ipohjs/calendar/dist/types.js.map
- @ipohjs/calendar/from-parts-to-utc-date
- @ipohjs/calendar/get-formatter
- @ipohjs/calendar/get-week-number
- @ipohjs/calendar/get-weekdays
- @ipohjs/calendar/normalize-weekday
- @ipohjs/calendar/to-day-difference-inclusive
- @ipohjs/calendar/to-utc-date
- @ipohjs/calendar/to-valid-weekday
Readme
calendar
Minimal module to compute a calendar
Calendar module for AppDatepicker.
Table of contents
Usage
import { calendar } from 'nodemod/dist/calendar/index.js';
import { getWeekdays } from 'nodemod/dist/calendar/helpers/get-weekdays.js';
import { getFormatter } from 'nodemod/dist/calendar/helpers/get-formatter.js';
const weekdaysOptions = {
longWeekdayFormat: getFormatter(Intl.DateTimeFormat('en-US', { weekday: 'long' })),
narrowWeekdayFormat: getFormatter(Intl.DateTimeFormat('en-US', { weekday: 'narrow' })),
// Optional properties and their default values:
// firstDayOfWeek: 0,
// showWeekNumber: false,
// weekLabel: 'Wk',
};
const weekdays = getWeekdays(weekdaysOptions);
const calendarOptions = {
dayFormat: getFormatter(Intl.DateTimeFormat('en-US', { day: 'numeric' })),
fullDateFormat: getFormatter(Intl.DateTimeFormat('en-US', { year: 'numeric', month: 'short', day: 'numeric' })),
locale: 'en-US',
selectedDate: new Date('2020-02-02'),
// Optional properties and their default values:
// disabledDates: [],
// disabledDays: [],
// firstDayOfWeek: 0,
// max,
// min,
// showWeekNumber: false,
// weekNumberType: 'first-4-day-week',
};
const calendarData = calendar(calendarOptions);
console.table([
weekdays.map(n => n.value),
...calendarData.calendar.map(n => n.map(o => o.value)),
]);API Reference
Typings
WeekNumberType
type WeekNumberType = 'first-4-day-week' | 'first-day-of-year' | 'first-full-week';CalendarOptions
interface CalendarOptions {
dayFormat: Intl.DateTimeFormat['format'];
fullDateFormat: Intl.DateTimeFormat['format'];
locale: string;
selectedDate: Date;
disableDates?: Date[]; // Default: []
disabledDays?: number[]; // Default: []
firstDayOfWeek?: number; // Default: 0
max?: Date;
min?: Date;
showWeekNumber?: boolean; // Default: false
weekLabel?: string; // Default: 'Week'
weekNumberType?: WeekNumberType; // Default: 'first-4-day-week'
}Calendar
interface CalendarDay {
disabled: boolean;
fullDate: Date | null;
key: string;
label: string | null;
value: string | null;
}
interface Calendar {
calendar: CalendarDay[][];
disabledDatesSet: Set<number>;
disabledDaysSet: Set<number>;
key: string;
}GetWeekdaysOptions
longWeekdayFormat: Intl.DateTimeFormat['format'];
narrowWeekdayFormat: Intl.DateTimeFormat['format'];
firstDayOfWeek?: number; // Default: 0
showWeekNumber?: boolean; // Default: false
weekLabel?: string; // Default: 'Wk'CalendarWeekday
interface CalendarWeekday {
label: string;
value: string;
}calendar(options)
options<CalendarOptions> Calendar options.dayFormat<Intl.DateTimeFormat.prototype.format> DateTime formatter forday. It is recommended to use getFormatter().fullDateFormat<Intl.DateTimeFormat.prototype.format> DateTime formatter forfullDate. It is recommended to use getFormatter().locale<string> ISO-693 language code. See ISO Language Code Table.selectedDate<Date> Selected date. Calendar displays based on the current month of the selected date.firstDayOfWeek<?number> Optional first day of a week. Defaults to0(Sunday).showWeekNumber<?boolean> If true, show week number. Defaults tofalse.weekLabel<?string> Optional label for week number. Defaults toWeek.disabledDates<?Array<Date>> Optional list of disabled dates. Each disabled dates on the calendar are not selectable nor focusable. Defaults to[].disabledDays<?Array<number>> Optional list of disabled days. Each value represents the week day to be disabled, i.e.1means all dates which are Monday are disabled, not selectable nor focusable. Defaults to[].max<?Date> Optional max date.min<?Date> Optional min date.weekNumberType<?WeekNumberType> Optional week number type. Defaults tofirst-4-day-week.
- returns: <Calendar> An object that contains the 2D array of the calendar, unique key of the calendar, a Set of disabled dates, and a Set of disabled days.
getWeekdays(options)
options<GetWeekdaysOptions> Weekdays options.longWeekdayFormat<Intl.DateTimeFormat.prototype.format> DateTime formatter for longweekday. It is recommended to use getFormatter().narrowWeekdayFormat<Intl.DateTimeFormat.prototype.format> DateTime formatter for narrowweekday. It is recommended to use getFormatter().firstDayOfWeek<?number> Optional first day of a week. Defaults to0(Sunday).showWeekNumber<?boolean> If true, show week number. Defaults tofalse.weekLabel<?string> Optional label for week number. Defaults toWk.
- returns: <Array<CalendarWeekday>> A list of calendar weekday.
getFormatter(formatter)
formatter<Intl.DateTimeFormat.prototype.format> DateTime formatter.- returns: <Function> A wrapper to the DateTime formatter.
This helper function strips any LTR marking in a formatted date/ time string. IE11 includes LTR mark in all formatted output however all modern browsers do not do that anymore.
License
MIT License © Rong Sen Ng