@elliemae/ds-controlled-form 1.55.0-next.9 → 1.55.0-rc.3

package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Day.js

@@ -1,22 +1,27 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
 import React, { useContext, useMemo, useCallback } from 'react';
 import { compareTwoDatesDayEquality, getDayFromDateString, isSameDateMoment, getDateStringFromDay, getDateValuesFromDate } from '../../../utils/dateHelpers.js';
+import { weekDays } from '../../../utils/constants.js';
+import { getAriaDayFromDateString } from '../../../utils/stringHelpers.js';
 import { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';
 import { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';
 import { CalendarContext } from './CalendarContext.js';
 import { StyledDayBtn } from './Styleds.js';
 import '@babel/runtime/helpers/esm/toConsumableArray';
-import '../../../utils/stringHelpers.js';
-import '@babel/runtime/helpers/esm/slicedToArray';
 import '../../../utils/numberHelpers.js';
+import '@babel/runtime/helpers/esm/slicedToArray';
 import '../../../ControlledDateTimePickerTypes.js';
 import 'styled-components';
+import '@elliemae/ds-grid';
 import '@elliemae/ds-button';
 
 var displayNone = {
   display: 'none'
 };
 var Day = function Day(_ref) {
-  var metaDay = _ref.metaDay;
+  var metaDay = _ref.metaDay,
+      colIndex = _ref.colIndex,
+      isInvisible = _ref.isInvisible;
   var day = metaDay.day,
       isCurrMonthDay = metaDay.isCurrMonthDay,
       isHidden = metaDay.isHidden,
@@ -86,16 +91,23 @@ var Day = function Day(_ref) {
     setLatestInteractionRegion('calendar-days');
   }, [setLatestInteractionRegion]);
   var dayClassModifiers = useMemo(function () {
-    return "".concat(isSelected ? 'selectedDay ' : '').concat(isDisabled ? 'disabledDay ' : '').concat(isOutOfRange ? 'outOfRangeDay ' : '').concat(isFocused ? 'focusedDay ' : '').concat(isStartRangeDay ? 'startRangeDay ' : '').concat(isDayInRange ? 'inRangeDay ' : '').concat(isEndRangeDay ? 'endRangeDay ' : '').concat(isCurrMonthDay ? '' : 'notCurrentMonth');
+    return "dayWrapper ".concat(isSelected ? 'selectedDay ' : '').concat(isDisabled ? 'disabledDay ' : '').concat(isOutOfRange ? 'outOfRangeDay ' : '').concat(isFocused ? 'focusedDay ' : '').concat(isStartRangeDay ? 'startRangeDay ' : '').concat(isDayInRange ? 'inRangeDay ' : '').concat(isEndRangeDay ? 'endRangeDay ' : '').concat(isCurrMonthDay ? '' : 'notCurrentMonth');
   }, [isSelected, isDisabled, isOutOfRange, isFocused, isStartRangeDay, isDayInRange, isEndRangeDay, isCurrMonthDay]);
-  return /*#__PURE__*/React.createElement("li", {
+  var dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.DAY;
+  if (isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_DAY;
+  if (isFocused) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.FOCUSED_DAY;
+  if (isFocused && isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_FOCUSED_DAY;
+  return /*#__PURE__*/React.createElement("div", _extends({
     className: dayClassModifiers,
-    style: isHidden ? displayNone : undefined
-  }, /*#__PURE__*/React.createElement(StyledDayBtn, {
-    "aria-label": "Date Picker ".concat(dayAsString),
-    role: "gridcell",
-    buttonType: "text",
-    labelText: "".concat(day.getDate()),
+    style: isHidden ? displayNone : undefined,
+    role: !isInvisible ? 'gridcell' : undefined
+  }, Number.isInteger(colIndex) && {
+    'aria-colindex': colIndex
+  }), /*#__PURE__*/React.createElement(StyledDayBtn, {
+    "aria-label": "".concat(getAriaDayFromDateString(dayAsString), ", ").concat(weekDays[metaDay.day.getDay()]),
+    "aria-disabled": isOutOfRange || isDisabled,
+    "aria-hidden": !!isInvisible,
+    buttonType: "raw",
     size: "m",
     onClick: handleOnDayClick // DSButton triggers this with "spacebar" and "enter" too...
     ,
@@ -106,8 +118,8 @@ var Day = function Day(_ref) {
     innerRef: dayBtnRef,
     tabIndex: isSelected ? 0 : -1,
     "data-isfocused": isFocused,
-    "data-testid": ControlledDateTimePickerDatatestid.CALENDAR[isFocused ? 'FOCUSED_DAY' : 'DAY']
-  }));
+    "data-testid": dataTestid
+  }, "".concat(day.getDate())));
 };
 
 export { Day };

package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Day.js.map

@@ -1 +1 @@
-{"version":3,"file":"Day.js","sources":["../../../../../../src/controlled-date-time-picker/parts/Pickers/Calendar/Day.tsx"],"sourcesContent":["import React, { useContext, useCallback, useMemo } from 'react';\nimport {\n  getDateStringFromDay,\n  getDayFromDateString,\n  getDateValuesFromDate,\n  isSameDateMoment,\n  compareTwoDatesDayEquality,\n} from '../../../utils/dateHelpers';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX';\nimport { CalendarContext } from './CalendarContext';\nimport type { fiveBySevenCurrentMonthDaysT } from '../../../index.d';\nimport { StyledDayBtn } from './Styleds';\n\ninterface CalendarDayPropsT {\n  metaDay: fiveBySevenCurrentMonthDaysT;\n}\nconst displayNone = { display: 'none' };\n\nexport const Day = ({ metaDay }: CalendarDayPropsT): JSX.Element => {\n  const { day, isCurrMonthDay, isHidden, dayBtnRef, dayAsString } = metaDay;\n  const {\n    handleChangeComposedDateString,\n    dateStringFromProps,\n    props: {\n      getIsDisabledDay,\n      getIsOutOfRangeDay,\n      getIsStartRangeDay,\n      getIsDayInRange,\n      getIsEndRangeDay,\n      preventCloseOnSelection,\n      onMonthChange,\n      onDayChange,\n      onYearChange,\n    },\n    latestInteractionRegion,\n    setLatestInteractionRegion,\n  } = useContext(ControlledDateTimePickerContext);\n  const {\n    handleDayOnKeyDown,\n    focusedDay,\n    handleFocusMetaDayByDay,\n    isWithTimeWheelToo,\n    closeCalendar,\n    tryToFocusCurrentlyDataIsFocusedDay,\n  } = useContext(CalendarContext);\n  const isFocusedMetaDay = compareTwoDatesDayEquality(metaDay?.day, focusedDay?.day);\n  const isSelected = useMemo(() => {\n    const selectedDate = getDayFromDateString(dateStringFromProps);\n    return isSameDateMoment(day, selectedDate);\n  }, [dateStringFromProps, day]);\n  const isFocused = latestInteractionRegion === 'calendar-days' && isFocusedMetaDay;\n  const isDisabled = getIsDisabledDay(metaDay.dayAsString);\n  const isOutOfRange = getIsOutOfRangeDay(metaDay.dayAsString);\n  const isStartRangeDay = getIsStartRangeDay(metaDay.dayAsString);\n  const isEndRangeDay = getIsEndRangeDay(metaDay.dayAsString);\n  const isDayInRange = !isStartRangeDay && !isEndRangeDay && getIsDayInRange(metaDay.dayAsString);\n\n  const handleOnDayClick = useCallback(\n    (e) => {\n      handleFocusMetaDayByDay(day);\n      tryToFocusCurrentlyDataIsFocusedDay();\n      if (!isDisabled && !isOutOfRange) {\n        const newDateString = getDateStringFromDay(day);\n        const metaInfo = { isAutomaticFillTrigger: false, newDateString };\n        const { month, day: dayNumber, year } = getDateValuesFromDate(day);\n        onMonthChange(`${month + 1}`, e, metaInfo);\n        onDayChange(`${dayNumber}`, e, metaInfo);\n        onYearChange(`${year}`, e, metaInfo);\n        handleChangeComposedDateString(newDateString, metaInfo);\n        setLatestInteractionRegion('calendar-days');\n        if (!isWithTimeWheelToo && !preventCloseOnSelection) closeCalendar();\n      }\n    },\n    [\n      isDisabled,\n      isOutOfRange,\n      day,\n      onMonthChange,\n      onDayChange,\n      onYearChange,\n      handleChangeComposedDateString,\n      handleFocusMetaDayByDay,\n      tryToFocusCurrentlyDataIsFocusedDay,\n      setLatestInteractionRegion,\n      isWithTimeWheelToo,\n      preventCloseOnSelection,\n      closeCalendar,\n    ],\n  );\n\n  const handleOnDayFocus = useCallback(() => {\n    setLatestInteractionRegion('calendar-days');\n  }, [setLatestInteractionRegion]);\n\n  const dayClassModifiers = useMemo(\n    () =>\n      `${isSelected ? 'selectedDay ' : ''}${isDisabled ? 'disabledDay ' : ''}${isOutOfRange ? 'outOfRangeDay ' : ''}${\n        isFocused ? 'focusedDay ' : ''\n      }${isStartRangeDay ? 'startRangeDay ' : ''}${isDayInRange ? 'inRangeDay ' : ''}${\n        isEndRangeDay ? 'endRangeDay ' : ''\n      }${isCurrMonthDay ? '' : 'notCurrentMonth'}`,\n    [isSelected, isDisabled, isOutOfRange, isFocused, isStartRangeDay, isDayInRange, isEndRangeDay, isCurrMonthDay],\n  );\n\n  return (\n    <li className={dayClassModifiers} style={isHidden ? displayNone : undefined}>\n      <StyledDayBtn\n        aria-label={`Date Picker ${dayAsString}`}\n        role=\"gridcell\"\n        buttonType=\"text\"\n        labelText={`${day.getDate()}`}\n        size=\"m\"\n        onClick={handleOnDayClick} // DSButton triggers this with \"spacebar\" and \"enter\" too...\n        onFocus={handleOnDayFocus}\n        onKeyDown={(e) => {\n          handleDayOnKeyDown(e, metaDay);\n        }}\n        innerRef={dayBtnRef}\n        tabIndex={isSelected ? 0 : -1}\n        data-isfocused={isFocused}\n        data-testid={ControlledDateTimePickerDatatestid.CALENDAR[isFocused ? 'FOCUSED_DAY' : 'DAY']}\n      />\n    </li>\n  );\n};\n"],"names":["displayNone","display","Day","metaDay","day","isCurrMonthDay","isHidden","dayBtnRef","dayAsString","useContext","ControlledDateTimePickerContext","handleChangeComposedDateString","dateStringFromProps","props","getIsDisabledDay","getIsOutOfRangeDay","getIsStartRangeDay","getIsDayInRange","getIsEndRangeDay","preventCloseOnSelection","onMonthChange","onDayChange","onYearChange","latestInteractionRegion","setLatestInteractionRegion","CalendarContext","handleDayOnKeyDown","focusedDay","handleFocusMetaDayByDay","isWithTimeWheelToo","closeCalendar","tryToFocusCurrentlyDataIsFocusedDay","isFocusedMetaDay","compareTwoDatesDayEquality","isSelected","useMemo","selectedDate","getDayFromDateString","isSameDateMoment","isFocused","isDisabled","isOutOfRange","isStartRangeDay","isEndRangeDay","isDayInRange","handleOnDayClick","useCallback","e","newDateString","getDateStringFromDay","metaInfo","isAutomaticFillTrigger","getDateValuesFromDate","month","dayNumber","year","handleOnDayFocus","dayClassModifiers","undefined","getDate","ControlledDateTimePickerDatatestid","CALENDAR"],"mappings":"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"}
+{"version":3,"file":"Day.js","sources":["../../../../../../src/controlled-date-time-picker/parts/Pickers/Calendar/Day.tsx"],"sourcesContent":["/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useCallback, useMemo } from 'react';\nimport {\n  getDateStringFromDay,\n  getDayFromDateString,\n  getDateValuesFromDate,\n  isSameDateMoment,\n  compareTwoDatesDayEquality,\n} from '../../../utils/dateHelpers';\nimport { weekDays } from '../../../utils/constants';\nimport { getAriaDayFromDateString } from '../../../utils/stringHelpers';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX';\nimport { CalendarContext } from './CalendarContext';\nimport type { metaMonthDayT } from '../../../index.d';\nimport { StyledDayBtn } from './Styleds';\n\ninterface CalendarDayPropsT {\n  metaDay: metaMonthDayT;\n  colIndex?: number;\n  isInvisible?: boolean;\n}\nconst displayNone = { display: 'none' };\n\nexport const Day = ({ metaDay, colIndex, isInvisible }: CalendarDayPropsT): JSX.Element => {\n  const { day, isCurrMonthDay, isHidden, dayBtnRef, dayAsString } = metaDay;\n  const {\n    handleChangeComposedDateString,\n    dateStringFromProps,\n    props: {\n      getIsDisabledDay,\n      getIsOutOfRangeDay,\n      getIsStartRangeDay,\n      getIsDayInRange,\n      getIsEndRangeDay,\n      preventCloseOnSelection,\n      onMonthChange,\n      onDayChange,\n      onYearChange,\n    },\n    latestInteractionRegion,\n    setLatestInteractionRegion,\n  } = useContext(ControlledDateTimePickerContext);\n  const {\n    handleDayOnKeyDown,\n    focusedDay,\n    handleFocusMetaDayByDay,\n    isWithTimeWheelToo,\n    closeCalendar,\n    tryToFocusCurrentlyDataIsFocusedDay,\n  } = useContext(CalendarContext);\n  const isFocusedMetaDay = compareTwoDatesDayEquality(metaDay?.day, focusedDay?.day);\n  const isSelected = useMemo(() => {\n    const selectedDate = getDayFromDateString(dateStringFromProps);\n    return isSameDateMoment(day, selectedDate);\n  }, [dateStringFromProps, day]);\n  const isFocused = latestInteractionRegion === 'calendar-days' && isFocusedMetaDay;\n  const isDisabled = getIsDisabledDay(metaDay.dayAsString);\n  const isOutOfRange = getIsOutOfRangeDay(metaDay.dayAsString);\n  const isStartRangeDay = getIsStartRangeDay(metaDay.dayAsString);\n  const isEndRangeDay = getIsEndRangeDay(metaDay.dayAsString);\n  const isDayInRange = !isStartRangeDay && !isEndRangeDay && getIsDayInRange(metaDay.dayAsString);\n\n  const handleOnDayClick = useCallback(\n    (e) => {\n      handleFocusMetaDayByDay(day);\n      tryToFocusCurrentlyDataIsFocusedDay();\n      if (!isDisabled && !isOutOfRange) {\n        const newDateString = getDateStringFromDay(day);\n        const metaInfo = { isAutomaticFillTrigger: false, newDateString };\n        const { month, day: dayNumber, year } = getDateValuesFromDate(day);\n        onMonthChange(`${month + 1}`, e, metaInfo);\n        onDayChange(`${dayNumber}`, e, metaInfo);\n        onYearChange(`${year}`, e, metaInfo);\n        handleChangeComposedDateString(newDateString, metaInfo);\n        setLatestInteractionRegion('calendar-days');\n        if (!isWithTimeWheelToo && !preventCloseOnSelection) closeCalendar();\n      }\n    },\n    [\n      isDisabled,\n      isOutOfRange,\n      day,\n      onMonthChange,\n      onDayChange,\n      onYearChange,\n      handleChangeComposedDateString,\n      handleFocusMetaDayByDay,\n      tryToFocusCurrentlyDataIsFocusedDay,\n      setLatestInteractionRegion,\n      isWithTimeWheelToo,\n      preventCloseOnSelection,\n      closeCalendar,\n    ],\n  );\n\n  const handleOnDayFocus = useCallback(() => {\n    setLatestInteractionRegion('calendar-days');\n  }, [setLatestInteractionRegion]);\n\n  const dayClassModifiers = useMemo(\n    () =>\n      `dayWrapper ${isSelected ? 'selectedDay ' : ''}${isDisabled ? 'disabledDay ' : ''}${\n        isOutOfRange ? 'outOfRangeDay ' : ''\n      }${isFocused ? 'focusedDay ' : ''}${isStartRangeDay ? 'startRangeDay ' : ''}${isDayInRange ? 'inRangeDay ' : ''}${\n        isEndRangeDay ? 'endRangeDay ' : ''\n      }${isCurrMonthDay ? '' : 'notCurrentMonth'}`,\n    [isSelected, isDisabled, isOutOfRange, isFocused, isStartRangeDay, isDayInRange, isEndRangeDay, isCurrMonthDay],\n  );\n\n  let dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.DAY;\n  if (isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_DAY;\n  if (isFocused) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.FOCUSED_DAY;\n  if (isFocused && isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_FOCUSED_DAY;\n  return (\n    <div\n      className={dayClassModifiers}\n      style={isHidden ? displayNone : undefined}\n      role={!isInvisible ? 'gridcell' : undefined}\n      {...(Number.isInteger(colIndex) && { 'aria-colindex': colIndex })}\n    >\n      <StyledDayBtn\n        aria-label={`${getAriaDayFromDateString(dayAsString)}, ${weekDays[metaDay.day.getDay()]}`}\n        aria-disabled={isOutOfRange || isDisabled}\n        aria-hidden={!!isInvisible}\n        buttonType=\"raw\"\n        size=\"m\"\n        onClick={handleOnDayClick} // DSButton triggers this with \"spacebar\" and \"enter\" too...\n        onFocus={handleOnDayFocus}\n        onKeyDown={(e) => {\n          handleDayOnKeyDown(e, metaDay);\n        }}\n        innerRef={dayBtnRef}\n        tabIndex={isSelected ? 0 : -1}\n        data-isfocused={isFocused}\n        data-testid={dataTestid}\n      >\n        {`${day.getDate()}`}\n      </StyledDayBtn>\n    </div>\n  );\n};\n"],"names":["displayNone","display","Day","metaDay","colIndex","isInvisible","day","isCurrMonthDay","isHidden","dayBtnRef","dayAsString","useContext","ControlledDateTimePickerContext","handleChangeComposedDateString","dateStringFromProps","props","getIsDisabledDay","getIsOutOfRangeDay","getIsStartRangeDay","getIsDayInRange","getIsEndRangeDay","preventCloseOnSelection","onMonthChange","onDayChange","onYearChange","latestInteractionRegion","setLatestInteractionRegion","CalendarContext","handleDayOnKeyDown","focusedDay","handleFocusMetaDayByDay","isWithTimeWheelToo","closeCalendar","tryToFocusCurrentlyDataIsFocusedDay","isFocusedMetaDay","compareTwoDatesDayEquality","isSelected","useMemo","selectedDate","getDayFromDateString","isSameDateMoment","isFocused","isDisabled","isOutOfRange","isStartRangeDay","isEndRangeDay","isDayInRange","handleOnDayClick","useCallback","e","newDateString","getDateStringFromDay","metaInfo","isAutomaticFillTrigger","getDateValuesFromDate","month","dayNumber","year","handleOnDayFocus","dayClassModifiers","dataTestid","ControlledDateTimePickerDatatestid","CALENDAR","DAY","SELECTED_DAY","FOCUSED_DAY","SELECTED_FOCUSED_DAY","undefined","Number","isInteger","getAriaDayFromDateString","weekDays","getDay","getDate"],"mappings":"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"}

package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.js

@@ -1,172 +1,190 @@
 import styled from 'styled-components';
-import { DSButton } from '@elliemae/ds-button';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
 
 /* eslint-disable max-lines */
-var StyledSpacingResetter = /*#__PURE__*/styled.div.withConfig({
+var focusBorder = "\n  border-style: solid;\n  border-width: 2px;\n  border-radius: 50%;\n";
+var StyledIconTriggerButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
   componentId: "sc-18gg4kd-0"
-})(["*{margin:0;padding:0;box-sizing:border-box;}ul{list-style:none;}", ""], function (_ref) {
-  var isControllerOnly = _ref.isControllerOnly;
+})(["color:", ";width:26px;height:26px;"], function (_ref) {
+  var theme = _ref.theme;
+  return theme.colors.brand['600'];
+});
+var StyledShadowWrapper = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-18gg4kd-1"
+})(["", ""], function (_ref2) {
+  var isControllerOnly = _ref2.isControllerOnly;
   return isControllerOnly ? undefined : 'box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);';
 });
 var StyledCalendarWrapper = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-18gg4kd-1"
-})(["display:grid;width:260px;background-color:", ";grid-template-rows:auto auto;"], function (_ref2) {
-  var theme = _ref2.theme;
+  componentId: "sc-18gg4kd-2"
+})(["display:grid;width:260px;background-color:", ";grid-template-rows:auto auto;"], function (_ref3) {
+  var theme = _ref3.theme;
   return theme.colors.neutral['000'];
 });
 var StyledHeader = /*#__PURE__*/styled.section.withConfig({
-  componentId: "sc-18gg4kd-2"
-})(["display:grid;padding:", ";grid-template-columns:min-content min-content 1fr min-content min-content;grid-template-rows:1fr;align-items:center;justify-content:center;text-align:center;background:", ";h3{font-size:1rem;}"], function (_ref3) {
-  var theme = _ref3.theme;
-  return theme.space.xxxs;
-}, function (_ref4) {
+  componentId: "sc-18gg4kd-3"
+})(["*{margin:0;padding:0;box-sizing:border-box;}display:grid;padding:", ";grid-template-columns:min-content min-content 1fr min-content min-content;grid-template-rows:1fr;align-items:center;justify-content:center;text-align:center;background:", ";h3{font-size:1rem;}"], function (_ref4) {
   var theme = _ref4.theme;
+  return theme.space.xxxs;
+}, function (_ref5) {
+  var theme = _ref5.theme;
   return theme.colors.neutral['050'];
 });
