@elliemae/ds-controlled-form 2.2.0-alpha.4 → 3.0.0-next.2

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

@@ -1,356 +1,365 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var Styleds_exports = {};
-__export(Styleds_exports, {
-  CalendarFooterMessage: () => CalendarFooterMessage,
-  StyledBody: () => StyledBody,
-  StyledCalendarWrapper: () => StyledCalendarWrapper,
-  StyledDayBtn: () => StyledDayBtn,
-  StyledHeader: () => StyledHeader,
-  StyledHeaderButton: () => StyledHeaderButton,
-  StyledIconTriggerButton: () => StyledIconTriggerButton,
-  StyledShadowWrapper: () => StyledShadowWrapper,
-  StyledWeekDaysHeaderItem: () => StyledWeekDaysHeaderItem,
-  StyledWeekDaysListWrapper: () => StyledWeekDaysListWrapper
-});
-var React = __toESM(require("react"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_system = require("@elliemae/ds-system");
-var import_ds_grid = require("@elliemae/ds-grid");
-var import_ds_button = require("@elliemae/ds-button");
-const diagonalLine = import_ds_system.css`
-  &:before {
-    position: absolute;
-    content: '';
-    top: 48%;
-    left: -2px;
-    height: 1px;
-    width: calc(100% + 4px);
-    transform: rotate(45deg);
-    background-color: ${({ theme }) => theme.colors.neutral[500]};
-  }
-`;
-const focusBorder = import_ds_system.css`
-  &:after {
-    position: absolute;
-    content: '';
-    top: -4px;
-    left: -4px;
-    width: calc(100% + 8px);
-    height: calc(100% + 8px);
-    border-radius: 50%;
-  }
-`;
-const backgroundDateRange = {
-  inRange: import_ds_system.css`
-    background-color: ${({ theme }) => theme.colors.brand[200]};
-    box-shadow: 4px 0 0 0 ${({ theme }) => theme.colors.brand[200]};
-  `,
-  startRange: import_ds_system.css`
-    background-color: ${({ theme }) => theme.colors.brand[200]};
-    border-radius: 50% 0 0 50%;
-    box-shadow: 4px 0 0 0 ${({ theme }) => theme.colors.brand[200]};
-  `,
-  endRange: import_ds_system.css`
-    background-color: ${({ theme }) => theme.colors.brand[200]};
-    border-radius: 0 50% 50% 0;
-  `
-};
-const StyledIconTriggerButton = (0, import_styled_components.default)(import_ds_button.DSButtonV2)`
-  color: ${({ theme }) => theme.colors.brand["600"]};
-  width: 26px;
-  height: 26px;
-`;
-const StyledShadowWrapper = import_styled_components.default.div`
-  ${({ isControllerOnly }) => isControllerOnly ? void 0 : "box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);"}
-`;
-const StyledCalendarWrapper = import_styled_components.default.div`
-  display: grid;
-  width: 260px;
-  background-color: ${({ theme }) => theme.colors.neutral["000"]};
-  grid-template-rows: auto auto;
-`;
-const StyledHeader = import_styled_components.default.section`
-  * {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-  }
-  display: grid;
-  padding: ${({ theme }) => theme.space.xxxs};
-  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: ${({ theme }) => theme.colors.neutral["050"]};
-  h3 {
-    font-size: 1rem;
-  }
-`;
-const StyledHeaderButton = (0, import_styled_components.default)(import_ds_button.DSButtonV2)`
-  position: relative;
-  width: 28px;
-  height: 28px;
-  &:focus {
-    &:after {
-      content: '';
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      border: 2px solid ${({ theme }) => theme.colors.brand[700]};
-      border-radius: 2px;
-      pointer-events: none;
-    }
-  }
-  &:hover {
-    background: ${({ theme }) => theme.colors.brand[200]};
-  }
-`;
-const StyledBody = import_styled_components.default.section`
-  padding: ${({ theme }) => theme.space.xxxs};
-`;
-const StyledDayBtn = (0, import_styled_components.default)(import_ds_button.DSButtonV2)`
-  height: 32px;
-  width: 32px;
-  border-radius: 50%;
-  position: relative;
-  border-width: 2px;
-  border-style: solid;
-  border-color: transparent;
-  line-height: 1;
-  color: ${({ theme }) => theme.colors.neutral[800]};
-  &:hover {
-    cursor: pointer;
-    color: ${({ theme }) => theme.colors.brand[700]};
-    background-color: ${({ theme }) => theme.colors.brand[200]};
-  }
-  &:focus {
-    ${focusBorder}
-  }
-`;
-const StyledWeekDaysListWrapper = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  font-size: ${({ theme }) => theme.fontSizes.label[400]};
-  text-align: center;
-  ${({ isHeader, theme }) => isHeader ? `background: ${theme.colors.neutral["050"]}` : ""};
-  ${({ isHeader }) => isHeader ? "text-transform: capitalize" : ""};
-
-  .dayWrapper.selectedDay,
-  .dayWrapper.startRangeDay,
-  .dayWrapper.endRangeDay {
-    ${StyledDayBtn} {
-      color: ${({ theme }) => theme.colors.neutral["000"]};
-      font-weight: ${({ theme }) => theme.fontWeights.semibold};
-    }
-
-    &:not(.disabledDay),
-    &:not(.outOfRangeDay) {
-      ${StyledDayBtn} {
-        background-color: ${({ theme }) => theme.colors.brand[700]};
-      }
-    }
-
-    &.disabledDay,
-    &.outOfRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        background-color: ${({ theme }) => theme.colors.danger[900]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-    }
-
-    &.focusedDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        border-color: ${({ theme }) => theme.colors.neutral["000"]};
-      }
-    }
-
-    &.outOfRangeDay.focusedDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-    }
-  }
-
-  .dayWrapper.disabledDay,
-  .dayWrapper.outOfRangeDay {
-    ${StyledDayBtn} {
-      color: ${({ theme }) => theme.colors.neutral[500]};
-      ${diagonalLine}
-      &:before {
-        background-color: ${({ theme }) => theme.colors.neutral[500]};
-      }
-    }
-    &.focusedDay {
-      ${StyledDayBtn} {
-        &:after {
-          border: 2px solid ${({ theme }) => theme.colors.danger[900]};
-        }
-      }
-    }
-  }
-
-  .dayWrapper.focusedDay {
-    ${StyledDayBtn} {
-      ${focusBorder}
-      color: ${({ theme }) => theme.colors.brand[600]};
-      &:after {
-        border: 2px solid ${({ theme }) => theme.colors.brand[700]};
-      }
-    }
-
-    &.disabledDay,
-    &.outOfRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.danger[900]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.danger[900]};
-        }
-      }
-    }
-  }
-
-  .dayWrapper.notCurrentMonth {
-    ${StyledDayBtn} {
-      color: ${({ theme }) => theme.colors.neutral[500]};
-    }
+'use strict';
 
-    &.focusedDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.brand[600]};
-      }
+Object.defineProperty(exports, '__esModule', { value: true });
 
