@servicetitan/docs-anvil-uikit-contrib 38.3.2 → 38.4.1
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/docs/intl/date.mdx +11 -8
- package/docs/intl/time.mdx +1 -1
- package/package.json +2 -2
package/docs/intl/date.mdx
CHANGED
|
@@ -7,7 +7,7 @@ import { DemoExample } from '@site/src/components/code-demo';
|
|
|
7
7
|
import Tabs from '@theme/Tabs';
|
|
8
8
|
import TabItem from '@theme/TabItem';
|
|
9
9
|
|
|
10
|
-
Dates can be formatted either by using the [`FormattedDate`](#formatteddate) component from `@servicetitan/intl`, or via the [`formatDate`](#formatdate) function as part of the `intl` object, which can be retrieved via the [`useIntl`](./API/use-intl.mdx) hook or through the [`IntlStore`](./API/intlstore.mdx) store.
|
|
10
|
+
Dates and date-parsable strings can be formatted either by using the [`FormattedDate`](#formatteddate) component from `@servicetitan/intl`, or via the [`formatDate`](#formatdate) function as part of the `intl` object, which can be retrieved via the [`useIntl`](./API/use-intl.mdx) hook or through the [`IntlStore`](./API/intlstore.mdx) store.
|
|
11
11
|
|
|
12
12
|
:::note
|
|
13
13
|
`FormattedDate` is a wrapper around `react-intl`'s `FormattedDate` component, but defaults the `format` to _short_. Make sure you import it from `@servicetitan/intl`, not `react-intl`.
|
|
@@ -15,7 +15,7 @@ Dates can be formatted either by using the [`FormattedDate`](#formatteddate) com
|
|
|
15
15
|
|
|
16
16
|
## Available Formats
|
|
17
17
|
|
|
18
|
-
The following standard ServiceTitan formats are available to use as part of date formatting, using the `format` option. The formats follow the "Date and Time" section of the [Anvil2 Content documentation](https://anvil.servicetitan.com/web/content/date-and-time).
|
|
18
|
+
The following standard ServiceTitan formats are available to use as part of date formatting, using the `format` option. The formats follow the "Date and Time" section of the [Anvil2 Content documentation](https://anvil.servicetitan.com/docs/web/content/date-and-time#date-and-time).
|
|
19
19
|
|
|
20
20
|
- `short` results in `09/02/2025` for 'en-US' locale (default if no format is specified)
|
|
21
21
|
- `long` results in `September 2, 2025` for 'en-US' locale
|
|
@@ -32,11 +32,12 @@ Any options passed to `FormattedDate` or `formatDate` will be merged on top of `
|
|
|
32
32
|
import { FormattedDate } from '@servicetitan/intl';
|
|
33
33
|
|
|
34
34
|
function DateExample() {
|
|
35
|
-
const
|
|
35
|
+
const dateString = '2025-09-02T00:00:00';
|
|
36
|
+
const date = new Date(dateString);
|
|
36
37
|
|
|
37
38
|
return (
|
|
38
39
|
<div>
|
|
39
|
-
<FormattedDate value={
|
|
40
|
+
<FormattedDate value={dateString} /> {/* "09/02/2025" */}
|
|
40
41
|
<FormattedDate value={date} format="short" /> {/* "09/02/2025" */}
|
|
41
42
|
<FormattedDate value={date} format="long" /> {/* "September 2, 2025" */}
|
|
42
43
|
</div>
|
|
@@ -60,11 +61,12 @@ import { useIntl } from '@servicetitan/intl';
|
|
|
60
61
|
|
|
61
62
|
function DateExample() {
|
|
62
63
|
const intl = useIntl();
|
|
63
|
-
const
|
|
64
|
+
const dateString = '2025-09-02T00:00:00';
|
|
65
|
+
const date = new Date(dateString);
|
|
64
66
|
|
|
65
67
|
return (
|
|
66
68
|
<>
|
|
67
|
-
{intl.formatDate(
|
|
69
|
+
{intl.formatDate(dateString)} {/* "09/02/2025" */}
|
|
68
70
|
{intl.formatDate(date, { format: 'short' })} {/* "09/02/2025" */}
|
|
69
71
|
{intl.formatDate(date, { format: 'long' })} {/* "September 2, 2025" */}
|
|
70
72
|
</>
|
|
@@ -83,9 +85,10 @@ class MyStore {
|
|
|
83
85
|
constructor(@inject(IntlStore) private readonly intlStore: IntlStore) {}
|
|
84
86
|
|
|
85
87
|
formatDate() {
|
|
86
|
-
const
|
|
88
|
+
const dateString = '2025-09-02T00:00:00';
|
|
89
|
+
const date = new Date(dateString);
|
|
87
90
|
return [
|
|
88
|
-
this.intlStore.intl.formatDate(
|
|
91
|
+
this.intlStore.intl.formatDate(dateString), // 09/02/2025
|
|
89
92
|
this.intlStore.intl.formatDate(date, { format: 'short' }), // 09/02/2025
|
|
90
93
|
this.intlStore.intl.formatDate(date, { format: 'long' }), // September 2, 2025
|
|
91
94
|
];
|
package/docs/intl/time.mdx
CHANGED
|
@@ -11,7 +11,7 @@ Times can be formatted either by using the [`FormattedTime`](#formattedtime) com
|
|
|
11
11
|
|
|
12
12
|
## Available Formats
|
|
13
13
|
|
|
14
|
-
The following standard ServiceTitan formats are available to use as part of time formatting, using the `format` option. The formats follow the "Date and Time" section of the [Anvil2 Content documentation](https://anvil.servicetitan.com/web/content/date-and-time).
|
|
14
|
+
The following standard ServiceTitan formats are available to use as part of time formatting, using the `format` option. The formats follow the "Date and Time" section of the [Anvil2 Content documentation](https://anvil.servicetitan.com/docs/web/content/date-and-time#date-and-time).
|
|
15
15
|
|
|
16
16
|
:::note
|
|
17
17
|
The example results that follow use a locale of 'en-US' and time zone of 'America/New_York'
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/docs-anvil-uikit-contrib",
|
|
3
|
-
"version": "38.
|
|
3
|
+
"version": "38.4.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -16,5 +16,5 @@
|
|
|
16
16
|
"cli": {
|
|
17
17
|
"webpack": false
|
|
18
18
|
},
|
|
19
|
-
"gitHead": "
|
|
19
|
+
"gitHead": "a52024e5de9ff42a62abc334a25204b964312744"
|
|
20
20
|
}
|