-var StyledHeaderButton = /*#__PURE__*/styled(DSButton).withConfig({
-  componentId: "sc-18gg4kd-3"
-})(["position:relative;&:focus{&:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid ", ";border-radius:2px;pointer-events:none;}}&:hover{background:", ";}"], function (_ref5) {
-  var theme = _ref5.theme;
-  return theme.colors.brand[700];
-}, function (_ref6) {
+var StyledHeaderButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
+  componentId: "sc-18gg4kd-4"
+})(["position:relative;width:28px;height:28px;&:focus{&:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid ", ";border-radius:2px;pointer-events:none;}}&:hover{background:", ";}"], function (_ref6) {
   var theme = _ref6.theme;
+  return theme.colors.brand[700];
+}, function (_ref7) {
+  var theme = _ref7.theme;
   return theme.colors.brand[200];
 });
 var StyledBody = /*#__PURE__*/styled.section.withConfig({
-  componentId: "sc-18gg4kd-4"
-})(["padding:", ";"], function (_ref7) {
-  var theme = _ref7.theme;
-  return theme.space.xxxs;
-});
-var StyledWeekDaysUList = /*#__PURE__*/styled.ul.withConfig({
   componentId: "sc-18gg4kd-5"
-})(["display:flex;justify-content:space-between;align-items:center;padding:", ";height:30px;font-size:", ";background-color:", ";li{flex:1;text-transform:capitalize;text-align:center;color:$gray;margin:0 1px;}"], function (_ref8) {
+})(["padding:", ";"], function (_ref8) {
   var theme = _ref8.theme;
   return theme.space.xxxs;
-}, function (_ref9) {
+});
+var StyledDayBtn = /*#__PURE__*/styled(DSButtonV2).withConfig({
+  componentId: "sc-18gg4kd-6"
+})(["height:", ";width:", ";min-width:", ";border-radius:50%;color:", ";font-weight:", ";position:relative;&:hover{color:", ";}&:focus:not(:hover){background-color:", ";color:", ";}&:focus{&:after{border-radius:50%;top:-2px;left:-2px;width:calc(100% + 4px);height:calc(100% + 4px);}}"], function (_ref9) {
   var theme = _ref9.theme;
-  return theme.fontSizes.label[400];
+  return theme.space.s;
 }, function (_ref10) {
   var theme = _ref10.theme;
-  return theme.colors.neutral['050'];
-});
-var StyledDayBtn = /*#__PURE__*/styled(DSButton).withConfig({
-  componentId: "sc-18gg4kd-6"
-})(["height:", ";width:", ";min-width:", ";border-radius:50%;color:", ";font-size:", ";font-weight:", ";position:relative;&:hover{color:", ";}&:focus:not(:hover){background-color:", ";color:", ";}&.em-ds-button--text{&:focus{&:after{border-radius:50%;top:-2px;left:-2px;width:calc(100% + 4px);height:calc(100% + 4px);}}}"], function (_ref11) {
+  return theme.space.s;
+}, function (_ref11) {
   var theme = _ref11.theme;
   return theme.space.s;
 }, function (_ref12) {
   var theme = _ref12.theme;
-  return theme.space.s;
+  return theme.colors.neutral[800];
 }, function (_ref13) {
   var theme = _ref13.theme;
-  return theme.space.s;
+  return theme.fontWeights.regular;
 }, function (_ref14) {
   var theme = _ref14.theme;
-  return theme.colors.neutral[800];
+  return theme.colors.brand[700];
 }, function (_ref15) {
   var theme = _ref15.theme;
-  return theme.fontSizes.label[400];
+  return theme.colors.neutral['000'];
 }, function (_ref16) {
   var theme = _ref16.theme;
-  return theme.fontWeights.regular;
-}, function (_ref17) {
-  var theme = _ref17.theme;
-  return theme.colors.brand[700];
-}, function (_ref18) {
-  var theme = _ref18.theme;
-  return theme.colors.neutral['000'];
-}, function (_ref19) {
-  var theme = _ref19.theme;
   return theme.colors.brand[600];
 });
