npm - @contentful/f36-datetime - Versions diffs - 4.12.0 → 4.15.0 - Mend

@contentful/f36-datetime 4.12.0 → 4.15.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 (6) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,26 @@
 # Change Log
+## 4.15.0
+### Patch Changes
+- Updated dependencies []:
+  - @contentful/f36-core@4.15.0
+## 4.14.0
+### Patch Changes
+- Updated dependencies []:
+  - @contentful/f36-core@4.14.0
+## 4.13.0
+### Patch Changes
+- Updated dependencies []:
+  - @contentful/f36-core@4.13.0
 ## 4.12.0
 ### Minor Changes

package/dist/main.js CHANGED Viewed

@@ -19,70 +19,70 @@ $parcel$export(module.exports, "formatRelativeDateTime", () => $4e7e5146bc048e19
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjspluginutc)));
-function $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, format = 'full') {
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjspluginutc))));
+function $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, format = "full") {
     let template;
     switch(format){
-        case 'day':
-            template = 'DD MMM YYYY'; // 17 Aug 2021
+        case "day":
+            template = "DD MMM YYYY"; // 17 Aug 2021
             break;
-        case 'weekday':
-            template = 'ddd, DD MMM'; // Tue, 17 Aug
+        case "weekday":
+            template = "ddd, DD MMM"; // Tue, 17 Aug
             break;
-        case 'time':
-            template = 'h:mm A'; // 3:45 PM
+        case "time":
+            template = "h:mm A"; // 3:45 PM
             break;
-        case 'fullWithSeconds':
-            template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM
+        case "fullWithSeconds":
+            template = "ddd, DD MMM YYYY [at] h:mm:ss A"; // Tue, 17 Aug 2021 at 3:45:67 PM
             break;
         default:
-            template = 'ddd, DD MMM YYYY [at] h:mm A';
+            template = "ddd, DD MMM YYYY [at] h:mm A";
     }
-    return ($parcel$interopDefault($iSxHR$dayjs))(date).format(template);
+    return (0, ($parcel$interopDefault($iSxHR$dayjs)))(date).format(template);
 }
-function $fe3d2807f48471b7$export$5fb913e47d486079(date, format = 'full') {
+function $fe3d2807f48471b7$export$5fb913e47d486079(date, format = "full") {
     let template;
     switch(format){
-        case 'day':
-            template = 'YYYY-MM-DD'; // 2019-08-24
+        case "day":
+            template = "YYYY-MM-DD"; // 2019-08-24
             break;
-        case 'weekday':
-            template = 'MM-DD'; // 08-24
+        case "weekday":
+            template = "MM-DD"; // 08-24
             break;
-        case 'time':
-            template = 'HH:mm:ss.SSS'; // 15:44:07.000
+        case "time":
+            template = "HH:mm:ss.SSS"; // 15:44:07.000
             break;
         default:
-            template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]';
+            template = "YYYY-MM-DDTHH:mm:ss.SSS[Z]";
     }
-    return ($parcel$interopDefault($iSxHR$dayjs))(date).utc().format(template);
+    return (0, ($parcel$interopDefault($iSxHR$dayjs)))(date).utc().format(template);
 }
 const $fe3d2807f48471b7$export$3ae94a2503e890a1 = (date)=>{
-    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, 'day');
+    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, "day");
 };
 const $fe3d2807f48471b7$export$3203edd9e5edd663 = (date)=>{
-    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, 'time');
+    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, "time");
 };
 const $fe3d2807f48471b7$export$b89623867a65b725 = (date)=>{
-    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, 'weekday');
+    return $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, "weekday");
 };
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjspluginutc)));
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjspluginrelativeTime)));
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjsplugincalendar)));
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjspluginutc))));
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjspluginrelativeTime))));
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjsplugincalendar))));
 function $4e7e5146bc048e19$export$68534c3ecebfa124(date, baseDate = new Date()) {
-    return ($parcel$interopDefault($iSxHR$dayjs))(date).from(baseDate);
+    return (0, ($parcel$interopDefault($iSxHR$dayjs)))(date).from(baseDate);
 }
 function $4e7e5146bc048e19$export$aa1a2def90bfd930(date, baseDate = new Date()) {
-    const isToday = ($parcel$interopDefault($iSxHR$dayjs))(date).isSame(baseDate, 'day');
+    const isToday = (0, ($parcel$interopDefault($iSxHR$dayjs)))(date).isSame(baseDate, "day");
     if (!isToday) // if the date is not today, we display it with "Yesterday", "Tomorrow", etc.
     // and if the date is not in the current week then it will display "17 Aug 2021"
-    return ($parcel$interopDefault($iSxHR$dayjs))(date).calendar(baseDate, {
-        sameElse: 'DD MMM YYYY'
+    return (0, ($parcel$interopDefault($iSxHR$dayjs)))(date).calendar(baseDate, {
+        sameElse: "DD MMM YYYY"
     });
      // returns "... ago"
     return $4e7e5146bc048e19$export$68534c3ecebfa124(date, baseDate);
@@ -90,16 +90,16 @@ function $4e7e5146bc048e19$export$aa1a2def90bfd930(date, baseDate = new Date())
-const $8c9ef2783da7ec5f$var$_DateTime = ({ date: date , format: format = 'full' , testId: testId = 'cf-ui-date-time' , ...otherProps }, ref)=>{
-    const machineReadableDate = $fe3d2807f48471b7$export$5fb913e47d486079(date);
-    return /*#__PURE__*/ ($parcel$interopDefault($iSxHR$react)).createElement("time", {
+const $8c9ef2783da7ec5f$var$_DateTime = ({ date: date , format: format = "full" , testId: testId = "cf-ui-date-time" , ...otherProps }, ref)=>{
+    const machineReadableDate = (0, $fe3d2807f48471b7$export$5fb913e47d486079)(date);
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($iSxHR$react))).createElement("time", {
         dateTime: machineReadableDate,
         "data-test-id": testId,
         ...otherProps,
         ref: ref
-    }, $fe3d2807f48471b7$export$de4eb09f10f9c95e(date, format));
+    }, (0, $fe3d2807f48471b7$export$de4eb09f10f9c95e)(date, format));
 };
-const $8c9ef2783da7ec5f$export$82f9ebd9adeba146 = /*#__PURE__*/ ($parcel$interopDefault($iSxHR$react)).forwardRef($8c9ef2783da7ec5f$var$_DateTime);
+const $8c9ef2783da7ec5f$export$82f9ebd9adeba146 = /*#__PURE__*/ (0, ($parcel$interopDefault($iSxHR$react))).forwardRef($8c9ef2783da7ec5f$var$_DateTime);
@@ -108,31 +108,31 @@ const $8c9ef2783da7ec5f$export$82f9ebd9adeba146 = /*#__PURE__*/ ($parcel$interop
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjspluginutc)));
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjspluginrelativeTime)));
-($parcel$interopDefault($iSxHR$dayjs)).extend(($parcel$interopDefault($iSxHR$dayjsplugincalendar)));
-const $de66f20f0f273947$var$_RelativeDateTime = ({ date: date , baseDate: baseDate , isRelativeToCurrentWeek: isRelativeToCurrentWeek = false , testId: testId = 'cf-ui-relative-date-time' , ...otherProps }, ref)=>{
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjspluginutc))));
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjspluginrelativeTime))));
+(0, ($parcel$interopDefault($iSxHR$dayjs))).extend((0, ($parcel$interopDefault($iSxHR$dayjsplugincalendar))));
+const $de66f20f0f273947$var$_RelativeDateTime = ({ date: date , baseDate: baseDate , isRelativeToCurrentWeek: isRelativeToCurrentWeek = false , testId: testId = "cf-ui-relative-date-time" , ...otherProps }, ref)=>{
     const now = new Date();
     const referenceDate = baseDate !== null && baseDate !== void 0 ? baseDate : now;
-    const dayjsDate = ($parcel$interopDefault($iSxHR$dayjs))(date);
-    const machineReadableDate = $fe3d2807f48471b7$export$5fb913e47d486079(date);
+    const dayjsDate = (0, ($parcel$interopDefault($iSxHR$dayjs)))(date);
+    const machineReadableDate = (0, $fe3d2807f48471b7$export$5fb913e47d486079)(date);
     let relativeDate;
-    if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) /**
+    if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, "day")) /**
      * if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc
      * or, if the date is not in the current week, it displays "17 Aug 2021"
      *
      * check formatRelativeToCurrentWeekDateTime for more details
-     */ relativeDate = $4e7e5146bc048e19$export$aa1a2def90bfd930(date, referenceDate);
+     */ relativeDate = (0, $4e7e5146bc048e19$export$aa1a2def90bfd930)(date, referenceDate);
     else // otherwise we display it with "... ago" or "in ..." notation
