carbon-react 144.21.0 → 144.22.0

package/esm/components/box/box.component.js

@@ -26,6 +26,8 @@ const Box = /*#__PURE__*/React.forwardRef(({
   borderRadius,
   color,
   opacity,
+  height,
+  width,
   "aria-hidden": ariaHidden,
   ...rest
 }, ref) => {
@@ -33,6 +35,24 @@ const Box = /*#__PURE__*/React.forwardRef(({
     deprecatedTabIndex = true;
     Logger.deprecate("The `tabIndex` prop for `Box` component has been deprecated and will soon be removed.");
   }
+  let actualWidth = "";
+  if (typeof width === "number") {
+    actualWidth = width <= 1 ? `${(width * 100).toFixed(0)}%` : `${width}px`;
+  } else if (typeof width === "string") {
+    actualWidth = width;
+  }
+  let actualHeight = "";
+  if (typeof height === "number") {
+    actualHeight = height <= 1 ? `${(height * 100).toFixed(0)}%` : `${height}px`;
+  } else if (typeof height === "string") {
+    actualHeight = height;
+  }
+  const cssProps = {
+    color,
+    opacity,
+    width: actualWidth,
+    height: actualHeight
+  };
   return /*#__PURE__*/React.createElement(StyledBox, _extends({
     as: as,
     id: id,
@@ -50,10 +70,10 @@ const Box = /*#__PURE__*/React.forwardRef(({
     backgroundColor: backgroundColor,
     boxShadow: boxShadow,
     borderRadius: borderRadius,
-    color: color,
-    opacity: opacity,
     "aria-hidden": ariaHidden
-  }, tagComponent(dataComponent, rest), filterStyledSystemMarginProps(rest), filterStyledSystemPaddingProps(rest), filterStyledSystemFlexboxProps(rest), filterStyledSystemGridProps(rest), filterStyledSystemLayoutProps(rest)), children);
+  }, tagComponent(dataComponent, rest), filterStyledSystemMarginProps(rest), filterStyledSystemPaddingProps(rest), filterStyledSystemFlexboxProps(rest), filterStyledSystemGridProps(rest), filterStyledSystemLayoutProps(rest), {
+    cssProps: cssProps
+  }), children);
 });
 if (process.env.NODE_ENV !== "production") {
   Box.propTypes = {

package/esm/components/box/box.style.d.ts

@@ -1,3 +1,10 @@
 import { BoxProps } from "./box.component";
-declare const StyledBox: import("styled-components").StyledComponent<"div", any, BoxProps, never>;
+declare const StyledBox: import("styled-components").StyledComponent<"div", any, BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
 export default StyledBox;

package/esm/components/box/box.style.js

@@ -28,19 +28,25 @@ const StyledBox = styled.div`
 }) => !theme.roundedCornersOptOut && css`
       border-radius: var(--${borderRadius});
     `}
-
+  
   ${({
-  color,
+  cssProps,
   bg,
   backgroundColor,
   ...rest
 }) => styledColor({
-  color,
+  color: cssProps?.color,
   bg,
   backgroundColor,
   ...rest
 })}
 
+  ${({
+  cssProps
+}) => css`
+    opacity: ${cssProps?.opacity};
+  `}
+
   ${({
   overflowWrap
 }) => overflowWrap && css`
@@ -48,15 +54,17 @@ const StyledBox = styled.div`
     `}
   
   ${({
-  height
-}) => height && css`
-      height: ${height};
+  cssProps,
+  size
+}) => cssProps?.height && !size && css`
+      height: ${cssProps?.height};
     `}
 
   ${({
-  width
-}) => width && css`
-      width: ${width};
+  cssProps,
+  size
+}) => cssProps?.width && !size && css`
+      width: ${cssProps?.width};
     `}
 
   ${({

package/esm/components/duelling-picklist/picklist/picklist.style.d.ts

@@ -1,4 +1,11 @@
 declare const StyledPicklist: import("styled-components").StyledComponent<"div", any, import("../../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+} & {
     as: string;
 }, "as">;
 declare const StyledEmptyContainer: import("styled-components").StyledComponent<"li", any, {}, never>;

package/esm/components/flat-table/flat-table.style.d.ts

@@ -12,6 +12,13 @@ interface StyledFlatTableWrapperProps extends Pick<FlatTableProps, "hasStickyFoo
     isFocused: boolean;
     bottomBorderRadius: NonNullable<FlatTableProps["bottomBorderRadius"]>;
 }
-declare const StyledFlatTableWrapper: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & StyledFlatTableWrapperProps, never>;
+declare const StyledFlatTableWrapper: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+} & StyledFlatTableWrapperProps, never>;
 declare const StyledFlatTableFooter: import("styled-components").StyledComponent<"div", any, Pick<FlatTableProps, "hasStickyFooter">, never>;
 export { StyledFlatTableWrapper, StyledFlatTable, StyledFlatTableFooter, StyledTableContainer, };

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

@@ -1,11 +1,13 @@
 import React from "react";
-import { TypographyProps } from "./typography.component";
+import { TypographyProps, VariantTypes } from "./typography.component";
 export interface ListProps extends TypographyProps {
     children?: React.ReactNode;
 }
 export interface ListItemProps extends TypographyProps {
+    /** (Deprecated) The visual style to apply to the component */
+    variant?: VariantTypes;
     children?: React.ReactNode;
 }
-declare const List: ({ children, as, ...props }: ListProps) => React.JSX.Element;
+declare const List: ({ children, as, variant, ...props }: ListProps) => React.JSX.Element;
 declare const ListItem: ({ children, ...props }: ListItemProps) => React.JSX.Element;
 export { List, ListItem };

package/esm/components/typography/list.component.js

@@ -1,7 +1,10 @@
 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); }
