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

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 (44) hide show
  1. package/css/salt-lab.css +38 -14
  2. package/dist-cjs/calendar/Calendar.js +2 -0
  3. package/dist-cjs/calendar/Calendar.js.map +1 -1
  4. package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
  5. package/dist-cjs/calendar/internal/CalendarNavigation.js +3 -0
  6. package/dist-cjs/calendar/internal/CalendarNavigation.js.map +1 -1
  7. package/dist-cjs/date-input/DateInput.css.js +1 -1
  8. package/dist-cjs/date-input/DateInput.js +3 -1
  9. package/dist-cjs/date-input/DateInput.js.map +1 -1
  10. package/dist-cjs/date-picker/DatePicker.js +4 -2
  11. package/dist-cjs/date-picker/DatePicker.js.map +1 -1
  12. package/dist-cjs/date-picker/DatePickerPanel.css.js +1 -1
  13. package/dist-cjs/dropdown/Dropdown.css.js +1 -1
  14. package/dist-cjs/dropdown/DropdownBase.js +1 -1
  15. package/dist-cjs/dropdown/DropdownBase.js.map +1 -1
  16. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.css.js +1 -1
  17. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js +29 -25
  18. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  19. package/dist-cjs/tabs/Tabstrip.css.js +1 -1
  20. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.css.js +1 -1
  21. package/dist-es/calendar/Calendar.js +2 -0
  22. package/dist-es/calendar/Calendar.js.map +1 -1
  23. package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
  24. package/dist-es/calendar/internal/CalendarNavigation.js +3 -0
  25. package/dist-es/calendar/internal/CalendarNavigation.js.map +1 -1
  26. package/dist-es/date-input/DateInput.css.js +1 -1
  27. package/dist-es/date-input/DateInput.js +3 -1
  28. package/dist-es/date-input/DateInput.js.map +1 -1
  29. package/dist-es/date-picker/DatePicker.js +5 -3
  30. package/dist-es/date-picker/DatePicker.js.map +1 -1
  31. package/dist-es/date-picker/DatePickerPanel.css.js +1 -1
  32. package/dist-es/dropdown/Dropdown.css.js +1 -1
  33. package/dist-es/dropdown/DropdownBase.js +1 -1
  34. package/dist-es/dropdown/DropdownBase.js.map +1 -1
  35. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.css.js +1 -1
  36. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js +30 -26
  37. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  38. package/dist-es/tabs/Tabstrip.css.js +1 -1
  39. package/dist-es/toolbar/overflow-panel/OverflowPanel.css.js +1 -1
  40. package/dist-types/calendar/Calendar.d.ts +1 -0
  41. package/dist-types/calendar/internal/CalendarNavigation.d.ts +1 -0
  42. package/dist-types/date-input/DateInput.d.ts +4 -0
  43. package/dist-types/stepped-tracker/TrackerStep/TrackerStep.d.ts +11 -3
  44. package/package.json +2 -2
package/css/salt-lab.css CHANGED
@@ -815,12 +815,15 @@
815
815
 
816
816
  /* src/date-input/DateInput.css */
817
817
  .saltDateInput {
818
+ --input-border: none;
818
819
  --input-borderColor: var(--salt-editable-borderColor);
819
820
  --input-borderStyle: var(--salt-editable-borderStyle);
820
821
  --input-outlineColor: var(--salt-focused-outlineColor);
821
822
  --input-borderWidth: var(--salt-size-border);
822
823
  align-items: center;
823
824
  background: var(--saltDateInput-background, var(--input-background));
825
+ border: var(--input-border);
826
+ border-radius: var(--salt-palette-corner-weak, 0);
824
827
  color: var(--saltDateInput-color, var(--salt-content-primary-foreground));
825
828
  display: inline-flex;
826
829
  gap: var(--salt-spacing-50);
@@ -835,6 +838,7 @@
835
838
  position: relative;
836
839
  width: 100%;
837
840
  box-sizing: border-box;
841
+ overflow: hidden;
838
842
  }
839
843
  .saltDateInput:hover {
840
844
  --input-borderStyle: var(--salt-editable-borderStyle-hover);
@@ -953,6 +957,18 @@
953
957
  position: absolute;
954
958
  border-bottom: var(--input-borderWidth) var(--input-borderStyle) var(--input-borderColor);
955
959
  }
960
+ .saltDateInput.saltDateInput-bordered {
961
+ --input-border: var(--salt-size-border) var(--salt-container-borderStyle) var(--input-borderColor);
962
+ --input-borderWidth: 0;
963
+ }
964
+ .saltDateInput-bordered.saltDateInput-focused,
965
+ .saltDateInput-bordered:active {
966
+ --input-borderWidth: var(--salt-editable-borderWidth-active);
967
+ }
968
+ .saltDateInput-bordered.saltDateInput-readOnly,
969
+ .saltDateInput-bordered.saltDateInput-disabled:hover {
970
+ --input-borderWidth: 0;
971
+ }
956
972
  .saltDateInput-endAdornmentContainer {
957
973
  display: inline-flex;
958
974
  padding-left: var(--salt-spacing-100);
@@ -1031,16 +1047,16 @@
1031
1047
  }
1032
1048
 
1033
1049
  /* src/dropdown/Dropdown.css */
