@atlaskit/datetime-picker 17.6.5 → 17.8.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 (149) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/date-picker/package.json +17 -0
  3. package/date-time-picker/package.json +17 -0
  4. package/dist/cjs/components/date-picker.js +20 -15
  5. package/dist/cjs/components/date-time-picker-class.js +7 -9
  6. package/dist/cjs/components/date-time-picker-fc.js +468 -7
  7. package/dist/cjs/components/time-picker.js +11 -8
  8. package/dist/cjs/entry-points/date-picker.js +13 -0
  9. package/dist/cjs/entry-points/date-time-picker.js +13 -0
  10. package/dist/cjs/entry-points/time-picker.js +13 -0
  11. package/dist/cjs/entry-points/types.js +1 -0
  12. package/dist/cjs/internal/convert-to24hr-time.js +66 -0
  13. package/dist/cjs/internal/default-date-format.js +7 -0
  14. package/dist/cjs/internal/default-times.js +7 -0
  15. package/dist/cjs/internal/empty-component.js +12 -0
  16. package/dist/cjs/internal/format-date-time-zone-into-iso.js +15 -0
  17. package/dist/cjs/internal/format-date.js +39 -0
  18. package/dist/cjs/internal/{date-picker-migration.js → get-parsed-iso.js} +4 -48
  19. package/dist/cjs/internal/get-placeholder.js +32 -0
  20. package/dist/cjs/internal/get-safe-calendar-value.js +18 -0
  21. package/dist/cjs/internal/get-short-iso-string.js +13 -0
  22. package/dist/cjs/internal/is-date-disabled.js +29 -0
  23. package/dist/cjs/internal/is-valid.js +39 -0
  24. package/dist/cjs/internal/pad-two.js +9 -0
  25. package/dist/cjs/internal/parse-date.js +31 -20
  26. package/dist/cjs/internal/parse-time.js +6 -102
  27. package/dist/cjs/internal/placeholder-date-time.js +9 -0
  28. package/dist/cjs/internal/remove-spacer.js +9 -0
  29. package/dist/es2019/components/date-picker.js +9 -4
  30. package/dist/es2019/components/date-time-picker-class.js +4 -6
  31. package/dist/es2019/components/date-time-picker-fc.js +451 -5
  32. package/dist/es2019/components/time-picker.js +5 -2
  33. package/dist/es2019/entry-points/date-picker.js +1 -0
  34. package/dist/es2019/entry-points/date-time-picker.js +1 -0
  35. package/dist/es2019/entry-points/time-picker.js +1 -0
  36. package/dist/es2019/entry-points/types.js +0 -0
  37. package/dist/es2019/internal/convert-to24hr-time.js +60 -0
  38. package/dist/es2019/internal/default-date-format.js +1 -0
  39. package/dist/es2019/internal/default-times.js +1 -0
  40. package/dist/es2019/internal/empty-component.js +4 -0
  41. package/dist/es2019/internal/format-date-time-zone-into-iso.js +9 -0
  42. package/dist/es2019/internal/format-date.js +34 -0
  43. package/dist/es2019/internal/{date-picker-migration.js → get-parsed-iso.js} +2 -54
  44. package/dist/es2019/internal/get-placeholder.js +28 -0
  45. package/dist/es2019/internal/get-safe-calendar-value.js +11 -0
  46. package/dist/es2019/internal/get-short-iso-string.js +6 -0
  47. package/dist/es2019/internal/is-date-disabled.js +25 -0
  48. package/dist/es2019/internal/is-valid.js +33 -0
  49. package/dist/es2019/internal/pad-two.js +3 -0
  50. package/dist/es2019/internal/parse-date.js +33 -18
  51. package/dist/es2019/internal/parse-time.js +3 -96
  52. package/dist/es2019/internal/placeholder-date-time.js +3 -0
  53. package/dist/es2019/internal/remove-spacer.js +3 -0
  54. package/dist/esm/components/date-picker.js +9 -4
  55. package/dist/esm/components/date-time-picker-class.js +4 -6
  56. package/dist/esm/components/date-time-picker-fc.js +468 -7
  57. package/dist/esm/components/time-picker.js +5 -2
  58. package/dist/esm/entry-points/date-picker.js +1 -0
  59. package/dist/esm/entry-points/date-time-picker.js +1 -0
  60. package/dist/esm/entry-points/time-picker.js +1 -0
  61. package/dist/esm/entry-points/types.js +0 -0
  62. package/dist/esm/internal/convert-to24hr-time.js +60 -0
  63. package/dist/esm/internal/default-date-format.js +1 -0
  64. package/dist/esm/internal/default-times.js +1 -0
  65. package/dist/esm/internal/empty-component.js +6 -0
  66. package/dist/esm/internal/format-date-time-zone-into-iso.js +9 -0
  67. package/dist/esm/internal/format-date.js +32 -0
  68. package/dist/esm/internal/{date-picker-migration.js → get-parsed-iso.js} +2 -46
  69. package/dist/esm/internal/get-placeholder.js +26 -0
  70. package/dist/esm/internal/get-safe-calendar-value.js +11 -0
  71. package/dist/esm/internal/get-short-iso-string.js +6 -0
  72. package/dist/esm/internal/is-date-disabled.js +23 -0
  73. package/dist/esm/internal/is-valid.js +33 -0
  74. package/dist/esm/internal/pad-two.js +3 -0
  75. package/dist/esm/internal/parse-date.js +31 -18
  76. package/dist/esm/internal/parse-time.js +3 -96
  77. package/dist/esm/internal/placeholder-date-time.js +3 -0
  78. package/dist/esm/internal/remove-spacer.js +3 -0
  79. package/dist/types/components/date-time-picker-class.d.ts +0 -2
  80. package/dist/types/components/date-time-picker-fc.d.ts +4 -2
  81. package/dist/types/entry-points/date-picker.d.ts +2 -0
  82. package/dist/types/entry-points/date-time-picker.d.ts +1 -0
  83. package/dist/types/entry-points/time-picker.d.ts +1 -0
  84. package/dist/types/entry-points/types.d.ts +1 -0
  85. package/dist/types/internal/convert-to24hr-time.d.ts +7 -0
  86. package/dist/types/internal/default-date-format.d.ts +1 -0
  87. package/dist/types/internal/default-times.d.ts +1 -0
  88. package/dist/types/internal/empty-component.d.ts +4 -0
  89. package/dist/types/internal/format-date-time-zone-into-iso.d.ts +4 -0
  90. package/dist/{types-ts4.5/internal/date-picker-migration.d.ts → types/internal/format-date.d.ts} +0 -28
  91. package/dist/types/internal/get-parsed-iso.d.ts +20 -0
  92. package/dist/types/internal/get-placeholder.d.ts +22 -0
  93. package/dist/types/internal/get-safe-calendar-value.d.ts +1 -0
  94. package/dist/types/internal/get-short-iso-string.d.ts +1 -0
  95. package/dist/types/internal/is-date-disabled.d.ts +20 -0
  96. package/dist/types/internal/is-valid.d.ts +1 -0
  97. package/dist/types/internal/pad-two.d.ts +1 -0
  98. package/dist/types/internal/parse-date.d.ts +26 -5
  99. package/dist/types/internal/parse-time.d.ts +0 -9
  100. package/dist/types/internal/placeholder-date-time.d.ts +1 -0
  101. package/dist/types/internal/remove-spacer.d.ts +1 -0
  102. package/dist/types-ts4.5/components/date-time-picker-class.d.ts +0 -2
  103. package/dist/types-ts4.5/components/date-time-picker-fc.d.ts +4 -2
  104. package/dist/types-ts4.5/entry-points/date-picker.d.ts +2 -0
  105. package/dist/types-ts4.5/entry-points/date-time-picker.d.ts +1 -0
  106. package/dist/types-ts4.5/entry-points/time-picker.d.ts +1 -0
  107. package/dist/types-ts4.5/entry-points/types.d.ts +1 -0
  108. package/dist/types-ts4.5/internal/convert-to24hr-time.d.ts +7 -0
  109. package/dist/types-ts4.5/internal/default-date-format.d.ts +1 -0
  110. package/dist/types-ts4.5/internal/default-times.d.ts +1 -0
  111. package/dist/types-ts4.5/internal/empty-component.d.ts +4 -0
  112. package/dist/types-ts4.5/internal/format-date-time-zone-into-iso.d.ts +4 -0
  113. package/dist/{types/internal/date-picker-migration.d.ts → types-ts4.5/internal/format-date.d.ts} +0 -28
  114. package/dist/types-ts4.5/internal/get-parsed-iso.d.ts +20 -0
  115. package/dist/types-ts4.5/internal/get-placeholder.d.ts +22 -0
  116. package/dist/types-ts4.5/internal/get-safe-calendar-value.d.ts +1 -0
  117. package/dist/types-ts4.5/internal/get-short-iso-string.d.ts +1 -0
  118. package/dist/types-ts4.5/internal/is-date-disabled.d.ts +20 -0
  119. package/dist/types-ts4.5/internal/is-valid.d.ts +1 -0
  120. package/dist/types-ts4.5/internal/pad-two.d.ts +1 -0
  121. package/dist/types-ts4.5/internal/parse-date.d.ts +26 -5
  122. package/dist/types-ts4.5/internal/parse-time.d.ts +0 -9
  123. package/dist/types-ts4.5/internal/placeholder-date-time.d.ts +1 -0
  124. package/dist/types-ts4.5/internal/remove-spacer.d.ts +1 -0
  125. package/package.json +11 -14
  126. package/time-picker/package.json +17 -0
  127. package/types/package.json +5 -5
  128. package/dist/cjs/components/date-time-picker-fc-new.js +0 -479
  129. package/dist/cjs/components/date-time-picker-fc-old.js +0 -370
  130. package/dist/cjs/internal/index.js +0 -31
  131. package/dist/es2019/components/date-time-picker-fc-new.js +0 -456
  132. package/dist/es2019/components/date-time-picker-fc-old.compiled.css +0 -6
  133. package/dist/es2019/components/date-time-picker-fc-old.js +0 -336
  134. package/dist/es2019/internal/index.js +0 -20
  135. package/dist/esm/components/date-time-picker-fc-new.compiled.css +0 -6
  136. package/dist/esm/components/date-time-picker-fc-new.js +0 -473
  137. package/dist/esm/components/date-time-picker-fc-old.compiled.css +0 -6
  138. package/dist/esm/components/date-time-picker-fc-old.js +0 -364
  139. package/dist/esm/internal/index.js +0 -22
  140. package/dist/types/components/date-time-picker-fc-new.d.ts +0 -6
  141. package/dist/types/components/date-time-picker-fc-old.d.ts +0 -6
  142. package/dist/types/internal/index.d.ts +0 -10
  143. package/dist/types-ts4.5/components/date-time-picker-fc-new.d.ts +0 -6
  144. package/dist/types-ts4.5/components/date-time-picker-fc-old.d.ts +0 -6
  145. package/dist/types-ts4.5/internal/index.d.ts +0 -10
  146. package/offerings.json +0 -98
  147. /package/dist/cjs/components/{date-time-picker-fc-new.compiled.css → date-time-picker-fc.compiled.css} +0 -0
  148. /package/dist/{cjs/components/date-time-picker-fc-old.compiled.css → es2019/components/date-time-picker-fc.compiled.css} +0 -0
  149. /package/dist/{es2019/components/date-time-picker-fc-new.compiled.css → esm/components/date-time-picker-fc.compiled.css} +0 -0