-      &.disabledDay,
-      &.outOfRangeDay {
-        ${StyledDayBtn} {
-          color: ${({ theme }) => theme.colors.danger[900]};
-        }
+var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
+var styled = require('styled-components');
+var dsSystem = require('@elliemae/ds-system');
+var Grid = require('@elliemae/ds-grid');
+var DSButton = require('@elliemae/ds-button');
 
-        &.inRangeDay,
-        &.startRangeDay,
-        &.endRangeDay {
-          ${StyledDayBtn} {
-            color: ${({ theme }) => theme.colors.neutral["000"]};
-          }
-        }
-      }
-    }
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-    &.selectedDay,
-    &.startRangeDay,
-    &.endRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-      }
-    }
-  }
+var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-  .dayWrapper.inRangeDay {
-    ${backgroundDateRange.inRange}
-    &.disabledDay,
-    &.outOfRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        background-color: ${({ theme }) => theme.colors.danger[900]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-      &.focusedDay {
-        ${StyledDayBtn} {
-          border-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-    }
-  }
-
-  .dayWrapper.startRangeDay {
-    ${backgroundDateRange.startRange}
-    &.focusedDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-      }
-    }
-    &.disabledDay,
-    &.outOfRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-    }
-  }
-
-  .dayWrapper.endRangeDay {
-    ${backgroundDateRange.endRange}
-    &.focusedDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-      }
-    }
-    &.disabledDay,
-    &.outOfRangeDay {
-      ${StyledDayBtn} {
-        color: ${({ theme }) => theme.colors.neutral["000"]};
-        &:before {
-          background-color: ${({ theme }) => theme.colors.neutral["000"]};
-        }
-      }
-    }
-  }
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+const diagonalLine = dsSystem.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n  &:before {\n    position: absolute;\n    content: '';\n    top: 48%;\n    left: -2px;\n    height: 1px;\n    width: calc(100% + 4px);\n    transform: rotate(45deg);\n    background-color: ", ";\n  }\n"])), _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.colors.neutral[500];
+});
+const focusBorder = dsSystem.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n  &:after {\n    position: absolute;\n    content: '';\n    top: -4px;\n    left: -4px;\n    width: calc(100% + 8px);\n    height: calc(100% + 8px);\n    border-radius: 50%;\n  }\n"])));
+const backgroundDateRange = {
+  inRange: dsSystem.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\n    background-color: ", ";\n    box-shadow: 4px 0 0 0 ", ";\n  "])), _ref2 => {
+    let {
+      theme
+    } = _ref2;
+    return theme.colors.brand[200];
+  }, _ref3 => {
+    let {
+      theme
+    } = _ref3;
+    return theme.colors.brand[200];
+  }),
+  startRange: dsSystem.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default["default"](["\n    background-color: ", ";\n    border-radius: 50% 0 0 50%;\n    box-shadow: 4px 0 0 0 ", ";\n  "])), _ref4 => {
+    let {
+      theme
+    } = _ref4;
+    return theme.colors.brand[200];
+  }, _ref5 => {
+    let {
+      theme
+    } = _ref5;
+    return theme.colors.brand[200];
+  }),
+  endRange: dsSystem.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default["default"](["\n    background-color: ", ";\n    border-radius: 0 50% 50% 0;\n  "])), _ref6 => {
+    let {
+      theme
+    } = _ref6;
+    return theme.colors.brand[200];
+  })
+};
+const StyledIconTriggerButton = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
+  componentId: "sc-18gg4kd-0"
+})(["color:", ";width:26px;height:26px;"], _ref7 => {
+  let {
+    theme
+  } = _ref7;
+  return theme.colors.brand['600'];
+});
+const StyledShadowWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-18gg4kd-1"
+})(["", ""], _ref8 => {
+  let {
+    isControllerOnly
+  } = _ref8;
+  return isControllerOnly ? undefined : 'box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);';
+});
+const StyledCalendarWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-18gg4kd-2"
+})(["display:grid;width:260px;background-color:", ";grid-template-rows:auto auto;"], _ref9 => {
+  let {
+    theme
+  } = _ref9;
+  return theme.colors.neutral['000'];
+});
+const StyledHeader = /*#__PURE__*/styled__default["default"].section.withConfig({
+  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;}"], _ref10 => {
+  let {
+    theme
+  } = _ref10;
+  return theme.space.xxxs;
+}, _ref11 => {
+  let {
+    theme
+  } = _ref11;
+  return theme.colors.neutral['050'];
+});
+const StyledHeaderButton = /*#__PURE__*/styled__default["default"](DSButton.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:", ";}"], _ref12 => {
+  let {
+    theme
+  } = _ref12;
+  return theme.colors.brand[700];
+}, _ref13 => {
+  let {
+    theme
+  } = _ref13;
+  return theme.colors.brand[200];
+});
+const StyledBody = /*#__PURE__*/styled__default["default"].section.withConfig({
+  componentId: "sc-18gg4kd-5"
+})(["padding:", ";"], _ref14 => {
+  let {
+    theme
+  } = _ref14;
+  return theme.space.xxxs;
+});
+const StyledDayBtn = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
+  componentId: "sc-18gg4kd-6"
+})(["height:32px;width:32px;border-radius:50%;position:relative;border-width:2px;border-style:solid;border-color:transparent;line-height:1;color:", ";&:hover{cursor:pointer;color:", ";background-color:", ";}&:focus{", "}"], _ref15 => {
+  let {
+    theme
+  } = _ref15;
+  return theme.colors.neutral[800];
+}, _ref16 => {
+  let {
+    theme
+  } = _ref16;
+  return theme.colors.brand[700];
+}, _ref17 => {
+  let {
+    theme
+  } = _ref17;
+  return theme.colors.brand[200];
+}, focusBorder);
+const StyledWeekDaysListWrapper = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
+  componentId: "sc-18gg4kd-7"
+})(["font-size:", ";text-align:center;", ";", ";.dayWrapper.selectedDay,.dayWrapper.startRangeDay,.dayWrapper.endRangeDay{", "{color:", ";font-weight:", ";}&:not(.disabledDay),&:not(.outOfRangeDay){", "{background-color:", ";}}&.disabledDay,&.outOfRangeDay{", "{color:", ";background-color:", ";&:before{background-color:", ";}}}&.focusedDay{", "{color:", ";border-color:", ";}}&.outOfRangeDay.focusedDay{", "{color:", ";&:before{background-color:", ";}}}}.dayWrapper.disabledDay,.dayWrapper.outOfRangeDay{", "{color:", ";", " &:before{background-color:", ";}}&.focusedDay{", "{&:after{border:2px solid ", ";}}}}.dayWrapper.focusedDay{", "{", " color:", ";&:after{border:2px solid ", ";}}&.disabledDay,&.outOfRangeDay{", "{color:", ";&:before{background-color:", ";}}}}.dayWrapper.notCurrentMonth{", "{color:", ";}&.focusedDay{", "{color:", ";}&.disabledDay,&.outOfRangeDay{", "{color:", ";}&.inRangeDay,&.startRangeDay,&.endRangeDay{", "{color:", ";}}}}&.selectedDay,&.startRangeDay,&.endRangeDay{", "{color:", ";}}}.dayWrapper.inRangeDay{", " &.disabledDay,&.outOfRangeDay{", "{color:", ";background-color:", ";&:before{background-color:", ";}}&.focusedDay{", "{border-color:", ";}}}}.dayWrapper.startRangeDay{", " &.focusedDay{", "{color:", ";}}&.disabledDay,&.outOfRangeDay{", "{color:", ";&:before{background-color:", ";}}}}.dayWrapper.endRangeDay{", " &.focusedDay{", "{color:", ";}}&.disabledDay,&.outOfRangeDay{", "{color:", ";&:before{background-color:", ";}}}}.dayWrapper.endRangeDay.startRangeDay{background-color:transparent;box-shadow:none;}"], _ref18 => {
+  let {
+    theme
+  } = _ref18;
+  return theme.fontSizes.label[400];
+}, _ref19 => {
+  let {
+    isHeader,
+    theme
+  } = _ref19;
+  return isHeader ? "background: ".concat(theme.colors.neutral['050']) : '';
+}, _ref20 => {
+  let {
+    isHeader
+  } = _ref20;
+  return isHeader ? 'text-transform: capitalize' : '';
+}, StyledDayBtn, _ref21 => {
+  let {
+    theme
+  } = _ref21;
+  return theme.colors.neutral['000'];
+}, _ref22 => {
+  let {
+    theme
+  } = _ref22;
+  return theme.fontWeights.semibold;
+}, StyledDayBtn, _ref23 => {
+  let {
+    theme
+  } = _ref23;
+  return theme.colors.brand[700];
+}, StyledDayBtn, _ref24 => {
+  let {
+    theme
+  } = _ref24;
+  return theme.colors.neutral['000'];
+}, _ref25 => {
+  let {
+    theme
+  } = _ref25;
+  return theme.colors.danger[900];
+}, _ref26 => {
+  let {
+    theme
+  } = _ref26;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref27 => {
+  let {
+    theme
+  } = _ref27;
+  return theme.colors.neutral['000'];
+}, _ref28 => {
+  let {
+    theme
+  } = _ref28;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref29 => {
+  let {
+    theme
+  } = _ref29;
+  return theme.colors.neutral['000'];
+}, _ref30 => {
+  let {
+    theme
+  } = _ref30;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref31 => {
+  let {
+    theme
+  } = _ref31;
+  return theme.colors.neutral[500];
+}, diagonalLine, _ref32 => {
+  let {
+    theme
+  } = _ref32;
+  return theme.colors.neutral[500];
+}, StyledDayBtn, _ref33 => {
+  let {
+    theme
+  } = _ref33;
+  return theme.colors.danger[900];
+}, StyledDayBtn, focusBorder, _ref34 => {
+  let {
+    theme
+  } = _ref34;
+  return theme.colors.brand[600];
+}, _ref35 => {
+  let {
+    theme
+  } = _ref35;
+  return theme.colors.brand[700];
+}, StyledDayBtn, _ref36 => {
+  let {
+    theme
+  } = _ref36;
+  return theme.colors.danger[900];
+}, _ref37 => {
+  let {
+    theme
+  } = _ref37;
+  return theme.colors.danger[900];
+}, StyledDayBtn, _ref38 => {
+  let {
+    theme
+  } = _ref38;
+  return theme.colors.neutral[500];
+}, StyledDayBtn, _ref39 => {
+  let {
+    theme
+  } = _ref39;
+  return theme.colors.brand[600];
+}, StyledDayBtn, _ref40 => {
+  let {
+    theme
+  } = _ref40;
+  return theme.colors.danger[900];
+}, StyledDayBtn, _ref41 => {
+  let {
+    theme
+  } = _ref41;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref42 => {
+  let {
+    theme
+  } = _ref42;
+  return theme.colors.neutral['000'];
+}, backgroundDateRange.inRange, StyledDayBtn, _ref43 => {
+  let {
+    theme
+  } = _ref43;
+  return theme.colors.neutral['000'];
+}, _ref44 => {
+  let {
+    theme
+  } = _ref44;
+  return theme.colors.danger[900];
+}, _ref45 => {
+  let {
+    theme
+  } = _ref45;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref46 => {
+  let {
+    theme
+  } = _ref46;
+  return theme.colors.neutral['000'];
+}, backgroundDateRange.startRange, StyledDayBtn, _ref47 => {
+  let {
+    theme
+  } = _ref47;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref48 => {
+  let {
+    theme
+  } = _ref48;
+  return theme.colors.neutral['000'];
+}, _ref49 => {
+  let {
+    theme
+  } = _ref49;
+  return theme.colors.neutral['000'];
+}, backgroundDateRange.endRange, StyledDayBtn, _ref50 => {
+  let {
+    theme
+  } = _ref50;
+  return theme.colors.neutral['000'];
+}, StyledDayBtn, _ref51 => {
+  let {
+    theme
+  } = _ref51;
+  return theme.colors.neutral['000'];
+}, _ref52 => {
+  let {
+    theme
+  } = _ref52;
+  return theme.colors.neutral['000'];
+});
+const StyledWeekDaysHeaderItem = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-18gg4kd-8"
+})(["width:", ";min-width:", ";"], _ref53 => {
+  let {
+    theme
+  } = _ref53;
+  return theme.space.s;
+}, _ref54 => {
+  let {
+    theme
+  } = _ref54;
+  return theme.space.s;
+});
+const CalendarFooterMessage = /*#__PURE__*/styled__default["default"].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;"], _ref55 => {
+  let {
+    theme
+  } = _ref55;
+  return theme.colors.neutral[300];
+}, _ref56 => {
+  let {
+    theme
+  } = _ref56;
+  return theme.space.xxs2;
+}, _ref57 => {
+  let {
+    theme
+  } = _ref57;
+  return theme.space.xxs2;
+}, _ref58 => {
+  let {
+    theme
+  } = _ref58;
+  return theme.colors.danger[900];
+}, _ref59 => {
+  let {
+    theme
+  } = _ref59;
+  return theme.fontWeights.thin;
+}, _ref60 => {
+  let {
+    theme
+  } = _ref60;
+  return theme.fontSizes.microText[200];
+});
 
-  .dayWrapper.endRangeDay.startRangeDay {
-    background-color: transparent;
-    box-shadow: none;
-  }
-`;
-const StyledWeekDaysHeaderItem = import_styled_components.default.div`
-  width: ${({ theme }) => theme.space.s};
-  min-width: ${({ theme }) => theme.space.s};
-`;
-const CalendarFooterMessage = import_styled_components.default.footer`
-  border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};
-  margin: 0 ${({ theme }) => theme.space.xxs2};
-  padding: ${({ theme }) => theme.space.xxs2} 0;
-  color: ${({ theme }) => theme.colors.danger[900]};
-  font-style: italic;
-  font-weight: ${({ theme }) => theme.fontWeights.thin};
-  font-size: ${({ theme }) => theme.fontSizes.microText[200]};
-  text-align: right;
-`;
-module.exports = __toCommonJS(Styleds_exports);
-//# sourceMappingURL=Styleds.js.map
+exports.CalendarFooterMessage = CalendarFooterMessage;
+exports.StyledBody = StyledBody;
+exports.StyledCalendarWrapper = StyledCalendarWrapper;
+exports.StyledDayBtn = StyledDayBtn;
+exports.StyledHeader = StyledHeader;
+exports.StyledHeaderButton = StyledHeaderButton;
+exports.StyledIconTriggerButton = StyledIconTriggerButton;
+exports.StyledShadowWrapper = StyledShadowWrapper;
+exports.StyledWeekDaysHeaderItem = StyledWeekDaysHeaderItem;
+exports.StyledWeekDaysListWrapper = StyledWeekDaysListWrapper;