1034
- .saltDropdown {
1050
+ .saltDropdownBase {
1035
1051
  --saltIcon-margin: 2px 0 0 8px;
1036
1052
  display: inline-block;
1037
1053
  line-height: 0;
1038
1054
  position: relative;
1039
1055
  }
1040
- .saltDropdown-fullWidth {
1056
+ .saltDropdownBase-fullWidth {
1041
1057
  width: 100%;
1042
1058
  }
1043
- .saltDropdown-popup {
1059
+ .saltDropdownBase-popup {
1044
1060
  background: var(--salt-container-primary-background);
1045
1061
  z-index: calc(var(--salt-zIndex-flyover) - 1);
1046
1062
  }
@@ -2844,10 +2860,10 @@
2844
2860
  height: var(--tabs-tabstrip-height);
2845
2861
  }
2846
2862
  .saltTabstrip-addButton,
2847
- .saltDropdown.saltTabstrip-overflowMenu {
2863
+ .saltDropdownBase.saltTabstrip-overflowMenu {
2848
2864
  margin-left: var(--salt-size-unit);
2849
2865
  }
2850
- .saltTabstrip-overflowMenu.saltDropdown {
2866
+ .saltTabstrip-overflowMenu.saltDropdownBase {
2851
2867
  --saltIcon-margin: 2px 0 0 0px;
2852
2868
  }
2853
2869
  .saltTabstrip-overflowMenu-open {
@@ -3855,9 +3871,6 @@
3855
3871
  background: var(--salt-accent-background);
3856
3872
  position: absolute;
3857
3873
  }
3858
- .saltCalendarDay-disabled {
3859
- color: var(--salt-content-secondary-foreground-disabled);
3860
- }
3861
3874
  .saltCalendarDay-unselectable:after {
3862
3875
  content: "";
3863
3876
  height: var(--salt-size-border);
@@ -3871,6 +3884,10 @@
3871
3884
  border-bottom: var(--salt-size-indicator) var(--salt-selectable-borderStyle) var(--salt-accent-borderColor);
3872
3885
  margin-bottom: calc(var(--salt-size-indicator) * -1);
3873
3886
  }
3887
+ .saltCalendarDay-disabled,
3888
+ .saltCalendarDay-disabled:hover {
3889
+ color: var(--salt-content-secondary-foreground-disabled);
3890
+ }
3874
3891
  .saltCalendarDay-hidden {
3875
3892
  visibility: hidden;
3876
3893
  }
@@ -3976,6 +3993,8 @@
3976
3993
  .saltTrackerStep {
3977
3994
  --trackerStep-icon-color-active: var(--saltTrackerStep-icon-color-active, var(--salt-status-info-foreground-decorative));
3978
3995
  --trackerStep-icon-color-completed: var(--saltTrackerStep-icon-color-completed, var(--salt-status-success-foreground-decorative));
3996
+ --trackerStep-icon-color-warning: var(--saltTrackerStep-icon-color-warning, var(--salt-status-warning-foreground-decorative));
3997
+ --trackerStep-icon-color-error: var(--saltTrackerStep-icon-color-error, var(--salt-status-error-foreground-decorative));
3979
3998
  --trackerStep-icon-color: var(--saltTrackerStep-icon-color, var(--salt-status-static-foreground));
3980
3999
  --saltIcon-color: var(--trackerStep-icon-color);
3981
4000
  --saltIcon-size: var(--saltTrackerStep-icon-size, max(var(--salt-size-icon), 12px));
@@ -4015,10 +4034,16 @@
4015
4034
  align-items: center;
4016
4035
  flex-direction: column;
4017
4036
  }
4037
+ .saltTrackerStep.saltTrackerStep-status-warning {
4038
+ --trackerStep-icon-color: var(--trackerStep-icon-color-warning);
4039
+ }
4040
+ .saltTrackerStep.saltTrackerStep-status-error {
4041
+ --trackerStep-icon-color: var(--trackerStep-icon-color-error);
4042
+ }
4018
4043
  .saltTrackerStep.saltTrackerStep-active {
4019
4044
  --trackerStep-icon-color: var(--trackerStep-icon-color-active);
4020
4045
  }
4021
- .saltTrackerStep.saltTrackerStep-completed {
4046
+ .saltTrackerStep.saltTrackerStep-stage-completed {
4022
4047
  --trackerStep-icon-color: var(--trackerStep-icon-color-completed);
4023
4048
  }
4024
4049
 
@@ -4083,14 +4108,13 @@
4083
4108
  }
4084
4109
 
4085
4110
  /* src/toolbar/overflow-panel/OverflowPanel.css */
4086
- .saltOverflowPanel.saltDropdown-popup {
4111
+ .saltOverflowPanel.saltDropdownBase-popup {
4087
4112
  background: var(--salt-container-primary-background);
4088
4113
  border: solid 1px var(--salt-selectable-borderColor-hover);
4089
4114
  box-shadow: var(--salt-overlayable-shadow-popout);
4090
4115
  }
4091
4116
  .saltOverflowPanel-content {
4092
4117
  --saltButton-justifyContent: flex-start;
4093
- --saltDropdown-popup-maxHeight: auto;
4094
4118
  align-items: stretch;
4095
4119
  color: var(--salt-content-primary-foreground);
4096
4120
  border: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-container-primary-borderColor);
@@ -4104,10 +4128,10 @@
4104
4128
  --saltButton-background-hover: var(--salt-actionable-secondary-background-active);
4105
4129
  --saltIcon-color: var(--salt-actionable-secondary-foreground-active);
4106
4130
  }
4107
- .saltOverflowPanel.saltDropdown {
4131
+ .saltOverflowPanel.saltDropdownBase {
4108
4132
  --saltIcon-margin: 2px 0 0 0px;
4109
4133
  }
4110
- .saltOverflowPanel.saltDropdown-popup .saltFormFieldLegacy:not(.saltFormFieldLegacy-toolbarButton) {
4134
+ .saltOverflowPanel.saltDropdownBase-popup .saltFormFieldLegacy:not(.saltFormFieldLegacy-toolbarButton) {
4111
4135
  --saltFormFieldLegacy-margin: 0 12px 8px 12px;
4112
4136
  }
4113
4137
 
@@ -4118,4 +4142,4 @@
4118
4142
  margin: calc(var(--salt-size-unit) / 2) 0;
4119
4143
  }
4120
4144
 
4121
- /* src/25e0b94f-2ace-4ed1-acbe-34518ed5a1f5.css */
4145
+ /* src/ba816afd-b240-4e0e-8f09-cb5a1606dd53.css */
@@ -25,6 +25,7 @@ const Calendar = react.forwardRef(
25
25
  renderDayContents,
26
26
  hideYearDropdown,
27
27
  TooltipProps,
28
+ borderedDropdown,
28
29
  ...rest
29
30
  } = props;
30
31
  const targetWindow = window.useWindow();
@@ -60,6 +61,7 @@ const Calendar = react.forwardRef(
60
61
  ref,
61
62
  children: [
62
63
  /* @__PURE__ */ jsxRuntime.jsx(CalendarNavigation.CalendarNavigation, {
64
+ borderedDropdown,
63
65
  hideYearDropdown
64
66
  }),
65
67
  /* @__PURE__ */ jsxRuntime.jsx(CalendarWeekHeader.CalendarWeekHeader, {}),
@@ -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 { forwardRef, useCallback } from \"react\";\nimport {\n CalendarCarousel,\n type CalendarCarouselProps,\n} from \"./internal/CalendarCarousel\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n CalendarNavigation,\n type CalendarNavigationProps,\n} from \"./internal/CalendarNavigation\";\nimport { CalendarWeekHeader } from \"./internal/CalendarWeekHeader\";\nimport { useCalendar, type useCalendarProps } from \"./useCalendar\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { DateFormatter, getLocalTimeZone } from \"@internationalized/date\";\nimport calendarCss from \"./Calendar.css\";\nimport { getCurrentLocale } from \"./internal/utils\";\n\nexport type CalendarProps = useCalendarProps & {\n className?: string;\n renderDayContents?: CalendarCarouselProps[\"renderDayContents\"];\n hideYearDropdown?: CalendarNavigationProps[\"hideYearDropdown\"];\n TooltipProps?: CalendarCarouselProps[\"TooltipProps\"];\n hideOutOfRangeDates?: CalendarCarouselProps[\"hideOutOfRangeDates\"];\n};\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n function Calendar(props, ref) {\n const {\n className,\n renderDayContents,\n hideYearDropdown,\n TooltipProps,\n ...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 hideYearDropdown,\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(getCurrentLocale(), {\n month: \"long\",\n year: \"numeric\",\n }).format(state.visibleMonth.toDate(getLocalTimeZone()));\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 <CalendarNavigation hideYearDropdown={hideYearDropdown} />\n <CalendarWeekHeader />\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":["makePrefixer","forwardRef","Calendar","useWindow","useComponentCssInjection","calendarCss","useCalendar","useCallback","DateFormatter","getCurrentLocale","getLocalTimeZone","jsx","CalendarContext","jsxs","clsx","CalendarNavigation","CalendarWeekHeader","CalendarCarousel"],"mappings":";;;;;;;;;;;;;;;;;;;AA8BA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA,CAAA;AAEzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,YAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,eAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,OAAQ,EAAA,GAAIC,uBAAY,CAAA;AAAA,MACrC,gBAAA;AAAA,MACA,GAAG,IAAA;AAAA,KACJ,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,oBAAuB,GAAA,OAAA,CAAA;AAE/B,IAAM,MAAA,WAAA,GAAcC,kBAAY,MAAM;AACpC,MAAA,kBAAA,CAAmB,IAAI,CAAA,CAAA;AAAA,KACzB,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAM,MAAA,UAAA,GAAaA,kBAAY,MAAM;AACnC,MAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAAA,KAC1B,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAA,MAAM,aAAgB,GAAA,IAAIC,kBAAc,CAAAC,sBAAA,EAAoB,EAAA;AAAA,MAC1D,KAAO,EAAA,MAAA;AAAA,MACP,IAAM,EAAA,SAAA;AAAA,KACP,EAAE,MAAO,CAAA,KAAA,CAAM,aAAa,MAAO,CAAAC,qBAAA,EAAkB,CAAC,CAAA,CAAA;AACvD,IACE,uBAAAC,cAAA,CAACC,gCAAgB,QAAhB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,OAAA;AAAA,OACF;AAAA,MAEA,QAAC,kBAAAC,eAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,aAAA;AAAA,QACL,YAAY,EAAA,aAAA;AAAA,QACZ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAACH,cAAA,CAAAI,qCAAA,EAAA;AAAA,YAAmB,gBAAA;AAAA,WAAoC,CAAA;AAAA,yCACvDC,qCAAmB,EAAA,EAAA,CAAA;AAAA,0BACnBL,cAAA,CAAAM,iCAAA,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 { forwardRef, useCallback } from \"react\";\nimport {\n CalendarCarousel,\n type CalendarCarouselProps,\n} from \"./internal/CalendarCarousel\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n CalendarNavigation,\n type CalendarNavigationProps,\n} from \"./internal/CalendarNavigation\";\nimport { CalendarWeekHeader } from \"./internal/CalendarWeekHeader\";\nimport { useCalendar, type useCalendarProps } from \"./useCalendar\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { DateFormatter, getLocalTimeZone } from \"@internationalized/date\";\nimport calendarCss from \"./Calendar.css\";\nimport { getCurrentLocale } from \"./internal/utils\";\n\nexport type CalendarProps = useCalendarProps & {\n className?: string;\n renderDayContents?: CalendarCarouselProps[\"renderDayContents\"];\n hideYearDropdown?: CalendarNavigationProps[\"hideYearDropdown\"];\n borderedDropdown?: CalendarNavigationProps[\"borderedDropdown\"];\n TooltipProps?: CalendarCarouselProps[\"TooltipProps\"];\n hideOutOfRangeDates?: CalendarCarouselProps[\"hideOutOfRangeDates\"];\n};\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n function Calendar(props, ref) {\n const {\n className,\n renderDayContents,\n hideYearDropdown,\n TooltipProps,\n borderedDropdown,\n ...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 hideYearDropdown,\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(getCurrentLocale(), {\n month: \"long\",\n year: \"numeric\",\n }).format(state.visibleMonth.toDate(getLocalTimeZone()));\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 <CalendarNavigation\n borderedDropdown={borderedDropdown}\n hideYearDropdown={hideYearDropdown}\n />\n <CalendarWeekHeader />\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":["makePrefixer","forwardRef","Calendar","useWindow","useComponentCssInjection","calendarCss","useCalendar","useCallback","DateFormatter","getCurrentLocale","getLocalTimeZone","jsx","CalendarContext","jsxs","clsx","CalendarNavigation","CalendarWeekHeader","CalendarCarousel"],"mappings":";;;;;;;;;;;;;;;;;;;AA+BA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA,CAAA;AAEzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,YAAA;AAAA,MACA,gBAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,eAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,OAAQ,EAAA,GAAIC,uBAAY,CAAA;AAAA,MACrC,gBAAA;AAAA,MACA,GAAG,IAAA;AAAA,KACJ,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,oBAAuB,GAAA,OAAA,CAAA;AAE/B,IAAM,MAAA,WAAA,GAAcC,kBAAY,MAAM;AACpC,MAAA,kBAAA,CAAmB,IAAI,CAAA,CAAA;AAAA,KACzB,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAM,MAAA,UAAA,GAAaA,kBAAY,MAAM;AACnC,MAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAAA,KAC1B,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,IAAA,MAAM,aAAgB,GAAA,IAAIC,kBAAc,CAAAC,sBAAA,EAAoB,EAAA;AAAA,MAC1D,KAAO,EAAA,MAAA;AAAA,MACP,IAAM,EAAA,SAAA;AAAA,KACP,EAAE,MAAO,CAAA,KAAA,CAAM,aAAa,MAAO,CAAAC,qBAAA,EAAkB,CAAC,CAAA,CAAA;AACvD,IACE,uBAAAC,cAAA,CAACC,gCAAgB,QAAhB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,OAAA;AAAA,OACF;AAAA,MAEA,QAAC,kBAAAC,eAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,aAAA;AAAA,QACL,YAAY,EAAA,aAAA;AAAA,QACZ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAACH,cAAA,CAAAI,qCAAA,EAAA;AAAA,YACC,gBAAA;AAAA,YACA,gBAAA;AAAA,WACF,CAAA;AAAA,yCACCC,qCAAmB,EAAA,EAAA,CAAA;AAAA,0BACnBL,cAAA,CAAAM,iCAAA,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,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- 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-disabled {\n color: var(--salt-content-secondary-foreground-disabled);\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-hidden {\n visibility: hidden;\n}\n";
3
+ 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";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=CalendarDay.css.js.map
@@ -97,6 +97,7 @@ const CalendarNavigation = react.forwardRef(function CalendarNavigation2(props,
97
97
  MonthDropdownProps,
98
98
  YearDropdownProps,
99
99
  hideYearDropdown,
100
+ borderedDropdown,
100
101
  ...rest
101
102
  } = props;
102
103
  const targetWindow = window.useWindow();
@@ -165,6 +166,7 @@ const CalendarNavigation = react.forwardRef(function CalendarNavigation2(props,
165
166
  className: withBaseName("dropdowns"),
166
167
  children: [
167
168
  /* @__PURE__ */ jsxRuntime.jsx(core.Dropdown, {
169
+ bordered: borderedDropdown,
168
170
  "aria-label": "Month Dropdown",
169
171
  selected: selectedMonth ? [selectedMonth] : [],
170
172
  value: formatMonth(selectedMonth),
@@ -182,6 +184,7 @@ const CalendarNavigation = react.forwardRef(function CalendarNavigation2(props,
182
184
  selected: selectedYear ? [selectedYear] : [],
183
185
  value: formatYear(selectedYear),
184
186
  onSelectionChange: handleYearSelect,
187
+ bordered: borderedDropdown,
185
188
  ...YearDropdownProps,
186
189
  children: years.map((year) => /* @__PURE__ */ jsxRuntime.jsx(OptionWithTooltip, {
187
190
  value: year,
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/internal/CalendarNavigation.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Dropdown,\n type DropdownProps,\n Option,\n type OptionProps,\n Tooltip,\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} from \"react\";\n\nimport { useCalendarContext } from \"./CalendarContext\";\n\nimport {\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, monthDiff, monthsForLocale } from \"./utils\";\n\ntype dateDropdownProps = DropdownProps<DateValue>;\n\nexport interface CalendarNavigationProps extends ComponentPropsWithRef<\"div\"> {\n MonthDropdownProps?: dateDropdownProps;\n YearDropdownProps?: dateDropdownProps;\n onMonthSelect?: dateDropdownProps[\"onChange\"];\n onYearSelect?: dateDropdownProps[\"onChange\"];\n onNavigateNext?: ButtonProps[\"onClick\"];\n onNavigatePrevious?: ButtonProps[\"onClick\"];\n hideYearDropdown?: boolean;\n}\n\ninterface OptionWithTooltipProps extends OptionProps {\n value: DateValue;\n tooltipContent: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nfunction useCalendarNavigation() {\n const {\n state: { visibleMonth, minDate, maxDate },\n helpers: {\n setVisibleMonth,\n isDayVisible,\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n },\n } = useCalendarContext();\n\n const moveToNextMonth = (event: SyntheticEvent) => {\n setVisibleMonth(event, visibleMonth.add({ months: 1 }));\n };\n\n const moveToPreviousMonth = (event: SyntheticEvent) => {\n setVisibleMonth(event, visibleMonth.subtract({ months: 1 }));\n };\n\n const moveToMonth = (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).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 const months: DateValue[] = monthsForLocale(visibleMonth);\n\n const years: DateValue[] = [-2, -1, 0, 1, 2]\n .map((delta) => visibleMonth.add({ years: delta }))\n .filter((year) => !isOutsideAllowedYears(year));\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 {\n moveToNextMonth,\n moveToPreviousMonth,\n moveToMonth,\n visibleMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n };\n}\n\nconst OptionWithTooltip = ({\n value,\n children,\n disabled,\n tooltipContent,\n}: OptionWithTooltipProps) => {\n const { activeState, openState } = useListControlContext();\n const open = activeState?.value === value;\n\n return (\n <Tooltip\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 </Tooltip>\n );\n};\n\nexport const CalendarNavigation = forwardRef<\n HTMLDivElement,\n CalendarNavigationProps\n>(function CalendarNavigation(props, ref) {\n const {\n className,\n MonthDropdownProps,\n YearDropdownProps,\n hideYearDropdown,\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 visibleMonth,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n } = useCalendarNavigation();\n\n const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> = (\n event,\n ) => {\n moveToPreviousMonth(event);\n };\n\n const handleNavigateNext: MouseEventHandler<HTMLButtonElement> = (event) => {\n moveToNextMonth(event);\n };\n\n const handleMonthSelect = (event: SyntheticEvent, month: DateValue[]) => {\n moveToMonth(event, month[0]);\n };\n\n const handleYearSelect = (event: SyntheticEvent, year: DateValue[]) => {\n moveToMonth(event, year[0]);\n };\n\n const formatMonth = (date?: DateValue) => {\n return !date\n ? \"\"\n : formatDate(date, { month: hideYearDropdown ? \"long\" : \"short\" });\n };\n\n const formatYear = (date?: DateValue) => {\n return !date ? \"\" : formatDate(date, { year: \"numeric\" });\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 <Tooltip\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 </Tooltip>\n <div className={withBaseName(\"dropdowns\")}>\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\n key={formatYear(year)}\n value={year}\n tooltipContent=\"This year is out of range\"\n >\n {formatYear(year)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n )}\n </div>\n <Tooltip\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 </Tooltip>\n </div>\n );\n});\n"],"names":["makePrefixer","useCalendarContext","monthsForLocale","monthDiff","isSameMonth","isSameYear","useListControlContext","jsx","Tooltip","Option","forwardRef","CalendarNavigation","useWindow","useComponentCssInjection","calendarNavigationCss","formatDate","jsxs","clsx","Button","ChevronLeftIcon","Dropdown","ChevronRightIcon"],"mappings":"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"}
1
+ {"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/internal/CalendarNavigation.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Dropdown,\n type DropdownProps,\n Option,\n type OptionProps,\n Tooltip,\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} from \"react\";\n\nimport { useCalendarContext } from \"./CalendarContext\";\n\nimport {\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, monthDiff, monthsForLocale } from \"./utils\";\n\ntype dateDropdownProps = DropdownProps<DateValue>;\n\nexport interface CalendarNavigationProps extends ComponentPropsWithRef<\"div\"> {\n MonthDropdownProps?: dateDropdownProps;\n YearDropdownProps?: dateDropdownProps;\n onMonthSelect?: dateDropdownProps[\"onChange\"];\n onYearSelect?: dateDropdownProps[\"onChange\"];\n borderedDropdown?: dateDropdownProps[\"bordered\"];\n onNavigateNext?: ButtonProps[\"onClick\"];\n onNavigatePrevious?: ButtonProps[\"onClick\"];\n hideYearDropdown?: boolean;\n}\n\ninterface OptionWithTooltipProps extends OptionProps {\n value: DateValue;\n tooltipContent: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nfunction useCalendarNavigation() {\n const {\n state: { visibleMonth, minDate, maxDate },\n helpers: {\n setVisibleMonth,\n isDayVisible,\n isOutsideAllowedYears,\n isOutsideAllowedMonths,\n },\n } = useCalendarContext();\n\n const moveToNextMonth = (event: SyntheticEvent) => {\n setVisibleMonth(event, visibleMonth.add({ months: 1 }));\n };\n\n const moveToPreviousMonth = (event: SyntheticEvent) => {\n setVisibleMonth(event, visibleMonth.subtract({ months: 1 }));\n };\n\n const moveToMonth = (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).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 const months: DateValue[] = monthsForLocale(visibleMonth);\n\n const years: DateValue[] = [-2, -1, 0, 1, 2]\n .map((delta) => visibleMonth.add({ years: delta }))\n .filter((year) => !isOutsideAllowedYears(year));\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 {\n moveToNextMonth,\n moveToPreviousMonth,\n moveToMonth,\n visibleMonth,\n months,\n years,\n canNavigateNext,\n canNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n };\n}\n\nconst OptionWithTooltip = ({\n value,\n children,\n disabled,\n tooltipContent,\n}: OptionWithTooltipProps) => {\n const { activeState, openState } = useListControlContext();\n const open = activeState?.value === value;\n\n return (\n <Tooltip\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 </Tooltip>\n );\n};\n\nexport const CalendarNavigation = forwardRef<\n HTMLDivElement,\n CalendarNavigationProps\n>(function CalendarNavigation(props, ref) {\n const {\n className,\n MonthDropdownProps,\n YearDropdownProps,\n hideYearDropdown,\n borderedDropdown,\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 visibleMonth,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n } = useCalendarNavigation();\n\n const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> = (\n event,\n ) => {\n moveToPreviousMonth(event);\n };\n\n const handleNavigateNext: MouseEventHandler<HTMLButtonElement> = (event) => {\n moveToNextMonth(event);\n };\n\n const handleMonthSelect = (event: SyntheticEvent, month: DateValue[]) => {\n moveToMonth(event, month[0]);\n };\n\n const handleYearSelect = (event: SyntheticEvent, year: DateValue[]) => {\n moveToMonth(event, year[0]);\n };\n\n const formatMonth = (date?: DateValue) => {\n return !date\n ? \"\"\n : formatDate(date, { month: hideYearDropdown ? \"long\" : \"short\" });\n };\n\n const formatYear = (date?: DateValue) => {\n return !date ? \"\" : formatDate(date, { year: \"numeric\" });\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 <Tooltip\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 </Tooltip>\n <div className={withBaseName(\"dropdowns\")}>\n <Dropdown\n bordered={borderedDropdown}\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 bordered={borderedDropdown}\n {...YearDropdownProps}\n >\n {years.map((year) => (\n <OptionWithTooltip\n key={formatYear(year)}\n value={year}\n tooltipContent=\"This year is out of range\"\n >\n {formatYear(year)}\n </OptionWithTooltip>\n ))}\n </Dropdown>\n )}\n </div>\n <Tooltip\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 </Tooltip>\n </div>\n );\n});\n"],"names":["makePrefixer","useCalendarContext","monthsForLocale","monthDiff","isSameMonth","isSameYear","useListControlContext","jsx","Tooltip","Option","forwardRef","CalendarNavigation","useWindow","useComponentCssInjection","calendarNavigationCss","formatDate","jsxs","clsx","Button","ChevronLeftIcon","Dropdown","ChevronRightIcon"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = "/* Style applied to the root element */\n.saltDateInput {\n --input-borderColor: var(--salt-editable-borderColor);\n --input-borderStyle: var(--salt-editable-borderStyle);\n --input-outlineColor: var(--salt-focused-outlineColor);\n --input-borderWidth: var(--salt-size-border);\n\n align-items: center;\n background: var(--saltDateInput-background, var(--input-background));\n color: var(--saltDateInput-color, var(--salt-content-primary-foreground));\n display: inline-flex;\n gap: var(--salt-spacing-50);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));\n height: var(--saltDateInput-height, var(--salt-size-base));\n line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));\n min-height: var(--saltDateInput-minHeight, var(--salt-size-base));\n min-width: var(--saltDateInput-minWidth, 4em);\n padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));\n padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));\n position: relative;\n width: 100%;\n box-sizing: border-box;\n}\n\n.saltDateInput:hover {\n --input-borderStyle: var(--salt-editable-borderStyle-hover);\n --input-borderColor: var(--salt-editable-borderColor-hover);\n\n background: var(--saltDateInput-background-hover, var(--input-background-hover));\n cursor: var(--salt-editable-cursor-hover);\n}\n\n.saltDateInput:active {\n --input-borderColor: var(--salt-editable-borderColor-active);\n --input-borderStyle: var(--salt-editable-borderStyle-active);\n --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n background: var(--saltDateInput-background-active, var(--input-background-active));\n cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltDateInput-primary {\n --input-background: var(--salt-editable-primary-background);\n --input-background-active: var(--salt-editable-primary-background-active);\n --input-background-hover: var(--salt-editable-primary-background-hover);\n --input-background-disabled: var(--salt-editable-primary-background-disabled);\n --input-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltDateInput-secondary {\n --input-background: var(--salt-editable-secondary-background);\n --input-background-active: var(--salt-editable-secondary-background-active);\n --input-background-hover: var(--salt-editable-secondary-background-active);\n --input-background-disabled: var(--salt-editable-secondary-background-disabled);\n --input-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltDateInput-error,\n.saltDateInput-error:hover {\n --input-background: var(--salt-status-error-background);\n --input-background-active: var(--salt-status-error-background);\n --input-background-hover: var(--salt-status-error-background);\n --input-borderColor: var(--salt-status-error-borderColor);\n --input-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltDateInput-warning,\n.saltDateInput-warning:hover {\n --input-background: var(--salt-status-warning-background);\n --input-background-active: var(--salt-status-warning-background);\n --input-background-hover: var(--salt-status-warning-background);\n --input-borderColor: var(--salt-status-warning-borderColor);\n --input-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltDateInput-success,\n.saltDateInput-success:hover {\n --input-background: var(--salt-status-success-background);\n --input-background-active: var(--salt-status-success-background);\n --input-background-hover: var(--salt-status-success-background);\n --input-borderColor: var(--salt-status-success-borderColor);\n --input-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Style applied to inner input component */\n.saltDateInput-input {\n background: none;\n border: none;\n box-sizing: content-box;\n color: inherit;\n cursor: inherit;\n display: block;\n font: inherit;\n height: 100%;\n letter-spacing: var(--saltDateInput-letterSpacing, 0);\n margin: 0;\n min-width: 0;\n overflow: hidden;\n padding: 0;\n text-align: left;\n width: min-content;\n}\n\n/* Reset in the class */\n.saltDateInput-input:focus {\n outline: none;\n}\n\n/* Style applied to selected input */\n.saltDateInput-input::selection {\n background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to placeholder text */\n.saltDateInput-input::placeholder {\n color: var(--salt-content-secondary-foreground);\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Styling when focused */\n.saltDateInput-focused {\n --input-borderColor: var(--input-outlineColor);\n --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltDateInput.saltDateInput-readOnly {\n --input-borderColor: var(--salt-editable-borderColor-readonly);\n --input-borderStyle: var(--salt-editable-borderStyle-readonly);\n --input-borderWidth: var(--salt-size-border);\n\n background: var(--input-background-readonly);\n cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltDateInput-focused.saltDateInput-disabled {\n --input-borderWidth: var(--salt-size-border);\n outline: none;\n}\n\n/* Styling when focused if `readOnly={true}` */\n.saltDateInput-focused.saltDateInput-readOnly {\n --input-borderWidth: var(--salt-size-border);\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltDateInput-disabled .saltDateInput-input::selection {\n background: none;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltDateInput.saltDateInput-disabled,\n.saltDateInput.saltDateInput-disabled:hover,\n.saltDateInput.saltDateInput-disabled:active {\n --input-borderColor: var(--salt-editable-borderColor-disabled);\n --input-borderStyle: var(--salt-editable-borderStyle-disabled);\n --input-borderWidth: var(--salt-size-border);\n\n background: var(--input-background-disabled);\n cursor: var(--salt-editable-cursor-disabled);\n color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n.saltDateInput-activationIndicator {\n left: 0;\n bottom: 0;\n width: 100%;\n position: absolute;\n border-bottom: var(--input-borderWidth) var(--input-borderStyle) var(--input-borderColor);\n}\n\n/* Style applied to end adornments */\n.saltDateInput-endAdornmentContainer {\n display: inline-flex;\n padding-left: var(--salt-spacing-100);\n column-gap: var(--salt-spacing-100);\n margin-left: auto;\n align-items: end;\n}\n\n.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {\n margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltDateInput-endAdornmentContainer .saltButton:last-child {\n margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltDateInput-endAdornmentContainer > .saltButton {\n --saltButton-padding: var(--salt-spacing-50);\n --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n";
3
+ var css_248z = "/* Style applied to the root element */\n.saltDateInput {\n --input-border: none;\n --input-borderColor: var(--salt-editable-borderColor);\n --input-borderStyle: var(--salt-editable-borderStyle);\n --input-outlineColor: var(--salt-focused-outlineColor);\n --input-borderWidth: var(--salt-size-border);\n\n align-items: center;\n background: var(--saltDateInput-background, var(--input-background));\n border: var(--input-border);\n border-radius: var(--salt-palette-corner-weak, 0);\n color: var(--saltDateInput-color, var(--salt-content-primary-foreground));\n display: inline-flex;\n gap: var(--salt-spacing-50);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));\n height: var(--saltDateInput-height, var(--salt-size-base));\n line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));\n min-height: var(--saltDateInput-minHeight, var(--salt-size-base));\n min-width: var(--saltDateInput-minWidth, 4em);\n padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));\n padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));\n position: relative;\n width: 100%;\n box-sizing: border-box;\n overflow: hidden;\n}\n\n.saltDateInput:hover {\n --input-borderStyle: var(--salt-editable-borderStyle-hover);\n --input-borderColor: var(--salt-editable-borderColor-hover);\n\n background: var(--saltDateInput-background-hover, var(--input-background-hover));\n cursor: var(--salt-editable-cursor-hover);\n}\n\n.saltDateInput:active {\n --input-borderColor: var(--salt-editable-borderColor-active);\n --input-borderStyle: var(--salt-editable-borderStyle-active);\n --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n background: var(--saltDateInput-background-active, var(--input-background-active));\n cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltDateInput-primary {\n --input-background: var(--salt-editable-primary-background);\n --input-background-active: var(--salt-editable-primary-background-active);\n --input-background-hover: var(--salt-editable-primary-background-hover);\n --input-background-disabled: var(--salt-editable-primary-background-disabled);\n --input-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltDateInput-secondary {\n --input-background: var(--salt-editable-secondary-background);\n --input-background-active: var(--salt-editable-secondary-background-active);\n --input-background-hover: var(--salt-editable-secondary-background-active);\n --input-background-disabled: var(--salt-editable-secondary-background-disabled);\n --input-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltDateInput-error,\n.saltDateInput-error:hover {\n --input-background: var(--salt-status-error-background);\n --input-background-active: var(--salt-status-error-background);\n --input-background-hover: var(--salt-status-error-background);\n --input-borderColor: var(--salt-status-error-borderColor);\n --input-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltDateInput-warning,\n.saltDateInput-warning:hover {\n --input-background: var(--salt-status-warning-background);\n --input-background-active: var(--salt-status-warning-background);\n --input-background-hover: var(--salt-status-warning-background);\n --input-borderColor: var(--salt-status-warning-borderColor);\n --input-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltDateInput-success,\n.saltDateInput-success:hover {\n --input-background: var(--salt-status-success-background);\n --input-background-active: var(--salt-status-success-background);\n --input-background-hover: var(--salt-status-success-background);\n --input-borderColor: var(--salt-status-success-borderColor);\n --input-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Style applied to inner input component */\n.saltDateInput-input {\n background: none;\n border: none;\n box-sizing: content-box;\n color: inherit;\n cursor: inherit;\n display: block;\n font: inherit;\n height: 100%;\n letter-spacing: var(--saltDateInput-letterSpacing, 0);\n margin: 0;\n min-width: 0;\n overflow: hidden;\n padding: 0;\n text-align: left;\n width: min-content;\n}\n\n/* Reset in the class */\n.saltDateInput-input:focus {\n outline: none;\n}\n\n/* Style applied to selected input */\n.saltDateInput-input::selection {\n background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to placeholder text */\n.saltDateInput-input::placeholder {\n color: var(--salt-content-secondary-foreground);\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Styling when focused */\n.saltDateInput-focused {\n --input-borderColor: var(--input-outlineColor);\n --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltDateInput.saltDateInput-readOnly {\n --input-borderColor: var(--salt-editable-borderColor-readonly);\n --input-borderStyle: var(--salt-editable-borderStyle-readonly);\n --input-borderWidth: var(--salt-size-border);\n\n background: var(--input-background-readonly);\n cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltDateInput-focused.saltDateInput-disabled {\n --input-borderWidth: var(--salt-size-border);\n outline: none;\n}\n\n/* Styling when focused if `readOnly={true}` */\n.saltDateInput-focused.saltDateInput-readOnly {\n --input-borderWidth: var(--salt-size-border);\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltDateInput-disabled .saltDateInput-input::selection {\n background: none;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltDateInput.saltDateInput-disabled,\n.saltDateInput.saltDateInput-disabled:hover,\n.saltDateInput.saltDateInput-disabled:active {\n --input-borderColor: var(--salt-editable-borderColor-disabled);\n --input-borderStyle: var(--salt-editable-borderStyle-disabled);\n --input-borderWidth: var(--salt-size-border);\n\n background: var(--input-background-disabled);\n cursor: var(--salt-editable-cursor-disabled);\n color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n.saltDateInput-activationIndicator {\n left: 0;\n bottom: 0;\n width: 100%;\n position: absolute;\n border-bottom: var(--input-borderWidth) var(--input-borderStyle) var(--input-borderColor);\n}\n\n/* Style applied if `bordered={true}` */\n.saltDateInput.saltDateInput-bordered {\n --input-border: var(--salt-size-border) var(--salt-container-borderStyle) var(--input-borderColor);\n --input-borderWidth: 0;\n}\n\n/* Style applied if focused or active when `bordered={true}` */\n.saltDateInput-bordered.saltDateInput-focused,\n.saltDateInput-bordered:active {\n --input-borderWidth: var(--salt-editable-borderWidth-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltDateInput-bordered.saltDateInput-readOnly,\n.saltDateInput-bordered.saltDateInput-disabled:hover {\n --input-borderWidth: 0;\n}\n\n/* Style applied to end adornments */\n.saltDateInput-endAdornmentContainer {\n display: inline-flex;\n padding-left: var(--salt-spacing-100);\n column-gap: var(--salt-spacing-100);\n margin-left: auto;\n align-items: end;\n}\n\n.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {\n margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltDateInput-endAdornmentContainer .saltButton:last-child {\n margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltDateInput-endAdornmentContainer > .saltButton {\n --saltButton-padding: var(--salt-spacing-50);\n --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=DateInput.css.js.map
@@ -56,6 +56,7 @@ const DateInput = react.forwardRef(function DateInput2({
56
56
  readOnly: readOnlyProp,
57
57
  validationStatus: validationStatusProp,
58
58
  variant = "primary",
59
+ bordered = false,
59
60
  dateFormatter = defaultDateFormatter,
60
61
  placeholder = "dd mmm yyyy",
61
62
  startInputRef,
@@ -194,7 +195,8 @@ const DateInput = react.forwardRef(function DateInput2({
194
195
  [withBaseName("focused")]: !isDisabled && focused,
195
196
  [withBaseName("disabled")]: isDisabled,
196
197
  [withBaseName("readOnly")]: isReadOnly,
197
- [withBaseName(validationStatus != null ? validationStatus : "")]: validationStatus
198
+ [withBaseName(validationStatus != null ? validationStatus : "")]: validationStatus,
199
+ [withBaseName("bordered")]: bordered
198
200
  },
199
201
  className
200
202
  ),
@@ -1 +1 @@
1
- {"version":3,"file":"DateInput.js","sources":["../src/date-input/DateInput.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n type FocusEvent,\n type InputHTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n type RefObject,\n type SyntheticEvent,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport {\n CalendarDate,\n DateFormatter,\n type DateValue,\n getLocalTimeZone,\n parseAbsoluteToLocal,\n} from \"@internationalized/date\";\nimport {\n StatusAdornment,\n makePrefixer,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport {\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { useDatePickerContext } from \"../date-picker/DatePickerContext\";\nimport dateInputCss from \"./DateInput.css\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\nconst isInvalidDate = (value: string) =>\n value && Number.isNaN(new Date(value).getDay());\nconst createDate = (date: string): Date | null => {\n if (!date || isInvalidDate(date)) {\n return null;\n }\n return new Date(date);\n};\n\nconst getIsoDate = (date: Date) => {\n try {\n return parseAbsoluteToLocal(date?.toISOString());\n } catch (err) {\n return undefined;\n }\n};\n\nfunction getCalendarDate(inputDate: string) {\n const date = createDate(inputDate);\n if (!date) return undefined;\n const isoDate = getIsoDate(date);\n return isoDate && new CalendarDate(isoDate.year, isoDate.month, isoDate.day);\n}\n\nconst defaultDateFormatter = (date: DateValue | undefined): string => {\n return date\n ? new DateFormatter(\"EN-GB\", {\n day: \"2-digit\",\n month: \"short\",\n year: \"numeric\",\n }).format(date.toDate(getLocalTimeZone()))\n : \"\";\n};\n\nexport interface DateInputProps<SelectionVariantType>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\" | \"onChange\">,\n Pick<ComponentPropsWithoutRef<\"input\">, \"disabled\" | \"placeholder\"> {\n ariaLabel?: string;\n /**\n * The marker to use in an empty read only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes) applied to the `input` elements.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Reference for the startInput;\n */\n startInputRef?: RefObject<HTMLInputElement>;\n /**\n * Reference for the endInput;\n */\n endInputRef?: RefObject<HTMLInputElement>;\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n}\n\nexport const DateInput = forwardRef<\n HTMLDivElement,\n DateInputProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DateInput(\n {\n className,\n disabled,\n \"aria-label\": ariaLabel,\n selectionVariant: selectionVariantProp,\n emptyReadOnlyMarker = \"—\",\n inputProps = {},\n endAdornment,\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n dateFormatter = defaultDateFormatter,\n placeholder = \"dd mmm yyyy\",\n startInputRef,\n endInputRef,\n onSelectionChange,\n onChange,\n ...rest\n },\n ref,\n) {\n const wrapperRef = useRef(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const inputStringFormatter = (input: string): string => {\n const date = getCalendarDate(input);\n return !input || !date ? input : dateFormatter(date);\n };\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-dateInput\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const {\n selectedDate,\n setSelectedDate,\n selectionVariant: pickerSelectionVariant,\n openState,\n setOpen,\n } = useDatePickerContext();\n\n const selectionVariant = selectionVariantProp ?? pickerSelectionVariant;\n const isRangePicker =\n isRangeOrOffsetSelectionWithStartDate(selectedDate) ||\n selectionVariant === \"range\";\n\n const endDateInputID = useId();\n const startDateInputID = useId();\n\n const [focused, setFocused] = useState(false);\n const [startDateStringValue, setStartDateStringValue] = useState<string>(\n dateFormatter(\n isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate,\n ),\n );\n const [endDateStringValue, setEndDateStringValue] = useState<string>(\n dateFormatter(\n isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.endDate\n : undefined,\n ),\n );\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": dateInputDescribedBy,\n \"aria-labelledby\": dateInputLabelledBy,\n onBlur,\n onKeyDown,\n onFocus,\n required: dateInputPropsRequired,\n ...restDateInputProps\n } = inputProps;\n\n // Update date strings when dates change\n useEffect(() => {\n if (isRangeOrOffsetSelectionWithStartDate(selectedDate)) {\n selectedDate?.startDate &&\n setStartDateStringValue(dateFormatter(selectedDate?.startDate));\n selectedDate?.endDate &&\n setEndDateStringValue(dateFormatter(selectedDate?.endDate));\n } else {\n setStartDateStringValue(dateFormatter(selectedDate));\n }\n }, [selectedDate, dateFormatter]);\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : dateInputPropsRequired;\n const updateStartDate = (event: SyntheticEvent, dateString: string) => {\n const inputDate = inputStringFormatter(dateString);\n const calendarDate = getCalendarDate(inputDate);\n const newSelectedDate = isRangePicker\n ? { ...selectedDate, startDate: calendarDate }\n : calendarDate;\n setSelectedDate(newSelectedDate);\n onSelectionChange?.(event, newSelectedDate);\n };\n\n const updateEndDate = (event: SyntheticEvent, dateString: string) => {\n const inputDate = inputStringFormatter(dateString);\n const calendarDate = getCalendarDate(inputDate);\n const newSelectedDate = { ...selectedDate, endDate: calendarDate };\n setSelectedDate(newSelectedDate);\n onSelectionChange?.(event, newSelectedDate);\n };\n\n // Handlers\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n const handleStartDateBlur = (event: FocusEvent<HTMLInputElement>) => {\n updateStartDate(event, event.target.value);\n setFocused(false);\n };\n\n const handleStartDateChange = (event: ChangeEvent<HTMLInputElement>) => {\n const newStartValue = event.target.value;\n setStartDateStringValue(newStartValue);\n onChange?.(event, newStartValue, endDateStringValue);\n };\n\n const handleStartDateKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Enter\") {\n updateStartDate(event, startDateStringValue);\n setOpen(false);\n }\n if (event.key === \"Tab\" && event.shiftKey && openState) {\n setOpen(false);\n }\n };\n\n const handleEndDateBlur = (event: FocusEvent<HTMLInputElement>) => {\n updateEndDate(event, event.target.value);\n setFocused(false);\n };\n const handleEndDateChange = (event: ChangeEvent<HTMLInputElement>) => {\n const newEndValue = event.target.value;\n setEndDateStringValue(newEndValue);\n onChange?.(event, startDateStringValue, newEndValue);\n };\n const handleEndDateKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Enter\") {\n updateEndDate(event, endDateStringValue);\n setOpen(false);\n }\n };\n\n const handleInputClick = (event: SyntheticEvent<HTMLDivElement>) => {\n if (event.target === wrapperRef.current) {\n startInputRef?.current?.focus();\n }\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n },\n className,\n )}\n onClick={(event) => handleInputClick(event)}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n ref={inputRef}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n startDateInputID,\n )}\n aria-label={clsx(\"Start date\", ariaLabel)}\n id={startDateInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={startInputRef}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleStartDateBlur}\n onChange={handleStartDateChange}\n onKeyDown={handleStartDateKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !startDateStringValue\n ? emptyReadOnlyMarker\n : startDateStringValue\n }\n {...restDateInputProps}\n required={isRequired}\n />\n {selectionVariant === \"range\" && (\n <>\n <span>-</span>\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n endDateInputID,\n )}\n aria-label={clsx(\"End date\", ariaLabel)}\n id={endDateInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={endInputRef}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleEndDateBlur}\n onChange={handleEndDateChange}\n onKeyDown={handleEndDateKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !endDateStringValue\n ? emptyReadOnlyMarker\n : endDateStringValue\n }\n required={isRequired}\n {...restDateInputProps}\n />\n </>\n )}\n {\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n }\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n});\n"],"names":["makePrefixer","date","parseAbsoluteToLocal","CalendarDate","DateFormatter","getLocalTimeZone","forwardRef","DateInput","useRef","useForkRef","useWindow","useComponentCssInjection","dateInputCss","useDatePickerContext","isRangeOrOffsetSelectionWithStartDate","useId","useState","useFormFieldProps","useEffect","jsxs","clsx","jsx","Fragment","StatusAdornment"],"mappings":"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"}
1
+ {"version":3,"file":"DateInput.js","sources":["../src/date-input/DateInput.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n type FocusEvent,\n type InputHTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n type RefObject,\n type SyntheticEvent,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport {\n CalendarDate,\n DateFormatter,\n type DateValue,\n getLocalTimeZone,\n parseAbsoluteToLocal,\n} from \"@internationalized/date\";\nimport {\n StatusAdornment,\n makePrefixer,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport {\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { useDatePickerContext } from \"../date-picker/DatePickerContext\";\nimport dateInputCss from \"./DateInput.css\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\nconst isInvalidDate = (value: string) =>\n value && Number.isNaN(new Date(value).getDay());\nconst createDate = (date: string): Date | null => {\n if (!date || isInvalidDate(date)) {\n return null;\n }\n return new Date(date);\n};\n\nconst getIsoDate = (date: Date) => {\n try {\n return parseAbsoluteToLocal(date?.toISOString());\n } catch (err) {\n return undefined;\n }\n};\n\nfunction getCalendarDate(inputDate: string) {\n const date = createDate(inputDate);\n if (!date) return undefined;\n const isoDate = getIsoDate(date);\n return isoDate && new CalendarDate(isoDate.year, isoDate.month, isoDate.day);\n}\n\nconst defaultDateFormatter = (date: DateValue | undefined): string => {\n return date\n ? new DateFormatter(\"EN-GB\", {\n day: \"2-digit\",\n month: \"short\",\n year: \"numeric\",\n }).format(date.toDate(getLocalTimeZone()))\n : \"\";\n};\n\nexport interface DateInputProps<SelectionVariantType>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\" | \"onChange\">,\n Pick<ComponentPropsWithoutRef<\"input\">, \"disabled\" | \"placeholder\"> {\n ariaLabel?: string;\n /**\n * The marker to use in an empty read only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes) applied to the `input` elements.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Styling variant with full border. Defaults to false\n */\n bordered?: boolean;\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Reference for the startInput;\n */\n startInputRef?: RefObject<HTMLInputElement>;\n /**\n * Reference for the endInput;\n */\n endInputRef?: RefObject<HTMLInputElement>;\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n}\n\nexport const DateInput = forwardRef<\n HTMLDivElement,\n DateInputProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DateInput(\n {\n className,\n disabled,\n \"aria-label\": ariaLabel,\n selectionVariant: selectionVariantProp,\n emptyReadOnlyMarker = \"—\",\n inputProps = {},\n endAdornment,\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n bordered = false,\n dateFormatter = defaultDateFormatter,\n placeholder = \"dd mmm yyyy\",\n startInputRef,\n endInputRef,\n onSelectionChange,\n onChange,\n ...rest\n },\n ref,\n) {\n const wrapperRef = useRef(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const inputStringFormatter = (input: string): string => {\n const date = getCalendarDate(input);\n return !input || !date ? input : dateFormatter(date);\n };\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-dateInput\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const {\n selectedDate,\n setSelectedDate,\n selectionVariant: pickerSelectionVariant,\n openState,\n setOpen,\n } = useDatePickerContext();\n\n const selectionVariant = selectionVariantProp ?? pickerSelectionVariant;\n const isRangePicker =\n isRangeOrOffsetSelectionWithStartDate(selectedDate) ||\n selectionVariant === \"range\";\n\n const endDateInputID = useId();\n const startDateInputID = useId();\n\n const [focused, setFocused] = useState(false);\n const [startDateStringValue, setStartDateStringValue] = useState<string>(\n dateFormatter(\n isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate,\n ),\n );\n const [endDateStringValue, setEndDateStringValue] = useState<string>(\n dateFormatter(\n isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.endDate\n : undefined,\n ),\n );\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": dateInputDescribedBy,\n \"aria-labelledby\": dateInputLabelledBy,\n onBlur,\n onKeyDown,\n onFocus,\n required: dateInputPropsRequired,\n ...restDateInputProps\n } = inputProps;\n\n // Update date strings when dates change\n useEffect(() => {\n if (isRangeOrOffsetSelectionWithStartDate(selectedDate)) {\n selectedDate?.startDate &&\n setStartDateStringValue(dateFormatter(selectedDate?.startDate));\n selectedDate?.endDate &&\n setEndDateStringValue(dateFormatter(selectedDate?.endDate));\n } else {\n setStartDateStringValue(dateFormatter(selectedDate));\n }\n }, [selectedDate, dateFormatter]);\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : dateInputPropsRequired;\n const updateStartDate = (event: SyntheticEvent, dateString: string) => {\n const inputDate = inputStringFormatter(dateString);\n const calendarDate = getCalendarDate(inputDate);\n const newSelectedDate = isRangePicker\n ? { ...selectedDate, startDate: calendarDate }\n : calendarDate;\n setSelectedDate(newSelectedDate);\n onSelectionChange?.(event, newSelectedDate);\n };\n\n const updateEndDate = (event: SyntheticEvent, dateString: string) => {\n const inputDate = inputStringFormatter(dateString);\n const calendarDate = getCalendarDate(inputDate);\n const newSelectedDate = { ...selectedDate, endDate: calendarDate };\n setSelectedDate(newSelectedDate);\n onSelectionChange?.(event, newSelectedDate);\n };\n\n // Handlers\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n const handleStartDateBlur = (event: FocusEvent<HTMLInputElement>) => {\n updateStartDate(event, event.target.value);\n setFocused(false);\n };\n\n const handleStartDateChange = (event: ChangeEvent<HTMLInputElement>) => {\n const newStartValue = event.target.value;\n setStartDateStringValue(newStartValue);\n onChange?.(event, newStartValue, endDateStringValue);\n };\n\n const handleStartDateKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Enter\") {\n updateStartDate(event, startDateStringValue);\n setOpen(false);\n }\n if (event.key === \"Tab\" && event.shiftKey && openState) {\n setOpen(false);\n }\n };\n\n const handleEndDateBlur = (event: FocusEvent<HTMLInputElement>) => {\n updateEndDate(event, event.target.value);\n setFocused(false);\n };\n const handleEndDateChange = (event: ChangeEvent<HTMLInputElement>) => {\n const newEndValue = event.target.value;\n setEndDateStringValue(newEndValue);\n onChange?.(event, startDateStringValue, newEndValue);\n };\n const handleEndDateKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Enter\") {\n updateEndDate(event, endDateStringValue);\n setOpen(false);\n }\n };\n\n const handleInputClick = (event: SyntheticEvent<HTMLDivElement>) => {\n if (event.target === wrapperRef.current) {\n startInputRef?.current?.focus();\n }\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n onClick={(event) => handleInputClick(event)}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n ref={inputRef}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n startDateInputID,\n )}\n aria-label={clsx(\"Start date\", ariaLabel)}\n id={startDateInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={startInputRef}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleStartDateBlur}\n onChange={handleStartDateChange}\n onKeyDown={handleStartDateKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !startDateStringValue\n ? emptyReadOnlyMarker\n : startDateStringValue\n }\n {...restDateInputProps}\n required={isRequired}\n />\n {selectionVariant === \"range\" && (\n <>\n <span>-</span>\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n endDateInputID,\n )}\n aria-label={clsx(\"End date\", ariaLabel)}\n id={endDateInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={endInputRef}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleEndDateBlur}\n onChange={handleEndDateChange}\n onKeyDown={handleEndDateKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !endDateStringValue\n ? emptyReadOnlyMarker\n : endDateStringValue\n }\n required={isRequired}\n {...restDateInputProps}\n />\n </>\n )}\n {\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n }\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n});\n"],"names":["makePrefixer","date","parseAbsoluteToLocal","CalendarDate","DateFormatter","getLocalTimeZone","forwardRef","DateInput","useRef","useForkRef","useWindow","useComponentCssInjection","dateInputCss","useDatePickerContext","isRangeOrOffsetSelectionWithStartDate","useId","useState","useFormFieldProps","useEffect","jsxs","clsx","jsx","Fragment","StatusAdornment"],"mappings":"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"}
@@ -36,6 +36,7 @@ const DatePicker = react.forwardRef(function DatePicker2({
36
36
  onSelectionChange,
37
37
  onChange,
38
38
  visibleMonths = 2,
39
+ bordered,
39
40
  ...rest
40
41
  }, ref) {
41
42
  var _a, _b, _c;
@@ -67,7 +68,7 @@ const DatePicker = react.forwardRef(function DatePicker2({
67
68
  open,
68
69
  onOpenChange,
69
70
  placement: "bottom-start",
70
- middleware: [react$1.flip({ fallbackStrategy: "initialPlacement" })]
71
+ middleware: [react$1.offset(1), react$1.flip({ fallbackStrategy: "initialPlacement" })]
71
72
  });
72
73
  const { getReferenceProps, getFloatingProps } = react$1.useInteractions([
73
74
  react$1.useDismiss(context)
@@ -124,6 +125,7 @@ const DatePicker = react.forwardRef(function DatePicker2({
124
125
  children: [
125
126
  /* @__PURE__ */ jsxRuntime.jsx(DateInput.DateInput, {
126
127
  validationStatus,
128
+ bordered,
127
129
  className: clsx.clsx(withBaseName(), className),
128
130
  ref: inputRef,
129
131
  ...getReferenceProps(),
@@ -149,7 +151,7 @@ const DatePicker = react.forwardRef(function DatePicker2({
149
151
  ref: floatingRef,
150
152
  ...getFloatingProps(),
151
153
  onSelect: handleSelect,
152
- CalendarProps,
154
+ CalendarProps: { ...CalendarProps, borderedDropdown: bordered },
153
155
  helperText,
154
156
  visibleMonths
155
157
  })
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type SyntheticEvent,\n forwardRef,\n useRef,\n useState,\n} from \"react\";\n\nimport { flip, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n type DateValue,\n getLocalTimeZone,\n today,\n} from \"@internationalized/date\";\nimport {\n Button,\n makePrefixer,\n useControlled,\n useFloatingUI,\n useForkRef,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport {\n type CalendarProps,\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { DateInput, type DateInputProps } from \"../date-input\";\nimport { DatePickerContext } from \"./DatePickerContext\";\nimport { DatePickerPanel } from \"./DatePickerPanel\";\n\nconst withBaseName = makePrefixer(\"saltDatePicker\");\n\nexport interface DatePickerProps<SelectionVariantType>\n extends DateInputProps<SelectionVariantType> {\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * If `true`, the component will be disabled.\n */\n disabled?: boolean;\n /**\n * The selected date value. Use when the component is controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n selectedDate?: SelectionVariantType;\n /**\n * The default date value. Use when the component is not controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n defaultSelectedDate?: SelectionVariantType;\n /**\n * Props to be passed to the Calendar component.\n */\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * The default open value. Use when the component is not controlled.\n */\n defaultOpen?: boolean;\n /**\n * Helper text to display in the panel\n */\n helperText?: string;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n /**\n * Number of Calendars to be shown if selectionVariant is range.\n * 2 is the default value.\n */\n visibleMonths?: 1 | 2;\n}\n\nexport const DatePicker = forwardRef<\n HTMLDivElement,\n DatePickerProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DatePicker(\n {\n selectionVariant = \"default\",\n disabled = false,\n placeholder = \"dd mmm yyyy\",\n selectedDate: selectedDateProp,\n defaultSelectedDate,\n dateFormatter,\n CalendarProps,\n className,\n open: openProp,\n defaultOpen,\n onOpenChange: onOpenChangeProp,\n helperText,\n readOnly: readOnlyProp,\n validationStatus,\n onSelectionChange,\n onChange,\n visibleMonths = 2,\n ...rest\n },\n ref,\n) {\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"openPanel\",\n state: \"openPanel\",\n });\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"Calendar\",\n state: \"selectedDate\",\n });\n\n const [startVisibleMonth, setStartVisibleMonth] = useState<\n DateValue | undefined\n >(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate) ?? today(getLocalTimeZone()),\n );\n\n const [endVisibleMonth, setEndVisibleMonth] = useState<DateValue | undefined>(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate.startDate?.add({ months: 1 })\n : selectedDate) ?? today(getLocalTimeZone()).add({ months: 1 }),\n );\n\n const onOpenChange = (newState: boolean) => {\n setOpen(newState);\n startInputRef?.current?.focus();\n onOpenChangeProp?.(newState);\n };\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: open,\n onOpenChange: onOpenChange,\n placement: \"bottom-start\",\n middleware: [flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n ]);\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n\n const getPanelPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n const panelRef = useRef<HTMLDivElement>(null);\n const startInputRef = useRef<HTMLInputElement>(null);\n const endInputRef = useRef<HTMLInputElement>(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, reference);\n const floatingRef = useForkRef<HTMLDivElement>(panelRef, floating);\n\n // Handlers\n const handleSelect = (\n event: SyntheticEvent,\n selectedDate?: DateValue | { startDate?: DateValue; endDate?: DateValue },\n ) => {\n if (selectionVariant === \"default\" && selectedDate) {\n startInputRef?.current?.focus();\n }\n\n if (\n isRangeOrOffsetSelectionWithStartDate(selectedDate) &&\n selectedDate.endDate\n ) {\n endInputRef?.current?.focus();\n }\n onSelectionChange?.(event, selectedDate);\n };\n const handleCalendarButton = () => {\n startInputRef?.current?.focus();\n setOpen(!open);\n };\n\n // Context\n const datePickerContextValue = {\n openState: open,\n setOpen,\n disabled,\n selectedDate,\n setSelectedDate,\n defaultSelectedDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endVisibleMonth,\n setEndVisibleMonth,\n selectionVariant,\n context,\n getPanelPosition,\n };\n\n return (\n <DatePickerContext.Provider value={datePickerContextValue}>\n <DateInput\n validationStatus={validationStatus}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n {...getReferenceProps()}\n startInputRef={startInputRef}\n endInputRef={endInputRef}\n placeholder={placeholder}\n dateFormatter={dateFormatter}\n readOnly={isReadOnly}\n onSelectionChange={onSelectionChange}\n onChange={onChange}\n endAdornment={\n <Button\n variant=\"secondary\"\n onClick={handleCalendarButton}\n disabled={disabled || isReadOnly || formFieldDisabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon aria-hidden />\n </Button>\n }\n {...rest}\n />\n <DatePickerPanel\n ref={floatingRef}\n {...getFloatingProps()}\n onSelect={handleSelect}\n CalendarProps={CalendarProps}\n helperText={helperText}\n visibleMonths={visibleMonths}\n />\n </DatePickerContext.Provider>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePicker","useControlled","useState","isRangeOrOffsetSelectionWithStartDate","today","getLocalTimeZone","_a","useFloatingUI","flip","useInteractions","useDismiss","useFormFieldProps","_b","useRef","useForkRef","selectedDate","jsxs","DatePickerContext","jsx","DateInput","clsx","Button","CalendarIcon","DatePickerPanel"],"mappings":";;;;;;;;;;;;;;;;;;;AAkCA,MAAM,YAAA,GAAeA,kBAAa,gBAAgB,CAAA,CAAA;AAqFrC,MAAA,UAAA,GAAaC,gBAGxB,CAAA,SAASC,WACT,CAAA;AAAA,EACE,gBAAmB,GAAA,SAAA;AAAA,EACnB,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,aAAA;AAAA,EACd,YAAc,EAAA,gBAAA;AAAA,EACd,mBAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,IAAM,EAAA,QAAA;AAAA,EACN,WAAA;AAAA,EACA,YAAc,EAAA,gBAAA;AAAA,EACd,UAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAgB,GAAA,CAAA;AAAA,EACb,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AAhJF,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAiJE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,kBAAc,CAAA;AAAA,IACpC,UAAY,EAAA,QAAA;AAAA,IACZ,OAAA,EAAS,QAAQ,WAAW,CAAA;AAAA,IAC5B,IAAM,EAAA,WAAA;AAAA,IACN,KAAO,EAAA,WAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,kBAAc,CAAA;AAAA,IACpD,UAAY,EAAA,gBAAA;AAAA,IACZ,OAAS,EAAA,mBAAA;AAAA,IACT,IAAM,EAAA,UAAA;AAAA,IACN,KAAO,EAAA,cAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,CAAC,iBAAmB,EAAA,oBAAoB,CAAI,GAAAC,cAAA;AAAA,IAG/C,CAAA,EAAA,GAAAC,kDAAA,CAAsC,YAAY,CAC/C,GAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAc,YACd,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoBC,UAAM,CAAAC,qBAAA,EAAkB,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAM,MAAA,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAAH,cAAA;AAAA,IAC3C,CAAA,EAAA,GAAAC,kDAAA,CAAsC,YAAY,CAC/C,GAAA,CAAA,EAAA,GAAA,YAAA,CAAa,cAAb,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,GAAA,CAAI,EAAE,MAAQ,EAAA,CAAA,MACtC,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoBC,WAAMC,qBAAiB,EAAC,EAAE,GAAI,CAAA,EAAE,MAAQ,EAAA,CAAA,EAAG,CAAA;AAAA,GAClE,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,QAAsB,KAAA;AA7K9C,IAAAC,IAAAA,GAAAA,CAAAA;AA8KI,IAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA;AAChB,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,QAAA,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,UAAU,QAAU,EAAA,SAAA,EAAW,OAAQ,EAAA,GAC7DC,kBAAc,CAAA;AAAA,IACZ,IAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAW,EAAA,cAAA;AAAA,IACX,YAAY,CAACC,YAAA,CAAK,EAAE,gBAAkB,EAAA,kBAAA,EAAoB,CAAC,CAAA;AAAA,GAC5D,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAIC,uBAAgB,CAAA;AAAA,IAC9DC,mBAAW,OAAO,CAAA;AAAA,GACnB,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,QAAU,EAAA,iBAAA,EAAmB,QAAU,EAAA,iBAAA,KAC7CC,sBAAkB,EAAA,CAAA;AACpB,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AAEnC,EAAA,MAAM,mBAAmB,MAAG;AAlM9B,IAAA,IAAAL,GAAAM,EAAAA,GAAAA,CAAAA;AAkMkC,IAAA,OAAA;AAAA,MAC9B,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACV,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,KAAON,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,WAAA;AAAA,MAC1B,MAAQM,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,YAAA;AAAA,KAC7B,CAAA;AAAA,GAAA,CAAA;AAEA,EAAM,MAAA,QAAA,GAAWC,aAAuB,IAAI,CAAA,CAAA;AAC5C,EAAM,MAAA,aAAA,GAAgBA,aAAyB,IAAI,CAAA,CAAA;AACnD,EAAM,MAAA,WAAA,GAAcA,aAAyB,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,QAAA,GAAWC,eAA2B,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAC1D,EAAM,MAAA,WAAA,GAAcA,eAA2B,CAAA,QAAA,EAAU,QAAQ,CAAA,CAAA;AAGjE,EAAM,MAAA,YAAA,GAAe,CACnB,KAAA,EACAC,aACG,KAAA;AApNP,IAAA,IAAAT,GAAAM,EAAAA,GAAAA,CAAAA;AAqNI,IAAI,IAAA,gBAAA,KAAqB,aAAaG,aAAc,EAAA;AAClD,MAAA,CAAAT,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AAAA,KAC1B;AAEA,IAAA,IACEH,kDAAsCY,CAAAA,aAAY,CAClDA,IAAAA,aAAAA,CAAa,OACb,EAAA;AACA,MAAA,CAAAH,GAAA,GAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAa,OAAb,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAsB,CAAA,KAAA,EAAA,CAAA;AAAA,KACxB;AACA,IAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAoB,KAAOG,EAAAA,aAAAA,CAAAA,CAAAA;AAAA,GAC7B,CAAA;AACA,EAAA,MAAM,uBAAuB,MAAM;AAjOrC,IAAAT,IAAAA,GAAAA,CAAAA;AAkOI,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,GACf,CAAA;AAGA,EAAA,MAAM,sBAAyB,GAAA;AAAA,IAC7B,SAAW,EAAA,IAAA;AAAA,IACX,OAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,mBAAA;AAAA,IACA,iBAAA;AAAA,IACA,oBAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,gBAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAU,eAAA,CAACC,oCAAkB,QAAlB,EAAA;AAAA,IAA2B,KAAO,EAAA,sBAAA;AAAA,IACjC,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,mBAAA,EAAA;AAAA,QACC,gBAAA;AAAA,QACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAK,EAAA,QAAA;AAAA,QACJ,GAAG,iBAAkB,EAAA;AAAA,QACtB,aAAA;AAAA,QACA,WAAA;AAAA,QACA,WAAA;AAAA,QACA,aAAA;AAAA,QACA,QAAU,EAAA,UAAA;AAAA,QACV,iBAAA;AAAA,QACA,QAAA;AAAA,QACA,8BACGF,cAAA,CAAAG,WAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,OAAS,EAAA,oBAAA;AAAA,UACT,QAAA,EAAU,YAAY,UAAc,IAAA,iBAAA;AAAA,UACpC,YAAW,EAAA,eAAA;AAAA,UAEX,QAAC,kBAAAH,cAAA,CAAAI,kBAAA,EAAA;AAAA,YAAa,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC5B,CAAA;AAAA,QAED,GAAG,IAAA;AAAA,OACN,CAAA;AAAA,sBACCJ,cAAA,CAAAK,+BAAA,EAAA;AAAA,QACC,GAAK,EAAA,WAAA;AAAA,QACJ,GAAG,gBAAiB,EAAA;AAAA,QACrB,QAAU,EAAA,YAAA;AAAA,QACV,aAAA;AAAA,QACA,UAAA;AAAA,QACA,aAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type SyntheticEvent,\n forwardRef,\n useRef,\n useState,\n} from \"react\";\n\nimport { flip, offset, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n type DateValue,\n getLocalTimeZone,\n today,\n} from \"@internationalized/date\";\nimport {\n Button,\n makePrefixer,\n useControlled,\n useFloatingUI,\n useForkRef,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport {\n type CalendarProps,\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { DateInput, type DateInputProps } from \"../date-input\";\nimport { DatePickerContext } from \"./DatePickerContext\";\nimport { DatePickerPanel } from \"./DatePickerPanel\";\n\nconst withBaseName = makePrefixer(\"saltDatePicker\");\n\nexport interface DatePickerProps<SelectionVariantType>\n extends DateInputProps<SelectionVariantType> {\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * If `true`, the component will be disabled.\n */\n disabled?: boolean;\n /**\n * The selected date value. Use when the component is controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n selectedDate?: SelectionVariantType;\n /**\n * The default date value. Use when the component is not controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n defaultSelectedDate?: SelectionVariantType;\n /**\n * Props to be passed to the Calendar component.\n */\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * The default open value. Use when the component is not controlled.\n */\n defaultOpen?: boolean;\n /**\n * Helper text to display in the panel\n */\n helperText?: string;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n /**\n * Number of Calendars to be shown if selectionVariant is range.\n * 2 is the default value.\n */\n visibleMonths?: 1 | 2;\n}\n\nexport const DatePicker = forwardRef<\n HTMLDivElement,\n DatePickerProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DatePicker(\n {\n selectionVariant = \"default\",\n disabled = false,\n placeholder = \"dd mmm yyyy\",\n selectedDate: selectedDateProp,\n defaultSelectedDate,\n dateFormatter,\n CalendarProps,\n className,\n open: openProp,\n defaultOpen,\n onOpenChange: onOpenChangeProp,\n helperText,\n readOnly: readOnlyProp,\n validationStatus,\n onSelectionChange,\n onChange,\n visibleMonths = 2,\n bordered,\n ...rest\n },\n ref,\n) {\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"openPanel\",\n state: \"openPanel\",\n });\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"Calendar\",\n state: \"selectedDate\",\n });\n\n const [startVisibleMonth, setStartVisibleMonth] = useState<\n DateValue | undefined\n >(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate) ?? today(getLocalTimeZone()),\n );\n\n const [endVisibleMonth, setEndVisibleMonth] = useState<DateValue | undefined>(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate.startDate?.add({ months: 1 })\n : selectedDate) ?? today(getLocalTimeZone()).add({ months: 1 }),\n );\n\n const onOpenChange = (newState: boolean) => {\n setOpen(newState);\n startInputRef?.current?.focus();\n onOpenChangeProp?.(newState);\n };\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: open,\n onOpenChange: onOpenChange,\n placement: \"bottom-start\",\n middleware: [offset(1), flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n ]);\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n\n const getPanelPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n const panelRef = useRef<HTMLDivElement>(null);\n const startInputRef = useRef<HTMLInputElement>(null);\n const endInputRef = useRef<HTMLInputElement>(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, reference);\n const floatingRef = useForkRef<HTMLDivElement>(panelRef, floating);\n\n // Handlers\n const handleSelect = (\n event: SyntheticEvent,\n selectedDate?: DateValue | { startDate?: DateValue; endDate?: DateValue },\n ) => {\n if (selectionVariant === \"default\" && selectedDate) {\n startInputRef?.current?.focus();\n }\n\n if (\n isRangeOrOffsetSelectionWithStartDate(selectedDate) &&\n selectedDate.endDate\n ) {\n endInputRef?.current?.focus();\n }\n onSelectionChange?.(event, selectedDate);\n };\n const handleCalendarButton = () => {\n startInputRef?.current?.focus();\n setOpen(!open);\n };\n\n // Context\n const datePickerContextValue = {\n openState: open,\n setOpen,\n disabled,\n selectedDate,\n setSelectedDate,\n defaultSelectedDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endVisibleMonth,\n setEndVisibleMonth,\n selectionVariant,\n context,\n getPanelPosition,\n };\n\n return (\n <DatePickerContext.Provider value={datePickerContextValue}>\n <DateInput\n validationStatus={validationStatus}\n bordered={bordered}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n {...getReferenceProps()}\n startInputRef={startInputRef}\n endInputRef={endInputRef}\n placeholder={placeholder}\n dateFormatter={dateFormatter}\n readOnly={isReadOnly}\n onSelectionChange={onSelectionChange}\n onChange={onChange}\n endAdornment={\n <Button\n variant=\"secondary\"\n onClick={handleCalendarButton}\n disabled={disabled || isReadOnly || formFieldDisabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon aria-hidden />\n </Button>\n }\n {...rest}\n />\n <DatePickerPanel\n ref={floatingRef}\n {...getFloatingProps()}\n onSelect={handleSelect}\n CalendarProps={{ ...CalendarProps, borderedDropdown: bordered }}\n helperText={helperText}\n visibleMonths={visibleMonths}\n />\n </DatePickerContext.Provider>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePicker","useControlled","useState","isRangeOrOffsetSelectionWithStartDate","today","getLocalTimeZone","_a","useFloatingUI","offset","flip","useInteractions","useDismiss","useFormFieldProps","_b","useRef","useForkRef","selectedDate","jsxs","DatePickerContext","jsx","DateInput","clsx","Button","CalendarIcon","DatePickerPanel"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = ".saltDatePickerPanel {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n display: flex;\n border-radius: var(--salt-palette-corner, 0);\n}\n.saltDatePickerPanel-container {\n width: min-content;\n gap: 1px;\n}\n\n.saltDatePickerPanel-header {\n padding: var(--salt-spacing-100);\n}\n";
3
+ var css_248z = ".saltDatePickerPanel {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n display: flex;\n border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltDatePickerPanel-container {\n width: min-content;\n gap: 1px;\n}\n\n.saltDatePickerPanel-header {\n padding: var(--salt-spacing-100);\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=DatePickerPanel.css.js.map