Skip to content

Commit d548aca

Browse files
committed
update README
1 parent 429fcaa commit d548aca

File tree

1 file changed

+39
-3
lines changed

1 file changed

+39
-3
lines changed

packages/date-picker/README.md

Lines changed: 39 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,14 @@ npm install @leafygreen-ui/date-picker
2222

2323
```js
2424
import { DatePicker } from '@leafygreen-ui/date-picker';
25-
import { setToUTCMidnight } from '@leafygreen-ui/date-utils';
25+
26+
const [date, setDate] = useState<Date>();
2627

2728
<DatePicker
2829
label="Pick a date"
29-
value={setToUTCMidnight(new Date(Date.now()))}
30-
onDateChange={() => {}}
30+
value={date}
31+
max={new Date("2026-12-26")}
32+
onDateChange={setDate}
3133
locale="iso8601"
3234
timeZone="utc"
3335
/>;
@@ -57,6 +59,40 @@ import { setToUTCMidnight } from '@leafygreen-ui/date-utils';
5759
| `autoComplete` | `'off'` \| `'on'` \| `'bday'` | Whether the input should autofill | `off` |
5860
| `darkMode` | `boolean` | Render the component in dark mode. | `false` |
5961

62+
## 🔎 Glossary
63+
64+
### Date format
65+
66+
The pattern in which a string stores date (& time) information. E.g. `“YYYY-DD-MM”`, `“MM/DD/YYYY”`, `“YYYY-MM-DDTHH:mm:ss.sssZ”`
67+
68+
### Wire format (or Data format)
69+
70+
The format of the date string passed into the component. This will typically be [ISO-8601](https://www.iso.org/iso-8601-date-and-time-format.html), but could be any format accepted by the [Date constructor](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date).
71+
72+
### Presentation format
73+
74+
The format in which the date is presented to the user. By default, the HTML date input element presents this in the format of the user’s Locale (as defined in browser or OS settings).
75+
76+
### Locale
77+
78+
Language, script, & region information. Can also include [other data](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale).
79+
80+
### Time Zone
81+
82+
A string representing a user’s local time zone (e.g. “America/New_York”) or UTC offset. Valid time zones are defined by IANA, and [listed on Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones#List). A UTC offset can be [provided in a DateTime string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_time_string_format).
83+
84+
### UTC offset
85+
86+
The offset of a time zone vs UTC. E.g. The UTC offset for `“America/New_York”` is -5:00, (or -4:00 depending on daylight savings).
87+
88+
### Wire time zone (or Data time zone)
89+
90+
The time zone information contained in the date string/object passed into the component.
91+
92+
### Presentation time zone
93+
94+
The time zone relative to which we present date information to the user. Can result in a different day than the wire time zone. E.g. `“2023-08-08T00:00:00Z”` (Aug. 8/2023 at midnight UTC) => `“2023-08-07T20:00:00-04:00”` (Aug. 7 at 8pm EDT)
95+
6096
## Special Case
6197

6298
### Aria Labels

0 commit comments

Comments
 (0)