@trackunit/react-date-and-time-components 1.10.12 → 1.10.13
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/index.cjs.js +4 -5
- package/index.esm.js +4 -5
- package/package.json +10 -10
- package/src/dateTime/DateTime.d.ts +3 -5
package/index.cjs.js
CHANGED
|
@@ -4,10 +4,10 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var i18nLibraryTranslation = require('@trackunit/i18n-library-translation');
|
|
5
5
|
var dateAndTimeUtils = require('@trackunit/date-and-time-utils');
|
|
6
6
|
var reactDateAndTimeHooks = require('@trackunit/react-date-and-time-hooks');
|
|
7
|
+
var sharedUtils = require('@trackunit/shared-utils');
|
|
7
8
|
var react = require('react');
|
|
8
9
|
var tailwindMerge = require('tailwind-merge');
|
|
9
10
|
var reactComponents = require('@trackunit/react-components');
|
|
10
|
-
var sharedUtils = require('@trackunit/shared-utils');
|
|
11
11
|
var Calendar = require('react-calendar');
|
|
12
12
|
var reactFormComponents = require('@trackunit/react-form-components');
|
|
13
13
|
var cssClassVarianceUtilities = require('@trackunit/css-class-variance-utilities');
|
|
@@ -103,13 +103,12 @@ const MS_PER_HOUR = 60 * 60 * 1000;
|
|
|
103
103
|
* @param props.titleFormat string
|
|
104
104
|
* @param props.timezone TimeZone
|
|
105
105
|
* @param props.subtle boolean
|
|
106
|
-
* @param props.calendar boolean | object
|
|
107
106
|
*/
|
|
108
|
-
const DateTime = ({ value, format, className, fromNow, withTitle, titleFormat, timezone,
|
|
107
|
+
const DateTime = ({ value, format, className, fromNow = false, withTitle = false, titleFormat, timezone, dataTestId, subtle = false, }) => {
|
|
109
108
|
const { t } = useTranslation();
|
|
110
109
|
const locale = reactDateAndTimeHooks.useLocale();
|
|
111
110
|
const nowDate = react.useMemo(() => new Date(), []);
|
|
112
|
-
const date = value ? dateAndTimeUtils.toDateUtil(value) : nowDate;
|
|
111
|
+
const date = sharedUtils.truthy(value) ? dateAndTimeUtils.toDateUtil(value) : nowDate;
|
|
113
112
|
const newDateTime = dateAndTimeUtils.formatDateUtil(date, format, timezone?.id, locale);
|
|
114
113
|
const titleDateTime = withTitle ? dateAndTimeUtils.formatDateUtil(date, titleFormat, timezone?.id, locale) : undefined;
|
|
115
114
|
const getTimeSince = react.useCallback((from, to) => {
|
|
@@ -122,7 +121,7 @@ const DateTime = ({ value, format, className, fromNow, withTitle, titleFormat, t
|
|
|
122
121
|
const dateValue = react.useMemo(() => {
|
|
123
122
|
return fromNow ? getTimeSince(date, nowDate) : newDateTime;
|
|
124
123
|
}, [date, fromNow, getTimeSince, newDateTime, nowDate]);
|
|
125
|
-
return (jsxRuntime.jsx("time", { className: className || subtle ? tailwindMerge.twMerge(subtle ? "text-neutral-600" : undefined, className) : undefined, dateTime: newDateTime, title: titleDateTime, children: dateValue }));
|
|
124
|
+
return (jsxRuntime.jsx("time", { className: className || subtle ? tailwindMerge.twMerge(subtle ? "text-neutral-600" : undefined, className) : undefined, "data-testid": dataTestId, dateTime: newDateTime, title: titleDateTime, children: dateValue }));
|
|
126
125
|
};
|
|
127
126
|
|
|
128
127
|
/**
|
package/index.esm.js
CHANGED
|
@@ -2,10 +2,10 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
|
2
2
|
import { registerTranslations, useNamespaceTranslation } from '@trackunit/i18n-library-translation';
|
|
3
3
|
import { toDateUtil, formatDateUtil, isEqualUtil, timeSinceAuto, getHourCycle } from '@trackunit/date-and-time-utils';
|
|
4
4
|
import { useLocale, useDateAndTime } from '@trackunit/react-date-and-time-hooks';
|
|
5
|
+
import { truthy, DateTimeFormat, nonNullable, objectKeys } from '@trackunit/shared-utils';
|
|
5
6
|
import { useMemo, useCallback, useState, useEffect, useRef, Children, isValidElement } from 'react';
|
|
6
7
|
import { twMerge } from 'tailwind-merge';
|
|
7
8
|
import { Tooltip, Button, MenuItem, Icon, Popover, PopoverTrigger, PopoverContent, MenuList, MenuDivider, Card, Text } from '@trackunit/react-components';
|
|
8
|
-
import { DateTimeFormat, nonNullable, objectKeys } from '@trackunit/shared-utils';
|
|
9
9
|
import Calendar from 'react-calendar';
|
|
10
10
|
import { Search } from '@trackunit/react-form-components';
|
|
11
11
|
import { cvaMerge } from '@trackunit/css-class-variance-utilities';
|
|
@@ -101,13 +101,12 @@ const MS_PER_HOUR = 60 * 60 * 1000;
|
|
|
101
101
|
* @param props.titleFormat string
|
|
102
102
|
* @param props.timezone TimeZone
|
|
103
103
|
* @param props.subtle boolean
|
|
104
|
-
* @param props.calendar boolean | object
|
|
105
104
|
*/
|
|
106
|
-
const DateTime = ({ value, format, className, fromNow, withTitle, titleFormat, timezone,
|
|
105
|
+
const DateTime = ({ value, format, className, fromNow = false, withTitle = false, titleFormat, timezone, dataTestId, subtle = false, }) => {
|
|
107
106
|
const { t } = useTranslation();
|
|
108
107
|
const locale = useLocale();
|
|
109
108
|
const nowDate = useMemo(() => new Date(), []);
|
|
110
|
-
const date = value ? toDateUtil(value) : nowDate;
|
|
109
|
+
const date = truthy(value) ? toDateUtil(value) : nowDate;
|
|
111
110
|
const newDateTime = formatDateUtil(date, format, timezone?.id, locale);
|
|
112
111
|
const titleDateTime = withTitle ? formatDateUtil(date, titleFormat, timezone?.id, locale) : undefined;
|
|
113
112
|
const getTimeSince = useCallback((from, to) => {
|
|
@@ -120,7 +119,7 @@ const DateTime = ({ value, format, className, fromNow, withTitle, titleFormat, t
|
|
|
120
119
|
const dateValue = useMemo(() => {
|
|
121
120
|
return fromNow ? getTimeSince(date, nowDate) : newDateTime;
|
|
122
121
|
}, [date, fromNow, getTimeSince, newDateTime, nowDate]);
|
|
123
|
-
return (jsx("time", { className: className || subtle ? twMerge(subtle ? "text-neutral-600" : undefined, className) : undefined, dateTime: newDateTime, title: titleDateTime, children: dateValue }));
|
|
122
|
+
return (jsx("time", { className: className || subtle ? twMerge(subtle ? "text-neutral-600" : undefined, className) : undefined, "data-testid": dataTestId, dateTime: newDateTime, title: titleDateTime, children: dateValue }));
|
|
124
123
|
};
|
|
125
124
|
|
|
126
125
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-date-and-time-components",
|
|
3
|
-
"version": "1.10.
|
|
3
|
+
"version": "1.10.13",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -8,15 +8,15 @@
|
|
|
8
8
|
},
|
|
9
9
|
"dependencies": {
|
|
10
10
|
"react": "19.0.0",
|
|
11
|
-
"@trackunit/react-components": "1.9.
|
|
12
|
-
"@trackunit/date-and-time-utils": "1.7.
|
|
13
|
-
"@trackunit/react-date-and-time-hooks": "1.7.
|
|
14
|
-
"@trackunit/css-class-variance-utilities": "1.7.
|
|
15
|
-
"@trackunit/ui-icons": "1.7.
|
|
16
|
-
"@trackunit/shared-utils": "1.9.
|
|
17
|
-
"@trackunit/i18n-library-translation": "1.7.
|
|
18
|
-
"@trackunit/react-test-setup": "1.4.
|
|
19
|
-
"@trackunit/react-form-components": "1.8.
|
|
11
|
+
"@trackunit/react-components": "1.9.13",
|
|
12
|
+
"@trackunit/date-and-time-utils": "1.7.8",
|
|
13
|
+
"@trackunit/react-date-and-time-hooks": "1.7.11",
|
|
14
|
+
"@trackunit/css-class-variance-utilities": "1.7.8",
|
|
15
|
+
"@trackunit/ui-icons": "1.7.10",
|
|
16
|
+
"@trackunit/shared-utils": "1.9.8",
|
|
17
|
+
"@trackunit/i18n-library-translation": "1.7.11",
|
|
18
|
+
"@trackunit/react-test-setup": "1.4.8",
|
|
19
|
+
"@trackunit/react-form-components": "1.8.13",
|
|
20
20
|
"string-ts": "^2.0.0",
|
|
21
21
|
"tailwind-merge": "^2.0.0",
|
|
22
22
|
"react-calendar": "^6.0.0"
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import { TemporalFormat } from "@trackunit/date-and-time-utils";
|
|
2
|
+
import { CommonProps } from "@trackunit/react-components";
|
|
2
3
|
import { TimeZone } from "../DayPicker";
|
|
3
|
-
export interface DateTimeProps {
|
|
4
|
+
export interface DateTimeProps extends CommonProps {
|
|
4
5
|
value: Date | string | number | null | undefined;
|
|
5
6
|
format?: TemporalFormat;
|
|
6
|
-
className?: string;
|
|
7
7
|
fromNow?: boolean;
|
|
8
8
|
withTitle?: boolean;
|
|
9
9
|
titleFormat?: TemporalFormat;
|
|
10
10
|
timezone?: TimeZone;
|
|
11
11
|
subtle?: boolean;
|
|
12
|
-
calendar?: boolean | object;
|
|
13
12
|
}
|
|
14
13
|
export declare const MS_PER_HOUR: number;
|
|
15
14
|
/**
|
|
@@ -24,6 +23,5 @@ export declare const MS_PER_HOUR: number;
|
|
|
24
23
|
* @param props.titleFormat string
|
|
25
24
|
* @param props.timezone TimeZone
|
|
26
25
|
* @param props.subtle boolean
|
|
27
|
-
* @param props.calendar boolean | object
|
|
28
26
|
*/
|
|
29
|
-
export declare const DateTime: ({ value, format, className, fromNow, withTitle, titleFormat, timezone,
|
|
27
|
+
export declare const DateTime: ({ value, format, className, fromNow, withTitle, titleFormat, timezone, dataTestId, subtle, }: DateTimeProps) => import("react/jsx-runtime").JSX.Element;
|