carbon-react 144.3.0 → 144.4.1

package/esm/components/typography/typography.component.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { SpaceProps } from "styled-system";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
 export declare const VARIANT_TYPES: readonly ["h1-large", "h1", "h2", "h3", "h4", "h5", "segment-header", "segment-header-small", "segment-subheader", "segment-subheader-alt", "p", "span", "small", "big", "sup", "sub", "strong", "b", "em", "ul", "ol"];
-export declare type VariantTypes = typeof VARIANT_TYPES[number];
+export declare type VariantTypes = (typeof VARIANT_TYPES)[number];
 export interface TypographyProps extends SpaceProps, TagProps {
     /** Override the variant component */
     as?: React.ElementType;

package/esm/components/typography/typography.style.js

@@ -182,7 +182,7 @@ const StyledTypography = styled.span.attrs(({
     ${variant === "sup" && "vertical-align: super;"};
     ${variant === "sub" && "vertical-align: sub;"};
     ${display && `display: ${display};`};
-    ${listStyleType && `list-style-type: ${listStyleType};`}; ;
+    ${listStyleType && `list-style-type: ${listStyleType};`};
   `}
   ${space}
     ${({

package/esm/components/vertical-divider/vertical-divider.component.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { SpaceProps } from "styled-system";
 declare type TintRange = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100;
 export interface VerticalDividerProps extends SpaceProps {

package/esm/global.d.ts

@@ -7,7 +7,7 @@ declare global {
   interface Window {
     __CARBON_INTERNALS_MODAL_LIST?: ModalList;
     __CARBON_INTERNALS_MODAL_SETTER_LIST?: ((
-      topModal: HTMLElement | null
+      topModal: HTMLElement | null,
     ) => void)[];
     __CARBON_INTERNALS_SCROLL_BLOCKERS?: {
       components: {

package/esm/hooks/__internal__/useCharacterCount/useCharacterCount.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 declare const useCharacterCount: (value?: string, characterLimit?: number, characterCountAriaLive?: "off" | "polite") => [JSX.Element | null, string | undefined];
 export default useCharacterCount;

package/esm/style/utils/box-gap.d.ts

@@ -1,5 +1,5 @@
 export declare const GAP_VALUES: number[];
-export declare type AllowedNumericalValues = typeof GAP_VALUES[number];
+export declare type AllowedNumericalValues = (typeof GAP_VALUES)[number];
 export declare type Gap = AllowedNumericalValues | string;
 export declare const getGapValue: (gapValue: number | string) => string;
 export default function gap(gapValue: number | string): string;

package/lib/__internal__/utils/helpers/events/composedPath.js

@@ -9,14 +9,9 @@ exports.default = void 0;
 // IE does not support composedPath
 // https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath
 var _default = ev => {
-  // When testing with enzyme, we want to trigger a listener on an element but pretend
-  // that it bubbled from the enzymeTestingTarget
-  // e.g. document.dispatchEvent(new MouseClick('click', {
-  //   detail: {enzymeTestingTarget: document.body}
-  // }))
   // In this example composedPath would show that the event started at document.body
   // but it would trigger the eventListener on document
-  let element = ev.detail && ev.detail.enzymeTestingTarget || ev.target || null;
+  let element = ev.target || null;
   if (!element || !element.parentElement) {
     return [];
   }

package/lib/__internal__/utils/helpers/events/events.js

@@ -114,7 +114,7 @@ const Events = {
    * @see https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath
    */
   composedPath: ev => {
-    return ev.detail?.enzymeTestingTarget && (0, _composedPath.default)(ev) || ev.composedPath && ev.composedPath() || (0, _composedPath.default)(ev);
+    return ev.composedPath?.() || (0, _composedPath.default)(ev);
   }
 };
 var _default = exports.default = Events;

package/lib/components/action-popover/action-popover.style.js

@@ -97,18 +97,18 @@ const StyledMenuItem = exports.StyledMenuItem = _styledComponents.default.button
   childHasSubmenu,
   hasSubmenu
 }) => (0, _styledComponents.css)`
-      justify-content: ${horizontalAlignment === "left" ? "flex-start" : "flex-end"};
+    justify-content: ${horizontalAlignment === "left" ? "flex-start" : "flex-end"};
 
-      ${horizontalAlignment === "left" && submenuPosition === "right" && (0, _styledComponents.css)`
-        justify-content: space-between;
-      `}
+    ${horizontalAlignment === "left" && submenuPosition === "right" && (0, _styledComponents.css)`
+      justify-content: space-between;
+    `}
 
-      ${horizontalAlignment === "right" && submenuPosition === "left" && (0, _styledComponents.css)`
-        ${childHasSubmenu && hasSubmenu && (0, _styledComponents.css)`
-          justify-content: space-between;
-        `}
+    ${horizontalAlignment === "right" && submenuPosition === "left" && (0, _styledComponents.css)`
+      ${childHasSubmenu && hasSubmenu && (0, _styledComponents.css)`
+        justify-content: space-between;
       `}
     `}
+  `}
 
   text-decoration: none;
   background-color: var(--colorsActionMajorYang100);

package/lib/components/breadcrumbs/crumb/crumb.style.js

@@ -39,8 +39,8 @@ const Divider = exports.Divider = _styledComponents.default.span`
     ${({
   isDarkBackground
 }) => (0, _styledComponents.css)`
-        color: ${isDarkBackground ? "var(--colorsUtilityYang100)" : "var(--colorsUtilityYin055)"};
-      `}
+      color: ${isDarkBackground ? "var(--colorsUtilityYang100)" : "var(--colorsUtilityYin055)"};
+    `}
   }
 `;
 var _default = exports.default = {

package/lib/components/button-toggle/button-toggle.style.js

@@ -171,32 +171,32 @@ const StyledButtonToggleWrapper = exports.StyledButtonToggleWrapper = _styledCom
   ${({
   grouped
 }) => (0, _styledComponents.css)`
-      ${!grouped && (0, _styledComponents.css)`
-        &&&& {
-          ${StyledButtonToggle} {
-            border-radius: var(--borderRadius050);
-          }
+    ${!grouped && (0, _styledComponents.css)`
+      &&&& {
+        ${StyledButtonToggle} {
+          border-radius: var(--borderRadius050);
         }
-      `}
+      }
+    `}
 
-      ${grouped && (0, _styledComponents.css)`
-        &&&& {
-          :first-of-type {
-            ${StyledButtonToggle} {
-              border-top-left-radius: var(--borderRadius050);
-              border-bottom-left-radius: var(--borderRadius050);
-            }
+    ${grouped && (0, _styledComponents.css)`
+      &&&& {
+        :first-of-type {
+          ${StyledButtonToggle} {
+            border-top-left-radius: var(--borderRadius050);
+            border-bottom-left-radius: var(--borderRadius050);
           }
+        }
 
-          :last-of-type {
-            ${StyledButtonToggle} {
-              border-top-right-radius: var(--borderRadius050);
-              border-bottom-right-radius: var(--borderRadius050);
-            }
+        :last-of-type {
+          ${StyledButtonToggle} {
+            border-top-right-radius: var(--borderRadius050);
+            border-bottom-right-radius: var(--borderRadius050);
           }
         }
-      `}
+      }
     `}
+  `}
 
   ${({
   grouped

package/lib/components/card/card.config.d.ts

@@ -1,4 +1,4 @@
 export declare const CARD_SPACING: readonly ["small", "medium", "large"];
 export declare const CARD_ALIGNS: readonly ["left", "center", "right"];
-export declare type CardAlign = typeof CARD_ALIGNS[number];
-export declare type CardSpacing = typeof CARD_SPACING[number];
+export declare type CardAlign = (typeof CARD_ALIGNS)[number];
+export declare type CardSpacing = (typeof CARD_SPACING)[number];

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

@@ -321,13 +321,17 @@ const StyledDayPicker = _styledComponents.default.div`
     }
   }
 
-  .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
+  .DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(
+      .DayPicker-Day--outside
+    ) {
     background-color: var(--colorsActionMajor500);
     color: var(--colorsUtilityYang100);
     border-radius: var(--borderRadius400);
   }
 
-  .DayPicker-Day--selected.DayPicker-Day--disabled:not(.DayPicker-Day--outside) {
+  .DayPicker-Day--selected.DayPicker-Day--disabled:not(
+      .DayPicker-Day--outside
+    ) {
     background-color: var(--colorsActionMajor500);
     color: var(--colorsUtilityYang100);
   }

package/lib/components/dialog/dialog.component.d.ts

@@ -4,7 +4,7 @@ import { TagProps } from "../../__internal__/utils/helpers/tags";
 import { DialogSizes } from "./dialog.config";
 import { CustomRefObject } from "../../__internal__/focus-trap";
 declare const PADDING_VALUES: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8];
-declare type PaddingValues = typeof PADDING_VALUES[number];
+declare type PaddingValues = (typeof PADDING_VALUES)[number];
 export interface ContentPaddingInterface {
     p?: PaddingValues;
     py?: PaddingValues;

package/lib/components/dialog/dialog.config.d.ts

@@ -1,2 +1,2 @@
 export declare const DIALOG_SIZES: readonly ["auto", "extra-small", "small", "medium-small", "medium", "medium-large", "large", "extra-large", "maximise"];
-export declare type DialogSizes = typeof DIALOG_SIZES[number];
+export declare type DialogSizes = (typeof DIALOG_SIZES)[number];

package/lib/components/dialog/dialog.style.js

@@ -63,8 +63,8 @@ const StyledDialog = exports.StyledDialog = _styledComponents.default.div`
   ${({
   backgroundColor
 }) => (0, _styledComponents.css)`
-      background-color: ${backgroundColor};
-    `}
+    background-color: ${backgroundColor};
+  `}
 
   ${({
   dialogHeight

package/lib/components/drawer/drawer.style.js

@@ -40,26 +40,26 @@ const StyledDrawerSidebar = exports.StyledDrawerSidebar = (0, _styledComponents.
   hasControls,
   isExpanded
 }) => (0, _styledComponents.css)`
-      ${!isExpanded && (0, _styledComponents.css)`
-        display: none;
-        opacity: 0;
-      `}
+    ${!isExpanded && (0, _styledComponents.css)`
+      display: none;
+      opacity: 0;
+    `}
 
-      ${isExpanded && (0, _styledComponents.css)`
-        display: flex;
-        flex-direction: column;
-        flex: 1 1 0%;
-      `}
+    ${isExpanded && (0, _styledComponents.css)`
+      display: flex;
+      flex-direction: column;
+      flex: 1 1 0%;
+    `}
 
       ${hasControls && (0, _styledComponents.css)`
-        ${_tabs.default} {
-          margin-top: 48px;
-          ${!isExpanded && (0, _styledComponents.css)`
-            display: none;
-          `}
-        }
-      `}
+      ${_tabs.default} {
+        margin-top: 48px;
+        ${!isExpanded && (0, _styledComponents.css)`
+          display: none;
+        `}
+      }
     `}
+  `}
 
   &::-webkit-scrollbar {
     width: 12px;

package/lib/components/flat-table/flat-table.style.js

@@ -137,20 +137,20 @@ const StyledFlatTableWrapper = exports.StyledFlatTableWrapper = (0, _styledCompo
   theme,
   isFocused
 }) => (0, _styledComponents.css)`
-      box-sizing: border-box;
+    box-sizing: border-box;
 
-      /* istanbul ignore next */
-      ${theme.focusRedesignOptOut && isFocused && /* istanbul ignore next */
+    /* istanbul ignore next */
+    ${theme.focusRedesignOptOut && isFocused && /* istanbul ignore next */
 (0, _styledComponents.css)`
-        ${oldFocusStyling}
-      `}
+      ${oldFocusStyling}
+    `}
 
-      ${!theme.focusRedesignOptOut && isFocused && (0, _styledComponents.css)`
-        ${(0, _addFocusStyling.default)()}
-      `}
+    ${!theme.focusRedesignOptOut && isFocused && (0, _styledComponents.css)`
+      ${(0, _addFocusStyling.default)()}
+    `}
 
       ${isInSidebar ? "min-width: fit-content;" : ""}
-    `}
+  `}
 
   ${({
   colorTheme

package/lib/components/form/form.config.d.ts

@@ -1,5 +1,5 @@
 export declare const FORM_BUTTON_ALIGNMENTS: readonly ["left", "right"];
-export declare type FormButtonAlignment = typeof FORM_BUTTON_ALIGNMENTS[number];
+export declare type FormButtonAlignment = (typeof FORM_BUTTON_ALIGNMENTS)[number];
 export declare const formSpacing: {
     0: string;
     1: string;

package/lib/components/hr/hr.component.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { MarginProps } from "styled-system";
 export interface HrProps extends MarginProps {
     /** Set whether the component should be recognised by assistive technologies */

package/lib/components/loader-spinner/loader-spinner.config.d.ts

@@ -1,7 +1,7 @@
 declare const LOADER_SPINNER_VARIANTS: readonly ["action", "neutral", "inverse", "gradient-grey", "gradient-white"];
-declare type LoaderSpinnerVariants = typeof LOADER_SPINNER_VARIANTS[number];
+declare type LoaderSpinnerVariants = (typeof LOADER_SPINNER_VARIANTS)[number];
 declare const LOADER_SPINNER_SIZES: readonly ["extra-small", "small", "medium", "large", "extra-large"];
-declare type LoaderSpinnerSizes = typeof LOADER_SPINNER_SIZES[number];
+declare type LoaderSpinnerSizes = (typeof LOADER_SPINNER_SIZES)[number];
 declare type LoaderSpinnerSizeParams = Record<LoaderSpinnerSizes, {
     wrapperDimensions: number;
     strokeWidth: number;

package/lib/components/loader-spinner/loader-spinner.style.js

@@ -36,11 +36,11 @@ const StyledLabel = exports.StyledLabel = (0, _styledComponents.default)(_typogr
   ${({
   size
 }) => (0, _styledComponents.css)`
-      display: flex;
-      justify-content: center;
-      text-align: center;
-      ${size === "extra-small" ? "margin-left: var(--spacing100)" : `margin-top: ${_loaderSpinner.LOADER_SPINNER_SIZE_PARAMS[size].labelMarginTop}px`};
-    `}
+    display: flex;
+    justify-content: center;
+    text-align: center;
+    ${size === "extra-small" ? "margin-left: var(--spacing100)" : `margin-top: ${_loaderSpinner.LOADER_SPINNER_SIZE_PARAMS[size].labelMarginTop}px`};
+  `}
 `;
 const StyledSpinnerCircleSvg = exports.StyledSpinnerCircleSvg = _styledComponents.default.svg`
   ${({

package/lib/components/loader-star/internal/star.component.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface StarProps {
     starContainerClassName: "star-1" | "star-2" | "star-3";
     gradientId: "gradient1" | "gradient2" | "gradient3";

package/lib/components/loader-star/loader-star.component.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
 export interface LoaderStarProps extends Omit<TagProps, "data-component"> {
     /**

package/lib/components/menu/menu-segment-title/menu-segment-title.component.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { VariantType } from "../menu-item";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 declare const AS_VALUES: readonly ["h2", "h3", "h4", "h5", "h6"];
-declare type AllowedAsValues = typeof AS_VALUES[number];
+declare type AllowedAsValues = (typeof AS_VALUES)[number];
 export interface MenuTitleProps extends TagProps {
     children?: React.ReactNode;
     text: string;

package/lib/components/note/note.component.d.ts

@@ -20,7 +20,7 @@ export interface NoteProps extends MarginProps {
         timeStamp: string;
     };
     /** Adds a Title to the Note */
-    title?: string;
+    title?: React.ReactNode;
     /** Set a percentage-based width for the whole Note component, relative to its parent. */
     width?: number;
 }

package/lib/components/note/note.component.js

@@ -14,6 +14,7 @@ var _actionPopover = require("../action-popover");
 var _utils = require("../text-editor/__internal__/utils");
 var _editor = _interopRequireDefault(require("../text-editor/__internal__/editor.context"));
 var _linkPreview = _interopRequireDefault(require("../link-preview"));
+var _typography = _interopRequireDefault(require("../typography"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function hasExpectedDisplayName(child, displayName) {
@@ -57,7 +58,14 @@ const Note = ({
     width: width
   }, rest, {
     "data-component": "note"
-  }), /*#__PURE__*/_react.default.createElement(_note.StyledNoteMain, null, /*#__PURE__*/_react.default.createElement(_note.StyledNoteContent, null, title && /*#__PURE__*/_react.default.createElement(_note.StyledTitle, null, title), /*#__PURE__*/_react.default.createElement(_draftJs.Editor, {
+  }), /*#__PURE__*/_react.default.createElement(_note.StyledNoteMain, null, /*#__PURE__*/_react.default.createElement(_note.StyledNoteContent, null, title && (typeof title === "string" ? /*#__PURE__*/_react.default.createElement(_typography.default, {
+    "data-role": "note-title",
+    fontWeight: "700",
+    fontSize: "16px",
+    lineHeight: "21px",
+    paddingBottom: "16px",
+    variant: "h2"
+  }, title) : /*#__PURE__*/_react.default.createElement(_note.StyledTitleWrapper, null, title)), /*#__PURE__*/_react.default.createElement(_draftJs.Editor, {
     readOnly: true,
     editorState: (0, _utils.getDecoratedValue)(noteContent),
     onChange: /* istanbul ignore next */() => {}

package/lib/components/note/note.style.d.ts

@@ -3,7 +3,7 @@ declare const StyledNoteContent: import("styled-components").StyledComponent<"di
 }, never>;
 declare const StyledNoteMain: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledInlineControl: import("styled-components").StyledComponent<"div", any, {}, never>;
-declare const StyledTitle: import("styled-components").StyledComponent<"header", any, {}, never>;
+declare const StyledTitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledFooterContent: import("styled-components").StyledComponent<"div", any, {
     hasName: boolean;
 }, never>;
@@ -11,4 +11,4 @@ declare const StyledFooter: import("styled-components").StyledComponent<"div", a
 declare const StyledNote: import("styled-components").StyledComponent<"div", any, {
     width: number;
 }, never>;
-export { StyledNote, StyledNoteContent, StyledNoteMain, StyledInlineControl, StyledTitle, StyledFooter, StyledFooterContent, };
+export { StyledNote, StyledNoteContent, StyledNoteMain, StyledInlineControl, StyledTitleWrapper, StyledFooter, StyledFooterContent, };

package/lib/components/note/note.style.js

@@ -3,11 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledTitle = exports.StyledNoteMain = exports.StyledNoteContent = exports.StyledNote = exports.StyledInlineControl = exports.StyledFooterContent = exports.StyledFooter = void 0;
+exports.StyledTitleWrapper = exports.StyledNoteMain = exports.StyledNoteContent = exports.StyledNote = exports.StyledInlineControl = exports.StyledFooterContent = exports.StyledFooter = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _styledSystem = require("styled-system");
 var _base = _interopRequireDefault(require("../../style/themes/base"));
 var _linkPreview = require("../link-preview/link-preview.style");
+var _typography = require("../typography/typography.component");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -20,13 +21,11 @@ const StyledNoteContent = exports.StyledNoteContent = _styledComponents.default.
 }) => (0, _styledComponents.css)`
     div.DraftEditor-root {
       min-height: inherit;
-      height: 100%;
     }
 
     div.DraftEditor-editorContainer,
     div.public-DraftEditor-content {
       min-height: inherit;
-      height: 100%;
       background-color: var(--colorsUtilityYang100);
       line-height: 21px;
     }
@@ -49,11 +48,15 @@ const StyledInlineControl = exports.StyledInlineControl = _styledComponents.defa
   display: inline-block;
   min-width: fit-content;
 `;
-const StyledTitle = exports.StyledTitle = _styledComponents.default.header`
+const StyledTitleWrapper = exports.StyledTitleWrapper = _styledComponents.default.div`
+  ${_typography.VARIANT_TYPES.map(variant => `
+${variant}{
   font-weight: 700;
   font-size: 16px;
   line-height: 21px;
   padding-bottom: 16px;
+}
+  `)}
 `;
 const StyledFooterContent = exports.StyledFooterContent = _styledComponents.default.div`
   line-height: 21px;

package/lib/components/numeral-date/numeral-date.component.d.ts

@@ -93,6 +93,6 @@ export interface NumeralDateProps<DateType extends NumeralDateObject = FullDate>
     /** Flag to configure component as optional. */
     isOptional?: boolean;
 }
-export declare type ValidDateFormat = typeof ALLOWED_DATE_FORMATS[number];
+export declare type ValidDateFormat = (typeof ALLOWED_DATE_FORMATS)[number];
 export declare const NumeralDate: <DateType extends NumeralDateObject = FullDate>({ dateFormat, defaultValue, disabled, error, warning, "data-component": dataComponent, "data-element": dataElement, "data-role": dataRole, info, id, name, onBlur, onChange, value, validationOnLabel, label, labelInline, labelWidth, labelAlign, labelHelp, labelSpacing, fieldHelp, adaptiveLabelBreakpoint, required, isOptional, readOnly, size, enableInternalError, enableInternalWarning, tooltipPosition, helpAriaLabel, dayRef, monthRef, yearRef, ...rest }: NumeralDateProps<DateType>) => React.JSX.Element;
 export default NumeralDate;

package/lib/components/pager/pager.style.js

@@ -36,8 +36,8 @@ const StyledPagerContainer = exports.StyledPagerContainer = _styledComponents.de
   ${({
   variant
 }) => (0, _styledComponents.css)`
-      background-color: ${variant === "alternate" ? "var(--colorsUtilityMajor040)" : "var(--colorsUtilityMajor010)"};
-    `}
+    background-color: ${variant === "alternate" ? "var(--colorsUtilityMajor040)" : "var(--colorsUtilityMajor010)"};
+  `}
 `;
 const StyledPagerSizeOptions = exports.StyledPagerSizeOptions = _styledComponents.default.div`
   display: flex;

package/lib/components/pod/pod.config.d.ts

@@ -1,6 +1,6 @@
 export declare const POD_SIZES: readonly ["extra-small", "small", "medium", "large", "extra-large"];
 export declare const POD_ALIGNMENTS: readonly ["left", "center", "right"];
 export declare const POD_VARIANTS: readonly ["primary", "secondary", "tertiary", "tile", "transparent"];
-export declare type PodSize = typeof POD_SIZES[number];
-export declare type PodAlignment = typeof POD_ALIGNMENTS[number];
-export declare type PodVariant = typeof POD_VARIANTS[number];
+export declare type PodSize = (typeof POD_SIZES)[number];
+export declare type PodAlignment = (typeof POD_ALIGNMENTS)[number];
+export declare type PodVariant = (typeof POD_VARIANTS)[number];

package/lib/components/pod/pod.style.js

@@ -48,52 +48,52 @@ const StyledBlock = exports.StyledBlock = _styledComponents.default.div`
   isHovered,
   isFocused
 }) => (0, _styledComponents.css)`
-      box-sizing: border-box;
-      border-radius: var(--borderRadius100);
-      display: flex;
-      flex-direction: column;
-      background-color: ${blockBackgrounds[variant]};
-      width: 100%;
-      height: 100%;
+    box-sizing: border-box;
+    border-radius: var(--borderRadius100);
+    display: flex;
+    flex-direction: column;
+    background-color: ${blockBackgrounds[variant]};
+    width: 100%;
+    height: 100%;
 
-      ${variant === "tile" && "box-shadow: 0 2px 3px 0 rgba(2, 18, 36, 0.2)"};
+    ${variant === "tile" && "box-shadow: 0 2px 3px 0 rgba(2, 18, 36, 0.2)"};
 
-      ${noBorder ? "border: none" : `border: 1px solid var(--colorsUtilityMajor100)`};
+    ${noBorder ? "border: none" : `border: 1px solid var(--colorsUtilityMajor100)`};
 
-      ${hasButtons && !(fullWidth || internalEditButton) && "width: auto;"};
+    ${hasButtons && !(fullWidth || internalEditButton) && "width: auto;"};
 
-      ${contentTriggersEdit && "cursor: pointer"};
+    ${contentTriggersEdit && "cursor: pointer"};
 
-      ${(isHovered || isFocused) && (0, _styledComponents.css)`
-        background-color: var(--colorsUtilityMajor075);
+    ${(isHovered || isFocused) && (0, _styledComponents.css)`
+      background-color: var(--colorsUtilityMajor075);
 
-        ${internalEditButton && variant === "tile" && "background-color: var(--colorsUtilityMajorTransparent);"}
+      ${internalEditButton && variant === "tile" && "background-color: var(--colorsUtilityMajorTransparent);"}
 
-        ${contentTriggersEdit && (0, _styledComponents.css)`
-          background-color: var(--colorsActionMajor600);
-          * {
-            color: var(--colorsUtilityYang100);
-          }
-        `}
+      ${contentTriggersEdit && (0, _styledComponents.css)`
+        background-color: var(--colorsActionMajor600);
+        * {
+          color: var(--colorsUtilityYang100);
+        }
       `}
+    `}
 
-      ${(!internalEditButton || contentTriggersEdit) && (isFocused ? (0, _styledComponents.css)`
-            outline: 3px solid var(--colorsSemanticFocus500);
-            border: none;
-            padding: ${noBorder ? 0 : 1}px;
-          ` : (0, _styledComponents.css)`
-            outline: none;
-          `)}
+    ${(!internalEditButton || contentTriggersEdit) && (isFocused ? (0, _styledComponents.css)`
+          outline: 3px solid var(--colorsSemanticFocus500);
+          border: none;
+          padding: ${noBorder ? 0 : 1}px;
+        ` : (0, _styledComponents.css)`
+          outline: none;
+        `)}
 
       ${softDelete && (0, _styledComponents.css)`
-        border: none;
-        background-color: var(--colorsActionDisabled500);
+      border: none;
+      background-color: var(--colorsActionDisabled500);
 
-        & > * {
-          color: var(--colorsUtilityYin065);
-        }
-      `};
-    `}
+      & > * {
+        color: var(--colorsUtilityYin065);
+      }
+    `};
+  `}
 `;
 const contentPaddings = {
   "extra-small": "8px",

package/lib/components/progress-tracker/progress-tracker.style.js

@@ -44,8 +44,8 @@ const StyledProgressTracker = exports.StyledProgressTracker = _styledComponents.
   ${({
   length
 }) => (0, _styledComponents.css)`
-      width: ${length};
-    `};
+    width: ${length};
+  `};
   ${({
   labelsPosition
 }) => labelsPosition === "left" && (0, _styledComponents.css)`

package/lib/components/select/__internal__/list-action-button/list-action-button.style.js

@@ -11,7 +11,9 @@ const StyledListActionButtonWrapper = _styledComponents.default.div`
   padding-top: var(--spacing100);
   padding-bottom: var(--spacing100);
   border-top: 1px solid var(--colorsUtilityDisabled600);
-  box-shadow: 0 0px 0 0 rgba(0, 0, 0, 0), 0 -8px 8px 0 rgba(0, 0, 0, 0.03);
+  box-shadow:
+    0 0px 0 0 rgba(0, 0, 0, 0),
+    0 -8px 8px 0 rgba(0, 0, 0, 0.03);
   width: 100%;
   position: sticky;
   bottom: 0;