diff --git a/docs/data/material/components/material-icons/SearchIcons.js b/docs/data/material/components/material-icons/SearchIcons.js index 30863dcf8a4d69..56c962b122a8e3 100644 --- a/docs/data/material/components/material-icons/SearchIcons.js +++ b/docs/data/material/components/material-icons/SearchIcons.js @@ -22,7 +22,7 @@ import Radio from '@mui/material/Radio'; import SvgIcon from '@mui/material/SvgIcon'; import * as mui from '@mui/icons-material'; import Link from 'docs/src/modules/components/Link'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import useQueryParameterState from 'docs/src/modules/utils/useQueryParameterState'; // For Debugging // import Menu from '@mui/icons-material/Menu'; diff --git a/docs/data/material/customization/default-theme/DefaultTheme.js b/docs/data/material/customization/default-theme/DefaultTheme.js index 86df7d9295d62b..07024ca8c68148 100644 --- a/docs/data/material/customization/default-theme/DefaultTheme.js +++ b/docs/data/material/customization/default-theme/DefaultTheme.js @@ -4,7 +4,7 @@ import Divider from '@mui/material/Divider'; import { createTheme, styled } from '@mui/material/styles'; import FormControlLabel from '@mui/material/FormControlLabel'; import Switch from '@mui/material/Switch'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ThemeViewer, { useNodeIdsLazy, } from 'docs/src/modules/components/ThemeViewer'; diff --git a/docs/data/material/customization/density/DensityTool.js b/docs/data/material/customization/density/DensityTool.js index 99060eda788a1c..02f57e1eec9537 100644 --- a/docs/data/material/customization/density/DensityTool.js +++ b/docs/data/material/customization/density/DensityTool.js @@ -10,7 +10,7 @@ import Switch from '@mui/material/Switch'; import IncreaseIcon from '@mui/icons-material/AddCircleOutline'; import DecreaseIcon from '@mui/icons-material/RemoveCircleOutline'; import { DispatchContext } from 'docs/src/modules/components/ThemeContext'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const minSpacing = 0; const maxSpacing = 20; diff --git a/docs/pages/_app.js b/docs/pages/_app.js index f86f4c50e731b5..359ed3951d6f95 100644 --- a/docs/pages/_app.js +++ b/docs/pages/_app.js @@ -22,7 +22,7 @@ import { CodeCopyProvider } from 'docs/src/modules/utils/CodeCopy'; import { ThemeProvider } from 'docs/src/modules/components/ThemeContext'; import { CodeVariantProvider } from 'docs/src/modules/utils/codeVariant'; import { CodeStylingProvider } from 'docs/src/modules/utils/codeStylingSolution'; -import { UserLanguageProvider } from 'docs/src/modules/utils/i18n'; +import { UserLanguageProvider } from '@mui/docs/i18n'; import DocsStyledEngineProvider from 'docs/src/modules/utils/StyledEngineProvider'; import createEmotionCache from 'docs/src/createEmotionCache'; import findActivePage from 'docs/src/modules/utils/findActivePage'; diff --git a/docs/pages/components.tsx b/docs/pages/components.tsx index 7d3194d4fa761c..a621cec4f812e4 100644 --- a/docs/pages/components.tsx +++ b/docs/pages/components.tsx @@ -12,7 +12,7 @@ import AppFooter from 'docs/src/layouts/AppFooter'; import BrandingCssVarsProvider from 'docs/src/BrandingCssVarsProvider'; import Section from 'docs/src/layouts/Section'; import { pageToTitleI18n } from 'docs/src/modules/utils/helpers'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import Link from 'docs/src/modules/components/Link'; import type { MuiPage } from 'docs/src/MuiPage'; import materialPages from 'docs/data/material/pages'; diff --git a/docs/src/layouts/AppHeader.tsx b/docs/src/layouts/AppHeader.tsx index 8aba9bb331058d..3f4f5567a5c844 100644 --- a/docs/src/layouts/AppHeader.tsx +++ b/docs/src/layouts/AppHeader.tsx @@ -13,7 +13,7 @@ import HeaderNavDropdown from 'docs/src/components/header/HeaderNavDropdown'; import ThemeModeToggle from 'docs/src/components/header/ThemeModeToggle'; import Link from 'docs/src/modules/components/Link'; import { DeferredAppSearch } from 'docs/src/modules/components/AppFrame'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const Header = styled('header')(({ theme }) => [ { diff --git a/docs/src/modules/components/Ad.js b/docs/src/modules/components/Ad.js index 1247850638aa61..eddd42bb79bfcf 100644 --- a/docs/src/modules/components/Ad.js +++ b/docs/src/modules/components/Ad.js @@ -6,7 +6,7 @@ import Paper from '@mui/material/Paper'; import AdCarbon from 'docs/src/modules/components/AdCarbon'; import AdInHouse from 'docs/src/modules/components/AdInHouse'; import { AdContext, adShape } from 'docs/src/modules/components/AdManager'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; function PleaseDisableAdblock(props) { const t = useTranslate(); diff --git a/docs/src/modules/components/ApiPage.js b/docs/src/modules/components/ApiPage.js index 568496a14bf8ce..47fc737c2f44a5 100644 --- a/docs/src/modules/components/ApiPage.js +++ b/docs/src/modules/components/ApiPage.js @@ -8,7 +8,7 @@ import AdGuest from 'docs/src/modules/components/AdGuest'; import Alert from '@mui/material/Alert'; import VerifiedRoundedIcon from '@mui/icons-material/VerifiedRounded'; import { alpha } from '@mui/material/styles'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; import AppLayoutDocs from 'docs/src/modules/components/AppLayoutDocs'; diff --git a/docs/src/modules/components/ApiPage/list/ClassesList.tsx b/docs/src/modules/components/ApiPage/list/ClassesList.tsx index ed4fc21b901be7..0b4982049abea4 100644 --- a/docs/src/modules/components/ApiPage/list/ClassesList.tsx +++ b/docs/src/modules/components/ApiPage/list/ClassesList.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import { styled } from '@mui/material/styles'; import kebabCase from 'lodash/kebabCase'; import { ComponentClassDefinition } from '@mui-internal/docs-utilities'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ExpandableApiItem, { ApiItemContaier, } from 'docs/src/modules/components/ApiPage/list/ExpandableApiItem'; diff --git a/docs/src/modules/components/ApiPage/list/PropertiesList.tsx b/docs/src/modules/components/ApiPage/list/PropertiesList.tsx index 46bf826b14ce57..af3d018b340418 100644 --- a/docs/src/modules/components/ApiPage/list/PropertiesList.tsx +++ b/docs/src/modules/components/ApiPage/list/PropertiesList.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { styled } from '@mui/material/styles'; import kebabCase from 'lodash/kebabCase'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { brandingDarkTheme as darkTheme, brandingLightTheme as lightTheme, diff --git a/docs/src/modules/components/ApiPage/list/SlotsList.tsx b/docs/src/modules/components/ApiPage/list/SlotsList.tsx index 03db0f5396e06f..f205d62009f5fd 100644 --- a/docs/src/modules/components/ApiPage/list/SlotsList.tsx +++ b/docs/src/modules/components/ApiPage/list/SlotsList.tsx @@ -5,7 +5,7 @@ import { brandingLightTheme as lightTheme, brandingDarkTheme as darkTheme, } from 'docs/src/modules/brandingTheme'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ExpandableApiItem, { ApiItemContaier, } from 'docs/src/modules/components/ApiPage/list/ExpandableApiItem'; diff --git a/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx b/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx index 318c159fc6e78d..d2789d7f5fab96 100644 --- a/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx +++ b/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx @@ -1,6 +1,6 @@ /* eslint-disable react/no-danger */ import * as React from 'react'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { ComponentClassDefinition } from '@mui-internal/docs-utilities'; import Box from '@mui/material/Box'; import ToggleDisplayOption, { diff --git a/docs/src/modules/components/ApiPage/sections/PropertiesSection.js b/docs/src/modules/components/ApiPage/sections/PropertiesSection.js index a19e6ebe8c1eca..1cccc5bf25cf46 100644 --- a/docs/src/modules/components/ApiPage/sections/PropertiesSection.js +++ b/docs/src/modules/components/ApiPage/sections/PropertiesSection.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import Box from '@mui/material/Box'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ToggleDisplayOption, { API_LAYOUT_STORAGE_KEYS, useApiPageOption, diff --git a/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx b/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx index 966f578855f484..be58775e338419 100644 --- a/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx +++ b/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx @@ -1,7 +1,7 @@ /* eslint-disable react/no-danger */ import * as React from 'react'; import Box from '@mui/material/Box'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ToggleDisplayOption, { API_LAYOUT_STORAGE_KEYS, useApiPageOption, diff --git a/docs/src/modules/components/ApiPage/table/ClassesTable.tsx b/docs/src/modules/components/ApiPage/table/ClassesTable.tsx index 881be9202db048..52846fa9a1d746 100644 --- a/docs/src/modules/components/ApiPage/table/ClassesTable.tsx +++ b/docs/src/modules/components/ApiPage/table/ClassesTable.tsx @@ -8,7 +8,7 @@ import { } from 'docs/src/modules/brandingTheme'; import { getHash } from 'docs/src/modules/components/ApiPage/list/ClassesList'; import StyledTableContainer from 'docs/src/modules/components/ApiPage/table/StyledTableContainer'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import ApiWarning from 'docs/src/modules/components/ApiPage/ApiWarning'; const StyledTable = styled('table')( diff --git a/docs/src/modules/components/ApiPage/table/PropertiesTable.tsx b/docs/src/modules/components/ApiPage/table/PropertiesTable.tsx index c6f474c06d8cb2..8a6295f38dbab5 100644 --- a/docs/src/modules/components/ApiPage/table/PropertiesTable.tsx +++ b/docs/src/modules/components/ApiPage/table/PropertiesTable.tsx @@ -1,7 +1,7 @@ /* eslint-disable react/no-danger */ import * as React from 'react'; import { styled, alpha } from '@mui/material/styles'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { brandingDarkTheme as darkTheme, brandingLightTheme as lightTheme, diff --git a/docs/src/modules/components/ApiPage/table/SlotsTable.tsx b/docs/src/modules/components/ApiPage/table/SlotsTable.tsx index 8b2bf8e7176166..d08c3e68aa3133 100644 --- a/docs/src/modules/components/ApiPage/table/SlotsTable.tsx +++ b/docs/src/modules/components/ApiPage/table/SlotsTable.tsx @@ -1,6 +1,6 @@ /* eslint-disable react/no-danger */ import * as React from 'react'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { styled, alpha } from '@mui/material/styles'; import { brandingDarkTheme as darkTheme, diff --git a/docs/src/modules/components/AppFrame.js b/docs/src/modules/components/AppFrame.js index 34ff270ec019a5..9a21790f926c6b 100644 --- a/docs/src/modules/components/AppFrame.js +++ b/docs/src/modules/components/AppFrame.js @@ -23,7 +23,7 @@ import Notifications from 'docs/src/modules/components/Notifications'; import MarkdownLinks from 'docs/src/modules/components/MarkdownLinks'; import SkipLink from 'docs/src/modules/components/SkipLink'; import PageContext from 'docs/src/modules/components/PageContext'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import SvgMuiLogomark from 'docs/src/icons/SvgMuiLogomark'; import AppFrameBanner from 'docs/src/components/banner/AppFrameBanner'; diff --git a/docs/src/modules/components/AppLayoutDocsFooter.js b/docs/src/modules/components/AppLayoutDocsFooter.js index 7857133a8a4277..8137c5d55f4448 100644 --- a/docs/src/modules/components/AppLayoutDocsFooter.js +++ b/docs/src/modules/components/AppLayoutDocsFooter.js @@ -31,7 +31,7 @@ import Link from 'docs/src/modules/components/Link'; import PageContext from 'docs/src/modules/components/PageContext'; import EditPage from 'docs/src/modules/components/EditPage'; import SvgMuiLogotype from 'docs/src/icons/SvgMuiLogotype'; -import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage, useTranslate } from '@mui/docs/i18n'; import { getCookie, pageToTitleI18n } from 'docs/src/modules/utils/helpers'; const FooterLink = styled(Typography)(({ theme }) => { diff --git a/docs/src/modules/components/AppNavDrawer.js b/docs/src/modules/components/AppNavDrawer.js index 2bb699b2827bc4..32ad7954cee8ff 100644 --- a/docs/src/modules/components/AppNavDrawer.js +++ b/docs/src/modules/components/AppNavDrawer.js @@ -19,7 +19,7 @@ import SvgMuiLogomark from 'docs/src/icons/SvgMuiLogomark'; import AppNavDrawerItem from 'docs/src/modules/components/AppNavDrawerItem'; import { pageToTitleI18n } from 'docs/src/modules/utils/helpers'; import PageContext from 'docs/src/modules/components/PageContext'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import MuiProductSelector from 'docs/src/modules/components/MuiProductSelector'; // TODO: Collapse should expose an API to customize the duration based on the height. diff --git a/docs/src/modules/components/AppSearch.js b/docs/src/modules/components/AppSearch.js index 99bb48a68a9130..f6da0f050af680 100644 --- a/docs/src/modules/components/AppSearch.js +++ b/docs/src/modules/components/AppSearch.js @@ -24,7 +24,7 @@ import { alpha, styled } from '@mui/material/styles'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import { LANGUAGES_SSR } from 'docs/config'; import Link from 'docs/src/modules/components/Link'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import useLazyCSS from 'docs/src/modules/utils/useLazyCSS'; import PageContext from 'docs/src/modules/components/PageContext'; diff --git a/docs/src/modules/components/AppSettingsDrawer.js b/docs/src/modules/components/AppSettingsDrawer.js index 93548164573c46..3ddad7cb06a71b 100644 --- a/docs/src/modules/components/AppSettingsDrawer.js +++ b/docs/src/modules/components/AppSettingsDrawer.js @@ -17,7 +17,7 @@ import SettingsBrightnessIcon from '@mui/icons-material/SettingsBrightness'; import FormatTextdirectionLToRIcon from '@mui/icons-material/FormatTextdirectionLToR'; import FormatTextdirectionRToLIcon from '@mui/icons-material/FormatTextdirectionRToL'; import { useChangeTheme } from 'docs/src/modules/components/ThemeContext'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const Heading = styled(Typography)(({ theme }) => ({ margin: '20px 0 10px', diff --git a/docs/src/modules/components/AppTableOfContents.js b/docs/src/modules/components/AppTableOfContents.js index 529b07b1ddbcc3..13fd1b4001a7ca 100644 --- a/docs/src/modules/components/AppTableOfContents.js +++ b/docs/src/modules/components/AppTableOfContents.js @@ -6,7 +6,7 @@ import { styled, alpha } from '@mui/material/styles'; import Typography from '@mui/material/Typography'; import NoSsr from '@mui/material/NoSsr'; import Link from 'docs/src/modules/components/Link'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { samePageLinkNavigation } from 'docs/src/modules/components/MarkdownLinks'; import TableOfContentsBanner from 'docs/src/components/banner/TableOfContentsBanner'; import featureToggle from 'docs/src/featureToggle'; diff --git a/docs/src/modules/components/BackToTop.tsx b/docs/src/modules/components/BackToTop.tsx index 4f4dc538e28e9e..a3366f7f626fb4 100644 --- a/docs/src/modules/components/BackToTop.tsx +++ b/docs/src/modules/components/BackToTop.tsx @@ -6,7 +6,7 @@ import Tooltip from '@mui/material/Tooltip'; import KeyboardArrowUpRoundedIcon from '@mui/icons-material/KeyboardArrowUpRounded'; import Fade from '@mui/material/Fade'; import { Theme } from '@mui/material/styles'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; export default function BackToTop() { const t = useTranslate(); diff --git a/docs/src/modules/components/ComponentLinkHeader.js b/docs/src/modules/components/ComponentLinkHeader.js index 1be2351a21016b..ebc8e4cef3e9be 100644 --- a/docs/src/modules/components/ComponentLinkHeader.js +++ b/docs/src/modules/components/ComponentLinkHeader.js @@ -10,7 +10,7 @@ import AdobeXDIcon from 'docs/src/modules/components/AdobeXDIcon'; import BundleSizeIcon from 'docs/src/modules/components/BundleSizeIcon'; import W3CIcon from 'docs/src/modules/components/W3CIcon'; import MaterialDesignIcon from 'docs/src/modules/components/MaterialDesignIcon'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const Root = styled('ul')({ margin: 0, diff --git a/docs/src/modules/components/ComponentPageTabs.js b/docs/src/modules/components/ComponentPageTabs.js index 1d61b09b846ae9..d8cabe15325da6 100644 --- a/docs/src/modules/components/ComponentPageTabs.js +++ b/docs/src/modules/components/ComponentPageTabs.js @@ -5,7 +5,7 @@ import { styled } from '@mui/material/styles'; import Box from '@mui/material/Box'; import Tabs, { tabsClasses } from '@mui/material/Tabs'; import Tab, { tabClasses } from '@mui/material/Tab'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import Link from 'docs/src/modules/components/Link'; export const HEIGHT = 50; diff --git a/docs/src/modules/components/ComponentsApiContent.js b/docs/src/modules/components/ComponentsApiContent.js index d76390a243fd48..36b59c429a9dd0 100644 --- a/docs/src/modules/components/ComponentsApiContent.js +++ b/docs/src/modules/components/ComponentsApiContent.js @@ -4,7 +4,7 @@ import PropTypes from 'prop-types'; import kebabCase from 'lodash/kebabCase'; import { useRouter } from 'next/router'; import { exactProp } from '@mui/utils'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; import PropertiesSection from 'docs/src/modules/components/ApiPage/sections/PropertiesSection'; diff --git a/docs/src/modules/components/Demo.js b/docs/src/modules/components/Demo.js index 15250e4312f19a..12cdd5d9c5e1d2 100644 --- a/docs/src/modules/components/Demo.js +++ b/docs/src/modules/components/Demo.js @@ -19,7 +19,7 @@ import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import { useCodeVariant } from 'docs/src/modules/utils/codeVariant'; import { useCodeStyling } from 'docs/src/modules/utils/codeStylingSolution'; import { CODE_VARIANTS, CODE_STYLING } from 'docs/src/modules/constants'; -import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage, useTranslate } from '@mui/docs/i18n'; import stylingSolutionMapping from 'docs/src/modules/utils/stylingSolutionMapping'; import BrandingProvider from 'docs/src/BrandingProvider'; import DemoToolbarRoot from 'docs/src/modules/components/DemoToolbarRoot'; diff --git a/docs/src/modules/components/DemoEditor.tsx b/docs/src/modules/components/DemoEditor.tsx index 09635d291597eb..0172043e473a87 100644 --- a/docs/src/modules/components/DemoEditor.tsx +++ b/docs/src/modules/components/DemoEditor.tsx @@ -6,7 +6,7 @@ import { styled, useTheme } from '@mui/material/styles'; import prism from '@mui/markdown/prism'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; import CodeCopyButton from 'docs/src/modules/components/CodeCopyButton'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import { useCodeCopy } from 'docs/src/modules/utils/CodeCopy'; import { blueDark } from 'docs/src/modules/brandingTheme'; diff --git a/docs/src/modules/components/DemoSandbox.js b/docs/src/modules/components/DemoSandbox.js index 78aff5ce50a01e..57ebf0ace75a40 100644 --- a/docs/src/modules/components/DemoSandbox.js +++ b/docs/src/modules/components/DemoSandbox.js @@ -12,7 +12,7 @@ import { CssVarsProvider, extendTheme } from '@mui/joy/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'; +import { useTranslate } from '@mui/docs/i18n'; import { getDesignTokens } from 'docs/src/modules/brandingTheme'; import { highDensity } from 'docs/src/modules/components/ThemeContext'; diff --git a/docs/src/modules/components/DemoToolbar.js b/docs/src/modules/components/DemoToolbar.js index 37314192980a39..f5b5ee35fa093e 100644 --- a/docs/src/modules/components/DemoToolbar.js +++ b/docs/src/modules/components/DemoToolbar.js @@ -24,7 +24,7 @@ import { useRouter } from 'next/router'; import { CODE_VARIANTS, CODE_STYLING } from 'docs/src/modules/constants'; import { useSetCodeVariant } from 'docs/src/modules/utils/codeVariant'; import { useSetCodeStyling, useCodeStyling } from 'docs/src/modules/utils/codeStylingSolution'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import stylingSolutionMapping from 'docs/src/modules/utils/stylingSolutionMapping'; import codeSandbox from '../sandbox/CodeSandbox'; import stackBlitz from '../sandbox/StackBlitz'; diff --git a/docs/src/modules/components/DiamondSponsors.js b/docs/src/modules/components/DiamondSponsors.js index 6e97f9e5ca3e60..5cf92097661ef3 100644 --- a/docs/src/modules/components/DiamondSponsors.js +++ b/docs/src/modules/components/DiamondSponsors.js @@ -5,7 +5,7 @@ import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; import Typography from '@mui/material/Typography'; import DiamondOutlinedIcon from '@mui/icons-material/DiamondOutlined'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; import Link from 'docs/src/modules/components/Link'; const StyledAnchor = styled('a')(({ theme }) => ({ diff --git a/docs/src/modules/components/EditPage.js b/docs/src/modules/components/EditPage.js index 76cb9ef8a16669..d8b16b3067ee3b 100644 --- a/docs/src/modules/components/EditPage.js +++ b/docs/src/modules/components/EditPage.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import Button from '@mui/material/Button'; import GitHubIcon from '@mui/icons-material/GitHub'; -import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage, useTranslate } from '@mui/docs/i18n'; const LOCALES = { zh: 'zh-CN', pt: 'pt-BR', es: 'es-ES' }; diff --git a/docs/src/modules/components/GoogleAnalytics.js b/docs/src/modules/components/GoogleAnalytics.js index 0931581890bab3..e9771d3989c85d 100644 --- a/docs/src/modules/components/GoogleAnalytics.js +++ b/docs/src/modules/components/GoogleAnalytics.js @@ -4,7 +4,7 @@ import useMediaQuery from '@mui/material/useMediaQuery'; import { useRouter } from 'next/router'; import { useNoSsrCodeVariant } from 'docs/src/modules/utils/codeVariant'; import { useNoSsrCodeStyling } from 'docs/src/modules/utils/codeStylingSolution'; -import { useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage } from '@mui/docs/i18n'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import { getApiPageLayout } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption'; diff --git a/docs/src/modules/components/Head.tsx b/docs/src/modules/components/Head.tsx index c203562c298e73..7366a2ce2fd8ff 100644 --- a/docs/src/modules/components/Head.tsx +++ b/docs/src/modules/components/Head.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import NextHead from 'next/head'; import { useRouter } from 'next/router'; import { LANGUAGES_SSR } from 'docs/config'; -import { useUserLanguage, useTranslate } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage, useTranslate } from '@mui/docs/i18n'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; // #major-version-switch diff --git a/docs/src/modules/components/HooksApiContent.js b/docs/src/modules/components/HooksApiContent.js index 105364787953ee..804572f9fcf079 100644 --- a/docs/src/modules/components/HooksApiContent.js +++ b/docs/src/modules/components/HooksApiContent.js @@ -3,7 +3,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import kebabCase from 'lodash/kebabCase'; import { exactProp } from '@mui/utils'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import PropertiesSection from 'docs/src/modules/components/ApiPage/sections/PropertiesSection'; import HighlightedCode from 'docs/src/modules/components/HighlightedCode'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; diff --git a/docs/src/modules/components/JoyThemeBuilder.tsx b/docs/src/modules/components/JoyThemeBuilder.tsx index 51da85ac1ac359..e668edbed5979e 100644 --- a/docs/src/modules/components/JoyThemeBuilder.tsx +++ b/docs/src/modules/components/JoyThemeBuilder.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; -// @ts-ignore -import { TypeScript as TypeScriptIcon } from '@mui/docs'; +import TypeScriptIcon from '@mui/docs/svgIcons/TypeScript'; import startCase from 'lodash/startCase'; import { deepmerge } from '@mui/utils'; import { decomposeColor } from '@mui/system'; diff --git a/docs/src/modules/components/Link.tsx b/docs/src/modules/components/Link.tsx index e2784218dbe619..f708ab91ea4da3 100644 --- a/docs/src/modules/components/Link.tsx +++ b/docs/src/modules/components/Link.tsx @@ -4,7 +4,7 @@ import { useRouter } from 'next/router'; import NextLink, { LinkProps as NextLinkProps } from 'next/link'; import MuiLink, { LinkProps as MuiLinkProps } from '@mui/material/Link'; import { styled } from '@mui/material/styles'; -import { useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage } from '@mui/docs/i18n'; import { LANGUAGES_IGNORE_PAGES } from 'docs/config'; /** diff --git a/docs/src/modules/components/MarkdownDocs.js b/docs/src/modules/components/MarkdownDocs.js index 285f5634485137..68fce71531bd04 100644 --- a/docs/src/modules/components/MarkdownDocs.js +++ b/docs/src/modules/components/MarkdownDocs.js @@ -7,7 +7,7 @@ import { CssVarsProvider as JoyCssVarsProvider, useColorScheme } from '@mui/joy/ import RichMarkdownElement from 'docs/src/modules/components/RichMarkdownElement'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import AppLayoutDocs from 'docs/src/modules/components/AppLayoutDocs'; -import { useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useUserLanguage } from '@mui/docs/i18n'; import BrandingProvider from 'docs/src/BrandingProvider'; import Ad from 'docs/src/modules/components/Ad'; import AdGuest from 'docs/src/modules/components/AdGuest'; diff --git a/docs/src/modules/components/MarkdownDocsV2.js b/docs/src/modules/components/MarkdownDocsV2.js index 87a62168ed41db..59be4f176c2d91 100644 --- a/docs/src/modules/components/MarkdownDocsV2.js +++ b/docs/src/modules/components/MarkdownDocsV2.js @@ -11,7 +11,7 @@ import { getTranslatedHeader as getComponentTranslatedHeader } from 'docs/src/mo import RichMarkdownElement from 'docs/src/modules/components/RichMarkdownElement'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; import AppLayoutDocs from 'docs/src/modules/components/AppLayoutDocs'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import BrandingProvider from 'docs/src/BrandingProvider'; import Ad from 'docs/src/modules/components/Ad'; import { HEIGHT as AppFrameHeight } from 'docs/src/modules/components/AppFrame'; diff --git a/docs/src/modules/components/MaterialFreeTemplatesCollection.js b/docs/src/modules/components/MaterialFreeTemplatesCollection.js index 05c068fc5a63c0..4c86420825e2d9 100644 --- a/docs/src/modules/components/MaterialFreeTemplatesCollection.js +++ b/docs/src/modules/components/MaterialFreeTemplatesCollection.js @@ -11,7 +11,7 @@ import Typography from '@mui/material/Typography'; import Link from '@mui/material/Link'; import Visibility from '@mui/icons-material/Visibility'; import CodeRoundedIcon from '@mui/icons-material/CodeRounded'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const sourcePrefix = `${process.env.SOURCE_CODE_REPO}/tree/v${process.env.LIB_VERSION}`; diff --git a/docs/src/modules/components/MaterialShowcase.js b/docs/src/modules/components/MaterialShowcase.js index 254c9e0935aa32..8f0e6ceadbb372 100644 --- a/docs/src/modules/components/MaterialShowcase.js +++ b/docs/src/modules/components/MaterialShowcase.js @@ -10,7 +10,7 @@ import IconButton from '@mui/material/IconButton'; import GitHubIcon from '@mui/icons-material/GitHub'; import { alpha } from '@mui/material/styles'; import Link from 'docs/src/modules/components/Link'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; /** * The app structure: diff --git a/docs/src/modules/components/Notifications.js b/docs/src/modules/components/Notifications.js index 2ffa1a3e7cb79a..6fc4cb9857a4eb 100644 --- a/docs/src/modules/components/Notifications.js +++ b/docs/src/modules/components/Notifications.js @@ -14,7 +14,7 @@ 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'; +import { useUserLanguage, useTranslate } from '@mui/docs/i18n'; async function fetchNotifications() { if (process.env.NODE_ENV === 'development') { diff --git a/docs/src/modules/components/RichMarkdownElement.js b/docs/src/modules/components/RichMarkdownElement.js index d13a19e384e943..449b1df5adb6a9 100644 --- a/docs/src/modules/components/RichMarkdownElement.js +++ b/docs/src/modules/components/RichMarkdownElement.js @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n'; +import { useTranslate, useUserLanguage } from '@mui/docs/i18n'; import MarkdownElement from 'docs/src/modules/components/MarkdownElement'; import HighlightedCodeWithTabs from 'docs/src/modules/components/HighlightedCodeWithTabs'; import Demo from 'docs/src/modules/components/Demo'; diff --git a/docs/src/modules/components/SkipLink.tsx b/docs/src/modules/components/SkipLink.tsx index cafdd56f84409d..9e9f8536758b5d 100644 --- a/docs/src/modules/components/SkipLink.tsx +++ b/docs/src/modules/components/SkipLink.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import MuiLink from '@mui/material/Link'; import { styled } from '@mui/material/styles'; -import { useTranslate } from 'docs/src/modules/utils/i18n'; +import { useTranslate } from '@mui/docs/i18n'; const StyledLink = styled(MuiLink)(({ theme }) => ({ position: 'fixed', diff --git a/docs/src/modules/components/ThemeContext.js b/docs/src/modules/components/ThemeContext.js index a30fdcc08d7702..50fe41c5a7adf5 100644 --- a/docs/src/modules/components/ThemeContext.js +++ b/docs/src/modules/components/ThemeContext.js @@ -10,7 +10,7 @@ import { enUS, zhCN, ptBR } from '@mui/material/locale'; 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'; +import { useUserLanguage } from '@mui/docs/i18n'; import { getDesignTokens, getThemedComponents, diff --git a/docs/src/modules/utils/i18n.js b/docs/src/modules/utils/i18n.js index 7f26e577b36c60..9dc5f483b70371 100644 --- a/docs/src/modules/utils/i18n.js +++ b/docs/src/modules/utils/i18n.js @@ -1,93 +1,3 @@ -import * as React from 'react'; -import PropTypes from 'prop-types'; - -function mapTranslations(req) { - const translations = {}; - req.keys().forEach((filename) => { - const match = filename.match(/-([a-z]{2}).json$/); - - if (match) { - translations[match[1]] = req(filename); - } else { - translations.en = req(filename); - } - }); - return translations; -} - -const req = require.context('docs/translations', false, /translations.*\.json$/); -const translations = mapTranslations(req); - -function getPath(obj, path) { - if (!path || typeof path !== 'string') { - return null; - } - - return path.split('.').reduce((acc, item) => (acc && acc[item] ? acc[item] : null), obj); -} - -const UserLanguageContext = React.createContext({ userLanguage: '', setUserLanguage: () => {} }); -if (process.env.NODE_ENV !== 'production') { - UserLanguageContext.displayName = 'UserLanguage'; -} - -export function UserLanguageProvider(props) { - const { children, defaultUserLanguage } = props; - - const [userLanguage, setUserLanguage] = React.useState(defaultUserLanguage); - - const contextValue = React.useMemo(() => { - return { userLanguage, setUserLanguage }; - }, [userLanguage]); - - return ( - {children} - ); -} - -UserLanguageProvider.propTypes = { - children: PropTypes.node.isRequired, - defaultUserLanguage: PropTypes.string, -}; - -export function useUserLanguage() { - return React.useContext(UserLanguageContext).userLanguage; -} - -export function useSetUserLanguage() { - return React.useContext(UserLanguageContext).setUserLanguage; -} - -const warnedOnce = {}; - -export function useTranslate() { - const userLanguage = useUserLanguage(); - - return React.useMemo( - () => - function translate(key, options = {}) { - const { ignoreWarning = false } = options; - const wordings = translations[userLanguage]; - - if (!wordings) { - console.error(`Missing language: ${userLanguage}.`); - return '…'; - } - - const translation = getPath(wordings, key); - - if (!translation) { - const fullKey = `${userLanguage}:${key}`; - // No warnings in CI env - if (!ignoreWarning && !warnedOnce[fullKey] && typeof window !== 'undefined') { - console.error(`Missing translation for ${fullKey}`); - warnedOnce[fullKey] = true; - } - return getPath(translations.en, key); - } - - return translation; - }, - [userLanguage], - ); -} +// Backwards compatibility for Toolpad X. +// TODO: remove when X/Toolpad migrated to `@mui/docs/i18n` +export * from '@mui/docs/i18n'; diff --git a/packages/mui-docs/package.json b/packages/mui-docs/package.json index db0678f55ee6f5..622b9641b3d8df 100644 --- a/packages/mui-docs/package.json +++ b/packages/mui-docs/package.json @@ -23,11 +23,12 @@ }, "homepage": "https://github.com/mui/material-ui/tree/master/packages/mui-docs", "scripts": { - "build": "pnpm build:legacy && pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:copy-files", + "build": "pnpm build:legacy && pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files", "build:legacy": "node ../../scripts/build.mjs legacy", "build:modern": "echo 'Skip modern build'", "build:node": "node ../../scripts/build.mjs node", "build:stable": "node ../../scripts/build.mjs stable", + "build:types": "node ../../scripts/buildTypes.mjs", "build:copy-files": "node ../../scripts/copyFiles.mjs", "prebuild": "rimraf build", "release": "pnpm build && pnpm publish", @@ -41,6 +42,8 @@ "prop-types": "^15.8.1" }, "devDependencies": { + "@types/node": "^18.19.10", + "@types/prop-types": "^15.7.11", "@types/react": "^18.2.48", "react": "^18.2.0" }, diff --git a/packages/mui-docs/src/i18n/index.tsx b/packages/mui-docs/src/i18n/index.tsx new file mode 100644 index 00000000000000..037680d8e3ed01 --- /dev/null +++ b/packages/mui-docs/src/i18n/index.tsx @@ -0,0 +1,121 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; + +declare global { + interface NodeRequire { + context: (path: string, useSubdirectories: boolean, regex: RegExp) => RequireContext; + } +} + +interface RequireContext { + (req: string): string; + keys: () => string[]; +} + +function mapTranslations(req: RequireContext) { + const translations: Record = {}; + req.keys().forEach((filename) => { + const match = filename.match(/-([a-z]{2}).json$/); + + if (match) { + translations[match[1]] = req(filename); + } else { + translations.en = req(filename); + } + }); + return translations; +} + +const req: RequireContext = require.context('docs/translations', false, /translations.*\.json$/); +const translations = mapTranslations(req); + +function getPath(obj: any, path: string): any { + if (!path || typeof path !== 'string') { + return null; + } + + return path.split('.').reduce((acc, item) => (acc && acc[item] ? acc[item] : null), obj); +} + +interface UserLanguageContextValue { + userLanguage: string; + setUserLanguage: React.Dispatch>; +} + +const UserLanguageContext = React.createContext({ + userLanguage: '', + setUserLanguage: () => {}, +}); +if (process.env.NODE_ENV !== 'production') { + UserLanguageContext.displayName = 'UserLanguage'; +} + +export interface UserLanguageProviderProps { + children: React.ReactNode; + defaultUserLanguage: string; +} + +export function UserLanguageProvider(props: UserLanguageProviderProps) { + const { children, defaultUserLanguage } = props; + + const [userLanguage, setUserLanguage] = React.useState(defaultUserLanguage); + + const contextValue = React.useMemo(() => { + return { userLanguage, setUserLanguage }; + }, [userLanguage]); + + return ( + {children} + ); +} + +UserLanguageProvider.propTypes = { + children: PropTypes.node.isRequired, + defaultUserLanguage: PropTypes.string, +}; + +export function useUserLanguage() { + return React.useContext(UserLanguageContext).userLanguage; +} + +export function useSetUserLanguage() { + return React.useContext(UserLanguageContext).setUserLanguage; +} + +const warnedOnce: Record = {}; + +export interface TranslateOptions { + ignoreWarning?: boolean; +} + +export function useTranslate() { + const userLanguage = useUserLanguage(); + + return React.useMemo( + () => + function translate(key: string, options: TranslateOptions = {}) { + const { ignoreWarning = false } = options; + const wordings = translations[userLanguage]; + + if (!wordings) { + console.error(`Missing language: ${userLanguage}.`); + return '…'; + } + + const translation = getPath(wordings, key); + + if (!translation) { + const fullKey = `${userLanguage}:${key}`; + // No warnings in CI env + if (!ignoreWarning && !warnedOnce[fullKey] && typeof window !== 'undefined') { + console.error(`Missing translation for ${fullKey}`); + warnedOnce[fullKey] = true; + } + return getPath(translations.en, key); + } + + return translation; + }, + [userLanguage], + ); +} diff --git a/packages/mui-docs/src/index.d.ts b/packages/mui-docs/src/index.d.ts deleted file mode 100644 index e69de29bb2d1d6..00000000000000 diff --git a/packages/mui-docs/src/index.js b/packages/mui-docs/src/index.js deleted file mode 100644 index 8ae6d57e29c695..00000000000000 --- a/packages/mui-docs/src/index.js +++ /dev/null @@ -1,4 +0,0 @@ -export { default as FileDownload } from './svgIcons/FileDownload'; -export { default as JavaScript } from './svgIcons/JavaScript'; -export { default as NProgressBar } from './NProgressBar'; -export { default as TypeScript } from './svgIcons/TypeScript'; diff --git a/packages/mui-docs/tsconfig.build.json b/packages/mui-docs/tsconfig.build.json new file mode 100644 index 00000000000000..bc9de8db7f41fd --- /dev/null +++ b/packages/mui-docs/tsconfig.build.json @@ -0,0 +1,15 @@ +{ + // This config is for emitting declarations (.d.ts) only + // Actual .ts source files are transpiled via babel + "extends": "./tsconfig.json", + "compilerOptions": { + "composite": true, + "declaration": true, + "noEmit": false, + "emitDeclarationOnly": true, + "outDir": "build", + "rootDir": "./src" + }, + "include": ["src/**/*.ts*"], + "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"] +} diff --git a/packages/mui-docs/tsconfig.json b/packages/mui-docs/tsconfig.json new file mode 100644 index 00000000000000..3f6f21cc2bf678 --- /dev/null +++ b/packages/mui-docs/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "types": ["react", "node"] + }, + "include": ["src/**/*", "test/**/*"] +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index aa78bcd5868b9b..74f330de56f3eb 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1249,6 +1249,12 @@ importers: specifier: ^15.8.1 version: 15.8.1 devDependencies: + '@types/node': + specifier: ^18.19.10 + version: 18.19.10 + '@types/prop-types': + specifier: ^15.7.11 + version: 15.7.11 '@types/react': specifier: ^18.2.48 version: 18.2.48