-var StyledMonthDaysUList = /*#__PURE__*/styled.ul.withConfig({
+var StyledWeekDaysListWrapper = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-18gg4kd-7"
-})(["display:grid;grid-template-columns:repeat(7,36px);justify-items:center;li{width:36px;height:36px;display:grid;justify-content:center;align-items:center;position:relative;}li.startRangeDay{border-radius:50% 0 0 50%;background-color:", ";}li.inRangeDay{border-radius:0;background-color:", ";}li.endRangeDay{border-radius:0 50% 50% 0;background-color:", ";}li.focusedDay{", "{&.em-ds-button--text{&:focus{&:before{position:absolute;content:'';top:0;left:0;width:100%;height:100%;border-radius:50%;border:2px solid ", ";pointer-events:none;}}}}}li.startRangeDay,li.endRangeDay,li.selectedDay{", "{color:", ";background-color:", ";font-weight:", ";}}li.notCurrentMonth{", "{font-weight:", ";&:not(:hover){color:", ";}}&.selectedDay,&.startRangeDay,&.endRangeDay{", "{color:", ";}}}li.disabledDay,li.outOfRangeDay{", "{color:", ";font-weight:", ";&.em-ds-button--text{cursor:not-allowed;&:focus{&:after{border-radius:50%;top:-2px;left:-2px;width:calc(100% + 4px);height:calc(100% + 4px);border-color:", ";}}}&:hover{background:", ";}}&:after{cursor:not-allowed;position:absolute;content:'';top:47%;left:3px;width:calc(100% - 5px);height:1px;background-color:", ";transform:rotate(45deg);pointer-events:none;}&.focusedDay{", "{color:", ";font-weight:", ";}&:after{background-color:", ";}}&.selectedDay,&.startRangeDay,&.endRangeDay,&.inRangeDay{", "{color:", ";background-color:", ";}&:after{background-color:", ";}}}"], function (_ref20) {
+})(["font-size:", ";text-align:center;", ";", ";.dayWrapper{position:relative;width:36px;button:focus{&:before{position:absolute;content:'';top:0;left:0;width:100%;height:100%;border-radius:50%;border:2px solid ", ";pointer-events:none;}&:after{position:absolute;content:'';top:-2px;left:-2px;", " border-color:", ";width:calc(100% + 4px);height:calc(100% + 4px);}}&.disabledDay,&.outOfRangeDay{button:focus{&:after{border-color:", ";}}}}.dayWrapper.startRangeDay{border-radius:50% 0 0 50%;background-color:", ";}.dayWrapper.inRangeDay{border-radius:0;background-color:", ";}.dayWrapper.endRangeDay{border-radius:0 50% 50% 0;background-color:", ";}.dayWrapper.startRangeDay.endRangeDay{background:unset;}.dayWrapper.startRangeDay,.dayWrapper.endRangeDay,.dayWrapper.selectedDay{button{color:", ";background-color:", ";font-weight:", ";}}.dayWrapper.notCurrentMonth{button{font-weight:", ";&:not(:hover){color:", ";}}&.selectedDay,&.startRangeDay,&.endRangeDay{button{color:", ";}}}.dayWrapper.disabledDay,.dayWrapper.outOfRangeDay{button{color:", ";font-weight:", ";cursor:not-allowed;&:focus{", " border-color:", ";}&:hover{background:", ";}}&:after{cursor:not-allowed;position:absolute;content:'';top:47%;left:3px;width:calc(100% - 5px);height:1px;background-color:", ";transform:rotate(45deg);pointer-events:none;}&.focusedDay{button{color:", ";font-weight:", ";}&:after{background-color:", ";}}&.selectedDay,&.startRangeDay,&.endRangeDay,&.inRangeDay{button{color:", ";background-color:", ";}&:after{background-color:", ";}}}"], function (_ref17) {
+  var theme = _ref17.theme;
+  return theme.fontSizes.label[400];
+}, function (_ref18) {
+  var isHeader = _ref18.isHeader,
+      theme = _ref18.theme;
+  return isHeader ? "background: ".concat(theme.colors.neutral['050']) : '';
+}, function (_ref19) {
+  var isHeader = _ref19.isHeader;
+  return isHeader ? 'text-transform: capitalize' : '';
+}, function (_ref20) {
   var theme = _ref20.theme;
-  return theme.colors.brand[200];
-}, function (_ref21) {
+  return theme.colors.neutral['000'];
+}, focusBorder, function (_ref21) {
   var theme = _ref21.theme;
-  return theme.colors.brand[200];
+  return theme.colors.brand[700];
 }, function (_ref22) {
   var theme = _ref22.theme;
-  return theme.colors.brand[200];
-}, StyledDayBtn, function (_ref23) {
+  return theme.colors.danger[900];
+}, function (_ref23) {
   var theme = _ref23.theme;
-  return theme.colors.neutral['000'];
-}, StyledDayBtn, function (_ref24) {
+  return theme.colors.brand[200];
+}, function (_ref24) {
   var theme = _ref24.theme;
-  return theme.colors.neutral['000'];
+  return theme.colors.brand[200];
 }, function (_ref25) {
   var theme = _ref25.theme;
-  return theme.colors.brand[700];
+  return theme.colors.brand[200];
 }, function (_ref26) {
   var theme = _ref26.theme;
-  return theme.fontWeights.semibold;
-}, StyledDayBtn, function (_ref27) {
+  return theme.colors.neutral['000'];
+}, function (_ref27) {
   var theme = _ref27.theme;
-  return theme.fontWeights.light;
+  return theme.colors.brand[700];
 }, function (_ref28) {
   var theme = _ref28.theme;
-  return theme.colors.neutral[500];
-}, StyledDayBtn, function (_ref29) {
+  return theme.fontWeights.semibold;
+}, function (_ref29) {
   var theme = _ref29.theme;
-  return theme.colors.neutral['000'];
-}, StyledDayBtn, function (_ref30) {
+  return theme.fontWeights.light;
+}, function (_ref30) {
   var theme = _ref30.theme;
   return theme.colors.neutral[500];
 }, function (_ref31) {
   var theme = _ref31.theme;
-  return theme.fontWeights.light;
+  return theme.colors.neutral['000'];
 }, function (_ref32) {
   var theme = _ref32.theme;
-  return theme.colors.danger[900];
+  return theme.colors.neutral[500];
 }, function (_ref33) {
   var theme = _ref33.theme;
-  return theme.colors.neutral['000'];
-}, function (_ref34) {
+  return theme.fontWeights.light;
+}, focusBorder, function (_ref34) {
   var theme = _ref34.theme;
-  return theme.colors.neutral[500];
-}, StyledDayBtn, function (_ref35) {
-  var theme = _ref35.theme;
   return theme.colors.danger[900];
+}, function (_ref35) {
+  var theme = _ref35.theme;
+  return theme.colors.neutral['000'];
 }, function (_ref36) {
   var theme = _ref36.theme;
-  return theme.fontWeights.regular;
+  return theme.colors.neutral[500];
 }, function (_ref37) {
   var theme = _ref37.theme;
   return theme.colors.danger[900];
-}, StyledDayBtn, function (_ref38) {
+}, function (_ref38) {
   var theme = _ref38.theme;
-  return theme.colors.neutral['000'];
+  return theme.fontWeights.regular;
 }, function (_ref39) {
   var theme = _ref39.theme;
   return theme.colors.danger[900];
 }, function (_ref40) {
   var theme = _ref40.theme;
   return theme.colors.neutral['000'];
-});
-var CalendarFooterMessage = /*#__PURE__*/styled.footer.withConfig({
-  componentId: "sc-18gg4kd-8"
-})(["border-top:solid 1px ", ";margin:0 ", ";padding:", " 0;color:", ";font-style:italic;font-weight:", ";font-size:", ";text-align:right;"], function (_ref41) {
+}, function (_ref41) {
   var theme = _ref41.theme;
-  return theme.colors.neutral[300];
+  return theme.colors.danger[900];
 }, function (_ref42) {
   var theme = _ref42.theme;
-  return theme.space.xxs2;
-}, function (_ref43) {
+  return theme.colors.neutral['000'];
+});
+var StyledWeekDaysHeaderItem = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-18gg4kd-8"
+})(["width:", ";min-width:", ";"], function (_ref43) {
   var theme = _ref43.theme;
-  return theme.space.xxs2;
+  return theme.space.s;
 }, function (_ref44) {
   var theme = _ref44.theme;
-  return theme.colors.danger[900];
-}, function (_ref45) {
+  return theme.space.s;
+});
+var CalendarFooterMessage = /*#__PURE__*/styled.footer.withConfig({
+  componentId: "sc-18gg4kd-9"
+})(["border-top:solid 1px ", ";margin:0 ", ";padding:", " 0;color:", ";font-style:italic;font-weight:", ";font-size:", ";text-align:right;"], function (_ref45) {
   var theme = _ref45.theme;
-  return theme.fontWeights.thin;
+  return theme.colors.neutral[300];
 }, function (_ref46) {
   var theme = _ref46.theme;
+  return theme.space.xxs2;
+}, function (_ref47) {
+  var theme = _ref47.theme;
+  return theme.space.xxs2;
+}, function (_ref48) {
+  var theme = _ref48.theme;
+  return theme.colors.danger[900];
+}, function (_ref49) {
+  var theme = _ref49.theme;
+  return theme.fontWeights.thin;
+}, function (_ref50) {
+  var theme = _ref50.theme;
   return theme.fontSizes.microText[200];
 });
 
