chore(web-components-v3): cherry-pick some changes to fix CI check

.codesandbox/ci.json

@@ -2,5 +2,5 @@
   "buildCommand": "build:codesandbox",
   "packages": ["packages/react", "packages/react-components/react-components"],
   "sandboxes": ["x5u3t", "spnyu"],
-  "node": "14"
+  "node": "16"
 }

.devops/templates/tools.yml

@@ -2,7 +2,7 @@
 steps:
   - task: NodeTool@0
     inputs:
-      versionSpec: '14.18.1'
+      versionSpec: '16.18.1'
       checkLatest: false
     displayName: 'Install Node.js'
 

.github/workflows/check-packages.yml

@@ -12,7 +12,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - uses: tj-actions/changed-files@v34
@@ -44,7 +44,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
 
       - uses: actions/github-script@v6
         with:
@@ -70,7 +70,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
 
       - uses: actions/github-script@v6
         with:

.github/workflows/docsite-publish-chromatic.yml

@@ -37,7 +37,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - name: Install packages

.github/workflows/docsite-publish-ghpages.yml

@@ -37,7 +37,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: 14.18.1
+          node-version: 16.18.1
           cache: 'yarn'
 
       - name: Install packages

apps/ts-minbar-test-react/src/index.ts

@@ -27,7 +27,7 @@ async function performTest() {
     // Install dependencies, using the minimum TS version supported for consumers
     const dependencies = [
       '@types/node@14',
-      '@types/react@17',
+      `@types/react@17`,
       '@types/react-dom@17',
       'react@17',
       'react-dom@17',
@@ -51,9 +51,9 @@ async function performTest() {
     await shEcho(`yarn --version`);
     await shEcho(`yarn tsc --version`);
     await shEcho(`yarn tsc --version`, tempPaths.testApp);
-  } catch (e) {
+  } catch (err) {
     console.error('Something went wrong setting up the test:');
-    console.error(e?.stack || e);
+    console.error(err instanceof Error ? err?.stack : err);
     process.exit(1);
   }
 

azure-pipelines.bundlesize.yml

@@ -132,8 +132,7 @@ jobs:
       - template: .devops/templates/cleanup.yml
 
   - job: merge
-    pool:
-      vmImage: 'windows-2019'
+    pool: '1ES-Host-Ubuntu'
     dependsOn:
       - build_northstar
       - build_react
@@ -152,10 +151,10 @@ jobs:
           artifactName: 'bundlesize-northstar'
           targetPath: '$(Build.ArtifactStagingDirectory)/react-northstar'
 
-      - script: 'chocolatey install jq'
+      - script: 'sudo apt-get install jq'
         displayName: 'Install jq'
 
-      - script: jq -c -s "reduce .[] as $item ({}; . * $item)" $(Build.ArtifactStagingDirectory)/react-northstar/bundlesize.json $(Build.ArtifactStagingDirectory)/react/bundlesize.json > $(Build.ArtifactStagingDirectory)/bundlesizes.json
+      - script: jq -c -s 'reduce .[] as $item ({}; . * $item)' $(Build.ArtifactStagingDirectory)/react-northstar/bundlesize.json $(Build.ArtifactStagingDirectory)/react/bundlesize.json > $(Build.ArtifactStagingDirectory)/bundlesizes.json
         displayName: 'Merge @fluentui/react, @fluentui/react-components & @fluentui/react-northstar to bundlesizes.json'
 
       - task: PublishBuildArtifacts@1

package.json

@@ -8,7 +8,7 @@
     "url": "https://github.com/microsoft/fluentui"
   },
   "engines": {
-    "node": "^14.18.1 || ^16.0.0"
+    "node": "^16.18.1 || ^18.0.0"
   },
   "scripts": {
     "build": "lage build --verbose",
@@ -164,7 +164,7 @@
     "@types/lodash": "4.14.182",
     "@types/markdown-table": "2.0.0",
     "@types/micromatch": "4.0.2",
-    "@types/node": "14.18.32",
+    "@types/node": "16.18.1",
     "@types/node-fetch": "2.5.7",
     "@types/prettier": "2.2.3",
     "@types/progress": "2.0.5",

packages/react-components/global-context/src/types.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
 
-export type GlobalObject = (typeof globalThis | NodeJS.Global) & Record<symbol, React.Context<unknown>>;
+export type GlobalObject = typeof globalThis & Record<symbol, React.Context<unknown>>;

packages/react/etc/react.api.md

@@ -9461,7 +9461,7 @@ export interface ITooltipHost {
 }
 
 // @public
-export interface ITooltipHostProps extends React_2.HTMLAttributes<HTMLDivElement | TooltipHostBase> {
+export interface ITooltipHostProps extends Omit<React_2.HTMLAttributes<HTMLDivElement | TooltipHostBase>, 'content'> {
     calloutProps?: ICalloutProps;
     className?: string;
     closeDelay?: number;
@@ -9503,7 +9503,7 @@ export interface ITooltipHostStyles {
 }
 
 // @public (undocumented)
-export interface ITooltipProps extends React_2.HTMLAttributes<HTMLDivElement | TooltipBase> {
+export interface ITooltipProps extends Omit<React_2.HTMLAttributes<HTMLDivElement | TooltipBase>, 'content'> {
     calloutProps?: ICalloutProps;
     componentRef?: IRefObject<ITooltip>;
     content?: string | JSX.Element | JSX.Element[];

packages/react/src/components/Tooltip/Tooltip.types.ts

@@ -13,7 +13,7 @@ export interface ITooltip {}
 /**
  * {@docCategory Tooltip}
  */
-export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | TooltipBase> {
+export interface ITooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement | TooltipBase>, 'content'> {
   /**
    * Optional callback to access the ITooltip interface. Use this instead of ref for accessing
    * the public methods and properties of the component.

packages/react/src/components/Tooltip/TooltipHost.types.ts

@@ -41,7 +41,7 @@ export enum TooltipOverflowMode {
  * passed through to the Tooltip itself, rather than being used on the host element.
  * {@docCategory Tooltip}
  */
-export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement | TooltipHostBase> {
+export interface ITooltipHostProps extends Omit<React.HTMLAttributes<HTMLDivElement | TooltipHostBase>, 'content'> {
   /**
    * Optional callback to access the ITooltipHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.

yarn.lock

@@ -5761,10 +5761,10 @@
     "@types/node" "*"
     form-data "^3.0.0"
 
-"@types/node@*", "@types/node@14.18.32", "@types/node@>=10.0.0", "@types/node@^14.0.10 || ^16.0.0", "@types/node@^14.14.20 || ^16.0.0", "@types/node@^14.14.31":
-  version "14.18.32"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.18.32.tgz#8074f7106731f1a12ba993fe8bad86ee73905014"
-  integrity sha512-Y6S38pFr04yb13qqHf8uk1nHE3lXgQ30WZbv1mLliV9pt0NjvqdWttLcrOYLnXbOafknVYRHZGoMSpR9UwfYow==
+"@types/node@*", "@types/node@16.18.1", "@types/node@>=10.0.0", "@types/node@^14.0.10 || ^16.0.0", "@types/node@^14.14.20 || ^16.0.0":
+  version "16.18.1"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-16.18.1.tgz#fd860a5efc505a5417d25a99cbff78077447a391"
+  integrity sha512-Z659t5cj2Tt2SaqbJxXRo5EaU86E4l2CxtklCY1VftxYXhR81Z75UsugwdI7l5MUAR1I+l8sdt3B5Y++ZV76WQ==
 
 "@types/[email protected]", "@types/node@^10.12.18":
   version "10.17.13"
@@ -5781,6 +5781,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-11.15.54.tgz#59ed60e7b0d56905a654292e8d73275034eb6283"
   integrity sha512-1RWYiq+5UfozGsU6MwJyFX6BtktcT10XRjvcAQmskCtMcW3tPske88lM/nHv7BQG1w9KBXI1zPGuu5PnNCX14g==
 
+"@types/node@^14.14.31":
+  version "14.18.32"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.18.32.tgz#8074f7106731f1a12ba993fe8bad86ee73905014"
+  integrity sha512-Y6S38pFr04yb13qqHf8uk1nHE3lXgQ30WZbv1mLliV9pt0NjvqdWttLcrOYLnXbOafknVYRHZGoMSpR9UwfYow==
+
 "@types/normalize-package-data@^2.4.0":
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.0.tgz#e486d0d97396d79beedd0a6e33f4534ff6b4973e"