chore: migrate to prettier 2.8

apps/perf-test-react-components/src/scenarios/Persona.tsx

@@ -10,8 +10,7 @@ const Scenario = () => (
     presence={{ status: 'available' }}
     avatar={{
       image: {
-        src:
-          'https://res-1.cdn.office.net/files/fabric-cdn-prod_20221209.001/office-ui-fabric-react-assets/persona-male.png',
+        src: 'https://res-1.cdn.office.net/files/fabric-cdn-prod_20221209.001/office-ui-fabric-react-assets/persona-male.png',
       },
     }}
   />

apps/perf-test-react-components/tasks/perf-test.ts

@@ -226,15 +226,16 @@ export async function getPerfRegressions() {
  * Create test summary based on test results.
  */
 function createReport(scenarioSettings: ScenarioSetting, testResults: CookResults) {
-  const report = '## [Perf Analysis (`@fluentui/react-components`)](https://github.com/microsoft/fluentui/wiki/Perf-Testing)\n'
+  const report =
+    '## [Perf Analysis (`@fluentui/react-components`)](https://github.com/microsoft/fluentui/wiki/Perf-Testing)\n'
 
-    // Show only significant changes by default.
-    .concat(createScenarioTable(scenarioSettings, testResults, false))
+      // Show only significant changes by default.
+      .concat(createScenarioTable(scenarioSettings, testResults, false))
 
-    // Show all results in a collapsible table.
-    .concat('<details><summary>All results</summary><p>')
-    .concat(createScenarioTable(scenarioSettings, testResults, true))
-    .concat('</p></details>\n\n');
+      // Show all results in a collapsible table.
+      .concat('<details><summary>All results</summary><p>')
+      .concat(createScenarioTable(scenarioSettings, testResults, true))
+      .concat('</p></details>\n\n');
 
   return report;
 }

apps/public-docsite-v9/src/Concepts/Migration/FromV0/Components/IconCatalog/IconCatalog.tsx

@@ -28,8 +28,8 @@ const _mapping = rawMapping
   .map(entry => {
     const v0IconName = `${entry.v0}`;
     const v9IconName = `${entry.v9}Regular`;
-    const V0Icon = ((v0Icons as unknown) as Record<string, V0IconComponent>)[v0IconName];
-    const V9Icon = ((v9Icons as unknown) as Record<string, V9IconComponent | undefined>)[v9IconName];
+    const V0Icon = (v0Icons as unknown as Record<string, V0IconComponent>)[v0IconName];
+    const V9Icon = (v9Icons as unknown as Record<string, V9IconComponent | undefined>)[v9IconName];
 
     if (!V0Icon) {
       return null;
@@ -43,7 +43,7 @@ const _mapping = rawMapping
     };
   })
   .filter(Boolean);
-const mapping = _mapping.filter(Boolean) as Array<NonNullable<typeof _mapping[number]>>;
+const mapping = _mapping.filter(Boolean) as Array<NonNullable<(typeof _mapping)[number]>>;
 
 const IconCatalogInner: React.FC = () => {
   const styles = useStyles();
@@ -75,9 +75,10 @@ const IconCatalogInner: React.FC = () => {
     [searchTerm, searchV0],
   );
 
-  const onInputChange: InputProps['onChange'] = React.useCallback((e, { value }) => updateSearchDebounced(value), [
-    updateSearchDebounced,
-  ]);
+  const onInputChange: InputProps['onChange'] = React.useCallback(
+    (e, { value }) => updateSearchDebounced(value),
+    [updateSearchDebounced],
+  );
   const onSwitchChange: SwitchProps['onChange'] = React.useCallback((e, { checked }) => setSearchV0(checked), []);
 
   return (

apps/public-docsite-v9/src/Concepts/Migration/FromV8/ThemeColors/colorUtils.ts

@@ -12,19 +12,19 @@ import {
 import { DefaultPalette } from '@fluentui/react';
 
 const palettePrefix = 'palette.';
-const paletteMap = (DefaultPalette as unknown) as Record<string, string>;
+const paletteMap = DefaultPalette as unknown as Record<string, string>;
 
 const blackAlphaPrefix = 'blackAlpha[';
 const greyPrefix = 'grey[';
 const whiteAlphaPrefix = 'whiteAlpha[';
 const sharedColorsPrefix = 'sharedColors.';
 const brandPrefix = 'brand[';
 
-const blackAlphaMap = (blackAlpha as unknown) as Record<string, string>;
-const greyMap = (grey as unknown) as Record<string, string>;
-const whiteAlphaMap = (whiteAlpha as unknown) as Record<string, string>;
-const sharedColorsMap = (sharedColors as unknown) as Record<string, string>;
-const brandMap = (brandWeb as unknown) as Record<string, string>;
+const blackAlphaMap = blackAlpha as unknown as Record<string, string>;
+const greyMap = grey as unknown as Record<string, string>;
+const whiteAlphaMap = whiteAlpha as unknown as Record<string, string>;
+const sharedColorsMap = sharedColors as unknown as Record<string, string>;
+const brandMap = brandWeb as unknown as Record<string, string>;
 
 const getV9BlackAlpha = (name: string): string => {
   const rampNumber = name.substring(blackAlphaPrefix.length, name.length - 1);
@@ -47,7 +47,7 @@ const getV9SharedColor = (name: string): string => {
     throw new Error('Could not get color block info. Unsupported shared color specified.');
   }
   const parent = sharedColorsMap[colorParts[0]];
-  return ((parent as unknown) as Record<string, string>)[colorParts[1]];
+  return (parent as unknown as Record<string, string>)[colorParts[1]];
 };
 
 const getV9BrandColor = (name: string): string => {

apps/public-docsite/src/pages/Controls/AvatarPage/AvatarPage.doc.ts

@@ -13,18 +13,22 @@ const componentUrl =
 
 export const AvatarPageProps: TFabricPlatformPageProps = {
   ios: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/ios/AvatarOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/ios/AvatarOverview.md') as string,
     related,
     componentUrl,
   },
   android: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/android/AvatarOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/android/AvatarOverview.md') as string,
     related,
     componentUrl,
   },
   mac: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarOverview.md') as string,
-    usage: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarUsage.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarOverview.md') as string,
+    usage:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarUsage.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/AvatarPage/AvatarPage.tsx

@@ -25,7 +25,8 @@ function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] | u
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/ios/AvatarImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/ios/AvatarImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/ios/AvatarImplementation.md') as string,
         },
       ];
 
@@ -34,15 +35,17 @@ function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] | u
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/android/AvatarImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/android/AvatarImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/android/AvatarImplementation.md') as string,
         },
       ];
     case 'mac':
       return [
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/mac/AvatarImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/AvatarPage/docs/mac/AvatarImplementation.md') as string,
         },
       ];
   }

