carbon-react 111.12.3 → 111.12.4

package/lib/components/checkbox/checkbox.style.js

@@ -4,18 +4,31 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
 var _styledSystem = require("styled-system");
+
 var _checkableInput = require("../../__internal__/checkable-input/checkable-input.style");
+
 var _fieldHelp = _interopRequireDefault(require("../../__internal__/field-help/field-help.style"));
+
 var _hiddenCheckableInput = _interopRequireDefault(require("../../__internal__/checkable-input/hidden-checkable-input.style"));
+
 var _checkableInputSvgWrapper = _interopRequireDefault(require("../../__internal__/checkable-input/checkable-input-svg-wrapper.style"));
+
 var _label = _interopRequireWildcard(require("../../__internal__/label/label.style"));
+
 var _validationIcon = _interopRequireDefault(require("../../__internal__/validations/validation-icon.style"));
+
 var _base = _interopRequireDefault(require("../../style/themes/base"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const StyledCheckbox = _styledComponents.default.div`
   ${_styledSystem.margin}
   ${({

package/lib/components/checkbox/index.js

@@ -15,6 +15,9 @@ Object.defineProperty(exports, "Checkbox", {
     return _checkbox.default;
   }
 });
+
 var _checkboxGroup = _interopRequireDefault(require("./checkbox-group.component"));
+
 var _checkbox = _interopRequireDefault(require("./checkbox.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/confirm/confirm.component.js

@@ -4,20 +4,35 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
+
 var _heading = _interopRequireDefault(require("../heading"));
+
 var _dialog = _interopRequireDefault(require("../dialog"));
+
 var _confirm = require("./confirm.style");
+
 var _button = _interopRequireDefault(require("../button/button.component"));
+
 var _icon = _interopRequireDefault(require("../icon"));
+
 var _loader = _interopRequireDefault(require("../loader"));
+
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const Confirm = ({
   "aria-labelledby": ariaLabelledBy,
   "aria-describedby": ariaDescribedBy,
@@ -56,12 +71,15 @@ const Confirm = ({
     "aria-describedby": ariaDescribedBy,
     "aria-label": ariaLabel
   };
+
   if (title && iconType) {
     ariaProps["aria-labelledby"] = titleId;
   }
+
   if (subtitle && iconType) {
     ariaProps["aria-describedby"] = subtitleId;
   }
+
   const renderCancelButton = () => {
     if (!onCancel) return null;
     return /*#__PURE__*/_react.default.createElement(_button.default, {
@@ -74,6 +92,7 @@ const Confirm = ({
       iconPosition: cancelButtonIconPosition
     }, cancelLabel || l.confirm.no());
   };
+
   const renderConfirmButton = () => /*#__PURE__*/_react.default.createElement(_button.default, {
     onClick: onConfirm,
     "data-element": "confirm",
@@ -87,6 +106,7 @@ const Confirm = ({
     isInsideButton: true,
     isActive: true
   }) : confirmLabel || l.confirm.yes());
+
   const getTitle = () => {
     if (iconType) {
       return /*#__PURE__*/_react.default.createElement(_confirm.StyledConfirmHeading, {
@@ -103,8 +123,10 @@ const Confirm = ({
         divider: false
       }));
     }
+
     return title;
   };
+
   return /*#__PURE__*/_react.default.createElement(_dialog.default, _extends({
     open: open,
     onCancel: onCancel,
@@ -115,6 +137,7 @@ const Confirm = ({
     role: "alertdialog"
   }, ariaProps, rest), children, /*#__PURE__*/_react.default.createElement(_confirm.StyledConfirmButtons, null, renderCancelButton(), renderConfirmButton()));
 };
+
 Confirm.defaultProps = {
   size: "extra-small",
   showCloseIcon: false,
@@ -127,77 +150,105 @@ Confirm.defaultProps = {
 Confirm.propTypes = {
   /** Prop to specify the aria-describedby property of the component */
   "aria-describedby": _propTypes.default.string,
+
   /**
    * Prop to specify the aria-label of the component.
    * To be used only when the title prop is not defined, and the component is not labelled by any internal element.
    */
   "aria-label": _propTypes.default.string,
+
   /**
    * Prop to specify the aria-labeledby property of the component
    * To be used when the title prop is a custom React Node,
    * or the component is labelled by an internal element other than the title.
    */
   "aria-labelledby": _propTypes.default.string,
+
   /** Confirm content */
   children: _propTypes.default.node,
+
   /** Controls the open state of the component */
   open: _propTypes.default.bool.isRequired,
+
   /** A custom close event handler */
   onCancel: _propTypes.default.func,
+
   /** Determines if the Esc Key closes the Confirm */
   disableEscKey: _propTypes.default.bool,
+
   /** Allows developers to specify a specific height for the Confirm. */
   height: _propTypes.default.string,
+
   /** Title displayed at top of component */
   title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
+
   /** Subtitle displayed at top of component */
   subtitle: _propTypes.default.string,
+
   /** Size of component */
   size: _propTypes.default.oneOf(["auto", "extra-small", "small", "medium-small", "medium", "medium-large", "large", "extra-large"]),
+
   /** Determines if the close icon is shown */
   showCloseIcon: _propTypes.default.bool,
+
   /** Optional reference to an element meant to be focused on open */
   focusFirstElement: _propTypes.default.shape({
     current: _propTypes.default.any
   }),
+
   /** Disables auto focus functionality on child elements */
   disableAutoFocus: _propTypes.default.bool,
+
   /** A custom event handler when a confirmation takes place */
   onConfirm: _propTypes.default.func.isRequired,
+
   /** Customise the confirm button label */
   confirmLabel: _propTypes.default.string,
+
   /** Customise the cancel button label */
   cancelLabel: _propTypes.default.string,
+
   /** Apply destructive style to the cancel button */
   cancelButtonDestructive: _propTypes.default.bool,
+
   /** Apply destructive style to the confirm button */
   confirmButtonDestructive: _propTypes.default.bool,
+
   /** Defines a cancel button Icon position related to the children: "before" | "after" */
   cancelButtonIconPosition: _propTypes.default.oneOf(["before", "after"]),
+
   /**
    * <a href="https://brand.sage.com/d/NdbrveWvNheA/foundations#/icons/icons" target="_blank">List of supported icons</a>
    *
    *  Defines an Icon type within the cancel button (see Icon for options)
    * */
   cancelButtonIconType: _propTypes.default.string,
+
   /** Defines a confirm button Icon position related to the children: "before" | "after" */
   confirmButtonIconPosition: _propTypes.default.oneOf(["before", "after"]),
+
   /**
    *  <a href="https://brand.sage.com/d/NdbrveWvNheA/foundations#/icons/icons" target="_blank">List of supported icons</a>
    *
    * Defines an Icon type within the confirm button (see Icon for options)
    * */
   confirmButtonIconType: _propTypes.default.string,
+
   /** Defines an Icon type within the button (see Icon for options) */
   iconType: _propTypes.default.oneOf(["error", "warning"]),
+
   /** Makes cancel button disabled */
   disableCancel: _propTypes.default.bool,
+
   /** Makes confirm button disabled */
   disableConfirm: _propTypes.default.bool,
+
   /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" */
   cancelButtonType: _propTypes.default.oneOf(["primary", "secondary", "tertiary", "dashed", "darkBackground"]),
+
   /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" */
   confirmButtonType: _propTypes.default.oneOf(["primary", "secondary", "tertiary", "dashed", "darkBackground"]),
+
   /** Adds isLoading state into confirm button */
   isLoadingConfirm: _propTypes.default.bool
 };

package/lib/components/confirm/confirm.style.js

@@ -4,13 +4,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledConfirmHeading = exports.StyledConfirmButtons = void 0;
+
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _icon = _interopRequireDefault(require("../icon/icon.style"));
+
 var _heading = require("../heading/heading.style");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const StyledConfirmButtons = _styledComponents.default.div`
   margin-top: 48px;
   display: flex;

package/lib/components/confirm/index.js

@@ -9,5 +9,7 @@ Object.defineProperty(exports, "default", {
     return _confirm.default;
   }
 });
+
 var _confirm = _interopRequireDefault(require("./confirm.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/content/content.component.js

@@ -4,11 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Content = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _content = require("./content.style");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const Content = ({
   variant = "primary",
   children,
@@ -39,6 +45,7 @@ const Content = ({
     align: align
   }, children));
 };
+
 exports.Content = Content;
 Content.propTypes = {
   "align": _propTypes.default.oneOf(["center", "left", "right"]),

package/lib/components/content/content.style.js

@@ -4,11 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledContentBody = exports.StyledContentTitle = exports.StyledContent = void 0;
+
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
 var _styledSystem = require("styled-system");
+
 var _themes = require("../../style/themes");
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const StyledContent = _styledComponents.default.div`
   ${({
   bodyFullWidth,

package/lib/components/content/index.js

@@ -9,5 +9,7 @@ Object.defineProperty(exports, "default", {
     return _content.default;
   }
 });
+
 var _content = _interopRequireDefault(require("./content.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/date/__internal__/date-formats/index.js

@@ -5,30 +5,33 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 // The order of this array is important, when an input value matches more than one format the last one is used
-const EU_FORMATS = ["d M yyyy", "dd M yyyy", "d MM yyyy", "dd MM yyyy", "d M yy", "dd M yy", "d MM yy", "dd MM yy", "d", "d M", "dd", "d MM", "dd M", "dd MM"];
+const EU_FORMATS = ["d M yyyy", "dd M yyyy", "d MM yyyy", "dd MM yyyy", "d M yy", "dd M yy", "d MM yy", "dd MM yy", "d", "d M", "dd", "d MM", "dd M", "dd MM"]; // The order of this array is important, when an input value matches more than one format the last one is used
 
-// The order of this array is important, when an input value matches more than one format the last one is used
-const NA_FORMATS = ["M", "M d", "MM", "M dd", "MM d", "MM dd", "M d yy", "MM d yy", "M dd yy", "MM dd yy", "M d yyyy", "MM d yyyy", "M dd yyyy", "MM dd yyyy"];
+const NA_FORMATS = ["M", "M d", "MM", "M dd", "MM d", "MM dd", "M d yy", "MM d yy", "M dd yy", "MM dd yy", "M d yyyy", "MM d yyyy", "M dd yyyy", "MM dd yyyy"]; // The order of this array is important, when an input value matches more than one format the last one is used
 
-// The order of this array is important, when an input value matches more than one format the last one is used
 const CN_FORMATS = ["yyyy M", "yyyy M d", "yyyy MM d", "yyyy M dd", "yyyy MM dd", "yy M", "yy MM", "yy M d", "yy MM d", "yy M dd", "yy MM dd", "M", "M d", "MM", "M dd", "MM d", "MM dd"];
 const SEPARATORS = ["", ".", ",", "-", "/", ":"];
 const STANDARD_FORMAT_LENGTH = 10;
+
 const generateFormats = (formatArray, separator, trailingChar) => {
   const separators = SEPARATORS.includes(separator) ? SEPARATORS : [...SEPARATORS, separator];
   return formatArray.reduce((arr, formatString) => {
     const array = [...arr, formatString];
+
     if (formatString.includes(" ")) {
       separators.forEach(char => {
         if (separator === char && trailingChar) {
           array.push(`${formatString.replace(/ /g, char)}${trailingChar}`);
         }
+
         array.push(formatString.replace(/ /g, char));
       });
     }
+
     return array;
   }, []);
 };
+
 const getOutputFormatForLocale = localeCode => {
   const formatMap = {
     day: "dd",
@@ -44,11 +47,14 @@ const getOutputFormatForLocale = localeCode => {
     if (type !== "literal") {
       return formatMap[type];
     }
+
     if (!separator) {
       separator = value;
     }
+
     return value;
   }).join("");
+
   if (localeCode.startsWith("bg")) {
     // this locale adds an additional char that has no effect on the output formatting
     return {
@@ -56,26 +62,31 @@ const getOutputFormatForLocale = localeCode => {
       separator
     };
   }
+
   return {
     format,
     separator
   };
 };
+
 const getInputFormatsArrayForLocale = format => {
   if (format.startsWith("y")) {
     return CN_FORMATS;
   }
+
   if (format.startsWith("M")) {
     return NA_FORMATS;
   }
+
   return EU_FORMATS;
-};
+}; // we need this to handle for formats that add extra chars at the end of the format
+
 
-// we need this to handle for formats that add extra chars at the end of the format
 const getTrailingChar = format => {
   const lastChar = format.split("").pop();
   return ["y", "M", "d"].includes(lastChar) ? "" : lastChar;
 };
+
 const getFormatData = ({
   code
 }) => {
@@ -87,6 +98,7 @@ const getFormatData = ({
       formats: generateFormats(formats, "/")
     };
   }
+
   const {
     format,
     separator
@@ -98,5 +110,6 @@ const getFormatData = ({
     formats: generateFormats(formatsForLocale, separator, getTrailingChar(format))
   };
 };
+
 var _default = getFormatData;
 exports.default = _default;

package/lib/components/date/__internal__/date-picker/date-picker.component.js

@@ -4,23 +4,39 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _reactDayPicker = _interopRequireDefault(require("react-day-picker"));
+
 var _dom = require("@floating-ui/dom");
+
 var _utils = require("../utils");
+
 var _popover = _interopRequireDefault(require("../../../../__internal__/popover"));
+
 var _useLocale = _interopRequireDefault(require("../../../../hooks/__internal__/useLocale"));
+
 var _navbar = _interopRequireDefault(require("../navbar"));
+
 var _weekday = _interopRequireDefault(require("../weekday"));
+
 var _dayPicker = _interopRequireDefault(require("./day-picker.style"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const popoverMiddleware = [(0, _dom.offset)(3), (0, _dom.flip)({
   fallbackStrategy: "initialPlacement"
 })];
+
 const DatePicker = /*#__PURE__*/_react.default.forwardRef(({
   inputElement,
   minDate,
@@ -61,27 +77,31 @@ const DatePicker = /*#__PURE__*/_react.default.forwardRef(({
   } : {
     width: "abbreviated"
   }).substring(0, 3)), [l, localize]);
+
   const handleDayClick = (date, {
     disabled
   }, ev) => {
     if (!disabled) {
       var _inputElement$current;
+
       const {
         id,
         name
       } = inputElement === null || inputElement === void 0 ? void 0 : (_inputElement$current = inputElement.current) === null || _inputElement$current === void 0 ? void 0 : _inputElement$current.firstChild;
-      ev.target = {
-        ...ev.target,
+      ev.target = { ...ev.target,
         id,
         name
       };
       onDayClick(date, ev);
     }
   };
+
   const formatDay = date => `${weekdaysShort[date.getDay()]} ${date.getDate()} ${monthsShort[date.getMonth()]} ${date.getFullYear()}`;
+
   if (!open) {
     return null;
   }
+
   return /*#__PURE__*/_react.default.createElement(_popover.default, {
     placement: "bottom-start",
     reference: inputElement,
@@ -118,23 +138,32 @@ const DatePicker = /*#__PURE__*/_react.default.forwardRef(({
     }
   }, pickerProps))));
 });
+
 DatePicker.propTypes = {
   /** Minimum possible date */
   minDate: _propTypes.default.string,
+
   /** Maximum possible date */
   maxDate: _propTypes.default.string,
+
   /** Boolean to toggle where DatePicker is rendered in relation to the Date Input */
   disablePortal: _propTypes.default.bool,
+
   /** Element that the DatePicker will be displayed under */
   inputElement: _propTypes.default.object.isRequired,
+
   /** Currently selected date */
   selectedDays: _propTypes.default.instanceOf(Date),
+
   /** Callback to set selected date */
   onDayClick: _propTypes.default.func,
+
   /** Pass any props that match the DayPickerProps interface to override default behaviors */
   pickerProps: _propTypes.default.object,
+
   /** Callback to handle mousedown event on picker */
   pickerMouseDown: _propTypes.default.func,
+
   /** Sets whether the picker should be displayed */
   open: _propTypes.default.bool
 };

package/lib/components/date/__internal__/date-picker/day-picker.style.js

@@ -4,9 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _base = _interopRequireDefault(require("../../../../style/themes/base"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 // Styles copied from https://github.com/gpbl/react-day-picker/blob/v6.1.1/src/style.css
 const addReactDayPickerStyles = () => `
   .DayPicker {
@@ -181,6 +185,7 @@ const addReactDayPickerStyles = () => `
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
   }
 `;
+
 const StyledDayPicker = _styledComponents.default.div`
   ${addReactDayPickerStyles}
 
@@ -291,9 +296,13 @@ const StyledDayPicker = _styledComponents.default.div`
 
   .DayPicker-Day--disabled,
   .DayPicker-Day--disabled:hover {
-    color: var(colorsActionMajorYin030);
+    color: var(--colorsActionMajorYin030);
     background-color: var(--colorsUtilityYang100);
     cursor: default;
+
+    &.DayPicker-Day--today {
+      background-color: var(--colorsActionMinor200);
+    }
   }
 
   .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {

package/lib/components/date/__internal__/date-picker/index.js

@@ -9,5 +9,7 @@ Object.defineProperty(exports, "default", {
     return _datePicker.default;
   }
 });
+
 var _datePicker = _interopRequireDefault(require("./date-picker.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/date/__internal__/navbar/button.style.js

@@ -4,8 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const StyledButton = _styledComponents.default.button.attrs({
   type: "button"
 })`

package/lib/components/date/__internal__/navbar/index.js

@@ -9,5 +9,7 @@ Object.defineProperty(exports, "default", {
     return _navbar.default;
   }
 });
+
 var _navbar = _interopRequireDefault(require("./navbar.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/date/__internal__/navbar/navbar.component.js

@@ -4,12 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _button = _interopRequireDefault(require("./button.style"));
+
 var _navbar = _interopRequireDefault(require("./navbar.style"));
+
 var _icon = _interopRequireDefault(require("../../../icon"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const Navbar = ({
   onPreviousClick,
   onNextClick,
@@ -23,6 +30,7 @@ const Navbar = ({
 }, /*#__PURE__*/_react.default.createElement(_icon.default, {
   type: "chevron_right"
 })));
+
 Navbar.propTypes = {
   onPreviousClick: _propTypes.default.func,
   onNextClick: _propTypes.default.func

package/lib/components/date/__internal__/navbar/navbar.style.js

@@ -4,8 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const StyledNavbar = _styledComponents.default.div`
   &.DayPicker-NavBar {
     display: flex;