-    relativeDate = $4e7e5146bc048e19$export$68534c3ecebfa124(date, referenceDate);
-    return /*#__PURE__*/ ($parcel$interopDefault($iSxHR$react)).createElement("time", {
+    relativeDate = (0, $4e7e5146bc048e19$export$68534c3ecebfa124)(date, referenceDate);
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($iSxHR$react))).createElement("time", {
         dateTime: machineReadableDate,
         "data-test-id": testId,
         ...otherProps,
         ref: ref
     }, relativeDate);
 };
-const $de66f20f0f273947$export$6de14fd95adb1c8a = /*#__PURE__*/ ($parcel$interopDefault($iSxHR$react)).forwardRef($de66f20f0f273947$var$_RelativeDateTime);
+const $de66f20f0f273947$export$6de14fd95adb1c8a = /*#__PURE__*/ (0, ($parcel$interopDefault($iSxHR$react))).forwardRef($de66f20f0f273947$var$_RelativeDateTime);

package/dist/main.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"mappings":"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","sources":["packages/components/datetime/src/index.ts","packages/components/datetime/src/DateTime/DateTime.tsx","packages/components/datetime/src/utils/index.ts","packages/components/datetime/src/utils/formatDateTimeUtils.ts","packages/components/datetime/src/utils/relativeDateTimeUtils.ts","packages/components/datetime/src/RelativeDateTime/RelativeDateTime.tsx"],"sourcesContent":["export { DateTime } from './DateTime/DateTime';\nexport type { DateTimeProps } from './DateTime/DateTime';\nexport { RelativeDateTime } from './RelativeDateTime/RelativeDateTime';\nexport type { RelativeDateTimeProps } from './RelativeDateTime/RelativeDateTime';\nexport {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n} from './utils';\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport type { DateType, DateFormat } from '../types';\nimport { formatDateAndTime, formatMachineReadableDateTime } from '../utils';\n\ninterface DateTimeOwnProps extends CommonProps {\n /*\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n The format in which the date will be presented\n \n @default full\n /\n format?: DateFormat;\n}\n\nexport type DateTimeProps = PropsWithHTMLElement<DateTimeOwnProps, 'time'>;\n\nconst _DateTime = (\n {\n date,\n format = 'full',\n testId = 'cf-ui-date-time',\n ...otherProps\n }: ExpandProps<DateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {formatDateAndTime(date, format)}\n </time>\n );\n};\n\n/\n * The DateTime component will format a date to a human friendly format and wrap it in a `<time>` tag\n /\nexport const DateTime = React.forwardRef(_DateTime);\n","export {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatDate,\n formatTime,\n formatWeekdayDate,\n} from './formatDateTimeUtils';\n\nexport {\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from './relativeDateTimeUtils';\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\ndayjs.extend(utcPlugin);\n\nimport type { DateType, DateFormat } from '../types';\n\n/\n A funtion that will return a formatted date string. The format will dependend on the option\n * passed in the second argument.\n * By default, it will return a string with Forma 36’s \"full\" format (e.g. Tue, 17 Aug 2021 at 3:45 PM)\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00') // returns \"Tue, 17 Aug 2021 at 3:45 PM\"\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00', 'day') // returns \"17 Aug 2021\"\n /\nexport function formatDateAndTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'DD MMM YYYY'; // 17 Aug 2021\n break;\n case 'weekday':\n template = 'ddd, DD MMM'; // Tue, 17 Aug\n break;\n case 'time':\n template = 'h:mm A'; // 3:45 PM\n break;\n case 'fullWithSeconds':\n template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM\n break;\n default:\n template = 'ddd, DD MMM YYYY [at] h:mm A'; // Tue, 17 Aug 2021 at 3:45 PM\n }\n\n return dayjs(date).format(template);\n}\n\n/\n A funtion that will return a machine-readable date string that should be passed to the `datetime` attribute of a `<time>` tag\n * By default, it will return a string with \"YYYY-MM-DDTHH:mm:ss.SSS[Z]\" format\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatMachineReadableDateTime(date) // returns 2019-08-13T10:00:00.000Z\n \n @example\n * formatMachineReadableDateTime(date, 'day') // returns 2019-08-13\n /\nexport function formatMachineReadableDateTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'YYYY-MM-DD'; // 2019-08-24\n break;\n case 'weekday':\n template = 'MM-DD'; // 08-24\n break;\n case 'time':\n template = 'HH:mm:ss.SSS'; // 15:44:07.000\n break;\n default:\n template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]'; // 2019-08-24T15:44:07.000Z\n }\n\n return dayjs(date).utc().format(template);\n}\n\n/\n @example\n * > formatDate(date)\n * 13 Aug 2019\n /\nexport const formatDate = (date: DateType): string => {\n return formatDateAndTime(date, 'day');\n};\n\n/\n @example\n * > formatTime(date)\n * 8:00 AM\n /\nexport const formatTime = (date: DateType): string => {\n return formatDateAndTime(date, 'time');\n};\n\n/\n @example\n * > formatWeekdayDate(date)\n * Mon, 12 Aug\n /\nexport const formatWeekdayDate = (date: DateType): string => {\n return formatDateAndTime(date, 'weekday');\n};\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\n\n/\n A function that will return a string with how far a given date is in the past or future,\n * using a baseDate as reference. If the baseDate is not passed, the function will use today as reference.\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeDateTime('2021-08-17T15:45:00') // returns \"a day ago\"\n \n @example\n * formatRelativeDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"in a day\"\n /\nexport function formatRelativeDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n return dayjs(date).from(baseDate);\n}\n\n/\n A function that formats a date relative to Today or to the `baseDate` if passed.\n * If the date is not today, it will return a string with \"Yesterday ...\", \"Tomorrow ...\", etc\n * If the date is not in the current week, it return a string with \"DD MMM YYYY\" format\n * If the date is today, it will return a string with \"... ago\" or \"in ...\"\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00') // returns \"Yesterday at 3:45 PM\"\n \n @example\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"Tomorrow at 3:45 PM\"\n /\nexport function formatRelativeToCurrentWeekDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n const isToday = dayjs(date).isSame(baseDate, 'day');\n\n if (!isToday) {\n // if the date is not today, we display it with \"Yesterday\", \"Tomorrow\", etc.\n // and if the date is not in the current week then it will display \"17 Aug 2021\"\n return dayjs(date).calendar(baseDate, {\n sameElse: 'DD MMM YYYY',\n });\n }\n\n // returns \"... ago\"\n return formatRelativeDateTime(date, baseDate);\n}\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\nimport {\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from '../utils';\n\ninterface RelativeDateTimeInternalProps extends CommonProps {\n /\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n If a value is passed to baseDate, then the component will compare both dates and return the time between them.\n * If no value is passed then the date will be compared to \"now\"\n \n @default \"Now\"\n /\n baseDate?: DateType;\n /\n Sets the date to be relative only if it is in the current week\n * @default false\n /\n isRelativeToCurrentWeek?: boolean;\n}\n\nexport type RelativeDateTimeProps = PropsWithHTMLElement<\n RelativeDateTimeInternalProps,\n 'time'\n>;\n\nconst _RelativeDateTime = (\n {\n date,\n baseDate,\n isRelativeToCurrentWeek = false,\n testId = 'cf-ui-relative-date-time',\n ...otherProps\n }: ExpandProps<RelativeDateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const now = new Date();\n const referenceDate = baseDate ?? now;\n const dayjsDate = dayjs(date);\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n let relativeDate: string;\n\n if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) {\n /\n if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc\n * or, if the date is not in the current week, it displays \"17 Aug 2021\"\n \n check formatRelativeToCurrentWeekDateTime for more details\n /\n relativeDate = formatRelativeToCurrentWeekDateTime(date, referenceDate);\n } else {\n // otherwise we display it with \"... ago\" or \"in ...\" notation\n relativeDate = formatRelativeDateTime(date, referenceDate);\n }\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {relativeDate}\n </time>\n );\n};\n\n/\n The RelativeDateTime will show a `date` relative to \"now\" or to the `baseDate`\n * (e.g. in a day, in one month, one month ago, etc).\n */\nexport const RelativeDateTime = React.forwardRef(_RelativeDateTime);\n"],"names":["DateTime","DateTimeProps","RelativeDateTime","RelativeDateTimeProps","formatDateAndTime","formatMachineReadableDateTime","formatRelativeDateTime","React","CommonProps","PropsWithHTMLElement","ExpandProps","DateType","DateFormat","DateTimeOwnProps","date","format","_DateTime","testId","otherProps","ref","Ref","HTMLTimeElement","machineReadableDate","forwardRef","formatDate","formatTime","formatWeekdayDate","formatRelativeToCurrentWeekDateTime","dayjs","utcPlugin","extend","template","utc","relativeTime","calendarPlugin","baseDate","Date","from","isToday","isSame","calendar","sameElse","RelativeDateTimeInternalProps","isRelativeToCurrentWeek","_RelativeDateTime","now","referenceDate","dayjsDate","relativeDate"],"version":3,"file":"main.js.map"}
1	+ {"mappings":"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","sources":["packages/components/datetime/src/index.ts","packages/components/datetime/src/DateTime/DateTime.tsx","packages/components/datetime/src/utils/index.ts","packages/components/datetime/src/utils/formatDateTimeUtils.ts","packages/components/datetime/src/utils/relativeDateTimeUtils.ts","packages/components/datetime/src/RelativeDateTime/RelativeDateTime.tsx"],"sourcesContent":["export { DateTime } from './DateTime/DateTime';\nexport type { DateTimeProps } from './DateTime/DateTime';\nexport { RelativeDateTime } from './RelativeDateTime/RelativeDateTime';\nexport type { RelativeDateTimeProps } from './RelativeDateTime/RelativeDateTime';\nexport {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n} from './utils';\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport type { DateType, DateFormat } from '../types';\nimport { formatDateAndTime, formatMachineReadableDateTime } from '../utils';\n\ninterface DateTimeOwnProps extends CommonProps {\n /*\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n The format in which the date will be presented\n \n @default full\n /\n format?: DateFormat;\n}\n\nexport type DateTimeProps = PropsWithHTMLElement<DateTimeOwnProps, 'time'>;\n\nconst _DateTime = (\n {\n date,\n format = 'full',\n testId = 'cf-ui-date-time',\n ...otherProps\n }: ExpandProps<DateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {formatDateAndTime(date, format)}\n </time>\n );\n};\n\n/\n * The DateTime component will format a date to a human friendly format and wrap it in a `<time>` tag\n /\nexport const DateTime = React.forwardRef(_DateTime);\n","export {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatDate,\n formatTime,\n formatWeekdayDate,\n} from './formatDateTimeUtils';\n\nexport {\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from './relativeDateTimeUtils';\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\ndayjs.extend(utcPlugin);\n\nimport type { DateType, DateFormat } from '../types';\n\n/\n A funtion that will return a formatted date string. The format will dependend on the option\n * passed in the second argument.\n * By default, it will return a string with Forma 36’s \"full\" format (e.g. Tue, 17 Aug 2021 at 3:45 PM)\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00') // returns \"Tue, 17 Aug 2021 at 3:45 PM\"\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00', 'day') // returns \"17 Aug 2021\"\n /\nexport function formatDateAndTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'DD MMM YYYY'; // 17 Aug 2021\n break;\n case 'weekday':\n template = 'ddd, DD MMM'; // Tue, 17 Aug\n break;\n case 'time':\n template = 'h:mm A'; // 3:45 PM\n break;\n case 'fullWithSeconds':\n template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM\n break;\n default:\n template = 'ddd, DD MMM YYYY [at] h:mm A'; // Tue, 17 Aug 2021 at 3:45 PM\n }\n\n return dayjs(date).format(template);\n}\n\n/\n A funtion that will return a machine-readable date string that should be passed to the `datetime` attribute of a `<time>` tag\n * By default, it will return a string with \"YYYY-MM-DDTHH:mm:ss.SSS[Z]\" format\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatMachineReadableDateTime(date) // returns 2019-08-13T10:00:00.000Z\n \n @example\n * formatMachineReadableDateTime(date, 'day') // returns 2019-08-13\n /\nexport function formatMachineReadableDateTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'YYYY-MM-DD'; // 2019-08-24\n break;\n case 'weekday':\n template = 'MM-DD'; // 08-24\n break;\n case 'time':\n template = 'HH:mm:ss.SSS'; // 15:44:07.000\n break;\n default:\n template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]'; // 2019-08-24T15:44:07.000Z\n }\n\n return dayjs(date).utc().format(template);\n}\n\n/\n @example\n * > formatDate(date)\n * 13 Aug 2019\n /\nexport const formatDate = (date: DateType): string => {\n return formatDateAndTime(date, 'day');\n};\n\n/\n @example\n * > formatTime(date)\n * 8:00 AM\n /\nexport const formatTime = (date: DateType): string => {\n return formatDateAndTime(date, 'time');\n};\n\n/\n @example\n * > formatWeekdayDate(date)\n * Mon, 12 Aug\n /\nexport const formatWeekdayDate = (date: DateType): string => {\n return formatDateAndTime(date, 'weekday');\n};\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\n\n/\n A function that will return a string with how far a given date is in the past or future,\n * using a baseDate as reference. If the baseDate is not passed, the function will use today as reference.\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeDateTime('2021-08-17T15:45:00') // returns \"a day ago\"\n \n @example\n * formatRelativeDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"in a day\"\n /\nexport function formatRelativeDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n return dayjs(date).from(baseDate);\n}\n\n/\n A function that formats a date relative to Today or to the `baseDate` if passed.\n * If the date is not today, it will return a string with \"Yesterday ...\", \"Tomorrow ...\", etc\n * If the date is not in the current week, it return a string with \"DD MMM YYYY\" format\n * If the date is today, it will return a string with \"... ago\" or \"in ...\"\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00') // returns \"Yesterday at 3:45 PM\"\n \n @example\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"Tomorrow at 3:45 PM\"\n /\nexport function formatRelativeToCurrentWeekDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n const isToday = dayjs(date).isSame(baseDate, 'day');\n\n if (!isToday) {\n // if the date is not today, we display it with \"Yesterday\", \"Tomorrow\", etc.\n // and if the date is not in the current week then it will display \"17 Aug 2021\"\n return dayjs(date).calendar(baseDate, {\n sameElse: 'DD MMM YYYY',\n });\n }\n\n // returns \"... ago\"\n return formatRelativeDateTime(date, baseDate);\n}\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\nimport {\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from '../utils';\n\ninterface RelativeDateTimeInternalProps extends CommonProps {\n /\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n If a value is passed to baseDate, then the component will compare both dates and return the time between them.\n * If no value is passed then the date will be compared to \"now\"\n \n @default \"Now\"\n /\n baseDate?: DateType;\n /\n Sets the date to be relative only if it is in the current week\n * @default false\n /\n isRelativeToCurrentWeek?: boolean;\n}\n\nexport type RelativeDateTimeProps = PropsWithHTMLElement<\n RelativeDateTimeInternalProps,\n 'time'\n>;\n\nconst _RelativeDateTime = (\n {\n date,\n baseDate,\n isRelativeToCurrentWeek = false,\n testId = 'cf-ui-relative-date-time',\n ...otherProps\n }: ExpandProps<RelativeDateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const now = new Date();\n const referenceDate = baseDate ?? now;\n const dayjsDate = dayjs(date);\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n let relativeDate: string;\n\n if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) {\n /\n if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc\n * or, if the date is not in the current week, it displays \"17 Aug 2021\"\n \n check formatRelativeToCurrentWeekDateTime for more details\n /\n relativeDate = formatRelativeToCurrentWeekDateTime(date, referenceDate);\n } else {\n // otherwise we display it with \"... ago\" or \"in ...\" notation\n relativeDate = formatRelativeDateTime(date, referenceDate);\n }\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {relativeDate}\n </time>\n );\n};\n\n/\n The RelativeDateTime will show a `date` relative to \"now\" or to the `baseDate`\n * (e.g. in a day, in one month, one month ago, etc).\n */\nexport const RelativeDateTime = React.forwardRef(_RelativeDateTime);\n"],"names":["DateTime","DateTimeProps","RelativeDateTime","RelativeDateTimeProps","formatDateAndTime","formatMachineReadableDateTime","formatRelativeDateTime","React","CommonProps","PropsWithHTMLElement","ExpandProps","DateType","DateFormat","DateTimeOwnProps","date","format","_DateTime","testId","otherProps","ref","Ref","HTMLTimeElement","machineReadableDate","forwardRef","formatDate","formatTime","formatWeekdayDate","formatRelativeToCurrentWeekDateTime","dayjs","utcPlugin","extend","template","utc","relativeTime","calendarPlugin","baseDate","Date","from","isToday","isSame","calendar","sameElse","RelativeDateTimeInternalProps","isRelativeToCurrentWeek","_RelativeDateTime","now","referenceDate","dayjsDate","relativeDate"],"version":3,"file":"main.js.map"}

