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

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 (223) hide show
  1. package/css/salt-lab.css +280 -38
  2. package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
  3. package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
  4. package/dist-cjs/calendar/Calendar.js +55 -26
  5. package/dist-cjs/calendar/Calendar.js.map +1 -1
  6. package/dist-cjs/calendar/CalendarDateGrid.css.js +6 -0
  7. package/dist-cjs/calendar/CalendarDateGrid.css.js.map +1 -0
  8. package/dist-cjs/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
  9. package/dist-cjs/calendar/CalendarDateGrid.js.map +1 -0
  10. package/dist-cjs/calendar/CalendarNavigation.js +7 -5
  11. package/dist-cjs/calendar/CalendarNavigation.js.map +1 -1
  12. package/dist-cjs/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
  13. package/dist-cjs/calendar/CalendarWeekHeader.js.map +1 -0
  14. package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
  15. package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
  16. package/dist-cjs/calendar/useCalendar.js +2 -4
  17. package/dist-cjs/calendar/useCalendar.js.map +1 -1
  18. package/dist-cjs/calendar/useCalendarSelection.js +16 -43
  19. package/dist-cjs/calendar/useCalendarSelection.js.map +1 -1
  20. package/dist-cjs/carousel/Carousel.js +5 -5
  21. package/dist-cjs/carousel/Carousel.js.map +1 -1
  22. package/dist-cjs/cascading-menu/CascadingMenuItem.js +2 -2
  23. package/dist-cjs/cascading-menu/CascadingMenuItem.js.map +1 -1
  24. package/dist-cjs/contact-details/ContactMetadata.js +2 -2
  25. package/dist-cjs/contact-details/ContactMetadata.js.map +1 -1
  26. package/dist-cjs/date-input/DateInputRange.js +2 -0
  27. package/dist-cjs/date-input/DateInputRange.js.map +1 -1
  28. package/dist-cjs/date-input/DateInputSingle.js +2 -0
  29. package/dist-cjs/date-input/DateInputSingle.js.map +1 -1
  30. package/dist-cjs/date-picker/DatePicker.js +40 -5
  31. package/dist-cjs/date-picker/DatePicker.js.map +1 -1
  32. package/dist-cjs/date-picker/DatePickerActions.js +7 -3
  33. package/dist-cjs/date-picker/DatePickerActions.js.map +1 -1
  34. package/dist-cjs/date-picker/DatePickerRangeInput.js +5 -4
  35. package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -1
  36. package/dist-cjs/date-picker/DatePickerRangePanel.js +33 -9
  37. package/dist-cjs/date-picker/DatePickerRangePanel.js.map +1 -1
  38. package/dist-cjs/date-picker/DatePickerSingleInput.js +5 -4
  39. package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -1
  40. package/dist-cjs/date-picker/DatePickerSinglePanel.js +19 -5
  41. package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +1 -1
  42. package/dist-cjs/date-picker/useDatePicker.js +91 -63
  43. package/dist-cjs/date-picker/useDatePicker.js.map +1 -1
  44. package/dist-cjs/dropdown/DropdownButton.js +4 -2
  45. package/dist-cjs/dropdown/DropdownButton.js.map +1 -1
  46. package/dist-cjs/index.js +10 -0
  47. package/dist-cjs/index.js.map +1 -1
  48. package/dist-cjs/menu-button/MenuButtonTrigger.js +2 -2
  49. package/dist-cjs/menu-button/MenuButtonTrigger.js.map +1 -1
  50. package/dist-cjs/query-input/internal/CategoryListItem.js +2 -2
  51. package/dist-cjs/query-input/internal/CategoryListItem.js.map +1 -1
  52. package/dist-cjs/query-input/internal/ValueList.js +2 -2
  53. package/dist-cjs/query-input/internal/ValueList.js.map +1 -1
  54. package/dist-cjs/search-input/SearchInput.js +2 -1
  55. package/dist-cjs/search-input/SearchInput.js.map +1 -1
  56. package/dist-cjs/static-list/StaticList.css.js +6 -0
  57. package/dist-cjs/static-list/StaticList.css.js.map +1 -0
  58. package/dist-cjs/static-list/StaticList.js +32 -0
  59. package/dist-cjs/static-list/StaticList.js.map +1 -0
  60. package/dist-cjs/static-list/StaticListItem.css.js +6 -0
  61. package/dist-cjs/static-list/StaticListItem.css.js.map +1 -0
  62. package/dist-cjs/static-list/StaticListItem.js +33 -0
  63. package/dist-cjs/static-list/StaticListItem.js.map +1 -0
  64. package/dist-cjs/static-list/StaticListItemContent.css.js +6 -0
  65. package/dist-cjs/static-list/StaticListItemContent.css.js.map +1 -0
  66. package/dist-cjs/static-list/StaticListItemContent.js +30 -0
  67. package/dist-cjs/static-list/StaticListItemContent.js.map +1 -0
  68. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js +8 -8
  69. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  70. package/dist-cjs/stepper-input/StepperInput.css.js +1 -1
  71. package/dist-cjs/stepper-input/StepperInput.js +214 -29
  72. package/dist-cjs/stepper-input/StepperInput.js.map +1 -1
  73. package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js +54 -0
  74. package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
  75. package/dist-cjs/stepper-input/internal/utils.js +43 -0
  76. package/dist-cjs/stepper-input/internal/utils.js.map +1 -0
  77. package/dist-cjs/stepper-input/useStepperInput.js +88 -172
  78. package/dist-cjs/stepper-input/useStepperInput.js.map +1 -1
  79. package/dist-cjs/tabs/Tab.js +14 -12
  80. package/dist-cjs/tabs/Tab.js.map +1 -1
  81. package/dist-cjs/tabs/Tabstrip.js +2 -1
  82. package/dist-cjs/tabs/Tabstrip.js.map +1 -1
  83. package/dist-cjs/tabs-next/OverflowMenu.js +2 -2
  84. package/dist-cjs/tabs-next/OverflowMenu.js.map +1 -1
  85. package/dist-cjs/tokenized-input/TokenizedInputBase.js +3 -3
  86. package/dist-cjs/tokenized-input/TokenizedInputBase.js.map +1 -1
  87. package/dist-cjs/tokenized-input/internal/InputPill.js +2 -2
  88. package/dist-cjs/tokenized-input/internal/InputPill.js.map +1 -1
  89. package/dist-cjs/tokenized-input-next/TokenizedInputNext.js +3 -3
  90. package/dist-cjs/tokenized-input-next/TokenizedInputNext.js.map +1 -1
  91. package/dist-cjs/tokenized-input-next/internal/InputPill.js +2 -2
  92. package/dist-cjs/tokenized-input-next/internal/InputPill.js.map +1 -1
  93. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js +2 -2
  94. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  95. package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
  96. package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
  97. package/dist-es/calendar/Calendar.js +57 -28
  98. package/dist-es/calendar/Calendar.js.map +1 -1
  99. package/dist-es/calendar/CalendarDateGrid.css.js +4 -0
  100. package/dist-es/calendar/CalendarDateGrid.css.js.map +1 -0
  101. package/dist-es/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
  102. package/dist-es/calendar/CalendarDateGrid.js.map +1 -0
  103. package/dist-es/calendar/CalendarNavigation.js +8 -6
  104. package/dist-es/calendar/CalendarNavigation.js.map +1 -1
  105. package/dist-es/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
  106. package/dist-es/calendar/CalendarWeekHeader.js.map +1 -0
  107. package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
  108. package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
  109. package/dist-es/calendar/useCalendar.js +2 -4
  110. package/dist-es/calendar/useCalendar.js.map +1 -1
  111. package/dist-es/calendar/useCalendarSelection.js +16 -43
  112. package/dist-es/calendar/useCalendarSelection.js.map +1 -1
  113. package/dist-es/carousel/Carousel.js +6 -6
  114. package/dist-es/carousel/Carousel.js.map +1 -1
  115. package/dist-es/cascading-menu/CascadingMenuItem.js +3 -3
  116. package/dist-es/cascading-menu/CascadingMenuItem.js.map +1 -1
  117. package/dist-es/contact-details/ContactMetadata.js +3 -3
  118. package/dist-es/contact-details/ContactMetadata.js.map +1 -1
  119. package/dist-es/date-input/DateInputRange.js +2 -0
  120. package/dist-es/date-input/DateInputRange.js.map +1 -1
  121. package/dist-es/date-input/DateInputSingle.js +2 -0
  122. package/dist-es/date-input/DateInputSingle.js.map +1 -1
  123. package/dist-es/date-picker/DatePicker.js +40 -5
  124. package/dist-es/date-picker/DatePicker.js.map +1 -1
  125. package/dist-es/date-picker/DatePickerActions.js +7 -3
  126. package/dist-es/date-picker/DatePickerActions.js.map +1 -1
  127. package/dist-es/date-picker/DatePickerRangeInput.js +5 -4
  128. package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -1
  129. package/dist-es/date-picker/DatePickerRangePanel.js +33 -9
  130. package/dist-es/date-picker/DatePickerRangePanel.js.map +1 -1
  131. package/dist-es/date-picker/DatePickerSingleInput.js +5 -4
  132. package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -1
  133. package/dist-es/date-picker/DatePickerSinglePanel.js +19 -5
  134. package/dist-es/date-picker/DatePickerSinglePanel.js.map +1 -1
  135. package/dist-es/date-picker/useDatePicker.js +92 -64
  136. package/dist-es/date-picker/useDatePicker.js.map +1 -1
  137. package/dist-es/dropdown/DropdownButton.js +6 -4
  138. package/dist-es/dropdown/DropdownButton.js.map +1 -1
  139. package/dist-es/index.js +5 -0
  140. package/dist-es/index.js.map +1 -1
  141. package/dist-es/menu-button/MenuButtonTrigger.js +3 -3
  142. package/dist-es/menu-button/MenuButtonTrigger.js.map +1 -1
  143. package/dist-es/query-input/internal/CategoryListItem.js +3 -3
  144. package/dist-es/query-input/internal/CategoryListItem.js.map +1 -1
  145. package/dist-es/query-input/internal/ValueList.js +3 -3
  146. package/dist-es/query-input/internal/ValueList.js.map +1 -1
  147. package/dist-es/search-input/SearchInput.js +3 -2
  148. package/dist-es/search-input/SearchInput.js.map +1 -1
  149. package/dist-es/static-list/StaticList.css.js +4 -0
  150. package/dist-es/static-list/StaticList.css.js.map +1 -0
  151. package/dist-es/static-list/StaticList.js +28 -0
  152. package/dist-es/static-list/StaticList.js.map +1 -0
  153. package/dist-es/static-list/StaticListItem.css.js +4 -0
  154. package/dist-es/static-list/StaticListItem.css.js.map +1 -0
  155. package/dist-es/static-list/StaticListItem.js +29 -0
  156. package/dist-es/static-list/StaticListItem.js.map +1 -0
  157. package/dist-es/static-list/StaticListItemContent.css.js +4 -0
  158. package/dist-es/static-list/StaticListItemContent.css.js.map +1 -0
  159. package/dist-es/static-list/StaticListItemContent.js +26 -0
  160. package/dist-es/static-list/StaticListItemContent.js.map +1 -0
  161. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js +9 -9
  162. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  163. package/dist-es/stepper-input/StepperInput.css.js +1 -1
  164. package/dist-es/stepper-input/StepperInput.js +216 -31
  165. package/dist-es/stepper-input/StepperInput.js.map +1 -1
  166. package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js +50 -0
  167. package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
  168. package/dist-es/stepper-input/internal/utils.js +32 -0
  169. package/dist-es/stepper-input/internal/utils.js.map +1 -0
  170. package/dist-es/stepper-input/useStepperInput.js +88 -172
  171. package/dist-es/stepper-input/useStepperInput.js.map +1 -1
  172. package/dist-es/tabs/Tab.js +15 -13
  173. package/dist-es/tabs/Tab.js.map +1 -1
  174. package/dist-es/tabs/Tabstrip.js +4 -3
  175. package/dist-es/tabs/Tabstrip.js.map +1 -1
  176. package/dist-es/tabs-next/OverflowMenu.js +3 -3
  177. package/dist-es/tabs-next/OverflowMenu.js.map +1 -1
  178. package/dist-es/tokenized-input/TokenizedInputBase.js +3 -3
  179. package/dist-es/tokenized-input/TokenizedInputBase.js.map +1 -1
  180. package/dist-es/tokenized-input/internal/InputPill.js +2 -2
  181. package/dist-es/tokenized-input/internal/InputPill.js.map +1 -1
  182. package/dist-es/tokenized-input-next/TokenizedInputNext.js +3 -3
  183. package/dist-es/tokenized-input-next/TokenizedInputNext.js.map +1 -1
  184. package/dist-es/tokenized-input-next/internal/InputPill.js +2 -2
  185. package/dist-es/tokenized-input-next/internal/InputPill.js.map +1 -1
  186. package/dist-es/toolbar/overflow-panel/OverflowPanel.js +3 -3
  187. package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  188. package/dist-types/calendar/Calendar.d.ts +2 -15
  189. package/dist-types/calendar/CalendarDateGrid.d.ts +10 -0
  190. package/dist-types/calendar/{internal/CalendarWeekHeader.d.ts → CalendarWeekHeader.d.ts} +1 -1
  191. package/dist-types/calendar/index.d.ts +2 -0
  192. package/dist-types/calendar/internal/CalendarMonth.d.ts +9 -1
  193. package/dist-types/calendar/useCalendarSelection.d.ts +0 -7
  194. package/dist-types/date-picker/DatePickerRangePanel.d.ts +17 -1
  195. package/dist-types/date-picker/DatePickerSinglePanel.d.ts +9 -1
  196. package/dist-types/index.d.ts +1 -0
  197. package/dist-types/static-list/StaticList.d.ts +8 -0
  198. package/dist-types/static-list/StaticListItem.d.ts +4 -0
  199. package/dist-types/static-list/StaticListItemContent.d.ts +8 -0
  200. package/dist-types/static-list/index.d.ts +3 -0
  201. package/dist-types/stepper-input/StepperInput.d.ts +66 -19
  202. package/dist-types/stepper-input/internal/useActivateWhileMouseDown.d.ts +5 -0
  203. package/dist-types/stepper-input/internal/utils.d.ts +8 -0
  204. package/dist-types/stepper-input/useStepperInput.d.ts +21 -8
  205. package/package.json +2 -2
  206. package/dist-cjs/calendar/internal/CalendarCarousel.css.js +0 -6
  207. package/dist-cjs/calendar/internal/CalendarCarousel.css.js.map +0 -1
  208. package/dist-cjs/calendar/internal/CalendarCarousel.js.map +0 -1
  209. package/dist-cjs/calendar/internal/CalendarWeekHeader.js.map +0 -1
  210. package/dist-cjs/stepper-input/internal/useSpinner.js +0 -33
  211. package/dist-cjs/stepper-input/internal/useSpinner.js.map +0 -1
  212. package/dist-es/calendar/internal/CalendarCarousel.css.js +0 -4
  213. package/dist-es/calendar/internal/CalendarCarousel.css.js.map +0 -1
  214. package/dist-es/calendar/internal/CalendarCarousel.js.map +0 -1
  215. package/dist-es/calendar/internal/CalendarWeekHeader.js.map +0 -1
  216. package/dist-es/stepper-input/internal/useSpinner.js +0 -29
  217. package/dist-es/stepper-input/internal/useSpinner.js.map +0 -1
  218. package/dist-types/calendar/internal/CalendarCarousel.d.ts +0 -3
  219. package/dist-types/stepper-input/internal/useSpinner.d.ts +0 -5
  220. /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
  221. /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
  222. /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
  223. /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n useControlled,\n useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n type ForwardedRef,\n type MouseEvent,\n type ReactElement,\n cloneElement,\n forwardRef,\n useCallback,\n useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n useCollectionItems,\n useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n /**\n * Trigger button icon\n */\n triggerButtonIcon?: JSX.Element;\n /**\n * Trigger button text\n */\n triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n {\n children,\n className,\n defaultIsOpen,\n isOpen: isOpenProp,\n onOpenChange,\n triggerButtonIcon,\n triggerButtonLabel,\n ...props\n }: DropdownPanelProps,\n forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overflow-panel\",\n css: overflowPanelCss,\n window: targetWindow,\n });\n\n const id = useId();\n const collectionHook = useCollectionItems<ReactElement>({\n id,\n children,\n });\n\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen || false,\n name: \"DropdownPanel\",\n });\n\n const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n useKeyboardNavigationPanel({\n cycleFocus: true,\n defaultHighlightedIndex: 0,\n focusOnHighlight: true,\n indexPositions: collectionHook.data,\n });\n\n const focusTrigger = useCallback(() => {\n if (triggerRef.current) {\n triggerRef.current.focus();\n }\n }, []);\n\n const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n const handleItemClick = (evt: MouseEvent) => {\n // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n setIsOpen(false);\n focusTrigger();\n };\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n };\n\n const getTriggerButtonIcon = () =>\n (triggerButtonIcon ?? triggerButtonLabel === undefined) ? (\n <OverflowMenuIcon />\n ) : undefined;\n\n return (\n <DropdownBase\n {...props}\n className={clsx(withBaseName(), className)}\n isOpen={isOpen}\n onOpenChange={handleOpenChange}\n placement=\"bottom-end\"\n ref={forwardedRef}\n >\n <Button variant=\"secondary\" ref={triggerRef}>\n {getTriggerButtonIcon()}\n {triggerButtonLabel}\n </Button>\n <div\n className={withBaseName(\"content\")}\n ref={setPanelRef}\n tabIndex={-1}\n {...keyboardHook.listProps}\n >\n {collectionHook.data.map((item) => {\n const { type } = item.value as ReactElement;\n if (type === OverflowSeparator) {\n return item.value;\n }\n const formFieldProps = {\n id: item.id,\n inOverflowPanel: true,\n key: item.id,\n onClick: handleItemClick,\n } as ToolbarFieldProps;\n\n if (type === ToolbarField) {\n return cloneElement(item.value as ReactElement, formFieldProps);\n }\n return (\n <ToolbarField {...formFieldProps} key={item.id}>\n {item.value}\n </ToolbarField>\n );\n })}\n </div>\n </DropdownBase>\n );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overflowPanelCss","useId","useCollectionItems","useRef","useControlled","useKeyboardNavigationPanel","useCallback","jsx","OverflowMenuIcon","jsxs","DropdownBase","clsx","Button","OverflowSeparator","ToolbarField","cloneElement","createElement"],"mappings":"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"}
