@salt-ds/lab 1.0.0-alpha.51 → 1.0.0-alpha.52

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 (276) hide show
  1. package/css/salt-lab.css +256 -268
  2. package/dist-cjs/calendar/Calendar.css.js +1 -1
  3. package/dist-cjs/calendar/Calendar.js +6 -17
  4. package/dist-cjs/calendar/Calendar.js.map +1 -1
  5. package/dist-cjs/calendar/CalendarNavigation.css.js +6 -0
  6. package/dist-cjs/calendar/{internal/CalendarNavigation.js → CalendarNavigation.js} +160 -66
  7. package/dist-cjs/calendar/CalendarNavigation.js.map +1 -0
  8. package/dist-cjs/calendar/formatDate.js +56 -0
  9. package/dist-cjs/calendar/formatDate.js.map +1 -0
  10. package/dist-cjs/calendar/internal/CalendarCarousel.js +3 -3
  11. package/dist-cjs/calendar/internal/CalendarCarousel.js.map +1 -1
  12. package/dist-cjs/calendar/internal/CalendarDay.js +45 -33
  13. package/dist-cjs/calendar/internal/CalendarDay.js.map +1 -1
  14. package/dist-cjs/calendar/internal/CalendarMonth.js +3 -2
  15. package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
  16. package/dist-cjs/calendar/internal/CalendarWeekHeader.js +3 -3
  17. package/dist-cjs/calendar/internal/CalendarWeekHeader.js.map +1 -1
  18. package/dist-cjs/calendar/internal/useFocusManagement.js +7 -4
  19. package/dist-cjs/calendar/internal/useFocusManagement.js.map +1 -1
  20. package/dist-cjs/calendar/internal/utils.js +28 -23
  21. package/dist-cjs/calendar/internal/utils.js.map +1 -1
  22. package/dist-cjs/calendar/useCalendar.js +94 -45
  23. package/dist-cjs/calendar/useCalendar.js.map +1 -1
  24. package/dist-cjs/calendar/useCalendarDay.js +19 -10
  25. package/dist-cjs/calendar/useCalendarDay.js.map +1 -1
  26. package/dist-cjs/calendar/useCalendarSelection.js +360 -0
  27. package/dist-cjs/calendar/useCalendarSelection.js.map +1 -0
  28. package/dist-cjs/cascading-menu/internal/useMouseHandlers.js.map +1 -1
  29. package/dist-cjs/color-chooser/ColorChooser.js.map +1 -1
  30. package/dist-cjs/combo-box-deprecated/ComboBox.css.js +1 -1
  31. package/dist-cjs/common-hooks/useCollectionItems.js.map +1 -1
  32. package/dist-cjs/content-status/ContentStatus.css.js +1 -1
  33. package/dist-cjs/date-input/DateInput.css.js +1 -1
  34. package/dist-cjs/date-input/DateInputRange.js +355 -0
  35. package/dist-cjs/date-input/DateInputRange.js.map +1 -0
  36. package/dist-cjs/date-input/DateInputSingle.js +229 -0
  37. package/dist-cjs/date-input/DateInputSingle.js.map +1 -0
  38. package/dist-cjs/date-input/utils.js +65 -0
  39. package/dist-cjs/date-input/utils.js.map +1 -0
  40. package/dist-cjs/date-picker/DatePicker.js +40 -150
  41. package/dist-cjs/date-picker/DatePicker.js.map +1 -1
  42. package/dist-cjs/date-picker/DatePickerActions.css.js +6 -0
  43. package/dist-cjs/date-picker/DatePickerActions.css.js.map +1 -0
  44. package/dist-cjs/date-picker/DatePickerActions.js +102 -0
  45. package/dist-cjs/date-picker/DatePickerActions.js.map +1 -0
  46. package/dist-cjs/date-picker/DatePickerContext.js +23 -17
  47. package/dist-cjs/date-picker/DatePickerContext.js.map +1 -1
  48. package/dist-cjs/date-picker/DatePickerOverlay.css.js +6 -0
  49. package/dist-cjs/date-picker/DatePickerOverlay.css.js.map +1 -0
  50. package/dist-cjs/date-picker/DatePickerOverlay.js +50 -0
  51. package/dist-cjs/date-picker/DatePickerOverlay.js.map +1 -0
  52. package/dist-cjs/date-picker/DatePickerOverlayProvider.js +105 -0
  53. package/dist-cjs/date-picker/DatePickerOverlayProvider.js.map +1 -0
  54. package/dist-cjs/date-picker/DatePickerPanel.css.js +1 -1
  55. package/dist-cjs/date-picker/DatePickerRangeInput.js +118 -0
  56. package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -0
  57. package/dist-cjs/date-picker/DatePickerRangePanel.js +206 -0
  58. package/dist-cjs/date-picker/DatePickerRangePanel.js.map +1 -0
  59. package/dist-cjs/date-picker/DatePickerSingleInput.js +97 -0
  60. package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -0
  61. package/dist-cjs/date-picker/DatePickerSinglePanel.js +138 -0
  62. package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +1 -0
  63. package/dist-cjs/date-picker/useDatePicker.js +179 -0
  64. package/dist-cjs/date-picker/useDatePicker.js.map +1 -0
  65. package/dist-cjs/dropdown/useDropdown.js.map +1 -1
  66. package/dist-cjs/form-field-legacy/FormLabel.js.map +1 -1
  67. package/dist-cjs/index.js +43 -10
  68. package/dist-cjs/index.js.map +1 -1
  69. package/dist-cjs/list/List.js.map +1 -1
  70. package/dist-cjs/menu-button/MenuButtonTrigger.css.js +1 -1
  71. package/dist-cjs/query-input/QueryInput.css.js +1 -1
  72. package/dist-cjs/slider/Slider.css.js +1 -1
  73. package/dist-cjs/slider/Slider.js +53 -105
  74. package/dist-cjs/slider/Slider.js.map +1 -1
  75. package/dist-cjs/slider/internal/SliderContext.js +21 -0
  76. package/dist-cjs/slider/internal/SliderContext.js.map +1 -0
  77. package/dist-cjs/slider/internal/SliderMarks.js +31 -0
  78. package/dist-cjs/slider/internal/SliderMarks.js.map +1 -0
  79. package/dist-cjs/slider/internal/SliderSelection.js +17 -10
  80. package/dist-cjs/slider/internal/SliderSelection.js.map +1 -1
  81. package/dist-cjs/slider/internal/SliderThumb.js +77 -0
  82. package/dist-cjs/slider/internal/SliderThumb.js.map +1 -0
  83. package/dist-cjs/slider/internal/SliderTrack.js +91 -0
  84. package/dist-cjs/slider/internal/SliderTrack.js.map +1 -0
  85. package/dist-cjs/slider/internal/useKeyDownThumb.js +53 -0
  86. package/dist-cjs/slider/internal/useKeyDownThumb.js.map +1 -0
  87. package/dist-cjs/slider/internal/utils.js +78 -116
  88. package/dist-cjs/slider/internal/utils.js.map +1 -1
  89. package/dist-cjs/tabs/TabActivationIndicator.css.js +1 -1
  90. package/dist-cjs/tabs/useTabs.js.map +1 -1
  91. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  92. package/dist-es/calendar/Calendar.css.js +1 -1
  93. package/dist-es/calendar/Calendar.js +7 -18
  94. package/dist-es/calendar/Calendar.js.map +1 -1
  95. package/dist-es/calendar/CalendarNavigation.css.js +4 -0
  96. package/dist-es/calendar/CalendarNavigation.js +308 -0
  97. package/dist-es/calendar/CalendarNavigation.js.map +1 -0
  98. package/dist-es/calendar/formatDate.js +51 -0
  99. package/dist-es/calendar/formatDate.js.map +1 -0
  100. package/dist-es/calendar/internal/CalendarCarousel.js +3 -3
  101. package/dist-es/calendar/internal/CalendarCarousel.js.map +1 -1
  102. package/dist-es/calendar/internal/CalendarDay.js +45 -33
  103. package/dist-es/calendar/internal/CalendarDay.js.map +1 -1
  104. package/dist-es/calendar/internal/CalendarMonth.js +3 -2
  105. package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
  106. package/dist-es/calendar/internal/CalendarWeekHeader.js +3 -3
  107. package/dist-es/calendar/internal/CalendarWeekHeader.js.map +1 -1
  108. package/dist-es/calendar/internal/useFocusManagement.js +7 -4
  109. package/dist-es/calendar/internal/useFocusManagement.js.map +1 -1
  110. package/dist-es/calendar/internal/utils.js +29 -23
  111. package/dist-es/calendar/internal/utils.js.map +1 -1
  112. package/dist-es/calendar/useCalendar.js +96 -47
  113. package/dist-es/calendar/useCalendar.js.map +1 -1
  114. package/dist-es/calendar/useCalendarDay.js +20 -11
  115. package/dist-es/calendar/useCalendarDay.js.map +1 -1
  116. package/dist-es/calendar/useCalendarSelection.js +350 -0
  117. package/dist-es/calendar/useCalendarSelection.js.map +1 -0
  118. package/dist-es/cascading-menu/internal/useMouseHandlers.js.map +1 -1
  119. package/dist-es/color-chooser/ColorChooser.js.map +1 -1
  120. package/dist-es/combo-box-deprecated/ComboBox.css.js +1 -1
  121. package/dist-es/common-hooks/useCollectionItems.js.map +1 -1
  122. package/dist-es/content-status/ContentStatus.css.js +1 -1
  123. package/dist-es/date-input/DateInput.css.js +1 -1
  124. package/dist-es/date-input/DateInputRange.js +351 -0
  125. package/dist-es/date-input/DateInputRange.js.map +1 -0
  126. package/dist-es/date-input/DateInputSingle.js +225 -0
  127. package/dist-es/date-input/DateInputSingle.js.map +1 -0
  128. package/dist-es/date-input/utils.js +57 -0
  129. package/dist-es/date-input/utils.js.map +1 -0
  130. package/dist-es/date-picker/DatePicker.js +43 -154
  131. package/dist-es/date-picker/DatePicker.js.map +1 -1
  132. package/dist-es/date-picker/DatePickerActions.css.js +4 -0
  133. package/dist-es/date-picker/DatePickerActions.css.js.map +1 -0
  134. package/dist-es/date-picker/DatePickerActions.js +98 -0
  135. package/dist-es/date-picker/DatePickerActions.js.map +1 -0
  136. package/dist-es/date-picker/DatePickerContext.js +22 -17
  137. package/dist-es/date-picker/DatePickerContext.js.map +1 -1
  138. package/dist-es/date-picker/DatePickerOverlay.css.js +4 -0
  139. package/dist-es/date-picker/DatePickerOverlay.css.js.map +1 -0
  140. package/dist-es/date-picker/DatePickerOverlay.js +46 -0
  141. package/dist-es/date-picker/DatePickerOverlay.js.map +1 -0
  142. package/dist-es/date-picker/DatePickerOverlayProvider.js +100 -0
  143. package/dist-es/date-picker/DatePickerOverlayProvider.js.map +1 -0
  144. package/dist-es/date-picker/DatePickerPanel.css.js +1 -1
  145. package/dist-es/date-picker/DatePickerRangeInput.js +114 -0
  146. package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -0
  147. package/dist-es/date-picker/DatePickerRangePanel.js +198 -0
  148. package/dist-es/date-picker/DatePickerRangePanel.js.map +1 -0
  149. package/dist-es/date-picker/DatePickerSingleInput.js +93 -0
  150. package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -0
  151. package/dist-es/date-picker/DatePickerSinglePanel.js +130 -0
  152. package/dist-es/date-picker/DatePickerSinglePanel.js.map +1 -0
  153. package/dist-es/date-picker/useDatePicker.js +175 -0
  154. package/dist-es/date-picker/useDatePicker.js.map +1 -0
  155. package/dist-es/dropdown/useDropdown.js.map +1 -1
  156. package/dist-es/form-field-legacy/FormLabel.js.map +1 -1
  157. package/dist-es/index.js +14 -3
  158. package/dist-es/index.js.map +1 -1
  159. package/dist-es/list/List.js.map +1 -1
  160. package/dist-es/menu-button/MenuButtonTrigger.css.js +1 -1
  161. package/dist-es/query-input/QueryInput.css.js +1 -1
  162. package/dist-es/slider/Slider.css.js +1 -1
  163. package/dist-es/slider/Slider.js +55 -107
  164. package/dist-es/slider/Slider.js.map +1 -1
  165. package/dist-es/slider/internal/SliderContext.js +16 -0
  166. package/dist-es/slider/internal/SliderContext.js.map +1 -0
  167. package/dist-es/slider/internal/SliderMarks.js +27 -0
  168. package/dist-es/slider/internal/SliderMarks.js.map +1 -0
  169. package/dist-es/slider/internal/SliderSelection.js +17 -10
  170. package/dist-es/slider/internal/SliderSelection.js.map +1 -1
  171. package/dist-es/slider/internal/SliderThumb.js +73 -0
  172. package/dist-es/slider/internal/SliderThumb.js.map +1 -0
  173. package/dist-es/slider/internal/SliderTrack.js +87 -0
  174. package/dist-es/slider/internal/SliderTrack.js.map +1 -0
  175. package/dist-es/slider/internal/useKeyDownThumb.js +49 -0
  176. package/dist-es/slider/internal/useKeyDownThumb.js.map +1 -0
  177. package/dist-es/slider/internal/utils.js +70 -111
  178. package/dist-es/slider/internal/utils.js.map +1 -1
  179. package/dist-es/tabs/TabActivationIndicator.css.js +1 -1
  180. package/dist-es/tabs/useTabs.js.map +1 -1
  181. package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  182. package/dist-types/calendar/Calendar.d.ts +63 -6
  183. package/dist-types/calendar/CalendarNavigation.d.ts +57 -0
  184. package/dist-types/calendar/formatDate.d.ts +14 -0
  185. package/dist-types/calendar/index.d.ts +3 -1
  186. package/dist-types/calendar/internal/CalendarDay.d.ts +2 -1
  187. package/dist-types/calendar/internal/CalendarWeekHeader.d.ts +4 -4
  188. package/dist-types/calendar/internal/useFocusManagement.d.ts +2 -1
  189. package/dist-types/calendar/internal/utils.d.ts +7 -8
  190. package/dist-types/calendar/useCalendar.d.ts +100 -16
  191. package/dist-types/calendar/useCalendarDay.d.ts +38 -0
  192. package/dist-types/calendar/useCalendarSelection.d.ts +189 -0
  193. package/dist-types/date-input/DateInputRange.d.ts +150 -0
  194. package/dist-types/date-input/DateInputSingle.d.ts +117 -0
  195. package/dist-types/date-input/index.d.ts +3 -1
  196. package/dist-types/date-input/utils.d.ts +43 -0
  197. package/dist-types/date-picker/DatePicker.d.ts +20 -62
  198. package/dist-types/date-picker/DatePickerActions.d.ts +80 -0
  199. package/dist-types/date-picker/DatePickerContext.d.ts +180 -17
  200. package/dist-types/date-picker/DatePickerOverlay.d.ts +11 -0
  201. package/dist-types/date-picker/DatePickerOverlayProvider.d.ts +67 -0
  202. package/dist-types/date-picker/DatePickerRangeInput.d.ts +7 -0
  203. package/dist-types/date-picker/DatePickerRangePanel.d.ts +64 -0
  204. package/dist-types/date-picker/DatePickerSingleInput.d.ts +7 -0
  205. package/dist-types/date-picker/DatePickerSinglePanel.d.ts +42 -0
  206. package/dist-types/date-picker/index.d.ts +7 -0
  207. package/dist-types/date-picker/useDatePicker.d.ts +112 -0
  208. package/dist-types/slider/Slider.d.ts +23 -10
  209. package/dist-types/slider/internal/SliderContext.d.ts +11 -0
  210. package/dist-types/slider/internal/SliderMarks.d.ts +7 -0
  211. package/dist-types/slider/internal/SliderSelection.d.ts +3 -3
  212. package/dist-types/slider/internal/SliderThumb.d.ts +8 -0
  213. package/dist-types/slider/internal/SliderTrack.d.ts +4 -0
  214. package/dist-types/slider/internal/index.d.ts +3 -0
  215. package/dist-types/slider/internal/useKeyDownThumb.d.ts +2 -0
  216. package/dist-types/slider/internal/utils.d.ts +18 -10
  217. package/dist-types/slider/types.d.ts +3 -1
  218. package/package.json +3 -3
  219. package/dist-cjs/calendar/internal/CalendarNavigation.css.js +0 -6
  220. package/dist-cjs/calendar/internal/CalendarNavigation.js.map +0 -1
  221. package/dist-cjs/calendar/useSelection.js +0 -249
  222. package/dist-cjs/calendar/useSelection.js.map +0 -1
  223. package/dist-cjs/date-input/DateInput.js +0 -283
  224. package/dist-cjs/date-input/DateInput.js.map +0 -1
  225. package/dist-cjs/date-picker/DatePickerPanel.js +0 -155
  226. package/dist-cjs/date-picker/DatePickerPanel.js.map +0 -1
  227. package/dist-cjs/slider/internal/SliderHandle.js +0 -44
  228. package/dist-cjs/slider/internal/SliderHandle.js.map +0 -1
  229. package/dist-cjs/slider/internal/SliderMarkLabels.js +0 -45
  230. package/dist-cjs/slider/internal/SliderMarkLabels.js.map +0 -1
  231. package/dist-cjs/slider/internal/SliderRail.js +0 -25
  232. package/dist-cjs/slider/internal/SliderRail.js.map +0 -1
  233. package/dist-cjs/slider/internal/SliderRailMarks.js +0 -48
  234. package/dist-cjs/slider/internal/SliderRailMarks.js.map +0 -1
  235. package/dist-cjs/slider/internal/styles.js +0 -99
  236. package/dist-cjs/slider/internal/styles.js.map +0 -1
  237. package/dist-cjs/slider/internal/useSliderKeyDown.js +0 -50
  238. package/dist-cjs/slider/internal/useSliderKeyDown.js.map +0 -1
  239. package/dist-cjs/slider/internal/useSliderMouseDown.js +0 -96
  240. package/dist-cjs/slider/internal/useSliderMouseDown.js.map +0 -1
  241. package/dist-es/calendar/internal/CalendarNavigation.css.js +0 -4
  242. package/dist-es/calendar/internal/CalendarNavigation.js +0 -214
  243. package/dist-es/calendar/internal/CalendarNavigation.js.map +0 -1
  244. package/dist-es/calendar/useSelection.js +0 -242
  245. package/dist-es/calendar/useSelection.js.map +0 -1
  246. package/dist-es/date-input/DateInput.js +0 -279
  247. package/dist-es/date-input/DateInput.js.map +0 -1
  248. package/dist-es/date-picker/DatePickerPanel.js +0 -151
  249. package/dist-es/date-picker/DatePickerPanel.js.map +0 -1
  250. package/dist-es/slider/internal/SliderHandle.js +0 -40
  251. package/dist-es/slider/internal/SliderHandle.js.map +0 -1
  252. package/dist-es/slider/internal/SliderMarkLabels.js +0 -41
  253. package/dist-es/slider/internal/SliderMarkLabels.js.map +0 -1
  254. package/dist-es/slider/internal/SliderRail.js +0 -21
  255. package/dist-es/slider/internal/SliderRail.js.map +0 -1
  256. package/dist-es/slider/internal/SliderRailMarks.js +0 -44
  257. package/dist-es/slider/internal/SliderRailMarks.js.map +0 -1
  258. package/dist-es/slider/internal/styles.js +0 -91
  259. package/dist-es/slider/internal/styles.js.map +0 -1
  260. package/dist-es/slider/internal/useSliderKeyDown.js +0 -46
  261. package/dist-es/slider/internal/useSliderKeyDown.js.map +0 -1
  262. package/dist-es/slider/internal/useSliderMouseDown.js +0 -92
  263. package/dist-es/slider/internal/useSliderMouseDown.js.map +0 -1
  264. package/dist-types/calendar/internal/CalendarNavigation.d.ts +0 -16
  265. package/dist-types/calendar/useSelection.d.ts +0 -78
  266. package/dist-types/date-input/DateInput.d.ts +0 -60
  267. package/dist-types/date-picker/DatePickerPanel.d.ts +0 -10
  268. package/dist-types/slider/internal/SliderHandle.d.ts +0 -11
  269. package/dist-types/slider/internal/SliderMarkLabels.d.ts +0 -7
  270. package/dist-types/slider/internal/SliderRail.d.ts +0 -1
  271. package/dist-types/slider/internal/SliderRailMarks.d.ts +0 -12
  272. package/dist-types/slider/internal/styles.d.ts +0 -10
  273. package/dist-types/slider/internal/useSliderKeyDown.d.ts +0 -4
  274. package/dist-types/slider/internal/useSliderMouseDown.d.ts +0 -4
  275. /package/dist-cjs/calendar/{internal/CalendarNavigation.css.js.map → CalendarNavigation.css.js.map} +0 -0
  276. /package/dist-es/calendar/{internal/CalendarNavigation.css.js.map → CalendarNavigation.css.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type SyntheticEvent,\n forwardRef,\n useRef,\n useState,\n} from \"react\";\n\nimport { flip, offset, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n type DateValue,\n getLocalTimeZone,\n today,\n} from \"@internationalized/date\";\nimport {\n Button,\n makePrefixer,\n useControlled,\n useFloatingUI,\n useForkRef,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport {\n type CalendarProps,\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { DateInput, type DateInputProps } from \"../date-input\";\nimport { DatePickerContext } from \"./DatePickerContext\";\nimport { DatePickerPanel } from \"./DatePickerPanel\";\n\nconst withBaseName = makePrefixer(\"saltDatePicker\");\n\nexport interface DatePickerProps<SelectionVariantType>\n extends DateInputProps<SelectionVariantType> {\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * If `true`, the component will be disabled.\n */\n disabled?: boolean;\n /**\n * The selected date value. Use when the component is controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n selectedDate?: SelectionVariantType;\n /**\n * The default date value. Use when the component is not controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n defaultSelectedDate?: SelectionVariantType;\n /**\n * Props to be passed to the Calendar component.\n */\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * The default open value. Use when the component is not controlled.\n */\n defaultOpen?: boolean;\n /**\n * Helper text to display in the panel\n */\n helperText?: string;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n /**\n * Number of Calendars to be shown if selectionVariant is range.\n * 2 is the default value.\n */\n visibleMonths?: 1 | 2;\n}\n\nexport const DatePicker = forwardRef<\n HTMLDivElement,\n DatePickerProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DatePicker(\n {\n selectionVariant = \"default\",\n disabled = false,\n placeholder = \"dd mmm yyyy\",\n selectedDate: selectedDateProp,\n defaultSelectedDate,\n dateFormatter,\n CalendarProps,\n className,\n open: openProp,\n defaultOpen,\n onOpenChange: onOpenChangeProp,\n helperText,\n readOnly: readOnlyProp,\n validationStatus,\n onSelectionChange,\n onChange,\n visibleMonths = 2,\n bordered,\n ...rest\n },\n ref,\n) {\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"openPanel\",\n state: \"openPanel\",\n });\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"Calendar\",\n state: \"selectedDate\",\n });\n\n const [startVisibleMonth, setStartVisibleMonth] = useState<\n DateValue | undefined\n >(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate) ?? today(getLocalTimeZone()),\n );\n\n const [endVisibleMonth, setEndVisibleMonth] = useState<DateValue | undefined>(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate.startDate?.add({ months: 1 })\n : selectedDate) ?? today(getLocalTimeZone()).add({ months: 1 }),\n );\n\n const onOpenChange = (newState: boolean) => {\n setOpen(newState);\n startInputRef?.current?.focus();\n onOpenChangeProp?.(newState);\n };\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: open,\n onOpenChange: onOpenChange,\n placement: \"bottom-start\",\n middleware: [offset(1), flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n ]);\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n\n const getPanelPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n const panelRef = useRef<HTMLDivElement>(null);\n const startInputRef = useRef<HTMLInputElement>(null);\n const endInputRef = useRef<HTMLInputElement>(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, reference);\n const floatingRef = useForkRef<HTMLDivElement>(panelRef, floating);\n\n // Handlers\n const handleSelect = (\n event: SyntheticEvent,\n selectedDate?: DateValue | { startDate?: DateValue; endDate?: DateValue },\n ) => {\n if (selectionVariant === \"default\" && selectedDate) {\n startInputRef?.current?.focus();\n }\n\n if (\n isRangeOrOffsetSelectionWithStartDate(selectedDate) &&\n selectedDate.endDate\n ) {\n endInputRef?.current?.focus();\n }\n onSelectionChange?.(event, selectedDate);\n };\n const handleCalendarButton = () => {\n startInputRef?.current?.focus();\n setOpen(!open);\n };\n\n // Context\n const datePickerContextValue = {\n openState: open,\n setOpen,\n disabled,\n selectedDate,\n setSelectedDate,\n defaultSelectedDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endVisibleMonth,\n setEndVisibleMonth,\n selectionVariant,\n context,\n getPanelPosition,\n };\n\n return (\n <DatePickerContext.Provider value={datePickerContextValue}>\n <DateInput\n validationStatus={validationStatus}\n bordered={bordered}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n {...getReferenceProps()}\n startInputRef={startInputRef}\n endInputRef={endInputRef}\n placeholder={placeholder}\n dateFormatter={dateFormatter}\n readOnly={isReadOnly}\n onSelectionChange={onSelectionChange}\n onChange={onChange}\n endAdornment={\n <Button\n variant=\"secondary\"\n onClick={handleCalendarButton}\n disabled={disabled || isReadOnly || formFieldDisabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon aria-hidden />\n </Button>\n }\n {...rest}\n />\n <DatePickerPanel\n ref={floatingRef}\n {...getFloatingProps()}\n onSelect={handleSelect}\n CalendarProps={{ ...CalendarProps, borderedDropdown: bordered }}\n helperText={helperText}\n visibleMonths={visibleMonths}\n />\n </DatePickerContext.Provider>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePicker","useControlled","useState","isRangeOrOffsetSelectionWithStartDate","today","getLocalTimeZone","_a","useFloatingUI","offset","flip","useInteractions","useDismiss","useFormFieldProps","_b","useRef","useForkRef","selectedDate","jsxs","DatePickerContext","jsx","DateInput","clsx","Button","CalendarIcon","DatePickerPanel"],"mappings":";;;;;;;;;;;;;;;;;;;AAkCA,MAAM,YAAA,GAAeA,kBAAa,gBAAgB,CAAA,CAAA;AAqFrC,MAAA,UAAA,GAAaC,gBAGxB,CAAA,SAASC,WACT,CAAA;AAAA,EACE,gBAAmB,GAAA,SAAA;AAAA,EACnB,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,aAAA;AAAA,EACd,YAAc,EAAA,gBAAA;AAAA,EACd,mBAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,IAAM,EAAA,QAAA;AAAA,EACN,WAAA;AAAA,EACA,YAAc,EAAA,gBAAA;AAAA,EACd,UAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAgB,GAAA,CAAA;AAAA,EAChB,QAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AAjJF,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAkJE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,kBAAc,CAAA;AAAA,IACpC,UAAY,EAAA,QAAA;AAAA,IACZ,OAAA,EAAS,QAAQ,WAAW,CAAA;AAAA,IAC5B,IAAM,EAAA,WAAA;AAAA,IACN,KAAO,EAAA,WAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,kBAAc,CAAA;AAAA,IACpD,UAAY,EAAA,gBAAA;AAAA,IACZ,OAAS,EAAA,mBAAA;AAAA,IACT,IAAM,EAAA,UAAA;AAAA,IACN,KAAO,EAAA,cAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,CAAC,iBAAmB,EAAA,oBAAoB,CAAI,GAAAC,cAAA;AAAA,IAG/C,CAAA,EAAA,GAAAC,kDAAA,CAAsC,YAAY,CAC/C,GAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAc,YACd,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoBC,UAAM,CAAAC,qBAAA,EAAkB,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAM,MAAA,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAAH,cAAA;AAAA,IAC3C,CAAA,EAAA,GAAAC,kDAAA,CAAsC,YAAY,CAC/C,GAAA,CAAA,EAAA,GAAA,YAAA,CAAa,cAAb,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,GAAA,CAAI,EAAE,MAAQ,EAAA,CAAA,MACtC,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoBC,WAAMC,qBAAiB,EAAC,EAAE,GAAI,CAAA,EAAE,MAAQ,EAAA,CAAA,EAAG,CAAA;AAAA,GAClE,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,QAAsB,KAAA;AA9K9C,IAAAC,IAAAA,GAAAA,CAAAA;AA+KI,IAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA;AAChB,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,QAAA,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,UAAU,QAAU,EAAA,SAAA,EAAW,OAAQ,EAAA,GAC7DC,kBAAc,CAAA;AAAA,IACZ,IAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAW,EAAA,cAAA;AAAA,IACX,UAAA,EAAY,CAACC,cAAA,CAAO,CAAC,CAAA,EAAGC,aAAK,EAAE,gBAAA,EAAkB,kBAAmB,EAAC,CAAC,CAAA;AAAA,GACvE,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAIC,uBAAgB,CAAA;AAAA,IAC9DC,mBAAW,OAAO,CAAA;AAAA,GACnB,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,QAAU,EAAA,iBAAA,EAAmB,QAAU,EAAA,iBAAA,KAC7CC,sBAAkB,EAAA,CAAA;AACpB,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AAEnC,EAAA,MAAM,mBAAmB,MAAG;AAnM9B,IAAA,IAAAN,GAAAO,EAAAA,GAAAA,CAAAA;AAmMkC,IAAA,OAAA;AAAA,MAC9B,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACV,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,KAAOP,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,WAAA;AAAA,MAC1B,MAAQO,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,YAAA;AAAA,KAC7B,CAAA;AAAA,GAAA,CAAA;AAEA,EAAM,MAAA,QAAA,GAAWC,aAAuB,IAAI,CAAA,CAAA;AAC5C,EAAM,MAAA,aAAA,GAAgBA,aAAyB,IAAI,CAAA,CAAA;AACnD,EAAM,MAAA,WAAA,GAAcA,aAAyB,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,QAAA,GAAWC,eAA2B,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAC1D,EAAM,MAAA,WAAA,GAAcA,eAA2B,CAAA,QAAA,EAAU,QAAQ,CAAA,CAAA;AAGjE,EAAM,MAAA,YAAA,GAAe,CACnB,KAAA,EACAC,aACG,KAAA;AArNP,IAAA,IAAAV,GAAAO,EAAAA,GAAAA,CAAAA;AAsNI,IAAI,IAAA,gBAAA,KAAqB,aAAaG,aAAc,EAAA;AAClD,MAAA,CAAAV,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AAAA,KAC1B;AAEA,IAAA,IACEH,kDAAsCa,CAAAA,aAAY,CAClDA,IAAAA,aAAAA,CAAa,OACb,EAAA;AACA,MAAA,CAAAH,GAAA,GAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAa,OAAb,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAsB,CAAA,KAAA,EAAA,CAAA;AAAA,KACxB;AACA,IAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAoB,KAAOG,EAAAA,aAAAA,CAAAA,CAAAA;AAAA,GAC7B,CAAA;AACA,EAAA,MAAM,uBAAuB,MAAM;AAlOrC,IAAAV,IAAAA,GAAAA,CAAAA;AAmOI,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,GACf,CAAA;AAGA,EAAA,MAAM,sBAAyB,GAAA;AAAA,IAC7B,SAAW,EAAA,IAAA;AAAA,IACX,OAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,mBAAA;AAAA,IACA,iBAAA;AAAA,IACA,oBAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,gBAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAW,eAAA,CAACC,oCAAkB,QAAlB,EAAA;AAAA,IAA2B,KAAO,EAAA,sBAAA;AAAA,IACjC,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,mBAAA,EAAA;AAAA,QACC,gBAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAK,EAAA,QAAA;AAAA,QACJ,GAAG,iBAAkB,EAAA;AAAA,QACtB,aAAA;AAAA,QACA,WAAA;AAAA,QACA,WAAA;AAAA,QACA,aAAA;AAAA,QACA,QAAU,EAAA,UAAA;AAAA,QACV,iBAAA;AAAA,QACA,QAAA;AAAA,QACA,8BACGF,cAAA,CAAAG,WAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,OAAS,EAAA,oBAAA;AAAA,UACT,QAAA,EAAU,YAAY,UAAc,IAAA,iBAAA;AAAA,UACpC,YAAW,EAAA,eAAA;AAAA,UAEX,QAAC,kBAAAH,cAAA,CAAAI,kBAAA,EAAA;AAAA,YAAa,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC5B,CAAA;AAAA,QAED,GAAG,IAAA;AAAA,OACN,CAAA;AAAA,sBACCJ,cAAA,CAAAK,+BAAA,EAAA;AAAA,QACC,GAAK,EAAA,WAAA;AAAA,QACJ,GAAG,gBAAiB,EAAA;AAAA,QACrB,QAAU,EAAA,YAAA;AAAA,QACV,aAAe,EAAA,EAAE,GAAG,aAAA,EAAe,kBAAkB,QAAS,EAAA;AAAA,QAC9D,UAAA;AAAA,QACA,aAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { type ReactNode, forwardRef } from \"react\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport { DatePickerOverlayProvider } from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\n /**\n * the initial open/close state of the overlay, when the open/close state is un-controlled.\n */\n defaultOpen?: DatePickerBaseProps[\"open\"];\n}\n\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePickerMain(props, ref) {\n const { className, children, ...rest } = props;\n if (props.selectionVariant === \"range\") {\n const stateAndHelpers = useDatePicker(rest, ref) as RangeDatePickerState;\n return (\n <DateRangeSelectionContext.Provider value={stateAndHelpers}>\n <div className={className} ref={stateAndHelpers?.state?.containerRef}>\n {children}\n </div>\n </DateRangeSelectionContext.Provider>\n );\n }\n const stateAndHelpers = useDatePicker(rest, ref) as SingleDatePickerState;\n return (\n <SingleDateSelectionContext.Provider value={stateAndHelpers}>\n <div className={className} ref={stateAndHelpers?.state?.containerRef}>\n {children}\n </div>\n </SingleDateSelectionContext.Provider>\n );\n },\n);\n\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePicker(props, ref) {\n const { open, defaultOpen, ...rest } = props;\n\n return (\n <DatePickerOverlayProvider open={open} defaultOpen={defaultOpen}>\n <DatePickerMain {...rest} ref={ref} />\n </DatePickerOverlayProvider>\n );\n },\n);\n"],"names":["forwardRef","DatePickerMain","stateAndHelpers","useDatePicker","jsx","DateRangeSelectionContext","SingleDateSelectionContext","DatePicker","DatePickerOverlayProvider"],"mappings":";;;;;;;;;;AA0CO,MAAM,cAAiB,GAAAA,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AA3CtC,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AA4CI,IAAA,MAAM,EAAE,SAAA,EAAW,QAAa,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AACzC,IAAI,IAAA,KAAA,CAAM,qBAAqB,OAAS,EAAA;AACtC,MAAMC,MAAAA,gBAAAA,GAAkBC,2BAAc,CAAA,IAAA,EAAM,GAAG,CAAA,CAAA;AAC/C,MACE,uBAAAC,cAAA,CAACC,4CAA0B,QAA1B,EAAA;AAAA,QAAmC,KAAOH,EAAAA,gBAAAA;AAAA,QACzC,QAAC,kBAAAE,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA;AAAA,UAAsB,MAAK,EAAAF,GAAAA,gBAAAA,IAAA,IAAAA,GAAAA,KAAAA,CAAAA,GAAAA,gBAAAA,CAAiB,UAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,UACrD,QAAA;AAAA,SACH,CAAA;AAAA,OACF,CAAA,CAAA;AAAA,KAEJ;AACA,IAAM,MAAA,eAAA,GAAkBC,2BAAc,CAAA,IAAA,EAAM,GAAG,CAAA,CAAA;AAC/C,IACE,uBAAAC,cAAA,CAACE,6CAA2B,QAA3B,EAAA;AAAA,MAAoC,KAAO,EAAA,eAAA;AAAA,MAC1C,QAAC,kBAAAF,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA;AAAA,QAAsB,GAAA,EAAA,CAAK,EAAiB,GAAA,eAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,eAAA,CAAA,KAAA,KAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,QACrD,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEO,MAAM,UAAa,GAAAJ,gBAAA;AAAA,EACxB,SAASO,WAAW,CAAA,KAAA,EAAO,GAAK,EAAA;AAC9B,IAAA,MAAM,EAAE,IAAA,EAAM,WAAgB,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEvC,IAAA,uBACGH,cAAA,CAAAI,mDAAA,EAAA;AAAA,MAA0B,IAAA;AAAA,MAAY,WAAA;AAAA,MACrC,QAAC,kBAAAJ,cAAA,CAAA,cAAA,EAAA;AAAA,QAAgB,GAAG,IAAA;AAAA,QAAM,GAAA;AAAA,OAAU,CAAA;AAAA,KACtC,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var css_248z = ".saltDatePickerActions {\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n width: 100%;\n padding-top: var(--salt-spacing-100);\n padding-bottom: var(--salt-spacing-100);\n padding-left: var(--salt-spacing-100);\n padding-right: var(--salt-spacing-100);\n}\n\n.saltDatePickerActions-body {\n flex-grow: 1;\n}\n\n.saltDatePickerActions-action {\n /* No margin needed here */\n}\n\n.saltDatePickerActions-action + .saltDatePickerActions-action {\n margin-left: var(--salt-spacing-100);\n}\n";