-import React from "react";
+import React, { useContext } from "react";
 import PropTypes from "prop-types";
 import Typography from "./typography.component";
+import ListContext from "./list.context";
+import Logger from "../../__internal__/utils/logger";
+let childVariantDeprecationWarning = false;
 const getListStyleType = as => {
   if (as === "ul") {
     return "square";
@@ -11,18 +14,32 @@ const getListStyleType = as => {
 const List = ({
   children,
   as = "ul",
+  variant = "p",
   ...props
 }) => /*#__PURE__*/React.createElement(Typography, _extends({
-  variant: "p",
+  variant: variant,
   as: as,
   listStyleType: getListStyleType(as)
-}, props), children);
+}, props), /*#__PURE__*/React.createElement(ListContext.Provider, {
+  value: {
+    variant
+  }
+}, children));
 const ListItem = ({
   children,
   ...props
-}) => /*#__PURE__*/React.createElement(Typography, _extends({
-  as: "li",
-  variant: "p",
-  m: "0 0 8px 16px"
-}, props), children);
+}) => {
+  if (props.variant && !childVariantDeprecationWarning) {
+    Logger.deprecate("The use of `variant` on `ListItem` is deprecated. Please set it via `List` instead.");
+    childVariantDeprecationWarning = true;
+  }
+  const {
+    variant: parentListVariant
+  } = useContext(ListContext);
+  return /*#__PURE__*/React.createElement(Typography, _extends({
+    as: "li",
+    variant: parentListVariant,
+    m: "0 0 8px 16px"
+  }, props), children);
+};
 export { List, ListItem };

package/esm/components/typography/list.context.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { VariantTypes } from "./typography.component";
+export interface ListContextProps {
+    variant?: VariantTypes;
+}
+export declare const ListContext: React.Context<ListContextProps>;
+export default ListContext;

package/esm/components/typography/list.context.js

@@ -0,0 +1,3 @@
+import React from "react";
+export const ListContext = /*#__PURE__*/React.createContext({});
+export default ListContext;

package/esm/components/vertical-menu/vertical-menu.style.d.ts

@@ -10,6 +10,20 @@ export declare const StyledTitle: import("styled-components").StyledComponent<"h
 export declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledTitleIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const StyledChevronIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
-export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps, never>;
-export declare const StyledVerticalMenuFullScreen: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps, never>;
+export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
+export declare const StyledVerticalMenuFullScreen: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
 export {};

package/lib/components/box/box.component.js

