[account] New slots and sub-components (#4181)

docs/data/toolpad/core/components/account/AccountCustomLocaleText.js

@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { AuthenticationContext, SessionContext } from '@toolpad/core/AppProvider';
+import { Account } from '@toolpad/core/Account';
+
+const demoSession = {
+ user: {
+ name: 'Bharat Kashyap',
+ email: 'bharatkashyap@outlook.com',
+ image: 'https://avatars.githubusercontent.com/u/19550456',
+ },
+};
+
+export default function AccountCustomLocaleText() {
+ const [session, setSession] = React.useState(demoSession);
+
+ const authentication = React.useMemo(() => {
+ return {
+ signIn: () => {
+ setSession({
+ user: {
+ name: 'Bharat Kashyap',
+ email: 'bharatkashyap@outlook.com',
+ image: 'https://avatars.githubusercontent.com/u/19550456',
+ },
+ });
+ },
+ signOut: () => {
+ setSession(null);
+ },
+ };
+ }, []);
+
+ return (
+ <AuthenticationContext.Provider value={authentication}>
+ <SessionContext.Provider value={session}>
+ {/* preview-start */}
+ <Account
+ localeText={{
+ signInLabel: 'लॉग इन',
+ signOutLabel: 'लॉग आउट',
+ }}
+ />
+ {/* preview-end */}
+ </SessionContext.Provider>
+ </AuthenticationContext.Provider>
+ );
+}

docs/data/toolpad/core/components/account/AccountCustomLocaleText.tsx

@@ -0,0 +1,51 @@
+import * as React from 'react';
+import {
+ AuthenticationContext,
+ Session,
+ SessionContext,
+} from '@toolpad/core/AppProvider';
+import { Account } from '@toolpad/core/Account';
+
+const demoSession = {
+ user: {
+ name: 'Bharat Kashyap',
+ email: 'bharatkashyap@outlook.com',
+ image: 'https://avatars.githubusercontent.com/u/19550456',
+ },
+};
+
+export default function AccountCustomLocaleText() {
+ const [session, setSession] = React.useState<Session | null>(demoSession);
+
+ const authentication = React.useMemo(() => {
+ return {
+ signIn: () => {
+ setSession({
+ user: {
+ name: 'Bharat Kashyap',
+ email: 'bharatkashyap@outlook.com',
+ image: 'https://avatars.githubusercontent.com/u/19550456',
+ },
+ });
+ },
+ signOut: () => {
+ setSession(null);
+ },
+ };
+ }, []);
+
+ return (
+ <AuthenticationContext.Provider value={authentication}>
+ <SessionContext.Provider value={session}>
+ {/* preview-start */}
+ <Account
+ localeText={{
+ signInLabel: 'लॉग इन',
+ signOutLabel: 'लॉग आउट',
+ }}
+ />
+ {/* preview-end */}
+ </SessionContext.Provider>
+ </AuthenticationContext.Provider>
+ );
+}

docs/data/toolpad/core/components/account/AccountCustomLocaleText.tsx.preview

@@ -0,0 +1,6 @@
+<Account
+ localeText={{
+ signInLabel: 'लॉग इन',
+ signOutLabel: 'लॉग आउट',
+ }}
+/>