package/dist/module.js CHANGED Viewed

@@ -7,70 +7,70 @@ import $fUYts$dayjsplugincalendar from "dayjs/plugin/calendar";
-$fUYts$dayjs.extend($fUYts$dayjspluginutc);
-function $ee655ad1301c8997$export$de4eb09f10f9c95e(date, format = 'full') {
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjspluginutc));
+function $ee655ad1301c8997$export$de4eb09f10f9c95e(date, format = "full") {
     let template;
     switch(format){
-        case 'day':
-            template = 'DD MMM YYYY'; // 17 Aug 2021
+        case "day":
+            template = "DD MMM YYYY"; // 17 Aug 2021
             break;
-        case 'weekday':
-            template = 'ddd, DD MMM'; // Tue, 17 Aug
+        case "weekday":
+            template = "ddd, DD MMM"; // Tue, 17 Aug
             break;
-        case 'time':
-            template = 'h:mm A'; // 3:45 PM
+        case "time":
+            template = "h:mm A"; // 3:45 PM
             break;
-        case 'fullWithSeconds':
-            template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM
+        case "fullWithSeconds":
+            template = "ddd, DD MMM YYYY [at] h:mm:ss A"; // Tue, 17 Aug 2021 at 3:45:67 PM
             break;
         default:
-            template = 'ddd, DD MMM YYYY [at] h:mm A';
+            template = "ddd, DD MMM YYYY [at] h:mm A";
     }
-    return $fUYts$dayjs(date).format(template);
+    return (0, $fUYts$dayjs)(date).format(template);
 }