-export { CalendarFooterMessage, StyledBody, StyledCalendarWrapper, StyledDayBtn, StyledHeader, StyledHeaderButton, StyledMonthDaysUList, StyledSpacingResetter, StyledWeekDaysUList };
+export { CalendarFooterMessage, StyledBody, StyledCalendarWrapper, StyledDayBtn, StyledHeader, StyledHeaderButton, StyledIconTriggerButton, StyledShadowWrapper, StyledWeekDaysHeaderItem, StyledWeekDaysListWrapper };
 //# sourceMappingURL=Styleds.js.map

package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styleds.js","sources":["../../../../../../src/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport styled from 'styled-components';\nimport { DSButton } from '@elliemae/ds-button';\n\nexport const StyledSpacingResetter = styled.div<{ isControllerOnly: boolean }>`\n  * {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n  }\n  ul {\n    list-style: none;\n  }\n  ${({ isControllerOnly }) =>\n    isControllerOnly ? undefined : 'box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);'}\n`;\n\nexport const StyledCalendarWrapper = styled.div`\n  display: grid;\n  width: 260px;\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  grid-template-rows: auto auto;\n`;\n\nexport const StyledHeader = styled.section`\n  display: grid;\n  padding: ${({ theme }) => theme.space.xxxs};\n  grid-template-columns: min-content min-content 1fr min-content min-content;\n  grid-template-rows: 1fr;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background: ${({ theme }) => theme.colors.neutral['050']};\n  h3 {\n    font-size: 1rem;\n  }\n`;\n\nexport const StyledHeaderButton = styled(DSButton)`\n  position: relative;\n  &:focus {\n    &:after {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n      border-radius: 2px;\n      pointer-events: none;\n    }\n  }\n  &:hover {\n    background: ${({ theme }) => theme.colors.brand[200]};\n  }\n`;\n\nexport const StyledBody = styled.section`\n  padding: ${({ theme }) => theme.space.xxxs};\n`;\n\nexport const StyledWeekDaysUList = styled.ul`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: ${({ theme }) => theme.space.xxxs};\n  height: 30px;\n  font-size: ${({ theme }) => theme.fontSizes.label[400]};\n  background-color: ${({ theme }) => theme.colors.neutral['050']};\n  li {\n    flex: 1;\n    text-transform: capitalize;\n    text-align: center;\n    color: $gray;\n    margin: 0 1px;\n  }\n`;\n\nexport const StyledDayBtn = styled(DSButton)`\n  height: ${({ theme }) => theme.space.s};\n  width: ${({ theme }) => theme.space.s};\n  min-width: ${({ theme }) => theme.space.s};\n  border-radius: 50%;\n  color: ${({ theme }) => theme.colors.neutral[800]};\n  font-size: ${({ theme }) => theme.fontSizes.label[400]};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n  position: relative;\n  &:hover {\n    color: ${({ theme }) => theme.colors.brand[700]};\n  }\n  &:focus:not(:hover) {\n    background-color: ${({ theme }) => theme.colors.neutral['000']};\n    color: ${({ theme }) => theme.colors.brand[600]};\n  }\n  &.em-ds-button--text {\n    &:focus {\n      &:after {\n        border-radius: 50%;\n        top: -2px;\n        left: -2px;\n        width: calc(100% + 4px);\n        height: calc(100% + 4px);\n      }\n    }\n  }\n`;\n\nexport const StyledMonthDaysUList = styled.ul`\n  display: grid;\n  grid-template-columns: repeat(7, 36px);\n  justify-items: center;\n\n  li {\n    width: 36px;\n    height: 36px;\n    display: grid;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n  }\n\n  li.startRangeDay {\n    border-radius: 50% 0 0 50%;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n\n  li.inRangeDay {\n    border-radius: 0;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n\n  li.endRangeDay {\n    border-radius: 0 50% 50% 0;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n\n  li.focusedDay {\n    ${StyledDayBtn} {\n      &.em-ds-button--text {\n        &:focus {\n          &:before {\n            position: absolute;\n            content: '';\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            border-radius: 50%;\n            border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n            pointer-events: none;\n          }\n        }\n      }\n    }\n  }\n\n  li.startRangeDay,\n  li.endRangeDay,\n  li.selectedDay {\n    ${StyledDayBtn} {\n      color: ${({ theme }) => theme.colors.neutral['000']};\n      background-color: ${({ theme }) => theme.colors.brand[700]};\n      font-weight: ${({ theme }) => theme.fontWeights.semibold};\n    }\n  }\n\n  li.notCurrentMonth {\n    ${StyledDayBtn} {\n      font-weight: ${({ theme }) => theme.fontWeights.light};\n      &:not(:hover) {\n        color: ${({ theme }) => theme.colors.neutral[500]};\n      }\n    }\n    &.selectedDay,\n    &.startRangeDay,\n    &.endRangeDay {\n      ${StyledDayBtn} {\n        color: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n  }\n\n  li.disabledDay,\n  li.outOfRangeDay {\n    ${StyledDayBtn} {\n      color: ${({ theme }) => theme.colors.neutral[500]};\n\n      font-weight: ${({ theme }) => theme.fontWeights.light};\n      &.em-ds-button--text {\n        cursor: not-allowed;\n        &:focus {\n          &:after {\n            border-radius: 50%;\n            top: -2px;\n            left: -2px;\n            width: calc(100% + 4px);\n            height: calc(100% + 4px);\n            border-color: ${({ theme }) => theme.colors.danger[900]};\n          }\n        }\n      }\n      &:hover {\n        background: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n    &:after {\n      cursor: not-allowed;\n      position: absolute;\n      content: '';\n      top: 47%;\n      left: 3px;\n      width: calc(100% - 5px);\n      height: 1px;\n      background-color: ${({ theme }) => theme.colors.neutral[500]};\n      transform: rotate(45deg);\n      pointer-events: none;\n    }\n    &.focusedDay {\n      ${StyledDayBtn} {\n        color: ${({ theme }) => theme.colors.danger[900]};\n        font-weight: ${({ theme }) => theme.fontWeights.regular};\n      }\n      &:after {\n        background-color: ${({ theme }) => theme.colors.danger[900]};\n      }\n    }\n    &.selectedDay,\n    &.startRangeDay,\n    &.endRangeDay,\n    &.inRangeDay {\n      ${StyledDayBtn} {\n        color: ${({ theme }) => theme.colors.neutral['000']};\n        background-color: ${({ theme }) => theme.colors.danger[900]};\n      }\n      &:after {\n        background-color: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n  }\n`;\n\nexport const CalendarFooterMessage = styled.footer`\n  border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n  margin: 0 ${({ theme }) => theme.space.xxs2};\n  padding: ${({ theme }) => theme.space.xxs2} 0;\n  color: ${({ theme }) => theme.colors.danger[900]};\n  font-style: italic;\n  font-weight: ${({ theme }) => theme.fontWeights.thin};\n  font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n  text-align: right;\n`;\n"],"names":["StyledSpacingResetter","styled","div","isControllerOnly","undefined","StyledCalendarWrapper","theme","colors","neutral","StyledHeader","section","space","xxxs","StyledHeaderButton","DSButton","brand","StyledBody","StyledWeekDaysUList","ul","fontSizes","label","StyledDayBtn","s","fontWeights","regular","StyledMonthDaysUList","semibold","light","danger","CalendarFooterMessage","footer","xxs2","thin","microText"],"mappings":"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"}
+{"version":3,"file":"Styleds.js","sources":["../../../../../../src/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\n\nconst focusBorder = `\n  border-style: solid;\n  border-width: 2px;\n  border-radius: 50%;\n`;\n\nexport const StyledIconTriggerButton = styled(DSButtonV2)`\n  color: ${({ theme }) => theme.colors.brand['600']};\n  width: 26px;\n  height: 26px;\n`;\n\nexport const StyledShadowWrapper = styled.div<{ isControllerOnly: boolean }>`\n  ${({ isControllerOnly }) =>\n    isControllerOnly ? undefined : 'box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);'}\n`;\n\nexport const StyledCalendarWrapper = styled.div`\n  display: grid;\n  width: 260px;\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  grid-template-rows: auto auto;\n`;\n\nexport const StyledHeader = styled.section`\n  * {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n  }\n  display: grid;\n  padding: ${({ theme }) => theme.space.xxxs};\n  grid-template-columns: min-content min-content 1fr min-content min-content;\n  grid-template-rows: 1fr;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background: ${({ theme }) => theme.colors.neutral['050']};\n  h3 {\n    font-size: 1rem;\n  }\n`;\n\nexport const StyledHeaderButton = styled(DSButtonV2)`\n  position: relative;\n  width: 28px;\n  height: 28px;\n  &:focus {\n    &:after {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n      border-radius: 2px;\n      pointer-events: none;\n    }\n  }\n  &:hover {\n    background: ${({ theme }) => theme.colors.brand[200]};\n  }\n`;\n\nexport const StyledBody = styled.section`\n  padding: ${({ theme }) => theme.space.xxxs};\n`;\n\nexport const StyledDayBtn = styled(DSButtonV2)`\n  height: ${({ theme }) => theme.space.s};\n  width: ${({ theme }) => theme.space.s};\n  min-width: ${({ theme }) => theme.space.s};\n  border-radius: 50%;\n  color: ${({ theme }) => theme.colors.neutral[800]};\n  // font-size: ${({ theme }) => theme.fontSizes.label[400]};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n  position: relative;\n  &:hover {\n    color: ${({ theme }) => theme.colors.brand[700]};\n  }\n  &:focus:not(:hover) {\n    background-color: ${({ theme }) => theme.colors.neutral['000']};\n    color: ${({ theme }) => theme.colors.brand[600]};\n  }\n  &:focus {\n    &:after {\n      border-radius: 50%;\n      top: -2px;\n      left: -2px;\n      width: calc(100% + 4px);\n      height: calc(100% + 4px);\n    }\n  }\n`;\nexport const StyledWeekDaysListWrapper = styled(Grid)`\n  font-size: ${({ theme }) => theme.fontSizes.label[400]};\n  text-align: center;\n  ${({ isHeader, theme }) => (isHeader ? `background: ${theme.colors.neutral['050']}` : '')};\n  ${({ isHeader }) => (isHeader ? 'text-transform: capitalize' : '')};\n\n  .dayWrapper {\n    position: relative;\n    width: 36px;\n    button:focus {\n      &:before {\n        position: absolute;\n        content: '';\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        border-radius: 50%;\n        border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n        pointer-events: none;\n      }\n      &:after {\n        position: absolute;\n        content: '';\n        top: -2px;\n        left: -2px;\n        ${focusBorder}\n        border-color:${({ theme }) => theme.colors.brand[700]};\n        width: calc(100% + 4px);\n        height: calc(100% + 4px);\n      }\n    }\n    &.disabledDay,\n    &.outOfRangeDay {\n      button:focus {\n        &:after {\n          border-color: ${({ theme }) => theme.colors.danger[900]};\n        }\n      }\n    }\n  }\n\n  .dayWrapper.startRangeDay {\n    border-radius: 50% 0 0 50%;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n\n  .dayWrapper.inRangeDay {\n    border-radius: 0;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n\n  .dayWrapper.endRangeDay {\n    border-radius: 0 50% 50% 0;\n    background-color: ${({ theme }) => theme.colors.brand[200]};\n  }\n  .dayWrapper.startRangeDay.endRangeDay {\n    background: unset;\n  }\n\n  .dayWrapper.startRangeDay,\n  .dayWrapper.endRangeDay,\n  .dayWrapper.selectedDay {\n    button {\n      color: ${({ theme }) => theme.colors.neutral['000']};\n      background-color: ${({ theme }) => theme.colors.brand[700]};\n      font-weight: ${({ theme }) => theme.fontWeights.semibold};\n    }\n  }\n\n  .dayWrapper.notCurrentMonth {\n    button {\n      font-weight: ${({ theme }) => theme.fontWeights.light};\n      &:not(:hover) {\n        color: ${({ theme }) => theme.colors.neutral[500]};\n      }\n    }\n    &.selectedDay,\n    &.startRangeDay,\n    &.endRangeDay {\n      button {\n        color: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n  }\n\n  .dayWrapper.disabledDay,\n  .dayWrapper.outOfRangeDay {\n    button {\n      color: ${({ theme }) => theme.colors.neutral[500]};\n\n      font-weight: ${({ theme }) => theme.fontWeights.light};\n      cursor: not-allowed;\n      &:focus {\n        ${focusBorder}\n        border-color: ${({ theme }) => theme.colors.danger[900]};\n      }\n      &:hover {\n        background: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n    &:after {\n      cursor: not-allowed;\n      position: absolute;\n      content: '';\n      top: 47%;\n      left: 3px;\n      width: calc(100% - 5px);\n      height: 1px;\n      background-color: ${({ theme }) => theme.colors.neutral[500]};\n      transform: rotate(45deg);\n      pointer-events: none;\n    }\n    &.focusedDay {\n      button {\n        color: ${({ theme }) => theme.colors.danger[900]};\n        font-weight: ${({ theme }) => theme.fontWeights.regular};\n      }\n      &:after {\n        background-color: ${({ theme }) => theme.colors.danger[900]};\n      }\n    }\n    &.selectedDay,\n    &.startRangeDay,\n    &.endRangeDay,\n    &.inRangeDay {\n      button {\n        color: ${({ theme }) => theme.colors.neutral['000']};\n        background-color: ${({ theme }) => theme.colors.danger[900]};\n      }\n      &:after {\n        background-color: ${({ theme }) => theme.colors.neutral['000']};\n      }\n    }\n  }\n`;\nexport const StyledWeekDaysHeaderItem = styled.div`\n  width: ${({ theme }) => theme.space.s};\n  min-width: ${({ theme }) => theme.space.s};\n`;\n\nexport const CalendarFooterMessage = styled.footer`\n  border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n  margin: 0 ${({ theme }) => theme.space.xxs2};\n  padding: ${({ theme }) => theme.space.xxs2} 0;\n  color: ${({ theme }) => theme.colors.danger[900]};\n  font-style: italic;\n  font-weight: ${({ theme }) => theme.fontWeights.thin};\n  font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n  text-align: right;\n`;\n"],"names":["focusBorder","StyledIconTriggerButton","styled","DSButtonV2","theme","colors","brand","StyledShadowWrapper","div","isControllerOnly","undefined","StyledCalendarWrapper","neutral","StyledHeader","section","space","xxxs","StyledHeaderButton","StyledBody","StyledDayBtn","s","fontWeights","regular","StyledWeekDaysListWrapper","Grid","fontSizes","label","isHeader","danger","semibold","light","StyledWeekDaysHeaderItem","CalendarFooterMessage","footer","xxs2","thin","microText"],"mappings":"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"}