4
+
5
+ module.exports = css_248z;
6
+ //# sourceMappingURL=DatePickerActions.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerActions.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -0,0 +1,102 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var jsxRuntime = require('react/jsx-runtime');
6
+ var core = require('@salt-ds/core');
7
+ var clsx = require('clsx');
8
+ var react = require('react');
9
+ require('./DatePicker.js');
10
+ var DatePickerContext = require('./DatePickerContext.js');
11
+ require('./DatePickerOverlay.js');
12
+ require('./DatePickerSingleInput.js');
13
+ require('./DatePickerSinglePanel.js');
14
+ require('./DatePickerRangeInput.js');
15
+ require('./DatePickerRangePanel.js');
16
+ var DatePickerActions$1 = require('./DatePickerActions.css.js');
17
+ var styles = require('@salt-ds/styles');
18
+ var window = require('@salt-ds/window');
19
+
20
+ const withBaseName = core.makePrefixer("saltDatePickerActions");
21
+ const DatePickerActions = react.forwardRef(function DatePickerActions2(props, ref) {
22
+ const {
23
+ applyButtonRef,
24
+ ApplyButtonProps,
25
+ cancelButtonRef,
26
+ children,
27
+ className,
28
+ CancelButtonProps,
29
+ onApply,
30
+ onCancel,
31
+ selectionVariant
32
+ } = props;
33
+ const targetWindow = window.useWindow();
34
+ styles.useComponentCssInjection({
35
+ testId: "salt-date-picker-actions",
36
+ css: DatePickerActions$1,
37
+ window: targetWindow
38
+ });
39
+ let stateAndHelpers;
40
+ if (selectionVariant === "range") {
41
+ stateAndHelpers = DatePickerContext.useDatePickerContext({
42
+ selectionVariant: "range"
43
+ });
44
+ } else {
45
+ stateAndHelpers = DatePickerContext.useDatePickerContext({
46
+ selectionVariant: "single"
47
+ });
48
+ }
49
+ const {
50
+ state: { selectedDate },
51
+ helpers: { cancel, apply, setEnableApply }
52
+ } = stateAndHelpers;
53
+ react.useEffect(() => {
54
+ setEnableApply(true);
55
+ }, [setEnableApply]);
56
+ const handleCancel = (event) => {
57
+ var _a;
58
+ cancel();
59
+ (_a = CancelButtonProps == null ? void 0 : CancelButtonProps.onClick) == null ? void 0 : _a.call(CancelButtonProps, event);
60
+ onCancel == null ? void 0 : onCancel(event);
61
+ };
62
+ const handleApply = (event) => {
63
+ var _a;
64
+ if (selectionVariant === "single") {
65
+ apply(selectedDate, false);
66
+ onApply == null ? void 0 : onApply(event, selectedDate);
67
+ } else {
68
+ apply(selectedDate, { startDate: false, endDate: false });
69
+ onApply == null ? void 0 : onApply(event, selectedDate);
70
+ }
71
+ (_a = ApplyButtonProps == null ? void 0 : ApplyButtonProps.onClick) == null ? void 0 : _a.call(ApplyButtonProps, event);
72
+ };
73
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", {
74
+ className: clsx.clsx(className, withBaseName()),
75
+ ref,
76
+ children: [
77
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
78
+ className: withBaseName("body"),
79
+ children
80
+ }),
81
+ /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
82
+ variant: "secondary",
83
+ ref: cancelButtonRef,
84
+ ...CancelButtonProps,
85
+ onClick: handleCancel,
86
+ className: clsx.clsx(withBaseName("action"), CancelButtonProps == null ? void 0 : CancelButtonProps.className),
87
+ children: "Cancel"
88
+ }),
89
+ /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
90
+ variant: "cta",
91
+ ref: applyButtonRef,
92
+ ...ApplyButtonProps,
93
+ onClick: handleApply,
94
+ className: clsx.clsx(withBaseName("action"), ApplyButtonProps == null ? void 0 : ApplyButtonProps.className),
95
+ children: "Apply"
96
+ })
97
+ ]
98
+ });
99
+ });
100
+
101
+ exports.DatePickerActions = DatePickerActions;
102
+ //# sourceMappingURL=DatePickerActions.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerActions.js","sources":["../src/date-picker/DatePickerActions.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport React, {\n type ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n type SyntheticEvent,\n type MouseEventHandler,\n type Ref,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport {\n type RangeDatePickerState,\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./index\";\nimport \"./DatePickerActions.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport datePickerActions from \"./DatePickerActions.css\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerActions\");\n\n/**\n * Base props for DatePicker actions.\n */\nexport interface DatePickerActionsBaseProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Callback fired when the cancel action is triggered.\n * @param _event - The synthetic event.\n */\n onCancel?: (_event: SyntheticEvent) => void;\n /**\n * Ref to apply button\n */\n applyButtonRef?: Ref<HTMLButtonElement>;\n /**\n * Props for the apply button.\n */\n ApplyButtonProps?: ButtonProps;\n /**\n * Props for the cancel button.\n */\n CancelButtonProps?: ButtonProps;\n /**\n * Ref to cancel button\n */\n cancelButtonRef?: Ref<HTMLButtonElement>;\n}\n\n/**\n * Props for the DatePicker actions component.\n * @template SelectionVariant - The selection variant, either \"single\" or \"range\".\n */\nexport type DatePickerActionsProps<\n SelectionVariant extends \"single\" | \"range\",\n> = SelectionVariant extends \"single\"\n ? DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected single date or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: SingleDateSelection | null,\n ) => void;\n }\n : DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected date range or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: DateRangeSelection | null,\n ) => void;\n };\n\nexport const DatePickerActions = forwardRef<\n HTMLDivElement,\n DatePickerActionsProps<\"single\" | \"range\">\n>(function DatePickerActions(props, ref) {\n const {\n applyButtonRef,\n ApplyButtonProps,\n cancelButtonRef,\n children,\n className,\n CancelButtonProps,\n onApply,\n onCancel,\n selectionVariant,\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-actions\",\n css: datePickerActions,\n window: targetWindow,\n });\n\n // biome-ignore lint/suspicious/noExplicitAny: state and helpers coerced based on selectionVariant\n let stateAndHelpers: any;\n if (selectionVariant === \"range\") {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"range\",\n }) as RangeDatePickerState;\n } else {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"single\",\n }) as SingleDatePickerState;\n }\n\n const {\n state: { selectedDate },\n helpers: { cancel, apply, setEnableApply },\n } = stateAndHelpers;\n\n useEffect(() => {\n setEnableApply(true);\n }, [setEnableApply]);\n\n const handleCancel: MouseEventHandler<HTMLButtonElement> = (event) => {\n cancel();\n CancelButtonProps?.onClick?.(event);\n onCancel?.(event);\n };\n\n const handleApply: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (selectionVariant === \"single\") {\n apply(selectedDate, false);\n onApply?.(event, selectedDate);\n } else {\n apply(selectedDate, { startDate: false, endDate: false });\n onApply?.(event, selectedDate);\n }\n ApplyButtonProps?.onClick?.(event);\n };\n\n return (\n <div className={clsx(className, withBaseName())} ref={ref}>\n <div className={withBaseName(\"body\")}>{children}</div>\n <Button\n variant={\"secondary\"}\n ref={cancelButtonRef}\n {...CancelButtonProps}\n onClick={handleCancel}\n className={clsx(withBaseName(\"action\"), CancelButtonProps?.className)}\n >\n Cancel\n </Button>\n <Button\n variant={\"cta\"}\n ref={applyButtonRef}\n {...ApplyButtonProps}\n onClick={handleApply}\n className={clsx(withBaseName(\"action\"), ApplyButtonProps?.className)}\n >\n Apply\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerActions","useWindow","useComponentCssInjection","datePickerActions","useDatePickerContext","useEffect","jsxs","clsx","jsx","Button"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA,CAAA;AAoElD,MAAM,iBAAoB,GAAAC,gBAAA,CAG/B,SAASC,kBAAAA,CAAkB,OAAO,GAAK,EAAA;AACvC,EAAM,MAAA;AAAA,IACJ,cAAA;AAAA,IACA,gBAAA;AAAA,IACA,eAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,iBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AACJ,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAGD,EAAI,IAAA,eAAA,CAAA;AACJ,EAAA,IAAI,qBAAqB,OAAS,EAAA;AAChC,IAAA,eAAA,GAAkBC,sCAAqB,CAAA;AAAA,MACrC,gBAAkB,EAAA,OAAA;AAAA,KACnB,CAAA,CAAA;AAAA,GACI,MAAA;AACL,IAAA,eAAA,GAAkBA,sCAAqB,CAAA;AAAA,MACrC,gBAAkB,EAAA,QAAA;AAAA,KACnB,CAAA,CAAA;AAAA,GACH;AAEA,EAAM,MAAA;AAAA,IACJ,KAAA,EAAO,EAAE,YAAa,EAAA;AAAA,IACtB,OAAS,EAAA,EAAE,MAAQ,EAAA,KAAA,EAAO,cAAe,EAAA;AAAA,GACvC,GAAA,eAAA,CAAA;AAEJ,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,cAAA,CAAe,IAAI,CAAA,CAAA;AAAA,GACrB,EAAG,CAAC,cAAc,CAAC,CAAA,CAAA;AAEnB,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AApIxE,IAAA,IAAA,EAAA,CAAA;AAqII,IAAO,MAAA,EAAA,CAAA;AACP,IAAA,CAAA,EAAA,GAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAmB,YAAnB,IAA6B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,iBAAA,EAAA,KAAA,CAAA,CAAA;AAC7B,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,WAAA,GAAoD,CAAC,KAAU,KAAA;AA1IvE,IAAA,IAAA,EAAA,CAAA;AA2II,IAAA,IAAI,qBAAqB,QAAU,EAAA;AACjC,MAAA,KAAA,CAAM,cAAc,KAAK,CAAA,CAAA;AACzB,MAAA,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAU,KAAO,EAAA,YAAA,CAAA,CAAA;AAAA,KACZ,MAAA;AACL,MAAA,KAAA,CAAM,cAAc,EAAE,SAAA,EAAW,KAAO,EAAA,OAAA,EAAS,OAAO,CAAA,CAAA;AACxD,MAAA,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAU,KAAO,EAAA,YAAA,CAAA,CAAA;AAAA,KACnB;AACA,IAAA,CAAA,EAAA,GAAA,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAkB,YAAlB,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,gBAAA,EAAA,KAAA,CAAA,CAAA;AAAA,GAC9B,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,SAAA,CAAK,SAAW,EAAA,YAAA,EAAc,CAAA;AAAA,IAAG,GAAA;AAAA,IAC/C,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,QAAI,QAAA;AAAA,OAAS,CAAA;AAAA,sBAC/CA,cAAA,CAAAC,WAAA,EAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,GAAK,EAAA,eAAA;AAAA,QACJ,GAAG,iBAAA;AAAA,QACJ,OAAS,EAAA,YAAA;AAAA,QACT,WAAWF,SAAK,CAAA,YAAA,CAAa,QAAQ,CAAA,EAAG,uDAAmB,SAAS,CAAA;AAAA,QACrE,QAAA,EAAA,QAAA;AAAA,OAED,CAAA;AAAA,sBACCC,cAAA,CAAAC,WAAA,EAAA;AAAA,QACC,OAAS,EAAA,KAAA;AAAA,QACT,GAAK,EAAA,cAAA;AAAA,QACJ,GAAG,gBAAA;AAAA,QACJ,OAAS,EAAA,WAAA;AAAA,QACT,WAAWF,SAAK,CAAA,YAAA,CAAa,QAAQ,CAAA,EAAG,qDAAkB,SAAS,CAAA;AAAA,QACpE,QAAA,EAAA,OAAA;AAAA,OAED,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -5,24 +5,30 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var core = require('@salt-ds/core');
6
6
  var react = require('react');