@@ -1,364 +0,0 @@
1
- /* date-time-picker-fc-old.tsx generated by @compiled/babel-plugin v0.39.1 */
2
- import _extends from "@babel/runtime/helpers/extends";
3
- import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
5
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
6
- var _excluded = ["selectProps"],
7
- _excluded2 = ["selectProps"];
8
- import "./date-time-picker-fc-old.compiled.css";
9
- import { ax, ix } from "@compiled/react/runtime";
10
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
11
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
12
- /// <reference types="node" />
13
- // for typing `process`
14
-
15
- import React, { forwardRef, useCallback, useEffect, useState } from 'react';
16
-
17
- // oxlint-disable-next-line @atlassian/no-restricted-imports
18
- import { format, isValid, parseISO } from 'date-fns';
19
- import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
20
- import { IconButton } from '@atlaskit/button/new';
21
- import SelectClearIcon from '@atlaskit/icon/core/cross-circle';
22
- import { Box, Inline } from '@atlaskit/primitives/compiled';
23
- import { mergeStyles } from '@atlaskit/select';
24
- import { formatDateTimeZoneIntoIso } from '../internal';
25
- import { DateTimePickerContainer } from '../internal/date-time-picker-container';
26
- import { convertTokens } from '../internal/parse-tokens';
27
- import DatePicker from './date-picker';
28
- import TimePicker from './time-picker';
29
- var packageName = "@atlaskit/datetime-picker";
30
- var packageVersion = "17.6.5";
31
- var analyticsAttributes = {
32
- componentName: 'dateTimePicker',
33
- packageName: packageName,
34
- packageVersion: packageVersion
35
- };
36
- var compiledStyles = {
37
- datePickerContainerStyles: "_i0dl1ssb _16jlkb7n _1o9zidpf",
38
- timePickerContainerStyles: "_i0dl1ssb _16jlkb7n",
39
- iconContainerStyles: "_1e0c1txw _4cvr1h6o _i0dl1kw7"
40
- };
41
-
42
- // react-select overrides (via @atlaskit/select).
43
- var styles = {
44
- control: function control(style) {
45
- return _objectSpread(_objectSpread({}, style), {}, {
46
- backgroundColor: 'transparent',
47
- border: 2,
48
- borderRadius: 0,
49
- paddingLeft: 0,
50
- ':hover': {
51
- backgroundColor: 'transparent',
52
- cursor: 'inherit'
53
- }
54
- });
55
- }
56
- };
57
- export var datePickerDefaultAriaLabel = 'Date';
58
- export var timePickerDefaultAriaLabel = 'Time';
59
- var DateTimePickerOld = /*#__PURE__*/forwardRef(function (_ref2, _ref) {
60
- var ariaDescribedBy = _ref2['aria-describedby'],
61
- _ref2$appearance = _ref2.appearance,
62
- appearance = _ref2$appearance === void 0 ? 'default' : _ref2$appearance,
63
- _ref2$autoFocus = _ref2.autoFocus,
64
- autoFocus = _ref2$autoFocus === void 0 ? false : _ref2$autoFocus,
65
- _ref2$clearControlLab = _ref2.clearControlLabel,
66
- clearControlLabel = _ref2$clearControlLab === void 0 ? 'clear' : _ref2$clearControlLab,
67
- _ref2$datePickerProps = _ref2.datePickerProps,
68
- datePickerPropsWithSelectProps = _ref2$datePickerProps === void 0 ? {} : _ref2$datePickerProps,
69
- _ref2$defaultValue = _ref2.defaultValue,
70
- defaultValue = _ref2$defaultValue === void 0 ? '' : _ref2$defaultValue,
71
- _ref2$id = _ref2.id,
72
- id = _ref2$id === void 0 ? '' : _ref2$id,
73
- _ref2$innerProps = _ref2.innerProps,
74
- innerProps = _ref2$innerProps === void 0 ? {} : _ref2$innerProps,
75
- _ref2$isDisabled = _ref2.isDisabled,
76
- isDisabled = _ref2$isDisabled === void 0 ? false : _ref2$isDisabled,
77
- _ref2$isInvalid = _ref2.isInvalid,
78
- isInvalid = _ref2$isInvalid === void 0 ? false : _ref2$isInvalid,
79
- _ref2$isRequired = _ref2.isRequired,
80
- isRequired = _ref2$isRequired === void 0 ? false : _ref2$isRequired,
81
- _ref2$name = _ref2.name,
82
- name = _ref2$name === void 0 ? '' : _ref2$name,
83
- _ref2$onBlur = _ref2.onBlur,
84
- onBlur = _ref2$onBlur === void 0 ? function (_event) {} : _ref2$onBlur,
85
- _ref2$onChange = _ref2.onChange,
86
- onChangeProp = _ref2$onChange === void 0 ? function (_value) {} : _ref2$onChange,
87
- _ref2$onFocus = _ref2.onFocus,
88
- onFocus = _ref2$onFocus === void 0 ? function (_event) {} : _ref2$onFocus,
89
- providedParseValue = _ref2.parseValue,
90
- _ref2$spacing = _ref2.spacing,
91
- spacing = _ref2$spacing === void 0 ? 'default' : _ref2$spacing,
92
- _ref2$locale = _ref2.locale,
93
- locale = _ref2$locale === void 0 ? 'en-US' : _ref2$locale,
94
- testId = _ref2.testId,
95
- _ref2$timePickerProps = _ref2.timePickerProps,
96
- timePickerPropsWithSelectProps = _ref2$timePickerProps === void 0 ? {} : _ref2$timePickerProps,
97
- providedValue = _ref2.value;
98
- var _useState = useState((datePickerPropsWithSelectProps === null || datePickerPropsWithSelectProps === void 0 ? void 0 : datePickerPropsWithSelectProps.defaultValue) || ''),
99
- _useState2 = _slicedToArray(_useState, 2),
100
- dateValue = _useState2[0],
101
- setDateValue = _useState2[1];
102
- var _useState3 = useState(false),
103
- _useState4 = _slicedToArray(_useState3, 2),
104
- isFocused = _useState4[0],
105
- setIsFocused = _useState4[1];
106
- var _useState5 = useState((timePickerPropsWithSelectProps === null || timePickerPropsWithSelectProps === void 0 ? void 0 : timePickerPropsWithSelectProps.defaultValue) || ''),
107
- _useState6 = _slicedToArray(_useState5, 2),
108
- timeValue = _useState6[0],
109
- setTimeValue = _useState6[1];
110
- var _useState7 = useState(defaultValue || ''),
111
- _useState8 = _slicedToArray(_useState7, 2),
112
- value = _useState8[0],
113
- setValue = _useState8[1];
114
- var _useState9 = useState(''),
115
- _useState0 = _slicedToArray(_useState9, 2),
116
- zoneValue = _useState0[0],
117
- setZoneValue = _useState0[1];
118
- useEffect(function () {
119
- if (providedValue !== undefined) {
120
- setValue(providedValue);
121
- }
122
- }, [providedValue]);
123
- var parseValue = useCallback(function (value, providedDateValue, providedTimeValue, providedZoneValue) {
124
- if (providedParseValue) {
125
- var parsedFromFn = providedParseValue(value, providedDateValue, providedTimeValue, providedZoneValue);
126
- // This handles cases found in Jira where the parse function actually does
127
- // nothing and returns undefined. The previous `getSafeState` function
128
- // just spread the values over the state, but if it returned `undefined`,
129
- // it would just rely on the previous state values. Considering this is
130
- // what is input to this function anyway, this is a safe way to handle
131
- // this, colocate the behavior, and not rely on `getSafeState`.
132
- return parsedFromFn || {
133
- dateValue: providedDateValue,
134
- timeValue: providedTimeValue,
135
- zoneValue: providedZoneValue
136
- };
137
- }
138
- var parsed = parseISO(value);
139
- return isValid(parsed) ? {
140
- dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
141
- timeValue: format(parsed, convertTokens('HH:mm')),
142
- zoneValue: format(parsed, convertTokens('ZZ'))
143
- } : {
144
- dateValue: dateValue,
145
- timeValue: timeValue,
146
- zoneValue: zoneValue
147
- };
148
- }, [providedParseValue, dateValue, timeValue, zoneValue]);
149
- useEffect(function () {
150
- var parsedValues = parseValue(value, dateValue, timeValue, zoneValue);
151
- setDateValue(parsedValues.dateValue);
152
- setTimeValue(parsedValues.timeValue);
153
- setZoneValue(parsedValues.zoneValue);
154
- }, [value, dateValue, timeValue, zoneValue, parseValue]);
155
- var onDateBlur = function onDateBlur(event) {
156
- setIsFocused(false);
157
- onBlur(event);
158
- if (datePickerPropsWithSelectProps !== null && datePickerPropsWithSelectProps !== void 0 && datePickerPropsWithSelectProps.onBlur) {
159
- datePickerPropsWithSelectProps.onBlur(event);
160
- }
161
- };
162
- var onTimeBlur = function onTimeBlur(event) {
163
- setIsFocused(false);
164
- onBlur(event);
165
- if (timePickerPropsWithSelectProps !== null && timePickerPropsWithSelectProps !== void 0 && timePickerPropsWithSelectProps.onBlur) {
166
- timePickerPropsWithSelectProps.onBlur(event);
167
- }
168
- };
169
- var onDateFocus = function onDateFocus(event) {
170
- setIsFocused(false);
171
- onFocus(event);
172
- if (datePickerPropsWithSelectProps !== null && datePickerPropsWithSelectProps !== void 0 && datePickerPropsWithSelectProps.onFocus) {
173
- datePickerPropsWithSelectProps.onFocus(event);
174
- }
175
- };
176
- var onTimeFocus = function onTimeFocus(event) {
177
- setIsFocused(false);
178
- onFocus(event);
179
- if (timePickerPropsWithSelectProps !== null && timePickerPropsWithSelectProps !== void 0 && timePickerPropsWithSelectProps.onFocus) {
180
- timePickerPropsWithSelectProps.onFocus(event);
181
- }
182
- };
183
- var onDateChange = function onDateChange(dateValue) {
184
- var parsedValues = parseValue(value, dateValue, timeValue, zoneValue);
185
- onValueChange({
186
- providedDateValue: dateValue,
187
- providedTimeValue: parsedValues.timeValue,
188
- providedZoneValue: parsedValues.zoneValue
189
- });
190
- if (datePickerPropsWithSelectProps !== null && datePickerPropsWithSelectProps !== void 0 && datePickerPropsWithSelectProps.onChange) {
191
- datePickerPropsWithSelectProps.onChange(dateValue);
192
- }
193
- };
194
- var onTimeChange = function onTimeChange(timeValue) {
195
- var parsedValues = parseValue(value, dateValue, timeValue, zoneValue);
196
- onValueChange({
197
- providedDateValue: parsedValues.dateValue,
198
- providedTimeValue: timeValue,
199
- providedZoneValue: parsedValues.zoneValue
200
- });
201
- if (timePickerPropsWithSelectProps !== null && timePickerPropsWithSelectProps !== void 0 && timePickerPropsWithSelectProps.onChange) {
202
- timePickerPropsWithSelectProps.onChange(timeValue);
203
- }
204
- };
205
- var onClear = function onClear() {
206
- var parsedValues = parseValue(value, dateValue, timeValue, zoneValue);
207
- onValueChange({
208
- providedDateValue: '',
209
- providedTimeValue: '',
210
- providedZoneValue: parsedValues.zoneValue
211
- });
212
- if (datePickerPropsWithSelectProps !== null && datePickerPropsWithSelectProps !== void 0 && datePickerPropsWithSelectProps.onChange) {
213
- datePickerPropsWithSelectProps.onChange('');
214
- }
215
- if (timePickerPropsWithSelectProps !== null && timePickerPropsWithSelectProps !== void 0 && timePickerPropsWithSelectProps.onChange) {
216
- timePickerPropsWithSelectProps.onChange('');
217
- }
218
- };
219
- var onChangePropWithAnalytics = usePlatformLeafEventHandler(_objectSpread({
220
- fn: onChangeProp,
221
- action: 'selectedDate',
222
- actionSubject: 'datePicker'
223
- }, analyticsAttributes));
224
- var onValueChange = function onValueChange(_ref3) {
225
- var providedDateValue = _ref3.providedDateValue,
226
- providedTimeValue = _ref3.providedTimeValue,
227
- providedZoneValue = _ref3.providedZoneValue;
228
- setDateValue(providedDateValue);
229
- setTimeValue(providedTimeValue);
230
- setZoneValue(providedZoneValue);
231
- if (providedDateValue && providedTimeValue) {
232
- var _value2 = formatDateTimeZoneIntoIso(providedDateValue, providedTimeValue, providedZoneValue);
233
- var _parseValue = parseValue(_value2, providedDateValue, providedTimeValue, providedZoneValue),
234
- parsedZone = _parseValue.zoneValue;
235
- var valueWithValidZone = formatDateTimeZoneIntoIso(providedDateValue, providedTimeValue, parsedZone);
236
- setValue(valueWithValidZone);
237
- onChangePropWithAnalytics(valueWithValidZone);
238
- // If the date or time value was cleared when there is an existing datetime value, then clear the value.
239
- } else if (value) {
240
- setValue('');
241
- onChangePropWithAnalytics('');
242
- }
243
- };
244
- var datePickerSelectProps = datePickerPropsWithSelectProps.selectProps,
245
- datePickerProps = _objectWithoutProperties(datePickerPropsWithSelectProps, _excluded);
246
- var datePickerAriaDescribedBy = datePickerProps['aria-describedby'] || ariaDescribedBy;
247
- var datePickerLabel = datePickerProps.label || datePickerDefaultAriaLabel;
248
- var mergedDatePickerSelectProps = _objectSpread(_objectSpread({}, datePickerSelectProps), {}, {
249
- styles: mergeStyles(styles, datePickerSelectProps === null || datePickerSelectProps === void 0 ? void 0 : datePickerSelectProps.styles)
250
- });
251
- var timePickerSelectProps = timePickerPropsWithSelectProps.selectProps,
252
- timePickerProps = _objectWithoutProperties(timePickerPropsWithSelectProps, _excluded2);
253
- var timePickerAriaDescribedBy = timePickerProps['aria-describedby'] || ariaDescribedBy;
254
- var timePickerLabel = timePickerProps.label || timePickerDefaultAriaLabel;
255
- var mergedTimePickerSelectProps = _objectSpread(_objectSpread({}, timePickerSelectProps), {}, {
256
- styles: mergeStyles(styles, timePickerSelectProps === null || timePickerSelectProps === void 0 ? void 0 : timePickerSelectProps.styles)
257
- });
258
-
259
- // Render DateTimePicker's IconContainer when a value has been filled
260
- // Don't use Date or TimePicker's because they can't be customised
261
- var isClearable = Boolean(dateValue || timeValue);
262
- return /*#__PURE__*/React.createElement(DateTimePickerContainer, {
263
- appearance: appearance,
264
- isDisabled: isDisabled,
265
- isFocused: isFocused,
266
- isInvalid: isInvalid,
267
- testId: testId,
268
- innerProps: innerProps
269
- }, /*#__PURE__*/React.createElement("input", {
270
- name: name,
271
- type: "hidden",
272
- value: value,
273
- "data-testid": testId && "".concat(testId, "--input")
274
- }), /*#__PURE__*/React.createElement(Box, {
275
- xcss: compiledStyles.datePickerContainerStyles
276
- }, /*#__PURE__*/React.createElement(DatePicker, {
277
- appearance: appearance,
278
- "aria-describedby": datePickerAriaDescribedBy,
279
- autoFocus: datePickerProps.autoFocus || autoFocus,
280
- dateFormat: datePickerProps.dateFormat,
281
- defaultIsOpen: datePickerProps.defaultIsOpen,
282
- defaultValue: datePickerProps.defaultValue,
283
- disabled: datePickerProps.disabled,
284
- disabledDateFilter: datePickerProps.disabledDateFilter,
285
- formatDisplayLabel: datePickerProps.formatDisplayLabel,
286
- hideIcon: datePickerProps.hideIcon || true,
287
- icon: datePickerProps.icon,
288
- id: datePickerProps.id || id,
289
- innerProps: datePickerProps.innerProps,
290
- inputLabel: datePickerProps.inputLabel,
291
- inputLabelId: datePickerProps.inputLabelId,
292
- isDisabled: datePickerProps.isDisabled || isDisabled,
293
- isInvalid: datePickerProps.isInvalid || isInvalid,
294
- isOpen: datePickerProps.isOpen,
295
- isRequired: datePickerProps.isRequired || isRequired,
296
- label: datePickerLabel,
297
- locale: datePickerProps.locale || locale,
298
- maxDate: datePickerProps.maxDate,
299
- minDate: datePickerProps.minDate,
300
- name: datePickerProps.name,
301
- nextMonthLabel: datePickerProps.nextMonthLabel,
302
- onBlur: onDateBlur,
303
- onChange: onDateChange,
304
- onFocus: onDateFocus,
305
- openCalendarLabel: datePickerProps.openCalendarLabel,
306
- parseInputValue: datePickerProps.parseInputValue,
307
- placeholder: datePickerProps.placeholder,
308
- previousMonthLabel: datePickerProps.previousMonthLabel,
309
- selectProps: mergedDatePickerSelectProps,
310
- shouldShowCalendarButton: datePickerProps.shouldShowCalendarButton,
311
- spacing: datePickerProps.spacing || spacing,
312
- testId: testId && "".concat(testId, "--datepicker") || datePickerProps.testId,
313
- value: dateValue,
314
- weekStartDay: datePickerProps.weekStartDay
315
- })), /*#__PURE__*/React.createElement(Box, {
316
- xcss: compiledStyles.timePickerContainerStyles
317
- }, /*#__PURE__*/React.createElement(TimePicker, {
318
- appearance: timePickerProps.appearance || appearance,
319
- "aria-describedby": timePickerAriaDescribedBy,
320
- autoFocus: timePickerProps.autoFocus,
321
- defaultIsOpen: timePickerProps.defaultIsOpen,
322
- defaultValue: timePickerProps.defaultValue,
323
- formatDisplayLabel: timePickerProps.formatDisplayLabel,
324
- hideIcon: timePickerProps.hideIcon || true,
325
- id: timePickerProps.id,
326
- innerProps: timePickerProps.innerProps,
327
- isDisabled: timePickerProps.isDisabled || isDisabled,
328
- isInvalid: timePickerProps.isInvalid || isInvalid,
329
- isOpen: timePickerProps.isOpen,
330
- isRequired: timePickerProps.isRequired || isRequired,
331
- label: timePickerLabel,
332
- locale: timePickerProps.locale || locale,
333
- name: timePickerProps.name,
334
- onBlur: onTimeBlur,
335
- onChange: onTimeChange,
336
- onFocus: onTimeFocus,
337
- parseInputValue: timePickerProps.parseInputValue,
338
- placeholder: timePickerProps.placeholder,
339
- selectProps: mergedTimePickerSelectProps,
340
- spacing: timePickerProps.spacing || spacing,
341
- testId: timePickerProps.testId || testId && "".concat(testId, "--timepicker"),
342
- timeFormat: timePickerProps.timeFormat,
343
- timeIsEditable: timePickerProps.timeIsEditable,
344
- times: timePickerProps.times,
345
- value: timeValue
346
- })), isClearable && !isDisabled ? /*#__PURE__*/React.createElement(Inline, {
347
- xcss: compiledStyles.iconContainerStyles
348
- }, /*#__PURE__*/React.createElement(IconButton, {
349
- appearance: "subtle",
350
- label: clearControlLabel,
351
- icon: function icon(iconProps) {
352
- return /*#__PURE__*/React.createElement(SelectClearIcon, _extends({}, iconProps, {
353
- color: "var(--ds-text-subtlest, #6B6E76)",
354
- size: "small"
355
- }));
356
- },
357
- onClick: onClear,
358
- testId: testId && "".concat(testId, "--icon--container"),
359
- tabIndex: -1
360
- })) : null);
361
- });
362
-
363
- // eslint-disable-next-line @repo/internal/react/require-jsdoc
364
- export default DateTimePickerOld;
@@ -1,22 +0,0 @@
1
- /**
2
- * This component is used to hide portions of Select component.
3
- */
4
- export var EmptyComponent = function EmptyComponent() {
5
- return null;
6
- };
7
-
8
- // This date was chosen to clearly show date and time formats (day > 12)
9
- // e.g. 18/02/1993 vs. 2/18/1993 and 1:00 PM vs 13:00
10
- export var placeholderDatetime = new Date(1993, 1, 18, 13);
11
- export var defaultTimes = ['09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00'];
12
- export var defaultTimeFormat = 'h:mma';
13
- export var defaultDateFormat = 'YYYY/MM/DD';
14
- export function padToTwo(number) {
15
- return number <= 99 ? "0".concat(number).slice(-2) : "".concat(number);
16
- }
17
- export function formatDateTimeZoneIntoIso(date, time, zone) {
18
- // 12:00 => 12:00, 1:00 => 01:00
19
- var needsLeadingZero = /^\d:/;
20
- var sanitizedTime = needsLeadingZero.test(time) ? "0".concat(time) : time;
21
- return "".concat(date, "T").concat(sanitizedTime).concat(zone);
22
- }
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { type DateTimePickerBaseProps } from '../types';
3
- export declare const datePickerDefaultAriaLabel = "Date";
4
- export declare const timePickerDefaultAriaLabel = "Time";
5
- declare const DateTimePickerNew: React.ForwardRefExoticComponent<React.PropsWithoutRef<DateTimePickerBaseProps> & React.RefAttributes<HTMLElement>>;
6
- export default DateTimePickerNew;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { type DateTimePickerBaseProps } from '../types';
3
- export declare const datePickerDefaultAriaLabel = "Date";
4
- export declare const timePickerDefaultAriaLabel = "Time";
5
- declare const DateTimePickerOld: React.ForwardRefExoticComponent<React.PropsWithoutRef<DateTimePickerBaseProps> & React.RefAttributes<HTMLElement>>;
6
- export default DateTimePickerOld;
@@ -1,10 +0,0 @@
1
- /**
2
- * This component is used to hide portions of Select component.
3
- */
4
- export declare const EmptyComponent: () => null;
5
- export declare const placeholderDatetime: Date;
6
- export declare const defaultTimes: string[];
7
- export declare const defaultTimeFormat = "h:mma";
8
- export declare const defaultDateFormat = "YYYY/MM/DD";
9
- export declare function padToTwo(number: number): string;
10
- export declare function formatDateTimeZoneIntoIso(date: string, time: string, zone: string): string;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { type DateTimePickerBaseProps } from '../types';
3
- export declare const datePickerDefaultAriaLabel = "Date";
4
- export declare const timePickerDefaultAriaLabel = "Time";
5
- declare const DateTimePickerNew: React.ForwardRefExoticComponent<React.PropsWithoutRef<DateTimePickerBaseProps> & React.RefAttributes<HTMLElement>>;
6
- export default DateTimePickerNew;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { type DateTimePickerBaseProps } from '../types';
3
- export declare const datePickerDefaultAriaLabel = "Date";
4
- export declare const timePickerDefaultAriaLabel = "Time";
5
- declare const DateTimePickerOld: React.ForwardRefExoticComponent<React.PropsWithoutRef<DateTimePickerBaseProps> & React.RefAttributes<HTMLElement>>;
6
- export default DateTimePickerOld;
@@ -1,10 +0,0 @@
1
- /**
2
- * This component is used to hide portions of Select component.
3
- */
4
- export declare const EmptyComponent: () => null;
5
- export declare const placeholderDatetime: Date;
6
- export declare const defaultTimes: string[];
7
- export declare const defaultTimeFormat = "h:mma";
8
- export declare const defaultDateFormat = "YYYY/MM/DD";
9
- export declare function padToTwo(number: number): string;
10
- export declare function formatDateTimeZoneIntoIso(date: string, time: string, zone: string): string;
package/offerings.json DELETED
@@ -1,98 +0,0 @@
1
- [
2
- {
3
- "name": "DatePicker",
4
- "package": "@atlaskit/datetime-picker",
5
- "import": {
6
- "name": "DatePicker",
7
- "package": "@atlaskit/datetime-picker",
8
- "type": "named"
9
- },
10
- "keywords": ["date", "picker", "calendar", "selection", "form"],
11
- "categories": ["form"],
12
- "shortDescription": "A component for selecting date values with calendar support.",
13
- "status": "general-availability",
14
- "accessibilityGuidelines": [
15
- "Ensure proper keyboard navigation",
16
- "Use appropriate date formats",
17
- "Provide clear date labels",
18
- "Consider screen reader announcements"
19
- ],
20
- "usageGuidelines": [
21
- "Use for date selection only",
22
- "Provide clear date formats",
23
- "Handle date validation appropriately",
24
- "Consider calendar button visibility"
25
- ],
26
- "contentGuidelines": [
27
- "Use clear, descriptive labels",
28
- "Provide helpful placeholder text",
29
- "Use appropriate date formats",
30
- "Keep labels concise but descriptive"
31
- ],
32
- "examples": ["./examples/ai/date-picker.tsx"]
33
- },
34
- {
35
- "name": "TimePicker",
36
- "package": "@atlaskit/datetime-picker",
37
- "import": {
38
- "name": "TimePicker",
39
- "package": "@atlaskit/datetime-picker",
40
- "type": "named"
41
- },
42
- "keywords": ["time", "picker", "clock", "selection", "form"],
43
- "categories": ["form"],
44
- "shortDescription": "A component for selecting time values with clock interface.",
45
- "status": "general-availability",
46
- "accessibilityGuidelines": [
47
- "Ensure proper keyboard navigation",
48
- "Use appropriate time formats",
49
- "Provide clear time labels",
50
- "Consider screen reader announcements"
51
- ],
52
- "usageGuidelines": [
53
- "Use for time selection only",
54
- "Provide clear time formats",
55
- "Handle time validation appropriately",
56
- "Consider editable time input"
57
- ],
58
- "contentGuidelines": [
59
- "Use clear, descriptive labels",
60
- "Provide helpful placeholder text",
61
- "Use appropriate time formats",
62
- "Keep labels concise but descriptive"
63
- ],
64
- "examples": ["./examples/ai/time-picker.tsx"]
65
- },
66
- {
67
- "name": "DateTimePicker",
68
- "package": "@atlaskit/datetime-picker",
69
- "import": {
70
- "name": "DateTimePicker",
71
- "package": "@atlaskit/datetime-picker",
72
- "type": "named"
73
- },
74
- "keywords": ["datetime", "picker", "date", "time", "calendar"],
75
- "categories": ["form"],
76
- "shortDescription": "A component for selecting both date and time values.",
77
- "status": "general-availability",
78
- "accessibilityGuidelines": [
79
- "Ensure proper keyboard navigation",
80
- "Use appropriate date/time formats",
81
- "Provide clear date/time labels",
82
- "Consider screen reader announcements"
83
- ],
84
- "usageGuidelines": [
85
- "Use for combined date and time selection",
86
- "Provide clear date/time formats",
87
- "Handle timezone considerations",
88
- "Consider validation requirements"
89
- ],
90
- "contentGuidelines": [
91
- "Use clear, descriptive labels",
92
- "Provide helpful placeholder text",
93
- "Use appropriate date/time formats",
94
- "Keep labels concise but descriptive"
95
- ],
96
- "examples": ["./examples/ai/datetime-picker.tsx"]
97
- }
98
- ]