From fe34483b6d04d4ead8665a9f6831928fc75961ef Mon Sep 17 00:00:00 2001 From: Pedro Ferreira <10789765+apedroferreira@users.noreply.github.com> Date: Thu, 17 Oct 2024 18:52:50 +0100 Subject: [PATCH] [docs] Docs/demo cleanup (#4268) --- .eslintrc.js | 21 +++++++++++++++++++ .../core/components/account/AccountCustom.js | 3 ++- .../core/components/account/AccountCustom.tsx | 6 +++--- .../components/account/AccountDemoSignedIn.js | 3 ++- .../account/AccountDemoSignedIn.tsx | 6 +++--- .../account/AccountDemoSignedOut.js | 3 ++- .../account/AccountDemoSignedOut.tsx | 6 +++--- .../core/components/account/AccountSlots.js | 3 ++- .../core/components/account/AccountSlots.tsx | 6 +++--- .../app-provider/AppProviderBasic.js | 13 +++--------- .../app-provider/AppProviderBasic.tsx | 16 ++++---------- .../app-provider/AppProviderBasic.tsx.preview | 2 +- .../app-provider/AppProviderTheme.js | 13 +++--------- .../app-provider/AppProviderTheme.tsx | 16 ++++---------- .../app-provider/AppProviderTheme.tsx.preview | 2 +- .../DashboardLayoutAccount.js | 13 +++--------- .../DashboardLayoutAccount.tsx | 20 +++++++----------- .../DashboardLayoutAccount.tsx.preview | 2 +- .../dashboard-layout/DashboardLayoutBasic.js | 13 +++--------- .../dashboard-layout/DashboardLayoutBasic.tsx | 16 ++++---------- .../DashboardLayoutBasic.tsx.preview | 2 +- .../DashboardLayoutBranding.js | 13 +++--------- .../DashboardLayoutBranding.tsx | 16 ++++---------- .../DashboardLayoutBranding.tsx.preview | 2 +- .../DashboardLayoutFullScreen.js | 11 ++-------- .../DashboardLayoutFullScreen.tsx | 14 +++---------- .../DashboardLayoutNavigationActions.js | 13 +++--------- .../DashboardLayoutNavigationActions.tsx | 16 ++++---------- ...shboardLayoutNavigationActions.tsx.preview | 2 +- .../DashboardLayoutNavigationDividers.js | 13 +++--------- .../DashboardLayoutNavigationDividers.tsx | 14 +++---------- ...hboardLayoutNavigationDividers.tsx.preview | 2 +- .../DashboardLayoutNavigationHeadings.js | 13 +++--------- .../DashboardLayoutNavigationHeadings.tsx | 14 +++---------- ...hboardLayoutNavigationHeadings.tsx.preview | 2 +- .../DashboardLayoutNavigationLinks.js | 13 +++--------- .../DashboardLayoutNavigationLinks.tsx | 14 +++---------- ...DashboardLayoutNavigationLinks.tsx.preview | 2 +- .../DashboardLayoutNavigationNested.js | 13 +++--------- .../DashboardLayoutNavigationNested.tsx | 14 +++---------- ...ashboardLayoutNavigationNested.tsx.preview | 2 +- .../DashboardLayoutNoMiniSidebar.js | 13 +++--------- .../DashboardLayoutNoMiniSidebar.tsx | 16 ++++---------- .../DashboardLayoutNoMiniSidebar.tsx.preview | 2 +- .../DashboardLayoutPattern.js | 14 +++---------- .../DashboardLayoutPattern.tsx | 18 +++------------- .../DashboardLayoutPattern.tsx.preview | 2 +- .../DashboardLayoutSidebarCollapsed.tsx | 7 +++++-- .../DashboardLayoutSidebarHidden.js | 13 +++--------- .../DashboardLayoutSidebarHidden.tsx | 14 +++---------- .../DashboardLayoutSidebarHidden.tsx.preview | 2 +- .../dashboard-layout/DashboardLayoutSlots.js | 13 +++--------- .../dashboard-layout/DashboardLayoutSlots.tsx | 21 +++++++------------ .../DashboardLayoutSlots.tsx.preview | 2 +- .../page-container/ActionsPageContainer.js | 2 +- .../page-container/ActionsPageContainer.tsx | 2 +- .../page-container/BasicPageContainer.js | 2 +- .../page-container/BasicPageContainer.tsx | 2 +- .../page-container/CustomPageContainer.js | 2 +- .../page-container/CustomPageContainer.tsx | 2 +- .../TitleBreadcrumbsPageContainer.js | 2 +- .../TitleBreadcrumbsPageContainer.tsx | 2 +- .../LocalStorageStateCustom.js | 2 +- .../LocalStorageStateCustom.tsx | 3 ++- .../LocalStorageStateError.js | 2 +- .../LocalStorageStateError.tsx | 3 ++- .../LocalStorageStateString.js | 2 +- .../LocalStorageStateString.tsx | 2 +- .../persistent-state/LocalStorageStateZod.js | 2 +- .../persistent-state/LocalStorageStateZod.tsx | 3 ++- .../sign-in-page/AuthJsSignInApp.js | 1 - .../sign-in-page/AuthJsSignInApp.tsx | 3 +-- .../sign-in-page/BrandingSignInPage.js | 3 ++- .../sign-in-page/BrandingSignInPage.tsx | 3 ++- .../sign-in-page/CredentialsSignInPage.js | 3 ++- .../sign-in-page/CredentialsSignInPage.tsx | 3 ++- .../NotificationsSignInPageError.js | 3 ++- .../NotificationsSignInPageError.tsx | 7 ++++++- .../sign-in-page/OAuthSignInPage.js | 3 ++- .../sign-in-page/OAuthSignInPage.tsx | 3 ++- .../sign-in-page/SlotPropsSignIn.js | 3 ++- .../sign-in-page/SlotPropsSignIn.tsx | 3 ++- .../components/sign-in-page/SlotsSignIn.js | 3 ++- .../components/sign-in-page/SlotsSignIn.tsx | 3 ++- .../sign-in-page/ThemeSignInPage.js | 3 ++- .../sign-in-page/ThemeSignInPage.tsx | 3 ++- .../components/sign-in-page/sign-in-page.md | 3 +-- .../toolpad/core/introduction/ReactRouter.tsx | 2 +- .../core/introduction/TutorialDefault.js | 2 +- .../core/introduction/TutorialDefault.tsx | 2 +- .../core/introduction/TutorialPages.js | 2 +- .../core/introduction/TutorialPages.tsx | 2 +- .../toolpad/core/introduction/integration.md | 5 ++--- .../components/landing/ToolpadAuthDemo.tsx | 3 ++- .../landing/ToolpadDashboardLayout.tsx | 3 +-- .../landing/ToolpadPageContainerDemo.tsx | 2 +- .../src/pages/auth/signin.tsx | 3 +-- .../src/app/auth/signin/page.tsx | 3 +-- examples/core-vite/src/App.tsx | 3 +-- packages/create-toolpad-app/src/index.ts | 2 +- .../src/templates/auth/auth.ts | 4 ++-- .../templates/auth/nextjs-app/signInPage.ts | 3 +-- .../src/templates/auth/utils.ts | 2 +- packages/create-toolpad-app/src/types.ts | 2 +- .../src/DashboardLayout/ThemeSwitcher.tsx | 1 + .../src/DashboardLayout/ToolbarActions.tsx | 1 + .../src/SignInPage/SignInPage.tsx | 3 ++- packages/toolpad-core/src/internal/context.ts | 3 +++ .../src/{internals => internal}/demo.tsx | 2 -- packages/toolpad-core/src/internal/index.ts | 3 --- packages/toolpad-core/src/internal/index.tsx | 4 ++++ packages/toolpad-core/src/internals/index.tsx | 1 - packages/toolpad-core/src/shared/context.ts | 2 -- .../nextjs/src/app/auth/signin/actions.ts | 2 +- playground/vite/src/App.tsx | 3 +-- 115 files changed, 251 insertions(+), 432 deletions(-) create mode 100644 packages/toolpad-core/src/internal/context.ts rename packages/toolpad-core/src/{internals => internal}/demo.tsx (95%) delete mode 100644 packages/toolpad-core/src/internal/index.ts create mode 100644 packages/toolpad-core/src/internal/index.tsx delete mode 100644 packages/toolpad-core/src/internals/index.tsx diff --git a/.eslintrc.js b/.eslintrc.js index 795d73fa5aa..b4f4ac25eb6 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,6 +2,11 @@ const baseline = require('@mui/monorepo/.eslintrc'); const path = require('path'); const lodash = require('lodash'); +const OneLevelImportMessage = [ + 'Prefer one level nested imports to avoid bundling everything in dev mode or breaking CJS/ESM split.', + 'See https://github.com/mui/material-ui/pull/24147 for the kind of win it can unlock.', +].join('\n'); + const ALLOWED_LODASH_METHODS = new Set(['throttle', 'debounce', 'set']); const noRestrictedImports = { @@ -195,5 +200,21 @@ module.exports = { files: ['packages/toolpad-studio/src/**/*'], rules: { 'react-compiler/react-compiler': 'off' }, }, + { + files: ['docs/**/*{.ts,.tsx,.js}'], + rules: { + 'no-restricted-imports': [ + 'error', + { + paths: [ + { + name: '@toolpad/core', + message: OneLevelImportMessage, + }, + ], + }, + ], + }, + }, ], }; diff --git a/docs/data/toolpad/core/components/account/AccountCustom.js b/docs/data/toolpad/core/components/account/AccountCustom.js index a28fc6d7756..526cde58938 100644 --- a/docs/data/toolpad/core/components/account/AccountCustom.js +++ b/docs/data/toolpad/core/components/account/AccountCustom.js @@ -1,6 +1,7 @@ import * as React from 'react'; import Typography from '@mui/material/Typography'; -import { Account, AuthenticationContext, SessionContext } from '@toolpad/core'; +import { AuthenticationContext, SessionContext } from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountCustom.tsx b/docs/data/toolpad/core/components/account/AccountCustom.tsx index 9bc161b8c96..e2ac4f7fe64 100644 --- a/docs/data/toolpad/core/components/account/AccountCustom.tsx +++ b/docs/data/toolpad/core/components/account/AccountCustom.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; import Typography from '@mui/material/Typography'; import { - Account, AuthenticationContext, SessionContext, - Session, -} from '@toolpad/core'; + type Session, +} from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountDemoSignedIn.js b/docs/data/toolpad/core/components/account/AccountDemoSignedIn.js index 7a0cf49b2ca..c8b9b8a9c0c 100644 --- a/docs/data/toolpad/core/components/account/AccountDemoSignedIn.js +++ b/docs/data/toolpad/core/components/account/AccountDemoSignedIn.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { Account, AuthenticationContext, SessionContext } from '@toolpad/core'; +import { AuthenticationContext, SessionContext } from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountDemoSignedIn.tsx b/docs/data/toolpad/core/components/account/AccountDemoSignedIn.tsx index f3bdaf30b63..7cd00c266e1 100644 --- a/docs/data/toolpad/core/components/account/AccountDemoSignedIn.tsx +++ b/docs/data/toolpad/core/components/account/AccountDemoSignedIn.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import { - Account, AuthenticationContext, SessionContext, - Session, -} from '@toolpad/core'; + type Session, +} from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountDemoSignedOut.js b/docs/data/toolpad/core/components/account/AccountDemoSignedOut.js index 5ead279cf0f..c63ddabcf9a 100644 --- a/docs/data/toolpad/core/components/account/AccountDemoSignedOut.js +++ b/docs/data/toolpad/core/components/account/AccountDemoSignedOut.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { Account, AuthenticationContext, SessionContext } from '@toolpad/core'; +import { AuthenticationContext, SessionContext } from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountDemoSignedOut.tsx b/docs/data/toolpad/core/components/account/AccountDemoSignedOut.tsx index b680667762d..1ca57c63430 100644 --- a/docs/data/toolpad/core/components/account/AccountDemoSignedOut.tsx +++ b/docs/data/toolpad/core/components/account/AccountDemoSignedOut.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import { - Account, AuthenticationContext, SessionContext, - Session, -} from '@toolpad/core'; + type Session, +} from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; const demoSession = { user: { diff --git a/docs/data/toolpad/core/components/account/AccountSlots.js b/docs/data/toolpad/core/components/account/AccountSlots.js index 31051b0adab..d825aaba8f0 100644 --- a/docs/data/toolpad/core/components/account/AccountSlots.js +++ b/docs/data/toolpad/core/components/account/AccountSlots.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { Account, AuthenticationContext, SessionContext } from '@toolpad/core'; +import { AuthenticationContext, SessionContext } from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; import CustomMenuItems from './CustomMenu'; const demoSession = { diff --git a/docs/data/toolpad/core/components/account/AccountSlots.tsx b/docs/data/toolpad/core/components/account/AccountSlots.tsx index 43f9af3a30f..52eb96ce395 100644 --- a/docs/data/toolpad/core/components/account/AccountSlots.tsx +++ b/docs/data/toolpad/core/components/account/AccountSlots.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import { - Account, AuthenticationContext, SessionContext, - Session, -} from '@toolpad/core'; + type Session, +} from '@toolpad/core/AppProvider'; +import { Account } from '@toolpad/core/Account'; import CustomMenuItems from './CustomMenu'; const demoSession = { diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.js b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.js index bde382e584b..3ed2c822614 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.js +++ b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.js @@ -7,6 +7,7 @@ import DashboardIcon from '@mui/icons-material/Dashboard'; import TimelineIcon from '@mui/icons-material/Timeline'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -64,15 +65,7 @@ DemoPageContent.propTypes = { function AppProviderBasic(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/page'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/page'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -86,7 +79,7 @@ function AppProviderBasic(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx index 677a91fb7a8..6d8fb9b3a5f 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx +++ b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx @@ -4,9 +4,9 @@ import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import TimelineIcon from '@mui/icons-material/Timeline'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Navigation, Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -68,15 +68,7 @@ interface DemoProps { export default function AppProviderBasic(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/page'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/page'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -90,7 +82,7 @@ export default function AppProviderBasic(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx.preview b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx.preview index 2f597acc500..32de6b62d7e 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx.preview +++ b/docs/data/toolpad/core/components/app-provider/AppProviderBasic.tsx.preview @@ -5,6 +5,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.js b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.js index c7896628fd2..c064cf711be 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.js +++ b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.js @@ -7,6 +7,7 @@ import DashboardIcon from '@mui/icons-material/Dashboard'; import TimelineIcon from '@mui/icons-material/Timeline'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -81,15 +82,7 @@ DemoPageContent.propTypes = { function AppProviderTheme(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/page'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/page'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -103,7 +96,7 @@ function AppProviderTheme(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx index 2fc7a3a1340..d6a772be78c 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx +++ b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx @@ -4,9 +4,9 @@ import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import TimelineIcon from '@mui/icons-material/Timeline'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Navigation, Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -85,15 +85,7 @@ interface DemoProps { export default function AppProviderTheme(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/page'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/page'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -107,7 +99,7 @@ export default function AppProviderTheme(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx.preview b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx.preview index 2112ddfced7..e884a3790fd 100644 --- a/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx.preview +++ b/docs/data/toolpad/core/components/app-provider/AppProviderTheme.tsx.preview @@ -5,6 +5,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.js index e68e5f83b52..27d0b93c54e 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.js @@ -6,6 +6,7 @@ import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -79,15 +80,7 @@ function DashboardLayoutAccount(props) { }; }, []); - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -103,7 +96,7 @@ function DashboardLayoutAccount(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx index 5eeee6b73cd..6439a2498fd 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx @@ -3,9 +3,13 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { + AppProvider, + type Session, + type Navigation, +} from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Session, Router, Navigation } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -83,15 +87,7 @@ export default function DashboardLayoutAccount(props: DemoProps) { }; }, []); - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -107,7 +103,7 @@ export default function DashboardLayoutAccount(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx.preview index 52aa91ab258..b4f63c0de29 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutAccount.tsx.preview @@ -7,6 +7,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.js index 305fc5c4656..e403954223a 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.js @@ -10,6 +10,7 @@ import DescriptionIcon from '@mui/icons-material/Description'; import LayersIcon from '@mui/icons-material/Layers'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -96,15 +97,7 @@ DemoPageContent.propTypes = { function DashboardLayoutBasic(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -118,7 +111,7 @@ function DashboardLayoutBasic(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx index c2a2377d12d..b8ec5f9b01d 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx @@ -7,9 +7,9 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import BarChartIcon from '@mui/icons-material/BarChart'; import DescriptionIcon from '@mui/icons-material/Description'; import LayersIcon from '@mui/icons-material/Layers'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router, Navigation } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -100,15 +100,7 @@ interface DemoProps { export default function DashboardLayoutBasic(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -122,7 +114,7 @@ export default function DashboardLayoutBasic(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx.preview index 2f597acc500..32de6b62d7e 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBasic.tsx.preview @@ -5,6 +5,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.js index 907f4ab13ed..ca037f489a8 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.js @@ -7,6 +7,7 @@ import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -60,15 +61,7 @@ DemoPageContent.propTypes = { function DashboardLayoutBranding(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -86,7 +79,7 @@ function DashboardLayoutBranding(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx index 7d21e346d1a..6344cc63b92 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx @@ -4,9 +4,9 @@ import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Navigation, Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -64,15 +64,7 @@ interface DemoProps { export default function DashboardLayoutBranding(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -90,7 +82,7 @@ export default function DashboardLayoutBranding(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx.preview index f47143bf17f..af7a6ebf4a5 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutBranding.tsx.preview @@ -9,6 +9,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.js index 2f71df3e348..2205c2f6f0b 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.js @@ -4,6 +4,7 @@ import { createTheme } from '@mui/material/styles'; import MapIcon from '@mui/icons-material/Map'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -32,15 +33,7 @@ const demoTheme = createTheme({ function DashboardLayoutFullScreen(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/map'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/map'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.tsx index 313782ce9db..f526b2cda2c 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutFullScreen.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import { createTheme } from '@mui/material/styles'; import MapIcon from '@mui/icons-material/Map'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router, Navigation } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -40,15 +40,7 @@ interface DemoProps { export default function DashboardLayoutFullScreen(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/map'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/map'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.js index a501ab46c2a..ecdfe76da68 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.js @@ -14,6 +14,7 @@ import CallMadeIcon from '@mui/icons-material/CallMade'; import CallReceivedIcon from '@mui/icons-material/CallReceived'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -69,15 +70,7 @@ const CALLS_NAVIGATION = [ function DashboardLayoutNavigationActions(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/contacts'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/contacts'); const [popoverAnchorEl, setPopoverAnchorEl] = React.useState(null); @@ -143,7 +136,7 @@ function DashboardLayoutNavigationActions(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx index f0b0f6ba7b6..2431c0da069 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx @@ -11,9 +11,9 @@ import CallIcon from '@mui/icons-material/Call'; import MoreHorizIcon from '@mui/icons-material/MoreHoriz'; import CallMadeIcon from '@mui/icons-material/CallMade'; import CallReceivedIcon from '@mui/icons-material/CallReceived'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Navigation, Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -73,15 +73,7 @@ interface DemoProps { export default function DashboardLayoutNavigationActions(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/contacts'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/contacts'); const [popoverAnchorEl, setPopoverAnchorEl] = React.useState(null); @@ -148,7 +140,7 @@ export default function DashboardLayoutNavigationActions(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx.preview index 5e09aae5dfb..55cf5ecc4f6 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationActions.tsx.preview @@ -19,6 +19,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.js index 433c0a4a17a..8ce503b3e41 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.js @@ -6,6 +6,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -46,15 +47,7 @@ DemoPageContent.propTypes = { function DashboardLayoutNavigationDividers(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/star-wars'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/star-wars'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -80,7 +73,7 @@ function DashboardLayoutNavigationDividers(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx index f74550a4afd..a034bb281eb 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx @@ -5,7 +5,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -50,15 +50,7 @@ interface DemoProps { export default function DashboardLayoutNavigationDividers(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/star-wars'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/star-wars'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -84,7 +76,7 @@ export default function DashboardLayoutNavigationDividers(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx.preview index d6883665d81..f8faadb4e36 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationDividers.tsx.preview @@ -17,6 +17,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.js index 21b4de5ba33..337ca3a1c89 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.js @@ -6,6 +6,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -46,15 +47,7 @@ DemoPageContent.propTypes = { function DashboardLayoutNavigationHeadings(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/lion'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/lion'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -87,7 +80,7 @@ function DashboardLayoutNavigationHeadings(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx index bb82f730158..d427ff779fb 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx @@ -5,7 +5,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -50,15 +50,7 @@ interface DemoProps { export default function DashboardLayoutNavigationHeadings(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/lion'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/lion'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -91,7 +83,7 @@ export default function DashboardLayoutNavigationHeadings(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx.preview index 35a5f93e6e2..9768a4f5bf9 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationHeadings.tsx.preview @@ -24,6 +24,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.js index 67be207751a..e3417db76c9 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.js @@ -6,6 +6,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -46,15 +47,7 @@ DemoPageContent.propTypes = { function DashboardLayoutNavigationLinks(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/home'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/home'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -79,7 +72,7 @@ function DashboardLayoutNavigationLinks(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx index 2eab9870e76..4428dab4aec 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx @@ -5,7 +5,7 @@ import { createTheme } from '@mui/material/styles'; import DescriptionIcon from '@mui/icons-material/Description'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -50,15 +50,7 @@ interface DemoProps { export default function DashboardLayoutNavigationLinks(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/home'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/home'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -83,7 +75,7 @@ export default function DashboardLayoutNavigationLinks(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx.preview index 3c159f307c4..a80d1b4201a 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationLinks.tsx.preview @@ -16,6 +16,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.js index 9e9e0b49fe9..62fef512955 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.js @@ -7,6 +7,7 @@ import DescriptionIcon from '@mui/icons-material/Description'; import FolderIcon from '@mui/icons-material/Folder'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -47,15 +48,7 @@ DemoPageContent.propTypes = { function DashboardLayoutNavigationNested(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/movies/lord-of-the-rings'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/movies/lord-of-the-rings'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -87,7 +80,7 @@ function DashboardLayoutNavigationNested(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx index 3a48ffe38dc..b818a230e8b 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx @@ -6,7 +6,7 @@ import DescriptionIcon from '@mui/icons-material/Description'; import FolderIcon from '@mui/icons-material/Folder'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -51,15 +51,7 @@ interface DemoProps { export default function DashboardLayoutNavigationNested(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/movies/lord-of-the-rings'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/movies/lord-of-the-rings'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -91,7 +83,7 @@ export default function DashboardLayoutNavigationNested(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx.preview index efc79cf2812..8d29973fa3a 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNavigationNested.tsx.preview @@ -23,6 +23,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.js index f7f9d0c0d35..8018cb8092a 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.js @@ -8,6 +8,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import BarChartIcon from '@mui/icons-material/BarChart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -66,15 +67,7 @@ DemoPageContent.propTypes = { function DashboardLayoutNoMiniSidebar(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -87,7 +80,7 @@ function DashboardLayoutNoMiniSidebar(props) { window={demoWindow} > - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx index 2e40ea5806d..c9b65ffa7e2 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx @@ -5,9 +5,9 @@ import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import BarChartIcon from '@mui/icons-material/BarChart'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router, Navigation } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -70,15 +70,7 @@ interface DemoProps { export default function DashboardLayoutNoMiniSidebar(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -91,7 +83,7 @@ export default function DashboardLayoutNoMiniSidebar(props: DemoProps) { window={demoWindow} > - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx.preview index 8e2ba80df21..d103d12cec8 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutNoMiniSidebar.tsx.preview @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.js index 2411a9b1fb5..83912016e33 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.js @@ -9,6 +9,7 @@ import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -77,16 +78,7 @@ DemoPageContent.propTypes = { function DashboardLayoutPattern(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/orders'); - const navigate = React.useCallback((path) => setPathname(String(path)), []); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate, - }; - }, [pathname, navigate]); + const router = useDemoRouter('/orders'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -112,7 +104,7 @@ function DashboardLayoutPattern(props) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx index 7a363800c73..f504068d096 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx @@ -8,7 +8,7 @@ import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -86,19 +86,7 @@ interface DemoProps { export default function DashboardLayoutPattern(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/orders'); - const navigate = React.useCallback( - (path: string | URL) => setPathname(String(path)), - [], - ); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate, - }; - }, [pathname, navigate]); + const router = useDemoRouter('/orders'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -124,7 +112,7 @@ export default function DashboardLayoutPattern(props: DemoProps) { window={demoWindow} > - + // preview-end diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx.preview index 045c9ca0ac7..78092c723d1 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutPattern.tsx.preview @@ -17,6 +17,6 @@ window={demoWindow} > - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarCollapsed.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarCollapsed.tsx index a0fe78f7f2e..2877b54cd4f 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarCollapsed.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarCollapsed.tsx @@ -5,9 +5,12 @@ import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import BarChartIcon from '@mui/icons-material/BarChart'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { + AppProvider, + type Router, + type Navigation, +} from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router, Navigation } from '@toolpad/core'; const NAVIGATION: Navigation = [ { diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.js index 7f32ed5d8fd..8fb42b4408e 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.js @@ -5,6 +5,7 @@ import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -45,15 +46,7 @@ DemoPageContent.propTypes = { function DashboardLayoutSidebarHidden(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -61,7 +54,7 @@ function DashboardLayoutSidebarHidden(props) { return ( - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx index bd05c3758d7..9b2bb58c4a7 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx @@ -4,7 +4,7 @@ import Typography from '@mui/material/Typography'; import { createTheme } from '@mui/material/styles'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Router } from '@toolpad/core'; +import { useDemoRouter } from '@toolpad/core/internal'; const demoTheme = createTheme({ cssVariables: { @@ -49,15 +49,7 @@ interface DemoProps { export default function DashboardLayoutSidebarHidden(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -65,7 +57,7 @@ export default function DashboardLayoutSidebarHidden(props: DemoProps) { return ( - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx.preview index aff732ec858..4fd4fe5422d 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSidebarHidden.tsx.preview @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.js b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.js index 0345bb2057a..b8c9169d49b 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.js +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.js @@ -11,6 +11,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import SearchIcon from '@mui/icons-material/Search'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { @@ -119,15 +120,7 @@ SidebarFooter.propTypes = { function DashboardLayoutSlots(props) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -142,7 +135,7 @@ function DashboardLayoutSlots(props) { - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx index 9057ccea19d..89afce5d4ce 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx @@ -8,9 +8,12 @@ import { createTheme } from '@mui/material/styles'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import SearchIcon from '@mui/icons-material/Search'; -import { AppProvider } from '@toolpad/core/AppProvider'; -import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import type { Navigation, Router, SidebarFooterProps } from '@toolpad/core'; +import { AppProvider, type Navigation } from '@toolpad/core/AppProvider'; +import { + DashboardLayout, + type SidebarFooterProps, +} from '@toolpad/core/DashboardLayout'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION: Navigation = [ { @@ -119,15 +122,7 @@ interface DemoProps { export default function DashboardLayoutSlots(props: DemoProps) { const { window } = props; - const [pathname, setPathname] = React.useState('/dashboard'); - - const router = React.useMemo(() => { - return { - pathname, - searchParams: new URLSearchParams(), - navigate: (path) => setPathname(String(path)), - }; - }, [pathname]); + const router = useDemoRouter('/dashboard'); // Remove this const when copying and pasting into your project. const demoWindow = window !== undefined ? window() : undefined; @@ -142,7 +137,7 @@ export default function DashboardLayoutSlots(props: DemoProps) { - + ); diff --git a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx.preview b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx.preview index e5cef8113fa..3320e7fe140 100644 --- a/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx.preview +++ b/docs/data/toolpad/core/components/dashboard-layout/DashboardLayoutSlots.tsx.preview @@ -1,5 +1,5 @@ - + \ No newline at end of file diff --git a/docs/data/toolpad/core/components/page-container/ActionsPageContainer.js b/docs/data/toolpad/core/components/page-container/ActionsPageContainer.js index 8960bd6f0f5..db7bf0f7bfa 100644 --- a/docs/data/toolpad/core/components/page-container/ActionsPageContainer.js +++ b/docs/data/toolpad/core/components/page-container/ActionsPageContainer.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { PageContainer, PageContainerToolbar } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; import { LocalizationProvider } from '@mui/x-date-pickers-pro/LocalizationProvider'; diff --git a/docs/data/toolpad/core/components/page-container/ActionsPageContainer.tsx b/docs/data/toolpad/core/components/page-container/ActionsPageContainer.tsx index 579607b0099..c36edc6b872 100644 --- a/docs/data/toolpad/core/components/page-container/ActionsPageContainer.tsx +++ b/docs/data/toolpad/core/components/page-container/ActionsPageContainer.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { PageContainer, PageContainerToolbar } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; import { LocalizationProvider } from '@mui/x-date-pickers-pro/LocalizationProvider'; diff --git a/docs/data/toolpad/core/components/page-container/BasicPageContainer.js b/docs/data/toolpad/core/components/page-container/BasicPageContainer.js index 00a3f80eb1e..36de308ea0e 100644 --- a/docs/data/toolpad/core/components/page-container/BasicPageContainer.js +++ b/docs/data/toolpad/core/components/page-container/BasicPageContainer.js @@ -1,7 +1,7 @@ import * as React from 'react'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { useTheme } from '@mui/material/styles'; import Paper from '@mui/material/Paper'; diff --git a/docs/data/toolpad/core/components/page-container/BasicPageContainer.tsx b/docs/data/toolpad/core/components/page-container/BasicPageContainer.tsx index 00a3f80eb1e..36de308ea0e 100644 --- a/docs/data/toolpad/core/components/page-container/BasicPageContainer.tsx +++ b/docs/data/toolpad/core/components/page-container/BasicPageContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { useTheme } from '@mui/material/styles'; import Paper from '@mui/material/Paper'; diff --git a/docs/data/toolpad/core/components/page-container/CustomPageContainer.js b/docs/data/toolpad/core/components/page-container/CustomPageContainer.js index da512696aad..43529696937 100644 --- a/docs/data/toolpad/core/components/page-container/CustomPageContainer.js +++ b/docs/data/toolpad/core/components/page-container/CustomPageContainer.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; -import { Link, useDemoRouter } from '@toolpad/core/internals'; +import { Link, useDemoRouter } from '@toolpad/core/internal'; import { useActivePage } from '@toolpad/core/useActivePage'; import { useTheme } from '@mui/material/styles'; import Box from '@mui/material/Box'; diff --git a/docs/data/toolpad/core/components/page-container/CustomPageContainer.tsx b/docs/data/toolpad/core/components/page-container/CustomPageContainer.tsx index 7199ee6b86c..6f3a5b3b649 100644 --- a/docs/data/toolpad/core/components/page-container/CustomPageContainer.tsx +++ b/docs/data/toolpad/core/components/page-container/CustomPageContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider, Router } from '@toolpad/core/AppProvider'; -import { Link, useDemoRouter } from '@toolpad/core/internals'; +import { Link, useDemoRouter } from '@toolpad/core/internal'; import { useActivePage } from '@toolpad/core/useActivePage'; import { useTheme } from '@mui/material/styles'; import Box from '@mui/material/Box'; diff --git a/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.js b/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.js index f0604f19386..01dc6110727 100644 --- a/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.js +++ b/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.js @@ -1,7 +1,7 @@ import * as React from 'react'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { useTheme } from '@mui/material/styles'; import Paper from '@mui/material/Paper'; diff --git a/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.tsx b/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.tsx index f0604f19386..01dc6110727 100644 --- a/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.tsx +++ b/docs/data/toolpad/core/components/page-container/TitleBreadcrumbsPageContainer.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { PageContainer } from '@toolpad/core/PageContainer'; import { AppProvider } from '@toolpad/core/AppProvider'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { useTheme } from '@mui/material/styles'; import Paper from '@mui/material/Paper'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.js b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.js index a495cf822b2..17dd69e3ba4 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.js +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import dayjs from 'dayjs'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.tsx b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.tsx index fd1c35f2e88..28163661f11 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.tsx +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateCustom.tsx @@ -1,11 +1,12 @@ import * as React from 'react'; -import { useLocalStorageState, Codec } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import dayjs, { Dayjs } from 'dayjs'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { DatePicker } from '@mui/x-date-pickers/DatePicker'; +import type { Codec } from '@toolpad/core/persistence/codec'; // preview-start const DAYJS_CODEC: Codec = { diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.js b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.js index c32fcd4c406..5697c59f9de 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.js +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.tsx b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.tsx index 0ef83a90ab0..9652ee5a757 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.tsx +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateError.tsx @@ -1,7 +1,8 @@ import * as React from 'react'; -import { Codec, useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; +import type { Codec } from '@toolpad/core/persistence/codec'; // preview-start const CODEC_JSON: Codec = { diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.js b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.js index ecd0c330aca..217ca5aa914 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.js +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; import TextField from '@mui/material/TextField'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.tsx b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.tsx index ecd0c330aca..217ca5aa914 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.tsx +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateString.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; import TextField from '@mui/material/TextField'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.js b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.js index 9f8479104f6..f26097823f6 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.js +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.js @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLocalStorageState } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import MenuItem from '@mui/material/MenuItem'; import Select from '@mui/material/Select'; diff --git a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.tsx b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.tsx index e3835ce7ff7..a74e2add54a 100644 --- a/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.tsx +++ b/docs/data/toolpad/core/components/persistent-state/LocalStorageStateZod.tsx @@ -1,9 +1,10 @@ import * as React from 'react'; -import { useLocalStorageState, Codec } from '@toolpad/core'; +import { useLocalStorageState } from '@toolpad/core/useLocalStorageState'; import Stack from '@mui/material/Stack'; import MenuItem from '@mui/material/MenuItem'; import Select from '@mui/material/Select'; import { z } from 'zod'; +import type { Codec } from '@toolpad/core/persistence/codec'; // preview-start const schema = z.enum(['foo', 'bar', 'baz']).default('foo'); diff --git a/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.js b/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.js index 6115d98479f..f4cd9da9f45 100644 --- a/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.js +++ b/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.js @@ -2,7 +2,6 @@ import * as React from 'react'; import { AuthError } from 'next-auth'; - import { SignInPage } from '@toolpad/core/SignInPage'; import { providerMap, signIn } from './auth'; diff --git a/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.tsx b/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.tsx index 752dd11f531..fe7b777df87 100644 --- a/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/AuthJsSignInApp.tsx @@ -2,8 +2,7 @@ import * as React from 'react'; import { AuthError } from 'next-auth'; -import type { AuthProvider } from '@toolpad/core'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { providerMap, signIn } from './auth'; export default function AuthJsSignInApp() { diff --git a/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.js b/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.js index 3c0f574c8f3..c44cd5f38ef 100644 --- a/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.js +++ b/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [ diff --git a/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx index 5372e4f42ba..a21cbf4b8d3 100644 --- a/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AuthProvider, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [ diff --git a/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.js b/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.js index 6562a0ed494..fcb0cf12b20 100644 --- a/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.js +++ b/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; // preview-start diff --git a/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx index b5079920629..f671d46c0f5 100644 --- a/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AuthProvider, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; // preview-start diff --git a/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.js b/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.js index 798029bd7eb..cc2ae859572 100644 --- a/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.js +++ b/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx b/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx index 05b5dcbce38..0bbcb0c63a8 100644 --- a/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx @@ -1,5 +1,10 @@ import * as React from 'react'; -import { AuthProvider, AuthResponse, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { + SignInPage, + type AuthProvider, + type AuthResponse, +} from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.js b/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.js index 2b83616fe94..7c68f46bef6 100644 --- a/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.js +++ b/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; // preview-start const providers = [ diff --git a/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.tsx index 5f670f3d696..0ce2d8f081a 100644 --- a/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/OAuthSignInPage.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AuthProvider, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; // preview-start const providers = [ diff --git a/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.js b/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.js index 1e73285a60d..b58c101c2a0 100644 --- a/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.js +++ b/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and Password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.tsx b/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.tsx index 1e73285a60d..b58c101c2a0 100644 --- a/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/SlotPropsSignIn.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and Password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.js b/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.js index f22dbb5114d..5173ec90edc 100644 --- a/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.js +++ b/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.js @@ -12,7 +12,8 @@ import { import AccountCircle from '@mui/icons-material/AccountCircle'; import Visibility from '@mui/icons-material/Visibility'; import VisibilityOff from '@mui/icons-material/VisibilityOff'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and Password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.tsx b/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.tsx index 62650b34149..fdea6fc5db8 100644 --- a/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/SlotsSignIn.tsx @@ -12,7 +12,8 @@ import { import AccountCircle from '@mui/icons-material/AccountCircle'; import Visibility from '@mui/icons-material/Visibility'; import VisibilityOff from '@mui/icons-material/VisibilityOff'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { useTheme } from '@mui/material/styles'; const providers = [{ id: 'credentials', name: 'Email and Password' }]; diff --git a/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.js b/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.js index d944150302f..deb2dd12dd8 100644 --- a/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.js +++ b/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.js @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage } from '@toolpad/core/SignInPage'; import { createTheme } from '@mui/material/styles'; import { useColorSchemeShim } from 'docs/src/modules/components/ThemeContext'; import { getDesignTokens } from './brandingTheme'; diff --git a/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx index 173abd66eaa..797983ef77a 100644 --- a/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; -import { AuthProvider, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { createTheme } from '@mui/material/styles'; import { useColorSchemeShim } from 'docs/src/modules/components/ThemeContext'; import { getDesignTokens } from './brandingTheme'; diff --git a/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md b/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md index 85d7fe8c878..269d3cc4f4c 100644 --- a/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md +++ b/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md @@ -129,8 +129,7 @@ To have a fully built "Sign in with GitHub" page appear at the `/auth/signin` ro ```tsx title="./app/auth/signin/page.tsx" // ... import * as React from 'react'; -import type { AuthProvider } from '@toolpad/core'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { AuthError } from 'next-auth'; import { providerMap, signIn } from '../../../auth'; diff --git a/docs/data/toolpad/core/introduction/ReactRouter.tsx b/docs/data/toolpad/core/introduction/ReactRouter.tsx index 606eea7f552..566b25222a7 100644 --- a/docs/data/toolpad/core/introduction/ReactRouter.tsx +++ b/docs/data/toolpad/core/introduction/ReactRouter.tsx @@ -7,7 +7,7 @@ import { createMemoryRouter, RouterProvider, Outlet } from 'react-router-dom'; import { AppProvider } from '@toolpad/core/react-router-dom'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; import { PageContainer } from '@toolpad/core/PageContainer'; -import type { Navigation } from '@toolpad/core'; +import type { Navigation } from '@toolpad/core/AppProvider'; function Layout() { return ( diff --git a/docs/data/toolpad/core/introduction/TutorialDefault.js b/docs/data/toolpad/core/introduction/TutorialDefault.js index 928e38311ef..355c955e6ff 100644 --- a/docs/data/toolpad/core/introduction/TutorialDefault.js +++ b/docs/data/toolpad/core/introduction/TutorialDefault.js @@ -6,7 +6,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; import { PageContainer } from '@toolpad/core/PageContainer'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; const NAVIGATION = [ { diff --git a/docs/data/toolpad/core/introduction/TutorialDefault.tsx b/docs/data/toolpad/core/introduction/TutorialDefault.tsx index ad0edf09d63..ee9ce386b87 100644 --- a/docs/data/toolpad/core/introduction/TutorialDefault.tsx +++ b/docs/data/toolpad/core/introduction/TutorialDefault.tsx @@ -5,7 +5,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; import { PageContainer } from '@toolpad/core/PageContainer'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import type { Navigation } from '@toolpad/core/AppProvider'; const NAVIGATION: Navigation = [ diff --git a/docs/data/toolpad/core/introduction/TutorialPages.js b/docs/data/toolpad/core/introduction/TutorialPages.js index 1213fcecced..1388f38a053 100644 --- a/docs/data/toolpad/core/introduction/TutorialPages.js +++ b/docs/data/toolpad/core/introduction/TutorialPages.js @@ -7,7 +7,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import TimelineIcon from '@mui/icons-material/Timeline'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { PageContainer } from '@toolpad/core/PageContainer'; const NAVIGATION = [ diff --git a/docs/data/toolpad/core/introduction/TutorialPages.tsx b/docs/data/toolpad/core/introduction/TutorialPages.tsx index 95017fe1b97..fb24c7d6a95 100644 --- a/docs/data/toolpad/core/introduction/TutorialPages.tsx +++ b/docs/data/toolpad/core/introduction/TutorialPages.tsx @@ -6,7 +6,7 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import TimelineIcon from '@mui/icons-material/Timeline'; import { AppProvider } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import { PageContainer } from '@toolpad/core/PageContainer'; import type { Navigation } from '@toolpad/core/AppProvider'; diff --git a/docs/data/toolpad/core/introduction/integration.md b/docs/data/toolpad/core/introduction/integration.md index b8e21e4f315..21162f3989d 100644 --- a/docs/data/toolpad/core/introduction/integration.md +++ b/docs/data/toolpad/core/introduction/integration.md @@ -34,7 +34,7 @@ Use the following steps to integrate Toolpad Core into your Next.js app: In your root layout file (e.g., `app/layout.tsx`), wrap your application with the `AppProvider`: ```tsx title="app/layout.tsx" -import { AppProvider } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; import { AppRouterCacheProvider } from '@mui/material-nextjs/v14-appRouter'; export default function RootLayout({ children }: { children: React.ReactNode }) { @@ -177,8 +177,7 @@ Use the `SignInPage` component to add a sign-in page to your app. For example, ` ```tsx title="app/auth/signin/page.tsx" import * as React from 'react'; -import type { AuthProvider } from '@toolpad/core'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { AuthError } from 'next-auth'; import { providerMap, signIn } from '../../../auth'; diff --git a/docs/src/components/landing/ToolpadAuthDemo.tsx b/docs/src/components/landing/ToolpadAuthDemo.tsx index 99f2d2e8478..69d4c9e78a6 100644 --- a/docs/src/components/landing/ToolpadAuthDemo.tsx +++ b/docs/src/components/landing/ToolpadAuthDemo.tsx @@ -2,7 +2,8 @@ import * as React from 'react'; import Paper from '@mui/material/Paper'; import { HighlightedCode } from '@mui/docs/HighlightedCode'; import DemoSandbox from 'docs/src/modules/components/DemoSandbox'; -import { AuthProvider, AppProvider, SignInPage } from '@toolpad/core'; +import { AppProvider } from '@toolpad/core/AppProvider'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import Frame from '../../modules/components/Frame'; const NOOP = () => {}; diff --git a/docs/src/components/landing/ToolpadDashboardLayout.tsx b/docs/src/components/landing/ToolpadDashboardLayout.tsx index 6773d538785..17059508cfd 100644 --- a/docs/src/components/landing/ToolpadDashboardLayout.tsx +++ b/docs/src/components/landing/ToolpadDashboardLayout.tsx @@ -7,10 +7,9 @@ import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import BarChartIcon from '@mui/icons-material/BarChart'; import DescriptionIcon from '@mui/icons-material/Description'; import LayersIcon from '@mui/icons-material/Layers'; -import { AppProvider } from '@toolpad/core/AppProvider'; +import { AppProvider, type Navigation, type Router } from '@toolpad/core/AppProvider'; import { DashboardLayout } from '@toolpad/core/DashboardLayout'; import { PageContainer } from '@toolpad/core/PageContainer'; -import type { Navigation, Router } from '@toolpad/core'; import DemoSandbox from 'docs/src/modules/components/DemoSandbox'; import Grid from '@mui/material/Grid2'; import { styled } from '@mui/material/styles'; diff --git a/docs/src/components/landing/ToolpadPageContainerDemo.tsx b/docs/src/components/landing/ToolpadPageContainerDemo.tsx index 494c03b801b..e13e45035af 100644 --- a/docs/src/components/landing/ToolpadPageContainerDemo.tsx +++ b/docs/src/components/landing/ToolpadPageContainerDemo.tsx @@ -5,7 +5,7 @@ import DemoSandbox from 'docs/src/modules/components/DemoSandbox'; import { HighlightedCode } from '@mui/docs/HighlightedCode'; import { AppProvider } from '@toolpad/core/AppProvider'; import { PageContainer } from '@toolpad/core/PageContainer'; -import { useDemoRouter } from '@toolpad/core/internals'; +import { useDemoRouter } from '@toolpad/core/internal'; import Grid from '@mui/material/Grid2'; import { createTheme, styled, useTheme } from '@mui/material/styles'; diff --git a/examples/core-auth-nextjs-pages-nextauth-4/src/pages/auth/signin.tsx b/examples/core-auth-nextjs-pages-nextauth-4/src/pages/auth/signin.tsx index 6b7f7102bd1..342a860c691 100644 --- a/examples/core-auth-nextjs-pages-nextauth-4/src/pages/auth/signin.tsx +++ b/examples/core-auth-nextjs-pages-nextauth-4/src/pages/auth/signin.tsx @@ -1,11 +1,10 @@ import * as React from 'react'; import type { GetServerSidePropsContext, InferGetServerSidePropsType } from 'next'; import Link from '@mui/material/Link'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { getProviders, signIn } from 'next-auth/react'; import { getServerSession } from 'next-auth/next'; import { useRouter } from 'next/router'; -import type { AuthProvider } from '@toolpad/core'; import { authOptions } from '../api/auth/[...nextauth]'; function ForgotPasswordLink() { diff --git a/examples/core-auth-nextjs/src/app/auth/signin/page.tsx b/examples/core-auth-nextjs/src/app/auth/signin/page.tsx index 697e94ca73c..ae6c70bf28e 100644 --- a/examples/core-auth-nextjs/src/app/auth/signin/page.tsx +++ b/examples/core-auth-nextjs/src/app/auth/signin/page.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; -import type { AuthProvider } from '@toolpad/core'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { AuthError } from 'next-auth'; import { providerMap, signIn } from '../../../auth'; diff --git a/examples/core-vite/src/App.tsx b/examples/core-vite/src/App.tsx index 254413daced..2c6147c8788 100644 --- a/examples/core-vite/src/App.tsx +++ b/examples/core-vite/src/App.tsx @@ -2,8 +2,7 @@ import * as React from 'react'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { Outlet } from 'react-router-dom'; -import { AppProvider } from '@toolpad/core/react-router-dom'; -import type { Navigation } from '@toolpad/core'; +import { AppProvider, type Navigation } from '@toolpad/core/react-router-dom'; const NAVIGATION: Navigation = [ { diff --git a/packages/create-toolpad-app/src/index.ts b/packages/create-toolpad-app/src/index.ts index 40cc0be8173..fd202baab3a 100644 --- a/packages/create-toolpad-app/src/index.ts +++ b/packages/create-toolpad-app/src/index.ts @@ -12,7 +12,7 @@ import { satisfies } from 'semver'; import { readJsonFile } from '@toolpad/utils/fs'; import invariant from 'invariant'; import { bashResolvePath } from '@toolpad/utils/cli'; -import type { SupportedAuthProvider } from '@toolpad/core'; +import type { SupportedAuthProvider } from '@toolpad/core/SignInPage'; import generateProject from './generateProject'; import generateStudioProject from './generateStudioProject'; import writeFiles from './writeFiles'; diff --git a/packages/create-toolpad-app/src/templates/auth/auth.ts b/packages/create-toolpad-app/src/templates/auth/auth.ts index 52c5a30a1b1..89678eaf477 100644 --- a/packages/create-toolpad-app/src/templates/auth/auth.ts +++ b/packages/create-toolpad-app/src/templates/auth/auth.ts @@ -1,4 +1,4 @@ -import type { SupportedAuthProvider } from '@toolpad/core'; +import type { SupportedAuthProvider } from '@toolpad/core/SignInPage'; import { kebabToConstant, kebabToPascal } from '@toolpad/utils/strings'; import { requiresIssuer, requiresTenantId } from './utils'; import { Template } from '../../types'; @@ -56,7 +56,7 @@ if (missingVars.length > 0) { const auth: Template = (options) => { const providers = options.authProviders; - return `import NextAuth from 'next-auth';\nimport { AuthProvider, SupportedAuthProvider } from '@toolpad/core';\n${providers + return `import NextAuth from 'next-auth';\nimport { AuthProvider, SupportedAuthProvider } from '@toolpad/core/SignInPage';\n${providers ?.map( (provider) => `import ${kebabToPascal(provider)} from 'next-auth/providers/${provider.toLowerCase()}';`, diff --git a/packages/create-toolpad-app/src/templates/auth/nextjs-app/signInPage.ts b/packages/create-toolpad-app/src/templates/auth/nextjs-app/signInPage.ts index 716b2b04434..a5d65da77e8 100644 --- a/packages/create-toolpad-app/src/templates/auth/nextjs-app/signInPage.ts +++ b/packages/create-toolpad-app/src/templates/auth/nextjs-app/signInPage.ts @@ -5,8 +5,7 @@ const signInPage: Template = (options) => { const hasCredentialsProvider = providers?.includes('credentials'); return `import * as React from 'react'; -import type { AuthProvider } from '@toolpad/core'; -import { SignInPage } from '@toolpad/core/SignInPage'; +import { SignInPage, type AuthProvider } from '@toolpad/core/SignInPage'; import { AuthError } from 'next-auth'; import { providerMap, signIn } from '../../../auth'; diff --git a/packages/create-toolpad-app/src/templates/auth/utils.ts b/packages/create-toolpad-app/src/templates/auth/utils.ts index 005a26d9c5a..719277b1d92 100644 --- a/packages/create-toolpad-app/src/templates/auth/utils.ts +++ b/packages/create-toolpad-app/src/templates/auth/utils.ts @@ -1,4 +1,4 @@ -import type { SupportedAuthProvider } from '@toolpad/core'; +import type { SupportedAuthProvider } from '@toolpad/core/SignInPage'; export function requiresIssuer(provider: SupportedAuthProvider) { return ( diff --git a/packages/create-toolpad-app/src/types.ts b/packages/create-toolpad-app/src/types.ts index 61d5811a235..1756554c503 100644 --- a/packages/create-toolpad-app/src/types.ts +++ b/packages/create-toolpad-app/src/types.ts @@ -1,4 +1,4 @@ -import type { SupportedAuthProvider } from '@toolpad/core'; +import type { SupportedAuthProvider } from '@toolpad/core/SignInPage'; import { PackageJson } from './templates/packageType'; diff --git a/packages/toolpad-core/src/DashboardLayout/ThemeSwitcher.tsx b/packages/toolpad-core/src/DashboardLayout/ThemeSwitcher.tsx index ac70be5d461..36aa02d3d6b 100644 --- a/packages/toolpad-core/src/DashboardLayout/ThemeSwitcher.tsx +++ b/packages/toolpad-core/src/DashboardLayout/ThemeSwitcher.tsx @@ -8,6 +8,7 @@ import LightModeIcon from '@mui/icons-material/LightMode'; import useSsr from '@toolpad/utils/hooks/useSsr'; import { PaletteModeContext } from '../shared/context'; +// TODO: When we use this component as the default for a slot, make it non-internal /** * @ignore - internal component. */ diff --git a/packages/toolpad-core/src/DashboardLayout/ToolbarActions.tsx b/packages/toolpad-core/src/DashboardLayout/ToolbarActions.tsx index 76c058f88fb..3292d10cc1b 100644 --- a/packages/toolpad-core/src/DashboardLayout/ToolbarActions.tsx +++ b/packages/toolpad-core/src/DashboardLayout/ToolbarActions.tsx @@ -1,5 +1,6 @@ 'use client'; +// TODO: When we add content to this component, make it non-internal /** * @ignore - internal component. */ diff --git a/packages/toolpad-core/src/SignInPage/SignInPage.tsx b/packages/toolpad-core/src/SignInPage/SignInPage.tsx index 1f35c8f3e79..b808b546587 100644 --- a/packages/toolpad-core/src/SignInPage/SignInPage.tsx +++ b/packages/toolpad-core/src/SignInPage/SignInPage.tsx @@ -36,7 +36,8 @@ import GitLabIcon from './icons/GitLab'; import KeycloakIcon from './icons/Keycloak'; import OktaIcon from './icons/Okta'; import FusionAuthIcon from './icons/FusionAuth'; -import { BrandingContext, DocsContext, RouterContext } from '../shared/context'; +import { BrandingContext, RouterContext } from '../shared/context'; +import { DocsContext } from '../internal/context'; type SupportedOAuthProvider = | 'github' diff --git a/packages/toolpad-core/src/internal/context.ts b/packages/toolpad-core/src/internal/context.ts new file mode 100644 index 00000000000..b1e095ad679 --- /dev/null +++ b/packages/toolpad-core/src/internal/context.ts @@ -0,0 +1,3 @@ +import * as React from 'react'; + +export const DocsContext = React.createContext(false); diff --git a/packages/toolpad-core/src/internals/demo.tsx b/packages/toolpad-core/src/internal/demo.tsx similarity index 95% rename from packages/toolpad-core/src/internals/demo.tsx rename to packages/toolpad-core/src/internal/demo.tsx index bdda55216fe..0b41c363166 100644 --- a/packages/toolpad-core/src/internals/demo.tsx +++ b/packages/toolpad-core/src/internal/demo.tsx @@ -30,5 +30,3 @@ export function useDemoRouter(initialUrl: string = '/') { return router; } - -export { Link } from '../shared/Link'; diff --git a/packages/toolpad-core/src/internal/index.ts b/packages/toolpad-core/src/internal/index.ts deleted file mode 100644 index b898bcbd5ac..00000000000 --- a/packages/toolpad-core/src/internal/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -import { DocsContext as Docs } from '../shared/context'; - -export const DocsContext = Docs; diff --git a/packages/toolpad-core/src/internal/index.tsx b/packages/toolpad-core/src/internal/index.tsx new file mode 100644 index 00000000000..e3391b5e1a2 --- /dev/null +++ b/packages/toolpad-core/src/internal/index.tsx @@ -0,0 +1,4 @@ +export { Link } from '../shared/Link'; + +export * from './demo'; +export { DocsContext } from './context'; diff --git a/packages/toolpad-core/src/internals/index.tsx b/packages/toolpad-core/src/internals/index.tsx deleted file mode 100644 index 689b5cbca95..00000000000 --- a/packages/toolpad-core/src/internals/index.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from './demo'; diff --git a/packages/toolpad-core/src/shared/context.ts b/packages/toolpad-core/src/shared/context.ts index ea351b29113..0b3a25323c3 100644 --- a/packages/toolpad-core/src/shared/context.ts +++ b/packages/toolpad-core/src/shared/context.ts @@ -19,5 +19,3 @@ export const PaletteModeContext = React.createContext<{ export const RouterContext = React.createContext(null); export const WindowContext = React.createContext(undefined); - -export const DocsContext = React.createContext(false); diff --git a/playground/nextjs/src/app/auth/signin/actions.ts b/playground/nextjs/src/app/auth/signin/actions.ts index 5565a91cfa9..e79fd0b7541 100644 --- a/playground/nextjs/src/app/auth/signin/actions.ts +++ b/playground/nextjs/src/app/auth/signin/actions.ts @@ -1,6 +1,6 @@ 'use server'; import { AuthError } from 'next-auth'; -import type { AuthProvider } from '@toolpad/core'; +import type { AuthProvider } from '@toolpad/core/SignInPage'; import { signIn as signInAction } from '../../../auth'; async function signIn(provider: AuthProvider, formData: FormData, callbackUrl?: string) { diff --git a/playground/vite/src/App.tsx b/playground/vite/src/App.tsx index 254413daced..2c6147c8788 100644 --- a/playground/vite/src/App.tsx +++ b/playground/vite/src/App.tsx @@ -2,8 +2,7 @@ import * as React from 'react'; import DashboardIcon from '@mui/icons-material/Dashboard'; import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'; import { Outlet } from 'react-router-dom'; -import { AppProvider } from '@toolpad/core/react-router-dom'; -import type { Navigation } from '@toolpad/core'; +import { AppProvider, type Navigation } from '@toolpad/core/react-router-dom'; const NAVIGATION: Navigation = [ {