1
+ {"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n useControlled,\n useIcon,\n useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ForwardedRef,\n type MouseEvent,\n type ReactElement,\n cloneElement,\n forwardRef,\n useCallback,\n useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n useCollectionItems,\n useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n /**\n * Trigger button icon\n */\n triggerButtonIcon?: JSX.Element;\n /**\n * Trigger button text\n */\n triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n {\n children,\n className,\n defaultIsOpen,\n isOpen: isOpenProp,\n onOpenChange,\n triggerButtonIcon,\n triggerButtonLabel,\n ...props\n }: DropdownPanelProps,\n forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overflow-panel\",\n css: overflowPanelCss,\n window: targetWindow,\n });\n const { OverflowIcon } = useIcon();\n const id = useId();\n const collectionHook = useCollectionItems<ReactElement>({\n id,\n children,\n });\n\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen || false,\n name: \"DropdownPanel\",\n });\n\n const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n useKeyboardNavigationPanel({\n cycleFocus: true,\n defaultHighlightedIndex: 0,\n focusOnHighlight: true,\n indexPositions: collectionHook.data,\n });\n\n const focusTrigger = useCallback(() => {\n if (triggerRef.current) {\n triggerRef.current.focus();\n }\n }, []);\n\n const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n const handleItemClick = (evt: MouseEvent) => {\n // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n setIsOpen(false);\n focusTrigger();\n };\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n };\n\n const getTriggerButtonIcon = () =>\n (triggerButtonIcon ?? triggerButtonLabel === undefined) ? (\n <OverflowIcon />\n ) : undefined;\n\n return (\n <DropdownBase\n {...props}\n className={clsx(withBaseName(), className)}\n isOpen={isOpen}\n onOpenChange={handleOpenChange}\n placement=\"bottom-end\"\n ref={forwardedRef}\n >\n <Button variant=\"secondary\" ref={triggerRef}>\n {getTriggerButtonIcon()}\n {triggerButtonLabel}\n </Button>\n <div\n className={withBaseName(\"content\")}\n ref={setPanelRef}\n tabIndex={-1}\n {...keyboardHook.listProps}\n >\n {collectionHook.data.map((item) => {\n const { type } = item.value as ReactElement;\n if (type === OverflowSeparator) {\n return item.value;\n }\n const formFieldProps = {\n id: item.id,\n inOverflowPanel: true,\n key: item.id,\n onClick: handleItemClick,\n } as ToolbarFieldProps;\n\n if (type === ToolbarField) {\n return cloneElement(item.value as ReactElement, formFieldProps);\n }\n return (\n <ToolbarField {...formFieldProps} key={item.id}>\n {item.value}\n </ToolbarField>\n );\n })}\n </div>\n </DropdownBase>\n );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overflowPanelCss","useIcon","useId","useCollectionItems","useRef","useControlled","useKeyboardNavigationPanel","useCallback","jsx","jsxs","DropdownBase","clsx","Button","OverflowSeparator","ToolbarField","cloneElement","createElement"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import { OverflowMenuIcon } from '@salt-ds/icons';
2
+ import { useIcon } from '@salt-ds/core';
3
3
  import { Children, isValidElement, useCallback } from 'react';
4
4
  import { MenuButton } from '../../menu-button/MenuButton.js';
5
5
  import { useFocusMenuRemount } from './useFocusMenuRemount.js';
@@ -16,6 +16,7 @@ const BreadcrumbsCollapsed = ({
16
16
  }
17
17
  return "";
18
18
  });
19
+ const { OverflowIcon } = useIcon();
19
20
  const key = keys ? keys.join("") : "";
20
21
  const { ref, shouldFocusOnMount } = useFocusMenuRemount(key);
