@razorpay/blade 11.18.2 → 11.19.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 (105) hide show
  1. package/build/lib/native/components/Button/BaseButton/BaseButton.js +1 -1
  2. package/build/lib/native/components/Button/BaseButton/BaseButton.js.map +1 -1
  3. package/build/lib/native/components/Button/BaseButton/buttonTokens.js +1 -1
  4. package/build/lib/native/components/Button/BaseButton/buttonTokens.js.map +1 -1
  5. package/build/lib/native/components/DatePicker/DatePicker.native.js +7 -0
  6. package/build/lib/native/components/DatePicker/DatePicker.native.js.map +1 -0
  7. package/build/lib/native/components/index.js +1 -0
  8. package/build/lib/native/components/index.js.map +1 -1
  9. package/build/lib/native/tokens/global/size.js +1 -1
  10. package/build/lib/native/tokens/global/size.js.map +1 -1
  11. package/build/lib/native/utils/metaAttribute/metaConstants.js +1 -1
  12. package/build/lib/native/utils/metaAttribute/metaConstants.js.map +1 -1
  13. package/build/lib/web/development/components/BottomSheet/BottomSheetBody.web.js +6 -4
  14. package/build/lib/web/development/components/BottomSheet/BottomSheetBody.web.js.map +1 -1
  15. package/build/lib/web/development/components/Button/BaseButton/BaseButton.js +1 -1
  16. package/build/lib/web/development/components/Button/BaseButton/BaseButton.js.map +1 -1
  17. package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js +2 -2
  18. package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js.map +1 -1
  19. package/build/lib/web/development/components/DatePicker/Calendar.web.js +182 -0
  20. package/build/lib/web/development/components/DatePicker/Calendar.web.js.map +1 -0
  21. package/build/lib/web/development/components/DatePicker/CalendarFooter.web.js +46 -0
  22. package/build/lib/web/development/components/DatePicker/CalendarFooter.web.js.map +1 -0
  23. package/build/lib/web/development/components/DatePicker/CalendarHeader.web.js +162 -0
  24. package/build/lib/web/development/components/DatePicker/CalendarHeader.web.js.map +1 -0
  25. package/build/lib/web/development/components/DatePicker/CalendarStyles.web.js +310 -0
  26. package/build/lib/web/development/components/DatePicker/CalendarStyles.web.js.map +1 -0
  27. package/build/lib/web/development/components/DatePicker/DateInput.web.js +185 -0
  28. package/build/lib/web/development/components/DatePicker/DateInput.web.js.map +1 -0
  29. package/build/lib/web/development/components/DatePicker/DatePicker.web.js +364 -0
  30. package/build/lib/web/development/components/DatePicker/DatePicker.web.js.map +1 -0
  31. package/build/lib/web/development/components/DatePicker/QuickSelection/PresetSideBar.web.js +86 -0
  32. package/build/lib/web/development/components/DatePicker/QuickSelection/PresetSideBar.web.js.map +1 -0
  33. package/build/lib/web/development/components/DatePicker/QuickSelection/QuickSelectionItem.web.js +43 -0
  34. package/build/lib/web/development/components/DatePicker/QuickSelection/QuickSelectionItem.web.js.map +1 -0
  35. package/build/lib/web/development/components/DatePicker/constants.js +22 -0
  36. package/build/lib/web/development/components/DatePicker/constants.js.map +1 -0
  37. package/build/lib/web/development/components/DatePicker/index.js +2 -0
  38. package/build/lib/web/development/components/DatePicker/index.js.map +1 -0
  39. package/build/lib/web/development/components/DatePicker/useControlledDates.js +75 -0
  40. package/build/lib/web/development/components/DatePicker/useControlledDates.js.map +1 -0
  41. package/build/lib/web/development/components/DatePicker/useDatesState.js +149 -0
  42. package/build/lib/web/development/components/DatePicker/useDatesState.js.map +1 -0
  43. package/build/lib/web/development/components/DatePicker/usePopup.js +90 -0
  44. package/build/lib/web/development/components/DatePicker/usePopup.js.map +1 -0
  45. package/build/lib/web/development/components/DatePicker/utils.js +39 -0
  46. package/build/lib/web/development/components/DatePicker/utils.js.map +1 -0
  47. package/build/lib/web/development/components/Input/PhoneNumberInput/PhoneNumberInput.web.js +3 -2
  48. package/build/lib/web/development/components/Input/PhoneNumberInput/PhoneNumberInput.web.js.map +1 -1
  49. package/build/lib/web/development/components/index.js +2 -0
  50. package/build/lib/web/development/components/index.js.map +1 -1
  51. package/build/lib/web/development/tokens/global/size.js +2 -0
  52. package/build/lib/web/development/tokens/global/size.js.map +1 -1
  53. package/build/lib/web/development/utils/getFocusRingStyles/getFocusRingStyles.web.js +6 -3
  54. package/build/lib/web/development/utils/getFocusRingStyles/getFocusRingStyles.web.js.map +1 -1
  55. package/build/lib/web/development/utils/metaAttribute/metaConstants.js +2 -0
  56. package/build/lib/web/development/utils/metaAttribute/metaConstants.js.map +1 -1
  57. package/build/lib/web/production/components/BottomSheet/BottomSheetBody.web.js +6 -4
  58. package/build/lib/web/production/components/BottomSheet/BottomSheetBody.web.js.map +1 -1
  59. package/build/lib/web/production/components/Button/BaseButton/BaseButton.js +1 -1
  60. package/build/lib/web/production/components/Button/BaseButton/BaseButton.js.map +1 -1
  61. package/build/lib/web/production/components/Button/BaseButton/buttonTokens.js +2 -2
  62. package/build/lib/web/production/components/Button/BaseButton/buttonTokens.js.map +1 -1
  63. package/build/lib/web/production/components/DatePicker/Calendar.web.js +182 -0
  64. package/build/lib/web/production/components/DatePicker/Calendar.web.js.map +1 -0
  65. package/build/lib/web/production/components/DatePicker/CalendarFooter.web.js +46 -0
  66. package/build/lib/web/production/components/DatePicker/CalendarFooter.web.js.map +1 -0
  67. package/build/lib/web/production/components/DatePicker/CalendarHeader.web.js +162 -0
  68. package/build/lib/web/production/components/DatePicker/CalendarHeader.web.js.map +1 -0
  69. package/build/lib/web/production/components/DatePicker/CalendarStyles.web.js +310 -0
  70. package/build/lib/web/production/components/DatePicker/CalendarStyles.web.js.map +1 -0
  71. package/build/lib/web/production/components/DatePicker/DateInput.web.js +185 -0
  72. package/build/lib/web/production/components/DatePicker/DateInput.web.js.map +1 -0
  73. package/build/lib/web/production/components/DatePicker/DatePicker.web.js +364 -0
  74. package/build/lib/web/production/components/DatePicker/DatePicker.web.js.map +1 -0
  75. package/build/lib/web/production/components/DatePicker/QuickSelection/PresetSideBar.web.js +86 -0
  76. package/build/lib/web/production/components/DatePicker/QuickSelection/PresetSideBar.web.js.map +1 -0
  77. package/build/lib/web/production/components/DatePicker/QuickSelection/QuickSelectionItem.web.js +43 -0
  78. package/build/lib/web/production/components/DatePicker/QuickSelection/QuickSelectionItem.web.js.map +1 -0
  79. package/build/lib/web/production/components/DatePicker/constants.js +22 -0
  80. package/build/lib/web/production/components/DatePicker/constants.js.map +1 -0
  81. package/build/lib/web/production/components/DatePicker/index.js +2 -0
  82. package/build/lib/web/production/components/DatePicker/index.js.map +1 -0
  83. package/build/lib/web/production/components/DatePicker/useControlledDates.js +75 -0
  84. package/build/lib/web/production/components/DatePicker/useControlledDates.js.map +1 -0
  85. package/build/lib/web/production/components/DatePicker/useDatesState.js +149 -0
  86. package/build/lib/web/production/components/DatePicker/useDatesState.js.map +1 -0
  87. package/build/lib/web/production/components/DatePicker/usePopup.js +90 -0
  88. package/build/lib/web/production/components/DatePicker/usePopup.js.map +1 -0
  89. package/build/lib/web/production/components/DatePicker/utils.js +39 -0
  90. package/build/lib/web/production/components/DatePicker/utils.js.map +1 -0
  91. package/build/lib/web/production/components/Input/PhoneNumberInput/PhoneNumberInput.web.js +3 -2
  92. package/build/lib/web/production/components/Input/PhoneNumberInput/PhoneNumberInput.web.js.map +1 -1
  93. package/build/lib/web/production/components/index.js +2 -0
  94. package/build/lib/web/production/components/index.js.map +1 -1
  95. package/build/lib/web/production/tokens/global/size.js +2 -0
  96. package/build/lib/web/production/tokens/global/size.js.map +1 -1
  97. package/build/lib/web/production/utils/getFocusRingStyles/getFocusRingStyles.web.js +6 -3
  98. package/build/lib/web/production/utils/getFocusRingStyles/getFocusRingStyles.web.js.map +1 -1
  99. package/build/lib/web/production/utils/metaAttribute/metaConstants.js +2 -0
  100. package/build/lib/web/production/utils/metaAttribute/metaConstants.js.map +1 -1
  101. package/build/types/components/index.d.ts +1242 -527
  102. package/build/types/components/index.native.d.ts +550 -406
  103. package/build/types/tokens/index.d.ts +2 -0
  104. package/build/types/tokens/index.native.d.ts +2 -0
  105. package/package.json +7 -3
