@chayns-components/date 5.0.0-beta.1304 → 5.0.0-beta.1305
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.
- package/lib/cjs/components/date-info/DateInfo.js +3 -1
- package/lib/cjs/components/date-info/DateInfo.js.map +1 -1
- package/lib/cjs/hooks/useDateInfo.js +3 -1
- package/lib/cjs/hooks/useDateInfo.js.map +1 -1
- package/lib/cjs/types/dateinfo.js.map +1 -1
- package/lib/cjs/utils/dateInfo.js +27 -23
- package/lib/cjs/utils/dateInfo.js.map +1 -1
- package/lib/esm/components/date-info/DateInfo.js +3 -1
- package/lib/esm/components/date-info/DateInfo.js.map +1 -1
- package/lib/esm/hooks/useDateInfo.js +3 -1
- package/lib/esm/hooks/useDateInfo.js.map +1 -1
- package/lib/esm/types/dateinfo.js.map +1 -1
- package/lib/esm/utils/dateInfo.js +27 -23
- package/lib/esm/utils/dateInfo.js.map +1 -1
- package/lib/types/hooks/useDateInfo.d.ts +1 -1
- package/lib/types/types/dateinfo.d.ts +4 -0
- package/lib/types/utils/dateInfo.d.ts +1 -1
- package/package.json +3 -3
|
@@ -15,12 +15,14 @@ const DateInfo = ({
|
|
|
15
15
|
shouldShowRelativeDayOfWeek,
|
|
16
16
|
shouldUseShortText,
|
|
17
17
|
shouldShowDayOfWeek,
|
|
18
|
-
shouldShowDateToNowDifference
|
|
18
|
+
shouldShowDateToNowDifference,
|
|
19
|
+
shouldShowOnlyTime
|
|
19
20
|
}) => {
|
|
20
21
|
const formattedDate = (0, _useDateInfo.useDateInfo)({
|
|
21
22
|
date,
|
|
22
23
|
preText,
|
|
23
24
|
shouldShowYear,
|
|
25
|
+
shouldShowOnlyTime,
|
|
24
26
|
shouldShowTime,
|
|
25
27
|
shouldUseShortText,
|
|
26
28
|
shouldShowDayOfWeek,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInfo.js","names":["_react","_interopRequireWildcard","require","_useDateInfo","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DateInfo","date","preText","shouldShowYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","formattedDate","useDateInfo","useMemo","createElement","displayName","_default","exports"],"sources":["../../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import React, { FC, useMemo } from 'react';\nimport { useDateInfo } from '../../hooks/useDateInfo';\nimport { UseDateInfoOptions } from '../../types/dateinfo';\n\nexport type DateInfoProps = UseDateInfoOptions;\n\nconst DateInfo: FC<DateInfoProps> = ({\n date,\n preText = '',\n shouldShowYear,\n shouldShowTime,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowDateToNowDifference,\n}) => {\n const formattedDate = useDateInfo({\n date,\n preText,\n shouldShowYear,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowDateToNowDifference,\n });\n\n return useMemo(() => <span>{formattedDate}</span>, [formattedDate]);\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAAsD,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAKtD,MAAMkB,QAA2B,GAAGA,CAAC;EACjCC,IAAI;EACJC,OAAO,GAAG,EAAE;EACZC,cAAc;EACdC,cAAc;EACdC,2BAA2B;EAC3BC,kBAAkB;EAClBC,mBAAmB;EACnBC;AACJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAG,IAAAC,wBAAW,EAAC;
|
|
1
|
+
{"version":3,"file":"DateInfo.js","names":["_react","_interopRequireWildcard","require","_useDateInfo","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DateInfo","date","preText","shouldShowYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","shouldShowOnlyTime","formattedDate","useDateInfo","useMemo","createElement","displayName","_default","exports"],"sources":["../../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import React, { FC, useMemo } from 'react';\nimport { useDateInfo } from '../../hooks/useDateInfo';\nimport { UseDateInfoOptions } from '../../types/dateinfo';\n\nexport type DateInfoProps = UseDateInfoOptions;\n\nconst DateInfo: FC<DateInfoProps> = ({\n date,\n preText = '',\n shouldShowYear,\n shouldShowTime,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowDateToNowDifference,\n shouldShowOnlyTime,\n}) => {\n const formattedDate = useDateInfo({\n date,\n preText,\n shouldShowYear,\n shouldShowOnlyTime,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowDateToNowDifference,\n });\n\n return useMemo(() => <span>{formattedDate}</span>, [formattedDate]);\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAAsD,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAKtD,MAAMkB,QAA2B,GAAGA,CAAC;EACjCC,IAAI;EACJC,OAAO,GAAG,EAAE;EACZC,cAAc;EACdC,cAAc;EACdC,2BAA2B;EAC3BC,kBAAkB;EAClBC,mBAAmB;EACnBC,6BAA6B;EAC7BC;AACJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAG,IAAAC,wBAAW,EAAC;IAC9BV,IAAI;IACJC,OAAO;IACPC,cAAc;IACdM,kBAAkB;IAClBL,cAAc;IACdE,kBAAkB;IAClBC,mBAAmB;IACnBF,2BAA2B;IAC3BG;EACJ,CAAC,CAAC;EAEF,OAAO,IAAAI,cAAO,EAAC,mBAAMnC,MAAA,CAAAc,OAAA,CAAAsB,aAAA,eAAOH,aAAoB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;AACvE,CAAC;AAEDV,QAAQ,CAACc,WAAW,GAAG,UAAU;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAzB,OAAA,GAEnBS,QAAQ","ignoreList":[]}
|
|
@@ -14,6 +14,7 @@ const useDateInfo = ({
|
|
|
14
14
|
shouldShowDayOfWeek,
|
|
15
15
|
shouldShowTime,
|
|
16
16
|
shouldUseShortText,
|
|
17
|
+
shouldShowOnlyTime,
|
|
17
18
|
shouldShowYear,
|
|
18
19
|
preText
|
|
19
20
|
}) => {
|
|
@@ -29,12 +30,13 @@ const useDateInfo = ({
|
|
|
29
30
|
setFormattedDate((0, _dateInfo.getDateInfo)({
|
|
30
31
|
date,
|
|
31
32
|
shouldShowYear,
|
|
33
|
+
shouldShowOnlyTime,
|
|
32
34
|
shouldShowTime,
|
|
33
35
|
shouldUseShortText,
|
|
34
36
|
shouldShowDayOfWeek,
|
|
35
37
|
shouldShowRelativeDayOfWeek
|
|
36
38
|
}));
|
|
37
|
-
}, [date, shouldShowDateToNowDifference, shouldShowDayOfWeek, shouldShowRelativeDayOfWeek, shouldShowTime, shouldShowYear, shouldUseShortText]);
|
|
39
|
+
}, [date, shouldShowDateToNowDifference, shouldShowDayOfWeek, shouldShowOnlyTime, shouldShowRelativeDayOfWeek, shouldShowTime, shouldShowYear, shouldUseShortText]);
|
|
38
40
|
(0, _react.useEffect)(() => {
|
|
39
41
|
if (!shouldShowDateToNowDifference) return () => {};
|
|
40
42
|
const updateCurrentDate = () => setCurrentDate(new Date());
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDateInfo.js","names":["_chaynsApi","require","_react","_dateInfo","useDateInfo","date","shouldShowDateToNowDifference","shouldShowRelativeDayOfWeek","shouldShowDayOfWeek","shouldShowTime","shouldUseShortText","shouldShowYear","preText","active","language","getLanguage","formattedDate","setFormattedDate","useState","toLocaleDateString","currentDate","setCurrentDate","Date","useEffect","getDateInfo","updateCurrentDate","now","timeDiffInMs","Math","abs","getTime","updateInterval","getSeconds","intervalId","setInterval","timeout","setTimeout","clearTimeout","clearInterval","getTimeTillNow","useMemo","trim","exports"],"sources":["../../../src/hooks/useDateInfo.ts"],"sourcesContent":["import { getLanguage } from 'chayns-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { getDateInfo, getTimeTillNow } from '../utils/dateInfo';\n\nexport const useDateInfo = ({\n date,\n shouldShowDateToNowDifference,\n shouldShowRelativeDayOfWeek,\n shouldShowDayOfWeek,\n shouldShowTime,\n shouldUseShortText,\n shouldShowYear,\n preText,\n}: UseDateInfoOptions) => {\n const { active: language } = getLanguage();\n\n const [formattedDate, setFormattedDate] = useState(date.toLocaleDateString());\n const [currentDate, setCurrentDate] = useState(new Date());\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n return;\n }\n\n setFormattedDate(\n getDateInfo({\n date,\n shouldShowYear,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n }),\n );\n }, [\n date,\n shouldShowDateToNowDifference,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowTime,\n shouldShowYear,\n shouldUseShortText,\n ]);\n\n useEffect(() => {\n if (!shouldShowDateToNowDifference) return () => {};\n\n const updateCurrentDate = () => setCurrentDate(new Date());\n const now = new Date();\n const timeDiffInMs = Math.abs(date.getTime() - now.getTime());\n\n const updateInterval = timeDiffInMs < 60000 ? 1000 : 60000 - now.getSeconds() * 1000;\n\n const intervalId = setInterval(updateCurrentDate, 1000);\n const timeout = setTimeout(updateCurrentDate, updateInterval);\n\n return () => {\n clearTimeout(timeout);\n clearInterval(intervalId);\n };\n }, [date, shouldShowDateToNowDifference]);\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n setFormattedDate(getTimeTillNow({ date, currentDate, language }));\n }\n }, [date, currentDate, language, shouldShowDateToNowDifference]);\n\n return useMemo(\n () => `${preText ? `${preText.trim()} ` : ''}${formattedDate}`,\n [formattedDate, preText],\n );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AAEO,MAAMG,WAAW,GAAGA,CAAC;EACxBC,IAAI;EACJC,6BAA6B;EAC7BC,2BAA2B;EAC3BC,mBAAmB;EACnBC,cAAc;EACdC,kBAAkB;EAClBC,cAAc;EACdC;AACgB,CAAC,KAAK;EACtB,MAAM;IAAEC,MAAM,EAAEC;EAAS,CAAC,GAAG,IAAAC,sBAAW,EAAC,CAAC;EAE1C,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,
|
|
1
|
+
{"version":3,"file":"useDateInfo.js","names":["_chaynsApi","require","_react","_dateInfo","useDateInfo","date","shouldShowDateToNowDifference","shouldShowRelativeDayOfWeek","shouldShowDayOfWeek","shouldShowTime","shouldUseShortText","shouldShowOnlyTime","shouldShowYear","preText","active","language","getLanguage","formattedDate","setFormattedDate","useState","toLocaleDateString","currentDate","setCurrentDate","Date","useEffect","getDateInfo","updateCurrentDate","now","timeDiffInMs","Math","abs","getTime","updateInterval","getSeconds","intervalId","setInterval","timeout","setTimeout","clearTimeout","clearInterval","getTimeTillNow","useMemo","trim","exports"],"sources":["../../../src/hooks/useDateInfo.ts"],"sourcesContent":["import { getLanguage } from 'chayns-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { getDateInfo, getTimeTillNow } from '../utils/dateInfo';\n\nexport const useDateInfo = ({\n date,\n shouldShowDateToNowDifference,\n shouldShowRelativeDayOfWeek,\n shouldShowDayOfWeek,\n shouldShowTime,\n shouldUseShortText,\n shouldShowOnlyTime,\n shouldShowYear,\n preText,\n}: UseDateInfoOptions) => {\n const { active: language } = getLanguage();\n\n const [formattedDate, setFormattedDate] = useState(date.toLocaleDateString());\n const [currentDate, setCurrentDate] = useState(new Date());\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n return;\n }\n\n setFormattedDate(\n getDateInfo({\n date,\n shouldShowYear,\n shouldShowOnlyTime,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n }),\n );\n }, [\n date,\n shouldShowDateToNowDifference,\n shouldShowDayOfWeek,\n shouldShowOnlyTime,\n shouldShowRelativeDayOfWeek,\n shouldShowTime,\n shouldShowYear,\n shouldUseShortText,\n ]);\n\n useEffect(() => {\n if (!shouldShowDateToNowDifference) return () => {};\n\n const updateCurrentDate = () => setCurrentDate(new Date());\n const now = new Date();\n const timeDiffInMs = Math.abs(date.getTime() - now.getTime());\n\n const updateInterval = timeDiffInMs < 60000 ? 1000 : 60000 - now.getSeconds() * 1000;\n\n const intervalId = setInterval(updateCurrentDate, 1000);\n const timeout = setTimeout(updateCurrentDate, updateInterval);\n\n return () => {\n clearTimeout(timeout);\n clearInterval(intervalId);\n };\n }, [date, shouldShowDateToNowDifference]);\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n setFormattedDate(getTimeTillNow({ date, currentDate, language }));\n }\n }, [date, currentDate, language, shouldShowDateToNowDifference]);\n\n return useMemo(\n () => `${preText ? `${preText.trim()} ` : ''}${formattedDate}`,\n [formattedDate, preText],\n );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AAEO,MAAMG,WAAW,GAAGA,CAAC;EACxBC,IAAI;EACJC,6BAA6B;EAC7BC,2BAA2B;EAC3BC,mBAAmB;EACnBC,cAAc;EACdC,kBAAkB;EAClBC,kBAAkB;EAClBC,cAAc;EACdC;AACgB,CAAC,KAAK;EACtB,MAAM;IAAEC,MAAM,EAAEC;EAAS,CAAC,GAAG,IAAAC,sBAAW,EAAC,CAAC;EAE1C,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,EAACd,IAAI,CAACe,kBAAkB,CAAC,CAAC,CAAC;EAC7E,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAH,eAAQ,EAAC,IAAII,IAAI,CAAC,CAAC,CAAC;EAE1D,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIlB,6BAA6B,EAAE;MAC/B;IACJ;IAEAY,gBAAgB,CACZ,IAAAO,qBAAW,EAAC;MACRpB,IAAI;MACJO,cAAc;MACdD,kBAAkB;MAClBF,cAAc;MACdC,kBAAkB;MAClBF,mBAAmB;MACnBD;IACJ,CAAC,CACL,CAAC;EACL,CAAC,EAAE,CACCF,IAAI,EACJC,6BAA6B,EAC7BE,mBAAmB,EACnBG,kBAAkB,EAClBJ,2BAA2B,EAC3BE,cAAc,EACdG,cAAc,EACdF,kBAAkB,CACrB,CAAC;EAEF,IAAAc,gBAAS,EAAC,MAAM;IACZ,IAAI,CAAClB,6BAA6B,EAAE,OAAO,MAAM,CAAC,CAAC;IAEnD,MAAMoB,iBAAiB,GAAGA,CAAA,KAAMJ,cAAc,CAAC,IAAIC,IAAI,CAAC,CAAC,CAAC;IAC1D,MAAMI,GAAG,GAAG,IAAIJ,IAAI,CAAC,CAAC;IACtB,MAAMK,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACzB,IAAI,CAAC0B,OAAO,CAAC,CAAC,GAAGJ,GAAG,CAACI,OAAO,CAAC,CAAC,CAAC;IAE7D,MAAMC,cAAc,GAAGJ,YAAY,GAAG,KAAK,GAAG,IAAI,GAAG,KAAK,GAAGD,GAAG,CAACM,UAAU,CAAC,CAAC,GAAG,IAAI;IAEpF,MAAMC,UAAU,GAAGC,WAAW,CAACT,iBAAiB,EAAE,IAAI,CAAC;IACvD,MAAMU,OAAO,GAAGC,UAAU,CAACX,iBAAiB,EAAEM,cAAc,CAAC;IAE7D,OAAO,MAAM;MACTM,YAAY,CAACF,OAAO,CAAC;MACrBG,aAAa,CAACL,UAAU,CAAC;IAC7B,CAAC;EACL,CAAC,EAAE,CAAC7B,IAAI,EAAEC,6BAA6B,CAAC,CAAC;EAEzC,IAAAkB,gBAAS,EAAC,MAAM;IACZ,IAAIlB,6BAA6B,EAAE;MAC/BY,gBAAgB,CAAC,IAAAsB,wBAAc,EAAC;QAAEnC,IAAI;QAAEgB,WAAW;QAAEN;MAAS,CAAC,CAAC,CAAC;IACrE;EACJ,CAAC,EAAE,CAACV,IAAI,EAAEgB,WAAW,EAAEN,QAAQ,EAAET,6BAA6B,CAAC,CAAC;EAEhE,OAAO,IAAAmC,cAAO,EACV,MAAM,GAAG5B,OAAO,GAAG,GAAGA,OAAO,CAAC6B,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,GAAGzB,aAAa,EAAE,EAC9D,CAACA,aAAa,EAAEJ,OAAO,CAC3B,CAAC;AACL,CAAC;AAAC8B,OAAA,CAAAvC,WAAA,GAAAA,WAAA","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateinfo.js","names":[],"sources":["../../../src/types/dateinfo.ts"],"sourcesContent":["import type { Language } from 'chayns-api';\n\nexport interface UseDateInfoOptions {\n /**\n * The date that should be displayed\n */\n date: Date;\n /**\n * The language that should be used for the date. Defaults to the active language given by chayns api.\n */\n language?: Language;\n /**\n * Additional text for the \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time.\n */\n preText?: string;\n /**\n * Adds the current year to the display\n */\n shouldShowYear?: boolean;\n /**\n * Adds the time to the display.\n */\n shouldShowTime?: boolean;\n /**\n * Whether the relative day of the week to today should be shown (today, yesterday or tomorrow).\n */\n shouldShowRelativeDayOfWeek?: boolean;\n /**\n * Shortens the day and month text to the maximum three digits\n */\n shouldUseShortText?: boolean;\n /**\n * Adds the day of the week to the display\n */\n shouldShowDayOfWeek?: boolean;\n /**\n * Shows the difference from the date to now. The component handles updates itself.\n */\n shouldShowDateToNowDifference?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"dateinfo.js","names":[],"sources":["../../../src/types/dateinfo.ts"],"sourcesContent":["import type { Language } from 'chayns-api';\n\nexport interface UseDateInfoOptions {\n /**\n * The date that should be displayed\n */\n date: Date;\n /**\n * The language that should be used for the date. Defaults to the active language given by chayns api.\n */\n language?: Language;\n /**\n * Additional text for the \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time.\n */\n preText?: string;\n /**\n * Adds the current year to the display\n */\n shouldShowYear?: boolean;\n /**\n * Adds the time to the display.\n */\n shouldShowTime?: boolean;\n /**\n * Whether the relative day of the week to today should be shown (today, yesterday or tomorrow).\n */\n shouldShowRelativeDayOfWeek?: boolean;\n /**\n * Shortens the day and month text to the maximum three digits\n */\n shouldUseShortText?: boolean;\n /**\n * Adds the day of the week to the display\n */\n shouldShowDayOfWeek?: boolean;\n /**\n * Shows the difference from the date to now. The component handles updates itself.\n */\n shouldShowDateToNowDifference?: boolean;\n /**\n * Whether only the time should be displayed.\n */\n shouldShowOnlyTime?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
@@ -11,6 +11,7 @@ const getDateInfo = ({
|
|
|
11
11
|
language,
|
|
12
12
|
shouldShowYear,
|
|
13
13
|
shouldShowTime,
|
|
14
|
+
shouldShowOnlyTime,
|
|
14
15
|
shouldShowDayOfWeek,
|
|
15
16
|
shouldShowRelativeDayOfWeek,
|
|
16
17
|
shouldUseShortText
|
|
@@ -18,6 +19,24 @@ const getDateInfo = ({
|
|
|
18
19
|
const {
|
|
19
20
|
active: activeLanguage
|
|
20
21
|
} = (0, _chaynsApi.getLanguage)();
|
|
22
|
+
const timeParts = {};
|
|
23
|
+
if (shouldShowTime || shouldShowOnlyTime) {
|
|
24
|
+
timeParts.hour = '2-digit';
|
|
25
|
+
timeParts.minute = '2-digit';
|
|
26
|
+
}
|
|
27
|
+
let formattedTime = '';
|
|
28
|
+
if (Object.keys(timeParts).length > 0) {
|
|
29
|
+
formattedTime = `${shouldShowOnlyTime ? '' : ', '}${date.toLocaleTimeString(language ?? activeLanguage, {
|
|
30
|
+
...timeParts
|
|
31
|
+
})}`;
|
|
32
|
+
}
|
|
33
|
+
const hourWord = getTimeString({
|
|
34
|
+
language: language ?? activeLanguage
|
|
35
|
+
});
|
|
36
|
+
formattedTime += shouldShowTime || shouldShowOnlyTime ? ` ${hourWord}` : '';
|
|
37
|
+
if (shouldShowOnlyTime) {
|
|
38
|
+
return formattedTime;
|
|
39
|
+
}
|
|
21
40
|
let dayPart = '';
|
|
22
41
|
if (shouldShowRelativeDayOfWeek) {
|
|
23
42
|
const rtf = new Intl.RelativeTimeFormat(language ?? activeLanguage, {
|
|
@@ -45,21 +64,6 @@ const getDateInfo = ({
|
|
|
45
64
|
if (shouldShowYear && !(0, _date.isCurrentYear)(date)) {
|
|
46
65
|
dateParts.year = 'numeric';
|
|
47
66
|
}
|
|
48
|
-
const timeParts = {};
|
|
49
|
-
if (shouldShowTime) {
|
|
50
|
-
timeParts.hour = '2-digit';
|
|
51
|
-
timeParts.minute = '2-digit';
|
|
52
|
-
}
|
|
53
|
-
let formattedTime = '';
|
|
54
|
-
if (Object.keys(timeParts).length > 0) {
|
|
55
|
-
formattedTime = `, ${date.toLocaleTimeString(language ?? activeLanguage, {
|
|
56
|
-
...timeParts
|
|
57
|
-
})}`;
|
|
58
|
-
}
|
|
59
|
-
const hourWord = getTimeString({
|
|
60
|
-
language: language ?? activeLanguage
|
|
61
|
-
});
|
|
62
|
-
formattedTime += shouldShowTime ? ` ${hourWord}` : '';
|
|
63
67
|
const formattedDate = `${date.toLocaleDateString(language ?? activeLanguage, dateParts)}${formattedTime}`;
|
|
64
68
|
return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;
|
|
65
69
|
};
|
|
@@ -129,15 +133,15 @@ const getTimeString = ({
|
|
|
129
133
|
language
|
|
130
134
|
}) => {
|
|
131
135
|
const map = {
|
|
132
|
-
nl: '
|
|
133
|
-
fr: '
|
|
136
|
+
nl: '',
|
|
137
|
+
fr: '',
|
|
134
138
|
de: 'Uhr',
|
|
135
|
-
es: '
|
|
136
|
-
it: '
|
|
137
|
-
pt: '
|
|
138
|
-
pl: '
|
|
139
|
-
tr: '
|
|
140
|
-
uk: '
|
|
139
|
+
es: '',
|
|
140
|
+
it: '',
|
|
141
|
+
pt: '',
|
|
142
|
+
pl: '',
|
|
143
|
+
tr: '',
|
|
144
|
+
uk: '',
|
|
141
145
|
en: ''
|
|
142
146
|
};
|
|
143
147
|
return map[language ?? ''] ?? '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateInfo.js","names":["_chaynsApi","require","_date","getDateInfo","date","language","shouldShowYear","shouldShowTime","shouldShowDayOfWeek","shouldShowRelativeDayOfWeek","shouldUseShortText","active","activeLanguage","getLanguage","
|
|
1
|
+
{"version":3,"file":"dateInfo.js","names":["_chaynsApi","require","_date","getDateInfo","date","language","shouldShowYear","shouldShowTime","shouldShowOnlyTime","shouldShowDayOfWeek","shouldShowRelativeDayOfWeek","shouldUseShortText","active","activeLanguage","getLanguage","timeParts","hour","minute","formattedTime","Object","keys","length","toLocaleTimeString","hourWord","getTimeString","dayPart","rtf","Intl","RelativeTimeFormat","numeric","isToday","capitalizeFirstLetter","format","isTomorrow","isYesterday","toLocaleDateString","weekday","dateParts","day","month","isCurrentYear","year","formattedDate","exports","text","charAt","toUpperCase","slice","getTimeTillNow","currentDate","Language","English","diffInSeconds","Math","floor","getTime","isPast","units","label","seconds","absDiff","abs","find","u","count","formatter","getFormattedTime","shouldShowSeconds","timeOptions","second","undefined","replace","trim","map","nl","fr","de","es","it","pt","pl","tr","uk","en"],"sources":["../../../src/utils/dateInfo.ts"],"sourcesContent":["import { getLanguage, Language } from 'chayns-api';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { isCurrentYear, isToday, isTomorrow, isYesterday } from './date';\n\nexport const getDateInfo = ({\n date,\n language,\n shouldShowYear,\n shouldShowTime,\n shouldShowOnlyTime,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n}: Omit<UseDateInfoOptions, 'shouldShowDateToNowDifference' & 'preText'>) => {\n const { active: activeLanguage } = getLanguage();\n\n const timeParts: Intl.DateTimeFormatOptions = {};\n\n if (shouldShowTime || shouldShowOnlyTime) {\n timeParts.hour = '2-digit';\n timeParts.minute = '2-digit';\n }\n\n let formattedTime = '';\n if (Object.keys(timeParts).length > 0) {\n formattedTime = `${shouldShowOnlyTime ? '' : ', '}${date.toLocaleTimeString(language ?? activeLanguage, { ...timeParts })}`;\n }\n\n const hourWord = getTimeString({ language: language ?? activeLanguage });\n\n formattedTime += shouldShowTime || shouldShowOnlyTime ? ` ${hourWord}` : '';\n\n if (shouldShowOnlyTime) {\n return formattedTime;\n }\n\n let dayPart = '';\n\n if (shouldShowRelativeDayOfWeek) {\n const rtf = new Intl.RelativeTimeFormat(language ?? activeLanguage, { numeric: 'auto' });\n\n if (isToday(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(0, 'day'));\n }\n\n if (isTomorrow(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(1, 'day'));\n }\n\n if (isYesterday(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(-1, 'day'));\n }\n }\n\n if (!dayPart && shouldShowDayOfWeek) {\n dayPart = date.toLocaleDateString(language ?? activeLanguage, {\n weekday: shouldUseShortText ? 'short' : 'long',\n });\n }\n\n const dateParts: Intl.DateTimeFormatOptions = {\n day: '2-digit',\n month: shouldUseShortText ? 'short' : 'long',\n };\n\n if (shouldShowYear && !isCurrentYear(date)) {\n dateParts.year = 'numeric';\n }\n\n const formattedDate = `${date.toLocaleDateString(language ?? activeLanguage, dateParts)}${formattedTime}`;\n\n return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;\n};\n\nconst capitalizeFirstLetter = (text: string): string =>\n text.charAt(0).toUpperCase() + text.slice(1);\n\ntype RelativeTimeUnit = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';\n\ninterface GetTimeTillNow {\n date: Date;\n currentDate: Date;\n language: Language;\n}\n\nexport const getTimeTillNow = ({\n date,\n currentDate,\n language = Language.English,\n}: GetTimeTillNow): string => {\n const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);\n const isPast = diffInSeconds > 0;\n\n const units: { label: RelativeTimeUnit; seconds: number }[] = [\n { label: 'year', seconds: 31536000 },\n { label: 'month', seconds: 2592000 },\n { label: 'day', seconds: 86400 },\n { label: 'hour', seconds: 3600 },\n { label: 'minute', seconds: 60 },\n { label: 'second', seconds: 1 },\n ];\n\n const absDiff = Math.abs(diffInSeconds);\n const { label, seconds } = units.find((u) => absDiff >= u.seconds) || {\n label: 'second',\n seconds: 1,\n };\n const count = Math.floor(absDiff / seconds);\n\n const formatter = new Intl.RelativeTimeFormat(language, { numeric: 'auto' });\n\n return formatter.format(isPast ? -count : count, label);\n};\n\ninterface GetFormattedTimeOptions {\n date: Date;\n shouldShowSeconds?: boolean;\n}\n\nexport const getFormattedTime = ({\n date,\n shouldShowSeconds = false,\n}: GetFormattedTimeOptions): string => {\n const { active: language } = getLanguage();\n\n const timeOptions: Intl.DateTimeFormatOptions = {\n hour: '2-digit',\n minute: '2-digit',\n second: shouldShowSeconds ? '2-digit' : undefined,\n };\n\n const formattedTime = date.toLocaleTimeString(language, timeOptions).replace(/^0/, '');\n\n const hourWord = getTimeString({ language });\n\n return `${formattedTime} ${hourWord}`.trim();\n};\n\ninterface GetTimeStringProps {\n language?: Language;\n}\n\nexport const getTimeString = ({ language }: GetTimeStringProps) => {\n const map: { [key: string]: string } = {\n nl: '',\n fr: '',\n de: 'Uhr',\n es: '',\n it: '',\n pt: '',\n pl: '',\n tr: '',\n uk: '',\n en: '',\n };\n\n return map[language ?? ''] ?? '';\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,12 +8,14 @@ const DateInfo = ({
|
|
|
8
8
|
shouldShowRelativeDayOfWeek,
|
|
9
9
|
shouldUseShortText,
|
|
10
10
|
shouldShowDayOfWeek,
|
|
11
|
-
shouldShowDateToNowDifference
|
|
11
|
+
shouldShowDateToNowDifference,
|
|
12
|
+
shouldShowOnlyTime
|
|
12
13
|
}) => {
|
|
13
14
|
const formattedDate = useDateInfo({
|
|
14
15
|
date,
|
|
15
16
|
preText,
|
|
16
17
|
shouldShowYear,
|
|
18
|
+
shouldShowOnlyTime,
|
|
17
19
|
shouldShowTime,
|
|
18
20
|
shouldUseShortText,
|
|
19
21
|
shouldShowDayOfWeek,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInfo.js","names":["React","useMemo","useDateInfo","DateInfo","date","preText","shouldShowYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","formattedDate","createElement","displayName"],"sources":["../../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import React, { FC, useMemo } from 'react';\nimport { useDateInfo } from '../../hooks/useDateInfo';\nimport { UseDateInfoOptions } from '../../types/dateinfo';\n\nexport type DateInfoProps = UseDateInfoOptions;\n\nconst DateInfo: FC<DateInfoProps> = ({\n date,\n preText = '',\n shouldShowYear,\n shouldShowTime,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowDateToNowDifference,\n}) => {\n const formattedDate = useDateInfo({\n date,\n preText,\n shouldShowYear,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowDateToNowDifference,\n });\n\n return useMemo(() => <span>{formattedDate}</span>, [formattedDate]);\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,OAAO,QAAQ,OAAO;AAC1C,SAASC,WAAW,QAAQ,yBAAyB;AAKrD,MAAMC,QAA2B,GAAGA,CAAC;EACjCC,IAAI;EACJC,OAAO,GAAG,EAAE;EACZC,cAAc;EACdC,cAAc;EACdC,2BAA2B;EAC3BC,kBAAkB;EAClBC,mBAAmB;EACnBC;AACJ,CAAC,KAAK;EACF,MAAMC,aAAa,
|
|
1
|
+
{"version":3,"file":"DateInfo.js","names":["React","useMemo","useDateInfo","DateInfo","date","preText","shouldShowYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","shouldShowOnlyTime","formattedDate","createElement","displayName"],"sources":["../../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import React, { FC, useMemo } from 'react';\nimport { useDateInfo } from '../../hooks/useDateInfo';\nimport { UseDateInfoOptions } from '../../types/dateinfo';\n\nexport type DateInfoProps = UseDateInfoOptions;\n\nconst DateInfo: FC<DateInfoProps> = ({\n date,\n preText = '',\n shouldShowYear,\n shouldShowTime,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowDateToNowDifference,\n shouldShowOnlyTime,\n}) => {\n const formattedDate = useDateInfo({\n date,\n preText,\n shouldShowYear,\n shouldShowOnlyTime,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowDateToNowDifference,\n });\n\n return useMemo(() => <span>{formattedDate}</span>, [formattedDate]);\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,OAAO,QAAQ,OAAO;AAC1C,SAASC,WAAW,QAAQ,yBAAyB;AAKrD,MAAMC,QAA2B,GAAGA,CAAC;EACjCC,IAAI;EACJC,OAAO,GAAG,EAAE;EACZC,cAAc;EACdC,cAAc;EACdC,2BAA2B;EAC3BC,kBAAkB;EAClBC,mBAAmB;EACnBC,6BAA6B;EAC7BC;AACJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAGX,WAAW,CAAC;IAC9BE,IAAI;IACJC,OAAO;IACPC,cAAc;IACdM,kBAAkB;IAClBL,cAAc;IACdE,kBAAkB;IAClBC,mBAAmB;IACnBF,2BAA2B;IAC3BG;EACJ,CAAC,CAAC;EAEF,OAAOV,OAAO,CAAC,mBAAMD,KAAA,CAAAc,aAAA,eAAOD,aAAoB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;AACvE,CAAC;AAEDV,QAAQ,CAACY,WAAW,GAAG,UAAU;AAEjC,eAAeZ,QAAQ","ignoreList":[]}
|
|
@@ -8,6 +8,7 @@ export const useDateInfo = ({
|
|
|
8
8
|
shouldShowDayOfWeek,
|
|
9
9
|
shouldShowTime,
|
|
10
10
|
shouldUseShortText,
|
|
11
|
+
shouldShowOnlyTime,
|
|
11
12
|
shouldShowYear,
|
|
12
13
|
preText
|
|
13
14
|
}) => {
|
|
@@ -23,12 +24,13 @@ export const useDateInfo = ({
|
|
|
23
24
|
setFormattedDate(getDateInfo({
|
|
24
25
|
date,
|
|
25
26
|
shouldShowYear,
|
|
27
|
+
shouldShowOnlyTime,
|
|
26
28
|
shouldShowTime,
|
|
27
29
|
shouldUseShortText,
|
|
28
30
|
shouldShowDayOfWeek,
|
|
29
31
|
shouldShowRelativeDayOfWeek
|
|
30
32
|
}));
|
|
31
|
-
}, [date, shouldShowDateToNowDifference, shouldShowDayOfWeek, shouldShowRelativeDayOfWeek, shouldShowTime, shouldShowYear, shouldUseShortText]);
|
|
33
|
+
}, [date, shouldShowDateToNowDifference, shouldShowDayOfWeek, shouldShowOnlyTime, shouldShowRelativeDayOfWeek, shouldShowTime, shouldShowYear, shouldUseShortText]);
|
|
32
34
|
useEffect(() => {
|
|
33
35
|
if (!shouldShowDateToNowDifference) return () => {};
|
|
34
36
|
const updateCurrentDate = () => setCurrentDate(new Date());
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDateInfo.js","names":["getLanguage","useEffect","useMemo","useState","getDateInfo","getTimeTillNow","useDateInfo","date","shouldShowDateToNowDifference","shouldShowRelativeDayOfWeek","shouldShowDayOfWeek","shouldShowTime","shouldUseShortText","shouldShowYear","preText","active","language","formattedDate","setFormattedDate","toLocaleDateString","currentDate","setCurrentDate","Date","updateCurrentDate","now","timeDiffInMs","Math","abs","getTime","updateInterval","getSeconds","intervalId","setInterval","timeout","setTimeout","clearTimeout","clearInterval","trim"],"sources":["../../../src/hooks/useDateInfo.ts"],"sourcesContent":["import { getLanguage } from 'chayns-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { getDateInfo, getTimeTillNow } from '../utils/dateInfo';\n\nexport const useDateInfo = ({\n date,\n shouldShowDateToNowDifference,\n shouldShowRelativeDayOfWeek,\n shouldShowDayOfWeek,\n shouldShowTime,\n shouldUseShortText,\n shouldShowYear,\n preText,\n}: UseDateInfoOptions) => {\n const { active: language } = getLanguage();\n\n const [formattedDate, setFormattedDate] = useState(date.toLocaleDateString());\n const [currentDate, setCurrentDate] = useState(new Date());\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n return;\n }\n\n setFormattedDate(\n getDateInfo({\n date,\n shouldShowYear,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n }),\n );\n }, [\n date,\n shouldShowDateToNowDifference,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldShowTime,\n shouldShowYear,\n shouldUseShortText,\n ]);\n\n useEffect(() => {\n if (!shouldShowDateToNowDifference) return () => {};\n\n const updateCurrentDate = () => setCurrentDate(new Date());\n const now = new Date();\n const timeDiffInMs = Math.abs(date.getTime() - now.getTime());\n\n const updateInterval = timeDiffInMs < 60000 ? 1000 : 60000 - now.getSeconds() * 1000;\n\n const intervalId = setInterval(updateCurrentDate, 1000);\n const timeout = setTimeout(updateCurrentDate, updateInterval);\n\n return () => {\n clearTimeout(timeout);\n clearInterval(intervalId);\n };\n }, [date, shouldShowDateToNowDifference]);\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n setFormattedDate(getTimeTillNow({ date, currentDate, language }));\n }\n }, [date, currentDate, language, shouldShowDateToNowDifference]);\n\n return useMemo(\n () => `${preText ? `${preText.trim()} ` : ''}${formattedDate}`,\n [formattedDate, preText],\n );\n};\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ,YAAY;AACxC,SAASC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEpD,SAASC,WAAW,EAAEC,cAAc,QAAQ,mBAAmB;AAE/D,OAAO,MAAMC,WAAW,GAAGA,CAAC;EACxBC,IAAI;EACJC,6BAA6B;EAC7BC,2BAA2B;EAC3BC,mBAAmB;EACnBC,cAAc;EACdC,kBAAkB;EAClBC,cAAc;EACdC;AACgB,CAAC,KAAK;EACtB,MAAM;IAAEC,MAAM,EAAEC;EAAS,CAAC,
|
|
1
|
+
{"version":3,"file":"useDateInfo.js","names":["getLanguage","useEffect","useMemo","useState","getDateInfo","getTimeTillNow","useDateInfo","date","shouldShowDateToNowDifference","shouldShowRelativeDayOfWeek","shouldShowDayOfWeek","shouldShowTime","shouldUseShortText","shouldShowOnlyTime","shouldShowYear","preText","active","language","formattedDate","setFormattedDate","toLocaleDateString","currentDate","setCurrentDate","Date","updateCurrentDate","now","timeDiffInMs","Math","abs","getTime","updateInterval","getSeconds","intervalId","setInterval","timeout","setTimeout","clearTimeout","clearInterval","trim"],"sources":["../../../src/hooks/useDateInfo.ts"],"sourcesContent":["import { getLanguage } from 'chayns-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { getDateInfo, getTimeTillNow } from '../utils/dateInfo';\n\nexport const useDateInfo = ({\n date,\n shouldShowDateToNowDifference,\n shouldShowRelativeDayOfWeek,\n shouldShowDayOfWeek,\n shouldShowTime,\n shouldUseShortText,\n shouldShowOnlyTime,\n shouldShowYear,\n preText,\n}: UseDateInfoOptions) => {\n const { active: language } = getLanguage();\n\n const [formattedDate, setFormattedDate] = useState(date.toLocaleDateString());\n const [currentDate, setCurrentDate] = useState(new Date());\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n return;\n }\n\n setFormattedDate(\n getDateInfo({\n date,\n shouldShowYear,\n shouldShowOnlyTime,\n shouldShowTime,\n shouldUseShortText,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n }),\n );\n }, [\n date,\n shouldShowDateToNowDifference,\n shouldShowDayOfWeek,\n shouldShowOnlyTime,\n shouldShowRelativeDayOfWeek,\n shouldShowTime,\n shouldShowYear,\n shouldUseShortText,\n ]);\n\n useEffect(() => {\n if (!shouldShowDateToNowDifference) return () => {};\n\n const updateCurrentDate = () => setCurrentDate(new Date());\n const now = new Date();\n const timeDiffInMs = Math.abs(date.getTime() - now.getTime());\n\n const updateInterval = timeDiffInMs < 60000 ? 1000 : 60000 - now.getSeconds() * 1000;\n\n const intervalId = setInterval(updateCurrentDate, 1000);\n const timeout = setTimeout(updateCurrentDate, updateInterval);\n\n return () => {\n clearTimeout(timeout);\n clearInterval(intervalId);\n };\n }, [date, shouldShowDateToNowDifference]);\n\n useEffect(() => {\n if (shouldShowDateToNowDifference) {\n setFormattedDate(getTimeTillNow({ date, currentDate, language }));\n }\n }, [date, currentDate, language, shouldShowDateToNowDifference]);\n\n return useMemo(\n () => `${preText ? `${preText.trim()} ` : ''}${formattedDate}`,\n [formattedDate, preText],\n );\n};\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ,YAAY;AACxC,SAASC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEpD,SAASC,WAAW,EAAEC,cAAc,QAAQ,mBAAmB;AAE/D,OAAO,MAAMC,WAAW,GAAGA,CAAC;EACxBC,IAAI;EACJC,6BAA6B;EAC7BC,2BAA2B;EAC3BC,mBAAmB;EACnBC,cAAc;EACdC,kBAAkB;EAClBC,kBAAkB;EAClBC,cAAc;EACdC;AACgB,CAAC,KAAK;EACtB,MAAM;IAAEC,MAAM,EAAEC;EAAS,CAAC,GAAGjB,WAAW,CAAC,CAAC;EAE1C,MAAM,CAACkB,aAAa,EAAEC,gBAAgB,CAAC,GAAGhB,QAAQ,CAACI,IAAI,CAACa,kBAAkB,CAAC,CAAC,CAAC;EAC7E,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGnB,QAAQ,CAAC,IAAIoB,IAAI,CAAC,CAAC,CAAC;EAE1DtB,SAAS,CAAC,MAAM;IACZ,IAAIO,6BAA6B,EAAE;MAC/B;IACJ;IAEAW,gBAAgB,CACZf,WAAW,CAAC;MACRG,IAAI;MACJO,cAAc;MACdD,kBAAkB;MAClBF,cAAc;MACdC,kBAAkB;MAClBF,mBAAmB;MACnBD;IACJ,CAAC,CACL,CAAC;EACL,CAAC,EAAE,CACCF,IAAI,EACJC,6BAA6B,EAC7BE,mBAAmB,EACnBG,kBAAkB,EAClBJ,2BAA2B,EAC3BE,cAAc,EACdG,cAAc,EACdF,kBAAkB,CACrB,CAAC;EAEFX,SAAS,CAAC,MAAM;IACZ,IAAI,CAACO,6BAA6B,EAAE,OAAO,MAAM,CAAC,CAAC;IAEnD,MAAMgB,iBAAiB,GAAGA,CAAA,KAAMF,cAAc,CAAC,IAAIC,IAAI,CAAC,CAAC,CAAC;IAC1D,MAAME,GAAG,GAAG,IAAIF,IAAI,CAAC,CAAC;IACtB,MAAMG,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACrB,IAAI,CAACsB,OAAO,CAAC,CAAC,GAAGJ,GAAG,CAACI,OAAO,CAAC,CAAC,CAAC;IAE7D,MAAMC,cAAc,GAAGJ,YAAY,GAAG,KAAK,GAAG,IAAI,GAAG,KAAK,GAAGD,GAAG,CAACM,UAAU,CAAC,CAAC,GAAG,IAAI;IAEpF,MAAMC,UAAU,GAAGC,WAAW,CAACT,iBAAiB,EAAE,IAAI,CAAC;IACvD,MAAMU,OAAO,GAAGC,UAAU,CAACX,iBAAiB,EAAEM,cAAc,CAAC;IAE7D,OAAO,MAAM;MACTM,YAAY,CAACF,OAAO,CAAC;MACrBG,aAAa,CAACL,UAAU,CAAC;IAC7B,CAAC;EACL,CAAC,EAAE,CAACzB,IAAI,EAAEC,6BAA6B,CAAC,CAAC;EAEzCP,SAAS,CAAC,MAAM;IACZ,IAAIO,6BAA6B,EAAE;MAC/BW,gBAAgB,CAACd,cAAc,CAAC;QAAEE,IAAI;QAAEc,WAAW;QAAEJ;MAAS,CAAC,CAAC,CAAC;IACrE;EACJ,CAAC,EAAE,CAACV,IAAI,EAAEc,WAAW,EAAEJ,QAAQ,EAAET,6BAA6B,CAAC,CAAC;EAEhE,OAAON,OAAO,CACV,MAAM,GAAGa,OAAO,GAAG,GAAGA,OAAO,CAACuB,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,GAAGpB,aAAa,EAAE,EAC9D,CAACA,aAAa,EAAEH,OAAO,CAC3B,CAAC;AACL,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateinfo.js","names":[],"sources":["../../../src/types/dateinfo.ts"],"sourcesContent":["import type { Language } from 'chayns-api';\n\nexport interface UseDateInfoOptions {\n /**\n * The date that should be displayed\n */\n date: Date;\n /**\n * The language that should be used for the date. Defaults to the active language given by chayns api.\n */\n language?: Language;\n /**\n * Additional text for the \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time.\n */\n preText?: string;\n /**\n * Adds the current year to the display\n */\n shouldShowYear?: boolean;\n /**\n * Adds the time to the display.\n */\n shouldShowTime?: boolean;\n /**\n * Whether the relative day of the week to today should be shown (today, yesterday or tomorrow).\n */\n shouldShowRelativeDayOfWeek?: boolean;\n /**\n * Shortens the day and month text to the maximum three digits\n */\n shouldUseShortText?: boolean;\n /**\n * Adds the day of the week to the display\n */\n shouldShowDayOfWeek?: boolean;\n /**\n * Shows the difference from the date to now. The component handles updates itself.\n */\n shouldShowDateToNowDifference?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"dateinfo.js","names":[],"sources":["../../../src/types/dateinfo.ts"],"sourcesContent":["import type { Language } from 'chayns-api';\n\nexport interface UseDateInfoOptions {\n /**\n * The date that should be displayed\n */\n date: Date;\n /**\n * The language that should be used for the date. Defaults to the active language given by chayns api.\n */\n language?: Language;\n /**\n * Additional text for the \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time.\n */\n preText?: string;\n /**\n * Adds the current year to the display\n */\n shouldShowYear?: boolean;\n /**\n * Adds the time to the display.\n */\n shouldShowTime?: boolean;\n /**\n * Whether the relative day of the week to today should be shown (today, yesterday or tomorrow).\n */\n shouldShowRelativeDayOfWeek?: boolean;\n /**\n * Shortens the day and month text to the maximum three digits\n */\n shouldUseShortText?: boolean;\n /**\n * Adds the day of the week to the display\n */\n shouldShowDayOfWeek?: boolean;\n /**\n * Shows the difference from the date to now. The component handles updates itself.\n */\n shouldShowDateToNowDifference?: boolean;\n /**\n * Whether only the time should be displayed.\n */\n shouldShowOnlyTime?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
@@ -5,6 +5,7 @@ export const getDateInfo = ({
|
|
|
5
5
|
language,
|
|
6
6
|
shouldShowYear,
|
|
7
7
|
shouldShowTime,
|
|
8
|
+
shouldShowOnlyTime,
|
|
8
9
|
shouldShowDayOfWeek,
|
|
9
10
|
shouldShowRelativeDayOfWeek,
|
|
10
11
|
shouldUseShortText
|
|
@@ -12,6 +13,24 @@ export const getDateInfo = ({
|
|
|
12
13
|
const {
|
|
13
14
|
active: activeLanguage
|
|
14
15
|
} = getLanguage();
|
|
16
|
+
const timeParts = {};
|
|
17
|
+
if (shouldShowTime || shouldShowOnlyTime) {
|
|
18
|
+
timeParts.hour = '2-digit';
|
|
19
|
+
timeParts.minute = '2-digit';
|
|
20
|
+
}
|
|
21
|
+
let formattedTime = '';
|
|
22
|
+
if (Object.keys(timeParts).length > 0) {
|
|
23
|
+
formattedTime = `${shouldShowOnlyTime ? '' : ', '}${date.toLocaleTimeString(language ?? activeLanguage, {
|
|
24
|
+
...timeParts
|
|
25
|
+
})}`;
|
|
26
|
+
}
|
|
27
|
+
const hourWord = getTimeString({
|
|
28
|
+
language: language ?? activeLanguage
|
|
29
|
+
});
|
|
30
|
+
formattedTime += shouldShowTime || shouldShowOnlyTime ? ` ${hourWord}` : '';
|
|
31
|
+
if (shouldShowOnlyTime) {
|
|
32
|
+
return formattedTime;
|
|
33
|
+
}
|
|
15
34
|
let dayPart = '';
|
|
16
35
|
if (shouldShowRelativeDayOfWeek) {
|
|
17
36
|
const rtf = new Intl.RelativeTimeFormat(language ?? activeLanguage, {
|
|
@@ -39,21 +58,6 @@ export const getDateInfo = ({
|
|
|
39
58
|
if (shouldShowYear && !isCurrentYear(date)) {
|
|
40
59
|
dateParts.year = 'numeric';
|
|
41
60
|
}
|
|
42
|
-
const timeParts = {};
|
|
43
|
-
if (shouldShowTime) {
|
|
44
|
-
timeParts.hour = '2-digit';
|
|
45
|
-
timeParts.minute = '2-digit';
|
|
46
|
-
}
|
|
47
|
-
let formattedTime = '';
|
|
48
|
-
if (Object.keys(timeParts).length > 0) {
|
|
49
|
-
formattedTime = `, ${date.toLocaleTimeString(language ?? activeLanguage, {
|
|
50
|
-
...timeParts
|
|
51
|
-
})}`;
|
|
52
|
-
}
|
|
53
|
-
const hourWord = getTimeString({
|
|
54
|
-
language: language ?? activeLanguage
|
|
55
|
-
});
|
|
56
|
-
formattedTime += shouldShowTime ? ` ${hourWord}` : '';
|
|
57
61
|
const formattedDate = `${date.toLocaleDateString(language ?? activeLanguage, dateParts)}${formattedTime}`;
|
|
58
62
|
return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;
|
|
59
63
|
};
|
|
@@ -120,15 +124,15 @@ export const getTimeString = ({
|
|
|
120
124
|
language
|
|
121
125
|
}) => {
|
|
122
126
|
const map = {
|
|
123
|
-
nl: '
|
|
124
|
-
fr: '
|
|
127
|
+
nl: '',
|
|
128
|
+
fr: '',
|
|
125
129
|
de: 'Uhr',
|
|
126
|
-
es: '
|
|
127
|
-
it: '
|
|
128
|
-
pt: '
|
|
129
|
-
pl: '
|
|
130
|
-
tr: '
|
|
131
|
-
uk: '
|
|
130
|
+
es: '',
|
|
131
|
+
it: '',
|
|
132
|
+
pt: '',
|
|
133
|
+
pl: '',
|
|
134
|
+
tr: '',
|
|
135
|
+
uk: '',
|
|
132
136
|
en: ''
|
|
133
137
|
};
|
|
134
138
|
return map[language ?? ''] ?? '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateInfo.js","names":["getLanguage","Language","isCurrentYear","isToday","isTomorrow","isYesterday","getDateInfo","date","language","shouldShowYear","shouldShowTime","shouldShowDayOfWeek","shouldShowRelativeDayOfWeek","shouldUseShortText","active","activeLanguage","
|
|
1
|
+
{"version":3,"file":"dateInfo.js","names":["getLanguage","Language","isCurrentYear","isToday","isTomorrow","isYesterday","getDateInfo","date","language","shouldShowYear","shouldShowTime","shouldShowOnlyTime","shouldShowDayOfWeek","shouldShowRelativeDayOfWeek","shouldUseShortText","active","activeLanguage","timeParts","hour","minute","formattedTime","Object","keys","length","toLocaleTimeString","hourWord","getTimeString","dayPart","rtf","Intl","RelativeTimeFormat","numeric","capitalizeFirstLetter","format","toLocaleDateString","weekday","dateParts","day","month","year","formattedDate","text","charAt","toUpperCase","slice","getTimeTillNow","currentDate","English","diffInSeconds","Math","floor","getTime","isPast","units","label","seconds","absDiff","abs","find","u","count","formatter","getFormattedTime","shouldShowSeconds","timeOptions","second","undefined","replace","trim","map","nl","fr","de","es","it","pt","pl","tr","uk","en"],"sources":["../../../src/utils/dateInfo.ts"],"sourcesContent":["import { getLanguage, Language } from 'chayns-api';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { isCurrentYear, isToday, isTomorrow, isYesterday } from './date';\n\nexport const getDateInfo = ({\n date,\n language,\n shouldShowYear,\n shouldShowTime,\n shouldShowOnlyTime,\n shouldShowDayOfWeek,\n shouldShowRelativeDayOfWeek,\n shouldUseShortText,\n}: Omit<UseDateInfoOptions, 'shouldShowDateToNowDifference' & 'preText'>) => {\n const { active: activeLanguage } = getLanguage();\n\n const timeParts: Intl.DateTimeFormatOptions = {};\n\n if (shouldShowTime || shouldShowOnlyTime) {\n timeParts.hour = '2-digit';\n timeParts.minute = '2-digit';\n }\n\n let formattedTime = '';\n if (Object.keys(timeParts).length > 0) {\n formattedTime = `${shouldShowOnlyTime ? '' : ', '}${date.toLocaleTimeString(language ?? activeLanguage, { ...timeParts })}`;\n }\n\n const hourWord = getTimeString({ language: language ?? activeLanguage });\n\n formattedTime += shouldShowTime || shouldShowOnlyTime ? ` ${hourWord}` : '';\n\n if (shouldShowOnlyTime) {\n return formattedTime;\n }\n\n let dayPart = '';\n\n if (shouldShowRelativeDayOfWeek) {\n const rtf = new Intl.RelativeTimeFormat(language ?? activeLanguage, { numeric: 'auto' });\n\n if (isToday(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(0, 'day'));\n }\n\n if (isTomorrow(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(1, 'day'));\n }\n\n if (isYesterday(date)) {\n dayPart = capitalizeFirstLetter(rtf.format(-1, 'day'));\n }\n }\n\n if (!dayPart && shouldShowDayOfWeek) {\n dayPart = date.toLocaleDateString(language ?? activeLanguage, {\n weekday: shouldUseShortText ? 'short' : 'long',\n });\n }\n\n const dateParts: Intl.DateTimeFormatOptions = {\n day: '2-digit',\n month: shouldUseShortText ? 'short' : 'long',\n };\n\n if (shouldShowYear && !isCurrentYear(date)) {\n dateParts.year = 'numeric';\n }\n\n const formattedDate = `${date.toLocaleDateString(language ?? activeLanguage, dateParts)}${formattedTime}`;\n\n return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;\n};\n\nconst capitalizeFirstLetter = (text: string): string =>\n text.charAt(0).toUpperCase() + text.slice(1);\n\ntype RelativeTimeUnit = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';\n\ninterface GetTimeTillNow {\n date: Date;\n currentDate: Date;\n language: Language;\n}\n\nexport const getTimeTillNow = ({\n date,\n currentDate,\n language = Language.English,\n}: GetTimeTillNow): string => {\n const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);\n const isPast = diffInSeconds > 0;\n\n const units: { label: RelativeTimeUnit; seconds: number }[] = [\n { label: 'year', seconds: 31536000 },\n { label: 'month', seconds: 2592000 },\n { label: 'day', seconds: 86400 },\n { label: 'hour', seconds: 3600 },\n { label: 'minute', seconds: 60 },\n { label: 'second', seconds: 1 },\n ];\n\n const absDiff = Math.abs(diffInSeconds);\n const { label, seconds } = units.find((u) => absDiff >= u.seconds) || {\n label: 'second',\n seconds: 1,\n };\n const count = Math.floor(absDiff / seconds);\n\n const formatter = new Intl.RelativeTimeFormat(language, { numeric: 'auto' });\n\n return formatter.format(isPast ? -count : count, label);\n};\n\ninterface GetFormattedTimeOptions {\n date: Date;\n shouldShowSeconds?: boolean;\n}\n\nexport const getFormattedTime = ({\n date,\n shouldShowSeconds = false,\n}: GetFormattedTimeOptions): string => {\n const { active: language } = getLanguage();\n\n const timeOptions: Intl.DateTimeFormatOptions = {\n hour: '2-digit',\n minute: '2-digit',\n second: shouldShowSeconds ? '2-digit' : undefined,\n };\n\n const formattedTime = date.toLocaleTimeString(language, timeOptions).replace(/^0/, '');\n\n const hourWord = getTimeString({ language });\n\n return `${formattedTime} ${hourWord}`.trim();\n};\n\ninterface GetTimeStringProps {\n language?: Language;\n}\n\nexport const getTimeString = ({ language }: GetTimeStringProps) => {\n const map: { [key: string]: string } = {\n nl: '',\n fr: '',\n de: 'Uhr',\n es: '',\n it: '',\n pt: '',\n pl: '',\n tr: '',\n uk: '',\n en: '',\n };\n\n return map[language ?? ''] ?? '';\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { UseDateInfoOptions } from '../types/dateinfo';
|
|
2
|
-
export declare const useDateInfo: ({ date, shouldShowDateToNowDifference, shouldShowRelativeDayOfWeek, shouldShowDayOfWeek, shouldShowTime, shouldUseShortText, shouldShowYear, preText, }: UseDateInfoOptions) => string;
|
|
2
|
+
export declare const useDateInfo: ({ date, shouldShowDateToNowDifference, shouldShowRelativeDayOfWeek, shouldShowDayOfWeek, shouldShowTime, shouldUseShortText, shouldShowOnlyTime, shouldShowYear, preText, }: UseDateInfoOptions) => string;
|
|
@@ -36,4 +36,8 @@ export interface UseDateInfoOptions {
|
|
|
36
36
|
* Shows the difference from the date to now. The component handles updates itself.
|
|
37
37
|
*/
|
|
38
38
|
shouldShowDateToNowDifference?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* Whether only the time should be displayed.
|
|
41
|
+
*/
|
|
42
|
+
shouldShowOnlyTime?: boolean;
|
|
39
43
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Language } from 'chayns-api';
|
|
2
2
|
import { UseDateInfoOptions } from '../types/dateinfo';
|
|
3
|
-
export declare const getDateInfo: ({ date, language, shouldShowYear, shouldShowTime, shouldShowDayOfWeek, shouldShowRelativeDayOfWeek, shouldUseShortText, }: Omit<UseDateInfoOptions, "shouldShowDateToNowDifference" & "preText">) => string;
|
|
3
|
+
export declare const getDateInfo: ({ date, language, shouldShowYear, shouldShowTime, shouldShowOnlyTime, shouldShowDayOfWeek, shouldShowRelativeDayOfWeek, shouldUseShortText, }: Omit<UseDateInfoOptions, "shouldShowDateToNowDifference" & "preText">) => string;
|
|
4
4
|
interface GetTimeTillNow {
|
|
5
5
|
date: Date;
|
|
6
6
|
currentDate: Date;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/date",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.1305",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
"typescript": "^5.9.3"
|
|
71
71
|
},
|
|
72
72
|
"dependencies": {
|
|
73
|
-
"@chayns-components/core": "^5.0.0-beta.
|
|
73
|
+
"@chayns-components/core": "^5.0.0-beta.1305",
|
|
74
74
|
"uuid": "^10.0.0"
|
|
75
75
|
},
|
|
76
76
|
"peerDependencies": {
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"publishConfig": {
|
|
84
84
|
"access": "public"
|
|
85
85
|
},
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "77775b50023a2dbe1ab61032e1092035a105634f"
|
|
87
87
|
}
|