package/esm/controlled-date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.js

@@ -1,5 +1,6 @@
+import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
-import { useContext, useState, useCallback, useMemo } from 'react';
+import { useContext, useState, useMemo, useCallback } from 'react';
 import { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';
 import { useKeyboardHandlers } from './useKeyboardHandlers.js';
 import { useFocusLogic } from './useFocusLogic.js';
@@ -7,7 +8,7 @@ import { usePopperTriggerLogic } from './usePopperTriggerLogic.js';
 import { useCurrentDisplayedMonthYearLogic } from './useCurrentDisplayedMonthYearLogic.js';
 import '../../../ControlledDateTimePickerTypes.js';
 import '../../../utils/dateHelpers.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
+import '../../../utils/constants.js';
 import '../../../utils/stringHelpers.js';
 import '../../../utils/numberHelpers.js';
 import '../../../utils/hooks/useGetStartingFocusedDay.js';
@@ -16,6 +17,18 @@ import 'react-popper';
 import '../../../utils/hooks/useOnClickOutside.js';
 import '../../../utils/hooks/useGetMonthYearFromDateStringOrEmptyStartingMonth.js';
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function sliceIntoChunks(arr, chunkSize) {
+  var res = [];
+
+  for (var i = 0; i < arr.length; i += chunkSize) {
+    var chunk = arr.slice(i, i + chunkSize);
+    res.push(chunk);
+  }
+
+  return res;
+}
+
 var useConfigCalendarCTX = function useConfigCalendarCTX() {
   var _useContext = useContext(ControlledDateTimePickerContext),
       pickerButtonRef = _useContext.pickerButtonRef,
@@ -37,7 +50,8 @@ var useConfigCalendarCTX = function useConfigCalendarCTX() {
       isControllerOnly = _useContext.isControllerOnly,
       isWithTimeWheelToo = _useContext.isWithTimeWheelToo,
       setLatestInteractionRegion = _useContext.setLatestInteractionRegion,
-      autoFocusPrevMonthArrow = _useContext.autoFocusPrevMonthArrow;
+      autoFocusPrevMonthArrow = _useContext.autoFocusPrevMonthArrow,
+      ariaCurrentValueForInputs = _useContext.ariaCurrentValueForInputs;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -53,6 +67,22 @@ var useConfigCalendarCTX = function useConfigCalendarCTX() {
       handleNextMonth = _useCurrentDisplayedM.handleNextMonth,
       handleNextYear = _useCurrentDisplayedM.handleNextYear;
 
+  var _useMemo = useMemo(function () {
+    var _ref = _toConsumableArray(daysArray),
+        invisible1stDay = _ref[0],
+        otherDays = _ref.slice(1);
+
+    var invisibleDayLast = otherDays.pop();
+    return {
+      invisibleFirstDay: invisible1stDay,
+      daysMatrixByWeekday: sliceIntoChunks(otherDays, 7),
+      invisibleLastDay: invisibleDayLast
+    };
+  }, [daysArray]),
+      invisibleFirstDay = _useMemo.invisibleFirstDay,
+      daysMatrixByWeekday = _useMemo.daysMatrixByWeekday,
+      invisibleLastDay = _useMemo.invisibleLastDay;
+
   var setLatestInteractionRegionCalendarHead = useCallback(function () {
     setLatestInteractionRegion('calendar-head');
   }, [setLatestInteractionRegion]);
@@ -158,6 +188,9 @@ var useConfigCalendarCTX = function useConfigCalendarCTX() {
       currentMonth: currentMonth,
       currentYear: currentYear,
       daysArray: daysArray,
+      invisibleFirstDay: invisibleFirstDay,
+      daysMatrixByWeekday: daysMatrixByWeekday,
+      invisibleLastDay: invisibleLastDay,
       focusedDay: focusedDay,
       tryToFocusCurrentlyDataIsFocusedDay: tryToFocusCurrentlyDataIsFocusedDay,
       handleFocusMetaDay: handleFocusMetaDay,
@@ -178,9 +211,10 @@ var useConfigCalendarCTX = function useConfigCalendarCTX() {
       onNextMonthFocus: onNextMonthFocus,
       onNextYearFocus: onNextYearFocus,
       isWithTimeWheelToo: isWithTimeWheelToo,
-      autoFocusPrevMonthArrow: autoFocusPrevMonthArrow
+      autoFocusPrevMonthArrow: autoFocusPrevMonthArrow,
+      ariaCurrentValueForInputs: ariaCurrentValueForInputs
     };
-  }, [showCalendar, closeCalendar, setPopperElement, setArrowElement, usePopperHelpers, handleToggleCalendar, handleSetTriggerRef, handleMenuWrapperKeyDown, isControllerOnly, calendarDaysWrapperRef, prevYearBtnRef, prevMonthBtnRef, nextMonthBtnRef, nextYearBtnRef, currentMonth, currentYear, daysArray, focusedDay, tryToFocusCurrentlyDataIsFocusedDay, handleFocusMetaDay, handleFocusMetaDayByDay, resetFocusedDayToStartDate, handlePrevMonth, handlePrevYear, handleNextMonth, handleNextYear, handleDayOnKeyDown, handlePrevYearKeyDown, handlePrevMonthKeyDown, handleNextMonthKeyDown, handleNextYearKeyDown, handlePickerIconKeyDown, onPrevYearFocus, onPrevMonthFocus, onNextMonthFocus, onNextYearFocus, isWithTimeWheelToo, autoFocusPrevMonthArrow]);
+  }, [showCalendar, closeCalendar, setPopperElement, setArrowElement, usePopperHelpers, handleToggleCalendar, handleSetTriggerRef, handleMenuWrapperKeyDown, isControllerOnly, calendarDaysWrapperRef, prevYearBtnRef, prevMonthBtnRef, nextMonthBtnRef, nextYearBtnRef, currentMonth, currentYear, daysArray, invisibleFirstDay, daysMatrixByWeekday, invisibleLastDay, focusedDay, tryToFocusCurrentlyDataIsFocusedDay, handleFocusMetaDay, handleFocusMetaDayByDay, resetFocusedDayToStartDate, handlePrevMonth, handlePrevYear, handleNextMonth, handleNextYear, handleDayOnKeyDown, handlePrevYearKeyDown, handlePrevMonthKeyDown, handleNextMonthKeyDown, handleNextYearKeyDown, handlePickerIconKeyDown, onPrevYearFocus, onPrevMonthFocus, onNextMonthFocus, onNextYearFocus, isWithTimeWheelToo, autoFocusPrevMonthArrow, ariaCurrentValueForInputs]);
 };
 
 export { useConfigCalendarCTX };