From 1403973bf3a70854f238b38cc63fdc2986e26a7c Mon Sep 17 00:00:00 2001 From: Eugene Olonov Date: Fri, 4 Mar 2022 14:55:09 -0800 Subject: [PATCH 1/4] Update FluentUI to v8 --- .../packages/adaptive-flow/demo/src/index.js | 4 +- Composer/packages/adaptive-flow/package.json | 2 +- .../AdaptiveFlowEditor.tsx | 2 +- .../components/FlowToolbar.tsx | 14 +- .../hooks/useSelectionEffect.ts | 2 +- .../renderers/EdgeMenu/EdgeMenu.tsx | 3 +- .../renderers/EdgeMenu/createSchemaMenu.tsx | 8 +- .../renderers/NodeMenu.tsx | 6 +- .../renderers/NodeWrapper.tsx | 6 +- .../utils/NodeIndexGetter.ts | 2 +- .../components/IconBrick.tsx | 2 +- .../components/LoopIndicator.tsx | 2 +- .../widgets/ActionCard/CardComment.tsx | 2 +- .../widgets/ActionHeader/icon.tsx | 2 +- .../widgets/DialogRef.tsx | 2 +- .../widgets/TriggerSummary/TriggerSummary.tsx | 2 +- Composer/packages/adaptive-form/package.json | 9 +- .../src/components/AdaptiveForm.tsx | 2 +- .../src/components/AddButton.tsx | 4 +- .../src/components/CollapseField.tsx | 8 +- .../adaptive-form/src/components/Comment.tsx | 4 +- .../src/components/ErrorInfo.tsx | 2 +- .../src/components/ErrorMessage.tsx | 4 +- .../src/components/FieldLabel.tsx | 7 +- .../src/components/FormTitle.tsx | 4 +- .../adaptive-form/src/components/Link.tsx | 2 +- .../src/components/LoadingTimeout.tsx | 2 +- .../src/components/__tests__/Comment.test.tsx | 4 +- .../expressions/ExpressionFieldToolbar.tsx | 4 +- .../expressions/ExpressionSwitchWindow.tsx | 4 +- .../utils/expressionsListMenuUtils.ts | 2 +- .../src/components/fields/ArrayFieldItem.tsx | 8 +- .../src/components/fields/BooleanField.tsx | 3 +- .../src/components/fields/EditableField.tsx | 6 +- .../fields/OneOfField/OneOfField.tsx | 7 +- .../src/components/fields/OneOfField/utils.ts | 2 +- .../fields/OpenObjectField/ObjectItem.tsx | 8 +- .../fields/OpenObjectField/styles.ts | 2 +- .../src/components/fields/PivotFieldsets.tsx | 2 +- .../RecognizerField/RecognizerField.tsx | 10 +- .../src/components/fields/SelectField.tsx | 3 +- .../src/components/fields/StringField.tsx | 2 +- .../components/fields/UnsupportedField.tsx | 2 +- .../fields/__tests__/SelectField.test.tsx | 2 +- .../src/components/fields/styles.ts | 6 +- .../src/components/sharedStyles.ts | 2 +- .../emulatorOpenButton.test.tsx | 4 +- .../triggerCreationModal.test.tsx | 4 +- .../ExternalAdapterSettings.test.tsx | 5 +- ...etAppInfoFromPublishProfileDialog.test.tsx | 2 +- .../RootBotExternalService.test.tsx | 23 +- Composer/packages/client/package.json | 10 +- .../client/src/Onboarding/TeachingBubbles.tsx | 8 +- .../Collapsed/CollapsedWelcomeModal.tsx | 4 +- .../WelcomeModal/Collapsed/styles.ts | 4 +- .../Expanded/ExpandedWelcomeModal.tsx | 4 +- .../WelcomeModal/Expanded/styles.ts | 2 +- .../Onboarding/WelcomeModal/WelcomeModal.tsx | 6 +- .../client/src/Onboarding/content.tsx | 4 +- .../Adapters/TeamsManifestGeneratorModal.tsx | 14 +- .../AddRemoteSkillModal/BrowserModal.tsx | 2 +- .../AddRemoteSkillModal/CreateSkillModal.tsx | 15 +- .../EnableOrchestrator.tsx | 8 +- .../AddRemoteSkillModal/SelectIntent.tsx | 21 +- .../AddRemoteSkillModal/SetAppId.tsx | 20 +- .../src/components/AppComponents/SideBar.tsx | 9 +- .../src/components/AppUpdater/AppUpdater.tsx | 14 +- .../breakingUpdates/version1To2.tsx | 8 +- .../client/src/components/Auth/AuthCard.tsx | 14 +- .../client/src/components/Auth/AuthDialog.tsx | 12 +- .../src/components/Auth/TenantDialog.tsx | 10 +- .../src/components/BotConvertDialog.tsx | 2 +- .../components/BotProjectsSettingsIcon.tsx | 2 +- .../BotRuntimeController/BotController.tsx | 11 +- .../BotControllerMenu.tsx | 13 +- .../BotRuntimeController/BotErrorViewer.tsx | 4 +- .../BotRuntimeOperations.tsx | 4 +- .../BotStatusIndicator.tsx | 2 +- .../BotRuntimeController/ErrorCallout.tsx | 6 +- .../BotRuntimeController/ErrorInfo.tsx | 4 +- .../OpenEmulatorButton.tsx | 4 +- .../OpenWebChatButton.tsx | 2 +- .../BotRuntimeController/loading.tsx | 2 +- .../BotRuntimeController/publishDialog.tsx | 15 +- .../BotRuntimeController/warningInfo.tsx | 4 +- .../client/src/components/CellFocusZone.tsx | 4 +- .../src/components/CollapsableWrapper.tsx | 4 +- .../components/CreationFlow/AddBotModal.tsx | 6 +- .../CreationFlow/AzureBotDialog.tsx | 14 +- .../src/components/CreationFlow/CreateBot.tsx | 20 +- .../CreationFlow/DefineConversation.tsx | 14 +- .../components/CreationFlow/FileSelector.tsx | 22 +- .../CreationFlow/LocationSelectContent.tsx | 2 +- .../components/CreationFlow/OpenProject.tsx | 4 +- .../CreationFlow/TemplateDetailView.tsx | 14 +- .../src/components/DataCollectionDialog.tsx | 6 +- .../src/components/DisableFeatureToolTip.tsx | 4 +- .../DropdownWithAllOption.tsx | 2 +- .../client/src/components/EditableField.tsx | 12 +- .../src/components/ErrorPopup/ErrorPopup.tsx | 4 +- .../src/components/ErrorPopup/styles.js | 4 +- .../src/components/FieldWithCustomButton.tsx | 12 +- .../src/components/GetStarted/GetStarted.tsx | 6 +- .../components/GetStarted/GetStartedLearn.tsx | 4 +- .../GetStarted/GetStartedNextSteps.tsx | 4 +- .../components/GetStarted/GetStartedTask.tsx | 8 +- .../src/components/GetStarted/styles.ts | 4 +- .../packages/client/src/components/Header.tsx | 14 +- .../ImportModal/ImportFailedModal.tsx | 4 +- .../components/ImportModal/ImportModal.tsx | 2 +- .../ImportModal/ImportPromptToSaveModal.tsx | 6 +- .../components/ImportModal/ImportStatus.tsx | 4 +- .../ImportModal/ImportSuccessNotification.tsx | 6 +- .../src/components/ImportModal/style.ts | 2 +- .../client/src/components/InstallDepModal.tsx | 8 +- .../client/src/components/LoadingSpinner.tsx | 4 +- .../ManageService/ManageService.tsx | 18 +- .../src/components/Modal/AlertDialog.tsx | 4 +- .../components/Modal/DisplayManifestModal.tsx | 16 +- .../MultiLanguage/AddLanguageModal.tsx | 20 +- .../MultiLanguage/DeleteLanguageModal.tsx | 10 +- .../src/components/MultiLanguage/styles.ts | 2 +- .../client/src/components/NavItem.tsx | 11 +- .../client/src/components/NavTree.tsx | 14 +- .../Notifications/NotificationButton.tsx | 9 +- .../Notifications/NotificationCard.tsx | 10 +- .../Notifications/NotificationContainer.tsx | 2 +- .../Notifications/NotificationPanel.tsx | 10 +- .../TunnelingSetupNotification.tsx | 6 +- .../__tests__/NotificationButton.test.tsx | 2 +- .../__tests__/NotificationPanel.test.tsx | 2 +- .../Orchestrator/DownloadNotification.tsx | 8 +- .../OrchestratorForSkillsDialog.tsx | 2 +- .../packages/client/src/components/Page.tsx | 4 +- .../client/src/components/Pagination.tsx | 6 +- .../components/ProjectTree/ExpandableNode.tsx | 2 +- .../components/ProjectTree/ProjectTree.tsx | 8 +- .../ProjectTree/ProjectTreeHeader.tsx | 10 +- .../ProjectTree/TreeItemContent.tsx | 3 +- .../src/components/ProjectTree/treeItem.tsx | 28 +- .../components/QnA/CreateQnAFromQnAMaker.tsx | 4 +- .../components/QnA/CreateQnAFromScratch.tsx | 4 +- .../src/components/QnA/CreateQnAFromUrl.tsx | 10 +- .../src/components/QnA/CreateQnAModal.tsx | 18 +- .../QnA/EditQnAFromScratchModal.tsx | 8 +- .../components/QnA/EditQnAFromUrlModal.tsx | 8 +- .../src/components/QnA/ImportQnAFromUrl.tsx | 6 +- .../components/QnA/ImportQnAFromUrlModal.tsx | 10 +- .../client/src/components/QnA/PersonaCard.tsx | 4 +- .../components/QnA/ReplaceQnAFromModal.tsx | 16 +- .../client/src/components/QnA/styles.ts | 6 +- .../client/src/components/QnAIcon.tsx | 2 +- .../src/components/RepairSkillModal.tsx | 6 +- .../client/src/components/Toolbar.tsx | 6 +- .../packages/client/src/components/Tree.tsx | 2 +- .../TriggerCreationModal.tsx | 4 +- .../TriggerDropdownGroup.tsx | 8 +- .../resolveTriggerWidget.tsx | 4 +- .../components/TriggerCreationModal/styles.ts | 4 +- .../WebChat/ActivityHighlightWrapper.tsx | 2 +- .../components/WebChat/WebChatComposer.tsx | 2 +- .../components/WebChat/WebChatContainer.tsx | 2 +- .../src/components/WebChat/WebChatHeader.tsx | 6 +- .../components/WebChat/utils/webChatTheme.ts | 2 +- .../BotController.test.tsx | 2 +- Composer/packages/client/src/constants.tsx | 4 +- .../packages/client/src/pages/about/About.tsx | 4 +- .../packages/client/src/pages/about/styles.js | 2 +- .../src/pages/botProject/AllowedCallers.tsx | 12 +- .../src/pages/botProject/AppIdAndPassword.tsx | 4 +- .../src/pages/botProject/BotLanguage.tsx | 6 +- .../src/pages/botProject/BotProjectInfo.tsx | 6 +- .../pages/botProject/BotProjectSettings.tsx | 2 +- .../botProject/BotProjectsSettingsTabView.tsx | 6 +- .../botProject/CreatePublishProfileDialog.tsx | 10 +- .../src/pages/botProject/DeleteBotButton.tsx | 4 +- .../GetAppInfoFromPublishProfileDialog.tsx | 6 +- .../src/pages/botProject/PublishTargets.tsx | 6 +- .../botProject/RootBotExternalService.tsx | 14 +- .../botProject/SkillBotExternalService.tsx | 4 +- .../pages/botProject/SkillHostEndPoint.tsx | 2 +- .../pages/botProject/adapters/ABSChannels.tsx | 16 +- .../botProject/adapters/AdapterSection.tsx | 4 +- .../adapters/ExternalAdapterModal.tsx | 8 +- .../adapters/ExternalAdapterSettings.tsx | 4 +- .../ProfileFormDialog.tsx | 10 +- .../PublishProfileDialog.tsx | 4 +- .../runtime-settings/RuntimeSettings.tsx | 4 +- .../botProject/runtime-settings/style.ts | 2 +- .../pages/botProject/shared/SettingTitle.tsx | 2 +- .../client/src/pages/botProject/styles.ts | 4 +- .../pages/design/DebugPanel/DebugPanel.tsx | 8 +- .../DebugPanelErrorIndicator.tsx | 2 +- .../DiagnosticsTab/DiagnosticFilters.tsx | 8 +- .../DiagnosticsTab/DiagnosticList.tsx | 18 +- .../DiagnosticsTab/DiagnosticsStatus.tsx | 6 +- .../DiagnosticsTab/DiagnosticsTabContent.tsx | 2 +- .../RuntimeOutputLog/BotProjectsFilter.tsx | 4 +- .../RuntimeOutputLog/RuntimeOutputLog.tsx | 2 +- .../WatchTab/WatchTabContent.tsx | 18 +- .../WebChatLog/LogItemHelpers.tsx | 2 +- .../WebChatLog/WebChatInspectorPane.tsx | 4 +- .../WebChatLog/WebChatLogContent.tsx | 6 +- .../WebChatLog/WebChatNetworkLogItem.tsx | 2 +- .../TabExtensions/WebChatLog/logItemStyles.ts | 2 +- .../WatchVariablePicker.tsx | 6 +- .../components/PickerContextualMenuItem.tsx | 8 +- .../utils/components/PropertyTreeItem.tsx | 6 +- .../src/pages/design/ManifestEditor.tsx | 8 +- .../src/pages/design/PropertyEditorHeader.tsx | 6 +- .../client/src/pages/design/VisualEditor.tsx | 2 +- .../src/pages/design/VisualPanelHeader.tsx | 4 +- .../src/pages/design/WarningMessage.tsx | 6 +- .../src/pages/design/createDialogModal.tsx | 8 +- .../exportSkillModal/content/AddCallers.tsx | 8 +- .../exportSkillModal/content/Description.tsx | 2 +- .../content/SelectDialogs.tsx | 2 +- .../exportSkillModal/content/SelectItems.tsx | 10 +- .../content/SelectProfile.tsx | 10 +- .../content/SelectTriggers.tsx | 2 +- .../pages/design/exportSkillModal/index.tsx | 6 +- .../pages/design/exportSkillModal/styles.ts | 4 +- .../client/src/pages/design/styles.ts | 4 +- .../extensions/ExtensionSearchResults.tsx | 8 +- .../src/pages/extensions/ExtensionsPage.tsx | 8 +- .../pages/extensions/ExtensionsSettings.tsx | 2 +- .../extensions/InstallExtensionDialog.tsx | 6 +- .../CreateFormDialogSchemaModal.tsx | 8 +- .../src/pages/form-dialog/FormDialogPage.tsx | 4 +- .../form-dialog/FormDialogSchemaList.tsx | 17 +- .../FormDialogSchemaListHeader.tsx | 20 +- .../VisualFormDialogSchemaEditor.tsx | 8 +- .../client/src/pages/home/CardWidget.tsx | 6 +- .../packages/client/src/pages/home/Home.tsx | 8 +- .../client/src/pages/home/RecentBotList.tsx | 17 +- .../client/src/pages/home/WhatsNewsList.tsx | 2 +- .../packages/client/src/pages/home/styles.ts | 8 +- .../src/pages/knowledge-base/QnAPage.tsx | 2 +- .../src/pages/knowledge-base/TabHeader.tsx | 2 +- .../src/pages/knowledge-base/code-editor.tsx | 2 +- .../client/src/pages/knowledge-base/styles.ts | 8 +- .../src/pages/knowledge-base/table-view.tsx | 20 +- .../src/pages/language-generation/LGPage.tsx | 2 +- .../pages/language-generation/table-view.tsx | 16 +- .../pages/language-understanding/LUPage.tsx | 2 +- .../language-understanding/diff-editor.tsx | 2 +- .../pages/language-understanding/styles.ts | 4 +- .../language-understanding/table-view.tsx | 16 +- .../src/pages/publish/BotStatusList.tsx | 18 +- .../client/src/pages/publish/LogDialog.tsx | 4 +- .../src/pages/publish/Notifications.tsx | 8 +- .../client/src/pages/publish/Publish.tsx | 4 +- .../src/pages/publish/PublishDialog.tsx | 8 +- .../src/pages/publish/PublishStatusList.tsx | 16 +- .../src/pages/publish/PublishToolbar.tsx | 6 +- .../components/projectList/ListItem.tsx | 4 +- .../components/projectList/ProjectList.tsx | 2 +- .../pages/publish/pullConfirmationDialog.tsx | 4 +- .../src/pages/publish/pullFailedDialog.tsx | 6 +- .../client/src/pages/publish/pullStatus.tsx | 6 +- .../client/src/pages/publish/styles.ts | 4 +- .../client/src/pages/publish/targetList.tsx | 6 +- .../setting/app-settings/AppSettings.tsx | 8 +- .../app-settings/FeatureFlagCheckBox.tsx | 4 +- .../setting/app-settings/SettingDropdown.tsx | 6 +- .../setting/app-settings/SettingToggle.tsx | 6 +- .../setting/app-settings/TemplateFeedForm.tsx | 8 +- .../setting/app-settings/electronSettings.tsx | 2 +- .../setting/app-settings/fontSettings.tsx | 8 +- .../src/pages/setting/app-settings/styles.ts | 6 +- .../dialog-settings/DialogSettings.tsx | 8 +- .../pages/setting/dialog-settings/style.ts | 2 +- .../client/src/plugin-host-preload.ts | 2 +- Composer/packages/client/src/setupIcons.tsx | 4 +- Composer/packages/client/src/styles.ts | 2 +- .../packages/client/src/types/window.d.ts | 2 +- .../packages/client/src/utils/zIndices.ts | 2 +- Composer/packages/form-dialogs/package.json | 6 +- .../components/FormDialogPropertiesEditor.tsx | 12 +- .../src/components/common/Collapsible.tsx | 6 +- .../components/common/CommandBarUpload.tsx | 2 +- .../src/components/common/FieldLabel.tsx | 4 +- .../src/components/common/HelpTooltip.tsx | 4 +- .../src/components/common/ValuePicker.tsx | 6 +- .../property/FormDialogPropertyCard.tsx | 16 +- .../property/FormDialogSchemaDetails.tsx | 2 +- .../property/PropertyCardContent.tsx | 6 +- .../src/components/property/PropertyList.tsx | 6 +- .../components/property/PropertyListItem.tsx | 13 +- .../property/PropertyTypeSelector.tsx | 4 +- .../property/RequiredPriorityIndicator.tsx | 4 +- .../property/examples/EnumExampleContent.tsx | 8 +- .../property/examples/EnumExampleList.tsx | 8 +- .../examples/StringExampleContent.tsx | 8 +- .../src/utils/hooks/useUndoKeyBinding.ts | 2 +- Composer/packages/intellisense/package.json | 2 +- .../src/components/CompletionElement.tsx | 5 +- .../__tests__/Intellisense.test.tsx | 2 +- .../packages/lib/code-editor/package.json | 2 +- .../lib/code-editor/src/BaseEditor.tsx | 6 +- .../packages/lib/code-editor/src/LuEditor.tsx | 10 +- .../src/components/EditorPopExpandDialog.tsx | 2 +- .../src/components/HelpIconTooltip.tsx | 2 +- .../src/components/ItemWithTooltip.tsx | 4 +- .../src/components/toolbar/FieldToolbar.tsx | 8 +- .../components/toolbar/PropertyTreeItem.tsx | 6 +- .../components/toolbar/ToolbarButtonMenu.tsx | 18 +- .../hooks/useEditorToolbarPopExpandItem.tsx | 4 +- .../src/hooks/useNoSearchResultMenuItem.tsx | 8 +- .../hooks/useSearchableMenuListCallback.tsx | 10 +- .../lib/code-editor/src/lg/LgCodeEditor.tsx | 10 +- .../src/lg/LgSpeechModalityToolbar.tsx | 6 +- .../lib/code-editor/src/lg/ModalityPivot.tsx | 12 +- .../src/lg/__tests__/ModalityPivot.test.tsx | 4 +- .../modalityEditors/AttachmentArrayEditor.tsx | 10 +- .../AttachmentModalityEditor.tsx | 2 +- .../ModalityEditorContainer.tsx | 14 +- .../modalityEditors/ModalityEditorTitle.tsx | 4 +- .../modalityEditors/SpeechModalityEditor.tsx | 4 +- .../lg/modalityEditors/StringArrayEditor.tsx | 6 +- .../lg/modalityEditors/StringArrayItem.tsx | 10 +- .../code-editor/src/lu/DefineEntityButton.tsx | 8 +- .../code-editor/src/lu/InsertEntityButton.tsx | 6 +- .../code-editor/src/lu/LuEditorToolbar.tsx | 4 +- .../lib/code-editor/src/lu/LuLabelingMenu.tsx | 4 +- .../lu/__tests__/DefineEntityButton.test.tsx | 16 +- .../lu/dialogs/ListEntityCreationDialog.tsx | 18 +- .../src/lu/hooks/useLabelingMenuItems.tsx | 10 +- .../lib/code-editor/src/utils/withTooltip.tsx | 2 +- .../src/rules/office-ui-import-scope.js | 4 +- Composer/packages/lib/shared/package.json | 2 +- Composer/packages/lib/ui-shared/package.json | 4 +- .../src/components/ConfirmDialog.tsx | 10 +- .../ui-shared/src/components/CopyableText.tsx | 6 +- .../src/components/DialogWrapper.tsx | 10 +- .../DisplayMarkdownDialog.tsx | 6 +- .../lib/ui-shared/src/components/Field.tsx | 10 +- .../ui-shared/src/components/HelpTooltip.tsx | 12 +- .../lib/ui-shared/src/components/IconMenu.tsx | 14 +- .../src/components/LoadingSpinner.tsx | 2 +- .../ProvisionHandoff/ProvisionHandoff.tsx | 14 +- .../ui-shared/src/components/SectionTitle.tsx | 4 +- .../lib/ui-shared/src/components/Toolbar.tsx | 6 +- .../lib/ui-shared/src/components/tags/Tag.tsx | 4 +- .../src/components/tags/TagInput.tsx | 2 +- .../ui-shared/src/styled/styledComponents.tsx | 2 +- .../test-utils/src/react/jest.config.ts | 4 +- .../packages/test-utils/src/react/setup.ts | 2 +- .../packages/ui-plugins/composer/package.json | 7 +- .../ui-plugins/cross-trained/jest.config.js | 4 +- .../packages/ui-plugins/example/package.json | 7 +- Composer/packages/ui-plugins/lg/package.json | 2 +- .../packages/ui-plugins/lg/src/LgField.tsx | 8 +- .../ui-plugins/lg/src/LgWidget/LgWidget.tsx | 4 +- .../ui-plugins/orchestrator/jest.config.js | 4 +- .../packages/ui-plugins/prompts/package.json | 7 +- .../src/Fields/ValueRefField.tsx | 3 +- .../ui-plugins/select-dialog/package.json | 7 +- .../select-dialog/src/DialogOptionsField.tsx | 6 +- .../select-dialog/src/SelectDialog.tsx | 2 +- .../select-dialog/src/SelectDialogMenu.tsx | 12 +- .../src/__tests__/DialogOptions.test.tsx | 4 +- .../select-skill-dialog/package.json | 7 +- .../select-skill-dialog/src/ComboBoxField.tsx | 10 +- .../src/SelectSkillDialogField.tsx | 4 +- .../src/SkillEndpointField.tsx | 4 +- .../src/__tests__/SelectSkillDialog.test.tsx | 2 +- .../src/__tests__/SkillEndpointField.test.tsx | 12 +- Composer/yarn.lock | 569 ++++-------------- extensions/azurePublish/package.json | 2 +- .../src/components/ChooseProvisionAction.tsx | 10 +- .../src/components/ChooseResourcesList.tsx | 12 +- .../src/components/ResourceGroupPicker.tsx | 8 +- .../src/components/azureProvisionDialog.tsx | 10 +- extensions/azurePublishNew/package.json | 4 +- .../src/components/ChooseProvisionAction.tsx | 2 +- .../footers/WizardFooter.tsx | 2 +- .../steps/ChooseResourcesStep.tsx | 6 +- .../steps/CreateResourceInstructionsStep.tsx | 6 +- .../steps/HandOffInstructionsStep.tsx | 4 +- .../steps/ImportInstructionsStep.tsx | 4 +- .../steps/ResourceConfigurationStep.tsx | 4 +- .../steps/ReviewResourcesStep.tsx | 4 +- .../OperatingSystemChoiceGroup.tsx | 2 +- .../ResourceNameTextField.tsx | 2 +- .../components/shared/ChooseResourcesList.tsx | 12 +- .../shared/jsonEditor/JsonEditor.tsx | 4 +- .../searchableDropdown/SearchableDropdown.tsx | 34 +- .../SearchableDropdownTextField.tsx | 2 +- .../searchableDropdown/hooks/useSelection.ts | 2 +- .../shared/userPersona/UserPersona.tsx | 2 +- .../src/components/shared/wizard/Wizard.tsx | 2 +- extensions/packageManager/package.json | 4 +- .../src/components/FeedModal.tsx | 2 +- .../src/components/ImportDialog.tsx | 2 +- .../src/components/LibraryList.tsx | 2 +- .../src/components/WorkingModal.tsx | 2 +- .../src/components/projectList/ListItem.tsx | 4 +- .../components/projectList/ProjectList.tsx | 2 +- .../packageManager/src/components/styles.ts | 4 +- .../packageManager/src/pages/Library.tsx | 2 +- extensions/packageManager/yarn.lock | 182 +++++- extensions/pvaPublish/package.json | 5 +- .../pvaPublish/src/components/pvaDialog.tsx | 2 +- extensions/scripts/build.js | 2 +- extensions/scripts/create.js | 2 +- 406 files changed, 1545 insertions(+), 1738 deletions(-) diff --git a/Composer/packages/adaptive-flow/demo/src/index.js b/Composer/packages/adaptive-flow/demo/src/index.js index c9f24d18fe..9dc1cba52b 100644 --- a/Composer/packages/adaptive-flow/demo/src/index.js +++ b/Composer/packages/adaptive-flow/demo/src/index.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import { render } from 'react-dom'; -import { Nav } from 'office-ui-fabric-react'; -import { initializeIcons } from 'office-ui-fabric-react/lib/Icons'; +import { Nav } from '@fluentui/react'; +import { initializeIcons } from '@fluentui/react/lib/Icons'; import { EditorConfig } from '../../src/editors/editorConfig'; diff --git a/Composer/packages/adaptive-flow/package.json b/Composer/packages/adaptive-flow/package.json index a0e90b7726..7d67855a92 100644 --- a/Composer/packages/adaptive-flow/package.json +++ b/Composer/packages/adaptive-flow/package.json @@ -35,7 +35,7 @@ "dagre": "^0.8.4", "dagre-d3": "^0.6.3", "lodash": "^4.17.19", - "office-ui-fabric-react": "7.71.0", + "@fluentui/react": "^8.57.1", "prop-types": "^15.7.2", "react-measure": "^2.3.0", "source-map-loader": "^0.2.4", diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/AdaptiveFlowEditor.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/AdaptiveFlowEditor.tsx index e1c9c725a5..9641c65ffc 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/AdaptiveFlowEditor.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/AdaptiveFlowEditor.tsx @@ -9,7 +9,7 @@ import isEqual from 'lodash/isEqual'; import formatMessage from 'format-message'; import { DialogFactory, MicrosoftIDialog, SchemaDefinitions } from '@bfc/shared'; import { useShellApi, JSONSchema7, FlowUISchema, FlowWidget } from '@bfc/extension-client'; -import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection'; +import { MarqueeSelection } from '@fluentui/react/lib/MarqueeSelection'; import { NodeEventTypes } from '../adaptive-flow-renderer/constants/NodeEventTypes'; import { AdaptiveDialog } from '../adaptive-flow-renderer/adaptive/AdaptiveDialog'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/components/FlowToolbar.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/components/FlowToolbar.tsx index 9ee8ba2b57..473ec0ba6f 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/components/FlowToolbar.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/components/FlowToolbar.tsx @@ -5,14 +5,14 @@ import { jsx, css } from '@emotion/core'; import { useRef, useEffect, ReactNode } from 'react'; import { ZoomInfo } from '@bfc/shared'; -import { IconButton, IButtonStyles } from 'office-ui-fabric-react/lib/Button'; -import { IIconProps } from 'office-ui-fabric-react/lib/Icon'; +import { IconButton, IButtonStyles } from '@fluentui/react/lib/Button'; +import { IIconProps } from '@fluentui/react/lib/Icon'; import formatMessage from 'format-message'; -import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip'; -import { DirectionalHint } from 'office-ui-fabric-react/lib/Callout'; -import { NeutralColors } from '@uifabric/fluent-theme'; -import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone'; -import { FocusZoneTabbableElements } from 'office-ui-fabric-react/lib/FocusZone'; +import { TooltipHost } from '@fluentui/react/lib/Tooltip'; +import { DirectionalHint } from '@fluentui/react/lib/Callout'; +import { NeutralColors } from '@fluentui/theme'; +import { FocusZone } from '@fluentui/react/lib/FocusZone'; +import { FocusZoneTabbableElements } from '@fluentui/react/lib/FocusZone'; import { scrollNodeIntoView } from '../utils/scrollNodeIntoView'; import { AttrNames } from '../constants/ElementAttributes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/hooks/useSelectionEffect.ts b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/hooks/useSelectionEffect.ts index 412f07d7ad..f0821d753d 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/hooks/useSelectionEffect.ts +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/hooks/useSelectionEffect.ts @@ -2,7 +2,7 @@ // Licensed under the MIT License. import { useRef, useState, useEffect } from 'react'; -import { Selection } from 'office-ui-fabric-react/lib/MarqueeSelection'; +import { Selection } from '@fluentui/react/lib/MarqueeSelection'; import { ShellApi } from '@bfc/shared'; import isEqual from 'lodash/isEqual'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/EdgeMenu.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/EdgeMenu.tsx index 0cc642f277..0da171e3c4 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/EdgeMenu.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/EdgeMenu.tsx @@ -6,9 +6,10 @@ import { jsx } from '@emotion/core'; import { useContext, useState } from 'react'; import formatMessage from 'format-message'; import { DefinitionSummary } from '@bfc/shared'; -import { TooltipHost, DirectionalHint } from 'office-ui-fabric-react/lib/Tooltip'; +import { TooltipHost } from '@fluentui/react/lib/Tooltip'; import { useMenuConfig } from '@bfc/extension-client'; import { IconMenu } from '@bfc/ui-shared'; +import { DirectionalHint } from '@fluentui/react'; // TODO: leak of visual-sdk domain (EdgeAddButtonSize) import { EdgeAddButtonSize } from '../../../adaptive-flow-renderer/constants/ElementSizes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/createSchemaMenu.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/createSchemaMenu.tsx index c208999d3a..1b139c55b0 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/createSchemaMenu.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/EdgeMenu/createSchemaMenu.tsx @@ -6,14 +6,14 @@ import { jsx, css } from '@emotion/core'; import { IContextualMenuItem, ContextualMenuItemType, -} from 'office-ui-fabric-react/lib/components/ContextualMenu/ContextualMenu.types'; -import { NeutralColors } from '@uifabric/fluent-theme'; +} from '@fluentui/react/lib/components/ContextualMenu/ContextualMenu.types'; +import { NeutralColors } from '@fluentui/theme'; import { SDKKinds, DefinitionSummary, DisabledMenuActions } from '@bfc/shared'; -import { FontIcon } from 'office-ui-fabric-react/lib/Icon'; +import { FontIcon } from '@fluentui/react/lib/Icon'; import formatMessage from 'format-message'; import { MenuUISchema, MenuOptions } from '@bfc/extension-client'; import set from 'lodash/set'; -import { ITooltipHostStyles, TooltipHost } from 'office-ui-fabric-react/lib/Tooltip'; +import { ITooltipHostStyles, TooltipHost } from '@fluentui/react/lib/Tooltip'; import { MenuEventTypes } from '../../constants/MenuTypes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeMenu.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeMenu.tsx index 4ff9609c11..308542c87c 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeMenu.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeMenu.tsx @@ -5,10 +5,10 @@ import { jsx } from '@emotion/core'; import { useContext } from 'react'; import formatMessage from 'format-message'; -import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip'; +import { TooltipHost } from '@fluentui/react/lib/Tooltip'; import { IconMenu } from '@bfc/ui-shared'; -import { getFocusStyle, getTheme } from 'office-ui-fabric-react/lib/Styling'; -import { FluentTheme } from '@uifabric/fluent-theme'; +import { getFocusStyle, getTheme } from '@fluentui/react/lib/Styling'; +import { FluentTheme } from '@fluentui/theme'; import { NodeEventTypes, EditorEventHandler } from '../../adaptive-flow-renderer/constants/NodeEventTypes'; import { MenuTypes } from '../constants/MenuTypes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeWrapper.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeWrapper.tsx index 8ae56c2cda..ed886848a2 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeWrapper.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/renderers/NodeWrapper.tsx @@ -8,9 +8,9 @@ import { jsx, css } from '@emotion/core'; import { useContext, useCallback, useEffect } from 'react'; import { generateActionTitle, PromptTab } from '@bfc/shared'; import { useShellApi } from '@bfc/extension-client'; -import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip'; -import { DirectionalHint } from 'office-ui-fabric-react/lib/Callout'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { TooltipHost } from '@fluentui/react/lib/Tooltip'; +import { DirectionalHint } from '@fluentui/react/lib/Callout'; +import { Icon } from '@fluentui/react/lib/Icon'; import { AttrNames } from '../constants/ElementAttributes'; import { NodeRendererContext } from '../contexts/NodeRendererContext'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/utils/NodeIndexGetter.ts b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/utils/NodeIndexGetter.ts index f94534be5d..be509d55a1 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-editor/utils/NodeIndexGetter.ts +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-editor/utils/NodeIndexGetter.ts @@ -1,7 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -import { IObjectWithKey } from 'office-ui-fabric-react/lib/MarqueeSelection'; +import { IObjectWithKey } from '@fluentui/react/lib/MarqueeSelection'; export class NodeIndexGenerator { private _id = 0; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/IconBrick.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/IconBrick.tsx index a9c1129d08..47486fbee3 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/IconBrick.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/IconBrick.tsx @@ -3,7 +3,7 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { Icon } from '@fluentui/react/lib/Icon'; import { IconBrickSize } from '../constants/ElementSizes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/LoopIndicator.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/LoopIndicator.tsx index 2102f927f5..d33ecb1686 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/LoopIndicator.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/components/LoopIndicator.tsx @@ -3,7 +3,7 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { Icon } from '@fluentui/react/lib/Icon'; import { LoopIconSize } from '../constants/ElementSizes'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionCard/CardComment.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionCard/CardComment.tsx index c03144566f..d9f4d4ad6c 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionCard/CardComment.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionCard/CardComment.tsx @@ -5,7 +5,7 @@ import { jsx, css } from '@emotion/core'; import React from 'react'; import { TruncatedText } from '@bfc/ui-shared'; -import { NeutralColors } from '@uifabric/fluent-theme'; +import { NeutralColors } from '@fluentui/theme'; type CardCommentProps = { comment?: string; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionHeader/icon.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionHeader/icon.tsx index c96c685545..542530f5b9 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionHeader/icon.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/ActionHeader/icon.tsx @@ -3,7 +3,7 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; -import { Icon as FabricIcon } from 'office-ui-fabric-react/lib/Icon'; +import { Icon as FabricIcon } from '@fluentui/react/lib/Icon'; import { iconCss } from './iconStyles'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/DialogRef.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/DialogRef.tsx index d522ffcc7a..dd85356481 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/DialogRef.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/DialogRef.tsx @@ -9,7 +9,7 @@ import { LinkBtn, FixedInfo } from '@bfc/ui-shared'; import { useContext, useMemo } from 'react'; import formatMessage from 'format-message'; import { WidgetContainerProps, WidgetComponent } from '@bfc/extension-client'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { Icon } from '@fluentui/react/lib/Icon'; import { NodeEventTypes } from '../constants/NodeEventTypes'; import { RendererContext } from '../contexts/RendererContext'; diff --git a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/TriggerSummary/TriggerSummary.tsx b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/TriggerSummary/TriggerSummary.tsx index 6ae3f09ae2..5ce281797f 100644 --- a/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/TriggerSummary/TriggerSummary.tsx +++ b/Composer/packages/adaptive-flow/src/adaptive-flow-renderer/widgets/TriggerSummary/TriggerSummary.tsx @@ -5,7 +5,7 @@ import { conceptLabels, getFriendlyName } from '@bfc/shared'; import { jsx } from '@emotion/core'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { Icon } from '@fluentui/react/lib/Icon'; import { triggerContainerStyle, diff --git a/Composer/packages/adaptive-form/package.json b/Composer/packages/adaptive-form/package.json index 58c8e9685e..8ee748a35e 100644 --- a/Composer/packages/adaptive-form/package.json +++ b/Composer/packages/adaptive-form/package.json @@ -18,11 +18,10 @@ }, "license": "MIT", "peerDependencies": { - "@uifabric/fluent-theme": "^7.1.4", - "@uifabric/icons": "^7.3.0", - "@uifabric/styling": "^7.7.4", + "@fluentui/theme": "2.5.0", + "@fluentui/style-utilities": "^8.6.0", "format-message": "^6.2.3", - "office-ui-fabric-react": "7.71.0", + "@fluentui/react": "^8.57.1", "react": "16.13.1", "react-dom": "16.13.1" }, @@ -30,7 +29,7 @@ "@botframework-composer/test-utils": "*", "@types/lodash": "^4.14.149", "@types/react": "16.9.23", - "office-ui-fabric-react": "7.71.0" + "@fluentui/react": "^8.57.1" }, "dependencies": { "@bfc/built-in-functions": "*", diff --git a/Composer/packages/adaptive-form/src/components/AdaptiveForm.tsx b/Composer/packages/adaptive-form/src/components/AdaptiveForm.tsx index 65f80a473a..705fe95ee8 100644 --- a/Composer/packages/adaptive-form/src/components/AdaptiveForm.tsx +++ b/Composer/packages/adaptive-form/src/components/AdaptiveForm.tsx @@ -7,7 +7,7 @@ import React from 'react'; import { FormErrors, JSONSchema7, UIOptions } from '@bfc/extension-client'; import ErrorBoundary from 'react-error-boundary'; import formatMessage from 'format-message'; -import { FontSizes } from '@uifabric/fluent-theme'; +import { FontSizes } from '@fluentui/theme'; import AdaptiveFormContext from '../AdaptiveFormContext'; diff --git a/Composer/packages/adaptive-form/src/components/AddButton.tsx b/Composer/packages/adaptive-form/src/components/AddButton.tsx index 9e7352d07d..fc41f9618f 100644 --- a/Composer/packages/adaptive-form/src/components/AddButton.tsx +++ b/Composer/packages/adaptive-form/src/components/AddButton.tsx @@ -3,8 +3,8 @@ import React from 'react'; import styled from '@emotion/styled'; -import { ActionButton, IButtonStyles } from 'office-ui-fabric-react/lib/components/Button'; -import { FluentTheme } from '@uifabric/fluent-theme'; +import { ActionButton, IButtonStyles } from '@fluentui/react/lib/components/Button'; +import { FluentTheme } from '@fluentui/theme'; import formatMessage from 'format-message'; export const ButtonContainer = styled.div({ diff --git a/Composer/packages/adaptive-form/src/components/CollapseField.tsx b/Composer/packages/adaptive-form/src/components/CollapseField.tsx index 2bf35af615..263a9590bd 100644 --- a/Composer/packages/adaptive-form/src/components/CollapseField.tsx +++ b/Composer/packages/adaptive-form/src/components/CollapseField.tsx @@ -4,10 +4,10 @@ /** @jsx jsx */ import { css, jsx } from '@emotion/core'; import { Fragment, useState, useEffect, useLayoutEffect, useRef } from 'react'; -import { FontSizes, FontWeights } from 'office-ui-fabric-react/lib/Styling'; -import { IconButton } from 'office-ui-fabric-react/lib/Button'; -import { Label } from 'office-ui-fabric-react/lib/Label'; -import { NeutralColors } from '@uifabric/fluent-theme'; +import { FontSizes, FontWeights } from '@fluentui/react/lib/Styling'; +import { IconButton } from '@fluentui/react/lib/Button'; +import { Label } from '@fluentui/react/lib/Label'; +import { NeutralColors } from '@fluentui/theme'; import formatMessage from 'format-message'; const styles = { diff --git a/Composer/packages/adaptive-form/src/components/Comment.tsx b/Composer/packages/adaptive-form/src/components/Comment.tsx index d529b3e2a4..3e6fc765c6 100644 --- a/Composer/packages/adaptive-form/src/components/Comment.tsx +++ b/Composer/packages/adaptive-form/src/components/Comment.tsx @@ -6,8 +6,8 @@ import { jsx, css } from '@emotion/core'; import React, { useState, useCallback, useRef, useEffect } from 'react'; import formatMessage from 'format-message'; import { IconMenu } from '@bfc/ui-shared'; -import { TextField, ITextField } from 'office-ui-fabric-react/lib/TextField'; -import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu'; +import { TextField, ITextField } from '@fluentui/react/lib/TextField'; +import { IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu'; import { ExpandableText } from './ExpandableText'; diff --git a/Composer/packages/adaptive-form/src/components/ErrorInfo.tsx b/Composer/packages/adaptive-form/src/components/ErrorInfo.tsx index 17ed5a19c8..ab67a90350 100644 --- a/Composer/packages/adaptive-form/src/components/ErrorInfo.tsx +++ b/Composer/packages/adaptive-form/src/components/ErrorInfo.tsx @@ -3,7 +3,7 @@ import React from 'react'; import formatMessage from 'format-message'; import { FallbackProps } from 'react-error-boundary'; -import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar'; +import { MessageBar, MessageBarType } from '@fluentui/react/lib/MessageBar'; const ErrorInfo: React.FC = ({ componentStack, error }) => (
diff --git a/Composer/packages/adaptive-form/src/components/ErrorMessage.tsx b/Composer/packages/adaptive-form/src/components/ErrorMessage.tsx index 16b4076b09..dc6455b5d8 100644 --- a/Composer/packages/adaptive-form/src/components/ErrorMessage.tsx +++ b/Composer/packages/adaptive-form/src/components/ErrorMessage.tsx @@ -2,8 +2,8 @@ // Licensed under the MIT License. import React from 'react'; -import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar'; -import { Link } from 'office-ui-fabric-react/lib/Link'; +import { MessageBar, MessageBarType } from '@fluentui/react/lib/MessageBar'; +import { Link } from '@fluentui/react/lib/Link'; import formatMessage from 'format-message'; interface ErrorMessageProps { diff --git a/Composer/packages/adaptive-form/src/components/FieldLabel.tsx b/Composer/packages/adaptive-form/src/components/FieldLabel.tsx index 22aa56b9b2..62574be164 100644 --- a/Composer/packages/adaptive-form/src/components/FieldLabel.tsx +++ b/Composer/packages/adaptive-form/src/components/FieldLabel.tsx @@ -3,12 +3,13 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; import React, { useRef } from 'react'; -import { DirectionalHint, TooltipDelay } from 'office-ui-fabric-react/lib/Tooltip'; -import { Label } from 'office-ui-fabric-react/lib/Label'; +import { TooltipDelay } from '@fluentui/react/lib/Tooltip'; +import { Label } from '@fluentui/react/lib/Label'; import formatMessage from 'format-message'; import { useShellApi } from '@bfc/extension-client'; import { HelpTooltip } from '@bfc/ui-shared'; -import { FontSizes } from 'office-ui-fabric-react/lib/Styling'; +import { FontSizes } from '@fluentui/react/lib/Styling'; +import { DirectionalHint } from '@fluentui/react'; import { useAdaptiveFormContext } from '../AdaptiveFormContext'; diff --git a/Composer/packages/adaptive-form/src/components/FormTitle.tsx b/Composer/packages/adaptive-form/src/components/FormTitle.tsx index 63e8b93369..e10348723d 100644 --- a/Composer/packages/adaptive-form/src/components/FormTitle.tsx +++ b/Composer/packages/adaptive-form/src/components/FormTitle.tsx @@ -4,8 +4,8 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; import React, { useMemo, useRef } from 'react'; -import { FontWeights } from '@uifabric/styling'; -import { FontSizes } from '@uifabric/fluent-theme'; +import { FontWeights } from '@fluentui/style-utilities'; +import { FontSizes } from '@fluentui/theme'; import formatMessage from 'format-message'; import { UIOptions, JSONSchema7, useShellApi, useRecognizerConfig } from '@bfc/extension-client'; import { css } from '@emotion/core'; diff --git a/Composer/packages/adaptive-form/src/components/Link.tsx b/Composer/packages/adaptive-form/src/components/Link.tsx index ea13897f79..708fefc5e7 100644 --- a/Composer/packages/adaptive-form/src/components/Link.tsx +++ b/Composer/packages/adaptive-form/src/components/Link.tsx @@ -5,7 +5,7 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; import React from 'react'; -import { Link as FluentLink, ILinkProps } from 'office-ui-fabric-react/lib/Link'; +import { Link as FluentLink, ILinkProps } from '@fluentui/react/lib/Link'; import { focusBorder } from './sharedStyles'; diff --git a/Composer/packages/adaptive-form/src/components/LoadingTimeout.tsx b/Composer/packages/adaptive-form/src/components/LoadingTimeout.tsx index 2be3745128..f5dd810975 100644 --- a/Composer/packages/adaptive-form/src/components/LoadingTimeout.tsx +++ b/Composer/packages/adaptive-form/src/components/LoadingTimeout.tsx @@ -6,7 +6,7 @@ import { jsx } from '@emotion/core'; import React, { useState, useEffect } from 'react'; import { css } from '@emotion/core'; import formatMessage from 'format-message'; -import { Spinner } from 'office-ui-fabric-react/lib/Spinner'; +import { Spinner } from '@fluentui/react/lib/Spinner'; const container = css` height: 100%; diff --git a/Composer/packages/adaptive-form/src/components/__tests__/Comment.test.tsx b/Composer/packages/adaptive-form/src/components/__tests__/Comment.test.tsx index 9734fb6f9c..603e0a7aa5 100644 --- a/Composer/packages/adaptive-form/src/components/__tests__/Comment.test.tsx +++ b/Composer/packages/adaptive-form/src/components/__tests__/Comment.test.tsx @@ -55,7 +55,7 @@ describe('', () => { it('can delete a comment', async () => { const comment = faker.lorem.paragraph(); - const { findByLabelText, findByPlaceholderText, findByText, queryByTestId } = render( + const { findByLabelText, findByPlaceholderText, queryByTestId, findByRole } = render( ); @@ -68,7 +68,7 @@ describe('', () => { userEvent.click(menu); }); - const deleteBtn = await findByText('Delete'); + const deleteBtn = await findByRole('menuitem', { name: 'Delete' }); act(() => { userEvent.click(deleteBtn); }); diff --git a/Composer/packages/adaptive-form/src/components/expressions/ExpressionFieldToolbar.tsx b/Composer/packages/adaptive-form/src/components/expressions/ExpressionFieldToolbar.tsx index 3343a24702..c9cd13644d 100644 --- a/Composer/packages/adaptive-form/src/components/expressions/ExpressionFieldToolbar.tsx +++ b/Composer/packages/adaptive-form/src/components/expressions/ExpressionFieldToolbar.tsx @@ -1,9 +1,9 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -import { DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu'; +import { DirectionalHint } from '@fluentui/react/lib/ContextualMenu'; import React from 'react'; -import { Callout } from 'office-ui-fabric-react/lib/Callout'; +import { Callout } from '@fluentui/react/lib/Callout'; import { FieldToolbar } from '@bfc/code-editor'; import { useShellApi } from '@bfc/extension-client'; diff --git a/Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx b/Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx index cb43c3efba..c32b016f6f 100644 --- a/Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx +++ b/Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx @@ -3,10 +3,10 @@ /** @jsx jsx */ import { css, jsx } from '@emotion/core'; -import { FontIcon } from 'office-ui-fabric-react/lib/Icon'; +import { FontIcon } from '@fluentui/react/lib/Icon'; import React from 'react'; import formatMessage from 'format-message'; -import { FluentTheme, SharedColors } from '@uifabric/fluent-theme'; +import { FluentTheme, SharedColors } from '@fluentui/theme'; const styles = { fieldTypeText: css` diff --git a/Composer/packages/adaptive-form/src/components/expressions/utils/expressionsListMenuUtils.ts b/Composer/packages/adaptive-form/src/components/expressions/utils/expressionsListMenuUtils.ts index af1503a91d..21a7777732 100644 --- a/Composer/packages/adaptive-form/src/components/expressions/utils/expressionsListMenuUtils.ts +++ b/Composer/packages/adaptive-form/src/components/expressions/utils/expressionsListMenuUtils.ts @@ -1,7 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -import { ContextualMenuItemType, IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu'; +import { ContextualMenuItemType, IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu'; type ExpressionGroupingType = { key: string; diff --git a/Composer/packages/adaptive-form/src/components/fields/ArrayFieldItem.tsx b/Composer/packages/adaptive-form/src/components/fields/ArrayFieldItem.tsx index a04b9aef84..ce31d8f49d 100644 --- a/Composer/packages/adaptive-form/src/components/fields/ArrayFieldItem.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/ArrayFieldItem.tsx @@ -4,10 +4,10 @@ import { jsx } from '@emotion/core'; import React, { useEffect, useRef } from 'react'; import { FieldProps } from '@bfc/extension-client'; -import { NeutralColors } from '@uifabric/fluent-theme'; -import { IconButton } from 'office-ui-fabric-react/lib/Button'; -import { FontSizes } from '@uifabric/styling'; -import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu'; +import { NeutralColors } from '@fluentui/theme'; +import { IconButton } from '@fluentui/react/lib/Button'; +import { FontSizes } from '@fluentui/style-utilities'; +import { IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu'; import formatMessage from 'format-message'; import { SchemaField } from '../SchemaField'; diff --git a/Composer/packages/adaptive-form/src/components/fields/BooleanField.tsx b/Composer/packages/adaptive-form/src/components/fields/BooleanField.tsx index 5c24057ea5..e56b7ba3a5 100644 --- a/Composer/packages/adaptive-form/src/components/fields/BooleanField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/BooleanField.tsx @@ -4,8 +4,9 @@ import { jsx } from '@emotion/core'; import React from 'react'; import { FieldProps } from '@bfc/extension-client'; -import { Dropdown, IDropdownOption, ResponsiveMode } from 'office-ui-fabric-react/lib/Dropdown'; +import { Dropdown, IDropdownOption } from '@fluentui/react/lib/Dropdown'; import formatMessage from 'format-message'; +import { ResponsiveMode } from '@fluentui/react'; import { FieldLabel } from '../FieldLabel'; diff --git a/Composer/packages/adaptive-form/src/components/fields/EditableField.tsx b/Composer/packages/adaptive-form/src/components/fields/EditableField.tsx index 3f2d66f17e..0f49795d90 100644 --- a/Composer/packages/adaptive-form/src/components/fields/EditableField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/EditableField.tsx @@ -2,9 +2,9 @@ // Licensed under the MIT License. import React, { useState, useEffect } from 'react'; -import { TextField, ITextFieldStyles } from 'office-ui-fabric-react/lib/TextField'; -import { NeutralColors } from '@uifabric/fluent-theme'; -import { mergeStyleSets } from '@uifabric/styling'; +import { TextField, ITextFieldStyles } from '@fluentui/react/lib/TextField'; +import { NeutralColors } from '@fluentui/theme'; +import { mergeStyleSets } from '@fluentui/style-utilities'; import { FieldProps } from '@bfc/extension-client'; interface EditableFieldProps extends Omit { diff --git a/Composer/packages/adaptive-form/src/components/fields/OneOfField/OneOfField.tsx b/Composer/packages/adaptive-form/src/components/fields/OneOfField/OneOfField.tsx index b39581bf8f..7a1ad2e46c 100644 --- a/Composer/packages/adaptive-form/src/components/fields/OneOfField/OneOfField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/OneOfField/OneOfField.tsx @@ -5,12 +5,13 @@ import { FieldProps, useFormConfig } from '@bfc/extension-client'; import { jsx } from '@emotion/core'; -import { FluentTheme } from '@uifabric/fluent-theme/lib/fluent'; +import { FluentTheme } from '@fluentui/theme'; import formatMessage from 'format-message'; -import { Dropdown, IDropdownOption, ResponsiveMode } from 'office-ui-fabric-react/lib/Dropdown'; -import { Icon } from 'office-ui-fabric-react/lib/Icon'; +import { Dropdown, IDropdownOption } from '@fluentui/react/lib/Dropdown'; +import { Icon } from '@fluentui/react/lib/Icon'; import React, { useMemo, useState } from 'react'; import { css } from '@emotion/core'; +import { ResponsiveMode } from '@fluentui/react'; import { getUiPlaceholder, resolveFieldWidget } from '../../../utils'; import { FieldLabel } from '../../FieldLabel'; diff --git a/Composer/packages/adaptive-form/src/components/fields/OneOfField/utils.ts b/Composer/packages/adaptive-form/src/components/fields/OneOfField/utils.ts index 43961c5150..5e8b669e70 100644 --- a/Composer/packages/adaptive-form/src/components/fields/OneOfField/utils.ts +++ b/Composer/packages/adaptive-form/src/components/fields/OneOfField/utils.ts @@ -1,7 +1,7 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -import { IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown'; +import { IDropdownOption } from '@fluentui/react/lib/Dropdown'; import { FieldProps, JSONSchema7, SchemaDefinitions } from '@bfc/extension-client'; import merge from 'lodash/merge'; import omit from 'lodash/omit'; diff --git a/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/ObjectItem.tsx b/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/ObjectItem.tsx index a68622dece..fcc9065a6f 100644 --- a/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/ObjectItem.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/ObjectItem.tsx @@ -4,11 +4,11 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; import React, { useState, useCallback, useMemo } from 'react'; -import { FontSizes, NeutralColors } from '@uifabric/fluent-theme'; -import { IconButton } from 'office-ui-fabric-react/lib/Button'; +import { FontSizes, NeutralColors } from '@fluentui/theme'; +import { IconButton } from '@fluentui/react/lib/Button'; import { FieldProps } from '@bfc/extension-client'; -import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu'; -import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip'; +import { IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu'; +import { TooltipHost } from '@fluentui/react/lib/Tooltip'; import formatMessage from 'format-message'; import { StringField } from '../StringField'; diff --git a/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/styles.ts b/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/styles.ts index 3b9e908fe0..1e1fe7ad57 100644 --- a/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/styles.ts +++ b/Composer/packages/adaptive-form/src/components/fields/OpenObjectField/styles.ts @@ -2,7 +2,7 @@ // Licensed under the MIT License. import { css } from '@emotion/core'; -import { NeutralColors } from '@uifabric/fluent-theme'; +import { NeutralColors } from '@fluentui/theme'; export const container = css` border-top: 1px solid ${NeutralColors.gray30}; diff --git a/Composer/packages/adaptive-form/src/components/fields/PivotFieldsets.tsx b/Composer/packages/adaptive-form/src/components/fields/PivotFieldsets.tsx index b2827a8bfd..11df7e6e6e 100644 --- a/Composer/packages/adaptive-form/src/components/fields/PivotFieldsets.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/PivotFieldsets.tsx @@ -3,7 +3,7 @@ import React from 'react'; import { FieldProps } from '@bfc/extension-client'; -import { IPivotStyles, Pivot, PivotItem, PivotLinkSize } from 'office-ui-fabric-react/lib/components/Pivot'; +import { IPivotStyles, Pivot, PivotItem, PivotLinkSize } from '@fluentui/react/lib/components/Pivot'; import { getFieldsets, resolveFieldWidget } from '../../utils'; import { useAdaptiveFormContext } from '../../AdaptiveFormContext'; diff --git a/Composer/packages/adaptive-form/src/components/fields/RecognizerField/RecognizerField.tsx b/Composer/packages/adaptive-form/src/components/fields/RecognizerField/RecognizerField.tsx index 70d871ae5c..6ab02c087b 100644 --- a/Composer/packages/adaptive-form/src/components/fields/RecognizerField/RecognizerField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/RecognizerField/RecognizerField.tsx @@ -6,11 +6,11 @@ import React, { useCallback, useMemo, useState, useEffect } from 'react'; import { FieldProps, useShellApi, useRecognizerConfig } from '@bfc/extension-client'; import { MicrosoftIRecognizer } from '@bfc/shared'; import formatMessage from 'format-message'; -import { Dialog, DialogFooter, DialogType } from 'office-ui-fabric-react/lib/Dialog'; -import { ScrollablePane, ScrollbarVisibility } from 'office-ui-fabric-react/lib/ScrollablePane'; -import { Link } from 'office-ui-fabric-react/lib/Link'; -import { CheckboxVisibility, DetailsList, SelectionMode, Selection } from 'office-ui-fabric-react/lib/DetailsList'; -import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button'; +import { Dialog, DialogFooter, DialogType } from '@fluentui/react/lib/Dialog'; +import { ScrollablePane, ScrollbarVisibility } from '@fluentui/react/lib/ScrollablePane'; +import { Link } from '@fluentui/react/lib/Link'; +import { CheckboxVisibility, DetailsList, SelectionMode, Selection } from '@fluentui/react/lib/DetailsList'; +import { PrimaryButton, DefaultButton } from '@fluentui/react/lib/Button'; import { FieldLabel } from '../../FieldLabel'; diff --git a/Composer/packages/adaptive-form/src/components/fields/SelectField.tsx b/Composer/packages/adaptive-form/src/components/fields/SelectField.tsx index a4342c6d47..6699f331ba 100644 --- a/Composer/packages/adaptive-form/src/components/fields/SelectField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/SelectField.tsx @@ -1,9 +1,10 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. import React, { useMemo } from 'react'; -import { Dropdown, IDropdownOption, ResponsiveMode } from 'office-ui-fabric-react/lib/Dropdown'; +import { Dropdown, IDropdownOption } from '@fluentui/react/lib/Dropdown'; import { FieldProps } from '@bfc/extension-client'; import formatMessage from 'format-message'; +import { ResponsiveMode } from '@fluentui/react'; import { FieldLabel } from '../FieldLabel'; diff --git a/Composer/packages/adaptive-form/src/components/fields/StringField.tsx b/Composer/packages/adaptive-form/src/components/fields/StringField.tsx index c790c485cc..04ddd7d91a 100644 --- a/Composer/packages/adaptive-form/src/components/fields/StringField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/StringField.tsx @@ -3,7 +3,7 @@ import React, { useEffect } from 'react'; import { FieldProps } from '@bfc/extension-client'; -import { ITextField, TextField } from 'office-ui-fabric-react/lib/TextField'; +import { ITextField, TextField } from '@fluentui/react/lib/TextField'; import formatMessage from 'format-message'; import { FieldLabel } from '../FieldLabel'; diff --git a/Composer/packages/adaptive-form/src/components/fields/UnsupportedField.tsx b/Composer/packages/adaptive-form/src/components/fields/UnsupportedField.tsx index 26dc17edef..24b540d823 100644 --- a/Composer/packages/adaptive-form/src/components/fields/UnsupportedField.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/UnsupportedField.tsx @@ -3,7 +3,7 @@ /** @jsx jsx */ import { jsx } from '@emotion/core'; import React, { useState } from 'react'; -import { Link } from 'office-ui-fabric-react/lib/Link'; +import { Link } from '@fluentui/react/lib/Link'; import { FieldProps } from '@bfc/extension-client'; import omit from 'lodash/omit'; import formatMessage from 'format-message'; diff --git a/Composer/packages/adaptive-form/src/components/fields/__tests__/SelectField.test.tsx b/Composer/packages/adaptive-form/src/components/fields/__tests__/SelectField.test.tsx index 5692c77e69..e7a14e8fdf 100644 --- a/Composer/packages/adaptive-form/src/components/fields/__tests__/SelectField.test.tsx +++ b/Composer/packages/adaptive-form/src/components/fields/__tests__/SelectField.test.tsx @@ -30,7 +30,7 @@ describe('', () => { fireEvent.click(dropdown); // remove the first option because it is the one shown as selected - const options = screen.getAllByRole('option').slice(1); + const options = screen.getAllByRole('option'); expect(options).toHaveLength(4); expect(options[0]).toHaveTextContent(''); expect(options[1]).toHaveTextContent(/option 1/); diff --git a/Composer/packages/adaptive-form/src/components/fields/styles.ts b/Composer/packages/adaptive-form/src/components/fields/styles.ts index c4e3c452f2..9ebcd7cb19 100644 --- a/Composer/packages/adaptive-form/src/components/fields/styles.ts +++ b/Composer/packages/adaptive-form/src/components/fields/styles.ts @@ -2,9 +2,9 @@ // Licensed under the MIT License. import { css } from '@emotion/core'; -import { NeutralColors } from '@uifabric/fluent-theme'; -import { FontSizes } from '@uifabric/styling'; -import { getTheme, mergeStyles, getFocusStyle } from 'office-ui-fabric-react/lib/Styling'; +import { NeutralColors } from '@fluentui/theme'; +import { FontSizes } from '@fluentui/style-utilities'; +import { getTheme, mergeStyles, getFocusStyle } from '@fluentui/react/lib/Styling'; export const arrayItem = { container: css` diff --git a/Composer/packages/adaptive-form/src/components/sharedStyles.ts b/Composer/packages/adaptive-form/src/components/sharedStyles.ts index 7a2f262bea..a3f1003b21 100644 --- a/Composer/packages/adaptive-form/src/components/sharedStyles.ts +++ b/Composer/packages/adaptive-form/src/components/sharedStyles.ts @@ -2,7 +2,7 @@ // Licensed under the MIT License. import { css } from '@emotion/core'; -import { NeutralColors } from '@uifabric/fluent-theme'; +import { NeutralColors } from '@fluentui/theme'; export const focusBorder = css` &:focus { diff --git a/Composer/packages/client/__tests__/components/BotRuntimeController/emulatorOpenButton.test.tsx b/Composer/packages/client/__tests__/components/BotRuntimeController/emulatorOpenButton.test.tsx index 24b7fe0ead..1c5c54ed31 100644 --- a/Composer/packages/client/__tests__/components/BotRuntimeController/emulatorOpenButton.test.tsx +++ b/Composer/packages/client/__tests__/components/BotRuntimeController/emulatorOpenButton.test.tsx @@ -16,7 +16,7 @@ jest.mock('../../../src/utils/navigation', () => { }; }); -jest.mock('office-ui-fabric-react/lib/Button', () => ({ +jest.mock('@fluentui/react/lib/Button', () => ({ ActionButton: ({ onClick, children }) => (