From 3906dcc5aa2661b97e5a081aaba0d856cde07680 Mon Sep 17 00:00:00 2001 From: Bo Zhang <71688188+zhb000@users.noreply.github.com> Date: Sun, 16 Jan 2022 02:41:50 +0800 Subject: [PATCH] fluentUI (#1141) Co-authored-by: xuke444 <40614413+xuke444@users.noreply.github.com> --- apps/dashboard/src/app/App.tsx | 2 +- apps/dashboard/src/error-analysis/App.tsx | 2 +- apps/dashboard/src/fairness/App.tsx | 2 +- apps/dashboard/src/interpret/App.tsx | 2 +- apps/dashboard/src/model-assessment/App.tsx | 2 +- .../lib/Context/ModelAssessmentContext.tsx | 2 +- .../src/lib/components/AccessibleChart.tsx | 2 +- package.json | 1 + workspace.json | 10 ++ yarn.lock | 144 ++++++++++++++++++ 10 files changed, 162 insertions(+), 7 deletions(-) diff --git a/apps/dashboard/src/app/App.tsx b/apps/dashboard/src/app/App.tsx index 641c6a0fc..af0385513 100644 --- a/apps/dashboard/src/app/App.tsx +++ b/apps/dashboard/src/app/App.tsx @@ -1,10 +1,10 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import { generateRoute } from "@responsible-ai/core-ui"; import { Language } from "@responsible-ai/localization"; import _ from "lodash"; -import { ITheme } from "office-ui-fabric-react"; import React from "react"; import { Redirect, generatePath } from "react-router-dom"; diff --git a/apps/dashboard/src/error-analysis/App.tsx b/apps/dashboard/src/error-analysis/App.tsx index 2d7145249..c5ea65a05 100644 --- a/apps/dashboard/src/error-analysis/App.tsx +++ b/apps/dashboard/src/error-analysis/App.tsx @@ -1,6 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import { IErrorAnalysisMatrix, IExplanationDashboardData, @@ -13,7 +14,6 @@ import { HelpMessageDict } from "@responsible-ai/error-analysis"; import { Language } from "@responsible-ai/localization"; -import { ITheme } from "office-ui-fabric-react"; import React from "react"; import { diff --git a/apps/dashboard/src/fairness/App.tsx b/apps/dashboard/src/fairness/App.tsx index f7bcd252b..1cd6612d2 100644 --- a/apps/dashboard/src/fairness/App.tsx +++ b/apps/dashboard/src/fairness/App.tsx @@ -1,10 +1,10 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import { IFairnessData } from "@responsible-ai/core-ui"; import { FairnessWizard, IFairnessProps } from "@responsible-ai/fairness"; import { Language } from "@responsible-ai/localization"; -import { ITheme } from "office-ui-fabric-react"; import React from "react"; import { diff --git a/apps/dashboard/src/interpret/App.tsx b/apps/dashboard/src/interpret/App.tsx index 42c9c045d..921491e89 100644 --- a/apps/dashboard/src/interpret/App.tsx +++ b/apps/dashboard/src/interpret/App.tsx @@ -1,6 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import { IExplanationDashboardData, ITelemetryMessage @@ -12,7 +13,6 @@ import { HelpMessageDict } from "@responsible-ai/interpret"; import { Language } from "@responsible-ai/localization"; -import { ITheme } from "office-ui-fabric-react"; import React from "react"; interface IAppProps { diff --git a/apps/dashboard/src/model-assessment/App.tsx b/apps/dashboard/src/model-assessment/App.tsx index 877232bae..55ad6cfa2 100644 --- a/apps/dashboard/src/model-assessment/App.tsx +++ b/apps/dashboard/src/model-assessment/App.tsx @@ -1,6 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import { ICausalWhatIfData, Metrics } from "@responsible-ai/core-ui"; import { HelpMessageDict } from "@responsible-ai/error-analysis"; import { Language } from "@responsible-ai/localization"; @@ -9,7 +10,6 @@ import { IModelAssessmentDashboardProps, IModelAssessmentData } from "@responsible-ai/model-assessment"; -import { ITheme } from "office-ui-fabric-react"; import React from "react"; import { diff --git a/libs/core-ui/src/lib/Context/ModelAssessmentContext.tsx b/libs/core-ui/src/lib/Context/ModelAssessmentContext.tsx index 37cfde3b6..6549aa149 100644 --- a/libs/core-ui/src/lib/Context/ModelAssessmentContext.tsx +++ b/libs/core-ui/src/lib/Context/ModelAssessmentContext.tsx @@ -1,7 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -import { ITheme } from "office-ui-fabric-react"; +import { ITheme } from "@fluentui/react"; import React from "react"; import { Cohort } from "../Cohort/Cohort"; diff --git a/libs/mlchartlib/src/lib/components/AccessibleChart.tsx b/libs/mlchartlib/src/lib/components/AccessibleChart.tsx index 9d9b4880a..ca345bef2 100644 --- a/libs/mlchartlib/src/lib/components/AccessibleChart.tsx +++ b/libs/mlchartlib/src/lib/components/AccessibleChart.tsx @@ -1,8 +1,8 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. +import { ITheme } from "@fluentui/react"; import _ from "lodash"; -import { ITheme } from "office-ui-fabric-react"; import Plotly from "plotly.js"; import React from "react"; import Plot from "react-plotly.js"; diff --git a/package.json b/package.json index 810b0a63f..0d9cdbaff 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "workspace-generator": "nx workspace-generator" }, "dependencies": { + "@fluentui/react": "8.13.1", "d3-array": "^2.8.0", "d3-color": "^2.0.0", "d3-hierarchy": "^2.0.0", diff --git a/workspace.json b/workspace.json index f537db014..0f43a9d76 100644 --- a/workspace.json +++ b/workspace.json @@ -35,6 +35,7 @@ "project": "libs/causality/package.json", "entryFile": "libs/causality/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -103,6 +104,7 @@ "project": "libs/core-ui/package.json", "entryFile": "libs/core-ui/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -171,6 +173,7 @@ "project": "libs/counterfactuals/package.json", "entryFile": "libs/counterfactuals/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -366,6 +369,7 @@ "project": "libs/dataset-explorer/package.json", "entryFile": "libs/dataset-explorer/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -434,6 +438,7 @@ "project": "libs/error-analysis/package.json", "entryFile": "libs/error-analysis/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -502,6 +507,7 @@ "project": "libs/fairness/package.json", "entryFile": "libs/fairness/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -570,6 +576,7 @@ "project": "libs/interpret/package.json", "entryFile": "libs/interpret/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -634,6 +641,7 @@ "project": "libs/localization/package.json", "entryFile": "libs/localization/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -702,6 +710,7 @@ "project": "libs/mlchartlib/package.json", "entryFile": "libs/mlchartlib/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", @@ -770,6 +779,7 @@ "project": "libs/model-assessment/package.json", "entryFile": "libs/model-assessment/src/index.ts", "external": [ + "@fluentui/react", "jmespath", "localized-strings", "lodash", diff --git a/yarn.lock b/yarn.lock index af8787291..c5b30b10b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2723,6 +2723,14 @@ minimatch "^3.0.4" strip-json-comments "^3.1.1" +"@fluentui/date-time-utilities@^8.0.3": + version "8.2.3" + resolved "https://registry.yarnpkg.com/@fluentui/date-time-utilities/-/date-time-utilities-8.2.3.tgz#99c304aea46f5278d4f799652eba0cc97801f4d0" + integrity sha512-lbXaKXpeWymzGk3YNwT3hUPfUSnYO3x6wS2Rj3ySzDY6OkMLOBBV6UVa2uRVRXCio5GcJyMo9Wtgv77gmHl2fQ== + dependencies: + "@fluentui/set-version" "^8.1.5" + tslib "^2.1.0" + "@fluentui/dom-utilities@^1.1.1": version "1.1.1" resolved "https://registry.yarnpkg.com/@fluentui/dom-utilities/-/dom-utilities-1.1.1.tgz#b0bbab665fe726f245800bb9e7883b1ceb54248b" @@ -2731,6 +2739,34 @@ "@uifabric/set-version" "^7.0.23" tslib "^1.10.0" +"@fluentui/dom-utilities@^2.1.5": + version "2.1.5" + resolved "https://registry.yarnpkg.com/@fluentui/dom-utilities/-/dom-utilities-2.1.5.tgz#21ba77c8bfe64d15ffc16a8e055255bbb23600b2" + integrity sha512-OLDYV5ZGIiK/JXx/DFFib4vSa7PELvznbdAujDcX2wjt3V3Lt2N5ucv59JsVxk5LlwXjasUHJI2NZadagmnM6A== + dependencies: + "@fluentui/set-version" "^8.1.5" + tslib "^2.1.0" + +"@fluentui/font-icons-mdl2@^8.0.5": + version "8.1.20" + resolved "https://registry.yarnpkg.com/@fluentui/font-icons-mdl2/-/font-icons-mdl2-8.1.20.tgz#520a65e6f0d37a6c7d27b40219aa704302f673c6" + integrity sha512-6zUz2IVBQIq+nGa8C9BmdwqUKc4twTEZ0/+3SY0E08SXo7u3yhuQG8R3q2J8TXgMC7uw4EYSHvP518h764uPgg== + dependencies: + "@fluentui/set-version" "^8.1.5" + "@fluentui/style-utilities" "^8.5.2" + tslib "^2.1.0" + +"@fluentui/foundation-legacy@^8.0.5": + version "8.1.19" + resolved "https://registry.yarnpkg.com/@fluentui/foundation-legacy/-/foundation-legacy-8.1.19.tgz#8e0645f9950edeef1b7b5b121ac53f7e873daef7" + integrity sha512-9ha1BIAU2tqHBKsKLKy9M0J0jP2fR4t4M4ZlE7wYGs5+eAWJgigmkoRZJY3YnCUNS6wR3HzRX89fwzMmOnUMUw== + dependencies: + "@fluentui/merge-styles" "^8.2.3" + "@fluentui/set-version" "^8.1.5" + "@fluentui/style-utilities" "^8.5.2" + "@fluentui/utilities" "^8.3.9" + tslib "^2.1.0" + "@fluentui/keyboard-key@^0.2.12": version "0.2.12" resolved "https://registry.yarnpkg.com/@fluentui/keyboard-key/-/keyboard-key-0.2.12.tgz#74eddf4657c164193b6c8855746e691af466441a" @@ -2738,6 +2774,21 @@ dependencies: tslib "^1.10.0" +"@fluentui/keyboard-key@^0.3.5": + version "0.3.5" + resolved "https://registry.yarnpkg.com/@fluentui/keyboard-key/-/keyboard-key-0.3.5.tgz#af1273bbd8db3e7e08bf8ce8a303890d33d4d8b2" + integrity sha512-qPNPnRtkC92b8Zjx3mJ6+vRX+pdmbDYcXP8zXb2NJ/briAQXYmyqdjJLUl2riVBcAC4H3cL6dTKLR9VAyqhdYQ== + dependencies: + tslib "^2.1.0" + +"@fluentui/merge-styles@^8.0.4", "@fluentui/merge-styles@^8.2.3": + version "8.2.3" + resolved "https://registry.yarnpkg.com/@fluentui/merge-styles/-/merge-styles-8.2.3.tgz#3cd596fc0d83d3f23edcd57d69a50b6e18e4ffa3" + integrity sha512-kwjY56C0ACMkYUikOX6krIwfuEworq6+A7V4zE1w8jRc7RSYHQfyfavu6ptNVgPPR/Bmho3AgriyhnnoFq+6fQ== + dependencies: + "@fluentui/set-version" "^8.1.5" + tslib "^2.1.0" + "@fluentui/react-focus@^7.12.4": version "7.16.10" resolved "https://registry.yarnpkg.com/@fluentui/react-focus/-/react-focus-7.16.10.tgz#e82e0719f48877bfc7220d359db4859c4d10b99d" @@ -2750,6 +2801,28 @@ "@uifabric/utilities" "^7.32.4" tslib "^1.10.0" +"@fluentui/react-focus@^8.0.8": + version "8.3.15" + resolved "https://registry.yarnpkg.com/@fluentui/react-focus/-/react-focus-8.3.15.tgz#8d7937915e10db439db60af9021472db6b5ada2f" + integrity sha512-ELIQbGUAbA4vNGSKNAiwr7Dfh18Ksrg/vPyhntnVIFDEnbLTvpj+AUu12CK2/jFEf3MxRM51PV53FCcKaYF16g== + dependencies: + "@fluentui/keyboard-key" "^0.3.5" + "@fluentui/merge-styles" "^8.2.3" + "@fluentui/set-version" "^8.1.5" + "@fluentui/style-utilities" "^8.5.2" + "@fluentui/utilities" "^8.3.9" + tslib "^2.1.0" + +"@fluentui/react-hooks@^8.1.3": + version "8.3.9" + resolved "https://registry.yarnpkg.com/@fluentui/react-hooks/-/react-hooks-8.3.9.tgz#a9a92acce10b07f5f8dd7e35a6d8ce5f3dfff67b" + integrity sha512-slgQubShYrzVaelzBkvPVJy0EY+WJeJUqLAu9f9AX22sOi/odid1PuEi3ZuX7d+lLiGUQR0HaEbvo+jEf6HNeQ== + dependencies: + "@fluentui/react-window-provider" "^2.1.6" + "@fluentui/set-version" "^8.1.5" + "@fluentui/utilities" "^8.3.9" + tslib "^2.1.0" + "@fluentui/react-icons@^0.1.23": version "0.1.48" resolved "https://registry.yarnpkg.com/@fluentui/react-icons/-/react-icons-0.1.48.tgz#3ee77fe1c9cab39960d8daeab8f5de236f536bf9" @@ -2768,6 +2841,52 @@ "@uifabric/set-version" "^7.0.23" tslib "^1.10.0" +"@fluentui/react-window-provider@^2.0.3", "@fluentui/react-window-provider@^2.1.6": + version "2.1.6" + resolved "https://registry.yarnpkg.com/@fluentui/react-window-provider/-/react-window-provider-2.1.6.tgz#1e3d66842a6b1c724dcc3ee13d2bc0aa0d7028a8" + integrity sha512-Fr1THmtn/Kx95/WVXI1qIELX2VHpuGYVKWSpdgbpcmKukvk30h4JG6kKMGYPz3r7UeaTzpaeIw537A9CJ2hVMg== + dependencies: + "@fluentui/set-version" "^8.1.5" + tslib "^2.1.0" + +"@fluentui/react@8.13.1": + version "8.13.1" + resolved "https://registry.yarnpkg.com/@fluentui/react/-/react-8.13.1.tgz#866e59cf3ff8f890dc2d258b7ecc7d4f2678d5cf" + integrity sha512-spUejSL7pOMWLL6HsreNtB6jCGEIQg+qw9K7jXbDnHkQLP0ZD6fBiAtOhZZyk7/xO33yAoUiq+ZB3UehB8aT7A== + dependencies: + "@fluentui/date-time-utilities" "^8.0.3" + "@fluentui/font-icons-mdl2" "^8.0.5" + "@fluentui/foundation-legacy" "^8.0.5" + "@fluentui/merge-styles" "^8.0.4" + "@fluentui/react-focus" "^8.0.8" + "@fluentui/react-hooks" "^8.1.3" + "@fluentui/react-window-provider" "^2.0.3" + "@fluentui/set-version" "^8.0.3" + "@fluentui/style-utilities" "^8.0.5" + "@fluentui/theme" "^2.0.5" + "@fluentui/utilities" "^8.0.5" + "@microsoft/load-themed-styles" "^1.10.26" + tslib "^1.10.0" + +"@fluentui/set-version@^8.0.3", "@fluentui/set-version@^8.1.5": + version "8.1.5" + resolved "https://registry.yarnpkg.com/@fluentui/set-version/-/set-version-8.1.5.tgz#68d3d8c7fbefba20b3d1aef71fcc730ca46dd353" + integrity sha512-AfaycaduWd/aErqEmrAUWpr2gpZrkaSe6D9noXhtVH3JlreRuFM78Ji1oE4f8cpWxSA/K5qb7BT6x4z4I2Bs+A== + dependencies: + tslib "^2.1.0" + +"@fluentui/style-utilities@^8.0.5", "@fluentui/style-utilities@^8.5.2": + version "8.5.2" + resolved "https://registry.yarnpkg.com/@fluentui/style-utilities/-/style-utilities-8.5.2.tgz#58752f92f8f34939edd9815070ce03ce81b72585" + integrity sha512-81+x1QyiVVx0ASqyeaIdXn9g7/he+k09Y0+G4NWczt4c8uuaz4rSOwuK2pdNGY16N0IZid3nMe9EqFvbLq+U/A== + dependencies: + "@fluentui/merge-styles" "^8.2.3" + "@fluentui/set-version" "^8.1.5" + "@fluentui/theme" "^2.4.6" + "@fluentui/utilities" "^8.3.9" + "@microsoft/load-themed-styles" "^1.10.26" + tslib "^2.1.0" + "@fluentui/theme@^1.3.0": version "1.3.0" resolved "https://registry.yarnpkg.com/@fluentui/theme/-/theme-1.3.0.tgz#15a65c6ff20c11a1a7550919b1a71b9c922e9255" @@ -2778,6 +2897,26 @@ "@uifabric/utilities" "^7.32.4" tslib "^1.10.0" +"@fluentui/theme@^2.0.5", "@fluentui/theme@^2.4.6": + version "2.4.6" + resolved "https://registry.yarnpkg.com/@fluentui/theme/-/theme-2.4.6.tgz#8ce1fd86ce5b2c34c43ead63ff2d12bc75d569b6" + integrity sha512-Qlxl/k31+WbjgUIJDfF5JVZfnQmEmNOmtMpYU+r4L2k/RD1eskNG3BaB+vGW9bnLw7u/7+6I79PyoSyTE8I+TA== + dependencies: + "@fluentui/merge-styles" "^8.2.3" + "@fluentui/set-version" "^8.1.5" + "@fluentui/utilities" "^8.3.9" + tslib "^2.1.0" + +"@fluentui/utilities@^8.0.5", "@fluentui/utilities@^8.3.9": + version "8.3.9" + resolved "https://registry.yarnpkg.com/@fluentui/utilities/-/utilities-8.3.9.tgz#d5dad90b03b26a947c066800a2db18ba7d3f9c65" + integrity sha512-UNz/5RjEmCtllzpCXEUkK/ScxjYkEG5tHIdUqxe+vg70UL92qlcSLo7E2NKuCuD7HM3z/tVbbE18ZEKJM6AOFg== + dependencies: + "@fluentui/dom-utilities" "^2.1.5" + "@fluentui/merge-styles" "^8.2.3" + "@fluentui/set-version" "^8.1.5" + tslib "^2.1.0" + "@istanbuljs/load-nyc-config@^1.0.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz#fd3db1d59ecf7cf121e80650bb86712f9b55eced" @@ -17527,6 +17666,11 @@ tslib@^2.0.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.3.tgz#8e0741ac45fc0c226e58a17bfc3e64b9bc6ca61c" integrity sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ== +tslib@^2.1.0: + version "2.3.1" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01" + integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw== + tslib@^2.2.0: version "2.2.0" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.2.0.tgz#fb2c475977e35e241311ede2693cee1ec6698f5c"