From c52731722dbb03f1d5335893afd65503bcc446f3 Mon Sep 17 00:00:00 2001 From: Pramod Valavala Date: Wed, 10 May 2023 19:46:16 -0400 Subject: [PATCH] Upgrade @fluentui/react to 8.x version (#3546) * Upgrade @fluentui/react to 8.x version * Revert native props for checkboxes * Update peer dependency version of @fluentui/react to first production version * Update fluent-ui components to be backwards compatible with v7 * Update CHANGELOG.md Co-authored-by: Heath C <51679588+heath-freenome@users.noreply.github.com> * Update @fluentui/react package in the playground --------- Co-authored-by: Heath C <51679588+heath-freenome@users.noreply.github.com> --- CHANGELOG.md | 1 + packages/fluent-ui/package-lock.json | 951 +++++++------- packages/fluent-ui/package.json | 4 +- .../src/CheckboxWidget/CheckboxWidget.tsx | 21 +- .../src/CheckboxesWidget/CheckboxesWidget.tsx | 14 +- .../fluent-ui/src/RadioWidget/RadioWidget.tsx | 3 +- .../src/UpDownWidget/UpDownWidget.tsx | 18 +- .../test/__snapshots__/Array.test.tsx.snap | 960 +++++++------- .../test/__snapshots__/Form.test.tsx.snap | 1157 ++++++++++------- .../test/__snapshots__/Object.test.tsx.snap | 654 +++++----- packages/playground/package-lock.json | 881 +++++++------ packages/playground/package.json | 2 +- 12 files changed, 2508 insertions(+), 2158 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a00dcdc2d5..f831e83a0f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -32,6 +32,7 @@ should change the heading of the (upcoming) version to include a major version b ## @rjsf/fluent-ui - Added support for `additionalProperties` to fluent-ui theme, fixing [#2777](https://github.com/rjsf-team/react-jsonschema-form/issues/2777). +- Upgraded to `8.x` version of `@fluentui/react`, fixing [#3463](https://github.com/rjsf-team/react-jsonschema-form/issues/3463) ## @rjsf/utils diff --git a/packages/fluent-ui/package-lock.json b/packages/fluent-ui/package-lock.json index 398920ccbc..aebea0fc73 100644 --- a/packages/fluent-ui/package-lock.json +++ b/packages/fluent-ui/package-lock.json @@ -18,7 +18,7 @@ "@babel/plugin-transform-modules-commonjs": "^7.21.2", "@babel/preset-env": "^7.21.4", "@babel/preset-react": "^7.18.6", - "@fluentui/react": "^7.204.0", + "@fluentui/react": "^8.1.0", "@types/lodash": "^4.14.194", "@types/react": "^17.0.58", "@types/react-dom": "^17.0.19", @@ -34,7 +34,7 @@ "node": ">=14" }, "peerDependencies": { - "@fluentui/react": "^7.190.3", + "@fluentui/react": "^8.1.0", "@rjsf/core": "5.6.x", "@rjsf/utils": "5.6.x", "react": "^16.14.0 || >=17" @@ -1922,158 +1922,301 @@ } }, "node_modules/@fluentui/date-time-utilities": { - "version": "7.9.1", - "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-7.9.1.tgz", - "integrity": "sha512-o8iU1VIY+QsqVRWARKiky29fh4KR1xaKSgMClXIi65qkt8EDDhjmlzL0KVDEoDA2GWukwb/1PpaVCWDg4v3cUQ==", + "version": "8.5.7", + "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-8.5.7.tgz", + "integrity": "sha512-+g6YWgI0LbsoPo03rCNRsZPP9uXlYVfCY/AdFTfAr3RiilLWIt9L21eRm0/vap/HEc4Jx+MoW8RpBg9U0i5PkA==", "dev": true, "dependencies": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" } }, + "node_modules/@fluentui/date-time-utilities/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, "node_modules/@fluentui/dom-utilities": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-1.1.2.tgz", - "integrity": "sha512-XqPS7l3YoMwxdNlaYF6S2Mp0K3FmVIOIy2K3YkMc+eRxu9wFK6emr2Q/3rBhtG5u/On37NExRT7/5CTLnoi9gw==", + "version": "2.2.6", + "resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.2.6.tgz", + "integrity": "sha512-yJOEiFj/TfR307hzZn15kNocC0P3j2BltrAJznhgXywMKJhIczATFTfj2len7YMHxLttnR5yDz/oYpyBLSk4rw==", "dev": true, "dependencies": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" } }, - "node_modules/@fluentui/keyboard-key": { - "version": "0.2.17", - "resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.2.17.tgz", - "integrity": "sha512-iT1bU56rKrKEOfODoW6fScY11qj3iaYrZ+z11T6fo5+TDm84UGkkXjLXJTE57ZJzg0/gbccHQWYv+chY7bJN8Q==", + "node_modules/@fluentui/dom-utilities/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/font-icons-mdl2": { + "version": "8.5.13", + "resolved": "https://registry.npmjs.org/@fluentui/font-icons-mdl2/-/font-icons-mdl2-8.5.13.tgz", + "integrity": "sha512-3JjYN7lJZefpBdNPoQRFOiNpyVw+BOGynMkmYglnGjEWlg3uodawNi9lnKBODXCy31OHh900n9pAPFyNpdCbBg==", "dev": true, "dependencies": { - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" } }, - "node_modules/@fluentui/react": { - "version": "7.204.0", - "resolved": "https://registry.npmjs.org/@fluentui/react/-/react-7.204.0.tgz", - "integrity": "sha512-WQKHcO6cboGO0eCPsiNSzUwnMWBmAvdltu4X0tvXwb+q8W3wZzCQiU1voDVYNm4Nz/Jgiiy8jbMcesmNAq7jsw==", + "node_modules/@fluentui/font-icons-mdl2/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/foundation-legacy": { + "version": "8.2.33", + "resolved": "https://registry.npmjs.org/@fluentui/foundation-legacy/-/foundation-legacy-8.2.33.tgz", + "integrity": "sha512-Z1Nl1hmyICAjTwaU2fvIGenzczRfyf0P3oaRniwac4gAa5MidE6QlpAkEcwCka2QEG/qUjcx/cMacDGLN/Dd0A==", "dev": true, "dependencies": { - "@uifabric/set-version": "^7.0.24", - "office-ui-fabric-react": "^7.204.0", - "tslib": "^1.10.0" + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" } }, - "node_modules/@fluentui/react-compose": { - "version": "0.19.24", - "resolved": "https://registry.npmjs.org/@fluentui/react-compose/-/react-compose-0.19.24.tgz", - "integrity": "sha512-4PO7WSIZjwBGObpknjK8d1+PhPHJGSlVSXKFHGEoBjLWVlCTMw6Xa1S4+3K6eE3TEBbe9rsqwwocMTFHjhWwtQ==", + "node_modules/@fluentui/foundation-legacy/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/keyboard-key": { + "version": "0.4.6", + "resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.4.6.tgz", + "integrity": "sha512-p59zLGs3ucDPc7ZVaPxVCaQsfNwERDt3n+yLE0w/FFBlPWJcOSkiZHIieMhqk5ur5YGzbgs9WppPrtxNga23fw==", "dev": true, "dependencies": { - "@types/classnames": "^2.2.9", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "classnames": "^2.2.6", - "tslib": "^1.10.0" + "tslib": "^2.1.0" + } + }, + "node_modules/@fluentui/keyboard-key/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/merge-styles": { + "version": "8.5.7", + "resolved": "https://registry.npmjs.org/@fluentui/merge-styles/-/merge-styles-8.5.7.tgz", + "integrity": "sha512-t/mOQTigj51n7z6VPZ1nlb9getkzoLVhN0aUbOJUSD5qvu0gZqSBh7Y9xIP6QeYWF4q6wcZhEggo8HOgYqaWQw==", + "dev": true, + "dependencies": { + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + } + }, + "node_modules/@fluentui/merge-styles/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/react": { + "version": "8.108.2", + "resolved": "https://registry.npmjs.org/@fluentui/react/-/react-8.108.2.tgz", + "integrity": "sha512-wVJBFZFVNzaaLByPkz36oMDexS5Poi9LKSbzQdAXJMdm7IQDiz4vvPcz5fFxZaFZeTclWZmZmdUAkg5301TiXQ==", + "dev": true, + "dependencies": { + "@fluentui/date-time-utilities": "^8.5.7", + "@fluentui/font-icons-mdl2": "^8.5.13", + "@fluentui/foundation-legacy": "^8.2.33", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/react-focus": "^8.8.19", + "@fluentui/react-hooks": "^8.6.20", + "@fluentui/react-portal-compat-context": "^9.0.5", + "@fluentui/react-window-provider": "^2.2.9", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/theme": "^2.6.25", + "@fluentui/utilities": "^8.13.9", + "@microsoft/load-themed-styles": "^1.10.26", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "@types/react-dom": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0", + "react-dom": ">=16.8.0 <19.0.0" } }, "node_modules/@fluentui/react-focus": { - "version": "7.18.17", - "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-7.18.17.tgz", - "integrity": "sha512-W+sLIhX7wLzMsJ0jhBrDAblkG3DNbRbF8UoSieRVdAAm7xVf5HpiwJ6tb6nGqcFOnpRh8y+fjyVM+dV3K6GNHA==", + "version": "8.8.19", + "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-8.8.19.tgz", + "integrity": "sha512-Gswx0aOazRVFJONmcsj5o6SI/ebWQeZyBAlOsdFeSUuK38aRlVy4DbwVQ+5tQ675u3wmf/+Ln2a0xCixOAVvWg==", "dev": true, "dependencies": { - "@fluentui/keyboard-key": "^0.2.12", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" + "@fluentui/keyboard-key": "^0.4.6", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" } }, - "node_modules/@fluentui/react-stylesheets": { - "version": "0.2.9", - "resolved": "https://registry.npmjs.org/@fluentui/react-stylesheets/-/react-stylesheets-0.2.9.tgz", - "integrity": "sha512-6GDU/cUEG/eJ4owqQXDWPmP5L1zNh2NLEDKdEzxd7cWtGnoXLeMjbs4vF4t5wYGzGaxZmUQILOvJdgCIuc9L9Q==", + "node_modules/@fluentui/react-focus/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/react-hooks": { + "version": "8.6.20", + "resolved": "https://registry.npmjs.org/@fluentui/react-hooks/-/react-hooks-8.6.20.tgz", + "integrity": "sha512-vb90tgc0nGWvahE2zuPPtEpknIfAA0ABq7/ro7+CAcKgDx2sleGZKRGdzKXdYS026OxjQ8TN2K7/D3OI1v4Rjg==", "dev": true, "dependencies": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/react-window-provider": "^2.2.9", + "@fluentui/set-version": "^8.2.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" } }, - "node_modules/@fluentui/react-theme-provider": { - "version": "0.19.16", - "resolved": "https://registry.npmjs.org/@fluentui/react-theme-provider/-/react-theme-provider-0.19.16.tgz", - "integrity": "sha512-Kf7z4ZfNLS/onaFL5eQDSlizgwy2ytn6SDyjEKV+9VhxIXdDtOh8AaMXWE7dsj1cRBfBUvuGPVnsnoaGdHxJ+A==", + "node_modules/@fluentui/react-hooks/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/react-portal-compat-context": { + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/@fluentui/react-portal-compat-context/-/react-portal-compat-context-9.0.5.tgz", + "integrity": "sha512-vgGvv74jPi/salcxv37TCm06lOFn44CfNLX5wZw5HQIe9LYGUw/J7vkaniwNIzmQZsn62Y+fVxDS6Sq5S823tA==", "dev": true, "dependencies": { - "@fluentui/react-compose": "^0.19.24", - "@fluentui/react-stylesheets": "^0.2.9", - "@fluentui/react-window-provider": "^1.0.6", - "@fluentui/theme": "^1.7.13", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/react-hooks": "^7.16.4", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "classnames": "^2.2.6", - "tslib": "^1.10.0" + "@swc/helpers": "^0.4.14" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" } }, "node_modules/@fluentui/react-window-provider": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-1.0.6.tgz", - "integrity": "sha512-m2HoxhU2m/yWxUauf79y+XZvrrWNx+bMi7ZiL6DjiAKHjTSa8KOyvicbOXd/3dvuVzOaNTnLDdZAvhRFcelOIA==", + "version": "2.2.9", + "resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-2.2.9.tgz", + "integrity": "sha512-BRa23ITjwUgewS9ynzCnW2bJIgaNHwhPUY0htLKcYSSv3fG7iib91B6FVC7QqmXDBTia00kqVul1TZz5G0qrlQ==", "dev": true, "dependencies": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" + } + }, + "node_modules/@fluentui/react-window-provider/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/react/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/set-version": { + "version": "8.2.6", + "resolved": "https://registry.npmjs.org/@fluentui/set-version/-/set-version-8.2.6.tgz", + "integrity": "sha512-zXIfscQ1ZAiEpHc5taMrDEtTP2NtPBGlz2HbOpZiQ3aj/xcnUT7nT73ctb+Q2bHIqlDCHEaFRQxy/HG6koGYAA==", + "dev": true, + "dependencies": { + "tslib": "^2.1.0" + } + }, + "node_modules/@fluentui/set-version/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/style-utilities": { + "version": "8.9.6", + "resolved": "https://registry.npmjs.org/@fluentui/style-utilities/-/style-utilities-8.9.6.tgz", + "integrity": "sha512-glhexQzJNnLws66Tb7a0WPStYVE1tRy0QWwbtOdIRXsd/3CA1FZse76itss8/yqGakPin2PElkej/jTKpaRWew==", + "dev": true, + "dependencies": { + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/theme": "^2.6.25", + "@fluentui/utilities": "^8.13.9", + "@microsoft/load-themed-styles": "^1.10.26", + "tslib": "^2.1.0" } }, + "node_modules/@fluentui/style-utilities/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, "node_modules/@fluentui/theme": { - "version": "1.7.13", - "resolved": "https://registry.npmjs.org/@fluentui/theme/-/theme-1.7.13.tgz", - "integrity": "sha512-/1ZDHZNzV7Wgohay47DL9TAH4uuib5+B2D6Rxoc3T6ULoWcFzwLeVb+VZB/WOCTUbG+NGTrmsWPBOz5+lbuOxA==", + "version": "2.6.25", + "resolved": "https://registry.npmjs.org/@fluentui/theme/-/theme-2.6.25.tgz", + "integrity": "sha512-slp+Tk+FEDj6HtZNWzckEMPLZMYfe2bECz4hLj/aq2ok51f2ztVTM8rjjmiJjOAidcTirF/gdYVbayc/5MOKag==", + "dev": true, + "dependencies": { + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" + } + }, + "node_modules/@fluentui/theme/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, + "node_modules/@fluentui/utilities": { + "version": "8.13.9", + "resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.13.9.tgz", + "integrity": "sha512-8SkDFN+v3FZ2DNQtnRHnUxkY2tVQo6ojHVPWsR5WAbfKDAdlDUWxf5bM+U/8d4E4v49x4HpKY1fqsrx3hLAhyA==", "dev": true, "dependencies": { - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" + "@fluentui/dom-utilities": "^2.2.6", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" }, "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" + "@types/react": ">=16.8.0 <19.0.0", + "react": ">=16.8.0 <19.0.0" } }, + "node_modules/@fluentui/utilities/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, "node_modules/@humanwhocodes/config-array": { "version": "0.11.8", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz", @@ -3103,6 +3246,21 @@ "@sinonjs/commons": "^1.7.0" } }, + "node_modules/@swc/helpers": { + "version": "0.4.14", + "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.14.tgz", + "integrity": "sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==", + "dev": true, + "dependencies": { + "tslib": "^2.4.0" + } + }, + "node_modules/@swc/helpers/node_modules/tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + }, "node_modules/@tootallnate/once": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", @@ -3177,16 +3335,6 @@ "@babel/types": "^7.3.0" } }, - "node_modules/@types/classnames": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.3.1.tgz", - "integrity": "sha512-zeOWb0JGBoVmlQoznvqXbE0tEC/HONsnoUNH19Hc96NFsTAwTXbTqb8FMYkru1F/iqp7a18Ws3nWJvtA1sHD1A==", - "deprecated": "This is a stub types definition. classnames provides its own type definitions, so you do not need this installed.", - "dev": true, - "dependencies": { - "classnames": "*" - } - }, "node_modules/@types/estree": { "version": "0.0.39", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz", @@ -3652,107 +3800,6 @@ "url": "https://opencollective.com/typescript-eslint" } }, - "node_modules/@uifabric/foundation": { - "version": "7.10.16", - "resolved": "https://registry.npmjs.org/@uifabric/foundation/-/foundation-7.10.16.tgz", - "integrity": "sha512-x13xS9aKh6FEWsyQP2jrjyiXmUUdgyuAfWKMLhUTK4Rsc+vJANwwVk4fqGsU021WA6pghcIirvEVpWf5MlykDQ==", - "dev": true, - "dependencies": { - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - }, - "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" - } - }, - "node_modules/@uifabric/icons": { - "version": "7.9.5", - "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-7.9.5.tgz", - "integrity": "sha512-0e2fEURtR7sNqoGr9gU/pzcOp24B/Lkdc05s1BSnIgXlaL2QxRszfaEsl3/E9vsNmqA3tvRwDJWbtRolDbjCpQ==", - "dev": true, - "dependencies": { - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "node_modules/@uifabric/merge-styles": { - "version": "7.20.2", - "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-7.20.2.tgz", - "integrity": "sha512-cJy8hW9smlWOKgz9xSDMCz/A0yMl4mdo466pcGlIOn84vz+e94grfA7OoTuTzg3Cl0Gj6ODBSf1o0ZwIXYL1Xg==", - "dev": true, - "dependencies": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" - } - }, - "node_modules/@uifabric/react-hooks": { - "version": "7.16.4", - "resolved": "https://registry.npmjs.org/@uifabric/react-hooks/-/react-hooks-7.16.4.tgz", - "integrity": "sha512-k8RJYTMICWA6varT5Y+oCf2VDHHXN0tC2GuPD4I2XqYCTLaXtNCm4+dMcVA2x8mv1HIO7khvm/8aqKheU/tDfQ==", - "dev": true, - "dependencies": { - "@fluentui/react-window-provider": "^1.0.6", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - }, - "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" - } - }, - "node_modules/@uifabric/set-version": { - "version": "7.0.24", - "resolved": "https://registry.npmjs.org/@uifabric/set-version/-/set-version-7.0.24.tgz", - "integrity": "sha512-t0Pt21dRqdC707/ConVJC0WvcQ/KF7tKLU8AZY7YdjgJpMHi1c0C427DB4jfUY19I92f60LOQyhJ4efH+KpFEg==", - "dev": true, - "dependencies": { - "tslib": "^1.10.0" - } - }, - "node_modules/@uifabric/styling": { - "version": "7.25.1", - "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-7.25.1.tgz", - "integrity": "sha512-bd4QDYyb0AS0+KmzrB8VsAfOkxZg0dpEpF1YN5Ben10COmT8L1DoE4bEF5NvybHEaoTd3SKxpJ42m+ceNzehSw==", - "dev": true, - "dependencies": { - "@fluentui/theme": "^1.7.13", - "@microsoft/load-themed-styles": "^1.10.26", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "node_modules/@uifabric/utilities": { - "version": "7.38.2", - "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-7.38.2.tgz", - "integrity": "sha512-5yM4sm142VEBg3/Q5SFheBXqnrZi9CNF5rjHNoex0GgGtG3AHPuS7U8gjm+/Io1MvbuCrn6lyyIw0MDvh1Ebkw==", - "dev": true, - "dependencies": { - "@fluentui/dom-utilities": "^1.1.2", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "prop-types": "^15.7.2", - "tslib": "^1.10.0" - }, - "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" - } - }, "node_modules/abab": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", @@ -4571,12 +4618,6 @@ "integrity": "sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==", "dev": true }, - "node_modules/classnames": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", - "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==", - "dev": true - }, "node_modules/clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -10184,35 +10225,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/office-ui-fabric-react": { - "version": "7.204.0", - "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-7.204.0.tgz", - "integrity": "sha512-W1xIsYEwxPrGYojvVtGTGvSfdnUoPEm8w6hhMlW/uFr5YwIB1isG/dVk4IZxWbcbea7612u059p+jRf+RjPW0w==", - "dev": true, - "dependencies": { - "@fluentui/date-time-utilities": "^7.9.1", - "@fluentui/react-focus": "^7.18.17", - "@fluentui/react-theme-provider": "^0.19.16", - "@fluentui/react-window-provider": "^1.0.6", - "@fluentui/theme": "^1.7.13", - "@microsoft/load-themed-styles": "^1.10.26", - "@uifabric/foundation": "^7.10.16", - "@uifabric/icons": "^7.9.5", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/react-hooks": "^7.16.4", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "prop-types": "^15.7.2", - "tslib": "^1.10.0" - }, - "peerDependencies": { - "@types/react": ">=16.8.0 <18.0.0", - "@types/react-dom": ">=16.8.0 <18.0.0", - "react": ">=16.8.0 <18.0.0", - "react-dom": ">=16.8.0 <18.0.0" - } - }, "node_modules/once": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", @@ -14081,120 +14093,293 @@ "dev": true }, "@fluentui/date-time-utilities": { - "version": "7.9.1", - "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-7.9.1.tgz", - "integrity": "sha512-o8iU1VIY+QsqVRWARKiky29fh4KR1xaKSgMClXIi65qkt8EDDhjmlzL0KVDEoDA2GWukwb/1PpaVCWDg4v3cUQ==", + "version": "8.5.7", + "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-8.5.7.tgz", + "integrity": "sha512-+g6YWgI0LbsoPo03rCNRsZPP9uXlYVfCY/AdFTfAr3RiilLWIt9L21eRm0/vap/HEc4Jx+MoW8RpBg9U0i5PkA==", "dev": true, "requires": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, "@fluentui/dom-utilities": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-1.1.2.tgz", - "integrity": "sha512-XqPS7l3YoMwxdNlaYF6S2Mp0K3FmVIOIy2K3YkMc+eRxu9wFK6emr2Q/3rBhtG5u/On37NExRT7/5CTLnoi9gw==", + "version": "2.2.6", + "resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.2.6.tgz", + "integrity": "sha512-yJOEiFj/TfR307hzZn15kNocC0P3j2BltrAJznhgXywMKJhIczATFTfj2len7YMHxLttnR5yDz/oYpyBLSk4rw==", "dev": true, "requires": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, - "@fluentui/keyboard-key": { - "version": "0.2.17", - "resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.2.17.tgz", - "integrity": "sha512-iT1bU56rKrKEOfODoW6fScY11qj3iaYrZ+z11T6fo5+TDm84UGkkXjLXJTE57ZJzg0/gbccHQWYv+chY7bJN8Q==", + "@fluentui/font-icons-mdl2": { + "version": "8.5.13", + "resolved": "https://registry.npmjs.org/@fluentui/font-icons-mdl2/-/font-icons-mdl2-8.5.13.tgz", + "integrity": "sha512-3JjYN7lJZefpBdNPoQRFOiNpyVw+BOGynMkmYglnGjEWlg3uodawNi9lnKBODXCy31OHh900n9pAPFyNpdCbBg==", "dev": true, "requires": { - "tslib": "^1.10.0" + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, - "@fluentui/react": { - "version": "7.204.0", - "resolved": "https://registry.npmjs.org/@fluentui/react/-/react-7.204.0.tgz", - "integrity": "sha512-WQKHcO6cboGO0eCPsiNSzUwnMWBmAvdltu4X0tvXwb+q8W3wZzCQiU1voDVYNm4Nz/Jgiiy8jbMcesmNAq7jsw==", + "@fluentui/foundation-legacy": { + "version": "8.2.33", + "resolved": "https://registry.npmjs.org/@fluentui/foundation-legacy/-/foundation-legacy-8.2.33.tgz", + "integrity": "sha512-Z1Nl1hmyICAjTwaU2fvIGenzczRfyf0P3oaRniwac4gAa5MidE6QlpAkEcwCka2QEG/qUjcx/cMacDGLN/Dd0A==", "dev": true, "requires": { - "@uifabric/set-version": "^7.0.24", - "office-ui-fabric-react": "^7.204.0", - "tslib": "^1.10.0" + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, - "@fluentui/react-compose": { - "version": "0.19.24", - "resolved": "https://registry.npmjs.org/@fluentui/react-compose/-/react-compose-0.19.24.tgz", - "integrity": "sha512-4PO7WSIZjwBGObpknjK8d1+PhPHJGSlVSXKFHGEoBjLWVlCTMw6Xa1S4+3K6eE3TEBbe9rsqwwocMTFHjhWwtQ==", + "@fluentui/keyboard-key": { + "version": "0.4.6", + "resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.4.6.tgz", + "integrity": "sha512-p59zLGs3ucDPc7ZVaPxVCaQsfNwERDt3n+yLE0w/FFBlPWJcOSkiZHIieMhqk5ur5YGzbgs9WppPrtxNga23fw==", "dev": true, "requires": { - "@types/classnames": "^2.2.9", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "classnames": "^2.2.6", - "tslib": "^1.10.0" + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, + "@fluentui/merge-styles": { + "version": "8.5.7", + "resolved": "https://registry.npmjs.org/@fluentui/merge-styles/-/merge-styles-8.5.7.tgz", + "integrity": "sha512-t/mOQTigj51n7z6VPZ1nlb9getkzoLVhN0aUbOJUSD5qvu0gZqSBh7Y9xIP6QeYWF4q6wcZhEggo8HOgYqaWQw==", + "dev": true, + "requires": { + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, + "@fluentui/react": { + "version": "8.108.2", + "resolved": "https://registry.npmjs.org/@fluentui/react/-/react-8.108.2.tgz", + "integrity": "sha512-wVJBFZFVNzaaLByPkz36oMDexS5Poi9LKSbzQdAXJMdm7IQDiz4vvPcz5fFxZaFZeTclWZmZmdUAkg5301TiXQ==", + "dev": true, + "requires": { + "@fluentui/date-time-utilities": "^8.5.7", + "@fluentui/font-icons-mdl2": "^8.5.13", + "@fluentui/foundation-legacy": "^8.2.33", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/react-focus": "^8.8.19", + "@fluentui/react-hooks": "^8.6.20", + "@fluentui/react-portal-compat-context": "^9.0.5", + "@fluentui/react-window-provider": "^2.2.9", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/theme": "^2.6.25", + "@fluentui/utilities": "^8.13.9", + "@microsoft/load-themed-styles": "^1.10.26", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, "@fluentui/react-focus": { - "version": "7.18.17", - "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-7.18.17.tgz", - "integrity": "sha512-W+sLIhX7wLzMsJ0jhBrDAblkG3DNbRbF8UoSieRVdAAm7xVf5HpiwJ6tb6nGqcFOnpRh8y+fjyVM+dV3K6GNHA==", + "version": "8.8.19", + "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-8.8.19.tgz", + "integrity": "sha512-Gswx0aOazRVFJONmcsj5o6SI/ebWQeZyBAlOsdFeSUuK38aRlVy4DbwVQ+5tQ675u3wmf/+Ln2a0xCixOAVvWg==", "dev": true, "requires": { - "@fluentui/keyboard-key": "^0.2.12", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" + "@fluentui/keyboard-key": "^0.4.6", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/style-utilities": "^8.9.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, - "@fluentui/react-stylesheets": { - "version": "0.2.9", - "resolved": "https://registry.npmjs.org/@fluentui/react-stylesheets/-/react-stylesheets-0.2.9.tgz", - "integrity": "sha512-6GDU/cUEG/eJ4owqQXDWPmP5L1zNh2NLEDKdEzxd7cWtGnoXLeMjbs4vF4t5wYGzGaxZmUQILOvJdgCIuc9L9Q==", + "@fluentui/react-hooks": { + "version": "8.6.20", + "resolved": "https://registry.npmjs.org/@fluentui/react-hooks/-/react-hooks-8.6.20.tgz", + "integrity": "sha512-vb90tgc0nGWvahE2zuPPtEpknIfAA0ABq7/ro7+CAcKgDx2sleGZKRGdzKXdYS026OxjQ8TN2K7/D3OI1v4Rjg==", "dev": true, "requires": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "@fluentui/react-window-provider": "^2.2.9", + "@fluentui/set-version": "^8.2.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, - "@fluentui/react-theme-provider": { - "version": "0.19.16", - "resolved": "https://registry.npmjs.org/@fluentui/react-theme-provider/-/react-theme-provider-0.19.16.tgz", - "integrity": "sha512-Kf7z4ZfNLS/onaFL5eQDSlizgwy2ytn6SDyjEKV+9VhxIXdDtOh8AaMXWE7dsj1cRBfBUvuGPVnsnoaGdHxJ+A==", + "@fluentui/react-portal-compat-context": { + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/@fluentui/react-portal-compat-context/-/react-portal-compat-context-9.0.5.tgz", + "integrity": "sha512-vgGvv74jPi/salcxv37TCm06lOFn44CfNLX5wZw5HQIe9LYGUw/J7vkaniwNIzmQZsn62Y+fVxDS6Sq5S823tA==", "dev": true, "requires": { - "@fluentui/react-compose": "^0.19.24", - "@fluentui/react-stylesheets": "^0.2.9", - "@fluentui/react-window-provider": "^1.0.6", - "@fluentui/theme": "^1.7.13", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/react-hooks": "^7.16.4", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "classnames": "^2.2.6", - "tslib": "^1.10.0" + "@swc/helpers": "^0.4.14" } }, "@fluentui/react-window-provider": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-1.0.6.tgz", - "integrity": "sha512-m2HoxhU2m/yWxUauf79y+XZvrrWNx+bMi7ZiL6DjiAKHjTSa8KOyvicbOXd/3dvuVzOaNTnLDdZAvhRFcelOIA==", + "version": "2.2.9", + "resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-2.2.9.tgz", + "integrity": "sha512-BRa23ITjwUgewS9ynzCnW2bJIgaNHwhPUY0htLKcYSSv3fG7iib91B6FVC7QqmXDBTia00kqVul1TZz5G0qrlQ==", + "dev": true, + "requires": { + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, + "@fluentui/set-version": { + "version": "8.2.6", + "resolved": "https://registry.npmjs.org/@fluentui/set-version/-/set-version-8.2.6.tgz", + "integrity": "sha512-zXIfscQ1ZAiEpHc5taMrDEtTP2NtPBGlz2HbOpZiQ3aj/xcnUT7nT73ctb+Q2bHIqlDCHEaFRQxy/HG6koGYAA==", "dev": true, "requires": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, + "@fluentui/style-utilities": { + "version": "8.9.6", + "resolved": "https://registry.npmjs.org/@fluentui/style-utilities/-/style-utilities-8.9.6.tgz", + "integrity": "sha512-glhexQzJNnLws66Tb7a0WPStYVE1tRy0QWwbtOdIRXsd/3CA1FZse76itss8/yqGakPin2PElkej/jTKpaRWew==", + "dev": true, + "requires": { + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/theme": "^2.6.25", + "@fluentui/utilities": "^8.13.9", + "@microsoft/load-themed-styles": "^1.10.26", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, "@fluentui/theme": { - "version": "1.7.13", - "resolved": "https://registry.npmjs.org/@fluentui/theme/-/theme-1.7.13.tgz", - "integrity": "sha512-/1ZDHZNzV7Wgohay47DL9TAH4uuib5+B2D6Rxoc3T6ULoWcFzwLeVb+VZB/WOCTUbG+NGTrmsWPBOz5+lbuOxA==", + "version": "2.6.25", + "resolved": "https://registry.npmjs.org/@fluentui/theme/-/theme-2.6.25.tgz", + "integrity": "sha512-slp+Tk+FEDj6HtZNWzckEMPLZMYfe2bECz4hLj/aq2ok51f2ztVTM8rjjmiJjOAidcTirF/gdYVbayc/5MOKag==", + "dev": true, + "requires": { + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "@fluentui/utilities": "^8.13.9", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, + "@fluentui/utilities": { + "version": "8.13.9", + "resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.13.9.tgz", + "integrity": "sha512-8SkDFN+v3FZ2DNQtnRHnUxkY2tVQo6ojHVPWsR5WAbfKDAdlDUWxf5bM+U/8d4E4v49x4HpKY1fqsrx3hLAhyA==", "dev": true, "requires": { - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" + "@fluentui/dom-utilities": "^2.2.6", + "@fluentui/merge-styles": "^8.5.7", + "@fluentui/set-version": "^8.2.6", + "tslib": "^2.1.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } } }, "@humanwhocodes/config-array": { @@ -14974,6 +15159,23 @@ "@sinonjs/commons": "^1.7.0" } }, + "@swc/helpers": { + "version": "0.4.14", + "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.14.tgz", + "integrity": "sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==", + "dev": true, + "requires": { + "tslib": "^2.4.0" + }, + "dependencies": { + "tslib": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", + "dev": true + } + } + }, "@tootallnate/once": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", @@ -15045,15 +15247,6 @@ "@babel/types": "^7.3.0" } }, - "@types/classnames": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.3.1.tgz", - "integrity": "sha512-zeOWb0JGBoVmlQoznvqXbE0tEC/HONsnoUNH19Hc96NFsTAwTXbTqb8FMYkru1F/iqp7a18Ws3nWJvtA1sHD1A==", - "dev": true, - "requires": { - "classnames": "*" - } - }, "@types/estree": { "version": "0.0.39", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz", @@ -15409,89 +15602,6 @@ "eslint-visitor-keys": "^3.3.0" } }, - "@uifabric/foundation": { - "version": "7.10.16", - "resolved": "https://registry.npmjs.org/@uifabric/foundation/-/foundation-7.10.16.tgz", - "integrity": "sha512-x13xS9aKh6FEWsyQP2jrjyiXmUUdgyuAfWKMLhUTK4Rsc+vJANwwVk4fqGsU021WA6pghcIirvEVpWf5MlykDQ==", - "dev": true, - "requires": { - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "@uifabric/icons": { - "version": "7.9.5", - "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-7.9.5.tgz", - "integrity": "sha512-0e2fEURtR7sNqoGr9gU/pzcOp24B/Lkdc05s1BSnIgXlaL2QxRszfaEsl3/E9vsNmqA3tvRwDJWbtRolDbjCpQ==", - "dev": true, - "requires": { - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "@uifabric/merge-styles": { - "version": "7.20.2", - "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-7.20.2.tgz", - "integrity": "sha512-cJy8hW9smlWOKgz9xSDMCz/A0yMl4mdo466pcGlIOn84vz+e94grfA7OoTuTzg3Cl0Gj6ODBSf1o0ZwIXYL1Xg==", - "dev": true, - "requires": { - "@uifabric/set-version": "^7.0.24", - "tslib": "^1.10.0" - } - }, - "@uifabric/react-hooks": { - "version": "7.16.4", - "resolved": "https://registry.npmjs.org/@uifabric/react-hooks/-/react-hooks-7.16.4.tgz", - "integrity": "sha512-k8RJYTMICWA6varT5Y+oCf2VDHHXN0tC2GuPD4I2XqYCTLaXtNCm4+dMcVA2x8mv1HIO7khvm/8aqKheU/tDfQ==", - "dev": true, - "requires": { - "@fluentui/react-window-provider": "^1.0.6", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "@uifabric/set-version": { - "version": "7.0.24", - "resolved": "https://registry.npmjs.org/@uifabric/set-version/-/set-version-7.0.24.tgz", - "integrity": "sha512-t0Pt21dRqdC707/ConVJC0WvcQ/KF7tKLU8AZY7YdjgJpMHi1c0C427DB4jfUY19I92f60LOQyhJ4efH+KpFEg==", - "dev": true, - "requires": { - "tslib": "^1.10.0" - } - }, - "@uifabric/styling": { - "version": "7.25.1", - "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-7.25.1.tgz", - "integrity": "sha512-bd4QDYyb0AS0+KmzrB8VsAfOkxZg0dpEpF1YN5Ben10COmT8L1DoE4bEF5NvybHEaoTd3SKxpJ42m+ceNzehSw==", - "dev": true, - "requires": { - "@fluentui/theme": "^1.7.13", - "@microsoft/load-themed-styles": "^1.10.26", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "@uifabric/utilities": "^7.38.2", - "tslib": "^1.10.0" - } - }, - "@uifabric/utilities": { - "version": "7.38.2", - "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-7.38.2.tgz", - "integrity": "sha512-5yM4sm142VEBg3/Q5SFheBXqnrZi9CNF5rjHNoex0GgGtG3AHPuS7U8gjm+/Io1MvbuCrn6lyyIw0MDvh1Ebkw==", - "dev": true, - "requires": { - "@fluentui/dom-utilities": "^1.1.2", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/set-version": "^7.0.24", - "prop-types": "^15.7.2", - "tslib": "^1.10.0" - } - }, "abab": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", @@ -16074,12 +16184,6 @@ "integrity": "sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==", "dev": true }, - "classnames": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", - "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==", - "dev": true - }, "clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -20275,29 +20379,6 @@ "es-abstract": "^1.20.4" } }, - "office-ui-fabric-react": { - "version": "7.204.0", - "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-7.204.0.tgz", - "integrity": "sha512-W1xIsYEwxPrGYojvVtGTGvSfdnUoPEm8w6hhMlW/uFr5YwIB1isG/dVk4IZxWbcbea7612u059p+jRf+RjPW0w==", - "dev": true, - "requires": { - "@fluentui/date-time-utilities": "^7.9.1", - "@fluentui/react-focus": "^7.18.17", - "@fluentui/react-theme-provider": "^0.19.16", - "@fluentui/react-window-provider": "^1.0.6", - "@fluentui/theme": "^1.7.13", - "@microsoft/load-themed-styles": "^1.10.26", - "@uifabric/foundation": "^7.10.16", - "@uifabric/icons": "^7.9.5", - "@uifabric/merge-styles": "^7.20.2", - "@uifabric/react-hooks": "^7.16.4", - "@uifabric/set-version": "^7.0.24", - "@uifabric/styling": "^7.25.1", - "@uifabric/utilities": "^7.38.2", - "prop-types": "^15.7.2", - "tslib": "^1.10.0" - } - }, "once": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", diff --git a/packages/fluent-ui/package.json b/packages/fluent-ui/package.json index dc7cf111ba..a09357a1ce 100644 --- a/packages/fluent-ui/package.json +++ b/packages/fluent-ui/package.json @@ -29,7 +29,7 @@ "node": ">=14" }, "peerDependencies": { - "@fluentui/react": "^7.190.3", + "@fluentui/react": ">= 7", "@rjsf/core": "5.6.x", "@rjsf/utils": "5.6.x", "react": "^16.14.0 || >=17" @@ -40,7 +40,7 @@ "@babel/plugin-transform-modules-commonjs": "^7.21.2", "@babel/preset-env": "^7.21.4", "@babel/preset-react": "^7.18.6", - "@fluentui/react": "^7.204.0", + "@fluentui/react": "^8.1.0", "@rjsf/core": "^5.6.2", "@rjsf/utils": "^5.6.2", "@rjsf/validator-ajv8": "^5.6.2", diff --git a/packages/fluent-ui/src/CheckboxWidget/CheckboxWidget.tsx b/packages/fluent-ui/src/CheckboxWidget/CheckboxWidget.tsx index 37bab904d2..44aba4b679 100644 --- a/packages/fluent-ui/src/CheckboxWidget/CheckboxWidget.tsx +++ b/packages/fluent-ui/src/CheckboxWidget/CheckboxWidget.tsx @@ -1,5 +1,5 @@ import { FocusEvent, useCallback } from 'react'; -import { Checkbox } from '@fluentui/react'; +import { Checkbox, ICheckboxProps } from '@fluentui/react'; import { ariaDescribedByIds, descriptionId, @@ -13,7 +13,7 @@ import { import _pick from 'lodash/pick'; // Keys of ICheckboxProps from @fluentui/react -export const allowedProps = [ +export const allowedProps: (keyof ICheckboxProps)[] = [ 'ariaDescribedBy', 'ariaLabel', 'ariaPositionInSet', @@ -28,7 +28,8 @@ export const allowedProps = [ 'disabled', 'indeterminate', 'inputProps', - 'keytipProps', + /* Backward compatibility with fluentui v7 */ + 'keytipProps' as any, 'label', 'onChange', 'onRenderLabel', @@ -93,13 +94,21 @@ export default function CheckboxWidget< name={id} label={labelValue(label || undefined, hideLabel)} disabled={disabled || readonly} - autoFocus={autofocus} - onBlur={_onBlur} - onFocus={_onFocus} + inputProps={{ + autoFocus: autofocus, + onBlur: _onBlur, + onFocus: _onFocus, + }} checked={typeof value === 'undefined' ? false : value} onChange={_onChange} {...uiProps} aria-describedby={ariaDescribedByIds(id)} + /* Backward compatibility with fluentui v7 */ + {...{ + autoFocus: autofocus, + onBlur: _onBlur, + onFocus: _onFocus, + }} /> ); diff --git a/packages/fluent-ui/src/CheckboxesWidget/CheckboxesWidget.tsx b/packages/fluent-ui/src/CheckboxesWidget/CheckboxesWidget.tsx index c21303c30d..e52666971d 100644 --- a/packages/fluent-ui/src/CheckboxesWidget/CheckboxesWidget.tsx +++ b/packages/fluent-ui/src/CheckboxesWidget/CheckboxesWidget.tsx @@ -70,13 +70,21 @@ export default function CheckboxesWidget< checked={checked} label={option.label} disabled={disabled || itemDisabled || readonly} - autoFocus={autofocus && index === 0} + inputProps={{ + autoFocus: autofocus && index === 0, + onBlur: _onBlur, + onFocus: _onFocus, + }} onChange={_onChange(index)} - onBlur={_onBlur} - onFocus={_onFocus} key={index} {...uiProps} aria-describedby={ariaDescribedByIds(id)} + /* Backward compatibility with fluentui v7 */ + {...{ + autoFocus: autofocus && index === 0, + onBlur: _onBlur, + onFocus: _onFocus, + }} /> ); })} diff --git a/packages/fluent-ui/src/RadioWidget/RadioWidget.tsx b/packages/fluent-ui/src/RadioWidget/RadioWidget.tsx index f4c6daae10..65b387cfba 100644 --- a/packages/fluent-ui/src/RadioWidget/RadioWidget.tsx +++ b/packages/fluent-ui/src/RadioWidget/RadioWidget.tsx @@ -20,7 +20,8 @@ const allowedProps: (keyof IChoiceGroupProps)[] = [ 'selectedKey', 'onChange', 'label', - 'onChanged', + /* Backward compatibility with fluentui v7 */ + 'onChanged' as any, 'theme', 'styles', 'ariaLabelledBy', diff --git a/packages/fluent-ui/src/UpDownWidget/UpDownWidget.tsx b/packages/fluent-ui/src/UpDownWidget/UpDownWidget.tsx index 03848b072d..35507c55bc 100644 --- a/packages/fluent-ui/src/UpDownWidget/UpDownWidget.tsx +++ b/packages/fluent-ui/src/UpDownWidget/UpDownWidget.tsx @@ -1,5 +1,5 @@ -import { ChangeEvent, FocusEvent } from 'react'; -import { SpinButton } from '@fluentui/react'; +import { ChangeEvent, FocusEvent, SyntheticEvent } from 'react'; +import { ISpinButtonProps, SpinButton } from '@fluentui/react'; import { ariaDescribedByIds, FormContextType, @@ -15,7 +15,7 @@ import _pick from 'lodash/pick'; import FluentLabel from '../FluentLabel/FluentLabel'; // Keys of ISpinButtonProps from @fluentui/react -const allowedProps = [ +const allowedProps: (keyof ISpinButtonProps)[] = [ 'ariaDescribedBy', 'ariaLabel', 'ariaPositionInSet', @@ -29,7 +29,8 @@ const allowedProps = [ 'defaultValue', 'disabled', 'downArrowButtonStyles', - 'getClassNames', + /* Backward compatibility with fluentui v7 */ + 'getClassNames' as any, 'iconButtonProps', 'iconProps', 'incrementButtonAriaLabel', @@ -74,7 +75,14 @@ export default function UpDownWidget< registry, }: WidgetProps) { const { translateString } = registry; - const _onChange = ({ target: { value } }: ChangeEvent) => onChange(Number(value)); + const _onChange = (ev: ChangeEvent | SyntheticEvent, newValue?: string) => { + if (newValue) { + onChange(Number(newValue)); + } else if ('value' in ev.target) { + /* Backward compatibility with fluentui v7 */ + onChange(Number(ev.target.value)); + } + }; let { min, max, step } = rangeSpec(schema); if (min === undefined) { diff --git a/packages/fluent-ui/test/__snapshots__/Array.test.tsx.snap b/packages/fluent-ui/test/__snapshots__/Array.test.tsx.snap index 926eaf3cdd..36321f1490 100644 --- a/packages/fluent-ui/test/__snapshots__/Array.test.tsx.snap +++ b/packages/fluent-ui/test/__snapshots__/Array.test.tsx.snap @@ -22,7 +22,7 @@ exports[`array fields array 1`] = ` } >