apps/public-docsite/src/pages/Controls/BottomNavigationPage/BottomNavigationPage.doc.ts

@@ -11,13 +11,15 @@ const componentUrl =
 export const BottomNavigationPageProps: TFabricPlatformPageProps = {
   ios: {
     title: 'Tab Bar',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomNavigationPage/docs/ios/BottomNavigationOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomNavigationPage/docs/ios/BottomNavigationOverview.md') as string,
     related,
     componentUrl,
   },
   android: {
     title: 'Bottom Navigation',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomNavigationPage/docs/android/BottomNavigationOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomNavigationPage/docs/android/BottomNavigationOverview.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/BottomSheetPage/BottomSheetPage.doc.ts

@@ -11,7 +11,8 @@ const componentUrl =
 
 export const BottomSheetPageProps: TFabricPlatformPageProps = {
   android: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomSheetPage/docs/android/BottomSheetOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomSheetPage/docs/android/BottomSheetOverview.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/BottomSheetPage/BottomSheetPage.tsx

@@ -26,7 +26,8 @@ function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] | u
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/android/BottomSheetImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomSheetPage/docs/android/BottomSheetImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/BottomSheetPage/docs/android/BottomSheetImplementation.md') as string,
         },
       ];
   }

apps/public-docsite/src/pages/Controls/ButtonPage/ButtonPage.doc.ts

@@ -20,30 +20,38 @@ export const ButtonPageProps = (disabled: boolean, checked: boolean): TPlatformP
       related,
     },
     ios: {
-      overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/ios/ButtonOverview.md') as string,
+      overview:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/ios/ButtonOverview.md') as string,
       related,
       componentUrl,
     },
     android: {
-      overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/android/ButtonOverview.md') as string,
+      overview:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/android/ButtonOverview.md') as string,
       related,
       componentUrl,
     },
     windows: {
-      overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/windows/ButtonOverview.md') as string,
-      usage: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/windows/ButtonUsage.md') as string,
+      overview:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/windows/ButtonOverview.md') as string,
+      usage:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/windows/ButtonUsage.md') as string,
       related,
       componentUrl,
     },
     mac: {
-      overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonOverview.md') as string,
-      usage: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonUsage.md') as string,
+      overview:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonOverview.md') as string,
+      usage:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonUsage.md') as string,
       related,
       componentUrl,
     },
     cross: {
-      overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/cross/ButtonOverview.md') as string,
-      usage: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/cross/ButtonUsage.md') as string,
+      overview:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/cross/ButtonOverview.md') as string,
+      usage:
+        require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/cross/ButtonUsage.md') as string,
       related,
       componentUrl,
     },

