From b1150529980f43ff8b7fd2a19ea5e22829497289 Mon Sep 17 00:00:00 2001 From: mainframev Date: Tue, 18 Nov 2025 18:46:10 +0100 Subject: [PATCH 1/2] chore(react): migrate v8 and related packages to flat configs --- packages/a11y-testing/.eslintrc.json | 4 - packages/a11y-testing/eslint.config.js | 5 + packages/api-docs/.eslintrc.json | 4 - packages/api-docs/eslint.config.js | 5 + packages/azure-themes/.eslintrc.json | 4 - packages/azure-themes/eslint.config.js | 5 + packages/cra-template/.eslintrc.json | 15 -- packages/cra-template/eslint.config.js | 27 +++ packages/cra-template/package.json | 2 +- packages/date-time-utilities/.eslintrc.json | 4 - packages/date-time-utilities/eslint.config.js | 5 + packages/dom-utilities/.eslintrc.json | 4 - packages/dom-utilities/eslint.config.js | 5 + packages/eslint-plugin/eslint.config.js | 34 +++ packages/eslint-plugin/src/configs/core.js | 1 + .../src/flat-configs/base/legacy.js | 12 ++ .../eslint-plugin/src/flat-configs/core.js | 1 + packages/example-data/.eslintrc.json | 7 - packages/example-data/eslint.config.js | 5 + packages/fluent2-theme/.eslintrc.json | 4 - packages/fluent2-theme/eslint.config.js | 5 + packages/font-icons-mdl2/.eslintrc.json | 4 - packages/font-icons-mdl2/eslint.config.js | 5 + packages/foundation-legacy/.eslintrc.json | 7 - packages/foundation-legacy/eslint.config.js | 14 ++ packages/foundation-legacy/src/index.ts | 16 +- .../.eslintrc.json | 4 - .../eslint.config.js | 5 + packages/keyboard-key/.eslintrc.json | 4 - packages/keyboard-key/eslint.config.js | 5 + packages/merge-styles/.eslintrc.json | 7 - packages/merge-styles/eslint.config.js | 5 + packages/monaco-editor/.eslintrc.json | 5 - packages/monaco-editor/eslint.config.js | 10 + packages/react-cards/.eslintrc.json | 15 -- packages/react-cards/eslint.config.js | 14 ++ packages/react-cards/src/index.ts | 3 +- packages/react-conformance/.eslintrc.json | 4 - packages/react-conformance/eslint.config.js | 5 + .../src/defaultErrorMessages.tsx | 2 +- .../react-conformance/src/defaultTests.tsx | 3 +- .../src/utils/getCallbackArguments.test.ts | 4 +- .../utils/validateCallbackArguments.test.ts | 4 +- packages/react-date-time/.eslintrc.json | 4 - packages/react-date-time/eslint.config.js | 5 + .../react-docsite-components/.eslintrc.json | 16 -- .../react-docsite-components/eslint.config.js | 19 ++ .../components/ExampleCard/ExampleCard.tsx | 2 +- .../src/index.demo.tsx | 2 +- .../react-docsite-components/src/index.ts | 41 ++-- .../utilities/parser/InterfaceParserHelper.ts | 2 +- packages/react-examples/.eslintrc.json | 12 -- packages/react-examples/eslint.config.js | 23 ++ .../stories/components/slider.stories.tsx | 2 +- .../Legends/Legends.Controlled.Example.tsx | 2 +- ...ckedBarChart.AxisCategoryOrder.Example.tsx | 2 +- ...rticalStackedBarChart.DateAxis.Example.tsx | 2 +- .../Chiclet/Chiclet.Footer.Example.tsx | 2 +- .../Chiclet/Chiclet.Xsmall.Footer.Example.tsx | 2 +- ...ectedPeopleList.Basic.DragDrop.Example.tsx | 2 +- ...eopleList.DragDropBetweenWells.Example.tsx | 2 +- .../SelectedPeopleList.WithEdit.Example.tsx | 2 +- ...opleList.WithEditInContextMenu.Example.tsx | 2 +- .../Slider/Slider.Example.tsx | 2 +- .../Slider/Slider.Vertical.Example.tsx | 2 +- .../TilesList/ExampleHelpers.tsx | 14 +- .../TilesList/TilesList.Document.Example.tsx | 2 +- .../DoubleUnifiedPeoplePicker.Example.tsx | 2 +- .../UnifiedPeoplePicker.Example.tsx | 2 +- .../UnifiedPeoplePicker.WithEdit.Example.tsx | 4 +- .../ComboBox.CustomStyled.Example.tsx | 2 +- .../CommandBar.CommandBarButtonAs.Example.tsx | 2 +- .../ContextualMenu.Directional.Example.tsx | 4 +- ...oardAccessibleResizeAndReorder.Example.tsx | 4 +- .../ExtendedPeoplePicker.Basic.Example.tsx | 10 +- .../ExtendedPeoplePicker.Basic.Example.tsx | 10 +- .../GroupedList/GroupedList.Basic.Example.tsx | 4 +- .../GroupedList.CustomCheckbox.Example.tsx | 4 +- .../GroupedListV2.Basic.Example.tsx | 4 +- .../GroupedListV2.CustomCheckbox.Example.tsx | 4 +- .../HoverCard/HoverCard.Basic.Example.tsx | 4 +- .../HoverCard.EventListenerTarget.Example.tsx | 2 +- .../HoverCard.InstantDismiss.Example.tsx | 2 +- .../HoverCard/HoverCard.PlainCard.Example.tsx | 2 +- .../PeoplePicker.Controlled.Example.tsx | 2 +- .../ResizeGroup.OverflowSet.Example.tsx | 2 +- ...esizeGroup.VerticalOverflowSet.Example.tsx | 2 +- packages/react-experiments/.eslintrc.json | 8 - packages/react-experiments/eslint.config.js | 13 ++ .../src/components/BAFAccordion/Accordion.tsx | 2 +- .../src/components/Chiclet/Chiclet.base.tsx | 2 +- .../src/components/Chiclet/Chiclet.types.ts | 4 +- .../components/Chiclet/ChicletCard.base.tsx | 4 +- .../components/Chiclet/ChicletXsmall.base.tsx | 4 +- .../defaults/DefaultPeopleSuggestionsItem.tsx | 2 +- .../FloatingSuggestions.tsx | 4 +- .../Suggestions/Suggestions.types.ts | 4 +- .../Suggestions/SuggestionsControl.tsx | 10 +- .../Suggestions/SuggestionsCore.tsx | 2 +- .../SuggestionItemDefault.tsx | 2 +- .../FloatingPeopleSuggestions.tsx | 4 +- .../FloatingSuggestions.tsx | 2 +- .../FloatingSuggestions.types.ts | 6 +- .../FloatingSuggestionsHeaderFooterItem.tsx | 2 +- ...oatingSuggestionsHeaderFooterItem.types.ts | 4 +- .../FloatingSuggestionsItem.tsx | 2 +- .../FloatingSuggestionsItem.types.ts | 2 +- .../FloatingSuggestionsList.tsx | 8 +- .../FloatingSuggestionsList.types.ts | 6 +- .../components/FolderCover/FolderCover.tsx | 8 +- .../FolderCover/FolderCover.types.ts | 2 +- .../components/LayoutGroup/LayoutGroup.tsx | 2 +- .../MicroFeedback/MicroFeedback.view.tsx | 4 +- .../src/components/Pagination/PageNumber.tsx | 2 +- .../components/Pagination/Pagination.base.tsx | 8 +- .../src/components/Persona/Persona.tsx | 2 +- .../PersonaCoinImage/PersonaCoinImage.tsx | 2 +- .../PersonaCoinSize10/PersonaCoinSize10.tsx | 2 +- .../subcomponents/DefaultEditingItem.tsx | 4 +- .../Items/SelectedPersona.tsx | 2 +- .../src/components/Sidebar/Sidebar.tsx | 18 +- .../src/components/Slider/Slider.base.tsx | 4 +- .../src/components/Slider/Slider.test.tsx | 2 +- .../src/components/StaticList/List.types.ts | 2 +- .../src/components/StaticList/StaticList.tsx | 2 +- .../Tile/ShimmerTile/ShimmerTile.base.tsx | 2 +- .../src/components/Tile/Tile.tsx | 16 +- .../src/components/Tile/Tile.types.ts | 8 +- .../src/components/TilesList/TilesList.tsx | 18 +- .../components/TilesList/TilesList.types.ts | 8 +- .../UnifiedPeoplePicker.tsx | 6 +- .../UnifiedPicker/UnifiedPicker.tsx | 4 +- .../UnifiedPicker/UnifiedPicker.types.ts | 6 +- .../hooks/useFloatingSuggestionItems.ts | 44 ++-- .../UnifiedPicker/hooks/useSelectedItems.ts | 24 +-- .../VirtualizedList/VirtualizedList.tsx | 12 +- .../src/components/signals/Signal.tsx | 2 +- .../src/components/signals/SignalField.tsx | 2 +- .../src/components/signals/Signals.tsx | 52 ++--- packages/react-experiments/src/index.ts | 201 ++++++++++++++++-- .../utilities/scrolling/ScrollContainer.tsx | 2 +- packages/react-file-type-icons/.eslintrc.json | 7 - .../react-file-type-icons/eslint.config.js | 12 ++ .../src/getFileTypeIconProps.ts | 6 +- packages/react-focus/.eslintrc.js | 15 -- packages/react-focus/eslint.config.js | 14 ++ packages/react-focus/src/index.ts | 3 +- packages/react-hooks/.eslintrc.json | 4 - packages/react-hooks/eslint.config.js | 5 + packages/react-hooks/src/index.ts | 48 +++-- .../react-hooks/src/useMountSync.test.tsx | 2 +- packages/react-icon-provider/.eslintrc.json | 4 - packages/react-icon-provider/eslint.config.js | 13 ++ .../react-icons-mdl2-branded/.eslintrc.json | 4 - .../react-icons-mdl2-branded/eslint.config.js | 5 + packages/react-icons-mdl2/.eslintrc.json | 4 - packages/react-icons-mdl2/eslint.config.js | 5 + packages/react-monaco-editor/.eslintrc.json | 9 - packages/react-monaco-editor/eslint.config.js | 14 ++ packages/react-monaco-editor/src/index.ts | 11 +- packages/react-window-provider/.eslintrc.json | 4 - .../react-window-provider/eslint.config.js | 5 + .../src/WindowProvider.tsx | 2 +- packages/react-window-provider/src/index.ts | 2 +- packages/react/.eslintrc.js | 21 -- packages/react/eslint.config.js | 29 +++ packages/react/src/common/testUtilities.ts | 1 + .../src/components/Autofill/Autofill.test.tsx | 10 +- .../src/components/Button/Button.test.tsx | 10 +- .../CalendarYear/CalendarYear.base.tsx | 6 +- .../src/components/Coachmark/Beak/Beak.tsx | 12 +- .../src/components/ComboBox/ComboBox.test.tsx | 2 +- .../ContextualMenuItem.test.tsx | 12 +- .../ContextualMenuAnchor.test.tsx | 4 +- .../ContextualMenuButton.test.tsx | 4 +- .../ContextualMenuSplitButton.test.tsx | 4 +- .../src/components/Dialog/Dialog.test.tsx | 4 +- .../src/components/Fabric/Fabric.test.tsx | 2 +- .../react/src/components/Icon/Icon.test.tsx | 2 +- .../KeytipLayer/KeytipLayer.base.tsx | 2 +- .../src/components/Link/Link.server.test.tsx | 2 +- .../react/src/components/Modal/Modal.test.tsx | 2 +- .../src/components/Persona/Persona.test.tsx | 2 +- .../Persona/PersonaCoin/PersonaCoin.test.tsx | 2 +- .../react/src/components/Pivot/Pivot.base.tsx | 1 + .../react/src/components/Popup/Popup.test.tsx | 4 +- .../components/SearchBox/SearchBox.test.tsx | 2 +- .../react/src/components/Slider/useSlider.ts | 2 +- .../components/SpinButton/SpinButton.test.tsx | 2 +- .../react/src/components/Stack/Stack.test.tsx | 2 +- .../components/Tooltip/TooltipHost.test.tsx | 2 +- .../components/pickers/BasePicker.test.tsx | 2 +- .../utilities/ButtonGrid/ButtonGrid.test.tsx | 4 +- .../ThemeProvider/makeStyles.test.tsx | 10 +- packages/react/src/utilities/color/shades.ts | 2 +- .../decorators/withResponsiveMode.test.tsx | 2 +- packages/scheme-utilities/.eslintrc.json | 4 - packages/scheme-utilities/eslint.config.js | 5 + packages/set-version/.eslintrc.json | 16 -- packages/set-version/eslint.config.js | 5 + packages/storybook/.eslintrc.json | 7 - packages/storybook/eslint.config.js | 12 ++ packages/style-utilities/.eslintrc.json | 7 - packages/style-utilities/eslint.config.js | 5 + packages/test-utilities/.eslintrc.json | 7 - packages/test-utilities/eslint.config.js | 12 ++ packages/theme-samples/.eslintrc.json | 4 - packages/theme-samples/eslint.config.js | 5 + packages/theme/.eslintrc.json | 4 - packages/theme/eslint.config.js | 5 + packages/utilities/eslint.config.js | 13 ++ packages/utilities/src/math.ts | 4 +- 212 files changed, 965 insertions(+), 627 deletions(-) delete mode 100644 packages/a11y-testing/.eslintrc.json create mode 100644 packages/a11y-testing/eslint.config.js delete mode 100644 packages/api-docs/.eslintrc.json create mode 100644 packages/api-docs/eslint.config.js delete mode 100644 packages/azure-themes/.eslintrc.json create mode 100644 packages/azure-themes/eslint.config.js delete mode 100644 packages/cra-template/.eslintrc.json create mode 100644 packages/cra-template/eslint.config.js delete mode 100644 packages/date-time-utilities/.eslintrc.json create mode 100644 packages/date-time-utilities/eslint.config.js delete mode 100644 packages/dom-utilities/.eslintrc.json create mode 100644 packages/dom-utilities/eslint.config.js create mode 100644 packages/eslint-plugin/eslint.config.js delete mode 100644 packages/example-data/.eslintrc.json create mode 100644 packages/example-data/eslint.config.js delete mode 100644 packages/fluent2-theme/.eslintrc.json create mode 100644 packages/fluent2-theme/eslint.config.js delete mode 100644 packages/font-icons-mdl2/.eslintrc.json create mode 100644 packages/font-icons-mdl2/eslint.config.js delete mode 100644 packages/foundation-legacy/.eslintrc.json create mode 100644 packages/foundation-legacy/eslint.config.js delete mode 100644 packages/jest-serializer-merge-styles/.eslintrc.json create mode 100644 packages/jest-serializer-merge-styles/eslint.config.js delete mode 100644 packages/keyboard-key/.eslintrc.json create mode 100644 packages/keyboard-key/eslint.config.js delete mode 100644 packages/merge-styles/.eslintrc.json create mode 100644 packages/merge-styles/eslint.config.js delete mode 100644 packages/monaco-editor/.eslintrc.json create mode 100644 packages/monaco-editor/eslint.config.js delete mode 100644 packages/react-cards/.eslintrc.json create mode 100644 packages/react-cards/eslint.config.js delete mode 100644 packages/react-conformance/.eslintrc.json create mode 100644 packages/react-conformance/eslint.config.js delete mode 100644 packages/react-date-time/.eslintrc.json create mode 100644 packages/react-date-time/eslint.config.js delete mode 100644 packages/react-docsite-components/.eslintrc.json create mode 100644 packages/react-docsite-components/eslint.config.js delete mode 100644 packages/react-examples/.eslintrc.json create mode 100644 packages/react-examples/eslint.config.js delete mode 100644 packages/react-experiments/.eslintrc.json create mode 100644 packages/react-experiments/eslint.config.js delete mode 100644 packages/react-file-type-icons/.eslintrc.json create mode 100644 packages/react-file-type-icons/eslint.config.js delete mode 100644 packages/react-focus/.eslintrc.js create mode 100644 packages/react-focus/eslint.config.js delete mode 100644 packages/react-hooks/.eslintrc.json create mode 100644 packages/react-hooks/eslint.config.js delete mode 100644 packages/react-icon-provider/.eslintrc.json create mode 100644 packages/react-icon-provider/eslint.config.js delete mode 100644 packages/react-icons-mdl2-branded/.eslintrc.json create mode 100644 packages/react-icons-mdl2-branded/eslint.config.js delete mode 100644 packages/react-icons-mdl2/.eslintrc.json create mode 100644 packages/react-icons-mdl2/eslint.config.js delete mode 100644 packages/react-monaco-editor/.eslintrc.json create mode 100644 packages/react-monaco-editor/eslint.config.js delete mode 100644 packages/react-window-provider/.eslintrc.json create mode 100644 packages/react-window-provider/eslint.config.js delete mode 100644 packages/react/.eslintrc.js create mode 100644 packages/react/eslint.config.js delete mode 100644 packages/scheme-utilities/.eslintrc.json create mode 100644 packages/scheme-utilities/eslint.config.js delete mode 100644 packages/set-version/.eslintrc.json create mode 100644 packages/set-version/eslint.config.js delete mode 100644 packages/storybook/.eslintrc.json create mode 100644 packages/storybook/eslint.config.js delete mode 100644 packages/style-utilities/.eslintrc.json create mode 100644 packages/style-utilities/eslint.config.js delete mode 100644 packages/test-utilities/.eslintrc.json create mode 100644 packages/test-utilities/eslint.config.js delete mode 100644 packages/theme-samples/.eslintrc.json create mode 100644 packages/theme-samples/eslint.config.js delete mode 100644 packages/theme/.eslintrc.json create mode 100644 packages/theme/eslint.config.js create mode 100644 packages/utilities/eslint.config.js diff --git a/packages/a11y-testing/.eslintrc.json b/packages/a11y-testing/.eslintrc.json deleted file mode 100644 index 24ece4e08168be..00000000000000 --- a/packages/a11y-testing/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/node"], - "root": true -} diff --git a/packages/a11y-testing/eslint.config.js b/packages/a11y-testing/eslint.config.js new file mode 100644 index 00000000000000..827203cf8f59b7 --- /dev/null +++ b/packages/a11y-testing/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/node']]; diff --git a/packages/api-docs/.eslintrc.json b/packages/api-docs/.eslintrc.json deleted file mode 100644 index 2acff088f5f374..00000000000000 --- a/packages/api-docs/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/node--legacy"], - "root": true -} diff --git a/packages/api-docs/eslint.config.js b/packages/api-docs/eslint.config.js new file mode 100644 index 00000000000000..99ebe562718a78 --- /dev/null +++ b/packages/api-docs/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/node-legacy']]; diff --git a/packages/azure-themes/.eslintrc.json b/packages/azure-themes/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/azure-themes/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/azure-themes/eslint.config.js b/packages/azure-themes/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/azure-themes/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/cra-template/.eslintrc.json b/packages/cra-template/.eslintrc.json deleted file mode 100644 index 64836ca657eebe..00000000000000 --- a/packages/cra-template/.eslintrc.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "overrides": [ - { - "files": ["template/**/*.{ts,tsx}"], - "rules": { - // the rule can't understand that the actual list of deps is in template.json - "import/no-extraneous-dependencies": "off", - // valid in some template files - don't wanna spam consumer with inline eslint-disabled pragmas - "@typescript-eslint/triple-slash-reference": "off" - } - } - ] -} diff --git a/packages/cra-template/eslint.config.js b/packages/cra-template/eslint.config.js new file mode 100644 index 00000000000000..b6559b17ec7d32 --- /dev/null +++ b/packages/cra-template/eslint.config.js @@ -0,0 +1,27 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); +const tseslint = require('typescript-eslint'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + files: ['template/**/*.{ts,tsx}'], + languageOptions: { + parser: tseslint.parser, + parserOptions: { + projectService: false, + }, + }, + rules: { + // the rule can't understand that the actual list of deps is in template.json + 'import/no-extraneous-dependencies': 'off', + // valid in some template files - don't wanna spam consumer with inline eslint-disabled pragmas + '@typescript-eslint/triple-slash-reference': 'off', + // Disable type-aware rules since template files are not in tsconfig + '@typescript-eslint/naming-convention': 'off', + '@typescript-eslint/no-deprecated': 'off', + '@fluentui/ban-context-export': 'off', + }, + }, +]; diff --git a/packages/cra-template/package.json b/packages/cra-template/package.json index 7e7e598a9a0db9..84802d9b808fea 100644 --- a/packages/cra-template/package.json +++ b/packages/cra-template/package.json @@ -8,7 +8,7 @@ "directory": "packages/cra-template" }, "scripts": { - "lint": "ESLINT_USE_FLAT_CONFIG=false eslint --ext .js,.ts,.tsx .", + "lint": " eslint --ext .js,.ts,.tsx .", "test-integration": "node -r @fluentui/scripts-babel/register scripts/test.ts", "type-check": "tsc -p ." }, diff --git a/packages/date-time-utilities/.eslintrc.json b/packages/date-time-utilities/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/date-time-utilities/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/date-time-utilities/eslint.config.js b/packages/date-time-utilities/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/date-time-utilities/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/dom-utilities/.eslintrc.json b/packages/dom-utilities/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/dom-utilities/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/dom-utilities/eslint.config.js b/packages/dom-utilities/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/dom-utilities/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/eslint-plugin/eslint.config.js b/packages/eslint-plugin/eslint.config.js new file mode 100644 index 00000000000000..d093d74981d6ad --- /dev/null +++ b/packages/eslint-plugin/eslint.config.js @@ -0,0 +1,34 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/node'], + { + files: ['src/rules/*.js'], + rules: { + // too many false positives on node types + '@typescript-eslint/naming-convention': 'off', + }, + }, + { + files: ['src/rules/**/fixtures/**/*.{js,ts,tsx}'], + languageOptions: { + parserOptions: { + projectService: false, + }, + }, + rules: { + 'import/no-extraneous-dependencies': 'off', + '@typescript-eslint/no-deprecated': 'off', + '@typescript-eslint/naming-convention': 'off', + '@typescript-eslint/explicit-module-boundary-types': 'off', + }, + }, + { + files: ['src/**/*.{test,spec}.{js,ts}'], + rules: { + 'import/no-extraneous-dependencies': 'off', + }, + }, +]; diff --git a/packages/eslint-plugin/src/configs/core.js b/packages/eslint-plugin/src/configs/core.js index aaa07a3ee58edf..07a07188f126f2 100644 --- a/packages/eslint-plugin/src/configs/core.js +++ b/packages/eslint-plugin/src/configs/core.js @@ -109,6 +109,7 @@ const config = { 'no-lonely-if': 'off', 'no-loop-func': 'off', 'no-multi-assign': 'off', + 'prefer-regex-literals': 'off', 'no-nested-ternary': 'off', 'no-param-reassign': 'off', 'no-plusplus': 'off', diff --git a/packages/eslint-plugin/src/flat-configs/base/legacy.js b/packages/eslint-plugin/src/flat-configs/base/legacy.js index 8b5b0cad3cd7d9..51112a0cf76f3b 100644 --- a/packages/eslint-plugin/src/flat-configs/base/legacy.js +++ b/packages/eslint-plugin/src/flat-configs/base/legacy.js @@ -7,6 +7,18 @@ const { defineConfig } = require('eslint/config'); module.exports = defineConfig( core, { + rules: { + 'prefer-regex-literals': 'off', + 'no-promise-executor-return': 'off', + }, + }, + { + files: ['**/*.ts', '**/*.tsx'], + languageOptions: { + parserOptions: { + projectService: true, + }, + }, rules: { /** * `@typescript-eslint`plugin eslint rules diff --git a/packages/eslint-plugin/src/flat-configs/core.js b/packages/eslint-plugin/src/flat-configs/core.js index b2e80823981bb6..5b5331ed349f1a 100644 --- a/packages/eslint-plugin/src/flat-configs/core.js +++ b/packages/eslint-plugin/src/flat-configs/core.js @@ -100,6 +100,7 @@ const disabledRules = { 'operator-assignment': 'off', 'prefer-destructuring': 'off', 'prefer-template': 'off', + 'prefer-regex-literals': 'off', 'arrow-body-style': 'off', 'class-methods-use-this': 'off', 'consistent-return': 'off', diff --git a/packages/example-data/.eslintrc.json b/packages/example-data/.eslintrc.json deleted file mode 100644 index b66cb94fadee35..00000000000000 --- a/packages/example-data/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "no-alert": "off" - } -} diff --git a/packages/example-data/eslint.config.js b/packages/example-data/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/example-data/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/fluent2-theme/.eslintrc.json b/packages/fluent2-theme/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/fluent2-theme/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/fluent2-theme/eslint.config.js b/packages/fluent2-theme/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/fluent2-theme/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/font-icons-mdl2/.eslintrc.json b/packages/font-icons-mdl2/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/font-icons-mdl2/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/font-icons-mdl2/eslint.config.js b/packages/font-icons-mdl2/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/font-icons-mdl2/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/foundation-legacy/.eslintrc.json b/packages/foundation-legacy/.eslintrc.json deleted file mode 100644 index 10a55ade409374..00000000000000 --- a/packages/foundation-legacy/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "@typescript-eslint/no-explicit-any": "off" - } -} diff --git a/packages/foundation-legacy/eslint.config.js b/packages/foundation-legacy/eslint.config.js new file mode 100644 index 00000000000000..6c643f546106e4 --- /dev/null +++ b/packages/foundation-legacy/eslint.config.js @@ -0,0 +1,14 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + files: ['**/*.ts', '**/*.tsx'], + rules: { + '@typescript-eslint/no-explicit-any': 'off', + '@typescript-eslint/no-deprecated': 'off', + }, + }, +]; diff --git a/packages/foundation-legacy/src/index.ts b/packages/foundation-legacy/src/index.ts index de16b0d6f86641..7ff1b93ef76486 100644 --- a/packages/foundation-legacy/src/index.ts +++ b/packages/foundation-legacy/src/index.ts @@ -1,10 +1,12 @@ -export * from './createComponent'; -export * from './IComponent'; -export * from './IHTMLSlots'; -export * from './ISlots'; -export * from './slots'; -export * from './ThemeProvider'; -export * from './hooks/index'; +export { createComponent } from './createComponent'; +export type { IComponent, IComponentOptions, IComponentStyles, ICustomizationProps, IFactoryOptions, IPropsWithChildren, IStateComponentType, IStyleableComponentProps, IStylesFunction, IStylesFunctionOrObject, IToken, ITokenBase, ITokenBaseArray, ITokenFunction, ITokenFunctionOrObject, IViewComponent } from './IComponent'; +export type { IHTMLElementSlot, IHTMLSlot } from './IHTMLSlots'; +export type { ExtractProps, ExtractShorthand, IDefaultSlotProps, IProcessedSlotProps, ISlot, ISlotCreator, ISlotDefinition, ISlotFactory, ISlotOptions, ISlotProp, ISlotRender, ISlots, ISlottableComponentType, ISlottableProps, ISlottableReactType, ValidProps, ValidShorthand } from './ISlots'; +export { createFactory, getSlots, withSlots } from './slots'; +export type { IThemeProviderProps } from './ThemeProvider'; +export { ThemeProvider } from './ThemeProvider'; +export type { IControlledStateOptions } from './hooks/index'; +export { getControlledDerivedProps, useControlledState } from './hooks/index'; export { styled as legacyStyled } from '@fluentui/utilities'; diff --git a/packages/jest-serializer-merge-styles/.eslintrc.json b/packages/jest-serializer-merge-styles/.eslintrc.json deleted file mode 100644 index 2acff088f5f374..00000000000000 --- a/packages/jest-serializer-merge-styles/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/node--legacy"], - "root": true -} diff --git a/packages/jest-serializer-merge-styles/eslint.config.js b/packages/jest-serializer-merge-styles/eslint.config.js new file mode 100644 index 00000000000000..99ebe562718a78 --- /dev/null +++ b/packages/jest-serializer-merge-styles/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/node-legacy']]; diff --git a/packages/keyboard-key/.eslintrc.json b/packages/keyboard-key/.eslintrc.json deleted file mode 100644 index ceea884c70dccc..00000000000000 --- a/packages/keyboard-key/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react"], - "root": true -} diff --git a/packages/keyboard-key/eslint.config.js b/packages/keyboard-key/eslint.config.js new file mode 100644 index 00000000000000..401f19190a4a22 --- /dev/null +++ b/packages/keyboard-key/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react']]; diff --git a/packages/merge-styles/.eslintrc.json b/packages/merge-styles/.eslintrc.json deleted file mode 100644 index 10a55ade409374..00000000000000 --- a/packages/merge-styles/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "@typescript-eslint/no-explicit-any": "off" - } -} diff --git a/packages/merge-styles/eslint.config.js b/packages/merge-styles/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/merge-styles/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/monaco-editor/.eslintrc.json b/packages/monaco-editor/.eslintrc.json deleted file mode 100644 index c32261c87a8538..00000000000000 --- a/packages/monaco-editor/.eslintrc.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "ignorePatterns": ["esm/**"] -} diff --git a/packages/monaco-editor/eslint.config.js b/packages/monaco-editor/eslint.config.js new file mode 100644 index 00000000000000..69105c8a7a994d --- /dev/null +++ b/packages/monaco-editor/eslint.config.js @@ -0,0 +1,10 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + ignores: ['esm/**'], + }, +]; diff --git a/packages/react-cards/.eslintrc.json b/packages/react-cards/.eslintrc.json deleted file mode 100644 index e6e5b39ec8f88d..00000000000000 --- a/packages/react-cards/.eslintrc.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "@typescript-eslint/no-explicit-any": "off" - }, - "overrides": [ - { - "files": "**/*.{ts,tsx}", - "rules": { - "@typescript-eslint/no-deprecated": "off" - } - } - ] -} diff --git a/packages/react-cards/eslint.config.js b/packages/react-cards/eslint.config.js new file mode 100644 index 00000000000000..6c643f546106e4 --- /dev/null +++ b/packages/react-cards/eslint.config.js @@ -0,0 +1,14 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + files: ['**/*.ts', '**/*.tsx'], + rules: { + '@typescript-eslint/no-explicit-any': 'off', + '@typescript-eslint/no-deprecated': 'off', + }, + }, +]; diff --git a/packages/react-cards/src/index.ts b/packages/react-cards/src/index.ts index 478210550d8fbc..49c4565380c6db 100644 --- a/packages/react-cards/src/index.ts +++ b/packages/react-cards/src/index.ts @@ -1,3 +1,4 @@ -export * from './Card'; +export type { ICard, ICardComponent, ICardItem, ICardItemComponent, ICardItemProps, ICardItemSlot, ICardItemSlots, ICardItemStyles, ICardItemStylesReturnType, ICardItemTokenReturnType, ICardItemTokens, ICardItemViewProps, ICardProps, ICardSection, ICardSectionComponent, ICardSectionProps, ICardSectionSlot, ICardSectionSlots, ICardSectionStyles, ICardSectionStylesReturnType, ICardSectionTokenReturnType, ICardSectionTokens, ICardSectionViewProps, ICardSlots, ICardStyles, ICardStylesReturnType, ICardTokenReturnType, ICardTokens } from './Card'; +export { Card, CardItem, CardSection } from './Card'; import './version'; diff --git a/packages/react-conformance/.eslintrc.json b/packages/react-conformance/.eslintrc.json deleted file mode 100644 index 24ece4e08168be..00000000000000 --- a/packages/react-conformance/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/node"], - "root": true -} diff --git a/packages/react-conformance/eslint.config.js b/packages/react-conformance/eslint.config.js new file mode 100644 index 00000000000000..827203cf8f59b7 --- /dev/null +++ b/packages/react-conformance/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/node']]; diff --git a/packages/react-conformance/src/defaultErrorMessages.tsx b/packages/react-conformance/src/defaultErrorMessages.tsx index 753e1eaf6cf6ae..fe70b82bc1aee2 100644 --- a/packages/react-conformance/src/defaultErrorMessages.tsx +++ b/packages/react-conformance/src/defaultErrorMessages.tsx @@ -6,7 +6,7 @@ import * as path from 'path'; import { errorMessageColors, formatArray, getErrorMessage, formatErrors, getPackagePath } from './utils/index'; import { prettyDOM } from '@testing-library/react'; -/* eslint-disable @typescript-eslint/naming-convention */ + /** * General structure of isConformant error messages: diff --git a/packages/react-conformance/src/defaultTests.tsx b/packages/react-conformance/src/defaultTests.tsx index 508dfc47f8149d..99cf72d2e540ee 100644 --- a/packages/react-conformance/src/defaultTests.tsx +++ b/packages/react-conformance/src/defaultTests.tsx @@ -29,8 +29,6 @@ function getTargetElement( : (result.container.firstElementChild as HTMLElement); } -/* eslint-disable @typescript-eslint/naming-convention */ - export const defaultTests: DefaultTestObject = { /** Component file exports a valid React element type */ 'exports-component': (testInfo: IsConformantOptions) => { @@ -496,6 +494,7 @@ export const defaultTests: DefaultTestObject = { try { validateCallbackArguments(getCallbackArguments(tsProgram, rootFileName, propsTypeName, propName)); } catch (err: OptOutStrictCatchTypes) { + // eslint-disable-next-line no-console console.log('err', err); return { ...errors, [propName]: err }; diff --git a/packages/react-conformance/src/utils/getCallbackArguments.test.ts b/packages/react-conformance/src/utils/getCallbackArguments.test.ts index 12f842910dd1df..148d2c3c391763 100644 --- a/packages/react-conformance/src/utils/getCallbackArguments.test.ts +++ b/packages/react-conformance/src/utils/getCallbackArguments.test.ts @@ -292,13 +292,13 @@ describe('getCallbackArguments', () => { export interface AccordionProps { onToggle: (a: TypeB) => void; }`, }); - /* eslint-disable @fluentui/max-len */ + expect(() => getCallbackArguments(program, 'Accordion.types.ts', 'AccordionProps', 'onToggle'), ).toThrowErrorMatchingInlineSnapshot( `"We received a type \\"TypeB\\" that is too complex to resolve. Please simply it, for example remove usage of \\"Pick\\"."`, ); - /* eslint-enable @fluentui/max-len */ + }); }); }); diff --git a/packages/react-conformance/src/utils/validateCallbackArguments.test.ts b/packages/react-conformance/src/utils/validateCallbackArguments.test.ts index 531396ec335d7d..db5bb35d9332a1 100644 --- a/packages/react-conformance/src/utils/validateCallbackArguments.test.ts +++ b/packages/react-conformance/src/utils/validateCallbackArguments.test.ts @@ -54,7 +54,7 @@ describe('validateCallbackArguments', () => { }); it('throws on generic params', () => { - /* eslint-disable @fluentui/max-len */ + expect(() => { validateCallbackArguments([ ['e', 'Event'], @@ -71,7 +71,7 @@ describe('validateCallbackArguments', () => { }).toThrowErrorMatchingInlineSnapshot( `"A first (event) argument cannot use generic React.SyntheticEvent or Event types. Please use more specific types like React.MouseEvent/MouseEvent"`, ); - /* eslint-enable @fluentui/max-len */ + }); }); diff --git a/packages/react-date-time/.eslintrc.json b/packages/react-date-time/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/react-date-time/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/react-date-time/eslint.config.js b/packages/react-date-time/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/react-date-time/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/react-docsite-components/.eslintrc.json b/packages/react-docsite-components/.eslintrc.json deleted file mode 100644 index 99f51edd9d841a..00000000000000 --- a/packages/react-docsite-components/.eslintrc.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "no-restricted-globals": "off" - }, - "overrides": [ - { - "files": "**/*.{ts,tsx}", - "rules": { - // The components in this package are all deprecated - "@typescript-eslint/no-deprecated": "off" - } - } - ] -} diff --git a/packages/react-docsite-components/eslint.config.js b/packages/react-docsite-components/eslint.config.js new file mode 100644 index 00000000000000..55d9d20fc1dcea --- /dev/null +++ b/packages/react-docsite-components/eslint.config.js @@ -0,0 +1,19 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + 'no-restricted-globals': 'off', + }, + }, + { + files: ['**/*.{ts,tsx}'], + rules: { + // The components in this package are all deprecated + '@typescript-eslint/no-deprecated': 'off', + }, + }, +]; diff --git a/packages/react-docsite-components/src/components/ExampleCard/ExampleCard.tsx b/packages/react-docsite-components/src/components/ExampleCard/ExampleCard.tsx index e4e8c43e676a23..e9cf4713e064ba 100644 --- a/packages/react-docsite-components/src/components/ExampleCard/ExampleCard.tsx +++ b/packages/react-docsite-components/src/components/ExampleCard/ExampleCard.tsx @@ -34,7 +34,7 @@ const regionStyles: IStackComponent['styles'] = (props, theme) => ({ }); export class ExampleCardBase extends React.Component { - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _monacoModelRef: React.MutableRefObject = { current: undefined }; /** * Transformed version of the initial `props.code` for editing and/or export to codepen, diff --git a/packages/react-docsite-components/src/index.demo.tsx b/packages/react-docsite-components/src/index.demo.tsx index d8f8ef1d8a2b4f..8c20d35d514877 100644 --- a/packages/react-docsite-components/src/index.demo.tsx +++ b/packages/react-docsite-components/src/index.demo.tsx @@ -10,7 +10,7 @@ createApp( [ examplesOf('Example Group') .add('Example 1', () => ( - // eslint-disable-next-line import/no-webpack-loader-syntax + {require('!raw-loader?esModule=false!@fluentui/react-docsite-components/src/demo/demo.md')} )) .add('Example 2', () =>
Some content for Example 2
) diff --git a/packages/react-docsite-components/src/index.ts b/packages/react-docsite-components/src/index.ts index 0cf9b08453eb43..4ddb0e384f44cc 100644 --- a/packages/react-docsite-components/src/index.ts +++ b/packages/react-docsite-components/src/index.ts @@ -1,16 +1,29 @@ -export * from './components/App/index'; -export * from './components/CodepenComponent/CodepenComponent'; -export * from './components/CodeSnippet/index'; -export * from './components/ComponentPage/index'; -export * from './components/EditSection/index'; -export * from './components/ExampleCard/index'; -export * from './components/FeedbackList/index'; -export * from './components/Header/index'; -export * from './components/Markdown/index'; -export * from './components/MarkdownTable/index'; -export * from './components/PropertiesTable/index'; -export * from './components/ApiReferencesTable/index'; -export * from './utilities/parser/index'; -export * from './utilities/index'; +export type { IAppDefinition, IAppLink, IAppLinkGroup, IAppProps, IAppState, IAppStyleProps, IAppStyles, IAppSubComponentStyles } from './components/App/index'; +export { App, AppBase, ExampleStatus } from './components/App/index'; +export { CONTENT_ID, CodepenComponent } from './components/CodepenComponent/CodepenComponent'; +export type { ICodeSnippetProps, ICodeSnippetStyleProps, ICodeSnippetStyles } from './components/CodeSnippet/index'; +export { CodeSnippet } from './components/CodeSnippet/index'; +export type { IComponentDemoPageProps, IComponentPageProps, IComponentPageSection, IComponentPageStyleProps, IComponentPageStyles } from './components/ComponentPage/index'; +export { ComponentPage, ComponentPageBase } from './components/ComponentPage/index'; +export type { IEditSectionProps, IEditSectionStyleProps, IEditSectionStyles, IEditSectionSubComponentStyles } from './components/EditSection/index'; +export { EditSection, EditSectionBase } from './components/EditSection/index'; +export type { IExampleCardProps, IExampleCardState, IExampleCardStyleProps, IExampleCardStyles, IExampleCardSubComponentStyles } from './components/ExampleCard/index'; +export { ExampleCard, ExampleCardBase } from './components/ExampleCard/index'; +export type { IFeedbackListProps, IFeedbackListState, IFeedbackListStyleProps, IFeedbackListStyles, IFeedbackListSubComponentStyles, IListItem } from './components/FeedbackList/index'; +export { FeedbackList, FeedbackListBase } from './components/FeedbackList/index'; +export type { IHeaderProps, IHeaderState, IHeaderStyleProps, IHeaderStyles, IHeaderSubComponentStyles } from './components/Header/index'; +export { Header, HeaderBase } from './components/Header/index'; +export type { IMarkdownCodeProps, IMarkdownCodeStyleProps, IMarkdownCodeStyles, IMarkdownHeaderProps, IMarkdownHeaderStyleProps, IMarkdownHeaderStyles, IMarkdownParagraphProps, IMarkdownParagraphStyleProps, IMarkdownParagraphStyles, IMarkdownPreProps, IMarkdownProps, IMarkdownStyleProps, IMarkdownStyles, IMarkdownSubComponentStyles } from './components/Markdown/index'; +export { Markdown, MarkdownCode, MarkdownHeader, MarkdownLink, MarkdownParagraph, MarkdownPre } from './components/Markdown/index'; +export type { IMarkdownTableCellProps, IMarkdownTableProps, IMarkdownTableStyleProps, IMarkdownTableStyles } from './components/MarkdownTable/index'; +export { MarkdownCell, MarkdownCellBase, MarkdownTBody, MarkdownTBodyBase, MarkdownTHead, MarkdownTHeadBase, MarkdownTable, MarkdownTableBase, MarkdownTr, MarkdownTrBase } from './components/MarkdownTable/index'; +export type { IPropertiesTableProps, IPropertiesTableSetProps, IPropertiesTableSetStyleProps, IPropertiesTableSetStyles, IPropertiesTableSetSubComponentStyles } from './components/PropertiesTable/index'; +export { PropertiesTable, PropertiesTableSet } from './components/PropertiesTable/index'; +export type { IApiBaseItem, IApiEnumProperty, IApiInterfaceProperty, IApiProperty, IApiReferencesTableProps, IApiReferencesTableSetProps, IApiReferencesTableSetState, IApiReferencesTableState, IMethod, TokenResolver } from './components/ApiReferencesTable/index'; +export { ApiReferencesTable, ApiReferencesTableSet, gapTokens } from './components/ApiReferencesTable/index'; +export type { IEnumProperty, IInterfaceProperty, IProperty } from './utilities/parser/index'; +export { InterfacePropertyType, PropertyType, parse } from './utilities/parser/index'; +export type { IAppThemes, IExample, IExampleCardTheme, IExampleItem, IRouteProps, IRouterProps } from './utilities/index'; +export { AppThemesContext, ExampleGroup, Route, Router, createApp, createDemoApp, createGroups, createListItems, examplesOf, extractAnchorLink, isGroupable, lorem } from './utilities/index'; import './version'; diff --git a/packages/react-docsite-components/src/utilities/parser/InterfaceParserHelper.ts b/packages/react-docsite-components/src/utilities/parser/InterfaceParserHelper.ts index 0b186055f60905..c8b9e71f54d808 100644 --- a/packages/react-docsite-components/src/utilities/parser/InterfaceParserHelper.ts +++ b/packages/react-docsite-components/src/utilities/parser/InterfaceParserHelper.ts @@ -140,7 +140,7 @@ export class InterfaceParserHelper extends BaseParser { description: comment, name: identifierName, type, - defaultValue: defaultValue, + defaultValue, interfacePropertyType: propType, deprecatedMessage, }); diff --git a/packages/react-examples/.eslintrc.json b/packages/react-examples/.eslintrc.json deleted file mode 100644 index 1d6a6413af29ff..00000000000000 --- a/packages/react-examples/.eslintrc.json +++ /dev/null @@ -1,12 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "import/no-webpack-loader-syntax": "off", - "no-alert": "off", - "no-restricted-globals": "off", - "@typescript-eslint/no-explicit-any": "off", - "@typescript-eslint/no-deprecated": "warn", - "@typescript-eslint/explicit-module-boundary-types": "off" - } -} diff --git a/packages/react-examples/eslint.config.js b/packages/react-examples/eslint.config.js new file mode 100644 index 00000000000000..75fe5c99d17632 --- /dev/null +++ b/packages/react-examples/eslint.config.js @@ -0,0 +1,23 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + 'import/no-webpack-loader-syntax': 'off', + 'no-alert': 'off', + 'no-restricted-globals': 'off', + '@typescript-eslint/no-explicit-any': 'off', + '@typescript-eslint/no-deprecated': 'warn', + '@typescript-eslint/explicit-module-boundary-types': 'off', + }, + }, + { + files: ['**/*.Example.{ts,tsx}'], + rules: { + 'import/no-extraneous-dependencies': 'off', + }, + }, +]; diff --git a/packages/react-examples/src/azure-themes/stories/components/slider.stories.tsx b/packages/react-examples/src/azure-themes/stories/components/slider.stories.tsx index c98f81ffb62486..c094538f490aa4 100644 --- a/packages/react-examples/src/azure-themes/stories/components/slider.stories.tsx +++ b/packages/react-examples/src/azure-themes/stories/components/slider.stories.tsx @@ -23,7 +23,7 @@ export const SliderBasicExample: React.FunctionComponent = () => { max={10} value={sliderValue} showValue - // eslint-disable-next-line react/jsx-no-bind + onChange={sliderOnChange} /> { legends={legends} canSelectMultipleLegends selectedLegends={selectedLegends} - // eslint-disable-next-line react/jsx-no-bind + onChange={onChange} styles={{ root: { marginBottom: 10 } }} /> diff --git a/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.AxisCategoryOrder.Example.tsx b/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.AxisCategoryOrder.Example.tsx index 97a2e9f32df1bf..beb16e3ee67c49 100644 --- a/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.AxisCategoryOrder.Example.tsx +++ b/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.AxisCategoryOrder.Example.tsx @@ -199,7 +199,7 @@ export class VSBCAxisCategoryOrderExample extends React.Component<{}, IExampleSt }; } mapXToDataPoints[xAxisPoint].chartData.push({ - data: data, + data, legend: `Legend ${legendIdx + 1}`, color: getNextColor(legendIdx), }); diff --git a/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.DateAxis.Example.tsx b/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.DateAxis.Example.tsx index 114874a24d7189..08c1277b97dd65 100644 --- a/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.DateAxis.Example.tsx +++ b/packages/react-examples/src/react-charting/VerticalStackedBarChart/VerticalStackedBarChart.DateAxis.Example.tsx @@ -238,7 +238,7 @@ export class VerticalStackedBarChartDateAxisExample extends React.Component<{}, }, }, }} - // eslint-disable-next-line react/jsx-no-bind + {...(this.state.selectedCallout === 'singleCallout' && { onRenderCalloutPerDataPoint: (props: IVSChartDataPoint) => { return props ? ( diff --git a/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Footer.Example.tsx b/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Footer.Example.tsx index 38a3235fbdfb64..0064c384ca9a06 100644 --- a/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Footer.Example.tsx +++ b/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Footer.Example.tsx @@ -69,7 +69,7 @@ type ReactProps = { ref?: React.Ref; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export interface IFooterComponent extends ReactProps { buttonProps: IButtonProps[]; activities: string; diff --git a/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Xsmall.Footer.Example.tsx b/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Xsmall.Footer.Example.tsx index 7b10220e0a73e2..7707f1e19cb3ce 100644 --- a/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Xsmall.Footer.Example.tsx +++ b/packages/react-examples/src/react-experiments/Chiclet/Chiclet.Xsmall.Footer.Example.tsx @@ -71,7 +71,7 @@ type ReactProps = { ref?: React.Ref; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + interface IFooterComponent extends ReactProps { buttonProps: IButtonProps[]; attachProps: IIconProps; diff --git a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.Basic.DragDrop.Example.tsx b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.Basic.DragDrop.Example.tsx index c1a55cfc544a1e..e628592a7f6158 100644 --- a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.Basic.DragDrop.Example.tsx +++ b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.Basic.DragDrop.Example.tsx @@ -18,7 +18,7 @@ export const SelectedPeopleListBasicDragDropExample = (): JSXEleme const [draggedItem, setDraggedItem] = React.useState(); const [draggedIndex, setDraggedIndex] = React.useState(-1); const dragDropHelper = new DragDropHelper({ - selection: selection, + selection, minimumPixelsForDrag: 5, }); diff --git a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.DragDropBetweenWells.Example.tsx b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.DragDropBetweenWells.Example.tsx index 6223e3a19d668d..37cbb5d4d59472 100644 --- a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.DragDropBetweenWells.Example.tsx +++ b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.DragDropBetweenWells.Example.tsx @@ -16,7 +16,7 @@ const SelectedPeopleListBasicDragDropExample = (): JSXElement => { const selection = new Selection(); const dragDropHelper = new DragDropHelper({ - selection: selection, + selection, minimumPixelsForDrag: 5, }); diff --git a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEdit.Example.tsx b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEdit.Example.tsx index 9db25181ec2185..24e85567854eb0 100644 --- a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEdit.Example.tsx +++ b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEdit.Example.tsx @@ -29,7 +29,7 @@ export const SelectedPeopleListWithEditExample = (): JSXElement => { const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', value)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); return suggestionList; }; diff --git a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEditInContextMenu.Example.tsx b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEditInContextMenu.Example.tsx index e91efec937bb61..cad04d375f02c5 100644 --- a/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEditInContextMenu.Example.tsx +++ b/packages/react-examples/src/react-experiments/SelectedPeopleList/SelectedPeopleList.WithEditInContextMenu.Example.tsx @@ -29,7 +29,7 @@ export const SelectedPeopleListWithEditInContextMenuExample = (): JSXElement => const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', value)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); return suggestionList; }; diff --git a/packages/react-examples/src/react-experiments/Slider/Slider.Example.tsx b/packages/react-examples/src/react-experiments/Slider/Slider.Example.tsx index 617032bd0eaa90..1c23c6fa4716b9 100644 --- a/packages/react-examples/src/react-experiments/Slider/Slider.Example.tsx +++ b/packages/react-examples/src/react-experiments/Slider/Slider.Example.tsx @@ -5,7 +5,7 @@ import { IStackTokens, Stack } from '@fluentui/react'; import type { JSXElement } from '@fluentui/utilities'; // Workaround to prevent errors on usage of Slider, without disabling all deprecation checks -// eslint-disable-next-line @typescript-eslint/no-deprecated + const Slider = DeprecatedSlider; export interface ISliderBasicExampleState { diff --git a/packages/react-examples/src/react-experiments/Slider/Slider.Vertical.Example.tsx b/packages/react-examples/src/react-experiments/Slider/Slider.Vertical.Example.tsx index 3840a529bccec9..8a6b3ef930428f 100644 --- a/packages/react-examples/src/react-experiments/Slider/Slider.Vertical.Example.tsx +++ b/packages/react-examples/src/react-experiments/Slider/Slider.Vertical.Example.tsx @@ -4,7 +4,7 @@ import { Slider as DeprecatedSlider } from '@fluentui/react-experiments'; import { IStackTokens, Stack } from '@fluentui/react/lib/Stack'; // Workaround to prevent errors on usage of Slider, without disabling all deprecation checks -// eslint-disable-next-line @typescript-eslint/no-deprecated + const Slider = DeprecatedSlider; export interface ISliderVerticalExampleState { diff --git a/packages/react-examples/src/react-experiments/TilesList/ExampleHelpers.tsx b/packages/react-examples/src/react-experiments/TilesList/ExampleHelpers.tsx index 64f518cf92b79e..5a9bd11943fa83 100644 --- a/packages/react-examples/src/react-experiments/TilesList/ExampleHelpers.tsx +++ b/packages/react-examples/src/react-experiments/TilesList/ExampleHelpers.tsx @@ -77,10 +77,10 @@ export function createDocumentItems(count: number, indexOffset: number): IExampl export function createGroup(items: IExampleItem[], type: 'document' | 'media', index: number): IExampleGroup { return { - items: items, - index: index, + items, + index, name: lorem(4), - type: type, + type, key: `group-${index}`, }; } @@ -167,7 +167,7 @@ export function getExampleTilesListCells( width: isLargeSize ? 171 * item.aspectRatio : 135 * item.aspectRatio, height: isLargeSize ? 171 : 135, }, - onRenderCell: onRenderCell, + onRenderCell, isPlaceholder: shimmerMode, }; }), @@ -195,14 +195,14 @@ export function createShimmerGroups(type: 'document' | 'media', index: number): { key: `shimmerItem-${index}`, name: lorem(4), - index: index, + index, aspectRatio: 1, }, ], - index: index, + index, name: lorem(4), key: `shimmerGroup-${index}`, - type: type, + type, }, ]; } diff --git a/packages/react-examples/src/react-experiments/TilesList/TilesList.Document.Example.tsx b/packages/react-examples/src/react-experiments/TilesList/TilesList.Document.Example.tsx index 6354f8b8e66d6e..74cbe9b5ce621b 100644 --- a/packages/react-examples/src/react-experiments/TilesList/TilesList.Document.Example.tsx +++ b/packages/react-examples/src/react-experiments/TilesList/TilesList.Document.Example.tsx @@ -180,7 +180,7 @@ export class TilesListDocumentExample extends React.Component< this.setState({ isDataLoaded: !isDataLoaded, - cells: cells, + cells, }); }; diff --git a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/DoubleUnifiedPeoplePicker.Example.tsx b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/DoubleUnifiedPeoplePicker.Example.tsx index ed3923a6bf778d..08cccf2b52114a 100644 --- a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/DoubleUnifiedPeoplePicker.Example.tsx +++ b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/DoubleUnifiedPeoplePicker.Example.tsx @@ -200,7 +200,7 @@ const UnifiedPeoplePickerExample = (): JSXElement => { const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', filterText)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); const updatedItems: IPersonaProps[] = []; diff --git a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.Example.tsx b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.Example.tsx index 85f6fe12572d0d..3ccc57f9764f54 100644 --- a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.Example.tsx +++ b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.Example.tsx @@ -236,7 +236,7 @@ export const UnifiedPeoplePickerExample = (): JSXElement => { const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', filterText)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); // We want to show top 5 results setPeopleSuggestions(suggestionList.splice(0, 5)); diff --git a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.WithEdit.Example.tsx b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.WithEdit.Example.tsx index 736502c38c85ec..2606118d6a5a88 100644 --- a/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.WithEdit.Example.tsx +++ b/packages/react-examples/src/react-experiments/UnifiedPeoplePicker/UnifiedPeoplePicker.WithEdit.Example.tsx @@ -142,7 +142,7 @@ export const UnifiedPeoplePickerWithEditExample = (): JSXElement => { const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', value)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); return suggestionList; }; @@ -328,7 +328,7 @@ export const UnifiedPeoplePickerWithEditExample = (): JSXElement => { const allPeople = people; const suggestions = allPeople.filter((item: IPersonaProps) => _startsWith(item.text || '', filterText)); const suggestionList = suggestions.map(item => { - return { item: item, isSelected: false, key: item.key } as IFloatingSuggestionItem; + return { item, isSelected: false, key: item.key } as IFloatingSuggestionItem; }); // We want to show top 5 results setPeopleSuggestions(suggestionList.splice(0, 5)); diff --git a/packages/react-examples/src/react/ComboBox/ComboBox.CustomStyled.Example.tsx b/packages/react-examples/src/react/ComboBox/ComboBox.CustomStyled.Example.tsx index af8e64257ef3a3..86a4dcaa675996 100644 --- a/packages/react-examples/src/react/ComboBox/ComboBox.CustomStyled.Example.tsx +++ b/packages/react-examples/src/react/ComboBox/ComboBox.CustomStyled.Example.tsx @@ -72,7 +72,7 @@ const onRenderOption = (item: IComboBoxOption) => { fontFamily = fontMapping[newFontName] = `"${newFontName}","Segoe UI",Tahoma,Sans-Serif`; } - return {item.text}; + return {item.text}; } }; diff --git a/packages/react-examples/src/react/CommandBar/CommandBar.CommandBarButtonAs.Example.tsx b/packages/react-examples/src/react/CommandBar/CommandBar.CommandBarButtonAs.Example.tsx index 263f338b2bd380..8dde03ce9c893e 100644 --- a/packages/react-examples/src/react/CommandBar/CommandBar.CommandBarButtonAs.Example.tsx +++ b/packages/react-examples/src/react/CommandBar/CommandBar.CommandBarButtonAs.Example.tsx @@ -59,7 +59,7 @@ const overflowButtonProps: IButtonProps = { }; /** Command bar which renders the Share button with a coachmark */ -// eslint-disable-next-line @fluentui/max-len + const IndividualCommandBarButtonAsExample: React.FunctionComponent< IIndividualCommandBarButtonAsExampleProps > = props => { diff --git a/packages/react-examples/src/react/ContextualMenu/ContextualMenu.Directional.Example.tsx b/packages/react-examples/src/react/ContextualMenu/ContextualMenu.Directional.Example.tsx index 722894ebf232ff..4f22ebbcb59cbe 100644 --- a/packages/react-examples/src/react/ContextualMenu/ContextualMenu.Directional.Example.tsx +++ b/packages/react-examples/src/react/ContextualMenu/ContextualMenu.Directional.Example.tsx @@ -36,8 +36,8 @@ export const ContextualMenuDirectionalExample: React.FunctionComponent = () => { const menuProps: IContextualMenuProps = React.useMemo( () => ({ - isBeakVisible: isBeakVisible, - directionalHint: directionalHint, + isBeakVisible, + directionalHint, directionalHintForRTL: useDirectionalHintForRTL ? directionalHintForRTL : undefined, gapSpace: 0, beakWidth: 20, diff --git a/packages/react-examples/src/react/DetailsList/DetailsList.KeyboardAccessibleResizeAndReorder.Example.tsx b/packages/react-examples/src/react/DetailsList/DetailsList.KeyboardAccessibleResizeAndReorder.Example.tsx index 9ffccaa8deadcd..76989978648855 100644 --- a/packages/react-examples/src/react/DetailsList/DetailsList.KeyboardAccessibleResizeAndReorder.Example.tsx +++ b/packages/react-examples/src/react/DetailsList/DetailsList.KeyboardAccessibleResizeAndReorder.Example.tsx @@ -222,12 +222,12 @@ export const DetailsListKeyboardAccessibleResizeAndReorderExample: React.Functio switch (ev.key) { case 'ArrowLeft': detailsList?.updateColumn(column, { - width: column?.currentWidth ? column?.currentWidth * 0.9 : column.minWidth, + width: column?.currentWidth ? column.currentWidth * 0.9 : column.minWidth, }); break; case 'ArrowRight': detailsList?.updateColumn(column, { - width: column?.currentWidth ? column?.currentWidth * 1.1 : column.minWidth, + width: column?.currentWidth ? column.currentWidth * 1.1 : column.minWidth, }); break; } diff --git a/packages/react-examples/src/react/ExtendedPeoplePicker/ExtendedPeoplePicker.Basic.Example.tsx b/packages/react-examples/src/react/ExtendedPeoplePicker/ExtendedPeoplePicker.Basic.Example.tsx index 760f838dd839a5..4ef9cd33c979a2 100644 --- a/packages/react-examples/src/react/ExtendedPeoplePicker/ExtendedPeoplePicker.Basic.Example.tsx +++ b/packages/react-examples/src/react/ExtendedPeoplePicker/ExtendedPeoplePicker.Basic.Example.tsx @@ -180,11 +180,11 @@ export const ExtendedPeoplePickerBasicExample: React.FunctionComponent = () => { getTextFromItem: (persona: IPersonaProps) => persona.text || '', pickerSuggestionsProps: suggestionProps, key: 'normal', - onRemoveSuggestion: onRemoveSuggestion, + onRemoveSuggestion, onValidateInput: validateInput, onZeroQuerySuggestion: returnMostRecentlyUsed, showForceResolve: shouldShowForceResolve, - onInputChanged: onInputChanged, + onInputChanged, onSuggestionsHidden: () => { console.log('FloatingPicker: hidden'); }, @@ -194,14 +194,14 @@ export const ExtendedPeoplePickerBasicExample: React.FunctionComponent = () => { }; const selectedItemsListProps = { - onCopyItems: onCopyItems, + onCopyItems, onExpandGroup: onExpandItem, removeMenuItemText: 'Remove', copyMenuItemText: 'Copy name', editMenuItemText: 'Edit', - getEditingItemText: getEditingItemText, + getEditingItemText, onRenderFloatingPicker: FloatingPeoplePicker, - floatingPickerProps: floatingPickerProps, + floatingPickerProps, }; return ( diff --git a/packages/react-examples/src/react/ExtendedPicker/ExtendedPeoplePicker.Basic.Example.tsx b/packages/react-examples/src/react/ExtendedPicker/ExtendedPeoplePicker.Basic.Example.tsx index 7b99c7ec9365df..e9b6d993e9669d 100644 --- a/packages/react-examples/src/react/ExtendedPicker/ExtendedPeoplePicker.Basic.Example.tsx +++ b/packages/react-examples/src/react/ExtendedPicker/ExtendedPeoplePicker.Basic.Example.tsx @@ -180,11 +180,11 @@ export const ExtendedPeoplePickerBasicExample: React.FunctionComponent = () => { getTextFromItem: (persona: IPersonaProps) => persona.text || '', pickerSuggestionsProps: suggestionProps, key: 'normal', - onRemoveSuggestion: onRemoveSuggestion, + onRemoveSuggestion, onValidateInput: validateInput, onZeroQuerySuggestion: returnMostRecentlyUsed, showForceResolve: shouldShowForceResolve, - onInputChanged: onInputChanged, + onInputChanged, onSuggestionsHidden: () => { console.log('FLOATINGPICKER: hidden'); }, @@ -194,14 +194,14 @@ export const ExtendedPeoplePickerBasicExample: React.FunctionComponent = () => { }; const selectedItemsListProps = { - onCopyItems: onCopyItems, + onCopyItems, onExpandGroup: onExpandItem, removeMenuItemText: 'Remove', copyMenuItemText: 'Copy name', editMenuItemText: 'Edit', - getEditingItemText: getEditingItemText, + getEditingItemText, onRenderFloatingPicker: FloatingPeoplePicker, - floatingPickerProps: floatingPickerProps, + floatingPickerProps, }; return ( diff --git a/packages/react-examples/src/react/GroupedList/GroupedList.Basic.Example.tsx b/packages/react-examples/src/react/GroupedList/GroupedList.Basic.Example.tsx index cd34ff05805070..7bb21d4c046a0a 100644 --- a/packages/react-examples/src/react/GroupedList/GroupedList.Basic.Example.tsx +++ b/packages/react-examples/src/react/GroupedList/GroupedList.Basic.Example.tsx @@ -9,12 +9,12 @@ import { createListItems, createGroups, IExampleItem } from '@fluentui/example-d const toggleStyles: Partial = { root: { marginBottom: '20px' } }; const groupCount = 3; const groupDepth = 3; -const items = createListItems(Math.pow(groupCount, groupDepth + 1)); +const items = createListItems(groupCount**(groupDepth + 1)); const columns = Object.keys(items[0]) .slice(0, 3) .map( (key: string): IColumn => ({ - key: key, + key, name: key, fieldName: key, minWidth: 300, diff --git a/packages/react-examples/src/react/GroupedList/GroupedList.CustomCheckbox.Example.tsx b/packages/react-examples/src/react/GroupedList/GroupedList.CustomCheckbox.Example.tsx index eaeeab38b00ccf..5d45cad74101ad 100644 --- a/packages/react-examples/src/react/GroupedList/GroupedList.CustomCheckbox.Example.tsx +++ b/packages/react-examples/src/react/GroupedList/GroupedList.CustomCheckbox.Example.tsx @@ -36,14 +36,14 @@ const onRenderGroupHeaderCheckbox = (props?: IGroupHeaderCheckboxProps) => { }; export const GroupedListCustomCheckboxExample: React.FunctionComponent = () => { - const items: IObjectWithKey[] = useConst(() => createListItems(Math.pow(groupCount, groupDepth + 1))); + const items: IObjectWithKey[] = useConst(() => createListItems(groupCount**(groupDepth + 1))); const groups = useConst(() => createGroups(groupCount, groupDepth, 0, groupCount)); const columns = useConst(() => Object.keys(items[0]) .slice(0, 3) .map( (key: string): IColumn => ({ - key: key, + key, name: key, fieldName: key, minWidth: 300, diff --git a/packages/react-examples/src/react/GroupedList/GroupedListV2.Basic.Example.tsx b/packages/react-examples/src/react/GroupedList/GroupedListV2.Basic.Example.tsx index 8528c6e4b02465..7409a11ba37d83 100644 --- a/packages/react-examples/src/react/GroupedList/GroupedListV2.Basic.Example.tsx +++ b/packages/react-examples/src/react/GroupedList/GroupedListV2.Basic.Example.tsx @@ -10,12 +10,12 @@ import { createListItems, createGroups, IExampleItem } from '@fluentui/example-d const toggleStyles: Partial = { root: { marginBottom: '20px' } }; const groupCount = 3; const groupDepth = 3; -const items = createListItems(Math.pow(groupCount, groupDepth + 1)); +const items = createListItems(groupCount**(groupDepth + 1)); const columns = Object.keys(items[0]) .slice(0, 3) .map( (key: string): IColumn => ({ - key: key, + key, name: key, fieldName: key, minWidth: 300, diff --git a/packages/react-examples/src/react/GroupedList/GroupedListV2.CustomCheckbox.Example.tsx b/packages/react-examples/src/react/GroupedList/GroupedListV2.CustomCheckbox.Example.tsx index ab6a009930b5d8..d39446dcaf22e8 100644 --- a/packages/react-examples/src/react/GroupedList/GroupedListV2.CustomCheckbox.Example.tsx +++ b/packages/react-examples/src/react/GroupedList/GroupedListV2.CustomCheckbox.Example.tsx @@ -36,14 +36,14 @@ const onRenderGroupHeaderCheckbox = (props?: IGroupHeaderCheckboxProps) => { }; export const GroupedListV2CustomCheckboxExample: React.FunctionComponent = () => { - const items: IObjectWithKey[] = useConst(() => createListItems(Math.pow(groupCount, groupDepth + 1))); + const items: IObjectWithKey[] = useConst(() => createListItems(groupCount**(groupDepth + 1))); const groups = useConst(() => createGroups(groupCount, groupDepth, 0, groupCount)); const columns = useConst(() => Object.keys(items[0]) .slice(0, 3) .map( (key: string): IColumn => ({ - key: key, + key, name: key, fieldName: key, minWidth: 300, diff --git a/packages/react-examples/src/react/HoverCard/HoverCard.Basic.Example.tsx b/packages/react-examples/src/react/HoverCard/HoverCard.Basic.Example.tsx index ec776cb43a93f2..2208ff90a579db 100644 --- a/packages/react-examples/src/react/HoverCard/HoverCard.Basic.Example.tsx +++ b/packages/react-examples/src/react/HoverCard/HoverCard.Basic.Example.tsx @@ -60,8 +60,8 @@ const onRenderExpandedCard = (item: IExampleItem): JSXElement => { const onRenderItemColumn = (item: IExampleItem, index: number, column: IColumn): JSXElement | string | number => { const expandingCardProps: IExpandingCardProps = { - onRenderCompactCard: onRenderCompactCard, - onRenderExpandedCard: onRenderExpandedCard, + onRenderCompactCard, + onRenderExpandedCard, renderData: item, }; if (column.key === 'location') { diff --git a/packages/react-examples/src/react/HoverCard/HoverCard.EventListenerTarget.Example.tsx b/packages/react-examples/src/react/HoverCard/HoverCard.EventListenerTarget.Example.tsx index f82251f465f887..4edc732f251df7 100644 --- a/packages/react-examples/src/react/HoverCard/HoverCard.EventListenerTarget.Example.tsx +++ b/packages/react-examples/src/react/HoverCard/HoverCard.EventListenerTarget.Example.tsx @@ -31,7 +31,7 @@ export const HoverCardEventListenerTargetExample: React.FunctionComponent = () = const targetRef = React.useRef(null); const eventListenerTargetRef = React.useRef(null); const plainCardProps: IPlainCardProps = { - onRenderPlainCard: onRenderPlainCard, + onRenderPlainCard, directionalHint: DirectionalHint.rightTopEdge, }; return ( diff --git a/packages/react-examples/src/react/HoverCard/HoverCard.InstantDismiss.Example.tsx b/packages/react-examples/src/react/HoverCard/HoverCard.InstantDismiss.Example.tsx index a3a9e1d1d4db91..64c7578c1a87fd 100644 --- a/packages/react-examples/src/react/HoverCard/HoverCard.InstantDismiss.Example.tsx +++ b/packages/react-examples/src/react/HoverCard/HoverCard.InstantDismiss.Example.tsx @@ -50,7 +50,7 @@ export const HoverCardInstantDismissExample: React.FunctionComponent = () => { ); }; const plainCardProps: IPlainCardProps = { - onRenderPlainCard: onRenderPlainCard, + onRenderPlainCard, }; return ( diff --git a/packages/react-examples/src/react/HoverCard/HoverCard.PlainCard.Example.tsx b/packages/react-examples/src/react/HoverCard/HoverCard.PlainCard.Example.tsx index 46dacfdac8ce80..306973bcc9756c 100644 --- a/packages/react-examples/src/react/HoverCard/HoverCard.PlainCard.Example.tsx +++ b/packages/react-examples/src/react/HoverCard/HoverCard.PlainCard.Example.tsx @@ -36,7 +36,7 @@ const onRenderPlainCard = (item: IExampleItem): JSXElement => { }; const onRenderItemColumn = (item: IExampleItem, index: number, column: IColumn): JSXElement | string | number => { const plainCardProps: IPlainCardProps = { - onRenderPlainCard: onRenderPlainCard, + onRenderPlainCard, renderData: item, }; if (column.key === 'color') { diff --git a/packages/react-examples/src/react/PeoplePicker/PeoplePicker.Controlled.Example.tsx b/packages/react-examples/src/react/PeoplePicker/PeoplePicker.Controlled.Example.tsx index d28205a61c6b81..3027ced57e324d 100644 --- a/packages/react-examples/src/react/PeoplePicker/PeoplePicker.Controlled.Example.tsx +++ b/packages/react-examples/src/react/PeoplePicker/PeoplePicker.Controlled.Example.tsx @@ -5,7 +5,7 @@ import { IPersonaProps, Persona } from '@fluentui/react/lib/Persona'; import { IBasePickerSuggestionsProps, NormalPeoplePicker } from '@fluentui/react/lib/Pickers'; import { people } from '@fluentui/example-data'; -/* eslint-disable react-hooks/rules-of-hooks */ + const suggestionProps: IBasePickerSuggestionsProps = { suggestionsHeaderText: 'Suggested People', diff --git a/packages/react-examples/src/react/ResizeGroup/ResizeGroup.OverflowSet.Example.tsx b/packages/react-examples/src/react/ResizeGroup/ResizeGroup.OverflowSet.Example.tsx index 91476d1c415162..a8239d9e622d3c 100644 --- a/packages/react-examples/src/react/ResizeGroup/ResizeGroup.OverflowSet.Example.tsx +++ b/packages/react-examples/src/react/ResizeGroup/ResizeGroup.OverflowSet.Example.tsx @@ -45,7 +45,7 @@ const generateData = (count: number, cachingEnabled: boolean, checked: boolean): key: `item${index}`, name: `Item ${index}`, icon: icons[index % icons.length], - checked: checked, + checked, }; cacheKey = cacheKey + item.key; dataItems.push(item); diff --git a/packages/react-examples/src/react/ResizeGroup/ResizeGroup.VerticalOverflowSet.Example.tsx b/packages/react-examples/src/react/ResizeGroup/ResizeGroup.VerticalOverflowSet.Example.tsx index fcc7449b053530..37bfd8a4656073 100644 --- a/packages/react-examples/src/react/ResizeGroup/ResizeGroup.VerticalOverflowSet.Example.tsx +++ b/packages/react-examples/src/react/ResizeGroup/ResizeGroup.VerticalOverflowSet.Example.tsx @@ -24,7 +24,7 @@ const generateData = (count: number, cachingEnabled: boolean, checked: boolean): key: `item${index}`, name: `Item ${index}`, icon: icons[index % icons.length], - checked: checked, + checked, }; }); let result: IOverflowData = { diff --git a/packages/react-experiments/.eslintrc.json b/packages/react-experiments/.eslintrc.json deleted file mode 100644 index 94cce37333d4c9..00000000000000 --- a/packages/react-experiments/.eslintrc.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "@typescript-eslint/no-explicit-any": "off", - "no-restricted-globals": "off" - } -} diff --git a/packages/react-experiments/eslint.config.js b/packages/react-experiments/eslint.config.js new file mode 100644 index 00000000000000..4e1bdaf4f300c9 --- /dev/null +++ b/packages/react-experiments/eslint.config.js @@ -0,0 +1,13 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + '@typescript-eslint/no-explicit-any': 'off', + 'no-restricted-globals': 'off', + }, + }, +]; diff --git a/packages/react-experiments/src/components/BAFAccordion/Accordion.tsx b/packages/react-experiments/src/components/BAFAccordion/Accordion.tsx index 4afe2366f44c01..842157ddeedb3f 100644 --- a/packages/react-experiments/src/components/BAFAccordion/Accordion.tsx +++ b/packages/react-experiments/src/components/BAFAccordion/Accordion.tsx @@ -33,7 +33,7 @@ export class Accordion extends React.Component } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { // eslint-disable-next-line @typescript-eslint/no-deprecated const { onRenderMenu, className, buttonAs, onClick, ...other } = this.props; diff --git a/packages/react-experiments/src/components/Chiclet/Chiclet.base.tsx b/packages/react-experiments/src/components/Chiclet/Chiclet.base.tsx index 59422c1b8d6509..bec65101c054eb 100644 --- a/packages/react-experiments/src/components/Chiclet/Chiclet.base.tsx +++ b/packages/react-experiments/src/components/Chiclet/Chiclet.base.tsx @@ -7,7 +7,7 @@ import type { IChicletCardProps } from './ChicletCard.types'; import type { JSXElement } from '@fluentui/utilities'; export class ChicletBase extends React.Component { - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const props: IChicletCardProps = this.props; switch (this.props.size) { diff --git a/packages/react-experiments/src/components/Chiclet/Chiclet.types.ts b/packages/react-experiments/src/components/Chiclet/Chiclet.types.ts index 9b9335e5505511..1a4396bfbc1c97 100644 --- a/packages/react-experiments/src/components/Chiclet/Chiclet.types.ts +++ b/packages/react-experiments/src/components/Chiclet/Chiclet.types.ts @@ -40,7 +40,7 @@ export interface IChicletProps extends React.HTMLAttributes { /** * Description to render for the component in place of the url. */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + description?: React.ReactElement; /** @@ -71,7 +71,7 @@ export interface IChicletProps extends React.HTMLAttributes { /** * Footer to render for the component. */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + footer?: React.ReactElement; /** diff --git a/packages/react-experiments/src/components/Chiclet/ChicletCard.base.tsx b/packages/react-experiments/src/components/Chiclet/ChicletCard.base.tsx index 4022ae12e175ea..a7e9064b3f8d8c 100644 --- a/packages/react-experiments/src/components/Chiclet/ChicletCard.base.tsx +++ b/packages/react-experiments/src/components/Chiclet/ChicletCard.base.tsx @@ -22,7 +22,7 @@ const imageStyling = mergeStyles({ export class ChicletCardBase extends React.Component { private _classNames: { [key in keyof IChicletCardStyles]: string }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { title, description, url, onClick, className, footer, theme, styles } = this.props; @@ -45,7 +45,7 @@ export class ChicletCardBase extends React.Component { ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderPreview(): JSXElement { const { image, imageAlt, preview } = this.props; diff --git a/packages/react-experiments/src/components/Chiclet/ChicletXsmall.base.tsx b/packages/react-experiments/src/components/Chiclet/ChicletXsmall.base.tsx index 3735341f681aad..13f435648076ed 100644 --- a/packages/react-experiments/src/components/Chiclet/ChicletXsmall.base.tsx +++ b/packages/react-experiments/src/components/Chiclet/ChicletXsmall.base.tsx @@ -22,7 +22,7 @@ const imageStyling = mergeStyles({ export class ChicletXsmallBase extends React.Component { private _classNames: { [key in keyof IChicletCardStyles]: string }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { onClick, title, className, footer, theme, styles, url } = this.props; @@ -45,7 +45,7 @@ export class ChicletXsmallBase extends React.Component { ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderPreview(): JSXElement { const { image, imageAlt, preview } = this.props; diff --git a/packages/react-experiments/src/components/FloatingSuggestions/FloatingPeopleSuggestions/defaults/DefaultPeopleSuggestionsItem.tsx b/packages/react-experiments/src/components/FloatingSuggestions/FloatingPeopleSuggestions/defaults/DefaultPeopleSuggestionsItem.tsx index fc09b4d210a968..9070d5c5b549df 100644 --- a/packages/react-experiments/src/components/FloatingSuggestions/FloatingPeopleSuggestions/defaults/DefaultPeopleSuggestionsItem.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestions/FloatingPeopleSuggestions/defaults/DefaultPeopleSuggestionsItem.tsx @@ -8,7 +8,7 @@ import type { JSXElement } from '@fluentui/utilities'; export const DefaultPeopleSuggestionsItem = ( props: ISuggestionModel, - // eslint-disable-next-line @typescript-eslint/no-deprecated + ): JSXElement => { const item = props.item; return ( diff --git a/packages/react-experiments/src/components/FloatingSuggestions/FloatingSuggestions.tsx b/packages/react-experiments/src/components/FloatingSuggestions/FloatingSuggestions.tsx index f28786ea217c9c..fbce13b59b05d6 100644 --- a/packages/react-experiments/src/components/FloatingSuggestions/FloatingSuggestions.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestions/FloatingSuggestions.tsx @@ -145,7 +145,7 @@ export class FloatingSuggestions } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { className } = this.props; return ( @@ -190,7 +190,7 @@ export class FloatingSuggestions }); } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSuggestions(): JSXElement | null { // Express this as 2 separate statements instead of a single one, because `undefined` isn't filtered out of the type // when using `|| SuggestionsControl` diff --git a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/Suggestions.types.ts b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/Suggestions.types.ts index 569cf08fd5a224..5a31094d5b60ae 100644 --- a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/Suggestions.types.ts +++ b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/Suggestions.types.ts @@ -88,7 +88,7 @@ export interface ISuggestionsControlProps extends React.ClassAttributes, } export interface ISuggestionsHeaderFooterProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + renderItem: () => JSXElement; onExecute?: () => void; className?: string; @@ -98,7 +98,7 @@ export interface ISuggestionsHeaderFooterProps { export interface ISuggestionsHeaderFooterItemProps { componentRef?: IRefObject<{}>; - // eslint-disable-next-line @typescript-eslint/no-deprecated + renderItem: () => JSXElement; onExecute?: () => void; isSelected: boolean; diff --git a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsControl.tsx b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsControl.tsx index d83eae80683f1c..d3b96c26b54557 100644 --- a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsControl.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsControl.tsx @@ -31,7 +31,7 @@ export class SuggestionsHeaderFooterItem extends React.Component extends React.Component< public componentWillUnmount(): void { this._suggestions.current?.deselectAllSuggestions(); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { className, headerItemsProps, footerItemsProps } = this.props; @@ -208,7 +208,7 @@ export class SuggestionsControl extends React.Component< } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderHeaderItems(): JSXElement | null { const { headerItemsProps, suggestionsHeaderContainerAriaLabel } = this.props; const { selectedHeaderIndex } = this.state; @@ -243,7 +243,7 @@ export class SuggestionsControl extends React.Component< ) : null; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderFooterItems(): JSXElement | null { const { footerItemsProps, suggestionsFooterContainerAriaLabel } = this.props; const { selectedFooterIndex } = this.state; @@ -278,7 +278,7 @@ export class SuggestionsControl extends React.Component< ) : null; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSuggestions(): JSXElement { return ref={this._suggestions} {...this.props} suggestions={this.state.suggestions} />; } diff --git a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsCore.tsx b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsCore.tsx index 335f8b862fcf99..850a9ebd2ff19a 100644 --- a/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsCore.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestions/Suggestions/SuggestionsCore.tsx @@ -131,7 +131,7 @@ export class SuggestionsCore extends React.Component JSXElement = ( personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps, diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingPeopleSuggestions/FloatingPeopleSuggestions.tsx b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingPeopleSuggestions/FloatingPeopleSuggestions.tsx index a9c1dd65a293a0..85df06b550c8ed 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingPeopleSuggestions/FloatingPeopleSuggestions.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingPeopleSuggestions/FloatingPeopleSuggestions.tsx @@ -6,10 +6,10 @@ import type { IPersonaProps } from '@fluentui/react/lib/Persona'; import type { IFloatingSuggestionOnRenderItemProps } from '../FloatingSuggestionsItem/FloatingSuggestionsItem.types'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const FloatingPeopleSuggestions = (props: IFloatingPeopleSuggestionsProps): JSXElement => { const renderSuggestionItem = React.useCallback( - // eslint-disable-next-line @typescript-eslint/no-deprecated + (suggestionItemProps: IFloatingSuggestionOnRenderItemProps): JSXElement => { return SuggestionItemNormal({ ...suggestionItemProps.item }); }, diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.tsx b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.tsx index ca4a5a409826a6..975bf7b6d64b01 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.tsx @@ -10,7 +10,7 @@ import type { } from './FloatingSuggestions.types'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const BaseFloatingSuggestions = (props: IBaseFloatingSuggestionsProps): JSXElement => { const getClassNames = classNamesFunction(); const classNames = getClassNames(getStyles); diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.types.ts b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.types.ts index e0e1359b55c797..198abd2585ca39 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.types.ts +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestions.types.ts @@ -31,7 +31,7 @@ export interface IBaseFloatingSuggestionsProps { /** * Custom component to render suggestion */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderSuggestion?: (renderProps: IFloatingSuggestionOnRenderItemProps) => JSXElement; /** * Callback function on remove of suggestion from list @@ -45,13 +45,13 @@ export interface IBaseFloatingSuggestionsProps { * Custom header renderer which takes suggestions and headertext if passed * Going forward, this should accept the user defined type as parameter */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderHeader?: (suggestionItems?: IFloatingSuggestionItemProps[], suggestionsHeaderText?: string) => JSXElement; /** * Custom footer renderer which takes suggestions as param * Going forward, this should accept the user defined type as param */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderFooter?: (suggestionItems?: IFloatingSuggestionItemProps[]) => JSXElement; /** * Callback when the callout dismiss is called diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.tsx b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.tsx index 114537d67dc955..1977d7a5f82352 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.tsx @@ -13,7 +13,7 @@ const getClassNames = classNamesFunction< IFloatingSuggestionHeaderFooterItemStyles >(); -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const FloatingSuggestionsHeaderFooterItem = (props: IFloatingSuggestionsHeaderFooterItemProps): JSXElement => { const { renderItem, onExecute, isSelected, id, className } = props; const classNames = getClassNames(getStyles); diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.types.ts b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.types.ts index 776acf3d3d35c1..4f626e1fc16553 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.types.ts +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsHeaderFooterItem/FloatingSuggestionsHeaderFooterItem.types.ts @@ -2,7 +2,7 @@ import type { ITheme, IStyle } from '@fluentui/style-utilities'; import type { JSXElement } from '@fluentui/utilities'; export interface IFloatingSuggestionsHeaderFooterProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + renderItem: () => JSXElement; onExecute?: () => void; className?: string; @@ -11,7 +11,7 @@ export interface IFloatingSuggestionsHeaderFooterProps { } export interface IFloatingSuggestionsHeaderFooterItemProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + renderItem: () => JSXElement; onExecute?: () => void; isSelected: boolean; diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.tsx b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.tsx index f8946f2e52e8e8..5a1543351d37ac 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.tsx @@ -10,7 +10,7 @@ import type { } from './FloatingSuggestionsItem.types'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const FloatingSuggestionsItem = (props: IFloatingSuggestionItemProps): JSXElement => { const { id, diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.types.ts b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.types.ts index a45103adc8a868..0a57083c3640f5 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.types.ts +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsItem/FloatingSuggestionsItem.types.ts @@ -18,7 +18,7 @@ export interface IFloatingSuggestionItemProps { key?: string; id?: string; theme?: ITheme; - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderSuggestion?: (renderProps: IFloatingSuggestionOnRenderItemProps) => JSXElement; } diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.tsx b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.tsx index 992d7f9b6ee9d3..a9284c24824782 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.tsx +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.tsx @@ -13,7 +13,7 @@ import type { JSXElement } from '@fluentui/utilities'; const getClassNames = classNamesFunction(); -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const FloatingSuggestionsList = (props: IFloatingSuggestionsListProps): JSXElement => { const classNames = getClassNames(getStyles); const { className, suggestionItems, onRenderNoResultFound, ariaLabel, noResultsFoundText } = props; @@ -23,7 +23,7 @@ export const FloatingSuggestionsList = (props: IFloatingSuggestion return noResultsFoundText ?
{noResultsFoundText}
: null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const renderHeader = (): JSXElement | null => { const { onRenderHeader, @@ -70,7 +70,7 @@ export const FloatingSuggestionsList = (props: IFloatingSuggestion return suggestionsHeaderText ?
{suggestionsHeaderText}
: null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const renderFooter = (): JSXElement | null => { const { onRenderFooter, footerItemsProps, selectedFooterIndex, suggestionsFooterContainerAriaLabel } = props; @@ -111,7 +111,7 @@ export const FloatingSuggestionsList = (props: IFloatingSuggestion return null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const renderSuggestions = (): JSXElement | null => { if (suggestionItems.length === 0) { return null; diff --git a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.types.ts b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.types.ts index 80ecf805f9caea..41e6122f84cc88 100644 --- a/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.types.ts +++ b/packages/react-experiments/src/components/FloatingSuggestionsComposite/FloatingSuggestionsList/FloatingSuggestionsList.types.ts @@ -13,7 +13,7 @@ export interface IFloatingSuggestionsListProps { className?: string; suggestionsItemClassName?: string; suggestionsHeaderText?: string; - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderItem?: (renderProps: IFloatingSuggestionOnRenderItemProps) => JSXElement; onItemClick?: (ev: React.MouseEvent, item: IFloatingSuggestionItemProps) => void; onSuggestionRemove?: (ev: React.MouseEvent, item: IFloatingSuggestionItemProps) => void; @@ -24,9 +24,9 @@ export interface IFloatingSuggestionsListProps { ariaLabel?: string; removeItemAriaLabel?: string; id?: string | number; - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderHeader?: (suggestionItems?: IFloatingSuggestionItemProps[], suggestionsHeaderText?: string) => JSXElement; - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderFooter?: (suggestionItems?: IFloatingSuggestionItemProps[]) => JSXElement; suggestionsContainerAriaLabel?: string; selectedSuggestionIndex?: number; diff --git a/packages/react-experiments/src/components/FolderCover/FolderCover.tsx b/packages/react-experiments/src/components/FolderCover/FolderCover.tsx index 5313282d654486..e83383fd4ece37 100644 --- a/packages/react-experiments/src/components/FolderCover/FolderCover.tsx +++ b/packages/react-experiments/src/components/FolderCover/FolderCover.tsx @@ -72,7 +72,7 @@ const ASSETS: { }; export class FolderCover extends React.Component { - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement | null { const { folderCoverSize: size = 'large', @@ -122,7 +122,7 @@ export class FolderCover extends React.Component ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderChildren({ children }: Pick): JSXElement | null { const finalChildren = typeof children === 'function' ? children(getFolderCoverLayoutFromProps(this.props)) : children; @@ -139,7 +139,7 @@ export interface IFolderCoverLayout { contentSize: ISize; } -// eslint-disable-next-line @typescript-eslint/no-deprecated + export function getFolderCoverLayout(element: JSXElement): IFolderCoverLayout { const folderCoverProps: IFolderCoverProps = element.props; @@ -156,7 +156,7 @@ function getFolderCoverLayoutFromProps(folderCoverProps: IFolderCoverProps): IFo }; } -// eslint-disable-next-line @typescript-eslint/no-deprecated + export function renderFolderCoverWithLayout(element: JSXElement, props: Partial): JSXElement { const Tag = element.type; diff --git a/packages/react-experiments/src/components/FolderCover/FolderCover.types.ts b/packages/react-experiments/src/components/FolderCover/FolderCover.types.ts index b21e4b6a861f24..9f4cad3bb2c92f 100644 --- a/packages/react-experiments/src/components/FolderCover/FolderCover.types.ts +++ b/packages/react-experiments/src/components/FolderCover/FolderCover.types.ts @@ -39,6 +39,6 @@ export interface IFolderCoverProps extends IBaseProps, React.HTMLAttributes JSXElement | null); } diff --git a/packages/react-experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/react-experiments/src/components/LayoutGroup/LayoutGroup.tsx index 59557a6fc091fa..99ee5a18338270 100644 --- a/packages/react-experiments/src/components/LayoutGroup/LayoutGroup.tsx +++ b/packages/react-experiments/src/components/LayoutGroup/LayoutGroup.tsx @@ -12,7 +12,7 @@ export class LayoutGroup extends React.Component { justify: 'start', }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement | null { const { children, direction, layoutGap, justify } = this.props; diff --git a/packages/react-experiments/src/components/MicroFeedback/MicroFeedback.view.tsx b/packages/react-experiments/src/components/MicroFeedback/MicroFeedback.view.tsx index fe564a57f05827..043ad21a158392 100644 --- a/packages/react-experiments/src/components/MicroFeedback/MicroFeedback.view.tsx +++ b/packages/react-experiments/src/components/MicroFeedback/MicroFeedback.view.tsx @@ -58,9 +58,9 @@ export const MicroFeedbackView: IMicroFeedbackComponent['view'] = props => { }, }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const renderFollowup = (followUp: IMicroFeedbackQuestion, targetRef: HTMLDivElement | null): JSXElement => { - // eslint-disable-next-line @typescript-eslint/no-deprecated + const onRenderCalloutItem = (item: string, index: number | undefined): JSXElement => { const listOption = (): void => { onCalloutDismiss(); diff --git a/packages/react-experiments/src/components/Pagination/PageNumber.tsx b/packages/react-experiments/src/components/Pagination/PageNumber.tsx index edd92edb5910b3..cc45196e623fd2 100644 --- a/packages/react-experiments/src/components/Pagination/PageNumber.tsx +++ b/packages/react-experiments/src/components/Pagination/PageNumber.tsx @@ -8,7 +8,7 @@ export class PageNumber extends React.Component { super(props); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { ariaLabel, page, selected, className } = this.props; diff --git a/packages/react-experiments/src/components/Pagination/Pagination.base.tsx b/packages/react-experiments/src/components/Pagination/Pagination.base.tsx index 3479581f545954..14cc206d45e538 100644 --- a/packages/react-experiments/src/components/Pagination/Pagination.base.tsx +++ b/packages/react-experiments/src/components/Pagination/Pagination.base.tsx @@ -37,7 +37,7 @@ export class PaginationBase extends React.Component { initializeComponentRef(this); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { comboBoxAriaLabel, @@ -209,7 +209,7 @@ export class PaginationBase extends React.Component { private _handleNextPage = () => { this._handleSelectedPage(this.props.selectedPageIndex! + 1); }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _pageElement(index: number): JSXElement { const { pageAriaLabel, pageCount, selectedPageIndex, selectedAriaLabel, strings } = this.props; const isSelected = index === selectedPageIndex; @@ -231,7 +231,7 @@ export class PaginationBase extends React.Component { ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _pageList(): JSXElement[] { const { numberOfPageButton, pageCount, selectedPageIndex } = this.props; const pageList = []; @@ -259,7 +259,7 @@ export class PaginationBase extends React.Component { return pageList; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderVisibleItemLabel = (props: IPaginationProps): JSXElement | null => { if (props.onRenderVisibleItemLabel) { return
{props.onRenderVisibleItemLabel(props)}
; diff --git a/packages/react-experiments/src/components/Persona/Persona.tsx b/packages/react-experiments/src/components/Persona/Persona.tsx index 7d60514fdfcb6f..49522737c7f950 100644 --- a/packages/react-experiments/src/components/Persona/Persona.tsx +++ b/packages/react-experiments/src/components/Persona/Persona.tsx @@ -5,7 +5,7 @@ import type { IHorizontalPersonaProps } from './Persona.types'; import type { IVerticalPersonaProps } from './Vertical/VerticalPersona.types'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const Persona = (props: IVerticalPersonaProps | IHorizontalPersonaProps): JSXElement => { return props.vertical === true ? : ; }; diff --git a/packages/react-experiments/src/components/PersonaCoin/PersonaCoinImage/PersonaCoinImage.tsx b/packages/react-experiments/src/components/PersonaCoin/PersonaCoinImage/PersonaCoinImage.tsx index b93c7dcbd95e28..1539f1a5a02acd 100644 --- a/packages/react-experiments/src/components/PersonaCoin/PersonaCoinImage/PersonaCoinImage.tsx +++ b/packages/react-experiments/src/components/PersonaCoin/PersonaCoinImage/PersonaCoinImage.tsx @@ -13,7 +13,7 @@ const personaCoinImageStyles: IPersonaCoinComponent['styles'] = { }, }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + const PersonaCoinImageView = (props: IPersonaCoinImageProps): JSXElement | null => { if (!props.src) { return null; diff --git a/packages/react-experiments/src/components/PersonaCoin/PersonaCoinSize10/PersonaCoinSize10.tsx b/packages/react-experiments/src/components/PersonaCoin/PersonaCoinSize10/PersonaCoinSize10.tsx index 8e395bcd048028..163abf4724603d 100644 --- a/packages/react-experiments/src/components/PersonaCoin/PersonaCoinSize10/PersonaCoinSize10.tsx +++ b/packages/react-experiments/src/components/PersonaCoin/PersonaCoinSize10/PersonaCoinSize10.tsx @@ -9,7 +9,7 @@ export type IPersonaCoinSize10Slot = ISlotProp; const styles = { root: { fontSize: 10 } }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + const PersonaCoinSize10 = (): JSXElement => { return ; }; diff --git a/packages/react-experiments/src/components/SelectedItemsList/Items/subcomponents/DefaultEditingItem.tsx b/packages/react-experiments/src/components/SelectedItemsList/Items/subcomponents/DefaultEditingItem.tsx index 7f72525157e330..687c54d69e8b57 100644 --- a/packages/react-experiments/src/components/SelectedItemsList/Items/subcomponents/DefaultEditingItem.tsx +++ b/packages/react-experiments/src/components/SelectedItemsList/Items/subcomponents/DefaultEditingItem.tsx @@ -86,7 +86,7 @@ export type EditingItemInnerFloatingPickerProps = Pick< */ export const DefaultEditingItemInner = ( props: IDefaultEditingItemInnerProps, - // eslint-disable-next-line @typescript-eslint/no-deprecated + ): JSXElement => { const editingInput = React.useRef(null); const editingFloatingPicker = React.createRef(); @@ -132,7 +132,7 @@ export const DefaultEditingItemInner = ( // eslint-disable-next-line react-hooks/exhaustive-deps }, []); // We only want to run this once - // eslint-disable-next-line @typescript-eslint/no-deprecated + const _renderEditingSuggestions = (): JSXElement => { const FloatingPicker = props.onRenderFloatingPicker; if (!FloatingPicker) { diff --git a/packages/react-experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedPersona.tsx b/packages/react-experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedPersona.tsx index f2e4243fc77626..1138889dbf00d8 100644 --- a/packages/react-experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedPersona.tsx +++ b/packages/react-experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedPersona.tsx @@ -81,7 +81,7 @@ const SelectedPersonaInner = React.memo( const dragDropOptions: IDragDropOptions = { eventMap: eventsToRegister, selectionIndex: index, - context: { data: item, index: index }, + context: { data: item, index }, ...dragDropEvents, updateDropState: _updateDroppingState, }; diff --git a/packages/react-experiments/src/components/Sidebar/Sidebar.tsx b/packages/react-experiments/src/components/Sidebar/Sidebar.tsx index af8ec59166f80e..a801c225b9829a 100644 --- a/packages/react-experiments/src/components/Sidebar/Sidebar.tsx +++ b/packages/react-experiments/src/components/Sidebar/Sidebar.tsx @@ -53,7 +53,7 @@ export class Sidebar extends React.Component imple } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { theme, styles, collapseButtonStyles, className, collapseButtonAriaLabel, footerItems, id, items } = this.props; @@ -137,13 +137,13 @@ export class Sidebar extends React.Component imple public getCollapsed(): boolean { return this.state.isCollapsed; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderItemInSidebar(item: ISidebarItemProps): JSXElement | null { if (!item) { return null; } if (item.onRender) { - // eslint-disable-next-line @typescript-eslint/no-deprecated + return item.onRender(item, () => undefined) as JSXElement; } else if (item.items && item.items.length > 0) { return this._renderSidebarItemWithChildren(item); @@ -151,7 +151,7 @@ export class Sidebar extends React.Component imple return this._renderSidebarButton(item); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSidebarButton(item: ISidebarItemProps, overrideCollapse: boolean = false): JSXElement | null { if (!item) { return null; @@ -182,7 +182,7 @@ export class Sidebar extends React.Component imple ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSidebarItemWithChildren(item: ISidebarItemProps): JSXElement | null { if (!item || !item.items) { return null; @@ -195,7 +195,7 @@ export class Sidebar extends React.Component imple return this._renderSidebarButtonWithMenu(item); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSidebarAccordion(item: ISidebarItemProps): JSXElement | null { if (!item || !item.items) { return null; @@ -244,7 +244,7 @@ export class Sidebar extends React.Component imple ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderAccordionItems(items: ISidebarItemProps[] | undefined): JSXElement | null { if (!items) { return null; @@ -261,7 +261,7 @@ export class Sidebar extends React.Component imple return
{children}
; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSidebarButtonWithMenu(item: ISidebarItemProps): JSXElement | null { if (!item || !item.items) { return null; @@ -366,7 +366,7 @@ export class Sidebar extends React.Component imple return className; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSidebarButtonMenuItem = (item: any, dismissMenu: () => void): JSXElement | null => { return this._renderSidebarButton(item, true); }; diff --git a/packages/react-experiments/src/components/Slider/Slider.base.tsx b/packages/react-experiments/src/components/Slider/Slider.base.tsx index 47a0b60f2b014c..6f4bcb020b3805 100644 --- a/packages/react-experiments/src/components/Slider/Slider.base.tsx +++ b/packages/react-experiments/src/components/Slider/Slider.base.tsx @@ -72,7 +72,7 @@ export class SliderBase extends React.Component impl props.value !== undefined ? props.value : props.defaultValue !== undefined ? props.defaultValue : props.min; this.state = { - value: value, + value, renderedValue: undefined, }; } @@ -401,7 +401,7 @@ export class SliderBase extends React.Component impl let numDec = 0; if (isFinite(step!)) { - while (Math.round(step! * Math.pow(10, numDec)) / Math.pow(10, numDec) !== step!) { + while (Math.round(step! * 10**numDec) / 10**numDec !== step!) { numDec++; } } diff --git a/packages/react-experiments/src/components/Slider/Slider.test.tsx b/packages/react-experiments/src/components/Slider/Slider.test.tsx index cdf3956209bd42..3c4dc64febe00f 100644 --- a/packages/react-experiments/src/components/Slider/Slider.test.tsx +++ b/packages/react-experiments/src/components/Slider/Slider.test.tsx @@ -7,7 +7,7 @@ import { ONKEYDOWN_TIMEOUT_DURATION } from './Slider.base'; import { KeyCodes } from '../../Utilities'; import type { ISlider } from './Slider.types'; -/* eslint-disable @typescript-eslint/no-deprecated */ + describe('Slider', () => { it('renders correctly', () => { diff --git a/packages/react-experiments/src/components/StaticList/List.types.ts b/packages/react-experiments/src/components/StaticList/List.types.ts index b7babf82e86919..83ac9a4d2108fa 100644 --- a/packages/react-experiments/src/components/StaticList/List.types.ts +++ b/packages/react-experiments/src/components/StaticList/List.types.ts @@ -12,6 +12,6 @@ export interface IGenericListProps { itemHeight: number; /** Callback to render one item in the list */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderItem: (item: TItem, index: number) => JSXElement | null; } diff --git a/packages/react-experiments/src/components/StaticList/StaticList.tsx b/packages/react-experiments/src/components/StaticList/StaticList.tsx index d1069c5b4643ef..b901f4030165a9 100644 --- a/packages/react-experiments/src/components/StaticList/StaticList.tsx +++ b/packages/react-experiments/src/components/StaticList/StaticList.tsx @@ -6,7 +6,7 @@ import type { IStaticListProps } from './StaticList.types'; import type { JSXElement } from '@fluentui/utilities'; export class StaticList extends React.Component> { - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { className, items, onRenderItem, listTagName: ListTag = 'ul' } = this.props; diff --git a/packages/react-experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx b/packages/react-experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx index 48f509001fe156..ed2329650de124 100644 --- a/packages/react-experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx +++ b/packages/react-experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx @@ -60,7 +60,7 @@ export class ShimmerTileBase extends React.Component { initializeComponentRef(this); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { styles, diff --git a/packages/react-experiments/src/components/Tile/Tile.tsx b/packages/react-experiments/src/components/Tile/Tile.tsx index 20b9f199fefaac..8802af5367dd49 100644 --- a/packages/react-experiments/src/components/Tile/Tile.tsx +++ b/packages/react-experiments/src/components/Tile/Tile.tsx @@ -80,7 +80,7 @@ export class Tile extends React.Component { private _events: EventGroup; constructor(props: ITileProps, context?: any) { - // eslint-disable-next-line @typescript-eslint/no-deprecated + super(props, context); initializeComponentRef(this); @@ -148,7 +148,7 @@ export class Tile extends React.Component { this._events.dispose(); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { children, @@ -299,7 +299,7 @@ export class Tile extends React.Component { ); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderBackground = (backgroundProps?: ITileBackgroundProps): JSXElement | null => { if (!backgroundProps) { return null; @@ -324,7 +324,7 @@ export class Tile extends React.Component { ) : null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderForeground = (foregroundProps?: ITileForegroundProps): JSXElement | null => { if (!foregroundProps) { return null; @@ -352,7 +352,7 @@ export class Tile extends React.Component { ) : null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderNameplate = (nameplateProps?: ITileNameplateProps): JSXElement | null => { if (!nameplateProps) { return null; @@ -384,7 +384,7 @@ export class Tile extends React.Component { ) : null; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderCheck({ isSelected }: { isSelected: boolean }): JSXElement { const { toggleSelectionAriaLabel } = this.props; @@ -419,7 +419,7 @@ export class Tile extends React.Component { export type { ITileLayout }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export function getTileLayout(tileElement: JSXElement): ITileLayout { const tileProps: ITileProps = tileElement.props; @@ -459,7 +459,7 @@ function getTileLayoutFromProps(tileProps: ITileProps): ITileLayout { }; } -// eslint-disable-next-line @typescript-eslint/no-deprecated + export function renderTileWithLayout(tileElement: JSXElement, props: Partial): JSXElement { const Tag = tileElement.type; diff --git a/packages/react-experiments/src/components/Tile/Tile.types.ts b/packages/react-experiments/src/components/Tile/Tile.types.ts index e46daf03a1abd1..a5535b4fe652aa 100644 --- a/packages/react-experiments/src/components/Tile/Tile.types.ts +++ b/packages/react-experiments/src/components/Tile/Tile.types.ts @@ -19,14 +19,14 @@ export interface ITileStateProps extends ITileLayout { } export interface ITileForegroundProps extends ITileStateProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + foreground: JSXElement | null; hideForeground: boolean; className?: string; } export interface ITileBackgroundProps extends ITileStateProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + background: JSXElement | null; hideBackground: boolean; className?: string; @@ -80,7 +80,7 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes JSXElement | null); /** * Full override for rendering the background. @@ -98,7 +98,7 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes JSXElement | null); /** * Full override for rendering the foreground. diff --git a/packages/react-experiments/src/components/TilesList/TilesList.tsx b/packages/react-experiments/src/components/TilesList/TilesList.tsx index 6dcaa481022de8..46076266b088ca 100644 --- a/packages/react-experiments/src/components/TilesList/TilesList.tsx +++ b/packages/react-experiments/src/components/TilesList/TilesList.tsx @@ -109,7 +109,7 @@ export class TilesList extends React.Component, IT private listRef: React.RefObject; constructor(props: ITilesListProps, context?: any) { - // eslint-disable-next-line @typescript-eslint/no-deprecated + super(props, context); this.listRef = React.createRef(); @@ -133,7 +133,7 @@ export class TilesList extends React.Component, IT } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { cells } = this.state; @@ -212,7 +212,7 @@ export class TilesList extends React.Component, IT } return 0; // Stub } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderCell(item: ITileCell, finalSize: ITileSize, column: number): JSXElement { if (item.grid.mode === TilesGridMode.none) { return ( @@ -261,7 +261,7 @@ export class TilesList extends React.Component, IT private _onRenderListRoot = ( props: IListOnRenderRootProps, defaultRender?: IRenderFunction>, - // eslint-disable-next-line @typescript-eslint/no-deprecated + ): JSXElement | null => { const { onRenderRoot } = this.props; @@ -287,7 +287,7 @@ export class TilesList extends React.Component, IT } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + const baseOnRenderRoot = (baseProps: ITilesListRootProps): JSXElement | null => { return defaultRender({ ...props, @@ -314,7 +314,7 @@ export class TilesList extends React.Component, IT * By default, List provides no special formatting for a list page. For Tiles, the parent element * needs flexbox metadata and padding to support the alignment rules. */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _onRenderPage = (pageProps?: IPageProps, defaultRender?: IRenderFunction): JSXElement | null => { if (!pageProps) { return null; @@ -420,7 +420,7 @@ export class TilesList extends React.Component, IT } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + const renderedCell = (keyOffset: number = 0): JSXElement => { return (
extends React.Component, IT currentRowCells = []; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + const finalGrid: JSXElement = (
extends React.Component, IT return pageSpecification; }; - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderRow: IRenderFunction> = (props: ITilesListRowProps): JSXElement => { const { cellElements, divProps } = props; diff --git a/packages/react-experiments/src/components/TilesList/TilesList.types.ts b/packages/react-experiments/src/components/TilesList/TilesList.types.ts index 74b90a1f3928f5..156851004a1e69 100644 --- a/packages/react-experiments/src/components/TilesList/TilesList.types.ts +++ b/packages/react-experiments/src/components/TilesList/TilesList.types.ts @@ -18,13 +18,13 @@ export interface ITilesGridItemCellProps { } export interface ITilesListRowProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + cellElements: JSXElement[]; divProps: React.HTMLAttributes; } export interface ITilesListRootProps { - // eslint-disable-next-line @typescript-eslint/no-deprecated + surfaceElement: JSXElement | null; divProps: React.HTMLAttributes; rowCount: number; @@ -61,7 +61,7 @@ export interface ITilesGridItem { * Provided positioning and sizing information in addition to the item. * Preferred over `onRender`. */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderCell?: (props: ITilesGridItemCellProps) => JSXElement | null; } @@ -145,7 +145,7 @@ type RemovedReactProps = { export interface ITilesListProps extends IBaseProps, - RemovedReactProps>, // eslint-disable-line @typescript-eslint/no-deprecated + RemovedReactProps>, React.HTMLAttributes { /** * An array of items to assign to the list. diff --git a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPeoplePicker/UnifiedPeoplePicker.tsx b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPeoplePicker/UnifiedPeoplePicker.tsx index a0b19efb337cdf..c22c5a2ac3498f 100644 --- a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPeoplePicker/UnifiedPeoplePicker.tsx +++ b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPeoplePicker/UnifiedPeoplePicker.tsx @@ -8,10 +8,10 @@ import type { IFloatingPeopleSuggestionsProps } from '../../FloatingSuggestionsC import type { ISelectedPeopleListProps } from '../../SelectedItemsList/SelectedPeopleList/SelectedPeopleList'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const UnifiedPeoplePicker = (props: IUnifiedPeoplePickerProps): JSXElement => { const renderSelectedItems = React.useCallback( - // eslint-disable-next-line @typescript-eslint/no-deprecated + (selectedPeopleListProps: ISelectedPeopleListProps): JSXElement => { return ; }, @@ -21,7 +21,7 @@ export const UnifiedPeoplePicker = (props: IUnifiedPeoplePickerProps): JSXElemen ); const renderFloatingPeopleSuggestions = React.useCallback( - // eslint-disable-next-line @typescript-eslint/no-deprecated + (floatingPeoplePickerProps: IFloatingPeopleSuggestionsProps): JSXElement => { return ; }, diff --git a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.tsx b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.tsx index d66471b1c97882..ae70ee51ce3f6c 100644 --- a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.tsx +++ b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.tsx @@ -15,7 +15,7 @@ import type { IUnifiedPickerProps } from './UnifiedPicker.types'; import type { IFloatingSuggestionItemProps } from '../../FloatingSuggestionsComposite'; import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const UnifiedPicker = (props: IUnifiedPickerProps): JSXElement => { const getClassNames = classNamesFunction(); const classNames = getClassNames(getStyles); @@ -557,7 +557,7 @@ export const UnifiedPicker = (props: IUnifiedPickerProps): JSXE }, [onPaste, selectedItems, selection, setSelectedItems], ); - // eslint-disable-next-line @typescript-eslint/no-deprecated + const _renderSelectedItemsList = (): JSXElement => { return onRenderSelectedItems({ ...selectedItemsListProps, diff --git a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.types.ts b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.types.ts index 2209a9d0974dd9..6eb91489af51dc 100644 --- a/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.types.ts +++ b/packages/react-experiments/src/components/UnifiedPicker/UnifiedPicker.types.ts @@ -21,7 +21,7 @@ export interface IUnifiedPickerProps { * Component to render selected items * selectedItemsListProps will be passed as props to this component */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderSelectedItems: (props: ISelectedItemsListProps) => JSXElement; /** @@ -33,7 +33,7 @@ export interface IUnifiedPickerProps { * Component to render floating suggestions * floatingSuggestionProps will be passed as props to this component */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + onRenderFloatingSuggestions: (props: IBaseFloatingSuggestionsProps) => JSXElement; /** @@ -75,7 +75,7 @@ export interface IUnifiedPickerProps { /** * Header component */ - // eslint-disable-next-line @typescript-eslint/no-deprecated + headerComponent?: JSXElement; /** diff --git a/packages/react-experiments/src/components/UnifiedPicker/hooks/useFloatingSuggestionItems.ts b/packages/react-experiments/src/components/UnifiedPicker/hooks/useFloatingSuggestionItems.ts index 67c7f4c0bfd565..ee00e7376db639 100644 --- a/packages/react-experiments/src/components/UnifiedPicker/hooks/useFloatingSuggestionItems.ts +++ b/packages/react-experiments/src/components/UnifiedPicker/hooks/useFloatingSuggestionItems.ts @@ -267,27 +267,27 @@ export const useFloatingSuggestionItems = ( }; return { - focusItemIndex: focusItemIndex, - setFocusItemIndex: setFocusItemIndex, - suggestionItems: suggestionItems, - setSuggestionItems: setSuggestionItems, - footerItemIndex: footerItemIndex, - setFooterItemIndex: setFooterItemIndex, - footerItems: footerItems, - setFooterItems: setFooterItems, - headerItemIndex: headerItemIndex, - setHeaderItemIndex: setHeaderItemIndex, - headerItems: headerItems, - setHeaderItems: setHeaderItems, - isSuggestionsShown: isSuggestionsShown, - showPicker: showPicker, - selectNextSuggestion: selectNextSuggestion, - selectPreviousSuggestion: selectPreviousSuggestion, - getFocusedSuggestion: getFocusedSuggestion, - hasSuggestionSelected: hasSuggestionSelected, - removeSuggestion: removeSuggestion, - clearPickerSelectedIndex: clearPickerSelectedIndex, - queryString: queryString, - setQueryString: setQueryString, + focusItemIndex, + setFocusItemIndex, + suggestionItems, + setSuggestionItems, + footerItemIndex, + setFooterItemIndex, + footerItems, + setFooterItems, + headerItemIndex, + setHeaderItemIndex, + headerItems, + setHeaderItems, + isSuggestionsShown, + showPicker, + selectNextSuggestion, + selectPreviousSuggestion, + getFocusedSuggestion, + hasSuggestionSelected, + removeSuggestion, + clearPickerSelectedIndex, + queryString, + setQueryString, }; }; diff --git a/packages/react-experiments/src/components/UnifiedPicker/hooks/useSelectedItems.ts b/packages/react-experiments/src/components/UnifiedPicker/hooks/useSelectedItems.ts index 817358f48a277a..110fa941547e72 100644 --- a/packages/react-experiments/src/components/UnifiedPicker/hooks/useSelectedItems.ts +++ b/packages/react-experiments/src/components/UnifiedPicker/hooks/useSelectedItems.ts @@ -164,17 +164,17 @@ export const useSelectedItems = ( return { selectedItems: items, - setSelectedItems: setSelectedItems, - addItems: addItems, - dropItemsAt: dropItemsAt, - removeItemAt: removeItemAt, - removeItem: removeItem, - replaceItem: replaceItem, - removeItems: removeItems, - removeSelectedItems: removeSelectedItems, - getSelectedItems: getSelectedItems, - hasSelectedItems: hasSelectedItems, - unselectAll: unselectAll, - selectAll: selectAll, + setSelectedItems, + addItems, + dropItemsAt, + removeItemAt, + removeItem, + replaceItem, + removeItems, + removeSelectedItems, + getSelectedItems, + hasSelectedItems, + unselectAll, + selectAll, } as IUseSelectedItemsResponse; }; diff --git a/packages/react-experiments/src/components/VirtualizedList/VirtualizedList.tsx b/packages/react-experiments/src/components/VirtualizedList/VirtualizedList.tsx index 80c730aff496d0..abdfb31adda5b2 100644 --- a/packages/react-experiments/src/components/VirtualizedList/VirtualizedList.tsx +++ b/packages/react-experiments/src/components/VirtualizedList/VirtualizedList.tsx @@ -40,7 +40,7 @@ export class VirtualizedList extends React.Compone private _events: EventGroup; constructor(props: IVirtualizedListProps, context: IScrollContainerContext) { - // eslint-disable-next-line @typescript-eslint/no-deprecated + super(props, context); this._events = new EventGroup(this); @@ -86,7 +86,7 @@ export class VirtualizedList extends React.Compone } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { className } = this.props; const { items } = this.state; @@ -106,7 +106,7 @@ export class VirtualizedList extends React.Compone this.context.scrollContainer.observe(ref); } } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderItems(scrollTop: number, viewportHeight: number): (JSXElement | null)[] { const { itemHeight, items, itemOverdraw = 2 } = this.props; @@ -139,10 +139,10 @@ export class VirtualizedList extends React.Compone return this._renderRanges(ranges); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderRanges(ranges: IRange[]): (JSXElement | null)[] { const { items, onRenderItem } = this.props; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const result: (JSXElement | null)[] = []; // Assume ranges are sorted. @@ -178,7 +178,7 @@ export class VirtualizedList extends React.Compone return result; } - // eslint-disable-next-line @typescript-eslint/no-deprecated + private _renderSpacerItem(numberOfItems: number, index: number): JSXElement { const { itemHeight, items = [], spacerItemTagName: ItemTag = 'div' } = this.props; diff --git a/packages/react-experiments/src/components/signals/Signal.tsx b/packages/react-experiments/src/components/signals/Signal.tsx index 8601c50042dce8..299909fa8b6460 100644 --- a/packages/react-experiments/src/components/signals/Signal.tsx +++ b/packages/react-experiments/src/components/signals/Signal.tsx @@ -9,7 +9,7 @@ export interface ISignalProps extends React.HTMLAttributes { export type Signal = React.FunctionComponent; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const Signal: Signal = (props: ISignalProps): JSXElement => { const { ariaLabel, className, children, ...spanProps } = props; diff --git a/packages/react-experiments/src/components/signals/SignalField.tsx b/packages/react-experiments/src/components/signals/SignalField.tsx index d6d70bd4ece636..3aa9a61d628315 100644 --- a/packages/react-experiments/src/components/signals/SignalField.tsx +++ b/packages/react-experiments/src/components/signals/SignalField.tsx @@ -16,7 +16,7 @@ export interface ISignalFieldProps extends React.HTMLAttributes * Pass `` or related components in for the `before` and `after` fields. * Pass the main value as the children. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const SignalField: React.FunctionComponent = (props: ISignalFieldProps): JSXElement => { const { before, after, className, signalsFieldMode = 'compact', ...spanProps } = props; return ( diff --git a/packages/react-experiments/src/components/signals/Signals.tsx b/packages/react-experiments/src/components/signals/Signals.tsx index bf8e59d7f4b885..51319d1b1eaa65 100644 --- a/packages/react-experiments/src/components/signals/Signals.tsx +++ b/packages/react-experiments/src/components/signals/Signals.tsx @@ -12,16 +12,16 @@ import type { JSXElement } from '@fluentui/utilities'; export * from './Signal'; export * from './SignalField'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const YouCheckedOutSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const BlockedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const MissingMetadataSignal: Signal = (props: ISignalProps): JSXElement => { return ( { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const TrendingSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const RecordSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const NeedsRepublishingSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const ItemScheduledSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; @@ -68,7 +68,7 @@ export const ItemScheduledSignal: Signal = (props: ISignalProps): JSXElement => /** * Renders a signal marking the proceeding content as new. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const NewSignal: Signal = (props: ISignalProps): JSXElement => { const { ariaLabel, ...spanProps } = props; @@ -87,14 +87,14 @@ export const NewSignal: Signal = (props: ISignalProps): JSXElement => { /** * Renders a signal for a live-edit scenario. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const LiveEditSignal: Signal = (props: ISignalProps): JSXElement => { const { className, ...spanProps } = props; return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const MentionSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; @@ -102,7 +102,7 @@ export const MentionSignal: Signal = (props: ISignalProps): JSXElement => { /** * Renders a signal for a number of comments. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const CommentsSignal: Signal = (props: ISignalProps): JSXElement => { const { ariaLabel, className, children, ...spanProps } = props; @@ -122,46 +122,46 @@ export const CommentsSignal: Signal = (props: ISignalProps): JSXElement => { /** * Renders a signal for a number of comments. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const UnseenReplySignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const UnseenEditSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const ReadOnlySignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const EmailedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const SharedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const DesktopSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const DocumentsSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const PicturesSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const MalwareDetectedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; @@ -171,17 +171,17 @@ export const ATPSignal: Signal = MalwareDetectedSignal; // TODO Delete on next m /** * Renders a signal for an external item. */ -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const ExternalSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const NotFollowedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; -// eslint-disable-next-line @typescript-eslint/no-deprecated + export const FollowedSignal: Signal = (props: ISignalProps): JSXElement => { return ; }; diff --git a/packages/react-experiments/src/index.ts b/packages/react-experiments/src/index.ts index 0e20ab6e153546..3620c909c4b167 100644 --- a/packages/react-experiments/src/index.ts +++ b/packages/react-experiments/src/index.ts @@ -1,19 +1,186 @@ -export * from './Chiclet'; -export * from './CollapsibleSection'; -export * from './CommandBar'; -export * from './FolderCover'; -export * from './LayoutGroup'; -export * from './MicroFeedback'; -export * from './Pagination'; -export * from './Persona'; -export * from './PersonaCoin'; -export * from './Sidebar'; -export * from './Signals'; -export * from './Slider'; -export * from './StaticList'; -export * from './Text'; -export * from './Tile'; -export * from './TilesList'; -export * from './VirtualizedList'; +export type { IChiclet, IChicletProps, IChicletStyleProps, IChicletStyles } from './Chiclet'; +export { + Chiclet, + ChicletBase, + ChicletCard, + ChicletCardBase, + ChicletSize, + ChicletXsmall, + ChicletXsmallBase, +} from './Chiclet'; +export type { + ICollapsibleSection, + ICollapsibleSectionComponent, + ICollapsibleSectionProps, + ICollapsibleSectionSlots, + ICollapsibleSectionStyles, + ICollapsibleSectionStylesReturnType, + ICollapsibleSectionTitleComponent, + ICollapsibleSectionTitleProps, + ICollapsibleSectionTitleSlot, + ICollapsibleSectionTitleSlots, + ICollapsibleSectionTitleStyles, + ICollapsibleSectionTitleStylesReturnType, + ICollapsibleSectionTitleTokenReturnType, + ICollapsibleSectionTitleTokens, + ICollapsibleSectionTokenReturnType, + ICollapsibleSectionTokens, + ICollapsibleSectionViewProps, +} from './CollapsibleSection'; +export { + CollapsibleSection, + CollapsibleSectionStateless, + CollapsibleSectionTitle, + CollapsibleSectionTitleView, +} from './CollapsibleSection'; +export type { + ICommandBar, + ICommandBarData, + ICommandBarItemProps, + ICommandBarProps, + ICommandBarStyleProps, + ICommandBarStyles, +} from './CommandBar'; +export { CommandBar, CommandBarBase } from './CommandBar'; +export type { + FolderCoverSize, + FolderCoverType, + IFolderCoverChildrenProps, + IFolderCoverLayout, + IFolderCoverProps, + IFolderCoverState, +} from './FolderCover'; +export { FolderCover, getFolderCoverLayout, initializeFolderCovers, renderFolderCoverWithLayout } from './FolderCover'; +export type { ILayoutGroupProps } from './LayoutGroup'; +export { LayoutGroup } from './LayoutGroup'; +export type { + IMicroFeedback, + IMicroFeedbackComponent, + IMicroFeedbackProps, + IMicroFeedbackQuestion, + IMicroFeedbackSlot, + IMicroFeedbackSlots, + IMicroFeedbackStyles, + IMicroFeedbackStylesReturnType, + IMicroFeedbackTokenReturnType, + IMicroFeedbackTokens, + IMicroFeedbackViewProps, + VoteType, +} from './MicroFeedback'; +export { MicroFeedback } from './MicroFeedback'; +export type { + IPaginationProps, + IPaginationString, + IPaginationStyleProps, + IPaginationStyles, + PaginationFormat, +} from './Pagination'; +export { Pagination } from './Pagination'; +export type { IHorizontalPersonaProps } from './Persona'; +export { Persona } from './Persona'; +export type { + IPersonaCoinComponent, + IPersonaCoinProps, + IPersonaCoinSlot, + IPersonaCoinSlots, + IPersonaCoinStyles, + IPersonaCoinStylesReturnType, + IPersonaCoinTokenReturnType, + IPersonaCoinTokens, + IPersonaCoinViewProps, + PersonaCoinSize, +} from './PersonaCoin'; +export { PersonaCoin } from './PersonaCoin'; +export type { ISidebar, ISidebarItemProps, ISidebarProps, ISidebarState, ISidebarStyles } from './Sidebar'; +export { + Sidebar, + SidebarButton, + SidebarColors, + SidebarStylingConstants, + getButtonColoredStyles, + getSidebarButtonStyles, + getSidebarChildrenStyles, + getSidebarStyles, + sidebarFonts, +} from './Sidebar'; +export type { ISignalFieldProps, ISignalProps, SignalFieldMode } from './Signals'; +export { + ATPSignal, + AwaitingApprovalSignal, + BlockedSignal, + CommentsSignal, + DesktopSignal, + DocumentsSignal, + EmailedSignal, + ExternalSignal, + FollowedSignal, + ItemScheduledSignal, + LiveEditSignal, + MalwareDetectedSignal, + MentionSignal, + MissingMetadataSignal, + NeedsRepublishingSignal, + NewSignal, + NotFollowedSignal, + PicturesSignal, + ReadOnlySignal, + RecordSignal, + SharedSignal, + Signal, + SignalField, + SomeoneCheckedOutSignal, + TrendingSignal, + UnseenEditSignal, + UnseenReplySignal, + WarningSignal, + YouCheckedOutSignal, +} from './Signals'; +export type { + // eslint-disable-next-line @typescript-eslint/no-deprecated + ISlider, + // eslint-disable-next-line @typescript-eslint/no-deprecated + ISliderMarks, + // eslint-disable-next-line @typescript-eslint/no-deprecated + ISliderProps, + // eslint-disable-next-line @typescript-eslint/no-deprecated + ISliderStyleProps, + // eslint-disable-next-line @typescript-eslint/no-deprecated + ISliderStyles, +} from './Slider'; +// eslint-disable-next-line @typescript-eslint/no-deprecated +export { Slider } from './Slider'; +export type { IGenericListProps, IStaticListProps } from './StaticList'; +export { StaticList } from './StaticList'; +export { Text } from './Text'; +export type { + IShimmerTile, + IShimmerTileProps, + IShimmerTileStyleProps, + IShimmerTileStyles, + ITileBackgroundProps, + ITileForegroundProps, + ITileLayout, + ITileNameplateProps, + ITileProps, + ITileState, + ITileStateProps, + TileSize, +} from './Tile'; +export { ShimmerTile, Tile, TileLayoutSizes, TileLayoutValues, getTileLayout, renderTileWithLayout } from './Tile'; +export type { + ITileCell, + ITileGrid, + ITileSize, + ITilesGridItem, + ITilesGridItemCellProps, + ITilesGridSegment, + ITilesListProps, + ITilesListRootProps, + ITilesListRowProps, + ITilesListState, +} from './TilesList'; +export { TilesGridMode, TilesList } from './TilesList'; +export type { IVirtualizedListProps, IVirtualizedListState } from './VirtualizedList'; +export { VirtualizedList } from './VirtualizedList'; import './version'; diff --git a/packages/react-experiments/src/utilities/scrolling/ScrollContainer.tsx b/packages/react-experiments/src/utilities/scrolling/ScrollContainer.tsx index e87498d634f9f8..0e262c7a144251 100644 --- a/packages/react-experiments/src/utilities/scrolling/ScrollContainer.tsx +++ b/packages/react-experiments/src/utilities/scrolling/ScrollContainer.tsx @@ -76,7 +76,7 @@ export class ScrollContainer this._callbacks.push(callback); } - // eslint-disable-next-line @typescript-eslint/no-deprecated + public render(): JSXElement { const { children, className } = this.props; diff --git a/packages/react-file-type-icons/.eslintrc.json b/packages/react-file-type-icons/.eslintrc.json deleted file mode 100644 index cc79bffcb73275..00000000000000 --- a/packages/react-file-type-icons/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "prefer-const": "off" - } -} diff --git a/packages/react-file-type-icons/eslint.config.js b/packages/react-file-type-icons/eslint.config.js new file mode 100644 index 00000000000000..4b1dee44e370ed --- /dev/null +++ b/packages/react-file-type-icons/eslint.config.js @@ -0,0 +1,12 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + 'prefer-const': 'off', + }, + }, +]; diff --git a/packages/react-file-type-icons/src/getFileTypeIconProps.ts b/packages/react-file-type-icons/src/getFileTypeIconProps.ts index f0a13076e346ef..2f1b8fd0994882 100644 --- a/packages/react-file-type-icons/src/getFileTypeIconProps.ts +++ b/packages/react-file-type-icons/src/getFileTypeIconProps.ts @@ -71,8 +71,8 @@ export function getFileTypeIconProps(options: IFileTypeIconOptions): { iconName: iconBaseName = getFileTypeIconNameFromExtensionOrType(extension, type); // Next, obtain the suffix using the icon size, user's device pixel ration, and // preference for svg or png - let _size: FileTypeIconSize = size || DEFAULT_ICON_SIZE; - let suffix: string = getFileTypeIconSuffix(_size, imageFileType); + const _size: FileTypeIconSize = size || DEFAULT_ICON_SIZE; + const suffix: string = getFileTypeIconSuffix(_size, imageFileType); return { iconName: iconBaseName + suffix, 'aria-label': extension }; } @@ -179,7 +179,7 @@ export function getFileTypeIconSuffix( ): string { // eslint-disable-next-line no-restricted-globals win ??= window; - let devicePixelRatio: number = win.devicePixelRatio; + const devicePixelRatio: number = win.devicePixelRatio; let devicePixelRatioSuffix = ''; // Default is 1x // SVGs scale well, so you can generally use the default image. diff --git a/packages/react-focus/.eslintrc.js b/packages/react-focus/.eslintrc.js deleted file mode 100644 index bf4af40e6cdfda..00000000000000 --- a/packages/react-focus/.eslintrc.js +++ /dev/null @@ -1,15 +0,0 @@ -// @ts-check -const configHelpers = require('@fluentui/eslint-plugin/src/utils/configHelpers'); - -/** @type {import("eslint").Linter.Config} */ -module.exports = { - extends: ['plugin:@fluentui/eslint-plugin/react--legacy'], - root: true, - overrides: [ - // This rule requires type info, so only enable for TS files under src - // (and turn off while running lint-staged due to excessive cost) - ...configHelpers.getTypeInfoRuleOverrides({ - '@fluentui/deprecated-keyboard-event-props': 'error', - }), - ], -}; diff --git a/packages/react-focus/eslint.config.js b/packages/react-focus/eslint.config.js new file mode 100644 index 00000000000000..871d8fe4109290 --- /dev/null +++ b/packages/react-focus/eslint.config.js @@ -0,0 +1,14 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); +const configHelpers = require('@fluentui/eslint-plugin/src/utils/configHelpers'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + files: ['src/**/*.{ts,tsx}'], + rules: { + '@fluentui/deprecated-keyboard-event-props': 'error', + }, + }, +]; diff --git a/packages/react-focus/src/index.ts b/packages/react-focus/src/index.ts index d4e34dbf72df0d..9b43785ca1be27 100644 --- a/packages/react-focus/src/index.ts +++ b/packages/react-focus/src/index.ts @@ -1,3 +1,4 @@ import './version'; -export * from './components/FocusZone/index'; +export type { IFocusZone, IFocusZoneProps } from './components/FocusZone/index'; +export { FocusZone, FocusZoneDirection, FocusZoneTabbableElements } from './components/FocusZone/index'; diff --git a/packages/react-hooks/.eslintrc.json b/packages/react-hooks/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/react-hooks/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/react-hooks/eslint.config.js b/packages/react-hooks/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/react-hooks/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/react-hooks/src/index.ts b/packages/react-hooks/src/index.ts index dafd6f12f9279d..af533164c6bd6a 100644 --- a/packages/react-hooks/src/index.ts +++ b/packages/react-hooks/src/index.ts @@ -1,22 +1,32 @@ import './version'; -export * from './useAsync'; -export * from './useBoolean'; -export * from './useConst'; -export * from './useConstCallback'; -export * from './useControllableValue'; -export * from './useEventCallback'; -export * from './useForceUpdate'; -export * from './useId'; -export * from './useMergedRefs'; -export * from './useMount'; -export * from './useMountSync'; -export * from './useOnEvent'; -export * from './usePrevious'; -export * from './useRefEffect'; -export * from './useSetInterval'; -export * from './useSetTimeout'; -export * from './useTarget'; -export * from './useUnmount'; -export * from './useWarnings'; +export { useAsync } from './useAsync'; +export type { IUseBooleanCallbacks } from './useBoolean'; +export { useBoolean } from './useBoolean'; +export { useConst } from './useConst'; +// eslint-disable-next-line @typescript-eslint/no-deprecated +export { useConstCallback } from './useConstCallback'; +export type { ChangeCallback } from './useControllableValue'; +export { useControllableValue } from './useControllableValue'; +export { useEventCallback } from './useEventCallback'; +export { useForceUpdate } from './useForceUpdate'; +export { useId } from './useId'; +export type { RefObjectFunction } from './useMergedRefs'; +export { useMergedRefs } from './useMergedRefs'; +export { useMount } from './useMount'; +// eslint-disable-next-line @typescript-eslint/no-deprecated +export { useMountSync } from './useMountSync'; +export { useOnEvent } from './useOnEvent'; +export { usePrevious } from './usePrevious'; +export type { RefCallback } from './useRefEffect'; +export { useRefEffect } from './useRefEffect'; +export type { UseSetIntervalReturnType } from './useSetInterval'; +export { useSetInterval } from './useSetInterval'; +export type { UseSetTimeoutReturnType } from './useSetTimeout'; +export { useSetTimeout } from './useSetTimeout'; +export type { Target } from './useTarget'; +export { useTarget } from './useTarget'; +export { useUnmount } from './useUnmount'; +export type { IWarningOptions } from './useWarnings'; +export { useWarnings } from './useWarnings'; // re-export since this is a hook, which people would reasonably expect to import from react-hooks export { useIsomorphicLayoutEffect } from '@fluentui/utilities'; diff --git a/packages/react-hooks/src/useMountSync.test.tsx b/packages/react-hooks/src/useMountSync.test.tsx index 2fa9883ff85858..8950a9b0e3be37 100644 --- a/packages/react-hooks/src/useMountSync.test.tsx +++ b/packages/react-hooks/src/useMountSync.test.tsx @@ -7,7 +7,7 @@ describe('useMountSync', () => { const onMount = jest.fn(); const TestComponent: React.FunctionComponent = () => { - // eslint-disable-next-line @typescript-eslint/no-deprecated + useMountSync(() => { onMount(); }); diff --git a/packages/react-icon-provider/.eslintrc.json b/packages/react-icon-provider/.eslintrc.json deleted file mode 100644 index ceea884c70dccc..00000000000000 --- a/packages/react-icon-provider/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react"], - "root": true -} diff --git a/packages/react-icon-provider/eslint.config.js b/packages/react-icon-provider/eslint.config.js new file mode 100644 index 00000000000000..ad2d7e44de70f4 --- /dev/null +++ b/packages/react-icon-provider/eslint.config.js @@ -0,0 +1,13 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react'], + { + rules: { + // This package is specifically for providing icon context, so it's allowed to export it + '@fluentui/ban-context-export': 'off', + }, + }, +]; diff --git a/packages/react-icons-mdl2-branded/.eslintrc.json b/packages/react-icons-mdl2-branded/.eslintrc.json deleted file mode 100644 index ceea884c70dccc..00000000000000 --- a/packages/react-icons-mdl2-branded/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react"], - "root": true -} diff --git a/packages/react-icons-mdl2-branded/eslint.config.js b/packages/react-icons-mdl2-branded/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/react-icons-mdl2-branded/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/react-icons-mdl2/.eslintrc.json b/packages/react-icons-mdl2/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/react-icons-mdl2/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/react-icons-mdl2/eslint.config.js b/packages/react-icons-mdl2/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/react-icons-mdl2/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/react-monaco-editor/.eslintrc.json b/packages/react-monaco-editor/.eslintrc.json deleted file mode 100644 index 81b8fb1dad460b..00000000000000 --- a/packages/react-monaco-editor/.eslintrc.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "import/no-webpack-loader-syntax": "off", // ok in this project - "no-restricted-globals": "off", - "react-hooks/rules-of-hooks": "warn" - } -} diff --git a/packages/react-monaco-editor/eslint.config.js b/packages/react-monaco-editor/eslint.config.js new file mode 100644 index 00000000000000..2e43b7b87fa730 --- /dev/null +++ b/packages/react-monaco-editor/eslint.config.js @@ -0,0 +1,14 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + 'import/no-webpack-loader-syntax': 'off', // ok in this project + 'no-restricted-globals': 'off', + 'react-hooks/rules-of-hooks': 'warn', + }, + }, +]; diff --git a/packages/react-monaco-editor/src/index.ts b/packages/react-monaco-editor/src/index.ts index b5ed181cacf7cb..cade3b71770a4d 100644 --- a/packages/react-monaco-editor/src/index.ts +++ b/packages/react-monaco-editor/src/index.ts @@ -1,7 +1,10 @@ // This file exports only things which don't import Monaco aside from its types. // So it should be safe to import from a bundle size impact perspective and hopefully should // work with Jest (because it only references the .d.ts file, which Jest understands). -export * from './components/index'; -export * from './interfaces/index'; -export * from './transpiler/index'; -export * from './utilities/index'; +export type { IEditorErrorBoundaryProps, IEditorErrorProps, IEditorWrapperProps } from './components/index'; +export { CODE_FONT_FAMILY, EditorError, EditorErrorBoundary, EditorWrapper } from './components/index'; +export type { IBasicPackageGroup, ICompilerOptions, IMonacoEditorOptions, IMonacoTextModel, IPackage, IPackageGroup, ITransformedCode, ITransformedExample } from './interfaces/index'; +export type { ITransformExampleParams } from './transpiler/index'; +export { isExampleValid, transformExample } from './transpiler/index'; +export type { IMonacoConfig } from './utilities/index'; +export { SUPPORTED_PACKAGES, configureEnvironment, isEditorSupported } from './utilities/index'; diff --git a/packages/react-window-provider/.eslintrc.json b/packages/react-window-provider/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/react-window-provider/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/react-window-provider/eslint.config.js b/packages/react-window-provider/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/react-window-provider/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/react-window-provider/src/WindowProvider.tsx b/packages/react-window-provider/src/WindowProvider.tsx index 4b03b2d7ceb21a..2a4ef056abb050 100644 --- a/packages/react-window-provider/src/WindowProvider.tsx +++ b/packages/react-window-provider/src/WindowProvider.tsx @@ -14,7 +14,7 @@ export type WindowProviderProps = { /** * Context for providing the window. */ -// eslint-disable-next-line @fluentui/no-context-default-value + export const WindowContext = React.createContext({ // eslint-disable-next-line no-restricted-globals window: typeof window === 'object' ? window : undefined, diff --git a/packages/react-window-provider/src/index.ts b/packages/react-window-provider/src/index.ts index e132b1ab8d252d..72a5a0a53f5ccb 100644 --- a/packages/react-window-provider/src/index.ts +++ b/packages/react-window-provider/src/index.ts @@ -1,5 +1,5 @@ export { - // eslint-disable-next-line @fluentui/ban-context-export + WindowContext, useWindow, useDocument, diff --git a/packages/react/.eslintrc.js b/packages/react/.eslintrc.js deleted file mode 100644 index f90777356cd34b..00000000000000 --- a/packages/react/.eslintrc.js +++ /dev/null @@ -1,21 +0,0 @@ -// @ts-check -const configHelpers = require('@fluentui/eslint-plugin/src/utils/configHelpers'); - -/** @type {import("eslint").Linter.Config} */ -module.exports = { - extends: ['plugin:@fluentui/eslint-plugin/react--legacy'], - plugins: ['@fluentui'], - root: true, - rules: { - '@fluentui/ban-imports': ['error', { pathRegex: '^(\\.\\./)+Styling$', names: ['FontSizes'] }], - '@typescript-eslint/no-explicit-any': 'off', - }, - overrides: [ - { - files: [...configHelpers.devDependenciesFiles, 'src/common/{shallowUntilTarget,testUtilities}.ts'], - rules: { - 'import/no-extraneous-dependencies': ['error', { packageDir: ['.', configHelpers.findGitRoot()] }], - }, - }, - ], -}; diff --git a/packages/react/eslint.config.js b/packages/react/eslint.config.js new file mode 100644 index 00000000000000..630d35273ec7df --- /dev/null +++ b/packages/react/eslint.config.js @@ -0,0 +1,29 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + '@fluentui/ban-imports': ['error', { pathRegex: '^(\\.\\./)+Styling$', names: ['FontSizes'] }], + '@typescript-eslint/no-explicit-any': 'off', + }, + }, + { + files: [ + '**/common/testUtilities.ts', + '**/common/shallowUntilTarget.ts', + '**/*.test.{ts,tsx,js,jsx}', + '**/*.spec.{ts,tsx,js,jsx}', + '**/__tests__/**', + '**/__mocks__/**', + '**/jest.config.{js,ts}', + '**/webpack.config.{js,ts}', + '**/.storybook/**', + ], + rules: { + 'import/no-extraneous-dependencies': 'off', + }, + }, +]; diff --git a/packages/react/src/common/testUtilities.ts b/packages/react/src/common/testUtilities.ts index 46e9b5a6049723..0e46e047dcb122 100644 --- a/packages/react/src/common/testUtilities.ts +++ b/packages/react/src/common/testUtilities.ts @@ -27,6 +27,7 @@ export function expectOneV2(container: HTMLElement, selector: string): void { /** @deprecated Use fake timers and `jest.runAllTimers()` instead */ export function delay(millisecond: number): Promise { + // eslint-disable-next-line no-promise-executor-return return new Promise(resolve => setTimeout(resolve, millisecond)); } diff --git a/packages/react/src/components/Autofill/Autofill.test.tsx b/packages/react/src/components/Autofill/Autofill.test.tsx index 65a7b1d183f873..76644f9f36ab7f 100644 --- a/packages/react/src/components/Autofill/Autofill.test.tsx +++ b/packages/react/src/components/Autofill/Autofill.test.tsx @@ -122,14 +122,14 @@ describe('Autofill', () => { it('value changes when updateValueInWillReceiveProps is passed in', () => { const propsString = 'Updated'; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const updateValueInWillReceiveProps = () => propsString; const { rerender } = render( } suggestedDisplayValue="" - // eslint-disable-next-line @typescript-eslint/no-deprecated + updateValueInWillReceiveProps={updateValueInWillReceiveProps} />, ); @@ -142,7 +142,7 @@ describe('Autofill', () => { } suggestedDisplayValue="hello" - // eslint-disable-next-line @typescript-eslint/no-deprecated + updateValueInWillReceiveProps={updateValueInWillReceiveProps} />, ); @@ -184,7 +184,7 @@ describe('Autofill', () => { render( } - // eslint-disable-next-line @typescript-eslint/no-deprecated + onInputChange={onInputChange} suggestedDisplayValue="he" />, @@ -263,7 +263,7 @@ describe('Autofill', () => { render( } - // eslint-disable-next-line @typescript-eslint/no-deprecated + onInputChange={onInputChange} suggestedDisplayValue="he" />, diff --git a/packages/react/src/components/Button/Button.test.tsx b/packages/react/src/components/Button/Button.test.tsx index 8632d76c2e03c1..484025db611859 100644 --- a/packages/react/src/components/Button/Button.test.tsx +++ b/packages/react/src/components/Button/Button.test.tsx @@ -101,7 +101,7 @@ describe('Button', () => { const ref = React.createRef(); render( Content @@ -776,7 +776,7 @@ describe('Button', () => { text="Create account" split={true} onClick={setTrue} - // eslint-disable-next-line @typescript-eslint/no-deprecated + onKeyPress={setTrue} onKeyUp={setTrue} onKeyDown={setTrue} @@ -812,7 +812,7 @@ describe('Button', () => { text="Create account" split={false} onClick={setTrue} - // eslint-disable-next-line @typescript-eslint/no-deprecated + onKeyPress={setTrue} onKeyUp={setTrue} onKeyDown={setTrue} @@ -834,7 +834,7 @@ describe('Button', () => { text="Create account" split={false} onClick={setTrue} - // eslint-disable-next-line @typescript-eslint/no-deprecated + onKeyPress={setTrue} onKeyUp={setTrue} onKeyDown={setTrue} @@ -856,7 +856,7 @@ describe('Button', () => { text="Create account" split={false} onClick={setTrue} - // eslint-disable-next-line @typescript-eslint/no-deprecated + onKeyPress={setTrue} onKeyUp={setTrue} onKeyDown={setTrue} diff --git a/packages/react/src/components/Calendar/CalendarYear/CalendarYear.base.tsx b/packages/react/src/components/Calendar/CalendarYear/CalendarYear.base.tsx index 5fd0dc4f59f0b4..6cec8c7f67ebc6 100644 --- a/packages/react/src/components/Calendar/CalendarYear/CalendarYear.base.tsx +++ b/packages/react/src/components/Calendar/CalendarYear/CalendarYear.base.tsx @@ -127,12 +127,12 @@ const CalendarYearGrid: React.FunctionComponent = props componentRef, } = props; - // eslint-disable-next-line react-hooks/rules-of-hooks + const selectedCellRef = React.useRef(null); - // eslint-disable-next-line react-hooks/rules-of-hooks + const currentCellRef = React.useRef(null); - // eslint-disable-next-line react-hooks/rules-of-hooks + React.useImperativeHandle( componentRef, () => ({ diff --git a/packages/react/src/components/Coachmark/Beak/Beak.tsx b/packages/react/src/components/Coachmark/Beak/Beak.tsx index 935595879aaa5c..31ebacebb5df51 100644 --- a/packages/react/src/components/Coachmark/Beak/Beak.tsx +++ b/packages/react/src/components/Coachmark/Beak/Beak.tsx @@ -30,12 +30,6 @@ export const Beak: React.FunctionComponent = React.forwardRef = React.forwardRef(); diff --git a/packages/react/src/components/ComboBox/ComboBox.test.tsx b/packages/react/src/components/ComboBox/ComboBox.test.tsx index 0a181f00639c23..eb43a58e5e5aff 100644 --- a/packages/react/src/components/ComboBox/ComboBox.test.tsx +++ b/packages/react/src/components/ComboBox/ComboBox.test.tsx @@ -186,7 +186,7 @@ describe('ComboBox', () => { const optionArray = getAllByRole('option'); expect(optionArray.length).toEqual(3); - const regex = new RegExp(/ComboBox[0-9]+-list[0-9]+/); + const regex = /ComboBox[0-9]+-list[0-9]+/; expect(regex.test(optionArray[0].getAttribute('id')!)).toEqual(true); expect(regex.test(optionArray[1].getAttribute('id')!)).toEqual(false); expect(optionArray[1].getAttribute('id')).toEqual('one'); diff --git a/packages/react/src/components/ContextualMenu/ContextualMenuItem.test.tsx b/packages/react/src/components/ContextualMenu/ContextualMenuItem.test.tsx index 58dcd1c8b79761..a588bd38170ce8 100644 --- a/packages/react/src/components/ContextualMenu/ContextualMenuItem.test.tsx +++ b/packages/react/src/components/ContextualMenu/ContextualMenuItem.test.tsx @@ -49,7 +49,7 @@ describe('ContextMenuItemChildren', () => { describe('when a checkmark icon', () => { let onCheckmarkClick: jest.Mock; let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; let container: HTMLElement; @@ -87,7 +87,7 @@ describe('ContextMenuItemChildren', () => { describe('when hide checkmark icon for toggle command', () => { let onCheckmarkClick: jest.Mock; let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; let container: HTMLElement; @@ -135,7 +135,7 @@ describe('ContextMenuItemChildren', () => { describe('when it has icons', () => { describe('when it has iconProps', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; let container: HTMLElement; registerIcons({ icons: { itemIcon: 'itemIcon' } }); @@ -163,7 +163,7 @@ describe('ContextMenuItemChildren', () => { describe('when it doesnt have iconProps', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; let container: HTMLElement; @@ -191,7 +191,7 @@ describe('ContextMenuItemChildren', () => { describe('when it has a sub menu', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; let container: HTMLElement; @@ -218,7 +218,7 @@ describe('ContextMenuItemChildren', () => { }); }); -// eslint-disable-next-line @typescript-eslint/no-deprecated + function getMenuItemClassNames(): IMenuItemClassNames { return { item: 'item', diff --git a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx index f47a306ca8fd3d..368dc434131112 100644 --- a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx +++ b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx @@ -8,7 +8,7 @@ import type { IMenuItemClassNames } from '../ContextualMenu.classNames'; describe('ContextualMenuButton', () => { describe('creates a normal button', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; beforeEach(() => { @@ -77,7 +77,7 @@ describe('ContextualMenuButton', () => { }); }); -// eslint-disable-next-line @typescript-eslint/no-deprecated + function getMenuItemClassNames(): IMenuItemClassNames { return { item: 'item', diff --git a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx index a231c7efa25ec6..40de46e7babe5c 100644 --- a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx +++ b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx @@ -8,7 +8,7 @@ import type { IMenuItemClassNames } from '../ContextualMenu.classNames'; describe('ContextualMenuButton', () => { describe('creates a normal button', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; beforeEach(() => { @@ -111,7 +111,7 @@ describe('ContextualMenuButton', () => { }); }); -// eslint-disable-next-line @typescript-eslint/no-deprecated + function getMenuItemClassNames(): IMenuItemClassNames { return { item: 'item', diff --git a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx index d45d2c1ce4afb9..40da2543c9b504 100644 --- a/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx +++ b/packages/react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx @@ -8,7 +8,7 @@ import type { IMenuItemClassNames } from '../ContextualMenu.classNames'; describe('ContextualMenuSplitButton', () => { describe('creates a normal split button', () => { let menuItem: IContextualMenuItem; - // eslint-disable-next-line @typescript-eslint/no-deprecated + let menuClassNames: IMenuItemClassNames; beforeEach(() => { @@ -77,7 +77,7 @@ describe('ContextualMenuSplitButton', () => { }); }); -// eslint-disable-next-line @typescript-eslint/no-deprecated + function getMenuItemClassNames(): IMenuItemClassNames { return { item: 'item', diff --git a/packages/react/src/components/Dialog/Dialog.test.tsx b/packages/react/src/components/Dialog/Dialog.test.tsx index 23a719ebe279ba..028e1c86c8d3d1 100644 --- a/packages/react/src/components/Dialog/Dialog.test.tsx +++ b/packages/react/src/components/Dialog/Dialog.test.tsx @@ -94,7 +94,7 @@ describe('Dialog', () => { const { queryByRole, rerender } = render( , @@ -104,7 +104,7 @@ describe('Dialog', () => { rerender( , diff --git a/packages/react/src/components/Fabric/Fabric.test.tsx b/packages/react/src/components/Fabric/Fabric.test.tsx index e1bf8e760392da..fc19d3a7d53d0f 100644 --- a/packages/react/src/components/Fabric/Fabric.test.tsx +++ b/packages/react/src/components/Fabric/Fabric.test.tsx @@ -1,4 +1,4 @@ -/* eslint-disable @typescript-eslint/no-deprecated */ + import * as React from 'react'; //import { Customizer } from '@fluentui/utilities'; import { Fabric } from './Fabric'; diff --git a/packages/react/src/components/Icon/Icon.test.tsx b/packages/react/src/components/Icon/Icon.test.tsx index 402500beb5b1bb..4b211e8de75d3c 100644 --- a/packages/react/src/components/Icon/Icon.test.tsx +++ b/packages/react/src/components/Icon/Icon.test.tsx @@ -15,7 +15,7 @@ describe('Icon', () => { const { container } = render( , ); diff --git a/packages/react/src/components/KeytipLayer/KeytipLayer.base.tsx b/packages/react/src/components/KeytipLayer/KeytipLayer.base.tsx index b0de36f2fb2703..636e29904abcb6 100644 --- a/packages/react/src/components/KeytipLayer/KeytipLayer.base.tsx +++ b/packages/react/src/components/KeytipLayer/KeytipLayer.base.tsx @@ -86,7 +86,7 @@ export class KeytipLayerBase extends React.Component { expect( /ms-Link($| )/.test( ReactDOM.renderToStaticMarkup( - // eslint-disable-next-line @typescript-eslint/no-deprecated + My Link , diff --git a/packages/react/src/components/Modal/Modal.test.tsx b/packages/react/src/components/Modal/Modal.test.tsx index fefcf70416f757..5ca01a58a8c646 100644 --- a/packages/react/src/components/Modal/Modal.test.tsx +++ b/packages/react/src/components/Modal/Modal.test.tsx @@ -135,7 +135,7 @@ describe('Modal', () => { const { getByText } = render( content diff --git a/packages/react/src/components/Persona/Persona.test.tsx b/packages/react/src/components/Persona/Persona.test.tsx index b2017034fec750..17c180e60c315d 100644 --- a/packages/react/src/components/Persona/Persona.test.tsx +++ b/packages/react/src/components/Persona/Persona.test.tsx @@ -69,7 +69,7 @@ describe('Persona', () => { const { container } = render( , ); diff --git a/packages/react/src/components/Persona/PersonaCoin/PersonaCoin.test.tsx b/packages/react/src/components/Persona/PersonaCoin/PersonaCoin.test.tsx index 4dafcf3fd6355c..4ebdcb3c9e84a3 100644 --- a/packages/react/src/components/Persona/PersonaCoin/PersonaCoin.test.tsx +++ b/packages/react/src/components/Persona/PersonaCoin/PersonaCoin.test.tsx @@ -58,7 +58,7 @@ describe('PersonaCoin', () => { const { container } = render( , diff --git a/packages/react/src/components/Pivot/Pivot.base.tsx b/packages/react/src/components/Pivot/Pivot.base.tsx index e4c787d9253a1d..ce4fa07947d133 100644 --- a/packages/react/src/components/Pivot/Pivot.base.tsx +++ b/packages/react/src/components/Pivot/Pivot.base.tsx @@ -86,6 +86,7 @@ export const PivotBase: React.FunctionComponent = React.forwardRef< overflowButtonAs, } = props; + // eslint-disable-next-line prefer-const let classNames: { [key in keyof IPivotStyles]: string }; const nameProps = { 'aria-label': props['aria-label'], diff --git a/packages/react/src/components/Popup/Popup.test.tsx b/packages/react/src/components/Popup/Popup.test.tsx index acc177a7107bd2..0e59da34b9a324 100644 --- a/packages/react/src/components/Popup/Popup.test.tsx +++ b/packages/react/src/components/Popup/Popup.test.tsx @@ -35,7 +35,7 @@ describe('Popup', () => {
sibling
content @@ -53,7 +53,7 @@ describe('Popup', () => { <>
sibling
diff --git a/packages/react/src/components/SearchBox/SearchBox.test.tsx b/packages/react/src/components/SearchBox/SearchBox.test.tsx index 0fddc2c41973c4..ad39a156f6496a 100644 --- a/packages/react/src/components/SearchBox/SearchBox.test.tsx +++ b/packages/react/src/components/SearchBox/SearchBox.test.tsx @@ -179,7 +179,7 @@ describe('SearchBox', () => { render( , ); diff --git a/packages/react/src/components/Slider/useSlider.ts b/packages/react/src/components/Slider/useSlider.ts index d821d4ed5d4238..4375bfc6033b43 100644 --- a/packages/react/src/components/Slider/useSlider.ts +++ b/packages/react/src/components/Slider/useSlider.ts @@ -201,7 +201,7 @@ export const useSlider = ( let numDec = 0; if (isFinite(step)) { - while (Math.round(step * Math.pow(10, numDec)) / Math.pow(10, numDec) !== step) { + while (Math.round(step * 10**numDec) / 10**numDec !== step) { numDec++; } } diff --git a/packages/react/src/components/SpinButton/SpinButton.test.tsx b/packages/react/src/components/SpinButton/SpinButton.test.tsx index 0c764522aa0668..244edcd363abe0 100644 --- a/packages/react/src/components/SpinButton/SpinButton.test.tsx +++ b/packages/react/src/components/SpinButton/SpinButton.test.tsx @@ -689,7 +689,7 @@ describe('SpinButton', () => { const onChange = jest.fn(); let keyCode: number | undefined; const onValidate = jest.fn((value: string, event?: React.SyntheticEvent) => { - // eslint-disable-next-line @typescript-eslint/no-deprecated + keyCode = (event as React.KeyboardEvent).which; return value; }); diff --git a/packages/react/src/components/Stack/Stack.test.tsx b/packages/react/src/components/Stack/Stack.test.tsx index f32073ef93d209..c3f84c0da4a6c8 100644 --- a/packages/react/src/components/Stack/Stack.test.tsx +++ b/packages/react/src/components/Stack/Stack.test.tsx @@ -186,7 +186,7 @@ describe('Stack', () => { it('renders horizontal Stack with a gap in rtl context correctly', () => { const { container } = render( - // eslint-disable-next-line @typescript-eslint/no-deprecated + Item 1 diff --git a/packages/react/src/components/Tooltip/TooltipHost.test.tsx b/packages/react/src/components/Tooltip/TooltipHost.test.tsx index aa4dd6445ea52e..9998826901dc2e 100644 --- a/packages/react/src/components/Tooltip/TooltipHost.test.tsx +++ b/packages/react/src/components/Tooltip/TooltipHost.test.tsx @@ -122,7 +122,7 @@ describe('TooltipHost', () => { props, // eslint-disable-next-line @typescript-eslint/no-shadow render, - ) => render?.({ ...props, content: props?.content + ' suffix' }) || null, + ) => render?.({ ...props, content: (props?.content ?? '') + ' suffix' }) || null, }; render(); diff --git a/packages/react/src/components/pickers/BasePicker.test.tsx b/packages/react/src/components/pickers/BasePicker.test.tsx index 760548a3701974..f57fad4e01f89d 100644 --- a/packages/react/src/components/pickers/BasePicker.test.tsx +++ b/packages/react/src/components/pickers/BasePicker.test.tsx @@ -374,7 +374,7 @@ describe('BasePicker', () => { render( { onRenderItem={(item, index: number) => { return ; }} - // eslint-disable-next-line @typescript-eslint/no-deprecated + positionInSet={1} - // eslint-disable-next-line @typescript-eslint/no-deprecated + setSize={2} />, ); diff --git a/packages/react/src/utilities/ThemeProvider/makeStyles.test.tsx b/packages/react/src/utilities/ThemeProvider/makeStyles.test.tsx index d787f9f503dd2c..140375d70770f1 100644 --- a/packages/react/src/utilities/ThemeProvider/makeStyles.test.tsx +++ b/packages/react/src/utilities/ThemeProvider/makeStyles.test.tsx @@ -10,7 +10,7 @@ import { ThemeProvider } from './ThemeProvider'; describe('makeStyles', () => { const stylesheet: Stylesheet = Stylesheet.getInstance(); - // eslint-disable-next-line @typescript-eslint/no-deprecated + const useThemedStyles = makeStyles(theme => ({ root: { background: theme.palette.themePrimary, @@ -25,7 +25,7 @@ describe('makeStyles', () => { const ThemeStyledComponent = () => ; - // eslint-disable-next-line @typescript-eslint/no-deprecated + const useStaticStyles = makeStyles({ root: { background: 'yellow', @@ -46,7 +46,7 @@ describe('makeStyles', () => { }); it('can create basic styles as an object (no type errors)', () => { - // eslint-disable-next-line @typescript-eslint/no-deprecated + makeStyles({ root: { alignItems: 'center', @@ -55,7 +55,7 @@ describe('makeStyles', () => { }); it('can create style functions (no type errors)', () => { - // eslint-disable-next-line @typescript-eslint/no-deprecated + makeStyles(() => ({ root: { alignItems: 'center', @@ -76,7 +76,7 @@ describe('makeStyles', () => { }); render( - // eslint-disable-next-line @typescript-eslint/no-deprecated + , diff --git a/packages/react/src/utilities/color/shades.ts b/packages/react/src/utilities/color/shades.ts index 6c12a50b2c7c03..04557e42b6bd49 100644 --- a/packages/react/src/utilities/color/shades.ts +++ b/packages/react/src/utilities/color/shades.ts @@ -176,7 +176,7 @@ export function getContrastRatio(color1: IColor, color2: IColor): number { if (x <= 0.03928) { return x / 12.92; } else { - return Math.pow((x + 0.055) / 1.055, 2.4); + return ((x + 0.055) / 1.055)**2.4; } } diff --git a/packages/react/src/utilities/decorators/withResponsiveMode.test.tsx b/packages/react/src/utilities/decorators/withResponsiveMode.test.tsx index 5725fa0faaef59..3d1c9657d286f7 100644 --- a/packages/react/src/utilities/decorators/withResponsiveMode.test.tsx +++ b/packages/react/src/utilities/decorators/withResponsiveMode.test.tsx @@ -4,7 +4,7 @@ import { setResponsiveMode, withResponsiveMode, ResponsiveMode } from './withRes import type { JSXElement } from '@fluentui/utilities'; -// eslint-disable-next-line @typescript-eslint/no-deprecated + @withResponsiveMode class Example extends React.Component { public render(): JSXElement { diff --git a/packages/scheme-utilities/.eslintrc.json b/packages/scheme-utilities/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/scheme-utilities/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/scheme-utilities/eslint.config.js b/packages/scheme-utilities/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/scheme-utilities/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/set-version/.eslintrc.json b/packages/set-version/.eslintrc.json deleted file mode 100644 index 905bf718151d3a..00000000000000 --- a/packages/set-version/.eslintrc.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "prefer-const": "off", - "no-restricted-globals": "off" - }, - "overrides": [ - { - "files": ["**/*.{ts,tsx}"], - "rules": { - "@typescript-eslint/no-deprecated": "off" - } - } - ] -} diff --git a/packages/set-version/eslint.config.js b/packages/set-version/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/set-version/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/storybook/.eslintrc.json b/packages/storybook/.eslintrc.json deleted file mode 100644 index bbed2d7e8002c1..00000000000000 --- a/packages/storybook/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react"], - "root": true, - "rules": { - "@typescript-eslint/explicit-module-boundary-types": "off" - } -} diff --git a/packages/storybook/eslint.config.js b/packages/storybook/eslint.config.js new file mode 100644 index 00000000000000..f6d4f20b66b9dc --- /dev/null +++ b/packages/storybook/eslint.config.js @@ -0,0 +1,12 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react'], + { + rules: { + '@typescript-eslint/explicit-module-boundary-types': 'off', + }, + }, +]; diff --git a/packages/style-utilities/.eslintrc.json b/packages/style-utilities/.eslintrc.json deleted file mode 100644 index cc79bffcb73275..00000000000000 --- a/packages/style-utilities/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true, - "rules": { - "prefer-const": "off" - } -} diff --git a/packages/style-utilities/eslint.config.js b/packages/style-utilities/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/style-utilities/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/test-utilities/.eslintrc.json b/packages/test-utilities/.eslintrc.json deleted file mode 100644 index ac253d2017a4c7..00000000000000 --- a/packages/test-utilities/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/node--legacy"], - "root": true, - "rules": { - "@fluentui/max-len": "off" - } -} diff --git a/packages/test-utilities/eslint.config.js b/packages/test-utilities/eslint.config.js new file mode 100644 index 00000000000000..64393b964b13ba --- /dev/null +++ b/packages/test-utilities/eslint.config.js @@ -0,0 +1,12 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/node-legacy'], + { + rules: { + '@fluentui/max-len': 'off', + }, + }, +]; diff --git a/packages/theme-samples/.eslintrc.json b/packages/theme-samples/.eslintrc.json deleted file mode 100644 index 20576f82da4223..00000000000000 --- a/packages/theme-samples/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"], - "root": true -} diff --git a/packages/theme-samples/eslint.config.js b/packages/theme-samples/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/theme-samples/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/theme/.eslintrc.json b/packages/theme/.eslintrc.json deleted file mode 100644 index ceea884c70dccc..00000000000000 --- a/packages/theme/.eslintrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "extends": ["plugin:@fluentui/eslint-plugin/react"], - "root": true -} diff --git a/packages/theme/eslint.config.js b/packages/theme/eslint.config.js new file mode 100644 index 00000000000000..4a062211583ad9 --- /dev/null +++ b/packages/theme/eslint.config.js @@ -0,0 +1,5 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [...fluentPlugin.configs['flat/react-legacy']]; diff --git a/packages/utilities/eslint.config.js b/packages/utilities/eslint.config.js new file mode 100644 index 00000000000000..1e6e9dacf651fe --- /dev/null +++ b/packages/utilities/eslint.config.js @@ -0,0 +1,13 @@ +// @ts-check +const fluentPlugin = require('@fluentui/eslint-plugin'); + +/** @type {import("eslint").Linter.Config[]} */ +module.exports = [ + ...fluentPlugin.configs['flat/react-legacy'], + { + rules: { + '@rnx-kit/no-export-all': ['error', { expand: 'all' }], + 'prefer-const': 'off', + }, + }, +]; diff --git a/packages/utilities/src/math.ts b/packages/utilities/src/math.ts index 576c53474cfce8..c581e30037ee52 100644 --- a/packages/utilities/src/math.ts +++ b/packages/utilities/src/math.ts @@ -14,7 +14,7 @@ export function getDistanceBetweenPoints(point1: Point, point2: Point): number { const top2 = point2.top || point2.y || 0; /* eslint-enable @typescript-eslint/no-deprecated */ - let distance = Math.sqrt(Math.pow(left1 - left2, 2) + Math.pow(top1 - top2, 2)); + let distance = Math.sqrt((left1 - left2) ** 2 + (top1 - top2) ** 2); return distance; } @@ -114,6 +114,6 @@ export function calculatePrecision(value: number | string): number { * @param precision - The number of decimal places to round the number to */ export function precisionRound(value: number, precision: number, base: number = 10): number { - const exp = Math.pow(base, precision); + const exp = base ** precision; return Math.round(value * exp) / exp; } From 489817449a78df01cdaee832b7fe2f21ecf35828 Mon Sep 17 00:00:00 2001 From: mainframev Date: Wed, 19 Nov 2025 14:24:46 +0100 Subject: [PATCH 2/2] chore: update workflow --- .github/workflows/pr.yml | 256 +++++++++++++++++++-------------------- 1 file changed, 128 insertions(+), 128 deletions(-) diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 94b31e35dd7f09..493bc35f17a66e 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -2,7 +2,7 @@ name: CI on: push: branches: - - master + - chore/migrate-to-flat-configs-v8 pull_request: concurrency: @@ -23,8 +23,8 @@ env: jobs: main: - if: ${{ github.repository_owner == 'microsoft' }} - runs-on: macos-14-xlarge + # if: ${{ github.repository_owner == 'microsoft' }} + runs-on: ubuntu-latest permissions: contents: 'read' actions: 'read' @@ -48,131 +48,131 @@ jobs: - run: yarn install --frozen-lockfile - - name: Workspace lint - run: | - yarn nx run workspace-plugin:check-graph - yarn nx g @fluentui/workspace-plugin:tsconfig-base-all --verify - yarn nx g @fluentui/workspace-plugin:normalize-package-dependencies --verify - - - name: Type-check just.config.ts files - run: | - # following packages need to be build in advance: - # @fluentui/api-docs is used within apps/public-docsite-resources/just.config.ts, - # @fluentui/digest is used within packages/fluentui/perf-test-northstar/just.config.ts, thus it needs to be build in advance - # - # NOTE: we are running this via nx in order to get cache hits later on - yarn nx run-many -t build -p api-docs digest - yarn tsc -p ./tsconfig.just-scripts-configs.json - - - name: 'check packages: installed dependencies versions' - run: | - yarn check:installed-dependencies-versions - - - name: check formatting - run: | - yarn nx format:check --base origin/master + # - name: Workspace lint + # run: | + # yarn nx run workspace-plugin:check-graph + # yarn nx g @fluentui/workspace-plugin:tsconfig-base-all --verify + # yarn nx g @fluentui/workspace-plugin:normalize-package-dependencies --verify + + # - name: Type-check just.config.ts files + # run: | + # # following packages need to be build in advance: + # # @fluentui/api-docs is used within apps/public-docsite-resources/just.config.ts, + # # @fluentui/digest is used within packages/fluentui/perf-test-northstar/just.config.ts, thus it needs to be build in advance + # # + # # NOTE: we are running this via nx in order to get cache hits later on + # yarn nx run-many -t build -p api-docs digest + # yarn tsc -p ./tsconfig.just-scripts-configs.json + # + # - name: 'check packages: installed dependencies versions' + # run: | + # yarn check:installed-dependencies-versions + # + # - name: check formatting + # run: | + # yarn nx format:check --base origin/master - name: build, test, lint, test-ssr (affected) run: | - FLUENT_JEST_WORKER=2 yarn nx affected -t build test lint type-check test-ssr test-integration verify-packaging --exclude react-19-tests-v9 --nxBail - - - name: 'Check for unstaged changes' - run: | - git status --porcelain - git diff-index --quiet HEAD -- || exit 1 - - react-major-versions-integration: - if: ${{ github.repository_owner == 'microsoft' }} - runs-on: macos-14-xlarge - steps: - - uses: actions/checkout@v4 - with: - fetch-depth: 0 - - - name: Derive appropriate SHAs for base and head for `nx affected` commands - uses: nrwl/nx-set-shas@826660b82addbef3abff5fa871492ebad618c9e1 # v4.3.3 - with: - main-branch-name: 'master' - - - uses: actions/setup-node@v4 - with: - cache: 'yarn' - node-version: '22' - - - run: echo number of CPUs "$(getconf _NPROCESSORS_ONLN)" - - - run: | - yarn install --frozen-lockfile - yarn rit --react 17 --install-deps - yarn rit --react 18 --install-deps - - - name: Verify Cypress installs from RIT temp workspaces (React 17 -> v13, React 18 -> v14) - run: | - "$GITHUB_WORKSPACE"/tmp/rit/react-17/node_modules/.bin/cypress verify - "$GITHUB_WORKSPACE"/tmp/rit/react-18/node_modules/.bin/cypress verify - - - name: React Versions Integration Tests (17,18) - E2E - id: e2e - run: | - yarn nx affected -t test-rit--17--e2e,test-rit--18--e2e --exclude='react-19-tests-v9,react-charting,react' - - - name: Upload Cypress screenshots if exist - uses: actions/upload-artifact@v4 - if: always() && steps.e2e.outcome == 'failure' - with: - name: cypress-screenshots-react-test-rit - path: | - tmp/rit/**/cypress/screenshots/**/*.png - retention-days: 1 - - - name: React Versions Integration Tests (17,18) - Type-check & Test - run: | - FLUENT_JEST_WORKER=2 yarn nx affected -t test-rit--17--type-check,test-rit--18--type-check,test-rit--17--test,test-rit--18--test --exclude='react-19-tests-v9' - - e2e: - if: ${{ github.repository_owner == 'microsoft' }} - # TODO: switch to macos once problematic tests are fixed - # https://github.com/microsoft/fluentui/issues/33173 - # https://github.com/microsoft/fluentui/issues/33172 - runs-on: ubuntu-latest - permissions: - contents: 'read' - actions: 'read' - - steps: - - uses: actions/checkout@v4 - with: - fetch-depth: 0 - - - name: Derive appropriate SHAs for base and head for `nx affected` commands - uses: nrwl/nx-set-shas@826660b82addbef3abff5fa871492ebad618c9e1 # v4.3.3 - with: - main-branch-name: 'master' - - - uses: actions/setup-node@v4 - with: - cache: 'yarn' - node-version: '22' - - - run: echo number of CPUs "$(getconf _NPROCESSORS_ONLN)" - - - run: yarn install --frozen-lockfile - - - name: Install Playwright dependencies - run: yarn playwright install --with-deps - - - name: Verify Cypress install - run: yarn cypress verify - - - name: Cypress/Playwright E2E tests - run: yarn nx affected -t e2e --exclude react-19-tests-v9 --nxBail --parallel 1 - - - name: Upload Cypress screenshots if exist - uses: actions/upload-artifact@v4 - if: failure() - with: - name: cypress-screenshots - path: | - apps/*/cypress/screenshots/**/*.png - packages/**/cypress/screenshots/**/*.png - retention-days: 1 + FLUENT_JEST_WORKER=2 yarn nx run-many -t lint --nxBail + + # - name: 'Check for unstaged changes' + # run: | + # git status --porcelain + # git diff-index --quiet HEAD -- || exit 1 + + # react-major-versions-integration: + # if: ${{ github.repository_owner == 'microsoft' }} + # runs-on: macos-14-xlarge + # steps: + # - uses: actions/checkout@v4 + # with: + # fetch-depth: 0 + # + # - name: Derive appropriate SHAs for base and head for `nx affected` commands + # uses: nrwl/nx-set-shas@826660b82addbef3abff5fa871492ebad618c9e1 # v4.3.3 + # with: + # main-branch-name: 'master' + # + # - uses: actions/setup-node@v4 + # with: + # cache: 'yarn' + # node-version: '22' + # + # - run: echo number of CPUs "$(getconf _NPROCESSORS_ONLN)" + # + # - run: | + # yarn install --frozen-lockfile + # yarn rit --react 17 --install-deps + # yarn rit --react 18 --install-deps + # + # - name: Verify Cypress installs from RIT temp workspaces (React 17 -> v13, React 18 -> v14) + # run: | + # "$GITHUB_WORKSPACE"/tmp/rit/react-17/node_modules/.bin/cypress verify + # "$GITHUB_WORKSPACE"/tmp/rit/react-18/node_modules/.bin/cypress verify + # + # - name: React Versions Integration Tests (17,18) - E2E + # id: e2e + # run: | + # yarn nx affected -t test-rit--17--e2e,test-rit--18--e2e --exclude='react-19-tests-v9,react-charting,react' + # + # - name: Upload Cypress screenshots if exist + # uses: actions/upload-artifact@v4 + # if: always() && steps.e2e.outcome == 'failure' + # with: + # name: cypress-screenshots-react-test-rit + # path: | + # tmp/rit/**/cypress/screenshots/**/*.png + # retention-days: 1 + # + # - name: React Versions Integration Tests (17,18) - Type-check & Test + # run: | + # FLUENT_JEST_WORKER=2 yarn nx affected -t test-rit--17--type-check,test-rit--18--type-check,test-rit--17--test,test-rit--18--test --exclude='react-19-tests-v9' + # + # e2e: + # if: ${{ github.repository_owner == 'microsoft' }} + # # TODO: switch to macos once problematic tests are fixed + # # https://github.com/microsoft/fluentui/issues/33173 + # # https://github.com/microsoft/fluentui/issues/33172 + # runs-on: ubuntu-latest + # permissions: + # contents: 'read' + # actions: 'read' + # + # steps: + # - uses: actions/checkout@v4 + # with: + # fetch-depth: 0 + # + # - name: Derive appropriate SHAs for base and head for `nx affected` commands + # uses: nrwl/nx-set-shas@826660b82addbef3abff5fa871492ebad618c9e1 # v4.3.3 + # with: + # main-branch-name: 'master' + # + # - uses: actions/setup-node@v4 + # with: + # cache: 'yarn' + # node-version: '22' + # + # - run: echo number of CPUs "$(getconf _NPROCESSORS_ONLN)" + # + # - run: yarn install --frozen-lockfile + # + # - name: Install Playwright dependencies + # run: yarn playwright install --with-deps + # + # - name: Verify Cypress install + # run: yarn cypress verify + # + # - name: Cypress/Playwright E2E tests + # run: yarn nx affected -t e2e --exclude react-19-tests-v9 --nxBail --parallel 1 + # + # - name: Upload Cypress screenshots if exist + # uses: actions/upload-artifact@v4 + # if: failure() + # with: + # name: cypress-screenshots + # path: | + # apps/*/cypress/screenshots/**/*.png + # packages/**/cypress/screenshots/**/*.png + # retention-days: 1