-function $ee655ad1301c8997$export$5fb913e47d486079(date, format = 'full') {
+function $ee655ad1301c8997$export$5fb913e47d486079(date, format = "full") {
     let template;
     switch(format){
-        case 'day':
-            template = 'YYYY-MM-DD'; // 2019-08-24
+        case "day":
+            template = "YYYY-MM-DD"; // 2019-08-24
             break;
-        case 'weekday':
-            template = 'MM-DD'; // 08-24
+        case "weekday":
+            template = "MM-DD"; // 08-24
             break;
-        case 'time':
-            template = 'HH:mm:ss.SSS'; // 15:44:07.000
+        case "time":
+            template = "HH:mm:ss.SSS"; // 15:44:07.000
             break;
         default:
-            template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]';
+            template = "YYYY-MM-DDTHH:mm:ss.SSS[Z]";
     }
-    return $fUYts$dayjs(date).utc().format(template);
+    return (0, $fUYts$dayjs)(date).utc().format(template);
 }
 const $ee655ad1301c8997$export$3ae94a2503e890a1 = (date)=>{
-    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, 'day');
+    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, "day");
 };
 const $ee655ad1301c8997$export$3203edd9e5edd663 = (date)=>{
-    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, 'time');
+    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, "time");
 };
 const $ee655ad1301c8997$export$b89623867a65b725 = (date)=>{
-    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, 'weekday');
+    return $ee655ad1301c8997$export$de4eb09f10f9c95e(date, "weekday");
 };