@@ -33,6 +33,8 @@ const Box = exports.Box = /*#__PURE__*/_react.default.forwardRef(({
   borderRadius,
   color,
   opacity,
+  height,
+  width,
   "aria-hidden": ariaHidden,
   ...rest
 }, ref) => {
@@ -40,6 +42,24 @@ const Box = exports.Box = /*#__PURE__*/_react.default.forwardRef(({
     deprecatedTabIndex = true;
     _logger.default.deprecate("The `tabIndex` prop for `Box` component has been deprecated and will soon be removed.");
   }
+  let actualWidth = "";
+  if (typeof width === "number") {
+    actualWidth = width <= 1 ? `${(width * 100).toFixed(0)}%` : `${width}px`;
+  } else if (typeof width === "string") {
+    actualWidth = width;
+  }
+  let actualHeight = "";
+  if (typeof height === "number") {
+    actualHeight = height <= 1 ? `${(height * 100).toFixed(0)}%` : `${height}px`;
+  } else if (typeof height === "string") {
+    actualHeight = height;
+  }
+  const cssProps = {
+    color,
+    opacity,
+    width: actualWidth,
+    height: actualHeight
+  };
   return /*#__PURE__*/_react.default.createElement(_box.default, _extends({
     as: as,
     id: id,
@@ -57,10 +77,10 @@ const Box = exports.Box = /*#__PURE__*/_react.default.forwardRef(({
     backgroundColor: backgroundColor,
     boxShadow: boxShadow,
     borderRadius: borderRadius,
-    color: color,
-    opacity: opacity,
     "aria-hidden": ariaHidden
-  }, (0, _tags.default)(dataComponent, rest), (0, _utils.filterStyledSystemMarginProps)(rest), (0, _utils.filterStyledSystemPaddingProps)(rest), (0, _utils.filterStyledSystemFlexboxProps)(rest), (0, _utils.filterStyledSystemGridProps)(rest), (0, _utils.filterStyledSystemLayoutProps)(rest)), children);
+  }, (0, _tags.default)(dataComponent, rest), (0, _utils.filterStyledSystemMarginProps)(rest), (0, _utils.filterStyledSystemPaddingProps)(rest), (0, _utils.filterStyledSystemFlexboxProps)(rest), (0, _utils.filterStyledSystemGridProps)(rest), (0, _utils.filterStyledSystemLayoutProps)(rest), {
+    cssProps: cssProps
+  }), children);
 });
 if (process.env.NODE_ENV !== "production") {
   Box.propTypes = {

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

@@ -1,3 +1,10 @@
 import { BoxProps } from "./box.component";
-declare const StyledBox: import("styled-components").StyledComponent<"div", any, BoxProps, never>;
+declare const StyledBox: import("styled-components").StyledComponent<"div", any, BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
 export default StyledBox;

package/lib/components/box/box.style.js

@@ -37,19 +37,25 @@ const StyledBox = _styledComponents.default.div`
 }) => !theme.roundedCornersOptOut && (0, _styledComponents.css)`
       border-radius: var(--${borderRadius});
     `}
-
+  
   ${({
-  color,
+  cssProps,
   bg,
   backgroundColor,
   ...rest
 }) => (0, _color.default)({
-  color,
+  color: cssProps?.color,
   bg,
   backgroundColor,
   ...rest
 })}
 
+  ${({
+  cssProps
+}) => (0, _styledComponents.css)`
+    opacity: ${cssProps?.opacity};
+  `}
+
   ${({
   overflowWrap
 }) => overflowWrap && (0, _styledComponents.css)`
@@ -57,15 +63,17 @@ const StyledBox = _styledComponents.default.div`
     `}
   
   ${({
-  height
-}) => height && (0, _styledComponents.css)`
-      height: ${height};
+  cssProps,
+  size
+}) => cssProps?.height && !size && (0, _styledComponents.css)`
+      height: ${cssProps?.height};
     `}
 
   ${({
-  width
-}) => width && (0, _styledComponents.css)`
-      width: ${width};
+  cssProps,
+  size
+}) => cssProps?.width && !size && (0, _styledComponents.css)`
+      width: ${cssProps?.width};
     `}
 
   ${({

package/lib/components/duelling-picklist/picklist/picklist.style.d.ts

@@ -1,4 +1,11 @@
 declare const StyledPicklist: import("styled-components").StyledComponent<"div", any, import("../../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+} & {
     as: string;
 }, "as">;
 declare const StyledEmptyContainer: import("styled-components").StyledComponent<"li", any, {}, never>;

package/lib/components/flat-table/flat-table.style.d.ts

@@ -12,6 +12,13 @@ interface StyledFlatTableWrapperProps extends Pick<FlatTableProps, "hasStickyFoo
     isFocused: boolean;
     bottomBorderRadius: NonNullable<FlatTableProps["bottomBorderRadius"]>;
 }
-declare const StyledFlatTableWrapper: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & StyledFlatTableWrapperProps, never>;
+declare const StyledFlatTableWrapper: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+} & StyledFlatTableWrapperProps, never>;
 declare const StyledFlatTableFooter: import("styled-components").StyledComponent<"div", any, Pick<FlatTableProps, "hasStickyFooter">, never>;
 export { StyledFlatTableWrapper, StyledFlatTable, StyledFlatTableFooter, StyledTableContainer, };

package/lib/components/typography/list.component.d.ts

@@ -1,11 +1,13 @@
 import React from "react";
-import { TypographyProps } from "./typography.component";
+import { TypographyProps, VariantTypes } from "./typography.component";
 export interface ListProps extends TypographyProps {
     children?: React.ReactNode;
 }
 export interface ListItemProps extends TypographyProps {
+    /** (Deprecated) The visual style to apply to the component */
+    variant?: VariantTypes;
     children?: React.ReactNode;
 }
-declare const List: ({ children, as, ...props }: ListProps) => React.JSX.Element;
+declare const List: ({ children, as, variant, ...props }: ListProps) => React.JSX.Element;
 declare const ListItem: ({ children, ...props }: ListItemProps) => React.JSX.Element;
 export { List, ListItem };

package/lib/components/typography/list.component.js

@@ -4,11 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ListItem = exports.List = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _typography = _interopRequireDefault(require("./typography.component"));
+var _list = _interopRequireDefault(require("./list.context"));
+var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
 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; }
 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); }