@@ -0,0 +1,310 @@
1
+ import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
+ import styled from 'styled-components';
3
+ import dayjs from 'dayjs';
4
+ import { classes } from './constants.js';
5
+ import '../Box/BaseBox/index.js';
6
+ import getTextStyles from '../Typography/Text/getTextStyles.js';
7
+ import '../../tokens/global/index.js';
8
+ import '../../utils/index.js';
9
+ import getIn from '../../utils/lodashButBetter/get.js';
10
+ import { useIsMobile } from '../../utils/useIsMobile.js';
11
+ import '../../utils/getFocusRingStyles/index.js';
12
+ import { size } from '../../tokens/global/size.js';
13
+ import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
14
+ import { makeSpace } from '../../utils/makeSpace/makeSpace.js';
15
+ import { makeBorderSize } from '../../utils/makeBorderSize/makeBorderSize.js';
16
+ import { getFocusRingStyles } from '../../utils/getFocusRingStyles/getFocusRingStyles.web.js';
17
+
18
+ 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; }
19
+ 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; }
20
+ var cell = {
21
+ gap: {
22
+ x: size[0],
23
+ y: size[2]
24
+ },
25
+ size: {
26
+ desktop: size[40],
27
+ mobile: size[48]
28
+ },
29
+ background: {
30
+ "default": 'transparent',
31
+ hover: 'interactive.background.gray.highlighted',
32
+ disabled: 'transparent'
33
+ },
34
+ text: {
35
+ "default": 'interactive.text.gray.normal',
36
+ disabled: 'interactive.text.gray.disabled'
37
+ }
38
+ };
39
+ var todayCell = {
40
+ background: {
41
+ "default": 'transparent',
42
+ hover: 'interactive.background.primary.faded'
43
+ },
44
+ border: {
45
+ "default": 'interactive.border.primary.default',
46
+ hover: 'interactive.border.primary.default'
47
+ },
48
+ text: {
49
+ "default": 'interactive.text.primary.normal',
50
+ hover: 'interactive.text.primary.normal'
51
+ }
52
+ };
53
+ var selectedCell = {
54
+ day: {
55
+ background: {
56
+ "default": 'interactive.background.primary.default',
57
+ hover: 'interactive.background.primary.highlighted'
58
+ },
59
+ border: {
60
+ "default": 'interactive.border.primary.default',
61
+ hover: 'interactive.border.primary.faded'
62
+ },
63
+ text: {
64
+ "default": 'interactive.text.onPrimary.normal',
65
+ hover: 'interactive.text.onPrimary.normal'
66
+ }
67
+ },
68
+ month: {
69
+ background: {
70
+ "default": 'transparent',
71
+ hover: 'interactive.background.primary.faded'
72
+ },
73
+ border: {
74
+ "default": 'interactive.border.primary.default'
75
+ },
76
+ text: {
77
+ "default": 'interactive.text.primary.normal'
78
+ }
79
+ }
80
+ };
81
+ var inRangeCell = {
82
+ background: {
83
+ "default": 'surface.background.primary.subtle',
84
+ hover: 'interactive.background.primary.faded'
85
+ },
86
+ border: {
87
+ "default": 'interactive.border.primary.default',
88
+ hover: 'interactive.border.primary.default'
89
+ },
90
+ text: {
91
+ "default": 'interactive.text.primary.normal',
92
+ hover: 'interactive.text.primary.normal'
93
+ }
94
+ };
95
+ var CalendarGradientStyles = /*#__PURE__*/styled(BaseBox).withConfig({
96
+ displayName: "CalendarStylesweb__CalendarGradientStyles",
97
+ componentId: "xxlq7y-0"
98
+ })(function (_ref) {
99
+ var theme = _ref.theme,
100
+ date = _ref.date,
101
+ isRange = _ref.isRange;
102
+ var isMobile = useIsMobile();
103
+ // Bail out if datepicker is not in range mode or on mobile
104
+ if (isMobile || !isRange) return {};
105
+
106
+ // Calculate the first and last day of the month for both calendars in range mode
107
+ // This is to apply the gradient to the first and last day of the month
108
+ var cal1 = dayjs(date);
109
+ var cal1FirstDay = cal1.startOf('month');
110
+ var cal1LastDay = cal1.endOf('month');
111
+ // Check if the first and last day of the month are at the start or end of the week
112
+ // If so, we don't apply the gradient, as it will overflow to the previous or next month
113
+ // Eg: https://github.com/razorpay/blade/assets/35374649/025b8ed9-90b4-49b6-a307-a746ae5b910f
114
+ var cal1IsFirstDayStartOfTheWeek = cal1FirstDay.day() === 0;
115
+ var cal1IsLastDayEndOfTheWeek = cal1LastDay.day() === 6;
116
+
117
+ // Do the same for the second calendar
118
+ var cal2 = dayjs(date).add(1, 'month');
119
+ var cal2FirstDay = cal2.startOf('month');
120
+ var cal2LastDay = cal2.endOf('month');
121
+ var cal2IsFirstDayStartOfTheWeek = cal2FirstDay.day() === 0;
122
+ var cal2IsLastDayEndOfTheWeek = cal2LastDay.day() === 6;
123
+ var calendar1FirstGradient = "".concat(cal1.month(), "-").concat(cal1FirstDay.date());
124
+ var calendar1LastGradient = "".concat(cal1.month(), "-").concat(cal1LastDay.date());
125
+ var calendar2FirstGradient = "".concat(cal2.month(), "-").concat(cal2FirstDay.date());
126
+ var calendar2LastGradient = "".concat(cal2.month(), "-").concat(cal2LastDay.date());
127
+ var gradientBefore = {
128
+ content: '""',
129
+ position: 'absolute',
130
+ width: '100%',
131
+ top: 0,
132
+ bottom: 0,
133
+ right: 0,
134
+ pointerEvents: 'none'
135
+ };
136
+ var rightGradient = _objectSpread(_objectSpread({}, gradientBefore), {}, {
137
+ left: '-100%',
138
+ background: "linear-gradient(to right, transparent, ".concat(getIn(theme.colors, inRangeCell.background["default"]), ")")
139
+ });
140
+ var leftGradient = _objectSpread(_objectSpread({}, gradientBefore), {}, {
141
+ left: '100%',
142
+ background: "linear-gradient(to left, transparent, ".concat(getIn(theme.colors, inRangeCell.background["default"]), ")")
143
+ });
144
+ return _defineProperty({}, ".".concat(classes.dayCell), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "&[data-in-range]:not(&[data-first-in-range])[data-date=\"".concat(calendar1FirstGradient, "\"]"), {
145
+ '&:before': cal1IsFirstDayStartOfTheWeek ? {} : rightGradient
146
+ }), "&[data-in-range]:not(&[data-last-in-range])[data-date=\"".concat(calendar1LastGradient, "\"]"), {
147
+ '&:before': cal1IsLastDayEndOfTheWeek ? {} : leftGradient
148
+ }), "&[data-in-range]:not(&[data-first-in-range])[data-date=\"".concat(calendar2FirstGradient, "\"]"), {
149
+ '&:before': cal2IsFirstDayStartOfTheWeek ? {} : rightGradient
150
+ }), "&[data-in-range]:not(&[data-last-in-range])[data-date=\"".concat(calendar2LastGradient, "\"]"), {
151
+ '&:before': cal2IsLastDayEndOfTheWeek ? {} : leftGradient
152
+ }));
153
+ });
154
+ var CalendarStyles = /*#__PURE__*/styled(BaseBox).withConfig({
155
+ displayName: "CalendarStylesweb__CalendarStyles",
156
+ componentId: "xxlq7y-1"
157
+ })(function (_ref3) {
158
+ var theme = _ref3.theme,
159
+ pickerType = _ref3.pickerType;
160
+ var isMobile = useIsMobile();
161
+ var device = isMobile ? 'mobile' : 'desktop';
162
+ var isDayPicker = pickerType === 'day';
163
+ var today = {
164
+ '&[data-today]': {
165
+ position: 'relative',
166
+ ':before': {
167
+ content: '""',
168
+ position: 'absolute',
169
+ left: '50%',
170
+ bottom: makeSpace(size[5]),
171
+ transform: 'translate(-50%, -50%)',
172
+ backgroundColor: getIn(theme.colors, todayCell.text["default"]),
173
+ width: makeSpace(theme.spacing[2]),
174
+ height: makeSpace(theme.spacing[2]),
175
+ borderRadius: theme.border.radius.max
176
+ }
177
+ },
178
+ '&[data-today]:hover': {
179
+ backgroundColor: getIn(theme.colors, todayCell.background.hover),
180
+ outlineColor: getIn(theme.colors, todayCell.border.hover),
181
+ color: getIn(theme.colors, todayCell.text.hover)
182
+ }
183
+ };
184
+ var selected = {
185
+ '&[data-selected]': {
186
+ '&[data-celltype="day"]': {
187
+ backgroundColor: getIn(theme.colors, selectedCell.day.background["default"]),
188
+ outlineColor: getIn(theme.colors, selectedCell.day.border["default"]),
189
+ color: getIn(theme.colors, selectedCell.day.text["default"]),
190
+ ':hover': {
191
+ backgroundColor: getIn(theme.colors, selectedCell.day.background.hover),
192
+ color: getIn(theme.colors, selectedCell.day.text.hover)
193
+ }
194
+ },
195
+ '&[data-celltype="month"], &[data-celltype="year"]': {
196
+ backgroundColor: 'transparent',
197
+ outlineStyle: 'solid',
198
+ outlineWidth: makeBorderSize(theme.border.width.thin),
199
+ outlineOffset: makeSpace(-theme.border.width.thin),
200
+ outlineColor: getIn(theme.colors, selectedCell.month.border["default"]),
201
+ color: getIn(theme.colors, selectedCell.month.text["default"]),
202
+ ':hover': {
203
+ backgroundColor: getIn(theme.colors, selectedCell.month.background.hover)
204
+ }
205
+ },
206
+ ':before': {
207
+ backgroundColor: getIn(theme.colors, selectedCell.day.text["default"])
208
+ }
209
+ }
210
+ };
211
+ var ranges = {
212
+ '&[data-in-range]': {
213
+ borderRadius: 0,
214
+ backgroundColor: getIn(theme.colors, inRangeCell.background["default"]),
215
+ outlineColor: getIn(theme.colors, inRangeCell.border["default"]),
216
+ color: getIn(theme.colors, inRangeCell.text["default"]),
217
+ position: 'relative'
218
+ },
219
+ '&[data-in-range]:hover': {
220
+ backgroundColor: getIn(theme.colors, inRangeCell.background.hover),
221
+ outlineColor: getIn(theme.colors, inRangeCell.border.hover),
222
+ color: getIn(theme.colors, inRangeCell.text.hover)
223
+ },
224
+ '&[data-first-in-range]': {
225
+ borderRadius: theme.border.radius.medium,
226
+ borderTopRightRadius: 0,
227
+ borderBottomRightRadius: 0
228
+ },
229
+ '&[data-last-in-range]': {
230
+ borderRadius: theme.border.radius.medium,
231
+ borderTopLeftRadius: 0,
232
+ borderBottomLeftRadius: 0
233
+ },
234
+ '&[data-first-in-range][data-last-in-range]': {
235
+ borderRadius: theme.border.radius.medium
236
+ }
237
+ };
238
+ return _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
239
+ width: '100%'
240
+ }, ".".concat(classes.levelsGroup), {
241
+ width: '100%',
242
+ display: 'flex',
243
+ justifyContent: 'space-between',
244
+ gap: makeSpace(theme.spacing[8]),
245
+ table: {
246
+ borderCollapse: 'collapse',
247
+ width: '100%'
248
+ },
249
+ '> div': {
250
+ width: isMobile || !isDayPicker ? '100%' : undefined
251
+ },
252
+ th: {
253
+ flex: 1
254
+ },
255
+ td: {
256
+ flex: 1,
257
+ padding: '0px',
258
+ paddingBottom: makeSpace(cell.gap.y)
259
+ }
260
+ }), ".".concat(classes.row), {
261
+ textAlign: 'center',
262
+ display: isDayPicker ? 'flex' : 'grid',
263
+ gridTemplateColumns: 'repeat(3, 1fr)'
264
+ }), ".".concat(classes.calendarHeader), {
265
+ display: 'none'
266
+ }), ".".concat(classes.weekday), _objectSpread(_objectSpread({}, getTextStyles({
267
+ theme: theme,
268
+ variant: 'body',
269
+ size: 'small',
270
+ weight: 'medium',
271
+ color: 'surface.text.gray.muted'
272
+ })), {}, {
273
+ paddingBottom: makeSpace(theme.spacing[4])
274
+ })), ".".concat(classes.dayCell), _objectSpread(_objectSpread(_objectSpread(_objectSpread({
275
+ cursor: 'pointer',
276
+ width: isMobile || !isDayPicker ? '100%' : makeSpace(cell.size[device]),
277
+ height: isDayPicker && isMobile ? undefined : makeSpace(cell.size[device]),
278
+ aspectRatio: isDayPicker && isMobile ? '1 / 1' : undefined,
279
+ borderRadius: theme.border.radius.medium,
280
+ backgroundColor: getIn(theme.colors, cell.background["default"]),
281
+ border: 'none'
282
+ }, getTextStyles({
283
+ theme: theme,
284
+ variant: 'body',
285
+ size: 'medium',
286
+ weight: 'regular'
287
+ })), {}, {
288
+ '&:hover': {
289
+ backgroundColor: getIn(theme.colors, cell.background.hover)
290
+ },
291
+ '&:focus-visible': getFocusRingStyles({
292
+ theme: theme,
293
+ isImportant: true
294
+ }),
295
+ '&[data-disabled]': {
296
+ color: getIn(theme.colors, cell.text.disabled),
297
+ backgroundColor: getIn(theme.colors, cell.background.disabled),
298
+ cursor: 'not-allowed'
299
+ },
300
+ '&[data-outside]': {
301
+ color: theme.colors.interactive.text.gray.muted
302
+ },
303
+ '&[data-outside]:hover': {
304
+ color: getIn(theme.colors, cell.text["default"])
305
+ }
306
+ }, ranges), today), selected));
307
+ });
308
+
309
+ export { CalendarGradientStyles, CalendarStyles };
310
+ //# sourceMappingURL=CalendarStyles.web.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalendarStyles.web.js","sources":["../../../../../../src/components/DatePicker/CalendarStyles.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport styled from 'styled-components';\nimport dayjs from 'dayjs';\nimport type { PickerType } from './types';\nimport { classes } from './constants';\nimport BaseBox from '~components/Box/BaseBox';\nimport getTextStyles from '~components/Typography/Text/getTextStyles';\nimport { size } from '~tokens/global';\nimport { makeBorderSize, makeSpace } from '~utils';\nimport getIn from '~utils/lodashButBetter/get';\nimport { useIsMobile } from '~utils/useIsMobile';\nimport { getFocusRingStyles } from '~utils/getFocusRingStyles';\n\nconst cell = {\n gap: {\n x: size[0],\n y: size[2],\n },\n size: {\n desktop: size[40],\n mobile: size[48],\n },\n background: {\n default: 'transparent',\n hover: 'interactive.background.gray.highlighted',\n disabled: 'transparent',\n },\n text: {\n default: 'interactive.text.gray.normal',\n disabled: 'interactive.text.gray.disabled',\n },\n} as const;\n\nconst todayCell = {\n background: {\n default: 'transparent',\n hover: 'interactive.background.primary.faded',\n },\n border: {\n default: 'interactive.border.primary.default',\n hover: 'interactive.border.primary.default',\n },\n text: {\n default: 'interactive.text.primary.normal',\n hover: 'interactive.text.primary.normal',\n },\n} as const;\n\nconst selectedCell = {\n day: {\n background: {\n default: 'interactive.background.primary.default',\n hover: 'interactive.background.primary.highlighted',\n },\n border: {\n default: 'interactive.border.primary.default',\n hover: 'interactive.border.primary.faded',\n },\n text: {\n default: 'interactive.text.onPrimary.normal',\n hover: 'interactive.text.onPrimary.normal',\n },\n },\n month: {\n background: {\n default: 'transparent',\n hover: 'interactive.background.primary.faded',\n },\n border: {\n default: 'interactive.border.primary.default',\n },\n text: {\n default: 'interactive.text.primary.normal',\n },\n },\n} as const;\n\nconst inRangeCell = {\n background: {\n default: 'surface.background.primary.subtle',\n hover: 'interactive.background.primary.faded',\n },\n border: {\n default: 'interactive.border.primary.default',\n hover: 'interactive.border.primary.default',\n },\n text: {\n default: 'interactive.text.primary.normal',\n hover: 'interactive.text.primary.normal',\n },\n} as const;\n\nconst CalendarGradientStyles = styled(BaseBox)<{ date: Date; isRange: boolean }>(\n ({ theme, date, isRange }) => {\n const isMobile = useIsMobile();\n // Bail out if datepicker is not in range mode or on mobile\n if (isMobile || !isRange) return {};\n\n // Calculate the first and last day of the month for both calendars in range mode\n // This is to apply the gradient to the first and last day of the month\n const cal1 = dayjs(date);\n const cal1FirstDay = cal1.startOf('month');\n const cal1LastDay = cal1.endOf('month');\n // Check if the first and last day of the month are at the start or end of the week\n // If so, we don't apply the gradient, as it will overflow to the previous or next month\n // Eg: https://github.com/razorpay/blade/assets/35374649/025b8ed9-90b4-49b6-a307-a746ae5b910f\n const cal1IsFirstDayStartOfTheWeek = cal1FirstDay.day() === 0;\n const cal1IsLastDayEndOfTheWeek = cal1LastDay.day() === 6;\n\n // Do the same for the second calendar\n const cal2 = dayjs(date).add(1, 'month');\n const cal2FirstDay = cal2.startOf('month');\n const cal2LastDay = cal2.endOf('month');\n const cal2IsFirstDayStartOfTheWeek = cal2FirstDay.day() === 0;\n const cal2IsLastDayEndOfTheWeek = cal2LastDay.day() === 6;\n\n const calendar1FirstGradient = `${cal1.month()}-${cal1FirstDay.date()}`;\n const calendar1LastGradient = `${cal1.month()}-${cal1LastDay.date()}`;\n const calendar2FirstGradient = `${cal2.month()}-${cal2FirstDay.date()}`;\n const calendar2LastGradient = `${cal2.month()}-${cal2LastDay.date()}`;\n\n const gradientBefore = {\n content: '\"\"',\n position: 'absolute',\n width: '100%',\n top: 0,\n bottom: 0,\n right: 0,\n pointerEvents: 'none',\n } as const;\n const rightGradient = {\n ...gradientBefore,\n left: '-100%',\n background: `linear-gradient(to right, transparent, ${getIn(\n theme.colors,\n inRangeCell.background.default,\n )})`,\n };\n const leftGradient = {\n ...gradientBefore,\n left: '100%',\n background: `linear-gradient(to left, transparent, ${getIn(\n theme.colors,\n inRangeCell.background.default,\n )})`,\n };\n\n return {\n [`.${classes.dayCell}`]: {\n // First calendar column\n [`&[data-in-range]:not(&[data-first-in-range])[data-date=\"${calendar1FirstGradient}\"]`]: {\n '&:before': cal1IsFirstDayStartOfTheWeek ? {} : rightGradient,\n },\n [`&[data-in-range]:not(&[data-last-in-range])[data-date=\"${calendar1LastGradient}\"]`]: {\n '&:before': cal1IsLastDayEndOfTheWeek ? {} : leftGradient,\n },\n // Second calendar column\n [`&[data-in-range]:not(&[data-first-in-range])[data-date=\"${calendar2FirstGradient}\"]`]: {\n '&:before': cal2IsFirstDayStartOfTheWeek ? {} : rightGradient,\n },\n [`&[data-in-range]:not(&[data-last-in-range])[data-date=\"${calendar2LastGradient}\"]`]: {\n '&:before': cal2IsLastDayEndOfTheWeek ? {} : leftGradient,\n },\n },\n };\n },\n);\n\nconst CalendarStyles = styled(BaseBox)<{ pickerType?: PickerType }>(({ theme, pickerType }) => {\n const isMobile = useIsMobile();\n const device = isMobile ? 'mobile' : 'desktop';\n const isDayPicker = pickerType === 'day';\n\n const today = {\n '&[data-today]': {\n position: 'relative',\n ':before': {\n content: '\"\"',\n position: 'absolute',\n left: '50%',\n bottom: makeSpace(size[5]),\n transform: 'translate(-50%, -50%)',\n backgroundColor: getIn(theme.colors, todayCell.text.default),\n width: makeSpace(theme.spacing[2]),\n height: makeSpace(theme.spacing[2]),\n borderRadius: theme.border.radius.max,\n },\n },\n '&[data-today]:hover': {\n backgroundColor: getIn(theme.colors, todayCell.background.hover),\n outlineColor: getIn(theme.colors, todayCell.border.hover),\n color: getIn(theme.colors, todayCell.text.hover),\n },\n } as const;\n\n const selected = {\n '&[data-selected]': {\n '&[data-celltype=\"day\"]': {\n backgroundColor: getIn(theme.colors, selectedCell.day.background.default),\n outlineColor: getIn(theme.colors, selectedCell.day.border.default),\n color: getIn(theme.colors, selectedCell.day.text.default),\n ':hover': {\n backgroundColor: getIn(theme.colors, selectedCell.day.background.hover),\n color: getIn(theme.colors, selectedCell.day.text.hover),\n },\n },\n '&[data-celltype=\"month\"], &[data-celltype=\"year\"]': {\n backgroundColor: 'transparent',\n outlineStyle: 'solid',\n outlineWidth: makeBorderSize(theme.border.width.thin),\n outlineOffset: makeSpace(-theme.border.width.thin),\n outlineColor: getIn(theme.colors, selectedCell.month.border.default),\n color: getIn(theme.colors, selectedCell.month.text.default),\n ':hover': {\n backgroundColor: getIn(theme.colors, selectedCell.month.background.hover),\n },\n },\n ':before': {\n backgroundColor: getIn(theme.colors, selectedCell.day.text.default),\n },\n },\n } as const;\n\n const ranges = {\n '&[data-in-range]': {\n borderRadius: 0,\n backgroundColor: getIn(theme.colors, inRangeCell.background.default),\n outlineColor: getIn(theme.colors, inRangeCell.border.default),\n color: getIn(theme.colors, inRangeCell.text.default),\n position: 'relative',\n },\n '&[data-in-range]:hover': {\n backgroundColor: getIn(theme.colors, inRangeCell.background.hover),\n outlineColor: getIn(theme.colors, inRangeCell.border.hover),\n color: getIn(theme.colors, inRangeCell.text.hover),\n },\n '&[data-first-in-range]': {\n borderRadius: theme.border.radius.medium,\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n '&[data-last-in-range]': {\n borderRadius: theme.border.radius.medium,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n },\n '&[data-first-in-range][data-last-in-range]': {\n borderRadius: theme.border.radius.medium,\n },\n } as const;\n\n return {\n width: '100%',\n [`.${classes.levelsGroup}`]: {\n width: '100%',\n display: 'flex',\n justifyContent: 'space-between',\n gap: makeSpace(theme.spacing[8]),\n table: {\n borderCollapse: 'collapse',\n width: '100%',\n },\n '> div': { width: isMobile || !isDayPicker ? '100%' : undefined },\n th: {\n flex: 1,\n },\n td: {\n flex: 1,\n padding: '0px',\n paddingBottom: makeSpace(cell.gap.y),\n },\n },\n [`.${classes.row}`]: {\n textAlign: 'center',\n display: isDayPicker ? 'flex' : 'grid',\n gridTemplateColumns: 'repeat(3, 1fr)',\n },\n [`.${classes.calendarHeader}`]: {\n display: 'none',\n },\n [`.${classes.weekday}`]: {\n ...getTextStyles({\n theme,\n variant: 'body',\n size: 'small',\n weight: 'medium',\n color: 'surface.text.gray.muted',\n }),\n paddingBottom: makeSpace(theme.spacing[4]),\n },\n [`.${classes.dayCell}`]: {\n cursor: 'pointer',\n width: isMobile || !isDayPicker ? '100%' : makeSpace(cell.size[device]),\n height: isDayPicker && isMobile ? undefined : makeSpace(cell.size[device]),\n aspectRatio: isDayPicker && isMobile ? '1 / 1' : undefined,\n borderRadius: theme.border.radius.medium,\n backgroundColor: getIn(theme.colors, cell.background.default),\n border: 'none',\n ...getTextStyles({ theme, variant: 'body', size: 'medium', weight: 'regular' }),\n\n '&:hover': {\n backgroundColor: getIn(theme.colors, cell.background.hover),\n },\n '&:focus-visible': getFocusRingStyles({ theme, isImportant: true }),\n '&[data-disabled]': {\n color: getIn(theme.colors, cell.text.disabled),\n backgroundColor: getIn(theme.colors, cell.background.disabled),\n cursor: 'not-allowed',\n },\n '&[data-outside]': {\n color: theme.colors.interactive.text.gray.muted,\n },\n '&[data-outside]:hover': {\n color: getIn(theme.colors, cell.text.default),\n },\n ...ranges,\n ...today,\n ...selected,\n },\n };\n});\n\nexport { CalendarStyles, CalendarGradientStyles };\n"],"names":["cell","gap","x","size","y","desktop","mobile","background","hover","disabled","text","todayCell","border","selectedCell","day","month","inRangeCell","CalendarGradientStyles","styled","BaseBox","withConfig","displayName","componentId","_ref","theme","date","isRange","isMobile","useIsMobile","cal1","dayjs","cal1FirstDay","startOf","cal1LastDay","endOf","cal1IsFirstDayStartOfTheWeek","cal1IsLastDayEndOfTheWeek","cal2","add","cal2FirstDay","cal2LastDay","cal2IsFirstDayStartOfTheWeek","cal2IsLastDayEndOfTheWeek","calendar1FirstGradient","concat","calendar1LastGradient","calendar2FirstGradient","calendar2LastGradient","gradientBefore","content","position","width","top","bottom","right","pointerEvents","rightGradient","_objectSpread","left","getIn","colors","leftGradient","_defineProperty","classes","dayCell","CalendarStyles","_ref3","pickerType","device","isDayPicker","today","makeSpace","transform","backgroundColor","spacing","height","borderRadius","radius","max","outlineColor","color","selected","outlineStyle","outlineWidth","makeBorderSize","thin","outlineOffset","ranges","medium","borderTopRightRadius","borderBottomRightRadius","borderTopLeftRadius","borderBottomLeftRadius","levelsGroup","display","justifyContent","table","borderCollapse","undefined","th","flex","td","padding","paddingBottom","row","textAlign","gridTemplateColumns","calendarHeader","weekday","getTextStyles","variant","weight","cursor","aspectRatio","getFocusRingStyles","isImportant","interactive","gray","muted"],"mappings":"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"}
@@ -0,0 +1,185 @@
1
+ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
2
+ import _defineProperty from '@babel/runtime/helpers/defineProperty';
3
+ import React__default from 'react';
4
+ import { useDatesContext, getFormattedDate } from '@mantine/dates';
5
+ import '../Box/BaseBox/index.js';
6
+ import '../Icons/index.js';
7
+ import '../Input/BaseInput/index.js';
8
+ import '../../tokens/global/index.js';
9
+ import '../../utils/index.js';
10
+ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
11
+ import { BaseInput } from '../Input/BaseInput/BaseInput.js';
12
+ import { isReactNative } from '../../utils/platform/isReactNative.js';
13
+ import { size } from '../../tokens/global/size.js';
14
+ import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
15
+ import CalendarIcon from '../Icons/CalendarIcon/CalendarIcon.js';
16
+ import ArrowRightIcon from '../Icons/ArrowRightIcon/ArrowRightIcon.js';
17
+ import { makeSize } from '../../utils/makeSize/makeSize.js';
18
+
19
+ var _excluded = ["selectionType", "referenceProps", "inputRef", "date", "label", "labelPosition", "autoFocus", "name", "size"];
20
+ 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; }
21
+ 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; }
22
+ var _DateInput = function _DateInput(props, ref) {
23
+ var _props$label;
24
+ return /*#__PURE__*/jsx(BaseInput, _objectSpread(_objectSpread({}, props), {}, {
25
+ ref: ref,
26
+ as: "button",
27
+ textAlign: "left",
28
+ hideLabelText: ((_props$label = props.label) === null || _props$label === void 0 ? void 0 : _props$label.length) === 0,
29
+ autoCompleteSuggestionType: "none",
30
+ hasPopup: "dialog",
31
+ onClick: function onClick(e) {
32
+ var _props$onClick;
33
+ if (props.isDisabled) {
34
+ return;
35
+ }
36
+ (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, e);
37
+ },
38
+ onKeyDown: function onKeyDown(_ref) {
39
+ var _props$onKeyDown;
40
+ var event = _ref.event;
41
+ // @ts-expect-error
42
+ (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 ? void 0 : _props$onKeyDown.call(props, event);
43
+ }
44
+ }));
45
+ };
46
+ var DateInput = /*#__PURE__*/React__default.forwardRef(_DateInput);
47
+ var HiddenInput = function HiddenInput(_ref2) {
48
+ var value = _ref2.value,
49
+ name = _ref2.name;
50
+ if (isReactNative()) return /*#__PURE__*/jsx(Fragment, {});
51
+ return /*#__PURE__*/jsx("input", {
52
+ hidden: true,
53
+ name: name,
54
+ value: value,
55
+ readOnly: true
56
+ });
57
+ };
58
+ var iconVerticalMargin = {
59
+ medium: size[16],
60
+ large: size[24]
61
+ };
62
+ var _DatePickerInput = function _DatePickerInput(_ref3, ref) {
63
+ var selectionType = _ref3.selectionType,
64
+ referenceProps = _ref3.referenceProps,
65
+ inputRef = _ref3.inputRef,
66
+ date = _ref3.date,
67
+ label = _ref3.label,
68
+ labelPosition = _ref3.labelPosition,
69
+ autoFocus = _ref3.autoFocus,
70
+ name = _ref3.name,
71
+ _ref3$size = _ref3.size,
72
+ size$1 = _ref3$size === void 0 ? 'medium' : _ref3$size,
73
+ props = _objectWithoutProperties(_ref3, _excluded);
74
+ var format = 'DD/MM/YYYY';
75
+ var isLarge = size$1 === 'large';
76
+ var isLabelPositionLeft = labelPosition === 'left';
77
+ var hasLabel = Boolean(label);
78
+ var _useDatesContext = useDatesContext(),
79
+ locale = _useDatesContext.locale;
80
+ if (selectionType == 'single') {
81
+ var dateValue = getFormattedDate({
82
+ date: date,
83
+ format: format,
84
+ labelSeparator: '-',
85
+ locale: locale,
86
+ type: 'default'
87
+ });
88
+ return /*#__PURE__*/jsxs(BaseBox, {
89
+ width: "100%",
90
+ children: [/*#__PURE__*/jsx(HiddenInput, {
91
+ value: dateValue,
92
+ name: name
93
+ }), /*#__PURE__*/jsx(DateInput, _objectSpread(_objectSpread({
94
+ ref: ref,
95
+ id: "start-date",
96
+ labelPosition: labelPosition,
97
+ label: label,
98
+ placeholder: format,
99
+ popupId: referenceProps['aria-controls'],
100
+ isPopupExpanded: referenceProps['aria-expanded'],
101
+ size: size$1,
102
+ autoFocus: autoFocus,
103
+ value: dateValue,
104
+ componentName: "DatePickerInput"
105
+ }, props), referenceProps))]
106
+ });
107
+ }
108
+ if (selectionType == 'range') {
109
+ var startValue = getFormattedDate({
110
+ type: 'default',
111
+ date: date[0],
112
+ format: format,
113
+ labelSeparator: '-',
114
+ locale: locale
115
+ });
116
+ var endValue = getFormattedDate({
117
+ type: 'default',
118
+ date: date[1],
119
+ format: format,
120
+ labelSeparator: '-',
121
+ locale: locale
122
+ });
123
+ return /*#__PURE__*/jsxs(BaseBox, {
124
+ width: "100%",
125
+ display: "flex",
126
+ flexDirection: "row",
127
+ gap: "spacing.4",
128
+ alignItems: "flex-end",
129
+ ref: ref,
130
+ children: [/*#__PURE__*/jsxs(BaseBox, {
131
+ flex: 1,
132
+ children: [/*#__PURE__*/jsx(HiddenInput, {
133
+ value: startValue,
134
+ name: name === null || name === void 0 ? void 0 : name.start
135
+ }), /*#__PURE__*/jsx(DateInput, _objectSpread(_objectSpread({
136
+ setInputWrapperRef: function setInputWrapperRef(node) {
137
+ return inputRef.current = node;
138
+ },
139
+ id: "start-date",
140
+ leadingIcon: CalendarIcon,
141
+ label: label === null || label === void 0 ? void 0 : label.start,
142
+ labelPosition: labelPosition,
143
+ placeholder: format,
144
+ popupId: referenceProps['aria-controls'],
145
+ isPopupExpanded: referenceProps['aria-expanded'],
146
+ size: size$1,
147
+ autoFocus: autoFocus,
148
+ value: startValue,
149
+ componentName: "DatePickerInputStart"
150
+ }, props), referenceProps))]
151
+ }), /*#__PURE__*/jsx(BaseBox, {
152
+ flexShrink: 0,
153
+ alignSelf: "start",
154
+ children: /*#__PURE__*/jsx(ArrowRightIcon, {
155
+ size: "medium",
156
+ marginTop:
157
+ // Hacky layouting because the we cannot put this inside the internal layout of BaseInput.
158
+ hasLabel && !isLabelPositionLeft ? "calc(".concat(makeSize(iconVerticalMargin[size$1]), " + ").concat(makeSize(isLarge ? size[20] : size[15]), ")") : makeSize(iconVerticalMargin[size$1])
159
+ })
160
+ }), /*#__PURE__*/jsxs(BaseBox, {
161
+ flex: 1,
162
+ children: [/*#__PURE__*/jsx(HiddenInput, {
163
+ value: endValue,
164
+ name: name === null || name === void 0 ? void 0 : name.end
165
+ }), /*#__PURE__*/jsx(DateInput, _objectSpread(_objectSpread({
166
+ id: "end-date",
167
+ placeholder: format,
168
+ leadingIcon: CalendarIcon,
169
+ label: isLabelPositionLeft ? undefined : label === null || label === void 0 ? void 0 : label.end,
170
+ labelPosition: isLabelPositionLeft ? undefined : labelPosition,
171
+ popupId: referenceProps['aria-controls'],
172
+ isPopupExpanded: referenceProps['aria-expanded'],
173
+ size: size$1,
174
+ value: endValue,
175
+ componentName: "DatePickerInputEnd"
176
+ }, props), referenceProps))]
177
+ })]
178
+ });
179
+ }
180
+ return /*#__PURE__*/jsx(Fragment, {});
181
+ };
182
+ var DatePickerInput = /*#__PURE__*/React__default.forwardRef(_DatePickerInput);
183
+
184
+ export { DatePickerInput };
185
+ //# sourceMappingURL=DateInput.web.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DateInput.web.js","sources":["../../../../../../src/components/DatePicker/DateInput.web.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-autofocus */\n/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport { useDatesContext, getFormattedDate } from '@mantine/dates';\nimport type { DatePickerInputProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { ArrowRightIcon, CalendarIcon } from '~components/Icons';\nimport type { BaseInputProps } from '~components/Input/BaseInput';\nimport { BaseInput } from '~components/Input/BaseInput';\nimport { size as sizeTokens } from '~tokens/global';\nimport { isReactNative, makeSize } from '~utils';\nimport type { BladeElementRef } from '~utils/types';\n\nconst _DateInput = (\n props: BaseInputProps,\n ref: React.ForwardedRef<BladeElementRef>,\n): React.ReactElement => {\n return (\n <BaseInput\n {...props}\n ref={ref}\n as=\"button\"\n textAlign=\"left\"\n hideLabelText={props.label?.length === 0}\n autoCompleteSuggestionType=\"none\"\n hasPopup=\"dialog\"\n onClick={(e) => {\n if (props.isDisabled) {\n return;\n }\n props.onClick?.(e);\n }}\n onKeyDown={({ event }) => {\n // @ts-expect-error\n props.onKeyDown?.(event);\n }}\n />\n );\n};\n\nconst DateInput = React.forwardRef(_DateInput);\n\nconst HiddenInput = ({ value, name }: { value: string; name?: string }): React.ReactElement => {\n if (isReactNative()) return <></>;\n\n return <input hidden={true} name={name} value={value} readOnly />;\n};\n\nconst iconVerticalMargin = {\n medium: sizeTokens[16],\n large: sizeTokens[24],\n} as const;\n\nconst _DatePickerInput = (\n {\n selectionType,\n referenceProps,\n inputRef,\n date,\n label,\n labelPosition,\n autoFocus,\n name,\n size = 'medium',\n ...props\n }: DatePickerInputProps,\n ref: React.ForwardedRef<any>,\n): React.ReactElement => {\n const format = 'DD/MM/YYYY';\n const isLarge = size === 'large';\n const isLabelPositionLeft = labelPosition === 'left';\n const hasLabel = Boolean(label);\n const { locale } = useDatesContext();\n\n if (selectionType == 'single') {\n const dateValue = getFormattedDate({\n date,\n format,\n labelSeparator: '-',\n locale,\n type: 'default',\n });\n return (\n <BaseBox width=\"100%\">\n <HiddenInput value={dateValue} name={name} />\n <DateInput\n ref={ref as never}\n id=\"start-date\"\n labelPosition={labelPosition}\n label={label}\n placeholder={format}\n popupId={referenceProps['aria-controls']}\n isPopupExpanded={referenceProps['aria-expanded']}\n size={size}\n autoFocus={autoFocus}\n value={dateValue}\n componentName=\"DatePickerInput\"\n {...props}\n {...referenceProps}\n />\n </BaseBox>\n );\n }\n\n if (selectionType == 'range') {\n const startValue = getFormattedDate({\n type: 'default',\n date: date[0],\n format,\n labelSeparator: '-',\n locale,\n });\n const endValue = getFormattedDate({\n type: 'default',\n date: date[1],\n format,\n labelSeparator: '-',\n locale,\n });\n return (\n <BaseBox\n width=\"100%\"\n display=\"flex\"\n flexDirection=\"row\"\n gap=\"spacing.4\"\n alignItems=\"flex-end\"\n ref={ref as never}\n >\n <BaseBox flex={1}>\n <HiddenInput value={startValue} name={name?.start} />\n <DateInput\n setInputWrapperRef={(node) => ((inputRef as any)!.current = node)}\n id=\"start-date\"\n leadingIcon={CalendarIcon}\n label={label?.start}\n labelPosition={labelPosition}\n placeholder={format}\n popupId={referenceProps['aria-controls']}\n isPopupExpanded={referenceProps['aria-expanded']}\n size={size}\n autoFocus={autoFocus}\n value={startValue}\n componentName=\"DatePickerInputStart\"\n {...props}\n {...referenceProps}\n />\n </BaseBox>\n <BaseBox flexShrink={0} alignSelf=\"start\">\n <ArrowRightIcon\n size=\"medium\"\n marginTop={\n // Hacky layouting because the we cannot put this inside the internal layout of BaseInput.\n hasLabel && !isLabelPositionLeft\n ? `calc(${makeSize(iconVerticalMargin[size])} + ${makeSize(\n isLarge ? sizeTokens[20] : sizeTokens[15],\n )})`\n : makeSize(iconVerticalMargin[size])\n }\n />\n </BaseBox>\n <BaseBox flex={1}>\n <HiddenInput value={endValue} name={name?.end} />\n <DateInput\n id=\"end-date\"\n placeholder={format}\n leadingIcon={CalendarIcon}\n label={isLabelPositionLeft ? undefined : label?.end}\n labelPosition={isLabelPositionLeft ? undefined : labelPosition}\n popupId={referenceProps['aria-controls']}\n isPopupExpanded={referenceProps['aria-expanded']}\n size={size}\n value={endValue}\n componentName=\"DatePickerInputEnd\"\n {...props}\n {...referenceProps}\n />\n </BaseBox>\n </BaseBox>\n );\n }\n\n return <></>;\n};\n\nconst DatePickerInput = React.forwardRef(_DatePickerInput);\nexport { DatePickerInput };\n"],"names":["_DateInput","props","ref","_props$label","_jsx","BaseInput","_objectSpread","as","textAlign","hideLabelText","label","length","autoCompleteSuggestionType","hasPopup","onClick","e","_props$onClick","isDisabled","call","onKeyDown","_ref","_props$onKeyDown","event","DateInput","React","forwardRef","HiddenInput","_ref2","value","name","isReactNative","_Fragment","hidden","readOnly","iconVerticalMargin","medium","sizeTokens","large","_DatePickerInput","_ref3","selectionType","referenceProps","inputRef","date","labelPosition","autoFocus","_ref3$size","size","_objectWithoutProperties","_excluded","format","isLarge","isLabelPositionLeft","hasLabel","Boolean","_useDatesContext","useDatesContext","locale","dateValue","getFormattedDate","labelSeparator","type","_jsxs","BaseBox","width","children","id","placeholder","popupId","isPopupExpanded","componentName","startValue","endValue","display","flexDirection","gap","alignItems","flex","start","setInputWrapperRef","node","current","leadingIcon","CalendarIcon","flexShrink","alignSelf","ArrowRightIcon","marginTop","concat","makeSize","end","undefined","DatePickerInput"],"mappings":"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"}