-$fUYts$dayjs.extend($fUYts$dayjspluginutc);
-$fUYts$dayjs.extend($fUYts$dayjspluginrelativeTime);
-$fUYts$dayjs.extend($fUYts$dayjsplugincalendar);
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjspluginutc));
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjspluginrelativeTime));
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjsplugincalendar));
 function $162585a33f185f78$export$68534c3ecebfa124(date, baseDate = new Date()) {
-    return $fUYts$dayjs(date).from(baseDate);
+    return (0, $fUYts$dayjs)(date).from(baseDate);
 }
 function $162585a33f185f78$export$aa1a2def90bfd930(date, baseDate = new Date()) {
-    const isToday = $fUYts$dayjs(date).isSame(baseDate, 'day');
+    const isToday = (0, $fUYts$dayjs)(date).isSame(baseDate, "day");
     if (!isToday) // if the date is not today, we display it with "Yesterday", "Tomorrow", etc.
     // and if the date is not in the current week then it will display "17 Aug 2021"
-    return $fUYts$dayjs(date).calendar(baseDate, {
-        sameElse: 'DD MMM YYYY'
+    return (0, $fUYts$dayjs)(date).calendar(baseDate, {
+        sameElse: "DD MMM YYYY"
     });
      // returns "... ago"
     return $162585a33f185f78$export$68534c3ecebfa124(date, baseDate);
@@ -78,16 +78,16 @@ function $162585a33f185f78$export$aa1a2def90bfd930(date, baseDate = new Date())
-const $02aa7794cdab25f9$var$_DateTime = ({ date: date , format: format = 'full' , testId: testId = 'cf-ui-date-time' , ...otherProps }, ref)=>{
-    const machineReadableDate = $ee655ad1301c8997$export$5fb913e47d486079(date);
-    return /*#__PURE__*/ $fUYts$react.createElement("time", {
+const $02aa7794cdab25f9$var$_DateTime = ({ date: date , format: format = "full" , testId: testId = "cf-ui-date-time" , ...otherProps }, ref)=>{
+    const machineReadableDate = (0, $ee655ad1301c8997$export$5fb913e47d486079)(date);
+    return /*#__PURE__*/ (0, $fUYts$react).createElement("time", {
         dateTime: machineReadableDate,
         "data-test-id": testId,
         ...otherProps,
         ref: ref
-    }, $ee655ad1301c8997$export$de4eb09f10f9c95e(date, format));
+    }, (0, $ee655ad1301c8997$export$de4eb09f10f9c95e)(date, format));
 };
-const $02aa7794cdab25f9$export$82f9ebd9adeba146 = /*#__PURE__*/ $fUYts$react.forwardRef($02aa7794cdab25f9$var$_DateTime);
+const $02aa7794cdab25f9$export$82f9ebd9adeba146 = /*#__PURE__*/ (0, $fUYts$react).forwardRef($02aa7794cdab25f9$var$_DateTime);
@@ -96,31 +96,31 @@ const $02aa7794cdab25f9$export$82f9ebd9adeba146 = /*#__PURE__*/ $fUYts$react.for
-$fUYts$dayjs.extend($fUYts$dayjspluginutc);
-$fUYts$dayjs.extend($fUYts$dayjspluginrelativeTime);
-$fUYts$dayjs.extend($fUYts$dayjsplugincalendar);
-const $f5a0093d268a4b59$var$_RelativeDateTime = ({ date: date , baseDate: baseDate , isRelativeToCurrentWeek: isRelativeToCurrentWeek = false , testId: testId = 'cf-ui-relative-date-time' , ...otherProps }, ref)=>{
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjspluginutc));
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjspluginrelativeTime));
+(0, $fUYts$dayjs).extend((0, $fUYts$dayjsplugincalendar));
+const $f5a0093d268a4b59$var$_RelativeDateTime = ({ date: date , baseDate: baseDate , isRelativeToCurrentWeek: isRelativeToCurrentWeek = false , testId: testId = "cf-ui-relative-date-time" , ...otherProps }, ref)=>{
     const now = new Date();
     const referenceDate = baseDate !== null && baseDate !== void 0 ? baseDate : now;
-    const dayjsDate = $fUYts$dayjs(date);
-    const machineReadableDate = $ee655ad1301c8997$export$5fb913e47d486079(date);
+    const dayjsDate = (0, $fUYts$dayjs)(date);
+    const machineReadableDate = (0, $ee655ad1301c8997$export$5fb913e47d486079)(date);
     let relativeDate;
-    if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) /**
+    if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, "day")) /**
      * if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc
      * or, if the date is not in the current week, it displays "17 Aug 2021"
      *
      * check formatRelativeToCurrentWeekDateTime for more details
-     */ relativeDate = $162585a33f185f78$export$aa1a2def90bfd930(date, referenceDate);
+     */ relativeDate = (0, $162585a33f185f78$export$aa1a2def90bfd930)(date, referenceDate);
     else // otherwise we display it with "... ago" or "in ..." notation
-    relativeDate = $162585a33f185f78$export$68534c3ecebfa124(date, referenceDate);
-    return /*#__PURE__*/ $fUYts$react.createElement("time", {
+    relativeDate = (0, $162585a33f185f78$export$68534c3ecebfa124)(date, referenceDate);
+    return /*#__PURE__*/ (0, $fUYts$react).createElement("time", {
         dateTime: machineReadableDate,
         "data-test-id": testId,
         ...otherProps,
         ref: ref
     }, relativeDate);
 };
-const $f5a0093d268a4b59$export$6de14fd95adb1c8a = /*#__PURE__*/ $fUYts$react.forwardRef($f5a0093d268a4b59$var$_RelativeDateTime);
+const $f5a0093d268a4b59$export$6de14fd95adb1c8a = /*#__PURE__*/ (0, $fUYts$react).forwardRef($f5a0093d268a4b59$var$_RelativeDateTime);

package/dist/module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"mappings":";;;;;;ACAA;AEAA;;AAEA4B,YAAK,CAACE,MAAN,CAAaD,qBAAb,CAAAD,CAAAA;AAmBO,SAASxB,yCAAT,CACLU,IADK,EAELC,MAAkB,GAAG,MAFhB,EAGG;IACR,IAAIgB,QAAQ,AAAZ,AAAA;IAEA,OAAQhB,MAAR;QACE,KAAK,KAAL;YACEgB,QAAQ,GAAG,aAAX,CADF,CAC4B,cAA1BA;YACA,MAAA;QACF,KAAK,SAAL;YACEA,QAAQ,GAAG,aAAX,CADF,CAC4B,cAA1BA;YACA,MAAA;QACF,KAAK,MAAL;YACEA,QAAQ,GAAG,QAAX,CADF,CACuB,UAArBA;YACA,MAAA;QACF,KAAK,iBAAL;YACEA,QAAQ,GAAG,iCAAX,CADF,CACgD,iCAA9CA;YACA,MAAA;QACF;YACEA,QAAQ,GAAG,8BAAX,CAAAA;KAdJ;IAiBA,OAAOH,YAAK,CAACd,IAAD,CAAL,CAAYC,MAAZ,CAAmBgB,QAAnB,CAAP,CAAA;CACD;AAgBM,SAAS1B,yCAAT,CACLS,IADK,EAELC,MAAkB,GAAG,MAFhB,EAGG;IACR,IAAIgB,QAAQ,AAAZ,AAAA;IAEA,OAAQhB,MAAR;QACE,KAAK,KAAL;YACEgB,QAAQ,GAAG,YAAX,CADF,CAC2B,aAAzBA;YACA,MAAA;QACF,KAAK,SAAL;YACEA,QAAQ,GAAG,OAAX,CADF,CACsB,QAApBA;YACA,MAAA;QACF,KAAK,MAAL;YACEA,QAAQ,GAAG,cAAX,CADF,CAC6B,eAA3BA;YACA,MAAA;QACF;YACEA,QAAQ,GAAG,4BAAX,CAAAA;KAXJ;IAcA,OAAOH,YAAK,CAACd,IAAD,CAAL,CAAYkB,GAAZ,EAAA,CAAkBjB,MAAlB,CAAyBgB,QAAzB,CAAP,CAAA;CACD;AAOM,MAAMP,yCAAU,GAAG,CAACV,IAAD,GAA4B;IACpD,OAAOV,yCAAiB,CAACU,IAAD,EAAO,KAAP,CAAxB,CAAA;CADK,AAEN;AAOM,MAAMW,yCAAU,GAAG,CAACX,IAAD,GAA4B;IACpD,OAAOV,yCAAiB,CAACU,IAAD,EAAO,MAAP,CAAxB,CAAA;CADK,AAEN;AAOM,MAAMY,yCAAiB,GAAG,CAACZ,IAAD,GAA4B;IAC3D,OAAOV,yCAAiB,CAACU,IAAD,EAAO,SAAP,CAAxB,CAAA;CADK,AAEN;;AC7GD;;;;AAIAc,YAAK,CAACE,MAAN,CAAaD,qBAAb,CAAAD,CAAAA;AACAA,YAAK,CAACE,MAAN,CAAaG,8BAAb,CAAAL,CAAAA;AACAA,YAAK,CAACE,MAAN,CAAaI,0BAAb,CAAAN,CAAAA;AAmBO,SAAStB,yCAAT,CACLQ,IADK,EAELqB,QAAkB,GAAG,IAAIC,IAAJ,EAFhB,EAGL;IACA,OAAOR,YAAK,CAACd,IAAD,CAAL,CAAYuB,IAAZ,CAAiBF,QAAjB,CAAP,CAAA;CACD;AAmBM,SAASR,yCAAT,CACLb,IADK,EAELqB,QAAkB,GAAG,IAAIC,IAAJ,EAFhB,EAGL;IACA,MAAME,OAAO,GAAGV,YAAK,CAACd,IAAD,CAAL,CAAYyB,MAAZ,CAAmBJ,QAAnB,EAA6B,KAA7B,CAAhB,AAAA;IAEA,IAAI,CAACG,OAAL,EACE,6EAAA;IACA,gFAAA;IACA,OAAOV,YAAK,CAACd,IAAD,CAAL,CAAY0B,QAAZ,CAAqBL,QAArB,EAA+B;QACpCM,QAAQ,EAAE,aAAVA;KADK,CAAP,CAAsC;IANxC,CAWA,oBAFC;IAGD,OAAOnC,yCAAsB,CAACQ,IAAD,EAAOqB,QAAP,CAA7B,CAAA;CACD;;;;AHxCD,MAAMnB,+BAAS,GAAG,CAChB,EA1BF,MA2BIF,IADF,CAAA,UAEEC,MAAM,GAAG,MAFX,WAGEE,MAAM,GAAG,iBAHX,GAIE,GAAGC,UAAH,EALc,EAOhBC,GAPgB,GAQb;IACH,MAAMG,mBAAmB,GAAGjB,yCAA6B,CAACS,IAAD,CAAzD,AAAA;IAEA,qBACE,2BAAC,MAAD;QACE,QAAA,EAAUQ,mBAAD;QACT,cAAA,EAAcL,MAAD;QACb,GAAIC,UAAJ;QACA,GAAA,EAAKC,GAAD;OAEHf,yCAAiB,CAACU,IAAD,EAAOC,MAAP,CAAlB,CAPJ,CAQF;CAnBA,AAqBC;AAKM,MAAMf,yCAAQ,iBAAGO,YAAK,CAACgB,UAAN,CAAiBP,+BAAjB,CAAjB,AAAP;;ADnDA;AKAA;;;;;;AAWAY,YAAK,CAACE,MAAN,CAAaD,qBAAb,CAAAD,CAAAA;AACAA,YAAK,CAACE,MAAN,CAAaG,8BAAb,CAAAL,CAAAA;AACAA,YAAK,CAACE,MAAN,CAAaI,0BAAb,CAAAN,CAAAA;AAiCA,MAAMgB,uCAAiB,GAAG,CACxB,EA/CF,MAgDI9B,IADF,CAAA,EA/CF,UAiDIqB,QAFF,CAAA,2BAGEQ,uBAAuB,GAAG,KAH5B,WAIE1B,MAAM,GAAG,0BAJX,GAKE,GAAGC,UAAH,EANsB,EAQxBC,GARwB,GASrB;IACH,MAAM0B,GAAG,GAAG,IAAIT,IAAJ,EAAZ,AAAA;IACA,MAAMU,aAAa,GAAGX,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIU,GAAlC,AAAA;IACA,MAAME,SAAS,GAAGnB,YAAK,CAACd,IAAD,CAAvB,AAAA;IACA,MAAMQ,mBAAmB,GAAGjB,yCAA6B,CAACS,IAAD,CAAzD,AAAA;IAEA,IAAIkC,YAAY,AAAhB,AAAA;IAEA,IAAIL,uBAAuB,IAAI,CAACI,SAAS,CAACR,MAAV,CAAiBO,aAAjB,EAAgC,KAAhC,CAAhC,EACE;;;;;OAKJ,CACIE,YAAY,GAAGrB,yCAAmC,CAACb,IAAD,EAAOgC,aAAP,CAAlD,CAAAE;SAEA,8DAAA;IACAA,YAAY,GAAG1C,yCAAsB,CAACQ,IAAD,EAAOgC,aAAP,CAArC,CAAAE;IAGF,qBACE,2BAAC,MAAD;QACE,QAAA,EAAU1B,mBAAD;QACT,cAAA,EAAcL,MAAD;QACb,GAAIC,UAAJ;QACA,GAAA,EAAKC,GAAD;OAEH6B,YAAD,CAPJ,CAQF;CAtCA,AAwCC;AAMM,MAAM9C,yCAAgB,iBAAGK,YAAK,CAACgB,UAAN,CAAiBqB,uCAAjB,CAAzB,AAAP;","sources":["packages/components/datetime/src/index.ts","packages/components/datetime/src/DateTime/DateTime.tsx","packages/components/datetime/src/utils/index.ts","packages/components/datetime/src/utils/formatDateTimeUtils.ts","packages/components/datetime/src/utils/relativeDateTimeUtils.ts","packages/components/datetime/src/RelativeDateTime/RelativeDateTime.tsx"],"sourcesContent":["export { DateTime } from './DateTime/DateTime';\nexport type { DateTimeProps } from './DateTime/DateTime';\nexport { RelativeDateTime } from './RelativeDateTime/RelativeDateTime';\nexport type { RelativeDateTimeProps } from './RelativeDateTime/RelativeDateTime';\nexport {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n} from './utils';\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport type { DateType, DateFormat } from '../types';\nimport { formatDateAndTime, formatMachineReadableDateTime } from '../utils';\n\ninterface DateTimeOwnProps extends CommonProps {\n /*\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n The format in which the date will be presented\n \n @default full\n /\n format?: DateFormat;\n}\n\nexport type DateTimeProps = PropsWithHTMLElement<DateTimeOwnProps, 'time'>;\n\nconst _DateTime = (\n {\n date,\n format = 'full',\n testId = 'cf-ui-date-time',\n ...otherProps\n }: ExpandProps<DateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {formatDateAndTime(date, format)}\n </time>\n );\n};\n\n/\n * The DateTime component will format a date to a human friendly format and wrap it in a `<time>` tag\n /\nexport const DateTime = React.forwardRef(_DateTime);\n","export {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatDate,\n formatTime,\n formatWeekdayDate,\n} from './formatDateTimeUtils';\n\nexport {\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from './relativeDateTimeUtils';\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\ndayjs.extend(utcPlugin);\n\nimport type { DateType, DateFormat } from '../types';\n\n/\n A funtion that will return a formatted date string. The format will dependend on the option\n * passed in the second argument.\n * By default, it will return a string with Forma 36’s \"full\" format (e.g. Tue, 17 Aug 2021 at 3:45 PM)\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00') // returns \"Tue, 17 Aug 2021 at 3:45 PM\"\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00', 'day') // returns \"17 Aug 2021\"\n /\nexport function formatDateAndTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'DD MMM YYYY'; // 17 Aug 2021\n break;\n case 'weekday':\n template = 'ddd, DD MMM'; // Tue, 17 Aug\n break;\n case 'time':\n template = 'h:mm A'; // 3:45 PM\n break;\n case 'fullWithSeconds':\n template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM\n break;\n default:\n template = 'ddd, DD MMM YYYY [at] h:mm A'; // Tue, 17 Aug 2021 at 3:45 PM\n }\n\n return dayjs(date).format(template);\n}\n\n/\n A funtion that will return a machine-readable date string that should be passed to the `datetime` attribute of a `<time>` tag\n * By default, it will return a string with \"YYYY-MM-DDTHH:mm:ss.SSS[Z]\" format\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatMachineReadableDateTime(date) // returns 2019-08-13T10:00:00.000Z\n \n @example\n * formatMachineReadableDateTime(date, 'day') // returns 2019-08-13\n /\nexport function formatMachineReadableDateTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'YYYY-MM-DD'; // 2019-08-24\n break;\n case 'weekday':\n template = 'MM-DD'; // 08-24\n break;\n case 'time':\n template = 'HH:mm:ss.SSS'; // 15:44:07.000\n break;\n default:\n template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]'; // 2019-08-24T15:44:07.000Z\n }\n\n return dayjs(date).utc().format(template);\n}\n\n/\n @example\n * > formatDate(date)\n * 13 Aug 2019\n /\nexport const formatDate = (date: DateType): string => {\n return formatDateAndTime(date, 'day');\n};\n\n/\n @example\n * > formatTime(date)\n * 8:00 AM\n /\nexport const formatTime = (date: DateType): string => {\n return formatDateAndTime(date, 'time');\n};\n\n/\n @example\n * > formatWeekdayDate(date)\n * Mon, 12 Aug\n /\nexport const formatWeekdayDate = (date: DateType): string => {\n return formatDateAndTime(date, 'weekday');\n};\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\n\n/\n A function that will return a string with how far a given date is in the past or future,\n * using a baseDate as reference. If the baseDate is not passed, the function will use today as reference.\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeDateTime('2021-08-17T15:45:00') // returns \"a day ago\"\n \n @example\n * formatRelativeDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"in a day\"\n /\nexport function formatRelativeDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n return dayjs(date).from(baseDate);\n}\n\n/\n A function that formats a date relative to Today or to the `baseDate` if passed.\n * If the date is not today, it will return a string with \"Yesterday ...\", \"Tomorrow ...\", etc\n * If the date is not in the current week, it return a string with \"DD MMM YYYY\" format\n * If the date is today, it will return a string with \"... ago\" or \"in ...\"\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00') // returns \"Yesterday at 3:45 PM\"\n \n @example\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"Tomorrow at 3:45 PM\"\n /\nexport function formatRelativeToCurrentWeekDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n const isToday = dayjs(date).isSame(baseDate, 'day');\n\n if (!isToday) {\n // if the date is not today, we display it with \"Yesterday\", \"Tomorrow\", etc.\n // and if the date is not in the current week then it will display \"17 Aug 2021\"\n return dayjs(date).calendar(baseDate, {\n sameElse: 'DD MMM YYYY',\n });\n }\n\n // returns \"... ago\"\n return formatRelativeDateTime(date, baseDate);\n}\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\nimport {\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from '../utils';\n\ninterface RelativeDateTimeInternalProps extends CommonProps {\n /\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n If a value is passed to baseDate, then the component will compare both dates and return the time between them.\n * If no value is passed then the date will be compared to \"now\"\n \n @default \"Now\"\n /\n baseDate?: DateType;\n /\n Sets the date to be relative only if it is in the current week\n * @default false\n /\n isRelativeToCurrentWeek?: boolean;\n}\n\nexport type RelativeDateTimeProps = PropsWithHTMLElement<\n RelativeDateTimeInternalProps,\n 'time'\n>;\n\nconst _RelativeDateTime = (\n {\n date,\n baseDate,\n isRelativeToCurrentWeek = false,\n testId = 'cf-ui-relative-date-time',\n ...otherProps\n }: ExpandProps<RelativeDateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const now = new Date();\n const referenceDate = baseDate ?? now;\n const dayjsDate = dayjs(date);\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n let relativeDate: string;\n\n if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) {\n /\n if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc\n * or, if the date is not in the current week, it displays \"17 Aug 2021\"\n \n check formatRelativeToCurrentWeekDateTime for more details\n /\n relativeDate = formatRelativeToCurrentWeekDateTime(date, referenceDate);\n } else {\n // otherwise we display it with \"... ago\" or \"in ...\" notation\n relativeDate = formatRelativeDateTime(date, referenceDate);\n }\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {relativeDate}\n </time>\n );\n};\n\n/\n The RelativeDateTime will show a `date` relative to \"now\" or to the `baseDate`\n * (e.g. in a day, in one month, one month ago, etc).\n */\nexport const RelativeDateTime = React.forwardRef(_RelativeDateTime);\n"],"names":["DateTime","DateTimeProps","RelativeDateTime","RelativeDateTimeProps","formatDateAndTime","formatMachineReadableDateTime","formatRelativeDateTime","React","CommonProps","PropsWithHTMLElement","ExpandProps","DateType","DateFormat","DateTimeOwnProps","date","format","_DateTime","testId","otherProps","ref","Ref","HTMLTimeElement","machineReadableDate","forwardRef","formatDate","formatTime","formatWeekdayDate","formatRelativeToCurrentWeekDateTime","dayjs","utcPlugin","extend","template","utc","relativeTime","calendarPlugin","baseDate","Date","from","isToday","isSame","calendar","sameElse","RelativeDateTimeInternalProps","isRelativeToCurrentWeek","_RelativeDateTime","now","referenceDate","dayjsDate","relativeDate"],"version":3,"file":"module.js.map"}
1	+ {"mappings":"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","sources":["packages/components/datetime/src/index.ts","packages/components/datetime/src/DateTime/DateTime.tsx","packages/components/datetime/src/utils/index.ts","packages/components/datetime/src/utils/formatDateTimeUtils.ts","packages/components/datetime/src/utils/relativeDateTimeUtils.ts","packages/components/datetime/src/RelativeDateTime/RelativeDateTime.tsx"],"sourcesContent":["export { DateTime } from './DateTime/DateTime';\nexport type { DateTimeProps } from './DateTime/DateTime';\nexport { RelativeDateTime } from './RelativeDateTime/RelativeDateTime';\nexport type { RelativeDateTimeProps } from './RelativeDateTime/RelativeDateTime';\nexport {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n} from './utils';\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport type { DateType, DateFormat } from '../types';\nimport { formatDateAndTime, formatMachineReadableDateTime } from '../utils';\n\ninterface DateTimeOwnProps extends CommonProps {\n /*\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n The format in which the date will be presented\n \n @default full\n /\n format?: DateFormat;\n}\n\nexport type DateTimeProps = PropsWithHTMLElement<DateTimeOwnProps, 'time'>;\n\nconst _DateTime = (\n {\n date,\n format = 'full',\n testId = 'cf-ui-date-time',\n ...otherProps\n }: ExpandProps<DateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {formatDateAndTime(date, format)}\n </time>\n );\n};\n\n/\n * The DateTime component will format a date to a human friendly format and wrap it in a `<time>` tag\n /\nexport const DateTime = React.forwardRef(_DateTime);\n","export {\n formatDateAndTime,\n formatMachineReadableDateTime,\n formatDate,\n formatTime,\n formatWeekdayDate,\n} from './formatDateTimeUtils';\n\nexport {\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from './relativeDateTimeUtils';\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\ndayjs.extend(utcPlugin);\n\nimport type { DateType, DateFormat } from '../types';\n\n/\n A funtion that will return a formatted date string. The format will dependend on the option\n * passed in the second argument.\n * By default, it will return a string with Forma 36’s \"full\" format (e.g. Tue, 17 Aug 2021 at 3:45 PM)\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00') // returns \"Tue, 17 Aug 2021 at 3:45 PM\"\n \n @example\n * formatDateAndTime('2021-08-17T15:45:00', 'day') // returns \"17 Aug 2021\"\n /\nexport function formatDateAndTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'DD MMM YYYY'; // 17 Aug 2021\n break;\n case 'weekday':\n template = 'ddd, DD MMM'; // Tue, 17 Aug\n break;\n case 'time':\n template = 'h:mm A'; // 3:45 PM\n break;\n case 'fullWithSeconds':\n template = 'ddd, DD MMM YYYY [at] h:mm:ss A'; // Tue, 17 Aug 2021 at 3:45:67 PM\n break;\n default:\n template = 'ddd, DD MMM YYYY [at] h:mm A'; // Tue, 17 Aug 2021 at 3:45 PM\n }\n\n return dayjs(date).format(template);\n}\n\n/\n A funtion that will return a machine-readable date string that should be passed to the `datetime` attribute of a `<time>` tag\n * By default, it will return a string with \"YYYY-MM-DDTHH:mm:ss.SSS[Z]\" format\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} format - the desired format (\"full\", \"day\", \"weekday\", or \"time\")\n * @returns a formatted date\n \n @example\n * formatMachineReadableDateTime(date) // returns 2019-08-13T10:00:00.000Z\n \n @example\n * formatMachineReadableDateTime(date, 'day') // returns 2019-08-13\n /\nexport function formatMachineReadableDateTime(\n date: DateType,\n format: DateFormat = 'full',\n): string {\n let template: string;\n\n switch (format) {\n case 'day':\n template = 'YYYY-MM-DD'; // 2019-08-24\n break;\n case 'weekday':\n template = 'MM-DD'; // 08-24\n break;\n case 'time':\n template = 'HH:mm:ss.SSS'; // 15:44:07.000\n break;\n default:\n template = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]'; // 2019-08-24T15:44:07.000Z\n }\n\n return dayjs(date).utc().format(template);\n}\n\n/\n @example\n * > formatDate(date)\n * 13 Aug 2019\n /\nexport const formatDate = (date: DateType): string => {\n return formatDateAndTime(date, 'day');\n};\n\n/\n @example\n * > formatTime(date)\n * 8:00 AM\n /\nexport const formatTime = (date: DateType): string => {\n return formatDateAndTime(date, 'time');\n};\n\n/\n @example\n * > formatWeekdayDate(date)\n * Mon, 12 Aug\n /\nexport const formatWeekdayDate = (date: DateType): string => {\n return formatDateAndTime(date, 'weekday');\n};\n","import dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\n\n/\n A function that will return a string with how far a given date is in the past or future,\n * using a baseDate as reference. If the baseDate is not passed, the function will use today as reference.\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeDateTime('2021-08-17T15:45:00') // returns \"a day ago\"\n \n @example\n * formatRelativeDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"in a day\"\n /\nexport function formatRelativeDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n return dayjs(date).from(baseDate);\n}\n\n/\n A function that formats a date relative to Today or to the `baseDate` if passed.\n * If the date is not today, it will return a string with \"Yesterday ...\", \"Tomorrow ...\", etc\n * If the date is not in the current week, it return a string with \"DD MMM YYYY\" format\n * If the date is today, it will return a string with \"... ago\" or \"in ...\"\n \n @param {DateType} date - the date to be formatted\n * @param {DateFormat} baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n \n @example\n * // Considering today as 18.08.2021\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00') // returns \"Yesterday at 3:45 PM\"\n \n @example\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"Tomorrow at 3:45 PM\"\n /\nexport function formatRelativeToCurrentWeekDateTime(\n date: DateType,\n baseDate: DateType = new Date(),\n) {\n const isToday = dayjs(date).isSame(baseDate, 'day');\n\n if (!isToday) {\n // if the date is not today, we display it with \"Yesterday\", \"Tomorrow\", etc.\n // and if the date is not in the current week then it will display \"17 Aug 2021\"\n return dayjs(date).calendar(baseDate, {\n sameElse: 'DD MMM YYYY',\n });\n }\n\n // returns \"... ago\"\n return formatRelativeDateTime(date, baseDate);\n}\n","import React from 'react';\nimport type {\n CommonProps,\n PropsWithHTMLElement,\n ExpandProps,\n} from '@contentful/f36-core';\n\nimport dayjs from 'dayjs';\nimport utcPlugin from 'dayjs/plugin/utc';\nimport relativeTime from 'dayjs/plugin/relativeTime';\nimport calendarPlugin from 'dayjs/plugin/calendar';\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from '../types';\nimport {\n formatMachineReadableDateTime,\n formatRelativeDateTime,\n formatRelativeToCurrentWeekDateTime,\n} from '../utils';\n\ninterface RelativeDateTimeInternalProps extends CommonProps {\n /\n The date that will be displayed. It accepts a JS Date, an ISO8601 Timestamp string, or Unix Epoch Milliseconds number\n /\n date: DateType;\n /\n If a value is passed to baseDate, then the component will compare both dates and return the time between them.\n * If no value is passed then the date will be compared to \"now\"\n \n @default \"Now\"\n /\n baseDate?: DateType;\n /\n Sets the date to be relative only if it is in the current week\n * @default false\n /\n isRelativeToCurrentWeek?: boolean;\n}\n\nexport type RelativeDateTimeProps = PropsWithHTMLElement<\n RelativeDateTimeInternalProps,\n 'time'\n>;\n\nconst _RelativeDateTime = (\n {\n date,\n baseDate,\n isRelativeToCurrentWeek = false,\n testId = 'cf-ui-relative-date-time',\n ...otherProps\n }: ExpandProps<RelativeDateTimeProps>,\n ref: React.Ref<HTMLTimeElement>,\n) => {\n const now = new Date();\n const referenceDate = baseDate ?? now;\n const dayjsDate = dayjs(date);\n const machineReadableDate = formatMachineReadableDateTime(date);\n\n let relativeDate: string;\n\n if (isRelativeToCurrentWeek && !dayjsDate.isSame(referenceDate, 'day')) {\n /\n if isRelativeToCurrentWeek is true and the date is not today, we display the date with Yesterday, Tomorrow, etc\n * or, if the date is not in the current week, it displays \"17 Aug 2021\"\n \n check formatRelativeToCurrentWeekDateTime for more details\n /\n relativeDate = formatRelativeToCurrentWeekDateTime(date, referenceDate);\n } else {\n // otherwise we display it with \"... ago\" or \"in ...\" notation\n relativeDate = formatRelativeDateTime(date, referenceDate);\n }\n\n return (\n <time\n dateTime={machineReadableDate}\n data-test-id={testId}\n {...otherProps}\n ref={ref}\n >\n {relativeDate}\n </time>\n );\n};\n\n/\n The RelativeDateTime will show a `date` relative to \"now\" or to the `baseDate`\n * (e.g. in a day, in one month, one month ago, etc).\n */\nexport const RelativeDateTime = React.forwardRef(_RelativeDateTime);\n"],"names":["DateTime","DateTimeProps","RelativeDateTime","RelativeDateTimeProps","formatDateAndTime","formatMachineReadableDateTime","formatRelativeDateTime","React","CommonProps","PropsWithHTMLElement","ExpandProps","DateType","DateFormat","DateTimeOwnProps","date","format","_DateTime","testId","otherProps","ref","Ref","HTMLTimeElement","machineReadableDate","forwardRef","formatDate","formatTime","formatWeekdayDate","formatRelativeToCurrentWeekDateTime","dayjs","utcPlugin","extend","template","utc","relativeTime","calendarPlugin","baseDate","Date","from","isToday","isSame","calendar","sameElse","RelativeDateTimeInternalProps","isRelativeToCurrentWeek","_RelativeDateTime","now","referenceDate","dayjsDate","relativeDate"],"version":3,"file":"module.js.map"}

package/package.json CHANGED Viewed

@@ -1,13 +1,13 @@
 {
   "name": "@contentful/f36-datetime",
-  "version": "4.12.0",
+  "version": "4.15.0",
   "description": "Forma 36: DateTime component",
   "scripts": {
     "build": "parcel build"
   },
   "dependencies": {
     "@babel/runtime": "^7.6.2",
-    "@contentful/f36-core": "^4.12.0",
+    "@contentful/f36-core": "^4.15.0",
     "@contentful/f36-tokens": "^4.0.1",
     "dayjs": "^1.10.6",
     "emotion": "^10.0.17"