@sproutsocial/seeds-react-datepicker 1.0.51 → 1.1.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 (20) hide show
  1. package/.turbo/turbo-build.log +9 -9
  2. package/CHANGELOG.md +54 -0
  3. package/dist/datepicker.css +262 -0
  4. package/dist/esm/index.js +76 -174
  5. package/dist/esm/index.js.map +1 -1
  6. package/dist/index.js +74 -172
  7. package/dist/index.js.map +1 -1
  8. package/package.json +10 -10
  9. package/src/CalendarDayTailwind.tsx +76 -0
  10. package/src/DateRangePicker/DateRangePicker.tsx +6 -2
  11. package/src/DateRangePicker/__tests__/DateRangePicker.test.tsx +1 -2
  12. package/src/SingleDatePicker/SingleDatePicker.tsx +6 -2
  13. package/src/SingleDatePicker/__tests__/SingleDatePicker.test.tsx +1 -2
  14. package/src/__tests__/DatepickerContract.test.tsx +269 -0
  15. package/src/__tests__/DatepickerRouting.test.tsx +501 -0
  16. package/src/cn.ts +28 -0
  17. package/src/common.tsx +1 -1
  18. package/src/datepicker.css +262 -0
  19. package/src/dayModifiers.ts +71 -0
  20. package/src/styles.ts +21 -54
package/dist/esm/index.js CHANGED
@@ -1,13 +1,37 @@
1
1
  // src/SingleDatePicker/SingleDatePicker.tsx
2
- import React2, { useCallback, useState } from "react";
2
+ import React3, { useCallback, useState } from "react";
3
3
  import moment2 from "moment";
4
4
  import DayPickerSingleDateController from "react-dates/lib/components/DayPickerSingleDateController";
5
5
 
6
- // src/styles.ts
7
- import styled, { createGlobalStyle, css } from "styled-components";
6
+ // src/common.tsx
7
+ import "react-dates/initialize";
8
+ import "react-dates/lib/css/_datepicker.css";
9
+ import "react";
10
+ import Icon from "@sproutsocial/seeds-react-icon";
11
+
12
+ // src/CalendarDayTailwind.tsx
13
+ import * as React from "react";
14
+
15
+ // src/cn.ts
16
+ function cn(...inputs) {
17
+ const classes = [];
18
+ for (const input of inputs) {
19
+ if (!input) continue;
20
+ if (typeof input === "string") {
21
+ classes.push(input);
22
+ } else if (typeof input === "object") {
23
+ for (const [key, value] of Object.entries(input)) {
24
+ if (value) {
25
+ classes.push(key);
26
+ }
27
+ }
28
+ }
29
+ }
30
+ return classes.join(" ");
31
+ }
32
+
33
+ // src/dayModifiers.ts
8
34
  import moment from "moment";
9
- import { disabled } from "@sproutsocial/seeds-react-mixins";
10
- import Box from "@sproutsocial/seeds-react-box";
11
35
  var isSelected = (modifiers) => modifiers.has("selected-span") || modifiers.has("selected") || modifiers.has("selected-start") || modifiers.has("selected-end") || modifiers.has("hovered-span") || modifiers.has("after-hovered-start");
12
36
  var isOutOfRange = (modifiers) => modifiers.has("blocked-out-of-range");
13
37
  var isHoveredAndInRange = (modifiers) => modifiers.has("hovered") && !modifiers.has("blocked-out-of-range");
@@ -29,175 +53,55 @@ var shouldHaveRightPill = (modifiers, day) => {
29
53
  }
30
54
  return false;
31
55
  };
