From 0979e6a54ba47c278d1f535953c0520a86349811 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Wed, 1 Sep 2021 10:27:09 +0200 Subject: [PATCH] [core] Rename packages (#28049) --- .circleci/config.yml | 14 +- .codesandbox/ci.json | 24 +- .eslintrc.js | 34 +- .github/FUNDING.yml | 2 +- .github/ISSUE_TEMPLATE/1.bug.md | 6 +- CONTRIBUTING.md | 8 +- README.md | 18 +- TYPESCRIPT_CONVENTION.md | 2 +- azure-pipelines.yml | 10 +- babel.config.js | 22 +- benchmark/browser/README.md | 2 +- .../scenarios/box-material-ui/index.js | 2 +- .../browser/scenarios/make-styles/index.js | 4 +- .../index.js | 6 +- .../index.js | 2 +- .../browser/scenarios/styled-emotion/index.js | 2 +- .../scenarios/styled-material-ui/index.js | 2 +- .../browser/scenarios/styled-sc/index.js | 2 +- .../browser/scenarios/table-cell/index.js | 10 +- benchmark/browser/scripts/benchmark.js | 4 +- benchmark/package.json | 6 +- benchmark/server/README.md | 10 +- benchmark/server/scenarios/core.js | 4 +- benchmark/server/scenarios/server.js | 12 +- benchmark/server/scenarios/styles.js | 4 +- benchmark/server/scenarios/system.js | 6 +- dangerfile.js | 4 +- docs/babel.config.js | 24 +- docs/next.config.js | 16 +- docs/package.json | 20 +- docs/packages/markdown/package.json | 2 +- docs/packages/markdown/parseMarkdown.test.js | 8 +- docs/packages/markdown/textToHash.test.js | 5 +- docs/pages/_app.js | 2 +- docs/pages/_document.js | 2 +- .../blog/2019-developer-survey-results.js | 2 +- .../blog/2019-developer-survey-results.md | 2 +- docs/pages/blog/2019.js | 2 +- docs/pages/blog/2019.md | 2 +- .../blog/2020-developer-survey-results.js | 2 +- docs/pages/blog/2020-introducing-sketch.js | 2 +- docs/pages/blog/2020-q1-update.js | 2 +- docs/pages/blog/2020-q2-update.js | 2 +- docs/pages/blog/2020-q3-update.js | 2 +- docs/pages/blog/2020-q3-update.md | 6 +- docs/pages/blog/2020.js | 2 +- docs/pages/blog/2020.md | 2 +- docs/pages/blog/2021-q1-update.js | 2 +- docs/pages/blog/2021-q1-update.md | 10 +- docs/pages/blog/2021-q2-update.js | 2 +- docs/pages/blog/2021-q2-update.md | 2 +- docs/pages/blog/april-2019-update.js | 2 +- docs/pages/blog/august-2019-update.js | 2 +- .../blog/danail-hadjiatanasov-joining.js | 2 +- docs/pages/blog/danilo-leal-joining.js | 2 +- docs/pages/blog/december-2019-update.js | 2 +- docs/pages/blog/july-2019-update.js | 2 +- docs/pages/blog/july-2019-update.md | 2 +- docs/pages/blog/june-2019-update.js | 2 +- docs/pages/blog/march-2019-update.js | 2 +- docs/pages/blog/march-2019-update.md | 6 +- docs/pages/blog/marija-najdova-joining.js | 2 +- docs/pages/blog/material-ui-v1-is-out.js | 2 +- docs/pages/blog/material-ui-v1-is-out.md | 2 +- docs/pages/blog/material-ui-v4-is-out.js | 2 +- docs/pages/blog/material-ui-v4-is-out.md | 18 +- docs/pages/blog/matheus-wichman-joining.js | 2 +- docs/pages/blog/may-2019-update.js | 2 +- docs/pages/blog/michal-dudak-joining.js | 2 +- docs/pages/blog/michal-dudak-joining.md | 4 +- docs/pages/blog/november-2019-update.js | 2 +- docs/pages/blog/october-2019-update.js | 2 +- docs/pages/blog/september-2019-update.js | 2 +- docs/pages/blog/september-2019-update.md | 16 +- docs/pages/blog/siriwat-kunaporn-joining.js | 2 +- docs/pages/blog/spotlight-damien-tassone.js | 2 +- docs/pages/branding/about.tsx | 34 +- docs/pages/branding/design-kits.tsx | 2 +- docs/pages/branding/home.tsx | 4 +- docs/pages/branding/mui-x.tsx | 16 +- docs/pages/branding/pricing.tsx | 4 +- docs/pages/branding/templates.tsx | 2 +- docs/pages/company/about.js | 6 +- docs/pages/company/careers.js | 2 +- docs/pages/company/contact.js | 2 +- docs/pages/company/developer-advocate.js | 2 +- docs/pages/company/full-stack-engineer.js | 2 +- docs/pages/company/product-manager.js | 2 +- docs/pages/company/react-engineer.js | 2 +- docs/pages/components/about-the-lab.js | 2 +- docs/pages/components/accordion.js | 2 +- docs/pages/components/alert.js | 2 +- docs/pages/components/app-bar.js | 2 +- docs/pages/components/autocomplete.js | 2 +- docs/pages/components/avatars.js | 2 +- docs/pages/components/backdrop.js | 2 +- docs/pages/components/badges.js | 2 +- docs/pages/components/bottom-navigation.js | 2 +- docs/pages/components/box.js | 6 +- docs/pages/components/breadcrumbs.js | 2 +- docs/pages/components/button-group.js | 2 +- docs/pages/components/buttons.js | 2 +- docs/pages/components/cards.js | 2 +- docs/pages/components/checkboxes.js | 2 +- docs/pages/components/chips.js | 2 +- docs/pages/components/click-away-listener.js | 2 +- docs/pages/components/container.js | 2 +- docs/pages/components/css-baseline.js | 2 +- docs/pages/components/date-picker.js | 2 +- docs/pages/components/date-range-picker.js | 2 +- docs/pages/components/date-time-picker.js | 2 +- docs/pages/components/dialogs.js | 2 +- docs/pages/components/dividers.js | 2 +- docs/pages/components/drawers.js | 2 +- .../components/floating-action-button.js | 2 +- docs/pages/components/grid.js | 6 +- docs/pages/components/hidden.js | 2 +- docs/pages/components/icons.js | 2 +- docs/pages/components/image-list.js | 2 +- docs/pages/components/links.js | 2 +- docs/pages/components/lists.js | 2 +- docs/pages/components/masonry.js | 2 +- docs/pages/components/material-icons.js | 2 +- docs/pages/components/menus.js | 2 +- docs/pages/components/modal.js | 2 +- docs/pages/components/no-ssr.js | 2 +- docs/pages/components/pagination.js | 2 +- docs/pages/components/paper.js | 2 +- docs/pages/components/pickers.js | 2 +- docs/pages/components/popover.js | 2 +- docs/pages/components/popper.js | 2 +- docs/pages/components/portal.js | 2 +- docs/pages/components/progress.js | 2 +- docs/pages/components/radio-buttons.js | 2 +- docs/pages/components/rating.js | 2 +- docs/pages/components/selects.js | 2 +- docs/pages/components/skeleton.js | 2 +- docs/pages/components/slider.js | 2 +- docs/pages/components/snackbars.js | 2 +- docs/pages/components/speed-dial.js | 2 +- docs/pages/components/stack.js | 2 +- docs/pages/components/steppers.js | 2 +- docs/pages/components/switches.js | 2 +- docs/pages/components/tables.js | 2 +- docs/pages/components/tabs.js | 6 +- docs/pages/components/text-fields.js | 2 +- docs/pages/components/textarea-autosize.js | 2 +- docs/pages/components/time-picker.js | 2 +- docs/pages/components/timeline.js | 2 +- docs/pages/components/toggle-button.js | 2 +- docs/pages/components/tooltips.js | 2 +- docs/pages/components/transfer-list.js | 2 +- docs/pages/components/transitions.js | 2 +- docs/pages/components/trap-focus.js | 2 +- docs/pages/components/tree-view.js | 2 +- docs/pages/components/typography.js | 2 +- docs/pages/components/use-media-query.js | 2 +- docs/pages/customization/breakpoints.js | 2 +- docs/pages/customization/color.js | 2 +- docs/pages/customization/default-theme.js | 2 +- docs/pages/customization/density.js | 2 +- docs/pages/customization/how-to-customize.js | 2 +- docs/pages/customization/palette.js | 2 +- docs/pages/customization/spacing.js | 2 +- docs/pages/customization/theme-components.js | 2 +- docs/pages/customization/theming.js | 2 +- docs/pages/customization/transitions.js | 2 +- docs/pages/customization/typography.js | 2 +- .../customization/unstyled-components.js | 2 +- docs/pages/customization/z-index.js | 2 +- docs/pages/discover-more/backers.js | 2 +- docs/pages/discover-more/changelog.js | 2 +- docs/pages/discover-more/languages.js | 2 +- docs/pages/discover-more/related-projects.js | 2 +- docs/pages/discover-more/roadmap.js | 2 +- docs/pages/discover-more/showcase.js | 2 +- docs/pages/discover-more/team.js | 2 +- docs/pages/discover-more/vision.js | 2 +- .../pages/getting-started/example-projects.js | 2 +- docs/pages/getting-started/faq.js | 2 +- docs/pages/getting-started/installation.js | 2 +- docs/pages/getting-started/learn.js | 2 +- docs/pages/getting-started/support.js | 2 +- .../getting-started/supported-components.js | 2 +- .../getting-started/supported-platforms.js | 2 +- docs/pages/getting-started/templates.js | 2 +- docs/pages/getting-started/usage.js | 2 +- docs/pages/guides/api.js | 6 +- docs/pages/guides/composition.js | 2 +- docs/pages/guides/content-security-policy.js | 2 +- docs/pages/guides/flow.js | 6 +- docs/pages/guides/interoperability.js | 2 +- docs/pages/guides/localization.js | 2 +- docs/pages/guides/migration-v0x.js | 2 +- docs/pages/guides/migration-v3.js | 2 +- docs/pages/guides/migration-v4.js | 2 +- docs/pages/guides/minimizing-bundle-size.js | 2 +- docs/pages/guides/pickers-migration.js | 2 +- docs/pages/guides/responsive-ui.js | 2 +- docs/pages/guides/right-to-left.js | 2 +- docs/pages/guides/routing.js | 2 +- docs/pages/guides/server-rendering.js | 2 +- docs/pages/guides/styled-engine.js | 2 +- docs/pages/guides/testing.js | 2 +- docs/pages/guides/typescript.js | 2 +- docs/pages/index.tsx | 10 +- docs/pages/performance/slider-emotion.js | 4 +- docs/pages/performance/slider-jss.js | 4 +- docs/pages/performance/system.js | 4 +- docs/pages/performance/table-component.js | 2 +- docs/pages/performance/table-emotion.js | 4 +- docs/pages/performance/table-hook.js | 4 +- docs/pages/performance/table-mui.js | 12 +- docs/pages/performance/table-raw.js | 2 +- .../performance/table-styled-components.js | 2 +- docs/pages/production-error.js | 2 +- docs/pages/styles/advanced.js | 2 +- docs/pages/styles/api.js | 6 +- docs/pages/styles/basics.js | 6 +- docs/pages/system/advanced.js | 2 +- docs/pages/system/basics.js | 6 +- docs/pages/system/borders.js | 2 +- docs/pages/system/box.js | 6 +- docs/pages/system/display.js | 2 +- docs/pages/system/flexbox.js | 2 +- docs/pages/system/grid.js | 6 +- docs/pages/system/palette.js | 2 +- docs/pages/system/positions.js | 2 +- docs/pages/system/properties.js | 2 +- docs/pages/system/screen-readers.js | 2 +- docs/pages/system/shadows.js | 2 +- docs/pages/system/sizing.js | 6 +- docs/pages/system/spacing.js | 2 +- docs/pages/system/styled.js | 6 +- docs/pages/system/the-sx-prop.js | 2 +- docs/pages/system/typography.js | 2 +- docs/pages/versions.js | 6 +- docs/public/static/error-codes.json | 10 +- docs/scripts/buildApi.ts | 4 +- docs/src/BrandingProvider.tsx | 6 +- docs/src/components/action/ArrowButton.tsx | 6 +- docs/src/components/action/Frame.tsx | 4 +- docs/src/components/action/Highlighter.tsx | 2 +- docs/src/components/action/Item.tsx | 6 +- docs/src/components/action/More.tsx | 10 +- docs/src/components/animation/FadeDelay.tsx | 2 +- docs/src/components/animation/Slide.tsx | 2 +- docs/src/components/footer/EmailSubscribe.tsx | 20 +- docs/src/components/header/HeaderNavBar.tsx | 12 +- .../components/header/HeaderNavDropdown.tsx | 14 +- .../src/components/header/ThemeModeToggle.tsx | 8 +- docs/src/components/home/AdvancedShowcase.tsx | 34 +- docs/src/components/home/CompaniesGrid.tsx | 2 +- docs/src/components/home/CoreShowcase.tsx | 20 +- docs/src/components/home/DesignKits.tsx | 6 +- .../home/DesignSystemComponents.tsx | 6 +- docs/src/components/home/DiamondSponsors.tsx | 12 +- docs/src/components/home/ElementPointer.tsx | 6 +- .../src/components/home/GetStartedButtons.tsx | 12 +- docs/src/components/home/GoldSponsors.tsx | 6 +- docs/src/components/home/Hero.tsx | 10 +- docs/src/components/home/HeroEnd.tsx | 4 +- .../home/MaterialDesignComponents.tsx | 52 +- .../components/home/MaterialDesignDemo.tsx | 24 +- docs/src/components/home/NewsletterToast.tsx | 14 +- docs/src/components/home/ProductSuite.tsx | 10 +- docs/src/components/home/ProductsSwitcher.tsx | 12 +- docs/src/components/home/References.tsx | 6 +- .../src/components/home/ShowcaseContainer.tsx | 6 +- docs/src/components/home/SponsorCard.tsx | 10 +- docs/src/components/home/Sponsors.tsx | 6 +- docs/src/components/home/StartToday.tsx | 8 +- .../components/home/StoreTemplatesBanner.tsx | 8 +- docs/src/components/home/Testimonials.tsx | 10 +- docs/src/components/home/UserFeedbacks.tsx | 8 +- docs/src/components/home/ValueProposition.tsx | 18 +- docs/src/components/icon/IconImage.tsx | 4 +- .../components/markdown/MarkdownElement.tsx | 2 +- docs/src/components/pricing/EarlyBird.tsx | 6 +- docs/src/components/pricing/FAQ.tsx | 22 +- docs/src/components/pricing/HeroPricing.tsx | 8 +- docs/src/components/pricing/PricingList.tsx | 20 +- docs/src/components/pricing/PricingTable.tsx | 24 +- docs/src/components/pricing/WhatToExpect.tsx | 18 +- .../productDesignKit/DesignKitDemo.tsx | 20 +- .../productDesignKit/DesignKitFAQ.tsx | 22 +- .../productDesignKit/DesignKitHero.tsx | 10 +- .../productDesignKit/DesignKitValues.tsx | 16 +- .../productTemplate/TemplateDemo.tsx | 16 +- .../productTemplate/TemplateHero.tsx | 8 +- docs/src/components/showcase/FolderTable.tsx | 24 +- .../components/showcase/NotificationCard.tsx | 16 +- docs/src/components/showcase/PlayerCard.tsx | 20 +- docs/src/components/showcase/TaskCard.tsx | 20 +- .../components/showcase/ThemeAccordion.tsx | 18 +- docs/src/components/showcase/ThemeButton.tsx | 2 +- docs/src/components/showcase/ThemeChip.tsx | 6 +- .../components/showcase/ThemeDatePicker.tsx | 14 +- docs/src/components/showcase/ThemeSlider.tsx | 8 +- docs/src/components/showcase/ThemeSwitch.tsx | 6 +- docs/src/components/showcase/ThemeTabs.tsx | 8 +- .../src/components/showcase/ThemeTimeline.tsx | 24 +- .../components/showcase/ThemeToggleButton.tsx | 8 +- .../components/showcase/ViewToggleButton.tsx | 16 +- .../components/typography/GradientText.tsx | 2 +- .../components/typography/SectionHeadline.tsx | 4 +- docs/src/icons/SvgCalendar.tsx | 2 +- docs/src/icons/SvgCard.tsx | 2 +- docs/src/icons/SvgChat.tsx | 2 +- docs/src/icons/SvgDocs.tsx | 2 +- docs/src/icons/SvgEye.tsx | 2 +- docs/src/icons/SvgInfinity.tsx | 2 +- docs/src/icons/SvgPalette.tsx | 2 +- docs/src/icons/SvgPencil.tsx | 2 +- docs/src/icons/SvgPerson.tsx | 2 +- docs/src/icons/SvgReplay.tsx | 2 +- docs/src/icons/SvgTag.tsx | 2 +- docs/src/layouts/AppFooter.tsx | 18 +- docs/src/layouts/AppHeader.tsx | 10 +- docs/src/layouts/HeroContainer.tsx | 6 +- docs/src/layouts/Section.tsx | 4 +- .../modules/branding/BrandingBeginToday.tsx | 10 +- .../modules/branding/BrandingBulletItem.tsx | 4 +- docs/src/modules/branding/BrandingCard.tsx | 6 +- .../branding/BrandingCustomerIcons.tsx | 6 +- .../modules/branding/BrandingDiscoverMore.tsx | 8 +- docs/src/modules/branding/BrandingFooter.tsx | 16 +- docs/src/modules/branding/BrandingHeader.tsx | 20 +- docs/src/modules/branding/BrandingLogo.tsx | 2 +- .../modules/branding/BrandingNewsletter.tsx | 12 +- docs/src/modules/branding/BrandingPersona.tsx | 16 +- docs/src/modules/branding/BrandingQuote.tsx | 6 +- docs/src/modules/branding/BrandingRoot.tsx | 12 +- docs/src/modules/branding/BrandingSearch.tsx | 6 +- .../src/modules/branding/CommunitySayCard.tsx | 6 +- .../branding/ExclusiveFeaturesCard.tsx | 4 +- docs/src/modules/branding/MaterialUixCard.tsx | 4 +- .../src/modules/branding/MaterialUixImage.tsx | 2 +- .../modules/branding/RoadMapDetailCard.tsx | 6 +- .../modules/branding/StartMaterialCard.tsx | 10 +- docs/src/modules/branding/UnderlinedText.tsx | 2 +- .../src/modules/branding/icons/ArrowCircle.js | 2 +- docs/src/modules/branding/icons/Changes.js | 2 +- docs/src/modules/branding/icons/Check.js | 2 +- .../src/modules/branding/icons/CircleClose.js | 2 +- docs/src/modules/branding/icons/Close.js | 2 +- docs/src/modules/branding/icons/Dropdown.js | 2 +- docs/src/modules/branding/icons/Feedback.js | 2 +- docs/src/modules/branding/icons/Finance.js | 2 +- docs/src/modules/branding/icons/Help.js | 2 +- .../modules/branding/icons/OpenCollective.js | 2 +- docs/src/modules/branding/icons/Search.js | 2 +- docs/src/modules/brandingTheme.ts | 10 +- docs/src/modules/components/Ad.js | 10 +- docs/src/modules/components/AdCarbon.js | 2 +- docs/src/modules/components/AdDisplay.js | 2 +- docs/src/modules/components/AdGuest.js | 2 +- docs/src/modules/components/AdManager.js | 2 +- docs/src/modules/components/AdobeXDIcon.js | 2 +- docs/src/modules/components/ApiPage.js | 13 +- docs/src/modules/components/AppContainer.js | 4 +- docs/src/modules/components/AppFooter.js | 10 +- docs/src/modules/components/AppFrame.js | 40 +- docs/src/modules/components/AppLayoutDocs.js | 6 +- .../modules/components/AppLayoutDocsFooter.js | 30 +- docs/src/modules/components/AppNavDrawer.js | 16 +- .../modules/components/AppNavDrawerItem.js | 8 +- docs/src/modules/components/AppSearch.js | 10 +- .../modules/components/AppSettingsDrawer.js | 32 +- .../modules/components/AppTableOfContents.js | 4 +- docs/src/modules/components/BundleSizeIcon.js | 2 +- .../modules/components/ComponentLinkHeader.js | 10 +- docs/src/modules/components/Demo.js | 8 +- .../modules/components/DemoErrorBoundary.js | 6 +- docs/src/modules/components/DemoSandboxed.js | 4 +- docs/src/modules/components/DemoToolbar.js | 34 +- .../src/modules/components/DiamondSponsors.js | 6 +- docs/src/modules/components/EditPage.js | 2 +- docs/src/modules/components/FigmaIcon.js | 2 +- .../src/modules/components/HighlightedCode.js | 2 +- docs/src/modules/components/Link.d.ts | 2 +- docs/src/modules/components/Link.tsx | 4 +- docs/src/modules/components/MarkdownDocs.js | 4 +- .../src/modules/components/MarkdownElement.js | 2 +- .../modules/components/MaterialDesignIcon.js | 2 +- docs/src/modules/components/Notifications.js | 28 +- docs/src/modules/components/SketchIcon.js | 2 +- docs/src/modules/components/ThemeContext.js | 12 +- docs/src/modules/components/TopLayoutBlog.js | 14 +- .../modules/components/TopLayoutCompany.js | 4 +- docs/src/modules/components/W3CIcon.js | 2 +- docs/src/modules/components/ad.styles.js | 2 +- .../src/modules/utils/StyledEngineProvider.js | 2 +- docs/src/modules/utils/getDemoConfig.js | 4 +- docs/src/modules/utils/getJsxPreview.test.js | 2 +- docs/src/modules/utils/helpers.test.js | 106 ++- docs/src/modules/utils/helpers.ts | 42 +- .../modules/utils/mapApiPageTranslations.js | 2 +- .../components/about-the-lab/about-the-lab.md | 12 +- .../components/accordion/BasicAccordion.js | 10 +- .../components/accordion/BasicAccordion.tsx | 10 +- .../accordion/ControlledAccordions.js | 10 +- .../accordion/ControlledAccordions.tsx | 10 +- .../accordion/CustomizedAccordions.js | 12 +- .../accordion/CustomizedAccordions.tsx | 12 +- .../pages/components/alert/ActionAlerts.js | 6 +- .../pages/components/alert/ActionAlerts.tsx | 6 +- .../src/pages/components/alert/BasicAlerts.js | 4 +- .../pages/components/alert/BasicAlerts.tsx | 4 +- .../src/pages/components/alert/ColorAlerts.js | 2 +- .../pages/components/alert/ColorAlerts.tsx | 2 +- .../components/alert/DescriptionAlerts.js | 6 +- .../components/alert/DescriptionAlerts.tsx | 6 +- .../pages/components/alert/FilledAlerts.js | 4 +- .../pages/components/alert/FilledAlerts.tsx | 4 +- docs/src/pages/components/alert/IconAlerts.js | 8 +- .../src/pages/components/alert/IconAlerts.tsx | 8 +- .../pages/components/alert/OutlinedAlerts.js | 4 +- .../pages/components/alert/OutlinedAlerts.tsx | 4 +- .../components/alert/TransitionAlerts.js | 12 +- .../components/alert/TransitionAlerts.tsx | 12 +- .../src/pages/components/app-bar/BackToTop.js | 20 +- .../pages/components/app-bar/BackToTop.tsx | 20 +- .../pages/components/app-bar/BottomAppBar.js | 38 +- .../pages/components/app-bar/BottomAppBar.tsx | 38 +- .../pages/components/app-bar/ButtonAppBar.js | 14 +- .../pages/components/app-bar/ButtonAppBar.tsx | 14 +- .../pages/components/app-bar/DenseAppBar.js | 12 +- .../pages/components/app-bar/DenseAppBar.tsx | 12 +- .../pages/components/app-bar/ElevateAppBar.js | 14 +- .../components/app-bar/ElevateAppBar.tsx | 14 +- .../pages/components/app-bar/HideAppBar.js | 16 +- .../pages/components/app-bar/HideAppBar.tsx | 16 +- .../pages/components/app-bar/MenuAppBar.js | 24 +- .../pages/components/app-bar/MenuAppBar.tsx | 24 +- .../components/app-bar/PrimarySearchAppBar.js | 32 +- .../app-bar/PrimarySearchAppBar.tsx | 32 +- .../components/app-bar/ProminentAppBar.js | 18 +- .../components/app-bar/ProminentAppBar.tsx | 18 +- .../pages/components/app-bar/SearchAppBar.js | 18 +- .../pages/components/app-bar/SearchAppBar.tsx | 18 +- docs/src/pages/components/app-bar/app-bar.md | 2 +- .../components/autocomplete/Asynchronous.js | 6 +- .../components/autocomplete/Asynchronous.tsx | 6 +- .../components/autocomplete/CheckboxesTags.js | 10 +- .../autocomplete/CheckboxesTags.tsx | 10 +- .../pages/components/autocomplete/ComboBox.js | 4 +- .../components/autocomplete/ComboBox.tsx | 4 +- .../autocomplete/ControllableStates.js | 4 +- .../autocomplete/ControllableStates.tsx | 4 +- .../components/autocomplete/CountrySelect.js | 6 +- .../components/autocomplete/CountrySelect.tsx | 6 +- .../autocomplete/CustomInputAutocomplete.js | 2 +- .../autocomplete/CustomInputAutocomplete.tsx | 2 +- .../components/autocomplete/CustomizedHook.js | 8 +- .../autocomplete/CustomizedHook.tsx | 8 +- .../autocomplete/DisabledOptions.js | 4 +- .../autocomplete/DisabledOptions.tsx | 4 +- .../pages/components/autocomplete/Filter.js | 4 +- .../pages/components/autocomplete/Filter.tsx | 4 +- .../components/autocomplete/FixedTags.js | 6 +- .../components/autocomplete/FixedTags.tsx | 6 +- .../pages/components/autocomplete/FreeSolo.js | 6 +- .../components/autocomplete/FreeSolo.tsx | 6 +- .../autocomplete/FreeSoloCreateOption.js | 4 +- .../autocomplete/FreeSoloCreateOption.tsx | 4 +- .../FreeSoloCreateOptionDialog.js | 16 +- .../FreeSoloCreateOptionDialog.tsx | 16 +- .../components/autocomplete/GitHubLabel.js | 20 +- .../components/autocomplete/GitHubLabel.tsx | 20 +- .../components/autocomplete/GoogleMaps.js | 12 +- .../components/autocomplete/GoogleMaps.tsx | 12 +- .../pages/components/autocomplete/Grouped.js | 4 +- .../pages/components/autocomplete/Grouped.tsx | 4 +- .../components/autocomplete/Highlights.js | 4 +- .../components/autocomplete/Highlights.tsx | 4 +- .../components/autocomplete/LimitTags.js | 4 +- .../components/autocomplete/LimitTags.tsx | 4 +- .../components/autocomplete/Playground.js | 6 +- .../components/autocomplete/Playground.tsx | 6 +- .../pages/components/autocomplete/Sizes.js | 8 +- .../pages/components/autocomplete/Sizes.tsx | 8 +- .../src/pages/components/autocomplete/Tags.js | 8 +- .../pages/components/autocomplete/Tags.tsx | 8 +- .../autocomplete/UseAutocomplete.js | 4 +- .../autocomplete/UseAutocomplete.tsx | 4 +- .../components/autocomplete/Virtualize.js | 14 +- .../components/autocomplete/Virtualize.tsx | 14 +- .../components/autocomplete/autocomplete.md | 8 +- .../avatars/BackgroundLetterAvatars.js | 4 +- .../avatars/BackgroundLetterAvatars.tsx | 4 +- .../pages/components/avatars/BadgeAvatars.js | 8 +- .../pages/components/avatars/BadgeAvatars.tsx | 8 +- .../components/avatars/FallbackAvatars.js | 6 +- .../components/avatars/FallbackAvatars.tsx | 6 +- .../pages/components/avatars/GroupAvatars.js | 4 +- .../pages/components/avatars/GroupAvatars.tsx | 4 +- .../pages/components/avatars/IconAvatars.js | 12 +- .../pages/components/avatars/IconAvatars.tsx | 12 +- .../pages/components/avatars/ImageAvatars.js | 4 +- .../pages/components/avatars/ImageAvatars.tsx | 4 +- .../pages/components/avatars/LetterAvatars.js | 6 +- .../components/avatars/LetterAvatars.tsx | 6 +- .../pages/components/avatars/SizeAvatars.js | 4 +- .../pages/components/avatars/SizeAvatars.tsx | 4 +- .../components/avatars/VariantAvatars.js | 8 +- .../components/avatars/VariantAvatars.tsx | 8 +- .../components/backdrop/SimpleBackdrop.js | 6 +- .../components/backdrop/SimpleBackdrop.tsx | 6 +- .../src/pages/components/backdrop/backdrop.md | 2 +- .../components/badges/AccessibleBadges.js | 6 +- .../components/badges/AccessibleBadges.tsx | 6 +- .../pages/components/badges/BadgeAlignment.js | 16 +- docs/src/pages/components/badges/BadgeMax.js | 6 +- docs/src/pages/components/badges/BadgeMax.tsx | 6 +- .../pages/components/badges/BadgeOverlap.js | 6 +- .../pages/components/badges/BadgeOverlap.tsx | 6 +- .../components/badges/BadgeVisibility.js | 18 +- .../components/badges/BadgeVisibility.tsx | 18 +- .../src/pages/components/badges/ColorBadge.js | 6 +- .../pages/components/badges/ColorBadge.tsx | 6 +- .../components/badges/CustomizedBadges.js | 8 +- .../components/badges/CustomizedBadges.tsx | 8 +- docs/src/pages/components/badges/DotBadge.js | 6 +- docs/src/pages/components/badges/DotBadge.tsx | 6 +- .../pages/components/badges/ShowZeroBadge.js | 6 +- .../pages/components/badges/ShowZeroBadge.tsx | 6 +- .../pages/components/badges/SimpleBadge.js | 4 +- .../pages/components/badges/SimpleBadge.tsx | 4 +- .../pages/components/badges/UnstyledBadge.js | 4 +- .../pages/components/badges/UnstyledBadge.tsx | 4 +- docs/src/pages/components/badges/badges.md | 2 +- .../FixedBottomNavigation.js | 26 +- .../FixedBottomNavigation.tsx | 26 +- .../LabelBottomNavigation.js | 12 +- .../LabelBottomNavigation.tsx | 12 +- .../SimpleBottomNavigation.js | 12 +- .../SimpleBottomNavigation.tsx | 12 +- docs/src/pages/components/box/BoxComponent.js | 4 +- .../src/pages/components/box/BoxComponent.tsx | 4 +- docs/src/pages/components/box/BoxSx.js | 2 +- docs/src/pages/components/box/BoxSx.tsx | 2 +- docs/src/pages/components/box/box.md | 4 +- .../breadcrumbs/ActiveLastBreadcrumb.js | 4 +- .../breadcrumbs/ActiveLastBreadcrumb.tsx | 4 +- .../breadcrumbs/BasicBreadcrumbs.js | 6 +- .../breadcrumbs/BasicBreadcrumbs.tsx | 6 +- .../breadcrumbs/CollapsedBreadcrumbs.js | 6 +- .../breadcrumbs/CollapsedBreadcrumbs.tsx | 6 +- .../components/breadcrumbs/CustomSeparator.js | 10 +- .../breadcrumbs/CustomSeparator.tsx | 10 +- .../breadcrumbs/CustomizedBreadcrumbs.js | 10 +- .../breadcrumbs/CustomizedBreadcrumbs.tsx | 10 +- .../components/breadcrumbs/IconBreadcrumbs.js | 12 +- .../breadcrumbs/IconBreadcrumbs.tsx | 12 +- .../breadcrumbs/RouterBreadcrumbs.js | 20 +- .../breadcrumbs/RouterBreadcrumbs.tsx | 20 +- .../button-group/BasicButtonGroup.js | 4 +- .../button-group/BasicButtonGroup.tsx | 4 +- .../button-group/DisableElevation.js | 4 +- .../button-group/DisableElevation.tsx | 4 +- .../button-group/GroupOrientation.js | 6 +- .../button-group/GroupOrientation.tsx | 6 +- .../button-group/GroupSizesColors.js | 6 +- .../button-group/GroupSizesColors.tsx | 6 +- .../components/button-group/SplitButton.js | 18 +- .../components/button-group/SplitButton.tsx | 18 +- .../button-group/VariantButtonGroup.js | 6 +- .../button-group/VariantButtonGroup.tsx | 6 +- .../pages/components/buttons/BasicButtons.js | 4 +- .../pages/components/buttons/BasicButtons.tsx | 4 +- .../pages/components/buttons/ButtonBase.js | 8 +- .../pages/components/buttons/ButtonBase.tsx | 8 +- .../pages/components/buttons/ButtonSizes.js | 4 +- .../pages/components/buttons/ButtonSizes.tsx | 4 +- .../pages/components/buttons/ColorButtons.js | 4 +- .../pages/components/buttons/ColorButtons.tsx | 4 +- .../components/buttons/ContainedButtons.js | 4 +- .../components/buttons/ContainedButtons.tsx | 4 +- .../components/buttons/CustomizedButtons.js | 8 +- .../components/buttons/CustomizedButtons.tsx | 8 +- .../components/buttons/DisableElevation.js | 2 +- .../components/buttons/DisableElevation.tsx | 2 +- .../components/buttons/IconButtonColors.js | 6 +- .../components/buttons/IconButtonColors.tsx | 6 +- .../components/buttons/IconButtonSizes.js | 6 +- .../components/buttons/IconButtonSizes.tsx | 6 +- .../pages/components/buttons/IconButtons.js | 10 +- .../pages/components/buttons/IconButtons.tsx | 10 +- .../components/buttons/IconLabelButtons.js | 8 +- .../components/buttons/IconLabelButtons.tsx | 8 +- .../components/buttons/LoadingButtons.js | 6 +- .../components/buttons/LoadingButtons.tsx | 6 +- .../buttons/LoadingButtonsTransition.js | 12 +- .../buttons/LoadingButtonsTransition.tsx | 12 +- .../components/buttons/OutlinedButtons.js | 4 +- .../components/buttons/OutlinedButtons.tsx | 4 +- .../pages/components/buttons/TextButtons.js | 4 +- .../pages/components/buttons/TextButtons.tsx | 4 +- .../buttons/UnstyledButtonCustom.js | 8 +- .../buttons/UnstyledButtonCustom.tsx | 6 +- .../buttons/UnstyledButtonsSimple.js | 8 +- .../buttons/UnstyledButtonsSimple.tsx | 6 +- .../components/buttons/UnstyledButtonsSpan.js | 8 +- .../buttons/UnstyledButtonsSpan.tsx | 6 +- .../pages/components/buttons/UploadButtons.js | 10 +- .../components/buttons/UploadButtons.tsx | 10 +- .../src/pages/components/buttons/UseButton.js | 6 +- .../pages/components/buttons/UseButton.tsx | 9 +- docs/src/pages/components/buttons/buttons.md | 4 +- .../pages/components/cards/ActionAreaCard.js | 10 +- .../pages/components/cards/ActionAreaCard.tsx | 10 +- docs/src/pages/components/cards/BasicCard.js | 12 +- docs/src/pages/components/cards/BasicCard.tsx | 12 +- .../pages/components/cards/ImgMediaCard.js | 12 +- .../pages/components/cards/ImgMediaCard.tsx | 12 +- docs/src/pages/components/cards/MediaCard.js | 12 +- docs/src/pages/components/cards/MediaCard.tsx | 12 +- .../components/cards/MediaControlCard.js | 20 +- .../components/cards/MediaControlCard.tsx | 20 +- .../components/cards/MultiActionAreaCard.js | 10 +- .../components/cards/MultiActionAreaCard.tsx | 10 +- .../pages/components/cards/OutlinedCard.js | 12 +- .../pages/components/cards/OutlinedCard.tsx | 12 +- .../components/cards/RecipeReviewCard.js | 30 +- .../components/cards/RecipeReviewCard.tsx | 30 +- .../components/checkboxes/CheckboxLabels.js | 6 +- .../components/checkboxes/CheckboxLabels.tsx | 6 +- .../pages/components/checkboxes/Checkboxes.js | 2 +- .../components/checkboxes/Checkboxes.tsx | 2 +- .../components/checkboxes/CheckboxesGroup.js | 14 +- .../components/checkboxes/CheckboxesGroup.tsx | 14 +- .../components/checkboxes/ColorCheckboxes.js | 4 +- .../components/checkboxes/ColorCheckboxes.tsx | 4 +- .../checkboxes/ControlledCheckbox.js | 2 +- .../checkboxes/ControlledCheckbox.tsx | 2 +- .../checkboxes/CustomizedCheckbox.js | 4 +- .../checkboxes/CustomizedCheckbox.tsx | 4 +- .../checkboxes/FormControlLabelPosition.js | 10 +- .../checkboxes/FormControlLabelPosition.tsx | 10 +- .../components/checkboxes/IconCheckboxes.js | 10 +- .../components/checkboxes/IconCheckboxes.tsx | 10 +- .../checkboxes/IndeterminateCheckbox.js | 6 +- .../checkboxes/IndeterminateCheckbox.tsx | 6 +- .../components/checkboxes/SizeCheckboxes.js | 2 +- .../components/checkboxes/SizeCheckboxes.tsx | 2 +- .../src/pages/components/chips/AvatarChips.js | 6 +- .../pages/components/chips/AvatarChips.tsx | 6 +- docs/src/pages/components/chips/BasicChips.js | 4 +- .../src/pages/components/chips/BasicChips.tsx | 4 +- docs/src/pages/components/chips/ChipsArray.js | 8 +- .../src/pages/components/chips/ChipsArray.tsx | 8 +- .../pages/components/chips/ChipsPlayground.js | 20 +- .../chips/ClickeableAndDeleteableChips.js | 4 +- .../chips/ClickeableAndDeleteableChips.tsx | 4 +- .../pages/components/chips/ClickeableChips.js | 4 +- .../components/chips/ClickeableChips.tsx | 4 +- .../components/chips/ClickeableLinkChips.js | 4 +- .../components/chips/ClickeableLinkChips.tsx | 4 +- docs/src/pages/components/chips/ColorChips.js | 4 +- .../src/pages/components/chips/ColorChips.tsx | 4 +- .../components/chips/CustomDeleteIconChips.js | 8 +- .../chips/CustomDeleteIconChips.tsx | 8 +- .../pages/components/chips/DeleteableChips.js | 4 +- .../components/chips/DeleteableChips.tsx | 4 +- docs/src/pages/components/chips/IconChips.js | 6 +- docs/src/pages/components/chips/IconChips.tsx | 6 +- docs/src/pages/components/chips/SizesChips.js | 4 +- .../src/pages/components/chips/SizesChips.tsx | 4 +- .../click-away-listener/ClickAway.js | 4 +- .../click-away-listener/ClickAway.tsx | 6 +- .../click-away-listener/LeadingClickAway.js | 4 +- .../click-away-listener/LeadingClickAway.tsx | 6 +- .../click-away-listener/PortalClickAway.js | 6 +- .../click-away-listener/PortalClickAway.tsx | 8 +- .../components/container/FixedContainer.js | 6 +- .../components/container/FixedContainer.tsx | 6 +- .../components/container/SimpleContainer.js | 6 +- .../components/container/SimpleContainer.tsx | 6 +- .../components/css-baseline/css-baseline.md | 6 +- .../components/date-picker/BasicDatePicker.js | 8 +- .../date-picker/BasicDatePicker.tsx | 8 +- .../pages/components/date-picker/CustomDay.js | 12 +- .../components/date-picker/CustomDay.tsx | 12 +- .../components/date-picker/CustomInput.js | 8 +- .../components/date-picker/CustomInput.tsx | 8 +- .../date-picker/FormPropsDatePickers.js | 10 +- .../date-picker/FormPropsDatePickers.tsx | 10 +- .../components/date-picker/HelperText.js | 8 +- .../components/date-picker/HelperText.tsx | 8 +- .../date-picker/JalaliDatePicker.js | 6 +- .../date-picker/JalaliDatePicker.tsx | 6 +- .../date-picker/LocalizedDatePicker.js | 12 +- .../date-picker/LocalizedDatePicker.tsx | 12 +- .../date-picker/ResponsiveDatePickers.js | 14 +- .../date-picker/ResponsiveDatePickers.tsx | 14 +- .../date-picker/ServerRequestDatePicker.js | 14 +- .../date-picker/ServerRequestDatePicker.tsx | 14 +- .../date-picker/StaticDatePickerDemo.js | 8 +- .../date-picker/StaticDatePickerDemo.tsx | 8 +- .../date-picker/StaticDatePickerLandscape.js | 8 +- .../date-picker/StaticDatePickerLandscape.tsx | 8 +- .../date-picker/SubComponentsPickers.js | 12 +- .../date-picker/SubComponentsPickers.tsx | 12 +- .../components/date-picker/ViewsDatePicker.js | 10 +- .../date-picker/ViewsDatePicker.tsx | 10 +- .../components/date-picker/date-picker.md | 8 +- .../date-range-picker/BasicDateRangePicker.js | 10 +- .../BasicDateRangePicker.tsx | 10 +- .../CalendarsDateRangePicker.js | 12 +- .../CalendarsDateRangePicker.tsx | 12 +- .../CustomDateRangeInputs.js | 8 +- .../CustomDateRangeInputs.tsx | 8 +- .../CustomDateRangePickerDay.js | 14 +- .../CustomDateRangePickerDay.tsx | 16 +- .../FormPropsDateRangePickers.js | 12 +- .../FormPropsDateRangePickers.tsx | 12 +- .../MinMaxDateRangePicker.js | 10 +- .../MinMaxDateRangePicker.tsx | 10 +- .../ResponsiveDateRangePicker.js | 14 +- .../ResponsiveDateRangePicker.tsx | 16 +- .../StaticDateRangePickerDemo.js | 10 +- .../StaticDateRangePickerDemo.tsx | 12 +- .../date-range-picker/date-range-picker.md | 8 +- .../date-time-picker/BasicDateTimePicker.js | 8 +- .../date-time-picker/BasicDateTimePicker.tsx | 8 +- .../date-time-picker/CustomDateTimePicker.js | 18 +- .../date-time-picker/CustomDateTimePicker.tsx | 18 +- .../date-time-picker/DateTimeValidation.js | 10 +- .../date-time-picker/DateTimeValidation.tsx | 10 +- .../FormPropsDateTimePickers.js | 10 +- .../FormPropsDateTimePickers.tsx | 10 +- .../ResponsiveDateTimePickers.js | 14 +- .../ResponsiveDateTimePickers.tsx | 14 +- .../StaticDateTimePickerDemo.js | 8 +- .../StaticDateTimePickerDemo.tsx | 8 +- .../date-time-picker/date-time-picker.md | 8 +- .../pages/components/dialogs/AlertDialog.js | 12 +- .../pages/components/dialogs/AlertDialog.tsx | 12 +- .../components/dialogs/AlertDialogSlide.js | 14 +- .../components/dialogs/AlertDialogSlide.tsx | 16 +- .../components/dialogs/ConfirmationDialog.js | 24 +- .../components/dialogs/ConfirmationDialog.tsx | 24 +- .../components/dialogs/CustomizedDialogs.js | 18 +- .../components/dialogs/CustomizedDialogs.tsx | 18 +- .../components/dialogs/DraggableDialog.js | 14 +- .../components/dialogs/DraggableDialog.tsx | 14 +- .../pages/components/dialogs/FormDialog.js | 14 +- .../pages/components/dialogs/FormDialog.tsx | 14 +- .../components/dialogs/FullScreenDialog.js | 24 +- .../components/dialogs/FullScreenDialog.tsx | 26 +- .../components/dialogs/MaxWidthDialog.js | 26 +- .../components/dialogs/MaxWidthDialog.tsx | 26 +- .../components/dialogs/ResponsiveDialog.js | 16 +- .../components/dialogs/ResponsiveDialog.tsx | 16 +- .../pages/components/dialogs/ScrollDialog.js | 12 +- .../pages/components/dialogs/ScrollDialog.tsx | 12 +- .../pages/components/dialogs/SimpleDialog.js | 24 +- .../pages/components/dialogs/SimpleDialog.tsx | 24 +- docs/src/pages/components/dialogs/dialogs.md | 2 +- .../pages/components/dividers/DividerText.js | 6 +- .../pages/components/dividers/DividerText.tsx | 6 +- .../components/dividers/InsetDividers.js | 18 +- .../components/dividers/InsetDividers.tsx | 18 +- .../pages/components/dividers/ListDividers.js | 8 +- .../components/dividers/ListDividers.tsx | 8 +- .../components/dividers/MiddleDividers.js | 14 +- .../components/dividers/MiddleDividers.tsx | 14 +- .../components/dividers/SubheaderDividers.js | 16 +- .../components/dividers/SubheaderDividers.tsx | 16 +- .../dividers/VerticalDividerMiddle.js | 14 +- .../dividers/VerticalDividerMiddle.tsx | 14 +- .../dividers/VerticalDividerText.js | 6 +- .../dividers/VerticalDividerText.tsx | 6 +- .../components/dividers/VerticalDividers.js | 14 +- .../components/dividers/VerticalDividers.tsx | 14 +- .../pages/components/drawers/ClippedDrawer.js | 26 +- .../components/drawers/ClippedDrawer.tsx | 26 +- .../pages/components/drawers/MiniDrawer.js | 36 +- .../pages/components/drawers/MiniDrawer.tsx | 36 +- .../components/drawers/PermanentDrawerLeft.js | 26 +- .../drawers/PermanentDrawerLeft.tsx | 26 +- .../drawers/PermanentDrawerRight.js | 26 +- .../drawers/PermanentDrawerRight.tsx | 26 +- .../drawers/PersistentDrawerLeft.js | 36 +- .../drawers/PersistentDrawerLeft.tsx | 36 +- .../drawers/PersistentDrawerRight.js | 36 +- .../drawers/PersistentDrawerRight.tsx | 36 +- .../components/drawers/ResponsiveDrawer.js | 30 +- .../components/drawers/ResponsiveDrawer.tsx | 30 +- .../components/drawers/SwipeableEdgeDrawer.js | 16 +- .../drawers/SwipeableEdgeDrawer.tsx | 16 +- .../drawers/SwipeableTemporaryDrawer.js | 20 +- .../drawers/SwipeableTemporaryDrawer.tsx | 20 +- .../components/drawers/TemporaryDrawer.js | 20 +- .../components/drawers/TemporaryDrawer.tsx | 20 +- .../FloatingActionButtonExtendedSize.js | 6 +- .../FloatingActionButtonExtendedSize.tsx | 6 +- .../FloatingActionButtonSize.js | 6 +- .../FloatingActionButtonSize.tsx | 6 +- .../FloatingActionButtonZoom.js | 24 +- .../FloatingActionButtonZoom.tsx | 26 +- .../FloatingActionButtons.js | 12 +- .../FloatingActionButtons.tsx | 12 +- docs/src/pages/components/grid/AutoGrid.js | 8 +- docs/src/pages/components/grid/AutoGrid.tsx | 8 +- .../pages/components/grid/AutoGridNoWrap.js | 10 +- .../pages/components/grid/AutoGridNoWrap.tsx | 10 +- docs/src/pages/components/grid/BasicGrid.js | 8 +- docs/src/pages/components/grid/BasicGrid.tsx | 8 +- docs/src/pages/components/grid/CSSGrid.js | 6 +- docs/src/pages/components/grid/CSSGrid.tsx | 6 +- docs/src/pages/components/grid/ColumnsGrid.js | 8 +- .../src/pages/components/grid/ColumnsGrid.tsx | 8 +- docs/src/pages/components/grid/ComplexGrid.js | 10 +- .../src/pages/components/grid/ComplexGrid.tsx | 10 +- .../pages/components/grid/FullWidthGrid.js | 8 +- .../pages/components/grid/FullWidthGrid.tsx | 8 +- .../pages/components/grid/InteractiveGrid.js | 14 +- .../pages/components/grid/InteractiveGrid.tsx | 14 +- docs/src/pages/components/grid/NestedGrid.js | 8 +- docs/src/pages/components/grid/NestedGrid.tsx | 8 +- .../pages/components/grid/ResponsiveGrid.js | 8 +- .../pages/components/grid/ResponsiveGrid.tsx | 8 +- .../components/grid/RowAndColumnSpacing.js | 8 +- .../components/grid/RowAndColumnSpacing.tsx | 8 +- docs/src/pages/components/grid/SpacingGrid.js | 14 +- .../src/pages/components/grid/SpacingGrid.tsx | 14 +- .../components/grid/VariableWidthGrid.js | 8 +- .../components/grid/VariableWidthGrid.tsx | 8 +- .../pages/components/icons/CreateSvgIcon.js | 4 +- .../pages/components/icons/CreateSvgIcon.tsx | 4 +- .../pages/components/icons/FontAwesomeIcon.js | 6 +- .../components/icons/FontAwesomeIcon.tsx | 6 +- .../components/icons/FontAwesomeIconSize.js | 10 +- .../components/icons/FontAwesomeIconSize.tsx | 10 +- .../icons/FontAwesomeSvgIconDemo.js | 8 +- .../icons/FontAwesomeSvgIconDemo.tsx | 8 +- docs/src/pages/components/icons/Icons.js | 6 +- docs/src/pages/components/icons/Icons.tsx | 6 +- .../pages/components/icons/SvgIconsColor.js | 6 +- .../pages/components/icons/SvgIconsColor.tsx | 6 +- .../pages/components/icons/SvgIconsSize.js | 4 +- .../pages/components/icons/SvgIconsSize.tsx | 4 +- .../components/icons/SvgMaterialIcons.js | 30 +- .../components/icons/SvgMaterialIcons.tsx | 30 +- .../pages/components/icons/TwoToneIcons.js | 2 +- .../pages/components/icons/TwoToneIcons.tsx | 2 +- docs/src/pages/components/icons/icons.md | 48 +- .../components/image-list/CustomImageList.js | 10 +- .../components/image-list/CustomImageList.tsx | 10 +- .../components/image-list/MasonryImageList.js | 6 +- .../image-list/MasonryImageList.tsx | 6 +- .../components/image-list/QuiltedImageList.js | 4 +- .../image-list/QuiltedImageList.tsx | 4 +- .../image-list/StandardImageList.js | 4 +- .../image-list/StandardImageList.tsx | 4 +- .../image-list/TitlebarBelowImageList.js | 6 +- .../image-list/TitlebarBelowImageList.tsx | 6 +- .../TitlebarBelowMasonryImageList.js | 8 +- .../TitlebarBelowMasonryImageList.tsx | 8 +- .../image-list/TitlebarImageList.js | 12 +- .../image-list/TitlebarImageList.tsx | 12 +- .../components/image-list/WovenImageList.js | 4 +- .../components/image-list/WovenImageList.tsx | 4 +- docs/src/pages/components/links/ButtonLink.js | 2 +- .../src/pages/components/links/ButtonLink.tsx | 2 +- docs/src/pages/components/links/Links.js | 4 +- docs/src/pages/components/links/Links.tsx | 4 +- .../pages/components/links/UnderlineLink.js | 4 +- .../pages/components/links/UnderlineLink.tsx | 4 +- .../pages/components/lists/AlignItemsList.js | 14 +- .../pages/components/lists/AlignItemsList.tsx | 14 +- docs/src/pages/components/lists/BasicList.js | 18 +- docs/src/pages/components/lists/BasicList.tsx | 18 +- .../pages/components/lists/CheckboxList.js | 16 +- .../pages/components/lists/CheckboxList.tsx | 16 +- .../components/lists/CheckboxListSecondary.js | 14 +- .../lists/CheckboxListSecondary.tsx | 14 +- .../pages/components/lists/CustomizedList.js | 38 +- .../pages/components/lists/CustomizedList.tsx | 38 +- docs/src/pages/components/lists/FolderList.js | 16 +- .../src/pages/components/lists/FolderList.tsx | 16 +- .../pages/components/lists/GutterlessList.js | 10 +- .../pages/components/lists/GutterlessList.tsx | 10 +- docs/src/pages/components/lists/InsetList.js | 12 +- docs/src/pages/components/lists/InsetList.tsx | 12 +- .../pages/components/lists/InteractiveList.js | 32 +- .../components/lists/InteractiveList.tsx | 32 +- docs/src/pages/components/lists/NestedList.js | 24 +- .../src/pages/components/lists/NestedList.tsx | 24 +- .../components/lists/PinnedSubheaderList.js | 8 +- .../components/lists/PinnedSubheaderList.tsx | 8 +- .../components/lists/SelectedListItem.js | 16 +- .../components/lists/SelectedListItem.tsx | 16 +- .../components/lists/SwitchListSecondary.js | 16 +- .../components/lists/SwitchListSecondary.tsx | 16 +- .../pages/components/lists/VirtualizedList.js | 8 +- .../components/lists/VirtualizedList.tsx | 8 +- .../pages/components/masonry/BasicMasonry.js | 6 +- .../pages/components/masonry/BasicMasonry.tsx | 6 +- .../components/masonry/DiffColSizeMasonry.js | 6 +- .../components/masonry/DiffColSizeMasonry.tsx | 6 +- .../masonry/DiffColSizeMasonryBroken.js | 6 +- .../masonry/DiffColSizeMasonryBroken.tsx | 6 +- .../pages/components/masonry/FixedColumns.js | 6 +- .../pages/components/masonry/FixedColumns.tsx | 6 +- .../pages/components/masonry/FixedSpacing.js | 6 +- .../pages/components/masonry/FixedSpacing.tsx | 6 +- .../pages/components/masonry/ImageMasonry.js | 6 +- .../pages/components/masonry/ImageMasonry.tsx | 6 +- .../components/masonry/ResponsiveColumns.js | 6 +- .../components/masonry/ResponsiveColumns.tsx | 6 +- .../components/masonry/ResponsiveSpacing.js | 6 +- .../components/masonry/ResponsiveSpacing.tsx | 6 +- .../pages/components/masonry/SSRMasonry.js | 6 +- .../pages/components/masonry/SSRMasonry.tsx | 6 +- .../components/material-icons/SearchIcons.js | 78 +- .../material-icons/material-icons.md | 4 +- .../src/pages/components/menus/AccountMenu.js | 24 +- .../pages/components/menus/AccountMenu.tsx | 24 +- docs/src/pages/components/menus/BasicMenu.js | 6 +- docs/src/pages/components/menus/BasicMenu.tsx | 6 +- .../src/pages/components/menus/ContextMenu.js | 6 +- .../pages/components/menus/ContextMenu.tsx | 6 +- .../pages/components/menus/CustomizedMenus.js | 20 +- .../components/menus/CustomizedMenus.tsx | 20 +- docs/src/pages/components/menus/DenseMenu.js | 14 +- docs/src/pages/components/menus/DenseMenu.tsx | 14 +- docs/src/pages/components/menus/FadeMenu.js | 8 +- docs/src/pages/components/menus/FadeMenu.tsx | 8 +- docs/src/pages/components/menus/IconMenu.js | 22 +- docs/src/pages/components/menus/IconMenu.tsx | 22 +- docs/src/pages/components/menus/LongMenu.js | 8 +- docs/src/pages/components/menus/LongMenu.tsx | 8 +- .../components/menus/MenuListComposition.js | 16 +- .../components/menus/MenuListComposition.tsx | 16 +- .../pages/components/menus/MenuPopupState.js | 6 +- .../pages/components/menus/MenuPopupState.tsx | 6 +- .../pages/components/menus/PositionedMenu.js | 6 +- .../pages/components/menus/PositionedMenu.tsx | 6 +- .../pages/components/menus/SimpleListMenu.js | 10 +- .../pages/components/menus/SimpleListMenu.tsx | 10 +- .../pages/components/menus/TypographyMenu.js | 16 +- .../pages/components/menus/TypographyMenu.tsx | 16 +- docs/src/pages/components/modal/BasicModal.js | 8 +- .../src/pages/components/modal/BasicModal.tsx | 8 +- .../components/modal/KeepMountedModal.js | 8 +- .../components/modal/KeepMountedModal.tsx | 8 +- .../pages/components/modal/ModalUnstyled.js | 4 +- .../pages/components/modal/ModalUnstyled.tsx | 4 +- .../src/pages/components/modal/NestedModal.js | 6 +- .../pages/components/modal/NestedModal.tsx | 6 +- .../src/pages/components/modal/ServerModal.js | 6 +- .../pages/components/modal/ServerModal.tsx | 6 +- .../src/pages/components/modal/SpringModal.js | 10 +- .../pages/components/modal/SpringModal.tsx | 10 +- .../components/modal/TransitionsModal.js | 12 +- .../components/modal/TransitionsModal.tsx | 12 +- docs/src/pages/components/modal/modal.md | 4 +- .../pages/components/no-ssr/FrameDeferring.js | 4 +- .../components/no-ssr/FrameDeferring.tsx | 4 +- .../pages/components/no-ssr/SimpleNoSsr.js | 4 +- .../pages/components/no-ssr/SimpleNoSsr.tsx | 4 +- docs/src/pages/components/no-ssr/no-ssr.md | 4 +- .../components/pagination/BasicPagination.js | 4 +- .../components/pagination/BasicPagination.tsx | 4 +- .../pagination/PaginationButtons.js | 4 +- .../pagination/PaginationButtons.tsx | 4 +- .../pagination/PaginationControlled.js | 6 +- .../pagination/PaginationControlled.tsx | 6 +- .../components/pagination/PaginationLink.js | 4 +- .../components/pagination/PaginationLink.tsx | 4 +- .../pagination/PaginationOutlined.js | 4 +- .../pagination/PaginationOutlined.tsx | 4 +- .../components/pagination/PaginationRanges.js | 4 +- .../pagination/PaginationRanges.tsx | 4 +- .../pagination/PaginationRounded.js | 4 +- .../pagination/PaginationRounded.tsx | 4 +- .../components/pagination/PaginationSize.js | 4 +- .../components/pagination/PaginationSize.tsx | 4 +- .../components/pagination/TablePagination.js | 2 +- .../components/pagination/TablePagination.tsx | 2 +- .../components/pagination/UsePagination.js | 4 +- .../components/pagination/UsePagination.tsx | 4 +- .../pages/components/pagination/pagination.md | 2 +- docs/src/pages/components/paper/Elevation.js | 8 +- docs/src/pages/components/paper/Elevation.tsx | 8 +- .../src/pages/components/paper/SimplePaper.js | 4 +- .../pages/components/paper/SimplePaper.tsx | 4 +- docs/src/pages/components/paper/Variants.js | 4 +- docs/src/pages/components/paper/Variants.tsx | 4 +- .../components/pickers/MaterialUIPickers.js | 16 +- .../components/pickers/MaterialUIPickers.tsx | 16 +- .../pages/components/pickers/NativePickers.js | 4 +- .../components/pickers/NativePickers.tsx | 4 +- docs/src/pages/components/pickers/pickers.md | 10 +- .../components/popover/AnchorPlayground.js | 26 +- .../pages/components/popover/BasicPopover.js | 6 +- .../pages/components/popover/BasicPopover.tsx | 6 +- .../components/popover/MouseOverPopover.js | 4 +- .../components/popover/MouseOverPopover.tsx | 4 +- .../components/popover/PopoverPopupState.js | 6 +- .../components/popover/PopoverPopupState.tsx | 6 +- .../components/popper/PopperPopupState.js | 10 +- .../components/popper/PopperPopupState.tsx | 10 +- .../components/popper/PositionedPopper.js | 14 +- .../components/popper/PositionedPopper.tsx | 14 +- .../components/popper/ScrollPlayground.js | 30 +- .../pages/components/popper/SimplePopper.js | 4 +- .../pages/components/popper/SimplePopper.tsx | 4 +- .../pages/components/popper/SpringPopper.js | 4 +- .../pages/components/popper/SpringPopper.tsx | 4 +- .../components/popper/TransitionsPopper.js | 6 +- .../components/popper/TransitionsPopper.tsx | 6 +- .../components/popper/VirtualElementPopper.js | 8 +- .../popper/VirtualElementPopper.tsx | 8 +- .../pages/components/portal/SimplePortal.js | 4 +- .../pages/components/portal/SimplePortal.tsx | 4 +- docs/src/pages/components/portal/portal.md | 4 +- .../components/progress/CircularColor.js | 4 +- .../components/progress/CircularColor.tsx | 4 +- .../progress/CircularDeterminate.js | 4 +- .../progress/CircularDeterminate.tsx | 4 +- .../progress/CircularIndeterminate.js | 4 +- .../progress/CircularIndeterminate.tsx | 4 +- .../progress/CircularIntegration.js | 14 +- .../progress/CircularIntegration.tsx | 14 +- .../components/progress/CircularUnderLoad.js | 2 +- .../components/progress/CircularUnderLoad.tsx | 2 +- .../progress/CircularWithValueLabel.js | 6 +- .../progress/CircularWithValueLabel.tsx | 6 +- .../progress/CustomizedProgressBars.js | 10 +- .../progress/CustomizedProgressBars.tsx | 10 +- .../components/progress/DelayingAppearance.js | 10 +- .../progress/DelayingAppearance.tsx | 10 +- .../pages/components/progress/LinearBuffer.js | 4 +- .../components/progress/LinearBuffer.tsx | 4 +- .../pages/components/progress/LinearColor.js | 4 +- .../pages/components/progress/LinearColor.tsx | 4 +- .../components/progress/LinearDeterminate.js | 4 +- .../components/progress/LinearDeterminate.tsx | 4 +- .../progress/LinearIndeterminate.js | 4 +- .../progress/LinearIndeterminate.tsx | 4 +- .../progress/LinearWithValueLabel.js | 6 +- .../progress/LinearWithValueLabel.tsx | 8 +- .../radio-buttons/ColorRadioButtons.js | 4 +- .../radio-buttons/ColorRadioButtons.tsx | 4 +- .../ControlledRadioButtonsGroup.js | 10 +- .../ControlledRadioButtonsGroup.tsx | 10 +- .../radio-buttons/CustomizedRadios.js | 12 +- .../radio-buttons/CustomizedRadios.tsx | 12 +- .../components/radio-buttons/ErrorRadios.js | 14 +- .../components/radio-buttons/ErrorRadios.tsx | 14 +- .../FormControlLabelPlacement.js | 10 +- .../FormControlLabelPlacement.tsx | 10 +- .../components/radio-buttons/RadioButtons.js | 2 +- .../components/radio-buttons/RadioButtons.tsx | 2 +- .../radio-buttons/RadioButtonsGroup.js | 10 +- .../radio-buttons/RadioButtonsGroup.tsx | 10 +- .../radio-buttons/RowRadioButtonsGroup.js | 10 +- .../radio-buttons/RowRadioButtonsGroup.tsx | 10 +- .../radio-buttons/SizeRadioButtons.js | 2 +- .../radio-buttons/SizeRadioButtons.tsx | 2 +- .../components/radio-buttons/UseRadioGroup.js | 8 +- .../radio-buttons/UseRadioGroup.tsx | 8 +- .../components/radio-buttons/radio-buttons.md | 2 +- .../pages/components/rating/BasicRating.js | 6 +- .../pages/components/rating/BasicRating.tsx | 6 +- .../components/rating/CustomizedRating.js | 12 +- .../components/rating/CustomizedRating.tsx | 12 +- .../src/pages/components/rating/HalfRating.js | 4 +- .../pages/components/rating/HalfRating.tsx | 4 +- .../pages/components/rating/HoverRating.js | 6 +- .../pages/components/rating/HoverRating.tsx | 6 +- .../components/rating/RadioGroupRating.js | 12 +- .../components/rating/RadioGroupRating.tsx | 12 +- .../src/pages/components/rating/RatingSize.js | 4 +- .../pages/components/rating/RatingSize.tsx | 4 +- .../src/pages/components/rating/TextRating.js | 6 +- .../pages/components/rating/TextRating.tsx | 6 +- .../pages/components/selects/BasicSelect.js | 10 +- .../pages/components/selects/BasicSelect.tsx | 10 +- .../selects/ControlledOpenSelect.js | 10 +- .../selects/ControlledOpenSelect.tsx | 10 +- .../components/selects/CustomizedSelects.js | 14 +- .../components/selects/CustomizedSelects.tsx | 14 +- .../pages/components/selects/DialogSelect.js | 22 +- .../pages/components/selects/DialogSelect.tsx | 22 +- .../pages/components/selects/GroupedSelect.js | 10 +- .../components/selects/GroupedSelect.tsx | 10 +- .../components/selects/MultipleSelect.js | 12 +- .../components/selects/MultipleSelect.tsx | 12 +- .../selects/MultipleSelectCheckmarks.js | 14 +- .../selects/MultipleSelectCheckmarks.tsx | 14 +- .../components/selects/MultipleSelectChip.js | 16 +- .../components/selects/MultipleSelectChip.tsx | 16 +- .../selects/MultipleSelectNative.js | 6 +- .../selects/MultipleSelectNative.tsx | 6 +- .../selects/MultipleSelectPlaceholder.js | 10 +- .../selects/MultipleSelectPlaceholder.tsx | 10 +- .../pages/components/selects/NativeSelect.js | 8 +- .../pages/components/selects/NativeSelect.tsx | 8 +- .../components/selects/SelectAutoWidth.js | 8 +- .../components/selects/SelectAutoWidth.tsx | 8 +- .../pages/components/selects/SelectLabels.js | 10 +- .../pages/components/selects/SelectLabels.tsx | 10 +- .../components/selects/SelectOtherProps.js | 10 +- .../components/selects/SelectOtherProps.tsx | 10 +- .../components/selects/SelectVariants.js | 8 +- .../components/selects/SelectVariants.tsx | 8 +- .../pages/components/skeleton/Animations.js | 4 +- .../pages/components/skeleton/Animations.tsx | 4 +- .../src/pages/components/skeleton/Facebook.js | 18 +- .../pages/components/skeleton/Facebook.tsx | 18 +- .../components/skeleton/SkeletonChildren.js | 12 +- .../components/skeleton/SkeletonChildren.tsx | 12 +- .../components/skeleton/SkeletonColor.js | 4 +- .../components/skeleton/SkeletonColor.tsx | 4 +- .../components/skeleton/SkeletonTypography.js | 6 +- .../skeleton/SkeletonTypography.tsx | 6 +- .../src/pages/components/skeleton/Variants.js | 4 +- .../pages/components/skeleton/Variants.tsx | 4 +- docs/src/pages/components/skeleton/YouTube.js | 8 +- .../src/pages/components/skeleton/YouTube.tsx | 8 +- .../pages/components/slider/ColorSlider.js | 4 +- .../pages/components/slider/ColorSlider.tsx | 4 +- .../components/slider/ContinuousSlider.js | 10 +- .../components/slider/ContinuousSlider.tsx | 10 +- .../components/slider/CustomizedSlider.js | 10 +- .../components/slider/CustomizedSlider.tsx | 10 +- .../pages/components/slider/DiscreteSlider.js | 4 +- .../components/slider/DiscreteSlider.tsx | 4 +- .../components/slider/DiscreteSliderLabel.js | 4 +- .../components/slider/DiscreteSliderLabel.tsx | 4 +- .../components/slider/DiscreteSliderMarks.js | 4 +- .../components/slider/DiscreteSliderMarks.tsx | 4 +- .../components/slider/DiscreteSliderSteps.js | 4 +- .../components/slider/DiscreteSliderSteps.tsx | 4 +- .../components/slider/DiscreteSliderValues.js | 4 +- .../slider/DiscreteSliderValues.tsx | 4 +- .../pages/components/slider/InputSlider.js | 14 +- .../pages/components/slider/InputSlider.tsx | 14 +- .../slider/MinimumDistanceSlider.js | 4 +- .../slider/MinimumDistanceSlider.tsx | 4 +- .../components/slider/MusicPlayerSlider.js | 24 +- .../components/slider/MusicPlayerSlider.tsx | 24 +- .../components/slider/NonLinearSlider.js | 6 +- .../components/slider/NonLinearSlider.tsx | 6 +- .../pages/components/slider/RangeSlider.js | 4 +- .../pages/components/slider/RangeSlider.tsx | 4 +- .../pages/components/slider/SliderSizes.js | 4 +- .../pages/components/slider/SliderSizes.tsx | 4 +- .../components/slider/TrackFalseSlider.js | 8 +- .../components/slider/TrackFalseSlider.tsx | 8 +- .../components/slider/TrackInvertedSlider.js | 8 +- .../components/slider/TrackInvertedSlider.tsx | 8 +- .../pages/components/slider/UnstyledSlider.js | 4 +- .../components/slider/UnstyledSlider.tsx | 4 +- .../slider/VerticalAccessibleSlider.js | 4 +- .../slider/VerticalAccessibleSlider.tsx | 4 +- .../pages/components/slider/VerticalSlider.js | 4 +- .../components/slider/VerticalSlider.tsx | 4 +- docs/src/pages/components/slider/slider.md | 4 +- .../snackbars/ConsecutiveSnackbars.js | 8 +- .../snackbars/ConsecutiveSnackbars.tsx | 8 +- .../snackbars/CustomizedSnackbars.js | 8 +- .../snackbars/CustomizedSnackbars.tsx | 8 +- .../components/snackbars/DirectionSnackbar.js | 6 +- .../snackbars/DirectionSnackbar.tsx | 6 +- .../snackbars/FabIntegrationSnackbar.js | 22 +- .../snackbars/FabIntegrationSnackbar.tsx | 24 +- .../snackbars/IntegrationNotistack.js | 2 +- .../snackbars/IntegrationNotistack.tsx | 2 +- .../components/snackbars/LongTextSnackbar.js | 6 +- .../components/snackbars/LongTextSnackbar.tsx | 6 +- .../snackbars/PositionedSnackbar.js | 4 +- .../snackbars/PositionedSnackbar.tsx | 4 +- .../components/snackbars/SimpleSnackbar.js | 8 +- .../components/snackbars/SimpleSnackbar.tsx | 8 +- .../snackbars/TransitionsSnackbar.js | 10 +- .../snackbars/TransitionsSnackbar.tsx | 12 +- .../components/speed-dial/BasicSpeedDial.js | 16 +- .../components/speed-dial/BasicSpeedDial.tsx | 16 +- .../speed-dial/ControlledOpenSpeedDial.js | 16 +- .../speed-dial/ControlledOpenSpeedDial.tsx | 16 +- .../speed-dial/OpenIconSpeedDial.js | 18 +- .../speed-dial/OpenIconSpeedDial.tsx | 18 +- .../speed-dial/PlaygroundSpeedDial.js | 30 +- .../speed-dial/PlaygroundSpeedDial.tsx | 30 +- .../speed-dial/SpeedDialTooltipOpen.js | 18 +- .../speed-dial/SpeedDialTooltipOpen.tsx | 18 +- docs/src/pages/components/stack/BasicStack.js | 6 +- .../src/pages/components/stack/BasicStack.tsx | 6 +- .../pages/components/stack/DirectionStack.js | 6 +- .../pages/components/stack/DirectionStack.tsx | 6 +- .../pages/components/stack/DividerStack.js | 8 +- .../pages/components/stack/DividerStack.tsx | 8 +- .../components/stack/InteractiveStack.js | 16 +- .../components/stack/InteractiveStack.tsx | 16 +- .../pages/components/stack/ResponsiveStack.js | 6 +- .../components/stack/ResponsiveStack.tsx | 6 +- .../components/steppers/CustomizedSteppers.js | 22 +- .../steppers/CustomizedSteppers.tsx | 24 +- .../components/steppers/DotsMobileStepper.js | 10 +- .../components/steppers/DotsMobileStepper.tsx | 10 +- ...HorizontalLinearAlternativeLabelStepper.js | 8 +- ...orizontalLinearAlternativeLabelStepper.tsx | 8 +- .../steppers/HorizontalLinearStepper.js | 12 +- .../steppers/HorizontalLinearStepper.tsx | 12 +- .../steppers/HorizontalNonLinearStepper.js | 12 +- .../steppers/HorizontalNonLinearStepper.tsx | 12 +- .../steppers/HorizontalStepperWithError.js | 10 +- .../steppers/HorizontalStepperWithError.tsx | 10 +- .../steppers/ProgressMobileStepper.js | 10 +- .../steppers/ProgressMobileStepper.tsx | 10 +- .../steppers/SwipeableTextMobileStepper.js | 16 +- .../steppers/SwipeableTextMobileStepper.tsx | 16 +- .../components/steppers/TextMobileStepper.js | 16 +- .../components/steppers/TextMobileStepper.tsx | 16 +- .../steppers/VerticalLinearStepper.js | 16 +- .../steppers/VerticalLinearStepper.tsx | 16 +- .../components/switches/BasicSwitches.js | 2 +- .../components/switches/BasicSwitches.tsx | 2 +- .../components/switches/ColorSwitches.js | 6 +- .../components/switches/ColorSwitches.tsx | 6 +- .../components/switches/ControlledSwitches.js | 2 +- .../switches/ControlledSwitches.tsx | 2 +- .../components/switches/CustomizedSwitches.js | 12 +- .../switches/CustomizedSwitches.tsx | 12 +- .../switches/FormControlLabelPosition.js | 10 +- .../switches/FormControlLabelPosition.tsx | 10 +- .../pages/components/switches/SwitchLabels.js | 6 +- .../components/switches/SwitchLabels.tsx | 6 +- .../components/switches/SwitchesGroup.js | 12 +- .../components/switches/SwitchesGroup.tsx | 12 +- .../pages/components/switches/SwitchesSize.js | 2 +- .../components/switches/SwitchesSize.tsx | 2 +- .../components/switches/UnstyledSwitches.js | 6 +- .../components/switches/UnstyledSwitches.tsx | 6 +- .../switches/UnstyledSwitchesMaterial.js | 18 +- .../components/switches/UseSwitchesBasic.js | 4 +- .../components/switches/UseSwitchesBasic.tsx | 4 +- .../components/switches/UseSwitchesCustom.js | 4 +- .../components/switches/UseSwitchesCustom.tsx | 4 +- .../switches/UseSwitchesMaterial.js | 21 +- .../src/pages/components/switches/switches.md | 4 +- .../components/tables/AcccessibleTable.js | 14 +- .../components/tables/AcccessibleTable.tsx | 14 +- .../src/pages/components/tables/BasicTable.js | 14 +- .../pages/components/tables/BasicTable.tsx | 14 +- .../components/tables/CollapsibleTable.js | 26 +- .../components/tables/CollapsibleTable.tsx | 26 +- .../components/tables/ColumnGroupingTable.js | 16 +- .../components/tables/ColumnGroupingTable.tsx | 16 +- .../tables/CustomPaginationActionsTable.js | 30 +- .../tables/CustomPaginationActionsTable.tsx | 30 +- .../components/tables/CustomizedTables.js | 16 +- .../components/tables/CustomizedTables.tsx | 16 +- .../src/pages/components/tables/DenseTable.js | 14 +- .../pages/components/tables/DenseTable.tsx | 14 +- .../pages/components/tables/EnhancedTable.js | 42 +- .../pages/components/tables/EnhancedTable.tsx | 42 +- .../tables/ReactVirtualizedTable.js | 8 +- .../tables/ReactVirtualizedTable.tsx | 8 +- .../pages/components/tables/SpanningTable.js | 14 +- .../pages/components/tables/SpanningTable.tsx | 14 +- .../components/tables/StickyHeadTable.js | 16 +- .../components/tables/StickyHeadTable.tsx | 16 +- .../pages/components/tabs/AccessibleTabs1.js | 6 +- .../pages/components/tabs/AccessibleTabs1.tsx | 6 +- .../pages/components/tabs/AccessibleTabs2.js | 6 +- .../pages/components/tabs/AccessibleTabs2.tsx | 6 +- docs/src/pages/components/tabs/BasicTabs.js | 8 +- docs/src/pages/components/tabs/BasicTabs.tsx | 8 +- .../src/pages/components/tabs/CenteredTabs.js | 6 +- .../pages/components/tabs/CenteredTabs.tsx | 6 +- docs/src/pages/components/tabs/ColorTabs.js | 6 +- docs/src/pages/components/tabs/ColorTabs.tsx | 6 +- .../pages/components/tabs/CustomizedTabs.js | 8 +- .../pages/components/tabs/CustomizedTabs.tsx | 8 +- .../src/pages/components/tabs/DisabledTabs.js | 4 +- .../pages/components/tabs/DisabledTabs.tsx | 4 +- .../pages/components/tabs/FullWidthTabs.js | 12 +- .../pages/components/tabs/FullWidthTabs.tsx | 12 +- .../pages/components/tabs/IconLabelTabs.js | 10 +- .../pages/components/tabs/IconLabelTabs.tsx | 10 +- docs/src/pages/components/tabs/IconTabs.js | 10 +- docs/src/pages/components/tabs/IconTabs.tsx | 10 +- docs/src/pages/components/tabs/LabTabs.js | 10 +- docs/src/pages/components/tabs/LabTabs.tsx | 10 +- docs/src/pages/components/tabs/NavTabs.js | 6 +- docs/src/pages/components/tabs/NavTabs.tsx | 6 +- .../tabs/ScrollableTabsButtonAuto.js | 6 +- .../tabs/ScrollableTabsButtonAuto.tsx | 6 +- .../tabs/ScrollableTabsButtonForce.js | 6 +- .../tabs/ScrollableTabsButtonForce.tsx | 6 +- .../tabs/ScrollableTabsButtonPrevent.js | 6 +- .../tabs/ScrollableTabsButtonPrevent.tsx | 6 +- .../tabs/ScrollableTabsButtonVisible.js | 6 +- .../tabs/ScrollableTabsButtonVisible.tsx | 6 +- .../pages/components/tabs/TabsWrappedLabel.js | 6 +- .../components/tabs/TabsWrappedLabel.tsx | 6 +- .../src/pages/components/tabs/VerticalTabs.js | 8 +- .../pages/components/tabs/VerticalTabs.tsx | 8 +- docs/src/pages/components/tabs/tabs.md | 4 +- .../components/text-fields/BasicTextFields.js | 4 +- .../text-fields/BasicTextFields.tsx | 4 +- .../components/text-fields/ColorTextFields.js | 4 +- .../text-fields/ColorTextFields.tsx | 4 +- .../text-fields/ComposedTextField.js | 14 +- .../text-fields/ComposedTextField.tsx | 14 +- .../text-fields/CustomizedInputBase.js | 14 +- .../text-fields/CustomizedInputBase.tsx | 14 +- .../text-fields/CustomizedInputs.js | 12 +- .../text-fields/CustomizedInputs.tsx | 14 +- .../text-fields/FormPropsTextFields.js | 4 +- .../text-fields/FormPropsTextFields.tsx | 4 +- .../components/text-fields/FormattedInputs.js | 10 +- .../text-fields/FormattedInputs.tsx | 10 +- .../text-fields/FullWidthTextField.js | 4 +- .../text-fields/FullWidthTextField.tsx | 4 +- .../text-fields/HelperTextAligned.js | 4 +- .../text-fields/HelperTextAligned.tsx | 4 +- .../text-fields/HelperTextMisaligned.js | 4 +- .../text-fields/HelperTextMisaligned.tsx | 4 +- .../components/text-fields/InputAdornments.js | 24 +- .../text-fields/InputAdornments.tsx | 24 +- .../components/text-fields/InputWithIcon.js | 14 +- .../components/text-fields/InputWithIcon.tsx | 14 +- .../pages/components/text-fields/Inputs.js | 4 +- .../pages/components/text-fields/Inputs.tsx | 4 +- .../text-fields/LayoutTextFields.js | 4 +- .../text-fields/LayoutTextFields.tsx | 4 +- .../text-fields/MultilineTextFields.js | 4 +- .../text-fields/MultilineTextFields.tsx | 4 +- .../text-fields/SelectTextFields.js | 6 +- .../text-fields/SelectTextFields.tsx | 6 +- .../components/text-fields/StateTextFields.js | 4 +- .../text-fields/StateTextFields.tsx | 4 +- .../text-fields/TextFieldHiddenLabel.js | 4 +- .../text-fields/TextFieldHiddenLabel.tsx | 4 +- .../components/text-fields/TextFieldSizes.js | 4 +- .../components/text-fields/TextFieldSizes.tsx | 4 +- .../components/text-fields/UseFormControl.js | 8 +- .../components/text-fields/UseFormControl.tsx | 8 +- .../text-fields/ValidationTextFields.js | 4 +- .../text-fields/ValidationTextFields.tsx | 4 +- .../components/text-fields/text-fields.md | 2 +- .../textarea-autosize/EmptyTextarea.js | 2 +- .../textarea-autosize/EmptyTextarea.tsx | 2 +- .../textarea-autosize/MaxHeightTextarea.js | 2 +- .../textarea-autosize/MaxHeightTextarea.tsx | 2 +- .../textarea-autosize/MinHeightTextarea.js | 2 +- .../textarea-autosize/MinHeightTextarea.tsx | 2 +- .../components/time-picker/BasicTimePicker.js | 8 +- .../time-picker/BasicTimePicker.tsx | 8 +- .../time-picker/FormPropsTimePickers.js | 10 +- .../time-picker/FormPropsTimePickers.tsx | 10 +- .../time-picker/LocalizedTimePicker.js | 12 +- .../time-picker/LocalizedTimePicker.tsx | 12 +- .../time-picker/ResponsiveTimePickers.js | 14 +- .../time-picker/ResponsiveTimePickers.tsx | 14 +- .../time-picker/SecondsTimePicker.js | 10 +- .../time-picker/SecondsTimePicker.tsx | 10 +- .../time-picker/StaticTimePickerDemo.js | 8 +- .../time-picker/StaticTimePickerDemo.tsx | 8 +- .../time-picker/StaticTimePickerLandscape.js | 8 +- .../time-picker/StaticTimePickerLandscape.tsx | 8 +- .../time-picker/SubComponentsTimePickers.js | 6 +- .../time-picker/SubComponentsTimePickers.tsx | 6 +- .../time-picker/TimeValidationTimePicker.js | 10 +- .../time-picker/TimeValidationTimePicker.tsx | 10 +- .../components/time-picker/time-picker.md | 8 +- .../components/timeline/AlternateTimeline.js | 12 +- .../components/timeline/AlternateTimeline.tsx | 12 +- .../components/timeline/BasicTimeline.js | 12 +- .../components/timeline/BasicTimeline.tsx | 12 +- .../components/timeline/ColorsTimeline.js | 12 +- .../components/timeline/ColorsTimeline.tsx | 12 +- .../components/timeline/CustomizedTimeline.js | 24 +- .../timeline/CustomizedTimeline.tsx | 24 +- .../timeline/LeftPositionedTimeline.js | 12 +- .../timeline/LeftPositionedTimeline.tsx | 12 +- .../timeline/OppositeContentTimeline.js | 14 +- .../timeline/OppositeContentTimeline.tsx | 14 +- .../components/timeline/OutlinedTimeline.js | 12 +- .../components/timeline/OutlinedTimeline.tsx | 12 +- .../src/pages/components/timeline/timeline.md | 2 +- .../toggle-button/ColorToggleButton.js | 4 +- .../toggle-button/ColorToggleButton.tsx | 4 +- .../toggle-button/CustomizedDividers.js | 28 +- .../toggle-button/CustomizedDividers.tsx | 28 +- .../toggle-button/StandaloneToggleButton.js | 4 +- .../toggle-button/StandaloneToggleButton.tsx | 4 +- .../toggle-button/ToggleButtonNotEmpty.js | 18 +- .../toggle-button/ToggleButtonNotEmpty.tsx | 18 +- .../toggle-button/ToggleButtonSizes.js | 14 +- .../toggle-button/ToggleButtonSizes.tsx | 14 +- .../components/toggle-button/ToggleButtons.js | 12 +- .../toggle-button/ToggleButtons.tsx | 12 +- .../toggle-button/ToggleButtonsMultiple.js | 14 +- .../toggle-button/ToggleButtonsMultiple.tsx | 14 +- .../toggle-button/VerticalToggleButtons.js | 10 +- .../toggle-button/VerticalToggleButtons.tsx | 10 +- .../tooltips/AccessibilityTooltips.js | 8 +- .../tooltips/AccessibilityTooltips.tsx | 8 +- .../components/tooltips/AnchorElTooltips.js | 4 +- .../components/tooltips/AnchorElTooltips.tsx | 4 +- .../components/tooltips/ArrowTooltips.js | 4 +- .../components/tooltips/ArrowTooltips.tsx | 4 +- .../pages/components/tooltips/BasicTooltip.js | 6 +- .../components/tooltips/BasicTooltip.tsx | 6 +- .../components/tooltips/ControlledTooltips.js | 4 +- .../tooltips/ControlledTooltips.tsx | 4 +- .../components/tooltips/CustomizedTooltips.js | 8 +- .../tooltips/CustomizedTooltips.tsx | 8 +- .../components/tooltips/DelayTooltips.js | 4 +- .../components/tooltips/DelayTooltips.tsx | 4 +- .../components/tooltips/DisabledTooltips.js | 4 +- .../components/tooltips/DisabledTooltips.tsx | 4 +- .../tooltips/FollowCursorTooltips.js | 4 +- .../tooltips/FollowCursorTooltips.tsx | 4 +- .../tooltips/NonInteractiveTooltips.js | 4 +- .../tooltips/NonInteractiveTooltips.tsx | 4 +- .../components/tooltips/PositionedTooltips.js | 8 +- .../tooltips/PositionedTooltips.tsx | 8 +- .../tooltips/TransitionsTooltips.js | 8 +- .../tooltips/TransitionsTooltips.tsx | 8 +- .../components/tooltips/TriggersTooltips.js | 8 +- .../components/tooltips/TriggersTooltips.tsx | 8 +- .../components/tooltips/VariableWidth.js | 6 +- .../components/tooltips/VariableWidth.tsx | 6 +- .../transfer-list/SelectAllTransferList.js | 20 +- .../transfer-list/SelectAllTransferList.tsx | 20 +- .../components/transfer-list/TransferList.js | 16 +- .../components/transfer-list/TransferList.tsx | 16 +- .../components/transitions/SimpleCollapse.js | 10 +- .../components/transitions/SimpleCollapse.tsx | 10 +- .../components/transitions/SimpleFade.js | 10 +- .../components/transitions/SimpleFade.tsx | 10 +- .../components/transitions/SimpleGrow.js | 10 +- .../components/transitions/SimpleGrow.tsx | 10 +- .../components/transitions/SimpleSlide.js | 10 +- .../components/transitions/SimpleSlide.tsx | 10 +- .../components/transitions/SimpleZoom.js | 10 +- .../components/transitions/SimpleZoom.tsx | 10 +- .../transitions/SlideFromContainer.js | 10 +- .../transitions/SlideFromContainer.tsx | 10 +- .../transitions/TransitionGroupExample.js | 16 +- .../transitions/TransitionGroupExample.tsx | 16 +- .../components/trap-focus/BasicTrapFocus.js | 4 +- .../components/trap-focus/BasicTrapFocus.tsx | 4 +- .../trap-focus/DisableEnforceFocus.js | 4 +- .../trap-focus/DisableEnforceFocus.tsx | 4 +- .../components/trap-focus/LazyTrapFocus.js | 4 +- .../components/trap-focus/LazyTrapFocus.tsx | 4 +- .../components/trap-focus/PortalTrapFocus.js | 6 +- .../components/trap-focus/PortalTrapFocus.tsx | 6 +- .../pages/components/trap-focus/trap-focus.md | 4 +- .../pages/components/tree-view/BarTreeView.js | 12 +- .../components/tree-view/BarTreeView.tsx | 12 +- .../tree-view/ControlledTreeView.js | 12 +- .../tree-view/ControlledTreeView.tsx | 12 +- .../tree-view/CustomizedTreeView.js | 10 +- .../tree-view/CustomizedTreeView.tsx | 12 +- .../components/tree-view/DisabledTreeItems.js | 14 +- .../tree-view/DisabledTreeItems.tsx | 14 +- .../tree-view/FileSystemNavigator.js | 8 +- .../tree-view/FileSystemNavigator.tsx | 8 +- .../components/tree-view/GmailTreeView.js | 28 +- .../components/tree-view/GmailTreeView.tsx | 30 +- .../tree-view/IconExpansionTreeView.js | 10 +- .../tree-view/IconExpansionTreeView.tsx | 10 +- .../tree-view/MultiSelectTreeView.js | 8 +- .../tree-view/MultiSelectTreeView.tsx | 8 +- .../tree-view/RichObjectTreeView.js | 8 +- .../tree-view/RichObjectTreeView.tsx | 8 +- .../pages/components/tree-view/tree-view.md | 2 +- docs/src/pages/components/typography/Types.js | 4 +- .../src/pages/components/typography/Types.tsx | 4 +- .../components/typography/TypographyTheme.js | 2 +- .../components/typography/TypographyTheme.tsx | 2 +- .../use-media-query/JavaScriptMedia.js | 2 +- .../use-media-query/JavaScriptMedia.tsx | 2 +- .../components/use-media-query/ServerSide.js | 4 +- .../components/use-media-query/ServerSide.tsx | 4 +- .../use-media-query/SimpleMediaQuery.js | 2 +- .../use-media-query/SimpleMediaQuery.tsx | 2 +- .../components/use-media-query/ThemeHelper.js | 4 +- .../use-media-query/ThemeHelper.tsx | 4 +- .../components/use-media-query/UseWidth.js | 4 +- .../components/use-media-query/UseWidth.tsx | 4 +- .../use-media-query/use-media-query.md | 10 +- .../customization/breakpoints/MediaQuery.js | 6 +- .../customization/breakpoints/MediaQuery.tsx | 6 +- .../customization/breakpoints/breakpoints.md | 2 +- docs/src/pages/customization/color/Color.js | 6 +- .../pages/customization/color/ColorDemo.js | 18 +- .../pages/customization/color/ColorTool.js | 24 +- docs/src/pages/customization/color/color.md | 10 +- .../default-theme/DefaultTheme.js | 16 +- .../customization/density/DensityTool.js | 20 +- .../how-to-customize/DevTools.js | 2 +- .../how-to-customize/DevTools.tsx | 2 +- .../how-to-customize/DynamicCSS.js | 8 +- .../how-to-customize/DynamicCSS.tsx | 8 +- .../how-to-customize/DynamicCSSVariables.js | 8 +- .../how-to-customize/DynamicCSSVariables.tsx | 8 +- .../how-to-customize/DynamicThemeNesting.js | 10 +- .../how-to-customize/DynamicThemeNesting.tsx | 10 +- .../how-to-customize/GlobalCssOverride.js | 2 +- .../how-to-customize/GlobalCssOverride.tsx | 2 +- .../how-to-customize/OverrideCssBaseline.js | 4 +- .../how-to-customize/OverrideCssBaseline.tsx | 4 +- .../how-to-customize/StyledCustomization.js | 4 +- .../how-to-customize/StyledCustomization.tsx | 4 +- .../customization/how-to-customize/SxProp.js | 2 +- .../customization/how-to-customize/SxProp.tsx | 2 +- .../how-to-customize/how-to-customize.md | 4 +- .../customization/palette/CustomColor.js | 4 +- .../customization/palette/CustomColor.tsx | 8 +- .../pages/customization/palette/DarkTheme.js | 13 +- .../pages/customization/palette/Intentions.js | 8 +- .../pages/customization/palette/Palette.js | 6 +- .../pages/customization/palette/Palette.tsx | 6 +- .../customization/palette/ToggleColorMode.js | 10 +- .../customization/palette/ToggleColorMode.tsx | 10 +- .../pages/customization/palette/palette.md | 16 +- .../theme-components/DefaultProps.js | 4 +- .../theme-components/DefaultProps.tsx | 4 +- .../theme-components/GlobalCss.js | 4 +- .../theme-components/GlobalCss.tsx | 4 +- .../theme-components/GlobalThemeOverride.js | 4 +- .../theme-components/GlobalThemeOverride.tsx | 4 +- .../theme-components/GlobalThemeVariants.js | 4 +- .../theme-components/GlobalThemeVariants.tsx | 6 +- .../theme-components/ThemeVariables.js | 4 +- .../theme-components/ThemeVariables.tsx | 4 +- .../theme-components/theme-components.md | 2 +- .../customization/theming/CustomStyles.js | 6 +- .../customization/theming/CustomStyles.tsx | 8 +- .../customization/theming/ThemeNesting.js | 6 +- .../customization/theming/ThemeNesting.tsx | 6 +- .../theming/ThemeNestingExtend.js | 6 +- .../theming/ThemeNestingExtend.tsx | 6 +- .../pages/customization/theming/theming.md | 10 +- .../transitions/TransitionHover.js | 8 +- .../transitions/TransitionHover.tsx | 8 +- .../typography/CustomResponsiveFontSizes.js | 4 +- .../typography/CustomResponsiveFontSizes.tsx | 4 +- .../customization/typography/FontSizeTheme.js | 4 +- .../typography/FontSizeTheme.tsx | 4 +- .../typography/ResponsiveFontSizes.js | 4 +- .../typography/ResponsiveFontSizes.tsx | 4 +- .../typography/ResponsiveFontSizesChart.js | 6 +- .../typography/TypographyCustomVariant.js | 6 +- .../typography/TypographyCustomVariant.tsx | 6 +- .../typography/TypographyVariants.js | 6 +- .../typography/TypographyVariants.tsx | 6 +- .../customization/typography/typography.md | 6 +- .../unstyled-components/StylingCustomCss.js | 4 +- .../unstyled-components/StylingCustomCss.tsx | 4 +- .../unstyled-components/StylingHooks.js | 4 +- .../unstyled-components/StylingHooks.tsx | 4 +- .../unstyled-components/StylingSlots.js | 6 +- .../unstyled-components/StylingSlots.tsx | 6 +- .../unstyled-components.md | 2 +- .../discover-more/languages/Languages.js | 14 +- .../related-projects/related-projects.md | 2 +- .../pages/discover-more/roadmap/roadmap.md | 2 +- .../pages/discover-more/showcase/Showcase.js | 20 +- docs/src/pages/discover-more/team/Team.js | 18 +- docs/src/pages/getting-started/faq/faq.md | 42 +- .../installation/installation.md | 22 +- .../getting-started/templates/Templates.js | 14 +- .../getting-started/templates/album/Album.js | 30 +- .../getting-started/templates/album/Album.tsx | 30 +- .../getting-started/templates/blog/Blog.js | 12 +- .../getting-started/templates/blog/Blog.tsx | 12 +- .../templates/blog/FeaturedPost.js | 12 +- .../templates/blog/FeaturedPost.tsx | 12 +- .../getting-started/templates/blog/Footer.js | 8 +- .../getting-started/templates/blog/Footer.tsx | 8 +- .../getting-started/templates/blog/Header.js | 12 +- .../getting-started/templates/blog/Header.tsx | 12 +- .../getting-started/templates/blog/Main.js | 6 +- .../getting-started/templates/blog/Main.tsx | 6 +- .../templates/blog/MainFeaturedPost.js | 10 +- .../templates/blog/MainFeaturedPost.tsx | 10 +- .../templates/blog/Markdown.js | 6 +- .../templates/blog/Markdown.tsx | 6 +- .../getting-started/templates/blog/Sidebar.js | 10 +- .../templates/blog/Sidebar.tsx | 10 +- .../templates/checkout/AddressForm.js | 10 +- .../templates/checkout/AddressForm.tsx | 10 +- .../templates/checkout/Checkout.js | 24 +- .../templates/checkout/Checkout.tsx | 24 +- .../templates/checkout/PaymentForm.js | 10 +- .../templates/checkout/PaymentForm.tsx | 10 +- .../templates/checkout/Review.js | 10 +- .../templates/checkout/Review.tsx | 10 +- .../templates/dashboard/Chart.js | 2 +- .../templates/dashboard/Chart.tsx | 2 +- .../templates/dashboard/Dashboard.js | 36 +- .../templates/dashboard/Dashboard.tsx | 36 +- .../templates/dashboard/Deposits.js | 4 +- .../templates/dashboard/Deposits.tsx | 4 +- .../templates/dashboard/Orders.js | 12 +- .../templates/dashboard/Orders.tsx | 12 +- .../templates/dashboard/Title.js | 2 +- .../templates/dashboard/Title.tsx | 2 +- .../templates/dashboard/listItems.js | 20 +- .../templates/dashboard/listItems.tsx | 20 +- .../templates/pricing/Pricing.js | 30 +- .../templates/pricing/Pricing.tsx | 30 +- .../templates/sign-in-side/SignInSide.js | 24 +- .../templates/sign-in-side/SignInSide.tsx | 24 +- .../templates/sign-in/SignIn.js | 24 +- .../templates/sign-in/SignIn.tsx | 24 +- .../templates/sign-up/SignUp.js | 24 +- .../templates/sign-up/SignUp.tsx | 24 +- .../templates/sticky-footer/StickyFooter.js | 10 +- .../templates/sticky-footer/StickyFooter.tsx | 10 +- docs/src/pages/getting-started/usage/usage.md | 2 +- .../pages/guides/composition/Composition.js | 4 +- .../pages/guides/composition/Composition.tsx | 4 +- .../guides/interoperability/EmotionCSS.js | 4 +- .../guides/interoperability/EmotionCSS.tsx | 4 +- .../interoperability/StyledComponents.js | 6 +- .../interoperability/StyledComponents.tsx | 6 +- .../interoperability/StyledComponentsDeep.js | 6 +- .../interoperability/StyledComponentsDeep.tsx | 6 +- .../StyledComponentsPortal.js | 6 +- .../StyledComponentsPortal.tsx | 6 +- .../interoperability/StyledComponentsTheme.js | 11 +- .../StyledComponentsTheme.tsx | 11 +- .../interoperability/interoperability.md | 44 +- docs/src/pages/guides/localization/Locales.js | 12 +- .../src/pages/guides/localization/Locales.tsx | 12 +- .../pages/guides/localization/localization.md | 4 +- .../guides/migration-v0x/migration-v0x.md | 26 +- .../pages/guides/migration-v3/migration-v3.md | 38 +- .../pages/guides/migration-v4/migration-v4.md | 314 ++++---- .../minimizing-bundle-size.md | 46 +- .../pickers-migration/pickers-migration.md | 14 +- .../pages/guides/right-to-left/Direction.js | 4 +- .../pages/guides/right-to-left/Direction.tsx | 4 +- .../guides/right-to-left/RtlOptOutStylis.js | 6 +- .../guides/right-to-left/RtlOptOutStylis.tsx | 6 +- .../guides/right-to-left/right-to-left.md | 4 +- docs/src/pages/guides/routing/ButtonDemo.js | 2 +- docs/src/pages/guides/routing/ButtonDemo.tsx | 2 +- docs/src/pages/guides/routing/ButtonRouter.js | 2 +- .../src/pages/guides/routing/ButtonRouter.tsx | 2 +- docs/src/pages/guides/routing/LinkDemo.js | 4 +- docs/src/pages/guides/routing/LinkDemo.tsx | 4 +- docs/src/pages/guides/routing/LinkRouter.js | 4 +- docs/src/pages/guides/routing/LinkRouter.tsx | 4 +- .../guides/routing/LinkRouterWithTheme.js | 8 +- .../guides/routing/LinkRouterWithTheme.tsx | 8 +- docs/src/pages/guides/routing/ListRouter.js | 20 +- docs/src/pages/guides/routing/ListRouter.tsx | 20 +- docs/src/pages/guides/routing/TabsRouter.js | 8 +- docs/src/pages/guides/routing/TabsRouter.tsx | 8 +- docs/src/pages/guides/routing/routing.md | 2 +- .../server-rendering/server-rendering.md | 12 +- .../guides/styled-engine/styled-engine.md | 16 +- docs/src/pages/landing/Pro.js | 2 +- docs/src/pages/landing/QuickWord.js | 4 +- docs/src/pages/landing/Quotes.js | 22 +- docs/src/pages/landing/Sponsors.js | 10 +- docs/src/pages/landing/Steps.js | 22 +- docs/src/pages/landing/Themes.js | 14 +- docs/src/pages/landing/Users.js | 14 +- .../onepirate/ForgotPassword.js | 2 +- .../onepirate/ForgotPassword.tsx | 2 +- .../pages/premium-themes/onepirate/Privacy.js | 4 +- .../premium-themes/onepirate/Privacy.tsx | 4 +- .../pages/premium-themes/onepirate/SignIn.js | 4 +- .../pages/premium-themes/onepirate/SignIn.tsx | 4 +- .../pages/premium-themes/onepirate/SignUp.js | 6 +- .../pages/premium-themes/onepirate/SignUp.tsx | 6 +- .../pages/premium-themes/onepirate/Terms.js | 4 +- .../pages/premium-themes/onepirate/Terms.tsx | 4 +- .../onepirate/modules/components/AppBar.js | 2 +- .../onepirate/modules/components/AppBar.tsx | 2 +- .../onepirate/modules/components/Button.js | 4 +- .../onepirate/modules/components/Button.tsx | 4 +- .../onepirate/modules/components/Markdown.js | 6 +- .../onepirate/modules/components/Markdown.tsx | 8 +- .../onepirate/modules/components/Paper.js | 4 +- .../onepirate/modules/components/Paper.tsx | 4 +- .../onepirate/modules/components/Snackbar.js | 12 +- .../onepirate/modules/components/Snackbar.tsx | 16 +- .../onepirate/modules/components/TextField.js | 4 +- .../modules/components/TextField.tsx | 4 +- .../onepirate/modules/components/Toolbar.js | 4 +- .../onepirate/modules/components/Toolbar.tsx | 4 +- .../modules/components/Typography.js | 4 +- .../modules/components/Typography.tsx | 6 +- .../onepirate/modules/form/FormButton.tsx | 2 +- .../onepirate/modules/form/FormFeedback.js | 4 +- .../onepirate/modules/form/FormFeedback.tsx | 4 +- .../premium-themes/onepirate/modules/theme.js | 4 +- .../premium-themes/onepirate/modules/theme.ts | 4 +- .../onepirate/modules/views/AppAppBar.js | 4 +- .../onepirate/modules/views/AppAppBar.tsx | 4 +- .../onepirate/modules/views/AppFooter.js | 8 +- .../onepirate/modules/views/AppFooter.tsx | 8 +- .../onepirate/modules/views/AppForm.js | 4 +- .../onepirate/modules/views/AppForm.tsx | 4 +- .../onepirate/modules/views/ProductCTA.js | 6 +- .../onepirate/modules/views/ProductCTA.tsx | 6 +- .../modules/views/ProductCategories.js | 8 +- .../modules/views/ProductCategories.tsx | 8 +- .../modules/views/ProductHeroLayout.js | 6 +- .../modules/views/ProductHeroLayout.tsx | 8 +- .../modules/views/ProductHowItWorks.js | 6 +- .../modules/views/ProductHowItWorks.tsx | 10 +- .../modules/views/ProductSmokingHero.js | 6 +- .../modules/views/ProductSmokingHero.tsx | 6 +- .../onepirate/modules/views/ProductValues.js | 6 +- .../onepirate/modules/views/ProductValues.tsx | 10 +- .../onepirate/modules/withRoot.js | 4 +- .../onepirate/modules/withRoot.tsx | 4 +- .../pages/premium-themes/paperbase/Content.js | 22 +- .../premium-themes/paperbase/Content.tsx | 22 +- .../pages/premium-themes/paperbase/Header.js | 28 +- .../pages/premium-themes/paperbase/Header.tsx | 28 +- .../premium-themes/paperbase/Navigator.js | 36 +- .../premium-themes/paperbase/Navigator.tsx | 36 +- .../premium-themes/paperbase/Paperbase.js | 12 +- .../premium-themes/paperbase/Paperbase.tsx | 12 +- .../pages/production-error/ErrorDecoder.js | 8 +- docs/src/pages/styles/advanced/GlobalCss.js | 2 +- docs/src/pages/styles/advanced/GlobalCss.tsx | 2 +- .../pages/styles/advanced/HybridGlobalCss.js | 2 +- .../pages/styles/advanced/HybridGlobalCss.tsx | 2 +- .../pages/styles/advanced/StringTemplates.js | 2 +- .../src/pages/styles/advanced/ThemeNesting.js | 2 +- .../pages/styles/advanced/ThemeNesting.tsx | 2 +- docs/src/pages/styles/advanced/Theming.js | 2 +- docs/src/pages/styles/advanced/Theming.tsx | 2 +- docs/src/pages/styles/advanced/UseTheme.js | 2 +- docs/src/pages/styles/advanced/UseTheme.tsx | 2 +- docs/src/pages/styles/advanced/WithTheme.js | 2 +- docs/src/pages/styles/advanced/WithTheme.tsx | 6 +- docs/src/pages/styles/advanced/advanced.md | 32 +- docs/src/pages/styles/api/api.md | 28 +- docs/src/pages/styles/basics/AdaptingHOC.js | 4 +- docs/src/pages/styles/basics/AdaptingHOC.tsx | 4 +- docs/src/pages/styles/basics/AdaptingHook.js | 4 +- docs/src/pages/styles/basics/AdaptingHook.tsx | 4 +- .../styles/basics/AdaptingStyledComponents.js | 4 +- .../basics/AdaptingStyledComponents.tsx | 4 +- .../styles/basics/HigherOrderComponent.js | 4 +- .../styles/basics/HigherOrderComponent.tsx | 4 +- docs/src/pages/styles/basics/Hook.js | 4 +- docs/src/pages/styles/basics/Hook.tsx | 4 +- .../pages/styles/basics/NestedStylesHook.js | 2 +- .../pages/styles/basics/NestedStylesHook.tsx | 2 +- docs/src/pages/styles/basics/StressTest.js | 2 +- docs/src/pages/styles/basics/StressTest.tsx | 2 +- .../pages/styles/basics/StyledComponents.js | 4 +- .../pages/styles/basics/StyledComponents.tsx | 4 +- docs/src/pages/styles/basics/basics.md | 36 +- .../src/pages/styles/typescript/typescript.md | 2 +- .../advanced/CombiningStyleFunctionsDemo.js | 4 +- .../advanced/CombiningStyleFunctionsDemo.tsx | 4 +- .../system/advanced/StyleFunctionSxDemo.js | 6 +- .../system/advanced/StyleFunctionSxDemo.tsx | 6 +- docs/src/pages/system/advanced/advanced.md | 2 +- .../pages/system/basics/BreakpointsAsArray.js | 2 +- .../system/basics/BreakpointsAsArray.tsx | 2 +- .../system/basics/BreakpointsAsObject.js | 2 +- .../system/basics/BreakpointsAsObject.tsx | 2 +- docs/src/pages/system/basics/Demo.js | 6 +- docs/src/pages/system/basics/Demo.tsx | 6 +- .../pages/system/basics/ValueAsFunction.js | 2 +- .../pages/system/basics/ValueAsFunction.tsx | 4 +- docs/src/pages/system/basics/Why.js | 4 +- docs/src/pages/system/basics/Why.tsx | 4 +- docs/src/pages/system/basics/basics.md | 20 +- .../pages/system/borders/BorderAdditive.js | 2 +- .../pages/system/borders/BorderAdditive.tsx | 2 +- docs/src/pages/system/borders/BorderColor.js | 2 +- docs/src/pages/system/borders/BorderColor.tsx | 2 +- docs/src/pages/system/borders/BorderRadius.js | 2 +- .../src/pages/system/borders/BorderRadius.tsx | 2 +- .../pages/system/borders/BorderSubtractive.js | 2 +- .../system/borders/BorderSubtractive.tsx | 2 +- docs/src/pages/system/borders/borders.md | 2 +- docs/src/pages/system/box/BoxComponent.js | 4 +- docs/src/pages/system/box/BoxComponent.tsx | 4 +- docs/src/pages/system/box/BoxSx.js | 2 +- docs/src/pages/system/box/BoxSx.tsx | 2 +- docs/src/pages/system/box/box.md | 6 +- docs/src/pages/system/display/Block.js | 2 +- docs/src/pages/system/display/Block.tsx | 2 +- docs/src/pages/system/display/Hiding.js | 2 +- docs/src/pages/system/display/Hiding.tsx | 2 +- docs/src/pages/system/display/Inline.js | 2 +- docs/src/pages/system/display/Inline.tsx | 2 +- docs/src/pages/system/display/Overflow.js | 2 +- docs/src/pages/system/display/Overflow.tsx | 2 +- docs/src/pages/system/display/Print.js | 2 +- docs/src/pages/system/display/Print.tsx | 2 +- docs/src/pages/system/display/TextOverflow.js | 2 +- .../src/pages/system/display/TextOverflow.tsx | 2 +- docs/src/pages/system/display/Visibility.js | 2 +- docs/src/pages/system/display/Visibility.tsx | 2 +- docs/src/pages/system/display/WhiteSpace.js | 2 +- docs/src/pages/system/display/WhiteSpace.tsx | 2 +- docs/src/pages/system/display/display.md | 2 +- docs/src/pages/system/flexbox/AlignContent.js | 2 +- .../src/pages/system/flexbox/AlignContent.tsx | 2 +- docs/src/pages/system/flexbox/AlignItems.js | 2 +- docs/src/pages/system/flexbox/AlignItems.tsx | 2 +- docs/src/pages/system/flexbox/AlignSelf.js | 2 +- docs/src/pages/system/flexbox/AlignSelf.tsx | 2 +- docs/src/pages/system/flexbox/Display.js | 2 +- docs/src/pages/system/flexbox/Display.tsx | 2 +- .../src/pages/system/flexbox/FlexDirection.js | 2 +- .../pages/system/flexbox/FlexDirection.tsx | 2 +- docs/src/pages/system/flexbox/FlexGrow.js | 2 +- docs/src/pages/system/flexbox/FlexGrow.tsx | 2 +- docs/src/pages/system/flexbox/FlexShrink.js | 2 +- docs/src/pages/system/flexbox/FlexShrink.tsx | 2 +- docs/src/pages/system/flexbox/FlexWrap.js | 2 +- docs/src/pages/system/flexbox/FlexWrap.tsx | 2 +- .../pages/system/flexbox/JustifyContent.js | 2 +- .../pages/system/flexbox/JustifyContent.tsx | 2 +- docs/src/pages/system/flexbox/Order.js | 2 +- docs/src/pages/system/flexbox/Order.tsx | 2 +- docs/src/pages/system/flexbox/flexbox.md | 2 +- docs/src/pages/system/grid/Display.js | 2 +- docs/src/pages/system/grid/Display.tsx | 2 +- docs/src/pages/system/grid/Gap.js | 2 +- docs/src/pages/system/grid/Gap.tsx | 2 +- docs/src/pages/system/grid/GridAutoColumns.js | 2 +- .../src/pages/system/grid/GridAutoColumns.tsx | 2 +- docs/src/pages/system/grid/GridAutoFlow.js | 2 +- docs/src/pages/system/grid/GridAutoFlow.tsx | 2 +- docs/src/pages/system/grid/GridAutoRows.js | 2 +- docs/src/pages/system/grid/GridAutoRows.tsx | 2 +- .../pages/system/grid/GridTemplateAreas.js | 2 +- .../pages/system/grid/GridTemplateAreas.tsx | 2 +- .../pages/system/grid/GridTemplateColumns.js | 2 +- .../pages/system/grid/GridTemplateColumns.tsx | 2 +- .../src/pages/system/grid/GridTemplateRows.js | 2 +- .../pages/system/grid/GridTemplateRows.tsx | 2 +- docs/src/pages/system/grid/RowAndColumnGap.js | 2 +- .../src/pages/system/grid/RowAndColumnGap.tsx | 2 +- docs/src/pages/system/grid/grid.md | 2 +- .../pages/system/palette/BackgroundColor.js | 4 +- .../pages/system/palette/BackgroundColor.tsx | 4 +- docs/src/pages/system/palette/Color.js | 4 +- docs/src/pages/system/palette/Color.tsx | 4 +- docs/src/pages/system/palette/palette.md | 2 +- docs/src/pages/system/positions/ZIndex.js | 4 +- docs/src/pages/system/positions/ZIndex.tsx | 4 +- docs/src/pages/system/positions/positions.md | 2 +- .../src/pages/system/properties/properties.md | 2 +- .../screen-readers/VisuallyHiddenUsage.js | 6 +- .../screen-readers/VisuallyHiddenUsage.tsx | 6 +- .../system/screen-readers/screen-readers.md | 2 +- docs/src/pages/system/shadows/Demo.js | 4 +- docs/src/pages/system/shadows/Demo.tsx | 4 +- docs/src/pages/system/shadows/shadows.md | 2 +- docs/src/pages/system/sizing/Height.js | 2 +- docs/src/pages/system/sizing/Height.tsx | 2 +- docs/src/pages/system/sizing/Values.js | 2 +- docs/src/pages/system/sizing/Values.tsx | 2 +- docs/src/pages/system/sizing/Width.js | 2 +- docs/src/pages/system/sizing/Width.tsx | 2 +- docs/src/pages/system/sizing/sizing.md | 2 +- docs/src/pages/system/spacing/Demo.js | 2 +- docs/src/pages/system/spacing/Demo.tsx | 2 +- .../system/spacing/HorizontalCentering.js | 2 +- .../system/spacing/HorizontalCentering.tsx | 2 +- docs/src/pages/system/spacing/spacing.md | 2 +- docs/src/pages/system/styled/BasicUsage.js | 2 +- docs/src/pages/system/styled/BasicUsage.tsx | 2 +- docs/src/pages/system/styled/ThemeUsage.js | 2 +- docs/src/pages/system/styled/ThemeUsage.tsx | 2 +- docs/src/pages/system/styled/UsingOptions.js | 2 +- docs/src/pages/system/styled/UsingOptions.tsx | 2 +- docs/src/pages/system/styled/styled.md | 6 +- docs/src/pages/system/the-sx-prop/Example.js | 4 +- docs/src/pages/system/the-sx-prop/Example.tsx | 4 +- .../pages/system/the-sx-prop/the-sx-prop.md | 2 +- .../src/pages/system/typography/FontFamily.js | 4 +- .../pages/system/typography/FontFamily.tsx | 4 +- docs/src/pages/system/typography/FontSize.js | 4 +- docs/src/pages/system/typography/FontSize.tsx | 4 +- docs/src/pages/system/typography/FontStyle.js | 4 +- .../src/pages/system/typography/FontStyle.tsx | 4 +- .../src/pages/system/typography/FontWeight.js | 4 +- .../pages/system/typography/FontWeight.tsx | 4 +- .../pages/system/typography/LetterSpacing.js | 4 +- .../pages/system/typography/LetterSpacing.tsx | 4 +- .../src/pages/system/typography/LineHeight.js | 4 +- .../pages/system/typography/LineHeight.tsx | 4 +- .../pages/system/typography/TextAlignment.js | 4 +- .../pages/system/typography/TextAlignment.tsx | 4 +- docs/src/pages/system/typography/Variant.js | 2 +- docs/src/pages/system/typography/Variant.tsx | 2 +- .../src/pages/system/typography/typography.md | 2 +- docs/src/pages/versions/LatestVersions.js | 12 +- docs/src/pages/versions/ReleasedVersions.js | 12 +- .../list-item-icon/list-item-icon.json | 2 +- docs/types/docs.d.ts | 4 +- docs/types/icons.d.ts | 4 +- examples/cdn/README.md | 4 +- examples/cdn/index.html | 2 +- .../README.md | 2 +- .../config-overrides.js | 2 +- .../package.json | 6 +- .../src/App.tsx | 8 +- .../src/ProTip.tsx | 6 +- .../src/index.tsx | 2 +- .../tsconfig.json | 2 +- .../config-overrides.js | 2 +- .../package.json | 6 +- .../src/App.js | 8 +- .../src/ProTip.js | 6 +- .../src/index.js | 2 +- .../README.md | 2 +- .../package.json | 2 +- .../src/App.tsx | 8 +- .../src/ProTip.tsx | 6 +- .../src/index.tsx | 4 +- .../src/theme.ts | 4 +- examples/create-react-app/README.md | 2 +- examples/create-react-app/package.json | 2 +- examples/create-react-app/src/App.js | 8 +- examples/create-react-app/src/ProTip.js | 6 +- examples/create-react-app/src/index.js | 4 +- examples/create-react-app/src/theme.js | 4 +- examples/gatsby/README.md | 2 +- examples/gatsby/package.json | 2 +- .../gatsby-plugin-top-layout/TopLayout.js | 4 +- examples/gatsby/src/components/Copyright.js | 4 +- examples/gatsby/src/components/Link.js | 2 +- examples/gatsby/src/components/ProTip.js | 6 +- examples/gatsby/src/pages/about.js | 6 +- examples/gatsby/src/pages/index.js | 6 +- examples/gatsby/src/theme.js | 4 +- .../README.md | 2 +- .../next.config.js | 4 +- .../package.json | 4 +- .../pages/_app.tsx | 4 +- .../pages/about.tsx | 8 +- .../pages/index.tsx | 6 +- .../src/Copyright.tsx | 4 +- .../src/Link.tsx | 2 +- .../src/ProTip.tsx | 6 +- .../src/theme.ts | 4 +- .../tsconfig.json | 2 +- examples/nextjs-with-typescript/README.md | 2 +- examples/nextjs-with-typescript/package.json | 2 +- .../nextjs-with-typescript/pages/_app.tsx | 4 +- .../nextjs-with-typescript/pages/about.tsx | 8 +- .../nextjs-with-typescript/pages/index.tsx | 6 +- .../nextjs-with-typescript/src/Copyright.tsx | 4 +- examples/nextjs-with-typescript/src/Link.tsx | 2 +- .../nextjs-with-typescript/src/ProTip.tsx | 6 +- examples/nextjs-with-typescript/src/theme.ts | 4 +- examples/nextjs/README.md | 2 +- examples/nextjs/package.json | 2 +- examples/nextjs/pages/_app.js | 4 +- examples/nextjs/pages/about.js | 8 +- examples/nextjs/pages/index.js | 6 +- examples/nextjs/src/Copyright.js | 4 +- examples/nextjs/src/Link.js | 2 +- examples/nextjs/src/ProTip.js | 6 +- examples/nextjs/src/theme.js | 4 +- examples/preact/README.md | 2 +- examples/preact/package.json | 2 +- examples/preact/src/App.js | 6 +- examples/preact/src/Copyright.js | 4 +- examples/preact/src/ProTip.js | 6 +- examples/preact/src/theme.js | 4 +- examples/ssr/App.js | 8 +- examples/ssr/ProTip.js | 6 +- examples/ssr/README.md | 2 +- examples/ssr/client.js | 4 +- examples/ssr/package.json | 2 +- examples/ssr/server.js | 4 +- examples/ssr/theme.js | 4 +- framer/Material-UI.framerfx/code/AppBar.tsx | 8 +- framer/Material-UI.framerfx/code/Avatar.tsx | 2 +- framer/Material-UI.framerfx/code/Badge.tsx | 2 +- .../code/BottomNavigation.tsx | 4 +- framer/Material-UI.framerfx/code/Button.tsx | 2 +- framer/Material-UI.framerfx/code/Checkbox.tsx | 4 +- framer/Material-UI.framerfx/code/Chip.tsx | 2 +- .../code/CircularProgress.tsx | 2 +- framer/Material-UI.framerfx/code/Fab.tsx | 2 +- framer/Material-UI.framerfx/code/Icon.tsx | 4 +- .../Material-UI.framerfx/code/IconButton.tsx | 4 +- .../code/LinearProgress.tsx | 2 +- framer/Material-UI.framerfx/code/ListItem.tsx | 14 +- .../Material-UI.framerfx/code/MediaCard.tsx | 14 +- framer/Material-UI.framerfx/code/Paper.tsx | 2 +- framer/Material-UI.framerfx/code/Radio.tsx | 4 +- .../Material-UI.framerfx/code/RadioGroup.tsx | 4 +- framer/Material-UI.framerfx/code/Slider.tsx | 2 +- .../code/SnackbarContent.tsx | 4 +- framer/Material-UI.framerfx/code/Switch.tsx | 4 +- framer/Material-UI.framerfx/code/Tabs.tsx | 6 +- .../Material-UI.framerfx/code/TextField.tsx | 2 +- .../code/ThemeProvider.tsx | 2 +- .../Material-UI.framerfx/code/Typography.tsx | 2 +- framer/Material-UI.framerfx/package.json | 6 +- framer/Material-UI.framerfx/yarn.lock | 38 +- framer/scripts/templates/avatar.txt | 2 +- framer/scripts/templates/badge.txt | 2 +- .../scripts/templates/bottom_navigation.txt | 4 +- framer/scripts/templates/button.txt | 2 +- framer/scripts/templates/chip.txt | 2 +- .../scripts/templates/circular_progress.txt | 2 +- .../templates/controlled_self_closing.txt | 2 +- framer/scripts/templates/fab.txt | 2 +- framer/scripts/templates/icon.txt | 4 +- framer/scripts/templates/icon_button.txt | 4 +- .../scripts/templates/label_as_children.txt | 2 +- framer/scripts/templates/list_item.txt | 14 +- framer/scripts/templates/paper.txt | 2 +- framer/scripts/templates/radio.txt | 4 +- framer/scripts/templates/radio_group.txt | 4 +- .../scripts/templates/selection_control.txt | 4 +- framer/scripts/templates/self_closing.txt | 2 +- framer/scripts/templates/slider.txt | 2 +- framer/scripts/templates/snackbar_content.txt | 4 +- framer/scripts/templates/switch.txt | 4 +- framer/scripts/templates/tabs.txt | 6 +- framer/types/icons.d.ts | 4 +- package.json | 4 +- packages/eslint-plugin-material-ui/README.md | 2 +- packages/material-ui-codemod/README.md | 140 ++-- packages/material-ui-codemod/codemod.js | 4 +- packages/material-ui-codemod/package.json | 2 +- .../src/v0.15.0/import-path.test.js | 2 +- .../src/v1.0.0/color-imports.test.js | 2 +- .../src/v1.0.0/import-path.test.js | 2 +- .../src/v1.0.0/svg-icon-imports.test.js | 2 +- .../src/v4.0.0/theme-spacing-api.test.js | 2 +- .../src/v4.0.0/top-level-imports.test.js | 2 +- .../src/v5.0.0/adapter-v4.test.js | 2 +- .../autocomplete-rename-closeicon.test.js | 2 +- .../v5.0.0/autocomplete-rename-option.test.js | 2 +- .../src/v5.0.0/avatar-circle-circular.test.js | 2 +- .../src/v5.0.0/badge-overlap-value.test.js | 2 +- .../v5.0.0/box-borderradius-values.test.js | 2 +- .../src/v5.0.0/box-rename-css.test.js | 2 +- .../src/v5.0.0/box-rename-gap.test.js | 2 +- .../src/v5.0.0/box-sx-prop.test.js | 2 +- .../src/v5.0.0/button-color-prop.test.js | 2 +- .../src/v5.0.0/chip-variant-prop.test.js | 2 +- .../v5.0.0/circularprogress-variant.test.js | 2 +- .../collapse-rename-collapsedheight.test.js | 2 +- .../src/v5.0.0/component-rename-prop.test.js | 2 +- .../src/v5.0.0/core-styles-import.test.js | 2 +- .../src/v5.0.0/create-theme.test.js | 2 +- .../src/v5.0.0/dialog-props.test.js | 2 +- .../src/v5.0.0/dialog-title-props.test.js | 2 +- .../src/v5.0.0/emotion-prepend-cache.test.js | 2 +- .../v5.0.0/expansion-panel-component.test.js | 2 +- .../src/v5.0.0/fab-variant.test.js | 2 +- .../src/v5.0.0/fade-rename-alpha.test.js | 2 +- .../grid-justify-justifycontent.test.js | 2 +- .../src/v5.0.0/grid-list-component.test.js | 2 +- .../src/v5.0.0/icon-button-size.test.js | 2 +- .../src/v5.0.0/jss-to-styled.test.js | 2 +- .../src/v5.0.0/link-underline-hover.test.js | 2 +- .../src/v5.0.0/material-ui-styles.test.js | 2 +- .../src/v5.0.0/material-ui-types.test.js | 2 +- .../src/v5.0.0/modal-props.test.js | 2 +- .../src/v5.0.0/moved-lab-modules.test.js | 2 +- .../src/v5.0.0/optimal-imports.test.js | 2 +- .../v5.0.0/pagination-round-circular.test.js | 2 +- .../src/v5.0.0/preset-safe.test.js | 2 +- .../src/v5.0.0/root-ref.test.js | 2 +- .../src/v5.0.0/skeleton-variant.test.js | 2 +- .../src/v5.0.0/styled-engine-provider.test.js | 2 +- .../src/v5.0.0/table-props.test.js | 2 +- .../src/v5.0.0/tabs-scroll-buttons.test.js | 2 +- .../src/v5.0.0/textarea-minmax-rows.test.js | 2 +- .../v5.0.0/theme-breakpoints-width.test.js | 2 +- .../src/v5.0.0/theme-breakpoints.test.js | 2 +- .../src/v5.0.0/theme-options.test.js | 2 +- .../src/v5.0.0/theme-palette-mode.test.js | 2 +- .../src/v5.0.0/theme-provider.test.js | 2 +- .../src/v5.0.0/theme-spacing.test.js | 2 +- .../src/v5.0.0/theme-typography-round.test.js | 2 +- .../src/v5.0.0/transitions.test.js | 2 +- .../src/v5.0.0/use-autocomplete.test.js | 2 +- .../src/v5.0.0/use-transitionprops.test.js | 2 +- .../src/v5.0.0/variant-prop.test.js | 2 +- .../src/v5.0.0/with-mobile-dialog.test.js | 2 +- .../src/v5.0.0/with-width.test.js | 2 +- packages/material-ui-docs/README.md | 10 +- packages/material-ui-docs/package.json | 6 +- .../src/NProgressBar/NProgressBar.js | 8 +- .../src/svgIcons/FileDownload.js | 2 +- .../src/svgIcons/JavaScript.js | 2 +- .../src/svgIcons/TypeScript.js | 2 +- packages/material-ui-envinfo/README.md | 30 +- packages/material-ui-envinfo/envinfo.js | 2 +- packages/material-ui-envinfo/envinfo.test.js | 8 +- packages/material-ui-envinfo/package.json | 4 +- packages/material-ui-icons/README.md | 10 +- packages/material-ui-icons/builder.js | 2 +- packages/material-ui-icons/builder.md | 2 +- .../lib/esm/utils/createSvgIcon.js | 2 +- .../lib/utils/createSvgIcon.js | 2 +- packages/material-ui-icons/package.json | 4 +- .../scripts/create-typings.js | 4 +- .../src/utils/createSvgIcon.js | 2 +- .../test/generated-types/Test.tsx | 4 +- .../test/generated-types/tsconfig.json | 8 +- packages/material-ui-lab/README.md | 10 +- packages/material-ui-lab/package.json | 12 +- packages/material-ui-lab/src/Alert/Alert.d.ts | 4 +- packages/material-ui-lab/src/Alert/Alert.js | 6 +- .../src/AlertTitle/AlertTitle.d.ts | 4 +- .../src/AlertTitle/AlertTitle.js | 6 +- .../src/Autocomplete/Autocomplete.d.ts | 2 +- .../src/Autocomplete/Autocomplete.js | 6 +- .../src/AvatarGroup/AvatarGroup.d.ts | 4 +- .../src/AvatarGroup/AvatarGroup.js | 6 +- .../CalendarPicker/CalendarPicker.spec.tsx | 2 +- .../CalendarPicker/CalendarPicker.test.tsx | 2 +- .../src/CalendarPicker/CalendarPicker.tsx | 4 +- .../src/CalendarPicker/PickersCalendar.tsx | 4 +- .../CalendarPicker/PickersCalendarHeader.tsx | 6 +- .../PickersFadeTransitionGroup.tsx | 6 +- .../CalendarPicker/PickersSlideTransition.tsx | 4 +- .../CalendarPickerSkeleton.test.tsx | 2 +- .../CalendarPickerSkeleton.tsx | 8 +- .../material-ui-lab/src/ClockPicker/Clock.tsx | 8 +- .../src/ClockPicker/ClockNumber.tsx | 4 +- .../src/ClockPicker/ClockPicker.spec.tsx | 2 +- .../src/ClockPicker/ClockPicker.test.tsx | 2 +- .../src/ClockPicker/ClockPicker.tsx | 6 +- .../src/ClockPicker/ClockPointer.tsx | 2 +- .../src/DatePicker/DatePicker.spec.tsx | 4 +- .../src/DatePicker/DatePicker.test.tsx | 4 +- .../src/DatePicker/DatePicker.tsx | 4 +- .../src/DatePicker/DatePickerToolbar.tsx | 6 +- .../material-ui-lab/src/DatePicker/shared.ts | 2 +- .../DateRangePicker/DateRangePicker.test.tsx | 4 +- .../src/DateRangePicker/DateRangePicker.tsx | 2 +- .../DateRangePicker/DateRangePickerInput.tsx | 2 +- .../DateRangePickerToolbar.tsx | 6 +- .../DateRangePickerViewDesktop.tsx | 2 +- .../DateRangePickerDay.test.tsx | 2 +- .../DateRangePickerDay/DateRangePickerDay.tsx | 6 +- .../DateTimePicker/DateTimePicker.spec.tsx | 2 +- .../DateTimePicker/DateTimePicker.test.tsx | 4 +- .../src/DateTimePicker/DateTimePicker.tsx | 4 +- .../src/DateTimePicker/DateTimePickerTabs.tsx | 6 +- .../DateTimePicker/DateTimePickerToolbar.tsx | 4 +- .../src/DateTimePicker/shared.ts | 2 +- .../DesktopDatePicker.test.tsx | 8 +- .../DesktopDatePickerKeyboard.test.tsx | 4 +- .../DesktopDatePickerLocalization.test.tsx | 4 +- .../DesktopDateRangePicker.test.tsx | 8 +- .../DesktopDateRangePicker.tsx | 2 +- .../DesktopDateTimePicker.test.tsx | 4 +- .../DesktopTimePicker.test.tsx | 8 +- .../src/LoadingButton/LoadingButton.d.ts | 8 +- .../src/LoadingButton/LoadingButton.js | 12 +- .../src/LoadingButton/LoadingButton.spec.tsx | 2 +- .../src/LoadingButton/LoadingButton.test.js | 4 +- .../src/LoadingButton/loadingButtonClasses.ts | 2 +- .../material-ui-lab/src/Masonry/Masonry.d.ts | 6 +- .../material-ui-lab/src/Masonry/Masonry.js | 8 +- .../src/Masonry/Masonry.test.js | 6 +- .../src/Masonry/masonryClasses.ts | 2 +- .../src/MasonryItem/MasonryItem.d.ts | 6 +- .../src/MasonryItem/MasonryItem.js | 8 +- .../src/MasonryItem/MasonryItem.test.js | 6 +- .../src/MasonryItem/masonryItemClasses.ts | 2 +- .../MobileDatePicker.test.tsx | 8 +- .../MobileDatePickerLocalization.test.tsx | 4 +- .../MobileDateRangePicker.test.tsx | 4 +- .../MobileDateRangePicker.tsx | 2 +- .../MobileDateTimePicker.test.tsx | 4 +- .../MobileTimePicker.test.tsx | 4 +- .../src/MonthPicker/MonthPicker.test.tsx | 2 +- .../src/MonthPicker/MonthPicker.tsx | 6 +- .../src/MonthPicker/PickersMonth.tsx | 8 +- .../src/Pagination/Pagination.d.ts | 4 +- .../src/Pagination/Pagination.js | 6 +- .../src/Pagination/usePagination.d.ts | 4 +- .../src/Pagination/usePagination.js | 2 +- .../src/PaginationItem/PaginationItem.d.ts | 4 +- .../src/PaginationItem/PaginationItem.js | 6 +- .../src/PickersDay/PickersDay.spec.tsx | 2 +- .../src/PickersDay/PickersDay.test.tsx | 2 +- .../src/PickersDay/PickersDay.tsx | 12 +- .../material-ui-lab/src/Rating/Rating.d.ts | 4 +- packages/material-ui-lab/src/Rating/Rating.js | 6 +- .../src/Skeleton/Skeleton.d.ts | 4 +- .../material-ui-lab/src/Skeleton/Skeleton.js | 6 +- .../src/SpeedDial/SpeedDial.d.ts | 4 +- .../src/SpeedDial/SpeedDial.js | 6 +- .../src/SpeedDialAction/SpeedDialAction.d.ts | 4 +- .../src/SpeedDialAction/SpeedDialAction.js | 6 +- .../src/SpeedDialIcon/SpeedDialIcon.d.ts | 4 +- .../src/SpeedDialIcon/SpeedDialIcon.js | 6 +- .../StaticDatePicker.spec.tsx | 2 +- .../StaticDatePicker.test.tsx | 4 +- .../StaticDatePickerKeyboard.test.tsx | 4 +- .../StaticDateRangePicker.test.tsx | 4 +- .../StaticDateRangePicker.tsx | 2 +- .../StaticDateTimePicker.test.tsx | 4 +- .../StaticTimePicker.test.tsx | 2 +- .../material-ui-lab/src/TabList/TabList.d.ts | 6 +- .../material-ui-lab/src/TabList/TabList.js | 2 +- .../src/TabList/TabList.test.js | 4 +- .../src/TabPanel/TabPanel.d.ts | 6 +- .../material-ui-lab/src/TabPanel/TabPanel.js | 4 +- .../src/TabPanel/TabPanel.test.tsx | 2 +- .../src/TabPanel/tabPanelClasses.ts | 2 +- .../src/TimePicker/TimePicker.spec.tsx | 2 +- .../src/TimePicker/TimePicker.test.tsx | 2 +- .../src/TimePicker/TimePicker.tsx | 4 +- .../src/TimePicker/TimePickerToolbar.tsx | 4 +- .../material-ui-lab/src/TimePicker/shared.tsx | 2 +- .../src/Timeline/Timeline.test.tsx | 2 +- .../material-ui-lab/src/Timeline/Timeline.tsx | 10 +- .../src/Timeline/timelineClasses.ts | 2 +- .../TimelineConnector/TimelineConnector.d.ts | 6 +- .../TimelineConnector/TimelineConnector.js | 4 +- .../TimelineConnector.test.js | 4 +- .../timelineConnectorClasses.ts | 2 +- .../src/TimelineContent/TimelineContent.d.ts | 6 +- .../src/TimelineContent/TimelineContent.js | 8 +- .../TimelineContent/TimelineContent.test.js | 10 +- .../TimelineContent/timelineContentClasses.ts | 2 +- .../src/TimelineDot/TimelineDot.d.ts | 8 +- .../src/TimelineDot/TimelineDot.js | 6 +- .../src/TimelineDot/TimelineDot.test.js | 2 +- .../src/TimelineDot/timelineDotClasses.ts | 2 +- .../src/TimelineItem/TimelineItem.d.ts | 6 +- .../src/TimelineItem/TimelineItem.js | 6 +- .../src/TimelineItem/TimelineItem.test.js | 2 +- .../src/TimelineItem/timelineItemClasses.ts | 2 +- .../TimelineOppositeContent.d.ts | 6 +- .../TimelineOppositeContent.js | 8 +- .../TimelineOppositeContent.test.js | 8 +- .../timelineOppositeContentClasses.ts | 2 +- .../TimelineSeparator/TimelineSeparator.d.ts | 6 +- .../TimelineSeparator/TimelineSeparator.js | 4 +- .../TimelineSeparator.test.js | 4 +- .../timelineSeparatorClasses.ts | 2 +- .../src/ToggleButton/ToggleButton.d.ts | 4 +- .../src/ToggleButton/ToggleButton.js | 6 +- .../ToggleButtonGroup/ToggleButtonGroup.d.ts | 4 +- .../ToggleButtonGroup/ToggleButtonGroup.js | 6 +- .../src/TreeItem/TreeItem.d.ts | 6 +- .../material-ui-lab/src/TreeItem/TreeItem.js | 10 +- .../src/TreeItem/TreeItem.test.js | 4 +- .../src/TreeItem/TreeItemContent.d.ts | 2 +- .../src/TreeItem/treeItemClasses.ts | 2 +- .../src/TreeView/TreeView.d.ts | 6 +- .../material-ui-lab/src/TreeView/TreeView.js | 6 +- .../src/TreeView/TreeView.test.js | 6 +- .../src/TreeView/descendants.js | 2 +- .../src/TreeView/treeViewClasses.ts | 2 +- .../src/YearPicker/PickersYear.tsx | 6 +- .../src/YearPicker/YearPicker.test.tsx | 2 +- .../src/YearPicker/YearPicker.tsx | 4 +- .../src/YearPicker/yearPickerClasses.ts | 2 +- packages/material-ui-lab/src/index.test.js | 2 +- .../internal/pickers/KeyboardDateInput.tsx | 4 +- .../src/internal/pickers/Picker/Picker.tsx | 2 +- .../internal/pickers/Picker/PickerView.tsx | 2 +- .../internal/pickers/PickersArrowSwitcher.tsx | 6 +- .../internal/pickers/PickersModalDialog.tsx | 10 +- .../src/internal/pickers/PickersPopper.tsx | 18 +- .../src/internal/pickers/PickersToolbar.tsx | 10 +- .../internal/pickers/PickersToolbarButton.tsx | 6 +- .../internal/pickers/PickersToolbarText.tsx | 6 +- .../src/internal/pickers/PureDateInput.tsx | 6 +- .../internal/pickers/hooks/useIsLandscape.tsx | 2 +- .../src/internal/pickers/hooks/useUtils.ts | 2 +- .../src/internal/pickers/hooks/useViews.tsx | 2 +- .../src/internal/pickers/test-utils.tsx | 6 +- .../internal/pickers/typings/BasePicker.tsx | 4 +- .../wrappers/DesktopTooltipWrapper.tsx | 2 +- .../pickers/wrappers/DesktopWrapper.tsx | 2 +- .../pickers/wrappers/ResponsiveWrapper.tsx | 2 +- .../pickers/wrappers/StaticWrapper.tsx | 2 +- .../src/internal/svg-icons/ArrowDropDown.js | 2 +- .../src/internal/svg-icons/ArrowDropDown.tsx | 2 +- .../src/internal/svg-icons/ArrowLeft.tsx | 2 +- .../src/internal/svg-icons/ArrowRight.tsx | 2 +- .../src/internal/svg-icons/Calendar.tsx | 2 +- .../src/internal/svg-icons/Clock.tsx | 2 +- .../src/internal/svg-icons/DateRange.tsx | 2 +- .../src/internal/svg-icons/Pen.tsx | 2 +- .../src/internal/svg-icons/Time.tsx | 2 +- .../src/themeAugmentation/components.d.ts | 4 +- .../src/themeAugmentation/index.js | 2 +- .../src/themeAugmentation/overrides.d.ts | 2 +- .../src/themeAugmentation/props.d.ts | 2 +- .../src/useAutocomplete/index.d.ts | 2 +- .../src/useAutocomplete/index.js | 2 +- .../test/integration/Tabs.test.js | 8 +- .../material-ui-private-theming/README.md | 4 +- .../material-ui-private-theming/package.json | 6 +- .../src/ThemeProvider/ThemeProvider.js | 2 +- .../src/defaultTheme/defaultTheme.spec.ts | 8 +- .../material-ui-styled-engine-sc/README.md | 4 +- .../material-ui-styled-engine-sc/package.json | 2 +- .../src/styled.test.js | 2 +- packages/material-ui-styled-engine/README.md | 4 +- .../material-ui-styled-engine/package.json | 2 +- packages/material-ui-styles/README.md | 6 +- packages/material-ui-styles/package.json | 8 +- .../src/StylesProvider/StylesProvider.js | 2 +- .../src/ThemeProvider/ThemeProvider.test.js | 2 +- .../src/ThemeProvider/index.d.ts | 4 +- .../src/ThemeProvider/index.js | 2 +- .../createGenerateClassName.js | 2 +- .../createGenerateClassName.test.js | 2 +- .../src/createStyles/createStyles.d.ts | 2 +- .../src/createStyles/createStyles.spec.ts | 2 +- .../src/defaultTheme/index.d.ts | 2 +- .../getStylesCreator/getStylesCreator.d.ts | 2 +- .../src/getStylesCreator/getStylesCreator.js | 2 +- .../src/getThemeProps/getThemeProps.spec.ts | 2 +- packages/material-ui-styles/src/index.js | 13 +- .../src/makeStyles/makeStyles.d.ts | 2 +- .../src/makeStyles/makeStyles.spec.tsx | 6 +- .../src/makeStyles/makeStyles.test.js | 2 +- .../src/mergeClasses/mergeClasses.js | 2 +- .../src/propsToClassKey/propsToClassKey.js | 2 +- .../material-ui-styles/src/styled/styled.d.ts | 4 +- .../material-ui-styles/src/styled/styled.js | 2 +- .../src/styled/styled.spec.tsx | 2 +- .../src/styled/styled.test.js | 2 +- .../src/useTheme/index.d.ts | 4 +- .../material-ui-styles/src/useTheme/index.js | 2 +- .../useThemeVariants/useThemeVariants.test.js | 2 +- .../src/withStyles/withStyles.d.ts | 2 +- .../src/withStyles/withStyles.js | 2 +- .../src/withStyles/withStyles.test.js | 8 +- .../src/withTheme/withTheme.d.ts | 2 +- .../src/withTheme/withTheme.js | 2 +- .../src/withTheme/withTheme.test.js | 4 +- .../material-ui-styles/test/styles.spec.tsx | 8 +- packages/material-ui-system/README.md | 6 +- packages/material-ui-system/package.json | 10 +- packages/material-ui-system/src/Box/Box.d.ts | 2 +- .../material-ui-system/src/Box/Box.spec.tsx | 2 +- .../material-ui-system/src/Box/Box.test.js | 2 +- .../src/ThemeProvider/ThemeProvider.d.ts | 2 +- .../src/ThemeProvider/ThemeProvider.js | 6 +- .../src/ThemeProvider/ThemeProvider.test.js | 4 +- .../material-ui-system/src/breakpoints.js | 2 +- .../src/colorManipulator.js | 2 +- packages/material-ui-system/src/createBox.js | 2 +- .../material-ui-system/src/createBox.test.js | 2 +- .../material-ui-system/src/createStyled.js | 4 +- .../src/createStyled.test.js | 2 +- .../src/createTheme/createBreakpoints.d.ts | 2 +- .../src/createTheme/createTheme.js | 2 +- packages/material-ui-system/src/index.d.ts | 4 +- packages/material-ui-system/src/index.js | 2 +- .../material-ui-system/src/index.spec.tsx | 4 +- packages/material-ui-system/src/merge.js | 2 +- .../material-ui-system/src/propsToClassKey.js | 2 +- packages/material-ui-system/src/style.js | 2 +- .../material-ui-system/src/styled.test.js | 2 +- .../src/useThemeProps/useThemeProps.spec.ts | 4 +- .../src/useThemeWithoutDefault.js | 2 +- packages/material-ui-types/README.md | 2 +- packages/material-ui-types/index.spec.ts | 2 +- packages/material-ui-types/package.json | 2 +- packages/material-ui-unstyled/README.md | 6 +- packages/material-ui-unstyled/package.json | 6 +- .../AutocompleteUnstyled/useAutocomplete.d.ts | 2 +- .../AutocompleteUnstyled/useAutocomplete.js | 2 +- .../useAutocomplete.spec.ts | 4 +- .../useAutocomplete.test.js | 2 +- .../BackdropUnstyled/BackdropUnstyled.d.ts | 2 +- .../BackdropUnstyled/BackdropUnstyled.test.js | 4 +- .../src/BadgeUnstyled/BadgeUnstyled.d.ts | 2 +- .../src/BadgeUnstyled/BadgeUnstyled.js | 2 +- .../src/BadgeUnstyled/BadgeUnstyled.test.js | 4 +- .../ButtonUnstyled/ButtonUnstyled.test.tsx | 2 +- .../src/ButtonUnstyled/ButtonUnstyled.tsx | 2 +- .../src/ButtonUnstyled/ButtonUnstyledProps.ts | 2 +- .../src/ButtonUnstyled/useButton.test.tsx | 2 +- .../src/ButtonUnstyled/useButton.ts | 2 +- .../FormControlUnstyled.spec.tsx | 4 +- .../FormControlUnstyled.test.tsx | 2 +- .../FormControlUnstyled.tsx | 4 +- .../FormControlUnstyledProps.ts | 2 +- .../src/ModalUnstyled/ModalManager.test.js | 2 +- .../src/ModalUnstyled/ModalManager.ts | 2 +- .../src/ModalUnstyled/ModalUnstyled.d.ts | 2 +- .../src/ModalUnstyled/ModalUnstyled.js | 2 +- .../src/ModalUnstyled/ModalUnstyled.test.js | 4 +- .../material-ui-unstyled/src/NoSsr/NoSsr.js | 2 +- .../src/NoSsr/NoSsr.test.js | 2 +- .../material-ui-unstyled/src/Portal/Portal.js | 2 +- .../src/SliderUnstyled/SliderUnstyled.d.ts | 2 +- .../src/SliderUnstyled/SliderUnstyled.js | 2 +- .../src/SliderUnstyled/SliderUnstyled.test.js | 4 +- .../SwitchUnstyled/SwitchUnstyled.test.tsx | 5 +- .../src/SwitchUnstyled/useSwitch.test.tsx | 2 +- .../src/SwitchUnstyled/useSwitch.ts | 2 +- .../Unstable_TrapFocus/Unstable_TrapFocus.js | 2 +- .../Unstable_TrapFocus.test.js | 4 +- .../material-ui-unstyled/src/index.test.js | 2 +- .../sliderOwnerState.spec.tsx | 4 +- packages/material-ui-utils/README.md | 2 +- .../macros/MuiError.macro.js | 10 +- .../error-code-extraction/input.js | 2 +- .../error-code-extraction/output.js | 2 +- .../macros/__fixtures__/factory-call/input.js | 2 +- .../macros/__fixtures__/literal/input.js | 2 +- .../macros/__fixtures__/literal/output.js | 2 +- .../no-error-code-annotation/input.js | 2 +- .../__fixtures__/no-error-code-throw/input.js | 2 +- packages/material-ui-utils/package.json | 2 +- .../src/formatMuiErrorMessage.ts | 2 +- .../src/integerPropType.test.js | 2 +- .../src/useEventCallback.spec.ts | 4 +- packages/material-ui/README.md | 6 +- packages/material-ui/package.json | 10 +- packages/material-ui/scripts/rollup.config.js | 10 +- .../material-ui/src/Accordion/Accordion.d.ts | 2 +- .../material-ui/src/Accordion/Accordion.js | 4 +- .../src/Accordion/Accordion.spec.tsx | 2 +- .../src/Accordion/Accordion.test.js | 6 +- .../src/Accordion/accordionClasses.ts | 2 +- .../AccordionActions/AccordionActions.d.ts | 2 +- .../src/AccordionActions/AccordionActions.js | 2 +- .../AccordionActions/AccordionActions.test.js | 2 +- .../accordionActionsClasses.ts | 2 +- .../AccordionDetails/AccordionDetails.d.ts | 2 +- .../src/AccordionDetails/AccordionDetails.js | 2 +- .../AccordionDetails/AccordionDetails.test.js | 2 +- .../accordionDetailsClasses.ts | 2 +- .../AccordionSummary/AccordionSummary.d.ts | 2 +- .../src/AccordionSummary/AccordionSummary.js | 2 +- .../AccordionSummary/AccordionSummary.test.js | 6 +- .../accordionSummaryClasses.ts | 2 +- packages/material-ui/src/Alert/Alert.d.ts | 4 +- packages/material-ui/src/Alert/Alert.js | 4 +- packages/material-ui/src/Alert/Alert.test.js | 4 +- .../material-ui/src/Alert/alertClasses.ts | 2 +- .../src/AlertTitle/AlertTitle.d.ts | 2 +- .../material-ui/src/AlertTitle/AlertTitle.js | 2 +- .../src/AlertTitle/AlertTitle.test.js | 2 +- .../src/AlertTitle/alertTitleClasses.ts | 2 +- packages/material-ui/src/AppBar/AppBar.d.ts | 6 +- packages/material-ui/src/AppBar/AppBar.js | 2 +- .../material-ui/src/AppBar/AppBar.spec.tsx | 2 +- .../material-ui/src/AppBar/AppBar.test.js | 4 +- .../material-ui/src/AppBar/appBarClasses.ts | 2 +- .../src/Autocomplete/Autocomplete.d.ts | 12 +- .../src/Autocomplete/Autocomplete.js | 6 +- .../src/Autocomplete/Autocomplete.spec.tsx | 4 +- .../src/Autocomplete/Autocomplete.test.js | 8 +- .../src/Autocomplete/autocompleteClasses.ts | 2 +- packages/material-ui/src/Avatar/Avatar.d.ts | 6 +- packages/material-ui/src/Avatar/Avatar.js | 2 +- .../material-ui/src/Avatar/Avatar.test.js | 2 +- .../material-ui/src/Avatar/avatarClasses.ts | 2 +- .../src/AvatarGroup/AvatarGroup.d.ts | 6 +- .../src/AvatarGroup/AvatarGroup.js | 4 +- .../src/AvatarGroup/AvatarGroup.test.js | 4 +- .../src/AvatarGroup/avatarGroupClasses.ts | 2 +- .../material-ui/src/Backdrop/Backdrop.d.ts | 7 +- packages/material-ui/src/Backdrop/Backdrop.js | 4 +- .../material-ui/src/Backdrop/Backdrop.test.js | 4 +- packages/material-ui/src/Badge/Badge.d.ts | 9 +- packages/material-ui/src/Badge/Badge.js | 9 +- packages/material-ui/src/Badge/Badge.test.js | 4 +- .../BottomNavigation/BottomNavigation.d.ts | 2 +- .../src/BottomNavigation/BottomNavigation.js | 2 +- .../BottomNavigation.spec.tsx | 2 +- .../BottomNavigation/BottomNavigation.test.js | 6 +- .../bottomNavigationClasses.ts | 2 +- .../BottomNavigationAction.d.ts | 2 +- .../BottomNavigationAction.js | 2 +- .../BottomNavigationAction.test.js | 4 +- .../bottomNavigationActionClasses.ts | 2 +- packages/material-ui/src/Box/Box.d.ts | 2 +- packages/material-ui/src/Box/Box.js | 2 +- packages/material-ui/src/Box/Box.test.js | 4 +- .../src/Breadcrumbs/BreadcrumbCollapsed.js | 2 +- .../src/Breadcrumbs/Breadcrumbs.d.ts | 4 +- .../src/Breadcrumbs/Breadcrumbs.js | 4 +- .../src/Breadcrumbs/Breadcrumbs.test.js | 2 +- .../src/Breadcrumbs/breadcrumbsClasses.ts | 2 +- packages/material-ui/src/Button/Button.d.ts | 4 +- packages/material-ui/src/Button/Button.js | 4 +- .../material-ui/src/Button/Button.spec.tsx | 4 +- .../material-ui/src/Button/Button.test.js | 4 +- .../material-ui/src/Button/buttonClasses.ts | 2 +- .../src/ButtonBase/ButtonBase.d.ts | 2 +- .../material-ui/src/ButtonBase/ButtonBase.js | 4 +- .../src/ButtonBase/ButtonBase.test.js | 4 +- .../material-ui/src/ButtonBase/TouchRipple.js | 2 +- .../src/ButtonBase/buttonBaseClasses.ts | 2 +- .../src/ButtonBase/touchRippleClasses.ts | 2 +- .../src/ButtonGroup/ButtonGroup.d.ts | 4 +- .../src/ButtonGroup/ButtonGroup.js | 4 +- .../src/ButtonGroup/ButtonGroup.test.js | 4 +- .../src/ButtonGroup/buttonGroupClasses.ts | 2 +- packages/material-ui/src/Card/Card.d.ts | 6 +- packages/material-ui/src/Card/Card.js | 4 +- packages/material-ui/src/Card/Card.test.tsx | 4 +- packages/material-ui/src/Card/cardClasses.ts | 2 +- .../src/CardActionArea/CardActionArea.d.ts | 2 +- .../src/CardActionArea/CardActionArea.js | 2 +- .../src/CardActionArea/CardActionArea.test.js | 4 +- .../CardActionArea/cardActionAreaClasses.ts | 2 +- .../src/CardActions/CardActions.d.ts | 2 +- .../src/CardActions/CardActions.js | 2 +- .../src/CardActions/CardActions.test.js | 2 +- .../src/CardActions/cardActionsClasses.ts | 2 +- .../src/CardContent/CardContent.d.ts | 2 +- .../src/CardContent/CardContent.js | 2 +- .../src/CardContent/CardContent.test.js | 2 +- .../src/CardContent/cardContentClasses.ts | 2 +- .../src/CardHeader/CardHeader.d.ts | 2 +- .../material-ui/src/CardHeader/CardHeader.js | 2 +- .../src/CardHeader/CardHeader.spec.tsx | 2 +- .../src/CardHeader/CardHeader.test.js | 4 +- .../src/CardHeader/cardHeaderClasses.ts | 2 +- .../material-ui/src/CardMedia/CardMedia.d.ts | 2 +- .../material-ui/src/CardMedia/CardMedia.js | 4 +- .../src/CardMedia/CardMedia.test.js | 2 +- .../src/CardMedia/cardMediaClasses.ts | 2 +- .../material-ui/src/Checkbox/Checkbox.d.ts | 4 +- packages/material-ui/src/Checkbox/Checkbox.js | 6 +- .../material-ui/src/Checkbox/Checkbox.test.js | 6 +- .../src/Checkbox/checkboxClasses.ts | 2 +- packages/material-ui/src/Chip/Chip.d.ts | 4 +- packages/material-ui/src/Chip/Chip.js | 4 +- packages/material-ui/src/Chip/Chip.test.js | 4 +- packages/material-ui/src/Chip/chipClasses.ts | 2 +- .../CircularProgress/CircularProgress.d.ts | 4 +- .../src/CircularProgress/CircularProgress.js | 6 +- .../CircularProgress/CircularProgress.test.js | 2 +- .../circularProgressClasses.ts | 2 +- .../ClickAwayListener/ClickAwayListener.tsx | 2 +- .../material-ui/src/Collapse/Collapse.d.ts | 2 +- packages/material-ui/src/Collapse/Collapse.js | 4 +- .../material-ui/src/Collapse/Collapse.test.js | 4 +- .../src/Collapse/collapseClasses.ts | 2 +- .../material-ui/src/Container/Container.d.ts | 2 +- .../material-ui/src/Container/Container.js | 2 +- .../src/Container/Container.test.js | 2 +- .../src/Container/containerClasses.ts | 2 +- .../src/CssBaseline/CssBaseline.d.ts | 2 +- .../src/CssBaseline/CssBaseline.test.js | 4 +- packages/material-ui/src/Dialog/Dialog.d.ts | 2 +- packages/material-ui/src/Dialog/Dialog.js | 4 +- .../material-ui/src/Dialog/Dialog.spec.tsx | 2 +- .../material-ui/src/Dialog/Dialog.test.js | 4 +- .../material-ui/src/Dialog/dialogClasses.ts | 2 +- .../src/DialogActions/DialogActions.d.ts | 2 +- .../src/DialogActions/DialogActions.js | 2 +- .../src/DialogActions/DialogActions.test.js | 2 +- .../src/DialogActions/dialogActionsClasses.ts | 2 +- .../src/DialogContent/DialogContent.d.ts | 2 +- .../src/DialogContent/DialogContent.js | 2 +- .../src/DialogContent/DialogContent.test.js | 2 +- .../src/DialogContent/dialogContentClasses.ts | 2 +- .../DialogContentText/DialogContentText.d.ts | 2 +- .../DialogContentText/DialogContentText.js | 2 +- .../DialogContentText.spec.tsx | 2 +- .../DialogContentText.test.js | 4 +- .../dialogContentTextClasses.ts | 2 +- .../src/DialogTitle/DialogTitle.d.ts | 2 +- .../src/DialogTitle/DialogTitle.js | 2 +- .../src/DialogTitle/DialogTitle.test.js | 2 +- .../src/DialogTitle/dialogTitleClasses.ts | 2 +- packages/material-ui/src/Divider/Divider.d.ts | 4 +- packages/material-ui/src/Divider/Divider.js | 4 +- .../material-ui/src/Divider/Divider.test.js | 2 +- .../material-ui/src/Divider/dividerClasses.ts | 2 +- packages/material-ui/src/Drawer/Drawer.d.ts | 2 +- packages/material-ui/src/Drawer/Drawer.js | 4 +- .../material-ui/src/Drawer/Drawer.test.js | 4 +- .../material-ui/src/Drawer/drawerClasses.ts | 2 +- packages/material-ui/src/Fab/Fab.d.ts | 4 +- packages/material-ui/src/Fab/Fab.js | 2 +- packages/material-ui/src/Fab/Fab.test.js | 6 +- packages/material-ui/src/Fab/fabClasses.ts | 2 +- packages/material-ui/src/Fade/Fade.js | 2 +- packages/material-ui/src/Fade/Fade.test.js | 2 +- .../src/FilledInput/FilledInput.d.ts | 2 +- .../src/FilledInput/FilledInput.js | 4 +- .../src/FilledInput/FilledInput.spec.tsx | 2 +- .../src/FilledInput/FilledInput.test.js | 4 +- .../src/FilledInput/filledInputClasses.ts | 2 +- .../src/FormControl/FormControl.d.ts | 4 +- .../src/FormControl/FormControl.js | 2 +- .../src/FormControl/FormControl.test.js | 6 +- .../src/FormControl/formControlClasses.ts | 2 +- .../FormControlLabel/FormControlLabel.d.ts | 2 +- .../src/FormControlLabel/FormControlLabel.js | 4 +- .../FormControlLabel/FormControlLabel.test.js | 8 +- .../formControlLabelClasses.ts | 2 +- .../material-ui/src/FormGroup/FormGroup.d.ts | 2 +- .../material-ui/src/FormGroup/FormGroup.js | 2 +- .../src/FormGroup/FormGroup.test.js | 2 +- .../src/FormGroup/formGroupClasses.ts | 2 +- .../src/FormHelperText/FormHelperText.d.ts | 2 +- .../src/FormHelperText/FormHelperText.js | 2 +- .../src/FormHelperText/FormHelperText.test.js | 4 +- .../FormHelperText/formHelperTextClasses.ts | 2 +- .../material-ui/src/FormLabel/FormLabel.d.ts | 4 +- .../material-ui/src/FormLabel/FormLabel.js | 2 +- .../src/FormLabel/FormLabel.test.js | 6 +- .../src/FormLabel/formLabelClasses.ts | 2 +- .../src/GlobalStyles/GlobalStyles.d.ts | 2 +- .../src/GlobalStyles/GlobalStyles.js | 2 +- .../src/GlobalStyles/GlobalStyles.test.js | 4 +- packages/material-ui/src/Grid/Grid.d.ts | 2 +- packages/material-ui/src/Grid/Grid.js | 4 +- packages/material-ui/src/Grid/Grid.spec.tsx | 4 +- packages/material-ui/src/Grid/Grid.test.js | 6 +- packages/material-ui/src/Grid/gridClasses.ts | 2 +- packages/material-ui/src/Grow/Grow.js | 2 +- packages/material-ui/src/Grow/Grow.test.js | 4 +- packages/material-ui/src/Hidden/Hidden.d.ts | 2 +- .../material-ui/src/Hidden/Hidden.test.js | 2 +- .../material-ui/src/Hidden/HiddenCss.d.ts | 2 +- packages/material-ui/src/Hidden/HiddenCss.js | 2 +- packages/material-ui/src/Hidden/HiddenJs.d.ts | 2 +- packages/material-ui/src/Hidden/HiddenJs.js | 2 +- .../src/Hidden/hiddenCssClasses.js | 2 +- .../material-ui/src/Hidden/withWidth.d.ts | 4 +- packages/material-ui/src/Hidden/withWidth.js | 4 +- packages/material-ui/src/Icon/Icon.d.ts | 4 +- packages/material-ui/src/Icon/Icon.js | 2 +- packages/material-ui/src/Icon/Icon.test.js | 2 +- packages/material-ui/src/Icon/iconClasses.ts | 2 +- .../src/IconButton/IconButton.d.ts | 4 +- .../material-ui/src/IconButton/IconButton.js | 6 +- .../src/IconButton/IconButton.test.js | 6 +- .../src/IconButton/iconButtonClasses.ts | 2 +- .../material-ui/src/ImageList/ImageList.d.ts | 4 +- .../material-ui/src/ImageList/ImageList.js | 4 +- .../src/ImageList/ImageList.test.js | 2 +- .../src/ImageList/imageListClasses.ts | 2 +- .../src/ImageListItem/ImageListItem.d.ts | 2 +- .../src/ImageListItem/ImageListItem.js | 4 +- .../src/ImageListItem/ImageListItem.test.js | 4 +- .../src/ImageListItem/imageListItemClasses.ts | 2 +- .../ImageListItemBar/ImageListItemBar.d.ts | 2 +- .../src/ImageListItemBar/ImageListItemBar.js | 2 +- .../ImageListItemBar/ImageListItemBar.test.js | 2 +- .../imageListItemBarClasses.ts | 2 +- packages/material-ui/src/Input/Input.d.ts | 2 +- packages/material-ui/src/Input/Input.js | 4 +- packages/material-ui/src/Input/Input.test.js | 4 +- .../material-ui/src/Input/inputClasses.ts | 2 +- .../src/InputAdornment/InputAdornment.d.ts | 2 +- .../src/InputAdornment/InputAdornment.js | 2 +- .../src/InputAdornment/InputAdornment.test.js | 10 +- .../InputAdornment/inputAdornmentClasses.ts | 2 +- .../material-ui/src/InputBase/InputBase.d.ts | 4 +- .../material-ui/src/InputBase/InputBase.js | 6 +- .../src/InputBase/InputBase.test.js | 10 +- .../src/InputBase/inputBaseClasses.ts | 2 +- .../src/InputLabel/InputLabel.d.ts | 2 +- .../material-ui/src/InputLabel/InputLabel.js | 2 +- .../src/InputLabel/InputLabel.test.js | 8 +- .../src/InputLabel/inputLabelClasses.ts | 2 +- .../src/LinearProgress/LinearProgress.d.ts | 4 +- .../src/LinearProgress/LinearProgress.js | 4 +- .../src/LinearProgress/LinearProgress.test.js | 2 +- .../LinearProgress/linearProgressClasses.ts | 2 +- packages/material-ui/src/Link/Link.d.ts | 4 +- packages/material-ui/src/Link/Link.js | 6 +- packages/material-ui/src/Link/Link.test.js | 4 +- packages/material-ui/src/Link/linkClasses.ts | 2 +- packages/material-ui/src/List/List.d.ts | 2 +- packages/material-ui/src/List/List.js | 2 +- packages/material-ui/src/List/List.spec.tsx | 2 +- packages/material-ui/src/List/List.test.js | 6 +- packages/material-ui/src/List/listClasses.ts | 2 +- .../material-ui/src/ListItem/ListItem.d.ts | 4 +- packages/material-ui/src/ListItem/ListItem.js | 6 +- .../src/ListItem/ListItem.spec.tsx | 4 +- .../material-ui/src/ListItem/ListItem.test.js | 8 +- .../src/ListItem/listItemClasses.ts | 2 +- .../src/ListItemAvatar/ListItemAvatar.d.ts | 2 +- .../src/ListItemAvatar/ListItemAvatar.js | 2 +- .../src/ListItemAvatar/ListItemAvatar.test.js | 2 +- .../ListItemAvatar/listItemAvatarClasses.ts | 2 +- .../src/ListItemButton/ListItemButton.d.ts | 4 +- .../src/ListItemButton/ListItemButton.js | 4 +- .../src/ListItemButton/ListItemButton.test.js | 4 +- .../ListItemButton/listItemButtonClasses.ts | 2 +- .../src/ListItemIcon/ListItemIcon.d.ts | 4 +- .../src/ListItemIcon/ListItemIcon.js | 4 +- .../src/ListItemIcon/ListItemIcon.test.js | 2 +- .../src/ListItemIcon/listItemIconClasses.ts | 2 +- .../ListItemSecondaryAction.d.ts | 2 +- .../ListItemSecondaryAction.js | 2 +- .../ListItemSecondaryAction.test.js | 4 +- .../listItemSecondaryActionClasses.ts | 2 +- .../src/ListItemText/ListItemText.d.ts | 2 +- .../src/ListItemText/ListItemText.js | 2 +- .../src/ListItemText/ListItemText.spec.tsx | 2 +- .../src/ListItemText/ListItemText.test.js | 4 +- .../src/ListItemText/listItemTextClasses.ts | 2 +- .../src/ListSubheader/ListSubheader.d.ts | 2 +- .../src/ListSubheader/ListSubheader.js | 2 +- .../src/ListSubheader/ListSubheader.test.js | 2 +- .../src/ListSubheader/listSubheaderClasses.ts | 2 +- packages/material-ui/src/Menu/Menu.d.ts | 2 +- packages/material-ui/src/Menu/Menu.js | 4 +- packages/material-ui/src/Menu/Menu.test.js | 4 +- packages/material-ui/src/Menu/menuClasses.ts | 2 +- .../material-ui/src/MenuItem/MenuItem.d.ts | 4 +- packages/material-ui/src/MenuItem/MenuItem.js | 4 +- .../material-ui/src/MenuItem/MenuItem.test.js | 4 +- .../src/MenuItem/menuItemClasses.ts | 2 +- .../material-ui/src/MenuList/MenuList.test.js | 4 +- .../src/MobileStepper/MobileStepper.d.ts | 2 +- .../src/MobileStepper/MobileStepper.js | 4 +- .../src/MobileStepper/MobileStepper.test.js | 6 +- .../src/MobileStepper/mobileStepperClasses.ts | 2 +- packages/material-ui/src/Modal/Modal.d.ts | 9 +- packages/material-ui/src/Modal/Modal.js | 6 +- packages/material-ui/src/Modal/Modal.spec.tsx | 2 +- packages/material-ui/src/Modal/Modal.test.js | 6 +- packages/material-ui/src/Modal/index.d.ts | 2 +- packages/material-ui/src/Modal/index.js | 2 +- .../src/NativeSelect/NativeSelect.d.ts | 2 +- .../src/NativeSelect/NativeSelect.js | 2 +- .../src/NativeSelect/NativeSelect.test.js | 6 +- .../src/NativeSelect/NativeSelectInput.d.ts | 2 +- .../src/NativeSelect/NativeSelectInput.js | 4 +- .../src/NativeSelect/nativeSelectClasses.ts | 2 +- packages/material-ui/src/NoSsr/index.d.ts | 4 +- packages/material-ui/src/NoSsr/index.js | 2 +- .../src/OutlinedInput/NotchedOutline.test.js | 2 +- .../src/OutlinedInput/OutlinedInput.d.ts | 2 +- .../src/OutlinedInput/OutlinedInput.js | 4 +- .../src/OutlinedInput/OutlinedInput.test.js | 4 +- .../src/OutlinedInput/outlinedInputClasses.ts | 2 +- .../material-ui/src/OverridableComponent.d.ts | 2 +- .../src/Pagination/Pagination.d.ts | 6 +- .../material-ui/src/Pagination/Pagination.js | 4 +- .../src/Pagination/Pagination.test.js | 4 +- .../src/Pagination/paginationClasses.ts | 2 +- .../src/PaginationItem/PaginationItem.d.ts | 6 +- .../src/PaginationItem/PaginationItem.js | 4 +- .../src/PaginationItem/PaginationItem.test.js | 2 +- .../PaginationItem/paginationItemClasses.ts | 2 +- packages/material-ui/src/Paper/Paper.d.ts | 4 +- packages/material-ui/src/Paper/Paper.js | 6 +- packages/material-ui/src/Paper/Paper.spec.tsx | 2 +- packages/material-ui/src/Paper/Paper.test.js | 4 +- .../material-ui/src/Paper/paperClasses.ts | 2 +- packages/material-ui/src/Popover/Popover.d.ts | 2 +- packages/material-ui/src/Popover/Popover.js | 4 +- .../material-ui/src/Popover/Popover.test.js | 8 +- .../material-ui/src/Popover/popoverClasses.ts | 2 +- packages/material-ui/src/Popper/Popper.js | 2 +- .../material-ui/src/Popper/Popper.spec.tsx | 2 +- .../material-ui/src/Popper/Popper.test.js | 6 +- packages/material-ui/src/Portal/index.d.ts | 4 +- packages/material-ui/src/Portal/index.js | 2 +- packages/material-ui/src/Radio/Radio.d.ts | 4 +- packages/material-ui/src/Radio/Radio.js | 6 +- packages/material-ui/src/Radio/Radio.test.js | 6 +- .../material-ui/src/Radio/radioClasses.ts | 2 +- .../src/RadioGroup/RadioGroup.test.js | 6 +- packages/material-ui/src/Rating/Rating.d.ts | 4 +- packages/material-ui/src/Rating/Rating.js | 4 +- .../material-ui/src/Rating/Rating.test.js | 2 +- .../material-ui/src/Rating/ratingClasses.ts | 2 +- .../ScopedCssBaseline/ScopedCssBaseline.js | 2 +- .../ScopedCssBaseline.test.js | 2 +- .../scopedCssBaselineClasses.ts | 2 +- packages/material-ui/src/Select/Select.d.ts | 2 +- packages/material-ui/src/Select/Select.js | 4 +- .../material-ui/src/Select/Select.spec.tsx | 4 +- .../material-ui/src/Select/Select.test.js | 14 +- .../material-ui/src/Select/SelectInput.d.ts | 2 +- .../material-ui/src/Select/SelectInput.js | 6 +- .../material-ui/src/Select/selectClasses.ts | 2 +- .../material-ui/src/Skeleton/Skeleton.d.ts | 4 +- packages/material-ui/src/Skeleton/Skeleton.js | 4 +- .../material-ui/src/Skeleton/Skeleton.test.js | 2 +- .../src/Skeleton/skeletonClasses.ts | 2 +- packages/material-ui/src/Slide/Slide.js | 2 +- packages/material-ui/src/Slide/Slide.test.js | 4 +- packages/material-ui/src/Slider/Slider.d.ts | 6 +- packages/material-ui/src/Slider/Slider.js | 8 +- .../material-ui/src/Slider/Slider.spec.tsx | 2 +- .../material-ui/src/Slider/Slider.test.js | 6 +- .../material-ui/src/Snackbar/Snackbar.d.ts | 2 +- packages/material-ui/src/Snackbar/Snackbar.js | 2 +- .../material-ui/src/Snackbar/Snackbar.test.js | 2 +- .../src/Snackbar/snackbarClasses.ts | 2 +- .../src/SnackbarContent/SnackbarContent.d.ts | 2 +- .../src/SnackbarContent/SnackbarContent.js | 4 +- .../SnackbarContent/SnackbarContent.test.js | 6 +- .../SnackbarContent/snackbarContentClasses.ts | 2 +- .../material-ui/src/SpeedDial/SpeedDial.d.ts | 2 +- .../material-ui/src/SpeedDial/SpeedDial.js | 2 +- .../src/SpeedDial/SpeedDial.test.js | 8 +- .../src/SpeedDial/speedDialClasses.ts | 2 +- .../src/SpeedDialAction/SpeedDialAction.d.ts | 2 +- .../src/SpeedDialAction/SpeedDialAction.js | 4 +- .../SpeedDialAction/SpeedDialAction.test.js | 10 +- .../SpeedDialAction/speedDialActionClasses.ts | 2 +- .../src/SpeedDialIcon/SpeedDialIcon.d.ts | 2 +- .../src/SpeedDialIcon/SpeedDialIcon.js | 2 +- .../src/SpeedDialIcon/SpeedDialIcon.test.js | 4 +- .../src/SpeedDialIcon/speedDialIconClasses.ts | 2 +- packages/material-ui/src/Stack/Stack.d.ts | 2 +- packages/material-ui/src/Stack/Stack.js | 4 +- packages/material-ui/src/Stack/Stack.test.js | 6 +- packages/material-ui/src/Step/Step.d.ts | 2 +- packages/material-ui/src/Step/Step.js | 4 +- packages/material-ui/src/Step/Step.test.js | 8 +- packages/material-ui/src/Step/stepClasses.ts | 2 +- .../src/StepButton/StepButton.d.ts | 2 +- .../material-ui/src/StepButton/StepButton.js | 2 +- .../src/StepButton/StepButton.test.js | 8 +- .../src/StepButton/stepButtonClasses.ts | 2 +- .../src/StepConnector/StepConnector.d.ts | 2 +- .../src/StepConnector/StepConnector.js | 2 +- .../src/StepConnector/StepConnector.test.js | 6 +- .../src/StepConnector/stepConnectorClasses.ts | 2 +- .../src/StepContent/StepContent.d.ts | 2 +- .../src/StepContent/StepContent.js | 2 +- .../src/StepContent/StepContent.test.js | 8 +- .../src/StepContent/stepContentClasses.ts | 2 +- .../material-ui/src/StepIcon/StepIcon.d.ts | 2 +- packages/material-ui/src/StepIcon/StepIcon.js | 2 +- .../material-ui/src/StepIcon/StepIcon.test.js | 2 +- .../src/StepIcon/stepIconClasses.ts | 2 +- .../material-ui/src/StepLabel/StepLabel.d.ts | 2 +- .../material-ui/src/StepLabel/StepLabel.js | 2 +- .../src/StepLabel/StepLabel.test.js | 10 +- .../src/StepLabel/stepLabelClasses.ts | 2 +- packages/material-ui/src/Stepper/Stepper.d.ts | 2 +- packages/material-ui/src/Stepper/Stepper.js | 4 +- .../material-ui/src/Stepper/Stepper.test.tsx | 10 +- .../material-ui/src/Stepper/stepperClasses.ts | 2 +- .../src/StyledEngineProvider/index.d.ts | 4 +- .../src/StyledEngineProvider/index.js | 2 +- packages/material-ui/src/SvgIcon/SvgIcon.d.ts | 4 +- packages/material-ui/src/SvgIcon/SvgIcon.js | 2 +- .../material-ui/src/SvgIcon/SvgIcon.test.js | 2 +- .../material-ui/src/SvgIcon/svgIconClasses.ts | 2 +- .../src/SwipeableDrawer/SwipeableDrawer.js | 6 +- .../SwipeableDrawer/SwipeableDrawer.test.js | 6 +- packages/material-ui/src/Switch/Switch.d.ts | 4 +- packages/material-ui/src/Switch/Switch.js | 6 +- .../material-ui/src/Switch/Switch.test.js | 4 +- .../material-ui/src/Switch/switchClasses.ts | 2 +- packages/material-ui/src/Tab/Tab.d.ts | 2 +- packages/material-ui/src/Tab/Tab.js | 2 +- packages/material-ui/src/Tab/Tab.test.js | 4 +- packages/material-ui/src/Tab/tabClasses.ts | 2 +- .../src/TabScrollButton/TabScrollButton.d.ts | 2 +- .../src/TabScrollButton/TabScrollButton.js | 2 +- .../TabScrollButton/TabScrollButton.test.js | 4 +- .../TabScrollButton/tabScrollButtonClasses.ts | 2 +- packages/material-ui/src/Table/Table.d.ts | 4 +- packages/material-ui/src/Table/Table.js | 2 +- packages/material-ui/src/Table/Table.test.js | 2 +- .../material-ui/src/Table/tableClasses.ts | 2 +- .../material-ui/src/TableBody/TableBody.d.ts | 2 +- .../material-ui/src/TableBody/TableBody.js | 2 +- .../src/TableBody/TableBody.test.js | 2 +- .../src/TableBody/tableBodyClasses.ts | 2 +- .../material-ui/src/TableCell/TableCell.d.ts | 2 +- .../material-ui/src/TableCell/TableCell.js | 4 +- .../src/TableCell/TableCell.test.js | 2 +- .../src/TableCell/tableCellClasses.ts | 2 +- .../src/TableContainer/TableContainer.d.ts | 2 +- .../src/TableContainer/TableContainer.js | 2 +- .../src/TableContainer/TableContainer.test.js | 2 +- .../TableContainer/tableContainerClasses.ts | 2 +- .../src/TableFooter/TableFooter.d.ts | 2 +- .../src/TableFooter/TableFooter.js | 2 +- .../src/TableFooter/TableFooter.test.js | 2 +- .../src/TableFooter/tableFooterClasses.ts | 2 +- .../material-ui/src/TableHead/TableHead.d.ts | 2 +- .../material-ui/src/TableHead/TableHead.js | 2 +- .../src/TableHead/TableHead.test.js | 2 +- .../src/TableHead/tableHeadClasses.ts | 2 +- .../src/TablePagination/TablePagination.d.ts | 2 +- .../src/TablePagination/TablePagination.js | 4 +- .../TablePagination/TablePagination.spec.tsx | 2 +- .../TablePagination/TablePagination.test.js | 10 +- .../TablePagination/tablePaginationClasses.ts | 2 +- .../material-ui/src/TableRow/TableRow.d.ts | 2 +- packages/material-ui/src/TableRow/TableRow.js | 4 +- .../material-ui/src/TableRow/TableRow.test.js | 2 +- .../src/TableRow/tableRowClasses.ts | 2 +- .../src/TableSortLabel/TableSortLabel.d.ts | 2 +- .../src/TableSortLabel/TableSortLabel.js | 2 +- .../src/TableSortLabel/TableSortLabel.test.js | 6 +- .../TableSortLabel/tableSortLabelClasses.ts | 2 +- packages/material-ui/src/Tabs/Tabs.d.ts | 2 +- packages/material-ui/src/Tabs/Tabs.js | 4 +- packages/material-ui/src/Tabs/Tabs.spec.tsx | 2 +- packages/material-ui/src/Tabs/Tabs.test.js | 6 +- packages/material-ui/src/Tabs/tabsClasses.ts | 2 +- .../material-ui/src/TextField/TextField.d.ts | 4 +- .../material-ui/src/TextField/TextField.js | 4 +- .../src/TextField/TextField.spec.tsx | 4 +- .../src/TextField/TextField.test.js | 10 +- .../src/TextField/textFieldClasses.ts | 2 +- .../TextareaAutosize/TextareaAutosize.test.js | 2 +- .../src/ToggleButton/ToggleButton.d.ts | 4 +- .../src/ToggleButton/ToggleButton.js | 2 +- .../src/ToggleButton/ToggleButton.test.js | 4 +- .../src/ToggleButton/toggleButtonClasses.ts | 2 +- .../ToggleButtonGroup/ToggleButtonGroup.d.ts | 4 +- .../ToggleButtonGroup/ToggleButtonGroup.js | 2 +- .../ToggleButtonGroup.test.js | 4 +- .../toggleButtonGroupClasses.ts | 2 +- packages/material-ui/src/Toolbar/Toolbar.d.ts | 4 +- packages/material-ui/src/Toolbar/Toolbar.js | 2 +- .../material-ui/src/Toolbar/Toolbar.test.js | 2 +- .../material-ui/src/Toolbar/toolbarClasses.ts | 2 +- packages/material-ui/src/Tooltip/Tooltip.d.ts | 2 +- packages/material-ui/src/Tooltip/Tooltip.js | 6 +- .../material-ui/src/Tooltip/Tooltip.test.js | 2 +- .../material-ui/src/Tooltip/tooltipClasses.ts | 2 +- .../src/Typography/Typography.d.ts | 4 +- .../material-ui/src/Typography/Typography.js | 4 +- .../src/Typography/Typography.test.js | 2 +- .../src/Typography/typography.spec.tsx | 2 +- .../src/Typography/typographyClasses.ts | 2 +- .../src/Unstable_TrapFocus/index.d.ts | 4 +- .../src/Unstable_TrapFocus/index.js | 2 +- packages/material-ui/src/Zoom/Zoom.js | 2 +- packages/material-ui/src/Zoom/Zoom.test.js | 2 +- .../material-ui/src/colors/colors.spec.tsx | 2 +- packages/material-ui/src/index.d.ts | 6 +- packages/material-ui/src/index.js | 2 +- .../material-ui/src/internal/SwitchBase.js | 4 +- .../src/internal/svg-icons/README.md | 2 +- .../src/internal/switchBaseClasses.ts | 2 +- packages/material-ui/src/locale/index.ts | 2 +- .../material-ui/src/styles/ThemeProvider.d.ts | 2 +- .../material-ui/src/styles/ThemeProvider.js | 2 +- .../material-ui/src/styles/adaptV4Theme.d.ts | 2 +- .../material-ui/src/styles/adaptV4Theme.js | 2 +- .../src/styles/adaptV4Theme.test.js | 2 +- .../material-ui/src/styles/createMixins.d.ts | 2 +- .../src/styles/createMixins.spec.ts | 2 +- .../src/styles/createMixins.test.js | 2 +- .../src/styles/createMuiStrictModeTheme.js | 2 +- .../material-ui/src/styles/createPalette.js | 8 +- .../src/styles/createPalette.spec.ts | 6 +- .../src/styles/createPalette.test.js | 2 +- .../material-ui/src/styles/createStyles.js | 4 +- .../material-ui/src/styles/createTheme.d.ts | 4 +- .../material-ui/src/styles/createTheme.js | 8 +- .../src/styles/createTheme.spec.ts | 2 +- .../src/styles/createTransitions.test.js | 2 +- .../src/styles/createTypography.js | 2 +- .../src/styles/createTypography.spec.ts | 4 +- packages/material-ui/src/styles/index.d.ts | 6 +- packages/material-ui/src/styles/index.js | 6 +- packages/material-ui/src/styles/makeStyles.js | 6 +- .../material-ui/src/styles/overrides.d.ts | 2 +- .../src/styles/responsiveFontSizes.d.ts | 2 +- .../src/styles/responsiveFontSizes.js | 2 +- .../src/styles/responsiveFontSizes.test.js | 2 +- packages/material-ui/src/styles/styled.d.ts | 2 +- packages/material-ui/src/styles/styled.js | 2 +- .../material-ui/src/styles/styled.spec.tsx | 2 +- packages/material-ui/src/styles/useTheme.js | 2 +- .../material-ui/src/styles/useThemeProps.js | 2 +- .../src/styles/useThemeProps.spec.ts | 4 +- packages/material-ui/src/styles/variants.d.ts | 2 +- packages/material-ui/src/styles/withStyles.js | 6 +- packages/material-ui/src/styles/withTheme.js | 6 +- .../src/useAutocomplete/useAutocomplete.d.ts | 4 +- .../src/useAutocomplete/useAutocomplete.js | 4 +- .../src/useMediaQuery/useMediaQuery.js | 2 +- .../src/useMediaQuery/useMediaQuery.test.js | 4 +- .../src/usePagination/usePagination.js | 2 +- .../src/usePagination/usePagination.test.js | 2 +- .../useScrollTrigger/useScrollTrigger.test.js | 6 +- .../material-ui/src/utils/capitalize.d.ts | 2 +- packages/material-ui/src/utils/capitalize.js | 2 +- .../src/utils/createChainedFunction.d.ts | 2 +- .../src/utils/createChainedFunction.js | 2 +- .../material-ui/src/utils/createSvgIcon.d.ts | 2 +- .../material-ui/src/utils/createSvgIcon.js | 2 +- packages/material-ui/src/utils/debounce.d.ts | 2 +- packages/material-ui/src/utils/debounce.js | 2 +- .../src/utils/deprecatedPropType.d.ts | 2 +- .../src/utils/deprecatedPropType.js | 2 +- .../material-ui/src/utils/getScrollbarSize.ts | 2 +- .../material-ui/src/utils/isMuiElement.d.ts | 2 +- .../material-ui/src/utils/isMuiElement.js | 2 +- .../material-ui/src/utils/ownerDocument.ts | 2 +- packages/material-ui/src/utils/ownerWindow.ts | 2 +- .../src/utils/requirePropFactory.d.ts | 2 +- .../src/utils/requirePropFactory.js | 2 +- packages/material-ui/src/utils/scrollLeft.js | 2 +- packages/material-ui/src/utils/setRef.ts | 2 +- .../src/utils/unsupportedProp.d.ts | 2 +- .../material-ui/src/utils/unsupportedProp.js | 2 +- .../material-ui/src/utils/useControlled.d.ts | 2 +- .../material-ui/src/utils/useControlled.js | 2 +- .../src/utils/useEnhancedEffect.d.ts | 2 +- .../src/utils/useEnhancedEffect.js | 2 +- .../src/utils/useEventCallback.d.ts | 2 +- .../material-ui/src/utils/useEventCallback.js | 2 +- .../material-ui/src/utils/useForkRef.d.ts | 2 +- packages/material-ui/src/utils/useForkRef.js | 2 +- packages/material-ui/src/utils/useId.d.ts | 2 +- packages/material-ui/src/utils/useId.js | 2 +- .../src/utils/useIsFocusVisible.d.ts | 2 +- .../src/utils/useIsFocusVisible.js | 2 +- .../integration/DialogIntegration.test.js | 4 +- .../material-ui/test/integration/Menu.test.js | 6 +- .../test/integration/MenuList.test.js | 6 +- .../test/integration/NestedMenu.test.js | 4 +- .../integration/PopperChildrenLayout.test.js | 12 +- .../test/integration/Select.test.js | 10 +- .../test/integration/TableCell.test.js | 12 +- .../test/integration/TableRow.test.js | 6 +- .../typescript/OverridableComponent.spec.tsx | 4 +- .../typescript/color-palette-prop.spec.tsx | 4 +- .../test/typescript/colors.spec.ts | 2 +- .../test/typescript/components.spec.tsx | 14 +- .../test/typescript/hoc-interop.spec.tsx | 6 +- .../moduleAugmentation/appBarProps.spec.tsx | 4 +- .../badgeCustomProps.spec.tsx | 6 +- .../breakpointsOverrides.spec.tsx | 8 +- .../buttonCustomProps.spec.tsx | 6 +- .../moduleAugmentation/paletteColors.spec.ts | 4 +- .../moduleAugmentation/progressProps.spec.tsx | 6 +- .../moduleAugmentation/systemTheme.spec.tsx | 2 +- .../textFieldCustomProps.spec.tsx | 12 +- .../themeComponents.spec.ts | 6 +- .../typographyVariants.spec.tsx | 8 +- .../test/typescript/styles.spec.tsx | 6 +- packages/material-ui/test/umd/run.js | 2 +- scripts/build.js | 4 +- scripts/buildColorTypes.js | 2 +- scripts/buildTypes.js | 8 +- scripts/copy-files.js | 6 +- scripts/sizeSnapshot/webpack.config.js | 43 +- test/bundling/README.md | 4 +- .../fixtures/create-react-app/package.json | 14 +- test/bundling/fixtures/esbuild/package.json | 14 +- test/bundling/fixtures/gatsby/package.json | 14 +- .../fixtures/gatsby/src/pages/development.js | 4 +- .../fixtures/next-webpack4/package.json | 14 +- .../next-webpack4/pages/development.js | 4 +- .../fixtures/next-webpack5/package.json | 14 +- .../next-webpack5/pages/development.js | 4 +- .../pages/next-webpack.fixture.js | 518 ++++++------ .../bundling/fixtures/node-esm/development.js | 2 +- test/bundling/fixtures/node-esm/package.json | 14 +- test/bundling/fixtures/snowpack/package.json | 14 +- test/bundling/fixtures/vite/package.json | 14 +- .../bundling/scripts/fixtureTemplateValues.js | 736 +++++++++--------- test/bundling/scripts/packages.js | 12 +- test/bundling/scripts/useBuildFromSource.js | 6 +- test/e2e/fixtures/Rating/BasicRating.tsx | 2 +- .../DefaultOpenLazyTrapFocus.tsx | 2 +- .../Unstable_TrapFocus/OpenTrapFocus.tsx | 2 +- test/regressions/TestViewer.js | 4 +- .../Alert/MultilineAlertWithAction.js | 6 +- .../fixtures/AppBar/AppBarColorTransparent.js | 4 +- .../Autocomplete/StandardAutocomplete.js | 4 +- .../fixtures/Button/FontSvgIcons.js | 8 +- .../fixtures/Button/IconLabelButtons.js | 6 +- .../fixtures/Button/MultilineButton.js | 2 +- .../CalendarPicker/CalendarPickerYearOnly.tsx | 6 +- .../fixtures/Dialog/AlertDialog.js | 12 +- test/regressions/fixtures/Grid/StressGrid.js | 6 +- .../fixtures/Grid/StressNestedGrid.js | 6 +- .../regressions/fixtures/Input/InputLabels.js | 4 +- test/regressions/fixtures/Input/Inputs.js | 4 +- .../LinearProgress/BufferLinearProgress.js | 2 +- .../DeterminateLinearProgress.js | 2 +- .../ListSubheader/SimpleListSubheader.js | 2 +- test/regressions/fixtures/Menu/LongMenu.js | 10 +- .../fixtures/Menu/MenuContentAnchors.js | 10 +- .../fixtures/Menu/SimpleMenuList.js | 6 +- .../fixtures/Radio/RadioIconSizeSmall.js | 4 +- .../fixtures/Rating/FocusVisibleRating.js | 2 +- .../Rating/PreciseFocusVisibleRating.js | 2 +- .../fixtures/Select/SelectAlignment.js | 12 +- .../fixtures/Select/SelectChips.js | 6 +- .../fixtures/Select/SelectMissingValue.js | 4 +- .../fixtures/Select/SelectOverflow.js | 4 +- .../fixtures/Skeleton/SkeletonChildren.js | 8 +- .../fixtures/Slider/SimpleDisabledSlider.js | 2 +- .../fixtures/SpeedDial/Directions.js | 10 +- .../fixtures/SvgIcon/CustomColorSvgIcon.js | 4 +- .../fixtures/Table/DenseCheckboxTable.js | 16 +- .../fixtures/Tabs/RTLVerticalTabs.js | 8 +- .../TextField/BaselineAlignTextField.js | 6 +- .../FilledHiddenLabelInputAdornment.js | 4 +- .../FilledMultilineHiddenLabelTextField.js | 2 +- .../fixtures/TextField/MultilineTextField.js | 2 +- .../OutlinedHiddenRequiredIndicator.js | 2 +- .../regressions/fixtures/Textarea/Textarea.js | 2 +- .../fixtures/Tooltip/PositionedTooltips.js | 8 +- .../fixtures/Tooltip/PositionedTooltipsRtl.js | 10 +- .../pickers/UncontrolledDateTimePicker.tsx | 10 +- test/regressions/manual/icons/AllIcons.js | 2 +- test/regressions/webpack.config.js | 10 +- test/utils/describeConformance.js | 4 +- test/utils/describeConformanceUnstyled.tsx | 2 +- tsconfig.json | 38 +- tslint.json | 2 +- webpackBaseConfig.js | 28 +- yarn.lock | 16 + 3136 files changed, 11028 insertions(+), 11170 deletions(-) diff --git a/.circleci/config.yml b/.circleci/config.yml index c2cab0f0094b14..0639d96a2c131d 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -157,8 +157,8 @@ jobs: if [ $FOLDER_COMMIT = $LATEST_COMMIT ]; then echo "changes, let's run the tests" - yarn workspace @material-ui/icons build:typings - yarn workspace @material-ui/icons test:built-typings + yarn workspace @mui/icons-material build:typings + yarn workspace @mui/icons-material test:built-typings else echo "no changes" fi @@ -248,8 +248,8 @@ jobs: - run: name: Test module augmenation command: | - yarn workspace @material-ui/core typescript:module-augmentation - yarn workspace @material-ui/unstyled typescript:module-augmentation + yarn workspace @mui/material typescript:module-augmentation + yarn workspace @mui/core typescript:module-augmentation - restore_cache: name: Restore generated declaration files @@ -367,8 +367,8 @@ jobs: name: yarn test:e2e command: yarn test:e2e - run: - name: Can we generate the @material-ui/core umd build? - command: yarn workspace @material-ui/core build:umd + name: Can we generate the @mui/material umd build? + command: yarn workspace @mui/material build:umd - run: name: Test umd release command: yarn test:umd @@ -422,7 +422,7 @@ jobs: - install_js - run: name: Build packages for fixtures - command: yarn lerna run --scope "@material-ui/*" build + command: yarn lerna run --scope "@mui/*" build - persist_to_workspace: root: packages paths: diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json index 6dae83fb6a85b5..18b168dee2ee17 100644 --- a/.codesandbox/ci.json +++ b/.codesandbox/ci.json @@ -17,18 +17,18 @@ "packages/material-ui-styled-engine-sc" ], "publishDirectory": { - "@material-ui/codemod": "packages/material-ui-codemod/build", - "@material-ui/core": "packages/material-ui/build", - "@material-ui/icons": "packages/material-ui-icons/build", - "@material-ui/lab": "packages/material-ui-lab/build", - "@material-ui/styles": "packages/material-ui-styles/build", - "@material-ui/styled-engine": "packages/material-ui-styled-engine/build", - "@material-ui/styled-engine-sc": "packages/material-ui-styled-engine-sc/build", - "@material-ui/system": "packages/material-ui-system/build", - "@material-ui/private-theming": "packages/material-ui-private-theming/build", - "@material-ui/types": "packages/material-ui-types/build", - "@material-ui/utils": "packages/material-ui-utils/build", - "@material-ui/unstyled": "packages/material-ui-unstyled/build" + "@mui/codemod": "packages/material-ui-codemod/build", + "@mui/material": "packages/material-ui/build", + "@mui/icons-material": "packages/material-ui-icons/build", + "@mui/lab": "packages/material-ui-lab/build", + "@mui/styles": "packages/material-ui-styles/build", + "@mui/styled-engine": "packages/material-ui-styled-engine/build", + "@mui/styled-engine-sc": "packages/material-ui-styled-engine-sc/build", + "@mui/system": "packages/material-ui-system/build", + "@mui/private-theming": "packages/material-ui-private-theming/build", + "@mui/types": "packages/material-ui-types/build", + "@mui/utils": "packages/material-ui-utils/build", + "@mui/core": "packages/material-ui-unstyled/build" }, "sandboxes": [ "material-ui-issue-dh2yh", diff --git a/.eslintrc.js b/.eslintrc.js index 820908d53f1d0e..9a8fd3fe4ed11f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -5,7 +5,7 @@ const forbidTopLevelMessage = [ 'See https://github.com/mui-org/material-ui/pull/24147 for the kind of win it can unlock.', ].join('\n'); // This only applies to packages published from this monorepo. -// If you build a library around `@material-ui/core` you can safely use `createStyles` without running into the same issue as we are. +// If you build a library around `@mui/material` you can safely use `createStyles` without running into the same issue as we are. const forbidCreateStylesMessage = 'Use `MuiStyles` instead if the styles are exported. Otherwise use `as const` assertions. ' + '`createStyles` will lead to inlined, at-compile-time-resolved type-imports. ' + @@ -63,19 +63,19 @@ module.exports = { 'error', { patterns: [ - '@material-ui/*/*/*', + '@mui/*/*/*', // Begin block: Packages with files instead of packages in the top level // Importing from the top level pulls in CommonJS instead of ES modules // Allowing /icons as to reduce cold-start of dev builds significantly. // There's nothing to tree-shake when importing from /icons this way: - // '@material-ui/icons/*/', - '@material-ui/system/*', - '@material-ui/utils/*', + // '@mui/icons-material/*/', + '@mui/system/*', + '@mui/utils/*', // End block // Macros are fine since their import path is transpiled away - '!@material-ui/utils/macros', - '@material-ui/utils/macros/*', - '!@material-ui/utils/macros/*.macro', + '!@mui/utils/macros', + '@mui/utils/macros/*', + '!@mui/utils/macros/*.macro', ], }, ], @@ -262,9 +262,9 @@ module.exports = { { patterns: [ // Allow deeper imports for TypeScript types. TODO? - '@material-ui/*/*/*/*', + '@mui/*/*/*/*', // Macros are fine since they're transpiled into something else - '!@material-ui/utils/macros/*.macro', + '!@mui/utils/macros/*.macro', ], }, ], @@ -281,25 +281,25 @@ module.exports = { { paths: [ { - name: '@material-ui/core/styles', + name: '@mui/material/styles', importNames: ['createStyles'], message: forbidCreateStylesMessage, }, { - name: '@material-ui/styles', + name: '@mui/styles', importNames: ['createStyles'], message: forbidCreateStylesMessage, }, { - name: '@material-ui/styles/createStyles', + name: '@mui/styles/createStyles', message: forbidCreateStylesMessage, }, ], patterns: [ // Allow deeper imports for TypeScript types. TODO? - '@material-ui/*/*/*/*', + '@mui/*/*/*/*', // Macros are fine since they're transpiled into something else - '!@material-ui/utils/macros/*.macro', + '!@mui/utils/macros/*.macro', ], }, ], @@ -360,11 +360,11 @@ module.exports = { { paths: [ { - name: '@material-ui/core', + name: '@mui/material', message: forbidTopLevelMessage, }, { - name: '@material-ui/lab', + name: '@mui/lab', message: forbidTopLevelMessage, }, ], diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 93ad1fdd35f2ab..b4c3da221fd13a 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -4,5 +4,5 @@ github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, u patreon: # Replace with a single Patreon username open_collective: material-ui ko_fi: # Replace with a single Ko-fi username -tidelift: npm/@material-ui/core +tidelift: npm/@mui/material custom: # Replace with a single custom sponsorship URL diff --git a/.github/ISSUE_TEMPLATE/1.bug.md b/.github/ISSUE_TEMPLATE/1.bug.md index 5b15f2e1a71811..3d4e3c53367941 100644 --- a/.github/ISSUE_TEMPLATE/1.bug.md +++ b/.github/ISSUE_TEMPLATE/1.bug.md @@ -54,14 +54,14 @@ Steps: ## Your Environment 🌎
- `npx @material-ui/envinfo` + `npx @mui/envinfo` ``` Don't forget to mention which browser you used. - Output from `npx @material-ui/envinfo` goes here. + Output from `npx @mui/envinfo` goes here. ```
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 3b7bd56545f4ff..91b8d5c8b6b5b2 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -269,10 +269,10 @@ index 791a7da1f4..a5db13b414 100644 @@ -61,7 +61,7 @@ "dependencies": { "@babel/runtime": "^7.4.4", - "@material-ui/styled-engine": "^5.0.0-alpha.16", -- "@material-ui/core": "^5.0.0-alpha.15", -+ "@material-ui/core": "https://pkg.csb.dev/mui-org/material-ui/commit/371c952b/@material-ui/core", - "@material-ui/system": "^5.0.0-alpha.16", + "@mui/styled-engine": "^5.0.0-alpha.16", +- "@mui/material": "^5.0.0-alpha.15", ++ "@mui/material": "https://pkg.csb.dev/mui-org/material-ui/commit/371c952b/@mui/material", + "@mui/system": "^5.0.0-alpha.16", ``` Alternatively, you can open the Netlify preview of the documentation, and open any demo in Codesandbox. The documentation automatically configures the dependencies to use the preview packages. diff --git a/README.md b/README.md index 4c6086ae5c51d4..321d3d2a5c19c2 100644 --- a/README.md +++ b/README.md @@ -9,9 +9,9 @@ Quickly build beautiful [React](https://reactjs.org/) apps. Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with [Material Design](https://material.io/design/introduction/). [![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui-org/material-ui/blob/master/LICENSE) -[![npm latest package](https://img.shields.io/npm/v/@material-ui/core/latest.svg)](https://www.npmjs.com/package/@material-ui/core) -[![npm next package](https://img.shields.io/npm/v/@material-ui/core/next.svg)](https://www.npmjs.com/package/@material-ui/core) -[![npm downloads](https://img.shields.io/npm/dm/@material-ui/core.svg)](https://www.npmjs.com/package/@material-ui/core) +[![npm latest package](https://img.shields.io/npm/v/@mui/material/latest.svg)](https://www.npmjs.com/package/@mui/material) +[![npm next package](https://img.shields.io/npm/v/@mui/material/next.svg)](https://www.npmjs.com/package/@mui/material) +[![npm downloads](https://img.shields.io/npm/dm/@mui/material.svg)](https://www.npmjs.com/package/@mui/material) [![CircleCI](https://img.shields.io/circleci/project/github/mui-org/material-ui/next.svg)](https://app.circleci.com/pipelines/github/mui-org/material-ui?branch=next) [![Coverage Status](https://img.shields.io/codecov/c/github/mui-org/material-ui/next.svg)](https://codecov.io/gh/mui-org/material-ui/branch/next) [![Follow on Twitter](https://img.shields.io/twitter/follow/MaterialUI.svg?label=follow+Material-UI)](https://twitter.com/MaterialUI) @@ -24,16 +24,16 @@ Quickly build beautiful [React](https://reactjs.org/) apps. Material-UI is a sim ## Installation -Material-UI is available as an [npm package](https://www.npmjs.com/package/@material-ui/core). +Material-UI is available as an [npm package](https://www.npmjs.com/package/@mui/material). **[Stable channel v4](https://material-ui.com/)** ```sh // with npm -npm install @material-ui/core +npm install @mui/material // with yarn -yarn add @material-ui/core +yarn add @mui/material ``` ⚠️ All ongoing work has moved to v5. The development of v4 is limited to important bug fixes, security patches and easing the upgrade path to v5. @@ -42,10 +42,10 @@ yarn add @material-ui/core ```sh // with npm -npm install @material-ui/core@next @emotion/react @emotion/styled +npm install @mui/material@next @emotion/react @emotion/styled // with yarn -yarn add @material-ui/core@next @emotion/react @emotion/styled +yarn add @mui/material@next @emotion/react @emotion/styled ```
@@ -107,7 +107,7 @@ Here is a quick example to get you started, **it's all you need**: ```jsx import * as React from 'react'; import ReactDOM from 'react-dom'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; function App() { return ; diff --git a/TYPESCRIPT_CONVENTION.md b/TYPESCRIPT_CONVENTION.md index e65fba6b6f5283..3bd99581260f4b 100644 --- a/TYPESCRIPT_CONVENTION.md +++ b/TYPESCRIPT_CONVENTION.md @@ -2,7 +2,7 @@ ## Component -> **Public components** are considered all components exported from `@material-ui/core` or `@material-ui/lab`. +> **Public components** are considered all components exported from `@mui/material` or `@mui/lab`. > > **Internal components** are considered all components that are not exported from the packages, but only used in some public component. There is no need to have `sx` prop on these components diff --git a/azure-pipelines.yml b/azure-pipelines.yml index c7839fcbc8b59e..737f5a37c83dba 100644 --- a/azure-pipelines.yml +++ b/azure-pipelines.yml @@ -70,15 +70,15 @@ jobs: displayName: Cache node_modules/.cache - script: | - yarn lerna run --ignore @material-ui/icons --parallel --scope "@material-ui/*" build - displayName: 'build @material-ui packages' + yarn lerna run --ignore @mui/icons-material --parallel --scope "@mui/*" build + displayName: 'build @mui packages' - script: | cd packages/material-ui/build npm version 0.0.0-canary.$(Build.SourceVersion) --no-git-tag-version npm pack - mv material-ui-core-0.0.0-canary.$(Build.SourceVersion).tgz ../../../material-ui-core.tgz - displayName: 'create @material-ui/core canary distributable' + mv mui-material-0.0.0-canary.$(Build.SourceVersion).tgz ../../../mui-material.tgz + displayName: 'create @mui/material canary distributable' - task: S3Upload@1 inputs: @@ -96,7 +96,7 @@ jobs: - task: PublishPipelineArtifact@1 inputs: artifactName: 'canaries' - targetPath: 'material-ui-core.tgz' + targetPath: 'mui-material.tgz' - script: | yarn size:snapshot diff --git a/babel.config.js b/babel.config.js index 7c3ba507ed0bee..cf4d4ec4a91a7c 100644 --- a/babel.config.js +++ b/babel.config.js @@ -9,17 +9,17 @@ function resolveAliasPath(relativeToBabelConf) { } const defaultAlias = { - '@material-ui/core': resolveAliasPath('./packages/material-ui/src'), - '@material-ui/docs': resolveAliasPath('./packages/material-ui-docs/src'), - '@material-ui/icons': resolveAliasPath('./packages/material-ui-icons/lib'), - '@material-ui/lab': resolveAliasPath('./packages/material-ui-lab/src'), - '@material-ui/styled-engine': resolveAliasPath('./packages/material-ui-styled-engine/src'), - '@material-ui/styled-engine-sc': resolveAliasPath('./packages/material-ui-styled-engine-sc/src'), - '@material-ui/styles': resolveAliasPath('./packages/material-ui-styles/src'), - '@material-ui/system': resolveAliasPath('./packages/material-ui-system/src'), - '@material-ui/private-theming': resolveAliasPath('./packages/material-ui-private-theming/src'), - '@material-ui/unstyled': resolveAliasPath('./packages/material-ui-unstyled/src'), - '@material-ui/utils': resolveAliasPath('./packages/material-ui-utils/src'), + '@mui/material': resolveAliasPath('./packages/material-ui/src'), + '@mui/docs': resolveAliasPath('./packages/material-ui-docs/src'), + '@mui/icons-material': resolveAliasPath('./packages/material-ui-icons/lib'), + '@mui/lab': resolveAliasPath('./packages/material-ui-lab/src'), + '@mui/styled-engine': resolveAliasPath('./packages/material-ui-styled-engine/src'), + '@mui/styled-engine-sc': resolveAliasPath('./packages/material-ui-styled-engine-sc/src'), + '@mui/styles': resolveAliasPath('./packages/material-ui-styles/src'), + '@mui/system': resolveAliasPath('./packages/material-ui-system/src'), + '@mui/private-theming': resolveAliasPath('./packages/material-ui-private-theming/src'), + '@mui/core': resolveAliasPath('./packages/material-ui-unstyled/src'), + '@mui/utils': resolveAliasPath('./packages/material-ui-utils/src'), }; const productionPlugins = [ diff --git a/benchmark/browser/README.md b/benchmark/browser/README.md index 645f0eb4534359..580f128df80d7f 100644 --- a/benchmark/browser/README.md +++ b/benchmark/browser/README.md @@ -39,7 +39,7 @@ Box Theme-UI: 172 ±8% Box Chakra-UI: 115 ±8% -styled-components Box + @material-ui/system: +styled-components Box + @mui/system: 194 ±9% styled-components Box + styled-system: 162 ±10% diff --git a/benchmark/browser/scenarios/box-material-ui/index.js b/benchmark/browser/scenarios/box-material-ui/index.js index cf06ee1a35f311..bab403f14b7983 100644 --- a/benchmark/browser/scenarios/box-material-ui/index.js +++ b/benchmark/browser/scenarios/box-material-ui/index.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; export default function SxPropBoxMaterialUI() { return ( diff --git a/benchmark/browser/scenarios/make-styles/index.js b/benchmark/browser/scenarios/make-styles/index.js index 8a21c749f7c666..e3d30f8972667c 100644 --- a/benchmark/browser/scenarios/make-styles/index.js +++ b/benchmark/browser/scenarios/make-styles/index.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { createTheme } from '@material-ui/core/styles'; -import { makeStyles } from '@material-ui/styles'; +import { createTheme } from '@mui/material/styles'; +import { makeStyles } from '@mui/styles'; const defaultTheme = createTheme(); diff --git a/benchmark/browser/scenarios/styled-components-box-material-ui-system/index.js b/benchmark/browser/scenarios/styled-components-box-material-ui-system/index.js index cfc96e185a1fee..bc012f1602d9ee 100644 --- a/benchmark/browser/scenarios/styled-components-box-material-ui-system/index.js +++ b/benchmark/browser/scenarios/styled-components-box-material-ui-system/index.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import styledComponents, { ThemeProvider as StyledComponentsThemeProvider, } from 'styled-components'; -import { spacing, palette, typography, compose } from '@material-ui/system'; +import { spacing, palette, typography, compose } from '@mui/system'; const materialSystem = compose(palette, spacing, typography); const materialSystemTheme = createTheme(); @@ -20,7 +20,7 @@ export default function StyledComponentsBoxMaterialUISystem() { fontSize={['h6.fontSize', 'h4.fontSize', 'h3.fontSize']} p={[2, 3, 4]} > - @material-ui/system + @mui/system ))} diff --git a/benchmark/browser/scenarios/styled-components-box-styled-system/index.js b/benchmark/browser/scenarios/styled-components-box-styled-system/index.js index 5374c641a0b0a2..6ff8ec312101c3 100644 --- a/benchmark/browser/scenarios/styled-components-box-styled-system/index.js +++ b/benchmark/browser/scenarios/styled-components-box-styled-system/index.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import styledComponents, { ThemeProvider as StyledComponentsThemeProvider, } from 'styled-components'; diff --git a/benchmark/browser/scenarios/styled-emotion/index.js b/benchmark/browser/scenarios/styled-emotion/index.js index 522c57a1825cd8..3930c0ce789517 100644 --- a/benchmark/browser/scenarios/styled-emotion/index.js +++ b/benchmark/browser/scenarios/styled-emotion/index.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import emotionStyled from '@emotion/styled'; const Div = emotionStyled('div')( diff --git a/benchmark/browser/scenarios/styled-material-ui/index.js b/benchmark/browser/scenarios/styled-material-ui/index.js index ee204f35918192..35ecc347bf4dd4 100644 --- a/benchmark/browser/scenarios/styled-material-ui/index.js +++ b/benchmark/browser/scenarios/styled-material-ui/index.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; const Div = styled('div')( ({ theme }) => ` diff --git a/benchmark/browser/scenarios/styled-sc/index.js b/benchmark/browser/scenarios/styled-sc/index.js index eb6592cb75366b..6e6b599b94f4e3 100644 --- a/benchmark/browser/scenarios/styled-sc/index.js +++ b/benchmark/browser/scenarios/styled-sc/index.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import styledComponents, { ThemeProvider as StyledComponentsThemeProvider, } from 'styled-components'; diff --git a/benchmark/browser/scenarios/table-cell/index.js b/benchmark/browser/scenarios/table-cell/index.js index 498ef636936e86..da07963910c059 100644 --- a/benchmark/browser/scenarios/table-cell/index.js +++ b/benchmark/browser/scenarios/table-cell/index.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Table from '@material-ui/core/Table'; -import TableBody from '@material-ui/core/TableBody'; -import TableCell from '@material-ui/core/TableCell'; -import TableHead from '@material-ui/core/TableHead'; -import TableRow from '@material-ui/core/TableRow'; +import Table from '@mui/material/Table'; +import TableBody from '@mui/material/TableBody'; +import TableCell from '@mui/material/TableCell'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 }; const rows = Array.from(new Array(100)).map(() => data); diff --git a/benchmark/browser/scripts/benchmark.js b/benchmark/browser/scripts/benchmark.js index 64b0c0ae86573d..1c19bacf05dbcd 100644 --- a/benchmark/browser/scripts/benchmark.js +++ b/benchmark/browser/scripts/benchmark.js @@ -168,7 +168,7 @@ async function run() { name: 'React components', path: './components/index.js', }, - // Test that @material-ui/styled-engine doesn't add an signifiant overhead + // Test that @mui/styled-engine doesn't add an signifiant overhead { name: 'Styled Material-UI', path: './styled-material-ui/index.js', @@ -205,7 +205,7 @@ async function run() { }, // Test the system perf difference with alternatives { - name: 'styled-components Box + @material-ui/system', + name: 'styled-components Box + @mui/system', path: './styled-components-box-material-ui-system/index.js', }, { diff --git a/benchmark/package.json b/benchmark/package.json index 72751591740c99..2ce53740092a88 100644 --- a/benchmark/package.json +++ b/benchmark/package.json @@ -14,9 +14,9 @@ "@chakra-ui/system": "^1.7.2", "@emotion/react": "^11.4.1", "@emotion/styled": "^11.3.0", - "@material-ui/core": "5.0.0-beta.5", - "@material-ui/styles": "5.0.0-beta.5", - "@material-ui/system": "5.0.0-beta.5", + "@mui/material": "5.0.0-beta.5", + "@mui/styles": "5.0.0-beta.5", + "@mui/system": "5.0.0-beta.5", "@styled-system/css": "^5.1.5", "benchmark": "^2.1.4", "playwright": "^1.14.0", diff --git a/benchmark/server/README.md b/benchmark/server/README.md index 72237fe6814008..51981a93b859dc 100644 --- a/benchmark/server/README.md +++ b/benchmark/server/README.md @@ -1,6 +1,6 @@ # Material-UI benchmark -## `@material-ui/core` +## `@mui/material` _Synthetic benchmark_ @@ -15,7 +15,7 @@ ButtonBase disable ripple x 61,748 ops/sec ±0.35% (190 runs sampled) Markdown x 954 ops/sec ±1.35% (187 runs sampled) ``` -## `@material-ui/docs` +## `@mui/docs` _Synthetic benchmark_ @@ -26,7 +26,7 @@ Markdown x 946 ops/sec ±4.04% (176 runs sampled) MarkdownElement x 3,941 ops/sec ±5.53% (185 runs sampled) ``` -## `@material-ui/styles` +## `@mui/styles` _Synthetic benchmark_ @@ -44,7 +44,7 @@ EmotionServerCssButton x 43,701 ops/sec ±1.04% (190 runs sampled) Naked x 58,694 ops/sec ±0.86% (188 runs sampled) ``` -## `@material-ui/system` +## `@mui/system` _Synthetic benchmark_ @@ -53,7 +53,7 @@ yarn server:system @styled-system/css x 64,606 ops/sec ±0.45% (188 runs sampled) @chakra-ui/system/css x 126,272 ops/sec ±0.21% (191 runs sampled) -@material-ui/system styleFunctionSx x 40,867 ops/sec ±0.50% (191 runs sampled) +@mui/system styleFunctionSx x 40,867 ops/sec ±0.50% (191 runs sampled) ``` ## Real-world benchmark diff --git a/benchmark/server/scenarios/core.js b/benchmark/server/scenarios/core.js index 4226e57cc635ef..a5c225847f4936 100644 --- a/benchmark/server/scenarios/core.js +++ b/benchmark/server/scenarios/core.js @@ -2,8 +2,8 @@ import Benchmark from 'benchmark'; import * as React from 'react'; import ReactDOMServer from 'react-dom/server'; -import { StylesProvider } from '@material-ui/styles'; -import ButtonBase from '@material-ui/core/ButtonBase'; +import { StylesProvider } from '@mui/styles'; +import ButtonBase from '@mui/material/ButtonBase'; const suite = new Benchmark.Suite('core', { onError: (event) => { diff --git a/benchmark/server/scenarios/server.js b/benchmark/server/scenarios/server.js index 6cea96dbc8ad13..fd17fda30e3ed9 100644 --- a/benchmark/server/scenarios/server.js +++ b/benchmark/server/scenarios/server.js @@ -3,18 +3,18 @@ import express from 'express'; import * as React from 'react'; import ReactDOMServer from 'react-dom/server'; import { SheetsRegistry } from 'jss'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import { styled as materialStyled, StylesProvider, ThemeProvider, createGenerateClassName, -} from '@material-ui/styles'; -import { green, red } from '@material-ui/core/colors'; +} from '@mui/styles'; +import { green, red } from '@mui/material/colors'; import Pricing from 'docs/src/pages/getting-started/templates/pricing/Pricing'; -import { spacing, palette, unstable_styleFunctionSx as styleFunction } from '@material-ui/system'; -import Avatar from '@material-ui/core/Avatar'; -import Box from '@material-ui/core/Box'; +import { spacing, palette, unstable_styleFunctionSx as styleFunction } from '@mui/system'; +import Avatar from '@mui/material/Avatar'; +import Box from '@mui/material/Box'; const StyledFunction = materialStyled('div')(() => ({ color: 'blue', diff --git a/benchmark/server/scenarios/styles.js b/benchmark/server/scenarios/styles.js index 74924f8ad9c7e9..cbfc13bde79f39 100644 --- a/benchmark/server/scenarios/styles.js +++ b/benchmark/server/scenarios/styles.js @@ -7,9 +7,9 @@ import styledEmotion from '@emotion/styled'; import { css } from '@emotion/react'; import { renderStylesToString } from '@emotion/server'; import injectSheet, { JssProvider, SheetsRegistry } from 'react-jss'; -import { styled as styledMui, withStyles, makeStyles, StylesProvider } from '@material-ui/styles'; +import { styled as styledMui, withStyles, makeStyles, StylesProvider } from '@mui/styles'; import jss, { getDynamicStyles } from 'jss'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; const suite = new Benchmark.Suite('styles', { onError: (event) => { diff --git a/benchmark/server/scenarios/system.js b/benchmark/server/scenarios/system.js index e1fa44b86031b2..b652c6700584d0 100644 --- a/benchmark/server/scenarios/system.js +++ b/benchmark/server/scenarios/system.js @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import Benchmark from 'benchmark'; -import { unstable_styleFunctionSx as styleFunctionSx } from '@material-ui/system'; +import { unstable_styleFunctionSx as styleFunctionSx } from '@mui/system'; import styledSystemCss from '@styled-system/css'; -import { createTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; import { css as chakraCss } from '@chakra-ui/system'; const suite = new Benchmark.Suite('system', { @@ -50,7 +50,7 @@ suite })({ theme: styledSystemTheme }); }) // --- - .add('@material-ui/system styleFunctionSx', () => { + .add('@mui/system styleFunctionSx', () => { styleFunctionSx({ theme: materialSystemTheme, sx: { diff --git a/dangerfile.js b/dangerfile.js index 61dd76b1dd6705..2b0764c3149564 100644 --- a/dangerfile.js +++ b/dangerfile.js @@ -55,8 +55,8 @@ function createComparisonFilter(parsedThreshold, gzipThreshold) { } /** - * checks if the bundle is of a package e.b. `@material-ui/core` but not - * `@material-ui/core/Paper` + * checks if the bundle is of a package e.b. `@mui/material` but not + * `@mui/material/Paper` * @param {[string, any]} comparisonEntry */ function isPackageComparison(comparisonEntry) { diff --git a/docs/babel.config.js b/docs/babel.config.js index c9e98edcca5209..0ef32a1b2dbc29 100644 --- a/docs/babel.config.js +++ b/docs/babel.config.js @@ -14,19 +14,19 @@ function resolvePath(sourcePath, currentFile, opts) { } const alias = { - '@material-ui/core': '../packages/material-ui/src', - '@material-ui/docs': '../packages/material-ui-docs/src', - '@material-ui/icons': '../packages/material-ui-icons/lib', - '@material-ui/lab': '../packages/material-ui-lab/src', - '@material-ui/styles': '../packages/material-ui-styles/src', - '@material-ui/styled-engine-sc': '../packages/material-ui-styled-engine-sc/src', + '@mui/material': '../packages/material-ui/src', + '@mui/docs': '../packages/material-ui-docs/src', + '@mui/icons-material': '../packages/material-ui-icons/lib', + '@mui/lab': '../packages/material-ui-lab/src', + '@mui/styles': '../packages/material-ui-styles/src', + '@mui/styled-engine-sc': '../packages/material-ui-styled-engine-sc/src', // Swap the comments on the next two lines for using the styled-components as style engine - '@material-ui/styled-engine': '../packages/material-ui-styled-engine/src', - // '@material-ui/styled-engine': '../packages/material-ui-styled-engine-sc/src', - '@material-ui/system': '../packages/material-ui-system/src', - '@material-ui/private-theming': '../packages/material-ui-private-theming/src', - '@material-ui/utils': '../packages/material-ui-utils/src', - '@material-ui/unstyled': '../packages/material-ui-unstyled/src', + '@mui/styled-engine': '../packages/material-ui-styled-engine/src', + // '@mui/styled-engine': '../packages/material-ui-styled-engine-sc/src', + '@mui/system': '../packages/material-ui-system/src', + '@mui/private-theming': '../packages/material-ui-private-theming/src', + '@mui/utils': '../packages/material-ui-utils/src', + '@mui/core': '../packages/material-ui-unstyled/src', docs: './', modules: '../modules', pages: './pages', diff --git a/docs/next.config.js b/docs/next.config.js index 4601ed1f886d29..1467830e99aabd 100644 --- a/docs/next.config.js +++ b/docs/next.config.js @@ -94,8 +94,8 @@ module.exports = { test: /\.md$/, oneOf: [ { - resourceQuery: /@material-ui\/markdown/, - use: require.resolve('@material-ui/markdown/loader'), + resourceQuery: /@mui\/markdown/, + use: require.resolve('@mui/markdown/loader'), }, { // used in some /getting-started/templates @@ -119,6 +119,17 @@ module.exports = { { alias: { // all packages in this monorepo + '@mui/material': '../packages/material-ui/src', + '@mui/docs': '../packages/material-ui-docs/src', + '@mui/icons-material': '../packages/material-ui-icons/lib', + '@mui/lab': '../packages/material-ui-lab/src', + '@mui/styled-engine': '../packages/material-ui-styled-engine/src', + '@mui/styles': '../packages/material-ui-styles/src', + '@mui/system': '../packages/material-ui-system/src', + '@mui/private-theming': '../packages/material-ui-private-theming/src', + '@mui/utils': '../packages/material-ui-utils/src', + '@mui/core': '../packages/material-ui-unstyled/src', + // all legacy package names in this monorepo '@material-ui/core': '../packages/material-ui/src', '@material-ui/docs': '../packages/material-ui-docs/src', '@material-ui/icons': '../packages/material-ui-icons/lib', @@ -130,6 +141,7 @@ module.exports = { '../packages/material-ui-private-theming/src', '@material-ui/utils': '../packages/material-ui-utils/src', '@material-ui/unstyled': '../packages/material-ui-unstyled/src', + '@material-ui/core/*': '../packages/material-ui/src/*', }, transformFunctions: ['require'], }, diff --git a/docs/package.json b/docs/package.json index de8366e9e80e0c..51b1dc28a63aa2 100644 --- a/docs/package.json +++ b/docs/package.json @@ -30,17 +30,17 @@ "@fortawesome/fontawesome-svg-core": "^1.2.36", "@fortawesome/free-solid-svg-icons": "^5.15.4", "@fortawesome/react-fontawesome": "^0.1.15", - "@material-ui/core": "5.0.0-beta.5", + "@mui/material": "5.0.0-beta.5", "@material-ui/data-grid": "^4.0.0-alpha.37", - "@material-ui/docs": "5.0.0-beta.5", - "@material-ui/icons": "5.0.0-beta.5", - "@material-ui/lab": "5.0.0-alpha.44", - "@material-ui/styled-engine": "5.0.0-beta.5", - "@material-ui/styled-engine-sc": "5.0.0-beta.5", - "@material-ui/styles": "5.0.0-beta.5", - "@material-ui/system": "5.0.0-beta.5", - "@material-ui/types": "6.0.2", - "@material-ui/unstyled": "5.0.0-alpha.44", + "@mui/docs": "5.0.0-beta.5", + "@mui/icons-material": "5.0.0-beta.5", + "@mui/lab": "5.0.0-alpha.44", + "@mui/styled-engine": "5.0.0-beta.5", + "@mui/styled-engine-sc": "5.0.0-beta.5", + "@mui/styles": "5.0.0-beta.5", + "@mui/system": "5.0.0-beta.5", + "@mui/types": "6.0.2", + "@mui/core": "5.0.0-alpha.44", "@trendmicro/react-interpolate": "^0.5.5", "@types/autosuggest-highlight": "^3.1.1", "@types/css-mediaquery": "^0.1.1", diff --git a/docs/packages/markdown/package.json b/docs/packages/markdown/package.json index 3ded10c5fb2d81..a3c064947fde6e 100644 --- a/docs/packages/markdown/package.json +++ b/docs/packages/markdown/package.json @@ -1,5 +1,5 @@ { - "name": "@material-ui/markdown", + "name": "@mui/markdown", "version": "5.0.0", "private": true, "type": "commonjs", diff --git a/docs/packages/markdown/parseMarkdown.test.js b/docs/packages/markdown/parseMarkdown.test.js index 6a8954c9f3180f..8ba513025eb67d 100644 --- a/docs/packages/markdown/parseMarkdown.test.js +++ b/docs/packages/markdown/parseMarkdown.test.js @@ -12,11 +12,11 @@ describe('parseMarkdown', () => { it('remove backticks', () => { expect( getTitle(` -# \`@material-ui/styled-engine\` +# \`@mui/styled-engine\`

Configuring your preferred styling library.

`), - ).to.equal('@material-ui/styled-engine'); + ).to.equal('@mui/styled-engine'); }); }); @@ -52,7 +52,7 @@ describe('parseMarkdown', () => { title: React Alert component components: Alert, AlertTitle githubLabel: 'component: Alert' -packageName: '@material-ui/lab' +packageName: '@mui/lab' waiAria: https://www.w3.org/TR/wai-aria-practices/#alert authors: ['foo', 'bar'] --- @@ -60,7 +60,7 @@ authors: ['foo', 'bar'] ).to.deep.equal({ components: ['Alert', 'AlertTitle'], githubLabel: 'component: Alert', - packageName: '@material-ui/lab', + packageName: '@mui/lab', title: 'React Alert component', waiAria: 'https://www.w3.org/TR/wai-aria-practices/#alert', authors: ['foo', 'bar'], diff --git a/docs/packages/markdown/textToHash.test.js b/docs/packages/markdown/textToHash.test.js index fe524360fe56ab..be05777c8da995 100644 --- a/docs/packages/markdown/textToHash.test.js +++ b/docs/packages/markdown/textToHash.test.js @@ -12,10 +12,7 @@ describe('textToHash', () => { 'createGenerateClassName([options]) => class name generator', 'creategenerateclassname-options-class-name-generator', ], - [ - '@material-ui/core/styles vs @material-ui/styles', - 'material-ui-core-styles-vs-material-ui-styles', - ], + ['@mui/material/styles vs @mui/styles', 'mui-material-styles-vs-mui-styles'], ['Blog 📝', 'blog'], ]; table.forEach((entry, index) => { diff --git a/docs/pages/_app.js b/docs/pages/_app.js index bf93e23630e263..38229a48e364ee 100644 --- a/docs/pages/_app.js +++ b/docs/pages/_app.js @@ -10,7 +10,7 @@ import { create } from 'jss'; import jssRtl from 'jss-rtl'; import { CacheProvider } from '@emotion/react'; import { useRouter } from 'next/router'; -import { StylesProvider, jssPreset } from '@material-ui/styles'; +import { StylesProvider, jssPreset } from '@mui/styles'; import pages from 'docs/src/pages'; import PageContext from 'docs/src/modules/components/PageContext'; import GoogleAnalytics from 'docs/src/modules/components/GoogleAnalytics'; diff --git a/docs/pages/_document.js b/docs/pages/_document.js index 78f6f8f4df247d..d99affce662509 100644 --- a/docs/pages/_document.js +++ b/docs/pages/_document.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ServerStyleSheets } from '@material-ui/styles'; +import { ServerStyleSheets } from '@mui/styles'; import { ServerStyleSheet } from 'styled-components'; import createEmotionServer from '@emotion/server/create-instance'; import Document, { Html, Head, Main, NextScript } from 'next/document'; diff --git a/docs/pages/blog/2019-developer-survey-results.js b/docs/pages/blog/2019-developer-survey-results.js index 3b98601e3c590c..88dd0965500096 100644 --- a/docs/pages/blog/2019-developer-survey-results.js +++ b/docs/pages/blog/2019-developer-survey-results.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2019-developer-survey-results.md?@material-ui/markdown'; +import { docs } from './2019-developer-survey-results.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2019-developer-survey-results.md b/docs/pages/blog/2019-developer-survey-results.md index aebf628e6819b1..690f96d6c68265 100644 --- a/docs/pages/blog/2019-developer-survey-results.md +++ b/docs/pages/blog/2019-developer-survey-results.md @@ -296,7 +296,7 @@ As the React ecosystem matures, we might see a [big](https://www.rank2traffic.co Multiple options were allowed. -- @material-ui/styles: 85% +- @mui/styles: 85% - Styled components: 30% - Good old CSS (+sass, less, etc): 24% - CSS Modules (+sass, less, etc): 16% diff --git a/docs/pages/blog/2019.js b/docs/pages/blog/2019.js index ef6290a7029b20..ddd78b798bc2ea 100644 --- a/docs/pages/blog/2019.js +++ b/docs/pages/blog/2019.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2019.md?@material-ui/markdown'; +import { docs } from './2019.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2019.md b/docs/pages/blog/2019.md index dc1dd69116c478..cd9ee24f3e6903 100644 --- a/docs/pages/blog/2019.md +++ b/docs/pages/blog/2019.md @@ -11,7 +11,7 @@ It puts us on an exciting path to solve even greater challenges in the coming ye ## Growth -- 📦 From 2.2M to [3.2M](https://www.npmjs.com/package/@material-ui/core) downloads per month. +- 📦 From 2.2M to [3.2M](https://www.npmjs.com/package/@mui/material) downloads per month. - 📈 From 1.6M to 3.1M unique visitors per year on the documentation. - ⭐️ From 43.1k to 53.3k stars, leave us [yours 🌟](https://github.com/mui-org/material-ui). - 👨‍👩‍👧‍👦 From 1,064 to [1,581](https://github.com/mui-org/material-ui/graphs/contributors) contributors. diff --git a/docs/pages/blog/2020-developer-survey-results.js b/docs/pages/blog/2020-developer-survey-results.js index 369d3e30c0533d..61dbe4b6c18f9f 100644 --- a/docs/pages/blog/2020-developer-survey-results.js +++ b/docs/pages/blog/2020-developer-survey-results.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020-developer-survey-results.md?@material-ui/markdown'; +import { docs } from './2020-developer-survey-results.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020-introducing-sketch.js b/docs/pages/blog/2020-introducing-sketch.js index 14705f2631292c..0980c84524e3c9 100644 --- a/docs/pages/blog/2020-introducing-sketch.js +++ b/docs/pages/blog/2020-introducing-sketch.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020-introducing-sketch.md?@material-ui/markdown'; +import { docs } from './2020-introducing-sketch.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020-q1-update.js b/docs/pages/blog/2020-q1-update.js index 74e21b4a79dc23..ea5bc3b3327823 100644 --- a/docs/pages/blog/2020-q1-update.js +++ b/docs/pages/blog/2020-q1-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020-q1-update.md?@material-ui/markdown'; +import { docs } from './2020-q1-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020-q2-update.js b/docs/pages/blog/2020-q2-update.js index fd1c905227cc61..a80a723f738af9 100644 --- a/docs/pages/blog/2020-q2-update.js +++ b/docs/pages/blog/2020-q2-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020-q2-update.md?@material-ui/markdown'; +import { docs } from './2020-q2-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020-q3-update.js b/docs/pages/blog/2020-q3-update.js index 15b62013534c82..7ef626f91188e4 100644 --- a/docs/pages/blog/2020-q3-update.js +++ b/docs/pages/blog/2020-q3-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020-q3-update.md?@material-ui/markdown'; +import { docs } from './2020-q3-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020-q3-update.md b/docs/pages/blog/2020-q3-update.md index c866871cdbd24f..0c86d9ec8a59ef 100644 --- a/docs/pages/blog/2020-q3-update.md +++ b/docs/pages/blog/2020-q3-update.md @@ -45,7 +45,7 @@ Here are the most significant improvements since June 2020. This was a dense qua }); // Optionally retain type safety: - declare module '@material-ui/core/Button' { + declare module '@mui/material/Button' { interface ButtonPropsVariantOverrides { dashed: true; } @@ -92,12 +92,12 @@ Here are the most significant improvements since June 2020. This was a dense qua - 💅 We have completed the first iteration of the unstyled components for v5.
You can find a [new version](https://next.material-ui.com/components/slider-styled/#UnstyledSlider.tsx) of the slider in the lab without any styles. - The unstyled component weighs in at [5.2 kB gzipped](https://bundlephobia.com/result?p=@material-ui/lab@5.0.0-alpha.12), compared with 26 kB for the styled version (when used standalone). The component is best suited for use when you want to fully customize the look, without reimplementing the JavaScript and accessibility logic.
+ The unstyled component weighs in at [5.2 kB gzipped](https://bundlephobia.com/result?p=@mui/lab@5.0.0-alpha.12), compared with 26 kB for the styled version (when used standalone). The component is best suited for use when you want to fully customize the look, without reimplementing the JavaScript and accessibility logic.
We're also pushing in this direction to address a concern we hear from large enterprises that want to be able to go one layer down in the abstraction, in order to gain more control. ```jsx - import SliderUnstyled from '@material-ui/lab/SliderUnstyled'; + import SliderUnstyled from '@mui/lab/SliderUnstyled'; ``` Note that we have experimented with headless components (hooks only) in the past. For instance, you can leverage the [useAutocomplete](/components/autocomplete/#useautocomplete), and [usePagination](/components/pagination/#usepagination) hooks. However, we are pushing with unstyled first as a required step for the next item: ⬇️. diff --git a/docs/pages/blog/2020.js b/docs/pages/blog/2020.js index 5cdedb190a3151..d44b4904e98c31 100644 --- a/docs/pages/blog/2020.js +++ b/docs/pages/blog/2020.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2020.md?@material-ui/markdown'; +import { docs } from './2020.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2020.md b/docs/pages/blog/2020.md index 1fed4f7cfe9388..ccb8e202763465 100644 --- a/docs/pages/blog/2020.md +++ b/docs/pages/blog/2020.md @@ -28,7 +28,7 @@ We were busy building features to match feature parity with Ant Design, and more We have spent the year continuing in the same direction, polishing past components and introducing new ones. We ran a [second user survey](/blog/2020-developer-survey-results/), 15 months after the first one. It was a great opportunity to evaluate the effectiveness of our past efforts. For instance, we were very pleased to see that the slider component was almost a solved problem, and that the TypeScript definitions significantly improved. We also noticed the emergence of trends: - The more new components we add, the more developers want new ones. For instance, we rarely heard about the need for providing charts in 2019, it's now one of the top requested. In our last survey, we had 10% more requests for new components, even though, we brought new ones. We were surprised, it was counter-intuitive to us. -- The pain around the customization of the components is growing. We also frequently hear that there is a steep learning curve for using `@material-ui/styles`. We are reaching a larger audience used to raw CSS without extensive knowledge of specificity. +- The pain around the customization of the components is growing. We also frequently hear that there is a steep learning curve for using `@mui/styles`. We are reaching a larger audience used to raw CSS without extensive knowledge of specificity. - The demand for Material Design is stable, no longer growing. At the same time, the request for new ready-to-use themes is up. Our strategy around providing building blocks to build custom designed UI starts to gain traction. We have started to leverage these trends as opportunities in the next version of the library: v5. diff --git a/docs/pages/blog/2021-q1-update.js b/docs/pages/blog/2021-q1-update.js index 907b65ec9f869e..6ed19c06da619c 100644 --- a/docs/pages/blog/2021-q1-update.js +++ b/docs/pages/blog/2021-q1-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2021-q1-update.md?@material-ui/markdown'; +import { docs } from './2021-q1-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2021-q1-update.md b/docs/pages/blog/2021-q1-update.md index 4ee0d92b6083cd..fe6c639801130f 100644 --- a/docs/pages/blog/2021-q1-update.md +++ b/docs/pages/blog/2021-q1-update.md @@ -51,7 +51,7 @@ Here are the most significant improvements since December 2020. Developers can now do the following: ```jsx -import { createMuiTheme, Button } from '@material-ui/core'; +import { createMuiTheme, Button } from '@mui/material'; // 1. Extend the theme. const theme = createMuiTheme({ @@ -63,7 +63,7 @@ const theme = createMuiTheme({ }); // 2. Notify TypeScript about the new color in the palette -declare module '@material-ui/core/styles' { +declare module '@mui/material/styles' { interface Palette { neutral: Palette['primary']; } @@ -81,9 +81,9 @@ This new feature removes the need to create a wrapper component. - 📍 We have synchronized the icons with the latest update of the Material Design icons.
Google has moved its icons to a new location: https://fonts.google.com/icons. At the same time, they have increased the number of provided icons from 6,500 to 8,500. - You can find all these icons under the `@material-ui/icons` package. + You can find all these icons under the `@mui/icons-material` package. -- 🦴 We have migrated a couple of components to the `@material-ui/unstyled` package. +- 🦴 We have migrated a couple of components to the `@mui/core` package. The aim of the package is to host the unstyled and headless (hooks) components. So far, you can only find: @@ -133,7 +133,7 @@ The date picker is at the border between the advanced components and the design - ♿️ We have fixed a couple of accessibility issues (more in progress). - 🌏 We have introduced support for [custom locales](/components/data-grid/localization/). - 🚨 We have started to work on breaking changes to reach a stable state. -- 💾 We have extended the support of @material-ui/core to handle v4 and v5 at the same time. +- 💾 We have extended the support of @mui/material to handle v4 and v5 at the same time. In the future, we might desynchronize the release version of _mui/material-ui_ and _mui/material-ui-x_. For Material-UI X, we will likely need to release breaking changes at a higher frequency: every six months. - 🎛 We have added a column selector. diff --git a/docs/pages/blog/2021-q2-update.js b/docs/pages/blog/2021-q2-update.js index 15edce68e71f06..5afab0a64d20c5 100644 --- a/docs/pages/blog/2021-q2-update.js +++ b/docs/pages/blog/2021-q2-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './2021-q2-update.md?@material-ui/markdown'; +import { docs } from './2021-q2-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/2021-q2-update.md b/docs/pages/blog/2021-q2-update.md index 4116e8d27d9416..fa097d097944d1 100644 --- a/docs/pages/blog/2021-q2-update.md +++ b/docs/pages/blog/2021-q2-update.md @@ -215,7 +215,7 @@ We have the following objectives: We want to make the upgrade feel painless. - ⚛️ Support [React 18](https://reactjs.org/blog/2021/06/08/the-plan-for-react-18.html). [Sebastian](https://github.com/eps1lon) is part of the React [Working Group](https://github.com/reactwg/react-18/discussions), focusing on making us ready ahead of time. We want our most demanding users to feel empowered by Material-UI, not slowed down by a third-party. -- 🦴 Migrate more components to `@material-ui/unstyled`. [Michał](https://github.com/michaldudak) has recently added support for the [Switch](https://next.material-ui.com/components/switches/#unstyled-switches). +- 🦴 Migrate more components to `@mui/core`. [Michał](https://github.com/michaldudak) has recently added support for the [Switch](https://next.material-ui.com/components/switches/#unstyled-switches). You can follow our progress in the [umbrella issue](https://github.com/mui-org/material-ui/issues/27170). - 🌈 Do a proof of concept on supporting a second design system. Some of our users (and potential users) dislike Material Design. We will try to make the second design system one that they love! diff --git a/docs/pages/blog/april-2019-update.js b/docs/pages/blog/april-2019-update.js index 2cd6796e4ac068..1b86516fcc54aa 100644 --- a/docs/pages/blog/april-2019-update.js +++ b/docs/pages/blog/april-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './april-2019-update.md?@material-ui/markdown'; +import { docs } from './april-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/august-2019-update.js b/docs/pages/blog/august-2019-update.js index 3e2d308bc58224..6d4dfb53bc182b 100644 --- a/docs/pages/blog/august-2019-update.js +++ b/docs/pages/blog/august-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './august-2019-update.md?@material-ui/markdown'; +import { docs } from './august-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/danail-hadjiatanasov-joining.js b/docs/pages/blog/danail-hadjiatanasov-joining.js index f1d8e2665b8bfd..44e90d7f2a7c86 100644 --- a/docs/pages/blog/danail-hadjiatanasov-joining.js +++ b/docs/pages/blog/danail-hadjiatanasov-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './danail-hadjiatanasov-joining.md?@material-ui/markdown'; +import { docs } from './danail-hadjiatanasov-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/danilo-leal-joining.js b/docs/pages/blog/danilo-leal-joining.js index 67e84791f890a9..8fefd0aed3b45e 100644 --- a/docs/pages/blog/danilo-leal-joining.js +++ b/docs/pages/blog/danilo-leal-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './danilo-leal-joining.md?@material-ui/markdown'; +import { docs } from './danilo-leal-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/december-2019-update.js b/docs/pages/blog/december-2019-update.js index 95aebbf16336bb..eeabf8c1c29dba 100644 --- a/docs/pages/blog/december-2019-update.js +++ b/docs/pages/blog/december-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './december-2019-update.md?@material-ui/markdown'; +import { docs } from './december-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/july-2019-update.js b/docs/pages/blog/july-2019-update.js index 2924240d0c4de2..b56bd585f39884 100644 --- a/docs/pages/blog/july-2019-update.js +++ b/docs/pages/blog/july-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './july-2019-update.md?@material-ui/markdown'; +import { docs } from './july-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/july-2019-update.md b/docs/pages/blog/july-2019-update.md index 1d165cd49f73a2..a8e27df19f385b 100644 --- a/docs/pages/blog/july-2019-update.md +++ b/docs/pages/blog/july-2019-update.md @@ -20,7 +20,7 @@ Here are the most significant improvements in July: Read our [Minimizing Bundle Size](/guides/minimizing-bundle-size/) guide to learn how your project should be configured. ```js - import { Button, TextField } from '@material-ui/core'; + import { Button, TextField } from '@mui/material'; ``` - ⭐️ We have introduced a new [Rating component](/components/rating/) in the lab. diff --git a/docs/pages/blog/june-2019-update.js b/docs/pages/blog/june-2019-update.js index 64e417d6287dd9..ee4b1e1cd76a12 100644 --- a/docs/pages/blog/june-2019-update.js +++ b/docs/pages/blog/june-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './june-2019-update.md?@material-ui/markdown'; +import { docs } from './june-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/march-2019-update.js b/docs/pages/blog/march-2019-update.js index bc88cbf509827a..ff1debb02ddcca 100644 --- a/docs/pages/blog/march-2019-update.js +++ b/docs/pages/blog/march-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './march-2019-update.md?@material-ui/markdown'; +import { docs } from './march-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/march-2019-update.md b/docs/pages/blog/march-2019-update.md index 9263a41354fdb6..892e8d8738ac30 100644 --- a/docs/pages/blog/march-2019-update.md +++ b/docs/pages/blog/march-2019-update.md @@ -9,14 +9,14 @@ Olivier Tassinari. April 5, 2019. Here are the most significant improvements in March: - We have removed the old styles modules 💅. - Be aware [of the difference](/customization/default-theme/#material-ui-core-styles-vs-material-ui-styles) between `@material-ui/core/styles` and `@material-ui/styles`. + Be aware [of the difference](/customization/default-theme/#material-ui-core-styles-vs-material-ui-styles) between `@mui/material/styles` and `@mui/styles`. - The community has helped us to add many TypeScript demo variants. In order to minimize the overhead of handling two variants per demo (JavaScript & TypeScript), the JavaScript variant is generated from the TypeScript variant. If you are using TypeScript, you can ignore the `.propTypes =` assignations. - We have migrated a few demos from the `withStyles()` API to the `makeStyles()` API. If you are wondering which you should use, we would encourage the use of `makeStyles()` where possible. `withStyles()` is interesting for overriding component styles or for handling legacy class logics. - We have made the [Box API](/system/basics/) stable 🥳. ```diff - -import { unstable_Box as Box } from '@material-ui/core/Box'; - +import Box from '@material-ui/core/Box'; + -import { unstable_Box as Box } from '@mui/material/Box'; + +import Box from '@mui/material/Box'; ``` - We have committed to [a new Roadmap](/discover-more/roadmap/) (prioritized) for the next 6 months. - We have migrated 50% of the codebase from the Classes API to the Hooks API. Once we are done with this task we can remove the internal usage of higher-order components. diff --git a/docs/pages/blog/marija-najdova-joining.js b/docs/pages/blog/marija-najdova-joining.js index 9e9c07252dacce..ca5212a5f736d6 100644 --- a/docs/pages/blog/marija-najdova-joining.js +++ b/docs/pages/blog/marija-najdova-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './marija-najdova-joining.md?@material-ui/markdown'; +import { docs } from './marija-najdova-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/material-ui-v1-is-out.js b/docs/pages/blog/material-ui-v1-is-out.js index 47c53682f76c88..2068df7f6d27d1 100644 --- a/docs/pages/blog/material-ui-v1-is-out.js +++ b/docs/pages/blog/material-ui-v1-is-out.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './material-ui-v1-is-out.md?@material-ui/markdown'; +import { docs } from './material-ui-v1-is-out.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/material-ui-v1-is-out.md b/docs/pages/blog/material-ui-v1-is-out.md index 6c18574a081b02..48304611baa2d2 100644 --- a/docs/pages/blog/material-ui-v1-is-out.md +++ b/docs/pages/blog/material-ui-v1-is-out.md @@ -42,7 +42,7 @@ We want Material-UI to become whatever is generally useful for application devel We know the ease of use is a critical part of user acquisition. The more user we have, the more likely we can make the project sustainable. Improving the ease of use comes in different flavors: - **Onboarding**. We have reduced the onboarding friction as much as possible. We know the onboarding is a critical step for user acquisition. The onboarding friction comes in different flavors: - We have reduced the number of installation steps needed. It should be as simple as 1. npm install @material-ui/core and 2. import Button from '@material-ui/core/Button'; . We don't ask for polyfill, custom webpack plugin or any specific build tool. The usage of MuiThemeProvider is no longer mandatory. + We have reduced the number of installation steps needed. It should be as simple as 1. npm install @mui/material and 2. import Button from '@mui/material/Button'; . We don't ask for polyfill, custom webpack plugin or any specific build tool. The usage of MuiThemeProvider is no longer mandatory. - **Examples**. We are hosting [example projects](https://github.com/mui-org/material-ui/tree/master/examples) with the most popular solutions to start a project: [create-react-app](https://github.com/facebook/create-react-app), [Next.js](https://github.com/zeit/next.js), [Gatsby](https://github.com/gatsbyjs/gatsby), and CDN. diff --git a/docs/pages/blog/material-ui-v4-is-out.js b/docs/pages/blog/material-ui-v4-is-out.js index e22de188276bdf..52b149946fe9c5 100644 --- a/docs/pages/blog/material-ui-v4-is-out.js +++ b/docs/pages/blog/material-ui-v4-is-out.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './material-ui-v4-is-out.md?@material-ui/markdown'; +import { docs } from './material-ui-v4-is-out.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/material-ui-v4-is-out.md b/docs/pages/blog/material-ui-v4-is-out.md index c6f10b0276699f..d1302bca6b2883 100644 --- a/docs/pages/blog/material-ui-v4-is-out.md +++ b/docs/pages/blog/material-ui-v4-is-out.md @@ -52,7 +52,7 @@ After listening to v3 customization experiences of hundreds of developers, we re - **CSS specificity**. The developers' style specificity needs to be higher to win over the style Material-UI injects in the page. By default, Material-UI injects its style at the end of the `` element. However, styled components and other popular styling solutions inject the style just before it, losing specificity. To solve the problem, we have introduced a new prop: `injectFirst`. ```jsx -import { StylesProvider } from '@material-ui/styles'; +import { StylesProvider } from '@mui/styles'; {/* Your component tree. @@ -148,7 +148,7 @@ import { TableHead, TableRow, Paper, -} from '@material-ui/core'; +} from '@mui/material'; ``` - **Bundle size reduction**. The bundle size went from 95 kB gzipped to below 80 kB gzipped between the last v3 release and the first v4 beta release. This is _remarkable_ considering that we have added new features and components along the way 😍! This was made possible by many small incremental changes: tree shaking, removal of [multiple](https://github.com/timoxley/keycode) [internal](https://github.com/oliviertassinari/react-event-listener) dependencies, hooks migration, clsx migration, [smart Babel plugin](https://github.com/merceyz/babel-plugin-optimize-clsx), etc. @@ -173,7 +173,7 @@ Material-UI v4 depends on React ≥16.8.0. This is the first version of React th - **Ref forwarding**. Most of the time, you use the `ref` prop to access the underlying DOM node of a React element. You might want to focus an element, compute the position of an element, and so on. You should never need to access a Material-UI component's instance methods, they are considered private. The components expose an `action` when it's really needed. For instance, you might want to update the tab indicator position when it goes out of sync with the tab item position. To ease this use case, Sebastian has lead an effort to implement [`React.forwardRef()`](https://reactjs.org/docs/react-api.html#reactforwardref). In practice, this means that you can retrieve a reference to the DOM node like you would do with a built-in component (`button`, `div`, etc.): ```jsx -import { Button } from '@material-ui/core'; +import { Button } from '@mui/material'; function MyButton() { const myRef = React.useRef(); @@ -249,11 +249,11 @@ An example of the new spacing helper API.

Inline mode

-- A new [@material-ui/styles](/styles/basics/) package that isolates our styling solution. It can be used independently of the core components. It comes with a hooks API that requires less boilerplate 😍 +- A new [@mui/styles](/styles/basics/) package that isolates our styling solution. It can be used independently of the core components. It comes with a hooks API that requires less boilerplate 😍 ```jsx import * as React from 'react'; -import { makeStyles } from '@material-ui/core/styles'; +import { makeStyles } from '@mui/material/styles'; const useStyles = makeStyles({ root: { @@ -273,9 +273,9 @@ export default function Hook() { } ``` -⚠️ Be aware of the difference between _@material-ui/styles_ and _@material-ui/core/styles_. The latter contains the [default theme](/customization/default-theme/#material-ui-core-styles-vs-material-ui-styles). +⚠️ Be aware of the difference between _@mui/styles_ and _@mui/material/styles_. The latter contains the [default theme](/customization/default-theme/#material-ui-core-styles-vs-material-ui-styles). -- A well supported [Gatsby plugin](https://github.com/hupe1980/gatsby-plugin-material-ui) for _@material-ui/styles_. +- A well supported [Gatsby plugin](https://github.com/hupe1980/gatsby-plugin-material-ui) for _@mui/styles_. - A [Cookbook](https://www.amazon.com/gp/product/1789615224/ref=as_li_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1789615224&linkCode=as2&tag=oliviertassin-20&linkId=79aec1cb9db829135838614ac1953380) published by Packt and written by Adam Boduch. ![cookbook](/static/blog/material-ui-v4-is-out/cookbook.png) @@ -303,13 +303,13 @@ Let us know the components you want! 🚀 - **Use `system` in the core.** We have received great feedback on the new system package. Going forward, we will try to move it to the core components. Ideally, you should be able to use dynamic color & variants from your theme as well as have access to all the props: ```jsx -import { Button } from '@material-ui/core'; +import { Button } from '@mui/material'; ; ``` - **Styled components.** We have seen many people asking for migration to styled components. We want Material-UI v5 to be better aligned with the community's best-loved tools, but at the same time, we don't want to break your code. - So we will work on isolating the components from the styling solution. The new _@material-ui/styles_ package is the first step in this direction. We envision a world where you can use Material-UI styled with styled components, linaria, and JSS or without any styles. + So we will work on isolating the components from the styling solution. The new _@mui/styles_ package is the first step in this direction. We envision a world where you can use Material-UI styled with styled components, linaria, and JSS or without any styles. Developers should be able to use their preferred styling solution without paying the cost of two CSS-in-JS runtimes. - **Accessibility.** While we try to fix all accessibility issues as they are reported by our users, we feel that we can do better. We want to run a professional ADA audit of all our components ♿️. diff --git a/docs/pages/blog/matheus-wichman-joining.js b/docs/pages/blog/matheus-wichman-joining.js index c2299b0de182b3..3d178dfcb74bef 100644 --- a/docs/pages/blog/matheus-wichman-joining.js +++ b/docs/pages/blog/matheus-wichman-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './matheus-wichman-joining.md?@material-ui/markdown'; +import { docs } from './matheus-wichman-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/may-2019-update.js b/docs/pages/blog/may-2019-update.js index 10c565a3f01683..77adc649c6c225 100644 --- a/docs/pages/blog/may-2019-update.js +++ b/docs/pages/blog/may-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './may-2019-update.md?@material-ui/markdown'; +import { docs } from './may-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/michal-dudak-joining.js b/docs/pages/blog/michal-dudak-joining.js index bfc8c9b83281d2..a747343a2ee5fb 100644 --- a/docs/pages/blog/michal-dudak-joining.js +++ b/docs/pages/blog/michal-dudak-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './michal-dudak-joining.md?@material-ui/markdown'; +import { docs } from './michal-dudak-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/michal-dudak-joining.md b/docs/pages/blog/michal-dudak-joining.md index bd442273189cb4..3937fcf2052ba7 100644 --- a/docs/pages/blog/michal-dudak-joining.md +++ b/docs/pages/blog/michal-dudak-joining.md @@ -18,11 +18,11 @@ We were impressed by his technical challenge. He leveraged most of the best practices we enforce when writing components, without prior experience contributing to our codebase. While we can't predict the future, Michał is currently responsible for the development of a new vertical for Material-UI: the unstyled & headless React components. -Marija initiated this effort with a couple of new modules under the [@material-ui/unstyled](https://unpkg.com/browse/@material-ui/unstyled@next/) package. +Marija initiated this effort with a couple of new modules under the [@mui/core](https://unpkg.com/browse/@mui/core@next/) package. This is a strategic effort for us, with the intent to solve two problems: 1. Share logic between Material Design and the second design specification that [Jun will work on](/blog/siriwat-kunaporn-joining/). This is important to stay efficient. -2. Grow the audience of the library. It provides a new customization tradeoff. It maximizes freedom and minimizes bundle-size. We have recently exceeded [20%](https://docs.google.com/spreadsheets/d/1l5j3Xjtvm9XZtmb4ulLiWElQaXSlZlyCWT5ONrQMpBo/edit#gid=0) market share of the React ecosystem (@material-ui/core downloads divided by react-dom downloads). We're aiming for [+20%](https://npm-stat.com/charts.html?package=@angular/core,@angular/material,@angular/cdk) of the market coming from this effort in the next four years. +2. Grow the audience of the library. It provides a new customization tradeoff. It maximizes freedom and minimizes bundle-size. We have recently exceeded [20%](https://docs.google.com/spreadsheets/d/1l5j3Xjtvm9XZtmb4ulLiWElQaXSlZlyCWT5ONrQMpBo/edit#gid=0) market share of the React ecosystem (@mui/material downloads divided by react-dom downloads). We're aiming for [+20%](https://npm-stat.com/charts.html?package=@angular/core,@angular/material,@angular/cdk) of the market coming from this effort in the next four years. Michał is the third of a series of five new positions we have recently opened and filled. We will reach 11 people by the end of June. diff --git a/docs/pages/blog/november-2019-update.js b/docs/pages/blog/november-2019-update.js index 3ab66eb8d751ba..79fa820f2453d0 100644 --- a/docs/pages/blog/november-2019-update.js +++ b/docs/pages/blog/november-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './november-2019-update.md?@material-ui/markdown'; +import { docs } from './november-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/october-2019-update.js b/docs/pages/blog/october-2019-update.js index afbf3037ee3b20..61d071e8ee7a4e 100644 --- a/docs/pages/blog/october-2019-update.js +++ b/docs/pages/blog/october-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './october-2019-update.md?@material-ui/markdown'; +import { docs } from './october-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/september-2019-update.js b/docs/pages/blog/september-2019-update.js index 35ced3aea935b6..3a2b10f46cb314 100644 --- a/docs/pages/blog/september-2019-update.js +++ b/docs/pages/blog/september-2019-update.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './september-2019-update.md?@material-ui/markdown'; +import { docs } from './september-2019-update.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/september-2019-update.md b/docs/pages/blog/september-2019-update.md index 7ada187e48e329..0f12bb816d0e92 100644 --- a/docs/pages/blog/september-2019-update.md +++ b/docs/pages/blog/september-2019-update.md @@ -13,7 +13,7 @@ Here are the most significant improvements in September: ![button icons](/static/blog/september-2019-update/button-icon.png) ```jsx - import DeleteIcon from '@material-ui/icons/Delete'; + import DeleteIcon from '@mui/icons-material/Delete'; ; ``` @@ -24,18 +24,18 @@ Here are the most significant improvements in September: - 📊 Launch a [developer survey](https://www.surveymonkey.com/r/5XHDL76) as a precursor to a major Date Picker enhancement effort. We plan a new investment batch of between 100 and 500 hours. -- 📚 Change imports from `@material-ui/styles` to `@material-ui/core/styles` +- 📚 Change imports from `@mui/styles` to `@mui/material/styles` - The presence of two almost identical import paths has been a source of confusion: @material-ui/styles and @material-ui/core/styles. - Starting with v4.5.1, the documentation mentions @material-ui/core/styles as much as possible. + The presence of two almost identical import paths has been a source of confusion: @mui/styles and @mui/material/styles. + Starting with v4.5.1, the documentation mentions @mui/material/styles as much as possible. ```diff - -import { makeStyles } from '@material-ui/styles'; - +import { makeStyles } from '@material-ui/core/styles'; + -import { makeStyles } from '@mui/styles'; + +import { makeStyles } from '@mui/material/styles'; ``` - This change removes the need to install the `@material-ui/styles` package directly. - It prevents the duplication of `@material-ui/styles` in bundles and avoids confusion. + This change removes the need to install the `@mui/styles` package directly. + It prevents the duplication of `@mui/styles` in bundles and avoids confusion. You can [learn more about the difference](https://material-ui.com/styles/basics/#material-ui-core-styles-vs-material-ui-styles) in the documentation. But this summary is just scratching the surface. We have accepted 199 commits from 61 different contributors. We have changed 1,219 files with 18,223 additions and 11,957 deletions. diff --git a/docs/pages/blog/siriwat-kunaporn-joining.js b/docs/pages/blog/siriwat-kunaporn-joining.js index e399bc464be470..4383fe768676a8 100644 --- a/docs/pages/blog/siriwat-kunaporn-joining.js +++ b/docs/pages/blog/siriwat-kunaporn-joining.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './siriwat-kunaporn-joining.md?@material-ui/markdown'; +import { docs } from './siriwat-kunaporn-joining.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/blog/spotlight-damien-tassone.js b/docs/pages/blog/spotlight-damien-tassone.js index 8640b296e0ab52..9a04c3e10962ca 100644 --- a/docs/pages/blog/spotlight-damien-tassone.js +++ b/docs/pages/blog/spotlight-damien-tassone.js @@ -1,6 +1,6 @@ import * as React from 'react'; import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; -import { docs } from './spotlight-damien-tassone.md?@material-ui/markdown'; +import { docs } from './spotlight-damien-tassone.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/branding/about.tsx b/docs/pages/branding/about.tsx index 00d24448d5389a..3de62da1d35b21 100644 --- a/docs/pages/branding/about.tsx +++ b/docs/pages/branding/about.tsx @@ -1,19 +1,19 @@ import * as React from 'react'; import Head from 'docs/src/modules/components/Head'; -import { ThemeProvider as MuiThemeProvider } from '@material-ui/core/styles'; -import Avatar from '@material-ui/core/Avatar'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import Grid from '@material-ui/core/Grid'; -import Paper, { PaperProps } from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; -import TwitterIcon from '@material-ui/icons/Twitter'; -import GitHubIcon from '@material-ui/icons/GitHub'; +import { ThemeProvider as MuiThemeProvider } from '@mui/material/styles'; +import Avatar from '@mui/material/Avatar'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import Grid from '@mui/material/Grid'; +import Paper, { PaperProps } from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; +import TwitterIcon from '@mui/icons-material/Twitter'; +import GitHubIcon from '@mui/icons-material/GitHub'; import Link from 'docs/src/modules/components/Link'; import AppHeader from 'docs/src/layouts/AppHeader'; import References, { CORE_CUSTOMERS } from 'docs/src/components/home/References'; @@ -24,9 +24,9 @@ import GradientText from 'docs/src/components/typography/GradientText'; import { brandingDarkTheme } from 'docs/src/modules/brandingTheme'; import ROUTES from 'docs/src/route'; import IconImage from 'docs/src/components/icon/IconImage'; -import ForumRoundedIcon from '@material-ui/icons/ForumRounded'; -import PeopleRoundedIcon from '@material-ui/icons/PeopleRounded'; -import LocalAtmRoundedIcon from '@material-ui/icons/LocalAtmRounded'; +import ForumRoundedIcon from '@mui/icons-material/ForumRounded'; +import PeopleRoundedIcon from '@mui/icons-material/PeopleRounded'; +import LocalAtmRoundedIcon from '@mui/icons-material/LocalAtmRounded'; import BrandingProvider from 'docs/src/BrandingProvider'; interface Profile { diff --git a/docs/pages/branding/design-kits.tsx b/docs/pages/branding/design-kits.tsx index cc5af3e6ac33b5..f07a4be668d70f 100644 --- a/docs/pages/branding/design-kits.tsx +++ b/docs/pages/branding/design-kits.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import Head from 'docs/src/modules/components/Head'; -import Divider from '@material-ui/core/Divider'; +import Divider from '@mui/material/Divider'; import AppHeader from 'docs/src/layouts/AppHeader'; import AppFooter from 'docs/src/layouts/AppFooter'; import DesignKitHero from 'docs/src/components/productDesignKit/DesignKitHero'; diff --git a/docs/pages/branding/home.tsx b/docs/pages/branding/home.tsx index 9e8f0303a44779..c7e5ef7e43645b 100644 --- a/docs/pages/branding/home.tsx +++ b/docs/pages/branding/home.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import Head from 'docs/src/modules/components/Head'; -import NoSsr from '@material-ui/core/NoSsr'; -import Divider from '@material-ui/core/Divider'; +import NoSsr from '@mui/material/NoSsr'; +import Divider from '@mui/material/Divider'; import AppHeader from 'docs/src/layouts/AppHeader'; import Hero from 'docs/src/components/home/Hero'; import References, { CORE_CUSTOMERS } from 'docs/src/components/home/References'; diff --git a/docs/pages/branding/mui-x.tsx b/docs/pages/branding/mui-x.tsx index 1aedbcd13e25b6..e8ff54901abcf8 100644 --- a/docs/pages/branding/mui-x.tsx +++ b/docs/pages/branding/mui-x.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import Avatar from '@material-ui/core/Avatar'; -import { styled } from '@material-ui/core/styles'; -import NavigateNextIcon from '@material-ui/icons/NavigateNext'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import Avatar from '@mui/material/Avatar'; +import { styled } from '@mui/material/styles'; +import NavigateNextIcon from '@mui/icons-material/NavigateNext'; import InLabIcon from 'docs/src/modules/branding/icons/InLab'; import WorkInProgressIcon from 'docs/src/modules/branding/icons/WorkInProgress'; import PlanningBuildIcon from 'docs/src/modules/branding/icons/PlanningBuild'; diff --git a/docs/pages/branding/pricing.tsx b/docs/pages/branding/pricing.tsx index 4ffdfe40f2d62d..b9b0c3e723a80f 100644 --- a/docs/pages/branding/pricing.tsx +++ b/docs/pages/branding/pricing.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import Head from 'docs/src/modules/components/Head'; -import Container from '@material-ui/core/Container'; -import Divider from '@material-ui/core/Divider'; +import Container from '@mui/material/Container'; +import Divider from '@mui/material/Divider'; import AppHeader from 'docs/src/layouts/AppHeader'; import HeroPricing from 'docs/src/components/pricing/HeroPricing'; import PricingTable from 'docs/src/components/pricing/PricingTable'; diff --git a/docs/pages/branding/templates.tsx b/docs/pages/branding/templates.tsx index ad7764cec53dd8..d7823e9ae84bde 100644 --- a/docs/pages/branding/templates.tsx +++ b/docs/pages/branding/templates.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import Head from 'docs/src/modules/components/Head'; -import Divider from '@material-ui/core/Divider'; +import Divider from '@mui/material/Divider'; import AppHeader from 'docs/src/layouts/AppHeader'; import AppFooter from 'docs/src/layouts/AppFooter'; import TemplateHero from 'docs/src/components/productTemplate/TemplateHero'; diff --git a/docs/pages/company/about.js b/docs/pages/company/about.js index b0b39a35fbe230..4106b1372bd409 100644 --- a/docs/pages/company/about.js +++ b/docs/pages/company/about.js @@ -1,10 +1,6 @@ import * as React from 'react'; import TopLayoutCompany from 'docs/src/modules/components/TopLayoutCompany'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/company/about/about.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/company/about/about.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/careers.js b/docs/pages/company/careers.js index a12449f552fbb1..b9742b00f7e6ff 100644 --- a/docs/pages/company/careers.js +++ b/docs/pages/company/careers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/careers/careers.md?@material-ui/markdown'; +} from 'docs/src/pages/company/careers/careers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/contact.js b/docs/pages/company/contact.js index ac5db463f09a42..c8ad115b5f36f4 100644 --- a/docs/pages/company/contact.js +++ b/docs/pages/company/contact.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/contact/contact.md?@material-ui/markdown'; +} from 'docs/src/pages/company/contact/contact.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/developer-advocate.js b/docs/pages/company/developer-advocate.js index d81f1d2677a976..1673e0a11da7a3 100644 --- a/docs/pages/company/developer-advocate.js +++ b/docs/pages/company/developer-advocate.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/careers/developer-advocate.md?@material-ui/markdown'; +} from 'docs/src/pages/company/careers/developer-advocate.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/full-stack-engineer.js b/docs/pages/company/full-stack-engineer.js index a2e76bc40c43e0..c3f2e7d29dfaf4 100644 --- a/docs/pages/company/full-stack-engineer.js +++ b/docs/pages/company/full-stack-engineer.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/careers/full-stack-engineer.md?@material-ui/markdown'; +} from 'docs/src/pages/company/careers/full-stack-engineer.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/product-manager.js b/docs/pages/company/product-manager.js index 97534ff0a704f4..728fe0119fff9d 100644 --- a/docs/pages/company/product-manager.js +++ b/docs/pages/company/product-manager.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/careers/product-manager.md?@material-ui/markdown'; +} from 'docs/src/pages/company/careers/product-manager.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/company/react-engineer.js b/docs/pages/company/react-engineer.js index 1933bc8fc846fb..33190155f8bd26 100644 --- a/docs/pages/company/react-engineer.js +++ b/docs/pages/company/react-engineer.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/company/careers/react-engineer.md?@material-ui/markdown'; +} from 'docs/src/pages/company/careers/react-engineer.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/about-the-lab.js b/docs/pages/components/about-the-lab.js index c92aeb8cc6d24f..c49068646064fb 100644 --- a/docs/pages/components/about-the-lab.js +++ b/docs/pages/components/about-the-lab.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/about-the-lab/about-the-lab.md?@material-ui/markdown'; +} from 'docs/src/pages/components/about-the-lab/about-the-lab.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/accordion.js b/docs/pages/components/accordion.js index a4c380bd83c9bc..f5885ea8dac5a3 100644 --- a/docs/pages/components/accordion.js +++ b/docs/pages/components/accordion.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/accordion/accordion.md?@material-ui/markdown'; +} from 'docs/src/pages/components/accordion/accordion.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/alert.js b/docs/pages/components/alert.js index 780c734cb0a669..0e0548ed83c337 100644 --- a/docs/pages/components/alert.js +++ b/docs/pages/components/alert.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/alert/alert.md?@material-ui/markdown'; +} from 'docs/src/pages/components/alert/alert.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/app-bar.js b/docs/pages/components/app-bar.js index 253dcdf600727d..dec591b961f17b 100644 --- a/docs/pages/components/app-bar.js +++ b/docs/pages/components/app-bar.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/app-bar/app-bar.md?@material-ui/markdown'; +} from 'docs/src/pages/components/app-bar/app-bar.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/autocomplete.js b/docs/pages/components/autocomplete.js index 572fc60cabefdb..8d145019d7fe54 100644 --- a/docs/pages/components/autocomplete.js +++ b/docs/pages/components/autocomplete.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/autocomplete/autocomplete.md?@material-ui/markdown'; +} from 'docs/src/pages/components/autocomplete/autocomplete.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/avatars.js b/docs/pages/components/avatars.js index 8071d93452ce42..2237f87ca72cb3 100644 --- a/docs/pages/components/avatars.js +++ b/docs/pages/components/avatars.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/avatars/avatars.md?@material-ui/markdown'; +} from 'docs/src/pages/components/avatars/avatars.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/backdrop.js b/docs/pages/components/backdrop.js index 9442a9f61767a0..a2b7e3d756b9a5 100644 --- a/docs/pages/components/backdrop.js +++ b/docs/pages/components/backdrop.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/backdrop/backdrop.md?@material-ui/markdown'; +} from 'docs/src/pages/components/backdrop/backdrop.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/badges.js b/docs/pages/components/badges.js index 4d3410d48391cd..5fad2ad16b9087 100644 --- a/docs/pages/components/badges.js +++ b/docs/pages/components/badges.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/badges/badges.md?@material-ui/markdown'; +} from 'docs/src/pages/components/badges/badges.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/bottom-navigation.js b/docs/pages/components/bottom-navigation.js index 7b6b09a3c36d1e..316c8cd456e5cf 100644 --- a/docs/pages/components/bottom-navigation.js +++ b/docs/pages/components/bottom-navigation.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/bottom-navigation/bottom-navigation.md?@material-ui/markdown'; +} from 'docs/src/pages/components/bottom-navigation/bottom-navigation.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/box.js b/docs/pages/components/box.js index fba2b3e33d479b..b713b070e82b52 100644 --- a/docs/pages/components/box.js +++ b/docs/pages/components/box.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/components/box/box.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/components/box/box.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/breadcrumbs.js b/docs/pages/components/breadcrumbs.js index fd549ce291e075..abc0208d9978d4 100644 --- a/docs/pages/components/breadcrumbs.js +++ b/docs/pages/components/breadcrumbs.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/breadcrumbs/breadcrumbs.md?@material-ui/markdown'; +} from 'docs/src/pages/components/breadcrumbs/breadcrumbs.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/button-group.js b/docs/pages/components/button-group.js index cd5680fca52b91..2da47933bf431a 100644 --- a/docs/pages/components/button-group.js +++ b/docs/pages/components/button-group.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/button-group/button-group.md?@material-ui/markdown'; +} from 'docs/src/pages/components/button-group/button-group.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/buttons.js b/docs/pages/components/buttons.js index 94e38129f4d65d..6214e94bd4d43f 100644 --- a/docs/pages/components/buttons.js +++ b/docs/pages/components/buttons.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/buttons/buttons.md?@material-ui/markdown'; +} from 'docs/src/pages/components/buttons/buttons.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/cards.js b/docs/pages/components/cards.js index b6f3947a23b500..59331a503ae750 100644 --- a/docs/pages/components/cards.js +++ b/docs/pages/components/cards.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/cards/cards.md?@material-ui/markdown'; +} from 'docs/src/pages/components/cards/cards.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/checkboxes.js b/docs/pages/components/checkboxes.js index c2165997cca2ef..d60c432f81f955 100644 --- a/docs/pages/components/checkboxes.js +++ b/docs/pages/components/checkboxes.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/checkboxes/checkboxes.md?@material-ui/markdown'; +} from 'docs/src/pages/components/checkboxes/checkboxes.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/chips.js b/docs/pages/components/chips.js index 3f777ca276333c..1bd52bfff91160 100644 --- a/docs/pages/components/chips.js +++ b/docs/pages/components/chips.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/chips/chips.md?@material-ui/markdown'; +} from 'docs/src/pages/components/chips/chips.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/click-away-listener.js b/docs/pages/components/click-away-listener.js index bd59fab1100773..0325836b7d2295 100644 --- a/docs/pages/components/click-away-listener.js +++ b/docs/pages/components/click-away-listener.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/click-away-listener/click-away-listener.md?@material-ui/markdown'; +} from 'docs/src/pages/components/click-away-listener/click-away-listener.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/container.js b/docs/pages/components/container.js index 74f37249394a63..62091fb4dd50f1 100644 --- a/docs/pages/components/container.js +++ b/docs/pages/components/container.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/container/container.md?@material-ui/markdown'; +} from 'docs/src/pages/components/container/container.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/css-baseline.js b/docs/pages/components/css-baseline.js index 7e39f8efe07b9f..362209b48c8283 100644 --- a/docs/pages/components/css-baseline.js +++ b/docs/pages/components/css-baseline.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/css-baseline/css-baseline.md?@material-ui/markdown'; +} from 'docs/src/pages/components/css-baseline/css-baseline.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/date-picker.js b/docs/pages/components/date-picker.js index 48acc6a6423e21..650898777f04f6 100644 --- a/docs/pages/components/date-picker.js +++ b/docs/pages/components/date-picker.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/date-picker/date-picker.md?@material-ui/markdown'; +} from 'docs/src/pages/components/date-picker/date-picker.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/date-range-picker.js b/docs/pages/components/date-range-picker.js index 5d33fc8828d133..dbd13a408dbe8c 100644 --- a/docs/pages/components/date-range-picker.js +++ b/docs/pages/components/date-range-picker.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/date-range-picker/date-range-picker.md?@material-ui/markdown'; +} from 'docs/src/pages/components/date-range-picker/date-range-picker.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/date-time-picker.js b/docs/pages/components/date-time-picker.js index 5c518ff8a3ecf0..233f59b20a06ce 100644 --- a/docs/pages/components/date-time-picker.js +++ b/docs/pages/components/date-time-picker.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/date-time-picker/date-time-picker.md?@material-ui/markdown'; +} from 'docs/src/pages/components/date-time-picker/date-time-picker.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/dialogs.js b/docs/pages/components/dialogs.js index 5b2fe8254adaf4..02e540e4a4bcde 100644 --- a/docs/pages/components/dialogs.js +++ b/docs/pages/components/dialogs.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/dialogs/dialogs.md?@material-ui/markdown'; +} from 'docs/src/pages/components/dialogs/dialogs.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/dividers.js b/docs/pages/components/dividers.js index 4fc7714321f3de..4ef892a102f316 100644 --- a/docs/pages/components/dividers.js +++ b/docs/pages/components/dividers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/dividers/dividers.md?@material-ui/markdown'; +} from 'docs/src/pages/components/dividers/dividers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/drawers.js b/docs/pages/components/drawers.js index c7ff281f165be3..16420ff28479fa 100644 --- a/docs/pages/components/drawers.js +++ b/docs/pages/components/drawers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/drawers/drawers.md?@material-ui/markdown'; +} from 'docs/src/pages/components/drawers/drawers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/floating-action-button.js b/docs/pages/components/floating-action-button.js index 696de2b7f019a4..012eaa38d2ebe2 100644 --- a/docs/pages/components/floating-action-button.js +++ b/docs/pages/components/floating-action-button.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/floating-action-button/floating-action-button.md?@material-ui/markdown'; +} from 'docs/src/pages/components/floating-action-button/floating-action-button.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/grid.js b/docs/pages/components/grid.js index 11f2a6aa26dada..49b55c271cc7bb 100644 --- a/docs/pages/components/grid.js +++ b/docs/pages/components/grid.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/components/grid/grid.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/components/grid/grid.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/hidden.js b/docs/pages/components/hidden.js index 8a1036d2c06c44..6b9eee67c220f1 100644 --- a/docs/pages/components/hidden.js +++ b/docs/pages/components/hidden.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/hidden/hidden.md?@material-ui/markdown'; +} from 'docs/src/pages/components/hidden/hidden.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/icons.js b/docs/pages/components/icons.js index 5efc7683eccd81..c5154ebee6a5e0 100644 --- a/docs/pages/components/icons.js +++ b/docs/pages/components/icons.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/icons/icons.md?@material-ui/markdown'; +} from 'docs/src/pages/components/icons/icons.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/image-list.js b/docs/pages/components/image-list.js index 2808e3a69ac2f8..c003fcd60a36cc 100644 --- a/docs/pages/components/image-list.js +++ b/docs/pages/components/image-list.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/image-list/image-list.md?@material-ui/markdown'; +} from 'docs/src/pages/components/image-list/image-list.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/links.js b/docs/pages/components/links.js index 6c62d23cda0708..c0c6e30b7c9dde 100644 --- a/docs/pages/components/links.js +++ b/docs/pages/components/links.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/links/links.md?@material-ui/markdown'; +} from 'docs/src/pages/components/links/links.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/lists.js b/docs/pages/components/lists.js index 290ff3a29218e7..c2c47d8f2a1c95 100644 --- a/docs/pages/components/lists.js +++ b/docs/pages/components/lists.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/lists/lists.md?@material-ui/markdown'; +} from 'docs/src/pages/components/lists/lists.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/masonry.js b/docs/pages/components/masonry.js index 2a4f8621fd449b..8098f30ae8bd38 100644 --- a/docs/pages/components/masonry.js +++ b/docs/pages/components/masonry.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/masonry/masonry.md?@material-ui/markdown'; +} from 'docs/src/pages/components/masonry/masonry.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/material-icons.js b/docs/pages/components/material-icons.js index 7254f16e419cd0..98ed28aa980f9f 100644 --- a/docs/pages/components/material-icons.js +++ b/docs/pages/components/material-icons.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/material-icons/material-icons.md?@material-ui/markdown'; +} from 'docs/src/pages/components/material-icons/material-icons.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/menus.js b/docs/pages/components/menus.js index b33cf8d7e84794..c2e659351149d5 100644 --- a/docs/pages/components/menus.js +++ b/docs/pages/components/menus.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/menus/menus.md?@material-ui/markdown'; +} from 'docs/src/pages/components/menus/menus.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/modal.js b/docs/pages/components/modal.js index cce8d3c2dfb932..e3a7c0bc8705b7 100644 --- a/docs/pages/components/modal.js +++ b/docs/pages/components/modal.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/modal/modal.md?@material-ui/markdown'; +} from 'docs/src/pages/components/modal/modal.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/no-ssr.js b/docs/pages/components/no-ssr.js index cf8e1ef02d7b8c..aea4d2cb4d9d79 100644 --- a/docs/pages/components/no-ssr.js +++ b/docs/pages/components/no-ssr.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/no-ssr/no-ssr.md?@material-ui/markdown'; +} from 'docs/src/pages/components/no-ssr/no-ssr.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/pagination.js b/docs/pages/components/pagination.js index e5a73008b7a6ac..1d103420a1c2c1 100644 --- a/docs/pages/components/pagination.js +++ b/docs/pages/components/pagination.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/pagination/pagination.md?@material-ui/markdown'; +} from 'docs/src/pages/components/pagination/pagination.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/paper.js b/docs/pages/components/paper.js index 606d80c4050357..a95b7c7d8a392e 100644 --- a/docs/pages/components/paper.js +++ b/docs/pages/components/paper.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/paper/paper.md?@material-ui/markdown'; +} from 'docs/src/pages/components/paper/paper.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/pickers.js b/docs/pages/components/pickers.js index 92e03133d4a59e..1039a3d19f796d 100644 --- a/docs/pages/components/pickers.js +++ b/docs/pages/components/pickers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/pickers/pickers.md?@material-ui/markdown'; +} from 'docs/src/pages/components/pickers/pickers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/popover.js b/docs/pages/components/popover.js index fc1039e06734e5..8aa819abb50d8b 100644 --- a/docs/pages/components/popover.js +++ b/docs/pages/components/popover.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/popover/popover.md?@material-ui/markdown'; +} from 'docs/src/pages/components/popover/popover.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/popper.js b/docs/pages/components/popper.js index c52df745fda88e..11814fac7bfc9c 100644 --- a/docs/pages/components/popper.js +++ b/docs/pages/components/popper.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/popper/popper.md?@material-ui/markdown'; +} from 'docs/src/pages/components/popper/popper.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/portal.js b/docs/pages/components/portal.js index 678d3a601f4e39..dc717e2ecd0d12 100644 --- a/docs/pages/components/portal.js +++ b/docs/pages/components/portal.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/portal/portal.md?@material-ui/markdown'; +} from 'docs/src/pages/components/portal/portal.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/progress.js b/docs/pages/components/progress.js index f697fb23a711d8..06adf1b660f5ce 100644 --- a/docs/pages/components/progress.js +++ b/docs/pages/components/progress.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/progress/progress.md?@material-ui/markdown'; +} from 'docs/src/pages/components/progress/progress.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/radio-buttons.js b/docs/pages/components/radio-buttons.js index 85c2c5830c28bb..570590f03fa0c3 100644 --- a/docs/pages/components/radio-buttons.js +++ b/docs/pages/components/radio-buttons.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/radio-buttons/radio-buttons.md?@material-ui/markdown'; +} from 'docs/src/pages/components/radio-buttons/radio-buttons.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/rating.js b/docs/pages/components/rating.js index 1db3ba7b514ac9..350eb1fd82bea5 100644 --- a/docs/pages/components/rating.js +++ b/docs/pages/components/rating.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/rating/rating.md?@material-ui/markdown'; +} from 'docs/src/pages/components/rating/rating.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/selects.js b/docs/pages/components/selects.js index ffebd7997bc2f6..2041db6d81640e 100644 --- a/docs/pages/components/selects.js +++ b/docs/pages/components/selects.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/selects/selects.md?@material-ui/markdown'; +} from 'docs/src/pages/components/selects/selects.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/skeleton.js b/docs/pages/components/skeleton.js index 1bdaffb9a07b7c..c0cc4fb34f9805 100644 --- a/docs/pages/components/skeleton.js +++ b/docs/pages/components/skeleton.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/skeleton/skeleton.md?@material-ui/markdown'; +} from 'docs/src/pages/components/skeleton/skeleton.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/slider.js b/docs/pages/components/slider.js index 50b3cbe0057acb..e39563780df877 100644 --- a/docs/pages/components/slider.js +++ b/docs/pages/components/slider.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/slider/slider.md?@material-ui/markdown'; +} from 'docs/src/pages/components/slider/slider.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/snackbars.js b/docs/pages/components/snackbars.js index 60b0b55bb71759..09131076da4b0b 100644 --- a/docs/pages/components/snackbars.js +++ b/docs/pages/components/snackbars.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/snackbars/snackbars.md?@material-ui/markdown'; +} from 'docs/src/pages/components/snackbars/snackbars.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/speed-dial.js b/docs/pages/components/speed-dial.js index 0d72a350b2b35c..85d2a4ca1d6e44 100644 --- a/docs/pages/components/speed-dial.js +++ b/docs/pages/components/speed-dial.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/speed-dial/speed-dial.md?@material-ui/markdown'; +} from 'docs/src/pages/components/speed-dial/speed-dial.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/stack.js b/docs/pages/components/stack.js index 64fc3b331c7b0f..efff42b42226a5 100644 --- a/docs/pages/components/stack.js +++ b/docs/pages/components/stack.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/stack/stack.md?@material-ui/markdown'; +} from 'docs/src/pages/components/stack/stack.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/steppers.js b/docs/pages/components/steppers.js index d6c63a93cfe9d0..211af5f32fcd3d 100644 --- a/docs/pages/components/steppers.js +++ b/docs/pages/components/steppers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/steppers/steppers.md?@material-ui/markdown'; +} from 'docs/src/pages/components/steppers/steppers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/switches.js b/docs/pages/components/switches.js index b0fd2a6debf8d0..4962b5b728d968 100644 --- a/docs/pages/components/switches.js +++ b/docs/pages/components/switches.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/switches/switches.md?@material-ui/markdown'; +} from 'docs/src/pages/components/switches/switches.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/tables.js b/docs/pages/components/tables.js index a05f1cf605dfa7..c2253172a97069 100644 --- a/docs/pages/components/tables.js +++ b/docs/pages/components/tables.js @@ -4,7 +4,7 @@ import { docs, demos, demoComponents, -} from 'docs/src/pages/components/tables/tables.md?@material-ui/markdown'; +} from 'docs/src/pages/components/tables/tables.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/tabs.js b/docs/pages/components/tabs.js index f974bbf005d313..45d577b4fa2acd 100644 --- a/docs/pages/components/tabs.js +++ b/docs/pages/components/tabs.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/components/tabs/tabs.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/components/tabs/tabs.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/text-fields.js b/docs/pages/components/text-fields.js index 8860f5465e78ac..4bb2c0726d70d3 100644 --- a/docs/pages/components/text-fields.js +++ b/docs/pages/components/text-fields.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/text-fields/text-fields.md?@material-ui/markdown'; +} from 'docs/src/pages/components/text-fields/text-fields.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/textarea-autosize.js b/docs/pages/components/textarea-autosize.js index a108c011700be9..c3e46e88f5b8ad 100644 --- a/docs/pages/components/textarea-autosize.js +++ b/docs/pages/components/textarea-autosize.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/textarea-autosize/textarea-autosize.md?@material-ui/markdown'; +} from 'docs/src/pages/components/textarea-autosize/textarea-autosize.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/time-picker.js b/docs/pages/components/time-picker.js index 1cff425b8251a6..2e9f3ac5c68064 100644 --- a/docs/pages/components/time-picker.js +++ b/docs/pages/components/time-picker.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/time-picker/time-picker.md?@material-ui/markdown'; +} from 'docs/src/pages/components/time-picker/time-picker.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/timeline.js b/docs/pages/components/timeline.js index 3acd12cc5bf85c..62f0873facb003 100644 --- a/docs/pages/components/timeline.js +++ b/docs/pages/components/timeline.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/timeline/timeline.md?@material-ui/markdown'; +} from 'docs/src/pages/components/timeline/timeline.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/toggle-button.js b/docs/pages/components/toggle-button.js index 47cb419e9a8e0f..4b15c5b42e69b2 100644 --- a/docs/pages/components/toggle-button.js +++ b/docs/pages/components/toggle-button.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/toggle-button/toggle-button.md?@material-ui/markdown'; +} from 'docs/src/pages/components/toggle-button/toggle-button.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/tooltips.js b/docs/pages/components/tooltips.js index 7e10b2c12fc464..fcef90e2227d16 100644 --- a/docs/pages/components/tooltips.js +++ b/docs/pages/components/tooltips.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/tooltips/tooltips.md?@material-ui/markdown'; +} from 'docs/src/pages/components/tooltips/tooltips.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/transfer-list.js b/docs/pages/components/transfer-list.js index a1e68463b180ab..00a747651a7063 100644 --- a/docs/pages/components/transfer-list.js +++ b/docs/pages/components/transfer-list.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/transfer-list/transfer-list.md?@material-ui/markdown'; +} from 'docs/src/pages/components/transfer-list/transfer-list.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/transitions.js b/docs/pages/components/transitions.js index 668e85e5d52ab1..88e68569156223 100644 --- a/docs/pages/components/transitions.js +++ b/docs/pages/components/transitions.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/transitions/transitions.md?@material-ui/markdown'; +} from 'docs/src/pages/components/transitions/transitions.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/trap-focus.js b/docs/pages/components/trap-focus.js index d58be8eba80c09..054df03053d1e6 100644 --- a/docs/pages/components/trap-focus.js +++ b/docs/pages/components/trap-focus.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/trap-focus/trap-focus.md?@material-ui/markdown'; +} from 'docs/src/pages/components/trap-focus/trap-focus.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/tree-view.js b/docs/pages/components/tree-view.js index 206530f7c429ac..8d3f936e20b581 100644 --- a/docs/pages/components/tree-view.js +++ b/docs/pages/components/tree-view.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/tree-view/tree-view.md?@material-ui/markdown'; +} from 'docs/src/pages/components/tree-view/tree-view.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/typography.js b/docs/pages/components/typography.js index 0b6a282a633fe5..6c93e25d29490d 100644 --- a/docs/pages/components/typography.js +++ b/docs/pages/components/typography.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/typography/typography.md?@material-ui/markdown'; +} from 'docs/src/pages/components/typography/typography.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/components/use-media-query.js b/docs/pages/components/use-media-query.js index 3067441c1e8e6a..ed2ceb15325ba1 100644 --- a/docs/pages/components/use-media-query.js +++ b/docs/pages/components/use-media-query.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/components/use-media-query/use-media-query.md?@material-ui/markdown'; +} from 'docs/src/pages/components/use-media-query/use-media-query.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/breakpoints.js b/docs/pages/customization/breakpoints.js index bd41a72d2521d9..ea7ff3eda71e7f 100644 --- a/docs/pages/customization/breakpoints.js +++ b/docs/pages/customization/breakpoints.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/breakpoints/breakpoints.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/breakpoints/breakpoints.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/color.js b/docs/pages/customization/color.js index 41e4ab9a49f235..0438902e7e7893 100644 --- a/docs/pages/customization/color.js +++ b/docs/pages/customization/color.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/color/color.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/color/color.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/default-theme.js b/docs/pages/customization/default-theme.js index 22a01bc1e3975f..bc884eb87a04e1 100644 --- a/docs/pages/customization/default-theme.js +++ b/docs/pages/customization/default-theme.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/default-theme/default-theme.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/default-theme/default-theme.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/density.js b/docs/pages/customization/density.js index c625206e9ce9b1..99ca29beea967e 100644 --- a/docs/pages/customization/density.js +++ b/docs/pages/customization/density.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/density/density.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/density/density.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/how-to-customize.js b/docs/pages/customization/how-to-customize.js index e320da11d27d2b..593f3236a2e0a7 100644 --- a/docs/pages/customization/how-to-customize.js +++ b/docs/pages/customization/how-to-customize.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/how-to-customize/how-to-customize.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/how-to-customize/how-to-customize.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/palette.js b/docs/pages/customization/palette.js index 29daede7b2b5fc..6660d5b389fe64 100644 --- a/docs/pages/customization/palette.js +++ b/docs/pages/customization/palette.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/palette/palette.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/palette/palette.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/spacing.js b/docs/pages/customization/spacing.js index 0e36569265e68f..cc4307970c1a2b 100644 --- a/docs/pages/customization/spacing.js +++ b/docs/pages/customization/spacing.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/spacing/spacing.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/spacing/spacing.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/theme-components.js b/docs/pages/customization/theme-components.js index f002ea73872b3c..97fc09fd7d7f6d 100644 --- a/docs/pages/customization/theme-components.js +++ b/docs/pages/customization/theme-components.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/theme-components/theme-components.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/theme-components/theme-components.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/theming.js b/docs/pages/customization/theming.js index 9b661280a28433..45ffd0678aba88 100644 --- a/docs/pages/customization/theming.js +++ b/docs/pages/customization/theming.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/theming/theming.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/theming/theming.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/transitions.js b/docs/pages/customization/transitions.js index 2ec4281f888900..bf63acc2248b3d 100644 --- a/docs/pages/customization/transitions.js +++ b/docs/pages/customization/transitions.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/transitions/transitions.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/transitions/transitions.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/typography.js b/docs/pages/customization/typography.js index 3af98ebe8d429c..7f4902e1211871 100644 --- a/docs/pages/customization/typography.js +++ b/docs/pages/customization/typography.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/typography/typography.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/typography/typography.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/unstyled-components.js b/docs/pages/customization/unstyled-components.js index c8e75690663f86..c680dd8fee63bc 100644 --- a/docs/pages/customization/unstyled-components.js +++ b/docs/pages/customization/unstyled-components.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/unstyled-components/unstyled-components.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/unstyled-components/unstyled-components.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/customization/z-index.js b/docs/pages/customization/z-index.js index eda408d666f2c6..3bb3708984a1b1 100644 --- a/docs/pages/customization/z-index.js +++ b/docs/pages/customization/z-index.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/customization/z-index/z-index.md?@material-ui/markdown'; +} from 'docs/src/pages/customization/z-index/z-index.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/backers.js b/docs/pages/discover-more/backers.js index a3efed5fa50f3e..2c698d6fa4db57 100644 --- a/docs/pages/discover-more/backers.js +++ b/docs/pages/discover-more/backers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/backers/backers.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/backers/backers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/changelog.js b/docs/pages/discover-more/changelog.js index 2b65175bcc931c..eff6aa20d9b730 100644 --- a/docs/pages/discover-more/changelog.js +++ b/docs/pages/discover-more/changelog.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/changelog/changelog.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/changelog/changelog.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/languages.js b/docs/pages/discover-more/languages.js index eb4ce17d494fc3..59f01976e62756 100644 --- a/docs/pages/discover-more/languages.js +++ b/docs/pages/discover-more/languages.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/languages/languages.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/languages/languages.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/related-projects.js b/docs/pages/discover-more/related-projects.js index c7d5664c837358..a416457e37976c 100644 --- a/docs/pages/discover-more/related-projects.js +++ b/docs/pages/discover-more/related-projects.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/related-projects/related-projects.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/related-projects/related-projects.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/roadmap.js b/docs/pages/discover-more/roadmap.js index bcc5edb06f09f6..3637ea17b470df 100644 --- a/docs/pages/discover-more/roadmap.js +++ b/docs/pages/discover-more/roadmap.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/roadmap/roadmap.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/roadmap/roadmap.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/showcase.js b/docs/pages/discover-more/showcase.js index c6228f6fc63951..8117d12cc861c2 100644 --- a/docs/pages/discover-more/showcase.js +++ b/docs/pages/discover-more/showcase.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/showcase/showcase.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/showcase/showcase.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/team.js b/docs/pages/discover-more/team.js index d1d3c82ea10349..6c7b353d42d24b 100644 --- a/docs/pages/discover-more/team.js +++ b/docs/pages/discover-more/team.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/team/team.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/team/team.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/discover-more/vision.js b/docs/pages/discover-more/vision.js index b150e09c3f6604..d79ca1808458fe 100644 --- a/docs/pages/discover-more/vision.js +++ b/docs/pages/discover-more/vision.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/discover-more/vision/vision.md?@material-ui/markdown'; +} from 'docs/src/pages/discover-more/vision/vision.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/example-projects.js b/docs/pages/getting-started/example-projects.js index f2552b977bfcdd..c7ad872a45cc84 100644 --- a/docs/pages/getting-started/example-projects.js +++ b/docs/pages/getting-started/example-projects.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/example-projects/example-projects.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/example-projects/example-projects.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/faq.js b/docs/pages/getting-started/faq.js index c53847ce948073..3d6e3eb2f8c140 100644 --- a/docs/pages/getting-started/faq.js +++ b/docs/pages/getting-started/faq.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/faq/faq.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/faq/faq.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/installation.js b/docs/pages/getting-started/installation.js index 3a1704a1d42368..010504d9e709fc 100644 --- a/docs/pages/getting-started/installation.js +++ b/docs/pages/getting-started/installation.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/installation/installation.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/installation/installation.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/learn.js b/docs/pages/getting-started/learn.js index 8931913d460b59..6fcf19965cf0c1 100644 --- a/docs/pages/getting-started/learn.js +++ b/docs/pages/getting-started/learn.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/learn/learn.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/learn/learn.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/support.js b/docs/pages/getting-started/support.js index 31fbcb096cceb2..62548f5467841f 100644 --- a/docs/pages/getting-started/support.js +++ b/docs/pages/getting-started/support.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/support/support.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/support/support.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/supported-components.js b/docs/pages/getting-started/supported-components.js index f073c7248c0623..140f2cf730e25c 100644 --- a/docs/pages/getting-started/supported-components.js +++ b/docs/pages/getting-started/supported-components.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/supported-components/supported-components.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/supported-components/supported-components.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/supported-platforms.js b/docs/pages/getting-started/supported-platforms.js index 3e1ace0b634fcf..f78a71e480c3e4 100644 --- a/docs/pages/getting-started/supported-platforms.js +++ b/docs/pages/getting-started/supported-platforms.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/supported-platforms/supported-platforms.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/supported-platforms/supported-platforms.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/templates.js b/docs/pages/getting-started/templates.js index c97045d6ea23d1..96a6db3fd214f7 100644 --- a/docs/pages/getting-started/templates.js +++ b/docs/pages/getting-started/templates.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/templates/templates.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/templates/templates.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/getting-started/usage.js b/docs/pages/getting-started/usage.js index e17c753106b6a3..910436bf76de1e 100644 --- a/docs/pages/getting-started/usage.js +++ b/docs/pages/getting-started/usage.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/getting-started/usage/usage.md?@material-ui/markdown'; +} from 'docs/src/pages/getting-started/usage/usage.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/api.js b/docs/pages/guides/api.js index 83ceb468d452b1..455eb9be07c951 100644 --- a/docs/pages/guides/api.js +++ b/docs/pages/guides/api.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/guides/api/api.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/guides/api/api.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/composition.js b/docs/pages/guides/composition.js index 199093c150fa70..52a969b9e2b53b 100644 --- a/docs/pages/guides/composition.js +++ b/docs/pages/guides/composition.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/composition/composition.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/composition/composition.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/content-security-policy.js b/docs/pages/guides/content-security-policy.js index 9dcd364f6046c7..a70a08e78bd0e8 100644 --- a/docs/pages/guides/content-security-policy.js +++ b/docs/pages/guides/content-security-policy.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/content-security-policy/content-security-policy.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/content-security-policy/content-security-policy.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/flow.js b/docs/pages/guides/flow.js index db2cce3c09df65..4a67e968090b7d 100644 --- a/docs/pages/guides/flow.js +++ b/docs/pages/guides/flow.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/guides/flow/flow.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/guides/flow/flow.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/interoperability.js b/docs/pages/guides/interoperability.js index 194048c14844d9..d04c1c0f849430 100644 --- a/docs/pages/guides/interoperability.js +++ b/docs/pages/guides/interoperability.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/interoperability/interoperability.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/interoperability/interoperability.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/localization.js b/docs/pages/guides/localization.js index 3e1d9f8ac5d9e0..091aafa35fa311 100644 --- a/docs/pages/guides/localization.js +++ b/docs/pages/guides/localization.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/localization/localization.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/localization/localization.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/migration-v0x.js b/docs/pages/guides/migration-v0x.js index 605a5851a712f6..e01aaeca8e7e2a 100644 --- a/docs/pages/guides/migration-v0x.js +++ b/docs/pages/guides/migration-v0x.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/migration-v0x/migration-v0x.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/migration-v0x/migration-v0x.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/migration-v3.js b/docs/pages/guides/migration-v3.js index 7da25eabe0b4d9..a01f22aa269f7d 100644 --- a/docs/pages/guides/migration-v3.js +++ b/docs/pages/guides/migration-v3.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/migration-v3/migration-v3.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/migration-v3/migration-v3.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/migration-v4.js b/docs/pages/guides/migration-v4.js index 99d86e39298292..dbd38623b54c16 100644 --- a/docs/pages/guides/migration-v4.js +++ b/docs/pages/guides/migration-v4.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/migration-v4/migration-v4.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/migration-v4/migration-v4.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/minimizing-bundle-size.js b/docs/pages/guides/minimizing-bundle-size.js index 0d49f30c204153..d0e65ffcc70759 100644 --- a/docs/pages/guides/minimizing-bundle-size.js +++ b/docs/pages/guides/minimizing-bundle-size.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/pickers-migration.js b/docs/pages/guides/pickers-migration.js index e7d4407db5a998..78e0cb0809541e 100644 --- a/docs/pages/guides/pickers-migration.js +++ b/docs/pages/guides/pickers-migration.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/pickers-migration/pickers-migration.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/pickers-migration/pickers-migration.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/responsive-ui.js b/docs/pages/guides/responsive-ui.js index 52e008e9b83a4f..c8a569f9f96edc 100644 --- a/docs/pages/guides/responsive-ui.js +++ b/docs/pages/guides/responsive-ui.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/responsive-ui/responsive-ui.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/responsive-ui/responsive-ui.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/right-to-left.js b/docs/pages/guides/right-to-left.js index c0ffa96ad82668..6fc35b24cd3b68 100644 --- a/docs/pages/guides/right-to-left.js +++ b/docs/pages/guides/right-to-left.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/right-to-left/right-to-left.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/right-to-left/right-to-left.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/routing.js b/docs/pages/guides/routing.js index 560b4498648316..f2c99775fbe3ce 100644 --- a/docs/pages/guides/routing.js +++ b/docs/pages/guides/routing.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/routing/routing.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/routing/routing.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/server-rendering.js b/docs/pages/guides/server-rendering.js index 31f5c05768cdab..63a41d5f73979a 100644 --- a/docs/pages/guides/server-rendering.js +++ b/docs/pages/guides/server-rendering.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/server-rendering/server-rendering.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/server-rendering/server-rendering.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/styled-engine.js b/docs/pages/guides/styled-engine.js index 7c87054e3e01fd..a259f063e7456d 100644 --- a/docs/pages/guides/styled-engine.js +++ b/docs/pages/guides/styled-engine.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/styled-engine/styled-engine.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/styled-engine/styled-engine.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/testing.js b/docs/pages/guides/testing.js index a5a37e5831e093..468d6eb942d67a 100644 --- a/docs/pages/guides/testing.js +++ b/docs/pages/guides/testing.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/testing/testing.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/testing/testing.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/guides/typescript.js b/docs/pages/guides/typescript.js index 850db1421418ae..580878edfee959 100644 --- a/docs/pages/guides/typescript.js +++ b/docs/pages/guides/typescript.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/guides/typescript/typescript.md?@material-ui/markdown'; +} from 'docs/src/pages/guides/typescript/typescript.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/index.tsx b/docs/pages/index.tsx index 549d1dddbe969a..a7b82f0eaad10b 100644 --- a/docs/pages/index.tsx +++ b/docs/pages/index.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography, { TypographyProps } from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography, { TypographyProps } from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; import Steps from 'docs/src/pages/landing/Steps'; import Themes from 'docs/src/pages/landing/Themes'; import QuickWord from 'docs/src/pages/landing/QuickWord'; diff --git a/docs/pages/performance/slider-emotion.js b/docs/pages/performance/slider-emotion.js index cfdfbeb0bf36d4..506f25ef3b4080 100644 --- a/docs/pages/performance/slider-emotion.js +++ b/docs/pages/performance/slider-emotion.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Slider from '@material-ui/core/Slider'; +import NoSsr from '@mui/core/NoSsr'; +import Slider from '@mui/material/Slider'; const data = { name: 'Frozen yoghurt', diff --git a/docs/pages/performance/slider-jss.js b/docs/pages/performance/slider-jss.js index 67b346fd014d7f..25e6cdeb1f7a5a 100644 --- a/docs/pages/performance/slider-jss.js +++ b/docs/pages/performance/slider-jss.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Slider from '@material-ui/core/Slider'; +import NoSsr from '@mui/core/NoSsr'; +import Slider from '@mui/material/Slider'; const data = { name: 'Frozen yoghurt', diff --git a/docs/pages/performance/system.js b/docs/pages/performance/system.js index b74863879559c9..064643204a1b08 100644 --- a/docs/pages/performance/system.js +++ b/docs/pages/performance/system.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Box from '@material-ui/core/Box'; +import NoSsr from '@mui/core/NoSsr'; +import Box from '@mui/material/Box'; export default function SxPropBoxMaterialUI() { return ( diff --git a/docs/pages/performance/table-component.js b/docs/pages/performance/table-component.js index 0c5095dcebb84c..8371be47a91bee 100644 --- a/docs/pages/performance/table-component.js +++ b/docs/pages/performance/table-component.js @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import NoSsr from '@material-ui/unstyled/NoSsr'; +import NoSsr from '@mui/core/NoSsr'; const createComponent = (defaultComponent) => { const MyComponent = React.forwardRef(function MyComponent(props, ref) { diff --git a/docs/pages/performance/table-emotion.js b/docs/pages/performance/table-emotion.js index 3c72e1601e61d7..111c88b17359cb 100644 --- a/docs/pages/performance/table-emotion.js +++ b/docs/pages/performance/table-emotion.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; -// import { styled } from '@material-ui/core/styles'; -import NoSsr from '@material-ui/unstyled/NoSsr'; +// import { styled } from '@mui/material/styles'; +import NoSsr from '@mui/core/NoSsr'; const createComponent = (defaultComponent) => { const Root = styled('div')` diff --git a/docs/pages/performance/table-hook.js b/docs/pages/performance/table-hook.js index 3e391ecff5be70..b19fd290da2fed 100644 --- a/docs/pages/performance/table-hook.js +++ b/docs/pages/performance/table-hook.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { makeStyles } from '@material-ui/styles'; -import NoSsr from '@material-ui/unstyled/NoSsr'; +import { makeStyles } from '@mui/styles'; +import NoSsr from '@mui/core/NoSsr'; const createComponent = (defaultComponent) => { const useStyles = makeStyles({ diff --git a/docs/pages/performance/table-mui.js b/docs/pages/performance/table-mui.js index 7cd8564b8e5136..66b9f4b62c4cb0 100644 --- a/docs/pages/performance/table-mui.js +++ b/docs/pages/performance/table-mui.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Table from '@material-ui/core/Table'; -import TableBody from '@material-ui/core/TableBody'; -import TableCell from '@material-ui/core/TableCell'; -import TableHead from '@material-ui/core/TableHead'; -import TableRow from '@material-ui/core/TableRow'; +import NoSsr from '@mui/core/NoSsr'; +import Table from '@mui/material/Table'; +import TableBody from '@mui/material/TableBody'; +import TableCell from '@mui/material/TableCell'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 }; const rows = Array.from(new Array(100)).map(() => data); diff --git a/docs/pages/performance/table-raw.js b/docs/pages/performance/table-raw.js index 00e3cc9117adef..2685235027ca07 100644 --- a/docs/pages/performance/table-raw.js +++ b/docs/pages/performance/table-raw.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import NoSsr from '@material-ui/unstyled/NoSsr'; +import NoSsr from '@mui/core/NoSsr'; const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 }; const rows = Array.from(new Array(100)).map(() => data); diff --git a/docs/pages/performance/table-styled-components.js b/docs/pages/performance/table-styled-components.js index a29db720be0250..b3cc7904d71677 100644 --- a/docs/pages/performance/table-styled-components.js +++ b/docs/pages/performance/table-styled-components.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import NoSsr from '@material-ui/unstyled/NoSsr'; +import NoSsr from '@mui/core/NoSsr'; const createComponent = (defaultComponent) => { const MyComponent = React.forwardRef(function MyComponent(props, ref) { diff --git a/docs/pages/production-error.js b/docs/pages/production-error.js index e2e1dd0a40ef86..e3be42ada78d75 100644 --- a/docs/pages/production-error.js +++ b/docs/pages/production-error.js @@ -4,7 +4,7 @@ import { docs, demos, demoComponents, -} from 'docs/src/pages/production-error/index.md?@material-ui/markdown'; +} from 'docs/src/pages/production-error/index.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/styles/advanced.js b/docs/pages/styles/advanced.js index c5f08d578f9c88..74fc98521474a8 100644 --- a/docs/pages/styles/advanced.js +++ b/docs/pages/styles/advanced.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/styles/advanced/advanced.md?@material-ui/markdown'; +} from 'docs/src/pages/styles/advanced/advanced.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/styles/api.js b/docs/pages/styles/api.js index 95bc36acceec05..9eb574061b11c6 100644 --- a/docs/pages/styles/api.js +++ b/docs/pages/styles/api.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/styles/api/api.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/styles/api/api.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/styles/basics.js b/docs/pages/styles/basics.js index 7169f6778c8fe7..c2aad81772771c 100644 --- a/docs/pages/styles/basics.js +++ b/docs/pages/styles/basics.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/styles/basics/basics.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/styles/basics/basics.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/advanced.js b/docs/pages/system/advanced.js index faf3d1b84cff26..ea850fffd20220 100644 --- a/docs/pages/system/advanced.js +++ b/docs/pages/system/advanced.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/advanced/advanced.md?@material-ui/markdown'; +} from 'docs/src/pages/system/advanced/advanced.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/basics.js b/docs/pages/system/basics.js index 254b9c964e38f9..fb541336483624 100644 --- a/docs/pages/system/basics.js +++ b/docs/pages/system/basics.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/system/basics/basics.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/system/basics/basics.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/borders.js b/docs/pages/system/borders.js index 40f89764df25ca..84f8287cc7d989 100644 --- a/docs/pages/system/borders.js +++ b/docs/pages/system/borders.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/borders/borders.md?@material-ui/markdown'; +} from 'docs/src/pages/system/borders/borders.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/box.js b/docs/pages/system/box.js index e266da8029e7ff..9a24156fd32976 100644 --- a/docs/pages/system/box.js +++ b/docs/pages/system/box.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/system/box/box.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/system/box/box.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/display.js b/docs/pages/system/display.js index eb1506505fa23f..be3cf6d7b99186 100644 --- a/docs/pages/system/display.js +++ b/docs/pages/system/display.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/display/display.md?@material-ui/markdown'; +} from 'docs/src/pages/system/display/display.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/flexbox.js b/docs/pages/system/flexbox.js index 2d23429c172cc0..0693667d33f008 100644 --- a/docs/pages/system/flexbox.js +++ b/docs/pages/system/flexbox.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/flexbox/flexbox.md?@material-ui/markdown'; +} from 'docs/src/pages/system/flexbox/flexbox.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/grid.js b/docs/pages/system/grid.js index 0cc252b16d013a..2463bc6edf9e2a 100644 --- a/docs/pages/system/grid.js +++ b/docs/pages/system/grid.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/system/grid/grid.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/system/grid/grid.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/palette.js b/docs/pages/system/palette.js index ff27e892e5bf02..f313beaf2042c8 100644 --- a/docs/pages/system/palette.js +++ b/docs/pages/system/palette.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/palette/palette.md?@material-ui/markdown'; +} from 'docs/src/pages/system/palette/palette.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/positions.js b/docs/pages/system/positions.js index f1743afa68b2ce..efc19997e3d1da 100644 --- a/docs/pages/system/positions.js +++ b/docs/pages/system/positions.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/positions/positions.md?@material-ui/markdown'; +} from 'docs/src/pages/system/positions/positions.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/properties.js b/docs/pages/system/properties.js index d0d8e87e1ce208..4e1dc7bf17ebd2 100644 --- a/docs/pages/system/properties.js +++ b/docs/pages/system/properties.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/properties/properties.md?@material-ui/markdown'; +} from 'docs/src/pages/system/properties/properties.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/screen-readers.js b/docs/pages/system/screen-readers.js index 67e9b5e681c986..344fcc134501cc 100644 --- a/docs/pages/system/screen-readers.js +++ b/docs/pages/system/screen-readers.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/screen-readers/screen-readers.md?@material-ui/markdown'; +} from 'docs/src/pages/system/screen-readers/screen-readers.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/shadows.js b/docs/pages/system/shadows.js index bf2260df406481..c539338415ded7 100644 --- a/docs/pages/system/shadows.js +++ b/docs/pages/system/shadows.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/shadows/shadows.md?@material-ui/markdown'; +} from 'docs/src/pages/system/shadows/shadows.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/sizing.js b/docs/pages/system/sizing.js index 7d1f4a6d053430..8eefb57f457fad 100644 --- a/docs/pages/system/sizing.js +++ b/docs/pages/system/sizing.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/system/sizing/sizing.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/system/sizing/sizing.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/spacing.js b/docs/pages/system/spacing.js index b5f1a3eca450d5..fc6cd3ccd78b5a 100644 --- a/docs/pages/system/spacing.js +++ b/docs/pages/system/spacing.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/spacing/spacing.md?@material-ui/markdown'; +} from 'docs/src/pages/system/spacing/spacing.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/styled.js b/docs/pages/system/styled.js index 20c3099dd68f18..eace9e0a248c8c 100644 --- a/docs/pages/system/styled.js +++ b/docs/pages/system/styled.js @@ -1,10 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/system/styled/styled.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/system/styled/styled.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/the-sx-prop.js b/docs/pages/system/the-sx-prop.js index fe66a5405a1938..28fe48a8dbfae7 100644 --- a/docs/pages/system/the-sx-prop.js +++ b/docs/pages/system/the-sx-prop.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/the-sx-prop/the-sx-prop.md?@material-ui/markdown'; +} from 'docs/src/pages/system/the-sx-prop/the-sx-prop.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/system/typography.js b/docs/pages/system/typography.js index 8e2c81329e59a2..d63062ccb65a54 100644 --- a/docs/pages/system/typography.js +++ b/docs/pages/system/typography.js @@ -4,7 +4,7 @@ import { demos, docs, demoComponents, -} from 'docs/src/pages/system/typography/typography.md?@material-ui/markdown'; +} from 'docs/src/pages/system/typography/typography.md?@mui/markdown'; export default function Page() { return ; diff --git a/docs/pages/versions.js b/docs/pages/versions.js index ba2ad1dba2393d..61dee05f26a0c2 100644 --- a/docs/pages/versions.js +++ b/docs/pages/versions.js @@ -2,11 +2,7 @@ import * as React from 'react'; import sortedUniqBy from 'lodash/sortedUniqBy'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; import VersionsContext from 'docs/src/pages/versions/VersionsContext'; -import { - demos, - docs, - demoComponents, -} from 'docs/src/pages/versions/versions.md?@material-ui/markdown'; +import { demos, docs, demoComponents } from 'docs/src/pages/versions/versions.md?@mui/markdown'; export default function Page(props) { const { versions } = props; diff --git a/docs/public/static/error-codes.json b/docs/public/static/error-codes.json index 66ad08869fb91a..4d59f1fc17a0e9 100644 --- a/docs/public/static/error-codes.json +++ b/docs/public/static/error-codes.json @@ -3,16 +3,16 @@ "2": "Material-UI: The `value` prop must be an array when using the `Select` component with `multiple`.", "3": "Material-UI: Unsupported `%s` color.\nWe support the following formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla().", "4": "Material-UI: The color provided to augmentColor(color) is invalid.\nThe color object needs to have a `main` property or a `%s` property.", - "5": "Material-UI: The color provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@material-ui/core/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });", + "5": "Material-UI: The color provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });", "6": "Material-UI: Unsupported non-unitless line height with grid alignment.\nUse unitless line heights instead.", "7": "Material-UI: `capitalize(string)` expects a string argument.", "8": "Material-UI: Unsupported `%s` color.\nWe support the following formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().", "9": "Material-UI: Unsupported `%s` color.\nThe following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().", "10": "Material-UI: unsupported `%s` color space.\nThe following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.", "11": "Material-UI: The color%s provided to augmentColor(color) is invalid.\nThe color object needs to have a `main` property or a `%s` property.", - "12": "Material-UI: The color%s provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@material-ui/core/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });", + "12": "Material-UI: The color%s provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });", "13": "Can not find utils in context. It looks like you forgot to wrap your component in LocalizationProvider, or pass dateAdapter prop directly.", - "14": "Material-UI: makeStyles is not longer exported from @material-ui/core/styles.\nYou have to import it from @material-ui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details.", - "15": "Material-UI: withStyles is not longer exported from @material-ui/core/styles.\nYou have to import it from @material-ui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details.", - "16": "Material-UI: withTheme is not longer exported from @material-ui/core/styles.\nYou have to import it from @material-ui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details." + "14": "Material-UI: makeStyles is not longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details.", + "15": "Material-UI: withStyles is not longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details.", + "16": "Material-UI: withTheme is not longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details." } diff --git a/docs/scripts/buildApi.ts b/docs/scripts/buildApi.ts index 6eb7f8b5b156c8..e0b538fd0afac3 100644 --- a/docs/scripts/buildApi.ts +++ b/docs/scripts/buildApi.ts @@ -27,9 +27,9 @@ import generatePropTypeDescription, { isElementAcceptingRefProp, } from 'docs/src/modules/utils/generatePropTypeDescription'; import { findPages, findPagesMarkdown, findComponents } from 'docs/src/modules/utils/find'; -import { getHeaders, renderInline as renderMarkdownInline } from '@material-ui/markdown'; +import { getHeaders, renderInline as renderMarkdownInline } from '@mui/markdown'; import { pageToTitle } from 'docs/src/modules/utils/helpers'; -import createGenerateClassName from '@material-ui/styles/createGenerateClassName'; +import createGenerateClassName from '@mui/styles/createGenerateClassName'; import * as ttp from 'typescript-to-proptypes'; import { getLineFeed, getUnstyledFilename } from './helpers'; diff --git a/docs/src/BrandingProvider.tsx b/docs/src/BrandingProvider.tsx index 7041939e53ea66..9790725c76dd83 100644 --- a/docs/src/BrandingProvider.tsx +++ b/docs/src/BrandingProvider.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { deepmerge } from '@material-ui/utils'; -import { ThemeProvider, useTheme, createTheme } from '@material-ui/core/styles'; -import CssBaseline from '@material-ui/core/CssBaseline'; +import { deepmerge } from '@mui/utils'; +import { ThemeProvider, useTheme, createTheme } from '@mui/material/styles'; +import CssBaseline from '@mui/material/CssBaseline'; import { getDesignTokens, getThemedComponents } from 'docs/src/modules/brandingTheme'; import { NextNProgressBar } from 'docs/src/modules/components/AppFrame'; diff --git a/docs/src/components/action/ArrowButton.tsx b/docs/src/components/action/ArrowButton.tsx index f69d1dc3f4788b..8a4b7373ee10f0 100644 --- a/docs/src/components/action/ArrowButton.tsx +++ b/docs/src/components/action/ArrowButton.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import IconButton, { IconButtonProps } from '@material-ui/core/IconButton'; -import KeyboardArrowLeftRounded from '@material-ui/icons/KeyboardArrowLeftRounded'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import IconButton, { IconButtonProps } from '@mui/material/IconButton'; +import KeyboardArrowLeftRounded from '@mui/icons-material/KeyboardArrowLeftRounded'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; export default function ArrowButton({ direction, diff --git a/docs/src/components/action/Frame.tsx b/docs/src/components/action/Frame.tsx index 262c0fb2b6ef62..26f7cc3fb8c8f6 100644 --- a/docs/src/components/action/Frame.tsx +++ b/docs/src/components/action/Frame.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { ThemeProvider } from '@material-ui/core/styles'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import { ThemeProvider } from '@mui/material/styles'; +import Box, { BoxProps } from '@mui/material/Box'; import { brandingDarkTheme } from 'docs/src/modules/brandingTheme'; const Demo = (props: BoxProps) => { diff --git a/docs/src/components/action/Highlighter.tsx b/docs/src/components/action/Highlighter.tsx index af18f736303f9d..0435ace5149342 100644 --- a/docs/src/components/action/Highlighter.tsx +++ b/docs/src/components/action/Highlighter.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import ButtonBase, { ButtonBaseProps } from '@material-ui/core/ButtonBase'; +import ButtonBase, { ButtonBaseProps } from '@mui/material/ButtonBase'; export default function Highlighter({ disableBorder = false, diff --git a/docs/src/components/action/Item.tsx b/docs/src/components/action/Item.tsx index f1f1c8a50e989c..c4f9ef502ad679 100644 --- a/docs/src/components/action/Item.tsx +++ b/docs/src/components/action/Item.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import { useTheme } from '@mui/material/styles'; +import Box, { BoxProps } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; export function Group({ desktopColumns = 1, ...props }: { desktopColumns?: number } & BoxProps) { const theme = useTheme(); diff --git a/docs/src/components/action/More.tsx b/docs/src/components/action/More.tsx index 8e82bc3422d209..aea91589d2598f 100644 --- a/docs/src/components/action/More.tsx +++ b/docs/src/components/action/More.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ButtonBase, { ButtonBaseProps } from '@material-ui/core/ButtonBase'; -import Typography from '@material-ui/core/Typography'; -import AddCircleOutlineRounded from '@material-ui/icons/AddCircleOutlineRounded'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import Box from '@mui/material/Box'; +import ButtonBase, { ButtonBaseProps } from '@mui/material/ButtonBase'; +import Typography from '@mui/material/Typography'; +import AddCircleOutlineRounded from '@mui/icons-material/AddCircleOutlineRounded'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; export default (function More(props: ButtonBaseProps) { return ( diff --git a/docs/src/components/animation/FadeDelay.tsx b/docs/src/components/animation/FadeDelay.tsx index 1fb1e0891a3eb9..f237f863ef71b0 100644 --- a/docs/src/components/animation/FadeDelay.tsx +++ b/docs/src/components/animation/FadeDelay.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Fade, { FadeProps } from '@material-ui/core/Fade'; +import Fade, { FadeProps } from '@mui/material/Fade'; export default function FadeDelay({ delay, ...props }: { delay: number } & FadeProps) { const [fadeIn, setFadeIn] = React.useState(false); diff --git a/docs/src/components/animation/Slide.tsx b/docs/src/components/animation/Slide.tsx index 183687e85e9b06..ec5e04e8ce507e 100644 --- a/docs/src/components/animation/Slide.tsx +++ b/docs/src/components/animation/Slide.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import Box, { BoxProps } from '@mui/material/Box'; export default function Slide({ animationName, diff --git a/docs/src/components/footer/EmailSubscribe.tsx b/docs/src/components/footer/EmailSubscribe.tsx index 8680661cdbcef0..b7f787baf4c47f 100644 --- a/docs/src/components/footer/EmailSubscribe.tsx +++ b/docs/src/components/footer/EmailSubscribe.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import { Theme, styled } from '@material-ui/core/styles'; -import { SxProps } from '@material-ui/system'; -import Alert from '@material-ui/core/Alert'; -import AlertTitle from '@material-ui/core/AlertTitle'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import InputBase from '@material-ui/core/InputBase'; -import CheckCircleRoundedIcon from '@material-ui/icons/CheckCircleRounded'; +import { Theme, styled } from '@mui/material/styles'; +import { SxProps } from '@mui/system'; +import Alert from '@mui/material/Alert'; +import AlertTitle from '@mui/material/AlertTitle'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import FormLabel from '@mui/material/FormLabel'; +import FormHelperText from '@mui/material/FormHelperText'; +import InputBase from '@mui/material/InputBase'; +import CheckCircleRoundedIcon from '@mui/icons-material/CheckCircleRounded'; const Form = styled('form')({}); diff --git a/docs/src/components/header/HeaderNavBar.tsx b/docs/src/components/header/HeaderNavBar.tsx index cf2c8b31cd4990..7b6c7fa2bbf8e2 100644 --- a/docs/src/components/header/HeaderNavBar.tsx +++ b/docs/src/components/header/HeaderNavBar.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; -import Paper from '@material-ui/core/Paper'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; +import { styled, alpha } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; +import Paper from '@mui/material/Paper'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; import IconImage from 'docs/src/components/icon/IconImage'; import ROUTES from 'docs/src/route'; import FEATURE_TOGGLE from 'docs/src/featureToggle'; diff --git a/docs/src/components/header/HeaderNavDropdown.tsx b/docs/src/components/header/HeaderNavDropdown.tsx index ff4f3bb89ad0ce..9e7f0e1f42e2f6 100644 --- a/docs/src/components/header/HeaderNavDropdown.tsx +++ b/docs/src/components/header/HeaderNavDropdown.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Collapse from '@material-ui/core/Collapse'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import KeyboardArrowDownRounded from '@material-ui/icons/KeyboardArrowDownRounded'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Collapse from '@mui/material/Collapse'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded'; import SvgHamburgerMenu from 'docs/src/icons/SvgHamburgerMenu'; import Link from 'docs/src/modules/components/Link'; import ROUTES from 'docs/src/route'; diff --git a/docs/src/components/header/ThemeModeToggle.tsx b/docs/src/components/header/ThemeModeToggle.tsx index b7a9b4113887ce..cfb021621afd0a 100644 --- a/docs/src/components/header/ThemeModeToggle.tsx +++ b/docs/src/components/header/ThemeModeToggle.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip'; -import DarkModeOutlined from '@material-ui/icons/DarkModeOutlined'; -import LightModeOutlined from '@material-ui/icons/LightModeOutlined'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip'; +import DarkModeOutlined from '@mui/icons-material/DarkModeOutlined'; +import LightModeOutlined from '@mui/icons-material/LightModeOutlined'; const ThemeModeToggle = (props: { checked: boolean; onChange: (checked: boolean) => void }) => { return ( diff --git a/docs/src/components/home/AdvancedShowcase.tsx b/docs/src/components/home/AdvancedShowcase.tsx index a58cde911086a6..02e2da8a5073d4 100644 --- a/docs/src/components/home/AdvancedShowcase.tsx +++ b/docs/src/components/home/AdvancedShowcase.tsx @@ -1,23 +1,23 @@ import * as React from 'react'; import { DataGrid, GridCellParams, GridColDef } from '@material-ui/data-grid'; -import { debounce } from '@material-ui/core/utils'; -import { alpha } from '@material-ui/core/styles'; -import GlobalStyles from '@material-ui/core/GlobalStyles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Chip from '@material-ui/core/Chip'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import Slider from '@material-ui/core/Slider'; -import Select from '@material-ui/core/Select'; +import { debounce } from '@mui/material/utils'; +import { alpha } from '@mui/material/styles'; +import GlobalStyles from '@mui/material/GlobalStyles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Chip from '@mui/material/Chip'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import Slider from '@mui/material/Slider'; +import Select from '@mui/material/Select'; import ShowcaseContainer from 'docs/src/components/home/ShowcaseContainer'; -import ReportProblemIcon from '@material-ui/icons/ReportProblem'; -import InfoIcon from '@material-ui/icons/Info'; -import AutorenewIcon from '@material-ui/icons/Autorenew'; -import DoneIcon from '@material-ui/icons/Done'; +import ReportProblemIcon from '@mui/icons-material/ReportProblem'; +import InfoIcon from '@mui/icons-material/Info'; +import AutorenewIcon from '@mui/icons-material/Autorenew'; +import DoneIcon from '@mui/icons-material/Done'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import MarkdownElement from 'docs/src/components/markdown/MarkdownElement'; diff --git a/docs/src/components/home/CompaniesGrid.tsx b/docs/src/components/home/CompaniesGrid.tsx index b4746935d185f2..eb9077405a1cd9 100644 --- a/docs/src/components/home/CompaniesGrid.tsx +++ b/docs/src/components/home/CompaniesGrid.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; +import Grid from '@mui/material/Grid'; import IconImage, { IconImageProps } from 'docs/src/components/icon/IconImage'; export const CORE_CUSTOMERS: Array = [ diff --git a/docs/src/components/home/CoreShowcase.tsx b/docs/src/components/home/CoreShowcase.tsx index c9705eba7ba1ff..c41dc375e62073 100644 --- a/docs/src/components/home/CoreShowcase.tsx +++ b/docs/src/components/home/CoreShowcase.tsx @@ -1,20 +1,20 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme, styled, alpha } from '@material-ui/core/styles'; -import { shouldForwardProp } from '@material-ui/system'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; +import { ThemeProvider, createTheme, useTheme, styled, alpha } from '@mui/material/styles'; +import { shouldForwardProp } from '@mui/system'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import { getDesignTokens, getThemedComponents } from 'docs/src/modules/brandingTheme'; import MarkdownElement from 'docs/src/components/markdown/MarkdownElement'; import MaterialDesignDemo, { componentCode } from 'docs/src/components/home/MaterialDesignDemo'; import ShowcaseContainer from 'docs/src/components/home/ShowcaseContainer'; import PointerContainer, { Data } from 'docs/src/components/home/ElementPointer'; -import KeyboardArrowDownRounded from '@material-ui/icons/KeyboardArrowDownRounded'; -import KeyboardArrowUpRounded from '@material-ui/icons/KeyboardArrowUpRounded'; -import TouchAppRounded from '@material-ui/icons/TouchAppRounded'; +import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded'; +import KeyboardArrowUpRounded from '@mui/icons-material/KeyboardArrowUpRounded'; +import TouchAppRounded from '@mui/icons-material/TouchAppRounded'; const darkDesignTokens = getDesignTokens('dark'); diff --git a/docs/src/components/home/DesignKits.tsx b/docs/src/components/home/DesignKits.tsx index 9da98ca3d13add..8f1e70384a483f 100644 --- a/docs/src/components/home/DesignKits.tsx +++ b/docs/src/components/home/DesignKits.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import Avatar, { AvatarProps } from '@material-ui/core/Avatar'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import { styled, alpha } from '@mui/material/styles'; +import Avatar, { AvatarProps } from '@mui/material/Avatar'; +import Box, { BoxProps } from '@mui/material/Box'; import ROUTES from 'docs/src/route'; import Slide from 'docs/src/components/animation/Slide'; import FadeDelay from 'docs/src/components/animation/FadeDelay'; diff --git a/docs/src/components/home/DesignSystemComponents.tsx b/docs/src/components/home/DesignSystemComponents.tsx index 0d63e79f34d1f5..47ef5d9ab1252f 100644 --- a/docs/src/components/home/DesignSystemComponents.tsx +++ b/docs/src/components/home/DesignSystemComponents.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; import { useInView } from 'react-intersection-observer'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; import GradientText from 'docs/src/components/typography/GradientText'; import SectionHeadline from 'docs/src/components/typography/SectionHeadline'; diff --git a/docs/src/components/home/DiamondSponsors.tsx b/docs/src/components/home/DiamondSponsors.tsx index db0a1e2aa69da8..b0f6530e8ae968 100644 --- a/docs/src/components/home/DiamondSponsors.tsx +++ b/docs/src/components/home/DiamondSponsors.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; import { useInView } from 'react-intersection-observer'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import AddRounded from '@material-ui/icons/AddRounded'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import AddRounded from '@mui/icons-material/AddRounded'; import Link from 'docs/src/modules/components/Link'; import SponsorCard from 'docs/src/components/home/SponsorCard'; diff --git a/docs/src/components/home/ElementPointer.tsx b/docs/src/components/home/ElementPointer.tsx index 57f014ce186c98..daede0011ddf17 100644 --- a/docs/src/components/home/ElementPointer.tsx +++ b/docs/src/components/home/ElementPointer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import { debounce } from '@material-ui/core/utils'; +import Box, { BoxProps } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import { debounce } from '@mui/material/utils'; const PointerContext = React.createContext void)>(undefined); diff --git a/docs/src/components/home/GetStartedButtons.tsx b/docs/src/components/home/GetStartedButtons.tsx index 9dcfea356f0e1f..584cd0719a5954 100644 --- a/docs/src/components/home/GetStartedButtons.tsx +++ b/docs/src/components/home/GetStartedButtons.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; import copy from 'clipboard-copy'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; -import ContentCopyRounded from '@material-ui/icons/ContentCopyRounded'; -import CheckRounded from '@material-ui/icons/CheckRounded'; +import Box, { BoxProps } from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; +import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'; +import CheckRounded from '@mui/icons-material/CheckRounded'; import ROUTES from 'docs/src/route'; import Link from 'docs/src/modules/components/Link'; export default function GetStartedButtons({ - installation = 'npm install @material-ui/core', + installation = 'npm install @mui/material', ...props }: { installation?: string } & BoxProps) { const [copied, setCopied] = React.useState(false); diff --git a/docs/src/components/home/GoldSponsors.tsx b/docs/src/components/home/GoldSponsors.tsx index 708aa8c980b78d..042c7eef591524 100644 --- a/docs/src/components/home/GoldSponsors.tsx +++ b/docs/src/components/home/GoldSponsors.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; import { useInView } from 'react-intersection-observer'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; import SponsorCard from 'docs/src/components/home/SponsorCard'; const GOLDs = [ diff --git a/docs/src/components/home/Hero.tsx b/docs/src/components/home/Hero.tsx index 699ea8563fb04f..e4cc6cad5bb9f5 100644 --- a/docs/src/components/home/Hero.tsx +++ b/docs/src/components/home/Hero.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; -import { useTheme } from '@material-ui/core/styles'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Stack from '@material-ui/core/Stack'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; +import { useTheme } from '@mui/material/styles'; +import Box, { BoxProps } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Stack from '@mui/material/Stack'; +import useMediaQuery from '@mui/material/useMediaQuery'; import GradientText from 'docs/src/components/typography/GradientText'; import GetStartedButtons from 'docs/src/components/home/GetStartedButtons'; import HeroContainer from 'docs/src/layouts/HeroContainer'; diff --git a/docs/src/components/home/HeroEnd.tsx b/docs/src/components/home/HeroEnd.tsx index 1310a4d1b939f5..de1d1a1887014d 100644 --- a/docs/src/components/home/HeroEnd.tsx +++ b/docs/src/components/home/HeroEnd.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; import { useInView } from 'react-intersection-observer'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; const Placeholder = () => ; const StartToday = dynamic(() => import('./StartToday'), { loading: Placeholder }); diff --git a/docs/src/components/home/MaterialDesignComponents.tsx b/docs/src/components/home/MaterialDesignComponents.tsx index 3f64497b723dd7..738076b7b0ad22 100644 --- a/docs/src/components/home/MaterialDesignComponents.tsx +++ b/docs/src/components/home/MaterialDesignComponents.tsx @@ -6,32 +6,32 @@ import { useTheme, Theme, ThemeOptions, -} from '@material-ui/core/styles'; -import { capitalize } from '@material-ui/core/utils'; -import Alert from '@material-ui/core/Alert'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Chip from '@material-ui/core/Chip'; -import Tabs from '@material-ui/core/Tabs'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Paper from '@material-ui/core/Paper'; -import Tab from '@material-ui/core/Tab'; -import Table from '@material-ui/core/Table'; -import TableBody from '@material-ui/core/TableBody'; -import TableCell from '@material-ui/core/TableCell'; -import TableContainer from '@material-ui/core/TableContainer'; -import TableHead from '@material-ui/core/TableHead'; -import TableRow from '@material-ui/core/TableRow'; -import TextField from '@material-ui/core/TextField'; -import Typography from '@material-ui/core/Typography'; -import ShoppingCartRounded from '@material-ui/icons/ShoppingCartRounded'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; -import CheckCircleRounded from '@material-ui/icons/CheckCircleRounded'; -import MailRounded from '@material-ui/icons/MailRounded'; -import VerifiedUserRounded from '@material-ui/icons/VerifiedUserRounded'; -import HelpCenterRounded from '@material-ui/icons/HelpCenterRounded'; +} from '@mui/material/styles'; +import { capitalize } from '@mui/material/utils'; +import Alert from '@mui/material/Alert'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Chip from '@mui/material/Chip'; +import Tabs from '@mui/material/Tabs'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Paper from '@mui/material/Paper'; +import Tab from '@mui/material/Tab'; +import Table from '@mui/material/Table'; +import TableBody from '@mui/material/TableBody'; +import TableCell from '@mui/material/TableCell'; +import TableContainer from '@mui/material/TableContainer'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; +import TextField from '@mui/material/TextField'; +import Typography from '@mui/material/Typography'; +import ShoppingCartRounded from '@mui/icons-material/ShoppingCartRounded'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; +import CheckCircleRounded from '@mui/icons-material/CheckCircleRounded'; +import MailRounded from '@mui/icons-material/MailRounded'; +import VerifiedUserRounded from '@mui/icons-material/VerifiedUserRounded'; +import HelpCenterRounded from '@mui/icons-material/HelpCenterRounded'; import ROUTES from 'docs/src/route'; import Link from 'docs/src/modules/components/Link'; diff --git a/docs/src/components/home/MaterialDesignDemo.tsx b/docs/src/components/home/MaterialDesignDemo.tsx index 516e314cf2d32c..c7cb0333bb62f3 100644 --- a/docs/src/components/home/MaterialDesignDemo.tsx +++ b/docs/src/components/home/MaterialDesignDemo.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import MuiAvatar from '@material-ui/core/Avatar'; -import MuiBox from '@material-ui/core/Box'; -import MuiChip from '@material-ui/core/Chip'; -import MuiDivider from '@material-ui/core/Divider'; -import MuiIconButton from '@material-ui/core/IconButton'; -import MuiCard, { CardProps } from '@material-ui/core/Card'; -import MuiSwitch from '@material-ui/core/Switch'; -import MuiTypography from '@material-ui/core/Typography'; -import MuiStack from '@material-ui/core/Stack'; -import MuiEdit from '@material-ui/icons/Edit'; -import MuiLocationOn from '@material-ui/icons/LocationOn'; +import MuiAvatar from '@mui/material/Avatar'; +import MuiBox from '@mui/material/Box'; +import MuiChip from '@mui/material/Chip'; +import MuiDivider from '@mui/material/Divider'; +import MuiIconButton from '@mui/material/IconButton'; +import MuiCard, { CardProps } from '@mui/material/Card'; +import MuiSwitch from '@mui/material/Switch'; +import MuiTypography from '@mui/material/Typography'; +import MuiStack from '@mui/material/Stack'; +import MuiEdit from '@mui/icons-material/Edit'; +import MuiLocationOn from '@mui/icons-material/LocationOn'; import { withPointer } from 'docs/src/components/home/ElementPointer'; -import { grey } from '@material-ui/core/colors'; +import { grey } from '@mui/material/colors'; export const componentCode = ` diff --git a/docs/src/components/home/NewsletterToast.tsx b/docs/src/components/home/NewsletterToast.tsx index 677459ee7672e4..0ad5283f20e58a 100644 --- a/docs/src/components/home/NewsletterToast.tsx +++ b/docs/src/components/home/NewsletterToast.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; import { useRouter } from 'next/router'; -import Slide from '@material-ui/core/Slide'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import CloseRounded from '@material-ui/icons/CloseRounded'; -import MarkEmailReadTwoTone from '@material-ui/icons/MarkEmailReadTwoTone'; +import Slide from '@mui/material/Slide'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import CloseRounded from '@mui/icons-material/CloseRounded'; +import MarkEmailReadTwoTone from '@mui/icons-material/MarkEmailReadTwoTone'; export default function NewsletterToast() { const router = useRouter(); diff --git a/docs/src/components/home/ProductSuite.tsx b/docs/src/components/home/ProductSuite.tsx index 3d940b6e5123f0..2e95acc21a204a 100644 --- a/docs/src/components/home/ProductSuite.tsx +++ b/docs/src/components/home/ProductSuite.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; import { useInView } from 'react-intersection-observer'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; import GradientText from 'docs/src/components/typography/GradientText'; import ProductsSwitcher from 'docs/src/components/home/ProductsSwitcher'; import { PrefetchStoreTemplateImages } from 'docs/src/components/home/StoreTemplatesBanner'; diff --git a/docs/src/components/home/ProductsSwitcher.tsx b/docs/src/components/home/ProductsSwitcher.tsx index e0a9e6bcaad45d..7d48bc3461d8ee 100644 --- a/docs/src/components/home/ProductsSwitcher.tsx +++ b/docs/src/components/home/ProductsSwitcher.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; -import { Theme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import Typography from '@material-ui/core/Typography'; -import Stack from '@material-ui/core/Stack'; +import { Theme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import Typography from '@mui/material/Typography'; +import Stack from '@mui/material/Stack'; import IconImage from 'docs/src/components/icon/IconImage'; import Highlighter from 'docs/src/components/action/Highlighter'; import Link from 'docs/src/modules/components/Link'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import ROUTES from 'docs/src/route'; const SwipeableViews = dynamic(() => import('react-swipeable-views'), { ssr: false }); diff --git a/docs/src/components/home/References.tsx b/docs/src/components/home/References.tsx index 29bcd96ed5e0c0..301e3bec1afca7 100644 --- a/docs/src/components/home/References.tsx +++ b/docs/src/components/home/References.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; import { useInView } from 'react-intersection-observer'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; import { CORE_CUSTOMERS, ADVANCED_CUSTOMERS } from 'docs/src/components/home/CompaniesGrid'; export { CORE_CUSTOMERS, ADVANCED_CUSTOMERS }; diff --git a/docs/src/components/home/ShowcaseContainer.tsx b/docs/src/components/home/ShowcaseContainer.tsx index 78e140218f2dd5..1ec530de708826 100644 --- a/docs/src/components/home/ShowcaseContainer.tsx +++ b/docs/src/components/home/ShowcaseContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import NoSsr from '@material-ui/core/NoSsr'; -import Paper, { PaperProps } from '@material-ui/core/Paper'; +import Box, { BoxProps } from '@mui/material/Box'; +import NoSsr from '@mui/material/NoSsr'; +import Paper, { PaperProps } from '@mui/material/Paper'; export default function ShowcaseContainer({ preview, diff --git a/docs/src/components/home/SponsorCard.tsx b/docs/src/components/home/SponsorCard.tsx index 3231909cab9a9c..7803756e29ba8f 100644 --- a/docs/src/components/home/SponsorCard.tsx +++ b/docs/src/components/home/SponsorCard.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Paper from '@material-ui/core/Paper'; +import Avatar from '@mui/material/Avatar'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Paper from '@mui/material/Paper'; import Link from 'docs/src/modules/components/Link'; -import LaunchRounded from '@material-ui/icons/LaunchRounded'; +import LaunchRounded from '@mui/icons-material/LaunchRounded'; export default function SponsorCard({ item, diff --git a/docs/src/components/home/Sponsors.tsx b/docs/src/components/home/Sponsors.tsx index 1694af0c2d13e3..790153ef6f2adc 100644 --- a/docs/src/components/home/Sponsors.tsx +++ b/docs/src/components/home/Sponsors.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; import DiamondSponsors from 'docs/src/components/home/DiamondSponsors'; import GoldSponsors from 'docs/src/components/home/GoldSponsors'; diff --git a/docs/src/components/home/StartToday.tsx b/docs/src/components/home/StartToday.tsx index 951874392d7bf7..5e095dc47eea46 100644 --- a/docs/src/components/home/StartToday.tsx +++ b/docs/src/components/home/StartToday.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import Paper from '@material-ui/core/Paper'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import Paper from '@mui/material/Paper'; import Link from 'docs/src/modules/components/Link'; import GradientText from 'docs/src/components/typography/GradientText'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import ROUTES from 'docs/src/route'; import GetStartedButtons from 'docs/src/components/home/GetStartedButtons'; import SectionHeadline from 'docs/src/components/typography/SectionHeadline'; diff --git a/docs/src/components/home/StoreTemplatesBanner.tsx b/docs/src/components/home/StoreTemplatesBanner.tsx index b5e716e9521075..912ebd1139c979 100644 --- a/docs/src/components/home/StoreTemplatesBanner.tsx +++ b/docs/src/components/home/StoreTemplatesBanner.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled, alpha, useTheme } from '@material-ui/core/styles'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import { styled, alpha, useTheme } from '@mui/material/styles'; +import Box, { BoxProps } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import ROUTES from 'docs/src/route'; -import LaunchRounded from '@material-ui/icons/LaunchRounded'; +import LaunchRounded from '@mui/icons-material/LaunchRounded'; import Slide from 'docs/src/components/animation/Slide'; import FadeDelay from 'docs/src/components/animation/FadeDelay'; diff --git a/docs/src/components/home/Testimonials.tsx b/docs/src/components/home/Testimonials.tsx index d4ffec9f3fc1b0..e748145a461ac0 100644 --- a/docs/src/components/home/Testimonials.tsx +++ b/docs/src/components/home/Testimonials.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; import dynamic from 'next/dynamic'; import { useInView } from 'react-intersection-observer'; -import { ThemeProvider } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; +import { ThemeProvider } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; import { brandingDarkTheme } from 'docs/src/modules/brandingTheme'; const UserFeedbacks = dynamic(() => import('./UserFeedbacks')); diff --git a/docs/src/components/home/UserFeedbacks.tsx b/docs/src/components/home/UserFeedbacks.tsx index 75eb1c1a23c954..feaa15fff52b9d 100644 --- a/docs/src/components/home/UserFeedbacks.tsx +++ b/docs/src/components/home/UserFeedbacks.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import SwipeableViews from 'react-swipeable-views'; -import Avatar from '@material-ui/core/Avatar'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import Avatar from '@mui/material/Avatar'; +import ButtonBase from '@mui/material/ButtonBase'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import ArrowButton from 'docs/src/components/action/ArrowButton'; const Feedback = ({ diff --git a/docs/src/components/home/ValueProposition.tsx b/docs/src/components/home/ValueProposition.tsx index 3ebfca6a4d17b2..8ded81f3cc6f50 100644 --- a/docs/src/components/home/ValueProposition.tsx +++ b/docs/src/components/home/ValueProposition.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; import GradientText from 'docs/src/components/typography/GradientText'; -import InvertColorsRoundedIcon from '@material-ui/icons/InvertColorsRounded'; -import HandymanRoundedIcon from '@material-ui/icons/HandymanRounded'; -import ArticleRoundedIcon from '@material-ui/icons/ArticleRounded'; -import AccessibilityNewRounded from '@material-ui/icons/AccessibilityNewRounded'; +import InvertColorsRoundedIcon from '@mui/icons-material/InvertColorsRounded'; +import HandymanRoundedIcon from '@mui/icons-material/HandymanRounded'; +import ArticleRoundedIcon from '@mui/icons-material/ArticleRounded'; +import AccessibilityNewRounded from '@mui/icons-material/AccessibilityNewRounded'; import SectionHeadline from 'docs/src/components/typography/SectionHeadline'; const content = [ diff --git a/docs/src/components/icon/IconImage.tsx b/docs/src/components/icon/IconImage.tsx index 68a64acecc2422..e2384f6c50bcd0 100644 --- a/docs/src/components/icon/IconImage.tsx +++ b/docs/src/components/icon/IconImage.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { useTheme, styled, Theme } from '@material-ui/core/styles'; -import { SxProps } from '@material-ui/system'; +import { useTheme, styled, Theme } from '@mui/material/styles'; +import { SxProps } from '@mui/system'; export type IconImageProps = { name: diff --git a/docs/src/components/markdown/MarkdownElement.tsx b/docs/src/components/markdown/MarkdownElement.tsx index 68af620387489d..0a8e071477f84f 100644 --- a/docs/src/components/markdown/MarkdownElement.tsx +++ b/docs/src/components/markdown/MarkdownElement.tsx @@ -4,7 +4,7 @@ import { // alpha, // darken, styled, -} from '@material-ui/core/styles'; +} from '@mui/material/styles'; const Root = styled('div')(({ theme }) => ({ ...theme.typography.caption, diff --git a/docs/src/components/pricing/EarlyBird.tsx b/docs/src/components/pricing/EarlyBird.tsx index dff4a8f89fd14d..e1fa969530f836 100644 --- a/docs/src/components/pricing/EarlyBird.tsx +++ b/docs/src/components/pricing/EarlyBird.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; export default function EarlyBird() { return ( diff --git a/docs/src/components/pricing/FAQ.tsx b/docs/src/components/pricing/FAQ.tsx index b958609eff78d8..5e0fbbcf6362b1 100644 --- a/docs/src/components/pricing/FAQ.tsx +++ b/docs/src/components/pricing/FAQ.tsx @@ -1,16 +1,16 @@ /* eslint-disable react/no-unescaped-entities */ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import MuiAccordion from '@material-ui/core/Accordion'; -import MuiAccordionSummary from '@material-ui/core/AccordionSummary'; -import MuiAccordionDetail from '@material-ui/core/AccordionDetails'; -import KeyboardArrowDownRounded from '@material-ui/icons/KeyboardArrowDownRounded'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import MuiAccordion from '@mui/material/Accordion'; +import MuiAccordionSummary from '@mui/material/AccordionSummary'; +import MuiAccordionDetail from '@mui/material/AccordionDetails'; +import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded'; const faqData = [ { diff --git a/docs/src/components/pricing/HeroPricing.tsx b/docs/src/components/pricing/HeroPricing.tsx index 1b3461fd4d27e4..deb8463ba6818b 100644 --- a/docs/src/components/pricing/HeroPricing.tsx +++ b/docs/src/components/pricing/HeroPricing.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; import GradientText from 'docs/src/components/typography/GradientText'; export default function HeroPricing() { diff --git a/docs/src/components/pricing/PricingList.tsx b/docs/src/components/pricing/PricingList.tsx index d8b89306f93f64..63f077223d8c45 100644 --- a/docs/src/components/pricing/PricingList.tsx +++ b/docs/src/components/pricing/PricingList.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; -import Fade from '@material-ui/core/Fade'; -import Paper, { PaperProps } from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import Tabs from '@material-ui/core/Tabs'; -import Tab from '@material-ui/core/Tab'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import { useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; +import Fade from '@mui/material/Fade'; +import Paper, { PaperProps } from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import Tabs from '@mui/material/Tabs'; +import Tab from '@mui/material/Tab'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import Link from 'docs/src/modules/components/Link'; import PricingTable, { PlanName, PlanPrice } from 'docs/src/components/pricing/PricingTable'; diff --git a/docs/src/components/pricing/PricingTable.tsx b/docs/src/components/pricing/PricingTable.tsx index f95d12beb696c0..7de7b9758f7696 100644 --- a/docs/src/components/pricing/PricingTable.tsx +++ b/docs/src/components/pricing/PricingTable.tsx @@ -1,18 +1,18 @@ import * as React from 'react'; -import { alpha } from '@material-ui/core/styles'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; -import Collapse from '@material-ui/core/Collapse'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import InfoOutlinedIcon from '@material-ui/icons/InfoOutlined'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import { alpha } from '@mui/material/styles'; +import Box, { BoxProps } from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; +import Collapse from '@mui/material/Collapse'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import Link from 'docs/src/modules/components/Link'; import IconImage, { IconImageProps } from 'docs/src/components/icon/IconImage'; -import LaunchRounded from '@material-ui/icons/LaunchRounded'; -import UnfoldMoreRounded from '@material-ui/icons/UnfoldMoreRounded'; +import LaunchRounded from '@mui/icons-material/LaunchRounded'; +import UnfoldMoreRounded from '@mui/icons-material/UnfoldMoreRounded'; const planInfo = { community: { diff --git a/docs/src/components/pricing/WhatToExpect.tsx b/docs/src/components/pricing/WhatToExpect.tsx index 003baa8f2cc4b4..d3130e05a27ae2 100644 --- a/docs/src/components/pricing/WhatToExpect.tsx +++ b/docs/src/components/pricing/WhatToExpect.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; -import LocalOfferOutlinedIcon from '@material-ui/icons/LocalOfferOutlined'; -import AllInclusiveOutlinedIcon from '@material-ui/icons/AllInclusiveOutlined'; -import ReplayRoundedIcon from '@material-ui/icons/ReplayRounded'; -import HelpOutlineOutlinedIcon from '@material-ui/icons/HelpOutlineOutlined'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; +import LocalOfferOutlinedIcon from '@mui/icons-material/LocalOfferOutlined'; +import AllInclusiveOutlinedIcon from '@mui/icons-material/AllInclusiveOutlined'; +import ReplayRoundedIcon from '@mui/icons-material/ReplayRounded'; +import HelpOutlineOutlinedIcon from '@mui/icons-material/HelpOutlineOutlined'; export default function WhatToExpect() { return ( diff --git a/docs/src/components/productDesignKit/DesignKitDemo.tsx b/docs/src/components/productDesignKit/DesignKitDemo.tsx index 6cd998f6390d84..2a47068aeb537c 100644 --- a/docs/src/components/productDesignKit/DesignKitDemo.tsx +++ b/docs/src/components/productDesignKit/DesignKitDemo.tsx @@ -1,18 +1,18 @@ import * as React from 'react'; -import { useTheme, styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Grid from '@material-ui/core/Grid'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; -import LaunchRounded from '@material-ui/icons/LaunchRounded'; -import TextFieldsRounded from '@material-ui/icons/TextFieldsRounded'; +import { useTheme, styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Grid from '@mui/material/Grid'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; +import LaunchRounded from '@mui/icons-material/LaunchRounded'; +import TextFieldsRounded from '@mui/icons-material/TextFieldsRounded'; import Section from 'docs/src/layouts/Section'; import SectionHeadline from 'docs/src/components/typography/SectionHeadline'; import GradientText from 'docs/src/components/typography/GradientText'; import Item, { Group } from 'docs/src/components/action/Item'; -import WidgetsRounded from '@material-ui/icons/WidgetsRounded'; -import ToggleOnRounded from '@material-ui/icons/ToggleOnRounded'; +import WidgetsRounded from '@mui/icons-material/WidgetsRounded'; +import ToggleOnRounded from '@mui/icons-material/ToggleOnRounded'; import Highlighter from 'docs/src/components/action/Highlighter'; import More from 'docs/src/components/action/More'; import Frame from 'docs/src/components/action/Frame'; diff --git a/docs/src/components/productDesignKit/DesignKitFAQ.tsx b/docs/src/components/productDesignKit/DesignKitFAQ.tsx index 139995c83a3619..8c7197ff07d838 100644 --- a/docs/src/components/productDesignKit/DesignKitFAQ.tsx +++ b/docs/src/components/productDesignKit/DesignKitFAQ.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; import InternalLink from 'docs/src/modules/components/Link'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import MuiAccordion from '@material-ui/core/Accordion'; -import MuiAccordionSummary from '@material-ui/core/AccordionSummary'; -import MuiAccordionDetail from '@material-ui/core/AccordionDetails'; -import KeyboardArrowDownRounded from '@material-ui/icons/KeyboardArrowDownRounded'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import MuiAccordion from '@mui/material/Accordion'; +import MuiAccordionSummary from '@mui/material/AccordionSummary'; +import MuiAccordionDetail from '@mui/material/AccordionDetails'; +import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded'; const faqData = [ { diff --git a/docs/src/components/productDesignKit/DesignKitHero.tsx b/docs/src/components/productDesignKit/DesignKitHero.tsx index 23e365899f84bb..c78a2408fe02dc 100644 --- a/docs/src/components/productDesignKit/DesignKitHero.tsx +++ b/docs/src/components/productDesignKit/DesignKitHero.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { alpha } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import { alpha } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import GradientText from 'docs/src/components/typography/GradientText'; import HeroContainer from 'docs/src/layouts/HeroContainer'; import IconImage from 'docs/src/components/icon/IconImage'; diff --git a/docs/src/components/productDesignKit/DesignKitValues.tsx b/docs/src/components/productDesignKit/DesignKitValues.tsx index 8c790aa7dddec9..72caae8cde82b5 100644 --- a/docs/src/components/productDesignKit/DesignKitValues.tsx +++ b/docs/src/components/productDesignKit/DesignKitValues.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; import GradientText from 'docs/src/components/typography/GradientText'; -import Palette from '@material-ui/icons/Palette'; -import LibraryBooks from '@material-ui/icons/LibraryBooks'; -import CodeRounded from '@material-ui/icons/CodeRounded'; +import Palette from '@mui/icons-material/Palette'; +import LibraryBooks from '@mui/icons-material/LibraryBooks'; +import CodeRounded from '@mui/icons-material/CodeRounded'; const content = [ { diff --git a/docs/src/components/productTemplate/TemplateDemo.tsx b/docs/src/components/productTemplate/TemplateDemo.tsx index 35b98eb3fa8f66..de7caeaa8f277a 100644 --- a/docs/src/components/productTemplate/TemplateDemo.tsx +++ b/docs/src/components/productTemplate/TemplateDemo.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import SwipeableViews from 'react-swipeable-views'; -import { useTheme, alpha } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; +import { useTheme, alpha } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; import Section from 'docs/src/layouts/Section'; import SectionHeadline from 'docs/src/components/typography/SectionHeadline'; import GradientText from 'docs/src/components/typography/GradientText'; @@ -11,12 +11,12 @@ import Item, { Group } from 'docs/src/components/action/Item'; import Highlighter from 'docs/src/components/action/Highlighter'; import Frame from 'docs/src/components/action/Frame'; import ArrowButton from 'docs/src/components/action/ArrowButton'; -import LaunchRounded from '@material-ui/icons/LaunchRounded'; +import LaunchRounded from '@mui/icons-material/LaunchRounded'; import Link from 'docs/src/modules/components/Link'; import ROUTES from 'docs/src/route'; -import DashboardRounded from '@material-ui/icons/DashboardRounded'; -import Layers from '@material-ui/icons/Layers'; -import ShoppingBag from '@material-ui/icons/ShoppingBag'; +import DashboardRounded from '@mui/icons-material/DashboardRounded'; +import Layers from '@mui/icons-material/Layers'; +import ShoppingBag from '@mui/icons-material/ShoppingBag'; const DEMOS = ['Dashboard', 'Landing Pages', 'E-commerce']; diff --git a/docs/src/components/productTemplate/TemplateHero.tsx b/docs/src/components/productTemplate/TemplateHero.tsx index 30dcde5974bfe7..74f7e8161c803b 100644 --- a/docs/src/components/productTemplate/TemplateHero.tsx +++ b/docs/src/components/productTemplate/TemplateHero.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import KeyboardArrowRightRounded from '@material-ui/icons/KeyboardArrowRightRounded'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import GradientText from 'docs/src/components/typography/GradientText'; import HeroContainer from 'docs/src/layouts/HeroContainer'; import IconImage from 'docs/src/components/icon/IconImage'; diff --git a/docs/src/components/showcase/FolderTable.tsx b/docs/src/components/showcase/FolderTable.tsx index a711b7b0eb79d8..6a4698a0061fed 100644 --- a/docs/src/components/showcase/FolderTable.tsx +++ b/docs/src/components/showcase/FolderTable.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Table from '@material-ui/core/Table'; -import TableBody from '@material-ui/core/TableBody'; -import TableCell from '@material-ui/core/TableCell'; -import TableSortLabel from '@material-ui/core/TableSortLabel'; -import TableContainer from '@material-ui/core/TableContainer'; -import TableHead from '@material-ui/core/TableHead'; -import TableRow from '@material-ui/core/TableRow'; -import Paper from '@material-ui/core/Paper'; -import { visuallyHidden } from '@material-ui/utils'; -import Folder from '@material-ui/icons/Folder'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Table from '@mui/material/Table'; +import TableBody from '@mui/material/TableBody'; +import TableCell from '@mui/material/TableCell'; +import TableSortLabel from '@mui/material/TableSortLabel'; +import TableContainer from '@mui/material/TableContainer'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; +import Paper from '@mui/material/Paper'; +import { visuallyHidden } from '@mui/utils'; +import Folder from '@mui/icons-material/Folder'; const data = [ { name: 'Fonts', size: 125600 }, diff --git a/docs/src/components/showcase/NotificationCard.tsx b/docs/src/components/showcase/NotificationCard.tsx index 89c2c2d4c53ba7..d9cf4a98244c24 100644 --- a/docs/src/components/showcase/NotificationCard.tsx +++ b/docs/src/components/showcase/NotificationCard.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Avatar from '@material-ui/core/Avatar'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import Chip from '@material-ui/core/Chip'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Avatar from '@mui/material/Avatar'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import Chip from '@mui/material/Chip'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; -declare module '@material-ui/core/Chip' { +declare module '@mui/material/Chip' { interface ChipPropsVariantOverrides { notification: true; } diff --git a/docs/src/components/showcase/PlayerCard.tsx b/docs/src/components/showcase/PlayerCard.tsx index 11044c9d15d5b6..289355339d96f6 100644 --- a/docs/src/components/showcase/PlayerCard.tsx +++ b/docs/src/components/showcase/PlayerCard.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import Fade from '@material-ui/core/Fade'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import FastForwardRounded from '@material-ui/icons/FastForwardRounded'; -import FastRewindRounded from '@material-ui/icons/FastRewindRounded'; -import PlayArrowRounded from '@material-ui/icons/PlayArrowRounded'; -import PauseRounded from '@material-ui/icons/PauseRounded'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import Fade from '@mui/material/Fade'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import FastForwardRounded from '@mui/icons-material/FastForwardRounded'; +import FastRewindRounded from '@mui/icons-material/FastRewindRounded'; +import PlayArrowRounded from '@mui/icons-material/PlayArrowRounded'; +import PauseRounded from '@mui/icons-material/PauseRounded'; const primaryDark = { 50: '#E2EDF8', diff --git a/docs/src/components/showcase/TaskCard.tsx b/docs/src/components/showcase/TaskCard.tsx index 7cb0c922326949..b1c7643ba38fb8 100644 --- a/docs/src/components/showcase/TaskCard.tsx +++ b/docs/src/components/showcase/TaskCard.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; -import { ThemeProvider, createTheme } from '@material-ui/core/styles'; -import Avatar from '@material-ui/core/Avatar'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import Fade from '@material-ui/core/Fade'; -import LinearProgress from '@material-ui/core/LinearProgress'; -import Typography from '@material-ui/core/Typography'; -import CodeRounded from '@material-ui/icons/CodeRounded'; -import ScheduleRounded from '@material-ui/icons/ScheduleRounded'; +import { ThemeProvider, createTheme } from '@mui/material/styles'; +import Avatar from '@mui/material/Avatar'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import Fade from '@mui/material/Fade'; +import LinearProgress from '@mui/material/LinearProgress'; +import Typography from '@mui/material/Typography'; +import CodeRounded from '@mui/icons-material/CodeRounded'; +import ScheduleRounded from '@mui/icons-material/ScheduleRounded'; -declare module '@material-ui/core/Paper' { +declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { gradient: true; } diff --git a/docs/src/components/showcase/ThemeAccordion.tsx b/docs/src/components/showcase/ThemeAccordion.tsx index 622fd57aa964ed..01db8a7e6c87b3 100644 --- a/docs/src/components/showcase/ThemeAccordion.tsx +++ b/docs/src/components/showcase/ThemeAccordion.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Accordion from '@material-ui/core/Accordion'; -import AccordionSummary from '@material-ui/core/AccordionSummary'; -import AccordionDetails from '@material-ui/core/AccordionDetails'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; -import Folder from '@material-ui/icons/Folder'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Accordion from '@mui/material/Accordion'; +import AccordionSummary from '@mui/material/AccordionSummary'; +import AccordionDetails from '@mui/material/AccordionDetails'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; +import Folder from '@mui/icons-material/Folder'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeButton.tsx b/docs/src/components/showcase/ThemeButton.tsx index 12c8a8a7eed4b6..af3f413498ca8a 100644 --- a/docs/src/components/showcase/ThemeButton.tsx +++ b/docs/src/components/showcase/ThemeButton.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; export default function ThemeButton() { return ( diff --git a/docs/src/components/showcase/ThemeChip.tsx b/docs/src/components/showcase/ThemeChip.tsx index 4258a40b15b62e..2aaed5aa566bd5 100644 --- a/docs/src/components/showcase/ThemeChip.tsx +++ b/docs/src/components/showcase/ThemeChip.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeDatePicker.tsx b/docs/src/components/showcase/ThemeDatePicker.tsx index 04f7b5cf0ac88a..d6c6d3e8cba2cf 100644 --- a/docs/src/components/showcase/ThemeDatePicker.tsx +++ b/docs/src/components/showcase/ThemeDatePicker.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeSlider.tsx b/docs/src/components/showcase/ThemeSlider.tsx index 6df448a1993ccd..4c36e7bb086753 100644 --- a/docs/src/components/showcase/ThemeSlider.tsx +++ b/docs/src/components/showcase/ThemeSlider.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import Slider from '@material-ui/core/Slider'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import Slider from '@mui/material/Slider'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeSwitch.tsx b/docs/src/components/showcase/ThemeSwitch.tsx index 19b27d450b9194..87c6f0a4471e7e 100644 --- a/docs/src/components/showcase/ThemeSwitch.tsx +++ b/docs/src/components/showcase/ThemeSwitch.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Switch from '@material-ui/core/Switch'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Switch from '@mui/material/Switch'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeTabs.tsx b/docs/src/components/showcase/ThemeTabs.tsx index 8efa4b06530675..dc0a9c94b54c16 100644 --- a/docs/src/components/showcase/ThemeTabs.tsx +++ b/docs/src/components/showcase/ThemeTabs.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Fade from '@material-ui/core/Fade'; -import Tabs from '@material-ui/core/Tabs'; -import Tab from '@material-ui/core/Tab'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Fade from '@mui/material/Fade'; +import Tabs from '@mui/material/Tabs'; +import Tab from '@mui/material/Tab'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeTimeline.tsx b/docs/src/components/showcase/ThemeTimeline.tsx index 686e7dde36f86e..af838f4b9fae4e 100644 --- a/docs/src/components/showcase/ThemeTimeline.tsx +++ b/docs/src/components/showcase/ThemeTimeline.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import Fade from '@material-ui/core/Fade'; -import Typography from '@material-ui/core/Typography'; -import Timeline from '@material-ui/lab/Timeline'; -import TimelineItem from '@material-ui/lab/TimelineItem'; -import TimelineSeparator from '@material-ui/lab/TimelineSeparator'; -import TimelineConnector from '@material-ui/lab/TimelineConnector'; -import TimelineContent from '@material-ui/lab/TimelineContent'; -import TimelineDot from '@material-ui/lab/TimelineDot'; -import InfoOutlined from '@material-ui/icons/InfoOutlined'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import Fade from '@mui/material/Fade'; +import Typography from '@mui/material/Typography'; +import Timeline from '@mui/lab/Timeline'; +import TimelineItem from '@mui/lab/TimelineItem'; +import TimelineSeparator from '@mui/lab/TimelineSeparator'; +import TimelineConnector from '@mui/lab/TimelineConnector'; +import TimelineContent from '@mui/lab/TimelineContent'; +import TimelineDot from '@mui/lab/TimelineDot'; +import InfoOutlined from '@mui/icons-material/InfoOutlined'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ThemeToggleButton.tsx b/docs/src/components/showcase/ThemeToggleButton.tsx index 644a2c2a64a12c..fcfe8c53d3a857 100644 --- a/docs/src/components/showcase/ThemeToggleButton.tsx +++ b/docs/src/components/showcase/ThemeToggleButton.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import Fade from '@material-ui/core/Fade'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import Fade from '@mui/material/Fade'; +import ToggleButton from '@mui/material/ToggleButton'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/showcase/ViewToggleButton.tsx b/docs/src/components/showcase/ViewToggleButton.tsx index 686cac82e144e5..24e0b47ed21846 100644 --- a/docs/src/components/showcase/ViewToggleButton.tsx +++ b/docs/src/components/showcase/ViewToggleButton.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import { ThemeProvider, createTheme, useTheme } from '@material-ui/core/styles'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; +import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles'; +import ToggleButton from '@mui/material/ToggleButton'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; -import ViewQuiltRounded from '@material-ui/icons/ViewQuiltRounded'; -import ViewModuleRounded from '@material-ui/icons/ViewModuleRounded'; -import ViewAgendaRounded from '@material-ui/icons/ViewAgendaRounded'; -import ViewWeekRounded from '@material-ui/icons/ViewWeekRounded'; -import ViewSidebarRounded from '@material-ui/icons/ViewSidebarRounded'; +import ViewQuiltRounded from '@mui/icons-material/ViewQuiltRounded'; +import ViewModuleRounded from '@mui/icons-material/ViewModuleRounded'; +import ViewAgendaRounded from '@mui/icons-material/ViewAgendaRounded'; +import ViewWeekRounded from '@mui/icons-material/ViewWeekRounded'; +import ViewSidebarRounded from '@mui/icons-material/ViewSidebarRounded'; const primary = { 50: '#F0F7FF', diff --git a/docs/src/components/typography/GradientText.tsx b/docs/src/components/typography/GradientText.tsx index 60f2d9e9b378e1..911c811a5314e2 100644 --- a/docs/src/components/typography/GradientText.tsx +++ b/docs/src/components/typography/GradientText.tsx @@ -1,4 +1,4 @@ -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; const GradientText = styled('span')<{ color?: 'primary' | 'error' | 'success' | 'warning'; diff --git a/docs/src/components/typography/SectionHeadline.tsx b/docs/src/components/typography/SectionHeadline.tsx index 4ad186506ae278..d81e1ecefb5100 100644 --- a/docs/src/components/typography/SectionHeadline.tsx +++ b/docs/src/components/typography/SectionHeadline.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; +import { useTheme } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; export default function SectionHeadline({ overline, diff --git a/docs/src/icons/SvgCalendar.tsx b/docs/src/icons/SvgCalendar.tsx index 18c48266eecced..0a38698c300b86 100644 --- a/docs/src/icons/SvgCalendar.tsx +++ b/docs/src/icons/SvgCalendar.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgCalendar(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgCard.tsx b/docs/src/icons/SvgCard.tsx index fd6bbb8688a87a..6a7af688e16909 100644 --- a/docs/src/icons/SvgCard.tsx +++ b/docs/src/icons/SvgCard.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgCard(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgChat.tsx b/docs/src/icons/SvgChat.tsx index 31738a1e62120c..2a8dbea7cdd2b1 100644 --- a/docs/src/icons/SvgChat.tsx +++ b/docs/src/icons/SvgChat.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgChat(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgDocs.tsx b/docs/src/icons/SvgDocs.tsx index f1bf28c71686ab..d1d317ae742996 100644 --- a/docs/src/icons/SvgDocs.tsx +++ b/docs/src/icons/SvgDocs.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgDocs(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgEye.tsx b/docs/src/icons/SvgEye.tsx index 5f9de2812d5599..40a18786c639ab 100644 --- a/docs/src/icons/SvgEye.tsx +++ b/docs/src/icons/SvgEye.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgEye(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgInfinity.tsx b/docs/src/icons/SvgInfinity.tsx index d83100a52d9bfe..7444b64e26ffcd 100644 --- a/docs/src/icons/SvgInfinity.tsx +++ b/docs/src/icons/SvgInfinity.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgInfinity(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgPalette.tsx b/docs/src/icons/SvgPalette.tsx index 7c2ac9062c9061..07319f317c7054 100644 --- a/docs/src/icons/SvgPalette.tsx +++ b/docs/src/icons/SvgPalette.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgPalette(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgPencil.tsx b/docs/src/icons/SvgPencil.tsx index bed51d4552546e..051e31a7d49a70 100644 --- a/docs/src/icons/SvgPencil.tsx +++ b/docs/src/icons/SvgPencil.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgPencil(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgPerson.tsx b/docs/src/icons/SvgPerson.tsx index 856e633776868a..e41c6d5a36fa6b 100644 --- a/docs/src/icons/SvgPerson.tsx +++ b/docs/src/icons/SvgPerson.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgPerson(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgReplay.tsx b/docs/src/icons/SvgReplay.tsx index e72e66a76198b9..ad6e9c98088abf 100644 --- a/docs/src/icons/SvgReplay.tsx +++ b/docs/src/icons/SvgReplay.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgReplay(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/icons/SvgTag.tsx b/docs/src/icons/SvgTag.tsx index 0a456131e1a7ec..6f4465714c965c 100644 --- a/docs/src/icons/SvgTag.tsx +++ b/docs/src/icons/SvgTag.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; function SvgTag(props: React.SVGProps) { const theme = useTheme(); diff --git a/docs/src/layouts/AppFooter.tsx b/docs/src/layouts/AppFooter.tsx index b370f53f60c8a1..2eb09d56670671 100644 --- a/docs/src/layouts/AppFooter.tsx +++ b/docs/src/layouts/AppFooter.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import Stack from '@material-ui/core/Stack'; -import TwitterIcon from '@material-ui/icons/Twitter'; -import GitHubIcon from '@material-ui/icons/GitHub'; -import LinkedInIcon from '@material-ui/icons/LinkedIn'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import Stack from '@mui/material/Stack'; +import TwitterIcon from '@mui/icons-material/Twitter'; +import GitHubIcon from '@mui/icons-material/GitHub'; +import LinkedInIcon from '@mui/icons-material/LinkedIn'; import SvgMuiLogo from 'docs/src/icons/SvgMuiLogo'; import EmailSubscribe from 'docs/src/components/footer/EmailSubscribe'; import ROUTES from 'docs/src/route'; diff --git a/docs/src/layouts/AppHeader.tsx b/docs/src/layouts/AppHeader.tsx index 050f3f122e682b..28e47aa7be6230 100644 --- a/docs/src/layouts/AppHeader.tsx +++ b/docs/src/layouts/AppHeader.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import NoSsr from '@material-ui/core/NoSsr'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import { styled, alpha } from '@mui/material/styles'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import NoSsr from '@mui/material/NoSsr'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; import SvgMuiLogo from 'docs/src/icons/SvgMuiLogo'; import HeaderNavBar from 'docs/src/components/header/HeaderNavBar'; import HeaderNavDropdown from 'docs/src/components/header/HeaderNavDropdown'; diff --git a/docs/src/layouts/HeroContainer.tsx b/docs/src/layouts/HeroContainer.tsx index 6b6963dbad33e3..b25056f5e59f5f 100644 --- a/docs/src/layouts/HeroContainer.tsx +++ b/docs/src/layouts/HeroContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Grid from '@material-ui/core/Grid'; +import Box, { BoxProps } from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; export default function HeroContainer({ left, diff --git a/docs/src/layouts/Section.tsx b/docs/src/layouts/Section.tsx index 9701d8fae259d7..cae1af60bcf350 100644 --- a/docs/src/layouts/Section.tsx +++ b/docs/src/layouts/Section.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box, { BoxProps } from '@mui/material/Box'; export default function Section({ bg = 'white', diff --git a/docs/src/modules/branding/BrandingBeginToday.tsx b/docs/src/modules/branding/BrandingBeginToday.tsx index 0e833cecfa8dff..1d8a1d55e33547 100644 --- a/docs/src/modules/branding/BrandingBeginToday.tsx +++ b/docs/src/modules/branding/BrandingBeginToday.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; -import NavigateNextIcon from '@material-ui/icons/NavigateNext'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; +import NavigateNextIcon from '@mui/icons-material/NavigateNext'; import Link from 'docs/src/modules/components/Link'; export default function BrandingBeginToday() { diff --git a/docs/src/modules/branding/BrandingBulletItem.tsx b/docs/src/modules/branding/BrandingBulletItem.tsx index 099033b4026f97..2bf28bf31dc23a 100644 --- a/docs/src/modules/branding/BrandingBulletItem.tsx +++ b/docs/src/modules/branding/BrandingBulletItem.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import CheckIcon from 'docs/src/modules/branding/icons/Check'; interface BrandingBulletItemProps { diff --git a/docs/src/modules/branding/BrandingCard.tsx b/docs/src/modules/branding/BrandingCard.tsx index 34d27407e1fee4..cf4404e3a25d92 100644 --- a/docs/src/modules/branding/BrandingCard.tsx +++ b/docs/src/modules/branding/BrandingCard.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import Box, { BoxProps } from '@mui/material/Box'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; interface BrandingCardProps { children?: React.ReactNode; diff --git a/docs/src/modules/branding/BrandingCustomerIcons.tsx b/docs/src/modules/branding/BrandingCustomerIcons.tsx index a2cf02e454adfd..7c0f0c741bfb01 100644 --- a/docs/src/modules/branding/BrandingCustomerIcons.tsx +++ b/docs/src/modules/branding/BrandingCustomerIcons.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; const customerIconsData = [ { image: '/static/branding/companies/coursera.svg', width: 102, height: 16, alt: 'Coursera' }, diff --git a/docs/src/modules/branding/BrandingDiscoverMore.tsx b/docs/src/modules/branding/BrandingDiscoverMore.tsx index 4474d03cd79fdb..6d49d9d789c4d7 100644 --- a/docs/src/modules/branding/BrandingDiscoverMore.tsx +++ b/docs/src/modules/branding/BrandingDiscoverMore.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; import ArrowCircleIcon from 'docs/src/modules/branding/icons/ArrowCircle'; import Link from 'docs/src/modules/components/Link'; diff --git a/docs/src/modules/branding/BrandingFooter.tsx b/docs/src/modules/branding/BrandingFooter.tsx index 0078f91d198da6..f654de7353fd4c 100644 --- a/docs/src/modules/branding/BrandingFooter.tsx +++ b/docs/src/modules/branding/BrandingFooter.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; import Interpolate from '@trendmicro/react-interpolate'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Link from 'docs/src/modules/components/Link'; -import TwitterIcon from '@material-ui/icons/Twitter'; -import IconButton from '@material-ui/core/IconButton'; -import GitHubIcon from '@material-ui/icons/GitHub'; -import LinkedInIcon from '@material-ui/icons/LinkedIn'; +import TwitterIcon from '@mui/icons-material/Twitter'; +import IconButton from '@mui/material/IconButton'; +import GitHubIcon from '@mui/icons-material/GitHub'; +import LinkedInIcon from '@mui/icons-material/LinkedIn'; import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; import BrandingLogo from 'docs/src/modules/branding/BrandingLogo'; import BrandingNewsletter from 'docs/src/modules/branding/BrandingNewsletter'; import t1 from 'docs/src/modules/branding/t1'; diff --git a/docs/src/modules/branding/BrandingHeader.tsx b/docs/src/modules/branding/BrandingHeader.tsx index f0d2928fba04b9..9bae987ef58fe8 100644 --- a/docs/src/modules/branding/BrandingHeader.tsx +++ b/docs/src/modules/branding/BrandingHeader.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import AppBar, { AppBarProps } from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Fade from '@material-ui/core/Fade'; -import Modal from '@material-ui/core/Modal'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import CloseIcon from '@material-ui/icons/Close'; +import AppBar, { AppBarProps } from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Fade from '@mui/material/Fade'; +import Modal from '@mui/material/Modal'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import CloseIcon from '@mui/icons-material/Close'; import Link from 'docs/src/modules/components/Link'; -import { styled, alpha, darken } from '@material-ui/core/styles'; +import { styled, alpha, darken } from '@mui/material/styles'; import BrandingLogo from 'docs/src/modules/branding/BrandingLogo'; import t1 from 'docs/src/modules/branding/t1'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; const links = (
    diff --git a/docs/src/modules/branding/BrandingLogo.tsx b/docs/src/modules/branding/BrandingLogo.tsx index 9a3c847c3839aa..1c7ece320b8b6a 100644 --- a/docs/src/modules/branding/BrandingLogo.tsx +++ b/docs/src/modules/branding/BrandingLogo.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import Box, { BoxProps } from '@mui/material/Box'; import Link from 'docs/src/modules/components/Link'; import t1 from 'docs/src/modules/branding/t1'; diff --git a/docs/src/modules/branding/BrandingNewsletter.tsx b/docs/src/modules/branding/BrandingNewsletter.tsx index dce425e11ed5ff..e2a1017bbeefcb 100644 --- a/docs/src/modules/branding/BrandingNewsletter.tsx +++ b/docs/src/modules/branding/BrandingNewsletter.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Alert from '@material-ui/core/Alert'; -import AlertTitle from '@material-ui/core/AlertTitle'; -import InputBase from '@material-ui/core/InputBase'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Alert from '@mui/material/Alert'; +import AlertTitle from '@mui/material/AlertTitle'; +import InputBase from '@mui/material/InputBase'; +import Typography from '@mui/material/Typography'; import t1 from 'docs/src/modules/branding/t1'; function searchParams(params: any) { diff --git a/docs/src/modules/branding/BrandingPersona.tsx b/docs/src/modules/branding/BrandingPersona.tsx index 485779376645d0..cf0d11a10f03c0 100644 --- a/docs/src/modules/branding/BrandingPersona.tsx +++ b/docs/src/modules/branding/BrandingPersona.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import { OverridableComponent } from '@material-ui/core/OverridableComponent'; -import Box, { BoxTypeMap } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Stack from '@material-ui/core/Stack'; -import TwitterIcon from '@material-ui/icons/Twitter'; -import GitHubIcon from '@material-ui/icons/GitHub'; -import IconButton from '@material-ui/core/IconButton'; -import { styled } from '@material-ui/core/styles'; +import { OverridableComponent } from '@mui/material/OverridableComponent'; +import Box, { BoxTypeMap } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Stack from '@mui/material/Stack'; +import TwitterIcon from '@mui/icons-material/Twitter'; +import GitHubIcon from '@mui/icons-material/GitHub'; +import IconButton from '@mui/material/IconButton'; +import { styled } from '@mui/material/styles'; import t1 from 'docs/src/modules/branding/t1'; interface PersonaRootProps { diff --git a/docs/src/modules/branding/BrandingQuote.tsx b/docs/src/modules/branding/BrandingQuote.tsx index 140e2fdf21afdf..86c5245580ee97 100644 --- a/docs/src/modules/branding/BrandingQuote.tsx +++ b/docs/src/modules/branding/BrandingQuote.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; interface BrandingQuoteProps { author?: { diff --git a/docs/src/modules/branding/BrandingRoot.tsx b/docs/src/modules/branding/BrandingRoot.tsx index 19f24cf1cb0b8b..0a0459a0eebff1 100644 --- a/docs/src/modules/branding/BrandingRoot.tsx +++ b/docs/src/modules/branding/BrandingRoot.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import { darken, createTheme, alpha, ThemeProvider } from '@material-ui/core/styles'; -import NProgressBar from '@material-ui/docs/NProgressBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import { darken, createTheme, alpha, ThemeProvider } from '@mui/material/styles'; +import NProgressBar from '@mui/docs/NProgressBar'; import BrandingFooter from 'docs/src/modules/branding/BrandingFooter'; -declare module '@material-ui/core/styles' { +declare module '@mui/material/styles' { interface Palette { ternary: Palette['primary']; neutral: Palette['primary']; @@ -39,13 +39,13 @@ declare module '@material-ui/core/styles' { } // Update the Typography's variant prop options -declare module '@material-ui/core/Typography' { +declare module '@mui/material/Typography' { interface TypographyPropsVariantOverrides { body3: true; } } -declare module '@material-ui/core/Button' { +declare module '@mui/material/Button' { interface ButtonPropsColorOverrides { neutral: true; ternary: true; diff --git a/docs/src/modules/branding/BrandingSearch.tsx b/docs/src/modules/branding/BrandingSearch.tsx index 8cd960cddbee93..6abdbf3cdc883f 100644 --- a/docs/src/modules/branding/BrandingSearch.tsx +++ b/docs/src/modules/branding/BrandingSearch.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import clsx from 'clsx'; import useLazyCSS from 'docs/src/modules/utils/useLazyCSS'; -import { alpha, styled } from '@material-ui/core/styles'; -import InputBase from '@material-ui/core/InputBase'; -import SearchIcon from '@material-ui/icons/Search'; +import { alpha, styled } from '@mui/material/styles'; +import InputBase from '@mui/material/InputBase'; +import SearchIcon from '@mui/icons-material/Search'; import { useTranslate } from 'docs/src/modules/utils/i18n'; const Root = styled('div')(({ theme }) => ({ diff --git a/docs/src/modules/branding/CommunitySayCard.tsx b/docs/src/modules/branding/CommunitySayCard.tsx index 3134fdf92a0bd3..14e0d3b9c67411 100644 --- a/docs/src/modules/branding/CommunitySayCard.tsx +++ b/docs/src/modules/branding/CommunitySayCard.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; import Link from 'docs/src/modules/components/Link'; interface CommunitySayCardProps { diff --git a/docs/src/modules/branding/ExclusiveFeaturesCard.tsx b/docs/src/modules/branding/ExclusiveFeaturesCard.tsx index dfc22c5a1d879f..ba650d3929a2e4 100644 --- a/docs/src/modules/branding/ExclusiveFeaturesCard.tsx +++ b/docs/src/modules/branding/ExclusiveFeaturesCard.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import MaterialUixImage from 'docs/src/modules/branding/MaterialUixImage'; interface ExclusiveFeaturesCardProps { diff --git a/docs/src/modules/branding/MaterialUixCard.tsx b/docs/src/modules/branding/MaterialUixCard.tsx index 574c85fcaf8c67..d69aa7456164a4 100644 --- a/docs/src/modules/branding/MaterialUixCard.tsx +++ b/docs/src/modules/branding/MaterialUixCard.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; +import Box, { BoxProps } from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; interface MaterialUixCardProps { children?: React.ReactNode; diff --git a/docs/src/modules/branding/MaterialUixImage.tsx b/docs/src/modules/branding/MaterialUixImage.tsx index 24f8a0fab97067..fa7e904a1bb010 100644 --- a/docs/src/modules/branding/MaterialUixImage.tsx +++ b/docs/src/modules/branding/MaterialUixImage.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box, { BoxProps } from '@material-ui/core/Box'; +import Box, { BoxProps } from '@mui/material/Box'; interface MaterialUixImageProps { height?: number; diff --git a/docs/src/modules/branding/RoadMapDetailCard.tsx b/docs/src/modules/branding/RoadMapDetailCard.tsx index 99f007497f152e..421881991a9fc9 100644 --- a/docs/src/modules/branding/RoadMapDetailCard.tsx +++ b/docs/src/modules/branding/RoadMapDetailCard.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; import Link from 'docs/src/modules/components/Link'; import MaterialUixImage from 'docs/src/modules/branding/MaterialUixImage'; diff --git a/docs/src/modules/branding/StartMaterialCard.tsx b/docs/src/modules/branding/StartMaterialCard.tsx index bbb9d8a93a2d44..86ef866206ebc7 100644 --- a/docs/src/modules/branding/StartMaterialCard.tsx +++ b/docs/src/modules/branding/StartMaterialCard.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; -import MuiButton from '@material-ui/core/Button'; -import NavigateNextIcon from '@material-ui/icons/NavigateNext'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; +import MuiButton from '@mui/material/Button'; +import NavigateNextIcon from '@mui/icons-material/NavigateNext'; import BrandingBulletItem from 'docs/src/modules/branding/BrandingBulletItem'; import Link from 'docs/src/modules/components/Link'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; import WatchIcon from 'docs/src/modules/branding/icons/Watch'; // PriorityButton start diff --git a/docs/src/modules/branding/UnderlinedText.tsx b/docs/src/modules/branding/UnderlinedText.tsx index 11e130a29235d8..fbc03cf231b5f0 100644 --- a/docs/src/modules/branding/UnderlinedText.tsx +++ b/docs/src/modules/branding/UnderlinedText.tsx @@ -1,4 +1,4 @@ -import { styled, alpha } from '@material-ui/core/styles'; +import { styled, alpha } from '@mui/material/styles'; const UnderlinedText = styled('span', { shouldForwardProp: (prop) => prop !== 'mode', diff --git a/docs/src/modules/branding/icons/ArrowCircle.js b/docs/src/modules/branding/icons/ArrowCircle.js index ac5076e0e223cf..70fb82c99008da 100644 --- a/docs/src/modules/branding/icons/ArrowCircle.js +++ b/docs/src/modules/branding/icons/ArrowCircle.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/branding/icons/Search.js b/docs/src/modules/branding/icons/Search.js index 77d63c85137235..8aec815becc23f 100644 --- a/docs/src/modules/branding/icons/Search.js +++ b/docs/src/modules/branding/icons/Search.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/ApiPage.js b/docs/src/modules/components/ApiPage.js index a4162517c8bf8d..cb7a2e961d22d2 100644 --- a/docs/src/modules/components/ApiPage.js +++ b/docs/src/modules/components/ApiPage.js @@ -2,10 +2,10 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import clsx from 'clsx'; -import { exactProp } from '@material-ui/utils'; -import { styled } from '@material-ui/core/styles'; -import Alert from '@material-ui/core/Alert'; -import Typography from '@material-ui/core/Typography'; +import { exactProp } from '@mui/utils'; +import { styled } from '@mui/material/styles'; +import Alert from '@mui/material/Alert'; +import Typography from '@mui/material/Typography'; import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; @@ -207,10 +207,7 @@ function ApiDocs(props) { const description = t('api-docs.pageDescription').replace(/{{name}}/, componentName); const source = filename - .replace( - /\/packages\/material-ui(-(.+?))?\/src/, - (match, dash, pkg) => `@material-ui/${pkg || 'core'}`, - ) + .replace(/\/packages\/material-ui(-(.+?))?\/src/, (match, dash, pkg) => `@mui/${pkg || 'core'}`) // convert things like `/Table/Table.js` to `` .replace(/\/([^/]+)\/\1\.(js|tsx)$/, ''); diff --git a/docs/src/modules/components/AppContainer.js b/docs/src/modules/components/AppContainer.js index f2a355352bfb86..b6297a1198051e 100644 --- a/docs/src/modules/components/AppContainer.js +++ b/docs/src/modules/components/AppContainer.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Container from '@material-ui/core/Container'; +import { styled } from '@mui/material/styles'; +import Container from '@mui/material/Container'; const StyledContainer = styled(Container)(({ theme }) => { return { diff --git a/docs/src/modules/components/AppFooter.js b/docs/src/modules/components/AppFooter.js index c8b8aecda22f60..a4dcba42ffa759 100644 --- a/docs/src/modules/components/AppFooter.js +++ b/docs/src/modules/components/AppFooter.js @@ -1,11 +1,11 @@ /* eslint-disable material-ui/no-hardcoded-labels */ import * as React from 'react'; import Interpolate from '@trendmicro/react-interpolate'; -import { styled } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; -import Divider from '@material-ui/core/Divider'; +import { styled } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; +import Divider from '@mui/material/Divider'; import Link from 'docs/src/modules/components/Link'; import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/modules/components/AppFrame.js b/docs/src/modules/components/AppFrame.js index 4fbb2970ff4cd6..b14c1e1dfbd5d8 100644 --- a/docs/src/modules/components/AppFrame.js +++ b/docs/src/modules/components/AppFrame.js @@ -1,26 +1,26 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useRouter } from 'next/router'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; import NProgress from 'nprogress'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import MuiLink from '@material-ui/core/Link'; -import AppBar from '@material-ui/core/AppBar'; -import Stack from '@material-ui/core/Stack'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import Tooltip from '@material-ui/core/Tooltip'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import NoSsr from '@material-ui/core/NoSsr'; -import ArrowDropDownRoundedIcon from '@material-ui/icons/ArrowDropDownRounded'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import Divider from '@material-ui/core/Divider'; -import SettingsIcon from '@material-ui/icons/SettingsOutlined'; -import GitHubIcon from '@material-ui/icons/GitHub'; -import NProgressBar from '@material-ui/docs/NProgressBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import MuiLink from '@mui/material/Link'; +import AppBar from '@mui/material/AppBar'; +import Stack from '@mui/material/Stack'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import Tooltip from '@mui/material/Tooltip'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import NoSsr from '@mui/material/NoSsr'; +import ArrowDropDownRoundedIcon from '@mui/icons-material/ArrowDropDownRounded'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import Divider from '@mui/material/Divider'; +import SettingsIcon from '@mui/icons-material/SettingsOutlined'; +import GitHubIcon from '@mui/icons-material/GitHub'; +import NProgressBar from '@mui/docs/NProgressBar'; import AppNavDrawer from 'docs/src/modules/components/AppNavDrawer'; import AppSettingsDrawer from 'docs/src/modules/components/AppSettingsDrawer'; import Notifications from 'docs/src/modules/components/Notifications'; @@ -29,7 +29,7 @@ import { LANGUAGES_LABEL } from 'docs/src/modules/constants'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import PageContext from 'docs/src/modules/components/PageContext'; import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; -import LanguageIcon from '@material-ui/icons/Translate'; +import LanguageIcon from '@mui/icons-material/Translate'; const LOCALES = { zh: 'zh-CN', pt: 'pt-BR', es: 'es-ES' }; const CROWDIN_ROOT_URL = 'https://translate.material-ui.com/project/material-ui-docs/'; diff --git a/docs/src/modules/components/AppLayoutDocs.js b/docs/src/modules/components/AppLayoutDocs.js index ef384ef66fb69e..bf0dcb83f09e35 100644 --- a/docs/src/modules/components/AppLayoutDocs.js +++ b/docs/src/modules/components/AppLayoutDocs.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled } from '@material-ui/core/styles'; -import { exactProp } from '@material-ui/utils'; -import NoSsr from '@material-ui/core/NoSsr'; +import { styled } from '@mui/material/styles'; +import { exactProp } from '@mui/utils'; +import NoSsr from '@mui/material/NoSsr'; import Head from 'docs/src/modules/components/Head'; import AppFrame from 'docs/src/modules/components/AppFrame'; import EditPage from 'docs/src/modules/components/EditPage'; diff --git a/docs/src/modules/components/AppLayoutDocsFooter.js b/docs/src/modules/components/AppLayoutDocsFooter.js index 43ed9c9d119e01..c743f394c89106 100644 --- a/docs/src/modules/components/AppLayoutDocsFooter.js +++ b/docs/src/modules/components/AppLayoutDocsFooter.js @@ -1,20 +1,20 @@ /* eslint-disable no-restricted-globals */ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import DialogActions from '@material-ui/core/DialogActions'; -import TextField from '@material-ui/core/TextField'; -import Collapse from '@material-ui/core/Collapse'; -import Button from '@material-ui/core/Button'; -import Divider from '@material-ui/core/Divider'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import IconButton from '@material-ui/core/IconButton'; -import ThumbUpIcon from '@material-ui/icons/ThumbUpAlt'; -import ThumbDownIcon from '@material-ui/icons/ThumbDownAlt'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import Snackbar from '@material-ui/core/Snackbar'; +import { styled } from '@mui/material/styles'; +import DialogActions from '@mui/material/DialogActions'; +import TextField from '@mui/material/TextField'; +import Collapse from '@mui/material/Collapse'; +import Button from '@mui/material/Button'; +import Divider from '@mui/material/Divider'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import IconButton from '@mui/material/IconButton'; +import ThumbUpIcon from '@mui/icons-material/ThumbUpAlt'; +import ThumbDownIcon from '@mui/icons-material/ThumbDownAlt'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import Snackbar from '@mui/material/Snackbar'; import { getCookie, pageToTitleI18n } from 'docs/src/modules/utils/helpers'; import PageContext from 'docs/src/modules/components/PageContext'; import Link from 'docs/src/modules/components/Link'; diff --git a/docs/src/modules/components/AppNavDrawer.js b/docs/src/modules/components/AppNavDrawer.js index 9082b5e704ba8a..d9b0ad00ab1a02 100644 --- a/docs/src/modules/components/AppNavDrawer.js +++ b/docs/src/modules/components/AppNavDrawer.js @@ -1,13 +1,13 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled } from '@material-ui/core/styles'; -import List from '@material-ui/core/List'; -import Drawer from '@material-ui/core/Drawer'; -import SwipeableDrawer from '@material-ui/core/SwipeableDrawer'; -import Divider from '@material-ui/core/Divider'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import Box from '@material-ui/core/Box'; -import { unstable_useEnhancedEffect as useEnhancedEffect } from '@material-ui/utils'; +import { styled } from '@mui/material/styles'; +import List from '@mui/material/List'; +import Drawer from '@mui/material/Drawer'; +import SwipeableDrawer from '@mui/material/SwipeableDrawer'; +import Divider from '@mui/material/Divider'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import Box from '@mui/material/Box'; +import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils'; import DiamondSponsors from 'docs/src/modules/components/DiamondSponsors'; import AppNavDrawerItem from 'docs/src/modules/components/AppNavDrawerItem'; import Link from 'docs/src/modules/components/Link'; diff --git a/docs/src/modules/components/AppNavDrawerItem.js b/docs/src/modules/components/AppNavDrawerItem.js index 943cd5e573b429..d4c80bef414ea6 100644 --- a/docs/src/modules/components/AppNavDrawerItem.js +++ b/docs/src/modules/components/AppNavDrawerItem.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { alpha, styled } from '@material-ui/core/styles'; -import Collapse from '@material-ui/core/Collapse'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import ArrowRightIcon from '@material-ui/icons/ArrowRight'; +import { alpha, styled } from '@mui/material/styles'; +import Collapse from '@mui/material/Collapse'; +import ButtonBase from '@mui/material/ButtonBase'; +import ArrowRightIcon from '@mui/icons-material/ArrowRight'; import Link from 'docs/src/modules/components/Link'; const Item = styled(({ component: Component = 'div', ...props }) => , { diff --git a/docs/src/modules/components/AppSearch.js b/docs/src/modules/components/AppSearch.js index ffac21b41dd030..28850cf3a3a230 100644 --- a/docs/src/modules/components/AppSearch.js +++ b/docs/src/modules/components/AppSearch.js @@ -1,10 +1,10 @@ import * as React from 'react'; import useLazyCSS from 'docs/src/modules/utils/useLazyCSS'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import { styled, useTheme, alpha } from '@material-ui/core/styles'; -import GlobalStyles from '@material-ui/core/GlobalStyles'; -import Input from '@material-ui/core/Input'; -import SearchIcon from '@material-ui/icons/Search'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import { styled, useTheme, alpha } from '@mui/material/styles'; +import GlobalStyles from '@mui/material/GlobalStyles'; +import Input from '@mui/material/Input'; +import SearchIcon from '@mui/icons-material/Search'; import { handleEvent } from 'docs/src/modules/components/MarkdownLinks'; import docsearch from 'docsearch.js'; import { LANGUAGES_SSR } from 'docs/src/modules/constants'; diff --git a/docs/src/modules/components/AppSettingsDrawer.js b/docs/src/modules/components/AppSettingsDrawer.js index a5c34d8a1d306c..b7ba5887bc2272 100644 --- a/docs/src/modules/components/AppSettingsDrawer.js +++ b/docs/src/modules/components/AppSettingsDrawer.js @@ -1,21 +1,21 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled, useTheme } from '@material-ui/core/styles'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import Drawer from '@material-ui/core/Drawer'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import IconButton from '@material-ui/core/IconButton'; -import CloseIcon from '@material-ui/icons/Close'; -import Brightness2RoundedIcon from '@material-ui/icons/Brightness2Rounded'; -import Brightness7Icon from '@material-ui/icons/Brightness7'; -import SettingsBrightnessIcon from '@material-ui/icons/SettingsBrightness'; -import FormatTextdirectionLToRIcon from '@material-ui/icons/FormatTextdirectionLToR'; -import FormatTextdirectionRToLIcon from '@material-ui/icons/FormatTextdirectionRToL'; +import { styled, useTheme } from '@mui/material/styles'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import Drawer from '@mui/material/Drawer'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; +import ToggleButton from '@mui/material/ToggleButton'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; +import Brightness2RoundedIcon from '@mui/icons-material/Brightness2Rounded'; +import Brightness7Icon from '@mui/icons-material/Brightness7'; +import SettingsBrightnessIcon from '@mui/icons-material/SettingsBrightness'; +import FormatTextdirectionLToRIcon from '@mui/icons-material/FormatTextdirectionLToR'; +import FormatTextdirectionRToLIcon from '@mui/icons-material/FormatTextdirectionRToL'; import Link from 'docs/src/modules/components/Link'; import { useTranslate } from 'docs/src/modules/utils/i18n'; import { useChangeTheme } from 'docs/src/modules/components/ThemeContext'; diff --git a/docs/src/modules/components/AppTableOfContents.js b/docs/src/modules/components/AppTableOfContents.js index d3d69f547cd75d..1a05f4158a5452 100644 --- a/docs/src/modules/components/AppTableOfContents.js +++ b/docs/src/modules/components/AppTableOfContents.js @@ -2,8 +2,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import throttle from 'lodash/throttle'; -import { styled } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; import Link from 'docs/src/modules/components/Link'; import PageContext from 'docs/src/modules/components/PageContext'; import { useTranslate } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/modules/components/BundleSizeIcon.js b/docs/src/modules/components/BundleSizeIcon.js index 8f1bf04f46dcf6..0c2e0efd8ba386 100644 --- a/docs/src/modules/components/BundleSizeIcon.js +++ b/docs/src/modules/components/BundleSizeIcon.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/ComponentLinkHeader.js b/docs/src/modules/components/ComponentLinkHeader.js index 2215e20521bb3a..29f817c30353a9 100644 --- a/docs/src/modules/components/ComponentLinkHeader.js +++ b/docs/src/modules/components/ComponentLinkHeader.js @@ -1,15 +1,15 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Chip from '@material-ui/core/Chip'; -import Tooltip from '@material-ui/core/Tooltip'; +import Chip from '@mui/material/Chip'; +import Tooltip from '@mui/material/Tooltip'; import SketchIcon from 'docs/src/modules/components/SketchIcon'; import FigmaIcon from 'docs/src/modules/components/FigmaIcon'; import AdobeXDIcon from 'docs/src/modules/components/AdobeXDIcon'; import BundleSizeIcon from 'docs/src/modules/components/BundleSizeIcon'; -import InfoOutlinedIcon from '@material-ui/icons/InfoOutlined'; +import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; import W3CIcon from 'docs/src/modules/components/W3CIcon'; import MaterialDesignIcon from 'docs/src/modules/components/MaterialDesignIcon'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; import { useTranslate } from 'docs/src/modules/utils/i18n'; const Root = styled('ul')(({ theme }) => ({ @@ -27,7 +27,7 @@ const Root = styled('ul')(({ theme }) => ({ export default function ComponentLinkHeader(props) { const { headers, - headers: { packageName = '@material-ui/core' }, + headers: { packageName = '@mui/material' }, options, } = props; const t = useTranslate(); diff --git a/docs/src/modules/components/Demo.js b/docs/src/modules/components/Demo.js index 97563723d2ac19..bcf05da2468321 100644 --- a/docs/src/modules/components/Demo.js +++ b/docs/src/modules/components/Demo.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { alpha, styled } from '@material-ui/core/styles'; -import IconButton from '@material-ui/core/IconButton'; -import Collapse from '@material-ui/core/Collapse'; -import NoSsr from '@material-ui/core/NoSsr'; +import { alpha, styled } from '@mui/material/styles'; +import IconButton from '@mui/material/IconButton'; +import Collapse from '@mui/material/Collapse'; +import NoSsr from '@mui/material/NoSsr'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import DemoSandboxed from 'docs/src/modules/components/DemoSandboxed'; import { AdCarbonInline } from 'docs/src/modules/components/AdCarbon'; diff --git a/docs/src/modules/components/DemoErrorBoundary.js b/docs/src/modules/components/DemoErrorBoundary.js index d9d5e298505bb3..2ba155b338b093 100644 --- a/docs/src/modules/components/DemoErrorBoundary.js +++ b/docs/src/modules/components/DemoErrorBoundary.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; -import Button from '@material-ui/core/Button'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; +import Button from '@mui/material/Button'; /** * Based on https://github.com/sindresorhus/new-github-issue-url/blob/061fa0ddb7d51f3b96d3a0f6a6bebb196f105a7b/index.js diff --git a/docs/src/modules/components/DemoSandboxed.js b/docs/src/modules/components/DemoSandboxed.js index 90285ff312b98c..d2c52e5a6fb1d9 100644 --- a/docs/src/modules/components/DemoSandboxed.js +++ b/docs/src/modules/components/DemoSandboxed.js @@ -7,8 +7,8 @@ import rtlPluginSc from 'stylis-plugin-rtl-sc'; import createCache from '@emotion/cache'; import { CacheProvider } from '@emotion/react'; import { StyleSheetManager } from 'styled-components'; -import { jssPreset, StylesProvider } from '@material-ui/styles'; -import { useTheme, styled, createTheme, ThemeProvider } from '@material-ui/core/styles'; +import { jssPreset, StylesProvider } from '@mui/styles'; +import { useTheme, styled, createTheme, ThemeProvider } from '@mui/material/styles'; import rtl from 'jss-rtl'; import DemoErrorBoundary from 'docs/src/modules/components/DemoErrorBoundary'; import { useTranslate } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/modules/components/DemoToolbar.js b/docs/src/modules/components/DemoToolbar.js index 33eab322b1090b..374d40b4b57ede 100644 --- a/docs/src/modules/components/DemoToolbar.js +++ b/docs/src/modules/components/DemoToolbar.js @@ -3,23 +3,23 @@ import PropTypes from 'prop-types'; import clsx from 'clsx'; import copy from 'clipboard-copy'; import LZString from 'lz-string'; -import { useTheme, styled } from '@material-ui/core/styles'; -import IconButton from '@material-ui/core/IconButton'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import Fade from '@material-ui/core/Fade'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; -import { JavaScript as JavaScriptIcon, TypeScript as TypeScriptIcon } from '@material-ui/docs'; -import CodeRoundedIcon from '@material-ui/icons/CodeRounded'; -import SvgIcon from '@material-ui/core/SvgIcon'; -import ContentCopyRoundedIcon from '@material-ui/icons/ContentCopyRounded'; -import Snackbar from '@material-ui/core/Snackbar'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; -import Tooltip from '@material-ui/core/Tooltip'; -import RefreshRoundedIcon from '@material-ui/icons/RefreshRounded'; -import ResetFocusIcon from '@material-ui/icons/CenterFocusWeak'; +import { useTheme, styled } from '@mui/material/styles'; +import IconButton from '@mui/material/IconButton'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import Fade from '@mui/material/Fade'; +import ToggleButton from '@mui/material/ToggleButton'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; +import { JavaScript as JavaScriptIcon, TypeScript as TypeScriptIcon } from '@mui/docs'; +import CodeRoundedIcon from '@mui/icons-material/CodeRounded'; +import SvgIcon from '@mui/material/SvgIcon'; +import ContentCopyRoundedIcon from '@mui/icons-material/ContentCopyRounded'; +import Snackbar from '@mui/material/Snackbar'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; +import Tooltip from '@mui/material/Tooltip'; +import RefreshRoundedIcon from '@mui/icons-material/RefreshRounded'; +import ResetFocusIcon from '@mui/icons-material/CenterFocusWeak'; import getDemoConfig from 'docs/src/modules/utils/getDemoConfig'; import { getCookie } from 'docs/src/modules/utils/helpers'; import { CODE_VARIANTS } from 'docs/src/modules/constants'; diff --git a/docs/src/modules/components/DiamondSponsors.js b/docs/src/modules/components/DiamondSponsors.js index cebe8efea237f3..b2b93a5809bd33 100644 --- a/docs/src/modules/components/DiamondSponsors.js +++ b/docs/src/modules/components/DiamondSponsors.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Typography from '@material-ui/core/Typography'; -import { useTheme, styled } from '@material-ui/core/styles'; -import AddIcon from '@material-ui/icons/Add'; +import Typography from '@mui/material/Typography'; +import { useTheme, styled } from '@mui/material/styles'; +import AddIcon from '@mui/icons-material/Add'; import { useTranslate } from 'docs/src/modules/utils/i18n'; const Root = styled('div')(({ theme }) => ({ diff --git a/docs/src/modules/components/EditPage.js b/docs/src/modules/components/EditPage.js index 7841d42b51b0f9..ac2442ca33ff61 100644 --- a/docs/src/modules/components/EditPage.js +++ b/docs/src/modules/components/EditPage.js @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; export default function EditPage(props) { diff --git a/docs/src/modules/components/FigmaIcon.js b/docs/src/modules/components/FigmaIcon.js index 17d7788f23cf1e..18985ed1a229bc 100644 --- a/docs/src/modules/components/FigmaIcon.js +++ b/docs/src/modules/components/FigmaIcon.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/HighlightedCode.js b/docs/src/modules/components/HighlightedCode.js index 56c3bcd0461a09..6abee723f46464 100644 --- a/docs/src/modules/components/HighlightedCode.js +++ b/docs/src/modules/components/HighlightedCode.js @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import prism from '@material-ui/markdown/prism'; +import prism from '@mui/markdown/prism'; import MarkdownElement from './MarkdownElement'; const HighlightedCode = React.forwardRef(function HighlightedCode(props, ref) { diff --git a/docs/src/modules/components/Link.d.ts b/docs/src/modules/components/Link.d.ts index 2f7071a97d4030..afebd27ce1be05 100644 --- a/docs/src/modules/components/Link.d.ts +++ b/docs/src/modules/components/Link.d.ts @@ -1,4 +1,4 @@ -import { LinkProps as MuiLinkProps } from '@material-ui/core/Link'; +import { LinkProps as MuiLinkProps } from '@mui/material/Link'; import { LinkProps } from 'next/link'; export default function Link(props: LinkProps & MuiLinkProps): JSX.Element; diff --git a/docs/src/modules/components/Link.tsx b/docs/src/modules/components/Link.tsx index d1c2a64a7dda60..21823bdb4263b3 100644 --- a/docs/src/modules/components/Link.tsx +++ b/docs/src/modules/components/Link.tsx @@ -2,8 +2,8 @@ import * as React from 'react'; import clsx from 'clsx'; import { useRouter } from 'next/router'; import NextLink, { LinkProps as NextLinkProps } from 'next/link'; -import { styled } from '@material-ui/core/styles'; -import MuiLink, { LinkProps as MuiLinkProps } from '@material-ui/core/Link'; +import { styled } from '@mui/material/styles'; +import MuiLink, { LinkProps as MuiLinkProps } from '@mui/material/Link'; import { useUserLanguage } from 'docs/src/modules/utils/i18n'; interface NextLinkComposedProps diff --git a/docs/src/modules/components/MarkdownDocs.js b/docs/src/modules/components/MarkdownDocs.js index b4190d8827e1c8..ae255e0a25a28f 100644 --- a/docs/src/modules/components/MarkdownDocs.js +++ b/docs/src/modules/components/MarkdownDocs.js @@ -2,12 +2,12 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import Demo from 'docs/src/modules/components/Demo'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; -import { exactProp } from '@material-ui/utils'; +import { exactProp } from '@mui/utils'; import ComponentLinkHeader from 'docs/src/modules/components/ComponentLinkHeader'; import AppLayoutDocs from 'docs/src/modules/components/AppLayoutDocs'; import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; -// TODO: Only import on demand via @material-ui/markdown/loader +// TODO: Only import on demand via @mui/markdown/loader const markdownComponents = { 'modules/components/ComponentLinkHeader.js': ComponentLinkHeader, }; diff --git a/docs/src/modules/components/MarkdownElement.js b/docs/src/modules/components/MarkdownElement.js index 62cb72284ae9c6..d4dc4b05d8e7c5 100644 --- a/docs/src/modules/components/MarkdownElement.js +++ b/docs/src/modules/components/MarkdownElement.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import clsx from 'clsx'; -import { alpha, darken, styled } from '@material-ui/core/styles'; +import { alpha, darken, styled } from '@mui/material/styles'; const Root = styled('div')(({ theme }) => ({ ...theme.typography.body1, diff --git a/docs/src/modules/components/MaterialDesignIcon.js b/docs/src/modules/components/MaterialDesignIcon.js index 09bb22ea2fd96e..172f0d9095e8f2 100644 --- a/docs/src/modules/components/MaterialDesignIcon.js +++ b/docs/src/modules/components/MaterialDesignIcon.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/Notifications.js b/docs/src/modules/components/Notifications.js index 0fe4373c2e365e..0908c07f555304 100644 --- a/docs/src/modules/components/Notifications.js +++ b/docs/src/modules/components/Notifications.js @@ -1,18 +1,18 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import NotificationsNoneRoundedIcon from '@material-ui/icons/NotificationsNoneRounded'; -import Tooltip from '@material-ui/core/Tooltip'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import IconButton from '@material-ui/core/IconButton'; -import Badge from '@material-ui/core/Badge'; -import Typography from '@material-ui/core/Typography'; -import Popper from '@material-ui/core/Popper'; -import Grow from '@material-ui/core/Grow'; -import MuiPaper from '@material-ui/core/Paper'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import MuiList from '@material-ui/core/List'; -import MuiListItem from '@material-ui/core/ListItem'; -import MuiDivider from '@material-ui/core/Divider'; +import { styled } from '@mui/material/styles'; +import NotificationsNoneRoundedIcon from '@mui/icons-material/NotificationsNoneRounded'; +import Tooltip from '@mui/material/Tooltip'; +import CircularProgress from '@mui/material/CircularProgress'; +import IconButton from '@mui/material/IconButton'; +import Badge from '@mui/material/Badge'; +import Typography from '@mui/material/Typography'; +import Popper from '@mui/material/Popper'; +import Grow from '@mui/material/Grow'; +import MuiPaper from '@mui/material/Paper'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import MuiList from '@mui/material/List'; +import MuiListItem from '@mui/material/ListItem'; +import MuiDivider from '@mui/material/Divider'; import { getCookie } from 'docs/src/modules/utils/helpers'; import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/modules/components/SketchIcon.js b/docs/src/modules/components/SketchIcon.js index 7debae24dc6e40..838886e6d3b131 100644 --- a/docs/src/modules/components/SketchIcon.js +++ b/docs/src/modules/components/SketchIcon.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/ThemeContext.js b/docs/src/modules/components/ThemeContext.js index 2eab6149ce6da6..91d44201a38856 100644 --- a/docs/src/modules/components/ThemeContext.js +++ b/docs/src/modules/components/ThemeContext.js @@ -4,12 +4,12 @@ import { ThemeProvider as MuiThemeProvider, createTheme as createLegacyModeTheme, unstable_createMuiStrictModeTheme as createStrictModeTheme, -} from '@material-ui/core/styles'; -import GlobalStyles from '@material-ui/core/GlobalStyles'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import { enUS, zhCN, faIR, ruRU, ptBR, esES, frFR, deDE, jaJP } from '@material-ui/core/locale'; -import darkScrollbar from '@material-ui/core/darkScrollbar'; -import { unstable_useEnhancedEffect as useEnhancedEffect } from '@material-ui/core/utils'; +} from '@mui/material/styles'; +import GlobalStyles from '@mui/material/GlobalStyles'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import { enUS, zhCN, faIR, ruRU, ptBR, esES, frFR, deDE, jaJP } from '@mui/material/locale'; +import darkScrollbar from '@mui/material/darkScrollbar'; +import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils'; import { getCookie } from 'docs/src/modules/utils/helpers'; import useLazyCSS from 'docs/src/modules/utils/useLazyCSS'; import { useUserLanguage } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/modules/components/TopLayoutBlog.js b/docs/src/modules/components/TopLayoutBlog.js index dc49eb5000d80a..3f4d6596ed51c8 100644 --- a/docs/src/modules/components/TopLayoutBlog.js +++ b/docs/src/modules/components/TopLayoutBlog.js @@ -1,17 +1,17 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { createTheme } from '@material-ui/core/styles'; -import { withStyles } from '@material-ui/styles'; +import { createTheme } from '@mui/material/styles'; +import { withStyles } from '@mui/styles'; import Head from 'docs/src/modules/components/Head'; import AppFrame from 'docs/src/modules/components/AppFrame'; import AppContainer from 'docs/src/modules/components/AppContainer'; import { useRouter } from 'next/router'; -import Link from '@material-ui/core/Link'; -import Typography from '@material-ui/core/Typography'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Link from '@mui/material/Link'; +import Typography from '@mui/material/Typography'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; import AppFooter from 'docs/src/modules/components/AppFooter'; -import { exactProp } from '@material-ui/utils'; +import { exactProp } from '@mui/utils'; import MarkdownElement from './MarkdownElement'; const authors = { diff --git a/docs/src/modules/components/TopLayoutCompany.js b/docs/src/modules/components/TopLayoutCompany.js index 844bd88c5c493c..8506b940a59750 100644 --- a/docs/src/modules/components/TopLayoutCompany.js +++ b/docs/src/modules/components/TopLayoutCompany.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { withStyles } from '@material-ui/styles'; -import { createTheme } from '@material-ui/core/styles'; +import { withStyles } from '@mui/styles'; +import { createTheme } from '@mui/material/styles'; import Head from 'docs/src/modules/components/Head'; import AppFrame from 'docs/src/modules/components/AppFrame'; import AppContainer from 'docs/src/modules/components/AppContainer'; diff --git a/docs/src/modules/components/W3CIcon.js b/docs/src/modules/components/W3CIcon.js index 0b85ec75251052..f651d72c75bbd1 100644 --- a/docs/src/modules/components/W3CIcon.js +++ b/docs/src/modules/components/W3CIcon.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { createSvgIcon } from '@material-ui/core/utils'; +import { createSvgIcon } from '@mui/material/utils'; export default createSvgIcon( diff --git a/docs/src/modules/components/ad.styles.js b/docs/src/modules/components/ad.styles.js index f3134fceecb85f..32ceabfec78362 100644 --- a/docs/src/modules/components/ad.styles.js +++ b/docs/src/modules/components/ad.styles.js @@ -1,4 +1,4 @@ -import { alpha } from '@material-ui/core/styles'; +import { alpha } from '@mui/material/styles'; import { adShape } from 'docs/src/modules/components/AdManager'; const adBodyImageStyles = (theme) => ({ diff --git a/docs/src/modules/utils/StyledEngineProvider.js b/docs/src/modules/utils/StyledEngineProvider.js index 4a2ee403fc7673..d42e4f7798c8ed 100644 --- a/docs/src/modules/utils/StyledEngineProvider.js +++ b/docs/src/modules/utils/StyledEngineProvider.js @@ -5,7 +5,7 @@ import { CacheProvider } from '@emotion/react'; import createCache from '@emotion/cache'; import rtlPlugin from 'stylis-plugin-rtl'; import rtlPluginSc from 'stylis-plugin-rtl-sc'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; // Cache for the rtl version of the styles const cacheRtl = createCache({ diff --git a/docs/src/modules/utils/getDemoConfig.js b/docs/src/modules/utils/getDemoConfig.js index 62d18c86caea95..6d294ceefc8697 100644 --- a/docs/src/modules/utils/getDemoConfig.js +++ b/docs/src/modules/utils/getDemoConfig.js @@ -12,7 +12,7 @@ function jsDemo(demoData, options) { 'index.js': ` import * as React from 'react'; import ReactDOM from 'react-dom'; -import { StyledEngineProvider } from '@material-ui/core/styles'; +import { StyledEngineProvider } from '@mui/material/styles'; import Demo from './demo'; ReactDOM.render( @@ -38,7 +38,7 @@ function tsDemo(demoData, options) { 'index.tsx': ` import * as React from 'react'; import ReactDOM from 'react-dom'; -import { StyledEngineProvider } from '@material-ui/core/styles'; +import { StyledEngineProvider } from '@mui/material/styles'; import Demo from './demo'; ReactDOM.render( diff --git a/docs/src/modules/utils/getJsxPreview.test.js b/docs/src/modules/utils/getJsxPreview.test.js index 13f8898fd5b9df..bbccb12b1032b5 100644 --- a/docs/src/modules/utils/getJsxPreview.test.js +++ b/docs/src/modules/utils/getJsxPreview.test.js @@ -7,7 +7,7 @@ describe('getJsxPreview', () => { getJsxPreview( ` import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; +import Rating from '@mui/material/Rating'; export default function HalfRating() { return ; diff --git a/docs/src/modules/utils/helpers.test.js b/docs/src/modules/utils/helpers.test.js index 704ab3533ef3ad..5d7f39909d905b 100644 --- a/docs/src/modules/utils/helpers.test.js +++ b/docs/src/modules/utils/helpers.test.js @@ -13,13 +13,13 @@ describe('docs getDependencies helpers', () => { const s1 = ` import * as React from 'react'; import PropTypes from 'prop-types'; -import { withStyles } from '@material-ui/core/styles'; -import Input from '@material-ui/core/Input'; -import InputLabel from '@material-ui/core/InputLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import Select from '@material-ui/core/Select'; -import SliderUnstyled from '@material-ui/unstyled/SliderUnstyled'; +import { withStyles } from '@mui/material/styles'; +import Input from '@mui/material/Input'; +import InputLabel from '@mui/material/InputLabel'; +import FormControl from '@mui/material/FormControl'; +import FormHelperText from '@mui/material/FormHelperText'; +import Select from '@mui/material/Select'; +import SliderUnstyled from '@mui/core/SliderUnstyled'; import FooBar, { Qux } from '@foo-bar/bip'; const styles = theme => ({ container: { @@ -36,8 +36,8 @@ const styles = theme => ({ '@emotion/react': 'latest', '@emotion/styled': 'latest', '@foo-bar/bip': 'latest', - '@material-ui/core': 'next', - '@material-ui/unstyled': 'next', + '@mui/material': 'next', + '@mui/core': 'next', 'prop-types': 'latest', }); }); @@ -50,10 +50,10 @@ import * as _ from '@unexisting/thing'; import Draggable from 'react-draggable'; import match from 'autosuggest-highlight/match'; import parse from 'autosuggest-highlight/parse'; -import TextField from '@material-ui/core/TextField'; -import Paper from '@material-ui/core/Paper'; -import MenuItem from '@material-ui/core/MenuItem'; -import { withStyles } from '@material-ui/core/styles'; +import TextField from '@mui/material/TextField'; +import Paper from '@mui/material/Paper'; +import MenuItem from '@mui/material/MenuItem'; +import { withStyles } from '@mui/material/styles'; const suggestions = [ `; @@ -62,7 +62,7 @@ const suggestions = [ 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': 'next', + '@mui/material': 'next', '@unexisting/thing': 'latest', 'autosuggest-highlight': 'latest', 'prop-types': 'latest', @@ -74,10 +74,10 @@ const suggestions = [ const source = ` import * as React from 'react'; import PropTypes from 'prop-types'; -import Grid from '@material-ui/core/Grid'; -import { withStyles } from '@material-ui/core/styles'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePicker, KeyboardDatePicker } from '@material-ui/lab'; +import Grid from '@mui/material/Grid'; +import { withStyles } from '@mui/material/styles'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePicker, KeyboardDatePicker } from '@mui/lab'; `; expect(getDependencies(source)).to.deep.equal({ @@ -86,8 +86,8 @@ import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePic 'prop-types': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': 'next', - '@material-ui/lab': 'next', + '@mui/material': 'next', + '@mui/lab': 'next', 'date-fns': 'latest', }); }); @@ -100,8 +100,8 @@ import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePic '@emotion/react': 'latest', '@emotion/styled': 'latest', '@foo-bar/bip': 'latest', - '@material-ui/core': 'next', - '@material-ui/unstyled': 'next', + '@mui/material': 'next', + '@mui/core': 'next', '@types/foo-bar__bip': 'latest', '@types/prop-types': 'latest', '@types/react-dom': 'latest', @@ -113,12 +113,12 @@ import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePic it('should handle multilines', () => { const source = ` import * as React from 'react'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePicker, KeyboardDatePicker, -} from '@material-ui/lab'; +} from '@mui/lab'; `; expect(getDependencies(source)).to.deep.equal({ @@ -126,15 +126,15 @@ import { 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': 'next', - '@material-ui/lab': 'next', + '@mui/material': 'next', + '@mui/lab': 'next', 'date-fns': 'latest', }); }); it('should include core if lab present', () => { const source = ` -import lab from '@material-ui/lab'; +import lab from '@mui/lab'; `; expect(getDependencies(source)).to.deep.equal({ @@ -142,20 +142,20 @@ import lab from '@material-ui/lab'; 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': 'next', - '@material-ui/lab': 'next', + '@mui/material': 'next', + '@mui/lab': 'next', }); }); it('can use codesandbox deploys if a commit is given', () => { const source = ` -import * as Core from '@material-ui/core'; -import * as Unstyled from '@material-ui/unstyled'; -import * as Icons from '@material-ui/icons'; -import * as Lab from '@material-ui/lab'; -import * as Styles from '@material-ui/styles'; -import * as System from '@material-ui/system'; -import * as Utils from '@material-ui/utils'; +import * as Core from '@mui/material'; +import * as Unstyled from '@mui/core'; +import * as Icons from '@mui/icons-material'; +import * as Lab from '@mui/lab'; +import * as Styles from '@mui/styles'; +import * as System from '@mui/system'; +import * as Utils from '@mui/utils'; `; expect( @@ -165,30 +165,24 @@ import * as Utils from '@material-ui/utils'; 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/core', - '@material-ui/icons': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/icons', - '@material-ui/lab': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/lab', - '@material-ui/styles': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/styles', - '@material-ui/system': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/system', - '@material-ui/utils': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/utils', - '@material-ui/unstyled': - 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@material-ui/unstyled', + '@mui/material': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/material', + '@mui/icons-material': + 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/icons-material', + '@mui/lab': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/lab', + '@mui/styles': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/styles', + '@mui/system': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/system', + '@mui/utils': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/utils', + '@mui/core': 'https://pkg.csb.dev/mui-org/material-ui/commit/2d0e8b4d/@mui/core', }); }); it('should date adapters', () => { const source = ` import * as React from 'react'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import AdapterDayjs from '@material-ui/lab/AdapterDayjs'; -import AdapterLuxon from '@material-ui/lab/AdapterLuxon'; -import AdapterMoment from '@material-ui/lab/AdapterMoment'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import AdapterDayjs from '@mui/lab/AdapterDayjs'; +import AdapterLuxon from '@mui/lab/AdapterLuxon'; +import AdapterMoment from '@mui/lab/AdapterMoment'; `; expect(getDependencies(source)).to.deep.equal({ @@ -196,8 +190,8 @@ import AdapterMoment from '@material-ui/lab/AdapterMoment'; 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': 'next', - '@material-ui/lab': 'next', + '@mui/material': 'next', + '@mui/lab': 'next', 'date-fns': 'latest', dayjs: 'latest', luxon: 'latest', diff --git a/docs/src/modules/utils/helpers.ts b/docs/src/modules/utils/helpers.ts index 83af9f4ccac60a..2a9bcec3c89ebf 100644 --- a/docs/src/modules/utils/helpers.ts +++ b/docs/src/modules/utils/helpers.ts @@ -4,7 +4,7 @@ import { CODE_VARIANTS, LANGUAGES } from '../constants'; /** * Mapping from the date adapter sub-packages to the npm packages they require. - * @example `@material-ui/lab/AdapterDateFns` has a peer dependency on `date-fns`. + * @example `@mui/lab/AdapterDateFns` has a peer dependency on `date-fns`. */ const dateAdapterPackageMapping: Record = { AdapterDateFns: 'date-fns', @@ -78,7 +78,7 @@ function addTypeDeps(deps: Record): void { const packagesWithDTPackage = Object.keys(deps) .filter((name) => packagesWithBundledTypes.indexOf(name) === -1) // All the Material-UI packages come with bundled types - .filter((name) => name.indexOf('@material-ui/') !== 0); + .filter((name) => name.indexOf('@mui/') !== 0); packagesWithDTPackage.forEach((name) => { let resolvedName = name; @@ -104,13 +104,13 @@ function includePeerDependencies( '@emotion/styled': versions['@emotion/styled'], }; - if (newDeps['@material-ui/lab']) { - newDeps['@material-ui/core'] = versions['@material-ui/core']; + if (newDeps['@mui/lab']) { + newDeps['@mui/material'] = versions['@mui/material']; } if (newDeps['@material-ui/data-grid']) { - newDeps['@material-ui/core'] = versions['@material-ui/core']; - newDeps['@material-ui/styles'] = versions['@material-ui/styles']; + newDeps['@mui/material'] = versions['@mui/material']; + newDeps['@mui/styles'] = versions['@mui/styles']; } // TODO: Where is this coming from and why does it need to be injected this way. @@ -135,7 +135,7 @@ function getMuiPackageVersion(packageName: string, commitRef?: string): string { return 'next'; } const shortSha = commitRef.slice(0, 8); - return `https://pkg.csb.dev/mui-org/material-ui/commit/${shortSha}/@material-ui/${packageName}`; + return `https://pkg.csb.dev/mui-org/material-ui/commit/${shortSha}/@mui/${packageName}`; } /** @@ -148,7 +148,7 @@ export function getDependencies( options: { codeLanguage?: 'JS' | 'TS'; /** - * If specified use `@material-ui/*` packages from a specific commit. + * If specified use `@mui/*` packages from a specific commit. */ muiCommitRef?: string; } = {}, @@ -161,15 +161,15 @@ export function getDependencies( 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@material-ui/core': getMuiPackageVersion('core', muiCommitRef), - '@material-ui/icons': getMuiPackageVersion('icons', muiCommitRef), - '@material-ui/lab': getMuiPackageVersion('lab', muiCommitRef), - '@material-ui/styled-engine': getMuiPackageVersion('styled-engine', muiCommitRef), - '@material-ui/styles': getMuiPackageVersion('styles', muiCommitRef), - '@material-ui/system': getMuiPackageVersion('system', muiCommitRef), - '@material-ui/private-theming': getMuiPackageVersion('theming', muiCommitRef), - '@material-ui/unstyled': getMuiPackageVersion('unstyled', muiCommitRef), - '@material-ui/utils': getMuiPackageVersion('utils', muiCommitRef), + '@mui/material': getMuiPackageVersion('material', muiCommitRef), + '@mui/icons-material': getMuiPackageVersion('icons-material', muiCommitRef), + '@mui/lab': getMuiPackageVersion('lab', muiCommitRef), + '@mui/styled-engine': getMuiPackageVersion('styled-engine', muiCommitRef), + '@mui/styles': getMuiPackageVersion('styles', muiCommitRef), + '@mui/system': getMuiPackageVersion('system', muiCommitRef), + '@mui/private-theming': getMuiPackageVersion('theming', muiCommitRef), + '@mui/core': getMuiPackageVersion('core', muiCommitRef), + '@mui/utils': getMuiPackageVersion('utils', muiCommitRef), }; // TODO: Where is this coming from and why does it need to be injected this way. @@ -196,7 +196,7 @@ export function getDependencies( } // e.g date-fns - const dateAdapterMatch = m[2].match(/^@material-ui\/lab\/(Adapter.*)/); + const dateAdapterMatch = m[2].match(/^@mui\/lab\/(Adapter.*)/); if (dateAdapterMatch !== null) { const packageName = dateAdapterPackageMapping[dateAdapterMatch[1]]; if (packageName === undefined) { @@ -215,9 +215,9 @@ export function getDependencies( deps.typescript = 'latest'; } - if (!deps['@material-ui/core']) { - // The `index.js` imports StyledEngineProvider from '@material-ui/core', so we need to make sure we have it as a dependency - const name = '@material-ui/core'; + if (!deps['@mui/material']) { + // The `index.js` imports StyledEngineProvider from '@mui/material', so we need to make sure we have it as a dependency + const name = '@mui/material'; deps[name] = versions[name] ? versions[name] : 'latest'; } diff --git a/docs/src/modules/utils/mapApiPageTranslations.js b/docs/src/modules/utils/mapApiPageTranslations.js index 50c65bdb79e922..65d354dffd2354 100644 --- a/docs/src/modules/utils/mapApiPageTranslations.js +++ b/docs/src/modules/utils/mapApiPageTranslations.js @@ -1,4 +1,4 @@ -import { createRender } from '@material-ui/markdown'; +import { createRender } from '@mui/markdown'; const notEnglishJsonRegExp = /-([a-z]{2})\.json$/; diff --git a/docs/src/pages/components/about-the-lab/about-the-lab.md b/docs/src/pages/components/about-the-lab/about-the-lab.md index eb30f6314a960d..ac8ec017bd047d 100644 --- a/docs/src/pages/components/about-the-lab/about-the-lab.md +++ b/docs/src/pages/components/about-the-lab/about-the-lab.md @@ -21,10 +21,10 @@ Install the package in your project directory with: ```sh // with npm -npm install @material-ui/lab@next +npm install @mui/lab@next // with yarn -yarn add @material-ui/lab@next +yarn add @mui/lab@next ``` The lab has a peer dependency on the core components. @@ -32,10 +32,10 @@ If you are not already using Material-UI in your project, you can install it wit ```sh // with npm -npm install @material-ui/core@next +npm install @mui/material@next // with yarn -yarn add @material-ui/core@next +yarn add @mui/material@next ``` ## TypeScript @@ -44,9 +44,9 @@ In order to benefit from the [CSS overrides](/customization/theme-components/#gl ```tsx // When using TypeScript 4.x and above -import type {} from '@material-ui/lab/themeAugmentation'; +import type {} from '@mui/lab/themeAugmentation'; // When using TypeScript 3.x and below -import '@material-ui/lab/themeAugmentation'; +import '@mui/lab/themeAugmentation'; const theme = createTheme({ components: { diff --git a/docs/src/pages/components/accordion/BasicAccordion.js b/docs/src/pages/components/accordion/BasicAccordion.js index 3abe8d2e24f5c0..a96d9996e9d1c2 100644 --- a/docs/src/pages/components/accordion/BasicAccordion.js +++ b/docs/src/pages/components/accordion/BasicAccordion.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Accordion from '@material-ui/core/Accordion'; -import AccordionSummary from '@material-ui/core/AccordionSummary'; -import AccordionDetails from '@material-ui/core/AccordionDetails'; -import Typography from '@material-ui/core/Typography'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import Accordion from '@mui/material/Accordion'; +import AccordionSummary from '@mui/material/AccordionSummary'; +import AccordionDetails from '@mui/material/AccordionDetails'; +import Typography from '@mui/material/Typography'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; export default function SimpleAccordion() { return ( diff --git a/docs/src/pages/components/accordion/BasicAccordion.tsx b/docs/src/pages/components/accordion/BasicAccordion.tsx index 3abe8d2e24f5c0..a96d9996e9d1c2 100644 --- a/docs/src/pages/components/accordion/BasicAccordion.tsx +++ b/docs/src/pages/components/accordion/BasicAccordion.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Accordion from '@material-ui/core/Accordion'; -import AccordionSummary from '@material-ui/core/AccordionSummary'; -import AccordionDetails from '@material-ui/core/AccordionDetails'; -import Typography from '@material-ui/core/Typography'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import Accordion from '@mui/material/Accordion'; +import AccordionSummary from '@mui/material/AccordionSummary'; +import AccordionDetails from '@mui/material/AccordionDetails'; +import Typography from '@mui/material/Typography'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; export default function SimpleAccordion() { return ( diff --git a/docs/src/pages/components/accordion/ControlledAccordions.js b/docs/src/pages/components/accordion/ControlledAccordions.js index 550d265c83b338..8aa4b05ca525dc 100644 --- a/docs/src/pages/components/accordion/ControlledAccordions.js +++ b/docs/src/pages/components/accordion/ControlledAccordions.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Accordion from '@material-ui/core/Accordion'; -import AccordionDetails from '@material-ui/core/AccordionDetails'; -import AccordionSummary from '@material-ui/core/AccordionSummary'; -import Typography from '@material-ui/core/Typography'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import Accordion from '@mui/material/Accordion'; +import AccordionDetails from '@mui/material/AccordionDetails'; +import AccordionSummary from '@mui/material/AccordionSummary'; +import Typography from '@mui/material/Typography'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; export default function ControlledAccordions() { const [expanded, setExpanded] = React.useState(false); diff --git a/docs/src/pages/components/accordion/ControlledAccordions.tsx b/docs/src/pages/components/accordion/ControlledAccordions.tsx index 3d065ba09cd7aa..73ea841a29c217 100644 --- a/docs/src/pages/components/accordion/ControlledAccordions.tsx +++ b/docs/src/pages/components/accordion/ControlledAccordions.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Accordion from '@material-ui/core/Accordion'; -import AccordionDetails from '@material-ui/core/AccordionDetails'; -import AccordionSummary from '@material-ui/core/AccordionSummary'; -import Typography from '@material-ui/core/Typography'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import Accordion from '@mui/material/Accordion'; +import AccordionDetails from '@mui/material/AccordionDetails'; +import AccordionSummary from '@mui/material/AccordionSummary'; +import Typography from '@mui/material/Typography'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; export default function ControlledAccordions() { const [expanded, setExpanded] = React.useState(false); diff --git a/docs/src/pages/components/accordion/CustomizedAccordions.js b/docs/src/pages/components/accordion/CustomizedAccordions.js index 2b82f45f2dcde3..77f0bbac33880b 100644 --- a/docs/src/pages/components/accordion/CustomizedAccordions.js +++ b/docs/src/pages/components/accordion/CustomizedAccordions.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import ArrowForwardIosSharpIcon from '@material-ui/icons/ArrowForwardIosSharp'; -import MuiAccordion from '@material-ui/core/Accordion'; -import MuiAccordionSummary from '@material-ui/core/AccordionSummary'; -import MuiAccordionDetails from '@material-ui/core/AccordionDetails'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import ArrowForwardIosSharpIcon from '@mui/icons-material/ArrowForwardIosSharp'; +import MuiAccordion from '@mui/material/Accordion'; +import MuiAccordionSummary from '@mui/material/AccordionSummary'; +import MuiAccordionDetails from '@mui/material/AccordionDetails'; +import Typography from '@mui/material/Typography'; const Accordion = styled((props) => ( diff --git a/docs/src/pages/components/accordion/CustomizedAccordions.tsx b/docs/src/pages/components/accordion/CustomizedAccordions.tsx index e484d5e388a233..ea581ad2097474 100644 --- a/docs/src/pages/components/accordion/CustomizedAccordions.tsx +++ b/docs/src/pages/components/accordion/CustomizedAccordions.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import ArrowForwardIosSharpIcon from '@material-ui/icons/ArrowForwardIosSharp'; -import MuiAccordion, { AccordionProps } from '@material-ui/core/Accordion'; +import { styled } from '@mui/material/styles'; +import ArrowForwardIosSharpIcon from '@mui/icons-material/ArrowForwardIosSharp'; +import MuiAccordion, { AccordionProps } from '@mui/material/Accordion'; import MuiAccordionSummary, { AccordionSummaryProps, -} from '@material-ui/core/AccordionSummary'; -import MuiAccordionDetails from '@material-ui/core/AccordionDetails'; -import Typography from '@material-ui/core/Typography'; +} from '@mui/material/AccordionSummary'; +import MuiAccordionDetails from '@mui/material/AccordionDetails'; +import Typography from '@mui/material/Typography'; const Accordion = styled((props: AccordionProps) => ( diff --git a/docs/src/pages/components/alert/ActionAlerts.js b/docs/src/pages/components/alert/ActionAlerts.js index 86ad27e02b8a03..4e47e984bdcc1e 100644 --- a/docs/src/pages/components/alert/ActionAlerts.js +++ b/docs/src/pages/components/alert/ActionAlerts.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function ActionAlerts() { return ( diff --git a/docs/src/pages/components/alert/ActionAlerts.tsx b/docs/src/pages/components/alert/ActionAlerts.tsx index 86ad27e02b8a03..4e47e984bdcc1e 100644 --- a/docs/src/pages/components/alert/ActionAlerts.tsx +++ b/docs/src/pages/components/alert/ActionAlerts.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function ActionAlerts() { return ( diff --git a/docs/src/pages/components/alert/BasicAlerts.js b/docs/src/pages/components/alert/BasicAlerts.js index 3dcfb60b0859ec..72168dc8fb3414 100644 --- a/docs/src/pages/components/alert/BasicAlerts.js +++ b/docs/src/pages/components/alert/BasicAlerts.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/BasicAlerts.tsx b/docs/src/pages/components/alert/BasicAlerts.tsx index 3dcfb60b0859ec..72168dc8fb3414 100644 --- a/docs/src/pages/components/alert/BasicAlerts.tsx +++ b/docs/src/pages/components/alert/BasicAlerts.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/ColorAlerts.js b/docs/src/pages/components/alert/ColorAlerts.js index 0e263792caaaa4..bc746f8fb29172 100644 --- a/docs/src/pages/components/alert/ColorAlerts.js +++ b/docs/src/pages/components/alert/ColorAlerts.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; +import Alert from '@mui/material/Alert'; export default function ColorAlerts() { return ( diff --git a/docs/src/pages/components/alert/ColorAlerts.tsx b/docs/src/pages/components/alert/ColorAlerts.tsx index 0e263792caaaa4..bc746f8fb29172 100644 --- a/docs/src/pages/components/alert/ColorAlerts.tsx +++ b/docs/src/pages/components/alert/ColorAlerts.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; +import Alert from '@mui/material/Alert'; export default function ColorAlerts() { return ( diff --git a/docs/src/pages/components/alert/DescriptionAlerts.js b/docs/src/pages/components/alert/DescriptionAlerts.js index d7f1d147218d09..a156e115f1aeb7 100644 --- a/docs/src/pages/components/alert/DescriptionAlerts.js +++ b/docs/src/pages/components/alert/DescriptionAlerts.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import AlertTitle from '@material-ui/core/AlertTitle'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import AlertTitle from '@mui/material/AlertTitle'; +import Stack from '@mui/material/Stack'; export default function DescriptionAlerts() { return ( diff --git a/docs/src/pages/components/alert/DescriptionAlerts.tsx b/docs/src/pages/components/alert/DescriptionAlerts.tsx index d7f1d147218d09..a156e115f1aeb7 100644 --- a/docs/src/pages/components/alert/DescriptionAlerts.tsx +++ b/docs/src/pages/components/alert/DescriptionAlerts.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import AlertTitle from '@material-ui/core/AlertTitle'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import AlertTitle from '@mui/material/AlertTitle'; +import Stack from '@mui/material/Stack'; export default function DescriptionAlerts() { return ( diff --git a/docs/src/pages/components/alert/FilledAlerts.js b/docs/src/pages/components/alert/FilledAlerts.js index 9a1106da36160a..86c0cd7d563557 100644 --- a/docs/src/pages/components/alert/FilledAlerts.js +++ b/docs/src/pages/components/alert/FilledAlerts.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/FilledAlerts.tsx b/docs/src/pages/components/alert/FilledAlerts.tsx index 9a1106da36160a..86c0cd7d563557 100644 --- a/docs/src/pages/components/alert/FilledAlerts.tsx +++ b/docs/src/pages/components/alert/FilledAlerts.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/IconAlerts.js b/docs/src/pages/components/alert/IconAlerts.js index 47d0298b2a58fc..51bd64a818bf08 100644 --- a/docs/src/pages/components/alert/IconAlerts.js +++ b/docs/src/pages/components/alert/IconAlerts.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import CheckIcon from '@material-ui/icons/Check'; -import CheckCircleOutlineIcon from '@material-ui/icons/CheckCircleOutline'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import CheckIcon from '@mui/icons-material/Check'; +import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'; +import Stack from '@mui/material/Stack'; export default function IconAlerts() { return ( diff --git a/docs/src/pages/components/alert/IconAlerts.tsx b/docs/src/pages/components/alert/IconAlerts.tsx index 47d0298b2a58fc..51bd64a818bf08 100644 --- a/docs/src/pages/components/alert/IconAlerts.tsx +++ b/docs/src/pages/components/alert/IconAlerts.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import CheckIcon from '@material-ui/icons/Check'; -import CheckCircleOutlineIcon from '@material-ui/icons/CheckCircleOutline'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import CheckIcon from '@mui/icons-material/Check'; +import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'; +import Stack from '@mui/material/Stack'; export default function IconAlerts() { return ( diff --git a/docs/src/pages/components/alert/OutlinedAlerts.js b/docs/src/pages/components/alert/OutlinedAlerts.js index 7425ece87a2097..6d13d082bea6cc 100644 --- a/docs/src/pages/components/alert/OutlinedAlerts.js +++ b/docs/src/pages/components/alert/OutlinedAlerts.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/OutlinedAlerts.tsx b/docs/src/pages/components/alert/OutlinedAlerts.tsx index 7425ece87a2097..6d13d082bea6cc 100644 --- a/docs/src/pages/components/alert/OutlinedAlerts.tsx +++ b/docs/src/pages/components/alert/OutlinedAlerts.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Alert from '@material-ui/core/Alert'; -import Stack from '@material-ui/core/Stack'; +import Alert from '@mui/material/Alert'; +import Stack from '@mui/material/Stack'; export default function BasicAlerts() { return ( diff --git a/docs/src/pages/components/alert/TransitionAlerts.js b/docs/src/pages/components/alert/TransitionAlerts.js index c12dcc836bd632..2045e72b025ead 100644 --- a/docs/src/pages/components/alert/TransitionAlerts.js +++ b/docs/src/pages/components/alert/TransitionAlerts.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Alert from '@material-ui/core/Alert'; -import IconButton from '@material-ui/core/IconButton'; -import Collapse from '@material-ui/core/Collapse'; -import Button from '@material-ui/core/Button'; -import CloseIcon from '@material-ui/icons/Close'; +import Box from '@mui/material/Box'; +import Alert from '@mui/material/Alert'; +import IconButton from '@mui/material/IconButton'; +import Collapse from '@mui/material/Collapse'; +import Button from '@mui/material/Button'; +import CloseIcon from '@mui/icons-material/Close'; export default function TransitionAlerts() { const [open, setOpen] = React.useState(true); diff --git a/docs/src/pages/components/alert/TransitionAlerts.tsx b/docs/src/pages/components/alert/TransitionAlerts.tsx index c12dcc836bd632..2045e72b025ead 100644 --- a/docs/src/pages/components/alert/TransitionAlerts.tsx +++ b/docs/src/pages/components/alert/TransitionAlerts.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Alert from '@material-ui/core/Alert'; -import IconButton from '@material-ui/core/IconButton'; -import Collapse from '@material-ui/core/Collapse'; -import Button from '@material-ui/core/Button'; -import CloseIcon from '@material-ui/icons/Close'; +import Box from '@mui/material/Box'; +import Alert from '@mui/material/Alert'; +import IconButton from '@mui/material/IconButton'; +import Collapse from '@mui/material/Collapse'; +import Button from '@mui/material/Button'; +import CloseIcon from '@mui/icons-material/Close'; export default function TransitionAlerts() { const [open, setOpen] = React.useState(true); diff --git a/docs/src/pages/components/app-bar/BackToTop.js b/docs/src/pages/components/app-bar/BackToTop.js index 36ecc51b3b2a3f..fd6cac4848eeec 100644 --- a/docs/src/pages/components/app-bar/BackToTop.js +++ b/docs/src/pages/components/app-bar/BackToTop.js @@ -1,15 +1,15 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Fab from '@material-ui/core/Fab'; -import KeyboardArrowUpIcon from '@material-ui/icons/KeyboardArrowUp'; -import Zoom from '@material-ui/core/Zoom'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Fab from '@mui/material/Fab'; +import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp'; +import Zoom from '@mui/material/Zoom'; function ScrollTop(props) { const { children, window } = props; diff --git a/docs/src/pages/components/app-bar/BackToTop.tsx b/docs/src/pages/components/app-bar/BackToTop.tsx index 409f89fb9ef8e0..4e6d10167cdafc 100644 --- a/docs/src/pages/components/app-bar/BackToTop.tsx +++ b/docs/src/pages/components/app-bar/BackToTop.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Fab from '@material-ui/core/Fab'; -import KeyboardArrowUpIcon from '@material-ui/icons/KeyboardArrowUp'; -import Zoom from '@material-ui/core/Zoom'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Fab from '@mui/material/Fab'; +import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp'; +import Zoom from '@mui/material/Zoom'; interface Props { /** diff --git a/docs/src/pages/components/app-bar/BottomAppBar.js b/docs/src/pages/components/app-bar/BottomAppBar.js index b533a0bf805b59..29fb31e3f98c3f 100644 --- a/docs/src/pages/components/app-bar/BottomAppBar.js +++ b/docs/src/pages/components/app-bar/BottomAppBar.js @@ -1,23 +1,23 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import Paper from '@material-ui/core/Paper'; -import Fab from '@material-ui/core/Fab'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Avatar from '@material-ui/core/Avatar'; -import MenuIcon from '@material-ui/icons/Menu'; -import AddIcon from '@material-ui/icons/Add'; -import SearchIcon from '@material-ui/icons/Search'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import Paper from '@mui/material/Paper'; +import Fab from '@mui/material/Fab'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; +import Avatar from '@mui/material/Avatar'; +import MenuIcon from '@mui/icons-material/Menu'; +import AddIcon from '@mui/icons-material/Add'; +import SearchIcon from '@mui/icons-material/Search'; +import MoreIcon from '@mui/icons-material/MoreVert'; const messages = [ { diff --git a/docs/src/pages/components/app-bar/BottomAppBar.tsx b/docs/src/pages/components/app-bar/BottomAppBar.tsx index 820403c6f5c90d..3af7d22615236a 100644 --- a/docs/src/pages/components/app-bar/BottomAppBar.tsx +++ b/docs/src/pages/components/app-bar/BottomAppBar.tsx @@ -1,23 +1,23 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import Paper from '@material-ui/core/Paper'; -import Fab from '@material-ui/core/Fab'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Avatar from '@material-ui/core/Avatar'; -import MenuIcon from '@material-ui/icons/Menu'; -import AddIcon from '@material-ui/icons/Add'; -import SearchIcon from '@material-ui/icons/Search'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import Paper from '@mui/material/Paper'; +import Fab from '@mui/material/Fab'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; +import Avatar from '@mui/material/Avatar'; +import MenuIcon from '@mui/icons-material/Menu'; +import AddIcon from '@mui/icons-material/Add'; +import SearchIcon from '@mui/icons-material/Search'; +import MoreIcon from '@mui/icons-material/MoreVert'; const messages = [ { diff --git a/docs/src/pages/components/app-bar/ButtonAppBar.js b/docs/src/pages/components/app-bar/ButtonAppBar.js index b0dc198730927a..180c238ecd7cb2 100644 --- a/docs/src/pages/components/app-bar/ButtonAppBar.js +++ b/docs/src/pages/components/app-bar/ButtonAppBar.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; export default function ButtonAppBar() { return ( diff --git a/docs/src/pages/components/app-bar/ButtonAppBar.tsx b/docs/src/pages/components/app-bar/ButtonAppBar.tsx index b0dc198730927a..180c238ecd7cb2 100644 --- a/docs/src/pages/components/app-bar/ButtonAppBar.tsx +++ b/docs/src/pages/components/app-bar/ButtonAppBar.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; export default function ButtonAppBar() { return ( diff --git a/docs/src/pages/components/app-bar/DenseAppBar.js b/docs/src/pages/components/app-bar/DenseAppBar.js index 15e661f959fa98..31bd1cb73a3236 100644 --- a/docs/src/pages/components/app-bar/DenseAppBar.js +++ b/docs/src/pages/components/app-bar/DenseAppBar.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; export default function DenseAppBar() { return ( diff --git a/docs/src/pages/components/app-bar/DenseAppBar.tsx b/docs/src/pages/components/app-bar/DenseAppBar.tsx index 15e661f959fa98..31bd1cb73a3236 100644 --- a/docs/src/pages/components/app-bar/DenseAppBar.tsx +++ b/docs/src/pages/components/app-bar/DenseAppBar.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; export default function DenseAppBar() { return ( diff --git a/docs/src/pages/components/app-bar/ElevateAppBar.js b/docs/src/pages/components/app-bar/ElevateAppBar.js index 125685d947a5fd..d8c93da61beae6 100644 --- a/docs/src/pages/components/app-bar/ElevateAppBar.js +++ b/docs/src/pages/components/app-bar/ElevateAppBar.js @@ -1,12 +1,12 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; function ElevationScroll(props) { const { children, window } = props; diff --git a/docs/src/pages/components/app-bar/ElevateAppBar.tsx b/docs/src/pages/components/app-bar/ElevateAppBar.tsx index 9ac09830fa3df4..8d55d06f608ed7 100644 --- a/docs/src/pages/components/app-bar/ElevateAppBar.tsx +++ b/docs/src/pages/components/app-bar/ElevateAppBar.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; interface Props { /** diff --git a/docs/src/pages/components/app-bar/HideAppBar.js b/docs/src/pages/components/app-bar/HideAppBar.js index c10ca0c07bd24e..94ea622af69c17 100644 --- a/docs/src/pages/components/app-bar/HideAppBar.js +++ b/docs/src/pages/components/app-bar/HideAppBar.js @@ -1,13 +1,13 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Slide from '@material-ui/core/Slide'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Slide from '@mui/material/Slide'; function HideOnScroll(props) { const { children, window } = props; diff --git a/docs/src/pages/components/app-bar/HideAppBar.tsx b/docs/src/pages/components/app-bar/HideAppBar.tsx index b64b3b1f0ae1ad..f946fe5781b16c 100644 --- a/docs/src/pages/components/app-bar/HideAppBar.tsx +++ b/docs/src/pages/components/app-bar/HideAppBar.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; -import Slide from '@material-ui/core/Slide'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import CssBaseline from '@mui/material/CssBaseline'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import Slide from '@mui/material/Slide'; interface Props { /** diff --git a/docs/src/pages/components/app-bar/MenuAppBar.js b/docs/src/pages/components/app-bar/MenuAppBar.js index 5b6dd97e24fa7c..37dab55766a0ff 100644 --- a/docs/src/pages/components/app-bar/MenuAppBar.js +++ b/docs/src/pages/components/app-bar/MenuAppBar.js @@ -1,16 +1,16 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import AccountCircle from '@material-ui/icons/AccountCircle'; -import Switch from '@material-ui/core/Switch'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormGroup from '@material-ui/core/FormGroup'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import AccountCircle from '@mui/icons-material/AccountCircle'; +import Switch from '@mui/material/Switch'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormGroup from '@mui/material/FormGroup'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; export default function MenuAppBar() { const [auth, setAuth] = React.useState(true); diff --git a/docs/src/pages/components/app-bar/MenuAppBar.tsx b/docs/src/pages/components/app-bar/MenuAppBar.tsx index 576ec32448fc39..9ce40c662d439a 100644 --- a/docs/src/pages/components/app-bar/MenuAppBar.tsx +++ b/docs/src/pages/components/app-bar/MenuAppBar.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import AccountCircle from '@material-ui/icons/AccountCircle'; -import Switch from '@material-ui/core/Switch'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormGroup from '@material-ui/core/FormGroup'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import AccountCircle from '@mui/icons-material/AccountCircle'; +import Switch from '@mui/material/Switch'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormGroup from '@mui/material/FormGroup'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; export default function MenuAppBar() { const [auth, setAuth] = React.useState(true); diff --git a/docs/src/pages/components/app-bar/PrimarySearchAppBar.js b/docs/src/pages/components/app-bar/PrimarySearchAppBar.js index 924d54eaf338d3..84bb04b253910e 100644 --- a/docs/src/pages/components/app-bar/PrimarySearchAppBar.js +++ b/docs/src/pages/components/app-bar/PrimarySearchAppBar.js @@ -1,20 +1,20 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import InputBase from '@material-ui/core/InputBase'; -import Badge from '@material-ui/core/Badge'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; -import AccountCircle from '@material-ui/icons/AccountCircle'; -import MailIcon from '@material-ui/icons/Mail'; -import NotificationsIcon from '@material-ui/icons/Notifications'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled, alpha } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import InputBase from '@mui/material/InputBase'; +import Badge from '@mui/material/Badge'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; +import AccountCircle from '@mui/icons-material/AccountCircle'; +import MailIcon from '@mui/icons-material/Mail'; +import NotificationsIcon from '@mui/icons-material/Notifications'; +import MoreIcon from '@mui/icons-material/MoreVert'; const Search = styled('div')(({ theme }) => ({ position: 'relative', diff --git a/docs/src/pages/components/app-bar/PrimarySearchAppBar.tsx b/docs/src/pages/components/app-bar/PrimarySearchAppBar.tsx index 9d43a3b8511840..67d44e70559297 100644 --- a/docs/src/pages/components/app-bar/PrimarySearchAppBar.tsx +++ b/docs/src/pages/components/app-bar/PrimarySearchAppBar.tsx @@ -1,20 +1,20 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import InputBase from '@material-ui/core/InputBase'; -import Badge from '@material-ui/core/Badge'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; -import AccountCircle from '@material-ui/icons/AccountCircle'; -import MailIcon from '@material-ui/icons/Mail'; -import NotificationsIcon from '@material-ui/icons/Notifications'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled, alpha } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import InputBase from '@mui/material/InputBase'; +import Badge from '@mui/material/Badge'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; +import AccountCircle from '@mui/icons-material/AccountCircle'; +import MailIcon from '@mui/icons-material/Mail'; +import NotificationsIcon from '@mui/icons-material/Notifications'; +import MoreIcon from '@mui/icons-material/MoreVert'; const Search = styled('div')(({ theme }) => ({ position: 'relative', diff --git a/docs/src/pages/components/app-bar/ProminentAppBar.js b/docs/src/pages/components/app-bar/ProminentAppBar.js index 1d5b6d093df658..e7576226834260 100644 --- a/docs/src/pages/components/app-bar/ProminentAppBar.js +++ b/docs/src/pages/components/app-bar/ProminentAppBar.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; +import MoreIcon from '@mui/icons-material/MoreVert'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ alignItems: 'flex-start', diff --git a/docs/src/pages/components/app-bar/ProminentAppBar.tsx b/docs/src/pages/components/app-bar/ProminentAppBar.tsx index 1d5b6d093df658..e7576226834260 100644 --- a/docs/src/pages/components/app-bar/ProminentAppBar.tsx +++ b/docs/src/pages/components/app-bar/ProminentAppBar.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; -import MoreIcon from '@material-ui/icons/MoreVert'; +import { styled } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; +import MoreIcon from '@mui/icons-material/MoreVert'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ alignItems: 'flex-start', diff --git a/docs/src/pages/components/app-bar/SearchAppBar.js b/docs/src/pages/components/app-bar/SearchAppBar.js index a1c85db41c99f9..ea573597c8a263 100644 --- a/docs/src/pages/components/app-bar/SearchAppBar.js +++ b/docs/src/pages/components/app-bar/SearchAppBar.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import InputBase from '@material-ui/core/InputBase'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; +import { styled, alpha } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import InputBase from '@mui/material/InputBase'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; const Search = styled('div')(({ theme }) => ({ position: 'relative', diff --git a/docs/src/pages/components/app-bar/SearchAppBar.tsx b/docs/src/pages/components/app-bar/SearchAppBar.tsx index a1c85db41c99f9..ea573597c8a263 100644 --- a/docs/src/pages/components/app-bar/SearchAppBar.tsx +++ b/docs/src/pages/components/app-bar/SearchAppBar.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import InputBase from '@material-ui/core/InputBase'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; +import { styled, alpha } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import InputBase from '@mui/material/InputBase'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; const Search = styled('div')(({ theme }) => ({ position: 'relative', diff --git a/docs/src/pages/components/app-bar/app-bar.md b/docs/src/pages/components/app-bar/app-bar.md index 3946b44c0f8f8a..14d76de60e1b44 100644 --- a/docs/src/pages/components/app-bar/app-bar.md +++ b/docs/src/pages/components/app-bar/app-bar.md @@ -125,7 +125,7 @@ A floating action buttons appears on scroll to make it easy to get back to the t #### Examples ```jsx -import useScrollTrigger from '@material-ui/core/useScrollTrigger'; +import useScrollTrigger from '@mui/material/useScrollTrigger'; function HideOnScroll(props) { const trigger = useScrollTrigger(); diff --git a/docs/src/pages/components/autocomplete/Asynchronous.js b/docs/src/pages/components/autocomplete/Asynchronous.js index 80facf93357b32..beb9c03846ee17 100644 --- a/docs/src/pages/components/autocomplete/Asynchronous.js +++ b/docs/src/pages/components/autocomplete/Asynchronous.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import CircularProgress from '@mui/material/CircularProgress'; function sleep(delay = 0) { return new Promise((resolve) => { diff --git a/docs/src/pages/components/autocomplete/Asynchronous.tsx b/docs/src/pages/components/autocomplete/Asynchronous.tsx index 86e08a4d8dfb6b..7fbbd7e62684cd 100644 --- a/docs/src/pages/components/autocomplete/Asynchronous.tsx +++ b/docs/src/pages/components/autocomplete/Asynchronous.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import CircularProgress from '@mui/material/CircularProgress'; interface Film { title: string; diff --git a/docs/src/pages/components/autocomplete/CheckboxesTags.js b/docs/src/pages/components/autocomplete/CheckboxesTags.js index ea894d04682afb..a07f37a4c05cd2 100644 --- a/docs/src/pages/components/autocomplete/CheckboxesTags.js +++ b/docs/src/pages/components/autocomplete/CheckboxesTags.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank'; -import CheckBoxIcon from '@material-ui/icons/CheckBox'; +import Checkbox from '@mui/material/Checkbox'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank'; +import CheckBoxIcon from '@mui/icons-material/CheckBox'; const icon = ; const checkedIcon = ; diff --git a/docs/src/pages/components/autocomplete/CheckboxesTags.tsx b/docs/src/pages/components/autocomplete/CheckboxesTags.tsx index ea894d04682afb..a07f37a4c05cd2 100644 --- a/docs/src/pages/components/autocomplete/CheckboxesTags.tsx +++ b/docs/src/pages/components/autocomplete/CheckboxesTags.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank'; -import CheckBoxIcon from '@material-ui/icons/CheckBox'; +import Checkbox from '@mui/material/Checkbox'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank'; +import CheckBoxIcon from '@mui/icons-material/CheckBox'; const icon = ; const checkedIcon = ; diff --git a/docs/src/pages/components/autocomplete/ComboBox.js b/docs/src/pages/components/autocomplete/ComboBox.js index c6954ffa03f479..4e515937746cb4 100644 --- a/docs/src/pages/components/autocomplete/ComboBox.js +++ b/docs/src/pages/components/autocomplete/ComboBox.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function ComboBox() { return ( diff --git a/docs/src/pages/components/autocomplete/ComboBox.tsx b/docs/src/pages/components/autocomplete/ComboBox.tsx index c6954ffa03f479..4e515937746cb4 100644 --- a/docs/src/pages/components/autocomplete/ComboBox.tsx +++ b/docs/src/pages/components/autocomplete/ComboBox.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function ComboBox() { return ( diff --git a/docs/src/pages/components/autocomplete/ControllableStates.js b/docs/src/pages/components/autocomplete/ControllableStates.js index 4cf16a1025e959..0911878aedcd76 100644 --- a/docs/src/pages/components/autocomplete/ControllableStates.js +++ b/docs/src/pages/components/autocomplete/ControllableStates.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; const options = ['Option 1', 'Option 2']; diff --git a/docs/src/pages/components/autocomplete/ControllableStates.tsx b/docs/src/pages/components/autocomplete/ControllableStates.tsx index 20c6c8188344cd..4cd5f442a496c7 100644 --- a/docs/src/pages/components/autocomplete/ControllableStates.tsx +++ b/docs/src/pages/components/autocomplete/ControllableStates.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; const options = ['Option 1', 'Option 2']; diff --git a/docs/src/pages/components/autocomplete/CountrySelect.js b/docs/src/pages/components/autocomplete/CountrySelect.js index 2c3e71461dd4de..bf79b553ee7f29 100644 --- a/docs/src/pages/components/autocomplete/CountrySelect.js +++ b/docs/src/pages/components/autocomplete/CountrySelect.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function CountrySelect() { return ( diff --git a/docs/src/pages/components/autocomplete/CountrySelect.tsx b/docs/src/pages/components/autocomplete/CountrySelect.tsx index 3983136b0f1a0c..ff82646fb3d022 100644 --- a/docs/src/pages/components/autocomplete/CountrySelect.tsx +++ b/docs/src/pages/components/autocomplete/CountrySelect.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function CountrySelect() { return ( diff --git a/docs/src/pages/components/autocomplete/CustomInputAutocomplete.js b/docs/src/pages/components/autocomplete/CustomInputAutocomplete.js index e349a0346ccac0..94a28bc70d531b 100644 --- a/docs/src/pages/components/autocomplete/CustomInputAutocomplete.js +++ b/docs/src/pages/components/autocomplete/CustomInputAutocomplete.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Autocomplete from '@mui/material/Autocomplete'; const options = ['Option 1', 'Option 2']; diff --git a/docs/src/pages/components/autocomplete/CustomInputAutocomplete.tsx b/docs/src/pages/components/autocomplete/CustomInputAutocomplete.tsx index e349a0346ccac0..94a28bc70d531b 100644 --- a/docs/src/pages/components/autocomplete/CustomInputAutocomplete.tsx +++ b/docs/src/pages/components/autocomplete/CustomInputAutocomplete.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Autocomplete from '@mui/material/Autocomplete'; const options = ['Option 1', 'Option 2']; diff --git a/docs/src/pages/components/autocomplete/CustomizedHook.js b/docs/src/pages/components/autocomplete/CustomizedHook.js index 43f2a59c754d73..322f411acf01e7 100644 --- a/docs/src/pages/components/autocomplete/CustomizedHook.js +++ b/docs/src/pages/components/autocomplete/CustomizedHook.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { useAutocomplete } from '@material-ui/unstyled/AutocompleteUnstyled'; -import CheckIcon from '@material-ui/icons/Check'; -import CloseIcon from '@material-ui/icons/Close'; -import { styled } from '@material-ui/core/styles'; +import { useAutocomplete } from '@mui/core/AutocompleteUnstyled'; +import CheckIcon from '@mui/icons-material/Check'; +import CloseIcon from '@mui/icons-material/Close'; +import { styled } from '@mui/material/styles'; const Root = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/autocomplete/CustomizedHook.tsx b/docs/src/pages/components/autocomplete/CustomizedHook.tsx index 2b5e80b6662b87..b1abc492ca531f 100644 --- a/docs/src/pages/components/autocomplete/CustomizedHook.tsx +++ b/docs/src/pages/components/autocomplete/CustomizedHook.tsx @@ -2,10 +2,10 @@ import * as React from 'react'; import { useAutocomplete, AutocompleteGetTagProps, -} from '@material-ui/unstyled/AutocompleteUnstyled'; -import CheckIcon from '@material-ui/icons/Check'; -import CloseIcon from '@material-ui/icons/Close'; -import { styled } from '@material-ui/core/styles'; +} from '@mui/core/AutocompleteUnstyled'; +import CheckIcon from '@mui/icons-material/Check'; +import CloseIcon from '@mui/icons-material/Close'; +import { styled } from '@mui/material/styles'; const Root = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/autocomplete/DisabledOptions.js b/docs/src/pages/components/autocomplete/DisabledOptions.js index 575e40a9f54f8b..10ff390a0390e5 100644 --- a/docs/src/pages/components/autocomplete/DisabledOptions.js +++ b/docs/src/pages/components/autocomplete/DisabledOptions.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function DisabledOptions() { return ( diff --git a/docs/src/pages/components/autocomplete/DisabledOptions.tsx b/docs/src/pages/components/autocomplete/DisabledOptions.tsx index 575e40a9f54f8b..10ff390a0390e5 100644 --- a/docs/src/pages/components/autocomplete/DisabledOptions.tsx +++ b/docs/src/pages/components/autocomplete/DisabledOptions.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function DisabledOptions() { return ( diff --git a/docs/src/pages/components/autocomplete/Filter.js b/docs/src/pages/components/autocomplete/Filter.js index 6cf561d16dc56a..00e3a63c5d447e 100644 --- a/docs/src/pages/components/autocomplete/Filter.js +++ b/docs/src/pages/components/autocomplete/Filter.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filterOptions = createFilterOptions({ matchFrom: 'start', diff --git a/docs/src/pages/components/autocomplete/Filter.tsx b/docs/src/pages/components/autocomplete/Filter.tsx index c1c3ca47317893..6b3f4bdd4b9280 100644 --- a/docs/src/pages/components/autocomplete/Filter.tsx +++ b/docs/src/pages/components/autocomplete/Filter.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filterOptions = createFilterOptions({ matchFrom: 'start', diff --git a/docs/src/pages/components/autocomplete/FixedTags.js b/docs/src/pages/components/autocomplete/FixedTags.js index c61aae705a8fa8..fc57e587e221b3 100644 --- a/docs/src/pages/components/autocomplete/FixedTags.js +++ b/docs/src/pages/components/autocomplete/FixedTags.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Chip from '@mui/material/Chip'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function FixedTags() { const fixedOptions = [top100Films[6]]; diff --git a/docs/src/pages/components/autocomplete/FixedTags.tsx b/docs/src/pages/components/autocomplete/FixedTags.tsx index c61aae705a8fa8..fc57e587e221b3 100644 --- a/docs/src/pages/components/autocomplete/FixedTags.tsx +++ b/docs/src/pages/components/autocomplete/FixedTags.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import Chip from '@mui/material/Chip'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function FixedTags() { const fixedOptions = [top100Films[6]]; diff --git a/docs/src/pages/components/autocomplete/FreeSolo.js b/docs/src/pages/components/autocomplete/FreeSolo.js index f24ebbe9ea7505..d2b6b33c81680a 100644 --- a/docs/src/pages/components/autocomplete/FreeSolo.js +++ b/docs/src/pages/components/autocomplete/FreeSolo.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; +import Autocomplete from '@mui/material/Autocomplete'; export default function FreeSolo() { return ( diff --git a/docs/src/pages/components/autocomplete/FreeSolo.tsx b/docs/src/pages/components/autocomplete/FreeSolo.tsx index f24ebbe9ea7505..d2b6b33c81680a 100644 --- a/docs/src/pages/components/autocomplete/FreeSolo.tsx +++ b/docs/src/pages/components/autocomplete/FreeSolo.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; +import Autocomplete from '@mui/material/Autocomplete'; export default function FreeSolo() { return ( diff --git a/docs/src/pages/components/autocomplete/FreeSoloCreateOption.js b/docs/src/pages/components/autocomplete/FreeSoloCreateOption.js index b973004873e7c6..0a25bcf321e5b3 100644 --- a/docs/src/pages/components/autocomplete/FreeSoloCreateOption.js +++ b/docs/src/pages/components/autocomplete/FreeSoloCreateOption.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filter = createFilterOptions(); diff --git a/docs/src/pages/components/autocomplete/FreeSoloCreateOption.tsx b/docs/src/pages/components/autocomplete/FreeSoloCreateOption.tsx index 8d60010d5372d7..d95cb137a1614d 100644 --- a/docs/src/pages/components/autocomplete/FreeSoloCreateOption.tsx +++ b/docs/src/pages/components/autocomplete/FreeSoloCreateOption.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filter = createFilterOptions(); diff --git a/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.js b/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.js index 515dedc583156c..d2198e232d439b 100644 --- a/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.js +++ b/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Dialog from '@material-ui/core/Dialog'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogActions from '@material-ui/core/DialogActions'; -import Button from '@material-ui/core/Button'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Dialog from '@mui/material/Dialog'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogActions from '@mui/material/DialogActions'; +import Button from '@mui/material/Button'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filter = createFilterOptions(); diff --git a/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.tsx b/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.tsx index fd33f23f113bb6..cb8682ab4302bc 100644 --- a/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.tsx +++ b/docs/src/pages/components/autocomplete/FreeSoloCreateOptionDialog.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Dialog from '@material-ui/core/Dialog'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogActions from '@material-ui/core/DialogActions'; -import Button from '@material-ui/core/Button'; -import Autocomplete, { createFilterOptions } from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Dialog from '@mui/material/Dialog'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogActions from '@mui/material/DialogActions'; +import Button from '@mui/material/Button'; +import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete'; const filter = createFilterOptions(); diff --git a/docs/src/pages/components/autocomplete/GitHubLabel.js b/docs/src/pages/components/autocomplete/GitHubLabel.js index fa7dfe99fbb4dd..c0ced483f3c638 100644 --- a/docs/src/pages/components/autocomplete/GitHubLabel.js +++ b/docs/src/pages/components/autocomplete/GitHubLabel.js @@ -1,15 +1,15 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { useTheme, styled } from '@material-ui/core/styles'; -import Popper from '@material-ui/core/Popper'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import SettingsIcon from '@material-ui/icons/Settings'; -import CloseIcon from '@material-ui/icons/Close'; -import DoneIcon from '@material-ui/icons/Done'; -import Autocomplete, { autocompleteClasses } from '@material-ui/core/Autocomplete'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import InputBase from '@material-ui/core/InputBase'; -import Box from '@material-ui/core/Box'; +import { useTheme, styled } from '@mui/material/styles'; +import Popper from '@mui/material/Popper'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import SettingsIcon from '@mui/icons-material/Settings'; +import CloseIcon from '@mui/icons-material/Close'; +import DoneIcon from '@mui/icons-material/Done'; +import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete'; +import ButtonBase from '@mui/material/ButtonBase'; +import InputBase from '@mui/material/InputBase'; +import Box from '@mui/material/Box'; const StyledAutocompletePopper = styled('div')(({ theme }) => ({ [`& .${autocompleteClasses.paper}`]: { diff --git a/docs/src/pages/components/autocomplete/GitHubLabel.tsx b/docs/src/pages/components/autocomplete/GitHubLabel.tsx index d24c715a031889..3591e894e8145f 100644 --- a/docs/src/pages/components/autocomplete/GitHubLabel.tsx +++ b/docs/src/pages/components/autocomplete/GitHubLabel.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import { useTheme, styled } from '@material-ui/core/styles'; -import Popper from '@material-ui/core/Popper'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import SettingsIcon from '@material-ui/icons/Settings'; -import CloseIcon from '@material-ui/icons/Close'; -import DoneIcon from '@material-ui/icons/Done'; +import { useTheme, styled } from '@mui/material/styles'; +import Popper from '@mui/material/Popper'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import SettingsIcon from '@mui/icons-material/Settings'; +import CloseIcon from '@mui/icons-material/Close'; +import DoneIcon from '@mui/icons-material/Done'; import Autocomplete, { AutocompleteCloseReason, autocompleteClasses, -} from '@material-ui/core/Autocomplete'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import InputBase from '@material-ui/core/InputBase'; -import Box from '@material-ui/core/Box'; +} from '@mui/material/Autocomplete'; +import ButtonBase from '@mui/material/ButtonBase'; +import InputBase from '@mui/material/InputBase'; +import Box from '@mui/material/Box'; interface PopperComponentProps { anchorEl?: any; diff --git a/docs/src/pages/components/autocomplete/GoogleMaps.js b/docs/src/pages/components/autocomplete/GoogleMaps.js index fbbb8dbdb3f64e..9c9ec2d85d0351 100644 --- a/docs/src/pages/components/autocomplete/GoogleMaps.js +++ b/docs/src/pages/components/autocomplete/GoogleMaps.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; import parse from 'autosuggest-highlight/parse'; import throttle from 'lodash/throttle'; diff --git a/docs/src/pages/components/autocomplete/GoogleMaps.tsx b/docs/src/pages/components/autocomplete/GoogleMaps.tsx index fdf179460d31dd..3a695ae42e057e 100644 --- a/docs/src/pages/components/autocomplete/GoogleMaps.tsx +++ b/docs/src/pages/components/autocomplete/GoogleMaps.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; import parse from 'autosuggest-highlight/parse'; import throttle from 'lodash/throttle'; diff --git a/docs/src/pages/components/autocomplete/Grouped.js b/docs/src/pages/components/autocomplete/Grouped.js index 76ed6f8e309a48..e4b7aac8036a85 100644 --- a/docs/src/pages/components/autocomplete/Grouped.js +++ b/docs/src/pages/components/autocomplete/Grouped.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function Grouped() { const options = top100Films.map((option) => { diff --git a/docs/src/pages/components/autocomplete/Grouped.tsx b/docs/src/pages/components/autocomplete/Grouped.tsx index 76ed6f8e309a48..e4b7aac8036a85 100644 --- a/docs/src/pages/components/autocomplete/Grouped.tsx +++ b/docs/src/pages/components/autocomplete/Grouped.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; export default function Grouped() { const options = top100Films.map((option) => { diff --git a/docs/src/pages/components/autocomplete/Highlights.js b/docs/src/pages/components/autocomplete/Highlights.js index d9e8387a1617b7..23b8b736ee16ff 100644 --- a/docs/src/pages/components/autocomplete/Highlights.js +++ b/docs/src/pages/components/autocomplete/Highlights.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; import parse from 'autosuggest-highlight/parse'; import match from 'autosuggest-highlight/match'; diff --git a/docs/src/pages/components/autocomplete/Highlights.tsx b/docs/src/pages/components/autocomplete/Highlights.tsx index d9e8387a1617b7..23b8b736ee16ff 100644 --- a/docs/src/pages/components/autocomplete/Highlights.tsx +++ b/docs/src/pages/components/autocomplete/Highlights.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; import parse from 'autosuggest-highlight/parse'; import match from 'autosuggest-highlight/match'; diff --git a/docs/src/pages/components/autocomplete/LimitTags.js b/docs/src/pages/components/autocomplete/LimitTags.js index 7027688cb9a497..28857ea407b91a 100644 --- a/docs/src/pages/components/autocomplete/LimitTags.js +++ b/docs/src/pages/components/autocomplete/LimitTags.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; export default function LimitTags() { return ( diff --git a/docs/src/pages/components/autocomplete/LimitTags.tsx b/docs/src/pages/components/autocomplete/LimitTags.tsx index 7027688cb9a497..28857ea407b91a 100644 --- a/docs/src/pages/components/autocomplete/LimitTags.tsx +++ b/docs/src/pages/components/autocomplete/LimitTags.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; export default function LimitTags() { return ( diff --git a/docs/src/pages/components/autocomplete/Playground.js b/docs/src/pages/components/autocomplete/Playground.js index 23e32246c46ca6..50735b518e3d04 100644 --- a/docs/src/pages/components/autocomplete/Playground.js +++ b/docs/src/pages/components/autocomplete/Playground.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import Stack from '@mui/material/Stack'; export default function Playground() { const defaultProps = { diff --git a/docs/src/pages/components/autocomplete/Playground.tsx b/docs/src/pages/components/autocomplete/Playground.tsx index f790a66c5b9c60..1dbe59238e65e8 100644 --- a/docs/src/pages/components/autocomplete/Playground.tsx +++ b/docs/src/pages/components/autocomplete/Playground.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import Stack from '@mui/material/Stack'; export default function Playground() { const defaultProps = { diff --git a/docs/src/pages/components/autocomplete/Sizes.js b/docs/src/pages/components/autocomplete/Sizes.js index 8e5319e481abc6..ca0235e0bc38d6 100644 --- a/docs/src/pages/components/autocomplete/Sizes.js +++ b/docs/src/pages/components/autocomplete/Sizes.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Chip from '@material-ui/core/Chip'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; +import Stack from '@mui/material/Stack'; +import Chip from '@mui/material/Chip'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; export default function Sizes() { return ( diff --git a/docs/src/pages/components/autocomplete/Sizes.tsx b/docs/src/pages/components/autocomplete/Sizes.tsx index 8e5319e481abc6..ca0235e0bc38d6 100644 --- a/docs/src/pages/components/autocomplete/Sizes.tsx +++ b/docs/src/pages/components/autocomplete/Sizes.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Chip from '@material-ui/core/Chip'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; +import Stack from '@mui/material/Stack'; +import Chip from '@mui/material/Chip'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; export default function Sizes() { return ( diff --git a/docs/src/pages/components/autocomplete/Tags.js b/docs/src/pages/components/autocomplete/Tags.js index a93c1dedb4bdeb..6ee6415533cf55 100644 --- a/docs/src/pages/components/autocomplete/Tags.js +++ b/docs/src/pages/components/autocomplete/Tags.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; export default function Tags() { return ( diff --git a/docs/src/pages/components/autocomplete/Tags.tsx b/docs/src/pages/components/autocomplete/Tags.tsx index 26463c2c06ce61..a55faa1adaafcd 100644 --- a/docs/src/pages/components/autocomplete/Tags.tsx +++ b/docs/src/pages/components/autocomplete/Tags.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; export default function Tags() { return ( diff --git a/docs/src/pages/components/autocomplete/UseAutocomplete.js b/docs/src/pages/components/autocomplete/UseAutocomplete.js index e8f28e44a0464b..8b8d1980cfad32 100644 --- a/docs/src/pages/components/autocomplete/UseAutocomplete.js +++ b/docs/src/pages/components/autocomplete/UseAutocomplete.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { useAutocomplete } from '@material-ui/unstyled/AutocompleteUnstyled'; -import { styled } from '@material-ui/core/styles'; +import { useAutocomplete } from '@mui/core/AutocompleteUnstyled'; +import { styled } from '@mui/material/styles'; const Label = styled('label')({ display: 'block', diff --git a/docs/src/pages/components/autocomplete/UseAutocomplete.tsx b/docs/src/pages/components/autocomplete/UseAutocomplete.tsx index 1d3ec3b09d7e65..dfdff7e6b800ee 100644 --- a/docs/src/pages/components/autocomplete/UseAutocomplete.tsx +++ b/docs/src/pages/components/autocomplete/UseAutocomplete.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { useAutocomplete } from '@material-ui/unstyled/AutocompleteUnstyled'; -import { styled } from '@material-ui/core/styles'; +import { useAutocomplete } from '@mui/core/AutocompleteUnstyled'; +import { styled } from '@mui/material/styles'; const Label = styled('label')({ display: 'block', diff --git a/docs/src/pages/components/autocomplete/Virtualize.js b/docs/src/pages/components/autocomplete/Virtualize.js index 994539f757fb5c..77c4a748765ca9 100644 --- a/docs/src/pages/components/autocomplete/Virtualize.js +++ b/docs/src/pages/components/autocomplete/Virtualize.js @@ -1,13 +1,13 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { autocompleteClasses } from '@material-ui/core/Autocomplete'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Popper from '@material-ui/core/Popper'; -import { useTheme, styled } from '@material-ui/core/styles'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import ListSubheader from '@mui/material/ListSubheader'; +import Popper from '@mui/material/Popper'; +import { useTheme, styled } from '@mui/material/styles'; import { VariableSizeList } from 'react-window'; -import Typography from '@material-ui/core/Typography'; +import Typography from '@mui/material/Typography'; const LISTBOX_PADDING = 8; // px diff --git a/docs/src/pages/components/autocomplete/Virtualize.tsx b/docs/src/pages/components/autocomplete/Virtualize.tsx index a05bfcd2f0c682..5da38d0c16c0d6 100644 --- a/docs/src/pages/components/autocomplete/Virtualize.tsx +++ b/docs/src/pages/components/autocomplete/Virtualize.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Autocomplete, { autocompleteClasses } from '@material-ui/core/Autocomplete'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Popper from '@material-ui/core/Popper'; -import { useTheme, styled } from '@material-ui/core/styles'; +import TextField from '@mui/material/TextField'; +import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import ListSubheader from '@mui/material/ListSubheader'; +import Popper from '@mui/material/Popper'; +import { useTheme, styled } from '@mui/material/styles'; import { VariableSizeList, ListChildComponentProps } from 'react-window'; -import Typography from '@material-ui/core/Typography'; +import Typography from '@mui/material/Typography'; const LISTBOX_PADDING = 8; // px diff --git a/docs/src/pages/components/autocomplete/autocomplete.md b/docs/src/pages/components/autocomplete/autocomplete.md index e07034490f92a2..ae9d408f5a2984 100644 --- a/docs/src/pages/components/autocomplete/autocomplete.md +++ b/docs/src/pages/components/autocomplete/autocomplete.md @@ -117,13 +117,13 @@ related to the rendering of JSX. The Autocomplete component is built on this hook. ```tsx -import { useAutocomplete } from '@material-ui/unstyled/AutocompleteUnstyled'; +import { useAutocomplete } from '@mui/core/AutocompleteUnstyled'; ``` -The `useAutocomplete` hook is also reexported from @material-ui/core for convenience and backward compatibility. +The `useAutocomplete` hook is also reexported from @mui/material for convenience and backward compatibility. ```tsx -import useAutocomplete from '@material-ui/core/useAutocomplete'; +import useAutocomplete from '@mui/material/useAutocomplete'; ``` - 📦 [4.5 kB gzipped](/size-snapshot). @@ -229,7 +229,7 @@ The component exposes a factory to create a filter method that can provided to t You can use it to change the default option filter behavior. ```js -import { createFilterOptions } from '@material-ui/core/Autocomplete'; +import { createFilterOptions } from '@mui/material/Autocomplete'; ``` ### `createFilterOptions(config) => filterOptions` diff --git a/docs/src/pages/components/avatars/BackgroundLetterAvatars.js b/docs/src/pages/components/avatars/BackgroundLetterAvatars.js index c9ba5e5a8bb305..03e7f8292160d2 100644 --- a/docs/src/pages/components/avatars/BackgroundLetterAvatars.js +++ b/docs/src/pages/components/avatars/BackgroundLetterAvatars.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; function stringToColor(string) { let hash = 0; diff --git a/docs/src/pages/components/avatars/BackgroundLetterAvatars.tsx b/docs/src/pages/components/avatars/BackgroundLetterAvatars.tsx index 20e46a0caeb535..abc3bef6b2dff9 100644 --- a/docs/src/pages/components/avatars/BackgroundLetterAvatars.tsx +++ b/docs/src/pages/components/avatars/BackgroundLetterAvatars.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; function stringToColor(string: string) { let hash = 0; diff --git a/docs/src/pages/components/avatars/BadgeAvatars.js b/docs/src/pages/components/avatars/BadgeAvatars.js index b4b50e762ae359..3738bb5bb41470 100644 --- a/docs/src/pages/components/avatars/BadgeAvatars.js +++ b/docs/src/pages/components/avatars/BadgeAvatars.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Badge from '@material-ui/core/Badge'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import { styled } from '@mui/material/styles'; +import Badge from '@mui/material/Badge'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; const StyledBadge = styled(Badge)(({ theme }) => ({ '& .MuiBadge-badge': { diff --git a/docs/src/pages/components/avatars/BadgeAvatars.tsx b/docs/src/pages/components/avatars/BadgeAvatars.tsx index b4b50e762ae359..3738bb5bb41470 100644 --- a/docs/src/pages/components/avatars/BadgeAvatars.tsx +++ b/docs/src/pages/components/avatars/BadgeAvatars.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Badge from '@material-ui/core/Badge'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import { styled } from '@mui/material/styles'; +import Badge from '@mui/material/Badge'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; const StyledBadge = styled(Badge)(({ theme }) => ({ '& .MuiBadge-badge': { diff --git a/docs/src/pages/components/avatars/FallbackAvatars.js b/docs/src/pages/components/avatars/FallbackAvatars.js index 87e53dc546a165..b1a642510c8b85 100644 --- a/docs/src/pages/components/avatars/FallbackAvatars.js +++ b/docs/src/pages/components/avatars/FallbackAvatars.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange } from '@material-ui/core/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange } from '@mui/material/colors'; export default function FallbackAvatars() { return ( diff --git a/docs/src/pages/components/avatars/FallbackAvatars.tsx b/docs/src/pages/components/avatars/FallbackAvatars.tsx index 87e53dc546a165..b1a642510c8b85 100644 --- a/docs/src/pages/components/avatars/FallbackAvatars.tsx +++ b/docs/src/pages/components/avatars/FallbackAvatars.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange } from '@material-ui/core/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange } from '@mui/material/colors'; export default function FallbackAvatars() { return ( diff --git a/docs/src/pages/components/avatars/GroupAvatars.js b/docs/src/pages/components/avatars/GroupAvatars.js index 8c57f8953ca1e8..1e6be0099ab4ed 100644 --- a/docs/src/pages/components/avatars/GroupAvatars.js +++ b/docs/src/pages/components/avatars/GroupAvatars.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import AvatarGroup from '@material-ui/core/AvatarGroup'; +import Avatar from '@mui/material/Avatar'; +import AvatarGroup from '@mui/material/AvatarGroup'; export default function GroupAvatars() { return ( diff --git a/docs/src/pages/components/avatars/GroupAvatars.tsx b/docs/src/pages/components/avatars/GroupAvatars.tsx index 8c57f8953ca1e8..1e6be0099ab4ed 100644 --- a/docs/src/pages/components/avatars/GroupAvatars.tsx +++ b/docs/src/pages/components/avatars/GroupAvatars.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import AvatarGroup from '@material-ui/core/AvatarGroup'; +import Avatar from '@mui/material/Avatar'; +import AvatarGroup from '@mui/material/AvatarGroup'; export default function GroupAvatars() { return ( diff --git a/docs/src/pages/components/avatars/IconAvatars.js b/docs/src/pages/components/avatars/IconAvatars.js index 4beb897098120e..f55a7ac6b091b7 100644 --- a/docs/src/pages/components/avatars/IconAvatars.js +++ b/docs/src/pages/components/avatars/IconAvatars.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { green, pink } from '@material-ui/core/colors'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import FolderIcon from '@material-ui/icons/Folder'; -import PageviewIcon from '@material-ui/icons/Pageview'; -import AssignmentIcon from '@material-ui/icons/Assignment'; +import { green, pink } from '@mui/material/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import FolderIcon from '@mui/icons-material/Folder'; +import PageviewIcon from '@mui/icons-material/Pageview'; +import AssignmentIcon from '@mui/icons-material/Assignment'; export default function IconAvatars() { return ( diff --git a/docs/src/pages/components/avatars/IconAvatars.tsx b/docs/src/pages/components/avatars/IconAvatars.tsx index 4beb897098120e..f55a7ac6b091b7 100644 --- a/docs/src/pages/components/avatars/IconAvatars.tsx +++ b/docs/src/pages/components/avatars/IconAvatars.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { green, pink } from '@material-ui/core/colors'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import FolderIcon from '@material-ui/icons/Folder'; -import PageviewIcon from '@material-ui/icons/Pageview'; -import AssignmentIcon from '@material-ui/icons/Assignment'; +import { green, pink } from '@mui/material/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import FolderIcon from '@mui/icons-material/Folder'; +import PageviewIcon from '@mui/icons-material/Pageview'; +import AssignmentIcon from '@mui/icons-material/Assignment'; export default function IconAvatars() { return ( diff --git a/docs/src/pages/components/avatars/ImageAvatars.js b/docs/src/pages/components/avatars/ImageAvatars.js index fceea3898cb49e..0d8e717c7cffdd 100644 --- a/docs/src/pages/components/avatars/ImageAvatars.js +++ b/docs/src/pages/components/avatars/ImageAvatars.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; export default function ImageAvatars() { return ( diff --git a/docs/src/pages/components/avatars/ImageAvatars.tsx b/docs/src/pages/components/avatars/ImageAvatars.tsx index fceea3898cb49e..0d8e717c7cffdd 100644 --- a/docs/src/pages/components/avatars/ImageAvatars.tsx +++ b/docs/src/pages/components/avatars/ImageAvatars.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; export default function ImageAvatars() { return ( diff --git a/docs/src/pages/components/avatars/LetterAvatars.js b/docs/src/pages/components/avatars/LetterAvatars.js index 0b137d31fcdd16..bcd34fe6e1187c 100644 --- a/docs/src/pages/components/avatars/LetterAvatars.js +++ b/docs/src/pages/components/avatars/LetterAvatars.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange, deepPurple } from '@material-ui/core/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange, deepPurple } from '@mui/material/colors'; export default function LetterAvatars() { return ( diff --git a/docs/src/pages/components/avatars/LetterAvatars.tsx b/docs/src/pages/components/avatars/LetterAvatars.tsx index 0b137d31fcdd16..bcd34fe6e1187c 100644 --- a/docs/src/pages/components/avatars/LetterAvatars.tsx +++ b/docs/src/pages/components/avatars/LetterAvatars.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange, deepPurple } from '@material-ui/core/colors'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange, deepPurple } from '@mui/material/colors'; export default function LetterAvatars() { return ( diff --git a/docs/src/pages/components/avatars/SizeAvatars.js b/docs/src/pages/components/avatars/SizeAvatars.js index a8cca7c9edca7a..989acfe496b729 100644 --- a/docs/src/pages/components/avatars/SizeAvatars.js +++ b/docs/src/pages/components/avatars/SizeAvatars.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; export default function ImageAvatars() { return ( diff --git a/docs/src/pages/components/avatars/SizeAvatars.tsx b/docs/src/pages/components/avatars/SizeAvatars.tsx index a8cca7c9edca7a..989acfe496b729 100644 --- a/docs/src/pages/components/avatars/SizeAvatars.tsx +++ b/docs/src/pages/components/avatars/SizeAvatars.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; export default function ImageAvatars() { return ( diff --git a/docs/src/pages/components/avatars/VariantAvatars.js b/docs/src/pages/components/avatars/VariantAvatars.js index 1eea17ee08e924..069ce5d1618ced 100644 --- a/docs/src/pages/components/avatars/VariantAvatars.js +++ b/docs/src/pages/components/avatars/VariantAvatars.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange, green } from '@material-ui/core/colors'; -import AssignmentIcon from '@material-ui/icons/Assignment'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange, green } from '@mui/material/colors'; +import AssignmentIcon from '@mui/icons-material/Assignment'; export default function VariantAvatars() { return ( diff --git a/docs/src/pages/components/avatars/VariantAvatars.tsx b/docs/src/pages/components/avatars/VariantAvatars.tsx index 1eea17ee08e924..069ce5d1618ced 100644 --- a/docs/src/pages/components/avatars/VariantAvatars.tsx +++ b/docs/src/pages/components/avatars/VariantAvatars.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Stack from '@material-ui/core/Stack'; -import { deepOrange, green } from '@material-ui/core/colors'; -import AssignmentIcon from '@material-ui/icons/Assignment'; +import Avatar from '@mui/material/Avatar'; +import Stack from '@mui/material/Stack'; +import { deepOrange, green } from '@mui/material/colors'; +import AssignmentIcon from '@mui/icons-material/Assignment'; export default function VariantAvatars() { return ( diff --git a/docs/src/pages/components/backdrop/SimpleBackdrop.js b/docs/src/pages/components/backdrop/SimpleBackdrop.js index b3dd738bd63b19..1c980970ceef18 100644 --- a/docs/src/pages/components/backdrop/SimpleBackdrop.js +++ b/docs/src/pages/components/backdrop/SimpleBackdrop.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Backdrop from '@material-ui/core/Backdrop'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Button from '@material-ui/core/Button'; +import Backdrop from '@mui/material/Backdrop'; +import CircularProgress from '@mui/material/CircularProgress'; +import Button from '@mui/material/Button'; export default function SimpleBackdrop() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/backdrop/SimpleBackdrop.tsx b/docs/src/pages/components/backdrop/SimpleBackdrop.tsx index b3dd738bd63b19..1c980970ceef18 100644 --- a/docs/src/pages/components/backdrop/SimpleBackdrop.tsx +++ b/docs/src/pages/components/backdrop/SimpleBackdrop.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Backdrop from '@material-ui/core/Backdrop'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Button from '@material-ui/core/Button'; +import Backdrop from '@mui/material/Backdrop'; +import CircularProgress from '@mui/material/CircularProgress'; +import Button from '@mui/material/Button'; export default function SimpleBackdrop() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/backdrop/backdrop.md b/docs/src/pages/components/backdrop/backdrop.md index 7a19afae0c014f..827f4741484a3d 100644 --- a/docs/src/pages/components/backdrop/backdrop.md +++ b/docs/src/pages/components/backdrop/backdrop.md @@ -23,5 +23,5 @@ The backdrop also comes with the unstyled package. It's ideal for doing heavy customizations and minimizing bundle size. ```js -import Backdrop from '@material-ui/unstyled/Backdrop'; +import Backdrop from '@mui/core/Backdrop'; ``` diff --git a/docs/src/pages/components/badges/AccessibleBadges.js b/docs/src/pages/components/badges/AccessibleBadges.js index 11bf53361c2962..cf4fb964384803 100644 --- a/docs/src/pages/components/badges/AccessibleBadges.js +++ b/docs/src/pages/components/badges/AccessibleBadges.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import IconButton from '@mui/material/IconButton'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; function notificationsLabel(count) { if (count === 0) { diff --git a/docs/src/pages/components/badges/AccessibleBadges.tsx b/docs/src/pages/components/badges/AccessibleBadges.tsx index cb1d2cd2aa0def..2aab3fb400f581 100644 --- a/docs/src/pages/components/badges/AccessibleBadges.tsx +++ b/docs/src/pages/components/badges/AccessibleBadges.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import IconButton from '@mui/material/IconButton'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; function notificationsLabel(count: number) { if (count === 0) { diff --git a/docs/src/pages/components/badges/BadgeAlignment.js b/docs/src/pages/components/badges/BadgeAlignment.js index 5caca2d0eb8928..1cce1c8ec7005a 100644 --- a/docs/src/pages/components/badges/BadgeAlignment.js +++ b/docs/src/pages/components/badges/BadgeAlignment.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import FormControl from '@material-ui/core/FormControl'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormLabel from '@material-ui/core/FormLabel'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Box from '@material-ui/core/Box'; -import MailIcon from '@material-ui/icons/Mail'; +import Badge from '@mui/material/Badge'; +import FormControl from '@mui/material/FormControl'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormLabel from '@mui/material/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import Box from '@mui/material/Box'; +import MailIcon from '@mui/icons-material/Mail'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; export default function BadgeAlignment() { diff --git a/docs/src/pages/components/badges/BadgeMax.js b/docs/src/pages/components/badges/BadgeMax.js index 4197b9330815fb..e24883247a6179 100644 --- a/docs/src/pages/components/badges/BadgeMax.js +++ b/docs/src/pages/components/badges/BadgeMax.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function BadgeMax() { return ( diff --git a/docs/src/pages/components/badges/BadgeMax.tsx b/docs/src/pages/components/badges/BadgeMax.tsx index 4197b9330815fb..e24883247a6179 100644 --- a/docs/src/pages/components/badges/BadgeMax.tsx +++ b/docs/src/pages/components/badges/BadgeMax.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function BadgeMax() { return ( diff --git a/docs/src/pages/components/badges/BadgeOverlap.js b/docs/src/pages/components/badges/BadgeOverlap.js index 0444d60409ac5d..aadb7ac2657ee1 100644 --- a/docs/src/pages/components/badges/BadgeOverlap.js +++ b/docs/src/pages/components/badges/BadgeOverlap.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; const shapeStyles = { bgcolor: 'primary.main', width: 40, height: 40 }; const shapeCircleStyles = { borderRadius: '50%' }; diff --git a/docs/src/pages/components/badges/BadgeOverlap.tsx b/docs/src/pages/components/badges/BadgeOverlap.tsx index 0444d60409ac5d..aadb7ac2657ee1 100644 --- a/docs/src/pages/components/badges/BadgeOverlap.tsx +++ b/docs/src/pages/components/badges/BadgeOverlap.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; const shapeStyles = { bgcolor: 'primary.main', width: 40, height: 40 }; const shapeCircleStyles = { borderRadius: '50%' }; diff --git a/docs/src/pages/components/badges/BadgeVisibility.js b/docs/src/pages/components/badges/BadgeVisibility.js index e927e0275b7638..e70cd166c14d61 100644 --- a/docs/src/pages/components/badges/BadgeVisibility.js +++ b/docs/src/pages/components/badges/BadgeVisibility.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Badge from '@material-ui/core/Badge'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Button from '@material-ui/core/Button'; -import AddIcon from '@material-ui/icons/Add'; -import RemoveIcon from '@material-ui/icons/Remove'; -import MailIcon from '@material-ui/icons/Mail'; -import Switch from '@material-ui/core/Switch'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Badge from '@mui/material/Badge'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Button from '@mui/material/Button'; +import AddIcon from '@mui/icons-material/Add'; +import RemoveIcon from '@mui/icons-material/Remove'; +import MailIcon from '@mui/icons-material/Mail'; +import Switch from '@mui/material/Switch'; +import FormControlLabel from '@mui/material/FormControlLabel'; export default function BadgeVisibility() { const [count, setCount] = React.useState(1); diff --git a/docs/src/pages/components/badges/BadgeVisibility.tsx b/docs/src/pages/components/badges/BadgeVisibility.tsx index e927e0275b7638..e70cd166c14d61 100644 --- a/docs/src/pages/components/badges/BadgeVisibility.tsx +++ b/docs/src/pages/components/badges/BadgeVisibility.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Badge from '@material-ui/core/Badge'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Button from '@material-ui/core/Button'; -import AddIcon from '@material-ui/icons/Add'; -import RemoveIcon from '@material-ui/icons/Remove'; -import MailIcon from '@material-ui/icons/Mail'; -import Switch from '@material-ui/core/Switch'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Badge from '@mui/material/Badge'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Button from '@mui/material/Button'; +import AddIcon from '@mui/icons-material/Add'; +import RemoveIcon from '@mui/icons-material/Remove'; +import MailIcon from '@mui/icons-material/Mail'; +import Switch from '@mui/material/Switch'; +import FormControlLabel from '@mui/material/FormControlLabel'; export default function BadgeVisibility() { const [count, setCount] = React.useState(1); diff --git a/docs/src/pages/components/badges/ColorBadge.js b/docs/src/pages/components/badges/ColorBadge.js index c73901c4f46639..dd6204dbced39a 100644 --- a/docs/src/pages/components/badges/ColorBadge.js +++ b/docs/src/pages/components/badges/ColorBadge.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import Stack from '@material-ui/core/Stack'; -import MailIcon from '@material-ui/icons/Mail'; +import Badge from '@mui/material/Badge'; +import Stack from '@mui/material/Stack'; +import MailIcon from '@mui/icons-material/Mail'; export default function ColorBadge() { return ( diff --git a/docs/src/pages/components/badges/ColorBadge.tsx b/docs/src/pages/components/badges/ColorBadge.tsx index c73901c4f46639..dd6204dbced39a 100644 --- a/docs/src/pages/components/badges/ColorBadge.tsx +++ b/docs/src/pages/components/badges/ColorBadge.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import Stack from '@material-ui/core/Stack'; -import MailIcon from '@material-ui/icons/Mail'; +import Badge from '@mui/material/Badge'; +import Stack from '@mui/material/Stack'; +import MailIcon from '@mui/icons-material/Mail'; export default function ColorBadge() { return ( diff --git a/docs/src/pages/components/badges/CustomizedBadges.js b/docs/src/pages/components/badges/CustomizedBadges.js index 0224e8152e17fa..76849e9ab8d3a9 100644 --- a/docs/src/pages/components/badges/CustomizedBadges.js +++ b/docs/src/pages/components/badges/CustomizedBadges.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import { styled } from '@material-ui/core/styles'; -import IconButton from '@material-ui/core/IconButton'; -import ShoppingCartIcon from '@material-ui/icons/ShoppingCart'; +import Badge from '@mui/material/Badge'; +import { styled } from '@mui/material/styles'; +import IconButton from '@mui/material/IconButton'; +import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; const StyledBadge = styled(Badge)(({ theme }) => ({ '& .MuiBadge-badge': { diff --git a/docs/src/pages/components/badges/CustomizedBadges.tsx b/docs/src/pages/components/badges/CustomizedBadges.tsx index c15ac15252e19b..848f732fbd6208 100644 --- a/docs/src/pages/components/badges/CustomizedBadges.tsx +++ b/docs/src/pages/components/badges/CustomizedBadges.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Badge, { BadgeProps } from '@material-ui/core/Badge'; -import { styled } from '@material-ui/core/styles'; -import IconButton from '@material-ui/core/IconButton'; -import ShoppingCartIcon from '@material-ui/icons/ShoppingCart'; +import Badge, { BadgeProps } from '@mui/material/Badge'; +import { styled } from '@mui/material/styles'; +import IconButton from '@mui/material/IconButton'; +import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; const StyledBadge = styled(Badge)(({ theme }) => ({ '& .MuiBadge-badge': { diff --git a/docs/src/pages/components/badges/DotBadge.js b/docs/src/pages/components/badges/DotBadge.js index a1e47bef282f5a..e90382b9c47b43 100644 --- a/docs/src/pages/components/badges/DotBadge.js +++ b/docs/src/pages/components/badges/DotBadge.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function DotBadge() { return ( diff --git a/docs/src/pages/components/badges/DotBadge.tsx b/docs/src/pages/components/badges/DotBadge.tsx index a1e47bef282f5a..e90382b9c47b43 100644 --- a/docs/src/pages/components/badges/DotBadge.tsx +++ b/docs/src/pages/components/badges/DotBadge.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function DotBadge() { return ( diff --git a/docs/src/pages/components/badges/ShowZeroBadge.js b/docs/src/pages/components/badges/ShowZeroBadge.js index 5f6a05f43046ef..bffb6621f0d6c3 100644 --- a/docs/src/pages/components/badges/ShowZeroBadge.js +++ b/docs/src/pages/components/badges/ShowZeroBadge.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function ShowZeroBadge() { return ( diff --git a/docs/src/pages/components/badges/ShowZeroBadge.tsx b/docs/src/pages/components/badges/ShowZeroBadge.tsx index 5f6a05f43046ef..bffb6621f0d6c3 100644 --- a/docs/src/pages/components/badges/ShowZeroBadge.tsx +++ b/docs/src/pages/components/badges/ShowZeroBadge.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Stack from '@mui/material/Stack'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function ShowZeroBadge() { return ( diff --git a/docs/src/pages/components/badges/SimpleBadge.js b/docs/src/pages/components/badges/SimpleBadge.js index 6956cc470c2bcd..9df47dd865a335 100644 --- a/docs/src/pages/components/badges/SimpleBadge.js +++ b/docs/src/pages/components/badges/SimpleBadge.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function SimpleBadge() { return ( diff --git a/docs/src/pages/components/badges/SimpleBadge.tsx b/docs/src/pages/components/badges/SimpleBadge.tsx index 6956cc470c2bcd..9df47dd865a335 100644 --- a/docs/src/pages/components/badges/SimpleBadge.tsx +++ b/docs/src/pages/components/badges/SimpleBadge.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import MailIcon from '@material-ui/icons/Mail'; +import Badge from '@mui/material/Badge'; +import MailIcon from '@mui/icons-material/Mail'; export default function SimpleBadge() { return ( diff --git a/docs/src/pages/components/badges/UnstyledBadge.js b/docs/src/pages/components/badges/UnstyledBadge.js index 7733803f8ac155..294e0a54ce9af1 100644 --- a/docs/src/pages/components/badges/UnstyledBadge.js +++ b/docs/src/pages/components/badges/UnstyledBadge.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, Box } from '@material-ui/system'; -import BadgeUnstyled from '@material-ui/unstyled/BadgeUnstyled'; +import { styled, Box } from '@mui/system'; +import BadgeUnstyled from '@mui/core/BadgeUnstyled'; const StyledBadge = styled(BadgeUnstyled)` box-sizing: border-box; diff --git a/docs/src/pages/components/badges/UnstyledBadge.tsx b/docs/src/pages/components/badges/UnstyledBadge.tsx index 7733803f8ac155..294e0a54ce9af1 100644 --- a/docs/src/pages/components/badges/UnstyledBadge.tsx +++ b/docs/src/pages/components/badges/UnstyledBadge.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, Box } from '@material-ui/system'; -import BadgeUnstyled from '@material-ui/unstyled/BadgeUnstyled'; +import { styled, Box } from '@mui/system'; +import BadgeUnstyled from '@mui/core/BadgeUnstyled'; const StyledBadge = styled(BadgeUnstyled)` box-sizing: border-box; diff --git a/docs/src/pages/components/badges/badges.md b/docs/src/pages/components/badges/badges.md index 980ac781acd583..f7548cc45e1a6e 100644 --- a/docs/src/pages/components/badges/badges.md +++ b/docs/src/pages/components/badges/badges.md @@ -69,7 +69,7 @@ The badge also comes with an unstyled version. It's ideal for doing heavy customizations and minimizing bundle size. ```js -import BadgeUnstyled from '@material-ui/unstyled/BadgeUnstyled'; +import BadgeUnstyled from '@mui/core/BadgeUnstyled'; ``` {{"demo": "pages/components/badges/UnstyledBadge.js"}} diff --git a/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.js b/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.js index f890664646b96b..74d945b84798a4 100644 --- a/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.js +++ b/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.js @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import ArchiveIcon from '@material-ui/icons/Archive'; -import Paper from '@material-ui/core/Paper'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import ArchiveIcon from '@mui/icons-material/Archive'; +import Paper from '@mui/material/Paper'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; function refreshMessages() { const getRandomInt = (max) => Math.floor(Math.random() * Math.floor(max)); diff --git a/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.tsx b/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.tsx index d1883614958a34..22e168b602bcbc 100644 --- a/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.tsx +++ b/docs/src/pages/components/bottom-navigation/FixedBottomNavigation.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import ArchiveIcon from '@material-ui/icons/Archive'; -import Paper from '@material-ui/core/Paper'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import ArchiveIcon from '@mui/icons-material/Archive'; +import Paper from '@mui/material/Paper'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; function refreshMessages(): MessageExample[] { const getRandomInt = (max: number) => Math.floor(Math.random() * Math.floor(max)); diff --git a/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.js b/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.js index 4e322f7e34be0f..d0ba611915020f 100644 --- a/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.js +++ b/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import FolderIcon from '@material-ui/icons/Folder'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import FolderIcon from '@mui/icons-material/Folder'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; export default function LabelBottomNavigation() { const [value, setValue] = React.useState('recents'); diff --git a/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.tsx b/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.tsx index 4761f61fa5a26d..d76c2dc9b64ed1 100644 --- a/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.tsx +++ b/docs/src/pages/components/bottom-navigation/LabelBottomNavigation.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import FolderIcon from '@material-ui/icons/Folder'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import FolderIcon from '@mui/icons-material/Folder'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; export default function LabelBottomNavigation() { const [value, setValue] = React.useState('recents'); diff --git a/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.js b/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.js index d5cbfdeb614954..b85b0d7fc44573 100644 --- a/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.js +++ b/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; +import Box from '@mui/material/Box'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; export default function SimpleBottomNavigation() { const [value, setValue] = React.useState(0); diff --git a/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.tsx b/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.tsx index d5cbfdeb614954..b85b0d7fc44573 100644 --- a/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.tsx +++ b/docs/src/pages/components/bottom-navigation/SimpleBottomNavigation.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import BottomNavigation from '@material-ui/core/BottomNavigation'; -import BottomNavigationAction from '@material-ui/core/BottomNavigationAction'; -import RestoreIcon from '@material-ui/icons/Restore'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import LocationOnIcon from '@material-ui/icons/LocationOn'; +import Box from '@mui/material/Box'; +import BottomNavigation from '@mui/material/BottomNavigation'; +import BottomNavigationAction from '@mui/material/BottomNavigationAction'; +import RestoreIcon from '@mui/icons-material/Restore'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; export default function SimpleBottomNavigation() { const [value, setValue] = React.useState(0); diff --git a/docs/src/pages/components/box/BoxComponent.js b/docs/src/pages/components/box/BoxComponent.js index 539477349a51ea..5376e3c004a69a 100644 --- a/docs/src/pages/components/box/BoxComponent.js +++ b/docs/src/pages/components/box/BoxComponent.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; export default function BoxComponent() { return ( diff --git a/docs/src/pages/components/box/BoxComponent.tsx b/docs/src/pages/components/box/BoxComponent.tsx index 539477349a51ea..5376e3c004a69a 100644 --- a/docs/src/pages/components/box/BoxComponent.tsx +++ b/docs/src/pages/components/box/BoxComponent.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; export default function BoxComponent() { return ( diff --git a/docs/src/pages/components/box/BoxSx.js b/docs/src/pages/components/box/BoxSx.js index 5841e76aed3c13..3909f9860c977f 100644 --- a/docs/src/pages/components/box/BoxSx.js +++ b/docs/src/pages/components/box/BoxSx.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; export default function BoxSx() { return ( diff --git a/docs/src/pages/components/box/BoxSx.tsx b/docs/src/pages/components/box/BoxSx.tsx index 5841e76aed3c13..3909f9860c977f 100644 --- a/docs/src/pages/components/box/BoxSx.tsx +++ b/docs/src/pages/components/box/BoxSx.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; export default function BoxSx() { return ( diff --git a/docs/src/pages/components/box/box.md b/docs/src/pages/components/box/box.md index d8d2693ab207c5..8935d4f0f527eb 100644 --- a/docs/src/pages/components/box/box.md +++ b/docs/src/pages/components/box/box.md @@ -7,7 +7,7 @@ githubLabel: 'component: Box'

    The Box component serves as a wrapper component for most of the CSS utility needs.

    -The Box component packages [all the style functions](/system/basics/#all-inclusive) that are exposed in `@material-ui/system`. +The Box component packages [all the style functions](/system/basics/#all-inclusive) that are exposed in `@mui/system`. {{"component": "modules/components/ComponentLinkHeader.js", "design": false}} @@ -57,7 +57,7 @@ For non-Material-UI components, use the `component` prop. ## API ```jsx -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; ``` | Name | Type | Default | Description | diff --git a/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.js b/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.js index c2bf761d4bdf80..75ddb90da1e956 100644 --- a/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.js +++ b/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; function handleClick(event) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.tsx b/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.tsx index 0925b488b38745..44caf75909d916 100644 --- a/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.tsx +++ b/docs/src/pages/components/breadcrumbs/ActiveLastBreadcrumb.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; function handleClick(event: React.MouseEvent) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.js b/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.js index bb8e5bc8ab3e82..1081c2625178e5 100644 --- a/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.js +++ b/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; +import Typography from '@mui/material/Typography'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; function handleClick(event) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.tsx b/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.tsx index 13d7beff015f10..166b60121dc62e 100644 --- a/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.tsx +++ b/docs/src/pages/components/breadcrumbs/BasicBreadcrumbs.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; +import Typography from '@mui/material/Typography'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; function handleClick(event: React.MouseEvent) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.js b/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.js index 27c0a9ed96d5aa..875d60cde83222 100644 --- a/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.js +++ b/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.js @@ -1,8 +1,8 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; function handleClick(event) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.tsx b/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.tsx index 50249251e025c5..22c8d09dda8e0c 100644 --- a/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.tsx +++ b/docs/src/pages/components/breadcrumbs/CollapsedBreadcrumbs.tsx @@ -1,8 +1,8 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; function handleClick(event: React.MouseEvent) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/CustomSeparator.js b/docs/src/pages/components/breadcrumbs/CustomSeparator.js index 17fb74b99798bf..75131e334687fa 100644 --- a/docs/src/pages/components/breadcrumbs/CustomSeparator.js +++ b/docs/src/pages/components/breadcrumbs/CustomSeparator.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; -import Stack from '@material-ui/core/Stack'; -import NavigateNextIcon from '@material-ui/icons/NavigateNext'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; +import Stack from '@mui/material/Stack'; +import NavigateNextIcon from '@mui/icons-material/NavigateNext'; function handleClick(event) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/CustomSeparator.tsx b/docs/src/pages/components/breadcrumbs/CustomSeparator.tsx index 81c204196e0548..2649644966db6a 100644 --- a/docs/src/pages/components/breadcrumbs/CustomSeparator.tsx +++ b/docs/src/pages/components/breadcrumbs/CustomSeparator.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; -import Stack from '@material-ui/core/Stack'; -import NavigateNextIcon from '@material-ui/icons/NavigateNext'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; +import Stack from '@mui/material/Stack'; +import NavigateNextIcon from '@mui/icons-material/NavigateNext'; function handleClick(event: React.MouseEvent) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.js b/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.js index adcfaa083134d3..be458a3a5f05c3 100644 --- a/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.js +++ b/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import { emphasize, styled } from '@material-ui/core/styles'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Chip from '@material-ui/core/Chip'; -import HomeIcon from '@material-ui/icons/Home'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import { emphasize, styled } from '@mui/material/styles'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Chip from '@mui/material/Chip'; +import HomeIcon from '@mui/icons-material/Home'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; const StyledBreadcrumb = styled(Chip)(({ theme }) => { const backgroundColor = diff --git a/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.tsx b/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.tsx index 27895822ba7185..ec4bdbd4c7c224 100644 --- a/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.tsx +++ b/docs/src/pages/components/breadcrumbs/CustomizedBreadcrumbs.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { emphasize, styled } from '@material-ui/core/styles'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Chip from '@material-ui/core/Chip'; -import HomeIcon from '@material-ui/icons/Home'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import { emphasize, styled } from '@mui/material/styles'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Chip from '@mui/material/Chip'; +import HomeIcon from '@mui/icons-material/Home'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; const StyledBreadcrumb = styled(Chip)(({ theme }) => { const backgroundColor = diff --git a/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.js b/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.js index 903b5acad4337d..f9569933ce2c2f 100644 --- a/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.js +++ b/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; -import HomeIcon from '@material-ui/icons/Home'; -import WhatshotIcon from '@material-ui/icons/Whatshot'; -import GrainIcon from '@material-ui/icons/Grain'; +import Typography from '@mui/material/Typography'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; +import HomeIcon from '@mui/icons-material/Home'; +import WhatshotIcon from '@mui/icons-material/Whatshot'; +import GrainIcon from '@mui/icons-material/Grain'; function handleClick(event) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.tsx b/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.tsx index 9c4398c7cbb985..94cfc6969cc4bd 100644 --- a/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.tsx +++ b/docs/src/pages/components/breadcrumbs/IconBreadcrumbs.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; -import Link from '@material-ui/core/Link'; -import HomeIcon from '@material-ui/icons/Home'; -import WhatshotIcon from '@material-ui/icons/Whatshot'; -import GrainIcon from '@material-ui/icons/Grain'; +import Typography from '@mui/material/Typography'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; +import Link from '@mui/material/Link'; +import HomeIcon from '@mui/icons-material/Home'; +import WhatshotIcon from '@mui/icons-material/Whatshot'; +import GrainIcon from '@mui/icons-material/Grain'; function handleClick(event: React.MouseEvent) { event.preventDefault(); diff --git a/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.js b/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.js index 26695da8ae0e81..13ca6883b972c0 100644 --- a/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.js +++ b/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.js @@ -1,15 +1,15 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import Link from '@material-ui/core/Link'; -import ListItem from '@material-ui/core/ListItem'; -import Collapse from '@material-ui/core/Collapse'; -import ListItemText from '@material-ui/core/ListItemText'; -import Typography from '@material-ui/core/Typography'; -import ExpandLess from '@material-ui/icons/ExpandLess'; -import ExpandMore from '@material-ui/icons/ExpandMore'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import Link from '@mui/material/Link'; +import ListItem from '@mui/material/ListItem'; +import Collapse from '@mui/material/Collapse'; +import ListItemText from '@mui/material/ListItemText'; +import Typography from '@mui/material/Typography'; +import ExpandLess from '@mui/icons-material/ExpandLess'; +import ExpandMore from '@mui/icons-material/ExpandMore'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; import { Route, MemoryRouter } from 'react-router'; import { Link as RouterLink } from 'react-router-dom'; diff --git a/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.tsx b/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.tsx index 3eda9e19d56692..7cf91a14c8d287 100644 --- a/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.tsx +++ b/docs/src/pages/components/breadcrumbs/RouterBreadcrumbs.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import Link, { LinkProps } from '@material-ui/core/Link'; -import ListItem, { ListItemProps } from '@material-ui/core/ListItem'; -import Collapse from '@material-ui/core/Collapse'; -import ListItemText from '@material-ui/core/ListItemText'; -import Typography from '@material-ui/core/Typography'; -import ExpandLess from '@material-ui/icons/ExpandLess'; -import ExpandMore from '@material-ui/icons/ExpandMore'; -import Breadcrumbs from '@material-ui/core/Breadcrumbs'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import Link, { LinkProps } from '@mui/material/Link'; +import ListItem, { ListItemProps } from '@mui/material/ListItem'; +import Collapse from '@mui/material/Collapse'; +import ListItemText from '@mui/material/ListItemText'; +import Typography from '@mui/material/Typography'; +import ExpandLess from '@mui/icons-material/ExpandLess'; +import ExpandMore from '@mui/icons-material/ExpandMore'; +import Breadcrumbs from '@mui/material/Breadcrumbs'; import { Route, MemoryRouter } from 'react-router'; import { Link as RouterLink } from 'react-router-dom'; diff --git a/docs/src/pages/components/button-group/BasicButtonGroup.js b/docs/src/pages/components/button-group/BasicButtonGroup.js index 35fdf13935204b..cb8c7b23e3d8d0 100644 --- a/docs/src/pages/components/button-group/BasicButtonGroup.js +++ b/docs/src/pages/components/button-group/BasicButtonGroup.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; export default function BasicButtonGroup() { return ( diff --git a/docs/src/pages/components/button-group/BasicButtonGroup.tsx b/docs/src/pages/components/button-group/BasicButtonGroup.tsx index 35fdf13935204b..cb8c7b23e3d8d0 100644 --- a/docs/src/pages/components/button-group/BasicButtonGroup.tsx +++ b/docs/src/pages/components/button-group/BasicButtonGroup.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; export default function BasicButtonGroup() { return ( diff --git a/docs/src/pages/components/button-group/DisableElevation.js b/docs/src/pages/components/button-group/DisableElevation.js index 61713b22340ebc..6d4cc73a81f528 100644 --- a/docs/src/pages/components/button-group/DisableElevation.js +++ b/docs/src/pages/components/button-group/DisableElevation.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Button from '@material-ui/core/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Button from '@mui/material/Button'; export default function DisableElevation() { return ( diff --git a/docs/src/pages/components/button-group/DisableElevation.tsx b/docs/src/pages/components/button-group/DisableElevation.tsx index 61713b22340ebc..6d4cc73a81f528 100644 --- a/docs/src/pages/components/button-group/DisableElevation.tsx +++ b/docs/src/pages/components/button-group/DisableElevation.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Button from '@material-ui/core/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Button from '@mui/material/Button'; export default function DisableElevation() { return ( diff --git a/docs/src/pages/components/button-group/GroupOrientation.js b/docs/src/pages/components/button-group/GroupOrientation.js index d803541fbddfa5..68e2a6efbfdb1c 100644 --- a/docs/src/pages/components/button-group/GroupOrientation.js +++ b/docs/src/pages/components/button-group/GroupOrientation.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Box from '@material-ui/core/Box'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Box from '@mui/material/Box'; const buttons = [ , diff --git a/docs/src/pages/components/button-group/GroupOrientation.tsx b/docs/src/pages/components/button-group/GroupOrientation.tsx index d803541fbddfa5..68e2a6efbfdb1c 100644 --- a/docs/src/pages/components/button-group/GroupOrientation.tsx +++ b/docs/src/pages/components/button-group/GroupOrientation.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Box from '@material-ui/core/Box'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Box from '@mui/material/Box'; const buttons = [ , diff --git a/docs/src/pages/components/button-group/GroupSizesColors.js b/docs/src/pages/components/button-group/GroupSizesColors.js index a0cea7c9fed351..a7438b619be3c7 100644 --- a/docs/src/pages/components/button-group/GroupSizesColors.js +++ b/docs/src/pages/components/button-group/GroupSizesColors.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import ButtonGroup from '@mui/material/ButtonGroup'; const buttons = [ , diff --git a/docs/src/pages/components/button-group/GroupSizesColors.tsx b/docs/src/pages/components/button-group/GroupSizesColors.tsx index a0cea7c9fed351..a7438b619be3c7 100644 --- a/docs/src/pages/components/button-group/GroupSizesColors.tsx +++ b/docs/src/pages/components/button-group/GroupSizesColors.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import ButtonGroup from '@mui/material/ButtonGroup'; const buttons = [ , diff --git a/docs/src/pages/components/button-group/SplitButton.js b/docs/src/pages/components/button-group/SplitButton.js index f164a6b4f1a1b0..fb6dee3cd89762 100644 --- a/docs/src/pages/components/button-group/SplitButton.js +++ b/docs/src/pages/components/button-group/SplitButton.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Grow from '@material-ui/core/Grow'; -import Paper from '@material-ui/core/Paper'; -import Popper from '@material-ui/core/Popper'; -import MenuItem from '@material-ui/core/MenuItem'; -import MenuList from '@material-ui/core/MenuList'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Grow from '@mui/material/Grow'; +import Paper from '@mui/material/Paper'; +import Popper from '@mui/material/Popper'; +import MenuItem from '@mui/material/MenuItem'; +import MenuList from '@mui/material/MenuList'; const options = ['Create a merge commit', 'Squash and merge', 'Rebase and merge']; diff --git a/docs/src/pages/components/button-group/SplitButton.tsx b/docs/src/pages/components/button-group/SplitButton.tsx index a9f2eb55ae2b75..de5ba05a6e54aa 100644 --- a/docs/src/pages/components/button-group/SplitButton.tsx +++ b/docs/src/pages/components/button-group/SplitButton.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Grow from '@material-ui/core/Grow'; -import Paper from '@material-ui/core/Paper'; -import Popper from '@material-ui/core/Popper'; -import MenuItem from '@material-ui/core/MenuItem'; -import MenuList from '@material-ui/core/MenuList'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Grow from '@mui/material/Grow'; +import Paper from '@mui/material/Paper'; +import Popper from '@mui/material/Popper'; +import MenuItem from '@mui/material/MenuItem'; +import MenuList from '@mui/material/MenuList'; const options = ['Create a merge commit', 'Squash and merge', 'Rebase and merge']; diff --git a/docs/src/pages/components/button-group/VariantButtonGroup.js b/docs/src/pages/components/button-group/VariantButtonGroup.js index af138e532eb235..7b88819656e979 100644 --- a/docs/src/pages/components/button-group/VariantButtonGroup.js +++ b/docs/src/pages/components/button-group/VariantButtonGroup.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Box from '@material-ui/core/Box'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Box from '@mui/material/Box'; export default function VariantButtonGroup() { return ( diff --git a/docs/src/pages/components/button-group/VariantButtonGroup.tsx b/docs/src/pages/components/button-group/VariantButtonGroup.tsx index af138e532eb235..7b88819656e979 100644 --- a/docs/src/pages/components/button-group/VariantButtonGroup.tsx +++ b/docs/src/pages/components/button-group/VariantButtonGroup.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ButtonGroup from '@material-ui/core/ButtonGroup'; -import Box from '@material-ui/core/Box'; +import Button from '@mui/material/Button'; +import ButtonGroup from '@mui/material/ButtonGroup'; +import Box from '@mui/material/Box'; export default function VariantButtonGroup() { return ( diff --git a/docs/src/pages/components/buttons/BasicButtons.js b/docs/src/pages/components/buttons/BasicButtons.js index 9648617ca15a04..60eb1dfe1e4a75 100644 --- a/docs/src/pages/components/buttons/BasicButtons.js +++ b/docs/src/pages/components/buttons/BasicButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; export default function BasicButtons() { return ( diff --git a/docs/src/pages/components/buttons/BasicButtons.tsx b/docs/src/pages/components/buttons/BasicButtons.tsx index 9648617ca15a04..60eb1dfe1e4a75 100644 --- a/docs/src/pages/components/buttons/BasicButtons.tsx +++ b/docs/src/pages/components/buttons/BasicButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; export default function BasicButtons() { return ( diff --git a/docs/src/pages/components/buttons/ButtonBase.js b/docs/src/pages/components/buttons/ButtonBase.js index 1765cc1017c2d9..6c5ce32ce53c6f 100644 --- a/docs/src/pages/components/buttons/ButtonBase.js +++ b/docs/src/pages/components/buttons/ButtonBase.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import ButtonBase from '@mui/material/ButtonBase'; +import Typography from '@mui/material/Typography'; const images = [ { diff --git a/docs/src/pages/components/buttons/ButtonBase.tsx b/docs/src/pages/components/buttons/ButtonBase.tsx index 1765cc1017c2d9..6c5ce32ce53c6f 100644 --- a/docs/src/pages/components/buttons/ButtonBase.tsx +++ b/docs/src/pages/components/buttons/ButtonBase.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import ButtonBase from '@mui/material/ButtonBase'; +import Typography from '@mui/material/Typography'; const images = [ { diff --git a/docs/src/pages/components/buttons/ButtonSizes.js b/docs/src/pages/components/buttons/ButtonSizes.js index a3c510836ff525..b2dfaa0d39d6d0 100644 --- a/docs/src/pages/components/buttons/ButtonSizes.js +++ b/docs/src/pages/components/buttons/ButtonSizes.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; export default function ButtonSizes() { return ( diff --git a/docs/src/pages/components/buttons/ButtonSizes.tsx b/docs/src/pages/components/buttons/ButtonSizes.tsx index a3c510836ff525..b2dfaa0d39d6d0 100644 --- a/docs/src/pages/components/buttons/ButtonSizes.tsx +++ b/docs/src/pages/components/buttons/ButtonSizes.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; export default function ButtonSizes() { return ( diff --git a/docs/src/pages/components/buttons/ColorButtons.js b/docs/src/pages/components/buttons/ColorButtons.js index 3ebe9c6dce08ca..9e13c63755003e 100644 --- a/docs/src/pages/components/buttons/ColorButtons.js +++ b/docs/src/pages/components/buttons/ColorButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; export default function ColorButtons() { return ( diff --git a/docs/src/pages/components/buttons/ColorButtons.tsx b/docs/src/pages/components/buttons/ColorButtons.tsx index 3ebe9c6dce08ca..9e13c63755003e 100644 --- a/docs/src/pages/components/buttons/ColorButtons.tsx +++ b/docs/src/pages/components/buttons/ColorButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; export default function ColorButtons() { return ( diff --git a/docs/src/pages/components/buttons/ContainedButtons.js b/docs/src/pages/components/buttons/ContainedButtons.js index f861c48084543a..f6ee5f5ed1d4fc 100644 --- a/docs/src/pages/components/buttons/ContainedButtons.js +++ b/docs/src/pages/components/buttons/ContainedButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function ContainedButtons() { return ( diff --git a/docs/src/pages/components/buttons/ContainedButtons.tsx b/docs/src/pages/components/buttons/ContainedButtons.tsx index f861c48084543a..f6ee5f5ed1d4fc 100644 --- a/docs/src/pages/components/buttons/ContainedButtons.tsx +++ b/docs/src/pages/components/buttons/ContainedButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function ContainedButtons() { return ( diff --git a/docs/src/pages/components/buttons/CustomizedButtons.js b/docs/src/pages/components/buttons/CustomizedButtons.js index 881840696335e0..cf5616057f3e4e 100644 --- a/docs/src/pages/components/buttons/CustomizedButtons.js +++ b/docs/src/pages/components/buttons/CustomizedButtons.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; -import { purple } from '@material-ui/core/colors'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; +import { purple } from '@mui/material/colors'; const BootstrapButton = styled(Button)({ boxShadow: 'none', diff --git a/docs/src/pages/components/buttons/CustomizedButtons.tsx b/docs/src/pages/components/buttons/CustomizedButtons.tsx index 9d0e99993c3146..1be36f3f0ab3bb 100644 --- a/docs/src/pages/components/buttons/CustomizedButtons.tsx +++ b/docs/src/pages/components/buttons/CustomizedButtons.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button, { ButtonProps } from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; -import { purple } from '@material-ui/core/colors'; +import { styled } from '@mui/material/styles'; +import Button, { ButtonProps } from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; +import { purple } from '@mui/material/colors'; const BootstrapButton = styled(Button)({ boxShadow: 'none', diff --git a/docs/src/pages/components/buttons/DisableElevation.js b/docs/src/pages/components/buttons/DisableElevation.js index 9247582bc1d604..ba2f63127dab8d 100644 --- a/docs/src/pages/components/buttons/DisableElevation.js +++ b/docs/src/pages/components/buttons/DisableElevation.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; export default function DisableElevation() { return ( diff --git a/docs/src/pages/components/buttons/DisableElevation.tsx b/docs/src/pages/components/buttons/DisableElevation.tsx index 9247582bc1d604..ba2f63127dab8d 100644 --- a/docs/src/pages/components/buttons/DisableElevation.tsx +++ b/docs/src/pages/components/buttons/DisableElevation.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; export default function DisableElevation() { return ( diff --git a/docs/src/pages/components/buttons/IconButtonColors.js b/docs/src/pages/components/buttons/IconButtonColors.js index 524c9c76806c26..bbc99af8d19cac 100644 --- a/docs/src/pages/components/buttons/IconButtonColors.js +++ b/docs/src/pages/components/buttons/IconButtonColors.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import IconButton from '@material-ui/core/IconButton'; -import Fingerprint from '@material-ui/icons/Fingerprint'; +import Stack from '@mui/material/Stack'; +import IconButton from '@mui/material/IconButton'; +import Fingerprint from '@mui/icons-material/Fingerprint'; export default function IconButtonColors() { return ( diff --git a/docs/src/pages/components/buttons/IconButtonColors.tsx b/docs/src/pages/components/buttons/IconButtonColors.tsx index 524c9c76806c26..bbc99af8d19cac 100644 --- a/docs/src/pages/components/buttons/IconButtonColors.tsx +++ b/docs/src/pages/components/buttons/IconButtonColors.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import IconButton from '@material-ui/core/IconButton'; -import Fingerprint from '@material-ui/icons/Fingerprint'; +import Stack from '@mui/material/Stack'; +import IconButton from '@mui/material/IconButton'; +import Fingerprint from '@mui/icons-material/Fingerprint'; export default function IconButtonColors() { return ( diff --git a/docs/src/pages/components/buttons/IconButtonSizes.js b/docs/src/pages/components/buttons/IconButtonSizes.js index 601cc1c457a2f9..9a62589d6b2386 100644 --- a/docs/src/pages/components/buttons/IconButtonSizes.js +++ b/docs/src/pages/components/buttons/IconButtonSizes.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import IconButton from '@material-ui/core/IconButton'; -import DeleteIcon from '@material-ui/icons/Delete'; +import Stack from '@mui/material/Stack'; +import IconButton from '@mui/material/IconButton'; +import DeleteIcon from '@mui/icons-material/Delete'; export default function IconButtonSizes() { return ( diff --git a/docs/src/pages/components/buttons/IconButtonSizes.tsx b/docs/src/pages/components/buttons/IconButtonSizes.tsx index 601cc1c457a2f9..9a62589d6b2386 100644 --- a/docs/src/pages/components/buttons/IconButtonSizes.tsx +++ b/docs/src/pages/components/buttons/IconButtonSizes.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import IconButton from '@material-ui/core/IconButton'; -import DeleteIcon from '@material-ui/icons/Delete'; +import Stack from '@mui/material/Stack'; +import IconButton from '@mui/material/IconButton'; +import DeleteIcon from '@mui/icons-material/Delete'; export default function IconButtonSizes() { return ( diff --git a/docs/src/pages/components/buttons/IconButtons.js b/docs/src/pages/components/buttons/IconButtons.js index b52db1cb4c11f0..91215b101d24b4 100644 --- a/docs/src/pages/components/buttons/IconButtons.js +++ b/docs/src/pages/components/buttons/IconButtons.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Stack from '@material-ui/core/Stack'; -import DeleteIcon from '@material-ui/icons/Delete'; -import AlarmIcon from '@material-ui/icons/Alarm'; -import AddShoppingCartIcon from '@material-ui/icons/AddShoppingCart'; +import IconButton from '@mui/material/IconButton'; +import Stack from '@mui/material/Stack'; +import DeleteIcon from '@mui/icons-material/Delete'; +import AlarmIcon from '@mui/icons-material/Alarm'; +import AddShoppingCartIcon from '@mui/icons-material/AddShoppingCart'; export default function IconButtons() { return ( diff --git a/docs/src/pages/components/buttons/IconButtons.tsx b/docs/src/pages/components/buttons/IconButtons.tsx index b52db1cb4c11f0..91215b101d24b4 100644 --- a/docs/src/pages/components/buttons/IconButtons.tsx +++ b/docs/src/pages/components/buttons/IconButtons.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Stack from '@material-ui/core/Stack'; -import DeleteIcon from '@material-ui/icons/Delete'; -import AlarmIcon from '@material-ui/icons/Alarm'; -import AddShoppingCartIcon from '@material-ui/icons/AddShoppingCart'; +import IconButton from '@mui/material/IconButton'; +import Stack from '@mui/material/Stack'; +import DeleteIcon from '@mui/icons-material/Delete'; +import AlarmIcon from '@mui/icons-material/Alarm'; +import AddShoppingCartIcon from '@mui/icons-material/AddShoppingCart'; export default function IconButtons() { return ( diff --git a/docs/src/pages/components/buttons/IconLabelButtons.js b/docs/src/pages/components/buttons/IconLabelButtons.js index 4259e743a3f9b8..b2bcb32b15656e 100644 --- a/docs/src/pages/components/buttons/IconLabelButtons.js +++ b/docs/src/pages/components/buttons/IconLabelButtons.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import DeleteIcon from '@material-ui/icons/Delete'; -import SendIcon from '@material-ui/icons/Send'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import DeleteIcon from '@mui/icons-material/Delete'; +import SendIcon from '@mui/icons-material/Send'; +import Stack from '@mui/material/Stack'; export default function IconLabelButtons() { return ( diff --git a/docs/src/pages/components/buttons/IconLabelButtons.tsx b/docs/src/pages/components/buttons/IconLabelButtons.tsx index 4259e743a3f9b8..b2bcb32b15656e 100644 --- a/docs/src/pages/components/buttons/IconLabelButtons.tsx +++ b/docs/src/pages/components/buttons/IconLabelButtons.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import DeleteIcon from '@material-ui/icons/Delete'; -import SendIcon from '@material-ui/icons/Send'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import DeleteIcon from '@mui/icons-material/Delete'; +import SendIcon from '@mui/icons-material/Send'; +import Stack from '@mui/material/Stack'; export default function IconLabelButtons() { return ( diff --git a/docs/src/pages/components/buttons/LoadingButtons.js b/docs/src/pages/components/buttons/LoadingButtons.js index 37a78f8d1df82b..085a0df9a2a34f 100644 --- a/docs/src/pages/components/buttons/LoadingButtons.js +++ b/docs/src/pages/components/buttons/LoadingButtons.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import LoadingButton from '@material-ui/lab/LoadingButton'; -import SaveIcon from '@material-ui/icons/Save'; -import Stack from '@material-ui/core/Stack'; +import LoadingButton from '@mui/lab/LoadingButton'; +import SaveIcon from '@mui/icons-material/Save'; +import Stack from '@mui/material/Stack'; export default function LoadingButtons() { return ( diff --git a/docs/src/pages/components/buttons/LoadingButtons.tsx b/docs/src/pages/components/buttons/LoadingButtons.tsx index 37a78f8d1df82b..085a0df9a2a34f 100644 --- a/docs/src/pages/components/buttons/LoadingButtons.tsx +++ b/docs/src/pages/components/buttons/LoadingButtons.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import LoadingButton from '@material-ui/lab/LoadingButton'; -import SaveIcon from '@material-ui/icons/Save'; -import Stack from '@material-ui/core/Stack'; +import LoadingButton from '@mui/lab/LoadingButton'; +import SaveIcon from '@mui/icons-material/Save'; +import Stack from '@mui/material/Stack'; export default function LoadingButtons() { return ( diff --git a/docs/src/pages/components/buttons/LoadingButtonsTransition.js b/docs/src/pages/components/buttons/LoadingButtonsTransition.js index 71dc13c99941f6..88bb9e1843adb5 100644 --- a/docs/src/pages/components/buttons/LoadingButtonsTransition.js +++ b/docs/src/pages/components/buttons/LoadingButtonsTransition.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import LoadingButton from '@material-ui/lab/LoadingButton'; -import Box from '@material-ui/core/Box'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Switch from '@material-ui/core/Switch'; -import SaveIcon from '@material-ui/icons/Save'; -import SendIcon from '@material-ui/icons/Send'; +import LoadingButton from '@mui/lab/LoadingButton'; +import Box from '@mui/material/Box'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Switch from '@mui/material/Switch'; +import SaveIcon from '@mui/icons-material/Save'; +import SendIcon from '@mui/icons-material/Send'; export default function LoadingButtonsTransition() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/buttons/LoadingButtonsTransition.tsx b/docs/src/pages/components/buttons/LoadingButtonsTransition.tsx index 71dc13c99941f6..88bb9e1843adb5 100644 --- a/docs/src/pages/components/buttons/LoadingButtonsTransition.tsx +++ b/docs/src/pages/components/buttons/LoadingButtonsTransition.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import LoadingButton from '@material-ui/lab/LoadingButton'; -import Box from '@material-ui/core/Box'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Switch from '@material-ui/core/Switch'; -import SaveIcon from '@material-ui/icons/Save'; -import SendIcon from '@material-ui/icons/Send'; +import LoadingButton from '@mui/lab/LoadingButton'; +import Box from '@mui/material/Box'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Switch from '@mui/material/Switch'; +import SaveIcon from '@mui/icons-material/Save'; +import SendIcon from '@mui/icons-material/Send'; export default function LoadingButtonsTransition() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/buttons/OutlinedButtons.js b/docs/src/pages/components/buttons/OutlinedButtons.js index 6f2f4b07043999..4c322ddf9b543d 100644 --- a/docs/src/pages/components/buttons/OutlinedButtons.js +++ b/docs/src/pages/components/buttons/OutlinedButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function OutlinedButtons() { return ( diff --git a/docs/src/pages/components/buttons/OutlinedButtons.tsx b/docs/src/pages/components/buttons/OutlinedButtons.tsx index 6f2f4b07043999..4c322ddf9b543d 100644 --- a/docs/src/pages/components/buttons/OutlinedButtons.tsx +++ b/docs/src/pages/components/buttons/OutlinedButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function OutlinedButtons() { return ( diff --git a/docs/src/pages/components/buttons/TextButtons.js b/docs/src/pages/components/buttons/TextButtons.js index 99b2d43f2c8c79..a1b001cdd59c01 100644 --- a/docs/src/pages/components/buttons/TextButtons.js +++ b/docs/src/pages/components/buttons/TextButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function TextButtons() { return ( diff --git a/docs/src/pages/components/buttons/TextButtons.tsx b/docs/src/pages/components/buttons/TextButtons.tsx index 99b2d43f2c8c79..a1b001cdd59c01 100644 --- a/docs/src/pages/components/buttons/TextButtons.tsx +++ b/docs/src/pages/components/buttons/TextButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; export default function TextButtons() { return ( diff --git a/docs/src/pages/components/buttons/UnstyledButtonCustom.js b/docs/src/pages/components/buttons/UnstyledButtonCustom.js index 7b2ed9fb3c6323..a495337fcdc9e9 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonCustom.js +++ b/docs/src/pages/components/buttons/UnstyledButtonCustom.js @@ -1,10 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import ButtonUnstyled, { - buttonUnstyledClasses, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { ThemeProvider, createTheme } from '@material-ui/core/styles'; -import { styled, alpha } from '@material-ui/system'; +import ButtonUnstyled, { buttonUnstyledClasses } from '@mui/core/ButtonUnstyled'; +import { ThemeProvider, createTheme } from '@mui/material/styles'; +import { styled, alpha } from '@mui/system'; const ButtonRoot = React.forwardRef(function ButtonRoot(props, ref) { const { children, ...other } = props; diff --git a/docs/src/pages/components/buttons/UnstyledButtonCustom.tsx b/docs/src/pages/components/buttons/UnstyledButtonCustom.tsx index 27ad7605c17bc2..fec5e5e68dc436 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonCustom.tsx +++ b/docs/src/pages/components/buttons/UnstyledButtonCustom.tsx @@ -2,9 +2,9 @@ import * as React from 'react'; import ButtonUnstyled, { ButtonUnstyledProps, buttonUnstyledClasses, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { Theme, ThemeProvider, createTheme } from '@material-ui/core/styles'; -import { styled, alpha } from '@material-ui/system'; +} from '@mui/core/ButtonUnstyled'; +import { Theme, ThemeProvider, createTheme } from '@mui/material/styles'; +import { styled, alpha } from '@mui/system'; const ButtonRoot = React.forwardRef(function ButtonRoot( props: React.PropsWithChildren<{}>, diff --git a/docs/src/pages/components/buttons/UnstyledButtonsSimple.js b/docs/src/pages/components/buttons/UnstyledButtonsSimple.js index 1ec111b8f335f5..226938af31d218 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonsSimple.js +++ b/docs/src/pages/components/buttons/UnstyledButtonsSimple.js @@ -1,9 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import ButtonUnstyled, { - buttonUnstyledClasses, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +import Stack from '@mui/material/Stack'; +import ButtonUnstyled, { buttonUnstyledClasses } from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('button')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/UnstyledButtonsSimple.tsx b/docs/src/pages/components/buttons/UnstyledButtonsSimple.tsx index c9ad71bc8325ea..54f4a31716dbfb 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonsSimple.tsx +++ b/docs/src/pages/components/buttons/UnstyledButtonsSimple.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; +import Stack from '@mui/material/Stack'; import ButtonUnstyled, { buttonUnstyledClasses, ButtonUnstyledProps, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +} from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('button')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/UnstyledButtonsSpan.js b/docs/src/pages/components/buttons/UnstyledButtonsSpan.js index 57ec7316e393de..ca70139e6e254f 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonsSpan.js +++ b/docs/src/pages/components/buttons/UnstyledButtonsSpan.js @@ -1,9 +1,7 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import ButtonUnstyled, { - buttonUnstyledClasses, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +import Stack from '@mui/material/Stack'; +import ButtonUnstyled, { buttonUnstyledClasses } from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('span')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/UnstyledButtonsSpan.tsx b/docs/src/pages/components/buttons/UnstyledButtonsSpan.tsx index ed73fcaa9eb1ba..782c077fc9f21d 100644 --- a/docs/src/pages/components/buttons/UnstyledButtonsSpan.tsx +++ b/docs/src/pages/components/buttons/UnstyledButtonsSpan.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; +import Stack from '@mui/material/Stack'; import ButtonUnstyled, { ButtonUnstyledProps, buttonUnstyledClasses, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +} from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('span')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/UploadButtons.js b/docs/src/pages/components/buttons/UploadButtons.js index 1a2b9b7f4e8868..31e6732803e6c3 100644 --- a/docs/src/pages/components/buttons/UploadButtons.js +++ b/docs/src/pages/components/buttons/UploadButtons.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import PhotoCamera from '@material-ui/icons/PhotoCamera'; -import Stack from '@material-ui/core/Stack'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import PhotoCamera from '@mui/icons-material/PhotoCamera'; +import Stack from '@mui/material/Stack'; const Input = styled('input')({ display: 'none', diff --git a/docs/src/pages/components/buttons/UploadButtons.tsx b/docs/src/pages/components/buttons/UploadButtons.tsx index 1a2b9b7f4e8868..31e6732803e6c3 100644 --- a/docs/src/pages/components/buttons/UploadButtons.tsx +++ b/docs/src/pages/components/buttons/UploadButtons.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import PhotoCamera from '@material-ui/icons/PhotoCamera'; -import Stack from '@material-ui/core/Stack'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import PhotoCamera from '@mui/icons-material/PhotoCamera'; +import Stack from '@mui/material/Stack'; const Input = styled('input')({ display: 'none', diff --git a/docs/src/pages/components/buttons/UseButton.js b/docs/src/pages/components/buttons/UseButton.js index 3bc11b9d64dde5..c9645fde94c0b9 100644 --- a/docs/src/pages/components/buttons/UseButton.js +++ b/docs/src/pages/components/buttons/UseButton.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import clsx from 'clsx'; -import Stack from '@material-ui/core/Stack'; -import { useButton } from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +import Stack from '@mui/material/Stack'; +import { useButton } from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('button')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/UseButton.tsx b/docs/src/pages/components/buttons/UseButton.tsx index 27eec35e71f0d7..bc7fdbd03591f3 100644 --- a/docs/src/pages/components/buttons/UseButton.tsx +++ b/docs/src/pages/components/buttons/UseButton.tsx @@ -1,11 +1,8 @@ import * as React from 'react'; import clsx from 'clsx'; -import Stack from '@material-ui/core/Stack'; -import { - ButtonUnstyledProps, - useButton, -} from '@material-ui/unstyled/ButtonUnstyled'; -import { styled } from '@material-ui/system'; +import Stack from '@mui/material/Stack'; +import { ButtonUnstyledProps, useButton } from '@mui/core/ButtonUnstyled'; +import { styled } from '@mui/system'; const CustomButtonRoot = styled('button')(` background-color: #007fff; diff --git a/docs/src/pages/components/buttons/buttons.md b/docs/src/pages/components/buttons/buttons.md index 6791114fb76470..32d08c70d2d357 100644 --- a/docs/src/pages/components/buttons/buttons.md +++ b/docs/src/pages/components/buttons/buttons.md @@ -187,7 +187,7 @@ The button also comes with an unstyled version. It's ideal for doing heavy custo ### Unstyled component ```js -import ButtonUnstyled from '@material-ui/unstyled/ButtonUnstyled'; +import ButtonUnstyled from '@mui/core/ButtonUnstyled'; ``` {{"demo": "pages/components/buttons/UnstyledButtonsSimple.js"}} @@ -212,7 +212,7 @@ SVG elements, even with complex structure, are equally acceptable. ### useButton hook ```js -import { useButton } from '@material-ui/unstyled/ButtonUnstyled'; +import { useButton } from '@mui/core/ButtonUnstyled'; ``` If you need to use Button's functionality in another component, you can use the `useButton` hook. diff --git a/docs/src/pages/components/cards/ActionAreaCard.js b/docs/src/pages/components/cards/ActionAreaCard.js index 1e939bc50db5cd..9456606e5b58d8 100644 --- a/docs/src/pages/components/cards/ActionAreaCard.js +++ b/docs/src/pages/components/cards/ActionAreaCard.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Card from '@material-ui/core/Card'; -import CardContent from '@material-ui/core/CardContent'; -import CardMedia from '@material-ui/core/CardMedia'; -import Typography from '@material-ui/core/Typography'; -import { CardActionArea } from '@material-ui/core'; +import Card from '@mui/material/Card'; +import CardContent from '@mui/material/CardContent'; +import CardMedia from '@mui/material/CardMedia'; +import Typography from '@mui/material/Typography'; +import { CardActionArea } from '@mui/material'; export default function ActionAreaCard() { return ( diff --git a/docs/src/pages/components/cards/ActionAreaCard.tsx b/docs/src/pages/components/cards/ActionAreaCard.tsx index 1e939bc50db5cd..9456606e5b58d8 100644 --- a/docs/src/pages/components/cards/ActionAreaCard.tsx +++ b/docs/src/pages/components/cards/ActionAreaCard.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Card from '@material-ui/core/Card'; -import CardContent from '@material-ui/core/CardContent'; -import CardMedia from '@material-ui/core/CardMedia'; -import Typography from '@material-ui/core/Typography'; -import { CardActionArea } from '@material-ui/core'; +import Card from '@mui/material/Card'; +import CardContent from '@mui/material/CardContent'; +import CardMedia from '@mui/material/CardMedia'; +import Typography from '@mui/material/Typography'; +import { CardActionArea } from '@mui/material'; export default function ActionAreaCard() { return ( diff --git a/docs/src/pages/components/cards/BasicCard.js b/docs/src/pages/components/cards/BasicCard.js index 8be56a2ca35ea7..a3ad87cf055078 100644 --- a/docs/src/pages/components/cards/BasicCard.js +++ b/docs/src/pages/components/cards/BasicCard.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Card from '@material-ui/core/Card'; -import CardActions from '@material-ui/core/CardActions'; -import CardContent from '@material-ui/core/CardContent'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import CardActions from '@mui/material/CardActions'; +import CardContent from '@mui/material/CardContent'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; const bull = ( { const { expand, ...other } = props; diff --git a/docs/src/pages/components/cards/RecipeReviewCard.tsx b/docs/src/pages/components/cards/RecipeReviewCard.tsx index d1ce0df12a1a1e..74254603e48943 100644 --- a/docs/src/pages/components/cards/RecipeReviewCard.tsx +++ b/docs/src/pages/components/cards/RecipeReviewCard.tsx @@ -1,19 +1,19 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Card from '@material-ui/core/Card'; -import CardHeader from '@material-ui/core/CardHeader'; -import CardMedia from '@material-ui/core/CardMedia'; -import CardContent from '@material-ui/core/CardContent'; -import CardActions from '@material-ui/core/CardActions'; -import Collapse from '@material-ui/core/Collapse'; -import Avatar from '@material-ui/core/Avatar'; -import IconButton, { IconButtonProps } from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import { red } from '@material-ui/core/colors'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import ShareIcon from '@material-ui/icons/Share'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; +import { styled } from '@mui/material/styles'; +import Card from '@mui/material/Card'; +import CardHeader from '@mui/material/CardHeader'; +import CardMedia from '@mui/material/CardMedia'; +import CardContent from '@mui/material/CardContent'; +import CardActions from '@mui/material/CardActions'; +import Collapse from '@mui/material/Collapse'; +import Avatar from '@mui/material/Avatar'; +import IconButton, { IconButtonProps } from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import { red } from '@mui/material/colors'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import ShareIcon from '@mui/icons-material/Share'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; interface ExpandMoreProps extends IconButtonProps { expand: boolean; diff --git a/docs/src/pages/components/checkboxes/CheckboxLabels.js b/docs/src/pages/components/checkboxes/CheckboxLabels.js index 9a96fbbf0bf536..78ef5d8319ce48 100644 --- a/docs/src/pages/components/checkboxes/CheckboxLabels.js +++ b/docs/src/pages/components/checkboxes/CheckboxLabels.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Checkbox from '@material-ui/core/Checkbox'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Checkbox from '@mui/material/Checkbox'; export default function CheckboxLabels() { return ( diff --git a/docs/src/pages/components/checkboxes/CheckboxLabels.tsx b/docs/src/pages/components/checkboxes/CheckboxLabels.tsx index 9a96fbbf0bf536..78ef5d8319ce48 100644 --- a/docs/src/pages/components/checkboxes/CheckboxLabels.tsx +++ b/docs/src/pages/components/checkboxes/CheckboxLabels.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Checkbox from '@material-ui/core/Checkbox'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Checkbox from '@mui/material/Checkbox'; export default function CheckboxLabels() { return ( diff --git a/docs/src/pages/components/checkboxes/Checkboxes.js b/docs/src/pages/components/checkboxes/Checkboxes.js index 161536e57c263d..e6f27ab38effc1 100644 --- a/docs/src/pages/components/checkboxes/Checkboxes.js +++ b/docs/src/pages/components/checkboxes/Checkboxes.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/Checkboxes.tsx b/docs/src/pages/components/checkboxes/Checkboxes.tsx index 161536e57c263d..e6f27ab38effc1 100644 --- a/docs/src/pages/components/checkboxes/Checkboxes.tsx +++ b/docs/src/pages/components/checkboxes/Checkboxes.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/CheckboxesGroup.js b/docs/src/pages/components/checkboxes/CheckboxesGroup.js index d2bf6f14b68c30..6c4b220ae09480 100644 --- a/docs/src/pages/components/checkboxes/CheckboxesGroup.js +++ b/docs/src/pages/components/checkboxes/CheckboxesGroup.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import Checkbox from '@material-ui/core/Checkbox'; +import Box from '@mui/material/Box'; +import FormLabel from '@mui/material/FormLabel'; +import FormControl from '@mui/material/FormControl'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormHelperText from '@mui/material/FormHelperText'; +import Checkbox from '@mui/material/Checkbox'; export default function CheckboxesGroup() { const [state, setState] = React.useState({ diff --git a/docs/src/pages/components/checkboxes/CheckboxesGroup.tsx b/docs/src/pages/components/checkboxes/CheckboxesGroup.tsx index 6102a0fa7c44fe..ed6240a9606a74 100644 --- a/docs/src/pages/components/checkboxes/CheckboxesGroup.tsx +++ b/docs/src/pages/components/checkboxes/CheckboxesGroup.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import Checkbox from '@material-ui/core/Checkbox'; +import Box from '@mui/material/Box'; +import FormLabel from '@mui/material/FormLabel'; +import FormControl from '@mui/material/FormControl'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormHelperText from '@mui/material/FormHelperText'; +import Checkbox from '@mui/material/Checkbox'; export default function CheckboxesGroup() { const [state, setState] = React.useState({ diff --git a/docs/src/pages/components/checkboxes/ColorCheckboxes.js b/docs/src/pages/components/checkboxes/ColorCheckboxes.js index 3d7ad2d66923f1..795dbdddbde043 100644 --- a/docs/src/pages/components/checkboxes/ColorCheckboxes.js +++ b/docs/src/pages/components/checkboxes/ColorCheckboxes.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { pink } from '@material-ui/core/colors'; -import Checkbox from '@material-ui/core/Checkbox'; +import { pink } from '@mui/material/colors'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/ColorCheckboxes.tsx b/docs/src/pages/components/checkboxes/ColorCheckboxes.tsx index 3d7ad2d66923f1..795dbdddbde043 100644 --- a/docs/src/pages/components/checkboxes/ColorCheckboxes.tsx +++ b/docs/src/pages/components/checkboxes/ColorCheckboxes.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { pink } from '@material-ui/core/colors'; -import Checkbox from '@material-ui/core/Checkbox'; +import { pink } from '@mui/material/colors'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/ControlledCheckbox.js b/docs/src/pages/components/checkboxes/ControlledCheckbox.js index 86db09612ef01b..d6ee12907ddb56 100644 --- a/docs/src/pages/components/checkboxes/ControlledCheckbox.js +++ b/docs/src/pages/components/checkboxes/ControlledCheckbox.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; export default function ControlledCheckbox() { const [checked, setChecked] = React.useState(true); diff --git a/docs/src/pages/components/checkboxes/ControlledCheckbox.tsx b/docs/src/pages/components/checkboxes/ControlledCheckbox.tsx index c94ef4108b2605..a983d5fe393bad 100644 --- a/docs/src/pages/components/checkboxes/ControlledCheckbox.tsx +++ b/docs/src/pages/components/checkboxes/ControlledCheckbox.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; export default function ControlledCheckbox() { const [checked, setChecked] = React.useState(true); diff --git a/docs/src/pages/components/checkboxes/CustomizedCheckbox.js b/docs/src/pages/components/checkboxes/CustomizedCheckbox.js index ae1f8506379a96..ee2b29629120a3 100644 --- a/docs/src/pages/components/checkboxes/CustomizedCheckbox.js +++ b/docs/src/pages/components/checkboxes/CustomizedCheckbox.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Checkbox from '@material-ui/core/Checkbox'; +import { styled } from '@mui/material/styles'; +import Checkbox from '@mui/material/Checkbox'; const BpIcon = styled('span')(({ theme }) => ({ borderRadius: 3, diff --git a/docs/src/pages/components/checkboxes/CustomizedCheckbox.tsx b/docs/src/pages/components/checkboxes/CustomizedCheckbox.tsx index 0150c3d1e64f61..6c3d0e4a846168 100644 --- a/docs/src/pages/components/checkboxes/CustomizedCheckbox.tsx +++ b/docs/src/pages/components/checkboxes/CustomizedCheckbox.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Checkbox, { CheckboxProps } from '@material-ui/core/Checkbox'; +import { styled } from '@mui/material/styles'; +import Checkbox, { CheckboxProps } from '@mui/material/Checkbox'; const BpIcon = styled('span')(({ theme }) => ({ borderRadius: 3, diff --git a/docs/src/pages/components/checkboxes/FormControlLabelPosition.js b/docs/src/pages/components/checkboxes/FormControlLabelPosition.js index 976f99415cdd60..d01816bba2e8d1 100644 --- a/docs/src/pages/components/checkboxes/FormControlLabelPosition.js +++ b/docs/src/pages/components/checkboxes/FormControlLabelPosition.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Checkbox from '@mui/material/Checkbox'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function FormControlLabelPosition() { return ( diff --git a/docs/src/pages/components/checkboxes/FormControlLabelPosition.tsx b/docs/src/pages/components/checkboxes/FormControlLabelPosition.tsx index 976f99415cdd60..d01816bba2e8d1 100644 --- a/docs/src/pages/components/checkboxes/FormControlLabelPosition.tsx +++ b/docs/src/pages/components/checkboxes/FormControlLabelPosition.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Checkbox from '@mui/material/Checkbox'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function FormControlLabelPosition() { return ( diff --git a/docs/src/pages/components/checkboxes/IconCheckboxes.js b/docs/src/pages/components/checkboxes/IconCheckboxes.js index 35dea677bb0fba..2b16bbda6d2c21 100644 --- a/docs/src/pages/components/checkboxes/IconCheckboxes.js +++ b/docs/src/pages/components/checkboxes/IconCheckboxes.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import FavoriteBorder from '@material-ui/icons/FavoriteBorder'; -import Favorite from '@material-ui/icons/Favorite'; -import BookmarkBorderIcon from '@material-ui/icons/BookmarkBorder'; -import BookmarkIcon from '@material-ui/icons/Bookmark'; +import Checkbox from '@mui/material/Checkbox'; +import FavoriteBorder from '@mui/icons-material/FavoriteBorder'; +import Favorite from '@mui/icons-material/Favorite'; +import BookmarkBorderIcon from '@mui/icons-material/BookmarkBorder'; +import BookmarkIcon from '@mui/icons-material/Bookmark'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/IconCheckboxes.tsx b/docs/src/pages/components/checkboxes/IconCheckboxes.tsx index 35dea677bb0fba..2b16bbda6d2c21 100644 --- a/docs/src/pages/components/checkboxes/IconCheckboxes.tsx +++ b/docs/src/pages/components/checkboxes/IconCheckboxes.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; -import FavoriteBorder from '@material-ui/icons/FavoriteBorder'; -import Favorite from '@material-ui/icons/Favorite'; -import BookmarkBorderIcon from '@material-ui/icons/BookmarkBorder'; -import BookmarkIcon from '@material-ui/icons/Bookmark'; +import Checkbox from '@mui/material/Checkbox'; +import FavoriteBorder from '@mui/icons-material/FavoriteBorder'; +import Favorite from '@mui/icons-material/Favorite'; +import BookmarkBorderIcon from '@mui/icons-material/BookmarkBorder'; +import BookmarkIcon from '@mui/icons-material/Bookmark'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/IndeterminateCheckbox.js b/docs/src/pages/components/checkboxes/IndeterminateCheckbox.js index 5003bb7139eabc..3ada61d101d47f 100644 --- a/docs/src/pages/components/checkboxes/IndeterminateCheckbox.js +++ b/docs/src/pages/components/checkboxes/IndeterminateCheckbox.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Checkbox from '@material-ui/core/Checkbox'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Checkbox from '@mui/material/Checkbox'; +import FormControlLabel from '@mui/material/FormControlLabel'; export default function IndeterminateCheckbox() { const [checked, setChecked] = React.useState([true, false]); diff --git a/docs/src/pages/components/checkboxes/IndeterminateCheckbox.tsx b/docs/src/pages/components/checkboxes/IndeterminateCheckbox.tsx index 97330b47350d07..b431061da69969 100644 --- a/docs/src/pages/components/checkboxes/IndeterminateCheckbox.tsx +++ b/docs/src/pages/components/checkboxes/IndeterminateCheckbox.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Checkbox from '@material-ui/core/Checkbox'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Checkbox from '@mui/material/Checkbox'; +import FormControlLabel from '@mui/material/FormControlLabel'; export default function IndeterminateCheckbox() { const [checked, setChecked] = React.useState([true, false]); diff --git a/docs/src/pages/components/checkboxes/SizeCheckboxes.js b/docs/src/pages/components/checkboxes/SizeCheckboxes.js index 4b36cc7969286f..cc31daf7ae74b0 100644 --- a/docs/src/pages/components/checkboxes/SizeCheckboxes.js +++ b/docs/src/pages/components/checkboxes/SizeCheckboxes.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/checkboxes/SizeCheckboxes.tsx b/docs/src/pages/components/checkboxes/SizeCheckboxes.tsx index 4b36cc7969286f..cc31daf7ae74b0 100644 --- a/docs/src/pages/components/checkboxes/SizeCheckboxes.tsx +++ b/docs/src/pages/components/checkboxes/SizeCheckboxes.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; const label = { inputProps: { 'aria-label': 'Checkbox demo' } }; diff --git a/docs/src/pages/components/chips/AvatarChips.js b/docs/src/pages/components/chips/AvatarChips.js index 1ff97602eb65fc..50a9eb5aaca8c4 100644 --- a/docs/src/pages/components/chips/AvatarChips.js +++ b/docs/src/pages/components/chips/AvatarChips.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function AvatarChips() { return ( diff --git a/docs/src/pages/components/chips/AvatarChips.tsx b/docs/src/pages/components/chips/AvatarChips.tsx index 1ff97602eb65fc..50a9eb5aaca8c4 100644 --- a/docs/src/pages/components/chips/AvatarChips.tsx +++ b/docs/src/pages/components/chips/AvatarChips.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Avatar from '@material-ui/core/Avatar'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Avatar from '@mui/material/Avatar'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function AvatarChips() { return ( diff --git a/docs/src/pages/components/chips/BasicChips.js b/docs/src/pages/components/chips/BasicChips.js index 8d39ab8db861ec..7fc712f4eef6d3 100644 --- a/docs/src/pages/components/chips/BasicChips.js +++ b/docs/src/pages/components/chips/BasicChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function BasicChips() { return ( diff --git a/docs/src/pages/components/chips/BasicChips.tsx b/docs/src/pages/components/chips/BasicChips.tsx index 8d39ab8db861ec..7fc712f4eef6d3 100644 --- a/docs/src/pages/components/chips/BasicChips.tsx +++ b/docs/src/pages/components/chips/BasicChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function BasicChips() { return ( diff --git a/docs/src/pages/components/chips/ChipsArray.js b/docs/src/pages/components/chips/ChipsArray.js index c39fb2732f96e1..8accf7d5a8429f 100644 --- a/docs/src/pages/components/chips/ChipsArray.js +++ b/docs/src/pages/components/chips/ChipsArray.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Chip from '@material-ui/core/Chip'; -import Paper from '@material-ui/core/Paper'; -import TagFacesIcon from '@material-ui/icons/TagFaces'; +import { styled } from '@mui/material/styles'; +import Chip from '@mui/material/Chip'; +import Paper from '@mui/material/Paper'; +import TagFacesIcon from '@mui/icons-material/TagFaces'; const ListItem = styled('li')(({ theme }) => ({ margin: theme.spacing(0.5), diff --git a/docs/src/pages/components/chips/ChipsArray.tsx b/docs/src/pages/components/chips/ChipsArray.tsx index 6ae5e65d5ed78f..4c58adeaaf0821 100644 --- a/docs/src/pages/components/chips/ChipsArray.tsx +++ b/docs/src/pages/components/chips/ChipsArray.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Chip from '@material-ui/core/Chip'; -import Paper from '@material-ui/core/Paper'; -import TagFacesIcon from '@material-ui/icons/TagFaces'; +import { styled } from '@mui/material/styles'; +import Chip from '@mui/material/Chip'; +import Paper from '@mui/material/Paper'; +import TagFacesIcon from '@mui/icons-material/TagFaces'; interface ChipData { key: number; diff --git a/docs/src/pages/components/chips/ChipsPlayground.js b/docs/src/pages/components/chips/ChipsPlayground.js index 76b65162ee3b65..8b68fa7a3051f4 100644 --- a/docs/src/pages/components/chips/ChipsPlayground.js +++ b/docs/src/pages/components/chips/ChipsPlayground.js @@ -1,15 +1,15 @@ import * as React from 'react'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import Grid from '@material-ui/core/Grid'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import Avatar from '@material-ui/core/Avatar'; -import Chip from '@material-ui/core/Chip'; -import FaceIcon from '@material-ui/icons/Face'; -import DoneIcon from '@material-ui/icons/Done'; +import Grid from '@mui/material/Grid'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import Avatar from '@mui/material/Avatar'; +import Chip from '@mui/material/Chip'; +import FaceIcon from '@mui/icons-material/Face'; +import DoneIcon from '@mui/icons-material/Done'; function ChipsPlayground() { const [state, setState] = React.useState({ diff --git a/docs/src/pages/components/chips/ClickeableAndDeleteableChips.js b/docs/src/pages/components/chips/ClickeableAndDeleteableChips.js index f87a59975564c3..25f5d95415f15f 100644 --- a/docs/src/pages/components/chips/ClickeableAndDeleteableChips.js +++ b/docs/src/pages/components/chips/ClickeableAndDeleteableChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableAndDeleteableChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/ClickeableAndDeleteableChips.tsx b/docs/src/pages/components/chips/ClickeableAndDeleteableChips.tsx index f87a59975564c3..25f5d95415f15f 100644 --- a/docs/src/pages/components/chips/ClickeableAndDeleteableChips.tsx +++ b/docs/src/pages/components/chips/ClickeableAndDeleteableChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableAndDeleteableChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/ClickeableChips.js b/docs/src/pages/components/chips/ClickeableChips.js index e02023e36cb41a..f53a5e2db85776 100644 --- a/docs/src/pages/components/chips/ClickeableChips.js +++ b/docs/src/pages/components/chips/ClickeableChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/ClickeableChips.tsx b/docs/src/pages/components/chips/ClickeableChips.tsx index e02023e36cb41a..f53a5e2db85776 100644 --- a/docs/src/pages/components/chips/ClickeableChips.tsx +++ b/docs/src/pages/components/chips/ClickeableChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/ClickeableLinkChips.js b/docs/src/pages/components/chips/ClickeableLinkChips.js index 7d7e2fba0e67a2..3c2b0456456ee9 100644 --- a/docs/src/pages/components/chips/ClickeableLinkChips.js +++ b/docs/src/pages/components/chips/ClickeableLinkChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableLinkChips() { return ( diff --git a/docs/src/pages/components/chips/ClickeableLinkChips.tsx b/docs/src/pages/components/chips/ClickeableLinkChips.tsx index 7d7e2fba0e67a2..3c2b0456456ee9 100644 --- a/docs/src/pages/components/chips/ClickeableLinkChips.tsx +++ b/docs/src/pages/components/chips/ClickeableLinkChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ClickeableLinkChips() { return ( diff --git a/docs/src/pages/components/chips/ColorChips.js b/docs/src/pages/components/chips/ColorChips.js index f337a5bf371618..4b45794a5ac34b 100644 --- a/docs/src/pages/components/chips/ColorChips.js +++ b/docs/src/pages/components/chips/ColorChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ColorChips() { return ( diff --git a/docs/src/pages/components/chips/ColorChips.tsx b/docs/src/pages/components/chips/ColorChips.tsx index f337a5bf371618..4b45794a5ac34b 100644 --- a/docs/src/pages/components/chips/ColorChips.tsx +++ b/docs/src/pages/components/chips/ColorChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function ColorChips() { return ( diff --git a/docs/src/pages/components/chips/CustomDeleteIconChips.js b/docs/src/pages/components/chips/CustomDeleteIconChips.js index 6fedf81a027727..9de50bf6f6137f 100644 --- a/docs/src/pages/components/chips/CustomDeleteIconChips.js +++ b/docs/src/pages/components/chips/CustomDeleteIconChips.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; -import DoneIcon from '@material-ui/icons/Done'; -import DeleteIcon from '@material-ui/icons/Delete'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; +import DoneIcon from '@mui/icons-material/Done'; +import DeleteIcon from '@mui/icons-material/Delete'; export default function CustomDeleteIconChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/CustomDeleteIconChips.tsx b/docs/src/pages/components/chips/CustomDeleteIconChips.tsx index 6fedf81a027727..9de50bf6f6137f 100644 --- a/docs/src/pages/components/chips/CustomDeleteIconChips.tsx +++ b/docs/src/pages/components/chips/CustomDeleteIconChips.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; -import DoneIcon from '@material-ui/icons/Done'; -import DeleteIcon from '@material-ui/icons/Delete'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; +import DoneIcon from '@mui/icons-material/Done'; +import DeleteIcon from '@mui/icons-material/Delete'; export default function CustomDeleteIconChips() { const handleClick = () => { diff --git a/docs/src/pages/components/chips/DeleteableChips.js b/docs/src/pages/components/chips/DeleteableChips.js index 96ff8d8d955d3d..4c2c3a6cc9dac4 100644 --- a/docs/src/pages/components/chips/DeleteableChips.js +++ b/docs/src/pages/components/chips/DeleteableChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function DeleteableChips() { const handleDelete = () => { diff --git a/docs/src/pages/components/chips/DeleteableChips.tsx b/docs/src/pages/components/chips/DeleteableChips.tsx index 96ff8d8d955d3d..4c2c3a6cc9dac4 100644 --- a/docs/src/pages/components/chips/DeleteableChips.tsx +++ b/docs/src/pages/components/chips/DeleteableChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function DeleteableChips() { const handleDelete = () => { diff --git a/docs/src/pages/components/chips/IconChips.js b/docs/src/pages/components/chips/IconChips.js index ada1939f323c41..028eca76712e0a 100644 --- a/docs/src/pages/components/chips/IconChips.js +++ b/docs/src/pages/components/chips/IconChips.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; -import FaceIcon from '@material-ui/icons/Face'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; +import FaceIcon from '@mui/icons-material/Face'; export default function IconChips() { return ( diff --git a/docs/src/pages/components/chips/IconChips.tsx b/docs/src/pages/components/chips/IconChips.tsx index ada1939f323c41..028eca76712e0a 100644 --- a/docs/src/pages/components/chips/IconChips.tsx +++ b/docs/src/pages/components/chips/IconChips.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; -import FaceIcon from '@material-ui/icons/Face'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; +import FaceIcon from '@mui/icons-material/Face'; export default function IconChips() { return ( diff --git a/docs/src/pages/components/chips/SizesChips.js b/docs/src/pages/components/chips/SizesChips.js index d893d304ccd4b1..3c749d3ca95e82 100644 --- a/docs/src/pages/components/chips/SizesChips.js +++ b/docs/src/pages/components/chips/SizesChips.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function SizesChips() { return ( diff --git a/docs/src/pages/components/chips/SizesChips.tsx b/docs/src/pages/components/chips/SizesChips.tsx index d893d304ccd4b1..3c749d3ca95e82 100644 --- a/docs/src/pages/components/chips/SizesChips.tsx +++ b/docs/src/pages/components/chips/SizesChips.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Chip from '@material-ui/core/Chip'; -import Stack from '@material-ui/core/Stack'; +import Chip from '@mui/material/Chip'; +import Stack from '@mui/material/Stack'; export default function SizesChips() { return ( diff --git a/docs/src/pages/components/click-away-listener/ClickAway.js b/docs/src/pages/components/click-away-listener/ClickAway.js index 718cff0677a111..c027baf4c76698 100644 --- a/docs/src/pages/components/click-away-listener/ClickAway.js +++ b/docs/src/pages/components/click-away-listener/ClickAway.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; export default function ClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/click-away-listener/ClickAway.tsx b/docs/src/pages/components/click-away-listener/ClickAway.tsx index 1eb06c210c8bc8..a32b4872d1d2ee 100644 --- a/docs/src/pages/components/click-away-listener/ClickAway.tsx +++ b/docs/src/pages/components/click-away-listener/ClickAway.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import { SxProps } from '@material-ui/system'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import { SxProps } from '@mui/system'; export default function ClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/click-away-listener/LeadingClickAway.js b/docs/src/pages/components/click-away-listener/LeadingClickAway.js index 183e0ee39d30f3..51c97697e55538 100644 --- a/docs/src/pages/components/click-away-listener/LeadingClickAway.js +++ b/docs/src/pages/components/click-away-listener/LeadingClickAway.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; export default function LeadingClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/click-away-listener/LeadingClickAway.tsx b/docs/src/pages/components/click-away-listener/LeadingClickAway.tsx index be8cd9e0e6ae65..ca458f203b9e17 100644 --- a/docs/src/pages/components/click-away-listener/LeadingClickAway.tsx +++ b/docs/src/pages/components/click-away-listener/LeadingClickAway.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import { SxProps } from '@material-ui/system'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import { SxProps } from '@mui/system'; export default function LeadingClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/click-away-listener/PortalClickAway.js b/docs/src/pages/components/click-away-listener/PortalClickAway.js index 2f4a56c7738777..6f4d5cd63f27c0 100644 --- a/docs/src/pages/components/click-away-listener/PortalClickAway.js +++ b/docs/src/pages/components/click-away-listener/PortalClickAway.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Portal from '@material-ui/core/Portal'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Portal from '@mui/material/Portal'; export default function PortalClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/click-away-listener/PortalClickAway.tsx b/docs/src/pages/components/click-away-listener/PortalClickAway.tsx index cda151c25961e5..aec80d06a02dd5 100644 --- a/docs/src/pages/components/click-away-listener/PortalClickAway.tsx +++ b/docs/src/pages/components/click-away-listener/PortalClickAway.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Portal from '@material-ui/core/Portal'; -import { SxProps } from '@material-ui/system'; +import Box from '@mui/material/Box'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Portal from '@mui/material/Portal'; +import { SxProps } from '@mui/system'; export default function PortalClickAway() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/container/FixedContainer.js b/docs/src/pages/components/container/FixedContainer.js index d6f8d2dce1a571..e236f436fab16d 100644 --- a/docs/src/pages/components/container/FixedContainer.js +++ b/docs/src/pages/components/container/FixedContainer.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; export default function FixedContainer() { return ( diff --git a/docs/src/pages/components/container/FixedContainer.tsx b/docs/src/pages/components/container/FixedContainer.tsx index d6f8d2dce1a571..e236f436fab16d 100644 --- a/docs/src/pages/components/container/FixedContainer.tsx +++ b/docs/src/pages/components/container/FixedContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; export default function FixedContainer() { return ( diff --git a/docs/src/pages/components/container/SimpleContainer.js b/docs/src/pages/components/container/SimpleContainer.js index a6aedaf6383cbc..0d6e4419101293 100644 --- a/docs/src/pages/components/container/SimpleContainer.js +++ b/docs/src/pages/components/container/SimpleContainer.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; export default function SimpleContainer() { return ( diff --git a/docs/src/pages/components/container/SimpleContainer.tsx b/docs/src/pages/components/container/SimpleContainer.tsx index a6aedaf6383cbc..0d6e4419101293 100644 --- a/docs/src/pages/components/container/SimpleContainer.tsx +++ b/docs/src/pages/components/container/SimpleContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Container from '@material-ui/core/Container'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; export default function SimpleContainer() { return ( diff --git a/docs/src/pages/components/css-baseline/css-baseline.md b/docs/src/pages/components/css-baseline/css-baseline.md index 3f7fb03ee2faed..92b13196970ba0 100644 --- a/docs/src/pages/components/css-baseline/css-baseline.md +++ b/docs/src/pages/components/css-baseline/css-baseline.md @@ -15,7 +15,7 @@ You might be familiar with [normalize.css](https://github.com/necolas/normalize. ```jsx import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; +import CssBaseline from '@mui/material/CssBaseline'; export default function MyApp() { return ( @@ -34,7 +34,7 @@ It's possible to apply the baseline only to the children by using the `ScopedCss ```jsx import * as React from 'react'; -import ScopedCssBaseline from '@material-ui/core/ScopedCssBaseline'; +import ScopedCssBaseline from '@mui/material/ScopedCssBaseline'; import MyApp from './MyApp'; export default function MyApp() { @@ -70,7 +70,7 @@ The `` and `` elements are updated to provide better page-wide defau The colors of the scrollbars can be customized to improve the contrast (especially on Windows). Add this code to your theme (for dark mode). ```jsx -import darkScrollbar from '@material-ui/core/darkScrollbar'; +import darkScrollbar from '@mui/material/darkScrollbar'; const theme = createTheme({ components: { diff --git a/docs/src/pages/components/date-picker/BasicDatePicker.js b/docs/src/pages/components/date-picker/BasicDatePicker.js index 8237a943b2ef68..32ffde76a3059c 100644 --- a/docs/src/pages/components/date-picker/BasicDatePicker.js +++ b/docs/src/pages/components/date-picker/BasicDatePicker.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; export default function BasicDatePicker() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/BasicDatePicker.tsx b/docs/src/pages/components/date-picker/BasicDatePicker.tsx index ed2440c239305f..3b738a6eadca9d 100644 --- a/docs/src/pages/components/date-picker/BasicDatePicker.tsx +++ b/docs/src/pages/components/date-picker/BasicDatePicker.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; export default function BasicDatePicker() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/CustomDay.js b/docs/src/pages/components/date-picker/CustomDay.js index 350acc6be9ffcd..bfbc9056cbb878 100644 --- a/docs/src/pages/components/date-picker/CustomDay.js +++ b/docs/src/pages/components/date-picker/CustomDay.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; -import PickersDay from '@material-ui/lab/PickersDay'; +import { styled } from '@mui/material/styles'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; +import PickersDay from '@mui/lab/PickersDay'; import endOfWeek from 'date-fns/endOfWeek'; import isSameDay from 'date-fns/isSameDay'; import isWithinInterval from 'date-fns/isWithinInterval'; diff --git a/docs/src/pages/components/date-picker/CustomDay.tsx b/docs/src/pages/components/date-picker/CustomDay.tsx index 2f6a467fff4de5..8b3566ca47f8c2 100644 --- a/docs/src/pages/components/date-picker/CustomDay.tsx +++ b/docs/src/pages/components/date-picker/CustomDay.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; -import PickersDay, { PickersDayProps } from '@material-ui/lab/PickersDay'; +import { styled } from '@mui/material/styles'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; +import PickersDay, { PickersDayProps } from '@mui/lab/PickersDay'; import endOfWeek from 'date-fns/endOfWeek'; import isSameDay from 'date-fns/isSameDay'; import isWithinInterval from 'date-fns/isWithinInterval'; diff --git a/docs/src/pages/components/date-picker/CustomInput.js b/docs/src/pages/components/date-picker/CustomInput.js index b7821558f85e5d..be0dcb08fe219b 100644 --- a/docs/src/pages/components/date-picker/CustomInput.js +++ b/docs/src/pages/components/date-picker/CustomInput.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DesktopDatePicker from '@material-ui/lab/DatePicker'; +import Box from '@mui/material/Box'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DesktopDatePicker from '@mui/lab/DatePicker'; export default function CustomInput() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/CustomInput.tsx b/docs/src/pages/components/date-picker/CustomInput.tsx index fabd4fda09c3a1..d550fea966f6ba 100644 --- a/docs/src/pages/components/date-picker/CustomInput.tsx +++ b/docs/src/pages/components/date-picker/CustomInput.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DesktopDatePicker from '@material-ui/lab/DatePicker'; +import Box from '@mui/material/Box'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DesktopDatePicker from '@mui/lab/DatePicker'; export default function CustomInput() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/FormPropsDatePickers.js b/docs/src/pages/components/date-picker/FormPropsDatePickers.js index ab194dde7ed7aa..6b1264441397c3 100644 --- a/docs/src/pages/components/date-picker/FormPropsDatePickers.js +++ b/docs/src/pages/components/date-picker/FormPropsDatePickers.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import Stack from '@mui/material/Stack'; export default function FormPropsDatePickers() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/FormPropsDatePickers.tsx b/docs/src/pages/components/date-picker/FormPropsDatePickers.tsx index 76652df857eb69..db4cc66ba0f9d0 100644 --- a/docs/src/pages/components/date-picker/FormPropsDatePickers.tsx +++ b/docs/src/pages/components/date-picker/FormPropsDatePickers.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import Stack from '@mui/material/Stack'; export default function FormPropsDatePickers() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/HelperText.js b/docs/src/pages/components/date-picker/HelperText.js index 679141dd0eec1c..535de0430ab28e 100644 --- a/docs/src/pages/components/date-picker/HelperText.js +++ b/docs/src/pages/components/date-picker/HelperText.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; export default function HelperText() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/HelperText.tsx b/docs/src/pages/components/date-picker/HelperText.tsx index 24e864b9c4299c..020eb9aedcd314 100644 --- a/docs/src/pages/components/date-picker/HelperText.tsx +++ b/docs/src/pages/components/date-picker/HelperText.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; export default function HelperText() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-picker/JalaliDatePicker.js b/docs/src/pages/components/date-picker/JalaliDatePicker.js index bec9f106547b37..9af97bcad006b8 100644 --- a/docs/src/pages/components/date-picker/JalaliDatePicker.js +++ b/docs/src/pages/components/date-picker/JalaliDatePicker.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; +import TextField from '@mui/material/TextField'; import AdapterJalali from '@date-io/date-fns-jalali'; -import DatePicker from '@material-ui/lab/DatePicker'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; export default function LocalizedDatePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/JalaliDatePicker.tsx b/docs/src/pages/components/date-picker/JalaliDatePicker.tsx index c704fd990d4dd5..cbf376ae6d2a80 100644 --- a/docs/src/pages/components/date-picker/JalaliDatePicker.tsx +++ b/docs/src/pages/components/date-picker/JalaliDatePicker.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; +import TextField from '@mui/material/TextField'; import AdapterJalali from '@date-io/date-fns-jalali'; -import DatePicker from '@material-ui/lab/DatePicker'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; export default function LocalizedDatePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/LocalizedDatePicker.js b/docs/src/pages/components/date-picker/LocalizedDatePicker.js index e0de4977fc96e7..38f1c3d8718d81 100644 --- a/docs/src/pages/components/date-picker/LocalizedDatePicker.js +++ b/docs/src/pages/components/date-picker/LocalizedDatePicker.js @@ -3,12 +3,12 @@ import frLocale from 'date-fns/locale/fr'; import ruLocale from 'date-fns/locale/ru'; import deLocale from 'date-fns/locale/de'; import enLocale from 'date-fns/locale/en-US'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import DatePicker from '@material-ui/lab/DatePicker'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +import ToggleButton from '@mui/material/ToggleButton'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import DatePicker from '@mui/lab/DatePicker'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; const localeMap = { en: enLocale, diff --git a/docs/src/pages/components/date-picker/LocalizedDatePicker.tsx b/docs/src/pages/components/date-picker/LocalizedDatePicker.tsx index e1f926f0154c22..a5b309f8a36ed5 100644 --- a/docs/src/pages/components/date-picker/LocalizedDatePicker.tsx +++ b/docs/src/pages/components/date-picker/LocalizedDatePicker.tsx @@ -3,12 +3,12 @@ import frLocale from 'date-fns/locale/fr'; import ruLocale from 'date-fns/locale/ru'; import deLocale from 'date-fns/locale/de'; import enLocale from 'date-fns/locale/en-US'; -import ToggleButton from '@material-ui/core/ToggleButton'; -import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import DatePicker from '@material-ui/lab/DatePicker'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +import ToggleButton from '@mui/material/ToggleButton'; +import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import DatePicker from '@mui/lab/DatePicker'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; const localeMap = { en: enLocale, diff --git a/docs/src/pages/components/date-picker/ResponsiveDatePickers.js b/docs/src/pages/components/date-picker/ResponsiveDatePickers.js index 98480b8a1cf692..54c18fef34d2a1 100644 --- a/docs/src/pages/components/date-picker/ResponsiveDatePickers.js +++ b/docs/src/pages/components/date-picker/ResponsiveDatePickers.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import MobileDatePicker from '@material-ui/lab/MobileDatePicker'; -import DesktopDatePicker from '@material-ui/lab/DesktopDatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import MobileDatePicker from '@mui/lab/MobileDatePicker'; +import DesktopDatePicker from '@mui/lab/DesktopDatePicker'; +import Stack from '@mui/material/Stack'; export default function ResponsiveDatePickers() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/ResponsiveDatePickers.tsx b/docs/src/pages/components/date-picker/ResponsiveDatePickers.tsx index 3ebb4ca141a385..27474d707e3a3f 100644 --- a/docs/src/pages/components/date-picker/ResponsiveDatePickers.tsx +++ b/docs/src/pages/components/date-picker/ResponsiveDatePickers.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import MobileDatePicker from '@material-ui/lab/MobileDatePicker'; -import DesktopDatePicker from '@material-ui/lab/DesktopDatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import MobileDatePicker from '@mui/lab/MobileDatePicker'; +import DesktopDatePicker from '@mui/lab/DesktopDatePicker'; +import Stack from '@mui/material/Stack'; export default function ResponsiveDatePickers() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/ServerRequestDatePicker.js b/docs/src/pages/components/date-picker/ServerRequestDatePicker.js index 758722b04d0b67..e67483b1000f4a 100644 --- a/docs/src/pages/components/date-picker/ServerRequestDatePicker.js +++ b/docs/src/pages/components/date-picker/ServerRequestDatePicker.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import PickersDay from '@material-ui/lab/PickersDay'; -import DatePicker from '@material-ui/lab/DatePicker'; -import CalendarPickerSkeleton from '@material-ui/lab/CalendarPickerSkeleton'; +import Badge from '@mui/material/Badge'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import PickersDay from '@mui/lab/PickersDay'; +import DatePicker from '@mui/lab/DatePicker'; +import CalendarPickerSkeleton from '@mui/lab/CalendarPickerSkeleton'; import getDaysInMonth from 'date-fns/getDaysInMonth'; function getRandomNumber(min, max) { diff --git a/docs/src/pages/components/date-picker/ServerRequestDatePicker.tsx b/docs/src/pages/components/date-picker/ServerRequestDatePicker.tsx index ce8dde59aed425..5ef97ebe047f51 100644 --- a/docs/src/pages/components/date-picker/ServerRequestDatePicker.tsx +++ b/docs/src/pages/components/date-picker/ServerRequestDatePicker.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Badge from '@material-ui/core/Badge'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import PickersDay from '@material-ui/lab/PickersDay'; -import DatePicker from '@material-ui/lab/DatePicker'; -import CalendarPickerSkeleton from '@material-ui/lab/CalendarPickerSkeleton'; +import Badge from '@mui/material/Badge'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import PickersDay from '@mui/lab/PickersDay'; +import DatePicker from '@mui/lab/DatePicker'; +import CalendarPickerSkeleton from '@mui/lab/CalendarPickerSkeleton'; import getDaysInMonth from 'date-fns/getDaysInMonth'; function getRandomNumber(min: number, max: number) { diff --git a/docs/src/pages/components/date-picker/StaticDatePickerDemo.js b/docs/src/pages/components/date-picker/StaticDatePickerDemo.js index a7defc493c2308..1f9d561ff757b5 100644 --- a/docs/src/pages/components/date-picker/StaticDatePickerDemo.js +++ b/docs/src/pages/components/date-picker/StaticDatePickerDemo.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; export default function StaticDatePickerDemo() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/StaticDatePickerDemo.tsx b/docs/src/pages/components/date-picker/StaticDatePickerDemo.tsx index 422c1aaeed8937..d7512f8e97ba48 100644 --- a/docs/src/pages/components/date-picker/StaticDatePickerDemo.tsx +++ b/docs/src/pages/components/date-picker/StaticDatePickerDemo.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; export default function StaticDatePickerDemo() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/StaticDatePickerLandscape.js b/docs/src/pages/components/date-picker/StaticDatePickerLandscape.js index 7c501b9cd4b8bd..5030ea85523ec6 100644 --- a/docs/src/pages/components/date-picker/StaticDatePickerLandscape.js +++ b/docs/src/pages/components/date-picker/StaticDatePickerLandscape.js @@ -1,9 +1,9 @@ import * as React from 'react'; import isWeekend from 'date-fns/isWeekend'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; export default function StaticDatePickerLandscape() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/StaticDatePickerLandscape.tsx b/docs/src/pages/components/date-picker/StaticDatePickerLandscape.tsx index 5599af898e3ea6..bd4f4b32797397 100644 --- a/docs/src/pages/components/date-picker/StaticDatePickerLandscape.tsx +++ b/docs/src/pages/components/date-picker/StaticDatePickerLandscape.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import isWeekend from 'date-fns/isWeekend'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDatePicker from '@material-ui/lab/StaticDatePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDatePicker from '@mui/lab/StaticDatePicker'; export default function StaticDatePickerLandscape() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/SubComponentsPickers.js b/docs/src/pages/components/date-picker/SubComponentsPickers.js index 45ce2d0fb30ae4..0623175b533a81 100644 --- a/docs/src/pages/components/date-picker/SubComponentsPickers.js +++ b/docs/src/pages/components/date-picker/SubComponentsPickers.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import CalendarPicker from '@material-ui/lab/CalendarPicker'; -import MonthPicker from '@material-ui/lab/MonthPicker'; -import YearPicker from '@material-ui/lab/YearPicker'; -import Grid from '@material-ui/core/Grid'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import CalendarPicker from '@mui/lab/CalendarPicker'; +import MonthPicker from '@mui/lab/MonthPicker'; +import YearPicker from '@mui/lab/YearPicker'; +import Grid from '@mui/material/Grid'; const minDate = new Date('2020-01-01T00:00:00.000'); const maxDate = new Date('2034-01-01T00:00:00.000'); diff --git a/docs/src/pages/components/date-picker/SubComponentsPickers.tsx b/docs/src/pages/components/date-picker/SubComponentsPickers.tsx index 54b622f22f7def..bc9ad799a41298 100644 --- a/docs/src/pages/components/date-picker/SubComponentsPickers.tsx +++ b/docs/src/pages/components/date-picker/SubComponentsPickers.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import CalendarPicker from '@material-ui/lab/CalendarPicker'; -import MonthPicker from '@material-ui/lab/MonthPicker'; -import YearPicker from '@material-ui/lab/YearPicker'; -import Grid from '@material-ui/core/Grid'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import CalendarPicker from '@mui/lab/CalendarPicker'; +import MonthPicker from '@mui/lab/MonthPicker'; +import YearPicker from '@mui/lab/YearPicker'; +import Grid from '@mui/material/Grid'; const minDate = new Date('2020-01-01T00:00:00.000'); const maxDate = new Date('2034-01-01T00:00:00.000'); diff --git a/docs/src/pages/components/date-picker/ViewsDatePicker.js b/docs/src/pages/components/date-picker/ViewsDatePicker.js index 7014069c48d23d..4d3e93c077092a 100644 --- a/docs/src/pages/components/date-picker/ViewsDatePicker.js +++ b/docs/src/pages/components/date-picker/ViewsDatePicker.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import Stack from '@mui/material/Stack'; export default function ViewsDatePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/ViewsDatePicker.tsx b/docs/src/pages/components/date-picker/ViewsDatePicker.tsx index 86b8c68b250006..f31816381f2e04 100644 --- a/docs/src/pages/components/date-picker/ViewsDatePicker.tsx +++ b/docs/src/pages/components/date-picker/ViewsDatePicker.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DatePicker from '@material-ui/lab/DatePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DatePicker from '@mui/lab/DatePicker'; +import Stack from '@mui/material/Stack'; export default function ViewsDatePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-picker/date-picker.md b/docs/src/pages/components/date-picker/date-picker.md index 6e2b200186c47c..246b799d320438 100644 --- a/docs/src/pages/components/date-picker/date-picker.md +++ b/docs/src/pages/components/date-picker/date-picker.md @@ -2,7 +2,7 @@ title: React Date Picker component components: CalendarPicker, CalendarPickerSkeleton, DatePicker, DesktopDatePicker, MobileDatePicker, MonthPicker, PickersDay, StaticDatePicker, YearPicker githubLabel: 'component: DatePicker' -packageName: '@material-ui/lab' +packageName: '@mui/lab' materialDesign: https://material.io/components/date-pickers --- @@ -24,9 +24,9 @@ This component relies on the date management library of your choice. It supports Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`: ```jsx -// or @material-ui/lab/Adapter{DayJS,Luxon,Moment} or any valid date-io adapter -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +// or @mui/lab/Adapter{DayJS,Luxon,Moment} or any valid date-io adapter +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; function App() { return ( diff --git a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.js b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.js index 07807d62b01f7b..dbae8e7a6e009d 100644 --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.js +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import DateRangePicker from '@material-ui/lab/DateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; +import TextField from '@mui/material/TextField'; +import DateRangePicker from '@mui/lab/DateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; export default function BasicDateRangePicker() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx index 4f075c22f0c862..67789ef469bba6 100644 --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; +import TextField from '@mui/material/TextField'; +import DateRangePicker, { DateRange } from '@mui/lab/DateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; export default function BasicDateRangePicker() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.js b/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.js index ccee388e8e5113..96958e45c302e7 100644 --- a/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.js +++ b/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker from '@material-ui/lab/DateRangePicker'; -import Box from '@material-ui/core/Box'; +import Typography from '@mui/material/Typography'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker from '@mui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; export default function CalendarsDateRangePicker() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.tsx index 4ecfa8fac2cf5e..c4050b0ddaea76 100644 --- a/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.tsx +++ b/docs/src/pages/components/date-range-picker/CalendarsDateRangePicker.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; -import Box from '@material-ui/core/Box'; +import Typography from '@mui/material/Typography'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker, { DateRange } from '@mui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; export default function CalendarsDateRangePicker() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.js b/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.js index 39887fc8b4a53d..bf0296a8606f6f 100644 --- a/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.js +++ b/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker from '@material-ui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker from '@mui/lab/DateRangePicker'; export default function CustomDateRangeInputs() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.tsx b/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.tsx index 7c4687e010e4ad..b6ed4b992d9f32 100644 --- a/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.tsx +++ b/docs/src/pages/components/date-range-picker/CustomDateRangeInputs.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker, { DateRange } from '@mui/lab/DateRangePicker'; export default function CustomDateRangeInputs() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.js b/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.js index ff107915d838c9..23a32b5ebaae00 100644 --- a/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.js +++ b/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; -import StaticDateRangePicker from '@material-ui/lab/StaticDateRangePicker'; -import MuiDateRangePickerDay from '@material-ui/lab/DateRangePickerDay'; +import StaticDateRangePicker from '@mui/lab/StaticDateRangePicker'; +import MuiDateRangePickerDay from '@mui/lab/DateRangePickerDay'; const DateRangePickerDay = styled(MuiDateRangePickerDay)( ({ theme, isHighlighting, isStartOfHighlighting, isEndOfHighlighting }) => ({ diff --git a/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.tsx b/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.tsx index 471d01647dde85..e43df6c703e309 100644 --- a/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.tsx +++ b/docs/src/pages/components/date-range-picker/CustomDateRangePickerDay.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import { DateRange } from '@material-ui/lab/DateRangePicker'; -import StaticDateRangePicker from '@material-ui/lab/StaticDateRangePicker'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import { DateRange } from '@mui/lab/DateRangePicker'; +import StaticDateRangePicker from '@mui/lab/StaticDateRangePicker'; import MuiDateRangePickerDay, { DateRangePickerDayProps, -} from '@material-ui/lab/DateRangePickerDay'; +} from '@mui/lab/DateRangePickerDay'; const DateRangePickerDay = styled(MuiDateRangePickerDay)( ({ theme, isHighlighting, isStartOfHighlighting, isEndOfHighlighting }) => ({ diff --git a/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.js b/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.js index b91131ea8c1a4a..a96efc7f0dae8f 100644 --- a/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.js +++ b/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import DateRangePicker from '@material-ui/lab/DateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import DateRangePicker from '@mui/lab/DateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; export default function FormPropsDateRangePickers() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.tsx b/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.tsx index 482dc79d2ca108..399a09c4f523f7 100644 --- a/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.tsx +++ b/docs/src/pages/components/date-range-picker/FormPropsDateRangePickers.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import DateRangePicker, { DateRange } from '@mui/lab/DateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; export default function FormPropsDateRangePickers() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.js b/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.js index 1a701a94dc5982..21734ba2af6794 100644 --- a/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.js +++ b/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.js @@ -1,10 +1,10 @@ import * as React from 'react'; import addWeeks from 'date-fns/addWeeks'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker from '@material-ui/lab/DateRangePicker'; -import Box from '@material-ui/core/Box'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker from '@mui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; function getWeeksAfter(date, amount) { return date ? addWeeks(date, amount) : undefined; diff --git a/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.tsx index c526d120aa8a6e..1e4a0eaed61b60 100644 --- a/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.tsx +++ b/docs/src/pages/components/date-range-picker/MinMaxDateRangePicker.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import addWeeks from 'date-fns/addWeeks'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; -import Box from '@material-ui/core/Box'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateRangePicker, { DateRange } from '@mui/lab/DateRangePicker'; +import Box from '@mui/material/Box'; function getWeeksAfter(date: Date | null, amount: number) { return date ? addWeeks(date, amount) : undefined; diff --git a/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.js b/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.js index 917034caa04070..1adb93d98b987a 100644 --- a/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.js +++ b/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import MobileDateRangePicker from '@material-ui/lab/MobileDateRangePicker'; -import DesktopDateRangePicker from '@material-ui/lab/DesktopDateRangePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import MobileDateRangePicker from '@mui/lab/MobileDateRangePicker'; +import DesktopDateRangePicker from '@mui/lab/DesktopDateRangePicker'; export default function ResponsiveDateRangePicker() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.tsx index 48e5c13db4fbcf..6e27e6c44338fc 100644 --- a/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.tsx +++ b/docs/src/pages/components/date-range-picker/ResponsiveDateRangePicker.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import MobileDateRangePicker from '@material-ui/lab/MobileDateRangePicker'; -import DesktopDateRangePicker from '@material-ui/lab/DesktopDateRangePicker'; -import { DateRange } from '@material-ui/lab/DateRangePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import MobileDateRangePicker from '@mui/lab/MobileDateRangePicker'; +import DesktopDateRangePicker from '@mui/lab/DesktopDateRangePicker'; +import { DateRange } from '@mui/lab/DateRangePicker'; export default function ResponsiveDateRangePicker() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.js b/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.js index 183dfbf1cf6601..dc5afa6a3fb036 100644 --- a/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.js +++ b/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import StaticDateRangePicker from '@material-ui/lab/StaticDateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; +import TextField from '@mui/material/TextField'; +import StaticDateRangePicker from '@mui/lab/StaticDateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; export default function StaticDateRangePickerDemo() { const [value, setValue] = React.useState([null, null]); diff --git a/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.tsx b/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.tsx index c3950f6b2a8ca6..c892dd0134f208 100644 --- a/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.tsx +++ b/docs/src/pages/components/date-range-picker/StaticDateRangePickerDemo.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import StaticDateRangePicker from '@material-ui/lab/StaticDateRangePicker'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import Box from '@material-ui/core/Box'; -import { DateRange } from '@material-ui/lab/DateRangePicker'; +import TextField from '@mui/material/TextField'; +import StaticDateRangePicker from '@mui/lab/StaticDateRangePicker'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import Box from '@mui/material/Box'; +import { DateRange } from '@mui/lab/DateRangePicker'; export default function StaticDateRangePickerDemo() { const [value, setValue] = React.useState>([null, null]); diff --git a/docs/src/pages/components/date-range-picker/date-range-picker.md b/docs/src/pages/components/date-range-picker/date-range-picker.md index 2adae4afb1c6a4..6e11d3f7559ad6 100644 --- a/docs/src/pages/components/date-range-picker/date-range-picker.md +++ b/docs/src/pages/components/date-range-picker/date-range-picker.md @@ -2,7 +2,7 @@ title: React Date Range Picker component components: DateRangePicker, DateRangePickerDay, DesktopDateRangePicker, MobileDateRangePicker, StaticDateRangePicker githubLabel: 'component: DateRangePicker' -packageName: '@material-ui/lab' +packageName: '@mui/lab' materialDesign: https://material.io/components/date-pickers --- @@ -27,9 +27,9 @@ This component relies on the date management library of your choice. It supports Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`: ```jsx -// or @material-ui/lab/dateAdapter/{dayjs,luxon,moment} or any valid date-io adapter -import DateFnsAdapter from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +// or @mui/lab/dateAdapter/{dayjs,luxon,moment} or any valid date-io adapter +import DateFnsAdapter from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; function App() { return ( diff --git a/docs/src/pages/components/date-time-picker/BasicDateTimePicker.js b/docs/src/pages/components/date-time-picker/BasicDateTimePicker.js index df382085a77cc1..3d5e32f4558168 100644 --- a/docs/src/pages/components/date-time-picker/BasicDateTimePicker.js +++ b/docs/src/pages/components/date-time-picker/BasicDateTimePicker.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; export default function BasicDateTimePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/BasicDateTimePicker.tsx b/docs/src/pages/components/date-time-picker/BasicDateTimePicker.tsx index 140ae9f8e53172..f0fe0cbeac1ed7 100644 --- a/docs/src/pages/components/date-time-picker/BasicDateTimePicker.tsx +++ b/docs/src/pages/components/date-time-picker/BasicDateTimePicker.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; export default function BasicDateTimePicker() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/CustomDateTimePicker.js b/docs/src/pages/components/date-time-picker/CustomDateTimePicker.js index 6c9e6436edad8a..e76226cb301df3 100644 --- a/docs/src/pages/components/date-time-picker/CustomDateTimePicker.js +++ b/docs/src/pages/components/date-time-picker/CustomDateTimePicker.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import AlarmIcon from '@material-ui/icons/Alarm'; -import SnoozeIcon from '@material-ui/icons/Snooze'; -import TextField from '@material-ui/core/TextField'; -import ClockIcon from '@material-ui/icons/AccessTime'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import MobileDateTimePicker from '@material-ui/lab/MobileDateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import AlarmIcon from '@mui/icons-material/Alarm'; +import SnoozeIcon from '@mui/icons-material/Snooze'; +import TextField from '@mui/material/TextField'; +import ClockIcon from '@mui/icons-material/AccessTime'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import MobileDateTimePicker from '@mui/lab/MobileDateTimePicker'; +import Stack from '@mui/material/Stack'; export default function CustomDateTimePicker() { const [clearedDate, setClearedDate] = React.useState(null); diff --git a/docs/src/pages/components/date-time-picker/CustomDateTimePicker.tsx b/docs/src/pages/components/date-time-picker/CustomDateTimePicker.tsx index c767471b879f43..3a4d07876cbbde 100644 --- a/docs/src/pages/components/date-time-picker/CustomDateTimePicker.tsx +++ b/docs/src/pages/components/date-time-picker/CustomDateTimePicker.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import AlarmIcon from '@material-ui/icons/Alarm'; -import SnoozeIcon from '@material-ui/icons/Snooze'; -import TextField from '@material-ui/core/TextField'; -import ClockIcon from '@material-ui/icons/AccessTime'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import MobileDateTimePicker from '@material-ui/lab/MobileDateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import AlarmIcon from '@mui/icons-material/Alarm'; +import SnoozeIcon from '@mui/icons-material/Snooze'; +import TextField from '@mui/material/TextField'; +import ClockIcon from '@mui/icons-material/AccessTime'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import MobileDateTimePicker from '@mui/lab/MobileDateTimePicker'; +import Stack from '@mui/material/Stack'; export default function CustomDateTimePicker() { const [clearedDate, setClearedDate] = React.useState(null); diff --git a/docs/src/pages/components/date-time-picker/DateTimeValidation.js b/docs/src/pages/components/date-time-picker/DateTimeValidation.js index 75b24523a2fdb6..2ca361ce939553 100644 --- a/docs/src/pages/components/date-time-picker/DateTimeValidation.js +++ b/docs/src/pages/components/date-time-picker/DateTimeValidation.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import Stack from '@mui/material/Stack'; export default function DateTimeValidation() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/DateTimeValidation.tsx b/docs/src/pages/components/date-time-picker/DateTimeValidation.tsx index 9f233a6c4c644e..1a07d22121ea52 100644 --- a/docs/src/pages/components/date-time-picker/DateTimeValidation.tsx +++ b/docs/src/pages/components/date-time-picker/DateTimeValidation.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import Stack from '@mui/material/Stack'; export default function DateTimeValidation() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.js b/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.js index 8edbf2f024e12f..2bc05f08c68495 100644 --- a/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.js +++ b/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import Stack from '@mui/material/Stack'; export default function FormPropsDateTimePickers() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.tsx b/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.tsx index aaf83e7131b808..da890954d91ff1 100644 --- a/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.tsx +++ b/docs/src/pages/components/date-time-picker/FormPropsDateTimePickers.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import Stack from '@mui/material/Stack'; export default function FormPropsDateTimePickers() { const [value, setValue] = React.useState(null); diff --git a/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.js b/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.js index 6005f167c33749..b764e7974d8872 100644 --- a/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.js +++ b/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import MobileDateTimePicker from '@material-ui/lab/MobileDateTimePicker'; -import DesktopDateTimePicker from '@material-ui/lab/DesktopDateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import MobileDateTimePicker from '@mui/lab/MobileDateTimePicker'; +import DesktopDateTimePicker from '@mui/lab/DesktopDateTimePicker'; +import Stack from '@mui/material/Stack'; export default function ResponsiveDateTimePickers() { const [value, setValue] = React.useState(new Date('2018-01-01T00:00:00.000Z')); diff --git a/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.tsx b/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.tsx index 796fe86e3a663b..c2b44409a118c9 100644 --- a/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.tsx +++ b/docs/src/pages/components/date-time-picker/ResponsiveDateTimePickers.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import MobileDateTimePicker from '@material-ui/lab/MobileDateTimePicker'; -import DesktopDateTimePicker from '@material-ui/lab/DesktopDateTimePicker'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import MobileDateTimePicker from '@mui/lab/MobileDateTimePicker'; +import DesktopDateTimePicker from '@mui/lab/DesktopDateTimePicker'; +import Stack from '@mui/material/Stack'; export default function ResponsiveDateTimePickers() { const [value, setValue] = React.useState( diff --git a/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.js b/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.js index 10015bdb2e72a7..0b3bbbe6d080b4 100644 --- a/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.js +++ b/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDateTimePicker from '@material-ui/lab/StaticDateTimePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDateTimePicker from '@mui/lab/StaticDateTimePicker'; export default function StaticDateTimePickerDemo() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.tsx b/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.tsx index 32aec6203ef1d6..5e04a62d63531c 100644 --- a/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.tsx +++ b/docs/src/pages/components/date-time-picker/StaticDateTimePickerDemo.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import StaticDateTimePicker from '@material-ui/lab/StaticDateTimePicker'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import StaticDateTimePicker from '@mui/lab/StaticDateTimePicker'; export default function StaticDateTimePickerDemo() { const [value, setValue] = React.useState(new Date()); diff --git a/docs/src/pages/components/date-time-picker/date-time-picker.md b/docs/src/pages/components/date-time-picker/date-time-picker.md index 72eda26d7872da..135a26f6dd4599 100644 --- a/docs/src/pages/components/date-time-picker/date-time-picker.md +++ b/docs/src/pages/components/date-time-picker/date-time-picker.md @@ -2,7 +2,7 @@ title: React Date Time Picker component components: DateTimePicker,DesktopDateTimePicker,MobileDateTimePicker,StaticDateTimePicker githubLabel: 'component: DateTimePicker' -packageName: '@material-ui/lab' +packageName: '@mui/lab' materialDesign: https://material.io/components/date-pickers --- @@ -24,9 +24,9 @@ This component relies on the date management library of your choice. It supports Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`: ```jsx -// or @material-ui/lab/Adapter{Dayjs,Luxon,Moment} or any valid date-io adapter -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; +// or @mui/lab/Adapter{Dayjs,Luxon,Moment} or any valid date-io adapter +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; function App() { return ( diff --git a/docs/src/pages/components/dialogs/AlertDialog.js b/docs/src/pages/components/dialogs/AlertDialog.js index d06b6c68603ac7..1b510b37700b68 100644 --- a/docs/src/pages/components/dialogs/AlertDialog.js +++ b/docs/src/pages/components/dialogs/AlertDialog.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function AlertDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/AlertDialog.tsx b/docs/src/pages/components/dialogs/AlertDialog.tsx index d06b6c68603ac7..1b510b37700b68 100644 --- a/docs/src/pages/components/dialogs/AlertDialog.tsx +++ b/docs/src/pages/components/dialogs/AlertDialog.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function AlertDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/AlertDialogSlide.js b/docs/src/pages/components/dialogs/AlertDialogSlide.js index c50aff603fa84d..486c0584e5d40d 100644 --- a/docs/src/pages/components/dialogs/AlertDialogSlide.js +++ b/docs/src/pages/components/dialogs/AlertDialogSlide.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Slide from '@material-ui/core/Slide'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Slide from '@mui/material/Slide'; const Transition = React.forwardRef(function Transition(props, ref) { return ; diff --git a/docs/src/pages/components/dialogs/AlertDialogSlide.tsx b/docs/src/pages/components/dialogs/AlertDialogSlide.tsx index 6079b826deb317..f8edb6dd8e85c3 100644 --- a/docs/src/pages/components/dialogs/AlertDialogSlide.tsx +++ b/docs/src/pages/components/dialogs/AlertDialogSlide.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Slide from '@material-ui/core/Slide'; -import { TransitionProps } from '@material-ui/core/transitions'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Slide from '@mui/material/Slide'; +import { TransitionProps } from '@mui/material/transitions'; const Transition = React.forwardRef(function Transition( props: TransitionProps & { diff --git a/docs/src/pages/components/dialogs/ConfirmationDialog.js b/docs/src/pages/components/dialogs/ConfirmationDialog.js index bd69d819ec54de..b67c1b3798f3ef 100644 --- a/docs/src/pages/components/dialogs/ConfirmationDialog.js +++ b/docs/src/pages/components/dialogs/ConfirmationDialog.js @@ -1,17 +1,17 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogActions from '@material-ui/core/DialogActions'; -import Dialog from '@material-ui/core/Dialog'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogActions from '@mui/material/DialogActions'; +import Dialog from '@mui/material/Dialog'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import FormControlLabel from '@mui/material/FormControlLabel'; const options = [ 'None', diff --git a/docs/src/pages/components/dialogs/ConfirmationDialog.tsx b/docs/src/pages/components/dialogs/ConfirmationDialog.tsx index dad6c3861193f8..dbf66c51f1bc08 100644 --- a/docs/src/pages/components/dialogs/ConfirmationDialog.tsx +++ b/docs/src/pages/components/dialogs/ConfirmationDialog.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogActions from '@material-ui/core/DialogActions'; -import Dialog from '@material-ui/core/Dialog'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogActions from '@mui/material/DialogActions'; +import Dialog from '@mui/material/Dialog'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import FormControlLabel from '@mui/material/FormControlLabel'; const options = [ 'None', diff --git a/docs/src/pages/components/dialogs/CustomizedDialogs.js b/docs/src/pages/components/dialogs/CustomizedDialogs.js index 7d1bd2756d3803..e820d279c1aefb 100644 --- a/docs/src/pages/components/dialogs/CustomizedDialogs.js +++ b/docs/src/pages/components/dialogs/CustomizedDialogs.js @@ -1,14 +1,14 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Button from '@material-ui/core/Button'; -import { styled } from '@material-ui/core/styles'; -import Dialog from '@material-ui/core/Dialog'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogActions from '@material-ui/core/DialogActions'; -import IconButton from '@material-ui/core/IconButton'; -import CloseIcon from '@material-ui/icons/Close'; -import Typography from '@material-ui/core/Typography'; +import Button from '@mui/material/Button'; +import { styled } from '@mui/material/styles'; +import Dialog from '@mui/material/Dialog'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogActions from '@mui/material/DialogActions'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; +import Typography from '@mui/material/Typography'; const BootstrapDialog = styled(Dialog)(({ theme }) => ({ '& .MuDialogContent-root': { diff --git a/docs/src/pages/components/dialogs/CustomizedDialogs.tsx b/docs/src/pages/components/dialogs/CustomizedDialogs.tsx index 468ad0c764fbd9..aa4c517065a062 100644 --- a/docs/src/pages/components/dialogs/CustomizedDialogs.tsx +++ b/docs/src/pages/components/dialogs/CustomizedDialogs.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import { styled } from '@material-ui/core/styles'; -import Dialog from '@material-ui/core/Dialog'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogActions from '@material-ui/core/DialogActions'; -import IconButton from '@material-ui/core/IconButton'; -import CloseIcon from '@material-ui/icons/Close'; -import Typography from '@material-ui/core/Typography'; +import Button from '@mui/material/Button'; +import { styled } from '@mui/material/styles'; +import Dialog from '@mui/material/Dialog'; +import DialogTitle from '@mui/material/DialogTitle'; +import DialogContent from '@mui/material/DialogContent'; +import DialogActions from '@mui/material/DialogActions'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; +import Typography from '@mui/material/Typography'; const BootstrapDialog = styled(Dialog)(({ theme }) => ({ '& .MuDialogContent-root': { diff --git a/docs/src/pages/components/dialogs/DraggableDialog.js b/docs/src/pages/components/dialogs/DraggableDialog.js index 1bb078f0d9bcbe..cec4e33ee3b268 100644 --- a/docs/src/pages/components/dialogs/DraggableDialog.js +++ b/docs/src/pages/components/dialogs/DraggableDialog.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Paper from '@material-ui/core/Paper'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Paper from '@mui/material/Paper'; import Draggable from 'react-draggable'; function PaperComponent(props) { diff --git a/docs/src/pages/components/dialogs/DraggableDialog.tsx b/docs/src/pages/components/dialogs/DraggableDialog.tsx index 4d97a201c98f22..67bedd6d1a3838 100644 --- a/docs/src/pages/components/dialogs/DraggableDialog.tsx +++ b/docs/src/pages/components/dialogs/DraggableDialog.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Paper, { PaperProps } from '@material-ui/core/Paper'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Paper, { PaperProps } from '@mui/material/Paper'; import Draggable from 'react-draggable'; function PaperComponent(props: PaperProps) { diff --git a/docs/src/pages/components/dialogs/FormDialog.js b/docs/src/pages/components/dialogs/FormDialog.js index 67973da527c79c..d627b2b8335aa4 100644 --- a/docs/src/pages/components/dialogs/FormDialog.js +++ b/docs/src/pages/components/dialogs/FormDialog.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import TextField from '@material-ui/core/TextField'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import TextField from '@mui/material/TextField'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function FormDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/FormDialog.tsx b/docs/src/pages/components/dialogs/FormDialog.tsx index 67973da527c79c..d627b2b8335aa4 100644 --- a/docs/src/pages/components/dialogs/FormDialog.tsx +++ b/docs/src/pages/components/dialogs/FormDialog.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import TextField from '@material-ui/core/TextField'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import TextField from '@mui/material/TextField'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function FormDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/FullScreenDialog.js b/docs/src/pages/components/dialogs/FullScreenDialog.js index 1e6206be7e0461..23c5137ada2dc6 100644 --- a/docs/src/pages/components/dialogs/FullScreenDialog.js +++ b/docs/src/pages/components/dialogs/FullScreenDialog.js @@ -1,16 +1,16 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItem from '@material-ui/core/ListItem'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import CloseIcon from '@material-ui/icons/Close'; -import Slide from '@material-ui/core/Slide'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import ListItemText from '@mui/material/ListItemText'; +import ListItem from '@mui/material/ListItem'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import CloseIcon from '@mui/icons-material/Close'; +import Slide from '@mui/material/Slide'; const Transition = React.forwardRef(function Transition(props, ref) { return ; diff --git a/docs/src/pages/components/dialogs/FullScreenDialog.tsx b/docs/src/pages/components/dialogs/FullScreenDialog.tsx index 43f9f97285b366..c20231385532cb 100644 --- a/docs/src/pages/components/dialogs/FullScreenDialog.tsx +++ b/docs/src/pages/components/dialogs/FullScreenDialog.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItem from '@material-ui/core/ListItem'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import CloseIcon from '@material-ui/icons/Close'; -import Slide from '@material-ui/core/Slide'; -import { TransitionProps } from '@material-ui/core/transitions'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import ListItemText from '@mui/material/ListItemText'; +import ListItem from '@mui/material/ListItem'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import CloseIcon from '@mui/icons-material/Close'; +import Slide from '@mui/material/Slide'; +import { TransitionProps } from '@mui/material/transitions'; const Transition = React.forwardRef(function Transition( props: TransitionProps & { diff --git a/docs/src/pages/components/dialogs/MaxWidthDialog.js b/docs/src/pages/components/dialogs/MaxWidthDialog.js index 4e714928fc777f..a8dd877e803ca8 100644 --- a/docs/src/pages/components/dialogs/MaxWidthDialog.js +++ b/docs/src/pages/components/dialogs/MaxWidthDialog.js @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import FormControl from '@material-ui/core/FormControl'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import Select from '@material-ui/core/Select'; -import Switch from '@material-ui/core/Switch'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import FormControl from '@mui/material/FormControl'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import Select from '@mui/material/Select'; +import Switch from '@mui/material/Switch'; export default function MaxWidthDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/MaxWidthDialog.tsx b/docs/src/pages/components/dialogs/MaxWidthDialog.tsx index cd7ef598401411..a757ee817f2ced 100644 --- a/docs/src/pages/components/dialogs/MaxWidthDialog.tsx +++ b/docs/src/pages/components/dialogs/MaxWidthDialog.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Dialog, { DialogProps } from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import FormControl from '@material-ui/core/FormControl'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; -import Switch from '@material-ui/core/Switch'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Dialog, { DialogProps } from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import FormControl from '@mui/material/FormControl'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import Switch from '@mui/material/Switch'; export default function MaxWidthDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/ResponsiveDialog.js b/docs/src/pages/components/dialogs/ResponsiveDialog.js index e1dfb192afa091..5606901a18a2d8 100644 --- a/docs/src/pages/components/dialogs/ResponsiveDialog.js +++ b/docs/src/pages/components/dialogs/ResponsiveDialog.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import { useTheme } from '@material-ui/core/styles'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import { useTheme } from '@mui/material/styles'; export default function ResponsiveDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/ResponsiveDialog.tsx b/docs/src/pages/components/dialogs/ResponsiveDialog.tsx index e1dfb192afa091..5606901a18a2d8 100644 --- a/docs/src/pages/components/dialogs/ResponsiveDialog.tsx +++ b/docs/src/pages/components/dialogs/ResponsiveDialog.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import { useTheme } from '@material-ui/core/styles'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import { useTheme } from '@mui/material/styles'; export default function ResponsiveDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/ScrollDialog.js b/docs/src/pages/components/dialogs/ScrollDialog.js index ec323e446f914f..eb7275959a40d5 100644 --- a/docs/src/pages/components/dialogs/ScrollDialog.js +++ b/docs/src/pages/components/dialogs/ScrollDialog.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function ScrollDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/ScrollDialog.tsx b/docs/src/pages/components/dialogs/ScrollDialog.tsx index 6a536a6c944175..614e44805bd8be 100644 --- a/docs/src/pages/components/dialogs/ScrollDialog.tsx +++ b/docs/src/pages/components/dialogs/ScrollDialog.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Dialog, { DialogProps } from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; +import Button from '@mui/material/Button'; +import Dialog, { DialogProps } from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; export default function ScrollDialog() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/dialogs/SimpleDialog.js b/docs/src/pages/components/dialogs/SimpleDialog.js index 5250b4b7508beb..e9a56e8f42494f 100644 --- a/docs/src/pages/components/dialogs/SimpleDialog.js +++ b/docs/src/pages/components/dialogs/SimpleDialog.js @@ -1,17 +1,17 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Button from '@material-ui/core/Button'; -import Avatar from '@material-ui/core/Avatar'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Dialog from '@material-ui/core/Dialog'; -import PersonIcon from '@material-ui/icons/Person'; -import AddIcon from '@material-ui/icons/Add'; -import Typography from '@material-ui/core/Typography'; -import { blue } from '@material-ui/core/colors'; +import Button from '@mui/material/Button'; +import Avatar from '@mui/material/Avatar'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Dialog from '@mui/material/Dialog'; +import PersonIcon from '@mui/icons-material/Person'; +import AddIcon from '@mui/icons-material/Add'; +import Typography from '@mui/material/Typography'; +import { blue } from '@mui/material/colors'; const emails = ['username@gmail.com', 'user02@gmail.com']; diff --git a/docs/src/pages/components/dialogs/SimpleDialog.tsx b/docs/src/pages/components/dialogs/SimpleDialog.tsx index c07281e14714e7..b536e59dca2fe7 100644 --- a/docs/src/pages/components/dialogs/SimpleDialog.tsx +++ b/docs/src/pages/components/dialogs/SimpleDialog.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Avatar from '@material-ui/core/Avatar'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Dialog from '@material-ui/core/Dialog'; -import PersonIcon from '@material-ui/icons/Person'; -import AddIcon from '@material-ui/icons/Add'; -import Typography from '@material-ui/core/Typography'; -import { blue } from '@material-ui/core/colors'; +import Button from '@mui/material/Button'; +import Avatar from '@mui/material/Avatar'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Dialog from '@mui/material/Dialog'; +import PersonIcon from '@mui/icons-material/Person'; +import AddIcon from '@mui/icons-material/Add'; +import Typography from '@mui/material/Typography'; +import { blue } from '@mui/material/colors'; const emails = ['username@gmail.com', 'user02@gmail.com']; diff --git a/docs/src/pages/components/dialogs/dialogs.md b/docs/src/pages/components/dialogs/dialogs.md index ec88df47d49fdc..33733aef9ad829 100644 --- a/docs/src/pages/components/dialogs/dialogs.md +++ b/docs/src/pages/components/dialogs/dialogs.md @@ -86,7 +86,7 @@ When the `fullWidth` prop is true, the dialog will adapt based on the `maxWidth` You may make a dialog responsively full screen using [`useMediaQuery`](/components/use-media-query/#usemediaquery). ```jsx -import useMediaQuery from '@material-ui/core/useMediaQuery'; +import useMediaQuery from '@mui/material/useMediaQuery'; function MyComponent() { const theme = useTheme(); diff --git a/docs/src/pages/components/dividers/DividerText.js b/docs/src/pages/components/dividers/DividerText.js index 8c2baf18a503ab..b801a60d0280ad 100644 --- a/docs/src/pages/components/dividers/DividerText.js +++ b/docs/src/pages/components/dividers/DividerText.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Divider from '@material-ui/core/Divider'; -import Chip from '@material-ui/core/Chip'; +import { styled } from '@mui/material/styles'; +import Divider from '@mui/material/Divider'; +import Chip from '@mui/material/Chip'; const Root = styled('div')(({ theme }) => ({ width: '100%', diff --git a/docs/src/pages/components/dividers/DividerText.tsx b/docs/src/pages/components/dividers/DividerText.tsx index 8c2baf18a503ab..b801a60d0280ad 100644 --- a/docs/src/pages/components/dividers/DividerText.tsx +++ b/docs/src/pages/components/dividers/DividerText.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Divider from '@material-ui/core/Divider'; -import Chip from '@material-ui/core/Chip'; +import { styled } from '@mui/material/styles'; +import Divider from '@mui/material/Divider'; +import Chip from '@mui/material/Chip'; const Root = styled('div')(({ theme }) => ({ width: '100%', diff --git a/docs/src/pages/components/dividers/InsetDividers.js b/docs/src/pages/components/dividers/InsetDividers.js index db979dd7245a0b..96925c7c1f46b3 100644 --- a/docs/src/pages/components/dividers/InsetDividers.js +++ b/docs/src/pages/components/dividers/InsetDividers.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import ImageIcon from '@material-ui/icons/Image'; -import WorkIcon from '@material-ui/icons/Work'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; -import Divider from '@material-ui/core/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import ImageIcon from '@mui/icons-material/Image'; +import WorkIcon from '@mui/icons-material/Work'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; +import Divider from '@mui/material/Divider'; export default function InsetDividers() { return ( diff --git a/docs/src/pages/components/dividers/InsetDividers.tsx b/docs/src/pages/components/dividers/InsetDividers.tsx index db979dd7245a0b..96925c7c1f46b3 100644 --- a/docs/src/pages/components/dividers/InsetDividers.tsx +++ b/docs/src/pages/components/dividers/InsetDividers.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import ImageIcon from '@material-ui/icons/Image'; -import WorkIcon from '@material-ui/icons/Work'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; -import Divider from '@material-ui/core/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import ImageIcon from '@mui/icons-material/Image'; +import WorkIcon from '@mui/icons-material/Work'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; +import Divider from '@mui/material/Divider'; export default function InsetDividers() { return ( diff --git a/docs/src/pages/components/dividers/ListDividers.js b/docs/src/pages/components/dividers/ListDividers.js index 27163c0d5069a7..3827783939aad3 100644 --- a/docs/src/pages/components/dividers/ListDividers.js +++ b/docs/src/pages/components/dividers/ListDividers.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; const style = { width: '100%', diff --git a/docs/src/pages/components/dividers/ListDividers.tsx b/docs/src/pages/components/dividers/ListDividers.tsx index 27163c0d5069a7..3827783939aad3 100644 --- a/docs/src/pages/components/dividers/ListDividers.tsx +++ b/docs/src/pages/components/dividers/ListDividers.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; const style = { width: '100%', diff --git a/docs/src/pages/components/dividers/MiddleDividers.js b/docs/src/pages/components/dividers/MiddleDividers.js index 66a9383c227a04..00596c7a4d82bc 100644 --- a/docs/src/pages/components/dividers/MiddleDividers.js +++ b/docs/src/pages/components/dividers/MiddleDividers.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Chip from '@material-ui/core/Chip'; -import Button from '@material-ui/core/Button'; -import Grid from '@material-ui/core/Grid'; -import Stack from '@material-ui/core/Stack'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Chip from '@mui/material/Chip'; +import Button from '@mui/material/Button'; +import Grid from '@mui/material/Grid'; +import Stack from '@mui/material/Stack'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; export default function MiddleDividers() { return ( diff --git a/docs/src/pages/components/dividers/MiddleDividers.tsx b/docs/src/pages/components/dividers/MiddleDividers.tsx index 66a9383c227a04..00596c7a4d82bc 100644 --- a/docs/src/pages/components/dividers/MiddleDividers.tsx +++ b/docs/src/pages/components/dividers/MiddleDividers.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Chip from '@material-ui/core/Chip'; -import Button from '@material-ui/core/Button'; -import Grid from '@material-ui/core/Grid'; -import Stack from '@material-ui/core/Stack'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Chip from '@mui/material/Chip'; +import Button from '@mui/material/Button'; +import Grid from '@mui/material/Grid'; +import Stack from '@mui/material/Stack'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; export default function MiddleDividers() { return ( diff --git a/docs/src/pages/components/dividers/SubheaderDividers.js b/docs/src/pages/components/dividers/SubheaderDividers.js index 3c55b2d57c156a..488de12b0a0c5f 100644 --- a/docs/src/pages/components/dividers/SubheaderDividers.js +++ b/docs/src/pages/components/dividers/SubheaderDividers.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; export default function SubheaderDividers() { return ( diff --git a/docs/src/pages/components/dividers/SubheaderDividers.tsx b/docs/src/pages/components/dividers/SubheaderDividers.tsx index 3c55b2d57c156a..488de12b0a0c5f 100644 --- a/docs/src/pages/components/dividers/SubheaderDividers.tsx +++ b/docs/src/pages/components/dividers/SubheaderDividers.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; -import Divider from '@material-ui/core/Divider'; -import Typography from '@material-ui/core/Typography'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; +import Divider from '@mui/material/Divider'; +import Typography from '@mui/material/Typography'; export default function SubheaderDividers() { return ( diff --git a/docs/src/pages/components/dividers/VerticalDividerMiddle.js b/docs/src/pages/components/dividers/VerticalDividerMiddle.js index 570a38ce78b1b9..cd823e4ad1489b 100644 --- a/docs/src/pages/components/dividers/VerticalDividerMiddle.js +++ b/docs/src/pages/components/dividers/VerticalDividerMiddle.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import FormatAlignLeftIcon from '@material-ui/icons/FormatAlignLeft'; -import FormatAlignCenterIcon from '@material-ui/icons/FormatAlignCenter'; -import FormatAlignRightIcon from '@material-ui/icons/FormatAlignRight'; -import FormatBoldIcon from '@material-ui/icons/FormatBold'; -import FormatItalicIcon from '@material-ui/icons/FormatItalic'; -import Box from '@material-ui/core/Box'; -import Divider from '@material-ui/core/Divider'; +import FormatAlignLeftIcon from '@mui/icons-material/FormatAlignLeft'; +import FormatAlignCenterIcon from '@mui/icons-material/FormatAlignCenter'; +import FormatAlignRightIcon from '@mui/icons-material/FormatAlignRight'; +import FormatBoldIcon from '@mui/icons-material/FormatBold'; +import FormatItalicIcon from '@mui/icons-material/FormatItalic'; +import Box from '@mui/material/Box'; +import Divider from '@mui/material/Divider'; export default function VerticalDividerMiddle() { return ( diff --git a/docs/src/pages/components/dividers/VerticalDividerMiddle.tsx b/docs/src/pages/components/dividers/VerticalDividerMiddle.tsx index 570a38ce78b1b9..cd823e4ad1489b 100644 --- a/docs/src/pages/components/dividers/VerticalDividerMiddle.tsx +++ b/docs/src/pages/components/dividers/VerticalDividerMiddle.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import FormatAlignLeftIcon from '@material-ui/icons/FormatAlignLeft'; -import FormatAlignCenterIcon from '@material-ui/icons/FormatAlignCenter'; -import FormatAlignRightIcon from '@material-ui/icons/FormatAlignRight'; -import FormatBoldIcon from '@material-ui/icons/FormatBold'; -import FormatItalicIcon from '@material-ui/icons/FormatItalic'; -import Box from '@material-ui/core/Box'; -import Divider from '@material-ui/core/Divider'; +import FormatAlignLeftIcon from '@mui/icons-material/FormatAlignLeft'; +import FormatAlignCenterIcon from '@mui/icons-material/FormatAlignCenter'; +import FormatAlignRightIcon from '@mui/icons-material/FormatAlignRight'; +import FormatBoldIcon from '@mui/icons-material/FormatBold'; +import FormatItalicIcon from '@mui/icons-material/FormatItalic'; +import Box from '@mui/material/Box'; +import Divider from '@mui/material/Divider'; export default function VerticalDividerMiddle() { return ( diff --git a/docs/src/pages/components/dividers/VerticalDividerText.js b/docs/src/pages/components/dividers/VerticalDividerText.js index 76acc5fc626098..835df7b3494960 100644 --- a/docs/src/pages/components/dividers/VerticalDividerText.js +++ b/docs/src/pages/components/dividers/VerticalDividerText.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import MuiGrid from '@material-ui/core/Grid'; -import Divider from '@material-ui/core/Divider'; +import { styled } from '@mui/material/styles'; +import MuiGrid from '@mui/material/Grid'; +import Divider from '@mui/material/Divider'; const Grid = styled(MuiGrid)(({ theme }) => ({ width: '100%', diff --git a/docs/src/pages/components/dividers/VerticalDividerText.tsx b/docs/src/pages/components/dividers/VerticalDividerText.tsx index 76acc5fc626098..835df7b3494960 100644 --- a/docs/src/pages/components/dividers/VerticalDividerText.tsx +++ b/docs/src/pages/components/dividers/VerticalDividerText.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import MuiGrid from '@material-ui/core/Grid'; -import Divider from '@material-ui/core/Divider'; +import { styled } from '@mui/material/styles'; +import MuiGrid from '@mui/material/Grid'; +import Divider from '@mui/material/Divider'; const Grid = styled(MuiGrid)(({ theme }) => ({ width: '100%', diff --git a/docs/src/pages/components/dividers/VerticalDividers.js b/docs/src/pages/components/dividers/VerticalDividers.js index 186d4dcf9b427b..8583bd6a84f223 100644 --- a/docs/src/pages/components/dividers/VerticalDividers.js +++ b/docs/src/pages/components/dividers/VerticalDividers.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import FormatAlignLeftIcon from '@material-ui/icons/FormatAlignLeft'; -import FormatAlignCenterIcon from '@material-ui/icons/FormatAlignCenter'; -import FormatAlignRightIcon from '@material-ui/icons/FormatAlignRight'; -import FormatBoldIcon from '@material-ui/icons/FormatBold'; -import FormatItalicIcon from '@material-ui/icons/FormatItalic'; -import Box from '@material-ui/core/Box'; -import Divider from '@material-ui/core/Divider'; +import FormatAlignLeftIcon from '@mui/icons-material/FormatAlignLeft'; +import FormatAlignCenterIcon from '@mui/icons-material/FormatAlignCenter'; +import FormatAlignRightIcon from '@mui/icons-material/FormatAlignRight'; +import FormatBoldIcon from '@mui/icons-material/FormatBold'; +import FormatItalicIcon from '@mui/icons-material/FormatItalic'; +import Box from '@mui/material/Box'; +import Divider from '@mui/material/Divider'; export default function VerticalDividers() { return ( diff --git a/docs/src/pages/components/dividers/VerticalDividers.tsx b/docs/src/pages/components/dividers/VerticalDividers.tsx index 186d4dcf9b427b..8583bd6a84f223 100644 --- a/docs/src/pages/components/dividers/VerticalDividers.tsx +++ b/docs/src/pages/components/dividers/VerticalDividers.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import FormatAlignLeftIcon from '@material-ui/icons/FormatAlignLeft'; -import FormatAlignCenterIcon from '@material-ui/icons/FormatAlignCenter'; -import FormatAlignRightIcon from '@material-ui/icons/FormatAlignRight'; -import FormatBoldIcon from '@material-ui/icons/FormatBold'; -import FormatItalicIcon from '@material-ui/icons/FormatItalic'; -import Box from '@material-ui/core/Box'; -import Divider from '@material-ui/core/Divider'; +import FormatAlignLeftIcon from '@mui/icons-material/FormatAlignLeft'; +import FormatAlignCenterIcon from '@mui/icons-material/FormatAlignCenter'; +import FormatAlignRightIcon from '@mui/icons-material/FormatAlignRight'; +import FormatBoldIcon from '@mui/icons-material/FormatBold'; +import FormatItalicIcon from '@mui/icons-material/FormatItalic'; +import Box from '@mui/material/Box'; +import Divider from '@mui/material/Divider'; export default function VerticalDividers() { return ( diff --git a/docs/src/pages/components/drawers/ClippedDrawer.js b/docs/src/pages/components/drawers/ClippedDrawer.js index 9ef8345ea92b67..3cf84e2b3da4ad 100644 --- a/docs/src/pages/components/drawers/ClippedDrawer.js +++ b/docs/src/pages/components/drawers/ClippedDrawer.js @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import AppBar from '@material-ui/core/AppBar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import AppBar from '@mui/material/AppBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/ClippedDrawer.tsx b/docs/src/pages/components/drawers/ClippedDrawer.tsx index 9ef8345ea92b67..3cf84e2b3da4ad 100644 --- a/docs/src/pages/components/drawers/ClippedDrawer.tsx +++ b/docs/src/pages/components/drawers/ClippedDrawer.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import AppBar from '@material-ui/core/AppBar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import AppBar from '@mui/material/AppBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/MiniDrawer.js b/docs/src/pages/components/drawers/MiniDrawer.js index 13d7e0dc9cabfb..79d3a0f5ea2771 100644 --- a/docs/src/pages/components/drawers/MiniDrawer.js +++ b/docs/src/pages/components/drawers/MiniDrawer.js @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import MuiDrawer from '@material-ui/core/Drawer'; -import MuiAppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import MuiDrawer from '@mui/material/Drawer'; +import MuiAppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import CssBaseline from '@mui/material/CssBaseline'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/MiniDrawer.tsx b/docs/src/pages/components/drawers/MiniDrawer.tsx index 08efa8d7d75af0..8ba3aaf0632eca 100644 --- a/docs/src/pages/components/drawers/MiniDrawer.tsx +++ b/docs/src/pages/components/drawers/MiniDrawer.tsx @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme, Theme, CSSObject } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import MuiDrawer from '@material-ui/core/Drawer'; -import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme, Theme, CSSObject } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import MuiDrawer from '@mui/material/Drawer'; +import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import CssBaseline from '@mui/material/CssBaseline'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PermanentDrawerLeft.js b/docs/src/pages/components/drawers/PermanentDrawerLeft.js index 24db9a57de7a1e..48b7a994d1654b 100644 --- a/docs/src/pages/components/drawers/PermanentDrawerLeft.js +++ b/docs/src/pages/components/drawers/PermanentDrawerLeft.js @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PermanentDrawerLeft.tsx b/docs/src/pages/components/drawers/PermanentDrawerLeft.tsx index 24db9a57de7a1e..48b7a994d1654b 100644 --- a/docs/src/pages/components/drawers/PermanentDrawerLeft.tsx +++ b/docs/src/pages/components/drawers/PermanentDrawerLeft.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PermanentDrawerRight.js b/docs/src/pages/components/drawers/PermanentDrawerRight.js index 8b448ce758f2fb..93abd0fcdd790c 100644 --- a/docs/src/pages/components/drawers/PermanentDrawerRight.js +++ b/docs/src/pages/components/drawers/PermanentDrawerRight.js @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PermanentDrawerRight.tsx b/docs/src/pages/components/drawers/PermanentDrawerRight.tsx index 8b448ce758f2fb..93abd0fcdd790c 100644 --- a/docs/src/pages/components/drawers/PermanentDrawerRight.tsx +++ b/docs/src/pages/components/drawers/PermanentDrawerRight.tsx @@ -1,17 +1,17 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PersistentDrawerLeft.js b/docs/src/pages/components/drawers/PersistentDrawerLeft.js index 79bc2832965477..fa889810d380cc 100644 --- a/docs/src/pages/components/drawers/PersistentDrawerLeft.js +++ b/docs/src/pages/components/drawers/PersistentDrawerLeft.js @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import MuiAppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import MuiAppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PersistentDrawerLeft.tsx b/docs/src/pages/components/drawers/PersistentDrawerLeft.tsx index 08e61a32228d8f..28b5bfbe9b10d8 100644 --- a/docs/src/pages/components/drawers/PersistentDrawerLeft.tsx +++ b/docs/src/pages/components/drawers/PersistentDrawerLeft.tsx @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import CssBaseline from '@mui/material/CssBaseline'; +import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PersistentDrawerRight.js b/docs/src/pages/components/drawers/PersistentDrawerRight.js index 90f9c17f4afbbd..9818af1342c9ae 100644 --- a/docs/src/pages/components/drawers/PersistentDrawerRight.js +++ b/docs/src/pages/components/drawers/PersistentDrawerRight.js @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import MuiAppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import MuiAppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import CssBaseline from '@mui/material/CssBaseline'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/PersistentDrawerRight.tsx b/docs/src/pages/components/drawers/PersistentDrawerRight.tsx index bfa17c99a65a0a..5ddf01bf1f1a48 100644 --- a/docs/src/pages/components/drawers/PersistentDrawerRight.tsx +++ b/docs/src/pages/components/drawers/PersistentDrawerRight.tsx @@ -1,22 +1,22 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import List from '@material-ui/core/List'; -import Typography from '@material-ui/core/Typography'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; -import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import CssBaseline from '@mui/material/CssBaseline'; +import List from '@mui/material/List'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; +import ChevronRightIcon from '@mui/icons-material/ChevronRight'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/ResponsiveDrawer.js b/docs/src/pages/components/drawers/ResponsiveDrawer.js index 284b59098bb163..2f7575d6836108 100644 --- a/docs/src/pages/components/drawers/ResponsiveDrawer.js +++ b/docs/src/pages/components/drawers/ResponsiveDrawer.js @@ -1,20 +1,20 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Divider from '@material-ui/core/Divider'; -import Drawer from '@material-ui/core/Drawer'; -import IconButton from '@material-ui/core/IconButton'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import MailIcon from '@material-ui/icons/Mail'; -import MenuIcon from '@material-ui/icons/Menu'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import Divider from '@mui/material/Divider'; +import Drawer from '@mui/material/Drawer'; +import IconButton from '@mui/material/IconButton'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import MailIcon from '@mui/icons-material/Mail'; +import MenuIcon from '@mui/icons-material/Menu'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/ResponsiveDrawer.tsx b/docs/src/pages/components/drawers/ResponsiveDrawer.tsx index 6a339e0b431278..7d2e3d2e92a9e7 100644 --- a/docs/src/pages/components/drawers/ResponsiveDrawer.tsx +++ b/docs/src/pages/components/drawers/ResponsiveDrawer.tsx @@ -1,19 +1,19 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Box from '@material-ui/core/Box'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Divider from '@material-ui/core/Divider'; -import Drawer from '@material-ui/core/Drawer'; -import IconButton from '@material-ui/core/IconButton'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import MailIcon from '@material-ui/icons/Mail'; -import MenuIcon from '@material-ui/icons/Menu'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; +import AppBar from '@mui/material/AppBar'; +import Box from '@mui/material/Box'; +import CssBaseline from '@mui/material/CssBaseline'; +import Divider from '@mui/material/Divider'; +import Drawer from '@mui/material/Drawer'; +import IconButton from '@mui/material/IconButton'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import MailIcon from '@mui/icons-material/Mail'; +import MenuIcon from '@mui/icons-material/Menu'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; const drawerWidth = 240; diff --git a/docs/src/pages/components/drawers/SwipeableEdgeDrawer.js b/docs/src/pages/components/drawers/SwipeableEdgeDrawer.js index 4b3d30eff03fe0..6084e75f007ecd 100644 --- a/docs/src/pages/components/drawers/SwipeableEdgeDrawer.js +++ b/docs/src/pages/components/drawers/SwipeableEdgeDrawer.js @@ -1,14 +1,14 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { Global } from '@emotion/react'; -import { styled } from '@material-ui/core/styles'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import { grey } from '@material-ui/core/colors'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import Skeleton from '@material-ui/core/Skeleton'; -import Typography from '@material-ui/core/Typography'; -import SwipeableDrawer from '@material-ui/core/SwipeableDrawer'; +import { styled } from '@mui/material/styles'; +import CssBaseline from '@mui/material/CssBaseline'; +import { grey } from '@mui/material/colors'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import Skeleton from '@mui/material/Skeleton'; +import Typography from '@mui/material/Typography'; +import SwipeableDrawer from '@mui/material/SwipeableDrawer'; const drawerBleeding = 56; diff --git a/docs/src/pages/components/drawers/SwipeableEdgeDrawer.tsx b/docs/src/pages/components/drawers/SwipeableEdgeDrawer.tsx index 95327ad4d5ee3e..62cbbdbc33a79e 100644 --- a/docs/src/pages/components/drawers/SwipeableEdgeDrawer.tsx +++ b/docs/src/pages/components/drawers/SwipeableEdgeDrawer.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; import { Global } from '@emotion/react'; -import { styled } from '@material-ui/core/styles'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import { grey } from '@material-ui/core/colors'; -import Button from '@material-ui/core/Button'; -import Box from '@material-ui/core/Box'; -import Skeleton from '@material-ui/core/Skeleton'; -import Typography from '@material-ui/core/Typography'; -import SwipeableDrawer from '@material-ui/core/SwipeableDrawer'; +import { styled } from '@mui/material/styles'; +import CssBaseline from '@mui/material/CssBaseline'; +import { grey } from '@mui/material/colors'; +import Button from '@mui/material/Button'; +import Box from '@mui/material/Box'; +import Skeleton from '@mui/material/Skeleton'; +import Typography from '@mui/material/Typography'; +import SwipeableDrawer from '@mui/material/SwipeableDrawer'; const drawerBleeding = 56; diff --git a/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.js b/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.js index 61cd3e071cf613..4039863b9e37cb 100644 --- a/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.js +++ b/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.js @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import SwipeableDrawer from '@material-ui/core/SwipeableDrawer'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import SwipeableDrawer from '@mui/material/SwipeableDrawer'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; export default function SwipeableTemporaryDrawer() { const [state, setState] = React.useState({ diff --git a/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.tsx b/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.tsx index 734bd7381546ab..2479f550ef63aa 100644 --- a/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.tsx +++ b/docs/src/pages/components/drawers/SwipeableTemporaryDrawer.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import SwipeableDrawer from '@material-ui/core/SwipeableDrawer'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import SwipeableDrawer from '@mui/material/SwipeableDrawer'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; type Anchor = 'top' | 'left' | 'bottom' | 'right'; diff --git a/docs/src/pages/components/drawers/TemporaryDrawer.js b/docs/src/pages/components/drawers/TemporaryDrawer.js index 0a54096b6f2930..ecde1248efe173 100644 --- a/docs/src/pages/components/drawers/TemporaryDrawer.js +++ b/docs/src/pages/components/drawers/TemporaryDrawer.js @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; export default function TemporaryDrawer() { const [state, setState] = React.useState({ diff --git a/docs/src/pages/components/drawers/TemporaryDrawer.tsx b/docs/src/pages/components/drawers/TemporaryDrawer.tsx index 806e4c23346867..48335b89e4c183 100644 --- a/docs/src/pages/components/drawers/TemporaryDrawer.tsx +++ b/docs/src/pages/components/drawers/TemporaryDrawer.tsx @@ -1,14 +1,14 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Drawer from '@material-ui/core/Drawer'; -import Button from '@material-ui/core/Button'; -import List from '@material-ui/core/List'; -import Divider from '@material-ui/core/Divider'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import MailIcon from '@material-ui/icons/Mail'; +import Box from '@mui/material/Box'; +import Drawer from '@mui/material/Drawer'; +import Button from '@mui/material/Button'; +import List from '@mui/material/List'; +import Divider from '@mui/material/Divider'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import MailIcon from '@mui/icons-material/Mail'; type Anchor = 'top' | 'left' | 'bottom' | 'right'; diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.js b/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.js index 8ef54d60290379..6125821cef7431 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.js +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import NavigationIcon from '@material-ui/icons/Navigation'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import NavigationIcon from '@mui/icons-material/Navigation'; export default function FloatingActionButtonExtendedSize() { return ( diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.tsx b/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.tsx index 8ef54d60290379..6125821cef7431 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.tsx +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonExtendedSize.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import NavigationIcon from '@material-ui/icons/Navigation'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import NavigationIcon from '@mui/icons-material/Navigation'; export default function FloatingActionButtonExtendedSize() { return ( diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.js b/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.js index b316b8017638a9..1acb4ff1d8bf55 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.js +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; export default function FloatingActionButtonSize() { return ( diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.tsx b/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.tsx index b316b8017638a9..1acb4ff1d8bf55 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.tsx +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonSize.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; export default function FloatingActionButtonSize() { return ( diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.js b/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.js index 881ca81b6a78ca..e4945c497d8d87 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.js +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.js @@ -1,18 +1,18 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import SwipeableViews from 'react-swipeable-views'; -import { useTheme } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Tabs from '@material-ui/core/Tabs'; -import Tab from '@material-ui/core/Tab'; -import Typography from '@material-ui/core/Typography'; -import Zoom from '@material-ui/core/Zoom'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import EditIcon from '@material-ui/icons/Edit'; -import UpIcon from '@material-ui/icons/KeyboardArrowUp'; -import { green } from '@material-ui/core/colors'; -import Box from '@material-ui/core/Box'; +import { useTheme } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Tabs from '@mui/material/Tabs'; +import Tab from '@mui/material/Tab'; +import Typography from '@mui/material/Typography'; +import Zoom from '@mui/material/Zoom'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import EditIcon from '@mui/icons-material/Edit'; +import UpIcon from '@mui/icons-material/KeyboardArrowUp'; +import { green } from '@mui/material/colors'; +import Box from '@mui/material/Box'; function TabPanel(props) { const { children, value, index, ...other } = props; diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.tsx b/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.tsx index 59ae75e1d8ecfc..135d4d5050f273 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.tsx +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtonZoom.tsx @@ -1,18 +1,18 @@ import * as React from 'react'; import SwipeableViews from 'react-swipeable-views'; -import { useTheme } from '@material-ui/core/styles'; -import AppBar from '@material-ui/core/AppBar'; -import Tabs from '@material-ui/core/Tabs'; -import Tab from '@material-ui/core/Tab'; -import Typography from '@material-ui/core/Typography'; -import Zoom from '@material-ui/core/Zoom'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import EditIcon from '@material-ui/icons/Edit'; -import UpIcon from '@material-ui/icons/KeyboardArrowUp'; -import { green } from '@material-ui/core/colors'; -import Box from '@material-ui/core/Box'; -import { SxProps } from '@material-ui/system'; +import { useTheme } from '@mui/material/styles'; +import AppBar from '@mui/material/AppBar'; +import Tabs from '@mui/material/Tabs'; +import Tab from '@mui/material/Tab'; +import Typography from '@mui/material/Typography'; +import Zoom from '@mui/material/Zoom'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import EditIcon from '@mui/icons-material/Edit'; +import UpIcon from '@mui/icons-material/KeyboardArrowUp'; +import { green } from '@mui/material/colors'; +import Box from '@mui/material/Box'; +import { SxProps } from '@mui/system'; interface TabPanelProps { children?: React.ReactNode; diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtons.js b/docs/src/pages/components/floating-action-button/FloatingActionButtons.js index 26baccb26a6a77..fcf1974ae9539a 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtons.js +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtons.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import EditIcon from '@material-ui/icons/Edit'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import NavigationIcon from '@material-ui/icons/Navigation'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import EditIcon from '@mui/icons-material/Edit'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import NavigationIcon from '@mui/icons-material/Navigation'; export default function FloatingActionButtons() { return ( diff --git a/docs/src/pages/components/floating-action-button/FloatingActionButtons.tsx b/docs/src/pages/components/floating-action-button/FloatingActionButtons.tsx index 26baccb26a6a77..fcf1974ae9539a 100644 --- a/docs/src/pages/components/floating-action-button/FloatingActionButtons.tsx +++ b/docs/src/pages/components/floating-action-button/FloatingActionButtons.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import EditIcon from '@material-ui/icons/Edit'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import NavigationIcon from '@material-ui/icons/Navigation'; +import Box from '@mui/material/Box'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import EditIcon from '@mui/icons-material/Edit'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import NavigationIcon from '@mui/icons-material/Navigation'; export default function FloatingActionButtons() { return ( diff --git a/docs/src/pages/components/grid/AutoGrid.js b/docs/src/pages/components/grid/AutoGrid.js index 3c0454d93a0805..19b476fc954322 100644 --- a/docs/src/pages/components/grid/AutoGrid.js +++ b/docs/src/pages/components/grid/AutoGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/AutoGrid.tsx b/docs/src/pages/components/grid/AutoGrid.tsx index 3c0454d93a0805..19b476fc954322 100644 --- a/docs/src/pages/components/grid/AutoGrid.tsx +++ b/docs/src/pages/components/grid/AutoGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/AutoGridNoWrap.js b/docs/src/pages/components/grid/AutoGridNoWrap.js index 3f914db28c1a42..2a4c083135113c 100644 --- a/docs/src/pages/components/grid/AutoGridNoWrap.js +++ b/docs/src/pages/components/grid/AutoGridNoWrap.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; const message = `Truncation should be conditionally applicable on this long line of text as this is a much longer line than what the container can support. `; diff --git a/docs/src/pages/components/grid/AutoGridNoWrap.tsx b/docs/src/pages/components/grid/AutoGridNoWrap.tsx index 3f914db28c1a42..2a4c083135113c 100644 --- a/docs/src/pages/components/grid/AutoGridNoWrap.tsx +++ b/docs/src/pages/components/grid/AutoGridNoWrap.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; const message = `Truncation should be conditionally applicable on this long line of text as this is a much longer line than what the container can support. `; diff --git a/docs/src/pages/components/grid/BasicGrid.js b/docs/src/pages/components/grid/BasicGrid.js index 7ca9ef53950ce1..7e27cab50dcb95 100644 --- a/docs/src/pages/components/grid/BasicGrid.js +++ b/docs/src/pages/components/grid/BasicGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/BasicGrid.tsx b/docs/src/pages/components/grid/BasicGrid.tsx index 7ca9ef53950ce1..7e27cab50dcb95 100644 --- a/docs/src/pages/components/grid/BasicGrid.tsx +++ b/docs/src/pages/components/grid/BasicGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/CSSGrid.js b/docs/src/pages/components/grid/CSSGrid.js index d915d4ab00939e..a59e31fb740894 100644 --- a/docs/src/pages/components/grid/CSSGrid.js +++ b/docs/src/pages/components/grid/CSSGrid.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/CSSGrid.tsx b/docs/src/pages/components/grid/CSSGrid.tsx index d915d4ab00939e..a59e31fb740894 100644 --- a/docs/src/pages/components/grid/CSSGrid.tsx +++ b/docs/src/pages/components/grid/CSSGrid.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/ColumnsGrid.js b/docs/src/pages/components/grid/ColumnsGrid.js index 8ad3682a33906a..c58370bf335b84 100644 --- a/docs/src/pages/components/grid/ColumnsGrid.js +++ b/docs/src/pages/components/grid/ColumnsGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/ColumnsGrid.tsx b/docs/src/pages/components/grid/ColumnsGrid.tsx index 8ad3682a33906a..c58370bf335b84 100644 --- a/docs/src/pages/components/grid/ColumnsGrid.tsx +++ b/docs/src/pages/components/grid/ColumnsGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/ComplexGrid.js b/docs/src/pages/components/grid/ComplexGrid.js index 4d471d023596ea..ed9e1111749f19 100644 --- a/docs/src/pages/components/grid/ComplexGrid.js +++ b/docs/src/pages/components/grid/ComplexGrid.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import ButtonBase from '@material-ui/core/ButtonBase'; +import { styled } from '@mui/material/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import ButtonBase from '@mui/material/ButtonBase'; const Img = styled('img')({ margin: 'auto', diff --git a/docs/src/pages/components/grid/ComplexGrid.tsx b/docs/src/pages/components/grid/ComplexGrid.tsx index 4d471d023596ea..ed9e1111749f19 100644 --- a/docs/src/pages/components/grid/ComplexGrid.tsx +++ b/docs/src/pages/components/grid/ComplexGrid.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Typography from '@material-ui/core/Typography'; -import ButtonBase from '@material-ui/core/ButtonBase'; +import { styled } from '@mui/material/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Typography from '@mui/material/Typography'; +import ButtonBase from '@mui/material/ButtonBase'; const Img = styled('img')({ margin: 'auto', diff --git a/docs/src/pages/components/grid/FullWidthGrid.js b/docs/src/pages/components/grid/FullWidthGrid.js index 36bad085c2840c..714560d94b2ae4 100644 --- a/docs/src/pages/components/grid/FullWidthGrid.js +++ b/docs/src/pages/components/grid/FullWidthGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/FullWidthGrid.tsx b/docs/src/pages/components/grid/FullWidthGrid.tsx index 36bad085c2840c..714560d94b2ae4 100644 --- a/docs/src/pages/components/grid/FullWidthGrid.tsx +++ b/docs/src/pages/components/grid/FullWidthGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/InteractiveGrid.js b/docs/src/pages/components/grid/InteractiveGrid.js index 578fb7e4aee026..edddfad233bb90 100644 --- a/docs/src/pages/components/grid/InteractiveGrid.js +++ b/docs/src/pages/components/grid/InteractiveGrid.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import Paper from '@material-ui/core/Paper'; +import Grid from '@mui/material/Grid'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import Paper from '@mui/material/Paper'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; export default function InteractiveGrid() { diff --git a/docs/src/pages/components/grid/InteractiveGrid.tsx b/docs/src/pages/components/grid/InteractiveGrid.tsx index a90054ae970380..785cb6eaf74195 100644 --- a/docs/src/pages/components/grid/InteractiveGrid.tsx +++ b/docs/src/pages/components/grid/InteractiveGrid.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Grid, { GridDirection } from '@material-ui/core/Grid'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import Paper from '@material-ui/core/Paper'; +import Grid, { GridDirection } from '@mui/material/Grid'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import Paper from '@mui/material/Paper'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; type GridItemsAlignment = diff --git a/docs/src/pages/components/grid/NestedGrid.js b/docs/src/pages/components/grid/NestedGrid.js index 5ccd3a1d7b5ea4..ee6d18898de4f5 100644 --- a/docs/src/pages/components/grid/NestedGrid.js +++ b/docs/src/pages/components/grid/NestedGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/NestedGrid.tsx b/docs/src/pages/components/grid/NestedGrid.tsx index 5ccd3a1d7b5ea4..ee6d18898de4f5 100644 --- a/docs/src/pages/components/grid/NestedGrid.tsx +++ b/docs/src/pages/components/grid/NestedGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/ResponsiveGrid.js b/docs/src/pages/components/grid/ResponsiveGrid.js index 603f77e71781f3..7783290e442186 100644 --- a/docs/src/pages/components/grid/ResponsiveGrid.js +++ b/docs/src/pages/components/grid/ResponsiveGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/ResponsiveGrid.tsx b/docs/src/pages/components/grid/ResponsiveGrid.tsx index 603f77e71781f3..7783290e442186 100644 --- a/docs/src/pages/components/grid/ResponsiveGrid.tsx +++ b/docs/src/pages/components/grid/ResponsiveGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/RowAndColumnSpacing.js b/docs/src/pages/components/grid/RowAndColumnSpacing.js index 576c5262b8dc2f..acbcc2981e4b6a 100644 --- a/docs/src/pages/components/grid/RowAndColumnSpacing.js +++ b/docs/src/pages/components/grid/RowAndColumnSpacing.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Box from '@mui/material/Box'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/RowAndColumnSpacing.tsx b/docs/src/pages/components/grid/RowAndColumnSpacing.tsx index 576c5262b8dc2f..acbcc2981e4b6a 100644 --- a/docs/src/pages/components/grid/RowAndColumnSpacing.tsx +++ b/docs/src/pages/components/grid/RowAndColumnSpacing.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Box from '@mui/material/Box'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/SpacingGrid.js b/docs/src/pages/components/grid/SpacingGrid.js index fe061398a22cc6..d5c0d01c540a0e 100644 --- a/docs/src/pages/components/grid/SpacingGrid.js +++ b/docs/src/pages/components/grid/SpacingGrid.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Grid from '@mui/material/Grid'; +import FormLabel from '@mui/material/FormLabel'; +import FormControl from '@mui/material/FormControl'; +import FormControlLabel from '@mui/material/FormControlLabel'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import Paper from '@material-ui/core/Paper'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import Paper from '@mui/material/Paper'; export default function SpacingGrid() { const [spacing, setSpacing] = React.useState(2); diff --git a/docs/src/pages/components/grid/SpacingGrid.tsx b/docs/src/pages/components/grid/SpacingGrid.tsx index b74150cd730a96..d782bc1aaacbf3 100644 --- a/docs/src/pages/components/grid/SpacingGrid.tsx +++ b/docs/src/pages/components/grid/SpacingGrid.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import Grid from '@mui/material/Grid'; +import FormLabel from '@mui/material/FormLabel'; +import FormControl from '@mui/material/FormControl'; +import FormControlLabel from '@mui/material/FormControlLabel'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; -import Paper from '@material-ui/core/Paper'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; +import Paper from '@mui/material/Paper'; export default function SpacingGrid() { const [spacing, setSpacing] = React.useState(2); diff --git a/docs/src/pages/components/grid/VariableWidthGrid.js b/docs/src/pages/components/grid/VariableWidthGrid.js index 6a6a4822388b6c..46e3e45525dfe0 100644 --- a/docs/src/pages/components/grid/VariableWidthGrid.js +++ b/docs/src/pages/components/grid/VariableWidthGrid.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/grid/VariableWidthGrid.tsx b/docs/src/pages/components/grid/VariableWidthGrid.tsx index 6a6a4822388b6c..46e3e45525dfe0 100644 --- a/docs/src/pages/components/grid/VariableWidthGrid.tsx +++ b/docs/src/pages/components/grid/VariableWidthGrid.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/icons/CreateSvgIcon.js b/docs/src/pages/components/icons/CreateSvgIcon.js index 9e3c90392f5f10..8b6f3923fbbe5a 100644 --- a/docs/src/pages/components/icons/CreateSvgIcon.js +++ b/docs/src/pages/components/icons/CreateSvgIcon.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { createSvgIcon } from '@material-ui/core/utils'; +import Box from '@mui/material/Box'; +import { createSvgIcon } from '@mui/material/utils'; const HomeIcon = createSvgIcon( , diff --git a/docs/src/pages/components/icons/CreateSvgIcon.tsx b/docs/src/pages/components/icons/CreateSvgIcon.tsx index 9e3c90392f5f10..8b6f3923fbbe5a 100644 --- a/docs/src/pages/components/icons/CreateSvgIcon.tsx +++ b/docs/src/pages/components/icons/CreateSvgIcon.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { createSvgIcon } from '@material-ui/core/utils'; +import Box from '@mui/material/Box'; +import { createSvgIcon } from '@mui/material/utils'; const HomeIcon = createSvgIcon( , diff --git a/docs/src/pages/components/icons/FontAwesomeIcon.js b/docs/src/pages/components/icons/FontAwesomeIcon.js index 41ad74513f942f..74582f474d10e9 100644 --- a/docs/src/pages/components/icons/FontAwesomeIcon.js +++ b/docs/src/pages/components/icons/FontAwesomeIcon.js @@ -1,8 +1,8 @@ import * as React from 'react'; import { loadCSS } from 'fg-loadcss'; -import Box from '@material-ui/core/Box'; -import { green } from '@material-ui/core/colors'; -import Icon from '@material-ui/core/Icon'; +import Box from '@mui/material/Box'; +import { green } from '@mui/material/colors'; +import Icon from '@mui/material/Icon'; export default function FontAwesomeIcon() { React.useEffect(() => { diff --git a/docs/src/pages/components/icons/FontAwesomeIcon.tsx b/docs/src/pages/components/icons/FontAwesomeIcon.tsx index 2f8cf9a62a2cb9..086d8cc886d93a 100644 --- a/docs/src/pages/components/icons/FontAwesomeIcon.tsx +++ b/docs/src/pages/components/icons/FontAwesomeIcon.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; import { loadCSS } from 'fg-loadcss'; -import Box from '@material-ui/core/Box'; -import { green } from '@material-ui/core/colors'; -import Icon from '@material-ui/core/Icon'; +import Box from '@mui/material/Box'; +import { green } from '@mui/material/colors'; +import Icon from '@mui/material/Icon'; export default function FontAwesomeIcon() { React.useEffect(() => { diff --git a/docs/src/pages/components/icons/FontAwesomeIconSize.js b/docs/src/pages/components/icons/FontAwesomeIconSize.js index 68d4fdcf52eb54..d7c8f73b2006d4 100644 --- a/docs/src/pages/components/icons/FontAwesomeIconSize.js +++ b/docs/src/pages/components/icons/FontAwesomeIconSize.js @@ -1,10 +1,10 @@ import * as React from 'react'; import { loadCSS } from 'fg-loadcss'; -import { ThemeProvider, createTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Icon from '@material-ui/core/Icon'; -import MdPhone from '@material-ui/icons/Phone'; -import Chip from '@material-ui/core/Chip'; +import { ThemeProvider, createTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Icon from '@mui/material/Icon'; +import MdPhone from '@mui/icons-material/Phone'; +import Chip from '@mui/material/Chip'; const theme = createTheme({ components: { diff --git a/docs/src/pages/components/icons/FontAwesomeIconSize.tsx b/docs/src/pages/components/icons/FontAwesomeIconSize.tsx index ef114b6e2f9d9f..52b46aa319bbe2 100644 --- a/docs/src/pages/components/icons/FontAwesomeIconSize.tsx +++ b/docs/src/pages/components/icons/FontAwesomeIconSize.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import { loadCSS } from 'fg-loadcss'; -import { ThemeProvider, createTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Icon from '@material-ui/core/Icon'; -import MdPhone from '@material-ui/icons/Phone'; -import Chip from '@material-ui/core/Chip'; +import { ThemeProvider, createTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Icon from '@mui/material/Icon'; +import MdPhone from '@mui/icons-material/Phone'; +import Chip from '@mui/material/Chip'; const theme = createTheme({ components: { diff --git a/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.js b/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.js index 0f5dd5129b5287..f4cd9b88b6db9f 100644 --- a/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.js +++ b/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.js @@ -3,10 +3,10 @@ import PropTypes from 'prop-types'; import { faEllipsisV } from '@fortawesome/free-solid-svg-icons/faEllipsisV'; import { faInfo } from '@fortawesome/free-solid-svg-icons/faInfo'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import SvgIcon from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import SvgIcon from '@mui/material/SvgIcon'; const FontAwesomeSvgIcon = React.forwardRef((props, ref) => { const { icon } = props; diff --git a/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.tsx b/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.tsx index 85fe54c402c224..580c90f9473691 100644 --- a/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.tsx +++ b/docs/src/pages/components/icons/FontAwesomeSvgIconDemo.tsx @@ -2,10 +2,10 @@ import * as React from 'react'; import { faEllipsisV } from '@fortawesome/free-solid-svg-icons/faEllipsisV'; import { faInfo } from '@fortawesome/free-solid-svg-icons/faInfo'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import IconButton from '@material-ui/core/IconButton'; -import SvgIcon from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import SvgIcon from '@mui/material/SvgIcon'; type FontAwesomeSvgIconProps = { icon: any; diff --git a/docs/src/pages/components/icons/Icons.js b/docs/src/pages/components/icons/Icons.js index 11b1b2e9d7776d..e7381e6e23065d 100644 --- a/docs/src/pages/components/icons/Icons.js +++ b/docs/src/pages/components/icons/Icons.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { green } from '@material-ui/core/colors'; -import Icon from '@material-ui/core/Icon'; +import Box from '@mui/material/Box'; +import { green } from '@mui/material/colors'; +import Icon from '@mui/material/Icon'; export default function Icons() { return ( diff --git a/docs/src/pages/components/icons/Icons.tsx b/docs/src/pages/components/icons/Icons.tsx index 11b1b2e9d7776d..e7381e6e23065d 100644 --- a/docs/src/pages/components/icons/Icons.tsx +++ b/docs/src/pages/components/icons/Icons.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { green } from '@material-ui/core/colors'; -import Icon from '@material-ui/core/Icon'; +import Box from '@mui/material/Box'; +import { green } from '@mui/material/colors'; +import Icon from '@mui/material/Icon'; export default function Icons() { return ( diff --git a/docs/src/pages/components/icons/SvgIconsColor.js b/docs/src/pages/components/icons/SvgIconsColor.js index 440d9e92c68863..23276a81af602c 100644 --- a/docs/src/pages/components/icons/SvgIconsColor.js +++ b/docs/src/pages/components/icons/SvgIconsColor.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { pink } from '@material-ui/core/colors'; -import SvgIcon from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import { pink } from '@mui/material/colors'; +import SvgIcon from '@mui/material/SvgIcon'; function HomeIcon(props) { return ( diff --git a/docs/src/pages/components/icons/SvgIconsColor.tsx b/docs/src/pages/components/icons/SvgIconsColor.tsx index 1cdfa9436084a8..65eb8b31d8812b 100644 --- a/docs/src/pages/components/icons/SvgIconsColor.tsx +++ b/docs/src/pages/components/icons/SvgIconsColor.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { pink } from '@material-ui/core/colors'; -import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import { pink } from '@mui/material/colors'; +import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; function HomeIcon(props: SvgIconProps) { return ( diff --git a/docs/src/pages/components/icons/SvgIconsSize.js b/docs/src/pages/components/icons/SvgIconsSize.js index 6eab45ca7155cd..a7b0ea3b1e3089 100644 --- a/docs/src/pages/components/icons/SvgIconsSize.js +++ b/docs/src/pages/components/icons/SvgIconsSize.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import SvgIcon from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import SvgIcon from '@mui/material/SvgIcon'; function HomeIcon(props) { return ( diff --git a/docs/src/pages/components/icons/SvgIconsSize.tsx b/docs/src/pages/components/icons/SvgIconsSize.tsx index 00df99b00daa6c..f7592b4c4ab0df 100644 --- a/docs/src/pages/components/icons/SvgIconsSize.tsx +++ b/docs/src/pages/components/icons/SvgIconsSize.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'; +import Box from '@mui/material/Box'; +import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; function HomeIcon(props: SvgIconProps) { return ( diff --git a/docs/src/pages/components/icons/SvgMaterialIcons.js b/docs/src/pages/components/icons/SvgMaterialIcons.js index e894e2b825924a..0a23c7b6c882e2 100644 --- a/docs/src/pages/components/icons/SvgMaterialIcons.js +++ b/docs/src/pages/components/icons/SvgMaterialIcons.js @@ -1,19 +1,19 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import DeleteIcon from '@material-ui/icons/Delete'; -import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined'; -import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded'; -import DeleteTwoToneIcon from '@material-ui/icons/DeleteTwoTone'; -import DeleteSharpIcon from '@material-ui/icons/DeleteSharp'; -import DeleteForeverIcon from '@material-ui/icons/DeleteForever'; -import DeleteForeverOutlinedIcon from '@material-ui/icons/DeleteForeverOutlined'; -import DeleteForeverRoundedIcon from '@material-ui/icons/DeleteForeverRounded'; -import DeleteForeverTwoToneIcon from '@material-ui/icons/DeleteForeverTwoTone'; -import DeleteForeverSharpIcon from '@material-ui/icons/DeleteForeverSharp'; -import ThreeDRotationIcon from '@material-ui/icons/ThreeDRotation'; -import FourKIcon from '@material-ui/icons/FourK'; -import ThreeSixtyIcon from '@material-ui/icons/ThreeSixty'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import DeleteIcon from '@mui/icons-material/Delete'; +import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined'; +import DeleteRoundedIcon from '@mui/icons-material/DeleteRounded'; +import DeleteTwoToneIcon from '@mui/icons-material/DeleteTwoTone'; +import DeleteSharpIcon from '@mui/icons-material/DeleteSharp'; +import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; +import DeleteForeverOutlinedIcon from '@mui/icons-material/DeleteForeverOutlined'; +import DeleteForeverRoundedIcon from '@mui/icons-material/DeleteForeverRounded'; +import DeleteForeverTwoToneIcon from '@mui/icons-material/DeleteForeverTwoTone'; +import DeleteForeverSharpIcon from '@mui/icons-material/DeleteForeverSharp'; +import ThreeDRotationIcon from '@mui/icons-material/ThreeDRotation'; +import FourKIcon from '@mui/icons-material/FourK'; +import ThreeSixtyIcon from '@mui/icons-material/ThreeSixty'; export default function SvgMaterialIcons() { return ( diff --git a/docs/src/pages/components/icons/SvgMaterialIcons.tsx b/docs/src/pages/components/icons/SvgMaterialIcons.tsx index e894e2b825924a..0a23c7b6c882e2 100644 --- a/docs/src/pages/components/icons/SvgMaterialIcons.tsx +++ b/docs/src/pages/components/icons/SvgMaterialIcons.tsx @@ -1,19 +1,19 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import DeleteIcon from '@material-ui/icons/Delete'; -import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined'; -import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded'; -import DeleteTwoToneIcon from '@material-ui/icons/DeleteTwoTone'; -import DeleteSharpIcon from '@material-ui/icons/DeleteSharp'; -import DeleteForeverIcon from '@material-ui/icons/DeleteForever'; -import DeleteForeverOutlinedIcon from '@material-ui/icons/DeleteForeverOutlined'; -import DeleteForeverRoundedIcon from '@material-ui/icons/DeleteForeverRounded'; -import DeleteForeverTwoToneIcon from '@material-ui/icons/DeleteForeverTwoTone'; -import DeleteForeverSharpIcon from '@material-ui/icons/DeleteForeverSharp'; -import ThreeDRotationIcon from '@material-ui/icons/ThreeDRotation'; -import FourKIcon from '@material-ui/icons/FourK'; -import ThreeSixtyIcon from '@material-ui/icons/ThreeSixty'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import DeleteIcon from '@mui/icons-material/Delete'; +import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined'; +import DeleteRoundedIcon from '@mui/icons-material/DeleteRounded'; +import DeleteTwoToneIcon from '@mui/icons-material/DeleteTwoTone'; +import DeleteSharpIcon from '@mui/icons-material/DeleteSharp'; +import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; +import DeleteForeverOutlinedIcon from '@mui/icons-material/DeleteForeverOutlined'; +import DeleteForeverRoundedIcon from '@mui/icons-material/DeleteForeverRounded'; +import DeleteForeverTwoToneIcon from '@mui/icons-material/DeleteForeverTwoTone'; +import DeleteForeverSharpIcon from '@mui/icons-material/DeleteForeverSharp'; +import ThreeDRotationIcon from '@mui/icons-material/ThreeDRotation'; +import FourKIcon from '@mui/icons-material/FourK'; +import ThreeSixtyIcon from '@mui/icons-material/ThreeSixty'; export default function SvgMaterialIcons() { return ( diff --git a/docs/src/pages/components/icons/TwoToneIcons.js b/docs/src/pages/components/icons/TwoToneIcons.js index 50890808b2d8a7..125785fdc2f975 100644 --- a/docs/src/pages/components/icons/TwoToneIcons.js +++ b/docs/src/pages/components/icons/TwoToneIcons.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Icon from '@material-ui/core/Icon'; +import Icon from '@mui/material/Icon'; export default function TwoToneIcons() { return add_circle; diff --git a/docs/src/pages/components/icons/TwoToneIcons.tsx b/docs/src/pages/components/icons/TwoToneIcons.tsx index 50890808b2d8a7..125785fdc2f975 100644 --- a/docs/src/pages/components/icons/TwoToneIcons.tsx +++ b/docs/src/pages/components/icons/TwoToneIcons.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Icon from '@material-ui/core/Icon'; +import Icon from '@mui/material/Icon'; export default function TwoToneIcons() { return add_circle; diff --git a/docs/src/pages/components/icons/icons.md b/docs/src/pages/components/icons/icons.md index 43fa7f7fb81fdd..6f94d84a65f7cc 100644 --- a/docs/src/pages/components/icons/icons.md +++ b/docs/src/pages/components/icons/icons.md @@ -18,7 +18,7 @@ Material-UI provides icons support in three ways: ## Material icons Google has created over 1,700 official Material icons, each in five different "themes" (see below). -For each SVG icon, we export the respective React component from the `@material-ui/icons` package. +For each SVG icon, we export the respective React component from the `@mui/icons-material` package. You can [search the full list of these icons](/components/material-icons/). ### Installation @@ -27,10 +27,10 @@ Install the package in your project directory with: ```sh // with npm -npm install @material-ui/icons@next +npm install @mui/icons-material@next // with yarn -yarn add @material-ui/icons@next +yarn add @mui/icons-material@next ``` These components use the Material-UI `SvgIcon` component to render the SVG path for each icon, and so have a peer-dependency on `@materialui/core`. @@ -39,10 +39,10 @@ If you aren't already using Material-UI in your project, you can add it with: ```sh // with npm -npm install @material-ui/core@next +npm install @mui/material@next // with yarn -yarn add @material-ui/core@next +yarn add @mui/material@next ``` ### Usage @@ -52,37 +52,37 @@ Import icons using one of these two options: - Option 1: ```jsx - import AccessAlarmIcon from '@material-ui/icons/AccessAlarm'; - import ThreeDRotation from '@material-ui/icons/ThreeDRotation'; + import AccessAlarmIcon from '@mui/icons-material/AccessAlarm'; + import ThreeDRotation from '@mui/icons-material/ThreeDRotation'; ``` - Option 2: ```jsx - import { AccessAlarm, ThreeDRotation } from '@material-ui/icons'; + import { AccessAlarm, ThreeDRotation } from '@mui/icons-material'; ``` The safest for bundle size is Option 1, but some developers prefer Option 2. Make sure you follow the [minimizing bundle size guide](/guides/minimizing-bundle-size/#option-2) before using the second approach. -Each Material icon also has a "theme": Filled (default), Outlined, Rounded, Two-tone, and Sharp. To import the icon component with a theme other than the default, append the theme name to the icon name. For example `@material-ui/icons/Delete` icon with: +Each Material icon also has a "theme": Filled (default), Outlined, Rounded, Two-tone, and Sharp. To import the icon component with a theme other than the default, append the theme name to the icon name. For example `@mui/icons-material/Delete` icon with: -- Filled theme (default) is exported as `@material-ui/icons/Delete`, -- Outlined theme is exported as `@material-ui/icons/DeleteOutlined`, -- Rounded theme is exported as `@material-ui/icons/DeleteRounded`, -- Twotone theme is exported as `@material-ui/icons/DeleteTwoTone`, -- Sharp theme is exported as `@material-ui/icons/DeleteSharp`. +- Filled theme (default) is exported as `@mui/icons-material/Delete`, +- Outlined theme is exported as `@mui/icons-material/DeleteOutlined`, +- Rounded theme is exported as `@mui/icons-material/DeleteRounded`, +- Twotone theme is exported as `@mui/icons-material/DeleteTwoTone`, +- Sharp theme is exported as `@mui/icons-material/DeleteSharp`. -> Note: The Material Design guidelines name the icons using "snake_case" naming (for example `delete_forever`, `add_a_photo`), while `@material-ui/icons` exports the respective icons using "PascalCase" naming (for example `DeleteForever`, `AddAPhoto`). There are three exceptions to this naming rule: `3d_rotation` exported as `ThreeDRotation`, `4k` exported as `FourK`, and `360` exported as `ThreeSixty`. +> Note: The Material Design guidelines name the icons using "snake_case" naming (for example `delete_forever`, `add_a_photo`), while `@mui/icons-material` exports the respective icons using "PascalCase" naming (for example `DeleteForever`, `AddAPhoto`). There are three exceptions to this naming rule: `3d_rotation` exported as `ThreeDRotation`, `4k` exported as `FourK`, and `360` exported as `ThreeSixty`. {{"demo": "pages/components/icons/SvgMaterialIcons.js"}} ### Testing -For testing purposes, each icon exposed from `@material-ui/icons` has a `data-testid` attribute with the name of the icon. For instance: +For testing purposes, each icon exposed from `@mui/icons-material` has a `data-testid` attribute with the name of the icon. For instance: ```jsx -import DeleteIcon from '@material-ui/icons/Delete'; +import DeleteIcon from '@mui/icons-material/Delete'; ``` has the following attribute once mounted: @@ -192,7 +192,7 @@ To use an icon simply wrap the icon name (font ligature) with the `Icon` compone for example: ```jsx -import Icon from '@material-ui/core/Icon'; +import Icon from '@mui/material/Icon'; star; ``` @@ -220,7 +220,7 @@ For other fonts, you can customize the baseline class name using the `baseClassN For instance, you can display two-tone icons with Material Design: ```jsx -import Icon from '@material-ui/core/Icon'; +import Icon from '@mui/material/Icon'; ` element are added so that your icon In the case of focusable interactive elements, for example when used with an icon button, you can use the `aria-label` prop: ```jsx -import IconButton from '@material-ui/core/IconButton'; -import SvgIcon from '@material-ui/core/SvgIcon'; +import IconButton from '@mui/material/IconButton'; +import SvgIcon from '@mui/material/SvgIcon'; // ... @@ -332,9 +332,9 @@ import SvgIcon from '@material-ui/core/SvgIcon'; You need to provide a text alternative that is only visible to assistive technologies. ```jsx -import Box from '@material-ui/core/Box'; -import Icon from '@material-ui/core/Icon'; -import { visuallyHidden } from '@material-ui/utils'; +import Box from '@mui/material/Box'; +import Icon from '@mui/material/Icon'; +import { visuallyHidden } from '@mui/utils'; // ... diff --git a/docs/src/pages/components/image-list/CustomImageList.js b/docs/src/pages/components/image-list/CustomImageList.js index e810aa1642614f..d11b26909d508f 100644 --- a/docs/src/pages/components/image-list/CustomImageList.js +++ b/docs/src/pages/components/image-list/CustomImageList.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; -import IconButton from '@material-ui/core/IconButton'; -import StarBorderIcon from '@material-ui/icons/StarBorder'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; +import IconButton from '@mui/material/IconButton'; +import StarBorderIcon from '@mui/icons-material/StarBorder'; function srcset(image, width, height, rows = 1, cols = 1) { return { diff --git a/docs/src/pages/components/image-list/CustomImageList.tsx b/docs/src/pages/components/image-list/CustomImageList.tsx index 873cd7f87f53b5..23f17e788c5012 100644 --- a/docs/src/pages/components/image-list/CustomImageList.tsx +++ b/docs/src/pages/components/image-list/CustomImageList.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; -import IconButton from '@material-ui/core/IconButton'; -import StarBorderIcon from '@material-ui/icons/StarBorder'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; +import IconButton from '@mui/material/IconButton'; +import StarBorderIcon from '@mui/icons-material/StarBorder'; function srcset(image: string, width: number, height: number, rows = 1, cols = 1) { return { diff --git a/docs/src/pages/components/image-list/MasonryImageList.js b/docs/src/pages/components/image-list/MasonryImageList.js index 5a8a50edb126af..a98a12a61a908f 100644 --- a/docs/src/pages/components/image-list/MasonryImageList.js +++ b/docs/src/pages/components/image-list/MasonryImageList.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import Box from '@mui/material/Box'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function MasonryImageList() { return ( diff --git a/docs/src/pages/components/image-list/MasonryImageList.tsx b/docs/src/pages/components/image-list/MasonryImageList.tsx index 5a8a50edb126af..a98a12a61a908f 100644 --- a/docs/src/pages/components/image-list/MasonryImageList.tsx +++ b/docs/src/pages/components/image-list/MasonryImageList.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import Box from '@mui/material/Box'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function MasonryImageList() { return ( diff --git a/docs/src/pages/components/image-list/QuiltedImageList.js b/docs/src/pages/components/image-list/QuiltedImageList.js index c53427796c3ca2..4347fee3aa31fc 100644 --- a/docs/src/pages/components/image-list/QuiltedImageList.js +++ b/docs/src/pages/components/image-list/QuiltedImageList.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; function srcset(image, size, rows = 1, cols = 1) { return { diff --git a/docs/src/pages/components/image-list/QuiltedImageList.tsx b/docs/src/pages/components/image-list/QuiltedImageList.tsx index 61e4a97a97f620..1a658b7209743c 100644 --- a/docs/src/pages/components/image-list/QuiltedImageList.tsx +++ b/docs/src/pages/components/image-list/QuiltedImageList.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; function srcset(image: string, size: number, rows = 1, cols = 1) { return { diff --git a/docs/src/pages/components/image-list/StandardImageList.js b/docs/src/pages/components/image-list/StandardImageList.js index 73fe8e44984c88..7b275e751ba8e1 100644 --- a/docs/src/pages/components/image-list/StandardImageList.js +++ b/docs/src/pages/components/image-list/StandardImageList.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function StandardImageList() { return ( diff --git a/docs/src/pages/components/image-list/StandardImageList.tsx b/docs/src/pages/components/image-list/StandardImageList.tsx index 73fe8e44984c88..7b275e751ba8e1 100644 --- a/docs/src/pages/components/image-list/StandardImageList.tsx +++ b/docs/src/pages/components/image-list/StandardImageList.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function StandardImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarBelowImageList.js b/docs/src/pages/components/image-list/TitlebarBelowImageList.js index ee3f52998d49f1..64130c6ea7e015 100644 --- a/docs/src/pages/components/image-list/TitlebarBelowImageList.js +++ b/docs/src/pages/components/image-list/TitlebarBelowImageList.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; export default function TitlebarBelowImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarBelowImageList.tsx b/docs/src/pages/components/image-list/TitlebarBelowImageList.tsx index ee3f52998d49f1..64130c6ea7e015 100644 --- a/docs/src/pages/components/image-list/TitlebarBelowImageList.tsx +++ b/docs/src/pages/components/image-list/TitlebarBelowImageList.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; export default function TitlebarBelowImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.js b/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.js index 20c4d9549bc086..be826d7729a0ea 100644 --- a/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.js +++ b/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; +import Box from '@mui/material/Box'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; export default function TitlebarBelowMasonryImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.tsx b/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.tsx index 20c4d9549bc086..be826d7729a0ea 100644 --- a/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.tsx +++ b/docs/src/pages/components/image-list/TitlebarBelowMasonryImageList.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; +import Box from '@mui/material/Box'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; export default function TitlebarBelowMasonryImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarImageList.js b/docs/src/pages/components/image-list/TitlebarImageList.js index 5c22bd618834e3..e622271e8b2853 100644 --- a/docs/src/pages/components/image-list/TitlebarImageList.js +++ b/docs/src/pages/components/image-list/TitlebarImageList.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import IconButton from '@material-ui/core/IconButton'; -import InfoIcon from '@material-ui/icons/Info'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; +import ListSubheader from '@mui/material/ListSubheader'; +import IconButton from '@mui/material/IconButton'; +import InfoIcon from '@mui/icons-material/Info'; export default function TitlebarImageList() { return ( diff --git a/docs/src/pages/components/image-list/TitlebarImageList.tsx b/docs/src/pages/components/image-list/TitlebarImageList.tsx index 5c22bd618834e3..e622271e8b2853 100644 --- a/docs/src/pages/components/image-list/TitlebarImageList.tsx +++ b/docs/src/pages/components/image-list/TitlebarImageList.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; -import ImageListItemBar from '@material-ui/core/ImageListItemBar'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import IconButton from '@material-ui/core/IconButton'; -import InfoIcon from '@material-ui/icons/Info'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; +import ListSubheader from '@mui/material/ListSubheader'; +import IconButton from '@mui/material/IconButton'; +import InfoIcon from '@mui/icons-material/Info'; export default function TitlebarImageList() { return ( diff --git a/docs/src/pages/components/image-list/WovenImageList.js b/docs/src/pages/components/image-list/WovenImageList.js index c0c1eb93409937..0c368b6b168d22 100644 --- a/docs/src/pages/components/image-list/WovenImageList.js +++ b/docs/src/pages/components/image-list/WovenImageList.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function WovenImageList() { return ( diff --git a/docs/src/pages/components/image-list/WovenImageList.tsx b/docs/src/pages/components/image-list/WovenImageList.tsx index c0c1eb93409937..0c368b6b168d22 100644 --- a/docs/src/pages/components/image-list/WovenImageList.tsx +++ b/docs/src/pages/components/image-list/WovenImageList.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import ImageList from '@material-ui/core/ImageList'; -import ImageListItem from '@material-ui/core/ImageListItem'; +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; export default function WovenImageList() { return ( diff --git a/docs/src/pages/components/links/ButtonLink.js b/docs/src/pages/components/links/ButtonLink.js index 76fbb5bded59c8..532f634c918188 100644 --- a/docs/src/pages/components/links/ButtonLink.js +++ b/docs/src/pages/components/links/ButtonLink.js @@ -1,6 +1,6 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Link from '@material-ui/core/Link'; +import Link from '@mui/material/Link'; export default function ButtonLink() { return ( diff --git a/docs/src/pages/components/links/ButtonLink.tsx b/docs/src/pages/components/links/ButtonLink.tsx index 76fbb5bded59c8..532f634c918188 100644 --- a/docs/src/pages/components/links/ButtonLink.tsx +++ b/docs/src/pages/components/links/ButtonLink.tsx @@ -1,6 +1,6 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Link from '@material-ui/core/Link'; +import Link from '@mui/material/Link'; export default function ButtonLink() { return ( diff --git a/docs/src/pages/components/links/Links.js b/docs/src/pages/components/links/Links.js index 701739ab1f6de6..5da63a15f261ea 100644 --- a/docs/src/pages/components/links/Links.js +++ b/docs/src/pages/components/links/Links.js @@ -1,7 +1,7 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; const preventDefault = (event) => event.preventDefault(); diff --git a/docs/src/pages/components/links/Links.tsx b/docs/src/pages/components/links/Links.tsx index 49a8795efa0cf3..fccd3987d5b902 100644 --- a/docs/src/pages/components/links/Links.tsx +++ b/docs/src/pages/components/links/Links.tsx @@ -1,7 +1,7 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; const preventDefault = (event: React.SyntheticEvent) => event.preventDefault(); diff --git a/docs/src/pages/components/links/UnderlineLink.js b/docs/src/pages/components/links/UnderlineLink.js index 4b1488843b6cbb..768456775722bd 100644 --- a/docs/src/pages/components/links/UnderlineLink.js +++ b/docs/src/pages/components/links/UnderlineLink.js @@ -1,7 +1,7 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; const preventDefault = (event) => event.preventDefault(); diff --git a/docs/src/pages/components/links/UnderlineLink.tsx b/docs/src/pages/components/links/UnderlineLink.tsx index 8332b2f2d6ba1c..c105aca6491d1e 100644 --- a/docs/src/pages/components/links/UnderlineLink.tsx +++ b/docs/src/pages/components/links/UnderlineLink.tsx @@ -1,7 +1,7 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; const preventDefault = (event: React.SyntheticEvent) => event.preventDefault(); diff --git a/docs/src/pages/components/lists/AlignItemsList.js b/docs/src/pages/components/lists/AlignItemsList.js index df480c3488a27d..e59fe8bd54d75c 100644 --- a/docs/src/pages/components/lists/AlignItemsList.js +++ b/docs/src/pages/components/lists/AlignItemsList.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import Divider from '@material-ui/core/Divider'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import Divider from '@mui/material/Divider'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; export default function AlignItemsList() { return ( diff --git a/docs/src/pages/components/lists/AlignItemsList.tsx b/docs/src/pages/components/lists/AlignItemsList.tsx index df480c3488a27d..e59fe8bd54d75c 100644 --- a/docs/src/pages/components/lists/AlignItemsList.tsx +++ b/docs/src/pages/components/lists/AlignItemsList.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import Divider from '@material-ui/core/Divider'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import Divider from '@mui/material/Divider'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; export default function AlignItemsList() { return ( diff --git a/docs/src/pages/components/lists/BasicList.js b/docs/src/pages/components/lists/BasicList.js index 9cf173d8e17a24..9e894d0dd0c4aa 100644 --- a/docs/src/pages/components/lists/BasicList.js +++ b/docs/src/pages/components/lists/BasicList.js @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; -import InboxIcon from '@material-ui/icons/Inbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; +import InboxIcon from '@mui/icons-material/Inbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; export default function BasicList() { return ( diff --git a/docs/src/pages/components/lists/BasicList.tsx b/docs/src/pages/components/lists/BasicList.tsx index 9cf173d8e17a24..9e894d0dd0c4aa 100644 --- a/docs/src/pages/components/lists/BasicList.tsx +++ b/docs/src/pages/components/lists/BasicList.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; -import InboxIcon from '@material-ui/icons/Inbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; +import InboxIcon from '@mui/icons-material/Inbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; export default function BasicList() { return ( diff --git a/docs/src/pages/components/lists/CheckboxList.js b/docs/src/pages/components/lists/CheckboxList.js index 168fc945f03016..87bb3a2c9ff2e0 100644 --- a/docs/src/pages/components/lists/CheckboxList.js +++ b/docs/src/pages/components/lists/CheckboxList.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Checkbox from '@material-ui/core/Checkbox'; -import IconButton from '@material-ui/core/IconButton'; -import CommentIcon from '@material-ui/icons/Comment'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Checkbox from '@mui/material/Checkbox'; +import IconButton from '@mui/material/IconButton'; +import CommentIcon from '@mui/icons-material/Comment'; export default function CheckboxList() { const [checked, setChecked] = React.useState([0]); diff --git a/docs/src/pages/components/lists/CheckboxList.tsx b/docs/src/pages/components/lists/CheckboxList.tsx index ec0f9610b0b9ec..37556f7cd24b62 100644 --- a/docs/src/pages/components/lists/CheckboxList.tsx +++ b/docs/src/pages/components/lists/CheckboxList.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Checkbox from '@material-ui/core/Checkbox'; -import IconButton from '@material-ui/core/IconButton'; -import CommentIcon from '@material-ui/icons/Comment'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Checkbox from '@mui/material/Checkbox'; +import IconButton from '@mui/material/IconButton'; +import CommentIcon from '@mui/icons-material/Comment'; export default function CheckboxList() { const [checked, setChecked] = React.useState([0]); diff --git a/docs/src/pages/components/lists/CheckboxListSecondary.js b/docs/src/pages/components/lists/CheckboxListSecondary.js index 3b40e93692deed..361654e2f4686b 100644 --- a/docs/src/pages/components/lists/CheckboxListSecondary.js +++ b/docs/src/pages/components/lists/CheckboxListSecondary.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Checkbox from '@material-ui/core/Checkbox'; -import Avatar from '@material-ui/core/Avatar'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Checkbox from '@mui/material/Checkbox'; +import Avatar from '@mui/material/Avatar'; export default function CheckboxListSecondary() { const [checked, setChecked] = React.useState([1]); diff --git a/docs/src/pages/components/lists/CheckboxListSecondary.tsx b/docs/src/pages/components/lists/CheckboxListSecondary.tsx index 31ac29d9635a7e..ace469bb7f2358 100644 --- a/docs/src/pages/components/lists/CheckboxListSecondary.tsx +++ b/docs/src/pages/components/lists/CheckboxListSecondary.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Checkbox from '@material-ui/core/Checkbox'; -import Avatar from '@material-ui/core/Avatar'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Checkbox from '@mui/material/Checkbox'; +import Avatar from '@mui/material/Avatar'; export default function CheckboxListSecondary() { const [checked, setChecked] = React.useState([1]); diff --git a/docs/src/pages/components/lists/CustomizedList.js b/docs/src/pages/components/lists/CustomizedList.js index 6a3ca26d86eb7e..192119cfe337d1 100644 --- a/docs/src/pages/components/lists/CustomizedList.js +++ b/docs/src/pages/components/lists/CustomizedList.js @@ -1,23 +1,23 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { styled, ThemeProvider, createTheme } from '@material-ui/core/styles'; -import Divider from '@material-ui/core/Divider'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Paper from '@material-ui/core/Paper'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip'; -import ArrowRight from '@material-ui/icons/ArrowRight'; -import KeyboardArrowDown from '@material-ui/icons/KeyboardArrowDown'; -import Home from '@material-ui/icons/Home'; -import Settings from '@material-ui/icons/Settings'; -import People from '@material-ui/icons/People'; -import PermMedia from '@material-ui/icons/PermMedia'; -import Dns from '@material-ui/icons/Dns'; -import Public from '@material-ui/icons/Public'; +import Box from '@mui/material/Box'; +import { styled, ThemeProvider, createTheme } from '@mui/material/styles'; +import Divider from '@mui/material/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Paper from '@mui/material/Paper'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip'; +import ArrowRight from '@mui/icons-material/ArrowRight'; +import KeyboardArrowDown from '@mui/icons-material/KeyboardArrowDown'; +import Home from '@mui/icons-material/Home'; +import Settings from '@mui/icons-material/Settings'; +import People from '@mui/icons-material/People'; +import PermMedia from '@mui/icons-material/PermMedia'; +import Dns from '@mui/icons-material/Dns'; +import Public from '@mui/icons-material/Public'; const data = [ { icon: , label: 'Authentication' }, diff --git a/docs/src/pages/components/lists/CustomizedList.tsx b/docs/src/pages/components/lists/CustomizedList.tsx index af262358ddb9d2..c9a0d868b36a1d 100644 --- a/docs/src/pages/components/lists/CustomizedList.tsx +++ b/docs/src/pages/components/lists/CustomizedList.tsx @@ -1,23 +1,23 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import { styled, ThemeProvider, createTheme } from '@material-ui/core/styles'; -import Divider from '@material-ui/core/Divider'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Paper from '@material-ui/core/Paper'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip'; -import ArrowRight from '@material-ui/icons/ArrowRight'; -import KeyboardArrowDown from '@material-ui/icons/KeyboardArrowDown'; -import Home from '@material-ui/icons/Home'; -import Settings from '@material-ui/icons/Settings'; -import People from '@material-ui/icons/People'; -import PermMedia from '@material-ui/icons/PermMedia'; -import Dns from '@material-ui/icons/Dns'; -import Public from '@material-ui/icons/Public'; +import Box from '@mui/material/Box'; +import { styled, ThemeProvider, createTheme } from '@mui/material/styles'; +import Divider from '@mui/material/Divider'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Paper from '@mui/material/Paper'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip'; +import ArrowRight from '@mui/icons-material/ArrowRight'; +import KeyboardArrowDown from '@mui/icons-material/KeyboardArrowDown'; +import Home from '@mui/icons-material/Home'; +import Settings from '@mui/icons-material/Settings'; +import People from '@mui/icons-material/People'; +import PermMedia from '@mui/icons-material/PermMedia'; +import Dns from '@mui/icons-material/Dns'; +import Public from '@mui/icons-material/Public'; const data = [ { icon: , label: 'Authentication' }, diff --git a/docs/src/pages/components/lists/FolderList.js b/docs/src/pages/components/lists/FolderList.js index a0cac8c77c2e20..3fc666d2aa6dde 100644 --- a/docs/src/pages/components/lists/FolderList.js +++ b/docs/src/pages/components/lists/FolderList.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import ImageIcon from '@material-ui/icons/Image'; -import WorkIcon from '@material-ui/icons/Work'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import ImageIcon from '@mui/icons-material/Image'; +import WorkIcon from '@mui/icons-material/Work'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; export default function FolderList() { return ( diff --git a/docs/src/pages/components/lists/FolderList.tsx b/docs/src/pages/components/lists/FolderList.tsx index a0cac8c77c2e20..3fc666d2aa6dde 100644 --- a/docs/src/pages/components/lists/FolderList.tsx +++ b/docs/src/pages/components/lists/FolderList.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import Avatar from '@material-ui/core/Avatar'; -import ImageIcon from '@material-ui/icons/Image'; -import WorkIcon from '@material-ui/icons/Work'; -import BeachAccessIcon from '@material-ui/icons/BeachAccess'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import Avatar from '@mui/material/Avatar'; +import ImageIcon from '@mui/icons-material/Image'; +import WorkIcon from '@mui/icons-material/Work'; +import BeachAccessIcon from '@mui/icons-material/BeachAccess'; export default function FolderList() { return ( diff --git a/docs/src/pages/components/lists/GutterlessList.js b/docs/src/pages/components/lists/GutterlessList.js index 2d9d881efa123c..c8649b700d95c7 100644 --- a/docs/src/pages/components/lists/GutterlessList.js +++ b/docs/src/pages/components/lists/GutterlessList.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import CommentIcon from '@material-ui/icons/Comment'; -import IconButton from '@material-ui/core/IconButton'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import CommentIcon from '@mui/icons-material/Comment'; +import IconButton from '@mui/material/IconButton'; export default function GutterlessList() { return ( diff --git a/docs/src/pages/components/lists/GutterlessList.tsx b/docs/src/pages/components/lists/GutterlessList.tsx index 2d9d881efa123c..c8649b700d95c7 100644 --- a/docs/src/pages/components/lists/GutterlessList.tsx +++ b/docs/src/pages/components/lists/GutterlessList.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import CommentIcon from '@material-ui/icons/Comment'; -import IconButton from '@material-ui/core/IconButton'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import CommentIcon from '@mui/icons-material/Comment'; +import IconButton from '@mui/material/IconButton'; export default function GutterlessList() { return ( diff --git a/docs/src/pages/components/lists/InsetList.js b/docs/src/pages/components/lists/InsetList.js index 57379ec413150a..3b438ac56bf2a1 100644 --- a/docs/src/pages/components/lists/InsetList.js +++ b/docs/src/pages/components/lists/InsetList.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import StarIcon from '@material-ui/icons/Star'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import StarIcon from '@mui/icons-material/Star'; export default function InsetList() { return ( diff --git a/docs/src/pages/components/lists/InsetList.tsx b/docs/src/pages/components/lists/InsetList.tsx index 57379ec413150a..3b438ac56bf2a1 100644 --- a/docs/src/pages/components/lists/InsetList.tsx +++ b/docs/src/pages/components/lists/InsetList.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import StarIcon from '@material-ui/icons/Star'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import StarIcon from '@mui/icons-material/Star'; export default function InsetList() { return ( diff --git a/docs/src/pages/components/lists/InteractiveList.js b/docs/src/pages/components/lists/InteractiveList.js index fecf380c184e5d..cf67680b05e185 100644 --- a/docs/src/pages/components/lists/InteractiveList.js +++ b/docs/src/pages/components/lists/InteractiveList.js @@ -1,20 +1,20 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; -import IconButton from '@material-ui/core/IconButton'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Checkbox from '@material-ui/core/Checkbox'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import FolderIcon from '@material-ui/icons/Folder'; -import DeleteIcon from '@material-ui/icons/Delete'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; +import IconButton from '@mui/material/IconButton'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Checkbox from '@mui/material/Checkbox'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import FolderIcon from '@mui/icons-material/Folder'; +import DeleteIcon from '@mui/icons-material/Delete'; function generate(element) { return [0, 1, 2].map((value) => diff --git a/docs/src/pages/components/lists/InteractiveList.tsx b/docs/src/pages/components/lists/InteractiveList.tsx index 9ec856644e3ec1..ba8ed0cfabbd5d 100644 --- a/docs/src/pages/components/lists/InteractiveList.tsx +++ b/docs/src/pages/components/lists/InteractiveList.tsx @@ -1,20 +1,20 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemAvatar from '@material-ui/core/ListItemAvatar'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Avatar from '@material-ui/core/Avatar'; -import IconButton from '@material-ui/core/IconButton'; -import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Checkbox from '@material-ui/core/Checkbox'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import FolderIcon from '@material-ui/icons/Folder'; -import DeleteIcon from '@material-ui/icons/Delete'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemAvatar from '@mui/material/ListItemAvatar'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Avatar from '@mui/material/Avatar'; +import IconButton from '@mui/material/IconButton'; +import FormGroup from '@mui/material/FormGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Checkbox from '@mui/material/Checkbox'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import FolderIcon from '@mui/icons-material/Folder'; +import DeleteIcon from '@mui/icons-material/Delete'; function generate(element: React.ReactElement) { return [0, 1, 2].map((value) => diff --git a/docs/src/pages/components/lists/NestedList.js b/docs/src/pages/components/lists/NestedList.js index 1f209027f34af7..a73be80919daa1 100644 --- a/docs/src/pages/components/lists/NestedList.js +++ b/docs/src/pages/components/lists/NestedList.js @@ -1,16 +1,16 @@ import * as React from 'react'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import List from '@material-ui/core/List'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Collapse from '@material-ui/core/Collapse'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; -import SendIcon from '@material-ui/icons/Send'; -import ExpandLess from '@material-ui/icons/ExpandLess'; -import ExpandMore from '@material-ui/icons/ExpandMore'; -import StarBorder from '@material-ui/icons/StarBorder'; +import ListSubheader from '@mui/material/ListSubheader'; +import List from '@mui/material/List'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Collapse from '@mui/material/Collapse'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; +import SendIcon from '@mui/icons-material/Send'; +import ExpandLess from '@mui/icons-material/ExpandLess'; +import ExpandMore from '@mui/icons-material/ExpandMore'; +import StarBorder from '@mui/icons-material/StarBorder'; export default function NestedList() { const [open, setOpen] = React.useState(true); diff --git a/docs/src/pages/components/lists/NestedList.tsx b/docs/src/pages/components/lists/NestedList.tsx index 1f209027f34af7..a73be80919daa1 100644 --- a/docs/src/pages/components/lists/NestedList.tsx +++ b/docs/src/pages/components/lists/NestedList.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import List from '@material-ui/core/List'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Collapse from '@material-ui/core/Collapse'; -import InboxIcon from '@material-ui/icons/MoveToInbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; -import SendIcon from '@material-ui/icons/Send'; -import ExpandLess from '@material-ui/icons/ExpandLess'; -import ExpandMore from '@material-ui/icons/ExpandMore'; -import StarBorder from '@material-ui/icons/StarBorder'; +import ListSubheader from '@mui/material/ListSubheader'; +import List from '@mui/material/List'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Collapse from '@mui/material/Collapse'; +import InboxIcon from '@mui/icons-material/MoveToInbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; +import SendIcon from '@mui/icons-material/Send'; +import ExpandLess from '@mui/icons-material/ExpandLess'; +import ExpandMore from '@mui/icons-material/ExpandMore'; +import StarBorder from '@mui/icons-material/StarBorder'; export default function NestedList() { const [open, setOpen] = React.useState(true); diff --git a/docs/src/pages/components/lists/PinnedSubheaderList.js b/docs/src/pages/components/lists/PinnedSubheaderList.js index 31b0b5cd4d005b..f55b92e91e55e1 100644 --- a/docs/src/pages/components/lists/PinnedSubheaderList.js +++ b/docs/src/pages/components/lists/PinnedSubheaderList.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; export default function PinnedSubheaderList() { return ( diff --git a/docs/src/pages/components/lists/PinnedSubheaderList.tsx b/docs/src/pages/components/lists/PinnedSubheaderList.tsx index 31b0b5cd4d005b..f55b92e91e55e1 100644 --- a/docs/src/pages/components/lists/PinnedSubheaderList.tsx +++ b/docs/src/pages/components/lists/PinnedSubheaderList.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; export default function PinnedSubheaderList() { return ( diff --git a/docs/src/pages/components/lists/SelectedListItem.js b/docs/src/pages/components/lists/SelectedListItem.js index 5f4463bddbda55..33c58689594368 100644 --- a/docs/src/pages/components/lists/SelectedListItem.js +++ b/docs/src/pages/components/lists/SelectedListItem.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; -import InboxIcon from '@material-ui/icons/Inbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; +import InboxIcon from '@mui/icons-material/Inbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; export default function SelectedListItem() { const [selectedIndex, setSelectedIndex] = React.useState(1); diff --git a/docs/src/pages/components/lists/SelectedListItem.tsx b/docs/src/pages/components/lists/SelectedListItem.tsx index afa87e6a90e073..f042861bf31b93 100644 --- a/docs/src/pages/components/lists/SelectedListItem.tsx +++ b/docs/src/pages/components/lists/SelectedListItem.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import List from '@material-ui/core/List'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import Divider from '@material-ui/core/Divider'; -import InboxIcon from '@material-ui/icons/Inbox'; -import DraftsIcon from '@material-ui/icons/Drafts'; +import Box from '@mui/material/Box'; +import List from '@mui/material/List'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import Divider from '@mui/material/Divider'; +import InboxIcon from '@mui/icons-material/Inbox'; +import DraftsIcon from '@mui/icons-material/Drafts'; export default function SelectedListItem() { const [selectedIndex, setSelectedIndex] = React.useState(1); diff --git a/docs/src/pages/components/lists/SwitchListSecondary.js b/docs/src/pages/components/lists/SwitchListSecondary.js index 4e2a83ae1de695..3e7e4bd74463fd 100644 --- a/docs/src/pages/components/lists/SwitchListSecondary.js +++ b/docs/src/pages/components/lists/SwitchListSecondary.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Switch from '@material-ui/core/Switch'; -import WifiIcon from '@material-ui/icons/Wifi'; -import BluetoothIcon from '@material-ui/icons/Bluetooth'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; +import Switch from '@mui/material/Switch'; +import WifiIcon from '@mui/icons-material/Wifi'; +import BluetoothIcon from '@mui/icons-material/Bluetooth'; export default function SwitchListSecondary() { const [checked, setChecked] = React.useState(['wifi']); diff --git a/docs/src/pages/components/lists/SwitchListSecondary.tsx b/docs/src/pages/components/lists/SwitchListSecondary.tsx index c560049862a966..eb708aab47744a 100644 --- a/docs/src/pages/components/lists/SwitchListSecondary.tsx +++ b/docs/src/pages/components/lists/SwitchListSecondary.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import Switch from '@material-ui/core/Switch'; -import WifiIcon from '@material-ui/icons/Wifi'; -import BluetoothIcon from '@material-ui/icons/Bluetooth'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import ListSubheader from '@mui/material/ListSubheader'; +import Switch from '@mui/material/Switch'; +import WifiIcon from '@mui/icons-material/Wifi'; +import BluetoothIcon from '@mui/icons-material/Bluetooth'; export default function SwitchListSecondary() { const [checked, setChecked] = React.useState(['wifi']); diff --git a/docs/src/pages/components/lists/VirtualizedList.js b/docs/src/pages/components/lists/VirtualizedList.js index 510e6a407e6082..7b74d1155f12d3 100644 --- a/docs/src/pages/components/lists/VirtualizedList.js +++ b/docs/src/pages/components/lists/VirtualizedList.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemText from '@material-ui/core/ListItemText'; +import Box from '@mui/material/Box'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemText from '@mui/material/ListItemText'; import { FixedSizeList } from 'react-window'; function renderRow(props) { diff --git a/docs/src/pages/components/lists/VirtualizedList.tsx b/docs/src/pages/components/lists/VirtualizedList.tsx index 8f65ba6241e632..899b0821ad0a3f 100644 --- a/docs/src/pages/components/lists/VirtualizedList.tsx +++ b/docs/src/pages/components/lists/VirtualizedList.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemText from '@material-ui/core/ListItemText'; +import Box from '@mui/material/Box'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemText from '@mui/material/ListItemText'; import { FixedSizeList, ListChildComponentProps } from 'react-window'; function renderRow(props: ListChildComponentProps) { diff --git a/docs/src/pages/components/masonry/BasicMasonry.js b/docs/src/pages/components/masonry/BasicMasonry.js index 803ca3b1380160..e412a2abaa0ee3 100644 --- a/docs/src/pages/components/masonry/BasicMasonry.js +++ b/docs/src/pages/components/masonry/BasicMasonry.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 110, 150, 130, 80, 50, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/BasicMasonry.tsx b/docs/src/pages/components/masonry/BasicMasonry.tsx index 803ca3b1380160..e412a2abaa0ee3 100644 --- a/docs/src/pages/components/masonry/BasicMasonry.tsx +++ b/docs/src/pages/components/masonry/BasicMasonry.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 110, 150, 130, 80, 50, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/DiffColSizeMasonry.js b/docs/src/pages/components/masonry/DiffColSizeMasonry.js index f1265000c013f4..c60680bf2ef04e 100644 --- a/docs/src/pages/components/masonry/DiffColSizeMasonry.js +++ b/docs/src/pages/components/masonry/DiffColSizeMasonry.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function DiffColSizeMasonry() { return ( diff --git a/docs/src/pages/components/masonry/DiffColSizeMasonry.tsx b/docs/src/pages/components/masonry/DiffColSizeMasonry.tsx index f1265000c013f4..c60680bf2ef04e 100644 --- a/docs/src/pages/components/masonry/DiffColSizeMasonry.tsx +++ b/docs/src/pages/components/masonry/DiffColSizeMasonry.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function DiffColSizeMasonry() { return ( diff --git a/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.js b/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.js index 603167e119c469..600d5304b84303 100644 --- a/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.js +++ b/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function DiffColSizeMasonryBroken() { return ( diff --git a/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.tsx b/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.tsx index 603167e119c469..600d5304b84303 100644 --- a/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.tsx +++ b/docs/src/pages/components/masonry/DiffColSizeMasonryBroken.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function DiffColSizeMasonryBroken() { return ( diff --git a/docs/src/pages/components/masonry/FixedColumns.js b/docs/src/pages/components/masonry/FixedColumns.js index 4ccc5c1243ecd0..a5666f4fe850cd 100644 --- a/docs/src/pages/components/masonry/FixedColumns.js +++ b/docs/src/pages/components/masonry/FixedColumns.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/FixedColumns.tsx b/docs/src/pages/components/masonry/FixedColumns.tsx index 4ccc5c1243ecd0..a5666f4fe850cd 100644 --- a/docs/src/pages/components/masonry/FixedColumns.tsx +++ b/docs/src/pages/components/masonry/FixedColumns.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/FixedSpacing.js b/docs/src/pages/components/masonry/FixedSpacing.js index 58489b4c539738..bd5cb63d266834 100644 --- a/docs/src/pages/components/masonry/FixedSpacing.js +++ b/docs/src/pages/components/masonry/FixedSpacing.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/FixedSpacing.tsx b/docs/src/pages/components/masonry/FixedSpacing.tsx index 58489b4c539738..bd5cb63d266834 100644 --- a/docs/src/pages/components/masonry/FixedSpacing.tsx +++ b/docs/src/pages/components/masonry/FixedSpacing.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/ImageMasonry.js b/docs/src/pages/components/masonry/ImageMasonry.js index 19a28df4df10b3..b82c72107c46f0 100644 --- a/docs/src/pages/components/masonry/ImageMasonry.js +++ b/docs/src/pages/components/masonry/ImageMasonry.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function ImageMasonry() { return ( diff --git a/docs/src/pages/components/masonry/ImageMasonry.tsx b/docs/src/pages/components/masonry/ImageMasonry.tsx index 19a28df4df10b3..b82c72107c46f0 100644 --- a/docs/src/pages/components/masonry/ImageMasonry.tsx +++ b/docs/src/pages/components/masonry/ImageMasonry.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; export default function ImageMasonry() { return ( diff --git a/docs/src/pages/components/masonry/ResponsiveColumns.js b/docs/src/pages/components/masonry/ResponsiveColumns.js index b920086df750be..76fd7c7003ee7f 100644 --- a/docs/src/pages/components/masonry/ResponsiveColumns.js +++ b/docs/src/pages/components/masonry/ResponsiveColumns.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/ResponsiveColumns.tsx b/docs/src/pages/components/masonry/ResponsiveColumns.tsx index b920086df750be..76fd7c7003ee7f 100644 --- a/docs/src/pages/components/masonry/ResponsiveColumns.tsx +++ b/docs/src/pages/components/masonry/ResponsiveColumns.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/ResponsiveSpacing.js b/docs/src/pages/components/masonry/ResponsiveSpacing.js index 3e65472251b86d..7aed88c6375de6 100644 --- a/docs/src/pages/components/masonry/ResponsiveSpacing.js +++ b/docs/src/pages/components/masonry/ResponsiveSpacing.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/ResponsiveSpacing.tsx b/docs/src/pages/components/masonry/ResponsiveSpacing.tsx index 3e65472251b86d..7aed88c6375de6 100644 --- a/docs/src/pages/components/masonry/ResponsiveSpacing.tsx +++ b/docs/src/pages/components/masonry/ResponsiveSpacing.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/SSRMasonry.js b/docs/src/pages/components/masonry/SSRMasonry.js index 32682ed8484f7d..1b8fbc5959f800 100644 --- a/docs/src/pages/components/masonry/SSRMasonry.js +++ b/docs/src/pages/components/masonry/SSRMasonry.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/masonry/SSRMasonry.tsx b/docs/src/pages/components/masonry/SSRMasonry.tsx index 32682ed8484f7d..1b8fbc5959f800 100644 --- a/docs/src/pages/components/masonry/SSRMasonry.tsx +++ b/docs/src/pages/components/masonry/SSRMasonry.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Masonry from '@material-ui/lab/Masonry'; -import MasonryItem from '@material-ui/lab/MasonryItem'; +import Box from '@mui/material/Box'; +import Masonry from '@mui/lab/Masonry'; +import MasonryItem from '@mui/lab/MasonryItem'; const heights = [150, 30, 90, 70, 90, 100, 150, 30, 50, 80]; diff --git a/docs/src/pages/components/material-icons/SearchIcons.js b/docs/src/pages/components/material-icons/SearchIcons.js index e7d5561f669297..52588d2d46f67e 100644 --- a/docs/src/pages/components/material-icons/SearchIcons.js +++ b/docs/src/pages/components/material-icons/SearchIcons.js @@ -1,29 +1,29 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import MuiPaper from '@material-ui/core/Paper'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import MuiPaper from '@mui/material/Paper'; +import Box from '@mui/material/Box'; import copy from 'clipboard-copy'; -import InputBase from '@material-ui/core/InputBase'; -import Typography from '@material-ui/core/Typography'; +import InputBase from '@mui/material/InputBase'; +import Typography from '@mui/material/Typography'; import PropTypes from 'prop-types'; import debounce from 'lodash/debounce'; -import Grid from '@material-ui/core/Grid'; -import Dialog from '@material-ui/core/Dialog'; +import Grid from '@mui/material/Grid'; +import Dialog from '@mui/material/Dialog'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip'; -import Button from '@material-ui/core/Button'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogTitle from '@mui/material/DialogTitle'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip'; +import Button from '@mui/material/Button'; import { Index as FlexSearchIndex } from 'flexsearch'; -import SearchIcon from '@material-ui/icons/Search'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; +import SearchIcon from '@mui/icons-material/Search'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; import Link from 'docs/src/modules/components/Link'; import { useTranslate } from 'docs/src/modules/utils/i18n'; -import * as mui from '@material-ui/icons'; +import * as mui from '@mui/icons-material'; import synonyms from './synonyms'; if (process.env.NODE_ENV !== 'production') { @@ -38,26 +38,26 @@ if (process.env.NODE_ENV !== 'production') { // and comment `import * as mui`, and the `if` block above. // It will be much faster than working with all of the icons. -// import Menu from '@material-ui/icons/Menu'; -// import MenuOutlined from '@material-ui/icons/MenuOutlined'; -// import MenuRounded from '@material-ui/icons/MenuRounded'; -// import MenuTwoTone from '@material-ui/icons/MenuTwoTone'; -// import MenuSharp from '@material-ui/icons/MenuSharp'; -// import ExitToApp from '@material-ui/icons/ExitToApp'; -// import ExitToAppOutlined from '@material-ui/icons/ExitToAppOutlined'; -// import ExitToAppRounded from '@material-ui/icons/ExitToAppRounded'; -// import ExitToAppTwoTone from '@material-ui/icons/ExitToAppTwoTone'; -// import ExitToAppSharp from '@material-ui/icons/ExitToAppSharp'; -// import Delete from '@material-ui/icons/Delete'; -// import DeleteOutlined from '@material-ui/icons/DeleteOutlined'; -// import DeleteRounded from '@material-ui/icons/DeleteRounded'; -// import DeleteTwoTone from '@material-ui/icons/DeleteTwoTone'; -// import DeleteSharp from '@material-ui/icons/DeleteSharp'; -// import DeleteForever from '@material-ui/icons/DeleteForever'; -// import DeleteForeverOutlined from '@material-ui/icons/DeleteForeverOutlined'; -// import DeleteForeverRounded from '@material-ui/icons/DeleteForeverRounded'; -// import DeleteForeverTwoTone from '@material-ui/icons/DeleteForeverTwoTone'; -// import DeleteForeverSharp from '@material-ui/icons/DeleteForeverSharp'; +// import Menu from '@mui/icons-material/Menu'; +// import MenuOutlined from '@mui/icons-material/MenuOutlined'; +// import MenuRounded from '@mui/icons-material/MenuRounded'; +// import MenuTwoTone from '@mui/icons-material/MenuTwoTone'; +// import MenuSharp from '@mui/icons-material/MenuSharp'; +// import ExitToApp from '@mui/icons-material/ExitToApp'; +// import ExitToAppOutlined from '@mui/icons-material/ExitToAppOutlined'; +// import ExitToAppRounded from '@mui/icons-material/ExitToAppRounded'; +// import ExitToAppTwoTone from '@mui/icons-material/ExitToAppTwoTone'; +// import ExitToAppSharp from '@mui/icons-material/ExitToAppSharp'; +// import Delete from '@mui/icons-material/Delete'; +// import DeleteOutlined from '@mui/icons-material/DeleteOutlined'; +// import DeleteRounded from '@mui/icons-material/DeleteRounded'; +// import DeleteTwoTone from '@mui/icons-material/DeleteTwoTone'; +// import DeleteSharp from '@mui/icons-material/DeleteSharp'; +// import DeleteForever from '@mui/icons-material/DeleteForever'; +// import DeleteForeverOutlined from '@mui/icons-material/DeleteForeverOutlined'; +// import DeleteForeverRounded from '@mui/icons-material/DeleteForeverRounded'; +// import DeleteForeverTwoTone from '@mui/icons-material/DeleteForeverTwoTone'; +// import DeleteForeverSharp from '@mui/icons-material/DeleteForeverSharp'; // const mui = { // ExitToApp, @@ -298,7 +298,7 @@ const DialogDetails = React.memo(function DialogDetails(props) { > diff --git a/docs/src/pages/components/material-icons/material-icons.md b/docs/src/pages/components/material-icons/material-icons.md index f596b582d7b898..1ee89ff2b31ea8 100644 --- a/docs/src/pages/components/material-icons/material-icons.md +++ b/docs/src/pages/components/material-icons/material-icons.md @@ -2,7 +2,7 @@ title: Material Icons components: Icon, SvgIcon materialDesign: https://material.io/design/iconography/system-icons.html -packageName: '@material-ui/icons' +packageName: '@mui/icons-material' githubLabel: 'package: icons' --- @@ -11,7 +11,7 @@ githubLabel: 'package: icons'

    1,700+ React Material icons ready to use from the official website.

    The following npm package, -[@material-ui/icons](https://www.npmjs.com/package/@material-ui/icons), +[@mui/icons-material](https://www.npmjs.com/package/@mui/icons-material), includes the 1,700+ official [Material icons](https://fonts.google.com/icons) converted to [`SvgIcon`](/api/svg-icon/) components. {{"component": "modules/components/ComponentLinkHeader.js"}} diff --git a/docs/src/pages/components/menus/AccountMenu.js b/docs/src/pages/components/menus/AccountMenu.js index 8a2523dca04afb..dd3e0e1a222f0a 100644 --- a/docs/src/pages/components/menus/AccountMenu.js +++ b/docs/src/pages/components/menus/AccountMenu.js @@ -1,16 +1,16 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Avatar from '@material-ui/core/Avatar'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import PersonAdd from '@material-ui/icons/PersonAdd'; -import Settings from '@material-ui/icons/Settings'; -import Logout from '@material-ui/icons/Logout'; +import Box from '@mui/material/Box'; +import Avatar from '@mui/material/Avatar'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import PersonAdd from '@mui/icons-material/PersonAdd'; +import Settings from '@mui/icons-material/Settings'; +import Logout from '@mui/icons-material/Logout'; export default function AccountMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/AccountMenu.tsx b/docs/src/pages/components/menus/AccountMenu.tsx index f4d01f670800b0..aca289b1a910d0 100644 --- a/docs/src/pages/components/menus/AccountMenu.tsx +++ b/docs/src/pages/components/menus/AccountMenu.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Avatar from '@material-ui/core/Avatar'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Divider from '@material-ui/core/Divider'; -import IconButton from '@material-ui/core/IconButton'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import PersonAdd from '@material-ui/icons/PersonAdd'; -import Settings from '@material-ui/icons/Settings'; -import Logout from '@material-ui/icons/Logout'; +import Box from '@mui/material/Box'; +import Avatar from '@mui/material/Avatar'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Divider from '@mui/material/Divider'; +import IconButton from '@mui/material/IconButton'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import PersonAdd from '@mui/icons-material/PersonAdd'; +import Settings from '@mui/icons-material/Settings'; +import Logout from '@mui/icons-material/Logout'; export default function AccountMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/BasicMenu.js b/docs/src/pages/components/menus/BasicMenu.js index d70b857a09d548..0c2dd12b33342d 100644 --- a/docs/src/pages/components/menus/BasicMenu.js +++ b/docs/src/pages/components/menus/BasicMenu.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; export default function BasicMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/BasicMenu.tsx b/docs/src/pages/components/menus/BasicMenu.tsx index e40dd455af3535..47c1a4b33324b7 100644 --- a/docs/src/pages/components/menus/BasicMenu.tsx +++ b/docs/src/pages/components/menus/BasicMenu.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; export default function BasicMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/ContextMenu.js b/docs/src/pages/components/menus/ContextMenu.js index 0222ce934a1ff3..84629127fc4ae4 100644 --- a/docs/src/pages/components/menus/ContextMenu.js +++ b/docs/src/pages/components/menus/ContextMenu.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import Typography from '@material-ui/core/Typography'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import Typography from '@mui/material/Typography'; export default function ContextMenu() { const [contextMenu, setContextMenu] = React.useState(null); diff --git a/docs/src/pages/components/menus/ContextMenu.tsx b/docs/src/pages/components/menus/ContextMenu.tsx index f3955411f7fa18..d5b6bc626c1f93 100644 --- a/docs/src/pages/components/menus/ContextMenu.tsx +++ b/docs/src/pages/components/menus/ContextMenu.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import Typography from '@material-ui/core/Typography'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import Typography from '@mui/material/Typography'; export default function ContextMenu() { const [contextMenu, setContextMenu] = React.useState<{ diff --git a/docs/src/pages/components/menus/CustomizedMenus.js b/docs/src/pages/components/menus/CustomizedMenus.js index e1fca61c861d45..e9fb4b3619bac7 100644 --- a/docs/src/pages/components/menus/CustomizedMenus.js +++ b/docs/src/pages/components/menus/CustomizedMenus.js @@ -1,14 +1,14 @@ import * as React from 'react'; -import { styled, alpha } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import EditIcon from '@material-ui/icons/Edit'; -import Divider from '@material-ui/core/Divider'; -import ArchiveIcon from '@material-ui/icons/Archive'; -import FileCopyIcon from '@material-ui/icons/FileCopy'; -import MoreHorizIcon from '@material-ui/icons/MoreHoriz'; -import KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown'; +import { styled, alpha } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import EditIcon from '@mui/icons-material/Edit'; +import Divider from '@mui/material/Divider'; +import ArchiveIcon from '@mui/icons-material/Archive'; +import FileCopyIcon from '@mui/icons-material/FileCopy'; +import MoreHorizIcon from '@mui/icons-material/MoreHoriz'; +import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'; const StyledMenu = styled((props) => ( ( (null); diff --git a/docs/src/pages/components/menus/IconMenu.js b/docs/src/pages/components/menus/IconMenu.js index d20f15849ce337..74c9c1199937eb 100644 --- a/docs/src/pages/components/menus/IconMenu.js +++ b/docs/src/pages/components/menus/IconMenu.js @@ -1,15 +1,15 @@ import * as React from 'react'; -import Divider from '@material-ui/core/Divider'; -import Paper from '@material-ui/core/Paper'; -import MenuList from '@material-ui/core/MenuList'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Typography from '@material-ui/core/Typography'; -import ContentCut from '@material-ui/icons/ContentCut'; -import ContentCopy from '@material-ui/icons/ContentCopy'; -import ContentPaste from '@material-ui/icons/ContentPaste'; -import Cloud from '@material-ui/icons/Cloud'; +import Divider from '@mui/material/Divider'; +import Paper from '@mui/material/Paper'; +import MenuList from '@mui/material/MenuList'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Typography from '@mui/material/Typography'; +import ContentCut from '@mui/icons-material/ContentCut'; +import ContentCopy from '@mui/icons-material/ContentCopy'; +import ContentPaste from '@mui/icons-material/ContentPaste'; +import Cloud from '@mui/icons-material/Cloud'; export default function IconMenu() { return ( diff --git a/docs/src/pages/components/menus/IconMenu.tsx b/docs/src/pages/components/menus/IconMenu.tsx index d20f15849ce337..74c9c1199937eb 100644 --- a/docs/src/pages/components/menus/IconMenu.tsx +++ b/docs/src/pages/components/menus/IconMenu.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; -import Divider from '@material-ui/core/Divider'; -import Paper from '@material-ui/core/Paper'; -import MenuList from '@material-ui/core/MenuList'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Typography from '@material-ui/core/Typography'; -import ContentCut from '@material-ui/icons/ContentCut'; -import ContentCopy from '@material-ui/icons/ContentCopy'; -import ContentPaste from '@material-ui/icons/ContentPaste'; -import Cloud from '@material-ui/icons/Cloud'; +import Divider from '@mui/material/Divider'; +import Paper from '@mui/material/Paper'; +import MenuList from '@mui/material/MenuList'; +import MenuItem from '@mui/material/MenuItem'; +import ListItemText from '@mui/material/ListItemText'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Typography from '@mui/material/Typography'; +import ContentCut from '@mui/icons-material/ContentCut'; +import ContentCopy from '@mui/icons-material/ContentCopy'; +import ContentPaste from '@mui/icons-material/ContentPaste'; +import Cloud from '@mui/icons-material/Cloud'; export default function IconMenu() { return ( diff --git a/docs/src/pages/components/menus/LongMenu.js b/docs/src/pages/components/menus/LongMenu.js index d1fef2093f821f..1b0367e9ab38ea 100644 --- a/docs/src/pages/components/menus/LongMenu.js +++ b/docs/src/pages/components/menus/LongMenu.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; +import IconButton from '@mui/material/IconButton'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; const options = [ 'None', diff --git a/docs/src/pages/components/menus/LongMenu.tsx b/docs/src/pages/components/menus/LongMenu.tsx index 88f960c4ef080a..25bee521f257fc 100644 --- a/docs/src/pages/components/menus/LongMenu.tsx +++ b/docs/src/pages/components/menus/LongMenu.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; +import IconButton from '@mui/material/IconButton'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; const options = [ 'None', diff --git a/docs/src/pages/components/menus/MenuListComposition.js b/docs/src/pages/components/menus/MenuListComposition.js index 36a31192d16f01..a5b1eef574463e 100644 --- a/docs/src/pages/components/menus/MenuListComposition.js +++ b/docs/src/pages/components/menus/MenuListComposition.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Grow from '@material-ui/core/Grow'; -import Paper from '@material-ui/core/Paper'; -import Popper from '@material-ui/core/Popper'; -import MenuItem from '@material-ui/core/MenuItem'; -import MenuList from '@material-ui/core/MenuList'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Grow from '@mui/material/Grow'; +import Paper from '@mui/material/Paper'; +import Popper from '@mui/material/Popper'; +import MenuItem from '@mui/material/MenuItem'; +import MenuList from '@mui/material/MenuList'; +import Stack from '@mui/material/Stack'; export default function MenuListComposition() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/menus/MenuListComposition.tsx b/docs/src/pages/components/menus/MenuListComposition.tsx index 1e8117e098819d..a6ac81cb67384d 100644 --- a/docs/src/pages/components/menus/MenuListComposition.tsx +++ b/docs/src/pages/components/menus/MenuListComposition.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import ClickAwayListener from '@material-ui/core/ClickAwayListener'; -import Grow from '@material-ui/core/Grow'; -import Paper from '@material-ui/core/Paper'; -import Popper from '@material-ui/core/Popper'; -import MenuItem from '@material-ui/core/MenuItem'; -import MenuList from '@material-ui/core/MenuList'; -import Stack from '@material-ui/core/Stack'; +import Button from '@mui/material/Button'; +import ClickAwayListener from '@mui/material/ClickAwayListener'; +import Grow from '@mui/material/Grow'; +import Paper from '@mui/material/Paper'; +import Popper from '@mui/material/Popper'; +import MenuItem from '@mui/material/MenuItem'; +import MenuList from '@mui/material/MenuList'; +import Stack from '@mui/material/Stack'; export default function MenuListComposition() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/menus/MenuPopupState.js b/docs/src/pages/components/menus/MenuPopupState.js index ef0b7228878646..5dd429ebecf4e2 100644 --- a/docs/src/pages/components/menus/MenuPopupState.js +++ b/docs/src/pages/components/menus/MenuPopupState.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; import PopupState, { bindTrigger, bindMenu } from 'material-ui-popup-state'; export default function MenuPopupState() { diff --git a/docs/src/pages/components/menus/MenuPopupState.tsx b/docs/src/pages/components/menus/MenuPopupState.tsx index ef0b7228878646..5dd429ebecf4e2 100644 --- a/docs/src/pages/components/menus/MenuPopupState.tsx +++ b/docs/src/pages/components/menus/MenuPopupState.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; import PopupState, { bindTrigger, bindMenu } from 'material-ui-popup-state'; export default function MenuPopupState() { diff --git a/docs/src/pages/components/menus/PositionedMenu.js b/docs/src/pages/components/menus/PositionedMenu.js index 4cd9c813f5bc29..4f4cba31c679b6 100644 --- a/docs/src/pages/components/menus/PositionedMenu.js +++ b/docs/src/pages/components/menus/PositionedMenu.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; export default function PositionedMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/PositionedMenu.tsx b/docs/src/pages/components/menus/PositionedMenu.tsx index 44c044668f6457..7b2848f40552e2 100644 --- a/docs/src/pages/components/menus/PositionedMenu.tsx +++ b/docs/src/pages/components/menus/PositionedMenu.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; +import Button from '@mui/material/Button'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; export default function PositionedMenu() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/menus/SimpleListMenu.js b/docs/src/pages/components/menus/SimpleListMenu.js index ddb14bdba68e6d..cb8fa02fa840c3 100644 --- a/docs/src/pages/components/menus/SimpleListMenu.js +++ b/docs/src/pages/components/menus/SimpleListMenu.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; const options = [ 'Show some love to Material-UI', diff --git a/docs/src/pages/components/menus/SimpleListMenu.tsx b/docs/src/pages/components/menus/SimpleListMenu.tsx index 492a345a7de64c..40cfc8d23f81b7 100644 --- a/docs/src/pages/components/menus/SimpleListMenu.tsx +++ b/docs/src/pages/components/menus/SimpleListMenu.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import List from '@material-ui/core/List'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemText from '@material-ui/core/ListItemText'; -import MenuItem from '@material-ui/core/MenuItem'; -import Menu from '@material-ui/core/Menu'; +import List from '@mui/material/List'; +import ListItem from '@mui/material/ListItem'; +import ListItemText from '@mui/material/ListItemText'; +import MenuItem from '@mui/material/MenuItem'; +import Menu from '@mui/material/Menu'; const options = [ 'Show some love to Material-UI', diff --git a/docs/src/pages/components/menus/TypographyMenu.js b/docs/src/pages/components/menus/TypographyMenu.js index fc80c80a65bab9..c839922342f8ec 100644 --- a/docs/src/pages/components/menus/TypographyMenu.js +++ b/docs/src/pages/components/menus/TypographyMenu.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import MenuList from '@material-ui/core/MenuList'; -import MenuItem from '@material-ui/core/MenuItem'; -import Paper from '@material-ui/core/Paper'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Typography from '@material-ui/core/Typography'; -import DraftsIcon from '@material-ui/icons/Drafts'; -import SendIcon from '@material-ui/icons/Send'; -import PriorityHighIcon from '@material-ui/icons/PriorityHigh'; +import MenuList from '@mui/material/MenuList'; +import MenuItem from '@mui/material/MenuItem'; +import Paper from '@mui/material/Paper'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Typography from '@mui/material/Typography'; +import DraftsIcon from '@mui/icons-material/Drafts'; +import SendIcon from '@mui/icons-material/Send'; +import PriorityHighIcon from '@mui/icons-material/PriorityHigh'; export default function TypographyMenu() { return ( diff --git a/docs/src/pages/components/menus/TypographyMenu.tsx b/docs/src/pages/components/menus/TypographyMenu.tsx index fc80c80a65bab9..c839922342f8ec 100644 --- a/docs/src/pages/components/menus/TypographyMenu.tsx +++ b/docs/src/pages/components/menus/TypographyMenu.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import MenuList from '@material-ui/core/MenuList'; -import MenuItem from '@material-ui/core/MenuItem'; -import Paper from '@material-ui/core/Paper'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import Typography from '@material-ui/core/Typography'; -import DraftsIcon from '@material-ui/icons/Drafts'; -import SendIcon from '@material-ui/icons/Send'; -import PriorityHighIcon from '@material-ui/icons/PriorityHigh'; +import MenuList from '@mui/material/MenuList'; +import MenuItem from '@mui/material/MenuItem'; +import Paper from '@mui/material/Paper'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import Typography from '@mui/material/Typography'; +import DraftsIcon from '@mui/icons-material/Drafts'; +import SendIcon from '@mui/icons-material/Send'; +import PriorityHighIcon from '@mui/icons-material/PriorityHigh'; export default function TypographyMenu() { return ( diff --git a/docs/src/pages/components/modal/BasicModal.js b/docs/src/pages/components/modal/BasicModal.js index ed927bd3319a08..d65efec6408e85 100644 --- a/docs/src/pages/components/modal/BasicModal.js +++ b/docs/src/pages/components/modal/BasicModal.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; -import Modal from '@material-ui/core/Modal'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; +import Modal from '@mui/material/Modal'; const style = { position: 'absolute', diff --git a/docs/src/pages/components/modal/BasicModal.tsx b/docs/src/pages/components/modal/BasicModal.tsx index 1fc108be8c984f..2baa29914f93f3 100644 --- a/docs/src/pages/components/modal/BasicModal.tsx +++ b/docs/src/pages/components/modal/BasicModal.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; -import Modal from '@material-ui/core/Modal'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; +import Modal from '@mui/material/Modal'; const style = { position: 'absolute' as 'absolute', diff --git a/docs/src/pages/components/modal/KeepMountedModal.js b/docs/src/pages/components/modal/KeepMountedModal.js index d021761291834f..d1c3187539a07c 100644 --- a/docs/src/pages/components/modal/KeepMountedModal.js +++ b/docs/src/pages/components/modal/KeepMountedModal.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; const style = { position: 'absolute', diff --git a/docs/src/pages/components/modal/KeepMountedModal.tsx b/docs/src/pages/components/modal/KeepMountedModal.tsx index 348c39b6412d71..1d4aab2eb37f16 100644 --- a/docs/src/pages/components/modal/KeepMountedModal.tsx +++ b/docs/src/pages/components/modal/KeepMountedModal.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; const style = { position: 'absolute' as 'absolute', diff --git a/docs/src/pages/components/modal/ModalUnstyled.js b/docs/src/pages/components/modal/ModalUnstyled.js index 3682d8909cf730..00816027cf2df7 100644 --- a/docs/src/pages/components/modal/ModalUnstyled.js +++ b/docs/src/pages/components/modal/ModalUnstyled.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, Box } from '@material-ui/system'; -import ModalUnstyled from '@material-ui/unstyled/ModalUnstyled'; +import { styled, Box } from '@mui/system'; +import ModalUnstyled from '@mui/core/ModalUnstyled'; const StyledModal = styled(ModalUnstyled)` position: fixed; diff --git a/docs/src/pages/components/modal/ModalUnstyled.tsx b/docs/src/pages/components/modal/ModalUnstyled.tsx index 3682d8909cf730..00816027cf2df7 100644 --- a/docs/src/pages/components/modal/ModalUnstyled.tsx +++ b/docs/src/pages/components/modal/ModalUnstyled.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, Box } from '@material-ui/system'; -import ModalUnstyled from '@material-ui/unstyled/ModalUnstyled'; +import { styled, Box } from '@mui/system'; +import ModalUnstyled from '@mui/core/ModalUnstyled'; const StyledModal = styled(ModalUnstyled)` position: fixed; diff --git a/docs/src/pages/components/modal/NestedModal.js b/docs/src/pages/components/modal/NestedModal.js index cff94dc040589d..befdd109be3053 100644 --- a/docs/src/pages/components/modal/NestedModal.js +++ b/docs/src/pages/components/modal/NestedModal.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; const style = { position: 'absolute', diff --git a/docs/src/pages/components/modal/NestedModal.tsx b/docs/src/pages/components/modal/NestedModal.tsx index c5b8c2ce47a851..e336486fea625b 100644 --- a/docs/src/pages/components/modal/NestedModal.tsx +++ b/docs/src/pages/components/modal/NestedModal.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; const style = { position: 'absolute' as 'absolute', diff --git a/docs/src/pages/components/modal/ServerModal.js b/docs/src/pages/components/modal/ServerModal.js index bb1946f94588fc..f36dd9777bd05c 100644 --- a/docs/src/pages/components/modal/ServerModal.js +++ b/docs/src/pages/components/modal/ServerModal.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Modal from '@material-ui/core/Modal'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +import Modal from '@mui/material/Modal'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; export default function ServerModal() { const rootRef = React.useRef(null); diff --git a/docs/src/pages/components/modal/ServerModal.tsx b/docs/src/pages/components/modal/ServerModal.tsx index 4a91f71cbc018d..5a6f7f8dcd470e 100644 --- a/docs/src/pages/components/modal/ServerModal.tsx +++ b/docs/src/pages/components/modal/ServerModal.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Modal from '@material-ui/core/Modal'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +import Modal from '@mui/material/Modal'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; export default function ServerModal() { const rootRef = React.useRef(null); diff --git a/docs/src/pages/components/modal/SpringModal.js b/docs/src/pages/components/modal/SpringModal.js index c208dddeb58472..e711d5f04d07e0 100644 --- a/docs/src/pages/components/modal/SpringModal.js +++ b/docs/src/pages/components/modal/SpringModal.js @@ -1,10 +1,10 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Backdrop from '@material-ui/core/Backdrop'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Backdrop from '@mui/material/Backdrop'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; // web.cjs is required for IE11 support import { useSpring, animated } from 'react-spring/web.cjs'; diff --git a/docs/src/pages/components/modal/SpringModal.tsx b/docs/src/pages/components/modal/SpringModal.tsx index 22734b98b27742..dc9fad22bab419 100644 --- a/docs/src/pages/components/modal/SpringModal.tsx +++ b/docs/src/pages/components/modal/SpringModal.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Backdrop from '@material-ui/core/Backdrop'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Backdrop from '@mui/material/Backdrop'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; // web.cjs is required for IE11 support import { useSpring, animated } from 'react-spring/web.cjs'; diff --git a/docs/src/pages/components/modal/TransitionsModal.js b/docs/src/pages/components/modal/TransitionsModal.js index 540eb4d7741f07..607f9e939450e5 100644 --- a/docs/src/pages/components/modal/TransitionsModal.js +++ b/docs/src/pages/components/modal/TransitionsModal.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Backdrop from '@material-ui/core/Backdrop'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Fade from '@material-ui/core/Fade'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Backdrop from '@mui/material/Backdrop'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Fade from '@mui/material/Fade'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; const style = { position: 'absolute', diff --git a/docs/src/pages/components/modal/TransitionsModal.tsx b/docs/src/pages/components/modal/TransitionsModal.tsx index e0ba787290db9e..8cd21903cc324e 100644 --- a/docs/src/pages/components/modal/TransitionsModal.tsx +++ b/docs/src/pages/components/modal/TransitionsModal.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Backdrop from '@material-ui/core/Backdrop'; -import Box from '@material-ui/core/Box'; -import Modal from '@material-ui/core/Modal'; -import Fade from '@material-ui/core/Fade'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import Backdrop from '@mui/material/Backdrop'; +import Box from '@mui/material/Box'; +import Modal from '@mui/material/Modal'; +import Fade from '@mui/material/Fade'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; const style = { position: 'absolute' as 'absolute', diff --git a/docs/src/pages/components/modal/modal.md b/docs/src/pages/components/modal/modal.md index 557459621c00dc..d2044f566328a0 100644 --- a/docs/src/pages/components/modal/modal.md +++ b/docs/src/pages/components/modal/modal.md @@ -41,13 +41,13 @@ Notice that you can disable the outline (often blue or gold) with the `outline: ## Unstyled -- 📦 [4.7 kB gzipped](https://bundlephobia.com/result?p=@material-ui/unstyled@next) +- 📦 [4.7 kB gzipped](https://bundlephobia.com/result?p=@mui/core@next) The modal also comes with an unstyled version. It's ideal for doing heavy customizations and minimizing bundle size. ```js -import ModalUnstyled from '@material-ui/unstyled/ModalUnstyled'; +import ModalUnstyled from '@mui/core/ModalUnstyled'; ``` {{"demo": "pages/components/modal/ModalUnstyled.js"}} diff --git a/docs/src/pages/components/no-ssr/FrameDeferring.js b/docs/src/pages/components/no-ssr/FrameDeferring.js index b72cfb747bb0f8..12bb991d7c4bf5 100644 --- a/docs/src/pages/components/no-ssr/FrameDeferring.js +++ b/docs/src/pages/components/no-ssr/FrameDeferring.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import NoSsr from '@material-ui/core/NoSsr'; +import Box from '@mui/material/Box'; +import NoSsr from '@mui/material/NoSsr'; function LargeTree() { return Array.from(new Array(5000)).map((_, index) => .); diff --git a/docs/src/pages/components/no-ssr/FrameDeferring.tsx b/docs/src/pages/components/no-ssr/FrameDeferring.tsx index c99dd0370f6f87..0026a85acf4bea 100644 --- a/docs/src/pages/components/no-ssr/FrameDeferring.tsx +++ b/docs/src/pages/components/no-ssr/FrameDeferring.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import NoSsr from '@material-ui/core/NoSsr'; +import Box from '@mui/material/Box'; +import NoSsr from '@mui/material/NoSsr'; function LargeTree(): any { return Array.from(new Array(5000)).map((_, index) => .); diff --git a/docs/src/pages/components/no-ssr/SimpleNoSsr.js b/docs/src/pages/components/no-ssr/SimpleNoSsr.js index 9ed3e873230db8..84e9bcd70f78ad 100644 --- a/docs/src/pages/components/no-ssr/SimpleNoSsr.js +++ b/docs/src/pages/components/no-ssr/SimpleNoSsr.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import NoSsr from '@material-ui/core/NoSsr'; -import Box from '@material-ui/core/Box'; +import NoSsr from '@mui/material/NoSsr'; +import Box from '@mui/material/Box'; export default function SimpleNoSsr() { return ( diff --git a/docs/src/pages/components/no-ssr/SimpleNoSsr.tsx b/docs/src/pages/components/no-ssr/SimpleNoSsr.tsx index 9ed3e873230db8..84e9bcd70f78ad 100644 --- a/docs/src/pages/components/no-ssr/SimpleNoSsr.tsx +++ b/docs/src/pages/components/no-ssr/SimpleNoSsr.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import NoSsr from '@material-ui/core/NoSsr'; -import Box from '@material-ui/core/Box'; +import NoSsr from '@mui/material/NoSsr'; +import Box from '@mui/material/Box'; export default function SimpleNoSsr() { return ( diff --git a/docs/src/pages/components/no-ssr/no-ssr.md b/docs/src/pages/components/no-ssr/no-ssr.md index 8ea47401acc0a5..7a3ca7a4a617c3 100644 --- a/docs/src/pages/components/no-ssr/no-ssr.md +++ b/docs/src/pages/components/no-ssr/no-ssr.md @@ -34,10 +34,10 @@ React does [2 commits](https://reactjs.org/docs/strict-mode.html#detecting-unexp ## Unstyled -- 📦 [784 B gzipped](https://bundlephobia.com/result?p=@material-ui/unstyled@next) +- 📦 [784 B gzipped](https://bundlephobia.com/result?p=@mui/core@next) As the component does not have any styles, it also comes with the unstyled package. ```js -import NoSsr from '@material-ui/unstyled/NoSsr'; +import NoSsr from '@mui/core/NoSsr'; ``` diff --git a/docs/src/pages/components/pagination/BasicPagination.js b/docs/src/pages/components/pagination/BasicPagination.js index ac4400ee8efa62..fbe475a92e87f8 100644 --- a/docs/src/pages/components/pagination/BasicPagination.js +++ b/docs/src/pages/components/pagination/BasicPagination.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function BasicPagination() { return ( diff --git a/docs/src/pages/components/pagination/BasicPagination.tsx b/docs/src/pages/components/pagination/BasicPagination.tsx index ac4400ee8efa62..fbe475a92e87f8 100644 --- a/docs/src/pages/components/pagination/BasicPagination.tsx +++ b/docs/src/pages/components/pagination/BasicPagination.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function BasicPagination() { return ( diff --git a/docs/src/pages/components/pagination/PaginationButtons.js b/docs/src/pages/components/pagination/PaginationButtons.js index bae1a24924623b..e8c2913e4fb20a 100644 --- a/docs/src/pages/components/pagination/PaginationButtons.js +++ b/docs/src/pages/components/pagination/PaginationButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationButtons() { return ( diff --git a/docs/src/pages/components/pagination/PaginationButtons.tsx b/docs/src/pages/components/pagination/PaginationButtons.tsx index bae1a24924623b..e8c2913e4fb20a 100644 --- a/docs/src/pages/components/pagination/PaginationButtons.tsx +++ b/docs/src/pages/components/pagination/PaginationButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationButtons() { return ( diff --git a/docs/src/pages/components/pagination/PaginationControlled.js b/docs/src/pages/components/pagination/PaginationControlled.js index 63ed860a3ce2f7..9e7404ec0422d2 100644 --- a/docs/src/pages/components/pagination/PaginationControlled.js +++ b/docs/src/pages/components/pagination/PaginationControlled.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Typography from '@mui/material/Typography'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationControlled() { const [page, setPage] = React.useState(1); diff --git a/docs/src/pages/components/pagination/PaginationControlled.tsx b/docs/src/pages/components/pagination/PaginationControlled.tsx index 50cf28c73ce116..8bd3bfba3b7f26 100644 --- a/docs/src/pages/components/pagination/PaginationControlled.tsx +++ b/docs/src/pages/components/pagination/PaginationControlled.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Typography from '@mui/material/Typography'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationControlled() { const [page, setPage] = React.useState(1); diff --git a/docs/src/pages/components/pagination/PaginationLink.js b/docs/src/pages/components/pagination/PaginationLink.js index c1fb1e472c862e..6719213c87a9cc 100644 --- a/docs/src/pages/components/pagination/PaginationLink.js +++ b/docs/src/pages/components/pagination/PaginationLink.js @@ -1,8 +1,8 @@ import * as React from 'react'; import { MemoryRouter, Route } from 'react-router'; import { Link } from 'react-router-dom'; -import Pagination from '@material-ui/core/Pagination'; -import PaginationItem from '@material-ui/core/PaginationItem'; +import Pagination from '@mui/material/Pagination'; +import PaginationItem from '@mui/material/PaginationItem'; export default function PaginationLink() { return ( diff --git a/docs/src/pages/components/pagination/PaginationLink.tsx b/docs/src/pages/components/pagination/PaginationLink.tsx index c1fb1e472c862e..6719213c87a9cc 100644 --- a/docs/src/pages/components/pagination/PaginationLink.tsx +++ b/docs/src/pages/components/pagination/PaginationLink.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; import { MemoryRouter, Route } from 'react-router'; import { Link } from 'react-router-dom'; -import Pagination from '@material-ui/core/Pagination'; -import PaginationItem from '@material-ui/core/PaginationItem'; +import Pagination from '@mui/material/Pagination'; +import PaginationItem from '@mui/material/PaginationItem'; export default function PaginationLink() { return ( diff --git a/docs/src/pages/components/pagination/PaginationOutlined.js b/docs/src/pages/components/pagination/PaginationOutlined.js index 73db96a8da6617..5d7a5a269ddb3e 100644 --- a/docs/src/pages/components/pagination/PaginationOutlined.js +++ b/docs/src/pages/components/pagination/PaginationOutlined.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationOutlined() { return ( diff --git a/docs/src/pages/components/pagination/PaginationOutlined.tsx b/docs/src/pages/components/pagination/PaginationOutlined.tsx index 73db96a8da6617..5d7a5a269ddb3e 100644 --- a/docs/src/pages/components/pagination/PaginationOutlined.tsx +++ b/docs/src/pages/components/pagination/PaginationOutlined.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationOutlined() { return ( diff --git a/docs/src/pages/components/pagination/PaginationRanges.js b/docs/src/pages/components/pagination/PaginationRanges.js index d50d9e537a184f..151bac41b81ff7 100644 --- a/docs/src/pages/components/pagination/PaginationRanges.js +++ b/docs/src/pages/components/pagination/PaginationRanges.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationRanges() { return ( diff --git a/docs/src/pages/components/pagination/PaginationRanges.tsx b/docs/src/pages/components/pagination/PaginationRanges.tsx index d50d9e537a184f..151bac41b81ff7 100644 --- a/docs/src/pages/components/pagination/PaginationRanges.tsx +++ b/docs/src/pages/components/pagination/PaginationRanges.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationRanges() { return ( diff --git a/docs/src/pages/components/pagination/PaginationRounded.js b/docs/src/pages/components/pagination/PaginationRounded.js index cd4abe364d8c89..81ba9f9770f360 100644 --- a/docs/src/pages/components/pagination/PaginationRounded.js +++ b/docs/src/pages/components/pagination/PaginationRounded.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationRounded() { return ( diff --git a/docs/src/pages/components/pagination/PaginationRounded.tsx b/docs/src/pages/components/pagination/PaginationRounded.tsx index cd4abe364d8c89..81ba9f9770f360 100644 --- a/docs/src/pages/components/pagination/PaginationRounded.tsx +++ b/docs/src/pages/components/pagination/PaginationRounded.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationRounded() { return ( diff --git a/docs/src/pages/components/pagination/PaginationSize.js b/docs/src/pages/components/pagination/PaginationSize.js index 94496c5926ec61..d50baecc0dd4e1 100644 --- a/docs/src/pages/components/pagination/PaginationSize.js +++ b/docs/src/pages/components/pagination/PaginationSize.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationSize() { return ( diff --git a/docs/src/pages/components/pagination/PaginationSize.tsx b/docs/src/pages/components/pagination/PaginationSize.tsx index 94496c5926ec61..d50baecc0dd4e1 100644 --- a/docs/src/pages/components/pagination/PaginationSize.tsx +++ b/docs/src/pages/components/pagination/PaginationSize.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Pagination from '@material-ui/core/Pagination'; -import Stack from '@material-ui/core/Stack'; +import Pagination from '@mui/material/Pagination'; +import Stack from '@mui/material/Stack'; export default function PaginationSize() { return ( diff --git a/docs/src/pages/components/pagination/TablePagination.js b/docs/src/pages/components/pagination/TablePagination.js index a7cb566ea5c292..e76af075c3a4be 100644 --- a/docs/src/pages/components/pagination/TablePagination.js +++ b/docs/src/pages/components/pagination/TablePagination.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import TablePagination from '@material-ui/core/TablePagination'; +import TablePagination from '@mui/material/TablePagination'; export default function TablePaginationDemo() { const [page, setPage] = React.useState(2); diff --git a/docs/src/pages/components/pagination/TablePagination.tsx b/docs/src/pages/components/pagination/TablePagination.tsx index 8e0de4d8bbc3e2..876237975d5e12 100644 --- a/docs/src/pages/components/pagination/TablePagination.tsx +++ b/docs/src/pages/components/pagination/TablePagination.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import TablePagination from '@material-ui/core/TablePagination'; +import TablePagination from '@mui/material/TablePagination'; export default function TablePaginationDemo() { const [page, setPage] = React.useState(2); diff --git a/docs/src/pages/components/pagination/UsePagination.js b/docs/src/pages/components/pagination/UsePagination.js index 048cb0411e1022..f10c2a4ed37e6a 100644 --- a/docs/src/pages/components/pagination/UsePagination.js +++ b/docs/src/pages/components/pagination/UsePagination.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import usePagination from '@material-ui/core/usePagination'; -import { styled } from '@material-ui/core/styles'; +import usePagination from '@mui/material/usePagination'; +import { styled } from '@mui/material/styles'; const List = styled('ul')({ listStyle: 'none', diff --git a/docs/src/pages/components/pagination/UsePagination.tsx b/docs/src/pages/components/pagination/UsePagination.tsx index 048cb0411e1022..f10c2a4ed37e6a 100644 --- a/docs/src/pages/components/pagination/UsePagination.tsx +++ b/docs/src/pages/components/pagination/UsePagination.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import usePagination from '@material-ui/core/usePagination'; -import { styled } from '@material-ui/core/styles'; +import usePagination from '@mui/material/usePagination'; +import { styled } from '@mui/material/styles'; const List = styled('ul')({ listStyle: 'none', diff --git a/docs/src/pages/components/pagination/pagination.md b/docs/src/pages/components/pagination/pagination.md index cea8f12a4a85ee..e71be8b385818b 100644 --- a/docs/src/pages/components/pagination/pagination.md +++ b/docs/src/pages/components/pagination/pagination.md @@ -54,7 +54,7 @@ related to the rendering of JSX. The Pagination component is built on this hook. ```jsx -import { usePagination } from '@material-ui/core/Pagination'; +import { usePagination } from '@mui/material/Pagination'; ``` {{"demo": "pages/components/pagination/UsePagination.js"}} diff --git a/docs/src/pages/components/paper/Elevation.js b/docs/src/pages/components/paper/Elevation.js index fea5d47744b272..ba062f9a2fdf40 100644 --- a/docs/src/pages/components/paper/Elevation.js +++ b/docs/src/pages/components/paper/Elevation.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Box from '@material-ui/core/Box'; -import { createTheme, ThemeProvider, styled } from '@material-ui/core/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Box from '@mui/material/Box'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/paper/Elevation.tsx b/docs/src/pages/components/paper/Elevation.tsx index fea5d47744b272..ba062f9a2fdf40 100644 --- a/docs/src/pages/components/paper/Elevation.tsx +++ b/docs/src/pages/components/paper/Elevation.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Paper from '@material-ui/core/Paper'; -import Box from '@material-ui/core/Box'; -import { createTheme, ThemeProvider, styled } from '@material-ui/core/styles'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import Box from '@mui/material/Box'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; const Item = styled(Paper)(({ theme }) => ({ ...theme.typography.body2, diff --git a/docs/src/pages/components/paper/SimplePaper.js b/docs/src/pages/components/paper/SimplePaper.js index c231385402c3f2..da4e5fc7a9526f 100644 --- a/docs/src/pages/components/paper/SimplePaper.js +++ b/docs/src/pages/components/paper/SimplePaper.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; export default function SimplePaper() { return ( diff --git a/docs/src/pages/components/paper/SimplePaper.tsx b/docs/src/pages/components/paper/SimplePaper.tsx index c231385402c3f2..da4e5fc7a9526f 100644 --- a/docs/src/pages/components/paper/SimplePaper.tsx +++ b/docs/src/pages/components/paper/SimplePaper.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; export default function SimplePaper() { return ( diff --git a/docs/src/pages/components/paper/Variants.js b/docs/src/pages/components/paper/Variants.js index 339688dd541904..5231935c848c65 100644 --- a/docs/src/pages/components/paper/Variants.js +++ b/docs/src/pages/components/paper/Variants.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; export default function Variants() { return ( diff --git a/docs/src/pages/components/paper/Variants.tsx b/docs/src/pages/components/paper/Variants.tsx index 339688dd541904..5231935c848c65 100644 --- a/docs/src/pages/components/paper/Variants.tsx +++ b/docs/src/pages/components/paper/Variants.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Paper from '@mui/material/Paper'; export default function Variants() { return ( diff --git a/docs/src/pages/components/pickers/MaterialUIPickers.js b/docs/src/pages/components/pickers/MaterialUIPickers.js index 28837f180d4c19..c4842aa906958b 100644 --- a/docs/src/pages/components/pickers/MaterialUIPickers.js +++ b/docs/src/pages/components/pickers/MaterialUIPickers.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import TimePicker from '@material-ui/lab/TimePicker'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import DesktopDatePicker from '@material-ui/lab/DesktopDatePicker'; -import MobileDatePicker from '@material-ui/lab/MobileDatePicker'; +import Stack from '@mui/material/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import TimePicker from '@mui/lab/TimePicker'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import DesktopDatePicker from '@mui/lab/DesktopDatePicker'; +import MobileDatePicker from '@mui/lab/MobileDatePicker'; export default function MaterialUIPickers() { const [value, setValue] = React.useState(new Date('2014-08-18T21:11:54')); diff --git a/docs/src/pages/components/pickers/MaterialUIPickers.tsx b/docs/src/pages/components/pickers/MaterialUIPickers.tsx index f0e4483f0f4674..f3ec0d8ff898c4 100644 --- a/docs/src/pages/components/pickers/MaterialUIPickers.tsx +++ b/docs/src/pages/components/pickers/MaterialUIPickers.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import TextField from '@material-ui/core/TextField'; -import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; -import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; -import TimePicker from '@material-ui/lab/TimePicker'; -import DateTimePicker from '@material-ui/lab/DateTimePicker'; -import DesktopDatePicker from '@material-ui/lab/DesktopDatePicker'; -import MobileDatePicker from '@material-ui/lab/MobileDatePicker'; +import Stack from '@mui/material/Stack'; +import TextField from '@mui/material/TextField'; +import AdapterDateFns from '@mui/lab/AdapterDateFns'; +import LocalizationProvider from '@mui/lab/LocalizationProvider'; +import TimePicker from '@mui/lab/TimePicker'; +import DateTimePicker from '@mui/lab/DateTimePicker'; +import DesktopDatePicker from '@mui/lab/DesktopDatePicker'; +import MobileDatePicker from '@mui/lab/MobileDatePicker'; export default function MaterialUIPickers() { const [value, setValue] = React.useState( diff --git a/docs/src/pages/components/pickers/NativePickers.js b/docs/src/pages/components/pickers/NativePickers.js index 4f3557e832dabd..547a21b7958a7f 100644 --- a/docs/src/pages/components/pickers/NativePickers.js +++ b/docs/src/pages/components/pickers/NativePickers.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; export default function NativePickers() { return ( diff --git a/docs/src/pages/components/pickers/NativePickers.tsx b/docs/src/pages/components/pickers/NativePickers.tsx index 4f3557e832dabd..547a21b7958a7f 100644 --- a/docs/src/pages/components/pickers/NativePickers.tsx +++ b/docs/src/pages/components/pickers/NativePickers.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import TextField from '@material-ui/core/TextField'; -import Stack from '@material-ui/core/Stack'; +import TextField from '@mui/material/TextField'; +import Stack from '@mui/material/Stack'; export default function NativePickers() { return ( diff --git a/docs/src/pages/components/pickers/pickers.md b/docs/src/pages/components/pickers/pickers.md index 5e77de1ecdd2a1..8e17e851208600 100644 --- a/docs/src/pages/components/pickers/pickers.md +++ b/docs/src/pages/components/pickers/pickers.md @@ -4,7 +4,7 @@ components: DatePicker,DateTimePicker,TimePicker,TextField githubLabel: 'component: DatePicker' materialDesign: https://material.io/components/date-pickers waiAria: https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/datepicker-dialog.html -packageName: '@material-ui/lab' +packageName: '@mui/lab' --- # Date / Time pickers @@ -48,13 +48,13 @@ Then you have to set the `dateAdapter` prop of the `LocalizationProvider` accord ```js // date-fns -import DateAdapter from '@material-ui/lab/AdapterDateFns'; +import DateAdapter from '@mui/lab/AdapterDateFns'; // or for Day.js -import DateAdapter from '@material-ui/lab/AdapterDayjs'; +import DateAdapter from '@mui/lab/AdapterDayjs'; // or for Luxon -import DateAdapter from '@material-ui/lab/AdapterLuxon'; +import DateAdapter from '@mui/lab/AdapterLuxon'; // or for Moment.js -import DateAdapter from '@material-ui/lab/AdapterMoment'; +import DateAdapter from '@mui/lab/AdapterMoment'; function App({ children }) { return ( diff --git a/docs/src/pages/components/popover/AnchorPlayground.js b/docs/src/pages/components/popover/AnchorPlayground.js index 65ab729824a773..9b27d85ebc58e9 100644 --- a/docs/src/pages/components/popover/AnchorPlayground.js +++ b/docs/src/pages/components/popover/AnchorPlayground.js @@ -1,18 +1,18 @@ import * as React from 'react'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import Radio from '@material-ui/core/Radio'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import RadioGroup from '@mui/material/RadioGroup'; +import Radio from '@mui/material/Radio'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import Grid from '@material-ui/core/Grid'; -import { green } from '@material-ui/core/colors'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Popover from '@material-ui/core/Popover'; -import Input from '@material-ui/core/Input'; -import InputLabel from '@material-ui/core/InputLabel'; +import Grid from '@mui/material/Grid'; +import { green } from '@mui/material/colors'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Popover from '@mui/material/Popover'; +import Input from '@mui/material/Input'; +import InputLabel from '@mui/material/InputLabel'; const inlineStyles = { anchorVertical: { diff --git a/docs/src/pages/components/popover/BasicPopover.js b/docs/src/pages/components/popover/BasicPopover.js index 2f6cfb5041a365..0c75a9d1795d44 100644 --- a/docs/src/pages/components/popover/BasicPopover.js +++ b/docs/src/pages/components/popover/BasicPopover.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Popover from '@material-ui/core/Popover'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; +import Popover from '@mui/material/Popover'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; export default function BasicPopover() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popover/BasicPopover.tsx b/docs/src/pages/components/popover/BasicPopover.tsx index 7b5f698c1915c7..5ee41b9d09d527 100644 --- a/docs/src/pages/components/popover/BasicPopover.tsx +++ b/docs/src/pages/components/popover/BasicPopover.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Popover from '@material-ui/core/Popover'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; +import Popover from '@mui/material/Popover'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; export default function BasicPopover() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popover/MouseOverPopover.js b/docs/src/pages/components/popover/MouseOverPopover.js index b53400072a686c..d67c83f9d2a0b0 100644 --- a/docs/src/pages/components/popover/MouseOverPopover.js +++ b/docs/src/pages/components/popover/MouseOverPopover.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Popover from '@material-ui/core/Popover'; -import Typography from '@material-ui/core/Typography'; +import Popover from '@mui/material/Popover'; +import Typography from '@mui/material/Typography'; export default function MouseOverPopover() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popover/MouseOverPopover.tsx b/docs/src/pages/components/popover/MouseOverPopover.tsx index 14f73711ecd353..91d7a290964fc8 100644 --- a/docs/src/pages/components/popover/MouseOverPopover.tsx +++ b/docs/src/pages/components/popover/MouseOverPopover.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Popover from '@material-ui/core/Popover'; -import Typography from '@material-ui/core/Typography'; +import Popover from '@mui/material/Popover'; +import Typography from '@mui/material/Typography'; export default function MouseOverPopover() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popover/PopoverPopupState.js b/docs/src/pages/components/popover/PopoverPopupState.js index 293fbeccd6e9d7..5238dce8fe6b5b 100644 --- a/docs/src/pages/components/popover/PopoverPopupState.js +++ b/docs/src/pages/components/popover/PopoverPopupState.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Popover from '@material-ui/core/Popover'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Popover from '@mui/material/Popover'; import PopupState, { bindTrigger, bindPopover } from 'material-ui-popup-state'; export default function PopoverPopupState() { diff --git a/docs/src/pages/components/popover/PopoverPopupState.tsx b/docs/src/pages/components/popover/PopoverPopupState.tsx index 293fbeccd6e9d7..5238dce8fe6b5b 100644 --- a/docs/src/pages/components/popover/PopoverPopupState.tsx +++ b/docs/src/pages/components/popover/PopoverPopupState.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Popover from '@material-ui/core/Popover'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Popover from '@mui/material/Popover'; import PopupState, { bindTrigger, bindPopover } from 'material-ui-popup-state'; export default function PopoverPopupState() { diff --git a/docs/src/pages/components/popper/PopperPopupState.js b/docs/src/pages/components/popper/PopperPopupState.js index 668d0ba468b1cd..e63c0fa10d7895 100644 --- a/docs/src/pages/components/popper/PopperPopupState.js +++ b/docs/src/pages/components/popper/PopperPopupState.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Popper from '@material-ui/core/Popper'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Popper from '@mui/material/Popper'; import PopupState, { bindToggle, bindPopper } from 'material-ui-popup-state'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function PopperPopupState() { return ( diff --git a/docs/src/pages/components/popper/PopperPopupState.tsx b/docs/src/pages/components/popper/PopperPopupState.tsx index 668d0ba468b1cd..e63c0fa10d7895 100644 --- a/docs/src/pages/components/popper/PopperPopupState.tsx +++ b/docs/src/pages/components/popper/PopperPopupState.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Popper from '@material-ui/core/Popper'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Popper from '@mui/material/Popper'; import PopupState, { bindToggle, bindPopper } from 'material-ui-popup-state'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function PopperPopupState() { return ( diff --git a/docs/src/pages/components/popper/PositionedPopper.js b/docs/src/pages/components/popper/PositionedPopper.js index d70f627d742b62..b36ca446c2abcb 100644 --- a/docs/src/pages/components/popper/PositionedPopper.js +++ b/docs/src/pages/components/popper/PositionedPopper.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function PositionedPopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/PositionedPopper.tsx b/docs/src/pages/components/popper/PositionedPopper.tsx index d41299557d0125..07deb61a13c635 100644 --- a/docs/src/pages/components/popper/PositionedPopper.tsx +++ b/docs/src/pages/components/popper/PositionedPopper.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper, { PopperPlacementType } from '@material-ui/core/Popper'; -import Typography from '@material-ui/core/Typography'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Box from '@mui/material/Box'; +import Popper, { PopperPlacementType } from '@mui/material/Popper'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function PositionedPopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/ScrollPlayground.js b/docs/src/pages/components/popper/ScrollPlayground.js index 35b8aa8e754c76..dbd63bf1a6d9ec 100644 --- a/docs/src/pages/components/popper/ScrollPlayground.js +++ b/docs/src/pages/components/popper/ScrollPlayground.js @@ -1,20 +1,20 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import { styled } from '@mui/material/styles'; +import FormControlLabel from '@mui/material/FormControlLabel'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import MuiPopper from '@material-ui/core/Popper'; -import Paper from '@material-ui/core/Paper'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import Switch from '@material-ui/core/Switch'; -import TextField from '@material-ui/core/TextField'; -import FormGroup from '@material-ui/core/FormGroup'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import MuiPopper from '@mui/material/Popper'; +import Paper from '@mui/material/Paper'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Switch from '@mui/material/Switch'; +import TextField from '@mui/material/TextField'; +import FormGroup from '@mui/material/FormGroup'; const Popper = styled(MuiPopper, { shouldForwardProp: (prop) => prop !== 'arrow', diff --git a/docs/src/pages/components/popper/SimplePopper.js b/docs/src/pages/components/popper/SimplePopper.js index 2c8961d6a89320..d001adba4a3f41 100644 --- a/docs/src/pages/components/popper/SimplePopper.js +++ b/docs/src/pages/components/popper/SimplePopper.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; export default function SimplePopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/SimplePopper.tsx b/docs/src/pages/components/popper/SimplePopper.tsx index 3f15eb39e4df3c..4770d36c0f34ac 100644 --- a/docs/src/pages/components/popper/SimplePopper.tsx +++ b/docs/src/pages/components/popper/SimplePopper.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; export default function SimplePopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/SpringPopper.js b/docs/src/pages/components/popper/SpringPopper.js index b6063ab1fdeb59..01ada8c2834ed3 100644 --- a/docs/src/pages/components/popper/SpringPopper.js +++ b/docs/src/pages/components/popper/SpringPopper.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; // web.cjs is required for IE11 support import { useSpring, animated } from 'react-spring/web.cjs'; diff --git a/docs/src/pages/components/popper/SpringPopper.tsx b/docs/src/pages/components/popper/SpringPopper.tsx index 05e692f3e7d02f..1a5787d0912556 100644 --- a/docs/src/pages/components/popper/SpringPopper.tsx +++ b/docs/src/pages/components/popper/SpringPopper.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; // web.cjs is required for IE11 support import { useSpring, animated } from 'react-spring/web.cjs'; diff --git a/docs/src/pages/components/popper/TransitionsPopper.js b/docs/src/pages/components/popper/TransitionsPopper.js index 4bd60ebedc2ea0..82202a45e969db 100644 --- a/docs/src/pages/components/popper/TransitionsPopper.js +++ b/docs/src/pages/components/popper/TransitionsPopper.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; -import Fade from '@material-ui/core/Fade'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; +import Fade from '@mui/material/Fade'; export default function TransitionsPopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/TransitionsPopper.tsx b/docs/src/pages/components/popper/TransitionsPopper.tsx index 001db35edef922..2a69f21ad9a45e 100644 --- a/docs/src/pages/components/popper/TransitionsPopper.tsx +++ b/docs/src/pages/components/popper/TransitionsPopper.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Popper from '@material-ui/core/Popper'; -import Fade from '@material-ui/core/Fade'; +import Box from '@mui/material/Box'; +import Popper from '@mui/material/Popper'; +import Fade from '@mui/material/Fade'; export default function TransitionsPopper() { const [anchorEl, setAnchorEl] = React.useState(null); diff --git a/docs/src/pages/components/popper/VirtualElementPopper.js b/docs/src/pages/components/popper/VirtualElementPopper.js index 04873a8332c750..67356c58f59412 100644 --- a/docs/src/pages/components/popper/VirtualElementPopper.js +++ b/docs/src/pages/components/popper/VirtualElementPopper.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Popper from '@material-ui/core/Popper'; -import Typography from '@material-ui/core/Typography'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Popper from '@mui/material/Popper'; +import Typography from '@mui/material/Typography'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function VirtualElementPopper() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/popper/VirtualElementPopper.tsx b/docs/src/pages/components/popper/VirtualElementPopper.tsx index ba389f7ac5d779..996769f5aeb771 100644 --- a/docs/src/pages/components/popper/VirtualElementPopper.tsx +++ b/docs/src/pages/components/popper/VirtualElementPopper.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Popper, { PopperProps } from '@material-ui/core/Popper'; -import Typography from '@material-ui/core/Typography'; -import Fade from '@material-ui/core/Fade'; -import Paper from '@material-ui/core/Paper'; +import Popper, { PopperProps } from '@mui/material/Popper'; +import Typography from '@mui/material/Typography'; +import Fade from '@mui/material/Fade'; +import Paper from '@mui/material/Paper'; export default function VirtualElementPopper() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/portal/SimplePortal.js b/docs/src/pages/components/portal/SimplePortal.js index 7bb62a20d7a17b..830945c112ba63 100644 --- a/docs/src/pages/components/portal/SimplePortal.js +++ b/docs/src/pages/components/portal/SimplePortal.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Portal from '@material-ui/core/Portal'; +import Box from '@mui/material/Box'; +import Portal from '@mui/material/Portal'; export default function SimplePortal() { const [show, setShow] = React.useState(false); diff --git a/docs/src/pages/components/portal/SimplePortal.tsx b/docs/src/pages/components/portal/SimplePortal.tsx index 7bb62a20d7a17b..830945c112ba63 100644 --- a/docs/src/pages/components/portal/SimplePortal.tsx +++ b/docs/src/pages/components/portal/SimplePortal.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Portal from '@material-ui/core/Portal'; +import Box from '@mui/material/Box'; +import Portal from '@mui/material/Portal'; export default function SimplePortal() { const [show, setShow] = React.useState(false); diff --git a/docs/src/pages/components/portal/portal.md b/docs/src/pages/components/portal/portal.md index f8681e38acc2cb..b9cb9c49175aa7 100644 --- a/docs/src/pages/components/portal/portal.md +++ b/docs/src/pages/components/portal/portal.md @@ -24,10 +24,10 @@ You have to wait for the client-side hydration to see the children. ## Unstyled -- 📦 [970 B gzipped](https://bundlephobia.com/result?p=@material-ui/unstyled@next) +- 📦 [970 B gzipped](https://bundlephobia.com/result?p=@mui/core@next) As the component does not have any styles, it also comes with the unstyled package. ```js -import Portal from '@material-ui/unstyled/Portal'; +import Portal from '@mui/core/Portal'; ``` diff --git a/docs/src/pages/components/progress/CircularColor.js b/docs/src/pages/components/progress/CircularColor.js index 855deb343c0fb4..20dd822b6fef2c 100644 --- a/docs/src/pages/components/progress/CircularColor.js +++ b/docs/src/pages/components/progress/CircularColor.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Stack from '@mui/material/Stack'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularColor() { return ( diff --git a/docs/src/pages/components/progress/CircularColor.tsx b/docs/src/pages/components/progress/CircularColor.tsx index 855deb343c0fb4..20dd822b6fef2c 100644 --- a/docs/src/pages/components/progress/CircularColor.tsx +++ b/docs/src/pages/components/progress/CircularColor.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Stack from '@mui/material/Stack'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularColor() { return ( diff --git a/docs/src/pages/components/progress/CircularDeterminate.js b/docs/src/pages/components/progress/CircularDeterminate.js index 92fba8aaa996d1..121ce521a9c154 100644 --- a/docs/src/pages/components/progress/CircularDeterminate.js +++ b/docs/src/pages/components/progress/CircularDeterminate.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Stack from '@mui/material/Stack'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularDeterminate() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/CircularDeterminate.tsx b/docs/src/pages/components/progress/CircularDeterminate.tsx index 92fba8aaa996d1..121ce521a9c154 100644 --- a/docs/src/pages/components/progress/CircularDeterminate.tsx +++ b/docs/src/pages/components/progress/CircularDeterminate.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Stack from '@mui/material/Stack'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularDeterminate() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/CircularIndeterminate.js b/docs/src/pages/components/progress/CircularIndeterminate.js index 07580917e1eb5a..16a5407085ecb8 100644 --- a/docs/src/pages/components/progress/CircularIndeterminate.js +++ b/docs/src/pages/components/progress/CircularIndeterminate.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Box from '@material-ui/core/Box'; +import CircularProgress from '@mui/material/CircularProgress'; +import Box from '@mui/material/Box'; export default function CircularIndeterminate() { return ( diff --git a/docs/src/pages/components/progress/CircularIndeterminate.tsx b/docs/src/pages/components/progress/CircularIndeterminate.tsx index 07580917e1eb5a..16a5407085ecb8 100644 --- a/docs/src/pages/components/progress/CircularIndeterminate.tsx +++ b/docs/src/pages/components/progress/CircularIndeterminate.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Box from '@material-ui/core/Box'; +import CircularProgress from '@mui/material/CircularProgress'; +import Box from '@mui/material/Box'; export default function CircularIndeterminate() { return ( diff --git a/docs/src/pages/components/progress/CircularIntegration.js b/docs/src/pages/components/progress/CircularIntegration.js index db17715922e3fe..c077a18947a126 100644 --- a/docs/src/pages/components/progress/CircularIntegration.js +++ b/docs/src/pages/components/progress/CircularIntegration.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import { green } from '@material-ui/core/colors'; -import Button from '@material-ui/core/Button'; -import Fab from '@material-ui/core/Fab'; -import CheckIcon from '@material-ui/icons/Check'; -import SaveIcon from '@material-ui/icons/Save'; +import Box from '@mui/material/Box'; +import CircularProgress from '@mui/material/CircularProgress'; +import { green } from '@mui/material/colors'; +import Button from '@mui/material/Button'; +import Fab from '@mui/material/Fab'; +import CheckIcon from '@mui/icons-material/Check'; +import SaveIcon from '@mui/icons-material/Save'; export default function CircularIntegration() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/progress/CircularIntegration.tsx b/docs/src/pages/components/progress/CircularIntegration.tsx index e8439ba9f5ab2f..0400d3a8066a20 100644 --- a/docs/src/pages/components/progress/CircularIntegration.tsx +++ b/docs/src/pages/components/progress/CircularIntegration.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import { green } from '@material-ui/core/colors'; -import Button from '@material-ui/core/Button'; -import Fab from '@material-ui/core/Fab'; -import CheckIcon from '@material-ui/icons/Check'; -import SaveIcon from '@material-ui/icons/Save'; +import Box from '@mui/material/Box'; +import CircularProgress from '@mui/material/CircularProgress'; +import { green } from '@mui/material/colors'; +import Button from '@mui/material/Button'; +import Fab from '@mui/material/Fab'; +import CheckIcon from '@mui/icons-material/Check'; +import SaveIcon from '@mui/icons-material/Save'; export default function CircularIntegration() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/progress/CircularUnderLoad.js b/docs/src/pages/components/progress/CircularUnderLoad.js index 510901fe151477..a9680262a513bb 100644 --- a/docs/src/pages/components/progress/CircularUnderLoad.js +++ b/docs/src/pages/components/progress/CircularUnderLoad.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularUnderLoad() { return ; diff --git a/docs/src/pages/components/progress/CircularUnderLoad.tsx b/docs/src/pages/components/progress/CircularUnderLoad.tsx index 510901fe151477..a9680262a513bb 100644 --- a/docs/src/pages/components/progress/CircularUnderLoad.tsx +++ b/docs/src/pages/components/progress/CircularUnderLoad.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import CircularProgress from '@mui/material/CircularProgress'; export default function CircularUnderLoad() { return ; diff --git a/docs/src/pages/components/progress/CircularWithValueLabel.js b/docs/src/pages/components/progress/CircularWithValueLabel.js index 4cd9aebb4bdd92..c96a7ef6baab21 100644 --- a/docs/src/pages/components/progress/CircularWithValueLabel.js +++ b/docs/src/pages/components/progress/CircularWithValueLabel.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +import CircularProgress from '@mui/material/CircularProgress'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; function CircularProgressWithLabel(props) { return ( diff --git a/docs/src/pages/components/progress/CircularWithValueLabel.tsx b/docs/src/pages/components/progress/CircularWithValueLabel.tsx index 7b7564eda3f877..ff636057f0ba9c 100644 --- a/docs/src/pages/components/progress/CircularWithValueLabel.tsx +++ b/docs/src/pages/components/progress/CircularWithValueLabel.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import CircularProgress, { CircularProgressProps, -} from '@material-ui/core/CircularProgress'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +} from '@mui/material/CircularProgress'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; function CircularProgressWithLabel( props: CircularProgressProps & { value: number }, diff --git a/docs/src/pages/components/progress/CustomizedProgressBars.js b/docs/src/pages/components/progress/CustomizedProgressBars.js index 9b9f602ca724f2..0eb012a3ce01c7 100644 --- a/docs/src/pages/components/progress/CustomizedProgressBars.js +++ b/docs/src/pages/components/progress/CustomizedProgressBars.js @@ -1,12 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; import CircularProgress, { circularProgressClasses, -} from '@material-ui/core/CircularProgress'; -import LinearProgress, { - linearProgressClasses, -} from '@material-ui/core/LinearProgress'; +} from '@mui/material/CircularProgress'; +import LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress'; const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({ height: 10, diff --git a/docs/src/pages/components/progress/CustomizedProgressBars.tsx b/docs/src/pages/components/progress/CustomizedProgressBars.tsx index 6e4b58994e07dc..a3951b14b7bc23 100644 --- a/docs/src/pages/components/progress/CustomizedProgressBars.tsx +++ b/docs/src/pages/components/progress/CustomizedProgressBars.tsx @@ -1,13 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; import CircularProgress, { circularProgressClasses, CircularProgressProps, -} from '@material-ui/core/CircularProgress'; -import LinearProgress, { - linearProgressClasses, -} from '@material-ui/core/LinearProgress'; +} from '@mui/material/CircularProgress'; +import LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress'; const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({ height: 10, diff --git a/docs/src/pages/components/progress/DelayingAppearance.js b/docs/src/pages/components/progress/DelayingAppearance.js index 035ef5c7b8ece3..feff1c6659b7e4 100644 --- a/docs/src/pages/components/progress/DelayingAppearance.js +++ b/docs/src/pages/components/progress/DelayingAppearance.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; +import Typography from '@mui/material/Typography'; export default function DelayingAppearance() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/progress/DelayingAppearance.tsx b/docs/src/pages/components/progress/DelayingAppearance.tsx index 0aee4caacf8887..c7ef8f7f90feaa 100644 --- a/docs/src/pages/components/progress/DelayingAppearance.tsx +++ b/docs/src/pages/components/progress/DelayingAppearance.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Fade from '@material-ui/core/Fade'; -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Fade from '@mui/material/Fade'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; +import Typography from '@mui/material/Typography'; export default function DelayingAppearance() { const [loading, setLoading] = React.useState(false); diff --git a/docs/src/pages/components/progress/LinearBuffer.js b/docs/src/pages/components/progress/LinearBuffer.js index 4defbd129d5bea..1e9c03f8839610 100644 --- a/docs/src/pages/components/progress/LinearBuffer.js +++ b/docs/src/pages/components/progress/LinearBuffer.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearBuffer() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/LinearBuffer.tsx b/docs/src/pages/components/progress/LinearBuffer.tsx index 4defbd129d5bea..1e9c03f8839610 100644 --- a/docs/src/pages/components/progress/LinearBuffer.tsx +++ b/docs/src/pages/components/progress/LinearBuffer.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearBuffer() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/LinearColor.js b/docs/src/pages/components/progress/LinearColor.js index cdae0b6b390e79..922dc08843df25 100644 --- a/docs/src/pages/components/progress/LinearColor.js +++ b/docs/src/pages/components/progress/LinearColor.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Stack from '@mui/material/Stack'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearColor() { return ( diff --git a/docs/src/pages/components/progress/LinearColor.tsx b/docs/src/pages/components/progress/LinearColor.tsx index cdae0b6b390e79..922dc08843df25 100644 --- a/docs/src/pages/components/progress/LinearColor.tsx +++ b/docs/src/pages/components/progress/LinearColor.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Stack from '@mui/material/Stack'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearColor() { return ( diff --git a/docs/src/pages/components/progress/LinearDeterminate.js b/docs/src/pages/components/progress/LinearDeterminate.js index 665d90edc53df4..b7ba43e378cb83 100644 --- a/docs/src/pages/components/progress/LinearDeterminate.js +++ b/docs/src/pages/components/progress/LinearDeterminate.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearDeterminate() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/LinearDeterminate.tsx b/docs/src/pages/components/progress/LinearDeterminate.tsx index 665d90edc53df4..b7ba43e378cb83 100644 --- a/docs/src/pages/components/progress/LinearDeterminate.tsx +++ b/docs/src/pages/components/progress/LinearDeterminate.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearDeterminate() { const [progress, setProgress] = React.useState(0); diff --git a/docs/src/pages/components/progress/LinearIndeterminate.js b/docs/src/pages/components/progress/LinearIndeterminate.js index 65da70259b075f..7831ffddb0afe7 100644 --- a/docs/src/pages/components/progress/LinearIndeterminate.js +++ b/docs/src/pages/components/progress/LinearIndeterminate.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearIndeterminate() { return ( diff --git a/docs/src/pages/components/progress/LinearIndeterminate.tsx b/docs/src/pages/components/progress/LinearIndeterminate.tsx index 65da70259b075f..7831ffddb0afe7 100644 --- a/docs/src/pages/components/progress/LinearIndeterminate.tsx +++ b/docs/src/pages/components/progress/LinearIndeterminate.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import LinearProgress from '@material-ui/core/LinearProgress'; +import Box from '@mui/material/Box'; +import LinearProgress from '@mui/material/LinearProgress'; export default function LinearIndeterminate() { return ( diff --git a/docs/src/pages/components/progress/LinearWithValueLabel.js b/docs/src/pages/components/progress/LinearWithValueLabel.js index 495ff55f7b0043..2dda9709540f00 100644 --- a/docs/src/pages/components/progress/LinearWithValueLabel.js +++ b/docs/src/pages/components/progress/LinearWithValueLabel.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import LinearProgress from '@material-ui/core/LinearProgress'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +import LinearProgress from '@mui/material/LinearProgress'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; function LinearProgressWithLabel(props) { return ( diff --git a/docs/src/pages/components/progress/LinearWithValueLabel.tsx b/docs/src/pages/components/progress/LinearWithValueLabel.tsx index 79042e822c5931..a3d3ef6703fd18 100644 --- a/docs/src/pages/components/progress/LinearWithValueLabel.tsx +++ b/docs/src/pages/components/progress/LinearWithValueLabel.tsx @@ -1,9 +1,7 @@ import * as React from 'react'; -import LinearProgress, { - LinearProgressProps, -} from '@material-ui/core/LinearProgress'; -import Typography from '@material-ui/core/Typography'; -import Box from '@material-ui/core/Box'; +import LinearProgress, { LinearProgressProps } from '@mui/material/LinearProgress'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; function LinearProgressWithLabel(props: LinearProgressProps & { value: number }) { return ( diff --git a/docs/src/pages/components/radio-buttons/ColorRadioButtons.js b/docs/src/pages/components/radio-buttons/ColorRadioButtons.js index b0e9caff297142..0c18596d524934 100644 --- a/docs/src/pages/components/radio-buttons/ColorRadioButtons.js +++ b/docs/src/pages/components/radio-buttons/ColorRadioButtons.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { pink } from '@material-ui/core/colors'; -import Radio from '@material-ui/core/Radio'; +import { pink } from '@mui/material/colors'; +import Radio from '@mui/material/Radio'; export default function ColorRadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/ColorRadioButtons.tsx b/docs/src/pages/components/radio-buttons/ColorRadioButtons.tsx index 692a13ba57328a..f01f5dd5ec82e5 100644 --- a/docs/src/pages/components/radio-buttons/ColorRadioButtons.tsx +++ b/docs/src/pages/components/radio-buttons/ColorRadioButtons.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { pink } from '@material-ui/core/colors'; -import Radio from '@material-ui/core/Radio'; +import { pink } from '@mui/material/colors'; +import Radio from '@mui/material/Radio'; export default function ColorRadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.js b/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.js index 52cac177daa4ee..8192d057e09096 100644 --- a/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.js +++ b/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function ControlledRadioButtonsGroup() { const [value, setValue] = React.useState('female'); diff --git a/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.tsx b/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.tsx index ca04a4706a633d..bc1e85aff2f01d 100644 --- a/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.tsx +++ b/docs/src/pages/components/radio-buttons/ControlledRadioButtonsGroup.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function ControlledRadioButtonsGroup() { const [value, setValue] = React.useState('female'); diff --git a/docs/src/pages/components/radio-buttons/CustomizedRadios.js b/docs/src/pages/components/radio-buttons/CustomizedRadios.js index be5a497a3939bc..6d2e9dc1d372dd 100644 --- a/docs/src/pages/components/radio-buttons/CustomizedRadios.js +++ b/docs/src/pages/components/radio-buttons/CustomizedRadios.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import { styled } from '@mui/material/styles'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; const BpIcon = styled('span')(({ theme }) => ({ borderRadius: '50%', diff --git a/docs/src/pages/components/radio-buttons/CustomizedRadios.tsx b/docs/src/pages/components/radio-buttons/CustomizedRadios.tsx index 85d99300b7e2e5..78ceb37fa337f4 100644 --- a/docs/src/pages/components/radio-buttons/CustomizedRadios.tsx +++ b/docs/src/pages/components/radio-buttons/CustomizedRadios.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Radio, { RadioProps } from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import { styled } from '@mui/material/styles'; +import Radio, { RadioProps } from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; const BpIcon = styled('span')(({ theme }) => ({ borderRadius: '50%', diff --git a/docs/src/pages/components/radio-buttons/ErrorRadios.js b/docs/src/pages/components/radio-buttons/ErrorRadios.js index 927730d731312c..109a3a53eb8b45 100644 --- a/docs/src/pages/components/radio-buttons/ErrorRadios.js +++ b/docs/src/pages/components/radio-buttons/ErrorRadios.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormLabel from '@material-ui/core/FormLabel'; -import Button from '@material-ui/core/Button'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormLabel from '@mui/material/FormLabel'; +import Button from '@mui/material/Button'; export default function ErrorRadios() { const [value, setValue] = React.useState(''); diff --git a/docs/src/pages/components/radio-buttons/ErrorRadios.tsx b/docs/src/pages/components/radio-buttons/ErrorRadios.tsx index 2311d9788bd5cd..6b6a14d09e6c58 100644 --- a/docs/src/pages/components/radio-buttons/ErrorRadios.tsx +++ b/docs/src/pages/components/radio-buttons/ErrorRadios.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormLabel from '@material-ui/core/FormLabel'; -import Button from '@material-ui/core/Button'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormLabel from '@mui/material/FormLabel'; +import Button from '@mui/material/Button'; export default function ErrorRadios() { const [value, setValue] = React.useState(''); diff --git a/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.js b/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.js index e5c1386ec61c31..dd644e0b320007 100644 --- a/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.js +++ b/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function FormControlLabelPlacement() { return ( diff --git a/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.tsx b/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.tsx index e5c1386ec61c31..dd644e0b320007 100644 --- a/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.tsx +++ b/docs/src/pages/components/radio-buttons/FormControlLabelPlacement.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function FormControlLabelPlacement() { return ( diff --git a/docs/src/pages/components/radio-buttons/RadioButtons.js b/docs/src/pages/components/radio-buttons/RadioButtons.js index 5070a38b3f5946..205db96de1e15c 100644 --- a/docs/src/pages/components/radio-buttons/RadioButtons.js +++ b/docs/src/pages/components/radio-buttons/RadioButtons.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; +import Radio from '@mui/material/Radio'; export default function RadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/RadioButtons.tsx b/docs/src/pages/components/radio-buttons/RadioButtons.tsx index b8de17b3d44aea..cc00ac0ab82100 100644 --- a/docs/src/pages/components/radio-buttons/RadioButtons.tsx +++ b/docs/src/pages/components/radio-buttons/RadioButtons.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; +import Radio from '@mui/material/Radio'; export default function RadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/RadioButtonsGroup.js b/docs/src/pages/components/radio-buttons/RadioButtonsGroup.js index 983d4b5385712e..0676af51aad829 100644 --- a/docs/src/pages/components/radio-buttons/RadioButtonsGroup.js +++ b/docs/src/pages/components/radio-buttons/RadioButtonsGroup.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function RadioButtonsGroup() { return ( diff --git a/docs/src/pages/components/radio-buttons/RadioButtonsGroup.tsx b/docs/src/pages/components/radio-buttons/RadioButtonsGroup.tsx index 983d4b5385712e..0676af51aad829 100644 --- a/docs/src/pages/components/radio-buttons/RadioButtonsGroup.tsx +++ b/docs/src/pages/components/radio-buttons/RadioButtonsGroup.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function RadioButtonsGroup() { return ( diff --git a/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.js b/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.js index 9ba5bbd9831fc6..bcf6d103735b74 100644 --- a/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.js +++ b/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function RowRadioButtonsGroup() { return ( diff --git a/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.tsx b/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.tsx index 9ba5bbd9831fc6..bcf6d103735b74 100644 --- a/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.tsx +++ b/docs/src/pages/components/radio-buttons/RowRadioButtonsGroup.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; -import RadioGroup from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import FormControl from '@material-ui/core/FormControl'; -import FormLabel from '@material-ui/core/FormLabel'; +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; export default function RowRadioButtonsGroup() { return ( diff --git a/docs/src/pages/components/radio-buttons/SizeRadioButtons.js b/docs/src/pages/components/radio-buttons/SizeRadioButtons.js index 8fa91812909f69..02a9ca4f90498c 100644 --- a/docs/src/pages/components/radio-buttons/SizeRadioButtons.js +++ b/docs/src/pages/components/radio-buttons/SizeRadioButtons.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; +import Radio from '@mui/material/Radio'; export default function SizeRadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/SizeRadioButtons.tsx b/docs/src/pages/components/radio-buttons/SizeRadioButtons.tsx index 39d8850840612f..2f39da5d669e17 100644 --- a/docs/src/pages/components/radio-buttons/SizeRadioButtons.tsx +++ b/docs/src/pages/components/radio-buttons/SizeRadioButtons.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import Radio from '@material-ui/core/Radio'; +import Radio from '@mui/material/Radio'; export default function SizeRadioButtons() { const [selectedValue, setSelectedValue] = React.useState('a'); diff --git a/docs/src/pages/components/radio-buttons/UseRadioGroup.js b/docs/src/pages/components/radio-buttons/UseRadioGroup.js index 4bca5598255b11..3265cb285ddf25 100644 --- a/docs/src/pages/components/radio-buttons/UseRadioGroup.js +++ b/docs/src/pages/components/radio-buttons/UseRadioGroup.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled } from '@material-ui/core/styles'; -import RadioGroup, { useRadioGroup } from '@material-ui/core/RadioGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; -import Radio from '@material-ui/core/Radio'; +import { styled } from '@mui/material/styles'; +import RadioGroup, { useRadioGroup } from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import Radio from '@mui/material/Radio'; const StyledFormControlLabel = styled((props) => )( ({ theme, checked }) => ({ diff --git a/docs/src/pages/components/radio-buttons/UseRadioGroup.tsx b/docs/src/pages/components/radio-buttons/UseRadioGroup.tsx index 8bfa2e5b0cea17..db5acee780e941 100644 --- a/docs/src/pages/components/radio-buttons/UseRadioGroup.tsx +++ b/docs/src/pages/components/radio-buttons/UseRadioGroup.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import RadioGroup, { useRadioGroup } from '@material-ui/core/RadioGroup'; +import { styled } from '@mui/material/styles'; +import RadioGroup, { useRadioGroup } from '@mui/material/RadioGroup'; import FormControlLabel, { FormControlLabelProps, -} from '@material-ui/core/FormControlLabel'; -import Radio from '@material-ui/core/Radio'; +} from '@mui/material/FormControlLabel'; +import Radio from '@mui/material/Radio'; interface StyledFormControlLabelProps extends FormControlLabelProps { checked: boolean; diff --git a/docs/src/pages/components/radio-buttons/radio-buttons.md b/docs/src/pages/components/radio-buttons/radio-buttons.md index 657063473bc908..88ec8eb5489312 100644 --- a/docs/src/pages/components/radio-buttons/radio-buttons.md +++ b/docs/src/pages/components/radio-buttons/radio-buttons.md @@ -79,7 +79,7 @@ The Radio component uses this hook internally. ### API ```jsx -import { useRadioGroup } from '@material-ui/core/RadioGroup'; +import { useRadioGroup } from '@mui/material/RadioGroup'; ``` #### Returns diff --git a/docs/src/pages/components/rating/BasicRating.js b/docs/src/pages/components/rating/BasicRating.js index 3a8d75b58220bc..e434c1b62e372f 100644 --- a/docs/src/pages/components/rating/BasicRating.js +++ b/docs/src/pages/components/rating/BasicRating.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import Typography from '@mui/material/Typography'; export default function BasicRating() { const [value, setValue] = React.useState(2); diff --git a/docs/src/pages/components/rating/BasicRating.tsx b/docs/src/pages/components/rating/BasicRating.tsx index 849a20abc88f64..bdac55f4e6e964 100644 --- a/docs/src/pages/components/rating/BasicRating.tsx +++ b/docs/src/pages/components/rating/BasicRating.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import Typography from '@material-ui/core/Typography'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import Typography from '@mui/material/Typography'; export default function BasicRating() { const [value, setValue] = React.useState(2); diff --git a/docs/src/pages/components/rating/CustomizedRating.js b/docs/src/pages/components/rating/CustomizedRating.js index 42ceb4e643244b..f9697feb29a513 100644 --- a/docs/src/pages/components/rating/CustomizedRating.js +++ b/docs/src/pages/components/rating/CustomizedRating.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import FavoriteBorderIcon from '@material-ui/icons/FavoriteBorder'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import FavoriteBorderIcon from '@mui/icons-material/FavoriteBorder'; +import Typography from '@mui/material/Typography'; const StyledRating = styled(Rating)({ '& .MuiRating-iconFilled': { diff --git a/docs/src/pages/components/rating/CustomizedRating.tsx b/docs/src/pages/components/rating/CustomizedRating.tsx index e8fec521b967b5..e39d87d80b19e6 100644 --- a/docs/src/pages/components/rating/CustomizedRating.tsx +++ b/docs/src/pages/components/rating/CustomizedRating.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import FavoriteIcon from '@material-ui/icons/Favorite'; -import FavoriteBorderIcon from '@material-ui/icons/FavoriteBorder'; -import Typography from '@material-ui/core/Typography'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import FavoriteIcon from '@mui/icons-material/Favorite'; +import FavoriteBorderIcon from '@mui/icons-material/FavoriteBorder'; +import Typography from '@mui/material/Typography'; const StyledRating = styled(Rating)({ '& .MuiRating-iconFilled': { diff --git a/docs/src/pages/components/rating/HalfRating.js b/docs/src/pages/components/rating/HalfRating.js index 847e89066dcd9e..f920d3e1a02333 100644 --- a/docs/src/pages/components/rating/HalfRating.js +++ b/docs/src/pages/components/rating/HalfRating.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Stack from '@material-ui/core/Stack'; +import Rating from '@mui/material/Rating'; +import Stack from '@mui/material/Stack'; export default function HalfRating() { return ( diff --git a/docs/src/pages/components/rating/HalfRating.tsx b/docs/src/pages/components/rating/HalfRating.tsx index 847e89066dcd9e..f920d3e1a02333 100644 --- a/docs/src/pages/components/rating/HalfRating.tsx +++ b/docs/src/pages/components/rating/HalfRating.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Stack from '@material-ui/core/Stack'; +import Rating from '@mui/material/Rating'; +import Stack from '@mui/material/Stack'; export default function HalfRating() { return ( diff --git a/docs/src/pages/components/rating/HoverRating.js b/docs/src/pages/components/rating/HoverRating.js index 2d8d76cda1f8db..bf8addf59acea0 100644 --- a/docs/src/pages/components/rating/HoverRating.js +++ b/docs/src/pages/components/rating/HoverRating.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Box from '@material-ui/core/Box'; -import StarIcon from '@material-ui/icons/Star'; +import Rating from '@mui/material/Rating'; +import Box from '@mui/material/Box'; +import StarIcon from '@mui/icons-material/Star'; const labels = { 0.5: 'Useless', diff --git a/docs/src/pages/components/rating/HoverRating.tsx b/docs/src/pages/components/rating/HoverRating.tsx index 0d34b32f10976b..34121d6aa6eab1 100644 --- a/docs/src/pages/components/rating/HoverRating.tsx +++ b/docs/src/pages/components/rating/HoverRating.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Box from '@material-ui/core/Box'; -import StarIcon from '@material-ui/icons/Star'; +import Rating from '@mui/material/Rating'; +import Box from '@mui/material/Box'; +import StarIcon from '@mui/icons-material/Star'; const labels: { [index: string]: string } = { 0.5: 'Useless', diff --git a/docs/src/pages/components/rating/RadioGroupRating.js b/docs/src/pages/components/rating/RadioGroupRating.js index 7b583cc19a23df..91b86dbd16b12e 100644 --- a/docs/src/pages/components/rating/RadioGroupRating.js +++ b/docs/src/pages/components/rating/RadioGroupRating.js @@ -1,11 +1,11 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Rating from '@material-ui/core/Rating'; -import SentimentVeryDissatisfiedIcon from '@material-ui/icons/SentimentVeryDissatisfied'; -import SentimentDissatisfiedIcon from '@material-ui/icons/SentimentDissatisfied'; -import SentimentSatisfiedIcon from '@material-ui/icons/SentimentSatisfied'; -import SentimentSatisfiedAltIcon from '@material-ui/icons/SentimentSatisfiedAltOutlined'; -import SentimentVerySatisfiedIcon from '@material-ui/icons/SentimentVerySatisfied'; +import Rating from '@mui/material/Rating'; +import SentimentVeryDissatisfiedIcon from '@mui/icons-material/SentimentVeryDissatisfied'; +import SentimentDissatisfiedIcon from '@mui/icons-material/SentimentDissatisfied'; +import SentimentSatisfiedIcon from '@mui/icons-material/SentimentSatisfied'; +import SentimentSatisfiedAltIcon from '@mui/icons-material/SentimentSatisfiedAltOutlined'; +import SentimentVerySatisfiedIcon from '@mui/icons-material/SentimentVerySatisfied'; const customIcons = { 1: { diff --git a/docs/src/pages/components/rating/RadioGroupRating.tsx b/docs/src/pages/components/rating/RadioGroupRating.tsx index 697cf08d99fcb8..ed02ce9e1aa355 100644 --- a/docs/src/pages/components/rating/RadioGroupRating.tsx +++ b/docs/src/pages/components/rating/RadioGroupRating.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import Rating, { IconContainerProps } from '@material-ui/core/Rating'; -import SentimentVeryDissatisfiedIcon from '@material-ui/icons/SentimentVeryDissatisfied'; -import SentimentDissatisfiedIcon from '@material-ui/icons/SentimentDissatisfied'; -import SentimentSatisfiedIcon from '@material-ui/icons/SentimentSatisfied'; -import SentimentSatisfiedAltIcon from '@material-ui/icons/SentimentSatisfiedAltOutlined'; -import SentimentVerySatisfiedIcon from '@material-ui/icons/SentimentVerySatisfied'; +import Rating, { IconContainerProps } from '@mui/material/Rating'; +import SentimentVeryDissatisfiedIcon from '@mui/icons-material/SentimentVeryDissatisfied'; +import SentimentDissatisfiedIcon from '@mui/icons-material/SentimentDissatisfied'; +import SentimentSatisfiedIcon from '@mui/icons-material/SentimentSatisfied'; +import SentimentSatisfiedAltIcon from '@mui/icons-material/SentimentSatisfiedAltOutlined'; +import SentimentVerySatisfiedIcon from '@mui/icons-material/SentimentVerySatisfied'; const customIcons: { [index: string]: { diff --git a/docs/src/pages/components/rating/RatingSize.js b/docs/src/pages/components/rating/RatingSize.js index 4e03fac0f9e11f..7fee4bc4e3eb24 100644 --- a/docs/src/pages/components/rating/RatingSize.js +++ b/docs/src/pages/components/rating/RatingSize.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Stack from '@material-ui/core/Stack'; +import Rating from '@mui/material/Rating'; +import Stack from '@mui/material/Stack'; export default function RatingSIze() { return ( diff --git a/docs/src/pages/components/rating/RatingSize.tsx b/docs/src/pages/components/rating/RatingSize.tsx index 4e03fac0f9e11f..7fee4bc4e3eb24 100644 --- a/docs/src/pages/components/rating/RatingSize.tsx +++ b/docs/src/pages/components/rating/RatingSize.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Rating from '@material-ui/core/Rating'; -import Stack from '@material-ui/core/Stack'; +import Rating from '@mui/material/Rating'; +import Stack from '@mui/material/Stack'; export default function RatingSIze() { return ( diff --git a/docs/src/pages/components/rating/TextRating.js b/docs/src/pages/components/rating/TextRating.js index 5e191c965847ea..0a4f8fad1c219b 100644 --- a/docs/src/pages/components/rating/TextRating.js +++ b/docs/src/pages/components/rating/TextRating.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import StarIcon from '@material-ui/icons/Star'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import StarIcon from '@mui/icons-material/Star'; const labels = { 0.5: 'Useless', diff --git a/docs/src/pages/components/rating/TextRating.tsx b/docs/src/pages/components/rating/TextRating.tsx index c5195f5660bd8a..a3777be1b46d4a 100644 --- a/docs/src/pages/components/rating/TextRating.tsx +++ b/docs/src/pages/components/rating/TextRating.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Rating from '@material-ui/core/Rating'; -import StarIcon from '@material-ui/icons/Star'; +import Box from '@mui/material/Box'; +import Rating from '@mui/material/Rating'; +import StarIcon from '@mui/icons-material/Star'; const labels: { [index: string]: string } = { 0.5: 'Useless', diff --git a/docs/src/pages/components/selects/BasicSelect.js b/docs/src/pages/components/selects/BasicSelect.js index 62ed76491889eb..376005e57f5c77 100644 --- a/docs/src/pages/components/selects/BasicSelect.js +++ b/docs/src/pages/components/selects/BasicSelect.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function BasicSelect() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/BasicSelect.tsx b/docs/src/pages/components/selects/BasicSelect.tsx index b43b1402f31477..58b3a21499fc30 100644 --- a/docs/src/pages/components/selects/BasicSelect.tsx +++ b/docs/src/pages/components/selects/BasicSelect.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function BasicSelect() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/ControlledOpenSelect.js b/docs/src/pages/components/selects/ControlledOpenSelect.js index 08ecd4cb7279af..80071d0d4cca4e 100644 --- a/docs/src/pages/components/selects/ControlledOpenSelect.js +++ b/docs/src/pages/components/selects/ControlledOpenSelect.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; -import Button from '@material-ui/core/Button'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; +import Button from '@mui/material/Button'; export default function ControlledOpenSelect() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/ControlledOpenSelect.tsx b/docs/src/pages/components/selects/ControlledOpenSelect.tsx index 5f3ca7fa63e857..82ed200bd00093 100644 --- a/docs/src/pages/components/selects/ControlledOpenSelect.tsx +++ b/docs/src/pages/components/selects/ControlledOpenSelect.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; -import Button from '@material-ui/core/Button'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import Button from '@mui/material/Button'; export default function ControlledOpenSelect() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/CustomizedSelects.js b/docs/src/pages/components/selects/CustomizedSelects.js index 1ae76f3169e029..bb14bfb5ac7d05 100644 --- a/docs/src/pages/components/selects/CustomizedSelects.js +++ b/docs/src/pages/components/selects/CustomizedSelects.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; -import NativeSelect from '@material-ui/core/NativeSelect'; -import InputBase from '@material-ui/core/InputBase'; +import { styled } from '@mui/material/styles'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; +import NativeSelect from '@mui/material/NativeSelect'; +import InputBase from '@mui/material/InputBase'; const BootstrapInput = styled(InputBase)(({ theme }) => ({ 'label + &': { diff --git a/docs/src/pages/components/selects/CustomizedSelects.tsx b/docs/src/pages/components/selects/CustomizedSelects.tsx index ef560d1a85564b..bbcaee3cfed9a6 100644 --- a/docs/src/pages/components/selects/CustomizedSelects.tsx +++ b/docs/src/pages/components/selects/CustomizedSelects.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; -import NativeSelect from '@material-ui/core/NativeSelect'; -import InputBase from '@material-ui/core/InputBase'; +import { styled } from '@mui/material/styles'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; +import NativeSelect from '@mui/material/NativeSelect'; +import InputBase from '@mui/material/InputBase'; const BootstrapInput = styled(InputBase)(({ theme }) => ({ 'label + &': { diff --git a/docs/src/pages/components/selects/DialogSelect.js b/docs/src/pages/components/selects/DialogSelect.js index 83d6f1a21da0f5..9501def5e2eb9c 100644 --- a/docs/src/pages/components/selects/DialogSelect.js +++ b/docs/src/pages/components/selects/DialogSelect.js @@ -1,15 +1,15 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import InputLabel from '@material-ui/core/InputLabel'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogTitle from '@mui/material/DialogTitle'; +import InputLabel from '@mui/material/InputLabel'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function DialogSelect() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/selects/DialogSelect.tsx b/docs/src/pages/components/selects/DialogSelect.tsx index c92e410561b051..8f333708e51173 100644 --- a/docs/src/pages/components/selects/DialogSelect.tsx +++ b/docs/src/pages/components/selects/DialogSelect.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Dialog from '@material-ui/core/Dialog'; -import DialogActions from '@material-ui/core/DialogActions'; -import DialogContent from '@material-ui/core/DialogContent'; -import DialogTitle from '@material-ui/core/DialogTitle'; -import InputLabel from '@material-ui/core/InputLabel'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogTitle from '@mui/material/DialogTitle'; +import InputLabel from '@mui/material/InputLabel'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function DialogSelect() { const [open, setOpen] = React.useState(false); diff --git a/docs/src/pages/components/selects/GroupedSelect.js b/docs/src/pages/components/selects/GroupedSelect.js index f8ad64181432fa..1ab37e5eb16c53 100644 --- a/docs/src/pages/components/selects/GroupedSelect.js +++ b/docs/src/pages/components/selects/GroupedSelect.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import ListSubheader from '@mui/material/ListSubheader'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function GroupedSelect() { return ( diff --git a/docs/src/pages/components/selects/GroupedSelect.tsx b/docs/src/pages/components/selects/GroupedSelect.tsx index f8ad64181432fa..1ab37e5eb16c53 100644 --- a/docs/src/pages/components/selects/GroupedSelect.tsx +++ b/docs/src/pages/components/selects/GroupedSelect.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import ListSubheader from '@material-ui/core/ListSubheader'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import ListSubheader from '@mui/material/ListSubheader'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function GroupedSelect() { return ( diff --git a/docs/src/pages/components/selects/MultipleSelect.js b/docs/src/pages/components/selects/MultipleSelect.js index 86deb8a6d7d21d..04a330107a272a 100644 --- a/docs/src/pages/components/selects/MultipleSelect.js +++ b/docs/src/pages/components/selects/MultipleSelect.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import { useTheme } from '@mui/material/styles'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelect.tsx b/docs/src/pages/components/selects/MultipleSelect.tsx index 8eb9c988fbf261..dfbbfdca402686 100644 --- a/docs/src/pages/components/selects/MultipleSelect.tsx +++ b/docs/src/pages/components/selects/MultipleSelect.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { Theme, useTheme } from '@material-ui/core/styles'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import { Theme, useTheme } from '@mui/material/styles'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectCheckmarks.js b/docs/src/pages/components/selects/MultipleSelectCheckmarks.js index c913bcb7c63c46..c0201539d518bf 100644 --- a/docs/src/pages/components/selects/MultipleSelectCheckmarks.js +++ b/docs/src/pages/components/selects/MultipleSelectCheckmarks.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import ListItemText from '@material-ui/core/ListItemText'; -import Select from '@material-ui/core/Select'; -import Checkbox from '@material-ui/core/Checkbox'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import ListItemText from '@mui/material/ListItemText'; +import Select from '@mui/material/Select'; +import Checkbox from '@mui/material/Checkbox'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectCheckmarks.tsx b/docs/src/pages/components/selects/MultipleSelectCheckmarks.tsx index 20a4f38e2d23e4..9a9cfe12158493 100644 --- a/docs/src/pages/components/selects/MultipleSelectCheckmarks.tsx +++ b/docs/src/pages/components/selects/MultipleSelectCheckmarks.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import ListItemText from '@material-ui/core/ListItemText'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; -import Checkbox from '@material-ui/core/Checkbox'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import ListItemText from '@mui/material/ListItemText'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import Checkbox from '@mui/material/Checkbox'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectChip.js b/docs/src/pages/components/selects/MultipleSelectChip.js index 2b87e4623401c0..f38512bf880e33 100644 --- a/docs/src/pages/components/selects/MultipleSelectChip.js +++ b/docs/src/pages/components/selects/MultipleSelectChip.js @@ -1,12 +1,12 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; -import Chip from '@material-ui/core/Chip'; +import { useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; +import Chip from '@mui/material/Chip'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectChip.tsx b/docs/src/pages/components/selects/MultipleSelectChip.tsx index ecfc7e862f326f..f1e3ef2c652aa9 100644 --- a/docs/src/pages/components/selects/MultipleSelectChip.tsx +++ b/docs/src/pages/components/selects/MultipleSelectChip.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import { Theme, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; -import Chip from '@material-ui/core/Chip'; +import { Theme, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import Chip from '@mui/material/Chip'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectNative.js b/docs/src/pages/components/selects/MultipleSelectNative.js index ed26811946a18b..8adf5573575384 100644 --- a/docs/src/pages/components/selects/MultipleSelectNative.js +++ b/docs/src/pages/components/selects/MultipleSelectNative.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; const names = [ 'Oliver Hansen', diff --git a/docs/src/pages/components/selects/MultipleSelectNative.tsx b/docs/src/pages/components/selects/MultipleSelectNative.tsx index e012e354bfb0c7..3f18c7d3fa71a3 100644 --- a/docs/src/pages/components/selects/MultipleSelectNative.tsx +++ b/docs/src/pages/components/selects/MultipleSelectNative.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; const names = [ 'Oliver Hansen', diff --git a/docs/src/pages/components/selects/MultipleSelectPlaceholder.js b/docs/src/pages/components/selects/MultipleSelectPlaceholder.js index 55da59160046fc..f69519b3aa8f06 100644 --- a/docs/src/pages/components/selects/MultipleSelectPlaceholder.js +++ b/docs/src/pages/components/selects/MultipleSelectPlaceholder.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import { useTheme } from '@mui/material/styles'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/MultipleSelectPlaceholder.tsx b/docs/src/pages/components/selects/MultipleSelectPlaceholder.tsx index 2a7dab518a11d6..cb66fb7ef6e0c2 100644 --- a/docs/src/pages/components/selects/MultipleSelectPlaceholder.tsx +++ b/docs/src/pages/components/selects/MultipleSelectPlaceholder.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { Theme, useTheme } from '@material-ui/core/styles'; -import OutlinedInput from '@material-ui/core/OutlinedInput'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import { Theme, useTheme } from '@mui/material/styles'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; diff --git a/docs/src/pages/components/selects/NativeSelect.js b/docs/src/pages/components/selects/NativeSelect.js index b42b8af3595711..02572277cffe28 100644 --- a/docs/src/pages/components/selects/NativeSelect.js +++ b/docs/src/pages/components/selects/NativeSelect.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import InputLabel from '@material-ui/core/InputLabel'; -import FormControl from '@material-ui/core/FormControl'; -import NativeSelect from '@material-ui/core/NativeSelect'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import FormControl from '@mui/material/FormControl'; +import NativeSelect from '@mui/material/NativeSelect'; export default function NativeSelectDemo() { return ( diff --git a/docs/src/pages/components/selects/NativeSelect.tsx b/docs/src/pages/components/selects/NativeSelect.tsx index b42b8af3595711..02572277cffe28 100644 --- a/docs/src/pages/components/selects/NativeSelect.tsx +++ b/docs/src/pages/components/selects/NativeSelect.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import InputLabel from '@material-ui/core/InputLabel'; -import FormControl from '@material-ui/core/FormControl'; -import NativeSelect from '@material-ui/core/NativeSelect'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import FormControl from '@mui/material/FormControl'; +import NativeSelect from '@mui/material/NativeSelect'; export default function NativeSelectDemo() { return ( diff --git a/docs/src/pages/components/selects/SelectAutoWidth.js b/docs/src/pages/components/selects/SelectAutoWidth.js index 30369091635ae8..e47d0de7d21b6c 100644 --- a/docs/src/pages/components/selects/SelectAutoWidth.js +++ b/docs/src/pages/components/selects/SelectAutoWidth.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function SelectAutoWidth() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectAutoWidth.tsx b/docs/src/pages/components/selects/SelectAutoWidth.tsx index 24fd5c40d7e301..c8688083fd33f9 100644 --- a/docs/src/pages/components/selects/SelectAutoWidth.tsx +++ b/docs/src/pages/components/selects/SelectAutoWidth.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function SelectAutoWidth() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectLabels.js b/docs/src/pages/components/selects/SelectLabels.js index a0fce4f021cbcb..8aeb6eadc98ea7 100644 --- a/docs/src/pages/components/selects/SelectLabels.js +++ b/docs/src/pages/components/selects/SelectLabels.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function SelectLabels() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectLabels.tsx b/docs/src/pages/components/selects/SelectLabels.tsx index c386b1b41e1485..0083516ee4f367 100644 --- a/docs/src/pages/components/selects/SelectLabels.tsx +++ b/docs/src/pages/components/selects/SelectLabels.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function SelectLabels() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectOtherProps.js b/docs/src/pages/components/selects/SelectOtherProps.js index 567a5f7e3d383c..ce504047f1b3e6 100644 --- a/docs/src/pages/components/selects/SelectOtherProps.js +++ b/docs/src/pages/components/selects/SelectOtherProps.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function SelectOtherProps() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectOtherProps.tsx b/docs/src/pages/components/selects/SelectOtherProps.tsx index 946b54ac9ed2fb..38720f7494f56b 100644 --- a/docs/src/pages/components/selects/SelectOtherProps.tsx +++ b/docs/src/pages/components/selects/SelectOtherProps.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormHelperText from '@material-ui/core/FormHelperText'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormHelperText from '@mui/material/FormHelperText'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function SelectOtherProps() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectVariants.js b/docs/src/pages/components/selects/SelectVariants.js index a23eaa19aa4a78..fefade122cdf16 100644 --- a/docs/src/pages/components/selects/SelectVariants.js +++ b/docs/src/pages/components/selects/SelectVariants.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export default function SelectVariants() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/selects/SelectVariants.tsx b/docs/src/pages/components/selects/SelectVariants.tsx index 0b8fdb7e66b47a..7bb2bd8aadea01 100644 --- a/docs/src/pages/components/selects/SelectVariants.tsx +++ b/docs/src/pages/components/selects/SelectVariants.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import InputLabel from '@material-ui/core/InputLabel'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import Select, { SelectChangeEvent } from '@material-ui/core/Select'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; export default function SelectVariants() { const [age, setAge] = React.useState(''); diff --git a/docs/src/pages/components/skeleton/Animations.js b/docs/src/pages/components/skeleton/Animations.js index d335d497d4a6fc..0e09de7f613892 100644 --- a/docs/src/pages/components/skeleton/Animations.js +++ b/docs/src/pages/components/skeleton/Animations.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Skeleton from '@material-ui/core/Skeleton'; +import Box from '@mui/material/Box'; +import Skeleton from '@mui/material/Skeleton'; export default function Animations() { return ( diff --git a/docs/src/pages/components/skeleton/Animations.tsx b/docs/src/pages/components/skeleton/Animations.tsx index d335d497d4a6fc..0e09de7f613892 100644 --- a/docs/src/pages/components/skeleton/Animations.tsx +++ b/docs/src/pages/components/skeleton/Animations.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Skeleton from '@material-ui/core/Skeleton'; +import Box from '@mui/material/Box'; +import Skeleton from '@mui/material/Skeleton'; export default function Animations() { return ( diff --git a/docs/src/pages/components/skeleton/Facebook.js b/docs/src/pages/components/skeleton/Facebook.js index f8186c17781b10..eca186ecb4465d 100644 --- a/docs/src/pages/components/skeleton/Facebook.js +++ b/docs/src/pages/components/skeleton/Facebook.js @@ -1,14 +1,14 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Card from '@material-ui/core/Card'; -import CardHeader from '@material-ui/core/CardHeader'; -import CardContent from '@material-ui/core/CardContent'; -import CardMedia from '@material-ui/core/CardMedia'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; -import Skeleton from '@material-ui/core/Skeleton'; +import Card from '@mui/material/Card'; +import CardHeader from '@mui/material/CardHeader'; +import CardContent from '@mui/material/CardContent'; +import CardMedia from '@mui/material/CardMedia'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; +import Skeleton from '@mui/material/Skeleton'; function Media(props) { const { loading = false } = props; diff --git a/docs/src/pages/components/skeleton/Facebook.tsx b/docs/src/pages/components/skeleton/Facebook.tsx index 83c32846ac1de6..c575410f1f8058 100644 --- a/docs/src/pages/components/skeleton/Facebook.tsx +++ b/docs/src/pages/components/skeleton/Facebook.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; -import Card from '@material-ui/core/Card'; -import CardHeader from '@material-ui/core/CardHeader'; -import CardContent from '@material-ui/core/CardContent'; -import CardMedia from '@material-ui/core/CardMedia'; -import Avatar from '@material-ui/core/Avatar'; -import Typography from '@material-ui/core/Typography'; -import IconButton from '@material-ui/core/IconButton'; -import MoreVertIcon from '@material-ui/icons/MoreVert'; -import Skeleton from '@material-ui/core/Skeleton'; +import Card from '@mui/material/Card'; +import CardHeader from '@mui/material/CardHeader'; +import CardContent from '@mui/material/CardContent'; +import CardMedia from '@mui/material/CardMedia'; +import Avatar from '@mui/material/Avatar'; +import Typography from '@mui/material/Typography'; +import IconButton from '@mui/material/IconButton'; +import MoreVertIcon from '@mui/icons-material/MoreVert'; +import Skeleton from '@mui/material/Skeleton'; interface MediaProps { loading?: boolean; diff --git a/docs/src/pages/components/skeleton/SkeletonChildren.js b/docs/src/pages/components/skeleton/SkeletonChildren.js index 5aa60edfe835fe..dea54ea2feb889 100644 --- a/docs/src/pages/components/skeleton/SkeletonChildren.js +++ b/docs/src/pages/components/skeleton/SkeletonChildren.js @@ -1,11 +1,11 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Avatar from '@material-ui/core/Avatar'; -import Grid from '@material-ui/core/Grid'; -import Skeleton from '@material-ui/core/Skeleton'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Avatar from '@mui/material/Avatar'; +import Grid from '@mui/material/Grid'; +import Skeleton from '@mui/material/Skeleton'; const Image = styled('img')({ width: '100%', diff --git a/docs/src/pages/components/skeleton/SkeletonChildren.tsx b/docs/src/pages/components/skeleton/SkeletonChildren.tsx index b29d4d0d001694..bf27ebb7fad364 100644 --- a/docs/src/pages/components/skeleton/SkeletonChildren.tsx +++ b/docs/src/pages/components/skeleton/SkeletonChildren.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Avatar from '@material-ui/core/Avatar'; -import Grid from '@material-ui/core/Grid'; -import Skeleton from '@material-ui/core/Skeleton'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Avatar from '@mui/material/Avatar'; +import Grid from '@mui/material/Grid'; +import Skeleton from '@mui/material/Skeleton'; const Image = styled('img')({ width: '100%', diff --git a/docs/src/pages/components/skeleton/SkeletonColor.js b/docs/src/pages/components/skeleton/SkeletonColor.js index 238cdd04dd5ef7..ddad47d6302af8 100644 --- a/docs/src/pages/components/skeleton/SkeletonColor.js +++ b/docs/src/pages/components/skeleton/SkeletonColor.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Skeleton from '@material-ui/core/Skeleton'; -import Box from '@material-ui/core/Box'; +import Skeleton from '@mui/material/Skeleton'; +import Box from '@mui/material/Box'; export default function SkeletonColor() { return ( diff --git a/docs/src/pages/components/skeleton/SkeletonColor.tsx b/docs/src/pages/components/skeleton/SkeletonColor.tsx index 238cdd04dd5ef7..ddad47d6302af8 100644 --- a/docs/src/pages/components/skeleton/SkeletonColor.tsx +++ b/docs/src/pages/components/skeleton/SkeletonColor.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Skeleton from '@material-ui/core/Skeleton'; -import Box from '@material-ui/core/Box'; +import Skeleton from '@mui/material/Skeleton'; +import Box from '@mui/material/Box'; export default function SkeletonColor() { return ( diff --git a/docs/src/pages/components/skeleton/SkeletonTypography.js b/docs/src/pages/components/skeleton/SkeletonTypography.js index 169348993ce848..a45cb28ef8f1fa 100644 --- a/docs/src/pages/components/skeleton/SkeletonTypography.js +++ b/docs/src/pages/components/skeleton/SkeletonTypography.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Typography from '@material-ui/core/Typography'; -import Skeleton from '@material-ui/core/Skeleton'; -import Grid from '@material-ui/core/Grid'; +import Typography from '@mui/material/Typography'; +import Skeleton from '@mui/material/Skeleton'; +import Grid from '@mui/material/Grid'; const variants = ['h1', 'h3', 'body1', 'caption']; diff --git a/docs/src/pages/components/skeleton/SkeletonTypography.tsx b/docs/src/pages/components/skeleton/SkeletonTypography.tsx index 27e3884096a96a..6860968bf452ef 100644 --- a/docs/src/pages/components/skeleton/SkeletonTypography.tsx +++ b/docs/src/pages/components/skeleton/SkeletonTypography.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Typography, { TypographyProps } from '@material-ui/core/Typography'; -import Skeleton from '@material-ui/core/Skeleton'; -import Grid from '@material-ui/core/Grid'; +import Typography, { TypographyProps } from '@mui/material/Typography'; +import Skeleton from '@mui/material/Skeleton'; +import Grid from '@mui/material/Grid'; const variants = [ 'h1', diff --git a/docs/src/pages/components/skeleton/Variants.js b/docs/src/pages/components/skeleton/Variants.js index 6b18742ef838bb..c5017808b55e29 100644 --- a/docs/src/pages/components/skeleton/Variants.js +++ b/docs/src/pages/components/skeleton/Variants.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Skeleton from '@material-ui/core/Skeleton'; -import Stack from '@material-ui/core/Stack'; +import Skeleton from '@mui/material/Skeleton'; +import Stack from '@mui/material/Stack'; export default function Variants() { return ( diff --git a/docs/src/pages/components/skeleton/Variants.tsx b/docs/src/pages/components/skeleton/Variants.tsx index 6b18742ef838bb..c5017808b55e29 100644 --- a/docs/src/pages/components/skeleton/Variants.tsx +++ b/docs/src/pages/components/skeleton/Variants.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Skeleton from '@material-ui/core/Skeleton'; -import Stack from '@material-ui/core/Stack'; +import Skeleton from '@mui/material/Skeleton'; +import Stack from '@mui/material/Stack'; export default function Variants() { return ( diff --git a/docs/src/pages/components/skeleton/YouTube.js b/docs/src/pages/components/skeleton/YouTube.js index 1dfb4ebe04b1db..95e23cc9a018c5 100644 --- a/docs/src/pages/components/skeleton/YouTube.js +++ b/docs/src/pages/components/skeleton/YouTube.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Grid from '@material-ui/core/Grid'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Skeleton from '@material-ui/core/Skeleton'; +import Grid from '@mui/material/Grid'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Skeleton from '@mui/material/Skeleton'; const data = [ { diff --git a/docs/src/pages/components/skeleton/YouTube.tsx b/docs/src/pages/components/skeleton/YouTube.tsx index 24593a988083eb..d14f4bfc717d53 100644 --- a/docs/src/pages/components/skeleton/YouTube.tsx +++ b/docs/src/pages/components/skeleton/YouTube.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Grid from '@material-ui/core/Grid'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Skeleton from '@material-ui/core/Skeleton'; +import Grid from '@mui/material/Grid'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Skeleton from '@mui/material/Skeleton'; const data = [ { diff --git a/docs/src/pages/components/slider/ColorSlider.js b/docs/src/pages/components/slider/ColorSlider.js index 3e69ec3226a4ea..b6b3376cda7469 100644 --- a/docs/src/pages/components/slider/ColorSlider.js +++ b/docs/src/pages/components/slider/ColorSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/ColorSlider.tsx b/docs/src/pages/components/slider/ColorSlider.tsx index b0c617e979affa..3adfb6e9b15f55 100644 --- a/docs/src/pages/components/slider/ColorSlider.tsx +++ b/docs/src/pages/components/slider/ColorSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/ContinuousSlider.js b/docs/src/pages/components/slider/ContinuousSlider.js index be4472655e1cbd..60dceffb58cbc4 100644 --- a/docs/src/pages/components/slider/ContinuousSlider.js +++ b/docs/src/pages/components/slider/ContinuousSlider.js @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import Slider from '@material-ui/core/Slider'; -import VolumeDown from '@material-ui/icons/VolumeDown'; -import VolumeUp from '@material-ui/icons/VolumeUp'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import Slider from '@mui/material/Slider'; +import VolumeDown from '@mui/icons-material/VolumeDown'; +import VolumeUp from '@mui/icons-material/VolumeUp'; export default function ContinuousSlider() { const [value, setValue] = React.useState(30); diff --git a/docs/src/pages/components/slider/ContinuousSlider.tsx b/docs/src/pages/components/slider/ContinuousSlider.tsx index 41a77bf8887d12..e32954ec62e5ed 100644 --- a/docs/src/pages/components/slider/ContinuousSlider.tsx +++ b/docs/src/pages/components/slider/ContinuousSlider.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Stack from '@material-ui/core/Stack'; -import Slider from '@material-ui/core/Slider'; -import VolumeDown from '@material-ui/icons/VolumeDown'; -import VolumeUp from '@material-ui/icons/VolumeUp'; +import Box from '@mui/material/Box'; +import Stack from '@mui/material/Stack'; +import Slider from '@mui/material/Slider'; +import VolumeDown from '@mui/icons-material/VolumeDown'; +import VolumeUp from '@mui/icons-material/VolumeUp'; export default function ContinuousSlider() { const [value, setValue] = React.useState(30); diff --git a/docs/src/pages/components/slider/CustomizedSlider.js b/docs/src/pages/components/slider/CustomizedSlider.js index 51041f0703ffca..ce87bd6d16b5cb 100644 --- a/docs/src/pages/components/slider/CustomizedSlider.js +++ b/docs/src/pages/components/slider/CustomizedSlider.js @@ -1,10 +1,10 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Slider, { SliderThumb } from '@material-ui/core/Slider'; -import { styled } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import Box from '@material-ui/core/Box'; +import Slider, { SliderThumb } from '@mui/material/Slider'; +import { styled } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import Box from '@mui/material/Box'; function ValueLabelComponent(props) { const { children, value } = props; diff --git a/docs/src/pages/components/slider/CustomizedSlider.tsx b/docs/src/pages/components/slider/CustomizedSlider.tsx index fad370aaaf9239..63930868a415dd 100644 --- a/docs/src/pages/components/slider/CustomizedSlider.tsx +++ b/docs/src/pages/components/slider/CustomizedSlider.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import Slider, { SliderThumb } from '@material-ui/core/Slider'; -import { styled } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; -import Tooltip from '@material-ui/core/Tooltip'; -import Box from '@material-ui/core/Box'; +import Slider, { SliderThumb } from '@mui/material/Slider'; +import { styled } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; +import Tooltip from '@mui/material/Tooltip'; +import Box from '@mui/material/Box'; interface Props { children: React.ReactElement; diff --git a/docs/src/pages/components/slider/DiscreteSlider.js b/docs/src/pages/components/slider/DiscreteSlider.js index 8870f26b7a2124..d5345cede101b5 100644 --- a/docs/src/pages/components/slider/DiscreteSlider.js +++ b/docs/src/pages/components/slider/DiscreteSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/DiscreteSlider.tsx b/docs/src/pages/components/slider/DiscreteSlider.tsx index 252559b6a6c16f..97e60b7427fce4 100644 --- a/docs/src/pages/components/slider/DiscreteSlider.tsx +++ b/docs/src/pages/components/slider/DiscreteSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/DiscreteSliderLabel.js b/docs/src/pages/components/slider/DiscreteSliderLabel.js index a66f71511897fe..17ab886aa2a84f 100644 --- a/docs/src/pages/components/slider/DiscreteSliderLabel.js +++ b/docs/src/pages/components/slider/DiscreteSliderLabel.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/DiscreteSliderLabel.tsx b/docs/src/pages/components/slider/DiscreteSliderLabel.tsx index 9824685cecc1a5..39d9544f664689 100644 --- a/docs/src/pages/components/slider/DiscreteSliderLabel.tsx +++ b/docs/src/pages/components/slider/DiscreteSliderLabel.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/DiscreteSliderMarks.js b/docs/src/pages/components/slider/DiscreteSliderMarks.js index f555b372bea57a..d6916b2293867f 100644 --- a/docs/src/pages/components/slider/DiscreteSliderMarks.js +++ b/docs/src/pages/components/slider/DiscreteSliderMarks.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/DiscreteSliderMarks.tsx b/docs/src/pages/components/slider/DiscreteSliderMarks.tsx index cd11384c7da728..a18fc5eedb1aec 100644 --- a/docs/src/pages/components/slider/DiscreteSliderMarks.tsx +++ b/docs/src/pages/components/slider/DiscreteSliderMarks.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/DiscreteSliderSteps.js b/docs/src/pages/components/slider/DiscreteSliderSteps.js index 0b461cc8940e7f..e633aafa1f50b7 100644 --- a/docs/src/pages/components/slider/DiscreteSliderSteps.js +++ b/docs/src/pages/components/slider/DiscreteSliderSteps.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/DiscreteSliderSteps.tsx b/docs/src/pages/components/slider/DiscreteSliderSteps.tsx index fc269e157f491e..862cf69ac3f04d 100644 --- a/docs/src/pages/components/slider/DiscreteSliderSteps.tsx +++ b/docs/src/pages/components/slider/DiscreteSliderSteps.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/DiscreteSliderValues.js b/docs/src/pages/components/slider/DiscreteSliderValues.js index 477bf98d916e68..7a801e3ad05619 100644 --- a/docs/src/pages/components/slider/DiscreteSliderValues.js +++ b/docs/src/pages/components/slider/DiscreteSliderValues.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/DiscreteSliderValues.tsx b/docs/src/pages/components/slider/DiscreteSliderValues.tsx index 9fe080d55b996e..2b0b869d446d8c 100644 --- a/docs/src/pages/components/slider/DiscreteSliderValues.tsx +++ b/docs/src/pages/components/slider/DiscreteSliderValues.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; const marks = [ { diff --git a/docs/src/pages/components/slider/InputSlider.js b/docs/src/pages/components/slider/InputSlider.js index a25ac965bcb556..fb396a1ee8440d 100644 --- a/docs/src/pages/components/slider/InputSlider.js +++ b/docs/src/pages/components/slider/InputSlider.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; -import MuiInput from '@material-ui/core/Input'; -import VolumeUp from '@material-ui/icons/VolumeUp'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; +import MuiInput from '@mui/material/Input'; +import VolumeUp from '@mui/icons-material/VolumeUp'; const Input = styled(MuiInput)` width: 42px; diff --git a/docs/src/pages/components/slider/InputSlider.tsx b/docs/src/pages/components/slider/InputSlider.tsx index d1e10e9637407f..a132563649b019 100644 --- a/docs/src/pages/components/slider/InputSlider.tsx +++ b/docs/src/pages/components/slider/InputSlider.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; -import MuiInput from '@material-ui/core/Input'; -import VolumeUp from '@material-ui/icons/VolumeUp'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; +import MuiInput from '@mui/material/Input'; +import VolumeUp from '@mui/icons-material/VolumeUp'; const Input = styled(MuiInput)` width: 42px; diff --git a/docs/src/pages/components/slider/MinimumDistanceSlider.js b/docs/src/pages/components/slider/MinimumDistanceSlider.js index af2189893e3217..96638140e8b987 100644 --- a/docs/src/pages/components/slider/MinimumDistanceSlider.js +++ b/docs/src/pages/components/slider/MinimumDistanceSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/MinimumDistanceSlider.tsx b/docs/src/pages/components/slider/MinimumDistanceSlider.tsx index be25a9a2415b16..b67af7f014335e 100644 --- a/docs/src/pages/components/slider/MinimumDistanceSlider.tsx +++ b/docs/src/pages/components/slider/MinimumDistanceSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/MusicPlayerSlider.js b/docs/src/pages/components/slider/MusicPlayerSlider.js index 8c8b48e9c7a70c..c209f61bebfac5 100644 --- a/docs/src/pages/components/slider/MusicPlayerSlider.js +++ b/docs/src/pages/components/slider/MusicPlayerSlider.js @@ -1,16 +1,16 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; -import IconButton from '@material-ui/core/IconButton'; -import Stack from '@material-ui/core/Stack'; -import PauseRounded from '@material-ui/icons/PauseRounded'; -import PlayArrowRounded from '@material-ui/icons/PlayArrowRounded'; -import FastForwardRounded from '@material-ui/icons/FastForwardRounded'; -import FastRewindRounded from '@material-ui/icons/FastRewindRounded'; -import VolumeUpRounded from '@material-ui/icons/VolumeUpRounded'; -import VolumeDownRounded from '@material-ui/icons/VolumeDownRounded'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; +import IconButton from '@mui/material/IconButton'; +import Stack from '@mui/material/Stack'; +import PauseRounded from '@mui/icons-material/PauseRounded'; +import PlayArrowRounded from '@mui/icons-material/PlayArrowRounded'; +import FastForwardRounded from '@mui/icons-material/FastForwardRounded'; +import FastRewindRounded from '@mui/icons-material/FastRewindRounded'; +import VolumeUpRounded from '@mui/icons-material/VolumeUpRounded'; +import VolumeDownRounded from '@mui/icons-material/VolumeDownRounded'; const WallPaper = styled('div')({ position: 'absolute', diff --git a/docs/src/pages/components/slider/MusicPlayerSlider.tsx b/docs/src/pages/components/slider/MusicPlayerSlider.tsx index 4d8bccb0032430..2749425badb84a 100644 --- a/docs/src/pages/components/slider/MusicPlayerSlider.tsx +++ b/docs/src/pages/components/slider/MusicPlayerSlider.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import { styled, useTheme } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; -import IconButton from '@material-ui/core/IconButton'; -import Stack from '@material-ui/core/Stack'; -import PauseRounded from '@material-ui/icons/PauseRounded'; -import PlayArrowRounded from '@material-ui/icons/PlayArrowRounded'; -import FastForwardRounded from '@material-ui/icons/FastForwardRounded'; -import FastRewindRounded from '@material-ui/icons/FastRewindRounded'; -import VolumeUpRounded from '@material-ui/icons/VolumeUpRounded'; -import VolumeDownRounded from '@material-ui/icons/VolumeDownRounded'; +import { styled, useTheme } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; +import IconButton from '@mui/material/IconButton'; +import Stack from '@mui/material/Stack'; +import PauseRounded from '@mui/icons-material/PauseRounded'; +import PlayArrowRounded from '@mui/icons-material/PlayArrowRounded'; +import FastForwardRounded from '@mui/icons-material/FastForwardRounded'; +import FastRewindRounded from '@mui/icons-material/FastRewindRounded'; +import VolumeUpRounded from '@mui/icons-material/VolumeUpRounded'; +import VolumeDownRounded from '@mui/icons-material/VolumeDownRounded'; const WallPaper = styled('div')({ position: 'absolute', diff --git a/docs/src/pages/components/slider/NonLinearSlider.js b/docs/src/pages/components/slider/NonLinearSlider.js index a8a8b9adfb8cc9..0ecf4f3cf14caa 100644 --- a/docs/src/pages/components/slider/NonLinearSlider.js +++ b/docs/src/pages/components/slider/NonLinearSlider.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; function valueLabelFormat(value) { const units = ['KB', 'MB', 'GB', 'TB']; diff --git a/docs/src/pages/components/slider/NonLinearSlider.tsx b/docs/src/pages/components/slider/NonLinearSlider.tsx index 7ab8615b7ef475..d2bacafef8046b 100644 --- a/docs/src/pages/components/slider/NonLinearSlider.tsx +++ b/docs/src/pages/components/slider/NonLinearSlider.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; function valueLabelFormat(value: number) { const units = ['KB', 'MB', 'GB', 'TB']; diff --git a/docs/src/pages/components/slider/RangeSlider.js b/docs/src/pages/components/slider/RangeSlider.js index b2fc309424f77c..3b80e96778bdbb 100644 --- a/docs/src/pages/components/slider/RangeSlider.js +++ b/docs/src/pages/components/slider/RangeSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/RangeSlider.tsx b/docs/src/pages/components/slider/RangeSlider.tsx index c3ed6ef4c892e1..b26df35d027fbf 100644 --- a/docs/src/pages/components/slider/RangeSlider.tsx +++ b/docs/src/pages/components/slider/RangeSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/SliderSizes.js b/docs/src/pages/components/slider/SliderSizes.js index 0a4c44552b42e4..ceb4427b15efb9 100644 --- a/docs/src/pages/components/slider/SliderSizes.js +++ b/docs/src/pages/components/slider/SliderSizes.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; export default function SliderSizes() { return ( diff --git a/docs/src/pages/components/slider/SliderSizes.tsx b/docs/src/pages/components/slider/SliderSizes.tsx index 0a4c44552b42e4..ceb4427b15efb9 100644 --- a/docs/src/pages/components/slider/SliderSizes.tsx +++ b/docs/src/pages/components/slider/SliderSizes.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; export default function SliderSizes() { return ( diff --git a/docs/src/pages/components/slider/TrackFalseSlider.js b/docs/src/pages/components/slider/TrackFalseSlider.js index ac7c4636395c92..7dd7ed26ddc947 100644 --- a/docs/src/pages/components/slider/TrackFalseSlider.js +++ b/docs/src/pages/components/slider/TrackFalseSlider.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; const Separator = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/TrackFalseSlider.tsx b/docs/src/pages/components/slider/TrackFalseSlider.tsx index f97babf5cfe7df..27a436bb46f707 100644 --- a/docs/src/pages/components/slider/TrackFalseSlider.tsx +++ b/docs/src/pages/components/slider/TrackFalseSlider.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; const Separator = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/TrackInvertedSlider.js b/docs/src/pages/components/slider/TrackInvertedSlider.js index 2bc78008b8b22a..80f427cd99463e 100644 --- a/docs/src/pages/components/slider/TrackInvertedSlider.js +++ b/docs/src/pages/components/slider/TrackInvertedSlider.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; const Separator = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/TrackInvertedSlider.tsx b/docs/src/pages/components/slider/TrackInvertedSlider.tsx index e8a88c58559af9..507b1a3117b43f 100644 --- a/docs/src/pages/components/slider/TrackInvertedSlider.tsx +++ b/docs/src/pages/components/slider/TrackInvertedSlider.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Slider from '@material-ui/core/Slider'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Slider from '@mui/material/Slider'; const Separator = styled('div')( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/UnstyledSlider.js b/docs/src/pages/components/slider/UnstyledSlider.js index cf9e1f4e6a3309..40085b88f62245 100644 --- a/docs/src/pages/components/slider/UnstyledSlider.js +++ b/docs/src/pages/components/slider/UnstyledSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, alpha, Box } from '@material-ui/system'; -import SliderUnstyled from '@material-ui/unstyled/SliderUnstyled'; +import { styled, alpha, Box } from '@mui/system'; +import SliderUnstyled from '@mui/core/SliderUnstyled'; const StyledSlider = styled(SliderUnstyled)( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/UnstyledSlider.tsx b/docs/src/pages/components/slider/UnstyledSlider.tsx index cf9e1f4e6a3309..40085b88f62245 100644 --- a/docs/src/pages/components/slider/UnstyledSlider.tsx +++ b/docs/src/pages/components/slider/UnstyledSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled, alpha, Box } from '@material-ui/system'; -import SliderUnstyled from '@material-ui/unstyled/SliderUnstyled'; +import { styled, alpha, Box } from '@mui/system'; +import SliderUnstyled from '@mui/core/SliderUnstyled'; const StyledSlider = styled(SliderUnstyled)( ({ theme }) => ` diff --git a/docs/src/pages/components/slider/VerticalAccessibleSlider.js b/docs/src/pages/components/slider/VerticalAccessibleSlider.js index 7ed9cabe83372a..49700dbb2557e7 100644 --- a/docs/src/pages/components/slider/VerticalAccessibleSlider.js +++ b/docs/src/pages/components/slider/VerticalAccessibleSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; export default function VerticalSlider() { function preventHorizontalKeyboardNavigation(event) { diff --git a/docs/src/pages/components/slider/VerticalAccessibleSlider.tsx b/docs/src/pages/components/slider/VerticalAccessibleSlider.tsx index 89a70b9114a302..01130763723a99 100644 --- a/docs/src/pages/components/slider/VerticalAccessibleSlider.tsx +++ b/docs/src/pages/components/slider/VerticalAccessibleSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Slider from '@material-ui/core/Slider'; +import Box from '@mui/material/Box'; +import Slider from '@mui/material/Slider'; export default function VerticalSlider() { function preventHorizontalKeyboardNavigation(event: React.KeyboardEvent) { diff --git a/docs/src/pages/components/slider/VerticalSlider.js b/docs/src/pages/components/slider/VerticalSlider.js index b3090a94c39c3a..94a5e030023d28 100644 --- a/docs/src/pages/components/slider/VerticalSlider.js +++ b/docs/src/pages/components/slider/VerticalSlider.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Slider from '@material-ui/core/Slider'; +import Stack from '@mui/material/Stack'; +import Slider from '@mui/material/Slider'; function valuetext(value) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/VerticalSlider.tsx b/docs/src/pages/components/slider/VerticalSlider.tsx index f8fefff4057bd9..22c3bc8e3a3929 100644 --- a/docs/src/pages/components/slider/VerticalSlider.tsx +++ b/docs/src/pages/components/slider/VerticalSlider.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Slider from '@material-ui/core/Slider'; +import Stack from '@mui/material/Stack'; +import Slider from '@mui/material/Slider'; function valuetext(value: number) { return `${value}°C`; diff --git a/docs/src/pages/components/slider/slider.md b/docs/src/pages/components/slider/slider.md index bdf02a5a0aca78..0d8f9004b07829 100644 --- a/docs/src/pages/components/slider/slider.md +++ b/docs/src/pages/components/slider/slider.md @@ -135,13 +135,13 @@ Increasing _x_ by one increases the represented value by factor _2_. -- 📦 [5.6 kB gzipped](https://bundlephobia.com/result?p=@material-ui/unstyled@next) +- 📦 [5.6 kB gzipped](https://bundlephobia.com/result?p=@mui/core@next) The slider also comes with an unstyled version. It's ideal for doing heavy customizations and minimizing bundle size. ```js -import SliderUnstyled from '@material-ui/unstyled/SliderUnstyled'; +import SliderUnstyled from '@mui/core/SliderUnstyled'; ``` {{"demo": "pages/components/slider/UnstyledSlider.js"}} diff --git a/docs/src/pages/components/snackbars/ConsecutiveSnackbars.js b/docs/src/pages/components/snackbars/ConsecutiveSnackbars.js index 89b6c245001e29..eddd4bfdf00000 100644 --- a/docs/src/pages/components/snackbars/ConsecutiveSnackbars.js +++ b/docs/src/pages/components/snackbars/ConsecutiveSnackbars.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import IconButton from '@material-ui/core/IconButton'; -import CloseIcon from '@material-ui/icons/Close'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; export default function ConsecutiveSnackbars() { const [snackPack, setSnackPack] = React.useState([]); diff --git a/docs/src/pages/components/snackbars/ConsecutiveSnackbars.tsx b/docs/src/pages/components/snackbars/ConsecutiveSnackbars.tsx index 318825a76593f4..bb542512df59d8 100644 --- a/docs/src/pages/components/snackbars/ConsecutiveSnackbars.tsx +++ b/docs/src/pages/components/snackbars/ConsecutiveSnackbars.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import IconButton from '@material-ui/core/IconButton'; -import CloseIcon from '@material-ui/icons/Close'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; export interface SnackbarMessage { message: string; diff --git a/docs/src/pages/components/snackbars/CustomizedSnackbars.js b/docs/src/pages/components/snackbars/CustomizedSnackbars.js index d9bfb49e70842a..c4e4f4f02310c2 100644 --- a/docs/src/pages/components/snackbars/CustomizedSnackbars.js +++ b/docs/src/pages/components/snackbars/CustomizedSnackbars.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import MuiAlert from '@material-ui/core/Alert'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import MuiAlert from '@mui/material/Alert'; const Alert = React.forwardRef(function Alert(props, ref) { return ; diff --git a/docs/src/pages/components/snackbars/CustomizedSnackbars.tsx b/docs/src/pages/components/snackbars/CustomizedSnackbars.tsx index bfa8b02caefaad..fcab49c47b788c 100644 --- a/docs/src/pages/components/snackbars/CustomizedSnackbars.tsx +++ b/docs/src/pages/components/snackbars/CustomizedSnackbars.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Stack from '@material-ui/core/Stack'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import MuiAlert, { AlertProps } from '@material-ui/core/Alert'; +import Stack from '@mui/material/Stack'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import MuiAlert, { AlertProps } from '@mui/material/Alert'; const Alert = React.forwardRef(function Alert( props, diff --git a/docs/src/pages/components/snackbars/DirectionSnackbar.js b/docs/src/pages/components/snackbars/DirectionSnackbar.js index 77e5d7e5f6c92f..fb0aff35dcf1e2 100644 --- a/docs/src/pages/components/snackbars/DirectionSnackbar.js +++ b/docs/src/pages/components/snackbars/DirectionSnackbar.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import Slide from '@material-ui/core/Slide'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import Slide from '@mui/material/Slide'; function TransitionLeft(props) { return ; diff --git a/docs/src/pages/components/snackbars/DirectionSnackbar.tsx b/docs/src/pages/components/snackbars/DirectionSnackbar.tsx index 5ff8f0a8ad0261..870530d4cad255 100644 --- a/docs/src/pages/components/snackbars/DirectionSnackbar.tsx +++ b/docs/src/pages/components/snackbars/DirectionSnackbar.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Snackbar from '@material-ui/core/Snackbar'; -import Slide, { SlideProps } from '@material-ui/core/Slide'; +import Button from '@mui/material/Button'; +import Snackbar from '@mui/material/Snackbar'; +import Slide, { SlideProps } from '@mui/material/Slide'; type TransitionProps = Omit; diff --git a/docs/src/pages/components/snackbars/FabIntegrationSnackbar.js b/docs/src/pages/components/snackbars/FabIntegrationSnackbar.js index f0ceb1d302d41b..39882864f99610 100644 --- a/docs/src/pages/components/snackbars/FabIntegrationSnackbar.js +++ b/docs/src/pages/components/snackbars/FabIntegrationSnackbar.js @@ -1,15 +1,15 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import GlobalStyles from '@material-ui/core/GlobalStyles'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import Snackbar from '@material-ui/core/Snackbar'; +import AppBar from '@mui/material/AppBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import GlobalStyles from '@mui/material/GlobalStyles'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import Snackbar from '@mui/material/Snackbar'; export default function FabIntegrationSnackbar() { return ( diff --git a/docs/src/pages/components/snackbars/FabIntegrationSnackbar.tsx b/docs/src/pages/components/snackbars/FabIntegrationSnackbar.tsx index db0a2e18c9e54d..74485845b2dbca 100644 --- a/docs/src/pages/components/snackbars/FabIntegrationSnackbar.tsx +++ b/docs/src/pages/components/snackbars/FabIntegrationSnackbar.tsx @@ -1,16 +1,16 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import GlobalStyles from '@material-ui/core/GlobalStyles'; -import Toolbar from '@material-ui/core/Toolbar'; -import IconButton from '@material-ui/core/IconButton'; -import MenuIcon from '@material-ui/icons/Menu'; -import Typography from '@material-ui/core/Typography'; -import Button from '@material-ui/core/Button'; -import Fab from '@material-ui/core/Fab'; -import AddIcon from '@material-ui/icons/Add'; -import Snackbar from '@material-ui/core/Snackbar'; -import { Theme } from '@material-ui/core/styles'; +import AppBar from '@mui/material/AppBar'; +import CssBaseline from '@mui/material/CssBaseline'; +import GlobalStyles from '@mui/material/GlobalStyles'; +import Toolbar from '@mui/material/Toolbar'; +import IconButton from '@mui/material/IconButton'; +import MenuIcon from '@mui/icons-material/Menu'; +import Typography from '@mui/material/Typography'; +import Button from '@mui/material/Button'; +import Fab from '@mui/material/Fab'; +import AddIcon from '@mui/icons-material/Add'; +import Snackbar from '@mui/material/Snackbar'; +import { Theme } from '@mui/material/styles'; export default function FabIntegrationSnackbar() { return ( diff --git a/docs/src/pages/components/snackbars/IntegrationNotistack.js b/docs/src/pages/components/snackbars/IntegrationNotistack.js index 4b61cac3ceb88f..ae0c90dd2cbda3 100644 --- a/docs/src/pages/components/snackbars/IntegrationNotistack.js +++ b/docs/src/pages/components/snackbars/IntegrationNotistack.js @@ -1,5 +1,5 @@ import React from 'react'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; import { SnackbarProvider, useSnackbar } from 'notistack'; function MyApp() { diff --git a/docs/src/pages/components/snackbars/IntegrationNotistack.tsx b/docs/src/pages/components/snackbars/IntegrationNotistack.tsx index e6f3b61bd62ccb..06573c9c1f318f 100644 --- a/docs/src/pages/components/snackbars/IntegrationNotistack.tsx +++ b/docs/src/pages/components/snackbars/IntegrationNotistack.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; import { SnackbarProvider, VariantType, useSnackbar } from 'notistack'; function MyApp() { diff --git a/docs/src/pages/components/snackbars/LongTextSnackbar.js b/docs/src/pages/components/snackbars/LongTextSnackbar.js index d32c03f0bac107..cbd7c1ec88cbd5 100644 --- a/docs/src/pages/components/snackbars/LongTextSnackbar.js +++ b/docs/src/pages/components/snackbars/LongTextSnackbar.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Button from '@material-ui/core/Button'; -import Stack from '@material-ui/core/Stack'; -import SnackbarContent from '@material-ui/core/SnackbarContent'; +import Button from '@mui/material/Button'; +import Stack from '@mui/material/Stack'; +import SnackbarContent from '@mui/material/SnackbarContent'; const action = ( ; diff --git a/docs/src/pages/guides/composition/Composition.js b/docs/src/pages/guides/composition/Composition.js index f3c445bf31a21c..742963093f34f9 100644 --- a/docs/src/pages/guides/composition/Composition.js +++ b/docs/src/pages/guides/composition/Composition.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Icon from '@material-ui/core/Icon'; +import IconButton from '@mui/material/IconButton'; +import Icon from '@mui/material/Icon'; const WrappedIcon = (props) => ; diff --git a/docs/src/pages/guides/composition/Composition.tsx b/docs/src/pages/guides/composition/Composition.tsx index 535b26fa218962..ce1d0341b1809a 100644 --- a/docs/src/pages/guides/composition/Composition.tsx +++ b/docs/src/pages/guides/composition/Composition.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import IconButton from '@material-ui/core/IconButton'; -import Icon, { IconProps } from '@material-ui/core/Icon'; +import IconButton from '@mui/material/IconButton'; +import Icon, { IconProps } from '@mui/material/Icon'; const WrappedIcon = (props: IconProps) => ; WrappedIcon.muiName = 'Icon'; diff --git a/docs/src/pages/guides/interoperability/EmotionCSS.js b/docs/src/pages/guides/interoperability/EmotionCSS.js index 3d5787aae87739..8912b934f4ccd5 100644 --- a/docs/src/pages/guides/interoperability/EmotionCSS.js +++ b/docs/src/pages/guides/interoperability/EmotionCSS.js @@ -1,8 +1,8 @@ /* eslint-disable react/react-in-jsx-scope -- Unaware of jsxImportSource */ /** @jsxImportSource @emotion/react */ import { css } from '@emotion/react'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; export default function EmotionCSS() { return ( diff --git a/docs/src/pages/guides/interoperability/EmotionCSS.tsx b/docs/src/pages/guides/interoperability/EmotionCSS.tsx index 3d5787aae87739..8912b934f4ccd5 100644 --- a/docs/src/pages/guides/interoperability/EmotionCSS.tsx +++ b/docs/src/pages/guides/interoperability/EmotionCSS.tsx @@ -1,8 +1,8 @@ /* eslint-disable react/react-in-jsx-scope -- Unaware of jsxImportSource */ /** @jsxImportSource @emotion/react */ import { css } from '@emotion/react'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; export default function EmotionCSS() { return ( diff --git a/docs/src/pages/guides/interoperability/StyledComponents.js b/docs/src/pages/guides/interoperability/StyledComponents.js index 5529f090b8ebc3..c8dd39a310e05e 100644 --- a/docs/src/pages/guides/interoperability/StyledComponents.js +++ b/docs/src/pages/guides/interoperability/StyledComponents.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const SliderCustomized = styled(Slider)` color: #20b2aa; diff --git a/docs/src/pages/guides/interoperability/StyledComponents.tsx b/docs/src/pages/guides/interoperability/StyledComponents.tsx index 5529f090b8ebc3..c8dd39a310e05e 100644 --- a/docs/src/pages/guides/interoperability/StyledComponents.tsx +++ b/docs/src/pages/guides/interoperability/StyledComponents.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const SliderCustomized = styled(Slider)` color: #20b2aa; diff --git a/docs/src/pages/guides/interoperability/StyledComponentsDeep.js b/docs/src/pages/guides/interoperability/StyledComponentsDeep.js index baf49bc6b243d6..4f33894e3ada01 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsDeep.js +++ b/docs/src/pages/guides/interoperability/StyledComponentsDeep.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const CustomizedSlider = styled(Slider)` color: #20b2aa; diff --git a/docs/src/pages/guides/interoperability/StyledComponentsDeep.tsx b/docs/src/pages/guides/interoperability/StyledComponentsDeep.tsx index baf49bc6b243d6..4f33894e3ada01 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsDeep.tsx +++ b/docs/src/pages/guides/interoperability/StyledComponentsDeep.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { styled } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const CustomizedSlider = styled(Slider)` color: #20b2aa; diff --git a/docs/src/pages/guides/interoperability/StyledComponentsPortal.js b/docs/src/pages/guides/interoperability/StyledComponentsPortal.js index f82160aa9b2c2b..5d7b4ebee60f5f 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsPortal.js +++ b/docs/src/pages/guides/interoperability/StyledComponentsPortal.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import Tooltip from '@material-ui/core/Tooltip'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import Tooltip from '@mui/material/Tooltip'; const StyledTooltip = styled(({ className, ...props }) => ( diff --git a/docs/src/pages/guides/interoperability/StyledComponentsPortal.tsx b/docs/src/pages/guides/interoperability/StyledComponentsPortal.tsx index 96827386e68eb6..47989487f27501 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsPortal.tsx +++ b/docs/src/pages/guides/interoperability/StyledComponentsPortal.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import Tooltip, { TooltipProps } from '@material-ui/core/Tooltip'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import Tooltip, { TooltipProps } from '@mui/material/Tooltip'; const StyledTooltip = styled(({ className, ...props }: TooltipProps) => ( diff --git a/docs/src/pages/guides/interoperability/StyledComponentsTheme.js b/docs/src/pages/guides/interoperability/StyledComponentsTheme.js index 9e309b269390c4..5de77cbf150443 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsTheme.js +++ b/docs/src/pages/guides/interoperability/StyledComponentsTheme.js @@ -1,12 +1,7 @@ import * as React from 'react'; -import { - createTheme, - styled, - ThemeProvider, - darken, -} from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { createTheme, styled, ThemeProvider, darken } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const customTheme = createTheme({ palette: { diff --git a/docs/src/pages/guides/interoperability/StyledComponentsTheme.tsx b/docs/src/pages/guides/interoperability/StyledComponentsTheme.tsx index 9e309b269390c4..5de77cbf150443 100644 --- a/docs/src/pages/guides/interoperability/StyledComponentsTheme.tsx +++ b/docs/src/pages/guides/interoperability/StyledComponentsTheme.tsx @@ -1,12 +1,7 @@ import * as React from 'react'; -import { - createTheme, - styled, - ThemeProvider, - darken, -} from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; -import Box from '@material-ui/core/Box'; +import { createTheme, styled, ThemeProvider, darken } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; +import Box from '@mui/material/Box'; const customTheme = createTheme({ palette: { diff --git a/docs/src/pages/guides/interoperability/interoperability.md b/docs/src/pages/guides/interoperability/interoperability.md index 4ec316cb598f40..95f31a03f93f35 100644 --- a/docs/src/pages/guides/interoperability/interoperability.md +++ b/docs/src/pages/guides/interoperability/interoperability.md @@ -36,7 +36,7 @@ Nothing fancy, just plain CSS. ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; import './PlainCssSlider.css'; export default function PlainCssSlider() { @@ -55,7 +55,7 @@ export default function PlainCssSlider() { ```jsx import * as React from 'react'; -import { StyledEngineProvider } from '@material-ui/core/styles'; +import { StyledEngineProvider } from '@mui/material/styles'; export default function GlobalCssPriority() { return ( @@ -87,7 +87,7 @@ export default function PlainCssPriority() { } ``` -**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@material-ui/styled-engine-sc` package. +**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@mui/styled-engine-sc` package. ### Deeper elements @@ -119,7 +119,7 @@ The following examples override the slider's `thumb` style in addition to the cu ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; import './PlainCssSliderDeep1.css'; export default function PlainCssSliderDeep1() { @@ -154,7 +154,7 @@ The above demo relies on the [default `className` values](/styles/advanced/#with ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; import './PlainCssSliderDeep2.css'; export default function PlainCssSliderDeep2() { @@ -194,7 +194,7 @@ Explicitly providing the class names to the component is too much effort? ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; import './GlobalCssSlider.css'; export default function GlobalCssSlider() { @@ -208,7 +208,7 @@ export default function GlobalCssSlider() { ```jsx import * as React from 'react'; -import { StyledEngineProvider } from '@material-ui/core/styles'; +import { StyledEngineProvider } from '@mui/material/styles'; export default function GlobalCssPriority() { return ( @@ -240,7 +240,7 @@ export default function GlobalCssPriority() { } ``` -**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@material-ui/styled-engine-sc` package. +**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@mui/styled-engine-sc` package. ### Deeper elements @@ -272,7 +272,7 @@ The following example overrides the slider's `thumb` style in addition to the cu ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; import './GlobalCssSliderDeep.css'; export default function GlobalCssSliderDeep() { @@ -297,7 +297,7 @@ however, you would like to use `styled-components`, you can configure your app b Following this approach reduces the bundle size, and removes the need to configure the CSS injection order. After the style engine is configured properly, you can use the [`styled()`](/system/styled/) utility -from `@material-ui/core/styles` and have direct access to the theme. +from `@mui/material/styles` and have direct access to the theme. {{"demo": "pages/guides/interoperability/StyledComponents.js", "hideToolbar": true}} @@ -305,8 +305,8 @@ from `@material-ui/core/styles` and have direct access to the theme. ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; -import { styled } from '@material-ui/core/styles'; +import Slider from '@mui/material/Slider'; +import { styled } from '@mui/material/styles'; const CustomizedSlider = styled(Slider)` color: #20b2aa; @@ -335,8 +335,8 @@ The above demo relies on the [default `className` values](/styles/advanced/#with ```jsx import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Slider from '@material-ui/core/Slider'; +import { styled } from '@mui/material/styles'; +import Slider from '@mui/material/Slider'; const CustomizedSlider = styled((props) => ( @@ -400,9 +400,9 @@ The following example shows a workaround: ```jsx import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Button from '@material-ui/core/Button'; -import Tooltip from '@material-ui/core/Tooltip'; +import { styled } from '@mui/material/styles'; +import Button from '@mui/material/Button'; +import Tooltip from '@mui/material/Tooltip'; const StyledTooltip = styled(({ className, ...props }) => ( @@ -442,7 +442,7 @@ bundling solution people are using. ```jsx import * as React from 'react'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; // webpack, parcel or else will inject the CSS into the page import styles from './CssModulesSlider.module.css'; @@ -462,7 +462,7 @@ export default function CssModulesSlider() { ```jsx import * as React from 'react'; -import { StyledEngineProvider } from '@material-ui/core/styles'; +import { StyledEngineProvider } from '@mui/material/styles'; export default function GlobalCssPriority() { return ( @@ -494,7 +494,7 @@ export default function CssModulesPriority() { } ``` -**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@material-ui/styled-engine-sc` package. +**Note:** If you are using styled-components and have `StyleSheetManager` with a custom `target`, make sure that the target is the first element in the HTML ``. If you are curious to see how it can be done, you can take a look on the `StylesProvider` implementation in the `@mui/styled-engine-sc` package. ### Deeper elements @@ -528,7 +528,7 @@ The following examples override the slider's `thumb` style in addition to the cu import * as React from 'react'; // webpack, parcel or else will inject the CSS into the page import styles from './CssModulesSliderDeep1.module.css'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; export default function CssModulesSliderDeep1() { return ( @@ -564,7 +564,7 @@ The above demo relies on the [default `className` values](/styles/advanced/#with import * as React from 'react'; // webpack, parcel or else will inject the CSS into the page import styles from './CssModulesSliderDeep2.module.css'; -import Slider from '@material-ui/core/Slider'; +import Slider from '@mui/material/Slider'; export default function CssModulesSliderDeep2() { return ( diff --git a/docs/src/pages/guides/localization/Locales.js b/docs/src/pages/guides/localization/Locales.js index 66cb8b765c84cf..c774f751279fbb 100644 --- a/docs/src/pages/guides/localization/Locales.js +++ b/docs/src/pages/guides/localization/Locales.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import TablePagination from '@material-ui/core/TablePagination'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; -import * as locales from '@material-ui/core/locale'; +import TablePagination from '@mui/material/TablePagination'; +import Autocomplete from '@mui/material/Autocomplete'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; +import * as locales from '@mui/material/locale'; export default function Locales() { const [locale, setLocale] = React.useState('zhCN'); diff --git a/docs/src/pages/guides/localization/Locales.tsx b/docs/src/pages/guides/localization/Locales.tsx index b248ca7572da64..71df253c4317ff 100644 --- a/docs/src/pages/guides/localization/Locales.tsx +++ b/docs/src/pages/guides/localization/Locales.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import TablePagination from '@material-ui/core/TablePagination'; -import Autocomplete from '@material-ui/core/Autocomplete'; -import Box from '@material-ui/core/Box'; -import TextField from '@material-ui/core/TextField'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; -import * as locales from '@material-ui/core/locale'; +import TablePagination from '@mui/material/TablePagination'; +import Autocomplete from '@mui/material/Autocomplete'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; +import * as locales from '@mui/material/locale'; type SupportedLocales = keyof typeof locales; diff --git a/docs/src/pages/guides/localization/localization.md b/docs/src/pages/guides/localization/localization.md index 6e22ee85a23488..eb3d478d8cffc0 100644 --- a/docs/src/pages/guides/localization/localization.md +++ b/docs/src/pages/guides/localization/localization.md @@ -9,8 +9,8 @@ The default locale of Material-UI is English (United States). If you want to use Use the theme to configure the locale text globally: ```jsx -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; -import { zhCN } from '@material-ui/core/locale'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; +import { zhCN } from '@mui/material/locale'; const theme = createTheme( { diff --git a/docs/src/pages/guides/migration-v0x/migration-v0x.md b/docs/src/pages/guides/migration-v0x/migration-v0x.md index 7031a96953b3ec..3ed6ebf679ecb0 100644 --- a/docs/src/pages/guides/migration-v0x/migration-v0x.md +++ b/docs/src/pages/guides/migration-v0x/migration-v0x.md @@ -32,21 +32,21 @@ With yarn: ```sh yarn add material-ui -yarn add @material-ui/core +yarn add @mui/material ``` Or with npm: ```sh npm install material-ui -npm install @material-ui/core +npm install @mui/material ``` then ```js import FlatButton from 'material-ui/FlatButton'; // v0.x -import Button from '@material-ui/core/Button'; // v1.x +import Button from '@mui/material/Button'; // v1.x ``` 2. Run [the migration helper](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-codemod) on your project. @@ -54,7 +54,7 @@ import Button from '@material-ui/core/Button'; // v1.x ```jsx import * as React from 'react'; -import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'; // v1.x +import { MuiThemeProvider, createMuiTheme } from '@mui/material/styles'; // v1.x import { MuiThemeProvider as V0MuiThemeProvider } from 'material-ui'; import getMuiTheme from 'material-ui/styles/getMuiTheme'; @@ -95,7 +95,7 @@ This will apply a change such as the following: ```diff -import AddIcon from 'material-ui/svg-icons/Add'; -+import AddIcon from '@material-ui/icons/Add'; ++import AddIcon from '@mui/icons-material/Add'; ``` @@ -104,7 +104,7 @@ This will apply a change such as the following: ```diff -import FlatButton from 'material-ui/FlatButton'; -+import Button from '@material-ui/core/Button'; ++import Button from '@mui/material/Button'; - +; diff --git a/docs/src/pages/landing/Themes.js b/docs/src/pages/landing/Themes.js index daa92d750ce289..5b83f7d89bb075 100644 --- a/docs/src/pages/landing/Themes.js +++ b/docs/src/pages/landing/Themes.js @@ -1,11 +1,11 @@ import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; -import Typography from '@material-ui/core/Typography'; -import Container from '@material-ui/core/Container'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Box from '@material-ui/core/Box'; +import { useTheme } from '@mui/material/styles'; +import Typography from '@mui/material/Typography'; +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import NoSsr from '@mui/core/NoSsr'; +import Box from '@mui/material/Box'; import Link from 'docs/src/modules/components/Link'; import { useTranslate } from 'docs/src/modules/utils/i18n'; diff --git a/docs/src/pages/landing/Users.js b/docs/src/pages/landing/Users.js index 371120f67bc348..2c50b6881abec4 100644 --- a/docs/src/pages/landing/Users.js +++ b/docs/src/pages/landing/Users.js @@ -1,12 +1,12 @@ import * as React from 'react'; import clsx from 'clsx'; -import { makeStyles } from '@material-ui/styles'; -import NoSsr from '@material-ui/unstyled/NoSsr'; -import Divider from '@material-ui/core/Divider'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; -import Button from '@material-ui/core/Button'; -import Typography from '@material-ui/core/Typography'; +import { makeStyles } from '@mui/styles'; +import NoSsr from '@mui/core/NoSsr'; +import Divider from '@mui/material/Divider'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; import { useTranslate } from 'docs/src/modules/utils/i18n'; const users = [ diff --git a/docs/src/pages/premium-themes/onepirate/ForgotPassword.js b/docs/src/pages/premium-themes/onepirate/ForgotPassword.js index 20504c0439af6c..6c8e8702d11ff2 100644 --- a/docs/src/pages/premium-themes/onepirate/ForgotPassword.js +++ b/docs/src/pages/premium-themes/onepirate/ForgotPassword.js @@ -1,6 +1,6 @@ import * as React from 'react'; import { Field, Form, FormSpy } from 'react-final-form'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/ForgotPassword.tsx b/docs/src/pages/premium-themes/onepirate/ForgotPassword.tsx index 5ec721307d2a5e..e3b9b35c8cb726 100644 --- a/docs/src/pages/premium-themes/onepirate/ForgotPassword.tsx +++ b/docs/src/pages/premium-themes/onepirate/ForgotPassword.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { Field, Form, FormSpy } from 'react-final-form'; -import Box from '@material-ui/core/Box'; +import Box from '@mui/material/Box'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/Privacy.js b/docs/src/pages/premium-themes/onepirate/Privacy.js index 55860703ae43ac..4c30fc102a5867 100644 --- a/docs/src/pages/premium-themes/onepirate/Privacy.js +++ b/docs/src/pages/premium-themes/onepirate/Privacy.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Markdown from './modules/components/Markdown'; import Typography from './modules/components/Typography'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/Privacy.tsx b/docs/src/pages/premium-themes/onepirate/Privacy.tsx index 55860703ae43ac..4c30fc102a5867 100644 --- a/docs/src/pages/premium-themes/onepirate/Privacy.tsx +++ b/docs/src/pages/premium-themes/onepirate/Privacy.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Markdown from './modules/components/Markdown'; import Typography from './modules/components/Typography'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/SignIn.js b/docs/src/pages/premium-themes/onepirate/SignIn.js index 1ec608e9d1ec97..f5b767c496f9c4 100644 --- a/docs/src/pages/premium-themes/onepirate/SignIn.js +++ b/docs/src/pages/premium-themes/onepirate/SignIn.js @@ -1,7 +1,7 @@ import * as React from 'react'; import { Field, Form, FormSpy } from 'react-final-form'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/SignIn.tsx b/docs/src/pages/premium-themes/onepirate/SignIn.tsx index f2a7b850cb0433..eecd3b47619316 100644 --- a/docs/src/pages/premium-themes/onepirate/SignIn.tsx +++ b/docs/src/pages/premium-themes/onepirate/SignIn.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Field, Form, FormSpy } from 'react-final-form'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/SignUp.js b/docs/src/pages/premium-themes/onepirate/SignUp.js index 60f3d6c2215619..29a09a8b5dbb30 100644 --- a/docs/src/pages/premium-themes/onepirate/SignUp.js +++ b/docs/src/pages/premium-themes/onepirate/SignUp.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; import { Field, Form, FormSpy } from 'react-final-form'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; diff --git a/docs/src/pages/premium-themes/onepirate/SignUp.tsx b/docs/src/pages/premium-themes/onepirate/SignUp.tsx index 33120f417404ac..673954f820c3fc 100644 --- a/docs/src/pages/premium-themes/onepirate/SignUp.tsx +++ b/docs/src/pages/premium-themes/onepirate/SignUp.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; import { Field, Form, FormSpy } from 'react-final-form'; import Typography from './modules/components/Typography'; import AppFooter from './modules/views/AppFooter'; diff --git a/docs/src/pages/premium-themes/onepirate/Terms.js b/docs/src/pages/premium-themes/onepirate/Terms.js index 53c7e86f92b6ed..ee2b31bcd9b821 100644 --- a/docs/src/pages/premium-themes/onepirate/Terms.js +++ b/docs/src/pages/premium-themes/onepirate/Terms.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Markdown from './modules/components/Markdown'; import Typography from './modules/components/Typography'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/Terms.tsx b/docs/src/pages/premium-themes/onepirate/Terms.tsx index 53c7e86f92b6ed..ee2b31bcd9b821 100644 --- a/docs/src/pages/premium-themes/onepirate/Terms.tsx +++ b/docs/src/pages/premium-themes/onepirate/Terms.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Markdown from './modules/components/Markdown'; import Typography from './modules/components/Typography'; import AppAppBar from './modules/views/AppAppBar'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.js b/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.js index e868730b7f5efc..d16d23b93b1e15 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import MuiAppBar from '@material-ui/core/AppBar'; +import MuiAppBar from '@mui/material/AppBar'; function AppBar(props) { return ; diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.tsx index c8981c6f06d82f..65a78c5f2f30b9 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/AppBar.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import MuiAppBar, { AppBarProps } from '@material-ui/core/AppBar'; +import MuiAppBar, { AppBarProps } from '@mui/material/AppBar'; function AppBar(props: AppBarProps) { return ; diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Button.js b/docs/src/pages/premium-themes/onepirate/modules/components/Button.js index b626be63c2c45e..26151a428acc35 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Button.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Button.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import MuiButton from '@material-ui/core/Button'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import MuiButton from '@mui/material/Button'; const ButtonRoot = styled(MuiButton)(({ theme, size }) => ({ borderRadius: 0, diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Button.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Button.tsx index c4ae87cfd41792..4fd257bc82a1cd 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Button.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Button.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import MuiButton, { ButtonProps } from '@material-ui/core/Button'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import MuiButton, { ButtonProps } from '@mui/material/Button'; const ButtonRoot = styled(MuiButton)(({ theme, size }) => ({ borderRadius: 0, diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.js b/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.js index 5c0faa844f5499..a57036db45c441 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.js @@ -1,9 +1,9 @@ import * as React from 'react'; import ReactMarkdown from 'markdown-to-jsx'; -import { withStyles } from '@material-ui/styles'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import { withStyles } from '@mui/styles'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; const styles = (theme) => ({ listItem: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.tsx index 302725147e2ddc..4c93ce7206251a 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Markdown.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import ReactMarkdown from 'markdown-to-jsx'; -import { Theme } from '@material-ui/core/styles'; -import { withStyles, WithStyles } from '@material-ui/styles'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import { Theme } from '@mui/material/styles'; +import { withStyles, WithStyles } from '@mui/styles'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; const styles = (theme: Theme) => ({ listItem: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Paper.js b/docs/src/pages/premium-themes/onepirate/modules/components/Paper.js index b378c9e54c9b97..925e4ae2a0b4db 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Paper.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Paper.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import MuiPaper from '@material-ui/core/Paper'; -import { styled } from '@material-ui/core/styles'; +import MuiPaper from '@mui/material/Paper'; +import { styled } from '@mui/material/styles'; const PaperRoot = styled(MuiPaper, { shouldForwardProp: (prop) => prop !== 'background' && prop !== 'padding', diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Paper.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Paper.tsx index 77b6d36f961d8c..a59d22c1c92e58 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Paper.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Paper.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import MuiPaper, { PaperProps } from '@material-ui/core/Paper'; -import { styled } from '@material-ui/core/styles'; +import MuiPaper, { PaperProps } from '@mui/material/Paper'; +import { styled } from '@mui/material/styles'; interface ExtraPaperProps { background: 'light' | 'main' | 'dark'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.js b/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.js index a9596d27320e7d..867fd7754e7d48 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.js @@ -1,12 +1,12 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { withStyles } from '@material-ui/styles'; -import MuiSnackbar from '@material-ui/core/Snackbar'; -import Slide from '@material-ui/core/Slide'; -import CloseIcon from '@material-ui/icons/Close'; -import InfoIcon from '@material-ui/icons/Info'; -import IconButton from '@material-ui/core/IconButton'; +import { withStyles } from '@mui/styles'; +import MuiSnackbar from '@mui/material/Snackbar'; +import Slide from '@mui/material/Slide'; +import CloseIcon from '@mui/icons-material/Close'; +import InfoIcon from '@mui/icons-material/Info'; +import IconButton from '@mui/material/IconButton'; const styles = (theme) => ({ content: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx index 52663540b616d8..8fe482b31f4d1a 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx @@ -1,12 +1,12 @@ import * as React from 'react'; -import { Theme } from '@material-ui/core/styles'; -import { withStyles, WithStyles } from '@material-ui/styles'; -import MuiSnackbar, { SnackbarProps } from '@material-ui/core/Snackbar'; -import Slide from '@material-ui/core/Slide'; -import CloseIcon from '@material-ui/icons/Close'; -import InfoIcon from '@material-ui/icons/Info'; -import IconButton from '@material-ui/core/IconButton'; -import { TransitionProps } from '@material-ui/core/transitions/transition'; +import { Theme } from '@mui/material/styles'; +import { withStyles, WithStyles } from '@mui/styles'; +import MuiSnackbar, { SnackbarProps } from '@mui/material/Snackbar'; +import Slide from '@mui/material/Slide'; +import CloseIcon from '@mui/icons-material/Close'; +import InfoIcon from '@mui/icons-material/Info'; +import IconButton from '@mui/material/IconButton'; +import { TransitionProps } from '@mui/material/transitions/transition'; const styles = (theme: Theme) => ({ diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js index bdca7e20261eb0..7c27f14bbd73c4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import clsx from 'clsx'; -import { withStyles } from '@material-ui/styles'; -import MuiTextField from '@material-ui/core/TextField'; +import { withStyles } from '@mui/styles'; +import MuiTextField from '@mui/material/TextField'; const inputStyleMapping = { small: 'inputSizeSmall', diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.tsx index bdd47bfce33618..263bb7b45abb56 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import clsx from 'clsx'; -import { withStyles, WithStyles } from '@material-ui/styles'; +import { withStyles, WithStyles } from '@mui/styles'; import MuiTextField, { FilledTextFieldProps, StandardTextFieldProps, -} from '@material-ui/core/TextField'; +} from '@mui/material/TextField'; const inputStyleMapping = { small: 'inputSizeSmall', diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.js b/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.js index dbda121ea48761..4db5b6fa197b60 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.js @@ -1,5 +1,5 @@ -import { styled } from '@material-ui/core/styles'; -import MuiToolbar from '@material-ui/core/Toolbar'; +import { styled } from '@mui/material/styles'; +import MuiToolbar from '@mui/material/Toolbar'; const Toolbar = styled(MuiToolbar)(({ theme }) => ({ height: 64, diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.tsx index dbda121ea48761..4db5b6fa197b60 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Toolbar.tsx @@ -1,5 +1,5 @@ -import { styled } from '@material-ui/core/styles'; -import MuiToolbar from '@material-ui/core/Toolbar'; +import { styled } from '@mui/material/styles'; +import MuiToolbar from '@mui/material/Toolbar'; const Toolbar = styled(MuiToolbar)(({ theme }) => ({ height: 64, diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Typography.js b/docs/src/pages/premium-themes/onepirate/modules/components/Typography.js index a370d4f5495668..6cc318df71b882 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Typography.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Typography.js @@ -1,8 +1,8 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { withStyles } from '@material-ui/styles'; -import MuiTypography from '@material-ui/core/Typography'; +import { withStyles } from '@mui/styles'; +import MuiTypography from '@mui/material/Typography'; const markStyleMapping = { center: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Typography.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Typography.tsx index 02f52c4bc9d2c7..ea9dd8e0be495f 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/Typography.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/components/Typography.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import { Theme } from '@material-ui/core/styles'; -import { withStyles, WithStyles } from '@material-ui/styles'; -import MuiTypography, { TypographyProps } from '@material-ui/core/Typography'; +import { Theme } from '@mui/material/styles'; +import { withStyles, WithStyles } from '@mui/styles'; +import MuiTypography, { TypographyProps } from '@mui/material/Typography'; const markStyleMapping: { [index: string]: { [subindex: string]: string }; diff --git a/docs/src/pages/premium-themes/onepirate/modules/form/FormButton.tsx b/docs/src/pages/premium-themes/onepirate/modules/form/FormButton.tsx index c8f91735d67aba..66856dfa3f51a1 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/form/FormButton.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/form/FormButton.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ButtonProps } from '@material-ui/core'; +import { ButtonProps } from '@mui/material'; import Button from '../components/Button'; import defer from './defer'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.js b/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.js index 3ed70c55d35f90..b32b2b7113414b 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.js +++ b/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; import Typography from '../components/Typography'; const BoxStyled = styled(Box, { diff --git a/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.tsx b/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.tsx index 3fc44d020a634c..f876145ed91cc9 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/form/FormFeedback.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { experimentalStyled as styled } from '@material-ui/core/styles'; -import Box, { BoxProps as MuiBoxProps } from '@material-ui/core/Box'; +import { experimentalStyled as styled } from '@mui/material/styles'; +import Box, { BoxProps as MuiBoxProps } from '@mui/material/Box'; import Typography from '../components/Typography'; interface FormFeedbackProps extends MuiBoxProps { diff --git a/docs/src/pages/premium-themes/onepirate/modules/theme.js b/docs/src/pages/premium-themes/onepirate/modules/theme.js index ad0c1bf2f2f06a..61e3c46fd5d4d4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/theme.js +++ b/docs/src/pages/premium-themes/onepirate/modules/theme.js @@ -1,5 +1,5 @@ -import { createTheme } from '@material-ui/core/styles'; -import { green, grey, red } from '@material-ui/core/colors'; +import { createTheme } from '@mui/material/styles'; +import { green, grey, red } from '@mui/material/colors'; const rawTheme = createTheme({ palette: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/theme.ts b/docs/src/pages/premium-themes/onepirate/modules/theme.ts index ad0c1bf2f2f06a..61e3c46fd5d4d4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/theme.ts +++ b/docs/src/pages/premium-themes/onepirate/modules/theme.ts @@ -1,5 +1,5 @@ -import { createTheme } from '@material-ui/core/styles'; -import { green, grey, red } from '@material-ui/core/colors'; +import { createTheme } from '@mui/material/styles'; +import { green, grey, red } from '@mui/material/colors'; const rawTheme = createTheme({ palette: { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.js b/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.js index 76ab62c9271f1e..84466dba57d8a4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; import AppBar from '../components/AppBar'; import Toolbar from '../components/Toolbar'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.tsx index 76ab62c9271f1e..84466dba57d8a4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppAppBar.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Link from '@material-ui/core/Link'; +import Box from '@mui/material/Box'; +import Link from '@mui/material/Link'; import AppBar from '../components/AppBar'; import Toolbar from '../components/Toolbar'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.js b/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.js index 5fcdb767ee0b31..6cb27a827616bf 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; import TextField from '../components/TextField'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.tsx index 5fcdb767ee0b31..6cb27a827616bf 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppFooter.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Link from '@material-ui/core/Link'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Link from '@mui/material/Link'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; import TextField from '../components/TextField'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.js b/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.js index eb8689d3cbafc3..836974b3a2ba4f 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Paper from '../components/Paper'; function AppForm(props) { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.tsx index 99593026a7b35a..a6d4d2f4e2b9a4 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/AppForm.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; import Paper from '../components/Paper'; export default function AppForm(props: React.HTMLAttributes) { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.js index 77bb5ade131977..3afd1aed8ef7cd 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; import TextField from '../components/TextField'; import Snackbar from '../components/Snackbar'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.tsx index dbadcc6cef207a..b2633d59dc5120 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCTA.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; import TextField from '../components/TextField'; import Snackbar from '../components/Snackbar'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.js index 928d6d5e6e50bd..9d954bdbed2cf6 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import Container from '@material-ui/core/Container'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import ButtonBase from '@mui/material/ButtonBase'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; const ImageBackdrop = styled('div')(({ theme }) => ({ diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.tsx index 928d6d5e6e50bd..9d954bdbed2cf6 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductCategories.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { styled } from '@material-ui/core/styles'; -import Box from '@material-ui/core/Box'; -import ButtonBase from '@material-ui/core/ButtonBase'; -import Container from '@material-ui/core/Container'; +import { styled } from '@mui/material/styles'; +import Box from '@mui/material/Box'; +import ButtonBase from '@mui/material/ButtonBase'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; const ImageBackdrop = styled('div')(({ theme }) => ({ diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.js index 80715af09de806..ed2d0e21162126 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.js @@ -1,9 +1,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { styled } from '@material-ui/core/styles'; +import { styled } from '@mui/material/styles'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; const ProductHeroLayoutRoot = styled('section')(({ theme }) => ({ color: theme.palette.common.white, diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.tsx index e8d5e369882e35..d709753f0cf804 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHeroLayout.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; -import { Theme, styled } from '@material-ui/core/styles'; -import { SxProps } from '@material-ui/system'; -import Container from '@material-ui/core/Container'; -import Box from '@material-ui/core/Box'; +import { Theme, styled } from '@mui/material/styles'; +import { SxProps } from '@mui/system'; +import Container from '@mui/material/Container'; +import Box from '@mui/material/Box'; const ProductHeroLayoutRoot = styled('section')(({ theme }) => ({ color: theme.palette.common.white, diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.js index bddc7f5a73b9f6..ca7515a1b4dfda 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Button from '../components/Button'; import Typography from '../components/Typography'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.tsx index 1f2826f764afcb..017baf84e333fd 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductHowItWorks.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { Theme } from '@material-ui/core/styles'; -import { SxProps } from '@material-ui/system'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import { Theme } from '@mui/material/styles'; +import { SxProps } from '@mui/system'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Button from '../components/Button'; import Typography from '../components/Typography'; diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js index 593ca2e1d2bac9..1da5b1ffaf1ee3 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; function ProductSmokingHero() { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx index 593ca2e1d2bac9..1da5b1ffaf1ee3 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Button from '@material-ui/core/Button'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; function ProductSmokingHero() { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.js index 6d28f5f9f6454a..8fe5d2f5ee131a 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.js @@ -1,8 +1,8 @@ import * as React from 'react'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; const item = { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.tsx index 67085ec418c6f4..270486d98f96e8 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductValues.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; -import { Theme } from '@material-ui/core/styles'; -import { SxProps } from '@material-ui/system'; -import Box from '@material-ui/core/Box'; -import Grid from '@material-ui/core/Grid'; -import Container from '@material-ui/core/Container'; +import { Theme } from '@mui/material/styles'; +import { SxProps } from '@mui/system'; +import Box from '@mui/material/Box'; +import Grid from '@mui/material/Grid'; +import Container from '@mui/material/Container'; import Typography from '../components/Typography'; const item: SxProps = { diff --git a/docs/src/pages/premium-themes/onepirate/modules/withRoot.js b/docs/src/pages/premium-themes/onepirate/modules/withRoot.js index b36fd04fc217e4..1e425fd11c3dca 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/withRoot.js +++ b/docs/src/pages/premium-themes/onepirate/modules/withRoot.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { ThemeProvider } from '@material-ui/core/styles'; -import CssBaseline from '@material-ui/core/CssBaseline'; +import { ThemeProvider } from '@mui/material/styles'; +import CssBaseline from '@mui/material/CssBaseline'; import theme from './theme'; export default function withRoot(Component) { diff --git a/docs/src/pages/premium-themes/onepirate/modules/withRoot.tsx b/docs/src/pages/premium-themes/onepirate/modules/withRoot.tsx index bc052c89d65c2b..860900adb21c34 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/withRoot.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/withRoot.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { ThemeProvider } from '@material-ui/core/styles'; -import CssBaseline from '@material-ui/core/CssBaseline'; +import { ThemeProvider } from '@mui/material/styles'; +import CssBaseline from '@mui/material/CssBaseline'; import theme from './theme'; export default function withRoot

    (Component: React.ComponentType

    ) { diff --git a/docs/src/pages/premium-themes/paperbase/Content.js b/docs/src/pages/premium-themes/paperbase/Content.js index 0f68de4be30861..7ad6249e77b9ea 100644 --- a/docs/src/pages/premium-themes/paperbase/Content.js +++ b/docs/src/pages/premium-themes/paperbase/Content.js @@ -1,15 +1,15 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import TextField from '@material-ui/core/TextField'; -import Tooltip from '@material-ui/core/Tooltip'; -import IconButton from '@material-ui/core/IconButton'; -import SearchIcon from '@material-ui/icons/Search'; -import RefreshIcon from '@material-ui/icons/Refresh'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import TextField from '@mui/material/TextField'; +import Tooltip from '@mui/material/Tooltip'; +import IconButton from '@mui/material/IconButton'; +import SearchIcon from '@mui/icons-material/Search'; +import RefreshIcon from '@mui/icons-material/Refresh'; export default function Content() { return ( diff --git a/docs/src/pages/premium-themes/paperbase/Content.tsx b/docs/src/pages/premium-themes/paperbase/Content.tsx index 0f68de4be30861..7ad6249e77b9ea 100644 --- a/docs/src/pages/premium-themes/paperbase/Content.tsx +++ b/docs/src/pages/premium-themes/paperbase/Content.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import Typography from '@material-ui/core/Typography'; -import Paper from '@material-ui/core/Paper'; -import Grid from '@material-ui/core/Grid'; -import Button from '@material-ui/core/Button'; -import TextField from '@material-ui/core/TextField'; -import Tooltip from '@material-ui/core/Tooltip'; -import IconButton from '@material-ui/core/IconButton'; -import SearchIcon from '@material-ui/icons/Search'; -import RefreshIcon from '@material-ui/icons/Refresh'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Typography from '@mui/material/Typography'; +import Paper from '@mui/material/Paper'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; +import TextField from '@mui/material/TextField'; +import Tooltip from '@mui/material/Tooltip'; +import IconButton from '@mui/material/IconButton'; +import SearchIcon from '@mui/icons-material/Search'; +import RefreshIcon from '@mui/icons-material/Refresh'; export default function Content() { return ( diff --git a/docs/src/pages/premium-themes/paperbase/Header.js b/docs/src/pages/premium-themes/paperbase/Header.js index 7ad27d752bb7ed..ccbf7864f5541c 100644 --- a/docs/src/pages/premium-themes/paperbase/Header.js +++ b/docs/src/pages/premium-themes/paperbase/Header.js @@ -1,19 +1,19 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import AppBar from '@material-ui/core/AppBar'; -import Avatar from '@material-ui/core/Avatar'; -import Button from '@material-ui/core/Button'; -import Grid from '@material-ui/core/Grid'; -import HelpIcon from '@material-ui/icons/Help'; -import IconButton from '@material-ui/core/IconButton'; -import Link from '@material-ui/core/Link'; -import MenuIcon from '@material-ui/icons/Menu'; -import NotificationsIcon from '@material-ui/icons/Notifications'; -import Tab from '@material-ui/core/Tab'; -import Tabs from '@material-ui/core/Tabs'; -import Toolbar from '@material-ui/core/Toolbar'; -import Tooltip from '@material-ui/core/Tooltip'; -import Typography from '@material-ui/core/Typography'; +import AppBar from '@mui/material/AppBar'; +import Avatar from '@mui/material/Avatar'; +import Button from '@mui/material/Button'; +import Grid from '@mui/material/Grid'; +import HelpIcon from '@mui/icons-material/Help'; +import IconButton from '@mui/material/IconButton'; +import Link from '@mui/material/Link'; +import MenuIcon from '@mui/icons-material/Menu'; +import NotificationsIcon from '@mui/icons-material/Notifications'; +import Tab from '@mui/material/Tab'; +import Tabs from '@mui/material/Tabs'; +import Toolbar from '@mui/material/Toolbar'; +import Tooltip from '@mui/material/Tooltip'; +import Typography from '@mui/material/Typography'; const lightColor = 'rgba(255, 255, 255, 0.7)'; diff --git a/docs/src/pages/premium-themes/paperbase/Header.tsx b/docs/src/pages/premium-themes/paperbase/Header.tsx index 3aff4e514c5152..a6e1b616ef987d 100644 --- a/docs/src/pages/premium-themes/paperbase/Header.tsx +++ b/docs/src/pages/premium-themes/paperbase/Header.tsx @@ -1,18 +1,18 @@ import * as React from 'react'; -import AppBar from '@material-ui/core/AppBar'; -import Avatar from '@material-ui/core/Avatar'; -import Button from '@material-ui/core/Button'; -import Grid from '@material-ui/core/Grid'; -import HelpIcon from '@material-ui/icons/Help'; -import IconButton from '@material-ui/core/IconButton'; -import Link from '@material-ui/core/Link'; -import MenuIcon from '@material-ui/icons/Menu'; -import NotificationsIcon from '@material-ui/icons/Notifications'; -import Tab from '@material-ui/core/Tab'; -import Tabs from '@material-ui/core/Tabs'; -import Toolbar from '@material-ui/core/Toolbar'; -import Tooltip from '@material-ui/core/Tooltip'; -import Typography from '@material-ui/core/Typography'; +import AppBar from '@mui/material/AppBar'; +import Avatar from '@mui/material/Avatar'; +import Button from '@mui/material/Button'; +import Grid from '@mui/material/Grid'; +import HelpIcon from '@mui/icons-material/Help'; +import IconButton from '@mui/material/IconButton'; +import Link from '@mui/material/Link'; +import MenuIcon from '@mui/icons-material/Menu'; +import NotificationsIcon from '@mui/icons-material/Notifications'; +import Tab from '@mui/material/Tab'; +import Tabs from '@mui/material/Tabs'; +import Toolbar from '@mui/material/Toolbar'; +import Tooltip from '@mui/material/Tooltip'; +import Typography from '@mui/material/Typography'; const lightColor = 'rgba(255, 255, 255, 0.7)'; diff --git a/docs/src/pages/premium-themes/paperbase/Navigator.js b/docs/src/pages/premium-themes/paperbase/Navigator.js index 88d3138e9c83b5..e711c5afefc790 100644 --- a/docs/src/pages/premium-themes/paperbase/Navigator.js +++ b/docs/src/pages/premium-themes/paperbase/Navigator.js @@ -1,22 +1,22 @@ import * as React from 'react'; -import Divider from '@material-ui/core/Divider'; -import Drawer from '@material-ui/core/Drawer'; -import List from '@material-ui/core/List'; -import Box from '@material-ui/core/Box'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import HomeIcon from '@material-ui/icons/Home'; -import PeopleIcon from '@material-ui/icons/People'; -import DnsRoundedIcon from '@material-ui/icons/DnsRounded'; -import PermMediaOutlinedIcon from '@material-ui/icons/PhotoSizeSelectActual'; -import PublicIcon from '@material-ui/icons/Public'; -import SettingsEthernetIcon from '@material-ui/icons/SettingsEthernet'; -import SettingsInputComponentIcon from '@material-ui/icons/SettingsInputComponent'; -import TimerIcon from '@material-ui/icons/Timer'; -import SettingsIcon from '@material-ui/icons/Settings'; -import PhonelinkSetupIcon from '@material-ui/icons/PhonelinkSetup'; +import Divider from '@mui/material/Divider'; +import Drawer from '@mui/material/Drawer'; +import List from '@mui/material/List'; +import Box from '@mui/material/Box'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import HomeIcon from '@mui/icons-material/Home'; +import PeopleIcon from '@mui/icons-material/People'; +import DnsRoundedIcon from '@mui/icons-material/DnsRounded'; +import PermMediaOutlinedIcon from '@mui/icons-material/PhotoSizeSelectActual'; +import PublicIcon from '@mui/icons-material/Public'; +import SettingsEthernetIcon from '@mui/icons-material/SettingsEthernet'; +import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent'; +import TimerIcon from '@mui/icons-material/Timer'; +import SettingsIcon from '@mui/icons-material/Settings'; +import PhonelinkSetupIcon from '@mui/icons-material/PhonelinkSetup'; const categories = [ { diff --git a/docs/src/pages/premium-themes/paperbase/Navigator.tsx b/docs/src/pages/premium-themes/paperbase/Navigator.tsx index 394f927db106c8..0202685fa37ee1 100644 --- a/docs/src/pages/premium-themes/paperbase/Navigator.tsx +++ b/docs/src/pages/premium-themes/paperbase/Navigator.tsx @@ -1,22 +1,22 @@ import * as React from 'react'; -import Divider from '@material-ui/core/Divider'; -import Drawer, { DrawerProps } from '@material-ui/core/Drawer'; -import List from '@material-ui/core/List'; -import Box from '@material-ui/core/Box'; -import ListItem from '@material-ui/core/ListItem'; -import ListItemButton from '@material-ui/core/ListItemButton'; -import ListItemIcon from '@material-ui/core/ListItemIcon'; -import ListItemText from '@material-ui/core/ListItemText'; -import HomeIcon from '@material-ui/icons/Home'; -import PeopleIcon from '@material-ui/icons/People'; -import DnsRoundedIcon from '@material-ui/icons/DnsRounded'; -import PermMediaOutlinedIcon from '@material-ui/icons/PhotoSizeSelectActual'; -import PublicIcon from '@material-ui/icons/Public'; -import SettingsEthernetIcon from '@material-ui/icons/SettingsEthernet'; -import SettingsInputComponentIcon from '@material-ui/icons/SettingsInputComponent'; -import TimerIcon from '@material-ui/icons/Timer'; -import SettingsIcon from '@material-ui/icons/Settings'; -import PhonelinkSetupIcon from '@material-ui/icons/PhonelinkSetup'; +import Divider from '@mui/material/Divider'; +import Drawer, { DrawerProps } from '@mui/material/Drawer'; +import List from '@mui/material/List'; +import Box from '@mui/material/Box'; +import ListItem from '@mui/material/ListItem'; +import ListItemButton from '@mui/material/ListItemButton'; +import ListItemIcon from '@mui/material/ListItemIcon'; +import ListItemText from '@mui/material/ListItemText'; +import HomeIcon from '@mui/icons-material/Home'; +import PeopleIcon from '@mui/icons-material/People'; +import DnsRoundedIcon from '@mui/icons-material/DnsRounded'; +import PermMediaOutlinedIcon from '@mui/icons-material/PhotoSizeSelectActual'; +import PublicIcon from '@mui/icons-material/Public'; +import SettingsEthernetIcon from '@mui/icons-material/SettingsEthernet'; +import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent'; +import TimerIcon from '@mui/icons-material/Timer'; +import SettingsIcon from '@mui/icons-material/Settings'; +import PhonelinkSetupIcon from '@mui/icons-material/PhonelinkSetup'; const categories = [ { diff --git a/docs/src/pages/premium-themes/paperbase/Paperbase.js b/docs/src/pages/premium-themes/paperbase/Paperbase.js index a538ecdd402e40..557c0bdffe0b5d 100644 --- a/docs/src/pages/premium-themes/paperbase/Paperbase.js +++ b/docs/src/pages/premium-themes/paperbase/Paperbase.js @@ -1,10 +1,10 @@ import * as React from 'react'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; import Navigator from './Navigator'; import Content from './Content'; import Header from './Header'; diff --git a/docs/src/pages/premium-themes/paperbase/Paperbase.tsx b/docs/src/pages/premium-themes/paperbase/Paperbase.tsx index 94aca4003122c3..278b7d4f73cf50 100644 --- a/docs/src/pages/premium-themes/paperbase/Paperbase.tsx +++ b/docs/src/pages/premium-themes/paperbase/Paperbase.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; -import useMediaQuery from '@material-ui/core/useMediaQuery'; -import CssBaseline from '@material-ui/core/CssBaseline'; -import Box from '@material-ui/core/Box'; -import Typography from '@material-ui/core/Typography'; -import Link from '@material-ui/core/Link'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; +import useMediaQuery from '@mui/material/useMediaQuery'; +import CssBaseline from '@mui/material/CssBaseline'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; +import Link from '@mui/material/Link'; import Navigator from './Navigator'; import Content from './Content'; import Header from './Header'; diff --git a/docs/src/pages/production-error/ErrorDecoder.js b/docs/src/pages/production-error/ErrorDecoder.js index 896123824b59a9..f37343417a264c 100644 --- a/docs/src/pages/production-error/ErrorDecoder.js +++ b/docs/src/pages/production-error/ErrorDecoder.js @@ -1,10 +1,10 @@ import * as React from 'react'; import { useRouter } from 'next/router'; -import Link from '@material-ui/core/Link'; -import Typography from '@material-ui/core/Typography'; -import { styled } from '@material-ui/core/styles'; +import Link from '@mui/material/Link'; +import Typography from '@mui/material/Typography'; +import { styled } from '@mui/material/styles'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; -import { renderInline as renderInlineMarkdown } from '@material-ui/markdown'; +import { renderInline as renderInlineMarkdown } from '@mui/markdown'; const ErrorMessageSection = styled('div')({ // reset display: block from Demo diff --git a/docs/src/pages/styles/advanced/GlobalCss.js b/docs/src/pages/styles/advanced/GlobalCss.js index 3073be6e3cdcce..30e582df719daf 100644 --- a/docs/src/pages/styles/advanced/GlobalCss.js +++ b/docs/src/pages/styles/advanced/GlobalCss.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles({ '@global': { diff --git a/docs/src/pages/styles/advanced/GlobalCss.tsx b/docs/src/pages/styles/advanced/GlobalCss.tsx index 3073be6e3cdcce..30e582df719daf 100644 --- a/docs/src/pages/styles/advanced/GlobalCss.tsx +++ b/docs/src/pages/styles/advanced/GlobalCss.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles({ '@global': { diff --git a/docs/src/pages/styles/advanced/HybridGlobalCss.js b/docs/src/pages/styles/advanced/HybridGlobalCss.js index 084dd241440af4..450c63faaaa3e0 100644 --- a/docs/src/pages/styles/advanced/HybridGlobalCss.js +++ b/docs/src/pages/styles/advanced/HybridGlobalCss.js @@ -1,6 +1,6 @@ import * as React from 'react'; import clsx from 'clsx'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles({ root: { diff --git a/docs/src/pages/styles/advanced/HybridGlobalCss.tsx b/docs/src/pages/styles/advanced/HybridGlobalCss.tsx index 084dd241440af4..450c63faaaa3e0 100644 --- a/docs/src/pages/styles/advanced/HybridGlobalCss.tsx +++ b/docs/src/pages/styles/advanced/HybridGlobalCss.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import clsx from 'clsx'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles({ root: { diff --git a/docs/src/pages/styles/advanced/StringTemplates.js b/docs/src/pages/styles/advanced/StringTemplates.js index 609a2db48e339a..78ee2a040d7d65 100644 --- a/docs/src/pages/styles/advanced/StringTemplates.js +++ b/docs/src/pages/styles/advanced/StringTemplates.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { jssPreset, StylesProvider, makeStyles } from '@material-ui/styles'; +import { jssPreset, StylesProvider, makeStyles } from '@mui/styles'; import { create } from 'jss'; import jssTemplate from 'jss-plugin-template'; diff --git a/docs/src/pages/styles/advanced/ThemeNesting.js b/docs/src/pages/styles/advanced/ThemeNesting.js index 2432f828c4e988..428c079f4db3b4 100644 --- a/docs/src/pages/styles/advanced/ThemeNesting.js +++ b/docs/src/pages/styles/advanced/ThemeNesting.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, makeStyles } from '@material-ui/styles'; +import { ThemeProvider, makeStyles } from '@mui/styles'; const useStyles = makeStyles((theme) => ({ root: { diff --git a/docs/src/pages/styles/advanced/ThemeNesting.tsx b/docs/src/pages/styles/advanced/ThemeNesting.tsx index 195681a9b0133c..758c337dcac649 100644 --- a/docs/src/pages/styles/advanced/ThemeNesting.tsx +++ b/docs/src/pages/styles/advanced/ThemeNesting.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, makeStyles } from '@material-ui/styles'; +import { ThemeProvider, makeStyles } from '@mui/styles'; interface MyTheme { background: string; diff --git a/docs/src/pages/styles/advanced/Theming.js b/docs/src/pages/styles/advanced/Theming.js index 982149ecd1f1b7..c3b8760e9f9ca4 100644 --- a/docs/src/pages/styles/advanced/Theming.js +++ b/docs/src/pages/styles/advanced/Theming.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, makeStyles } from '@material-ui/styles'; +import { ThemeProvider, makeStyles } from '@mui/styles'; const themeInstance = { background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)', diff --git a/docs/src/pages/styles/advanced/Theming.tsx b/docs/src/pages/styles/advanced/Theming.tsx index 253bd7f591d349..896f664881cfbe 100644 --- a/docs/src/pages/styles/advanced/Theming.tsx +++ b/docs/src/pages/styles/advanced/Theming.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, makeStyles } from '@material-ui/styles'; +import { ThemeProvider, makeStyles } from '@mui/styles'; const themeInstance = { background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)', diff --git a/docs/src/pages/styles/advanced/UseTheme.js b/docs/src/pages/styles/advanced/UseTheme.js index 46fc4a5ca5fa8d..f60e2139337485 100644 --- a/docs/src/pages/styles/advanced/UseTheme.js +++ b/docs/src/pages/styles/advanced/UseTheme.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, useTheme } from '@material-ui/styles'; +import { ThemeProvider, useTheme } from '@mui/styles'; function DeepChild() { const theme = useTheme(); diff --git a/docs/src/pages/styles/advanced/UseTheme.tsx b/docs/src/pages/styles/advanced/UseTheme.tsx index 3eb842749c8319..df919f676c8eb0 100644 --- a/docs/src/pages/styles/advanced/UseTheme.tsx +++ b/docs/src/pages/styles/advanced/UseTheme.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { ThemeProvider, useTheme } from '@material-ui/styles'; +import { ThemeProvider, useTheme } from '@mui/styles'; interface MyTheme { spacing: string; diff --git a/docs/src/pages/styles/advanced/WithTheme.js b/docs/src/pages/styles/advanced/WithTheme.js index 542ee50b493de1..9d535e02529429 100644 --- a/docs/src/pages/styles/advanced/WithTheme.js +++ b/docs/src/pages/styles/advanced/WithTheme.js @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { ThemeProvider, withTheme } from '@material-ui/styles'; +import { ThemeProvider, withTheme } from '@mui/styles'; function DeepChildRaw(props) { return {`spacing ${props.theme.spacing}`}; diff --git a/docs/src/pages/styles/advanced/WithTheme.tsx b/docs/src/pages/styles/advanced/WithTheme.tsx index 4d01cd1bad3c58..6ce2dcc61fcd12 100644 --- a/docs/src/pages/styles/advanced/WithTheme.tsx +++ b/docs/src/pages/styles/advanced/WithTheme.tsx @@ -1,9 +1,5 @@ import * as React from 'react'; -import { - ThemeProvider, - WithTheme as WithThemeProps, - withTheme, -} from '@material-ui/styles'; +import { ThemeProvider, WithTheme as WithThemeProps, withTheme } from '@mui/styles'; interface Theme { spacing: string; diff --git a/docs/src/pages/styles/advanced/advanced.md b/docs/src/pages/styles/advanced/advanced.md index b38902dab9f176..d47feebc6ca2f7 100644 --- a/docs/src/pages/styles/advanced/advanced.md +++ b/docs/src/pages/styles/advanced/advanced.md @@ -1,8 +1,8 @@ # Advanced -

    This section covers more advanced usage of @material-ui/styles.

    +

    This section covers more advanced usage of @mui/styles.

    -> **Note**: `@material-ui/styles` is the _**legacy**_ styling solution for Material-UI. It is deprecated in v5. It depends on [JSS](https://cssinjs.org/) as a styling solution, which is not used in the `@material-ui/core` anymore. If you don't want to have both emotion & JSS in your bundle, please refer to the [`@material-ui/system`](/system/basics/) documentation which is the recommended alternative. +> **Note**: `@mui/styles` is the _**legacy**_ styling solution for Material-UI. It is deprecated in v5. It depends on [JSS](https://cssinjs.org/) as a styling solution, which is not used in the `@mui/material` anymore. If you don't want to have both emotion & JSS in your bundle, please refer to the [`@mui/system`](/system/basics/) documentation which is the recommended alternative. ## Theming @@ -11,7 +11,7 @@ Add a `ThemeProvider` to the top level of your app to pass a theme down the Reac > This example creates a theme object for custom-built components. If you intend to use some of the Material-UI's components you need to provide a richer theme structure using the `createTheme()` method. Head to the [theming section](/customization/theming/) to learn how to build your custom Material-UI theme. ```jsx -import { ThemeProvider } from '@material-ui/styles'; +import { ThemeProvider } from '@mui/styles'; import DeepChild from './my_components/DeepChild'; const theme = { @@ -38,7 +38,7 @@ You might need to access the theme variables inside your React components. For use in function components: ```jsx -import { useTheme } from '@material-ui/styles'; +import { useTheme } from '@mui/styles'; function DeepChild() { const theme = useTheme(); @@ -53,7 +53,7 @@ function DeepChild() { For use in class or function components: ```jsx -import { withTheme } from '@material-ui/styles'; +import { withTheme } from '@mui/styles'; function DeepChildRaw(props) { return {`spacing ${props.theme.spacing}`}; @@ -186,7 +186,7 @@ Of course, you are free to use additional plugins. Here is an example with the [ ```jsx import { create } from 'jss'; -import { StylesProvider, jssPreset } from '@material-ui/styles'; +import { StylesProvider, jssPreset } from '@mui/styles'; import rtl from 'jss-rtl'; const jss = create({ @@ -235,7 +235,7 @@ They gain more specificity than any other style tags on your page e.g. CSS modul The `StylesProvider` component has an `injectFirst` prop to inject the style tags **first** in the head (less priority): ```jsx -import { StylesProvider } from '@material-ui/styles'; +import { StylesProvider } from '@mui/styles'; {/* Your component tree. @@ -249,7 +249,7 @@ The injection of style tags happens in the **same order** as the `makeStyles` / ```jsx import clsx from 'clsx'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStylesBase = makeStyles({ root: { @@ -296,7 +296,7 @@ The simplest approach is to add an HTML comment to the `` that determines ```jsx import { create } from 'jss'; -import { StylesProvider, jssPreset } from '@material-ui/styles'; +import { StylesProvider, jssPreset } from '@mui/styles'; const jss = create({ ...jssPreset(), @@ -323,7 +323,7 @@ To get around this issue, you can provide a DOM element (other than a comment) a ```jsx import { create } from 'jss'; -import { StylesProvider, jssPreset } from '@material-ui/styles'; +import { StylesProvider, jssPreset } from '@mui/styles'; const jss = create({ ...jssPreset(), @@ -343,7 +343,7 @@ To get around this issue, you can use the JavaScript `document.createComment()` ```jsx import { create } from 'jss'; -import { StylesProvider, jssPreset } from '@material-ui/styles'; +import { StylesProvider, jssPreset } from '@mui/styles'; const styleNode = document.createComment('jss-insertion-point'); document.head.insertBefore(styleNode, document.head.firstChild); @@ -365,7 +365,7 @@ This example returns a string of HTML and inlines the critical CSS required, rig ```jsx import ReactDOMServer from 'react-dom/server'; -import { ServerStyleSheets } from '@material-ui/styles'; +import { ServerStyleSheets } from '@mui/styles'; function render() { const sheets = new ServerStyleSheets(); @@ -391,7 +391,7 @@ You can [follow the server side guide](/guides/server-rendering/) for a more det ### Gatsby -There is [an official Gatsby plugin](https://github.com/hupe1980/gatsby-plugin-material-ui) that enables server-side rendering for `@material-ui/styles`. +There is [an official Gatsby plugin](https://github.com/hupe1980/gatsby-plugin-material-ui) that enables server-side rendering for `@mui/styles`. Refer to the plugin's page for setup and usage instructions. @@ -410,7 +410,7 @@ The class names are generated by [the class name generator](/styles/api/#createg ### Default -By default, the class names generated by `@material-ui/styles` are **non-deterministic**; you can't rely on them to stay the same. Let's take the following style as an example: +By default, the class names generated by `@mui/styles` are **non-deterministic**; you can't rely on them to stay the same. Let's take the following style as an example: ```js const useStyles = makeStyles({ @@ -625,8 +625,8 @@ interface Props { However this isn't very [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) because it requires you to maintain the class names (`'root'`, `'paper'`, `'button'`, ...) in two different places. We provide a type operator `WithStyles` to help with this, so that you can just write: ```ts -import { createStyles } from '@material-ui/styles'; -import { WithStyles } from '@material-ui/core'; +import { createStyles } from '@mui/styles'; +import { WithStyles } from '@mui/material'; const styles = (theme: Theme) => createStyles({ diff --git a/docs/src/pages/styles/api/api.md b/docs/src/pages/styles/api/api.md index 33085c91aa4545..c4b975f1ce07f2 100644 --- a/docs/src/pages/styles/api/api.md +++ b/docs/src/pages/styles/api/api.md @@ -1,6 +1,6 @@ # API -

    The API reference of @material-ui/core/styles.

    +

    The API reference of @mui/material/styles.

    ## `createGenerateClassName([options]) => class name generator` @@ -22,7 +22,7 @@ A function which returns [a class name generator function](https://cssinjs.org/j ```jsx import * as React from 'react'; -import { StylesProvider, createGenerateClassName } from '@material-ui/styles'; +import { StylesProvider, createGenerateClassName } from '@mui/styles'; const generateClassName = createGenerateClassName({ productionPrefix: 'c', @@ -50,8 +50,8 @@ style rules to `makeStyles`/`withStyles` which are a function of the `Theme`. ### Examples ```jsx -import { createStyles, makeStyles } from '@material-ui/styles'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; +import { createStyles, makeStyles } from '@mui/styles'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; const useStyles = makeStyles((theme: Theme) => createStyles({ @@ -99,7 +99,7 @@ the style sheet. ```jsx import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles({ root: { @@ -120,7 +120,7 @@ This is a class helper to handle server-side rendering. [You can follow this gui ```jsx import ReactDOMServer from 'react-dom/server'; -import { ServerStyleSheets } from '@material-ui/styles'; +import { ServerStyleSheets } from '@mui/styles'; const sheets = new ServerStyleSheets(); const html = ReactDOMServer.renderToString(sheets.collect()); @@ -187,8 +187,8 @@ Link a style sheet with a function component using the **styled components** pat ```jsx import * as React from 'react'; -import { styled, ThemeProvider } from '@material-ui/styles'; -import { createTheme } from '@material-ui/core/styles'; +import { styled, ThemeProvider } from '@mui/styles'; +import { createTheme } from '@mui/material/styles'; const MyComponent = styled('div')({ backgroundColor: 'red', @@ -232,7 +232,7 @@ It should preferably be used at **the root of your component tree**. ```jsx import * as React from 'react'; import ReactDOM from 'react-dom'; -import { StylesProvider } from '@material-ui/styles'; +import { StylesProvider } from '@mui/styles'; function App() { return ...; @@ -258,7 +258,7 @@ It should preferably be used at **the root of your component tree**. ```jsx import * as React from 'react'; import ReactDOM from 'react-dom'; -import { ThemeProvider } from '@material-ui/core/styles'; +import { ThemeProvider } from '@mui/material/styles'; const theme = {}; @@ -281,7 +281,7 @@ This hook returns the `theme` object so it can be used inside a function compone ```jsx import * as React from 'react'; -import { useTheme } from '@material-ui/core/styles'; +import { useTheme } from '@mui/material/styles'; export default function MyComponent() { const theme = useTheme(); @@ -325,7 +325,7 @@ Some implementation details that might be interesting to being aware of: ```jsx import * as React from 'react'; -import { withStyles } from '@material-ui/styles'; +import { withStyles } from '@mui/styles'; const styles = { root: { @@ -344,7 +344,7 @@ Also, you can use as [decorators](https://babeljs.io/docs/en/babel-plugin-propos ```jsx import * as React from 'react'; -import { withStyles } from '@material-ui/styles'; +import { withStyles } from '@mui/styles'; const styles = { root: { @@ -379,7 +379,7 @@ in the render method. ```jsx import * as React from 'react'; -import { withTheme } from '@material-ui/styles'; +import { withTheme } from '@mui/styles'; function MyComponent(props) { return
    {props.theme.direction}
    ; diff --git a/docs/src/pages/styles/basics/AdaptingHOC.js b/docs/src/pages/styles/basics/AdaptingHOC.js index 1d557e1383cf5e..3742d7895877e4 100644 --- a/docs/src/pages/styles/basics/AdaptingHOC.js +++ b/docs/src/pages/styles/basics/AdaptingHOC.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { withStyles } from '@material-ui/styles'; -import Button from '@material-ui/core/Button'; +import { withStyles } from '@mui/styles'; +import Button from '@mui/material/Button'; const styles = { root: { diff --git a/docs/src/pages/styles/basics/AdaptingHOC.tsx b/docs/src/pages/styles/basics/AdaptingHOC.tsx index 467c01521991ae..ac19f1c174af6b 100644 --- a/docs/src/pages/styles/basics/AdaptingHOC.tsx +++ b/docs/src/pages/styles/basics/AdaptingHOC.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { withStyles, WithStyles } from '@material-ui/styles'; -import Button, { ButtonProps } from '@material-ui/core/Button'; +import { withStyles, WithStyles } from '@mui/styles'; +import Button, { ButtonProps } from '@mui/material/Button'; const styles = { root: { diff --git a/docs/src/pages/styles/basics/AdaptingHook.js b/docs/src/pages/styles/basics/AdaptingHook.js index ba39dbc50f7822..fa4402ad7f6e74 100644 --- a/docs/src/pages/styles/basics/AdaptingHook.js +++ b/docs/src/pages/styles/basics/AdaptingHook.js @@ -1,7 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { makeStyles } from '@material-ui/styles'; -import Button from '@material-ui/core/Button'; +import { makeStyles } from '@mui/styles'; +import Button from '@mui/material/Button'; const useStyles = makeStyles({ root: { diff --git a/docs/src/pages/styles/basics/AdaptingHook.tsx b/docs/src/pages/styles/basics/AdaptingHook.tsx index d92e425a38662e..7d2932d33204b6 100644 --- a/docs/src/pages/styles/basics/AdaptingHook.tsx +++ b/docs/src/pages/styles/basics/AdaptingHook.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; -import Button, { ButtonProps as MuiButtonProps } from '@material-ui/core/Button'; +import { makeStyles } from '@mui/styles'; +import Button, { ButtonProps as MuiButtonProps } from '@mui/material/Button'; interface Props { color: 'red' | 'blue'; diff --git a/docs/src/pages/styles/basics/AdaptingStyledComponents.js b/docs/src/pages/styles/basics/AdaptingStyledComponents.js index 301cc95d02396d..b357a00a63b09c 100644 --- a/docs/src/pages/styles/basics/AdaptingStyledComponents.js +++ b/docs/src/pages/styles/basics/AdaptingStyledComponents.js @@ -1,6 +1,6 @@ import * as React from 'react'; -import { styled } from '@material-ui/styles'; -import Button from '@material-ui/core/Button'; +import { styled } from '@mui/styles'; +import Button from '@mui/material/Button'; const MyButton = styled(({ color, ...other }) =>