Upgrade Fluent UI v8 (#688)

Co-authored-by: Steve Faulkner <southpolesteve@gmail.com>
This commit is contained in:
Hardikkumar Nai
2021-05-06 04:56:03 +05:30
committed by GitHub
parent bd47e5ed49
commit 23223cfb23
126 changed files with 5586 additions and 5870 deletions
+1 -1
View File
@@ -69,8 +69,8 @@ module.exports = {
moduleNameMapper: {
"^.*[.](svg|png|gif|less|css)$": "<rootDir>/mockModule",
"@nteract/stateful-components/(.*)$": "<rootDir>/mockModule",
"@fluentui/react/lib/(.*)$": "@fluentui/react/lib-commonjs/$1", // https://github.com/microsoft/fluentui/wiki/Version-8-release-notes
"monaco-editor/(.*)$": "<rootDir>/__mocks__/monaco-editor",
"office-ui-fabric-react/lib/(.*)$": "office-ui-fabric-react/lib-commonjs/$1", // https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-6-Release-Notes
"^dnd-core$": "dnd-core/dist/cjs",
"^react-dnd$": "react-dnd/dist/cjs",
"^react-dnd-html5-backend$": "react-dnd-html5-backend/dist/cjs",
+273 -77
View File
@@ -2127,6 +2127,28 @@
"tslib": "^1.10.0"
}
},
"@fluentui/font-icons-mdl2": {
"version": "8.0.5",
"resolved": "https://registry.npmjs.org/@fluentui/font-icons-mdl2/-/font-icons-mdl2-8.0.5.tgz",
"integrity": "sha512-/2Qx/LCZH+rupbhzZ+WKCrw2XK3J2wj3pjMPLTLj/6rnmouA7yywFDiHIAseQXPhY34nzRVX4x3zEjz3RMWvmA==",
"requires": {
"@fluentui/set-version": "^8.0.3",
"@fluentui/style-utilities": "^8.0.5",
"tslib": "^1.10.0"
}
},
"@fluentui/foundation-legacy": {
"version": "8.0.5",
"resolved": "https://registry.npmjs.org/@fluentui/foundation-legacy/-/foundation-legacy-8.0.5.tgz",
"integrity": "sha512-bHODfopWfT4HfBvXFCyfKxi7/BrIVgKUvQ4X3L2GXUZv6jjQMvLPWZ1u8n2tdp91ch1KSWnBXklGaK/nyK1M5w==",
"requires": {
"@fluentui/merge-styles": "^8.0.4",
"@fluentui/set-version": "^8.0.3",
"@fluentui/style-utilities": "^8.0.5",
"@fluentui/utilities": "^8.0.5",
"tslib": "^1.10.0"
}
},
"@fluentui/keyboard-key": {
"version": "0.2.17",
"resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.2.17.tgz",
@@ -2135,13 +2157,259 @@
"tslib": "^1.10.0"
}
},
"@fluentui/react-window-provider": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-1.0.2.tgz",
"integrity": "sha512-fGSgL3Vp/+6t1Ysfz21FWZmqsU+iFVxOigvHnm5uKVyyRPwtaabv/F6kQ2y5isLMI2YmJaUd2i0cDJKu8ggrvw==",
"@fluentui/merge-styles": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/merge-styles/-/merge-styles-8.1.0.tgz",
"integrity": "sha512-afJ8rw1V3sfgzfufP7ockcP5AxiQN7VlqKo6JoCSZbWC2ypQ0DZre7d3k+Zj2LvjCrM8HM57YEfwXWT/WxGfqw==",
"requires": {
"@uifabric/set-version": "^7.0.24",
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
},
"dependencies": {
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/react": {
"version": "8.10.1",
"resolved": "https://registry.npmjs.org/@fluentui/react/-/react-8.10.1.tgz",
"integrity": "sha512-J6wCfkkCzJ2Z9K6KVCrshpDDnhh5smKEGChsxMkLRoXYeAlVUMiS9lLg93PW+AbY4NfG+tNO2Ug8itNKpUmlYw==",
"requires": {
"@fluentui/date-time-utilities": "^8.0.2",
"@fluentui/font-icons-mdl2": "^8.0.4",
"@fluentui/foundation-legacy": "^8.0.4",
"@fluentui/merge-styles": "^8.0.3",
"@fluentui/react-focus": "^8.0.7",
"@fluentui/react-hooks": "^8.1.2",
"@fluentui/react-window-provider": "^2.0.2",
"@fluentui/set-version": "^8.0.2",
"@fluentui/style-utilities": "^8.0.4",
"@fluentui/theme": "^2.0.4",
"@fluentui/utilities": "^8.0.4",
"@microsoft/load-themed-styles": "^1.10.26",
"tslib": "^1.10.0"
},
"dependencies": {
"@fluentui/date-time-utilities": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-8.1.0.tgz",
"integrity": "sha512-1PSp/ufi5urnvxkbT9Lijsh7Y2PNEsZfpNXDVwOpPDqpRkRrd8Wr8IdRPQk7w6XLZIeDCiWIBXBRYCVp6KGbYg==",
"requires": {
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
},
"dependencies": {
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/react-window-provider": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-2.1.0.tgz",
"integrity": "sha512-LcNni1utHiXiCu8EbXL42o118yNRAWKX15qKd0iyMqcUg5RplOdWuaniohXv2gsmdNB0l3F5Tnujgayy0xPlvQ==",
"requires": {
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
},
"dependencies": {
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
}
}
},
"@fluentui/react-focus": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-8.1.0.tgz",
"integrity": "sha512-yzfDnDrnHq5z4Nt1xY7LS+DtjbJmCdpDiTiQm8tnCj98qESzqqqAwjpSc+HFXVexBzlmPNf1hzc8BMCQOUF/7g==",
"requires": {
"@fluentui/keyboard-key": "^0.3.0",
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"@fluentui/style-utilities": "^8.1.0",
"@fluentui/utilities": "^8.1.0",
"tslib": "^2.1.0"
},
"dependencies": {
"@fluentui/dom-utilities": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.1.0.tgz",
"integrity": "sha512-DMr0uH4EtyXgdpVLyvWq60YtWN38jx22rtdsEIbbBNYcFgcl3rRa7M8p/rnaw/k/KWX35H40AYga1SM6Zgpyww==",
"requires": {
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"@fluentui/keyboard-key": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/@fluentui/keyboard-key/-/keyboard-key-0.3.0.tgz",
"integrity": "sha512-5GZ9038lwNK5BcgFkbXJs6zpZUlmyrszWbKPMqcHysMFBbL569VwV7zQt/yF3ivL0L4k46C+uXHbnFbMgZEJ4w==",
"requires": {
"tslib": "^2.1.0"
}
},
"@fluentui/utilities": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.1.0.tgz",
"integrity": "sha512-/yHnDkrIlyn/Jy3XWccNRyuujQDgUxz44OQDEiMSko50S/L7cVeWdIzG/CiIsCnKAgU4/QyzRo40Wdy3rdM8ag==",
"requires": {
"@fluentui/dom-utilities": "^2.1.0",
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/react-hooks": {
"version": "8.1.3",
"resolved": "https://registry.npmjs.org/@fluentui/react-hooks/-/react-hooks-8.1.3.tgz",
"integrity": "sha512-6iWYjfqXvEhHZoY4nmN6APoIdxwNxzVxXOJgq1Oo1nbR10E7Va7mz41gvlFAgg8OmH7mGpdSztlVj6TVl/TY2g==",
"requires": {
"@fluentui/react-window-provider": "^2.0.3",
"@fluentui/set-version": "^8.0.3",
"@fluentui/utilities": "^8.0.5",
"tslib": "^1.10.0"
},
"dependencies": {
"@fluentui/react-window-provider": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@fluentui/react-window-provider/-/react-window-provider-2.0.3.tgz",
"integrity": "sha512-eefkmzLJbYjVHtEtGbOwReyeYG+2bDefxdmvPRSVFlcRFCnasTvshuZj3xkaKSu5fsGzGw+f+ab3hDgLSETvbg==",
"requires": {
"@fluentui/set-version": "^8.0.3",
"tslib": "^1.10.0"
}
}
}
},
"@fluentui/set-version": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/set-version/-/set-version-8.1.0.tgz",
"integrity": "sha512-FhruPyh+VoAVmqAadRxawMNB13syBLoT6PePdZ+sKW7rZVc2CWT3qw7w9O9x6MJeRNl6/6ZnjCo6sWyOyVEdNg==",
"requires": {
"tslib": "^2.1.0"
},
"dependencies": {
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/style-utilities": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/style-utilities/-/style-utilities-8.1.0.tgz",
"integrity": "sha512-XUH+8T7/2HAMYzTLr20odD5lfKy56fJooFlkSmW0SSC6sOilHmrdPZCBSTV+WJzH/YY2ed/GnySIjCQOx5UsYg==",
"requires": {
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"@fluentui/theme": "^2.1.0",
"@fluentui/utilities": "^8.1.0",
"@microsoft/load-themed-styles": "^1.10.26",
"tslib": "^2.1.0"
},
"dependencies": {
"@fluentui/dom-utilities": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.1.0.tgz",
"integrity": "sha512-DMr0uH4EtyXgdpVLyvWq60YtWN38jx22rtdsEIbbBNYcFgcl3rRa7M8p/rnaw/k/KWX35H40AYga1SM6Zgpyww==",
"requires": {
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"@fluentui/utilities": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.1.0.tgz",
"integrity": "sha512-/yHnDkrIlyn/Jy3XWccNRyuujQDgUxz44OQDEiMSko50S/L7cVeWdIzG/CiIsCnKAgU4/QyzRo40Wdy3rdM8ag==",
"requires": {
"@fluentui/dom-utilities": "^2.1.0",
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/theme": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/theme/-/theme-2.1.0.tgz",
"integrity": "sha512-2jFun5LqUZJb+AiWeLOnNQTxrKWMCNHFTs4+QIUyL7ZPMAiNZyWMsQJfeGOujzdlReivZ7kONNQEi0LTJ0Tmzw==",
"requires": {
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"@fluentui/utilities": "^8.1.0",
"tslib": "^2.1.0"
},
"dependencies": {
"@fluentui/dom-utilities": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.1.0.tgz",
"integrity": "sha512-DMr0uH4EtyXgdpVLyvWq60YtWN38jx22rtdsEIbbBNYcFgcl3rRa7M8p/rnaw/k/KWX35H40AYga1SM6Zgpyww==",
"requires": {
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"@fluentui/utilities": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.1.0.tgz",
"integrity": "sha512-/yHnDkrIlyn/Jy3XWccNRyuujQDgUxz44OQDEiMSko50S/L7cVeWdIzG/CiIsCnKAgU4/QyzRo40Wdy3rdM8ag==",
"requires": {
"@fluentui/dom-utilities": "^2.1.0",
"@fluentui/merge-styles": "^8.1.0",
"@fluentui/set-version": "^8.1.0",
"tslib": "^2.1.0"
}
},
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"@fluentui/utilities": {
"version": "8.0.5",
"resolved": "https://registry.npmjs.org/@fluentui/utilities/-/utilities-8.0.5.tgz",
"integrity": "sha512-epqvqV4YjKcbgShLhDk/y2Xa+6sUTBXry/BrMPNVwNOqdj2HCf4eCY+a1emFnytMpIVysfYZ6glIx9MNQ8JgNg==",
"requires": {
"@fluentui/dom-utilities": "^2.0.3",
"@fluentui/merge-styles": "^8.0.4",
"@fluentui/set-version": "^8.0.3",
"tslib": "^1.10.0"
},
"dependencies": {
"@fluentui/dom-utilities": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@fluentui/dom-utilities/-/dom-utilities-2.0.3.tgz",
"integrity": "sha512-RaUoEYd12TeEjvKLBtfXDZmjreaV6qIfBB7G+QCuBpv5FF7TjhrGK3WDZ7oaG0dkdegAx+ecyUFyOfoBRPJLkg==",
"requires": {
"@fluentui/set-version": "^8.0.3",
"tslib": "^1.10.0"
}
}
}
},
"@hapi/formula": {
@@ -6105,17 +6373,6 @@
}
}
},
"@uifabric/react-hooks": {
"version": "7.14.0",
"resolved": "https://registry.npmjs.org/@uifabric/react-hooks/-/react-hooks-7.14.0.tgz",
"integrity": "sha512-Ndu/DEKHF4gFXEZa2AGgSkdWaj+njVrsSyXbkWRh2UZReFWnH1LMko9p/ZCwk1i9kAd5CUmyIfURUzIEya9YCg==",
"requires": {
"@fluentui/react-window-provider": "^1.0.2",
"@uifabric/set-version": "^7.0.24",
"@uifabric/utilities": "^7.33.5",
"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",
@@ -6124,55 +6381,6 @@
"tslib": "^1.10.0"
}
},
"@uifabric/styling": {
"version": "7.13.7",
"resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-7.13.7.tgz",
"integrity": "sha512-XFaDkvQqhhHwlW9+Yd9LQogPq0a5TC4on2csRnJUwmlTJ4IQtgvbPdAxmxz+18HZMJezUXYn7/ubcQvNRMFSJQ==",
"requires": {
"@microsoft/load-themed-styles": "^1.10.26",
"@uifabric/merge-styles": "^7.16.0",
"@uifabric/set-version": "^7.0.15",
"@uifabric/utilities": "^7.23.0",
"tslib": "^1.10.0"
},
"dependencies": {
"@types/react": {
"version": "16.14.5",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.5.tgz",
"integrity": "sha512-YRRv9DNZhaVTVRh9Wmmit7Y0UFhEVqXqCSw3uazRWMxa2x85hWQZ5BN24i7GXZbaclaLXEcodEeIHsjBA8eAMw==",
"requires": {
"@types/prop-types": "*",
"@types/scheduler": "*",
"csstype": "^3.0.2"
}
},
"@types/react-dom": {
"version": "16.9.12",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.9.12.tgz",
"integrity": "sha512-i7NPZZpPte3jtVOoW+eLB7G/jsX5OM6GqQnH+lC0nq0rqwlK0x8WcMEvYDgFWqWhWMlTltTimzdMax6wYfZssA==",
"requires": {
"@types/react": "^16"
}
},
"@uifabric/utilities": {
"version": "7.33.5",
"resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-7.33.5.tgz",
"integrity": "sha512-I+Oi0deD/xltSluFY8l2EVd/J4mvOaMljxKO2knSD9/KoGDlo/o5GN4gbnVo8nIt76HWHLAk3KtlJKJm6BhbIQ==",
"requires": {
"@fluentui/dom-utilities": "^1.1.2",
"@uifabric/merge-styles": "^7.19.2",
"@uifabric/set-version": "^7.0.24",
"prop-types": "^15.7.2",
"tslib": "^1.10.0"
}
},
"csstype": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.8.tgz",
"integrity": "sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw=="
}
}
},
"@uifabric/theme-samples": {
"version": "7.2.34",
"resolved": "https://registry.npmjs.org/@uifabric/theme-samples/-/theme-samples-7.2.34.tgz",
@@ -6311,18 +6519,6 @@
}
}
},
"@uifabric/utilities": {
"version": "7.33.5",
"resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-7.33.5.tgz",
"integrity": "sha512-I+Oi0deD/xltSluFY8l2EVd/J4mvOaMljxKO2knSD9/KoGDlo/o5GN4gbnVo8nIt76HWHLAk3KtlJKJm6BhbIQ==",
"requires": {
"@fluentui/dom-utilities": "^1.1.2",
"@uifabric/merge-styles": "^7.19.2",
"@uifabric/set-version": "^7.0.24",
"prop-types": "^15.7.2",
"tslib": "^1.10.0"
}
},
"@uifabric/variants": {
"version": "7.2.35",
"resolved": "https://registry.npmjs.org/@uifabric/variants/-/variants-7.2.35.tgz",
+1 -3
View File
@@ -11,6 +11,7 @@
"@azure/ms-rest-nodeauth": "3.0.7",
"@babel/plugin-proposal-class-properties": "7.12.1",
"@babel/plugin-proposal-decorators": "7.12.12",
"@fluentui/react": "8.10.1",
"@jupyterlab/services": "6.0.2",
"@jupyterlab/terminal": "3.0.3",
"@microsoft/applicationinsights-web": "2.6.1",
@@ -43,8 +44,6 @@
"@types/mkdirp": "1.0.1",
"@types/node-fetch": "2.5.7",
"@uifabric/react-cards": "0.109.110",
"@uifabric/react-hooks": "7.14.0",
"@uifabric/styling": "7.13.7",
"applicationinsights": "1.8.0",
"bootstrap": "3.4.1",
"canvas": "file:./canvas",
@@ -77,7 +76,6 @@
"monaco-editor": "0.18.1",
"ms": "2.1.3",
"msal": "1.4.4",
"office-ui-fabric-react": "7.164.2",
"p-retry": "4.2.0",
"plotly.js-cartesian-dist-min": "1.52.3",
"post-robot": "10.0.42",
+1 -1
View File
@@ -1,4 +1,4 @@
import { DatePicker, TextField } from "office-ui-fabric-react";
import { DatePicker, TextField } from "@fluentui/react";
import React, { FunctionComponent } from "react";
export interface TableEntityProps {
+1 -1
View File
@@ -8,7 +8,7 @@ import {
Stack,
TextField,
TooltipHost,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import React, { FunctionComponent } from "react";
import DeleteIcon from "../../images/delete.svg";
import EditIcon from "../../images/Edit_entity.svg";
+2 -2
View File
@@ -1,5 +1,5 @@
import { useId } from "@uifabric/react-hooks";
import { ITooltipHostStyles, TooltipHost } from "office-ui-fabric-react/lib/Tooltip";
import { ITooltipHostStyles, TooltipHost } from "@fluentui/react";
import { useId } from "@fluentui/react-hooks";
import * as React from "react";
import InfoBubble from "../../../images/info-bubble.svg";
+1 -1
View File
@@ -1,4 +1,4 @@
import { Image, Stack, TextField } from "office-ui-fabric-react";
import { Image, Stack, TextField } from "@fluentui/react";
import React, { ChangeEvent, FunctionComponent, KeyboardEvent, useRef, useState } from "react";
import FolderIcon from "../../../images/folder_16x16.svg";
import * as Constants from "../Constants";
@@ -1,9 +1,8 @@
import { DefaultButton, IButtonStyles, IContextualMenuItem, IContextualMenuProps } from "@fluentui/react";
import * as React from "react";
import { ArcadiaWorkspace, SparkPool } from "../../../Contracts/DataModels";
import { DefaultButton, IButtonStyles } from "office-ui-fabric-react/lib/Button";
import { IContextualMenuItem, IContextualMenuProps } from "office-ui-fabric-react/lib/ContextualMenu";
import * as Logger from "../../../Common/Logger";
import { getErrorMessage } from "../../../Common/ErrorHandlingUtils";
import * as Logger from "../../../Common/Logger";
import { ArcadiaWorkspace, SparkPool } from "../../../Contracts/DataModels";
export interface ArcadiaMenuPickerProps {
selectText?: string;
@@ -1,4 +1,4 @@
import { Icon, Label, Stack } from "office-ui-fabric-react";
import { Icon, Label, Stack } from "@fluentui/react";
import * as React from "react";
import { accordionStackTokens } from "../Settings/SettingsRenderUtils";
+11 -5
View File
@@ -1,14 +1,20 @@
import {
ChoiceGroup,
DefaultButton,
Dialog as FluentDialog,
DialogFooter,
DialogType,
FontIcon,
IButtonProps,
IChoiceGroupProps,
IDialogProps,
IProgressIndicatorProps,
ITextFieldProps,
Link,
PrimaryButton,
ProgressIndicator,
} from "office-ui-fabric-react";
import { DefaultButton, IButtonProps, PrimaryButton } from "office-ui-fabric-react/lib/Button";
import { Dialog as FluentDialog, DialogFooter, DialogType, IDialogProps } from "office-ui-fabric-react/lib/Dialog";
import { Link } from "office-ui-fabric-react/lib/Link";
import { ITextFieldProps, TextField } from "office-ui-fabric-react/lib/TextField";
TextField,
} from "@fluentui/react";
import React, { FunctionComponent } from "react";
export interface TextFieldProps extends ITextFieldProps {
@@ -2,9 +2,9 @@
* React component for Switch Directory
*/
import _ from "underscore";
import { Dropdown, IDropdownOption, IDropdownProps } from "@fluentui/react";
import * as React from "react";
import { Dropdown, IDropdownOption, IDropdownProps } from "office-ui-fabric-react/lib/Dropdown";
import _ from "underscore";
import { Tenant } from "../../../Contracts/DataModels";
export interface DefaultDirectoryDropdownProps {
@@ -1,11 +1,15 @@
import _ from "underscore";
import {
DefaultButton,
IButtonProps,
ITextFieldProps,
List,
ScrollablePane,
Sticky,
StickyPositionType,
TextField,
} from "@fluentui/react";
import * as React from "react";
import { DefaultButton, IButtonProps } from "office-ui-fabric-react/lib/Button";
import { List } from "office-ui-fabric-react/lib/List";
import { ScrollablePane } from "office-ui-fabric-react/lib/ScrollablePane";
import { Sticky, StickyPositionType } from "office-ui-fabric-react/lib/Sticky";
import { TextField, ITextFieldProps } from "office-ui-fabric-react/lib/TextField";
import _ from "underscore";
import { Tenant } from "../../../Contracts/DataModels";
export interface DirectoryListProps {
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`test render renders with directories and default 1`] = `
<StyledWithResponsiveMode
<Dropdown
className="defaultDirectoryDropdown"
defaultSelectedKey="asdfghjklzxcvbnm9876543210"
label="Set your default directory"
@@ -26,7 +26,7 @@ exports[`test render renders with directories and default 1`] = `
`;
exports[`test render renders with directories and last visit default 1`] = `
<StyledWithResponsiveMode
<Dropdown
className="defaultDirectoryDropdown"
defaultSelectedKey="lastVisited"
label="Set your default directory"
@@ -51,7 +51,7 @@ exports[`test render renders with directories and last visit default 1`] = `
`;
exports[`test render renders with directories but no default 1`] = `
<StyledWithResponsiveMode
<Dropdown
className="defaultDirectoryDropdown"
defaultSelectedKey="lastVisited"
label="Set your default directory"
@@ -76,7 +76,7 @@ exports[`test render renders with directories but no default 1`] = `
`;
exports[`test render renders with no directories 1`] = `
<StyledWithResponsiveMode
<Dropdown
className="defaultDirectoryDropdown"
defaultSelectedKey="lastVisited"
label="Set your default directory"
@@ -350,11 +350,11 @@ exports[`test render renders with filters 1`] = `
}
>
<div
className="ms-ScrollablePane root-72"
className="ms-ScrollablePane root-53"
data-is-scrollable="true"
>
<div
className="stickyAbove-74"
className="stickyAbove-55"
style={
Object {
"height": 0,
@@ -365,7 +365,7 @@ exports[`test render renders with filters 1`] = `
}
/>
<div
className="ms-ScrollablePane--contentContainer contentContainer-73"
className="ms-ScrollablePane--contentContainer contentContainer-54"
data-is-scrollable={true}
>
<Sticky
@@ -408,7 +408,6 @@ exports[`test render renders with filters 1`] = `
>
<TextFieldBase
ariaLabel="Directory filter text box"
canRevealPassword={false}
className="directoryListFilterTextBox"
deferredValidationTime={200}
onChange={[Function]}
@@ -691,18 +690,18 @@ exports[`test render renders with filters 1`] = `
validateOnLoad={true}
>
<div
className="ms-TextField directoryListFilterTextBox root-78"
className="ms-TextField directoryListFilterTextBox root-59"
>
<div
className="ms-TextField-wrapper"
>
<div
className="ms-TextField-fieldGroup fieldGroup-79"
className="ms-TextField-fieldGroup fieldGroup-60"
>
<input
aria-invalid={false}
aria-label="Directory filter text box"
className="ms-TextField-field field-80"
className="ms-TextField-field field-61"
id="TextField0"
onBlur={[Function]}
onChange={[Function]}
@@ -1266,7 +1265,6 @@ exports[`test render renders with filters 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -1611,6 +1609,35 @@ exports[`test render renders with filters 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#323130",
},
@@ -1900,7 +1927,7 @@ exports[`test render renders with filters 1`] = `
>
<button
aria-disabled={true}
className="ms-Button ms-Button--default is-disabled directoryListButton root-89"
className="ms-Button ms-Button--default is-disabled directoryListButton root-70"
data-is-focusable={false}
disabled={true}
onClick={[Function]}
@@ -1912,7 +1939,7 @@ exports[`test render renders with filters 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-90"
className="ms-Button-flexContainer flexContainer-71"
data-automationid="splitbuttonprimary"
>
<div
@@ -1943,7 +1970,7 @@ exports[`test render renders with filters 1`] = `
</List>
</div>
<div
className="stickyBelow-75"
className="stickyBelow-56"
style={
Object {
"bottom": "0px",
@@ -1954,7 +1981,7 @@ exports[`test render renders with filters 1`] = `
}
>
<div
className="stickyBelowItems-76"
className="stickyBelowItems-57"
/>
</div>
</div>
@@ -1,9 +1,14 @@
import {
Checkbox,
DefaultButton,
Dropdown,
IDropdownOption,
IDropdownStyles,
ITextFieldStyles,
Stack,
TextField,
} from "@fluentui/react";
import * as React from "react";
import { Stack } from "office-ui-fabric-react/lib/Stack";
import { Dropdown, IDropdownOption, IDropdownStyles } from "office-ui-fabric-react/lib/Dropdown";
import { Checkbox } from "office-ui-fabric-react/lib/Checkbox";
import { TextField, ITextFieldStyles } from "office-ui-fabric-react/lib/TextField";
import { DefaultButton } from "office-ui-fabric-react";
import "./FeaturePanelComponent.less";
export const FeaturePanelComponent: React.FunctionComponent = () => {
@@ -1,6 +1,6 @@
import * as React from "react";
import { FeaturePanelComponent } from "./FeaturePanelComponent";
import { getTheme, mergeStyleSets, FontWeights, Modal, IconButton, IIconProps } from "office-ui-fabric-react";
import { getTheme, mergeStyleSets, FontWeights, Modal, IconButton, IIconProps } from "@fluentui/react";
import "./FeaturePanelLauncher.less";
// Modal wrapper
@@ -57,7 +57,7 @@ exports[`Feature panel renders all flags 1`] = `
}
}
>
<StyledWithResponsiveMode
<Dropdown
label="Base Url"
onChange={[Function]}
options={
@@ -85,7 +85,7 @@ exports[`Feature panel renders all flags 1`] = `
}
}
/>
<StyledWithResponsiveMode
<Dropdown
label="Platform"
onChange={[Function]}
options={
@@ -1,4 +1,4 @@
import { DefaultButton, IButtonProps, ITextFieldProps, TextField } from "office-ui-fabric-react";
import { DefaultButton, IButtonProps, ITextFieldProps, TextField } from "@fluentui/react";
import * as React from "react";
import * as Constants from "../../../Common/Constants";
import { Action } from "../../../Shared/Telemetry/TelemetryConstants";
@@ -1,10 +1,4 @@
import {
ChoiceGroup,
IButtonProps,
IChoiceGroupProps,
PrimaryButton,
IChoiceGroupOption,
} from "office-ui-fabric-react";
import { ChoiceGroup, IButtonProps, IChoiceGroupProps, PrimaryButton, IChoiceGroupOption } from "@fluentui/react";
import * as React from "react";
import { ChildrenMargin } from "./GitHubStyleConstants";
@@ -1,4 +1,4 @@
import { DefaultButton, IButtonProps, Link, PrimaryButton } from "office-ui-fabric-react";
import { DefaultButton, IButtonProps, Link, PrimaryButton } from "@fluentui/react";
import * as React from "react";
import { IGitHubBranch, IGitHubRepo } from "../../../GitHub/GitHubClient";
import { AddRepoComponent, AddRepoComponentProps } from "./AddRepoComponent";
@@ -4,7 +4,7 @@ import {
IDropdownStyleProps,
IDropdownStyles,
IStyleFunctionOrObject,
} from "office-ui-fabric-react";
} from "@fluentui/react";
export const ButtonsFooterStyle: React.CSSProperties = {
paddingTop: 14,
@@ -16,7 +16,7 @@ import {
ResponsiveMode,
SelectionMode,
Text,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import * as React from "react";
import { IGitHubBranch, IGitHubPageInfo } from "../../../GitHub/GitHubClient";
import * as GitHubUtils from "../../../Utils/GitHubUtils";
@@ -1,5 +1,5 @@
import * as React from "react";
import { Stack, Text, Separator, FontIcon, CommandButton, FontWeights, ITextProps } from "office-ui-fabric-react";
import { Stack, Text, Separator, FontIcon, CommandButton, FontWeights, ITextProps } from "@fluentui/react";
export class GalleryHeaderComponent extends React.Component {
private static readonly azureText = "Microsoft Azure";
@@ -1,4 +1,3 @@
import { Card } from "@uifabric/react-cards";
import {
BaseButton,
Button,
@@ -8,14 +7,14 @@ import {
Image,
ImageFit,
Link,
LinkBase,
Persona,
Separator,
Spinner,
SpinnerSize,
Text,
TooltipHost,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import { Card } from "@uifabric/react-cards";
import React, { FunctionComponent, useState } from "react";
import CosmosDBLogo from "../../../../../images/CosmosDB-logo.svg";
import { IGalleryItem } from "../../../../Juno/JunoClient";
@@ -110,7 +109,7 @@ export const GalleryCardComponent: FunctionComponent<GalleryCardComponentProps>
const handlerOnClick = (
event:
| React.MouseEvent<HTMLElement | HTMLAnchorElement | HTMLButtonElement | LinkBase, MouseEvent>
| React.MouseEvent<HTMLElement | HTMLAnchorElement | HTMLButtonElement | MouseEvent>
| React.MouseEvent<
HTMLAnchorElement | HTMLButtonElement | HTMLDivElement | BaseButton | Button | HTMLSpanElement,
MouseEvent
@@ -31,7 +31,7 @@ exports[`GalleryCardComponent renders 1`] = `
/>
</CardItem>
<CardItem>
<StyledImageBase
<Image
alt="name cover image"
height={144}
imageFit={2}
@@ -0,0 +1,123 @@
import * as React from "react";
import { JunoClient } from "../../../Juno/JunoClient";
import { HttpStatusCodes, CodeOfConductEndpoints } from "../../../Common/Constants";
import { Stack, Text, Checkbox, PrimaryButton, Link } from "@fluentui/react";
import { getErrorMessage, getErrorStack, handleError } from "../../../Common/ErrorHandlingUtils";
import { trace, traceFailure, traceStart, traceSuccess } from "../../../Shared/Telemetry/TelemetryProcessor";
import { Action } from "../../../Shared/Telemetry/TelemetryConstants";
export interface CodeOfConductComponentProps {
junoClient: JunoClient;
onAcceptCodeOfConduct: (result: boolean) => void;
}
interface CodeOfConductComponentState {
readCodeOfConduct: boolean;
}
export class CodeOfConductComponent extends React.Component<CodeOfConductComponentProps, CodeOfConductComponentState> {
private viewCodeOfConductTraced: boolean;
private descriptionPara1: string;
private descriptionPara2: string;
private descriptionPara3: string;
private link1: { label: string; url: string };
constructor(props: CodeOfConductComponentProps) {
super(props);
this.state = {
readCodeOfConduct: false,
};
this.descriptionPara1 = "Azure Cosmos DB Notebook Gallery - Code of Conduct";
this.descriptionPara2 = "The notebook public gallery contains notebook samples shared by users of Azure Cosmos DB.";
this.descriptionPara3 = "In order to view and publish your samples to the gallery, you must accept the ";
this.link1 = { label: "code of conduct.", url: CodeOfConductEndpoints.codeOfConduct };
}
private async acceptCodeOfConduct(): Promise<void> {
const startKey = traceStart(Action.NotebooksGalleryAcceptCodeOfConduct);
try {
const response = await this.props.junoClient.acceptCodeOfConduct();
if (response.status !== HttpStatusCodes.OK && response.status !== HttpStatusCodes.NoContent) {
throw new Error(`Received HTTP ${response.status} when accepting code of conduct`);
}
traceSuccess(Action.NotebooksGalleryAcceptCodeOfConduct, {}, startKey);
this.props.onAcceptCodeOfConduct(response.data);
} catch (error) {
traceFailure(
Action.NotebooksGalleryAcceptCodeOfConduct,
{
error: getErrorMessage(error),
errorStack: getErrorStack(error),
},
startKey
);
handleError(error, "CodeOfConductComponent/acceptCodeOfConduct", "Failed to accept code of conduct");
}
}
private onChangeCheckbox = (): void => {
this.setState({ readCodeOfConduct: !this.state.readCodeOfConduct });
};
public render(): JSX.Element {
if (!this.viewCodeOfConductTraced) {
this.viewCodeOfConductTraced = true;
trace(Action.NotebooksGalleryViewCodeOfConduct);
}
return (
<Stack tokens={{ childrenGap: 20 }}>
<Stack.Item>
<Text style={{ fontWeight: 500, fontSize: "20px" }}>{this.descriptionPara1}</Text>
</Stack.Item>
<Stack.Item>
<Text>{this.descriptionPara2}</Text>
</Stack.Item>
<Stack.Item>
<Text>
{this.descriptionPara3}
<Link href={this.link1.url} target="_blank">
{this.link1.label}
</Link>
</Text>
</Stack.Item>
<Stack.Item>
<Checkbox
styles={{
label: {
margin: 0,
padding: "2 0 2 0",
},
text: {
fontSize: 12,
},
}}
label="I have read and accept the code of conduct."
onChange={this.onChangeCheckbox}
/>
</Stack.Item>
<Stack.Item>
<PrimaryButton
ariaLabel="Continue"
title="Continue"
onClick={async () => await this.acceptCodeOfConduct()}
tabIndex={0}
className="genericPaneSubmitBtn"
text="Continue"
disabled={!this.state.readCodeOfConduct}
/>
</Stack.Item>
</Stack>
);
}
}
@@ -1,4 +1,4 @@
import { Checkbox, Link, PrimaryButton, Stack, Text } from "office-ui-fabric-react";
import { Checkbox, Link, PrimaryButton, Stack, Text } from "@fluentui/react";
import React, { FunctionComponent, useEffect, useState } from "react";
import { CodeOfConductEndpoints, HttpStatusCodes } from "../../../../Common/Constants";
import { getErrorMessage, getErrorStack, handleError } from "../../../../Common/ErrorHandlingUtils";
@@ -19,7 +19,7 @@ import {
SpinnerSize,
Stack,
Text,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import * as React from "react";
import { HttpStatusCodes } from "../../../Common/Constants";
import { handleError } from "../../../Common/ErrorHandlingUtils";
@@ -1,5 +1,5 @@
import * as React from "react";
import { Icon, Label, Stack, HoverCard, HoverCardType, Link } from "office-ui-fabric-react";
import { Icon, Label, Stack, HoverCard, HoverCardType, Link } from "@fluentui/react";
import { CodeOfConductEndpoints } from "../../../../Common/Constants";
import "./InfoComponent.less";
@@ -4,7 +4,7 @@ exports[`GalleryViewerComponent renders 1`] = `
<div
className="galleryContainer"
>
<StyledPivotBase
<StyledPivot
onLinkClick={[Function]}
selectedKey="OfficialSamples"
>
@@ -41,7 +41,7 @@ exports[`GalleryViewerComponent renders 1`] = `
<StackItem
grow={true}
>
<StyledSearchBoxBase
<StyledSearchBox
onChange={[Function]}
placeholder="Search"
/>
@@ -60,7 +60,7 @@ exports[`GalleryViewerComponent renders 1`] = `
}
}
>
<StyledWithResponsiveMode
<Dropdown
onChange={[Function]}
options={
Array [
@@ -127,7 +127,7 @@ exports[`GalleryViewerComponent renders 1`] = `
<StackItem
grow={true}
>
<StyledSearchBoxBase
<StyledSearchBox
onChange={[Function]}
placeholder="Search"
/>
@@ -146,7 +146,7 @@ exports[`GalleryViewerComponent renders 1`] = `
}
}
>
<StyledWithResponsiveMode
<Dropdown
onChange={[Function]}
options={
Array [
@@ -182,6 +182,6 @@ exports[`GalleryViewerComponent renders 1`] = `
</StackItem>
</Stack>
</PivotItem>
</StyledPivotBase>
</StyledPivot>
</div>
`;
@@ -1,17 +1,7 @@
/**
* Wrapper around Notebook metadata
*/
import {
FontWeights,
Icon,
IconButton,
Link,
Persona,
PersonaSize,
PrimaryButton,
Stack,
Text,
} from "office-ui-fabric-react";
import { FontWeights, Icon, IconButton, Link, Persona, PersonaSize, PrimaryButton, Stack, Text } from "@fluentui/react";
import * as React from "react";
import { IGalleryItem } from "../../../Juno/JunoClient";
import * as FileSystemUtil from "../../Notebook/FileSystemUtil";
@@ -3,7 +3,7 @@
*/
import { Notebook } from "@nteract/commutable";
import { createContentRef } from "@nteract/core";
import { IChoiceGroupProps, Icon, IProgressIndicatorProps, Link, ProgressIndicator } from "office-ui-fabric-react";
import { IChoiceGroupProps, Icon, IProgressIndicatorProps, Link, ProgressIndicator } from "@fluentui/react";
import * as React from "react";
import { contents } from "rx-jupyter";
import { IGalleryItem, JunoClient } from "../../../Juno/JunoClient";
@@ -1,22 +1,24 @@
import { IButtonProps, IconButton } from "office-ui-fabric-react/lib/Button";
import { ContextualMenu, IContextualMenuProps } from "office-ui-fabric-react/lib/ContextualMenu";
import {
ContextualMenu,
DetailsList,
DetailsListLayoutMode,
DetailsRow,
FocusZone,
IButtonProps,
IColumn,
IconButton,
IContextualMenuProps,
IDetailsListProps,
IDetailsRowProps,
} from "office-ui-fabric-react/lib/DetailsList";
import { FocusZone } from "office-ui-fabric-react/lib/FocusZone";
import { ITextField, ITextFieldProps, TextField } from "office-ui-fabric-react/lib/TextField";
import {
IObjectWithKey,
ISelectionZoneProps,
ITextField,
ITextFieldProps,
Selection,
SelectionMode,
SelectionZone,
} from "office-ui-fabric-react/lib/utilities/selection/index";
TextField,
} from "@fluentui/react";
import * as React from "react";
import * as _ from "underscore";
import SaveQueryBannerIcon from "../../../../images/save_query_banner.png";
@@ -2,10 +2,10 @@
* Horizontal switch component
*/
import { Icon } from "@fluentui/react";
import * as React from "react";
import "./RadioSwitchComponent.less";
import { Icon } from "office-ui-fabric-react/lib/Icon";
import { NormalizedEventKey } from "../../../Common/Constants";
import "./RadioSwitchComponent.less";
export interface Choice {
key: string;
@@ -1,4 +1,4 @@
import { IPivotItemProps, IPivotProps, Pivot, PivotItem } from "office-ui-fabric-react";
import { IPivotItemProps, IPivotProps, Pivot, PivotItem } from "@fluentui/react";
import * as React from "react";
import DiscardIcon from "../../../../images/discard.svg";
import SaveIcon from "../../../../images/save-cosmos.svg";
@@ -1,6 +1,6 @@
import { shallow } from "enzyme";
import React from "react";
import { IColumn, Text } from "office-ui-fabric-react";
import { IColumn, Text } from "@fluentui/react";
import {
getAutoPilotV3SpendElement,
getEstimatedSpendingElement,
@@ -38,7 +38,7 @@ import {
IDetailsRowProps,
DetailsRow,
IDetailsColumnStyles,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import { isDirtyTypes, isDirty } from "./SettingsUtils";
export interface EstimatedSpendingDisplayProps {
@@ -9,7 +9,7 @@ import {
subComponentStackProps,
getChoiceGroupStyles,
} from "../SettingsRenderUtils";
import { TextField, ITextFieldProps, Stack, IChoiceGroupOption, ChoiceGroup } from "office-ui-fabric-react";
import { TextField, ITextFieldProps, Stack, IChoiceGroupOption, ChoiceGroup } from "@fluentui/react";
import { ToolTipLabelComponent } from "./ToolTipLabelComponent";
import { isDirty } from "../SettingsUtils";
@@ -1,7 +1,8 @@
import { MessageBar, MessageBarType, Stack } from "office-ui-fabric-react";
import { MessageBar, MessageBarType, Stack } from "@fluentui/react";
import * as monaco from "monaco-editor";
import * as React from "react";
import * as DataModels from "../../../../Contracts/DataModels";
import { loadMonaco, monaco } from "../../../LazyMonaco";
import { loadMonaco } from "../../../LazyMonaco";
import { indexingPolicynUnsavedWarningMessage, titleAndInputStackProps } from "../SettingsRenderUtils";
import { isDirty, isIndexTransforming } from "../SettingsUtils";
import { IndexingPolicyRefreshComponent } from "./IndexingPolicyRefresh/IndexingPolicyRefreshComponent";
@@ -1,5 +1,5 @@
import * as React from "react";
import { MessageBar, MessageBarType } from "office-ui-fabric-react";
import { MessageBar, MessageBarType } from "@fluentui/react";
import {
mongoIndexTransformationRefreshingMessage,
renderMongoIndexTransformationRefreshMessage,
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`IndexingPolicyRefreshComponent renders 1`] = `
<StyledMessageBarBase
<StyledMessageBar
messageBarType={5}
>
<Text
@@ -20,5 +20,5 @@ exports[`IndexingPolicyRefreshComponent renders 1`] = `
Refresh to check the progress.
</StyledLinkBase>
</Text>
</StyledMessageBarBase>
</StyledMessageBar>
`;
@@ -8,7 +8,7 @@ import {
Dropdown,
IDropdownOption,
ITextField,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import {
addMongoIndexSubElementsTokens,
mongoErrorMessageStyles,
@@ -12,7 +12,7 @@ import {
Spinner,
SpinnerSize,
Separator,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import {
addMongoIndexStackProps,
customDetailsListStyles,
@@ -30,7 +30,7 @@ exports[`AddMongoIndexComponent renders 1`] = `
}
value="sample_key"
/>
<StyledWithResponsiveMode
<Dropdown
ariaLabel="Index Type 1"
onChange={[Function]}
options={
@@ -67,7 +67,7 @@ exports[`AddMongoIndexComponent renders 1`] = `
onClick={[Function]}
/>
</Stack>
<StyledMessageBarBase
<StyledMessageBar
messageBarType={1}
styles={
Object {
@@ -78,6 +78,6 @@ exports[`AddMongoIndexComponent renders 1`] = `
}
>
sample error
</StyledMessageBarBase>
</StyledMessageBar>
</Stack>
`;
@@ -1,4 +1,4 @@
import { Label, Link, MessageBar, MessageBarType, Stack, Text, TextField } from "office-ui-fabric-react";
import { Label, Link, MessageBar, MessageBarType, Stack, Text, TextField } from "@fluentui/react";
import * as React from "react";
import * as Constants from "../../../../Common/Constants";
import { configContext, Platform } from "../../../../ConfigContext";
@@ -1,13 +1,4 @@
import {
ChoiceGroup,
IChoiceGroupOption,
Label,
Link,
MessageBar,
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
import { ChoiceGroup, IChoiceGroupOption, Label, Link, MessageBar, Stack, Text, TextField } from "@fluentui/react";
import * as React from "react";
import * as ViewModels from "../../../../Contracts/ViewModels";
import { userContext } from "../../../../UserContext";
@@ -10,7 +10,7 @@ import {
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import React from "react";
import * as DataModels from "../../../../../Contracts/DataModels";
import { SubscriptionType } from "../../../../../Contracts/SubscriptionType";
@@ -8,7 +8,7 @@ exports[`ThroughputInputAutoPilotV3Component autopilot input visible 1`] = `
}
}
>
<StyledMessageBarBase
<StyledMessageBar
messageBarIconProps={
Object {
"className": "messageBarWarningIcon",
@@ -27,7 +27,7 @@ exports[`ThroughputInputAutoPilotV3Component autopilot input visible 1`] = `
>
Your bill will be affected as you update your throughput settings. Please review the updated cost estimate below before saving your changes
</Text>
</StyledMessageBarBase>
</StyledMessageBar>
<Stack>
<StyledLabelBase
id="settingsV2RadioButtonLabelId"
@@ -49,7 +49,7 @@ exports[`ThroughputInputAutoPilotV3Component autopilot input visible 1`] = `
}
/>
</StyledLabelBase>
<StyledMessageBarBase
<StyledMessageBar
messageBarIconProps={
Object {
"className": "messageBarInfoIcon",
@@ -86,8 +86,8 @@ exports[`ThroughputInputAutoPilotV3Component autopilot input visible 1`] = `
Learn more
</a>
</Text>
</StyledMessageBarBase>
<StyledChoiceGroupBase
</StyledMessageBar>
<StyledChoiceGroup
ariaLabelledBy="settingsV2RadioButtonLabelId"
onChange={[Function]}
options={
@@ -196,7 +196,7 @@ exports[`ThroughputInputAutoPilotV3Component spendAck checkbox visible 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
ariaLabelledBy="settingsV2RadioButtonLabelId"
onChange={[Function]}
options={
@@ -470,7 +470,7 @@ exports[`ThroughputInputAutoPilotV3Component throughput input visible 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
ariaLabelledBy="settingsV2RadioButtonLabelId"
onChange={[Function]}
options={
@@ -1,5 +1,5 @@
import * as React from "react";
import { Stack, Text, IIconStyles, Icon, TooltipHost, DirectionalHint } from "office-ui-fabric-react";
import { Stack, Text, IIconStyles, Icon, TooltipHost, DirectionalHint } from "@fluentui/react";
import { toolTipLabelStackTokens } from "../SettingsRenderUtils";
export interface ToolTipLabelComponentProps {
@@ -8,7 +8,7 @@ exports[`ConflictResolutionComponent Path text field displayed 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
label="Mode"
onChange={[Function]}
options={
@@ -80,7 +80,7 @@ exports[`ConflictResolutionComponent Sproc text field displayed 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
label="Mode"
onChange={[Function]}
options={
@@ -8,7 +8,7 @@ exports[`ScaleComponent renders with correct initial notification 1`] = `
}
}
>
<StyledMessageBarBase
<StyledMessageBar
messageBarType={5}
>
<Text
@@ -26,7 +26,7 @@ exports[`ScaleComponent renders with correct initial notification 1`] = `
Database: test, Container: test
, Current autoscale throughput: 100 - 1000 RU/s, Target autoscale throughput: 600 - 6000 RU/s
</Text>
</StyledMessageBarBase>
</StyledMessageBar>
<Stack
tokens={
Object {
@@ -15,7 +15,7 @@ exports[`SubSettingsComponent analyticalTimeToLive hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="timeToLive"
label="Time to Live"
onChange={[Function]}
@@ -85,7 +85,7 @@ exports[`SubSettingsComponent analyticalTimeToLive hidden 1`] = `
value="1000"
/>
</Stack>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="geoSpatialConfig"
label="Geospatial Configuration"
onChange={[Function]}
@@ -146,7 +146,7 @@ exports[`SubSettingsComponent analyticalTimeToLive hidden 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
aria-labelledby="settingsV2ChangeFeedLabelId"
id="changeFeedPolicy"
onChange={[Function]}
@@ -238,7 +238,7 @@ exports[`SubSettingsComponent analyticalTimeToLiveSeconds hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="timeToLive"
label="Time to Live"
onChange={[Function]}
@@ -308,7 +308,7 @@ exports[`SubSettingsComponent analyticalTimeToLiveSeconds hidden 1`] = `
value="1000"
/>
</Stack>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="geoSpatialConfig"
label="Geospatial Configuration"
onChange={[Function]}
@@ -355,7 +355,7 @@ exports[`SubSettingsComponent analyticalTimeToLiveSeconds hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="analyticalStorageTimeToLive"
label="Analytical Storage Time to Live"
onChange={[Function]}
@@ -422,7 +422,7 @@ exports[`SubSettingsComponent analyticalTimeToLiveSeconds hidden 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
aria-labelledby="settingsV2ChangeFeedLabelId"
id="changeFeedPolicy"
onChange={[Function]}
@@ -514,7 +514,7 @@ exports[`SubSettingsComponent changeFeedPolicy hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="timeToLive"
label="Time to Live"
onChange={[Function]}
@@ -584,7 +584,7 @@ exports[`SubSettingsComponent changeFeedPolicy hidden 1`] = `
value="1000"
/>
</Stack>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="geoSpatialConfig"
label="Geospatial Configuration"
onChange={[Function]}
@@ -631,7 +631,7 @@ exports[`SubSettingsComponent changeFeedPolicy hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="analyticalStorageTimeToLive"
label="Analytical Storage Time to Live"
onChange={[Function]}
@@ -753,7 +753,7 @@ exports[`SubSettingsComponent renders 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="timeToLive"
label="Time to Live"
onChange={[Function]}
@@ -823,7 +823,7 @@ exports[`SubSettingsComponent renders 1`] = `
value="1000"
/>
</Stack>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="geoSpatialConfig"
label="Geospatial Configuration"
onChange={[Function]}
@@ -870,7 +870,7 @@ exports[`SubSettingsComponent renders 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="analyticalStorageTimeToLive"
label="Analytical Storage Time to Live"
onChange={[Function]}
@@ -962,7 +962,7 @@ exports[`SubSettingsComponent renders 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
aria-labelledby="settingsV2ChangeFeedLabelId"
id="changeFeedPolicy"
onChange={[Function]}
@@ -1054,7 +1054,7 @@ exports[`SubSettingsComponent timeToLiveSeconds hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="timeToLive"
label="Time to Live"
onChange={[Function]}
@@ -1099,7 +1099,7 @@ exports[`SubSettingsComponent timeToLiveSeconds hidden 1`] = `
}
/>
</Stack>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="geoSpatialConfig"
label="Geospatial Configuration"
onChange={[Function]}
@@ -1146,7 +1146,7 @@ exports[`SubSettingsComponent timeToLiveSeconds hidden 1`] = `
}
}
>
<StyledChoiceGroupBase
<StyledChoiceGroup
id="analyticalStorageTimeToLive"
label="Analytical Storage Time to Live"
onChange={[Function]}
@@ -1238,7 +1238,7 @@ exports[`SubSettingsComponent timeToLiveSeconds hidden 1`] = `
}
/>
</StyledLabelBase>
<StyledChoiceGroupBase
<StyledChoiceGroup
aria-labelledby="settingsV2ChangeFeedLabelId"
id="changeFeedPolicy"
onChange={[Function]}
@@ -7,7 +7,7 @@ exports[`SettingsComponent renders 1`] = `
<div
className="settingsV2TabsContainer"
>
<StyledPivotBase
<StyledPivot
onLinkClick={[Function]}
selectedKey="ScaleTab"
>
@@ -5178,7 +5178,7 @@ exports[`SettingsComponent renders 1`] = `
shouldDiscardIndexingPolicy={false}
/>
</PivotItem>
</StyledPivotBase>
</StyledPivot>
</div>
</div>
`;
@@ -338,7 +338,7 @@ exports[`SettingsUtils functions render 1`] = `
</StyledLinkBase>
are only used for sorting query results. If you need to add a compound index, you can create one using the Mongo shell.
</Text>
<StyledMessageBarBase
<StyledMessageBar
messageBarType={1}
>
<Text>
@@ -350,7 +350,7 @@ exports[`SettingsUtils functions render 1`] = `
azure portal.
</StyledLinkBase>
</Text>
</StyledMessageBarBase>
</StyledMessageBar>
<Stack
horizontal={true}
tokens={
@@ -1,12 +1,20 @@
import {
Dropdown,
IDropdownOption,
IStackTokens,
Label,
Link,
MessageBar,
MessageBarType,
Position,
Slider,
SpinButton,
Stack,
Text,
TextField,
Toggle,
} from "@fluentui/react";
import { TFunction } from "i18next";
import { Label, Link, MessageBar, MessageBarType, Toggle } from "office-ui-fabric-react";
import { Dropdown, IDropdownOption } from "office-ui-fabric-react/lib/Dropdown";
import { Slider } from "office-ui-fabric-react/lib/Slider";
import { SpinButton } from "office-ui-fabric-react/lib/SpinButton";
import { IStackTokens, Stack } from "office-ui-fabric-react/lib/Stack";
import { Text } from "office-ui-fabric-react/lib/Text";
import { TextField } from "office-ui-fabric-react/lib/TextField";
import { Position } from "office-ui-fabric-react/lib/utilities/positioning";
import * as React from "react";
import {
ChoiceItem,
@@ -77,22 +77,11 @@ exports[`SmartUiComponent disable all inputs 1`] = `
}
}
>
<CustomizedSpinButton
<StyledSpinButton
aria-labelledby="throughput-label"
ariaLabel="Throughput (input)"
decrementButtonIcon={
Object {
"iconName": "ChevronDownSmall",
}
}
disabled={true}
id="throughput-spinner-input"
incrementButtonIcon={
Object {
"iconName": "ChevronUpSmall",
}
}
label=""
labelPosition={0}
max={500}
min={400}
@@ -169,12 +158,12 @@ exports[`SmartUiComponent disable all inputs 1`] = `
}
>
<StackItem>
<StyledMessageBarBase
<StyledMessageBar
messageBarType={1}
>
Error:
label, truelabel and falselabel are required for boolean input 'throughput3'
</StyledMessageBarBase>
</StyledMessageBar>
</StackItem>
</Stack>
</div>
@@ -282,7 +271,7 @@ exports[`SmartUiComponent disable all inputs 1`] = `
label="Database"
/>
</StyledLabelBase>
<StyledWithResponsiveMode
<Dropdown
aria-labelledby="database-label"
disabled={true}
id="database-dropdown-input"
@@ -402,22 +391,10 @@ exports[`SmartUiComponent should render and honor input's hidden, disabled state
}
}
>
<CustomizedSpinButton
<StyledSpinButton
aria-labelledby="throughput-label"
ariaLabel="Throughput (input)"
decrementButtonIcon={
Object {
"iconName": "ChevronDownSmall",
}
}
disabled={false}
id="throughput-spinner-input"
incrementButtonIcon={
Object {
"iconName": "ChevronUpSmall",
}
}
label=""
labelPosition={0}
max={500}
min={400}
@@ -493,12 +470,12 @@ exports[`SmartUiComponent should render and honor input's hidden, disabled state
}
>
<StackItem>
<StyledMessageBarBase
<StyledMessageBar
messageBarType={1}
>
Error:
label, truelabel and falselabel are required for boolean input 'throughput3'
</StyledMessageBarBase>
</StyledMessageBar>
</StackItem>
</Stack>
</div>
@@ -604,7 +581,7 @@ exports[`SmartUiComponent should render and honor input's hidden, disabled state
label="Database"
/>
</StyledLabelBase>
<StyledWithResponsiveMode
<Dropdown
aria-labelledby="database-label"
id="database-dropdown-input"
onChange={[Function]}
@@ -1,4 +1,4 @@
import { Checkbox, DirectionalHint, Icon, Link, Stack, Text, TextField, TooltipHost } from "office-ui-fabric-react";
import { Checkbox, DirectionalHint, Icon, Link, Stack, Text, TextField, TooltipHost } from "@fluentui/react";
import React from "react";
import * as Constants from "../../../Common/Constants";
import * as SharedConstants from "../../../Shared/Constants";
@@ -5,21 +5,21 @@
* - context menu
*/
import * as React from "react";
import * as Constants from "../../../Common/Constants";
import AnimateHeight from "react-animate-height";
import { IconButton, IButtonStyles } from "office-ui-fabric-react/lib/Button";
import {
DirectionalHint,
IButtonStyles,
IconButton,
IContextualMenuItemProps,
IContextualMenuProps,
} from "office-ui-fabric-react/lib/ContextualMenu";
} from "@fluentui/react";
import * as React from "react";
import AnimateHeight from "react-animate-height";
import LoadingIndicator_3Squares from "../../../../images/LoadingIndicator_3Squares.gif";
import TriangleDownIcon from "../../../../images/Triangle-down.svg";
import TriangleRightIcon from "../../../../images/Triangle-right.svg";
import LoadingIndicator_3Squares from "../../../../images/LoadingIndicator_3Squares.gif";
import * as TelemetryProcessor from "../../../Shared/Telemetry/TelemetryProcessor";
import * as Constants from "../../../Common/Constants";
import { Action, ActionModifiers } from "../../../Shared/Telemetry/TelemetryConstants";
import * as TelemetryProcessor from "../../../Shared/Telemetry/TelemetryProcessor";
export interface TreeNodeMenuItem {
label: string;
+1 -1
View File
@@ -1,5 +1,5 @@
import * as ko from "knockout";
import { IChoiceGroupProps } from "office-ui-fabric-react";
import { IChoiceGroupProps } from "@fluentui/react";
import * as path from "path";
import Q from "q";
import React from "react";
@@ -1,5 +1,5 @@
import { FocusZone } from "@fluentui/react";
import * as React from "react";
import { FocusZone } from "office-ui-fabric-react/lib/FocusZone";
import { AccessibleElement } from "../../Controls/AccessibleElement/AccessibleElement";
export interface CaptionId {
@@ -1,4 +1,4 @@
import { Dropdown, IDropdownOption, Stack, TextField } from "office-ui-fabric-react";
import { Dropdown, IDropdownOption, Stack, TextField } from "@fluentui/react";
import React, { FunctionComponent, useRef, useState } from "react";
import AddIcon from "../../../../images/Add-property.svg";
import DeleteIcon from "../../../../images/delete.svg";
@@ -3,8 +3,8 @@
* If the component signals a change through the callback passed in the properties, it must render the React component when appropriate
* and update any knockout observables passed from the parent.
*/
import { CommandBar, ICommandBarItemProps } from "@fluentui/react";
import * as ko from "knockout";
import { CommandBar, ICommandBarItemProps } from "office-ui-fabric-react/lib/CommandBar";
import * as React from "react";
import { ReactAdapter } from "../../../Bindings/ReactBindingHandler";
import { StyleConstants } from "../../../Common/Constants";
@@ -1,6 +1,6 @@
import * as CommandBarUtil from "./CommandBarUtil";
import { ICommandBarItemProps } from "office-ui-fabric-react/lib/CommandBar";
import { ICommandBarItemProps } from "@fluentui/react";
import { CommandButtonComponentProps } from "../../Controls/CommandButton/CommandButtonComponent";
import * as CommandBarUtil from "./CommandBarUtil";
describe("CommandBarUtil tests", () => {
const createButton = (): CommandButtonComponentProps => {
@@ -1,18 +1,22 @@
import _ from "underscore";
import * as React from "react";
import {
Dropdown,
ICommandBarItemProps,
IComponentAsProps,
IconType,
IDropdownOption,
IDropdownStyles,
} from "@fluentui/react";
import { Observable } from "knockout";
import { IconType } from "office-ui-fabric-react/lib/Icon";
import { IComponentAsProps } from "office-ui-fabric-react/lib/Utilities";
import { StyleConstants } from "../../../Common/Constants";
import { ICommandBarItemProps } from "office-ui-fabric-react/lib/CommandBar";
import { Dropdown, IDropdownStyles, IDropdownOption } from "office-ui-fabric-react/lib/Dropdown";
import { CommandButtonComponentProps } from "../../Controls/CommandButton/CommandButtonComponent";
import * as React from "react";
import _ from "underscore";
import ChevronDownIcon from "../../../../images/Chevron_down.svg";
import { ArcadiaMenuPicker } from "../../Controls/Arcadia/ArcadiaMenuPicker";
import { MemoryTrackerComponent } from "./MemoryTrackerComponent";
import { StyleConstants } from "../../../Common/Constants";
import { MemoryUsageInfo } from "../../../Contracts/DataModels";
import * as TelemetryProcessor from "../../../Shared/Telemetry/TelemetryProcessor";
import { Action, ActionModifiers } from "../../../Shared/Telemetry/TelemetryConstants";
import * as TelemetryProcessor from "../../../Shared/Telemetry/TelemetryProcessor";
import { ArcadiaMenuPicker } from "../../Controls/Arcadia/ArcadiaMenuPicker";
import { CommandButtonComponentProps } from "../../Controls/CommandButton/CommandButtonComponent";
import { MemoryTrackerComponent } from "./MemoryTrackerComponent";
/**
* Convert our NavbarButtonConfig to UI Fabric buttons
@@ -1,9 +1,7 @@
import * as React from "react";
import { ProgressIndicator, Spinner, SpinnerSize, Stack } from "@fluentui/react";
import { Observable, Subscription } from "knockout";
import * as React from "react";
import { MemoryUsageInfo } from "../../../Contracts/DataModels";
import { ProgressIndicator } from "office-ui-fabric-react/lib/ProgressIndicator";
import { Spinner, SpinnerSize } from "office-ui-fabric-react/lib/Spinner";
import { Stack } from "office-ui-fabric-react/lib/Stack";
interface MemoryTrackerProps {
memoryUsageInfo: Observable<MemoryUsageInfo>;
@@ -2,7 +2,7 @@
* React component for control bar
*/
import { Dropdown, IDropdownOption } from "office-ui-fabric-react";
import { Dropdown, IDropdownOption } from "@fluentui/react";
import * as React from "react";
import AnimateHeight from "react-animate-height";
import LoaderIcon from "../../../../images/circular_loader_black_16x16.gif";
@@ -111,7 +111,7 @@ exports[`NotificationConsoleComponent renders the console 1`] = `
<div
className="notificationConsoleControls"
>
<StyledWithResponsiveMode
<Dropdown
aria-label="All"
aria-labelledby="consoleFilterLabel"
label="Filter:"
@@ -277,7 +277,7 @@ exports[`NotificationConsoleComponent renders the console 2`] = `
<div
className="notificationConsoleControls"
>
<StyledWithResponsiveMode
<Dropdown
aria-label="All"
aria-labelledby="consoleFilterLabel"
label="Filter:"
@@ -1,8 +1,7 @@
import { IconButton, Spinner, SpinnerSize } from "@fluentui/react";
import * as React from "react";
import { IconButton } from "office-ui-fabric-react/lib/Button";
import { Spinner, SpinnerSize } from "office-ui-fabric-react/lib/Spinner";
import "./Prompt.less";
import { PassedPromptProps } from "./Prompt";
import "./Prompt.less";
export const promptContent = (props: PassedPromptProps): JSX.Element => {
if (props.status === "busy") {
@@ -1,21 +1,15 @@
import { ContextualMenuItemType, DirectionalHint, IconButton, IContextualMenuItem } from "@fluentui/react";
import { CellId, CellType } from "@nteract/commutable";
import { actions, AppState, DocumentRecordProps } from "@nteract/core";
import * as selectors from "@nteract/selectors";
import { CellToolbarContext } from "@nteract/stateful-components";
import { ContentRef } from "@nteract/types";
import { RecordOf } from "immutable";
import * as React from "react";
import { connect } from "react-redux";
import { Dispatch } from "redux";
import { IconButton } from "office-ui-fabric-react/lib/Button";
import {
DirectionalHint,
IContextualMenuItem,
ContextualMenuItemType,
} from "office-ui-fabric-react/lib/ContextualMenu";
import { actions, AppState, DocumentRecordProps } from "@nteract/core";
import { CellToolbarContext } from "@nteract/stateful-components";
import { CellType, CellId } from "@nteract/commutable";
import * as selectors from "@nteract/selectors";
import { RecordOf } from "immutable";
import * as cdbActions from "../NotebookComponent/actions";
import { Action, ActionModifiers } from "../../../Shared/Telemetry/TelemetryConstants";
import * as cdbActions from "../NotebookComponent/actions";
export interface ComponentProps {
contentRef: ContentRef;
@@ -1,7 +1,7 @@
import { FontIcon, PrimaryButton, Spinner, SpinnerSize, Stack, Text, TextField } from "@fluentui/react";
import { ImmutableOutput } from "@nteract/commutable";
import { actions, AppState, ContentRef, KernelRef, selectors } from "@nteract/core";
import Immutable from "immutable";
import { FontIcon, PrimaryButton, Spinner, SpinnerSize, Stack, Text, TextField } from "office-ui-fabric-react";
import * as React from "react";
import { connect } from "react-redux";
import { Dispatch } from "redux";
+2 -3
View File
@@ -1,8 +1,7 @@
import { Spinner, Stack, Text, TextField } from "office-ui-fabric-react";
import { DefaultButton, PrimaryButton } from "office-ui-fabric-react/lib/Button";
import { DefaultButton, PrimaryButton, Spinner, Stack, Text, TextField } from "@fluentui/react";
import copyToClipboard from "clipboard-copy";
import * as React from "react";
import { useFullScreenURLs } from "../hooks/useFullScreenURLs";
import copyToClipboard from "clipboard-copy";
export const OpenFullScreen: React.FunctionComponent = () => {
const result = useFullScreenURLs();
+1 -1
View File
@@ -12,7 +12,7 @@ import {
Stack,
Text,
TooltipHost,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import React from "react";
import * as Constants from "../../Common/Constants";
import { createCollection } from "../../Common/dataAccess/createCollection";
@@ -1,4 +1,4 @@
import { IDropdownOption } from "office-ui-fabric-react";
import { IDropdownOption } from "@fluentui/react";
import React, { FormEvent, FunctionComponent, useEffect, useState } from "react";
import { HttpStatusCodes } from "../../../Common/Constants";
import { getErrorMessage, handleError } from "../../../Common/ErrorHandlingUtils";
@@ -8,7 +8,7 @@ import {
SelectableOptionMenuItemType,
Stack,
Text,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import React, { FormEvent, FunctionComponent } from "react";
import { IPinnedRepo } from "../../../Juno/JunoClient";
import * as GitHubUtils from "../../../Utils/GitHubUtils";
@@ -1,4 +1,4 @@
import { Text, TextField } from "office-ui-fabric-react";
import { Text, TextField } from "@fluentui/react";
import React, { FunctionComponent, useState } from "react";
import { Areas } from "../../../Common/Constants";
import { deleteCollection } from "../../../Common/dataAccess/deleteCollection";
@@ -523,7 +523,6 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -786,6 +785,35 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"textContainer": Object {
"display": "block",
"flexGrow": 1,
@@ -1071,7 +1099,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
>
<button
aria-label="Close pane"
className="ms-Button ms-Button--icon closePaneBtn root-172"
className="ms-Button ms-Button--icon closePaneBtn root-202"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -1084,18 +1112,17 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-173"
className="ms-Button-flexContainer flexContainer-203"
data-automationid="splitbuttonprimary"
>
<Component
className="ms-Button-icon icon-175"
className="ms-Button-icon icon-205"
iconName="Cancel"
>
<i
aria-hidden={true}
className="ms-Icon root-37 css-180 ms-Button-icon icon-175"
className="ms-Icon root-37 css-210 ms-Button-icon icon-205"
data-icon-name="Cancel"
role="presentation"
style={
Object {
"fontFamily": "\\"FabricMDL2Icons\\"",
@@ -1163,7 +1190,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
variant="small"
>
<span
className="css-181"
className="css-211"
>
Confirm by typing the
container
@@ -1185,7 +1212,6 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
>
<TextFieldBase
autoFocus={true}
canRevealPassword={false}
deferredValidationTime={200}
id="confirmCollectionId"
onChange={[Function]}
@@ -1468,18 +1494,18 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
value=""
>
<div
className="ms-TextField root-183"
className="ms-TextField root-213"
>
<div
className="ms-TextField-wrapper"
>
<div
className="ms-TextField-fieldGroup fieldGroup-184"
className="ms-TextField-fieldGroup fieldGroup-214"
>
<input
aria-invalid={false}
autoFocus={true}
className="ms-TextField-field field-185"
className="ms-TextField-field field-215"
id="confirmCollectionId"
onBlur={[Function]}
onChange={[Function]}
@@ -1502,7 +1528,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
variant="small"
>
<span
className="css-194"
className="css-224"
>
Help us improve Azure Cosmos DB!
</span>
@@ -1512,7 +1538,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
variant="small"
>
<span
className="css-194"
className="css-224"
>
What is the reason why you are deleting this
container
@@ -1534,7 +1560,6 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
value=""
>
<TextFieldBase
canRevealPassword={false}
deferredValidationTime={200}
id="deleteCollectionFeedbackInput"
multiline={true}
@@ -1819,17 +1844,17 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
value=""
>
<div
className="ms-TextField ms-TextField--multiline root-183"
className="ms-TextField ms-TextField--multiline root-213"
>
<div
className="ms-TextField-wrapper"
>
<div
className="ms-TextField-fieldGroup fieldGroup-195"
className="ms-TextField-fieldGroup fieldGroup-225"
>
<textarea
aria-invalid={false}
className="ms-TextField-field field-196"
className="ms-TextField-field field-226"
id="deleteCollectionFeedbackInput"
onBlur={[Function]}
onChange={[Function]}
@@ -2919,7 +2944,6 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -3266,6 +3290,35 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#ffffff",
},
@@ -3563,7 +3616,7 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
>
<button
aria-label="Submit"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-198"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-228"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -3581,14 +3634,14 @@ exports[`Delete Collection Confirmation Pane submit() should call delete collect
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-173"
className="ms-Button-flexContainer flexContainer-203"
data-automationid="splitbuttonprimary"
>
<span
className="ms-Button-textContainer textContainer-174"
className="ms-Button-textContainer textContainer-204"
>
<span
className="ms-Button-label label-199"
className="ms-Button-label label-229"
id="id__9"
key="id__9"
>
@@ -1,5 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import { Text, TextField } from "office-ui-fabric-react";
import { useBoolean } from "@fluentui/react-hooks";
import { Text, TextField } from "@fluentui/react";
import React, { FunctionComponent, useState } from "react";
import { Areas } from "../../Common/Constants";
import { deleteDatabase } from "../../Common/dataAccess/deleteDatabase";
@@ -1,5 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import { IDropdownOption, IImageProps, Image, Stack, Text } from "office-ui-fabric-react";
import { useBoolean } from "@fluentui/react-hooks";
import { IDropdownOption, IImageProps, Image, Stack, Text } from "@fluentui/react";
import React, { FunctionComponent, useState } from "react";
import AddPropertyIcon from "../../../../images/Add-property.svg";
import StoredProcedure from "../../Tree/StoredProcedure";
@@ -7,7 +7,7 @@ import {
Label,
Stack,
TextField,
} from "office-ui-fabric-react";
} from "@fluentui/react";
import React, { FunctionComponent } from "react";
import AddPropertyIcon from "../../../../images/Add-property.svg";
import EntityCancelIcon from "../../../../images/Entity_cancel.svg";
@@ -1,4 +1,4 @@
import { IconButton, PrimaryButton } from "office-ui-fabric-react/lib/Button";
import { IconButton, PrimaryButton } from "@fluentui/react";
import React, { FunctionComponent, ReactNode } from "react";
import ErrorRedIcon from "../../../../images/error_red.svg";
import LoadingIndicatorIcon from "../../../../images/LoadingIndicator_3Squares.gif";
@@ -1,5 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import { IImageProps, Image, ImageFit, Stack, TextField } from "office-ui-fabric-react";
import { useBoolean } from "@fluentui/react-hooks";
import { IImageProps, Image, ImageFit, Stack, TextField } from "@fluentui/react";
import React, { FunctionComponent, useState } from "react";
import folderIcon from "../../../../images/folder_16x16.svg";
import { logError } from "../../../Common/Logger";
@@ -39,7 +39,7 @@ exports[`Load Query Pane should render Default properly 1`] = `
className="customFileUpload"
htmlFor="importQueryInputId"
>
<StyledImageBase
<Image
alt="upload files"
className="fileIcon"
height={20}
@@ -1,4 +1,4 @@
import { useBoolean } from "@uifabric/react-hooks";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, useState } from "react";
import * as ViewModels from "../../../Contracts/ViewModels";
import Explorer from "../../Explorer";
@@ -1,4 +1,4 @@
import { IPanelProps, IRenderFunction, Panel, PanelType } from "office-ui-fabric-react";
import { IPanelProps, IRenderFunction, Panel, PanelType } from "@fluentui/react";
import * as React from "react";
export interface PanelContainerProps {
+1 -1
View File
@@ -1,5 +1,5 @@
import React from "react";
import { PrimaryButton } from "office-ui-fabric-react";
import { PrimaryButton } from "@fluentui/react";
export interface PanelFooterProps {
buttonLabel: string;
@@ -1,4 +1,4 @@
import { Icon, Link, Stack, Text } from "office-ui-fabric-react";
import { Icon, Link, Stack, Text } from "@fluentui/react";
import React from "react";
export interface PanelInfoErrorProps {
@@ -1,6 +1,6 @@
import { Dropdown, IDropdownProps, ITextFieldProps, Stack, Text, TextField } from "@fluentui/react";
import { ImmutableNotebook } from "@nteract/commutable";
import Html2Canvas from "html2canvas";
import { Dropdown, IDropdownProps, ITextFieldProps, Stack, Text, TextField } from "office-ui-fabric-react";
import React, { FunctionComponent, useState } from "react";
import { GalleryCardComponent } from "../../Controls/NotebookGallery/Cards/GalleryCardComponent";
import * as FileSystemUtil from "../../Notebook/FileSystemUtil";
@@ -50,7 +50,7 @@ exports[`PublishNotebookPaneComponent renders 1`] = `
/>
</StackItem>
<StackItem>
<StyledWithResponsiveMode
<Dropdown
ariaLabel="Cover image"
defaultSelectedKey="Custom Image"
label="Cover image"
@@ -1,5 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import { Text, TextField } from "office-ui-fabric-react";
import { useBoolean } from "@fluentui/react-hooks";
import { Text, TextField } from "@fluentui/react";
import React, { FunctionComponent, useState } from "react";
import { Areas, SavedQueries } from "../../../Common/Constants";
import { getErrorMessage, getErrorStack } from "../../../Common/ErrorHandlingUtils";
@@ -1,4 +1,4 @@
import { Checkbox, ChoiceGroup, IChoiceGroupOption, SpinButton } from "office-ui-fabric-react";
import { Checkbox, ChoiceGroup, IChoiceGroupOption, SpinButton } from "@fluentui/react";
import React, { FunctionComponent, MouseEvent, useState } from "react";
import * as Constants from "../../../Common/Constants";
import { Tooltip } from "../../../Common/Tooltip/Tooltip";
@@ -187,7 +187,6 @@ export const SettingsPane: FunctionComponent<SettingsPaneProps> = ({
label: { padding: 0 },
}}
className="padding"
tabIndex={0}
ariaLabel="Enable cross partition query"
checked={crossPartitionQueryEnabled}
onChange={() => setCrossPartitionQueryEnabled(!crossPartitionQueryEnabled)}
@@ -29,7 +29,7 @@ exports[`Settings Pane should render Default properly 1`] = `
Choose Custom to specify a fixed amount of query results to show, or choose Unlimited to show as many query results per page.
</Tooltip>
</div>
<StyledChoiceGroupBase
<StyledChoiceGroup
onChange={[Function]}
options={
Array [
@@ -60,25 +60,11 @@ exports[`Settings Pane should render Default properly 1`] = `
Enter the number of query results that should be shown per page.
</Tooltip>
</div>
<CustomizedSpinButton
<StyledSpinButton
ariaLabel="Custom query items per page"
className="textfontclr"
decrementButtonAriaLabel="Decrease value by 1"
decrementButtonIcon={
Object {
"iconName": "ChevronDownSmall",
}
}
disabled={false}
incrementButtonAriaLabel="Increase value by 1"
incrementButtonIcon={
Object {
"iconName": "ChevronUpSmall",
}
}
label=""
labelPosition={2}
max={100}
min={1}
onDecrement={[Function]}
onIncrement={[Function]}
@@ -115,7 +101,6 @@ exports[`Settings Pane should render Default properly 1`] = `
},
}
}
tabIndex={0}
/>
</div>
</div>
@@ -133,24 +118,10 @@ exports[`Settings Pane should render Default properly 1`] = `
Gets or sets the number of concurrent operations run client side during parallel query execution. A positive property value limits the number of concurrent operations to the set value. If it is set to less than 0, the system automatically decides the number of concurrent operations to run.
</Tooltip>
</div>
<CustomizedSpinButton
<StyledSpinButton
ariaLabel="Max degree of parallelism"
className="textfontclr"
decrementButtonIcon={
Object {
"iconName": "ChevronDownSmall",
}
}
disabled={false}
id="max-degree"
incrementButtonIcon={
Object {
"iconName": "ChevronUpSmall",
}
}
label=""
labelPosition={2}
max={100}
min={-1}
onDecrement={[Function]}
onIncrement={[Function]}
@@ -209,7 +180,7 @@ exports[`Settings Pane should render Gremlin properly 1`] = `
Select Graph to automatically visualize the query results as a Graph or JSON to display the results as JSON.
</Tooltip>
</div>
<StyledChoiceGroupBase
<StyledChoiceGroup
aria-label="Graph Auto-visualization"
onChange={[Function]}
options={
@@ -1,5 +1,5 @@
import { PrimaryButton } from "@fluentui/react";
import { mount } from "enzyme";
import { PrimaryButton } from "office-ui-fabric-react";
import React from "react";
import Explorer from "../../Explorer";
import { SetupNoteBooksPanel } from "./SetupNotebooksPanel";
@@ -1,5 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import { PrimaryButton } from "office-ui-fabric-react";
import { PrimaryButton } from "@fluentui/react";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, KeyboardEvent, useState } from "react";
import { Areas, NormalizedEventKey } from "../../../Common/Constants";
import { getErrorMessage, getErrorStack } from "../../../Common/ErrorHandlingUtils";
@@ -1062,7 +1062,6 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -1409,6 +1408,35 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#ffffff",
},
@@ -1704,7 +1732,7 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
>
<button
aria-label="Complete setup"
className="ms-Button ms-Button--primary btncreatecoll1 btnSetupQueries root-72"
className="ms-Button ms-Button--primary btncreatecoll1 btnSetupQueries root-53"
data-is-focusable={true}
id="completeSetupBtn"
onClick={[Function]}
@@ -1716,14 +1744,14 @@ exports[`Setup Notebooks Panel should render Default properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-73"
className="ms-Button-flexContainer flexContainer-54"
data-automationid="splitbuttonprimary"
>
<span
className="ms-Button-textContainer textContainer-74"
className="ms-Button-textContainer textContainer-55"
>
<span
className="ms-Button-label label-76"
className="ms-Button-label label-57"
id="id__0"
key="id__0"
>
@@ -1,4 +1,4 @@
import { TextField } from "office-ui-fabric-react";
import { TextField } from "@fluentui/react";
import React, { FormEvent, FunctionComponent, useState } from "react";
import * as ViewModels from "../../../Contracts/ViewModels";
import { logConsoleError, logConsoleInfo, logConsoleProgress } from "../../../Utils/NotificationConsoleUtils";
@@ -1787,7 +1787,6 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -2050,6 +2049,35 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"textContainer": Object {
"display": "block",
"flexGrow": 1,
@@ -2335,7 +2363,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
>
<button
aria-label="Close pane"
className="ms-Button ms-Button--icon closePaneBtn root-104"
className="ms-Button ms-Button--icon closePaneBtn root-153"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -2348,18 +2376,17 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-105"
className="ms-Button-flexContainer flexContainer-154"
data-automationid="splitbuttonprimary"
>
<Component
className="ms-Button-icon icon-107"
className="ms-Button-icon icon-156"
iconName="Cancel"
>
<i
aria-hidden={true}
className="ms-Icon root-37 css-112 ms-Button-icon icon-107"
className="ms-Icon root-37 css-161 ms-Button-icon icon-156"
data-icon-name="Cancel"
role="presentation"
style={
Object {
"fontFamily": "\\"FabricMDL2Icons\\"",
@@ -2424,7 +2451,6 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
<TextFieldBase
aria-label="Enter new directory name"
autoFocus={true}
canRevealPassword={false}
deferredValidationTime={200}
label="Enter new directory name"
name="collectionIdConfirmation"
@@ -2709,7 +2735,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
value=""
>
<div
className="ms-TextField is-required root-114"
className="ms-TextField is-required root-163"
>
<div
className="ms-TextField-wrapper"
@@ -3000,7 +3026,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
}
>
<label
className="ms-Label root-125"
className="ms-Label root-174"
htmlFor="TextField3"
id="TextFieldLabel5"
>
@@ -3009,13 +3035,13 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
</LabelBase>
</StyledLabelBase>
<div
className="ms-TextField-fieldGroup fieldGroup-115"
className="ms-TextField-fieldGroup fieldGroup-164"
>
<input
aria-invalid={false}
aria-labelledby="TextFieldLabel5"
autoFocus={true}
className="ms-TextField-field field-116"
className="ms-TextField-field field-165"
id="TextField3"
name="collectionIdConfirmation"
onBlur={[Function]}
@@ -4105,7 +4131,6 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -4452,6 +4477,35 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#ffffff",
},
@@ -4749,7 +4803,7 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
>
<button
aria-label="Submit"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-126"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-175"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -4767,14 +4821,14 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-105"
className="ms-Button-flexContainer flexContainer-154"
data-automationid="splitbuttonprimary"
>
<span
className="ms-Button-textContainer textContainer-106"
className="ms-Button-textContainer textContainer-155"
>
<span
className="ms-Button-label label-127"
className="ms-Button-label label-176"
id="id__6"
key="id__6"
>
@@ -1,14 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import {
IDropdownOption,
Image,
IPanelProps,
IRenderFunction,
Label,
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
import { IDropdownOption, Image, IPanelProps, IRenderFunction, Label, Stack, Text, TextField } from "@fluentui/react";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, useEffect, useState } from "react";
import * as _ from "underscore";
import AddPropertyIcon from "../../../../images/Add-property.svg";
@@ -1,14 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import {
IDropdownOption,
Image,
IPanelProps,
IRenderFunction,
Label,
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
import { IDropdownOption, Image, IPanelProps, IRenderFunction, Label, Stack, Text, TextField } from "@fluentui/react";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, useEffect, useState } from "react";
import * as _ from "underscore";
import AddPropertyIcon from "../../../../images/Add-property.svg";
@@ -518,7 +518,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -781,6 +780,35 @@ exports[`Table query select Panel should render Default properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"textContainer": Object {
"display": "block",
"flexGrow": 1,
@@ -1066,7 +1094,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<button
aria-label="Close pane"
className="ms-Button ms-Button--icon closePaneBtn root-72"
className="ms-Button ms-Button--icon closePaneBtn root-53"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -1079,18 +1107,17 @@ exports[`Table query select Panel should render Default properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-73"
className="ms-Button-flexContainer flexContainer-54"
data-automationid="splitbuttonprimary"
>
<Component
className="ms-Button-icon icon-75"
className="ms-Button-icon icon-56"
iconName="Cancel"
>
<i
aria-hidden={true}
className="ms-Icon root-37 css-80 ms-Button-icon icon-75"
className="ms-Icon root-37 css-61 ms-Button-icon icon-56"
data-icon-name="Cancel"
role="presentation"
style={
Object {
"fontFamily": "\\"FabricMDL2Icons\\"",
@@ -1148,7 +1175,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<Text>
<span
className="css-81"
className="css-62"
>
Select the columns that you want to query.
</span>
@@ -1163,7 +1190,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
onChange={[Function]}
>
<CheckboxBase
boxSide="start"
checked={true}
id="availableCheckbox"
label="Available Columns"
@@ -1444,33 +1470,32 @@ exports[`Table query select Panel should render Default properly 1`] = `
}
>
<div
className="ms-Checkbox is-checked is-enabled root-82"
className="ms-Checkbox is-checked is-enabled root-63"
>
<Component />
<input
aria-checked="true"
aria-label="Available Columns"
checked={true}
className="input-83"
className="input-64"
data-ktp-execute-target={true}
id="availableCheckbox"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
type="checkbox"
/>
<label
className="ms-Checkbox-label label-84"
className="ms-Checkbox-label label-65"
htmlFor="availableCheckbox"
>
<div
className="ms-Checkbox-checkbox checkbox-85"
className="ms-Checkbox-checkbox checkbox-66"
data-ktp-target={true}
>
<StyledIconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
>
<IconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
styles={[Function]}
theme={
@@ -1749,7 +1774,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<i
aria-hidden={true}
className="ms-Checkbox-checkmark checkmark-88"
className="ms-Checkbox-checkmark checkmark-69"
data-icon-name="CheckMark"
>
@@ -1759,7 +1784,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
</div>
<span
aria-hidden="true"
className="ms-Checkbox-text text-87"
className="ms-Checkbox-text text-68"
>
Available Columns
</span>
@@ -1775,7 +1800,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
onChange={[Function]}
>
<CheckboxBase
boxSide="start"
checked={true}
disabled={false}
label=""
@@ -2056,35 +2080,34 @@ exports[`Table query select Panel should render Default properly 1`] = `
}
>
<div
className="ms-Checkbox is-checked is-enabled root-82"
className="ms-Checkbox is-checked is-enabled root-63"
>
<Component />
<input
aria-checked="true"
aria-disabled={false}
aria-label=""
checked={true}
className="input-83"
className="input-64"
data-ktp-execute-target={true}
disabled={false}
id="checkbox-3"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
type="checkbox"
/>
<label
className="ms-Checkbox-label label-84"
className="ms-Checkbox-label label-65"
htmlFor="checkbox-3"
>
<div
className="ms-Checkbox-checkbox checkbox-85"
className="ms-Checkbox-checkbox checkbox-66"
data-ktp-target={true}
>
<StyledIconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
>
<IconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
styles={[Function]}
theme={
@@ -2363,7 +2386,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<i
aria-hidden={true}
className="ms-Checkbox-checkmark checkmark-88"
className="ms-Checkbox-checkmark checkmark-69"
data-icon-name="CheckMark"
>
@@ -3451,7 +3474,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -3798,6 +3820,35 @@ exports[`Table query select Panel should render Default properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#ffffff",
},
@@ -4095,7 +4146,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<button
aria-label="Submit"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-95"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-76"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -4113,14 +4164,14 @@ exports[`Table query select Panel should render Default properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-73"
className="ms-Button-flexContainer flexContainer-54"
data-automationid="splitbuttonprimary"
>
<span
className="ms-Button-textContainer textContainer-74"
className="ms-Button-textContainer textContainer-55"
>
<span
className="ms-Button-label label-96"
className="ms-Button-label label-77"
id="id__4"
key="id__4"
>

Some files were not shown because too many files have changed in this diff Show More