32
- var CalendarDay = styled(Box)`
33
- ${({ modifiers, day, theme }) => {
56
+
57
+ // src/CalendarDayTailwind.tsx
58
+ import { jsx } from "react/jsx-runtime";
59
+ var dayStateClasses = (modifiers, day) => {
34
60
  if (isSelected(modifiers)) {
35
- return css`
36
- background-color: ${theme.colors.container.background.selected};
37
- color: ${theme.colors.text.inverse};
38
- margin-left: ${shouldHaveLeftPill(modifiers, day) && theme.space[200]};
39
- margin-right: ${shouldHaveRightPill(modifiers, day) && theme.space[200]};
40
- border-top-left-radius: ${shouldHaveLeftPill(modifiers, day) && theme.radii.pill};
41
- border-bottom-left-radius: ${shouldHaveLeftPill(modifiers, day) && theme.radii.pill};
42
- border-top-right-radius: ${shouldHaveRightPill(modifiers, day) && theme.radii.pill};
43
- border-bottom-right-radius: ${shouldHaveRightPill(modifiers, day) && theme.radii.pill};
44
- `;
61
+ return {
62
+ "seeds-datepicker-day-selected": true,
63
+ "seeds-datepicker-day-pill-left": shouldHaveLeftPill(modifiers, day),
64
+ "seeds-datepicker-day-pill-right": shouldHaveRightPill(modifiers, day)
65
+ };
45
66
  }
46
67
  if (isHoveredAndInRange(modifiers)) {
47
- return css`
48
- margin: 0 ${theme.space[200]};
49
- border-radius: ${theme.radii.pill};
50
- border: 1px solid ${theme.colors.container.border.selected};
51
- `;
52
- } else if (isOutOfRange(modifiers)) {
53
- return css`
54
- color: ${theme.colors.text.subtext};
55
- ${disabled};
56
- `;
68
+ return { "seeds-datepicker-day-hovered": true };
57
69
  }
58
- }};
59
- `;
60
- var ReactDatesCssOverrides = createGlobalStyle`
61
- .DayPicker {
62
- box-sizing: content-box;
63
- font-weight: ${({ theme }) => theme.fontWeights.normal};
64
- font-family: ${(props) => props.theme.fontFamily};
65
-
66
- /* override react-dates height to better reflect how tall the component actually is */
67
- /* adding margin/padding will be more truer to our seeds system because the height */
68
- /* of the calendar adds an extra row of padding if we do not override it */
69
- &_transitionContainer {
70
- /* need !important because react-dates sets height on the element itself */
71
- height: 228px !important;
72
- }
73
-
74
- &_weekHeader {
75
- color: ${({ theme }) => theme.colors.text.headline};
76
- border-bottom: 1px solid ${({ theme }) => theme.colors.container.border.base};
77
-
78
- /* Magic number to match position of .CalendarMonth_caption */
79
- top: 26px;
80
-
81
- /* Magic number to make the bottom border line stretch the full width */
82
- width: 230px;
83
-
84
- &_ul {
85
- /* Magic number to line up day name headings over the correct numbers */
86
- padding-left: 10px;
87
- }
88
- }
89
-
90
- &_weekHeaders__horizontal {
91
- margin-left: 0
92
- }
93
-
94
- &_weekHeader_li {
95
- ${({ theme }) => theme.typography[200]}
96
- color: ${({ theme }) => theme.colors.text.subtext};
97
- font-weight: ${({ theme }) => theme.fontWeights.semibold};
98
- margin: 0;
99
- }
100
-
101
- &__horizontal {
102
- box-shadow: none;
103
- background: ${({ theme }) => theme.colors.container.background.base};
104
- }
105
- }
106
-
107
- .CalendarDay {
108
- background-color: transparent;
109
-
110
- &__selected, &__selected_span, &:hover {
111
- background-color: transparent;
112
- }
113
-
114
- &__default {
115
- color: ${({ theme }) => theme.colors.text.body};
116
- }
117
- &__default,
118
- &__default:hover {
119
- border: none;
120
- color: ${({ theme }) => theme.colors.text.body};
121
- }
122
- }
123
-
124
- .CalendarMonth {
125
- ${({ theme }) => theme.typography[200]}
126
- background: ${({ theme }) => theme.colors.container.background.base};
127
-
128
- /* spacing between visible months and months off canvas */
129
- padding: 0 15px;
130
-
131
- &_caption {
132
- ${({ theme }) => theme.typography[200]}
133
- color: ${({ theme }) => theme.colors.text.headline};
134
- padding-top: 0;
135
- background: ${({ theme }) => theme.colors.container.background.base};
136
-
137
- strong {
138
- font-weight: ${({ theme }) => theme.fontWeights.semibold};
139
- }
140
-
141
- }
142
- &_table {
143
- line-height: 21.333px;
144
- tr {
145
- vertical-align: middle;
146
- }
147
- td {
148
- padding: 0;
149
- border-bottom: none;
150
- }
151
- }
152
- }
153
-
154
- .CalendarMonthGrid {
155
- background: ${({ theme }) => theme.colors.container.background.base};
156
- }
157
-
158
- /* Left and Right Arrow Buttons to navigate months */
159
- .DayPickerNavigation_button__horizontal {
160
- color: ${({ theme }) => theme.colors.button.pill.text.base};
161
- top: -4px;
162
- padding: 7px 8px;
163
- position: absolute;
164
- line-height: 0.78;
165
- border-radius: 9999px;
166
- border: none;
167
- background: ${({ theme }) => theme.colors.button.pill.background.base};
168
-
169
- &:nth-child(1) {
170
- left: 22px;
171
- }
172
- &:nth-child(2) {
173
- right: 22px;
174
- }
175
-
176
- &:hover {
177
- background: ${({ theme }) => theme.colors.button.pill.background.hover};
178
- }
179
- }
180
- `;
70
+ if (isOutOfRange(modifiers)) {
71
+ return { "seeds-datepicker-day-out-of-range": true };
72
+ }
73
+ return {};
74
+ };
75
+ var CalendarDayTailwind = React.forwardRef(({ modifiers, day, className, children }, ref) => /* @__PURE__ */ jsx(
76
+ "div",
77
+ {
78
+ ref,
79
+ className: cn(
80
+ "seeds-datepicker-day",
81
+ dayStateClasses(modifiers, day),
82
+ className
83
+ ),
84
+ children
85
+ }
86
+ ));
87
+ CalendarDayTailwind.displayName = "CalendarDay";
88
+ var CalendarDayTailwind_default = CalendarDayTailwind;
181
89
 
182
90
  // src/common.tsx
183
- import "react-dates/initialize";
184
- import "react-dates/lib/css/_datepicker.css";
185
- import "react";
186
- import Icon from "@sproutsocial/seeds-react-icon";
187
- import { jsx } from "react/jsx-runtime";
91
+ import { jsx as jsx2 } from "react/jsx-runtime";
188
92
  var iconNames = {
189
93
  left: "arrow-left-solid",
190
94
  right: "arrow-right-solid"
191
95
  };
192
96
  var CalendarNavButton = ({
193
97
  type
194
- }) => /* @__PURE__ */ jsx(Icon, { size: "mini", name: iconNames[type], "aria-hidden": true });
98
+ }) => /* @__PURE__ */ jsx2(Icon, { size: "mini", name: iconNames[type], "aria-hidden": true });
195
99
  var commonDatePickerProps = {
196
100
  hideKeyboardShortcutsPanel: true,
197
101
  daySize: 30,
198
- navPrev: /* @__PURE__ */ jsx(CalendarNavButton, { type: "left" }),
199
- navNext: /* @__PURE__ */ jsx(CalendarNavButton, { type: "right" }),
200
- renderDayContents: (day, modifiers) => /* @__PURE__ */ jsx(CalendarDay, { day, modifiers, children: day.format("D") }),
102
+ navPrev: /* @__PURE__ */ jsx2(CalendarNavButton, { type: "left" }),
103
+ navNext: /* @__PURE__ */ jsx2(CalendarNavButton, { type: "right" }),
104
+ renderDayContents: (day, modifiers) => /* @__PURE__ */ jsx2(CalendarDayTailwind_default, { day, modifiers, children: day.format("D") }),
201
105
  initialVisibleMonth: null
202
106
  };
203
107
  var formatDateAsCalendarHeader = (date) => date.format("MMMM YYYY");
@@ -212,7 +116,7 @@ var DefaultSetStatusText = (dates) => dates.map(formatDateAsCalendarHeader).join
212
116
 
213
117
  // src/SingleDatePicker/SingleDatePicker.tsx
214
118
  import { VisuallyHidden } from "@sproutsocial/seeds-react-visually-hidden";
215
- import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
119
+ import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
216
120
  var noop = () => {
217
121
  };