21
22
  const itemToString = useCallback((child) => {
@@ -50,7 +51,7 @@ const BreadcrumbsCollapsed = ({
50
51
  hideCaret: true,
51
52
  ...rest,
52
53
  ref,
53
- children: /* @__PURE__ */ jsx(OverflowMenuIcon, {})
54
+ children: /* @__PURE__ */ jsx(OverflowIcon, {})
54
55
  });
55
56
  };
56
57
 
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbsCollapsed.js","sources":["../src/breadcrumbs/internal/BreadcrumbsCollapsed.tsx"],"sourcesContent":["import { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport {\n Children,\n type Component,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n isValidElement,\n useCallback,\n} from \"react\";\nimport type { CascadingMenuProps, MenuDescriptor } from \"../../cascading-menu\";\nimport { MenuButton, type MenuButtonProps } from \"../../menu-button\";\nimport type { BreadcrumbProps } from \"../Breadcrumb\";\nimport { useFocusMenuRemount } from \"./useFocusMenuRemount\";\n\nexport interface BreadcrumbsCollapsedProps\n extends Omit<MenuButtonProps, \"CascadingMenuProps\"> {\n CascadingMenuProps?: CascadingMenuProps;\n accessibleText?: string;\n children: ReactNode;\n className?: string;\n}\n\nexport const BreadcrumbsCollapsed = ({\n children,\n CascadingMenuProps,\n accessibleText,\n ...rest\n}: BreadcrumbsCollapsedProps) => {\n const keys = Children.map(children, (child) => {\n if (isValidElement(child)) {\n return child.key;\n }\n return \"\";\n });\n\n const key = keys ? keys.join(\"\") : \"\";\n const { ref, shouldFocusOnMount } =\n useFocusMenuRemount<HTMLButtonElement>(key);\n\n const itemToString = useCallback((child: Component<BreadcrumbProps>) => {\n if (!child) {\n return \"\";\n }\n const { overflowLabel, tooltipText, children } = child.props;\n return overflowLabel || tooltipText || String(children);\n }, []);\n\n const onItemClick = useCallback(\n (sourceItem: MenuDescriptor, event: MouseEvent | KeyboardEvent): void => {\n shouldFocusOnMount.current = true;\n },\n [shouldFocusOnMount],\n );\n\n const menuItems: MenuDescriptor[] = [];\n Children.forEach(children, (x) => {\n if (isValidElement(x)) {\n menuItems.push({ props: x.props } as MenuDescriptor);\n }\n });\n\n return (\n <MenuButton\n CascadingMenuProps={{\n initialSource: {\n // Only `props` is required for `itemToString`. Otherwise causing circular JSON conversion in useControlled.js\n // This is not reproducible in unit tests, where react / react-dom is partially mocked without circular reference\n menuItems,\n },\n itemToString,\n onItemClick,\n minWidth: 0,\n ...CascadingMenuProps,\n }}\n hideCaret\n {...rest}\n ref={ref}\n >\n <OverflowMenuIcon />\n </MenuButton>\n );\n};\n"],"names":["children"],"mappings":";;;;;;AAuBO,MAAM,uBAAuB,CAAC;AAAA,EACnC,QAAA;AAAA,EACA,kBAAA;AAAA,EACA,cAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAiC,KAAA;AAC/B,EAAA,MAAM,IAAO,GAAA,QAAA,CAAS,GAAI,CAAA,QAAA,EAAU,CAAC,KAAU,KAAA;AAC7C,IAAI,IAAA,cAAA,CAAe,KAAK,CAAG,EAAA;AACzB,MAAA,OAAO,KAAM,CAAA,GAAA,CAAA;AAAA,KACf;AACA,IAAO,OAAA,EAAA,CAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,GAAM,GAAA,IAAA,GAAO,IAAK,CAAA,IAAA,CAAK,EAAE,CAAI,GAAA,EAAA,CAAA;AACnC,EAAA,MAAM,EAAE,GAAA,EAAK,kBAAmB,EAAA,GAC9B,oBAAuC,GAAG,CAAA,CAAA;AAE5C,EAAM,MAAA,YAAA,GAAe,WAAY,CAAA,CAAC,KAAsC,KAAA;AACtE,IAAA,IAAI,CAAC,KAAO,EAAA;AACV,MAAO,OAAA,EAAA,CAAA;AAAA,KACT;AACA,IAAA,MAAM,EAAE,aAAe,EAAA,WAAA,EAAa,QAAAA,EAAAA,SAAAA,KAAa,KAAM,CAAA,KAAA,CAAA;AACvD,IAAO,OAAA,aAAA,IAAiB,WAAe,IAAA,MAAA,CAAOA,SAAQ,CAAA,CAAA;AAAA,GACxD,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,YAA4B,KAA4C,KAAA;AACvE,MAAA,kBAAA,CAAmB,OAAU,GAAA,IAAA,CAAA;AAAA,KAC/B;AAAA,IACA,CAAC,kBAAkB,CAAA;AAAA,GACrB,CAAA;AAEA,EAAA,MAAM,YAA8B,EAAC,CAAA;AACrC,EAAS,QAAA,CAAA,OAAA,CAAQ,QAAU,EAAA,CAAC,CAAM,KAAA;AAChC,IAAI,IAAA,cAAA,CAAe,CAAC,CAAG,EAAA;AACrB,MAAA,SAAA,CAAU,IAAK,CAAA,EAAE,KAAO,EAAA,CAAA,CAAE,OAAyB,CAAA,CAAA;AAAA,KACrD;AAAA,GACD,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IACC,kBAAoB,EAAA;AAAA,MAClB,aAAe,EAAA;AAAA,QAGb,SAAA;AAAA,OACF;AAAA,MACA,YAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAU,EAAA,CAAA;AAAA,MACV,GAAG,kBAAA;AAAA,KACL;AAAA,IACA,SAAS,EAAA,IAAA;AAAA,IACR,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,8BAAC,gBAAiB,EAAA,EAAA,CAAA;AAAA,GACpB,CAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"BreadcrumbsCollapsed.js","sources":["../src/breadcrumbs/internal/BreadcrumbsCollapsed.tsx"],"sourcesContent":["import { useIcon } from \"@salt-ds/core\";\nimport {\n Children,\n type Component,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n isValidElement,\n useCallback,\n} from \"react\";\nimport type { CascadingMenuProps, MenuDescriptor } from \"../../cascading-menu\";\nimport { MenuButton, type MenuButtonProps } from \"../../menu-button\";\nimport type { BreadcrumbProps } from \"../Breadcrumb\";\nimport { useFocusMenuRemount } from \"./useFocusMenuRemount\";\n\nexport interface BreadcrumbsCollapsedProps\n extends Omit<MenuButtonProps, \"CascadingMenuProps\"> {\n CascadingMenuProps?: CascadingMenuProps;\n accessibleText?: string;\n children: ReactNode;\n className?: string;\n}\n\nexport const BreadcrumbsCollapsed = ({\n children,\n CascadingMenuProps,\n accessibleText,\n ...rest\n}: BreadcrumbsCollapsedProps) => {\n const keys = Children.map(children, (child) => {\n if (isValidElement(child)) {\n return child.key;\n }\n return \"\";\n });\n\n const { OverflowIcon } = useIcon();\n const key = keys ? keys.join(\"\") : \"\";\n const { ref, shouldFocusOnMount } =\n useFocusMenuRemount<HTMLButtonElement>(key);\n\n const itemToString = useCallback((child: Component<BreadcrumbProps>) => {\n if (!child) {\n return \"\";\n }\n const { overflowLabel, tooltipText, children } = child.props;\n return overflowLabel || tooltipText || String(children);\n }, []);\n\n const onItemClick = useCallback(\n (sourceItem: MenuDescriptor, event: MouseEvent | KeyboardEvent): void => {\n shouldFocusOnMount.current = true;\n },\n [shouldFocusOnMount],\n );\n\n const menuItems: MenuDescriptor[] = [];\n Children.forEach(children, (x) => {\n if (isValidElement(x)) {\n menuItems.push({ props: x.props } as MenuDescriptor);\n }\n });\n\n return (\n <MenuButton\n CascadingMenuProps={{\n initialSource: {\n // Only `props` is required for `itemToString`. Otherwise causing circular JSON conversion in useControlled.js\n // This is not reproducible in unit tests, where react / react-dom is partially mocked without circular reference\n menuItems,\n },\n itemToString,\n onItemClick,\n minWidth: 0,\n ...CascadingMenuProps,\n }}\n hideCaret\n {...rest}\n ref={ref}\n >\n <OverflowIcon />\n </MenuButton>\n );\n};\n"],"names":["children"],"mappings":";;;;;;AAuBO,MAAM,uBAAuB,CAAC;AAAA,EACnC,QAAA;AAAA,EACA,kBAAA;AAAA,EACA,cAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAiC,KAAA;AAC/B,EAAA,MAAM,IAAO,GAAA,QAAA,CAAS,GAAI,CAAA,QAAA,EAAU,CAAC,KAAU,KAAA;AAC7C,IAAI,IAAA,cAAA,CAAe,KAAK,CAAG,EAAA;AACzB,MAAA,OAAO,KAAM,CAAA,GAAA,CAAA;AAAA,KACf;AACA,IAAO,OAAA,EAAA,CAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,OAAQ,EAAA,CAAA;AACjC,EAAA,MAAM,GAAM,GAAA,IAAA,GAAO,IAAK,CAAA,IAAA,CAAK,EAAE,CAAI,GAAA,EAAA,CAAA;AACnC,EAAA,MAAM,EAAE,GAAA,EAAK,kBAAmB,EAAA,GAC9B,oBAAuC,GAAG,CAAA,CAAA;AAE5C,EAAM,MAAA,YAAA,GAAe,WAAY,CAAA,CAAC,KAAsC,KAAA;AACtE,IAAA,IAAI,CAAC,KAAO,EAAA;AACV,MAAO,OAAA,EAAA,CAAA;AAAA,KACT;AACA,IAAA,MAAM,EAAE,aAAe,EAAA,WAAA,EAAa,QAAAA,EAAAA,SAAAA,KAAa,KAAM,CAAA,KAAA,CAAA;AACvD,IAAO,OAAA,aAAA,IAAiB,WAAe,IAAA,MAAA,CAAOA,SAAQ,CAAA,CAAA;AAAA,GACxD,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,YAA4B,KAA4C,KAAA;AACvE,MAAA,kBAAA,CAAmB,OAAU,GAAA,IAAA,CAAA;AAAA,KAC/B;AAAA,IACA,CAAC,kBAAkB,CAAA;AAAA,GACrB,CAAA;AAEA,EAAA,MAAM,YAA8B,EAAC,CAAA;AACrC,EAAS,QAAA,CAAA,OAAA,CAAQ,QAAU,EAAA,CAAC,CAAM,KAAA;AAChC,IAAI,IAAA,cAAA,CAAe,CAAC,CAAG,EAAA;AACrB,MAAA,SAAA,CAAU,IAAK,CAAA,EAAE,KAAO,EAAA,CAAA,CAAE,OAAyB,CAAA,CAAA;AAAA,KACrD;AAAA,GACD,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IACC,kBAAoB,EAAA;AAAA,MAClB,aAAe,EAAA;AAAA,QAGb,SAAA;AAAA,OACF;AAAA,MACA,YAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAU,EAAA,CAAA;AAAA,MACV,GAAG,kBAAA;AAAA,KACL;AAAA,IACA,SAAS,EAAA,IAAA;AAAA,IACR,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,8BAAC,YAAa,EAAA,EAAA,CAAA;AAAA,GAChB,CAAA,CAAA;AAEJ;;;;"}
@@ -1,10 +1,8 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
1
+ import { jsx } from 'react/jsx-runtime';
2
2
  import { makePrefixer } from '@salt-ds/core';
3
3
  import { clsx } from 'clsx';
4
- import { forwardRef, useCallback } from 'react';
5
- import { CalendarCarousel } from './internal/CalendarCarousel.js';
4
+ import { forwardRef } from 'react';
6
5
  import { CalendarContext } from './internal/CalendarContext.js';
7
- import { CalendarWeekHeader } from './internal/CalendarWeekHeader.js';
8
6
  import { useCalendar } from './useCalendar.js';
9
7
  import { useComponentCssInjection } from '@salt-ds/styles';
10
8
  import { useWindow } from '@salt-ds/window';
@@ -14,23 +12,64 @@ import css_248z from './Calendar.css.js';
14
12
  const withBaseName = makePrefixer("saltCalendar");