+let childVariantDeprecationWarning = false;
 const getListStyleType = as => {
   if (as === "ul") {
     return "square";
@@ -18,19 +23,33 @@ const getListStyleType = as => {
 const List = ({
   children,
   as = "ul",
+  variant = "p",
   ...props
 }) => /*#__PURE__*/_react.default.createElement(_typography.default, _extends({
-  variant: "p",
+  variant: variant,
   as: as,
   listStyleType: getListStyleType(as)
-}, props), children);
+}, props), /*#__PURE__*/_react.default.createElement(_list.default.Provider, {
+  value: {
+    variant
+  }
+}, children));
 exports.List = List;
 const ListItem = ({
   children,
   ...props
-}) => /*#__PURE__*/_react.default.createElement(_typography.default, _extends({
-  as: "li",
-  variant: "p",
-  m: "0 0 8px 16px"
-}, props), children);
+}) => {
+  if (props.variant && !childVariantDeprecationWarning) {
+    _logger.default.deprecate("The use of `variant` on `ListItem` is deprecated. Please set it via `List` instead.");
+    childVariantDeprecationWarning = true;
+  }
+  const {
+    variant: parentListVariant
+  } = (0, _react.useContext)(_list.default);
+  return /*#__PURE__*/_react.default.createElement(_typography.default, _extends({
+    as: "li",
+    variant: parentListVariant,
+    m: "0 0 8px 16px"
+  }, props), children);
+};
 exports.ListItem = ListItem;

package/lib/components/typography/list.context.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { VariantTypes } from "./typography.component";
+export interface ListContextProps {
+    variant?: VariantTypes;
+}
+export declare const ListContext: React.Context<ListContextProps>;
+export default ListContext;

package/lib/components/typography/list.context.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ListContext = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const ListContext = exports.ListContext = /*#__PURE__*/_react.default.createContext({});
+var _default = exports.default = ListContext;

package/lib/components/vertical-menu/vertical-menu.style.d.ts

@@ -10,6 +10,20 @@ export declare const StyledTitle: import("styled-components").StyledComponent<"h
 export declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledTitleIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const StyledChevronIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