apps/public-docsite/src/pages/Controls/ButtonPage/ButtonPage.tsx

@@ -72,7 +72,8 @@ export class ButtonPage extends React.Component<
           {
             sectionName: 'Implementation',
             editUrl: baseUrl + 'docs/ios/ButtonImplementation.md',
-            content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/ios/ButtonImplementation.md') as string,
+            content:
+              require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/ios/ButtonImplementation.md') as string,
           },
         ];
 
@@ -81,7 +82,8 @@ export class ButtonPage extends React.Component<
           {
             sectionName: 'Implementation',
             editUrl: baseUrl + 'docs/android/ButtonImplementation.md',
-            content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/android/ButtonImplementation.md') as string,
+            content:
+              require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/android/ButtonImplementation.md') as string,
           },
         ];
       case 'windows':
@@ -96,7 +98,8 @@ export class ButtonPage extends React.Component<
           {
             sectionName: 'Implementation',
             editUrl: baseUrl + 'docs/mac/ButtonImplementation.md',
-            content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonImplementation.md') as string,
+            content:
+              require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ButtonPage/docs/mac/ButtonImplementation.md') as string,
           },
         ];
       case 'cross':

apps/public-docsite/src/pages/Controls/CalendarPage/CalendarPage.doc.ts

@@ -16,7 +16,8 @@ export const CalendarPageProps: TFabricPlatformPageProps = {
     related,
   },
   android: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/CalendarPage/docs/android/CalendarOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/CalendarPage/docs/android/CalendarOverview.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/CalendarPage/CalendarPage.tsx

@@ -26,7 +26,8 @@ function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] | u
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/android/CalendarImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/CalendarPage/docs/android/CalendarImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/CalendarPage/docs/android/CalendarImplementation.md') as string,
         },
       ];
   }

apps/public-docsite/src/pages/Controls/ChipPage/ChipPage.doc.ts

@@ -12,13 +12,15 @@ const componentUrl =
 export const ChipPageProps: TFabricPlatformPageProps = {
   ios: {
     title: 'Chip',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ChipPage/docs/ios/ChipOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ChipPage/docs/ios/ChipOverview.md') as string,
     related,
     componentUrl,
   },
   android: {
     title: 'Chip',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ChipPage/docs/android/ChipOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/ChipPage/docs/android/ChipOverview.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/DatePickerPage/DatePickerPage.doc.ts

@@ -20,22 +20,26 @@ export const DatePickerPageProps: TFabricPlatformPageProps = {
   ios: {
     title: 'Date & Time Picker',
     fileNamePrefix: 'DateTimePicker',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/ios/DateTimePickerOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/ios/DateTimePickerOverview.md') as string,
     related,
     componentUrl,
   },
   android: {
     title: 'Date & Time Picker',
     fileNamePrefix: 'DateTimePicker',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/android/DateTimePickerOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/android/DateTimePickerOverview.md') as string,
     related,
     componentUrl,
   },
   mac: {
     title: 'Date Picker',
     fileNamePrefix: 'DatePicker',
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/mac/DatePickerOverview.md') as string,
-    usage: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/mac/DatePickerUsage.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/mac/DatePickerOverview.md') as string,
+    usage:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DatePickerPage/docs/mac/DatePickerUsage.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/DrawerPage/DrawerPage.doc.ts

@@ -12,12 +12,14 @@ const componentUrl =
 
 export const DrawerPageProps: TFabricPlatformPageProps = {
   ios: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/ios/DrawerOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/ios/DrawerOverview.md') as string,
     related,
     componentUrl,
   },
   android: {
-    overview: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/android/DrawerOverview.md') as string,
+    overview:
+      require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/android/DrawerOverview.md') as string,
     related,
     componentUrl,
   },

apps/public-docsite/src/pages/Controls/DrawerPage/DrawerPage.tsx

@@ -25,15 +25,17 @@ function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] | u
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/ios/DrawerImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/ios/DrawerImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/ios/DrawerImplementation.md') as string,
         },
       ];
     case 'android':
       return [
         {
           sectionName: 'Implementation',
           editUrl: baseUrl + 'docs/android/DrawerImplementation.md',
-          content: require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/android/DrawerImplementation.md') as string,
+          content:
+            require('!raw-loader?esModule=false!@fluentui/public-docsite/src/pages/Controls/DrawerPage/docs/android/DrawerImplementation.md') as string,
         },
       ];
   }