UNPKG

mui-easy-table

Version:
1,739 lines (1,568 loc) 515 kB
import { jsx, jsxs, Fragment } from 'react/jsx-runtime'; import { Popper, Grow, Box, ClickAwayListener, Paper, MenuList, MenuItem, Switch, useTheme, IconButton, ListItemIcon, Checkbox, ListItemText } from '@mui/material'; import * as React from 'react'; import React__default, { useState, useMemo, createContext, useContext, useCallback } from 'react'; import emStyled from '@emotion/styled'; import '@emotion/react'; import require$$2 from 'react-dom'; import { FilterAlt, HideSourceOutlined } from '@mui/icons-material'; function EasyPopper({ children, anchorEl, sx, onClose }) { const handleClose = () => { onClose(); }; const open = Boolean(anchorEl); return /* @__PURE__ */ jsx( Popper, { sx: { ...sx, zIndex: 2e3 }, open, anchorEl, transition: true, disablePortal: true, placement: "bottom-start", children: ({ TransitionProps, placement }) => /* @__PURE__ */ jsx( Grow, { ...TransitionProps, style: { transformOrigin: placement === "bottom-start" ? "left top" : "left bottom" }, children: /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(ClickAwayListener, { onClickAway: handleClose, children }) }) } ) } ); } function ColumnManagerPopper(props) { const { columnState, columns, updateColumnOrder, updateColumnHidden, anchorEl, setAnchorEl } = props; const handleClose = () => { setAnchorEl(null); }; return /* @__PURE__ */ jsx( EasyPopper, { anchorEl, onClose: handleClose, children: /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(MenuList, { children: columnState.map((col) => /* @__PURE__ */ jsxs(MenuItem, { children: [ /* @__PURE__ */ jsx( Switch, { checked: !col.hidden, onChange: (e) => { const nextChecked = e.target.checked; updateColumnHidden(col.path, !nextChecked); } } ), columns.find((x) => x.path === col.path)?.headerName ] }, col.path)) }) }) } ); } /** * @module constants * @summary Useful constants * @description * Collection of useful date constants. * * The constants could be imported from `date-fns/constants`: * * ```ts * import { maxTime, minTime } from "./constants/date-fns/constants"; * * function isAllowedTime(time) { * return time <= maxTime && time >= minTime; * } * ``` */ /** * @constant * @name millisecondsInWeek * @summary Milliseconds in 1 week. */ const millisecondsInWeek = 604800000; /** * @constant * @name millisecondsInDay * @summary Milliseconds in 1 day. */ const millisecondsInDay = 86400000; /** * @constant * @name constructFromSymbol * @summary Symbol enabling Date extensions to inherit properties from the reference date. * * The symbol is used to enable the `constructFrom` function to construct a date * using a reference date and a value. It allows to transfer extra properties * from the reference date to the new date. It's useful for extensions like * [`TZDate`](https://github.com/date-fns/tz) that accept a time zone as * a constructor argument. */ const constructFromSymbol = Symbol.for("constructDateFrom"); /** * @name constructFrom * @category Generic Helpers * @summary Constructs a date using the reference date and the value * * @description * The function constructs a new date using the constructor from the reference * date and the given value. It helps to build generic functions that accept * date extensions. * * It defaults to `Date` if the passed reference date is a number or a string. * * Starting from v3.7.0, it allows to construct a date using `[Symbol.for("constructDateFrom")]` * enabling to transfer extra properties from the reference date to the new date. * It's useful for extensions like [`TZDate`](https://github.com/date-fns/tz) * that accept a time zone as a constructor argument. * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * * @param date - The reference date to take constructor from * @param value - The value to create the date * * @returns Date initialized using the given date and value * * @example * import { constructFrom } from "./constructFrom/date-fns"; * * // A function that clones a date preserving the original type * function cloneDate<DateType extends Date>(date: DateType): DateType { * return constructFrom( * date, // Use constructor from the given date * date.getTime() // Use the date value to create a new date * ); * } */ function constructFrom(date, value) { if (typeof date === "function") return date(value); if (date && typeof date === "object" && constructFromSymbol in date) return date[constructFromSymbol](value); if (date instanceof Date) return new date.constructor(value); return new Date(value); } /** * @name toDate * @category Common Helpers * @summary Convert the given argument to an instance of Date. * * @description * Convert the given argument to an instance of Date. * * If the argument is an instance of Date, the function returns its clone. * * If the argument is a number, it is treated as a timestamp. * * If the argument is none of the above, the function returns Invalid Date. * * Starting from v3.7.0, it clones a date using `[Symbol.for("constructDateFrom")]` * enabling to transfer extra properties from the reference date to the new date. * It's useful for extensions like [`TZDate`](https://github.com/date-fns/tz) * that accept a time zone as a constructor argument. * * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`. * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param argument - The value to convert * * @returns The parsed date in the local time zone * * @example * // Clone the date: * const result = toDate(new Date(2014, 1, 11, 11, 30, 30)) * //=> Tue Feb 11 2014 11:30:30 * * @example * // Convert the timestamp to date: * const result = toDate(1392098430000) * //=> Tue Feb 11 2014 11:30:30 */ function toDate(argument, context) { // [TODO] Get rid of `toDate` or `constructFrom`? return constructFrom(context || argument, argument); } let defaultOptions = {}; function getDefaultOptions() { return defaultOptions; } /** * The {@link startOfWeek} function options. */ /** * @name startOfWeek * @category Week Helpers * @summary Return the start of a week for the given date. * * @description * Return the start of a week for the given date. * The result will be in the local timezone. * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param date - The original date * @param options - An object with options * * @returns The start of a week * * @example * // The start of a week for 2 September 2014 11:55:00: * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0)) * //=> Sun Aug 31 2014 00:00:00 * * @example * // If the week starts on Monday, the start of the week for 2 September 2014 11:55:00: * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 }) * //=> Mon Sep 01 2014 00:00:00 */ function startOfWeek(date, options) { const defaultOptions = getDefaultOptions(); const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? defaultOptions.weekStartsOn ?? defaultOptions.locale?.options?.weekStartsOn ?? 0; const _date = toDate(date, options?.in); const day = _date.getDay(); const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn; _date.setDate(_date.getDate() - diff); _date.setHours(0, 0, 0, 0); return _date; } /** * The {@link startOfISOWeek} function options. */ /** * @name startOfISOWeek * @category ISO Week Helpers * @summary Return the start of an ISO week for the given date. * * @description * Return the start of an ISO week for the given date. * The result will be in the local timezone. * * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param date - The original date * @param options - An object with options * * @returns The start of an ISO week * * @example * // The start of an ISO week for 2 September 2014 11:55:00: * const result = startOfISOWeek(new Date(2014, 8, 2, 11, 55, 0)) * //=> Mon Sep 01 2014 00:00:00 */ function startOfISOWeek(date, options) { return startOfWeek(date, { ...options, weekStartsOn: 1 }); } /** * The {@link getISOWeekYear} function options. */ /** * @name getISOWeekYear * @category ISO Week-Numbering Year Helpers * @summary Get the ISO week-numbering year of the given date. * * @description * Get the ISO week-numbering year of the given date, * which always starts 3 days before the year's first Thursday. * * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date * * @param date - The given date * * @returns The ISO week-numbering year * * @example * // Which ISO-week numbering year is 2 January 2005? * const result = getISOWeekYear(new Date(2005, 0, 2)) * //=> 2004 */ function getISOWeekYear(date, options) { const _date = toDate(date, options?.in); const year = _date.getFullYear(); const fourthOfJanuaryOfNextYear = constructFrom(_date, 0); fourthOfJanuaryOfNextYear.setFullYear(year + 1, 0, 4); fourthOfJanuaryOfNextYear.setHours(0, 0, 0, 0); const startOfNextYear = startOfISOWeek(fourthOfJanuaryOfNextYear); const fourthOfJanuaryOfThisYear = constructFrom(_date, 0); fourthOfJanuaryOfThisYear.setFullYear(year, 0, 4); fourthOfJanuaryOfThisYear.setHours(0, 0, 0, 0); const startOfThisYear = startOfISOWeek(fourthOfJanuaryOfThisYear); if (_date.getTime() >= startOfNextYear.getTime()) { return year + 1; } else if (_date.getTime() >= startOfThisYear.getTime()) { return year; } else { return year - 1; } } /** * Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds. * They usually appear for dates that denote time before the timezones were introduced * (e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891 * and GMT+01:00:00 after that date) * * Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above, * which would lead to incorrect calculations. * * This function returns the timezone offset in milliseconds that takes seconds in account. */ function getTimezoneOffsetInMilliseconds(date) { const _date = toDate(date); const utcDate = new Date( Date.UTC( _date.getFullYear(), _date.getMonth(), _date.getDate(), _date.getHours(), _date.getMinutes(), _date.getSeconds(), _date.getMilliseconds(), ), ); utcDate.setUTCFullYear(_date.getFullYear()); return +date - +utcDate; } function normalizeDates(context, ...dates) { const normalize = constructFrom.bind( null, dates.find((date) => typeof date === "object"), ); return dates.map(normalize); } /** * The {@link startOfDay} function options. */ /** * @name startOfDay * @category Day Helpers * @summary Return the start of a day for the given date. * * @description * Return the start of a day for the given date. * The result will be in the local timezone. * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param date - The original date * @param options - The options * * @returns The start of a day * * @example * // The start of a day for 2 September 2014 11:55:00: * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0)) * //=> Tue Sep 02 2014 00:00:00 */ function startOfDay(date, options) { const _date = toDate(date, options?.in); _date.setHours(0, 0, 0, 0); return _date; } /** * The {@link differenceInCalendarDays} function options. */ /** * @name differenceInCalendarDays * @category Day Helpers * @summary Get the number of calendar days between the given dates. * * @description * Get the number of calendar days between the given dates. This means that the times are removed * from the dates and then the difference in days is calculated. * * @param laterDate - The later date * @param earlierDate - The earlier date * @param options - The options object * * @returns The number of calendar days * * @example * // How many calendar days are between * // 2 July 2011 23:00:00 and 2 July 2012 00:00:00? * const result = differenceInCalendarDays( * new Date(2012, 6, 2, 0, 0), * new Date(2011, 6, 2, 23, 0) * ) * //=> 366 * // How many calendar days are between * // 2 July 2011 23:59:00 and 3 July 2011 00:01:00? * const result = differenceInCalendarDays( * new Date(2011, 6, 3, 0, 1), * new Date(2011, 6, 2, 23, 59) * ) * //=> 1 */ function differenceInCalendarDays(laterDate, earlierDate, options) { const [laterDate_, earlierDate_] = normalizeDates( options?.in, laterDate, earlierDate, ); const laterStartOfDay = startOfDay(laterDate_); const earlierStartOfDay = startOfDay(earlierDate_); const laterTimestamp = +laterStartOfDay - getTimezoneOffsetInMilliseconds(laterStartOfDay); const earlierTimestamp = +earlierStartOfDay - getTimezoneOffsetInMilliseconds(earlierStartOfDay); // Round the number of days to the nearest integer because the number of // milliseconds in a day is not constant (e.g. it's different in the week of // the daylight saving time clock shift). return Math.round((laterTimestamp - earlierTimestamp) / millisecondsInDay); } /** * The {@link startOfISOWeekYear} function options. */ /** * @name startOfISOWeekYear * @category ISO Week-Numbering Year Helpers * @summary Return the start of an ISO week-numbering year for the given date. * * @description * Return the start of an ISO week-numbering year, * which always starts 3 days before the year's first Thursday. * The result will be in the local timezone. * * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param date - The original date * @param options - An object with options * * @returns The start of an ISO week-numbering year * * @example * // The start of an ISO week-numbering year for 2 July 2005: * const result = startOfISOWeekYear(new Date(2005, 6, 2)) * //=> Mon Jan 03 2005 00:00:00 */ function startOfISOWeekYear(date, options) { const year = getISOWeekYear(date, options); const fourthOfJanuary = constructFrom(date, 0); fourthOfJanuary.setFullYear(year, 0, 4); fourthOfJanuary.setHours(0, 0, 0, 0); return startOfISOWeek(fourthOfJanuary); } /** * @name isDate * @category Common Helpers * @summary Is the given value a date? * * @description * Returns true if the given value is an instance of Date. The function works for dates transferred across iframes. * * @param value - The value to check * * @returns True if the given value is a date * * @example * // For a valid date: * const result = isDate(new Date()) * //=> true * * @example * // For an invalid date: * const result = isDate(new Date(NaN)) * //=> true * * @example * // For some value: * const result = isDate('2014-02-31') * //=> false * * @example * // For an object: * const result = isDate({}) * //=> false */ function isDate(value) { return ( value instanceof Date || (typeof value === "object" && Object.prototype.toString.call(value) === "[object Date]") ); } /** * @name isValid * @category Common Helpers * @summary Is the given date valid? * * @description * Returns false if argument is Invalid Date and true otherwise. * Argument is converted to Date using `toDate`. See [toDate](https://date-fns.org/docs/toDate) * Invalid Date is a Date, whose time value is NaN. * * Time value of Date: http://es5.github.io/#x15.9.1.1 * * @param date - The date to check * * @returns The date is valid * * @example * // For the valid date: * const result = isValid(new Date(2014, 1, 31)) * //=> true * * @example * // For the value, convertible into a date: * const result = isValid(1393804800000) * //=> true * * @example * // For the invalid date: * const result = isValid(new Date('')) * //=> false */ function isValid(date) { return !((!isDate(date) && typeof date !== "number") || isNaN(+toDate(date))); } /** * The {@link startOfYear} function options. */ /** * @name startOfYear * @category Year Helpers * @summary Return the start of a year for the given date. * * @description * Return the start of a year for the given date. * The result will be in the local timezone. * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type, it is the type returned from the context function if it is passed, or inferred from the arguments. * * @param date - The original date * @param options - The options * * @returns The start of a year * * @example * // The start of a year for 2 September 2014 11:55:00: * const result = startOfYear(new Date(2014, 8, 2, 11, 55, 00)) * //=> Wed Jan 01 2014 00:00:00 */ function startOfYear(date, options) { const date_ = toDate(date, options?.in); date_.setFullYear(date_.getFullYear(), 0, 1); date_.setHours(0, 0, 0, 0); return date_; } const formatDistanceLocale = { lessThanXSeconds: { one: "less than a second", other: "less than {{count}} seconds", }, xSeconds: { one: "1 second", other: "{{count}} seconds", }, halfAMinute: "half a minute", lessThanXMinutes: { one: "less than a minute", other: "less than {{count}} minutes", }, xMinutes: { one: "1 minute", other: "{{count}} minutes", }, aboutXHours: { one: "about 1 hour", other: "about {{count}} hours", }, xHours: { one: "1 hour", other: "{{count}} hours", }, xDays: { one: "1 day", other: "{{count}} days", }, aboutXWeeks: { one: "about 1 week", other: "about {{count}} weeks", }, xWeeks: { one: "1 week", other: "{{count}} weeks", }, aboutXMonths: { one: "about 1 month", other: "about {{count}} months", }, xMonths: { one: "1 month", other: "{{count}} months", }, aboutXYears: { one: "about 1 year", other: "about {{count}} years", }, xYears: { one: "1 year", other: "{{count}} years", }, overXYears: { one: "over 1 year", other: "over {{count}} years", }, almostXYears: { one: "almost 1 year", other: "almost {{count}} years", }, }; const formatDistance = (token, count, options) => { let result; const tokenValue = formatDistanceLocale[token]; if (typeof tokenValue === "string") { result = tokenValue; } else if (count === 1) { result = tokenValue.one; } else { result = tokenValue.other.replace("{{count}}", count.toString()); } if (options?.addSuffix) { if (options.comparison && options.comparison > 0) { return "in " + result; } else { return result + " ago"; } } return result; }; function buildFormatLongFn(args) { return (options = {}) => { // TODO: Remove String() const width = options.width ? String(options.width) : args.defaultWidth; const format = args.formats[width] || args.formats[args.defaultWidth]; return format; }; } const dateFormats = { full: "EEEE, MMMM do, y", long: "MMMM do, y", medium: "MMM d, y", short: "MM/dd/yyyy", }; const timeFormats = { full: "h:mm:ss a zzzz", long: "h:mm:ss a z", medium: "h:mm:ss a", short: "h:mm a", }; const dateTimeFormats = { full: "{{date}} 'at' {{time}}", long: "{{date}} 'at' {{time}}", medium: "{{date}}, {{time}}", short: "{{date}}, {{time}}", }; const formatLong = { date: buildFormatLongFn({ formats: dateFormats, defaultWidth: "full", }), time: buildFormatLongFn({ formats: timeFormats, defaultWidth: "full", }), dateTime: buildFormatLongFn({ formats: dateTimeFormats, defaultWidth: "full", }), }; const formatRelativeLocale = { lastWeek: "'last' eeee 'at' p", yesterday: "'yesterday at' p", today: "'today at' p", tomorrow: "'tomorrow at' p", nextWeek: "eeee 'at' p", other: "P", }; const formatRelative = (token, _date, _baseDate, _options) => formatRelativeLocale[token]; /** * The localize function argument callback which allows to convert raw value to * the actual type. * * @param value - The value to convert * * @returns The converted value */ /** * The map of localized values for each width. */ /** * The index type of the locale unit value. It types conversion of units of * values that don't start at 0 (i.e. quarters). */ /** * Converts the unit value to the tuple of values. */ /** * The tuple of localized era values. The first element represents BC, * the second element represents AD. */ /** * The tuple of localized quarter values. The first element represents Q1. */ /** * The tuple of localized day values. The first element represents Sunday. */ /** * The tuple of localized month values. The first element represents January. */ function buildLocalizeFn(args) { return (value, options) => { const context = options?.context ? String(options.context) : "standalone"; let valuesArray; if (context === "formatting" && args.formattingValues) { const defaultWidth = args.defaultFormattingWidth || args.defaultWidth; const width = options?.width ? String(options.width) : defaultWidth; valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth]; } else { const defaultWidth = args.defaultWidth; const width = options?.width ? String(options.width) : args.defaultWidth; valuesArray = args.values[width] || args.values[defaultWidth]; } const index = args.argumentCallback ? args.argumentCallback(value) : value; // @ts-expect-error - For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it! return valuesArray[index]; }; } const eraValues = { narrow: ["B", "A"], abbreviated: ["BC", "AD"], wide: ["Before Christ", "Anno Domini"], }; const quarterValues = { narrow: ["1", "2", "3", "4"], abbreviated: ["Q1", "Q2", "Q3", "Q4"], wide: ["1st quarter", "2nd quarter", "3rd quarter", "4th quarter"], }; // Note: in English, the names of days of the week and months are capitalized. // If you are making a new locale based on this one, check if the same is true for the language you're working on. // Generally, formatted dates should look like they are in the middle of a sentence, // e.g. in Spanish language the weekdays and months should be in the lowercase. const monthValues = { narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"], abbreviated: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", ], wide: [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December", ], }; const dayValues = { narrow: ["S", "M", "T", "W", "T", "F", "S"], short: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], abbreviated: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], wide: [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", ], }; const dayPeriodValues = { narrow: { am: "a", pm: "p", midnight: "mi", noon: "n", morning: "morning", afternoon: "afternoon", evening: "evening", night: "night", }, abbreviated: { am: "AM", pm: "PM", midnight: "midnight", noon: "noon", morning: "morning", afternoon: "afternoon", evening: "evening", night: "night", }, wide: { am: "a.m.", pm: "p.m.", midnight: "midnight", noon: "noon", morning: "morning", afternoon: "afternoon", evening: "evening", night: "night", }, }; const formattingDayPeriodValues = { narrow: { am: "a", pm: "p", midnight: "mi", noon: "n", morning: "in the morning", afternoon: "in the afternoon", evening: "in the evening", night: "at night", }, abbreviated: { am: "AM", pm: "PM", midnight: "midnight", noon: "noon", morning: "in the morning", afternoon: "in the afternoon", evening: "in the evening", night: "at night", }, wide: { am: "a.m.", pm: "p.m.", midnight: "midnight", noon: "noon", morning: "in the morning", afternoon: "in the afternoon", evening: "in the evening", night: "at night", }, }; const ordinalNumber = (dirtyNumber, _options) => { const number = Number(dirtyNumber); // If ordinal numbers depend on context, for example, // if they are different for different grammatical genders, // use `options.unit`. // // `unit` can be 'year', 'quarter', 'month', 'week', 'date', 'dayOfYear', // 'day', 'hour', 'minute', 'second'. const rem100 = number % 100; if (rem100 > 20 || rem100 < 10) { switch (rem100 % 10) { case 1: return number + "st"; case 2: return number + "nd"; case 3: return number + "rd"; } } return number + "th"; }; const localize = { ordinalNumber, era: buildLocalizeFn({ values: eraValues, defaultWidth: "wide", }), quarter: buildLocalizeFn({ values: quarterValues, defaultWidth: "wide", argumentCallback: (quarter) => quarter - 1, }), month: buildLocalizeFn({ values: monthValues, defaultWidth: "wide", }), day: buildLocalizeFn({ values: dayValues, defaultWidth: "wide", }), dayPeriod: buildLocalizeFn({ values: dayPeriodValues, defaultWidth: "wide", formattingValues: formattingDayPeriodValues, defaultFormattingWidth: "wide", }), }; function buildMatchFn(args) { return (string, options = {}) => { const width = options.width; const matchPattern = (width && args.matchPatterns[width]) || args.matchPatterns[args.defaultMatchWidth]; const matchResult = string.match(matchPattern); if (!matchResult) { return null; } const matchedString = matchResult[0]; const parsePatterns = (width && args.parsePatterns[width]) || args.parsePatterns[args.defaultParseWidth]; const key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, (pattern) => pattern.test(matchedString)) : // [TODO] -- I challenge you to fix the type findKey(parsePatterns, (pattern) => pattern.test(matchedString)); let value; value = args.valueCallback ? args.valueCallback(key) : key; value = options.valueCallback ? // [TODO] -- I challenge you to fix the type options.valueCallback(value) : value; const rest = string.slice(matchedString.length); return { value, rest }; }; } function findKey(object, predicate) { for (const key in object) { if ( Object.prototype.hasOwnProperty.call(object, key) && predicate(object[key]) ) { return key; } } return undefined; } function findIndex(array, predicate) { for (let key = 0; key < array.length; key++) { if (predicate(array[key])) { return key; } } return undefined; } function buildMatchPatternFn(args) { return (string, options = {}) => { const matchResult = string.match(args.matchPattern); if (!matchResult) return null; const matchedString = matchResult[0]; const parseResult = string.match(args.parsePattern); if (!parseResult) return null; let value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0]; // [TODO] I challenge you to fix the type value = options.valueCallback ? options.valueCallback(value) : value; const rest = string.slice(matchedString.length); return { value, rest }; }; } const matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i; const parseOrdinalNumberPattern = /\d+/i; const matchEraPatterns = { narrow: /^(b|a)/i, abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i, wide: /^(before christ|before common era|anno domini|common era)/i, }; const parseEraPatterns = { any: [/^b/i, /^(a|c)/i], }; const matchQuarterPatterns = { narrow: /^[1234]/i, abbreviated: /^q[1234]/i, wide: /^[1234](th|st|nd|rd)? quarter/i, }; const parseQuarterPatterns = { any: [/1/i, /2/i, /3/i, /4/i], }; const matchMonthPatterns = { narrow: /^[jfmasond]/i, abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i, wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i, }; const parseMonthPatterns = { narrow: [ /^j/i, /^f/i, /^m/i, /^a/i, /^m/i, /^j/i, /^j/i, /^a/i, /^s/i, /^o/i, /^n/i, /^d/i, ], any: [ /^ja/i, /^f/i, /^mar/i, /^ap/i, /^may/i, /^jun/i, /^jul/i, /^au/i, /^s/i, /^o/i, /^n/i, /^d/i, ], }; const matchDayPatterns = { narrow: /^[smtwf]/i, short: /^(su|mo|tu|we|th|fr|sa)/i, abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i, wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i, }; const parseDayPatterns = { narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i], any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i], }; const matchDayPeriodPatterns = { narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i, any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i, }; const parseDayPeriodPatterns = { any: { am: /^a/i, pm: /^p/i, midnight: /^mi/i, noon: /^no/i, morning: /morning/i, afternoon: /afternoon/i, evening: /evening/i, night: /night/i, }, }; const match = { ordinalNumber: buildMatchPatternFn({ matchPattern: matchOrdinalNumberPattern, parsePattern: parseOrdinalNumberPattern, valueCallback: (value) => parseInt(value, 10), }), era: buildMatchFn({ matchPatterns: matchEraPatterns, defaultMatchWidth: "wide", parsePatterns: parseEraPatterns, defaultParseWidth: "any", }), quarter: buildMatchFn({ matchPatterns: matchQuarterPatterns, defaultMatchWidth: "wide", parsePatterns: parseQuarterPatterns, defaultParseWidth: "any", valueCallback: (index) => index + 1, }), month: buildMatchFn({ matchPatterns: matchMonthPatterns, defaultMatchWidth: "wide", parsePatterns: parseMonthPatterns, defaultParseWidth: "any", }), day: buildMatchFn({ matchPatterns: matchDayPatterns, defaultMatchWidth: "wide", parsePatterns: parseDayPatterns, defaultParseWidth: "any", }), dayPeriod: buildMatchFn({ matchPatterns: matchDayPeriodPatterns, defaultMatchWidth: "any", parsePatterns: parseDayPeriodPatterns, defaultParseWidth: "any", }), }; /** * @category Locales * @summary English locale (United States). * @language English * @iso-639-2 eng * @author Sasha Koss [@kossnocorp](https://github.com/kossnocorp) * @author Lesha Koss [@leshakoss](https://github.com/leshakoss) */ const enUS = { code: "en-US", formatDistance: formatDistance, formatLong: formatLong, formatRelative: formatRelative, localize: localize, match: match, options: { weekStartsOn: 0 /* Sunday */, firstWeekContainsDate: 1, }, }; /** * The {@link getDayOfYear} function options. */ /** * @name getDayOfYear * @category Day Helpers * @summary Get the day of the year of the given date. * * @description * Get the day of the year of the given date. * * @param date - The given date * @param options - The options * * @returns The day of year * * @example * // Which day of the year is 2 July 2014? * const result = getDayOfYear(new Date(2014, 6, 2)) * //=> 183 */ function getDayOfYear(date, options) { const _date = toDate(date, options?.in); const diff = differenceInCalendarDays(_date, startOfYear(_date)); const dayOfYear = diff + 1; return dayOfYear; } /** * The {@link getISOWeek} function options. */ /** * @name getISOWeek * @category ISO Week Helpers * @summary Get the ISO week of the given date. * * @description * Get the ISO week of the given date. * * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date * * @param date - The given date * @param options - The options * * @returns The ISO week * * @example * // Which week of the ISO-week numbering year is 2 January 2005? * const result = getISOWeek(new Date(2005, 0, 2)) * //=> 53 */ function getISOWeek(date, options) { const _date = toDate(date, options?.in); const diff = +startOfISOWeek(_date) - +startOfISOWeekYear(_date); // Round the number of weeks to the nearest integer because the number of // milliseconds in a week is not constant (e.g. it's different in the week of // the daylight saving time clock shift). return Math.round(diff / millisecondsInWeek) + 1; } /** * The {@link getWeekYear} function options. */ /** * @name getWeekYear * @category Week-Numbering Year Helpers * @summary Get the local week-numbering year of the given date. * * @description * Get the local week-numbering year of the given date. * The exact calculation depends on the values of * `options.weekStartsOn` (which is the index of the first day of the week) * and `options.firstWeekContainsDate` (which is the day of January, which is always in * the first week of the week-numbering year) * * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system * * @param date - The given date * @param options - An object with options. * * @returns The local week-numbering year * * @example * // Which week numbering year is 26 December 2004 with the default settings? * const result = getWeekYear(new Date(2004, 11, 26)) * //=> 2005 * * @example * // Which week numbering year is 26 December 2004 if week starts on Saturday? * const result = getWeekYear(new Date(2004, 11, 26), { weekStartsOn: 6 }) * //=> 2004 * * @example * // Which week numbering year is 26 December 2004 if the first week contains 4 January? * const result = getWeekYear(new Date(2004, 11, 26), { firstWeekContainsDate: 4 }) * //=> 2004 */ function getWeekYear(date, options) { const _date = toDate(date, options?.in); const year = _date.getFullYear(); const defaultOptions = getDefaultOptions(); const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions.firstWeekContainsDate ?? defaultOptions.locale?.options?.firstWeekContainsDate ?? 1; const firstWeekOfNextYear = constructFrom(options?.in || date, 0); firstWeekOfNextYear.setFullYear(year + 1, 0, firstWeekContainsDate); firstWeekOfNextYear.setHours(0, 0, 0, 0); const startOfNextYear = startOfWeek(firstWeekOfNextYear, options); const firstWeekOfThisYear = constructFrom(options?.in || date, 0); firstWeekOfThisYear.setFullYear(year, 0, firstWeekContainsDate); firstWeekOfThisYear.setHours(0, 0, 0, 0); const startOfThisYear = startOfWeek(firstWeekOfThisYear, options); if (+_date >= +startOfNextYear) { return year + 1; } else if (+_date >= +startOfThisYear) { return year; } else { return year - 1; } } /** * The {@link startOfWeekYear} function options. */ /** * @name startOfWeekYear * @category Week-Numbering Year Helpers * @summary Return the start of a local week-numbering year for the given date. * * @description * Return the start of a local week-numbering year. * The exact calculation depends on the values of * `options.weekStartsOn` (which is the index of the first day of the week) * and `options.firstWeekContainsDate` (which is the day of January, which is always in * the first week of the week-numbering year) * * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system * * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc). * @typeParam ResultDate - The result `Date` type. * * @param date - The original date * @param options - An object with options * * @returns The start of a week-numbering year * * @example * // The start of an a week-numbering year for 2 July 2005 with default settings: * const result = startOfWeekYear(new Date(2005, 6, 2)) * //=> Sun Dec 26 2004 00:00:00 * * @example * // The start of a week-numbering year for 2 July 2005 * // if Monday is the first day of week * // and 4 January is always in the first week of the year: * const result = startOfWeekYear(new Date(2005, 6, 2), { * weekStartsOn: 1, * firstWeekContainsDate: 4 * }) * //=> Mon Jan 03 2005 00:00:00 */ function startOfWeekYear(date, options) { const defaultOptions = getDefaultOptions(); const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions.firstWeekContainsDate ?? defaultOptions.locale?.options?.firstWeekContainsDate ?? 1; const year = getWeekYear(date, options); const firstWeek = constructFrom(options?.in || date, 0); firstWeek.setFullYear(year, 0, firstWeekContainsDate); firstWeek.setHours(0, 0, 0, 0); const _date = startOfWeek(firstWeek, options); return _date; } /** * The {@link getWeek} function options. */ /** * @name getWeek * @category Week Helpers * @summary Get the local week index of the given date. * * @description * Get the local week index of the given date. * The exact calculation depends on the values of * `options.weekStartsOn` (which is the index of the first day of the week) * and `options.firstWeekContainsDate` (which is the day of January, which is always in * the first week of the week-numbering year) * * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system * * @param date - The given date * @param options - An object with options * * @returns The week * * @example * // Which week of the local week numbering year is 2 January 2005 with default options? * const result = getWeek(new Date(2005, 0, 2)) * //=> 2 * * @example * // Which week of the local week numbering year is 2 January 2005, * // if Monday is the first day of the week, * // and the first week of the year always contains 4 January? * const result = getWeek(new Date(2005, 0, 2), { * weekStartsOn: 1, * firstWeekContainsDate: 4 * }) * //=> 53 */ function getWeek(date, options) { const _date = toDate(date, options?.in); const diff = +startOfWeek(_date, options) - +startOfWeekYear(_date, options); // Round the number of weeks to the nearest integer because the number of // milliseconds in a week is not constant (e.g. it's different in the week of // the daylight saving time clock shift). return Math.round(diff / millisecondsInWeek) + 1; } function addLeadingZeros(number, targetLength) { const sign = number < 0 ? "-" : ""; const output = Math.abs(number).toString().padStart(targetLength, "0"); return sign + output; } /* * | | Unit | | Unit | * |-----|--------------------------------|-----|--------------------------------| * | a | AM, PM | A* | | * | d | Day of month | D | | * | h | Hour [1-12] | H | Hour [0-23] | * | m | Minute | M | Month | * | s | Second | S | Fraction of second | * | y | Year (abs) | Y | | * * Letters marked by * are not implemented but reserved by Unicode standard. */ const lightFormatters = { // Year y(date, token) { // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens // | Year | y | yy | yyy | yyyy | yyyyy | // |----------|-------|----|-------|-------|-------| // | AD 1 | 1 | 01 | 001 | 0001 | 00001 | // | AD 12 | 12 | 12 | 012 | 0012 | 00012 | // | AD 123 | 123 | 23 | 123 | 0123 | 00123 | // | AD 1234 | 1234 | 34 | 1234 | 1234 | 01234 | // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 | const signedYear = date.getFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript) const year = signedYear > 0 ? signedYear : 1 - signedYear; return addLeadingZeros(token === "yy" ? year % 100 : year, token.length); }, // Month M(date, token) { const month = date.getMonth(); return token === "M" ? String(month + 1) : addLeadingZeros(month + 1, 2); }, // Day of the month d(date, token) { return addLeadingZeros(date.getDate(), token.length); }, // AM or PM a(date, token) { const dayPeriodEnumValue = date.getHours() / 12 >= 1 ? "pm" : "am"; switch (token) { case "a": case "aa": return dayPeriodEnumValue.toUpperCase(); case "aaa": return dayPeriodEnumValue; case "aaaaa": return dayPeriodEnumValue[0]; case "aaaa": default: return dayPeriodEnumValue === "am" ? "a.m." : "p.m."; } }, // Hour [1-12] h(date, token) { return addLeadingZeros(date.getHours() % 12 || 12, token.length); }, // Hour [0-23] H(date, token) { return addLeadingZeros(date.getHours(), token.length); }, // Minute m(date, token) { return addLeadingZeros(date.getMinutes(), token.length); }, // Second s(date, token) { return addLeadingZeros(date.getSeconds(), token.length); }, // Fraction of second S(date, token) { const numberOfDigits = token.length; const milliseconds = date.getMilliseconds(); const fractionalSeconds = Math.trunc( milliseconds * Math.pow(10, numberOfDigits - 3), ); return addLeadingZeros(fractionalSeconds, token.length); }, }; const dayPeriodEnum = { midnight: "midnight", noon: "noon", morning: "morning", afternoon: "afternoon", evening: "evening", night: "night", }; /* * | | Unit | | Unit | * |-----|--------------------------------|-----|--------------------------------| * | a | AM, PM | A* | Milliseconds in day | * | b | AM, PM, noon, midnight | B | Flexible day period | * | c | Stand-alone local day of week | C* | Localized hour w/ day period | * | d | Day of month | D | Day of year | * | e | Local day of week | E | Day of week | * | f | | F* | Day of week in month | * | g* | Modified Julian day | G | Era | * | h | Hour [1-12] | H | Hour [0-23] | * | i! | ISO day of week | I! | ISO week of year | * | j* | Localized hour w/ day period | J* | Localized hour w/o day period | * | k | Hour [1-24] | K | Hour [0-11] | * | l* | (deprecated) | L | Stand-alone month | * | m | Minute | M | Month | * | n | | N | | * | o! | Ordinal number modifier | O | Timezone (GMT) | * | p! | Long localized time | P! | Long localized date | * | q | Stand-alone quarter | Q | Quarter | * | r* | Related Gregorian year | R! | ISO week-numbering year | * | s | Second | S | Fraction of second | * | t! | Seconds timestamp | T! | Milliseconds timestamp | * | u | Extended year | U* | Cyclic year | * | v* | Timezone (generic non-locat.) | V* | Timezone (location) | * | w | Local week of year | W* | Week of month | * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) | * | y | Year (abs) | Y | Local week-numbering year | * | z | Timezone (specific non-locat.) | Z* | Timezone (aliases) | * * Letters marked by * are not implemented but reserved by Unicode standard. * * Letters marked by ! are non-standard, but implemented by date-fns: * - `o` modifies the previous token to turn it into an ordinal (see `format` docs) * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days, * i.e. 7 for Sunday, 1 for Monday, etc. * - `I` is ISO week of year, as opposed to `w` which is local week of year. * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year. * `R` is supposed to be used in conjunction with `I` and `i` * for universal ISO week-numbering date, whereas * `Y` is supposed to be used in conjunction with `w` and `e` * for week-numbering date specific to the locale. * - `P` is long localized date format * - `p` is long localized time format */ const formatters = { // Era G: function (date, token, localize) { const era = date.getFullYear() > 0 ? 1 : 0; switch (token) { // AD, BC case "G": case "GG": case "GGG": return localize.era(era, { width: "abbreviated" }); // A, B case "GGGGG": return localize.era(era, { width: "narrow" }); // Anno Domini, Before Christ case "GGGG": default: return localize.era(era, { width: "wide" }); } }, // Year y: function (date, token, localize) { // Ordinal number if (token === "yo") { const signedYear = date.getFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript) const year = signedYear > 0 ? signedYear : 1 - signedYear; return localize.ordinalNumber(year, { unit: "year" }); } return lightFormatters.y(date, token); }, // Local week-numbering year Y: function (date, token, localize, options) { const signedWeekYear = getWeekYear(date, options); // Returns 1 for 1 BC (which is year 0 in JavaScript) const weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear; // Two digit year if (token === "YY") { const twoDigitYear = weekYear % 100; return addLeadingZeros(twoDigitYear, 2); } // Ordinal number if (token === "Yo") { return localize.ordinalNumber(weekYear, { unit: "year" }); } // Padding return addLeadingZeros(weekYear, token.length); }, // ISO week-numbering year R: function (date, token) { const isoWeekYear = getISOWeekYear(date); // Padding return addLeadingZeros(isoWeekYear, token.length); }, // Extended year. This is a single number designating the year of this calendar system. // The main difference between `y` and `u` localizers are B.C. years: // | Year | `y` | `u` | // |------|-----|-----| // | AC 1 | 1 | 1 | // | BC 1 | 1 | 0 | // | BC 2 | 2 | -1 | // Also `yy` always returns the last two digits of a year, // while `uu` pads single digit years to 2 characters and returns other years unchanged. u: function (date, token) { const year = date.getFullYear(); return addLeadingZeros(year, token.length); }, // Quarter Q: function (date, token, localize) { const quarter = Math.ceil((date.getMonth() + 1) / 3); switch (token) { // 1, 2, 3, 4 case "Q": return String(quarter); // 01, 02, 03, 04 case "QQ": return addLeadingZeros(quarter, 2); // 1st, 2nd, 3rd, 4th case "Qo": return localize.ordinalNumber(quarter, { unit: "quarter" }); // Q1, Q2, Q3, Q4 case "QQQ": return localize.quarter(quarter, { width