-export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps, never>;
-export declare const StyledVerticalMenuFullScreen: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps, never>;
+export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
+export declare const StyledVerticalMenuFullScreen: import("styled-components").StyledComponent<"div", any, import("../box").BoxProps & {
+    cssProps?: {
+        color?: string | undefined;
+        opacity?: string | undefined;
+        height?: string | undefined;
+        width?: string | undefined;
+    } | undefined;
+}, never>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "144.21.0",
+  "version": "144.22.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",
@@ -9,8 +9,7 @@
     "scripts/check_rfcs/index.js"
   ],
   "scripts": {
-    "start": "node ./scripts/check_node_version.mjs && storybook dev -p 9001 -c .storybook",
-    "start:debug-theme": "node ./scripts/debug-storybook.js",
+    "start": "node ./scripts/check_node_version.mjs && dotenvx run -- storybook dev -p 9001 -c .storybook",
     "test": "jest --config=./jest.config.ts",
     "test-update": "jest --config=./jest.config.ts --updateSnapshot",
     "format": "prettier --write './{src,playwright}/**/*.{js,jsx,ts,tsx}'",
@@ -21,8 +20,8 @@
     "prepublishOnly": "npm run precompile",
     "postinstall": "node ./scripts/check_rfcs/index.js",
     "watch": "npm run clean-lib && npm run copy-files -- --watch & npm run babel -- --watch",
-    "build-storybook": "node ./scripts/build-storybook.js",
-    "start-storybook": "node ./scripts/start-storybook.js",
+    "build-storybook": "dotenvx run -- storybook build -c .storybook",
+    "build-storybook:prod": "dotenvx run -f .env.production -- storybook build -c .storybook",
     "start:static": "npx http-server -p 9001 ./storybook-static",
     "clean-lib": "rimraf ./lib && rimraf ./esm",
     "commit": "git-cz",
@@ -70,6 +69,7 @@
     "@chromatic-com/storybook": "^2.0.2",
     "@commitlint/cli": "^17.6.3",
     "@commitlint/config-conventional": "^17.6.3",
+    "@dotenvx/dotenvx": "^1.25.1",
     "@playwright/experimental-ct-react17": "~1.47.0",
     "@playwright/test": "~1.47.0",
     "@sage/design-tokens": "~4.29.0",
@@ -82,7 +82,7 @@
     "@storybook/addon-docs": "^8.3.3",
     "@storybook/addon-toolbars": "^8.3.3",
     "@storybook/addon-viewport": "^8.3.3",
-    "@storybook/addon-webpack5-compiler-swc": "^1.0.4",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
     "@storybook/components": "^8.3.3",
     "@storybook/manager-api": "^8.3.3",
     "@storybook/preview-api": "^8.3.3",
@@ -126,7 +126,6 @@
     "cz-conventional-changelog": "^3.3.0",
     "date-fns-tz": "^1.3.8",
     "dayjs": "^1.11.10",
-    "dotenv": "^16.4.5",
     "draft-js": "^0.11.7",
     "eslint": "^8.55.0",
     "eslint-config-airbnb": "^19.0.0",

package/scripts/check_rfcs/check_rfcs.js

@@ -1,10 +1,8 @@
 /* eslint-disable no-console */
 const { Octokit } = require("@octokit/rest");
-const dotenv = require("dotenv");
 const chalk = require("chalk");
 const ci = require("ci-info");
 
-dotenv.config();
 const octokit = new Octokit({
   baseUrl: "https://api.github.com",
 });
@@ -46,7 +44,7 @@ const checkRfcs = async () => {
     const header = chalk.bold.inverse.white(
       " ".repeat(20),
       "Open RFCs for carbon-react",
-      " ".repeat(20)
+      " ".repeat(20),
     );
 
     const rfcText = openRfcs
@@ -61,10 +59,10 @@ const checkRfcs = async () => {
     const rfcLink =
       "https://github.com/Sage/carbon/pulls?q=is%3Aopen+is%3Apr+label%3ARFC";
     const message = `Failed to retrieve open RFCs for carbon-react. Go to ${chalk.cyan.italic(
-      rfcLink
+      rfcLink,
     )} to view current RFCs.`;
     console.log(
-      `${chalk.yellow.inverse(" WARN ")}\n${chalk.yellow(message)}\n`
+      `${chalk.yellow.inverse(" WARN ")}\n${chalk.yellow(message)}\n`,
     );
   }
 };