15
13
  const Calendar = forwardRef(
16
14
  function Calendar2(props, ref) {
17
- const { children, className, renderDayContents, TooltipProps, ...rest } = props;
18
15
  const targetWindow = useWindow();
19
16
  useComponentCssInjection({
20
17
  testId: "salt-calendar",
21
18
  css: css_248z,
22
19
  window: targetWindow
23
20
  });
24
- const { state, helpers } = useCalendar({
25
- ...rest
26
- });
27
- const { setCalendarFocused } = helpers;
28
- const handleFocus = useCallback(() => {
29
- setCalendarFocused(true);
30
- }, [setCalendarFocused]);
31
- const handleBlur = useCallback(() => {
32
- setCalendarFocused(false);
33
- }, [setCalendarFocused]);
21
+ const {
22
+ children,
23
+ className,
24
+ selectedDate,
25
+ defaultSelectedDate,
26
+ visibleMonth: visibleMonthProp,
27
+ timeZone,
28
+ locale,
29
+ defaultVisibleMonth,
30
+ onSelectedDateChange,
31
+ onVisibleMonthChange,
32
+ hideOutOfRangeDates,
33
+ isDayUnselectable,
34
+ isDayHighlighted,
35
+ isDayDisabled,
36
+ minDate,
37
+ maxDate,
38
+ selectionVariant,
39
+ onHoveredDateChange,
40
+ hoveredDate,
41
+ ...propsRest
42
+ } = props;
43
+ let startDateOffset;
44
+ let endDateOffset;
45
+ let rest;
46
+ if (selectionVariant === "offset") {
47
+ ({ startDateOffset, endDateOffset, ...rest } = propsRest);
48
+ } else {
49
+ rest = propsRest;
50
+ }
51
+ const useCalendarProps = {
52
+ selectedDate,
53
+ defaultSelectedDate,
54
+ visibleMonth: visibleMonthProp,
55
+ timeZone,
56
+ locale,
57
+ defaultVisibleMonth,
58
+ onSelectedDateChange,
59
+ onVisibleMonthChange,
60
+ isDayUnselectable,
61
+ isDayHighlighted,
62
+ isDayDisabled,
63
+ minDate,
64
+ maxDate,
65
+ selectionVariant,
66
+ onHoveredDateChange,
67
+ hideOutOfRangeDates,
68
+ hoveredDate,
69
+ startDateOffset,
70
+ endDateOffset
71
+ };
72
+ const { state, helpers } = useCalendar(useCalendarProps);
34
73
  const calendarLabel = new DateFormatter(state.locale, {
35
74
  month: "long",
36
75
  year: "numeric"
@@ -40,23 +79,13 @@ const Calendar = forwardRef(
40
79
  state,
41
80
  helpers
42
81
  },
43
- children: /* @__PURE__ */ jsxs("div", {
82
+ children: /* @__PURE__ */ jsx("div", {
44
83
  className: clsx(withBaseName(), className),
45
84
  role: "application",
46
85
  "aria-label": calendarLabel,
47
86
  ref,
48
- children: [
49
- children != null ? children : null,
50
- /* @__PURE__ */ jsx(CalendarWeekHeader, {
51
- locale: state.locale
52
- }),
53
- /* @__PURE__ */ jsx(CalendarCarousel, {
54
- onFocus: handleFocus,
55
- onBlur: handleBlur,
56
- renderDayContents,
57
- TooltipProps
58
- })
59
- ]
87
+ ...rest,
88
+ children
60
89
  })
61
90
  });
62
91
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type ReactNode,\n forwardRef,\n useCallback,\n} from \"react\";\nimport {\n CalendarCarousel,\n type CalendarCarouselProps,\n} from \"./internal/CalendarCarousel\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport { CalendarWeekHeader } from \"./internal/CalendarWeekHeader\";\nimport {\n type UseCalendarMultiSelectProps,\n type UseCalendarOffsetProps,\n type UseCalendarRangeProps,\n type UseCalendarSingleProps,\n useCalendar,\n} from \"./useCalendar\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { DateFormatter } from \"@internationalized/date\";\nimport calendarCss from \"./Calendar.css\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content to be rendered inside the Calendar.\n */\n children?: ReactNode;\n\n /**\n * Additional class names to apply to the Calendar.\n */\n className?: string;\n\n /**\n * Function to render the contents of a day.\n */\n renderDayContents?: CalendarCarouselProps[\"renderDayContents\"];\n\n /**\n * Props for the tooltip component.\n */\n TooltipProps?: CalendarCarouselProps[\"TooltipProps\"];\n\n /**\n * If `true`, hides dates that are out of the selectable range.\n */\n hideOutOfRangeDates?: CalendarCarouselProps[\"hideOutOfRangeDates\"];\n}\n\n/**\n * Props for the Calendar component with single date selection.\n */\nexport interface CalendarSingleProps\n extends CalendarBaseProps,\n UseCalendarSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with date range selection.\n */\nexport interface CalendarRangeProps\n extends CalendarBaseProps,\n UseCalendarRangeProps {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select date selection.\n */\nexport interface CalendarMultiSelectProps\n extends CalendarBaseProps,\n UseCalendarMultiSelectProps {\n /**\n * The selection variant, set to \"multiselect\".\n */\n selectionVariant: \"multiselect\";\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n */\nexport interface CalendarOffsetProps\n extends CalendarBaseProps,\n UseCalendarOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n */\nexport type CalendarProps =\n | CalendarSingleProps\n | CalendarRangeProps\n | CalendarMultiSelectProps\n | CalendarOffsetProps;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n function Calendar(props, ref) {\n const { children, className, renderDayContents, TooltipProps, ...rest } =\n props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar\",\n css: calendarCss,\n window: targetWindow,\n });\n\n const { state, helpers } = useCalendar({\n ...rest,\n });\n\n const { setCalendarFocused } = helpers;\n\n const handleFocus = useCallback(() => {\n setCalendarFocused(true);\n }, [setCalendarFocused]);\n\n const handleBlur = useCallback(() => {\n setCalendarFocused(false);\n }, [setCalendarFocused]);\n\n const calendarLabel = new DateFormatter(state.locale, {\n month: \"long\",\n year: \"numeric\",\n }).format(state.visibleMonth.toDate(state.timeZone));\n return (\n <CalendarContext.Provider\n value={{\n state,\n helpers,\n }}\n >\n <div\n className={clsx(withBaseName(), className)}\n role=\"application\"\n aria-label={calendarLabel}\n ref={ref}\n >\n {children ?? null}\n <CalendarWeekHeader locale={state.locale} />\n <CalendarCarousel\n onFocus={handleFocus}\n onBlur={handleBlur}\n renderDayContents={renderDayContents}\n TooltipProps={TooltipProps}\n />\n </div>\n </CalendarContext.Provider>\n );\n },\n);\n"],"names":["Calendar","calendarCss"],"mappings":";;;;;;;;;;;;;AAmHA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEzC,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,iBAAmB,EAAA,YAAA,EAAA,GAAiB,MAC/D,GAAA,KAAA,CAAA;AAEF,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,eAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,OAAQ,EAAA,GAAI,WAAY,CAAA;AAAA,MACrC,GAAG,IAAA;AAAA,KACJ,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,oBAAuB,GAAA,OAAA,CAAA;AAE/B,IAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,MAAA,kBAAA,CAAmB,IAAI,CAAA,CAAA;AAAA,KACzB,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,MAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAAA,KAC1B,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAA,MAAM,aAAgB,GAAA,IAAI,aAAc,CAAA,KAAA,CAAM,MAAQ,EAAA;AAAA,MACpD,KAAO,EAAA,MAAA;AAAA,MACP,IAAM,EAAA,SAAA;AAAA,KACP,EAAE,MAAO,CAAA,KAAA,CAAM,aAAa,MAAO,CAAA,KAAA,CAAM,QAAQ,CAAC,CAAA,CAAA;AACnD,IACE,uBAAA,GAAA,CAAC,gBAAgB,QAAhB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,OAAA;AAAA,OACF;AAAA,MAEA,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,aAAA;AAAA,QACL,YAAY,EAAA,aAAA;AAAA,QACZ,GAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAY,QAAA,IAAA,IAAA,GAAA,QAAA,GAAA,IAAA;AAAA,0BACZ,GAAA,CAAA,kBAAA,EAAA;AAAA,YAAmB,QAAQ,KAAM,CAAA,MAAA;AAAA,WAAQ,CAAA;AAAA,0BACzC,GAAA,CAAA,gBAAA,EAAA;AAAA,YACC,OAAS,EAAA,WAAA;AAAA,YACT,MAAQ,EAAA,UAAA;AAAA,YACR,iBAAA;AAAA,YACA,YAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type ReactNode,\n forwardRef,\n} from \"react\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n type UseCalendarMultiSelectProps,\n type UseCalendarOffsetProps,\n type UseCalendarRangeProps,\n type UseCalendarSingleProps,\n useCalendar,\n} from \"./useCalendar\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { DateFormatter } from \"@internationalized/date\";\nimport calendarCss from \"./Calendar.css\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content to be rendered inside the Calendar.\n */\n children: ReactNode;\n /**\n * If `true`, hides dates that are out of the selectable range.\n */\n hideOutOfRangeDates?: boolean;\n}\n\n/**\n * Props for the Calendar component with single date selection.\n */\nexport interface CalendarSingleProps\n extends CalendarBaseProps,\n UseCalendarSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with date range selection.\n */\nexport interface CalendarRangeProps\n extends CalendarBaseProps,\n UseCalendarRangeProps {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select date selection.\n */\nexport interface CalendarMultiSelectProps\n extends CalendarBaseProps,\n UseCalendarMultiSelectProps {\n /**\n * The selection variant, set to \"multiselect\".\n */\n selectionVariant: \"multiselect\";\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n */\nexport interface CalendarOffsetProps\n extends CalendarBaseProps,\n UseCalendarOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n */\nexport type CalendarProps =\n | CalendarSingleProps\n | CalendarRangeProps\n | CalendarMultiSelectProps\n | CalendarOffsetProps;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n function Calendar(props, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar\",\n css: calendarCss,\n window: targetWindow,\n });\n const {\n children,\n className,\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n timeZone,\n locale,\n defaultVisibleMonth,\n onSelectedDateChange,\n onVisibleMonthChange,\n hideOutOfRangeDates,\n isDayUnselectable,\n isDayHighlighted,\n isDayDisabled,\n minDate,\n maxDate,\n selectionVariant,\n onHoveredDateChange,\n hoveredDate,\n ...propsRest\n } = props;\n let startDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let endDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let rest: Partial<typeof props>;\n if (selectionVariant === \"offset\") {\n ({ startDateOffset, endDateOffset, ...rest } =\n propsRest as CalendarOffsetProps);\n } else {\n rest = propsRest;\n }\n // biome-ignore lint/suspicious/noExplicitAny: type guard\n const useCalendarProps: any = {\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n timeZone,\n locale,\n defaultVisibleMonth,\n onSelectedDateChange,\n onVisibleMonthChange,\n isDayUnselectable,\n isDayHighlighted,\n isDayDisabled,\n minDate,\n maxDate,\n selectionVariant,\n onHoveredDateChange,\n hideOutOfRangeDates,\n hoveredDate,\n startDateOffset,\n endDateOffset,\n };\n const { state, helpers } = useCalendar(useCalendarProps);\n const calendarLabel = new DateFormatter(state.locale, {\n month: \"long\",\n year: \"numeric\",\n }).format(state.visibleMonth.toDate(state.timeZone));\n\n return (\n <CalendarContext.Provider\n value={{\n state,\n helpers,\n }}\n >\n <div\n className={clsx(withBaseName(), className)}\n role=\"application\"\n aria-label={calendarLabel}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n </CalendarContext.Provider>\n );\n },\n);\n"],"names":["Calendar","calendarCss"],"mappings":";;;;;;;;;;;AA6FA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEzC,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,eAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AACD,IAAM,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA;AAAA,MACA,mBAAA;AAAA,MACA,YAAc,EAAA,gBAAA;AAAA,MACd,QAAA;AAAA,MACA,MAAA;AAAA,MACA,mBAAA;AAAA,MACA,oBAAA;AAAA,MACA,oBAAA;AAAA,MACA,mBAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,mBAAA;AAAA,MACA,WAAA;AAAA,MACG,GAAA,SAAA;AAAA,KACD,GAAA,KAAA,CAAA;AACJ,IAAI,IAAA,eAAA,CAAA;AACJ,IAAI,IAAA,aAAA,CAAA;AACJ,IAAI,IAAA,IAAA,CAAA;AACJ,IAAA,IAAI,qBAAqB,QAAU,EAAA;AACjC,MAAA,CAAC,EAAE,eAAA,EAAiB,aAAe,EAAA,GAAG,MACpC,GAAA,SAAA,EAAA;AAAA,KACG,MAAA;AACL,MAAO,IAAA,GAAA,SAAA,CAAA;AAAA,KACT;AAEA,IAAA,MAAM,gBAAwB,GAAA;AAAA,MAC5B,YAAA;AAAA,MACA,mBAAA;AAAA,MACA,YAAc,EAAA,gBAAA;AAAA,MACd,QAAA;AAAA,MACA,MAAA;AAAA,MACA,mBAAA;AAAA,MACA,oBAAA;AAAA,MACA,oBAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,mBAAA;AAAA,MACA,mBAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAA;AAAA,MACA,aAAA;AAAA,KACF,CAAA;AACA,IAAA,MAAM,EAAE,KAAA,EAAO,OAAQ,EAAA,GAAI,YAAY,gBAAgB,CAAA,CAAA;AACvD,IAAA,MAAM,aAAgB,GAAA,IAAI,aAAc,CAAA,KAAA,CAAM,MAAQ,EAAA;AAAA,MACpD,KAAO,EAAA,MAAA;AAAA,MACP,IAAM,EAAA,SAAA;AAAA,KACP,EAAE,MAAO,CAAA,KAAA,CAAM,aAAa,MAAO,CAAA,KAAA,CAAM,QAAQ,CAAC,CAAA,CAAA;AAEnD,IACE,uBAAA,GAAA,CAAC,gBAAgB,QAAhB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,OAAA;AAAA,OACF;AAAA,MAEA,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,aAAA;AAAA,QACL,YAAY,EAAA,aAAA;AAAA,QACZ,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -0,0 +1,4 @@
1
+ var css_248z = ".saltCalendarDateGrid-grid {\n display: grid;\n grid-auto-flow: column;\n}\n\n.saltCalendarDateGrid-grid > * {\n position: absolute;\n left: 0;\n width: 100%;\n}\n\n.saltCalendarDateGrid-grid > :nth-child(2) {\n position: relative;\n}\n";
2
+
3
+ export { css_248z as default };
4
+ //# sourceMappingURL=CalendarDateGrid.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalendarDateGrid.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,28 +1,34 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { isSameMonth } from '@internationalized/date';
3
3
  import { makePrefixer, useIsomorphicLayoutEffect } from '@salt-ds/core';
4
- import { forwardRef, useRef, useState, useEffect } from 'react';
5
- import { useCalendarContext } from './CalendarContext.js';
6
- import { CalendarMonth } from './CalendarMonth.js';
4
+ import { forwardRef, useRef, useState, useEffect, useCallback } from 'react';
5
+ import { useCalendarContext } from './internal/CalendarContext.js';
6
+ import { CalendarMonth } from './internal/CalendarMonth.js';
7
7
  import { useComponentCssInjection } from '@salt-ds/styles';
8
8
  import { useWindow } from '@salt-ds/window';
9
- import css_248z from './CalendarCarousel.css.js';
10
- import { formatDate, monthDiff } from './utils.js';
9
+ import css_248z from './CalendarDateGrid.css.js';
10
+ import { formatDate, monthDiff } from './internal/utils.js';
11
11
 
12
12
  function getMonths(month) {
13
13
  return [month.subtract({ months: 1 }), month, month.add({ months: 1 })];
14
14
  }
15
- const withBaseName = makePrefixer("saltCalendarCarousel");
16
- const CalendarCarousel = forwardRef(function CalendarCarousel2(props, ref) {
17
- const { ...rest } = props;
15
+ const withBaseName = makePrefixer("saltCalendarDateGrid");
16
+ const CalendarDateGrid = forwardRef(function CalendarDateGrid2(props, ref) {
17
+ const {
18
+ onFocus,
19
+ onBlur,
20
+ getCalendarMonthProps = () => void 0,
21
+ ...rest
22
+ } = props;
18
23
  const targetWindow = useWindow();
19
24
  useComponentCssInjection({
20
- testId: "salt-calendar-carousel",
25
+ testId: "salt-calendar-date-grid",
21
26
  css: css_248z,
22
27
  window: targetWindow
23
28
  });
24
29
  const {
25
- state: { visibleMonth, locale }
30
+ state: { visibleMonth, locale },
31
+ helpers: { setCalendarFocused }
26
32
  } = useCalendarContext();
27
33
  const containerRef = useRef(null);
28
34
  const diffIndex = (a, b) => monthDiff(a, b);
@@ -43,6 +49,20 @@ const CalendarCarousel = forwardRef(function CalendarCarousel2(props, ref) {
43
49
  setMonths(getMonths(visibleMonth));
44
50
  return void 0;
45
51
  }, [formatDate(visibleMonth, locale)]);
52
+ const handleFocus = useCallback(
53
+ (event) => {
54
+ setCalendarFocused(true);
55
+ onFocus == null ? void 0 : onFocus(event);
56
+ },
57
+ [setCalendarFocused, onFocus]
58
+ );
59
+ const handleBlur = useCallback(
60
+ (event) => {
61
+ setCalendarFocused(false);
62
+ onBlur == null ? void 0 : onBlur(event);
63
+ },
64
+ [setCalendarFocused, onBlur]
65
+ );
46
66
  return /* @__PURE__ */ jsx("div", {
47
67
  className: withBaseName(),
48
68
  tabIndex: -1,
@@ -52,8 +72,11 @@ const CalendarCarousel = forwardRef(function CalendarCarousel2(props, ref) {
52
72
  },
53
73
  ref,
54
74
  children: /* @__PURE__ */ jsx("div", {
55
- className: withBaseName("track"),
75
+ className: withBaseName("grid"),
56
76
  ref: containerRef,
77
+ onBlur: handleBlur,
78
+ onFocus: handleFocus,
79
+ ...rest,
57
80
  children: months.map((date, index) => /* @__PURE__ */ jsx("div", {
58
81
  className: withBaseName("slide"),
59
82
  style: {
@@ -61,7 +84,7 @@ const CalendarCarousel = forwardRef(function CalendarCarousel2(props, ref) {
61
84
  },
62
85
  "aria-hidden": index !== 1 ? "true" : void 0,
63
86
  children: /* @__PURE__ */ jsx(CalendarMonth, {
64
- ...rest,
87
+ ...getCalendarMonthProps(date),
65
88
  date
66
89
  })
67
90
  }, formatDate(date, locale)))
@@ -69,5 +92,5 @@ const CalendarCarousel = forwardRef(function CalendarCarousel2(props, ref) {
69
92
  });
70
93
  });
71
94
 
72
- export { CalendarCarousel };
73
- //# sourceMappingURL=CalendarCarousel.js.map
95
+ export { CalendarDateGrid };
96
+ //# sourceMappingURL=CalendarDateGrid.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalendarDateGrid.js","sources":["../src/calendar/CalendarDateGrid.tsx"],"sourcesContent":["import { type DateValue, isSameMonth } from \"@internationalized/date\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport {\n CalendarMonth,\n type CalendarMonthProps,\n} from \"./internal/CalendarMonth\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport calendarDateGridCss from \"./CalendarDateGrid.css\";\nimport { formatDate, monthDiff } from \"./internal/utils\";\n\nexport interface CalendarDateGridProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Props getter to pass to each CalendarMonth element\n */\n getCalendarMonthProps?: (date: DateValue) => Omit<CalendarMonthProps, \"date\">;\n}\n\nfunction getMonths(month: DateValue) {\n return [month.subtract({ months: 1 }), month, month.add({ months: 1 })];\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarDateGrid\");\n\nexport const CalendarDateGrid = forwardRef<\n HTMLDivElement,\n CalendarDateGridProps\n>(function CalendarDateGrid(props, ref) {\n const {\n onFocus,\n onBlur,\n getCalendarMonthProps = () => undefined,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-date-grid\",\n css: calendarDateGridCss,\n window: targetWindow,\n });\n\n const {\n state: { visibleMonth, locale },\n helpers: { setCalendarFocused },\n } = useCalendarContext();\n const containerRef = useRef<HTMLDivElement>(null);\n const diffIndex = (a: DateValue, b: DateValue) => monthDiff(a, b);\n\n const { current: baseIndex } = useRef(visibleMonth);\n\n useIsomorphicLayoutEffect(() => {\n if (containerRef.current) {\n containerRef.current.style.transform = `translate3d(${\n diffIndex(baseIndex, visibleMonth) * -101 // needs to be higher than 100% so the next month doesn't show on the edges\n }%, 0, 0)`;\n }\n });\n\n const [months, setMonths] = useState(() => getMonths(visibleMonth));\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: uses formatData to change visibleMonth into string\n useEffect(() => {\n setMonths((oldMonths) => {\n const newMonths = getMonths(visibleMonth).filter((month) => {\n return !oldMonths.find((oldMonth) => isSameMonth(oldMonth, month));\n });\n\n return oldMonths.concat(newMonths);\n });\n setMonths(getMonths(visibleMonth));\n return undefined;\n }, [formatDate(visibleMonth, locale)]);\n\n const handleFocus: FocusEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n setCalendarFocused(true);\n onFocus?.(event);\n },\n [setCalendarFocused, onFocus],\n );\n\n const handleBlur: FocusEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n setCalendarFocused(false);\n onBlur?.(event);\n },\n [setCalendarFocused, onBlur],\n );\n\n return (\n <div\n className={withBaseName()}\n tabIndex={-1} // https://bugzilla.mozilla.org/show_bug.cgi?id=1069739\n style={{\n overflowX: \"hidden\",\n position: \"relative\",\n }}\n ref={ref}\n >\n <div\n className={withBaseName(\"grid\")}\n ref={containerRef}\n onBlur={handleBlur}\n onFocus={handleFocus}\n {...rest}\n >\n {months.map((date, index) => (\n <div\n key={formatDate(date, locale)}\n className={withBaseName(\"slide\")}\n style={{\n transform: `translateX(${diffIndex(date, baseIndex) * -101}%)`,\n }}\n aria-hidden={index !== 1 ? \"true\" : undefined}\n >\n <CalendarMonth {...getCalendarMonthProps(date)} date={date} />\n </div>\n ))}\n </div>\n </div>\n );\n});\n"],"names":["CalendarDateGrid","calendarDateGridCss"],"mappings":"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"}
@@ -1,6 +1,5 @@
1
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
- import { makePrefixer, Button, Dropdown, Tooltip, useListControlContext, Option } from '@salt-ds/core';
3
- import { ChevronLeftIcon, ChevronRightIcon } from '@salt-ds/icons';
2
+ import { makePrefixer, useIcon, Button, Dropdown, Tooltip, useListControlContext, Option } from '@salt-ds/core';
4
3
  import { clsx } from 'clsx';
5
4
  import { forwardRef, useCallback, useMemo } from 'react';
6
5
  import { useCalendarContext } from './internal/CalendarContext.js';
@@ -171,6 +170,7 @@ const CalendarNavigation = forwardRef(function CalendarNavigation2(props, ref) {
171
170
  css: css_248z,
172
171
  window: targetWindow
173
172
  });
173
+ const { NextIcon, PreviousIcon } = useIcon();
174
174
  const {
175
175
  moveToPreviousMonth,
176
176
  moveToNextMonth,
@@ -247,10 +247,11 @@ const CalendarNavigation = forwardRef(function CalendarNavigation2(props, ref) {
247
247
  leaveDelay: 0,
248
248
  children: /* @__PURE__ */ jsx(Button, {
249
249
  disabled: !canNavigatePrevious,
250
- variant: "secondary",
250
+ appearance: "transparent",
251
+ sentiment: "neutral",
251
252
  onClick: handleNavigatePrevious,
252
253
  focusableWhenDisabled: true,
253
- children: /* @__PURE__ */ jsx(ChevronLeftIcon, {
254
+ children: /* @__PURE__ */ jsx(PreviousIcon, {
254
255
  "aria-label": "Previous Month"
255
256
  })
256
257
  })
@@ -292,10 +293,11 @@ const CalendarNavigation = forwardRef(function CalendarNavigation2(props, ref) {
292
293
  leaveDelay: 0,
293
294
  children: /* @__PURE__ */ jsx(Button, {
294
295
  disabled: !canNavigateNext,
295
- variant: "secondary",
296
+ appearance: "transparent",
297
+ sentiment: "neutral",
296
298
  onClick: handleNavigateNext,
297
299
  focusableWhenDisabled: true,
298
- children: /* @__PURE__ */ jsx(ChevronRightIcon, {
300
+ children: /* @__PURE__ */ jsx(NextIcon, {
299
301
  "aria-label": "Next Month"
300
302
  })
301
303
  })
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Dropdown,\n type DropdownProps,\n Option,\n type OptionProps,\n Tooltip,\n type TooltipProps,\n makePrefixer,\n useListControlContext,\n} from \"@salt-ds/core\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithRef,\n type MouseEventHandler,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useMemo,\n} from \"react\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport { CALENDAR_MAX_YEAR, CALENDAR_MIN_YEAR } from \"./useCalendarSelection\";\n\nimport {\n CalendarDate,\n type DateValue,\n isSameMonth,\n isSameYear,\n} from \"@internationalized/date\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport calendarNavigationCss from \"./CalendarNavigation.css\";\nimport { formatDate } from \"./formatDate\";\nimport { monthDiff, monthsForLocale } from \"./internal/utils\";\n\ntype DateDropdownProps = DropdownProps<DateValue>;\n\n/**\n * Props for the CalendarNavigation component.\n */\nexport interface CalendarNavigationProps extends ComponentPropsWithRef<\"div\"> {\n /**\n * Props for the month dropdown component.\n */\n MonthDropdownProps?: DateDropdownProps;\n\n /**\n * Props for the year dropdown component.\n */\n YearDropdownProps?: DateDropdownProps;\n\n /**\n * Callback fired when a month is selected.\n * @param event - The change event.\n */\n onMonthSelect?: DateDropdownProps[\"onChange\"];\n\n /**\n * Callback fired when a year is selected.\n * @param event - The change event.\n */\n onYearSelect?: DateDropdownProps[\"onChange\"];\n\n /**\n * Callback fired when navigating to the next month.\n * @param event - The click event.\n */\n onNavigateNext?: ButtonProps[\"onClick\"];\n\n /**\n * Callback fired when navigating to the previous month.\n * @param event - The click event.\n */\n onNavigatePrevious?: ButtonProps[\"onClick\"];\n\n /**\n * If `true`, hides the year dropdown.\n */\n hideYearDropdown?: boolean;\n\n /**\n * The step value for navigation. Defaults to 1.\n */\n step?: number;\n /**\n * Format the month dropdown values\n * @param date\n */\n formatMonth?: (date: DateValue) => string;\n /**\n * Format the year dropdown values\n * @param date\n */\n formatYear?: (date: DateValue) => string;\n}\n\ninterface OptionWithTooltipProps extends OptionProps {\n value: DateValue;\n tooltipContent?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nconst ConditionalTooltip: React.FC<TooltipProps> = ({\n children,\n disabled = true,\n ...rest\n}) => {\n if (disabled) {\n return <>{children}</>;\n }\n return <Tooltip {...rest}>{children}</Tooltip>;\n};\n\nfunction generateYearsBetweenRange(\n minYear: number,\n maxYear: number,\n): DateValue[] {\n const years: DateValue[] = [];\n for (let year = minYear; year <= maxYear; year++) {\n years.push(new CalendarDate(year, 1, 1));\n }\n return years;\n}\n\nfunction useCalendarNavigation() {\n const {\n state: { visibleMonth, minDate, maxDate, locale, timeZone },\n helpers: {\n setVisibleMonth,\n isDayVisible,\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n },\n } = useCalendarContext();\n\n const moveToNextMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(event, visibleMonth.add({ months: step }));\n },\n [setVisibleMonth, visibleMonth],\n );\n\n const moveToPreviousMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(event, visibleMonth.subtract({ months: step }));\n },\n [setVisibleMonth, visibleMonth],\n );\n\n const moveToMonth = useCallback(\n (event: SyntheticEvent, month: DateValue) => {\n let newMonth = month;\n\n if (!isOutsideAllowedYears(newMonth)) {\n if (isOutsideAllowedMonths(newMonth)) {\n // If month is navigable we should move to the closest navigable month\n const navigableMonths = monthsForLocale(visibleMonth, locale).filter(\n (n) => !isOutsideAllowedMonths(n),\n );\n newMonth = navigableMonths.reduce((closestMonth, currentMonth) =>\n Math.abs(monthDiff(currentMonth, newMonth)) <\n Math.abs(monthDiff(closestMonth, newMonth))\n ? currentMonth\n : closestMonth,\n );\n }\n setVisibleMonth(event, newMonth);\n }\n },\n [\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n setVisibleMonth,\n visibleMonth,\n locale,\n ],\n );\n\n const months: DateValue[] = useMemo(\n () => monthsForLocale(visibleMonth, locale),\n [visibleMonth, locale],\n );\n\n const years: DateValue[] = useMemo(\n () =>\n generateYearsBetweenRange(\n Math.min(minDate ? minDate.year : CALENDAR_MIN_YEAR, visibleMonth.year),\n Math.max(maxDate ? maxDate.year : CALENDAR_MAX_YEAR, visibleMonth.year),\n ),\n [minDate, maxDate, visibleMonth.year],\n );\n\n const selectedMonth: DateValue | undefined = months.find((month: DateValue) =>\n isSameMonth(month, visibleMonth),\n );\n const selectedYear: DateValue | undefined = years.find((year: DateValue) =>\n isSameYear(year, visibleMonth),\n );\n\n const canNavigatePrevious = !(minDate && isDayVisible(minDate));\n const canNavigateNext = !(maxDate && isDayVisible(maxDate));\n\n return useMemo(\n () => ({\n moveToNextMonth,\n moveToPreviousMonth,\n moveToMonth,\n visibleMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n timeZone,\n }),\n [\n months,\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n visibleMonth,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n timeZone,\n ],\n );\n}\n\nconst OptionWithTooltip = ({\n value,\n children,\n disabled = false,\n tooltipContent,\n}: OptionWithTooltipProps) => {\n const { activeState, openState } = useListControlContext();\n const open = activeState?.value === value;\n return (\n <ConditionalTooltip\n placement=\"right\"\n open={open && openState}\n disabled={!disabled}\n content={tooltipContent}\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Option value={value} disabled={disabled}>\n {children}\n </Option>\n </ConditionalTooltip>\n );\n};\n\nexport const CalendarNavigation = forwardRef<\n HTMLDivElement,\n CalendarNavigationProps\n>(function CalendarNavigation(props, ref) {\n const {\n className,\n formatMonth: formatMonthProp,\n formatYear: formatYearProp,\n MonthDropdownProps,\n YearDropdownProps,\n hideYearDropdown,\n step = 1,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-navigation\",\n css: calendarNavigationCss,\n window: targetWindow,\n });\n\n const {\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n } = useCalendarNavigation();\n\n const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n moveToPreviousMonth(event, step);\n },\n [moveToPreviousMonth, step],\n );\n\n const handleNavigateNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (event) => {\n moveToNextMonth(event, step);\n },\n [moveToNextMonth, step],\n );\n\n const handleMonthSelect = useCallback(\n (event: SyntheticEvent, month: DateValue[]) => {\n moveToMonth(event, month[0]);\n },\n [moveToMonth],\n );\n\n const handleYearSelect = useCallback(\n (event: SyntheticEvent, year: DateValue[]) => {\n moveToMonth(event, year[0]);\n },\n [moveToMonth],\n );\n\n const formatMonth = useCallback(\n (date?: DateValue) => {\n if (date && formatMonthProp) {\n return formatMonthProp(date);\n }\n return !date\n ? \"\"\n : formatDate(date, locale, {\n month: hideYearDropdown ? \"long\" : \"short\",\n day: undefined,\n year: undefined,\n });\n },\n [formatMonthProp],\n );\n\n const formatYear = useCallback(\n (date?: DateValue) => {\n if (date && formatYearProp) {\n return formatYearProp(date);\n }\n return !date ? \"\" : `${date.year}`;\n },\n [formatYearProp],\n );\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"hideYearDropdown\")]: hideYearDropdown },\n className,\n )}\n ref={ref}\n {...rest}\n >\n <ConditionalTooltip\n placement=\"top\"\n disabled={canNavigatePrevious}\n content=\"Past dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n disabled={!canNavigatePrevious}\n variant=\"secondary\"\n onClick={handleNavigatePrevious}\n focusableWhenDisabled={true}\n >\n <ChevronLeftIcon aria-label=\"Previous Month\" />\n </Button>\n </ConditionalTooltip>\n <div className={clsx({ [withBaseName(\"dropdowns\")]: !hideYearDropdown })}>\n <Dropdown\n aria-label=\"Month Dropdown\"\n selected={selectedMonth ? [selectedMonth] : []}\n value={formatMonth(selectedMonth)}\n onSelectionChange={handleMonthSelect}\n {...MonthDropdownProps}\n >\n {months.map((month) => (\n <OptionWithTooltip\n key={formatMonth(month)}\n value={month}\n disabled={isOutsideAllowedMonths(month)}\n tooltipContent=\"This month is out of range\"\n >\n {formatMonth(month)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n {!hideYearDropdown && (\n <Dropdown\n aria-label=\"Year Dropdown\"\n selected={selectedYear ? [selectedYear] : []}\n value={formatYear(selectedYear)}\n onSelectionChange={handleYearSelect}\n {...YearDropdownProps}\n >\n {years.map((year) => (\n <OptionWithTooltip key={formatYear(year)} value={year}>\n {formatYear(year)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n )}\n </div>\n <ConditionalTooltip\n placement=\"top\"\n disabled={canNavigateNext}\n content=\"Future dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n disabled={!canNavigateNext}\n variant=\"secondary\"\n onClick={handleNavigateNext}\n focusableWhenDisabled={true}\n >\n <ChevronRightIcon aria-label=\"Next Month\" />\n </Button>\n </ConditionalTooltip>\n </div>\n );\n});\n"],"names":["CalendarNavigation","calendarNavigationCss"],"mappings":"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"}
1
+ {"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Dropdown,\n type DropdownProps,\n Option,\n type OptionProps,\n Tooltip,\n type TooltipProps,\n makePrefixer,\n useIcon,\n useListControlContext,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithRef,\n type MouseEventHandler,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useMemo,\n} from \"react\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport { CALENDAR_MAX_YEAR, CALENDAR_MIN_YEAR } from \"./useCalendarSelection\";\n\nimport {\n CalendarDate,\n type DateValue,\n isSameMonth,\n isSameYear,\n} from \"@internationalized/date\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport calendarNavigationCss from \"./CalendarNavigation.css\";\nimport { formatDate } from \"./formatDate\";\nimport { monthDiff, monthsForLocale } from \"./internal/utils\";\n\ntype DateDropdownProps = DropdownProps<DateValue>;\n\n/**\n * Props for the CalendarNavigation component.\n */\nexport interface CalendarNavigationProps extends ComponentPropsWithRef<\"div\"> {\n /**\n * Props for the month dropdown component.\n */\n MonthDropdownProps?: DateDropdownProps;\n\n /**\n * Props for the year dropdown component.\n */\n YearDropdownProps?: DateDropdownProps;\n\n /**\n * Callback fired when a month is selected.\n * @param event - The change event.\n */\n onMonthSelect?: DateDropdownProps[\"onChange\"];\n\n /**\n * Callback fired when a year is selected.\n * @param event - The change event.\n */\n onYearSelect?: DateDropdownProps[\"onChange\"];\n\n /**\n * Callback fired when navigating to the next month.\n * @param event - The click event.\n */\n onNavigateNext?: ButtonProps[\"onClick\"];\n\n /**\n * Callback fired when navigating to the previous month.\n * @param event - The click event.\n */\n onNavigatePrevious?: ButtonProps[\"onClick\"];\n\n /**\n * If `true`, hides the year dropdown.\n */\n hideYearDropdown?: boolean;\n\n /**\n * The step value for navigation. Defaults to 1.\n */\n step?: number;\n /**\n * Format the month dropdown values\n * @param date\n */\n formatMonth?: (date: DateValue) => string;\n /**\n * Format the year dropdown values\n * @param date\n */\n formatYear?: (date: DateValue) => string;\n}\n\ninterface OptionWithTooltipProps extends OptionProps {\n value: DateValue;\n tooltipContent?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nconst ConditionalTooltip: React.FC<TooltipProps> = ({\n children,\n disabled = true,\n ...rest\n}) => {\n if (disabled) {\n return <>{children}</>;\n }\n return <Tooltip {...rest}>{children}</Tooltip>;\n};\n\nfunction generateYearsBetweenRange(\n minYear: number,\n maxYear: number,\n): DateValue[] {\n const years: DateValue[] = [];\n for (let year = minYear; year <= maxYear; year++) {\n years.push(new CalendarDate(year, 1, 1));\n }\n return years;\n}\n\nfunction useCalendarNavigation() {\n const {\n state: { visibleMonth, minDate, maxDate, locale, timeZone },\n helpers: {\n setVisibleMonth,\n isDayVisible,\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n },\n } = useCalendarContext();\n\n const moveToNextMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(event, visibleMonth.add({ months: step }));\n },\n [setVisibleMonth, visibleMonth],\n );\n\n const moveToPreviousMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(event, visibleMonth.subtract({ months: step }));\n },\n [setVisibleMonth, visibleMonth],\n );\n\n const moveToMonth = useCallback(\n (event: SyntheticEvent, month: DateValue) => {\n let newMonth = month;\n\n if (!isOutsideAllowedYears(newMonth)) {\n if (isOutsideAllowedMonths(newMonth)) {\n // If month is navigable we should move to the closest navigable month\n const navigableMonths = monthsForLocale(visibleMonth, locale).filter(\n (n) => !isOutsideAllowedMonths(n),\n );\n newMonth = navigableMonths.reduce((closestMonth, currentMonth) =>\n Math.abs(monthDiff(currentMonth, newMonth)) <\n Math.abs(monthDiff(closestMonth, newMonth))\n ? currentMonth\n : closestMonth,\n );\n }\n setVisibleMonth(event, newMonth);\n }\n },\n [\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n setVisibleMonth,\n visibleMonth,\n locale,\n ],\n );\n\n const months: DateValue[] = useMemo(\n () => monthsForLocale(visibleMonth, locale),\n [visibleMonth, locale],\n );\n\n const years: DateValue[] = useMemo(\n () =>\n generateYearsBetweenRange(\n Math.min(minDate ? minDate.year : CALENDAR_MIN_YEAR, visibleMonth.year),\n Math.max(maxDate ? maxDate.year : CALENDAR_MAX_YEAR, visibleMonth.year),\n ),\n [minDate, maxDate, visibleMonth.year],\n );\n\n const selectedMonth: DateValue | undefined = months.find((month: DateValue) =>\n isSameMonth(month, visibleMonth),\n );\n const selectedYear: DateValue | undefined = years.find((year: DateValue) =>\n isSameYear(year, visibleMonth),\n );\n\n const canNavigatePrevious = !(minDate && isDayVisible(minDate));\n const canNavigateNext = !(maxDate && isDayVisible(maxDate));\n\n return useMemo(\n () => ({\n moveToNextMonth,\n moveToPreviousMonth,\n moveToMonth,\n visibleMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n timeZone,\n }),\n [\n months,\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n visibleMonth,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n timeZone,\n ],\n );\n}\n\nconst OptionWithTooltip = ({\n value,\n children,\n disabled = false,\n tooltipContent,\n}: OptionWithTooltipProps) => {\n const { activeState, openState } = useListControlContext();\n const open = activeState?.value === value;\n return (\n <ConditionalTooltip\n placement=\"right\"\n open={open && openState}\n disabled={!disabled}\n content={tooltipContent}\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Option value={value} disabled={disabled}>\n {children}\n </Option>\n </ConditionalTooltip>\n );\n};\n\nexport const CalendarNavigation = forwardRef<\n HTMLDivElement,\n CalendarNavigationProps\n>(function CalendarNavigation(props, ref) {\n const {\n className,\n formatMonth: formatMonthProp,\n formatYear: formatYearProp,\n MonthDropdownProps,\n YearDropdownProps,\n hideYearDropdown,\n step = 1,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-navigation\",\n css: calendarNavigationCss,\n window: targetWindow,\n });\n\n const { NextIcon, PreviousIcon } = useIcon();\n\n const {\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n locale,\n } = useCalendarNavigation();\n\n const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n moveToPreviousMonth(event, step);\n },\n [moveToPreviousMonth, step],\n );\n\n const handleNavigateNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (event) => {\n moveToNextMonth(event, step);\n },\n [moveToNextMonth, step],\n );\n\n const handleMonthSelect = useCallback(\n (event: SyntheticEvent, month: DateValue[]) => {\n moveToMonth(event, month[0]);\n },\n [moveToMonth],\n );\n\n const handleYearSelect = useCallback(\n (event: SyntheticEvent, year: DateValue[]) => {\n moveToMonth(event, year[0]);\n },\n [moveToMonth],\n );\n\n const formatMonth = useCallback(\n (date?: DateValue) => {\n if (date && formatMonthProp) {\n return formatMonthProp(date);\n }\n return !date\n ? \"\"\n : formatDate(date, locale, {\n month: hideYearDropdown ? \"long\" : \"short\",\n day: undefined,\n year: undefined,\n });\n },\n [formatMonthProp],\n );\n\n const formatYear = useCallback(\n (date?: DateValue) => {\n if (date && formatYearProp) {\n return formatYearProp(date);\n }\n return !date ? \"\" : `${date.year}`;\n },\n [formatYearProp],\n );\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"hideYearDropdown\")]: hideYearDropdown },\n className,\n )}\n ref={ref}\n {...rest}\n >\n <ConditionalTooltip\n placement=\"top\"\n disabled={canNavigatePrevious}\n content=\"Past dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n disabled={!canNavigatePrevious}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleNavigatePrevious}\n focusableWhenDisabled={true}\n >\n <PreviousIcon aria-label=\"Previous Month\" />\n </Button>\n </ConditionalTooltip>\n <div className={clsx({ [withBaseName(\"dropdowns\")]: !hideYearDropdown })}>\n <Dropdown\n aria-label=\"Month Dropdown\"\n selected={selectedMonth ? [selectedMonth] : []}\n value={formatMonth(selectedMonth)}\n onSelectionChange={handleMonthSelect}\n {...MonthDropdownProps}\n >\n {months.map((month) => (\n <OptionWithTooltip\n key={formatMonth(month)}\n value={month}\n disabled={isOutsideAllowedMonths(month)}\n tooltipContent=\"This month is out of range\"\n >\n {formatMonth(month)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n {!hideYearDropdown && (\n <Dropdown\n aria-label=\"Year Dropdown\"\n selected={selectedYear ? [selectedYear] : []}\n value={formatYear(selectedYear)}\n onSelectionChange={handleYearSelect}\n {...YearDropdownProps}\n >\n {years.map((year) => (\n <OptionWithTooltip key={formatYear(year)} value={year}>\n {formatYear(year)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n )}\n </div>\n <ConditionalTooltip\n placement=\"top\"\n disabled={canNavigateNext}\n content=\"Future dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n disabled={!canNavigateNext}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleNavigateNext}\n focusableWhenDisabled={true}\n >\n <NextIcon aria-label=\"Next Month\" />\n </Button>\n </ConditionalTooltip>\n </div>\n );\n});\n"],"names":["CalendarNavigation","calendarNavigationCss"],"mappings":"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"}
@@ -2,18 +2,19 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import { makePrefixer } from '@salt-ds/core';
3
3
  import { clsx } from 'clsx';
4
4
  import { forwardRef } from 'react';
5
- import { daysForLocale } from './utils.js';
5
+ import { daysForLocale } from './internal/utils.js';
6
6
  import { useComponentCssInjection } from '@salt-ds/styles';
7
7
  import { useWindow } from '@salt-ds/window';
8
8
  import css_248z from './CalendarWeekHeader.css.js';
9
+ import { getCurrentLocale } from './formatDate.js';
9
10
 
10
11
  const withBaseName = makePrefixer("saltCalendarWeekHeader");
11
- const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2({ className, locale, ...rest }, ref) {
12
+ const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2({ className, locale = getCurrentLocale(), ...rest }, ref) {
12
13
  const weekdaysShort = daysForLocale("narrow", locale);
13
14
  const weekdaysLong = daysForLocale("long", locale);
14
15
  const targetWindow = useWindow();
15
16
  useComponentCssInjection({
16
- testId: "salt-calendar",
17
+ testId: "salt-calendar-week-header",
17
18
  css: css_248z,
18
19
  window: targetWindow
19
20
  });
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalendarWeekHeader.js","sources":["../src/calendar/CalendarWeekHeader.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport { daysForLocale } from \"./internal/utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport calendarWeekHeaderCss from \"./CalendarWeekHeader.css\";\nimport { getCurrentLocale } from \"./formatDate\";\n\nexport type CalendarWeekHeaderProps = ComponentPropsWithRef<\"div\"> & {\n locale?: string;\n};\n\nconst withBaseName = makePrefixer(\"saltCalendarWeekHeader\");\n\nexport const CalendarWeekHeader = forwardRef<\n HTMLDivElement,\n CalendarWeekHeaderProps\n>(function CalendarWeekHeader(\n { className, locale = getCurrentLocale(), ...rest },\n ref,\n) {\n const weekdaysShort = daysForLocale(\"narrow\", locale);\n const weekdaysLong = daysForLocale(\"long\", locale);\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-week-header\",\n css: calendarWeekHeaderCss,\n window: targetWindow,\n });\n\n return (\n <div\n data-testid=\"CalendarWeekHeader\"\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...rest}\n >\n {weekdaysShort.map((day, index) => (\n <small\n aria-hidden\n key={weekdaysLong[index]}\n className={withBaseName(\"dayOfWeek\")}\n >\n {day}\n </small>\n ))}\n </div>\n );\n});\n"],"names":["CalendarWeekHeader","calendarWeekHeaderCss"],"mappings":";;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA,CAAA;AAE7C,MAAA,kBAAA,GAAqB,UAGhC,CAAA,SAASA,mBACT,CAAA,EAAE,SAAW,EAAA,MAAA,GAAS,gBAAiB,EAAA,EAAA,GAAM,IAAK,EAAA,EAClD,GACA,EAAA;AACA,EAAM,MAAA,aAAA,GAAgB,aAAc,CAAA,QAAA,EAAU,MAAM,CAAA,CAAA;AACpD,EAAM,MAAA,YAAA,GAAe,aAAc,CAAA,MAAA,EAAQ,MAAM,CAAA,CAAA;AAEjD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,2BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,oBAAA;AAAA,IACZ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAc,EAAA,aAAA,CAAA,GAAA,CAAI,CAAC,GAAA,EAAK,0BACtB,GAAA,CAAA,OAAA,EAAA;AAAA,MACC,aAAW,EAAA,IAAA;AAAA,MAEX,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MAElC,QAAA,EAAA,GAAA;AAAA,KAHI,EAAA,YAAA,CAAa,MAIpB,CACD,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -1,4 +1,4 @@
1
- var css_248z = ".saltCalendarDay {\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n font-size: var(--salt-text-fontSize);\n width: var(--salt-size-base);\n height: var(--salt-size-base);\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n cursor: pointer;\n border: none;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n overflow: hidden;\n}\n.saltCalendarDay-content {\n margin: 0 var(--salt-spacing-50);\n width: 100%;\n}\n\n.saltCalendarDay:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(0px - var(--salt-focused-outlineWidth));\n}\n\n.saltCalendarDay-outOfRange {\n color: var(--salt-content-secondary-foreground);\n}\n.saltCalendarDay-outOfRange:hover {\n color: var(--salt-content-primary-foreground);\n}\n.saltCalendarDay-outOfRange .saltCalendarDay-today {\n border-bottom: var(--salt-size-indicator) var(--salt-selectable-borderStyle) var(--salt-content-secondary-foreground);\n}\n\n.saltCalendarDay-outOfRange.saltCalendarDay-highlighted:before {\n background: var(--salt-content-secondary-foreground);\n}\n.saltCalendarDay:hover,\n.saltCalendarDay-hoveredOffset,\n.saltCalendarDay-hoveredOffset:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltCalendarDay-selected {\n border-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selectedStart {\n z-index: var(--salt-zIndex-default);\n\n border-top-left-radius: var(--salt-palette-corner-weak, 0);\n border-bottom-left-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selectedEnd {\n border-top-right-radius: var(--salt-palette-corner-weak, 0);\n border-bottom-right-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selected,\n.saltCalendarDay-selected:hover,\n.saltCalendarDay-selectedStart,\n.saltCalendarDay-selectedStart:hover,\n.saltCalendarDay-selectedEnd,\n.saltCalendarDay-selectedEnd:hover {\n background: var(--salt-selectable-background-selected);\n box-shadow: 0 0 0 var(--salt-size-border) var(--salt-selectable-borderColor-selected);\n}\n\n.saltCalendarDay-hoveredSpan,\n.saltCalendarDay-hoveredSpan:hover,\n.saltCalendarDay-selectedSpan,\n.saltCalendarDay-selectedSpan:hover {\n background: var(--salt-selectable-background-hover);\n box-shadow: calc(var(--salt-size-border) * -2) 0 0 0 var(--salt-selectable-background-hover), calc(var(--salt-size-border) * -1) 0 0 var(--salt-size-border)\n var(--salt-selectable-borderColor-selected), 0 calc(var(--salt-size-border) * -1) 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltCalendarDay-disabled,\n.saltCalendarDay-disabled:hover,\n.saltCalendarDay-unselectable,\n.saltCalendarDay-unselectable:hover {\n background: var(--salt-selectable-background-disabled);\n cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.saltCalendarDay-highlighted:before,\n.saltCalendarDay-highlighted:hover:before {\n content: \"\";\n height: var(--salt-spacing-200); /* TODO: change for size-modifier when available */\n width: var(--salt-spacing-200);\n top: calc(var(--salt-spacing-100) * -1);\n right: calc(var(--salt-spacing-100) * -1);\n transform: rotate(45deg);\n background: var(--salt-accent-background);\n position: absolute;\n}\n\n.saltCalendarDay-unselectable:after {\n content: \"\";\n height: var(--salt-size-border);\n width: calc(100% - var(--salt-spacing-100));\n background: var(--salt-content-secondary-foreground);\n position: absolute;\n}\n\n.saltCalendarDay-today,\n.saltCalendarDay-today:hover,\n.saltCalendarDay-outOfRange .saltCalendarDay-today:hover {\n border-bottom: var(--salt-size-indicator) var(--salt-selectable-borderStyle) var(--salt-accent-borderColor);\n margin-bottom: calc(var(--salt-size-indicator) * -1);\n}\n\n.saltCalendarDay-disabled,\n.saltCalendarDay-disabled:hover {\n color: var(--salt-content-secondary-foreground-disabled);\n}\n\n.saltCalendarDay-hidden {\n visibility: hidden;\n}\n";
1
+ var css_248z = ".saltCalendarDay {\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n font-size: var(--salt-text-fontSize);\n width: var(--salt-size-base);\n height: var(--salt-size-base);\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n cursor: pointer;\n border: none;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n overflow: hidden;\n}\n.saltCalendarDay-content {\n margin: 0 var(--salt-spacing-50);\n width: 100%;\n}\n\n.saltCalendarDay:focus-visible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(0px - var(--salt-focused-outlineWidth));\n}\n\n.saltCalendarDay-outOfRange {\n color: var(--salt-content-secondary-foreground);\n}\n.saltCalendarDay-outOfRange:hover {\n color: var(--salt-content-primary-foreground);\n}\n.saltCalendarDay-outOfRange .saltCalendarDay-today {\n border-bottom: var(--salt-size-indicator) var(--salt-selectable-borderStyle) var(--salt-content-secondary-foreground);\n}\n\n.saltCalendarDay-outOfRange.saltCalendarDay-highlighted:before {\n background: var(--salt-content-secondary-foreground);\n}\n.saltCalendarDay:hover,\n.saltCalendarDay-hoveredOffset,\n.saltCalendarDay-hoveredOffset:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltCalendarDay-selected {\n border-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selectedStart {\n z-index: var(--salt-zIndex-default);\n\n border-top-left-radius: var(--salt-palette-corner-weak, 0);\n border-bottom-left-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selectedEnd {\n border-top-right-radius: var(--salt-palette-corner-weak, 0);\n border-bottom-right-radius: var(--salt-palette-corner-weak, 0);\n}\n\n.saltCalendarDay-selected,\n.saltCalendarDay-selected:hover,\n.saltCalendarDay-selectedStart,\n.saltCalendarDay-selectedStart:hover,\n.saltCalendarDay-selectedEnd,\n.saltCalendarDay-selectedEnd:hover {\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background-selected);\n box-shadow: 0 0 0 var(--salt-size-border) var(--salt-selectable-borderColor-selected);\n}\n\n.saltCalendarDay-hoveredSpan,\n.saltCalendarDay-hoveredSpan:hover,\n.saltCalendarDay-selectedSpan,\n.saltCalendarDay-selectedSpan:hover {\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background-hover);\n box-shadow: calc(var(--salt-size-border) * -2) 0 0 0 var(--salt-selectable-background-hover), calc(var(--salt-size-border) * -1) 0 0 var(--salt-size-border)\n var(--salt-selectable-borderColor-selected), 0 calc(var(--salt-size-border) * -1) 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltCalendarDay-disabled,\n.saltCalendarDay-disabled:hover,\n.saltCalendarDay-unselectable,\n.saltCalendarDay-unselectable:hover {\n background: var(--salt-selectable-background-disabled);\n cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.saltCalendarDay-highlighted:before,\n.saltCalendarDay-highlighted:hover:before {\n content: \"\";\n height: var(--salt-spacing-200); /* TODO: change for size-modifier when available */\n width: var(--salt-spacing-200);\n top: calc(var(--salt-spacing-100) * -1);\n right: calc(var(--salt-spacing-100) * -1);\n transform: rotate(45deg);\n background: var(--salt-accent-background);\n position: absolute;\n}\n\n.saltCalendarDay-unselectable:after {\n content: \"\";\n height: var(--salt-size-border);\n width: calc(100% - var(--salt-spacing-100));\n background: var(--salt-content-secondary-foreground);\n position: absolute;\n}\n\n.saltCalendarDay-today,\n.saltCalendarDay-today:hover,\n.saltCalendarDay-outOfRange .saltCalendarDay-today:hover {\n border-bottom: var(--salt-size-indicator) var(--salt-selectable-borderStyle) var(--salt-accent-borderColor);\n margin-bottom: calc(var(--salt-size-indicator) * -1);\n}\n\n.saltCalendarDay-disabled,\n.saltCalendarDay-disabled:hover {\n color: var(--salt-content-secondary-foreground-disabled);\n}\n\n.saltCalendarDay-hidden {\n visibility: hidden;\n}\n";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=CalendarDay.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarMonth.js","sources":["../src/calendar/internal/CalendarMonth.tsx"],"sourcesContent":["import type { DateValue } from \"@internationalized/date\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithRef,\n type MouseEvent,\n type SyntheticEvent,\n forwardRef,\n} from \"react\";\nimport { CalendarDay, type CalendarDayProps } from \"./CalendarDay\";\nimport { formatDate, generateVisibleDays } from \"./utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useCalendarContext } from \"./CalendarContext\";\nimport calendarMonthCss from \"./CalendarMonth.css\";\n\nexport interface CalendarMonthProps extends ComponentPropsWithRef<\"div\"> {\n date: DateValue;\n hideOutOfRangeDates?: boolean;\n renderDayContents?: CalendarDayProps[\"renderDayContents\"];\n TooltipProps?: CalendarDayProps[\"TooltipProps\"];\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarMonth\");\n\nexport const CalendarMonth = forwardRef<HTMLDivElement, CalendarMonthProps>(\n function CalendarMonth(props, ref) {\n const {\n className,\n date,\n renderDayContents,\n onMouseLeave,\n TooltipProps,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-month\",\n css: calendarMonthCss,\n window: targetWindow,\n });\n\n const {\n state: { locale },\n helpers: { setHoveredDate },\n } = useCalendarContext();\n const days = generateVisibleDays(date, locale);\n\n const handleMouseLeave = (event: SyntheticEvent) => {\n setHoveredDate(event, null);\n onMouseLeave?.(event as MouseEvent<HTMLDivElement>);\n };\n\n return (\n <div\n className={clsx(withBaseName(), className)}\n ref={ref}\n onMouseLeave={handleMouseLeave}\n {...rest}\n >\n <div\n data-testid=\"CalendarDateGrid\"\n className={withBaseName(\"dateGrid\")}\n >\n {days.map((day) => {\n return (\n <CalendarDay\n key={formatDate(day.date, locale)}\n day={day.date}\n renderDayContents={renderDayContents}\n month={date}\n TooltipProps={TooltipProps}\n />\n );\n })}\n </div>\n </div>\n );\n },\n);\n"],"names":["CalendarMonth","calendarMonthCss"],"mappings":";;;;;;;;;;;AAwBA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,IAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA,YAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA;AAAA,MACJ,KAAA,EAAO,EAAE,MAAO,EAAA;AAAA,MAChB,OAAA,EAAS,EAAE,cAAe,EAAA;AAAA,QACxB,kBAAmB,EAAA,CAAA;AACvB,IAAM,MAAA,IAAA,GAAO,mBAAoB,CAAA,IAAA,EAAM,MAAM,CAAA,CAAA;AAE7C,IAAM,MAAA,gBAAA,GAAmB,CAAC,KAA0B,KAAA;AAClD,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA,CAAA;AAC1B,MAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACjB,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,YAAc,EAAA,gBAAA;AAAA,MACb,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,aAAY,EAAA,kBAAA;AAAA,QACZ,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,QAEjC,QAAA,EAAA,IAAA,CAAK,GAAI,CAAA,CAAC,GAAQ,KAAA;AACjB,UAAA,uBACG,GAAA,CAAA,WAAA,EAAA;AAAA,YAEC,KAAK,GAAI,CAAA,IAAA;AAAA,YACT,iBAAA;AAAA,YACA,KAAO,EAAA,IAAA;AAAA,YACP,YAAA;AAAA,WAAA,EAJK,UAAW,CAAA,GAAA,CAAI,IAAM,EAAA,MAAM,CAKlC,CAAA,CAAA;AAAA,SAEH,CAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"CalendarMonth.js","sources":["../src/calendar/internal/CalendarMonth.tsx"],"sourcesContent":["import type { DateValue } from \"@internationalized/date\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithRef,\n type MouseEvent,\n type SyntheticEvent,\n forwardRef,\n} from \"react\";\nimport { CalendarDay, type CalendarDayProps } from \"./CalendarDay\";\nimport { formatDate, generateVisibleDays } from \"./utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useCalendarContext } from \"./CalendarContext\";\nimport calendarMonthCss from \"./CalendarMonth.css\";\n\nexport interface CalendarMonthProps extends ComponentPropsWithRef<\"div\"> {\n /**\n * Month to render as selectable dates\n */\n date: DateValue;\n /**\n * Function to render the contents of a day.\n */\n renderDayContents?: CalendarDayProps[\"renderDayContents\"];\n /**\n * Props for the tooltip component.\n */\n TooltipProps?: CalendarDayProps[\"TooltipProps\"];\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarMonth\");\n\nexport const CalendarMonth = forwardRef<HTMLDivElement, CalendarMonthProps>(\n function CalendarMonth(props, ref) {\n const {\n className,\n date,\n renderDayContents,\n onMouseLeave,\n TooltipProps,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-month\",\n css: calendarMonthCss,\n window: targetWindow,\n });\n\n const {\n state: { locale },\n helpers: { setHoveredDate },\n } = useCalendarContext();\n const days = generateVisibleDays(date, locale);\n\n const handleMouseLeave = (event: SyntheticEvent) => {\n setHoveredDate(event, null);\n onMouseLeave?.(event as MouseEvent<HTMLDivElement>);\n };\n\n return (\n <div\n className={clsx(withBaseName(), className)}\n ref={ref}\n onMouseLeave={handleMouseLeave}\n {...rest}\n >\n <div\n data-testid=\"CalendarDateGrid\"\n className={withBaseName(\"dateGrid\")}\n >\n {days.map((day) => {\n return (\n <CalendarDay\n key={formatDate(day.date, locale)}\n day={day.date}\n renderDayContents={renderDayContents}\n month={date}\n TooltipProps={TooltipProps}\n />\n );\n })}\n </div>\n </div>\n );\n },\n);\n"],"names":["CalendarMonth","calendarMonthCss"],"mappings":";;;;;;;;;;;AAgCA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,IAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA,YAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA;AAAA,MACJ,KAAA,EAAO,EAAE,MAAO,EAAA;AAAA,MAChB,OAAA,EAAS,EAAE,cAAe,EAAA;AAAA,QACxB,kBAAmB,EAAA,CAAA;AACvB,IAAM,MAAA,IAAA,GAAO,mBAAoB,CAAA,IAAA,EAAM,MAAM,CAAA,CAAA;AAE7C,IAAM,MAAA,gBAAA,GAAmB,CAAC,KAA0B,KAAA;AAClD,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA,CAAA;AAC1B,MAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACjB,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,YAAc,EAAA,gBAAA;AAAA,MACb,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,aAAY,EAAA,kBAAA;AAAA,QACZ,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,QAEjC,QAAA,EAAA,IAAA,CAAK,GAAI,CAAA,CAAC,GAAQ,KAAA;AACjB,UAAA,uBACG,GAAA,CAAA,WAAA,EAAA;AAAA,YAEC,KAAK,GAAI,CAAA,IAAA;AAAA,YACT,iBAAA;AAAA,YACA,KAAO,EAAA,IAAA;AAAA,YACP,YAAA;AAAA,WAAA,EAJK,UAAW,CAAA,GAAA,CAAI,IAAM,EAAA,MAAM,CAKlC,CAAA,CAAA;AAAA,SAEH,CAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -26,8 +26,7 @@ function useCalendar(props) {
26
26
  maxDate,
27
27
  selectionVariant,
28
28
  onHoveredDateChange,
29
- hoveredDate,
30
- select
29
+ hoveredDate
31
30
  } = props;
32
31
  const [visibleMonth, setVisibleMonthState] = useControlled({
33
32
  controlled: visibleMonthProp ? startOfMonth(visibleMonthProp) : void 0,
@@ -66,8 +65,7 @@ function useCalendar(props) {
66
65
  isDaySelectable,
67
66
  selectionVariant,
68
67
  onHoveredDateChange,
69
- hoveredDate,
70
- select
68
+ hoveredDate
71
69
  });
72
70
  const [calendarFocused, setCalendarFocused] = useState(false);
73
71
  const isInVisibleMonth = useCallback(