218
122
  var SingleDatePicker = ({
@@ -249,9 +153,8 @@ var SingleDatePicker = ({
249
153
  [onBlur, onFocusChange]
250
154
  );
251
155
  return /* @__PURE__ */ jsxs(Fragment, { children: [
252
- /* @__PURE__ */ jsx2(ReactDatesCssOverrides, {}),
253
- /* @__PURE__ */ jsx2(VisuallyHidden, { children: /* @__PURE__ */ jsx2("div", { role: "status", children: statusText }) }),
254
- /* @__PURE__ */ jsx2(
156
+ /* @__PURE__ */ jsx3(VisuallyHidden, { children: /* @__PURE__ */ jsx3("div", { role: "status", children: statusText }) }),
157
+ /* @__PURE__ */ jsx3(
255
158
  DayPickerSingleDateController,
256
159
  {
257
160
  ...commonDatePickerProps,
@@ -269,11 +172,11 @@ var SingleDatePicker = ({
269
172
  )
270
173
  ] });
271
174
  };
272
- var SingleDatePicker_default = React2.memo(SingleDatePicker);
175
+ var SingleDatePicker_default = React3.memo(SingleDatePicker);
273
176
 
274
177
  // src/SingleDatePicker/StatefulSingleDatePicker.tsx
275
178
  import { useState as useState2 } from "react";
276
- import { jsx as jsx3 } from "react/jsx-runtime";
179
+ import { jsx as jsx4 } from "react/jsx-runtime";
277
180
  var StatefulSingleDatePicker = ({
278
181
  date,
279
182
  onDateChange,
@@ -284,7 +187,7 @@ var StatefulSingleDatePicker = ({
284
187
  onDateChange && onDateChange(date2);
285
188
  setDate(date2);
286
189
  };
287
- return /* @__PURE__ */ jsx3(
190
+ return /* @__PURE__ */ jsx4(
288
191
  SingleDatePicker_default,
289
192
  {
290
193
  date: stateDate,
@@ -299,7 +202,7 @@ import { useCallback as useCallback2, useState as useState3 } from "react";
299
202
  import moment3 from "moment";
300
203
  import DayPickerRangeController from "react-dates/lib/components/DayPickerRangeController";
301
204
  import { VisuallyHidden as VisuallyHidden2 } from "@sproutsocial/seeds-react-visually-hidden";
302
- import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
205
+ import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
303
206
  var DateRangePicker = ({
304
207
  startDate = null,
305
208
  endDate = null,
@@ -337,9 +240,8 @@ var DateRangePicker = ({
337
240
  [onBlur, onFocusChange]
338
241
  );
339
242
  return /* @__PURE__ */ jsxs2(Fragment2, { children: [
340
- /* @__PURE__ */ jsx4(ReactDatesCssOverrides, {}),
341
- /* @__PURE__ */ jsx4(VisuallyHidden2, { children: /* @__PURE__ */ jsx4("div", { role: "status", children: statusText }) }),
342
- /* @__PURE__ */ jsx4(
243
+ /* @__PURE__ */ jsx5(VisuallyHidden2, { children: /* @__PURE__ */ jsx5("div", { role: "status", children: statusText }) }),
244
+ /* @__PURE__ */ jsx5(
343
245
  DayPickerRangeController,
344
246
  {
345
247
  ...commonDatePickerProps,
@@ -362,9 +264,9 @@ var DateRangePicker = ({
362
264
  var DateRangePicker_default = DateRangePicker;
363
265
 
364
266
  // src/DateRangePicker/StatefulDateRangePicker.tsx
365
- import React5, { useState as useState4 } from "react";
267
+ import React6, { useState as useState4 } from "react";
366
268
  import { START_DATE } from "react-dates/constants";
367
- import { jsx as jsx5 } from "react/jsx-runtime";
269
+ import { jsx as jsx6 } from "react/jsx-runtime";
368
270
  var StatefulDateRangePicker = ({
369
271
  startDate,
370
272
  endDate,
@@ -376,7 +278,7 @@ var StatefulDateRangePicker = ({
376
278
  startDate,
377
279
  endDate
378
280
  });
379
- const [focusedInput, setFocusedInput] = React5.useState(START_DATE);
281
+ const [focusedInput, setFocusedInput] = React6.useState(START_DATE);
380
282
  const handleDatesChange = (nextDates) => {
381
283
  onDatesChange && onDatesChange(nextDates);
382
284
  setDate(nextDates);
@@ -390,7 +292,7 @@ var StatefulDateRangePicker = ({
390
292
  nextFocusedInput === null ? START_DATE : nextFocusedInput
391
293
  );
392
294
  };
393
- return /* @__PURE__ */ jsx5(
295
+ return /* @__PURE__ */ jsx6(
394
296
  DateRangePicker_default,
395
297
  {
396
298
  startDate: dates.startDate,
package/dist/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/SingleDatePicker/SingleDatePicker.tsx","../../src/styles.ts","../../src/common.tsx","../../src/SingleDatePicker/StatefulSingleDatePicker.tsx","../../src/DateRangePicker/DateRangePicker.tsx","../../src/DateRangePicker/StatefulDateRangePicker.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport moment from \"moment\";\nimport DayPickerSingleDateController from \"react-dates/lib/components/DayPickerSingleDateController\";\nimport { ReactDatesCssOverrides } from \"../styles\";\nimport {\n commonDatePickerProps,\n DefaultSetStatusText,\n getVisibleMonths,\n} from \"../common\";\nimport type { TypeSingleDatePickerProps } from \"./SingleDatePickerTypes\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\n\nconst noop = () => {};\n\nconst SingleDatePicker = ({\n onDateChange,\n setStatusText = DefaultSetStatusText,\n date = null,\n focused = false,\n onFocusChange = noop,\n initialVisibleMonth,\n numberOfMonths = 1,\n onBlur,\n ...rest\n}: TypeSingleDatePickerProps) => {\n const [statusText, updateStatusText] = useState(() =>\n setStatusText(\n getVisibleMonths(\n moment(initialVisibleMonth?.() || date || undefined),\n numberOfMonths\n )\n )\n );\n\n const handleMonthClick = useCallback(\n // @ts-ignore unknown types\n (date) => {\n updateStatusText(setStatusText(getVisibleMonths(date, numberOfMonths)));\n },\n [numberOfMonths, setStatusText]\n );\n const wrappedOnBlur = useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n onFocusChange?.({ focused: false });\n onBlur?.(event);\n },\n [onBlur, onFocusChange]\n );\n\n return (\n <>\n <ReactDatesCssOverrides />\n <VisuallyHidden>\n <div role=\"status\">{statusText}</div>\n </VisuallyHidden>\n <DayPickerSingleDateController\n {...commonDatePickerProps}\n date={date}\n numberOfMonths={numberOfMonths}\n onDateChange={onDateChange}\n initialVisibleMonth={initialVisibleMonth || null}\n focused={focused}\n onBlur={wrappedOnBlur}\n onFocusChange={onFocusChange}\n onPrevMonthClick={handleMonthClick}\n onNextMonthClick={handleMonthClick}\n {...rest}\n />\n </>\n );\n};\n\nexport default React.memo<TypeSingleDatePickerProps>(SingleDatePicker);\n","import styled, { createGlobalStyle, css } from \"styled-components\";\nimport moment from \"moment\";\nimport type { ModifiersShape } from \"react-dates\";\nimport { disabled } from \"@sproutsocial/seeds-react-mixins\";\nimport Box from \"@sproutsocial/seeds-react-box\";\n\n/*\n * Partial list of modifiers given to renderDayContents by airbnb/react-dates. There may be more.\n *\n * today, blocked, blocked-calendar, blocked-out-of-range, highlighted-calendar, valid,\n * selected, selected-start, selected-end, blocked-minimum-nights, selected-span, last-in-range,\n * hovered, hovered-span, hovered-offset, after-hovered-start, first-day-of-week, last-day-of-week,\n * hovered-start-first-possible-end, hovered-start-blocked-minimum-nights, before-hovered-end,\n * no-selected-start-before-selected-end, selected-start-in-hovered-span, selected-start-no-selected-end,\n * selected-end-no-selected-start\n *\n */\nconst isSelected = (modifiers: ModifiersShape) =>\n modifiers.has(\"selected-span\") ||\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-start\") ||\n modifiers.has(\"selected-end\") ||\n modifiers.has(\"hovered-span\") ||\n modifiers.has(\"after-hovered-start\");\n\nconst isOutOfRange = (modifiers: ModifiersShape) =>\n modifiers.has(\"blocked-out-of-range\");\n\nconst isHoveredAndInRange = (modifiers: ModifiersShape) =>\n modifiers.has(\"hovered\") && !modifiers.has(\"blocked-out-of-range\");\n\nconst shouldHaveLeftPill = (modifiers: ModifiersShape, day: moment.Moment) => {\n if (!isSelected(modifiers)) {\n return false;\n }\n\n if (\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-start\") ||\n modifiers.has(\"first-day-of-week\") ||\n day.isSame(moment(day).startOf(\"month\"), \"day\")\n ) {\n return true;\n }\n\n return false;\n};\n\nconst shouldHaveRightPill = (modifiers: ModifiersShape, day: moment.Moment) => {\n if (!isSelected(modifiers)) {\n return false;\n }\n\n if (\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-end\") ||\n modifiers.has(\"last-day-of-week\") ||\n day.isSame(moment(day).endOf(\"month\"), \"day\")\n ) {\n return true;\n }\n\n return false;\n};\n\nexport const CalendarDay = styled(Box)<{\n modifiers: ModifiersShape;\n day: moment.Moment;\n}>`\n ${({ modifiers, day, theme }) => {\n if (isSelected(modifiers)) {\n return css`\n background-color: ${theme.colors.container.background.selected};\n color: ${theme.colors.text.inverse};\n margin-left: ${shouldHaveLeftPill(modifiers, day) && theme.space[200]};\n margin-right: ${shouldHaveRightPill(modifiers, day) &&\n theme.space[200]};\n border-top-left-radius: ${shouldHaveLeftPill(modifiers, day) &&\n theme.radii.pill};\n border-bottom-left-radius: ${shouldHaveLeftPill(modifiers, day) &&\n theme.radii.pill};\n border-top-right-radius: ${shouldHaveRightPill(modifiers, day) &&\n theme.radii.pill};\n border-bottom-right-radius: ${shouldHaveRightPill(modifiers, day) &&\n theme.radii.pill};\n `;\n }\n\n if (isHoveredAndInRange(modifiers)) {\n return css`\n margin: 0 ${theme.space[200]};\n border-radius: ${theme.radii.pill};\n border: 1px solid ${theme.colors.container.border.selected};\n `;\n } else if (isOutOfRange(modifiers)) {\n return css`\n color: ${theme.colors.text.subtext};\n ${disabled};\n `;\n }\n }};\n`;\n\nexport const ReactDatesCssOverrides = createGlobalStyle`\n\t.DayPicker {\n\t\tbox-sizing: content-box;\n\t\tfont-weight: ${({ theme }) => theme.fontWeights.normal};\n\t\tfont-family: ${(props) => props.theme.fontFamily};\n\n\t\t/* override react-dates height to better reflect how tall the component actually is */\n\t\t/* adding margin/padding will be more truer to our seeds system because the height */\n\t\t/* of the calendar adds an extra row of padding if we do not override it */\n\t\t&_transitionContainer {\n\t\t\t/* need !important because react-dates sets height on the element itself */\n\t\t\theight: 228px !important;\n\t\t}\n\n\t\t&_weekHeader {\n\t\t\tcolor: ${({ theme }) => theme.colors.text.headline};\n\t\t\tborder-bottom: 1px solid ${({ theme }) => theme.colors.container.border.base};\n\n \t\t\t/* Magic number to match position of .CalendarMonth_caption */\n\t\t\ttop: 26px;\n\n\t\t\t/* Magic number to make the bottom border line stretch the full width */\n\t\t\twidth: 230px;\n\n\t\t\t&_ul {\n \t\t\t\t/* Magic number to line up day name headings over the correct numbers */\n\t\t\t\tpadding-left: 10px;\n\t\t\t}\n\t\t}\n\n\t\t&_weekHeaders__horizontal {\n\t\t\tmargin-left: 0\n\t\t}\n\n\t\t&_weekHeader_li {\n\t\t\t${({ theme }) => theme.typography[200]}\n\t\t\tcolor: ${({ theme }) => theme.colors.text.subtext};\n\t\t\tfont-weight: ${({ theme }) => theme.fontWeights.semibold};\n\t\t\tmargin: 0;\n\t\t}\n\n\t\t&__horizontal {\n\t\t\tbox-shadow: none;\n\t\t\tbackground: ${({ theme }) => theme.colors.container.background.base};\n\t\t}\n\t}\n\n .CalendarDay {\n\t\tbackground-color: transparent;\n\n &__selected, &__selected_span, &:hover {\n background-color: transparent;\n\t\t}\n\n\t\t&__default {\n\t\t\tcolor: ${({ theme }) => theme.colors.text.body};\n\t\t}\n\t\t&__default,\n\t\t&__default:hover {\n\t\t\tborder: none;\n\t\t\tcolor: ${({ theme }) => theme.colors.text.body};\n\t\t}\n\t}\n\n .CalendarMonth {\n\t\t${({ theme }) => theme.typography[200]}\n\t\tbackground: ${({ theme }) => theme.colors.container.background.base};\n\n \t\t/* spacing between visible months and months off canvas */\n\t\tpadding: 0 15px;\n\n\t\t&_caption {\n\t\t\t${({ theme }) => theme.typography[200]}\n\t\t\tcolor: ${({ theme }) => theme.colors.text.headline};\n\t\t\tpadding-top: 0;\n\t\t\tbackground: ${({ theme }) => theme.colors.container.background.base};\n\n\t\t\tstrong {\n\t\t\t\tfont-weight: ${({ theme }) => theme.fontWeights.semibold};\n\t\t\t}\n\n\t\t}\n\t\t&_table {\n\t\t\tline-height: 21.333px;\n\t\t\ttr {\n\t\t\t\tvertical-align: middle;\n\t\t\t}\n\t\t\ttd {\n\t\t\t\tpadding: 0;\n\t\t\t\tborder-bottom: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.CalendarMonthGrid {\n\t\tbackground: ${({ theme }) => theme.colors.container.background.base};\n\t}\n\n\t/* Left and Right Arrow Buttons to navigate months */\n\t.DayPickerNavigation_button__horizontal {\n\t\tcolor: ${({ theme }) => theme.colors.button.pill.text.base};\n\t\ttop: -4px;\n\t\tpadding: 7px 8px;\n\t\tposition: absolute;\n\t\tline-height: 0.78;\n\t\tborder-radius: 9999px;\n\t\tborder: none;\n\t\tbackground: ${({ theme }) => theme.colors.button.pill.background.base};\n\n\t\t&:nth-child(1) {\n\t\t\tleft: 22px;\n\t\t}\n\t\t&:nth-child(2) {\n\t\t\tright: 22px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tbackground: ${({ theme }) => theme.colors.button.pill.background.hover};\n\t\t}\n\t}\n`;\n","import \"react-dates/initialize\";\nimport \"react-dates/lib/css/_datepicker.css\";\nimport type { Moment } from \"moment\";\nimport React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport { CalendarDay } from \"./styles\";\nimport type { TypeCommonDatePickerProps } from \"./types\";\n\ntype TypeCalendarNavButtonType = \"left\" | \"right\";\n\nconst iconNames: { [key in TypeCalendarNavButtonType]: TypeIconName } = {\n left: \"arrow-left-solid\",\n right: \"arrow-right-solid\",\n};\n\nexport const CalendarNavButton = ({\n type,\n}: {\n type: TypeCalendarNavButtonType;\n}) => <Icon size=\"mini\" name={iconNames[type]} aria-hidden />;\n\nexport const commonDatePickerProps: TypeCommonDatePickerProps = {\n hideKeyboardShortcutsPanel: true,\n daySize: 30,\n navPrev: <CalendarNavButton type=\"left\" />,\n navNext: <CalendarNavButton type=\"right\" />,\n renderDayContents: (day, modifiers) => (\n <CalendarDay day={day} modifiers={modifiers}>\n {day.format(\"D\")}\n </CalendarDay>\n ),\n initialVisibleMonth: null,\n};\n// Testing utilities\n\nexport const formatDateAsCalendarHeader = (date: Moment): string =>\n date.format(\"MMMM YYYY\");\n\nexport const formatDateAsCalendarDay = (date: Moment): string =>\n date.format(\"dddd, MMMM D, YYYY\");\n\nexport const getVisibleMonthWithReactDatesInternalApi = (\n container: HTMLElement\n): string =>\n container.querySelector(\"[data-visible=true] strong\")?.textContent ?? \"\";\n\n// Receives a single Moment and returns an array of Moments, one for each currently visible month.\n// @ts-ignore unknown types\nexport const getVisibleMonths = (initialMonth, numberOfMonths) => {\n const months = [initialMonth];\n for (let i = 1; i < numberOfMonths; i++) {\n months.push(initialMonth.clone().add(i, \"month\"));\n }\n return months;\n};\n\n// Default setStatusText prop for both SingleDatePicker and DateRangePicker\n// @ts-ignore unknown types\nexport const DefaultSetStatusText = (dates) =>\n dates.map(formatDateAsCalendarHeader).join(\", \");\n","import React, { useState } from \"react\";\nimport type { TypeStatefulSingleDatePickerProps } from \"./SingleDatePickerTypes\";\nimport SingleDatePicker from \"./SingleDatePicker\";\n\nexport const StatefulSingleDatePicker = ({\n date,\n onDateChange,\n ...rest\n}: TypeStatefulSingleDatePickerProps) => {\n const [stateDate, setDate] = useState(date);\n\n // @ts-ignore unknown types\n const handleDateChange = (date) => {\n onDateChange && onDateChange(date);\n setDate(date);\n };\n\n return (\n <SingleDatePicker\n date={stateDate}\n onDateChange={handleDateChange}\n {...rest}\n />\n );\n};\n","import React, { useCallback, useState, type KeyboardEvent } from \"react\";\nimport moment from \"moment\";\nimport DayPickerRangeController from \"react-dates/lib/components/DayPickerRangeController\";\nimport { ReactDatesCssOverrides } from \"../styles\";\nimport {\n commonDatePickerProps,\n DefaultSetStatusText,\n getVisibleMonths,\n} from \"../common\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeDateRangePickerProps } from \"./DateRangePickerTypes\";\n\nconst DateRangePicker = ({\n startDate = null,\n endDate = null,\n onDatesChange,\n setStatusText = DefaultSetStatusText,\n initialVisibleMonth,\n numberOfMonths = 2,\n onFocusChange,\n onBlur,\n focusedInput,\n ...rest\n}: TypeDateRangePickerProps) => {\n const [statusText, updateStatusText] = useState(() =>\n setStatusText(\n getVisibleMonths(\n moment(initialVisibleMonth?.() ?? startDate ?? undefined),\n numberOfMonths\n )\n )\n );\n interface HandleMonthClick {\n (month: moment.Moment): void;\n }\n\n const handleMonthClick: HandleMonthClick = useCallback(\n (month) => {\n updateStatusText(setStatusText(getVisibleMonths(month, numberOfMonths)));\n },\n [numberOfMonths, setStatusText]\n );\n const wrappedOnBlur = useCallback<\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n (event: undefined | KeyboardEvent<HTMLDivElement>) => void\n >(\n (event) => {\n // for some reason onBlur is called with no event on day selection 🤷\n if (!event) {\n return;\n }\n onFocusChange?.(null);\n onBlur?.(event);\n },\n [onBlur, onFocusChange]\n );\n\n return (\n <>\n <ReactDatesCssOverrides />\n <VisuallyHidden>\n <div role=\"status\">{statusText}</div>\n </VisuallyHidden>\n <DayPickerRangeController\n {...commonDatePickerProps}\n startDate={startDate}\n endDate={endDate}\n onDatesChange={onDatesChange}\n numberOfMonths={numberOfMonths}\n initialVisibleMonth={initialVisibleMonth || null}\n focusedInput={focusedInput}\n isFocused={focusedInput !== null}\n onBlur={wrappedOnBlur}\n onFocusChange={onFocusChange}\n onPrevMonthClick={handleMonthClick}\n onNextMonthClick={handleMonthClick}\n {...rest}\n />\n </>\n );\n};\n\nexport default DateRangePicker;\n","import React, { useState } from \"react\";\n// @ts-ignore unknown types\nimport { START_DATE } from \"react-dates/constants\";\nimport type { TypeStatefulDateRangePickerProps } from \"./DateRangePickerTypes\";\nimport DateRangePicker from \"./DateRangePicker\";\n\nexport const StatefulDateRangePicker = ({\n startDate,\n endDate,\n onDatesChange,\n onFocusChange,\n ...rest\n}: TypeStatefulDateRangePickerProps) => {\n const [dates, setDate] = useState({\n startDate,\n endDate,\n });\n const [focusedInput, setFocusedInput] = React.useState(START_DATE);\n\n // @ts-ignore unknown types\n const handleDatesChange = (nextDates) => {\n onDatesChange && onDatesChange(nextDates);\n setDate(nextDates);\n };\n\n // @ts-ignore unknown types\n const handleFocusChange = (nextFocusedInput) => {\n onFocusChange && onFocusChange(nextFocusedInput);\n setFocusedInput(\n // null means that we've selected an end date. we want to go back to START_DATE\n // so the user can modify their selection. if focusedInput === null then it won't\n // respond to click or keyboard events\n nextFocusedInput === null ? START_DATE : nextFocusedInput\n );\n };\n\n return (\n <DateRangePicker\n startDate={dates.startDate}\n endDate={dates.endDate}\n focusedInput={focusedInput}\n onDatesChange={handleDatesChange}\n onFocusChange={handleFocusChange}\n {...rest}\n />\n );\n};\n"],"mappings":"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","names":["React","moment","jsx","moment","date","React","useState","jsx","useState","date","useCallback","useState","moment","VisuallyHidden","Fragment","jsx","jsxs","useState","moment","useCallback","React","useState","jsx","useState","React"]}
1
+ {"version":3,"sources":["../../src/SingleDatePicker/SingleDatePicker.tsx","../../src/common.tsx","../../src/CalendarDayTailwind.tsx","../../src/cn.ts","../../src/dayModifiers.ts","../../src/SingleDatePicker/StatefulSingleDatePicker.tsx","../../src/DateRangePicker/DateRangePicker.tsx","../../src/DateRangePicker/StatefulDateRangePicker.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport moment from \"moment\";\nimport DayPickerSingleDateController from \"react-dates/lib/components/DayPickerSingleDateController\";\nimport {\n commonDatePickerProps,\n DefaultSetStatusText,\n getVisibleMonths,\n} from \"../common\";\nimport type { TypeSingleDatePickerProps } from \"./SingleDatePickerTypes\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\n\nconst noop = () => {};\n\nconst SingleDatePicker = ({\n onDateChange,\n setStatusText = DefaultSetStatusText,\n date = null,\n focused = false,\n onFocusChange = noop,\n initialVisibleMonth,\n numberOfMonths = 1,\n onBlur,\n ...rest\n}: TypeSingleDatePickerProps) => {\n const [statusText, updateStatusText] = useState(() =>\n setStatusText(\n getVisibleMonths(\n moment(initialVisibleMonth?.() || date || undefined),\n numberOfMonths\n )\n )\n );\n\n const handleMonthClick = useCallback(\n // @ts-ignore unknown types\n (date) => {\n updateStatusText(setStatusText(getVisibleMonths(date, numberOfMonths)));\n },\n [numberOfMonths, setStatusText]\n );\n const wrappedOnBlur = useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n onFocusChange?.({ focused: false });\n onBlur?.(event);\n },\n [onBlur, onFocusChange]\n );\n\n /*\n * The react-dates overrides that ReactDatesCssOverrides used to inject at\n * runtime now ship statically in datepicker.css, aggregated into\n * @sproutsocial/racine/css/components. styles.ts keeps the styled source for\n * Phase A, but nothing imports it, so it is tree-shaken out of the bundle.\n */\n return (\n <>\n <VisuallyHidden>\n <div role=\"status\">{statusText}</div>\n </VisuallyHidden>\n <DayPickerSingleDateController\n {...commonDatePickerProps}\n date={date}\n numberOfMonths={numberOfMonths}\n onDateChange={onDateChange}\n initialVisibleMonth={initialVisibleMonth || null}\n focused={focused}\n onBlur={wrappedOnBlur}\n onFocusChange={onFocusChange}\n onPrevMonthClick={handleMonthClick}\n onNextMonthClick={handleMonthClick}\n {...rest}\n />\n </>\n );\n};\n\nexport default React.memo<TypeSingleDatePickerProps>(SingleDatePicker);\n","import \"react-dates/initialize\";\nimport \"react-dates/lib/css/_datepicker.css\";\nimport type { Moment } from \"moment\";\nimport React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport CalendarDay from \"./CalendarDayTailwind\";\nimport type { TypeCommonDatePickerProps } from \"./types\";\n\ntype TypeCalendarNavButtonType = \"left\" | \"right\";\n\nconst iconNames: { [key in TypeCalendarNavButtonType]: TypeIconName } = {\n left: \"arrow-left-solid\",\n right: \"arrow-right-solid\",\n};\n\nexport const CalendarNavButton = ({\n type,\n}: {\n type: TypeCalendarNavButtonType;\n}) => <Icon size=\"mini\" name={iconNames[type]} aria-hidden />;\n\nexport const commonDatePickerProps: TypeCommonDatePickerProps = {\n hideKeyboardShortcutsPanel: true,\n daySize: 30,\n navPrev: <CalendarNavButton type=\"left\" />,\n navNext: <CalendarNavButton type=\"right\" />,\n renderDayContents: (day, modifiers) => (\n <CalendarDay day={day} modifiers={modifiers}>\n {day.format(\"D\")}\n </CalendarDay>\n ),\n initialVisibleMonth: null,\n};\n// Testing utilities\n\nexport const formatDateAsCalendarHeader = (date: Moment): string =>\n date.format(\"MMMM YYYY\");\n\nexport const formatDateAsCalendarDay = (date: Moment): string =>\n date.format(\"dddd, MMMM D, YYYY\");\n\nexport const getVisibleMonthWithReactDatesInternalApi = (\n container: HTMLElement\n): string =>\n container.querySelector(\"[data-visible=true] strong\")?.textContent ?? \"\";\n\n// Receives a single Moment and returns an array of Moments, one for each currently visible month.\n// @ts-ignore unknown types\nexport const getVisibleMonths = (initialMonth, numberOfMonths) => {\n const months = [initialMonth];\n for (let i = 1; i < numberOfMonths; i++) {\n months.push(initialMonth.clone().add(i, \"month\"));\n }\n return months;\n};\n\n// Default setStatusText prop for both SingleDatePicker and DateRangePicker\n// @ts-ignore unknown types\nexport const DefaultSetStatusText = (dates) =>\n dates.map(formatDateAsCalendarHeader).join(\", \");\n","import * as React from \"react\";\nimport type moment from \"moment\";\nimport type { ModifiersShape } from \"react-dates\";\nimport { cn } from \"./cn\";\nimport {\n isHoveredAndInRange,\n isOutOfRange,\n isSelected,\n shouldHaveLeftPill,\n shouldHaveRightPill,\n} from \"./dayModifiers\";\n\nexport interface TypeCalendarDayProps {\n modifiers: ModifiersShape;\n day: moment.Moment;\n children?: React.ReactNode;\n className?: string;\n}\n\n/**\n * Static day cell. Renders the semantic `seeds-datepicker-day*` classes from\n * datepicker.css with no runtime CSS-in-JS.\n *\n * The legacy cell was `styled(Box)`, and Box ships no CSS of its own, so\n * `.seeds-datepicker-day` reproduces Box's baseline (box-sizing + font-family)\n * and this component reproduces Box's forwardRef.\n *\n * The visual states are mutually exclusive, exactly as in the styled version's\n * if / else-if chain: a selected day never also picks up the hovered or\n * out-of-range treatment. Pill edges are modifier classes rather than values,\n * so an absent edge emits no declaration at all.\n */\nconst dayStateClasses = (\n modifiers: ModifiersShape,\n day: moment.Moment\n): Record<string, boolean> => {\n if (isSelected(modifiers)) {\n return {\n \"seeds-datepicker-day-selected\": true,\n \"seeds-datepicker-day-pill-left\": shouldHaveLeftPill(modifiers, day),\n \"seeds-datepicker-day-pill-right\": shouldHaveRightPill(modifiers, day),\n };\n }\n\n if (isHoveredAndInRange(modifiers)) {\n return { \"seeds-datepicker-day-hovered\": true };\n }\n\n if (isOutOfRange(modifiers)) {\n return { \"seeds-datepicker-day-out-of-range\": true };\n }\n\n return {};\n};\n\nconst CalendarDayTailwind = React.forwardRef<\n HTMLDivElement,\n TypeCalendarDayProps\n>(({ modifiers, day, className, children }, ref) => (\n <div\n ref={ref}\n // Semantic classes come before the consumer className so consumer utilities\n // can override the layered base styles.\n className={cn(\n \"seeds-datepicker-day\",\n dayStateClasses(modifiers, day),\n className\n )}\n >\n {children}\n </div>\n));\n\nCalendarDayTailwind.displayName = \"CalendarDay\";\n\nexport default CalendarDayTailwind;\n","/**\n * Minimal className combiner, mirroring the local copies in seeds-react-list,\n * seeds-react-profile and seeds-react-tree —\n * @sproutsocial/seeds-react-utilities does NOT export a `cn` helper.\n *\n * Falsy inputs are dropped; object inputs contribute each truthy key.\n */\nexport function cn(\n ...inputs: (string | undefined | null | false | Record<string, boolean>)[]\n): string {\n const classes: string[] = [];\n\n for (const input of inputs) {\n if (!input) continue;\n\n if (typeof input === \"string\") {\n classes.push(input);\n } else if (typeof input === \"object\") {\n for (const [key, value] of Object.entries(input)) {\n if (value) {\n classes.push(key);\n }\n }\n }\n }\n\n return classes.join(\" \");\n}\n","import moment from \"moment\";\nimport type { ModifiersShape } from \"react-dates\";\n\n/*\n * Partial list of modifiers given to renderDayContents by airbnb/react-dates. There may be more.\n *\n * today, blocked, blocked-calendar, blocked-out-of-range, highlighted-calendar, valid,\n * selected, selected-start, selected-end, blocked-minimum-nights, selected-span, last-in-range,\n * hovered, hovered-span, hovered-offset, after-hovered-start, first-day-of-week, last-day-of-week,\n * hovered-start-first-possible-end, hovered-start-blocked-minimum-nights, before-hovered-end,\n * no-selected-start-before-selected-end, selected-start-in-hovered-span, selected-start-no-selected-end,\n * selected-end-no-selected-start\n *\n * These predicates are the single source of truth for which visual state a day\n * cell is in. Both the static day cell (CalendarDayTailwind) and the preserved\n * styled one (styles.ts) read them, so the two paths cannot drift apart.\n */\n\nexport const isSelected = (modifiers: ModifiersShape) =>\n modifiers.has(\"selected-span\") ||\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-start\") ||\n modifiers.has(\"selected-end\") ||\n modifiers.has(\"hovered-span\") ||\n modifiers.has(\"after-hovered-start\");\n\nexport const isOutOfRange = (modifiers: ModifiersShape) =>\n modifiers.has(\"blocked-out-of-range\");\n\nexport const isHoveredAndInRange = (modifiers: ModifiersShape) =>\n modifiers.has(\"hovered\") && !modifiers.has(\"blocked-out-of-range\");\n\nexport const shouldHaveLeftPill = (\n modifiers: ModifiersShape,\n day: moment.Moment\n) => {\n if (!isSelected(modifiers)) {\n return false;\n }\n\n if (\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-start\") ||\n modifiers.has(\"first-day-of-week\") ||\n day.isSame(moment(day).startOf(\"month\"), \"day\")\n ) {\n return true;\n }\n\n return false;\n};\n\nexport const shouldHaveRightPill = (\n modifiers: ModifiersShape,\n day: moment.Moment\n) => {\n if (!isSelected(modifiers)) {\n return false;\n }\n\n if (\n modifiers.has(\"selected\") ||\n modifiers.has(\"selected-end\") ||\n modifiers.has(\"last-day-of-week\") ||\n day.isSame(moment(day).endOf(\"month\"), \"day\")\n ) {\n return true;\n }\n\n return false;\n};\n","import React, { useState } from \"react\";\nimport type { TypeStatefulSingleDatePickerProps } from \"./SingleDatePickerTypes\";\nimport SingleDatePicker from \"./SingleDatePicker\";\n\nexport const StatefulSingleDatePicker = ({\n date,\n onDateChange,\n ...rest\n}: TypeStatefulSingleDatePickerProps) => {\n const [stateDate, setDate] = useState(date);\n\n // @ts-ignore unknown types\n const handleDateChange = (date) => {\n onDateChange && onDateChange(date);\n setDate(date);\n };\n\n return (\n <SingleDatePicker\n date={stateDate}\n onDateChange={handleDateChange}\n {...rest}\n />\n );\n};\n","import React, { useCallback, useState, type KeyboardEvent } from \"react\";\nimport moment from \"moment\";\nimport DayPickerRangeController from \"react-dates/lib/components/DayPickerRangeController\";\nimport {\n commonDatePickerProps,\n DefaultSetStatusText,\n getVisibleMonths,\n} from \"../common\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeDateRangePickerProps } from \"./DateRangePickerTypes\";\n\nconst DateRangePicker = ({\n startDate = null,\n endDate = null,\n onDatesChange,\n setStatusText = DefaultSetStatusText,\n initialVisibleMonth,\n numberOfMonths = 2,\n onFocusChange,\n onBlur,\n focusedInput,\n ...rest\n}: TypeDateRangePickerProps) => {\n const [statusText, updateStatusText] = useState(() =>\n setStatusText(\n getVisibleMonths(\n moment(initialVisibleMonth?.() ?? startDate ?? undefined),\n numberOfMonths\n )\n )\n );\n interface HandleMonthClick {\n (month: moment.Moment): void;\n }\n\n const handleMonthClick: HandleMonthClick = useCallback(\n (month) => {\n updateStatusText(setStatusText(getVisibleMonths(month, numberOfMonths)));\n },\n [numberOfMonths, setStatusText]\n );\n const wrappedOnBlur = useCallback<\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n (event: undefined | KeyboardEvent<HTMLDivElement>) => void\n >(\n (event) => {\n // for some reason onBlur is called with no event on day selection 🤷\n if (!event) {\n return;\n }\n onFocusChange?.(null);\n onBlur?.(event);\n },\n [onBlur, onFocusChange]\n );\n\n /*\n * The react-dates overrides that ReactDatesCssOverrides used to inject at\n * runtime now ship statically in datepicker.css, aggregated into\n * @sproutsocial/racine/css/components. styles.ts keeps the styled source for\n * Phase A, but nothing imports it, so it is tree-shaken out of the bundle.\n */\n return (\n <>\n <VisuallyHidden>\n <div role=\"status\">{statusText}</div>\n </VisuallyHidden>\n <DayPickerRangeController\n {...commonDatePickerProps}\n startDate={startDate}\n endDate={endDate}\n onDatesChange={onDatesChange}\n numberOfMonths={numberOfMonths}\n initialVisibleMonth={initialVisibleMonth || null}\n focusedInput={focusedInput}\n isFocused={focusedInput !== null}\n onBlur={wrappedOnBlur}\n onFocusChange={onFocusChange}\n onPrevMonthClick={handleMonthClick}\n onNextMonthClick={handleMonthClick}\n {...rest}\n />\n </>\n );\n};\n\nexport default DateRangePicker;\n","import React, { useState } from \"react\";\n// @ts-ignore unknown types\nimport { START_DATE } from \"react-dates/constants\";\nimport type { TypeStatefulDateRangePickerProps } from \"./DateRangePickerTypes\";\nimport DateRangePicker from \"./DateRangePicker\";\n\nexport const StatefulDateRangePicker = ({\n startDate,\n endDate,\n onDatesChange,\n onFocusChange,\n ...rest\n}: TypeStatefulDateRangePickerProps) => {\n const [dates, setDate] = useState({\n startDate,\n endDate,\n });\n const [focusedInput, setFocusedInput] = React.useState(START_DATE);\n\n // @ts-ignore unknown types\n const handleDatesChange = (nextDates) => {\n onDatesChange && onDatesChange(nextDates);\n setDate(nextDates);\n };\n\n // @ts-ignore unknown types\n const handleFocusChange = (nextFocusedInput) => {\n onFocusChange && onFocusChange(nextFocusedInput);\n setFocusedInput(\n // null means that we've selected an end date. we want to go back to START_DATE\n // so the user can modify their selection. if focusedInput === null then it won't\n // respond to click or keyboard events\n nextFocusedInput === null ? START_DATE : nextFocusedInput\n );\n };\n\n return (\n <DateRangePicker\n startDate={dates.startDate}\n endDate={dates.endDate}\n focusedInput={focusedInput}\n onDatesChange={handleDatesChange}\n onFocusChange={handleFocusChange}\n {...rest}\n />\n );\n};\n"],"mappings":"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","names":["React","moment","jsx","jsx","moment","date","React","useState","jsx","useState","date","useCallback","useState","moment","VisuallyHidden","Fragment","jsx","jsxs","useState","moment","useCallback","React","useState","jsx","useState","React"]}