Merge pull request #7063 from Sage/FE-6894

feat(carbon-provider): add deprecation warning for roundedCornersOptOut & focusRedesignOptOut

src/components/carbon-provider/__internal__/new-validation.context.ts

@@ -5,10 +5,13 @@ export interface NewValidationContextProps {
    *
    * NOTE - Will eventually be set to `true` by default in the future. */
   validationRedesignOptIn?: boolean;
-  /** Feature flag for opting out of styling components to have rounded corners.
+  /** (Deprecated) Feature flag for opting out of styling components to have rounded corners.
    *
-   * NOTE - Will eventually be set to `false` by default in the future. */
+   * NOTE - This feature flag will soon be removed, along with the legacy styling. */
   roundedCornersOptOut?: boolean;
+  /** (Deprecated) Feature flag for opting out of the focus redesign.
+   *
+   * NOTE -  This feature flag will soon be removed, along with the legacy styling. */
   focusRedesignOptOut?: boolean;
 }
 

src/components/carbon-provider/carbon-provider.component.tsx

@@ -9,6 +9,7 @@ import NewValidationContext, {
   NewValidationContextProps,
 } from "./__internal__/new-validation.context";
 import TopModalProvider from "./__internal__/top-modal-provider.component";
+import Logger from "../../__internal__/utils/logger";
 
 export interface CarbonProviderProps extends NewValidationContextProps {
   /* Content for the provider to wrap */
@@ -17,6 +18,9 @@ export interface CarbonProviderProps extends NewValidationContextProps {
   theme?: Partial<ThemeObject>;
 }
 
+let deprecatedRoundedCornersOptOut = false;
+let deprecatedFocusRedesignOptOut = false;
+
 export const CarbonProvider = ({
   children,
   theme = sageTheme,
@@ -33,6 +37,23 @@ export const CarbonProvider = ({
     existingRoundedCornersOptOut || roundedCornersOptOut;
   const focusRedesignOptOutValue =
     existingFocusRedesignOptOut || focusRedesignOptOut;
+
+  if (!deprecatedRoundedCornersOptOut && roundedCornersOptOutValue) {
+    deprecatedRoundedCornersOptOut = true;
+    Logger.deprecate(
+      "The `roundedCornersOptOut` feature flag has been deprecated and will soon be removed. " +
+        "Along with this feature flag, the legacy pre-rounded corners styling will also be removed. ",
+    );
+  }
+
+  if (!deprecatedFocusRedesignOptOut && focusRedesignOptOutValue) {
+    deprecatedFocusRedesignOptOut = true;
+    Logger.deprecate(
+      "The `focusRedesignOptOut` feature flag has been deprecated and will soon be removed. " +
+        "Along with this feature flag, the legacy focus styling will also be removed. ",
+    );
+  }
+
   return (
     <ThemeProvider
       theme={{

src/components/carbon-provider/carbon-provider.test.tsx

@@ -0,0 +1,52 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import CarbonProvider from ".";
+import Logger from "../../__internal__/utils/logger";
+
+test("logs a deprecation warning once when the `roundedCornersOptOut` feature flag is `true`", () => {
+  const loggerSpy = jest
+    .spyOn(Logger, "deprecate")
+    .mockImplementation(() => {});
+
+  render(
+    <>
+      <CarbonProvider roundedCornersOptOut>
+        <CarbonProvider>Hello World!</CarbonProvider>
+      </CarbonProvider>
+      <CarbonProvider roundedCornersOptOut>
+        <CarbonProvider>Hello World!</CarbonProvider>
+      </CarbonProvider>
+    </>,
+  );
+
+  expect(loggerSpy).toHaveBeenCalledWith(
+    "The `roundedCornersOptOut` feature flag has been deprecated and will soon be removed. " +
+      "Along with this feature flag, the legacy pre-rounded corners styling will also be removed. ",
+  );
+  expect(loggerSpy).toHaveBeenCalledTimes(1);
+  loggerSpy.mockRestore();
+});
+
+test("logs a deprecation warning once when the `focusRedesignOptOut` feature flag is `true`", () => {
+  const loggerSpy = jest
+    .spyOn(Logger, "deprecate")
+    .mockImplementation(() => {});
+
+  render(
+    <>
+      <CarbonProvider focusRedesignOptOut>
+        <CarbonProvider>Hello World!</CarbonProvider>
+      </CarbonProvider>
+      <CarbonProvider focusRedesignOptOut>
+        <CarbonProvider>Hello World!</CarbonProvider>
+      </CarbonProvider>
+    </>,
+  );
+
+  expect(loggerSpy).toHaveBeenCalledWith(
+    "The `focusRedesignOptOut` feature flag has been deprecated and will soon be removed. " +
+      "Along with this feature flag, the legacy focus styling will also be removed. ",
+  );
+  expect(loggerSpy).toHaveBeenCalledTimes(1);
+  loggerSpy.mockRestore();
+});