7
7
 
8
- const DatePickerContext = core.createContext("DatePickerContext", {
9
- openState: false,
10
- setOpen: () => void 0,
11
- disabled: false,
12
- selectedDate: void 0,
13
- defaultSelectedDate: void 0,
14
- setSelectedDate: () => void 0,
15
- startVisibleMonth: void 0,
16
- setStartVisibleMonth: () => void 0,
17
- endVisibleMonth: void 0,
18
- setEndVisibleMonth: () => void 0,
19
- selectionVariant: "default",
20
- getPanelPosition: () => ({})
21
- });
22
- function useDatePickerContext() {
23
- return react.useContext(DatePickerContext);
8
+ const SingleDateSelectionContext = core.createContext("SingleDateSelectionContext", void 0);
9
+ const DateRangeSelectionContext = core.createContext("DateRangeSelectionContext", void 0);
10
+ function useDatePickerContext({
11
+ selectionVariant
12
+ }) {
13
+ if (selectionVariant === "range") {
14
+ const context2 = react.useContext(DateRangeSelectionContext);
15
+ if (!context2) {
16
+ throw new Error(
17
+ 'useDatePickerSelection should be called with props { selectionVariant : "range" } inside DateRangeSelectionContext.Provider'
18
+ );
19
+ }
20
+ return context2;
21
+ }
22
+ const context = react.useContext(SingleDateSelectionContext);
23
+ if (!context) {
24
+ throw new Error(
25
+ 'useDatePickerSelection should be called with props { selectionVariant : "single" } inside SingleDateSelectionContext.Provider'
26
+ );
27
+ }
28
+ return context;
24
29
  }
25
30
 
26
- exports.DatePickerContext = DatePickerContext;
31
+ exports.DateRangeSelectionContext = DateRangeSelectionContext;
32
+ exports.SingleDateSelectionContext = SingleDateSelectionContext;
27
33
  exports.useDatePickerContext = useDatePickerContext;
28
34
  //# sourceMappingURL=DatePickerContext.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DatePickerContext.js","sources":["../src/date-picker/DatePickerContext.ts"],"sourcesContent":["import type { DateValue } from \"@internationalized/date\";\nimport { type UseFloatingUIReturn, createContext } from \"@salt-ds/core\";\nimport { useContext } from \"react\";\nimport type {\n RangeSelectionValueType,\n SingleSelectionValueType,\n} from \"../calendar\";\n\nexport interface DatePickerContextValue<SelectionVariantType>\n extends Partial<Pick<UseFloatingUIReturn, \"context\">> {\n openState: boolean;\n setOpen: (newOpen: boolean) => void;\n disabled: boolean;\n //\n selectedDate: SelectionVariantType | undefined;\n defaultSelectedDate: SelectionVariantType | undefined;\n setSelectedDate: (newStartDate: SelectionVariantType | undefined) => void;\n startVisibleMonth: DateValue | undefined;\n setStartVisibleMonth: (newStartDate: DateValue | undefined) => void;\n endVisibleMonth: DateValue | undefined;\n setEndVisibleMonth: (newStartDate: DateValue | undefined) => void;\n selectionVariant: \"default\" | \"range\";\n getPanelPosition: () => Record<string, unknown>;\n}\n\nexport const DatePickerContext = createContext<\n DatePickerContextValue<SingleSelectionValueType | RangeSelectionValueType>\n>(\"DatePickerContext\", {\n openState: false,\n setOpen: () => undefined,\n disabled: false,\n selectedDate: undefined,\n defaultSelectedDate: undefined,\n setSelectedDate: () => undefined,\n startVisibleMonth: undefined,\n setStartVisibleMonth: () => undefined,\n endVisibleMonth: undefined,\n setEndVisibleMonth: () => undefined,\n selectionVariant: \"default\",\n getPanelPosition: () => ({}),\n});\n\nexport function useDatePickerContext() {\n return useContext(DatePickerContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;AAyBa,MAAA,iBAAA,GAAoBA,mBAE/B,mBAAqB,EAAA;AAAA,EACrB,SAAW,EAAA,KAAA;AAAA,EACX,SAAS,MAAM,KAAA,CAAA;AAAA,EACf,QAAU,EAAA,KAAA;AAAA,EACV,YAAc,EAAA,KAAA,CAAA;AAAA,EACd,mBAAqB,EAAA,KAAA,CAAA;AAAA,EACrB,iBAAiB,MAAM,KAAA,CAAA;AAAA,EACvB,iBAAmB,EAAA,KAAA,CAAA;AAAA,EACnB,sBAAsB,MAAM,KAAA,CAAA;AAAA,EAC5B,eAAiB,EAAA,KAAA,CAAA;AAAA,EACjB,oBAAoB,MAAM,KAAA,CAAA;AAAA,EAC1B,gBAAkB,EAAA,SAAA;AAAA,EAClB,gBAAA,EAAkB,OAAO,EAAC,CAAA;AAC5B,CAAC,EAAA;AAEM,SAAS,oBAAuB,GAAA;AACrC,EAAA,OAAOC,iBAAW,iBAAiB,CAAA,CAAA;AACrC;;;;;"}
1
+ {"version":3,"file":"DatePickerContext.js","sources":["../src/date-picker/DatePickerContext.ts"],"sourcesContent":["import type { DateValue } from \"@internationalized/date\";\nimport { createContext } from \"@salt-ds/core\";\nimport { useContext } from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport type { DateInputRangeError, DateInputSingleError } from \"../date-input\";\n\n/**\n * Interface representing the base state for a DatePicker.\n */\ninterface DatePickerBaseState {\n /**\n * The state properties of the DatePicker.\n */\n state: {\n /**\n * If `true`, the DatePicker is disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the DatePicker is read-only.\n */\n readOnly?: boolean;\n /**\n * If `true`, the DatePicker has been cancelled.\n */\n cancelled?: boolean;\n /**\n * If `true`, the apply action is enabled.\n */\n enableApply?: boolean;\n /**\n * The minimum selectable date.\n */\n minDate?: DateValue;\n /**\n * The maximum selectable date.\n */\n maxDate?: DateValue;\n /**\n * Reference to the container element.\n */\n containerRef: React.Ref<HTMLDivElement>;\n /**\n * The locale used for date formatting.\n */\n locale?: string;\n /**\n * The time zone used for date formatting.\n */\n timeZone?: string;\n };\n /**\n * Helper functions for managing the DatePicker state.\n */\n helpers: {\n /**\n * Cancels the DatePicker action.\n */\n cancel: () => void;\n /**\n * Sets the enableApply state.\n * @param newEnableApply - The new value for enableApply.\n */\n setEnableApply: (newEnableApply: boolean) => void;\n };\n}\n\n/**\n * Type representing a single date picker error.\n */\nexport type SingleDatePickerError = DateInputSingleError;\n\n/**\n * Type representing a range date picker error.\n */\nexport type RangeDatePickerError = DateInputRangeError;\n\n/**\n * Interface representing the state for a single date picker.\n */\nexport interface SingleDatePickerState extends DatePickerBaseState {\n /**\n * The state properties of the single date picker.\n */\n state: DatePickerBaseState[\"state\"] & {\n /**\n * The selected date.\n */\n selectedDate: SingleDateSelection | null;\n /**\n * The default selected date.\n */\n defaultSelectedDate?: SingleDateSelection;\n };\n /**\n * Helper functions for managing the single date picker state.\n */\n helpers: DatePickerBaseState[\"helpers\"] & {\n /**\n * Applies the selected date.\n * @param newDate - The new selected date.\n * @param error - The error encountered during selection, if any.\n */\n apply: (\n newDate: SingleDateSelection | null,\n error: SingleDatePickerError,\n ) => void;\n /**\n * Sets the selected date.\n * @param newDate - The new selected date.\n * @param error - The error encountered during selection, if any.\n */\n setSelectedDate: (\n newDate: SingleDateSelection | null,\n error: string | false,\n ) => void;\n };\n}\n\n/**\n * Interface representing the state for a range date picker.\n */\nexport interface RangeDatePickerState extends DatePickerBaseState {\n /**\n * The state properties of the range date picker.\n */\n state: DatePickerBaseState[\"state\"] & {\n /**\n * The selected date range.\n */\n selectedDate: DateRangeSelection | null;\n /**\n * The default selected date range.\n */\n defaultSelectedDate?: DateRangeSelection;\n };\n /**\n * Helper functions for managing the range date picker state.\n */\n helpers: DatePickerBaseState[\"helpers\"] & {\n /**\n * Applies the selected date range.\n * @param newDate - The new selected date range.\n * @param error - The error encountered during selection, if any.\n */\n apply: (\n newDate: DateRangeSelection | null,\n error: RangeDatePickerError,\n ) => void;\n /**\n * Sets the selected date range.\n * @param newDate - The new selected date range.\n * @param error - The error encountered during selection, if any.\n */\n setSelectedDate: (\n newDate: DateRangeSelection | null,\n error: { startDate: string | false; endDate: string | false },\n ) => void;\n };\n}\n\n/**\n * Type representing the state of a date picker, either single or range.\n */\nexport type DatePickerState = SingleDatePickerState | RangeDatePickerState;\n\n/**\n * Context for single date selection.\n */\nexport const SingleDateSelectionContext = createContext<\n SingleDatePickerState | undefined\n>(\"SingleDateSelectionContext\", undefined);\n\n/**\n * Context for date range selection.\n */\nexport const DateRangeSelectionContext = createContext<\n RangeDatePickerState | undefined\n>(\"DateRangeSelectionContext\", undefined);\n\n/**\n * Props for using the date picker context.\n */\nexport interface UseDatePickerContextProps {\n /**\n * The selection variant, either \"single\" or \"range\".\n */\n selectionVariant: \"single\" | \"range\";\n}\n\n// Overloads\n\n/**\n * Hook to use the date picker context for single date selection.\n * @param props - The props for the hook.\n * @returns The state of the single date picker.\n */\nexport function useDatePickerContext(props: {\n selectionVariant: \"single\";\n}): SingleDatePickerState;\n\n/**\n * Hook to use the date picker context for range date selection.\n * @param props - The props for the hook.\n * @returns The state of the range date picker.\n */\nexport function useDatePickerContext(props: {\n selectionVariant: \"range\";\n}): RangeDatePickerState;\nexport function useDatePickerContext({\n selectionVariant,\n}: UseDatePickerContextProps): DatePickerState {\n if (selectionVariant === \"range\") {\n const context = useContext(DateRangeSelectionContext);\n if (!context) {\n throw new Error(\n 'useDatePickerSelection should be called with props { selectionVariant : \"range\" } inside DateRangeSelectionContext.Provider',\n );\n }\n return context;\n }\n const context = useContext(SingleDateSelectionContext);\n if (!context) {\n throw new Error(\n 'useDatePickerSelection should be called with props { selectionVariant : \"single\" } inside SingleDateSelectionContext.Provider',\n );\n }\n return context;\n}\n"],"names":["createContext","context","useContext"],"mappings":";;;;;;;AAyKa,MAAA,0BAAA,GAA6BA,kBAExC,CAAA,4BAAA,EAA8B,KAAS,CAAA,EAAA;AAK5B,MAAA,yBAAA,GAA4BA,kBAEvC,CAAA,2BAAA,EAA6B,KAAS,CAAA,EAAA;AA+BjC,SAAS,oBAAqB,CAAA;AAAA,EACnC,gBAAA;AACF,CAA+C,EAAA;AAC7C,EAAA,IAAI,qBAAqB,OAAS,EAAA;AAChC,IAAMC,MAAAA,QAAAA,GAAUC,iBAAW,yBAAyB,CAAA,CAAA;AACpD,IAAA,IAAI,CAACD,QAAS,EAAA;AACZ,MAAA,MAAM,IAAI,KAAA;AAAA,QACR,6HAAA;AAAA,OACF,CAAA;AAAA,KACF;AACA,IAAOA,OAAAA,QAAAA,CAAAA;AAAA,GACT;AACA,EAAM,MAAA,OAAA,GAAUC,iBAAW,0BAA0B,CAAA,CAAA;AACrD,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR,+HAAA;AAAA,KACF,CAAA;AAAA,GACF;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;;;"}
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var css_248z = ".saltDatePickerOverlay {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n display: flex;\n}\n";
4
+
5
+ module.exports = css_248z;
6
+ //# sourceMappingURL=DatePickerOverlay.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerOverlay.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -0,0 +1,50 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var jsxRuntime = require('react/jsx-runtime');
6
+ var core = require('@salt-ds/core');
7
+ var styles = require('@salt-ds/styles');
8
+ var window = require('@salt-ds/window');
9
+ var clsx = require('clsx');
10
+ var react = require('react');
11
+ var DatePickerOverlay$1 = require('./DatePickerOverlay.css.js');
12
+ var DatePickerOverlayProvider = require('./DatePickerOverlayProvider.js');
13
+
14
+ const withBaseName = core.makePrefixer("saltDatePickerOverlay");
15
+ const DatePickerOverlay = react.forwardRef(function DatePickerOverlay2({ className, children, ...rest }, ref) {
16
+ const targetWindow = window.useWindow();
17
+ styles.useComponentCssInjection({
18
+ testId: "salt-date-picker-overlay",
19
+ css: DatePickerOverlay$1,
20
+ window: targetWindow
21
+ });
22
+ const { Component: FloatingComponent } = core.useFloatingComponent();
23
+ const { a11yProps } = core.useFormFieldProps();
24
+ const {
25
+ state: { open, floatingUIResult },
26
+ helpers: { getFloatingProps }
27
+ } = DatePickerOverlayProvider.useDatePickerOverlay();
28
+ const floatingRef = core.useForkRef(
29
+ ref,
30
+ floatingUIResult == null ? void 0 : floatingUIResult.floating
31
+ );
32
+ return /* @__PURE__ */ jsxRuntime.jsx(FloatingComponent, {
33
+ className: clsx.clsx(withBaseName(), className),
34
+ open: open || false,
35
+ "aria-modal": "true",
36
+ ref: floatingRef,
37
+ focusManagerProps: (floatingUIResult == null ? void 0 : floatingUIResult.context) ? {
38
+ context: floatingUIResult.context,
39
+ initialFocus: 4
40
+ } : void 0,
41
+ ...getFloatingProps ? getFloatingProps({
42
+ ...a11yProps,
43
+ ...rest
44
+ }) : rest,
45
+ children
46
+ });
47
+ });
48
+
49
+ exports.DatePickerOverlay = DatePickerOverlay;
50
+ //# sourceMappingURL=DatePickerOverlay.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerOverlay.js","sources":["../src/date-picker/DatePickerOverlay.tsx"],"sourcesContent":["import {\n makePrefixer,\n useFloatingComponent,\n useForkRef,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type ReactNode,\n forwardRef,\n} from \"react\";\nimport datePickerOverlayCss from \"./DatePickerOverlay.css\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerOverlay\");\n\n/**\n * Props for the DatePickerOverlay component.\n */\nexport interface DatePickerOverlayProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content to be rendered inside the overlay.\n */\n children: ReactNode;\n}\n\nexport const DatePickerOverlay = forwardRef<\n HTMLDivElement,\n DatePickerOverlayProps\n>(function DatePickerOverlay({ className, children, ...rest }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-overlay\",\n css: datePickerOverlayCss,\n window: targetWindow,\n });\n\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const { a11yProps } = useFormFieldProps();\n\n const {\n state: { open, floatingUIResult },\n helpers: { getFloatingProps },\n } = useDatePickerOverlay();\n\n const floatingRef = useForkRef<HTMLDivElement>(\n ref,\n floatingUIResult?.floating,\n );\n\n return (\n <FloatingComponent\n className={clsx(withBaseName(), className)}\n open={open || false}\n aria-modal=\"true\"\n ref={floatingRef}\n focusManagerProps={\n floatingUIResult?.context\n ? {\n context: floatingUIResult.context,\n initialFocus: 4,\n }\n : undefined\n }\n {...(getFloatingProps\n ? getFloatingProps({\n ...a11yProps,\n ...rest,\n })\n : rest)}\n >\n {children}\n </FloatingComponent>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerOverlay","useWindow","useComponentCssInjection","datePickerOverlayCss","useFloatingComponent","useFormFieldProps","useDatePickerOverlay","useForkRef","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA,CAAA;AAa5C,MAAA,iBAAA,GAAoBC,iBAG/B,SAASC,kBAAAA,CAAkB,EAAE,SAAW,EAAA,QAAA,EAAA,GAAa,IAAK,EAAA,EAAG,GAAK,EAAA;AAClE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,yBAAqB,EAAA,CAAA;AAE9D,EAAM,MAAA,EAAE,SAAU,EAAA,GAAIC,sBAAkB,EAAA,CAAA;AAExC,EAAM,MAAA;AAAA,IACJ,KAAA,EAAO,EAAE,IAAA,EAAM,gBAAiB,EAAA;AAAA,IAChC,OAAA,EAAS,EAAE,gBAAiB,EAAA;AAAA,MAC1BC,8CAAqB,EAAA,CAAA;AAEzB,EAAA,MAAM,WAAc,GAAAC,eAAA;AAAA,IAClB,GAAA;AAAA,IACA,gBAAkB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,QAAA;AAAA,GACpB,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,iBAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,MAAM,IAAQ,IAAA,KAAA;AAAA,IACd,YAAW,EAAA,MAAA;AAAA,IACX,GAAK,EAAA,WAAA;AAAA,IACL,iBAAA,EAAA,CACE,qDAAkB,OACd,IAAA;AAAA,MACE,SAAS,gBAAiB,CAAA,OAAA;AAAA,MAC1B,YAAc,EAAA,CAAA;AAAA,KAEhB,GAAA,KAAA,CAAA;AAAA,IAEL,GAAI,mBACD,gBAAiB,CAAA;AAAA,MACf,GAAG,SAAA;AAAA,MACH,GAAG,IAAA;AAAA,KACJ,CACD,GAAA,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -0,0 +1,105 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var jsxRuntime = require('react/jsx-runtime');
6
+ var react$1 = require('@floating-ui/react');
7
+ var core = require('@salt-ds/core');
8
+ var react = require('react');
9
+
10
+ const DatePickerOverlayContext = core.createContext("DatePickerOverlayContext", void 0);
11
+ const DatePickerOverlayProvider = ({ open: openProp, defaultOpen, children }) => {
12
+ const [open, setOpenState] = core.useControlled({
13
+ controlled: openProp,
14
+ default: Boolean(defaultOpen),
15
+ name: "DatePicker",
16
+ state: "openDatePickerOverlay"
17
+ });
18
+ const triggeringElement = react.useRef(null);
19
+ react.useEffect(() => {
20
+ if (!open) {
21
+ const trigger = triggeringElement.current;
22
+ if (trigger) {
23
+ trigger.focus();
24
+ }
25
+ if (trigger instanceof HTMLInputElement) {
26
+ setTimeout(() => {
27
+ trigger.setSelectionRange(0, trigger.value.length);
28
+ }, 0);
29
+ }
30
+ triggeringElement.current = null;
31
+ }
32
+ }, [open]);
33
+ const setOpen = react.useCallback((newOpen) => {
34
+ if (newOpen) {
35
+ triggeringElement.current = document.activeElement;
36
+ }
37
+ setOpenState(newOpen);
38
+ }, []);
39
+ const floatingUIResult = core.useFloatingUI({
40
+ open,
41
+ onOpenChange: setOpen,
42
+ placement: "bottom-start",
43
+ middleware: [react$1.flip({ fallbackStrategy: "initialPlacement" })]
44
+ });
45
+ const {
46
+ getFloatingProps: _getFloatingPropsCallback,
47
+ getReferenceProps: _getReferenceProps
48
+ } = react$1.useInteractions([react$1.useDismiss(floatingUIResult.context)]);
49
+ const getFloatingPropsCallback = react.useMemo(
50
+ () => _getFloatingPropsCallback,
51
+ [_getFloatingPropsCallback]
52
+ );
53
+ const getReferenceProps = react.useMemo(
54
+ () => _getReferenceProps,
55
+ [_getReferenceProps]
56
+ );
57
+ const getFloatingProps = react.useCallback(
58
+ (userProps) => {
59
+ var _a, _b;
60
+ const { x, y, strategy, elements } = floatingUIResult;
61
+ return {
62
+ top: y != null ? y : 0,
63
+ left: x != null ? x : 0,
64
+ position: strategy,
65
+ width: (_a = elements.floating) == null ? void 0 : _a.offsetWidth,
66
+ height: (_b = elements.floating) == null ? void 0 : _b.offsetHeight,
67
+ ...getFloatingPropsCallback(userProps)
68
+ };
69
+ },
70
+ [getFloatingPropsCallback, floatingUIResult]
71
+ );
72
+ const state = react.useMemo(
73
+ () => ({
74
+ open,
75
+ floatingUIResult
76
+ }),
77
+ [open, floatingUIResult]
78
+ );
79
+ const helpers = react.useMemo(
80
+ () => ({
81
+ getFloatingProps,
82
+ getReferenceProps,
83
+ setOpen
84
+ }),
85
+ [getFloatingProps, getReferenceProps, setOpen]
86
+ );
87
+ const contextValue = react.useMemo(() => ({ state, helpers }), [state, helpers]);
88
+ return /* @__PURE__ */ jsxRuntime.jsx(DatePickerOverlayContext.Provider, {
89
+ value: contextValue,
90
+ children
91
+ });
92
+ };
93
+ const useDatePickerOverlay = () => {
94
+ const context = react.useContext(DatePickerOverlayContext);
95
+ if (!context) {
96
+ throw new Error(
97
+ "useDatePickerOverlay must be used within a DatePickerOverlayProvider"
98
+ );
99
+ }
100
+ return context;
101
+ };
102
+
103
+ exports.DatePickerOverlayProvider = DatePickerOverlayProvider;
104
+ exports.useDatePickerOverlay = useDatePickerOverlay;
105
+ //# sourceMappingURL=DatePickerOverlayProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerOverlayProvider.js","sources":["../src/date-picker/DatePickerOverlayProvider.tsx"],"sourcesContent":["import { flip, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport { createContext, useControlled, useFloatingUI } from \"@salt-ds/core\";\nimport {\n type ReactNode,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n} from \"react\";\n\n/**\n * Interface representing the state for a DatePicker overlay.\n */\ninterface DatePickerOverlayState {\n /**\n * If `true`, the overlay is open.\n */\n open: boolean;\n /**\n * The result of the floating UI calculations.\n */\n floatingUIResult: ReturnType<typeof useFloatingUI>;\n}\n\n/**\n * Interface representing the helper functions for a DatePicker overlay.\n */\ninterface DatePickerOverlayHelpers {\n /**\n * Function to get the props for the floating element.\n */\n getFloatingProps: ReturnType<typeof useInteractions>[\"getFloatingProps\"];\n /**\n * Function to get the props for the reference element.\n */\n getReferenceProps: ReturnType<typeof useInteractions>[\"getReferenceProps\"];\n /**\n * Sets the open state of the overlay.\n * @param newOpen - The new value for the open state.\n */\n setOpen: (newOpen: boolean) => void;\n}\n\n/**\n * Interface representing the context type for a DatePicker overlay.\n */\ninterface DatePickerOverlayContextType {\n /**\n * The state of the DatePicker overlay.\n */\n state: DatePickerOverlayState;\n /**\n * The helper functions for the DatePicker overlay.\n */\n helpers: DatePickerOverlayHelpers;\n}\n\n/**\n * Context for the DatePicker overlay.\n */\nconst DatePickerOverlayContext = createContext<\n DatePickerOverlayContextType | undefined\n>(\"DatePickerOverlayContext\", undefined);\n\n/**\n * Props for the DatePickerOverlayProvider component.\n */\ninterface DatePickerOverlayProviderProps {\n /**\n * If `true`, the overlay is open.\n */\n open?: boolean;\n /**\n * The default open state of the overlay.\n */\n defaultOpen?: boolean;\n /**\n * The content to be rendered inside the overlay provider.\n */\n children: ReactNode;\n}\n\nexport const DatePickerOverlayProvider: React.FC<\n DatePickerOverlayProviderProps\n> = ({ open: openProp, defaultOpen, children }) => {\n const [open, setOpenState] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"DatePicker\",\n state: \"openDatePickerOverlay\",\n });\n const triggeringElement = useRef<HTMLElement | null>(null);\n\n useEffect(() => {\n if (!open) {\n const trigger = triggeringElement.current as HTMLElement;\n if (trigger) {\n trigger.focus();\n }\n if (trigger instanceof HTMLInputElement) {\n setTimeout(() => {\n trigger.setSelectionRange(0, trigger.value.length);\n }, 0);\n }\n triggeringElement.current = null;\n }\n }, [open]);\n\n const setOpen = useCallback((newOpen: boolean) => {\n if (newOpen) {\n triggeringElement.current = document.activeElement as HTMLElement;\n }\n setOpenState(newOpen);\n }, []);\n\n const floatingUIResult = useFloatingUI({\n open,\n onOpenChange: setOpen,\n placement: \"bottom-start\",\n middleware: [flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const {\n getFloatingProps: _getFloatingPropsCallback,\n getReferenceProps: _getReferenceProps,\n } = useInteractions([useDismiss(floatingUIResult.context)]);\n const getFloatingPropsCallback = useMemo(\n () => _getFloatingPropsCallback,\n [_getFloatingPropsCallback],\n );\n const getReferenceProps = useMemo(\n () => _getReferenceProps,\n [_getReferenceProps],\n );\n\n const getFloatingProps = useCallback(\n (userProps: React.HTMLProps<HTMLElement> | undefined) => {\n const { x, y, strategy, elements } = floatingUIResult;\n return {\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n ...getFloatingPropsCallback(userProps),\n };\n },\n [getFloatingPropsCallback, floatingUIResult],\n );\n\n const state: DatePickerOverlayState = useMemo(\n () => ({\n open,\n floatingUIResult,\n }),\n [open, floatingUIResult],\n );\n\n const helpers: DatePickerOverlayHelpers = useMemo(\n () => ({\n getFloatingProps,\n getReferenceProps,\n setOpen,\n }),\n [getFloatingProps, getReferenceProps, setOpen],\n );\n const contextValue = useMemo(() => ({ state, helpers }), [state, helpers]);\n\n return (\n <DatePickerOverlayContext.Provider value={contextValue}>\n {children}\n </DatePickerOverlayContext.Provider>\n );\n};\n\nexport const useDatePickerOverlay = (): DatePickerOverlayContextType => {\n const context = useContext(DatePickerOverlayContext);\n if (!context) {\n throw new Error(\n \"useDatePickerOverlay must be used within a DatePickerOverlayProvider\",\n );\n }\n return context;\n};\n"],"names":["createContext","useControlled","useRef","useEffect","useCallback","useFloatingUI","flip","useInteractions","useDismiss","useMemo","jsx","useContext"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = ".saltDatePickerPanel {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n display: flex;\n border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltDatePickerPanel-container {\n width: min-content;\n gap: 1px;\n}\n\n.saltDatePickerPanel-header {\n padding: var(--salt-spacing-100);\n}\n";
3
+ var css_248z = ".saltDatePickerOverlay {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n display: flex;\n}\n\n.saltDatePickerPanel-container {\n width: min-content;\n gap: 1px;\n}\n\n.saltDatePickerPanel-header {\n padding: var(--salt-spacing-100);\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=DatePickerPanel.css.js.map
@@ -0,0 +1,118 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var jsxRuntime = require('react/jsx-runtime');
6
+ var core = require('@salt-ds/core');
7
+ var icons = require('@salt-ds/icons');
8
+ var clsx = require('clsx');
9
+ var react = require('react');
10
+ require('../date-input/DateInputSingle.js');
11
+ var DateInputRange = require('../date-input/DateInputRange.js');
12
+ require('@internationalized/date');
13
+ var DatePickerContext = require('./DatePickerContext.js');
14
+ var DatePickerOverlayProvider = require('./DatePickerOverlayProvider.js');
15
+
16
+ const withBaseName = core.makePrefixer("saltDatePickerRangeInput");
17
+ const DatePickerRangeInput = react.forwardRef(function DatePickerRangeInput2(props, ref) {
18
+ const {
19
+ className,
20
+ endInputProps: endInputPropsProp,
21
+ startInputProps: startInputPropsProp,
22
+ onKeyDown,
23
+ defaultValue,
24
+ value: valueProp,
25
+ onChange,
26
+ onDateValueChange,
27
+ ...rest
28
+ } = props;
29
+ const {
30
+ state: { selectedDate, disabled, readOnly, cancelled, locale, timeZone },
31
+ helpers: { setSelectedDate }
32
+ } = DatePickerContext.useDatePickerContext({ selectionVariant: "range" });
33
+ const {
34
+ state: { open, floatingUIResult },
35
+ helpers: { getReferenceProps, setOpen }
36
+ } = DatePickerOverlayProvider.useDatePickerOverlay();
37
+ const inputRef = core.useForkRef(ref, floatingUIResult == null ? void 0 : floatingUIResult.reference);
38
+ const prevState = react.useRef();
39
+ const [value, setValue] = core.useControlled({
40
+ controlled: valueProp,
41
+ default: defaultValue,
42
+ name: "DatePickerRangeInput",
43
+ state: "dateValue"
44
+ });
45
+ const handleCalendarButton = react.useCallback(() => {
46
+ setOpen(!open);
47
+ }, [open, setOpen]);
48
+ const handleDateChange = react.useCallback(
49
+ (_event, newDate, error) => {
50
+ setSelectedDate(newDate, error);
51
+ },
52
+ [setSelectedDate]
53
+ );
54
+ const handleDateValueChange = (newDateValue, isFormatted) => {
55
+ setValue(newDateValue);
56
+ onDateValueChange == null ? void 0 : onDateValueChange(newDateValue, isFormatted);
57
+ };
58
+ react.useEffect(() => {
59
+ if (open) {
60
+ prevState.current = { date: selectedDate, value };
61
+ }
62
+ }, [open]);
63
+ react.useEffect(() => {
64
+ var _a, _b;
65
+ if (cancelled) {
66
+ setValue((_a = prevState == null ? void 0 : prevState.current) == null ? void 0 : _a.value);
67
+ setSelectedDate(((_b = prevState == null ? void 0 : prevState.current) == null ? void 0 : _b.date) || null, {
68
+ startDate: false,
69
+ endDate: false
70
+ });
71
+ }
72
+ }, [cancelled, setSelectedDate]);
73
+ const startInputProps = {
74
+ onKeyDown: (event) => {
75
+ var _a;
76
+ if (event.key === "ArrowDown") {
77
+ setOpen(true);
78
+ }
79
+ (_a = startInputPropsProp == null ? void 0 : startInputPropsProp.onKeyDown) == null ? void 0 : _a.call(startInputPropsProp, event);
80
+ },
81
+ ...startInputPropsProp
82
+ };
83
+ const endInputProps = {
84
+ onKeyDown: (event) => {
85
+ var _a;
86
+ if (event.key === "ArrowDown") {
87
+ setOpen(true);
88
+ }
89
+ (_a = endInputPropsProp == null ? void 0 : endInputPropsProp.onKeyDown) == null ? void 0 : _a.call(endInputPropsProp, event);
90
+ },
91
+ ...endInputPropsProp
92
+ };
93
+ return /* @__PURE__ */ jsxRuntime.jsx(DateInputRange.DateInputRange, {
94
+ value: value || { startDate: "", endDate: "" },
95
+ locale,
96
+ timeZone,
97
+ className: clsx.clsx(withBaseName(), className),
98
+ ref: inputRef,
99
+ date: selectedDate,
100
+ startInputProps: getReferenceProps(startInputProps),
101
+ endInputProps: getReferenceProps(endInputProps),
102
+ readOnly,
103
+ onDateChange: handleDateChange,
104
+ onDateValueChange: handleDateValueChange,
105
+ onChange,
106
+ endAdornment: /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
107
+ variant: "secondary",
108
+ onClick: handleCalendarButton,
109
+ disabled,
110
+ "aria-label": "Open Calendar",
111
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.CalendarIcon, {})
112
+ }),
113
+ ...rest
114
+ });
115
+ });
116
+
117
+ exports.DatePickerRangeInput = DatePickerRangeInput;
118
+ //# sourceMappingURL=DatePickerRangeInput.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerRangeInput.js","sources":["../src/date-picker/DatePickerRangeInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled, useForkRef } from \"@salt-ds/core\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n type KeyboardEvent,\n type KeyboardEventHandler,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { DateRangeSelection } from \"../calendar\";\nimport {\n DateInputRange,\n type DateInputRangeError,\n type DateInputRangeProps,\n type DateInputRangeValue,\n} from \"../date-input\";\nimport { useDatePickerContext } from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerRangeInput\");\n\n/**\n * Props for the DatePickerRangeInput component.\n */\nexport interface DatePickerRangeInputProps extends DateInputRangeProps {}\n\nexport const DatePickerRangeInput = forwardRef<\n HTMLDivElement,\n DatePickerRangeInputProps\n>(function DatePickerRangeInput(props, ref) {\n const {\n className,\n endInputProps: endInputPropsProp,\n startInputProps: startInputPropsProp,\n onKeyDown,\n defaultValue,\n value: valueProp,\n onChange,\n onDateValueChange,\n ...rest\n } = props;\n\n const {\n state: { selectedDate, disabled, readOnly, cancelled, locale, timeZone },\n helpers: { setSelectedDate },\n } = useDatePickerContext({ selectionVariant: \"range\" });\n const {\n state: { open, floatingUIResult },\n helpers: { getReferenceProps, setOpen },\n } = useDatePickerOverlay();\n\n const inputRef = useForkRef<HTMLDivElement>(ref, floatingUIResult?.reference);\n const prevState = useRef<\n { date: typeof selectedDate; value: typeof valueProp } | undefined\n >();\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DatePickerRangeInput\",\n state: \"dateValue\",\n });\n\n const handleCalendarButton = useCallback(() => {\n setOpen(!open);\n }, [open, setOpen]);\n\n const handleDateChange = useCallback(\n (\n _event: SyntheticEvent,\n newDate: DateRangeSelection | null,\n error: DateInputRangeError,\n ) => {\n setSelectedDate(newDate, error);\n },\n [setSelectedDate],\n );\n\n const handleDateValueChange = (\n newDateValue: DateInputRangeValue,\n isFormatted: boolean,\n ) => {\n setValue(newDateValue);\n onDateValueChange?.(newDateValue, isFormatted);\n };\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n prevState.current = { date: selectedDate, value };\n }\n }, [open]);\n\n useEffect(() => {\n if (cancelled) {\n setValue(prevState?.current?.value);\n setSelectedDate(prevState?.current?.date || null, {\n startDate: false,\n endDate: false,\n });\n }\n }, [cancelled, setSelectedDate]);\n\n const startInputProps: {\n onKeyDown: KeyboardEventHandler<HTMLInputElement>;\n } = {\n onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"ArrowDown\") {\n setOpen(true);\n }\n startInputPropsProp?.onKeyDown?.(event);\n },\n ...startInputPropsProp,\n };\n const endInputProps: {\n onKeyDown: KeyboardEventHandler<HTMLInputElement>;\n } = {\n onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"ArrowDown\") {\n setOpen(true);\n }\n endInputPropsProp?.onKeyDown?.(event);\n },\n ...endInputPropsProp,\n };\n\n return (\n <DateInputRange\n value={value || { startDate: \"\", endDate: \"\" }}\n locale={locale}\n timeZone={timeZone}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n date={selectedDate}\n startInputProps={getReferenceProps(startInputProps)}\n endInputProps={getReferenceProps(endInputProps)}\n readOnly={readOnly}\n onDateChange={handleDateChange}\n onDateValueChange={handleDateValueChange}\n onChange={onChange}\n endAdornment={\n <Button\n variant=\"secondary\"\n onClick={handleCalendarButton}\n disabled={disabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon />\n </Button>\n }\n {...rest}\n />\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerRangeInput","useDatePickerContext","useDatePickerOverlay","useForkRef","useRef","useControlled","useCallback","useEffect","jsx","DateInputRange","clsx","Button","CalendarIcon"],"mappings":"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"}