@chemmangat/msal-next 4.1.0 → 4.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +85 -0
- package/README.md +2 -1
- package/dist/index.d.mts +258 -1
- package/dist/index.d.ts +258 -1
- package/dist/index.js +705 -34
- package/dist/index.mjs +700 -32
- package/package.json +26 -4
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,91 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
|
|
5
|
+
## [4.2.0] - 2026-03-08
|
|
6
|
+
|
|
7
|
+
### 🎉 Major Feature Release - Multi-Account Management
|
|
8
|
+
|
|
9
|
+
This release introduces the most requested feature: Multi-Account Management. Users can now sign in with multiple Microsoft accounts simultaneously and switch between them seamlessly.
|
|
10
|
+
|
|
11
|
+
### ✨ New Features
|
|
12
|
+
|
|
13
|
+
#### 1. Multi-Account Management 🔥
|
|
14
|
+
Sign in with multiple Microsoft accounts and switch between them without signing out.
|
|
15
|
+
|
|
16
|
+
**New Hook: `useMultiAccount`**
|
|
17
|
+
```tsx
|
|
18
|
+
const {
|
|
19
|
+
accounts, // All signed-in accounts
|
|
20
|
+
activeAccount, // Current active account
|
|
21
|
+
hasMultipleAccounts, // Boolean: more than one account
|
|
22
|
+
switchAccount, // Switch to different account
|
|
23
|
+
addAccount, // Sign in with another account
|
|
24
|
+
removeAccount, // Remove account from cache
|
|
25
|
+
signOutAccount, // Sign out specific account
|
|
26
|
+
signOutAll, // Sign out all accounts
|
|
27
|
+
} = useMultiAccount();
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
**New Component: `AccountSwitcher`**
|
|
31
|
+
Pre-built dropdown UI for switching accounts with three variants (default, compact, minimal).
|
|
32
|
+
|
|
33
|
+
```tsx
|
|
34
|
+
<AccountSwitcher
|
|
35
|
+
showAvatars={true}
|
|
36
|
+
maxAccounts={5}
|
|
37
|
+
variant="default"
|
|
38
|
+
onSwitch={(account) => console.log('Switched to', account.name)}
|
|
39
|
+
/>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
**New Component: `AccountList`**
|
|
43
|
+
Display all accounts in a list format with vertical or horizontal layouts.
|
|
44
|
+
|
|
45
|
+
```tsx
|
|
46
|
+
<AccountList
|
|
47
|
+
showAvatars={true}
|
|
48
|
+
showDetails={true}
|
|
49
|
+
clickToSwitch={true}
|
|
50
|
+
orientation="vertical"
|
|
51
|
+
/>
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
**Use Cases:**
|
|
55
|
+
- Work + personal accounts
|
|
56
|
+
- Multiple work accounts (IT admins, consultants)
|
|
57
|
+
- Multi-tenant SaaS applications
|
|
58
|
+
- Testing different roles/permissions
|
|
59
|
+
|
|
60
|
+
**Complete Examples:**
|
|
61
|
+
- 5 real-world examples in `examples/multi-account-example.tsx`
|
|
62
|
+
- Header with account switcher
|
|
63
|
+
- Account management page
|
|
64
|
+
- Programmatic account switching
|
|
65
|
+
|
|
66
|
+
### 🐛 Bug Fixes
|
|
67
|
+
|
|
68
|
+
- Fixed type error in `clearCache` API call
|
|
69
|
+
- Removed unused variable in `AccountList` component
|
|
70
|
+
- Improved error handling for account operations
|
|
71
|
+
|
|
72
|
+
### 📚 Documentation
|
|
73
|
+
|
|
74
|
+
- Added multi-account section to README
|
|
75
|
+
- Created comprehensive examples file with 5 scenarios
|
|
76
|
+
- Updated API reference with new exports
|
|
77
|
+
- Added TypeScript type exports for all new components
|
|
78
|
+
|
|
79
|
+
### 🔄 Migration
|
|
80
|
+
|
|
81
|
+
No breaking changes! Simply update to v4.2.0:
|
|
82
|
+
```bash
|
|
83
|
+
npm install @chemmangat/msal-next@4.2.0
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
All existing code continues to work. Multi-account features are opt-in.
|
|
87
|
+
|
|
88
|
+
---
|
|
89
|
+
|
|
5
90
|
## [4.1.0] - 2026-03-07
|
|
6
91
|
|
|
7
92
|
### 🎉 Major Release - Documentation Overhaul + Production Features
|
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ Production-grade MSAL authentication library for Next.js App Router with minimal
|
|
|
6
6
|
[](https://opensource.org/licenses/MIT)
|
|
7
7
|
[](./SECURITY.md)
|
|
8
8
|
|
|
9
|
-
> **📦 Current Version: 4.1.
|
|
9
|
+
> **📦 Current Version: 4.1.1** - Production-ready with automatic token refresh and enhanced security
|
|
10
10
|
|
|
11
11
|
---
|
|
12
12
|
|
|
@@ -782,6 +782,7 @@ export default function ProfilePage() {
|
|
|
782
782
|
|
|
783
783
|
### Links
|
|
784
784
|
- 📦 [npm Package](https://www.npmjs.com/package/@chemmangat/msal-next)
|
|
785
|
+
- 🚀 [Live Demo](https://github.com/Chemmangat/msal-next-demo) - Sample implementation
|
|
785
786
|
- 🐛 [Report Issues](https://github.com/chemmangat/msal-next/issues)
|
|
786
787
|
- 💬 [Discussions](https://github.com/chemmangat/msal-next/discussions)
|
|
787
788
|
- ⭐ [GitHub Repository](https://github.com/chemmangat/msal-next)
|
package/dist/index.d.mts
CHANGED
|
@@ -695,6 +695,151 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryS
|
|
|
695
695
|
render(): ReactNode;
|
|
696
696
|
}
|
|
697
697
|
|
|
698
|
+
interface AccountSwitcherProps {
|
|
699
|
+
/**
|
|
700
|
+
* Show user avatars (requires Microsoft Graph API access)
|
|
701
|
+
* @defaultValue true
|
|
702
|
+
*/
|
|
703
|
+
showAvatars?: boolean;
|
|
704
|
+
/**
|
|
705
|
+
* Maximum number of accounts to allow
|
|
706
|
+
* @defaultValue 5
|
|
707
|
+
*/
|
|
708
|
+
maxAccounts?: number;
|
|
709
|
+
/**
|
|
710
|
+
* Callback when account is switched
|
|
711
|
+
*/
|
|
712
|
+
onSwitch?: (account: AccountInfo) => void;
|
|
713
|
+
/**
|
|
714
|
+
* Callback when account is added
|
|
715
|
+
*/
|
|
716
|
+
onAdd?: () => void;
|
|
717
|
+
/**
|
|
718
|
+
* Callback when account is removed
|
|
719
|
+
*/
|
|
720
|
+
onRemove?: (account: AccountInfo) => void;
|
|
721
|
+
/**
|
|
722
|
+
* Custom CSS class name
|
|
723
|
+
*/
|
|
724
|
+
className?: string;
|
|
725
|
+
/**
|
|
726
|
+
* Custom inline styles
|
|
727
|
+
*/
|
|
728
|
+
style?: CSSProperties;
|
|
729
|
+
/**
|
|
730
|
+
* Variant style
|
|
731
|
+
* @defaultValue 'default'
|
|
732
|
+
*/
|
|
733
|
+
variant?: 'default' | 'compact' | 'minimal';
|
|
734
|
+
/**
|
|
735
|
+
* Show "Add Account" button
|
|
736
|
+
* @defaultValue true
|
|
737
|
+
*/
|
|
738
|
+
showAddButton?: boolean;
|
|
739
|
+
/**
|
|
740
|
+
* Show "Remove Account" button for each account
|
|
741
|
+
* @defaultValue true
|
|
742
|
+
*/
|
|
743
|
+
showRemoveButton?: boolean;
|
|
744
|
+
}
|
|
745
|
+
/**
|
|
746
|
+
* Account Switcher Component
|
|
747
|
+
*
|
|
748
|
+
* @remarks
|
|
749
|
+
* Pre-built UI component for switching between multiple Microsoft accounts.
|
|
750
|
+
* Displays all signed-in accounts with avatars and allows users to switch or add accounts.
|
|
751
|
+
*
|
|
752
|
+
* @example
|
|
753
|
+
* ```tsx
|
|
754
|
+
* 'use client';
|
|
755
|
+
*
|
|
756
|
+
* import { AccountSwitcher } from '@chemmangat/msal-next';
|
|
757
|
+
*
|
|
758
|
+
* export default function Header() {
|
|
759
|
+
* return (
|
|
760
|
+
* <div>
|
|
761
|
+
* <h1>My App</h1>
|
|
762
|
+
* <AccountSwitcher
|
|
763
|
+
* showAvatars={true}
|
|
764
|
+
* maxAccounts={5}
|
|
765
|
+
* onSwitch={(account) => console.log('Switched to', account.name)}
|
|
766
|
+
* />
|
|
767
|
+
* </div>
|
|
768
|
+
* );
|
|
769
|
+
* }
|
|
770
|
+
* ```
|
|
771
|
+
*/
|
|
772
|
+
declare function AccountSwitcher({ showAvatars, maxAccounts, onSwitch, onAdd, onRemove, className, style, variant, showAddButton, showRemoveButton, }: AccountSwitcherProps): react_jsx_runtime.JSX.Element | null;
|
|
773
|
+
|
|
774
|
+
interface AccountListProps {
|
|
775
|
+
/**
|
|
776
|
+
* Show user avatars
|
|
777
|
+
* @defaultValue true
|
|
778
|
+
*/
|
|
779
|
+
showAvatars?: boolean;
|
|
780
|
+
/**
|
|
781
|
+
* Show account details (email, tenant)
|
|
782
|
+
* @defaultValue true
|
|
783
|
+
*/
|
|
784
|
+
showDetails?: boolean;
|
|
785
|
+
/**
|
|
786
|
+
* Show active account indicator
|
|
787
|
+
* @defaultValue true
|
|
788
|
+
*/
|
|
789
|
+
showActiveIndicator?: boolean;
|
|
790
|
+
/**
|
|
791
|
+
* Allow clicking to switch accounts
|
|
792
|
+
* @defaultValue true
|
|
793
|
+
*/
|
|
794
|
+
clickToSwitch?: boolean;
|
|
795
|
+
/**
|
|
796
|
+
* Callback when account is clicked
|
|
797
|
+
*/
|
|
798
|
+
onAccountClick?: (account: AccountInfo) => void;
|
|
799
|
+
/**
|
|
800
|
+
* Custom CSS class name
|
|
801
|
+
*/
|
|
802
|
+
className?: string;
|
|
803
|
+
/**
|
|
804
|
+
* Custom inline styles
|
|
805
|
+
*/
|
|
806
|
+
style?: CSSProperties;
|
|
807
|
+
/**
|
|
808
|
+
* Layout orientation
|
|
809
|
+
* @defaultValue 'vertical'
|
|
810
|
+
*/
|
|
811
|
+
orientation?: 'vertical' | 'horizontal';
|
|
812
|
+
}
|
|
813
|
+
/**
|
|
814
|
+
* Account List Component
|
|
815
|
+
*
|
|
816
|
+
* @remarks
|
|
817
|
+
* Display all signed-in Microsoft accounts in a list format.
|
|
818
|
+
* Useful for account management pages or settings screens.
|
|
819
|
+
*
|
|
820
|
+
* @example
|
|
821
|
+
* ```tsx
|
|
822
|
+
* 'use client';
|
|
823
|
+
*
|
|
824
|
+
* import { AccountList } from '@chemmangat/msal-next';
|
|
825
|
+
*
|
|
826
|
+
* export default function AccountsPage() {
|
|
827
|
+
* return (
|
|
828
|
+
* <div>
|
|
829
|
+
* <h1>Your Accounts</h1>
|
|
830
|
+
* <AccountList
|
|
831
|
+
* showAvatars={true}
|
|
832
|
+
* showDetails={true}
|
|
833
|
+
* clickToSwitch={true}
|
|
834
|
+
* onAccountClick={(account) => console.log('Clicked', account.name)}
|
|
835
|
+
* />
|
|
836
|
+
* </div>
|
|
837
|
+
* );
|
|
838
|
+
* }
|
|
839
|
+
* ```
|
|
840
|
+
*/
|
|
841
|
+
declare function AccountList({ showAvatars, showDetails, showActiveIndicator, clickToSwitch, onAccountClick, className, style, orientation, }: AccountListProps): react_jsx_runtime.JSX.Element;
|
|
842
|
+
|
|
698
843
|
interface UseMsalAuthReturn {
|
|
699
844
|
/**
|
|
700
845
|
* Current authenticated account
|
|
@@ -1067,6 +1212,118 @@ interface UseTokenRefreshReturn {
|
|
|
1067
1212
|
*/
|
|
1068
1213
|
declare function useTokenRefresh(options?: UseTokenRefreshOptions): UseTokenRefreshReturn;
|
|
1069
1214
|
|
|
1215
|
+
interface UseMultiAccountReturn {
|
|
1216
|
+
/**
|
|
1217
|
+
* All signed-in accounts
|
|
1218
|
+
*/
|
|
1219
|
+
accounts: AccountInfo[];
|
|
1220
|
+
/**
|
|
1221
|
+
* Currently active account
|
|
1222
|
+
*/
|
|
1223
|
+
activeAccount: AccountInfo | null;
|
|
1224
|
+
/**
|
|
1225
|
+
* Whether user has multiple accounts signed in
|
|
1226
|
+
*/
|
|
1227
|
+
hasMultipleAccounts: boolean;
|
|
1228
|
+
/**
|
|
1229
|
+
* Number of signed-in accounts
|
|
1230
|
+
*/
|
|
1231
|
+
accountCount: number;
|
|
1232
|
+
/**
|
|
1233
|
+
* Whether MSAL is currently performing an interaction
|
|
1234
|
+
*/
|
|
1235
|
+
inProgress: boolean;
|
|
1236
|
+
/**
|
|
1237
|
+
* Switch to a different account
|
|
1238
|
+
* @param account - The account to switch to
|
|
1239
|
+
*/
|
|
1240
|
+
switchAccount: (account: AccountInfo) => void;
|
|
1241
|
+
/**
|
|
1242
|
+
* Add a new account (sign in with another account)
|
|
1243
|
+
* @param scopes - Optional scopes for the new account
|
|
1244
|
+
*/
|
|
1245
|
+
addAccount: (scopes?: string[]) => Promise<void>;
|
|
1246
|
+
/**
|
|
1247
|
+
* Remove an account from the cache
|
|
1248
|
+
* @param account - The account to remove
|
|
1249
|
+
*/
|
|
1250
|
+
removeAccount: (account: AccountInfo) => Promise<void>;
|
|
1251
|
+
/**
|
|
1252
|
+
* Sign out from a specific account
|
|
1253
|
+
* @param account - The account to sign out from
|
|
1254
|
+
*/
|
|
1255
|
+
signOutAccount: (account: AccountInfo) => Promise<void>;
|
|
1256
|
+
/**
|
|
1257
|
+
* Sign out from all accounts
|
|
1258
|
+
*/
|
|
1259
|
+
signOutAll: () => Promise<void>;
|
|
1260
|
+
/**
|
|
1261
|
+
* Get account by username
|
|
1262
|
+
* @param username - The username to search for
|
|
1263
|
+
*/
|
|
1264
|
+
getAccountByUsername: (username: string) => AccountInfo | undefined;
|
|
1265
|
+
/**
|
|
1266
|
+
* Get account by home account ID
|
|
1267
|
+
* @param homeAccountId - The home account ID to search for
|
|
1268
|
+
*/
|
|
1269
|
+
getAccountById: (homeAccountId: string) => AccountInfo | undefined;
|
|
1270
|
+
/**
|
|
1271
|
+
* Check if a specific account is active
|
|
1272
|
+
* @param account - The account to check
|
|
1273
|
+
*/
|
|
1274
|
+
isActiveAccount: (account: AccountInfo) => boolean;
|
|
1275
|
+
}
|
|
1276
|
+
/**
|
|
1277
|
+
* Hook for managing multiple Microsoft accounts
|
|
1278
|
+
*
|
|
1279
|
+
* @remarks
|
|
1280
|
+
* Allows users to sign in with multiple Microsoft accounts and switch between them seamlessly.
|
|
1281
|
+
* Perfect for users who need to access both work and personal accounts, or multiple work accounts.
|
|
1282
|
+
*
|
|
1283
|
+
* @example
|
|
1284
|
+
* ```tsx
|
|
1285
|
+
* 'use client';
|
|
1286
|
+
*
|
|
1287
|
+
* import { useMultiAccount } from '@chemmangat/msal-next';
|
|
1288
|
+
*
|
|
1289
|
+
* export default function AccountManager() {
|
|
1290
|
+
* const {
|
|
1291
|
+
* accounts,
|
|
1292
|
+
* activeAccount,
|
|
1293
|
+
* switchAccount,
|
|
1294
|
+
* addAccount,
|
|
1295
|
+
* removeAccount,
|
|
1296
|
+
* hasMultipleAccounts
|
|
1297
|
+
* } = useMultiAccount();
|
|
1298
|
+
*
|
|
1299
|
+
* return (
|
|
1300
|
+
* <div>
|
|
1301
|
+
* <h2>Active: {activeAccount?.name}</h2>
|
|
1302
|
+
*
|
|
1303
|
+
* {hasMultipleAccounts && (
|
|
1304
|
+
* <div>
|
|
1305
|
+
* <h3>Switch Account:</h3>
|
|
1306
|
+
* {accounts.map(account => (
|
|
1307
|
+
* <button
|
|
1308
|
+
* key={account.homeAccountId}
|
|
1309
|
+
* onClick={() => switchAccount(account)}
|
|
1310
|
+
* >
|
|
1311
|
+
* {account.name}
|
|
1312
|
+
* </button>
|
|
1313
|
+
* ))}
|
|
1314
|
+
* </div>
|
|
1315
|
+
* )}
|
|
1316
|
+
*
|
|
1317
|
+
* <button onClick={() => addAccount()}>
|
|
1318
|
+
* Add Another Account
|
|
1319
|
+
* </button>
|
|
1320
|
+
* </div>
|
|
1321
|
+
* );
|
|
1322
|
+
* }
|
|
1323
|
+
* ```
|
|
1324
|
+
*/
|
|
1325
|
+
declare function useMultiAccount(defaultScopes?: string[]): UseMultiAccountReturn;
|
|
1326
|
+
|
|
1070
1327
|
declare function createMsalConfig(config: MsalAuthConfig): Configuration;
|
|
1071
1328
|
|
|
1072
1329
|
interface WithAuthOptions extends Omit<AuthGuardProps, 'children'> {
|
|
@@ -1548,4 +1805,4 @@ interface ServerSession {
|
|
|
1548
1805
|
accessToken?: string;
|
|
1549
1806
|
}
|
|
1550
1807
|
|
|
1551
|
-
export { AuthGuard, type AuthGuardProps, type AuthMiddlewareConfig, type AuthProtectionConfig, AuthStatus, type AuthStatusProps, type CustomTokenClaims, type DebugLoggerConfig, ErrorBoundary, type ErrorBoundaryProps, type GraphApiOptions, MSALProvider, MicrosoftSignInButton, type MicrosoftSignInButtonProps, type MsalAuthConfig, MsalAuthProvider, type MsalAuthProviderProps, MsalError, type PageAuthConfig, ProtectedPage, type RetryConfig, type ServerSession, SignOutButton, type SignOutButtonProps, type UseGraphApiReturn, type UseMsalAuthReturn, type UseRolesReturn, type UseTokenRefreshOptions, type UseTokenRefreshReturn, type UseUserProfileReturn, UserAvatar, type UserAvatarProps, type UserProfile, type ValidatedAccountData, type ValidationError, type ValidationResult, type ValidationWarning, type WithAuthOptions, createAuthMiddleware, createMissingEnvVarError, createMsalConfig, createRetryWrapper, createScopedLogger, displayValidationResults, getDebugLogger, getMsalInstance, isValidAccountData, isValidRedirectUri, isValidScope, retryWithBackoff, safeJsonParse, sanitizeError, useGraphApi, useMsalAuth, useRoles, useTokenRefresh, useUserProfile, validateConfig, validateScopes, withAuth, withPageAuth, wrapMsalError };
|
|
1808
|
+
export { AccountList, type AccountListProps, AccountSwitcher, type AccountSwitcherProps, AuthGuard, type AuthGuardProps, type AuthMiddlewareConfig, type AuthProtectionConfig, AuthStatus, type AuthStatusProps, type CustomTokenClaims, type DebugLoggerConfig, ErrorBoundary, type ErrorBoundaryProps, type GraphApiOptions, MSALProvider, MicrosoftSignInButton, type MicrosoftSignInButtonProps, type MsalAuthConfig, MsalAuthProvider, type MsalAuthProviderProps, MsalError, type PageAuthConfig, ProtectedPage, type RetryConfig, type ServerSession, SignOutButton, type SignOutButtonProps, type UseGraphApiReturn, type UseMsalAuthReturn, type UseMultiAccountReturn, type UseRolesReturn, type UseTokenRefreshOptions, type UseTokenRefreshReturn, type UseUserProfileReturn, UserAvatar, type UserAvatarProps, type UserProfile, type ValidatedAccountData, type ValidationError, type ValidationResult, type ValidationWarning, type WithAuthOptions, createAuthMiddleware, createMissingEnvVarError, createMsalConfig, createRetryWrapper, createScopedLogger, displayValidationResults, getDebugLogger, getMsalInstance, isValidAccountData, isValidRedirectUri, isValidScope, retryWithBackoff, safeJsonParse, sanitizeError, useGraphApi, useMsalAuth, useMultiAccount, useRoles, useTokenRefresh, useUserProfile, validateConfig, validateScopes, withAuth, withPageAuth, wrapMsalError };
|
package/dist/index.d.ts
CHANGED
|
@@ -695,6 +695,151 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryS
|
|
|
695
695
|
render(): ReactNode;
|
|
696
696
|
}
|
|
697
697
|
|
|
698
|
+
interface AccountSwitcherProps {
|
|
699
|
+
/**
|
|
700
|
+
* Show user avatars (requires Microsoft Graph API access)
|
|
701
|
+
* @defaultValue true
|
|
702
|
+
*/
|
|
703
|
+
showAvatars?: boolean;
|
|
704
|
+
/**
|
|
705
|
+
* Maximum number of accounts to allow
|
|
706
|
+
* @defaultValue 5
|
|
707
|
+
*/
|
|
708
|
+
maxAccounts?: number;
|
|
709
|
+
/**
|
|
710
|
+
* Callback when account is switched
|
|
711
|
+
*/
|
|
712
|
+
onSwitch?: (account: AccountInfo) => void;
|
|
713
|
+
/**
|
|
714
|
+
* Callback when account is added
|
|
715
|
+
*/
|
|
716
|
+
onAdd?: () => void;
|
|
717
|
+
/**
|
|
718
|
+
* Callback when account is removed
|
|
719
|
+
*/
|
|
720
|
+
onRemove?: (account: AccountInfo) => void;
|
|
721
|
+
/**
|
|
722
|
+
* Custom CSS class name
|
|
723
|
+
*/
|
|
724
|
+
className?: string;
|
|
725
|
+
/**
|
|
726
|
+
* Custom inline styles
|
|
727
|
+
*/
|
|
728
|
+
style?: CSSProperties;
|
|
729
|
+
/**
|
|
730
|
+
* Variant style
|
|
731
|
+
* @defaultValue 'default'
|
|
732
|
+
*/
|
|
733
|
+
variant?: 'default' | 'compact' | 'minimal';
|
|
734
|
+
/**
|
|
735
|
+
* Show "Add Account" button
|
|
736
|
+
* @defaultValue true
|
|
737
|
+
*/
|
|
738
|
+
showAddButton?: boolean;
|
|
739
|
+
/**
|
|
740
|
+
* Show "Remove Account" button for each account
|
|
741
|
+
* @defaultValue true
|
|
742
|
+
*/
|
|
743
|
+
showRemoveButton?: boolean;
|
|
744
|
+
}
|
|
745
|
+
/**
|
|
746
|
+
* Account Switcher Component
|
|
747
|
+
*
|
|
748
|
+
* @remarks
|
|
749
|
+
* Pre-built UI component for switching between multiple Microsoft accounts.
|
|
750
|
+
* Displays all signed-in accounts with avatars and allows users to switch or add accounts.
|
|
751
|
+
*
|
|
752
|
+
* @example
|
|
753
|
+
* ```tsx
|
|
754
|
+
* 'use client';
|
|
755
|
+
*
|
|
756
|
+
* import { AccountSwitcher } from '@chemmangat/msal-next';
|
|
757
|
+
*
|
|
758
|
+
* export default function Header() {
|
|
759
|
+
* return (
|
|
760
|
+
* <div>
|
|
761
|
+
* <h1>My App</h1>
|
|
762
|
+
* <AccountSwitcher
|
|
763
|
+
* showAvatars={true}
|
|
764
|
+
* maxAccounts={5}
|
|
765
|
+
* onSwitch={(account) => console.log('Switched to', account.name)}
|
|
766
|
+
* />
|
|
767
|
+
* </div>
|
|
768
|
+
* );
|
|
769
|
+
* }
|
|
770
|
+
* ```
|
|
771
|
+
*/
|
|
772
|
+
declare function AccountSwitcher({ showAvatars, maxAccounts, onSwitch, onAdd, onRemove, className, style, variant, showAddButton, showRemoveButton, }: AccountSwitcherProps): react_jsx_runtime.JSX.Element | null;
|
|
773
|
+
|
|
774
|
+
interface AccountListProps {
|
|
775
|
+
/**
|
|
776
|
+
* Show user avatars
|
|
777
|
+
* @defaultValue true
|
|
778
|
+
*/
|
|
779
|
+
showAvatars?: boolean;
|
|
780
|
+
/**
|
|
781
|
+
* Show account details (email, tenant)
|
|
782
|
+
* @defaultValue true
|
|
783
|
+
*/
|
|
784
|
+
showDetails?: boolean;
|
|
785
|
+
/**
|
|
786
|
+
* Show active account indicator
|
|
787
|
+
* @defaultValue true
|
|
788
|
+
*/
|
|
789
|
+
showActiveIndicator?: boolean;
|
|
790
|
+
/**
|
|
791
|
+
* Allow clicking to switch accounts
|
|
792
|
+
* @defaultValue true
|
|
793
|
+
*/
|
|
794
|
+
clickToSwitch?: boolean;
|
|
795
|
+
/**
|
|
796
|
+
* Callback when account is clicked
|
|
797
|
+
*/
|
|
798
|
+
onAccountClick?: (account: AccountInfo) => void;
|
|
799
|
+
/**
|
|
800
|
+
* Custom CSS class name
|
|
801
|
+
*/
|
|
802
|
+
className?: string;
|
|
803
|
+
/**
|
|
804
|
+
* Custom inline styles
|
|
805
|
+
*/
|
|
806
|
+
style?: CSSProperties;
|
|
807
|
+
/**
|
|
808
|
+
* Layout orientation
|
|
809
|
+
* @defaultValue 'vertical'
|
|
810
|
+
*/
|
|
811
|
+
orientation?: 'vertical' | 'horizontal';
|
|
812
|
+
}
|
|
813
|
+
/**
|
|
814
|
+
* Account List Component
|
|
815
|
+
*
|
|
816
|
+
* @remarks
|
|
817
|
+
* Display all signed-in Microsoft accounts in a list format.
|
|
818
|
+
* Useful for account management pages or settings screens.
|
|
819
|
+
*
|
|
820
|
+
* @example
|
|
821
|
+
* ```tsx
|
|
822
|
+
* 'use client';
|
|
823
|
+
*
|
|
824
|
+
* import { AccountList } from '@chemmangat/msal-next';
|
|
825
|
+
*
|
|
826
|
+
* export default function AccountsPage() {
|
|
827
|
+
* return (
|
|
828
|
+
* <div>
|
|
829
|
+
* <h1>Your Accounts</h1>
|
|
830
|
+
* <AccountList
|
|
831
|
+
* showAvatars={true}
|
|
832
|
+
* showDetails={true}
|
|
833
|
+
* clickToSwitch={true}
|
|
834
|
+
* onAccountClick={(account) => console.log('Clicked', account.name)}
|
|
835
|
+
* />
|
|
836
|
+
* </div>
|
|
837
|
+
* );
|
|
838
|
+
* }
|
|
839
|
+
* ```
|
|
840
|
+
*/
|
|
841
|
+
declare function AccountList({ showAvatars, showDetails, showActiveIndicator, clickToSwitch, onAccountClick, className, style, orientation, }: AccountListProps): react_jsx_runtime.JSX.Element;
|
|
842
|
+
|
|
698
843
|
interface UseMsalAuthReturn {
|
|
699
844
|
/**
|
|
700
845
|
* Current authenticated account
|
|
@@ -1067,6 +1212,118 @@ interface UseTokenRefreshReturn {
|
|
|
1067
1212
|
*/
|
|
1068
1213
|
declare function useTokenRefresh(options?: UseTokenRefreshOptions): UseTokenRefreshReturn;
|
|
1069
1214
|
|
|
1215
|
+
interface UseMultiAccountReturn {
|
|
1216
|
+
/**
|
|
1217
|
+
* All signed-in accounts
|
|
1218
|
+
*/
|
|
1219
|
+
accounts: AccountInfo[];
|
|
1220
|
+
/**
|
|
1221
|
+
* Currently active account
|
|
1222
|
+
*/
|
|
1223
|
+
activeAccount: AccountInfo | null;
|
|
1224
|
+
/**
|
|
1225
|
+
* Whether user has multiple accounts signed in
|
|
1226
|
+
*/
|
|
1227
|
+
hasMultipleAccounts: boolean;
|
|
1228
|
+
/**
|
|
1229
|
+
* Number of signed-in accounts
|
|
1230
|
+
*/
|
|
1231
|
+
accountCount: number;
|
|
1232
|
+
/**
|
|
1233
|
+
* Whether MSAL is currently performing an interaction
|
|
1234
|
+
*/
|
|
1235
|
+
inProgress: boolean;
|
|
1236
|
+
/**
|
|
1237
|
+
* Switch to a different account
|
|
1238
|
+
* @param account - The account to switch to
|
|
1239
|
+
*/
|
|
1240
|
+
switchAccount: (account: AccountInfo) => void;
|
|
1241
|
+
/**
|
|
1242
|
+
* Add a new account (sign in with another account)
|
|
1243
|
+
* @param scopes - Optional scopes for the new account
|
|
1244
|
+
*/
|
|
1245
|
+
addAccount: (scopes?: string[]) => Promise<void>;
|
|
1246
|
+
/**
|
|
1247
|
+
* Remove an account from the cache
|
|
1248
|
+
* @param account - The account to remove
|
|
1249
|
+
*/
|
|
1250
|
+
removeAccount: (account: AccountInfo) => Promise<void>;
|
|
1251
|
+
/**
|
|
1252
|
+
* Sign out from a specific account
|
|
1253
|
+
* @param account - The account to sign out from
|
|
1254
|
+
*/
|
|
1255
|
+
signOutAccount: (account: AccountInfo) => Promise<void>;
|
|
1256
|
+
/**
|
|
1257
|
+
* Sign out from all accounts
|
|
1258
|
+
*/
|
|
1259
|
+
signOutAll: () => Promise<void>;
|
|
1260
|
+
/**
|
|
1261
|
+
* Get account by username
|
|
1262
|
+
* @param username - The username to search for
|
|
1263
|
+
*/
|
|
1264
|
+
getAccountByUsername: (username: string) => AccountInfo | undefined;
|
|
1265
|
+
/**
|
|
1266
|
+
* Get account by home account ID
|
|
1267
|
+
* @param homeAccountId - The home account ID to search for
|
|
1268
|
+
*/
|
|
1269
|
+
getAccountById: (homeAccountId: string) => AccountInfo | undefined;
|
|
1270
|
+
/**
|
|
1271
|
+
* Check if a specific account is active
|
|
1272
|
+
* @param account - The account to check
|
|
1273
|
+
*/
|
|
1274
|
+
isActiveAccount: (account: AccountInfo) => boolean;
|
|
1275
|
+
}
|
|
1276
|
+
/**
|
|
1277
|
+
* Hook for managing multiple Microsoft accounts
|
|
1278
|
+
*
|
|
1279
|
+
* @remarks
|
|
1280
|
+
* Allows users to sign in with multiple Microsoft accounts and switch between them seamlessly.
|
|
1281
|
+
* Perfect for users who need to access both work and personal accounts, or multiple work accounts.
|
|
1282
|
+
*
|
|
1283
|
+
* @example
|
|
1284
|
+
* ```tsx
|
|
1285
|
+
* 'use client';
|
|
1286
|
+
*
|
|
1287
|
+
* import { useMultiAccount } from '@chemmangat/msal-next';
|
|
1288
|
+
*
|
|
1289
|
+
* export default function AccountManager() {
|
|
1290
|
+
* const {
|
|
1291
|
+
* accounts,
|
|
1292
|
+
* activeAccount,
|
|
1293
|
+
* switchAccount,
|
|
1294
|
+
* addAccount,
|
|
1295
|
+
* removeAccount,
|
|
1296
|
+
* hasMultipleAccounts
|
|
1297
|
+
* } = useMultiAccount();
|
|
1298
|
+
*
|
|
1299
|
+
* return (
|
|
1300
|
+
* <div>
|
|
1301
|
+
* <h2>Active: {activeAccount?.name}</h2>
|
|
1302
|
+
*
|
|
1303
|
+
* {hasMultipleAccounts && (
|
|
1304
|
+
* <div>
|
|
1305
|
+
* <h3>Switch Account:</h3>
|
|
1306
|
+
* {accounts.map(account => (
|
|
1307
|
+
* <button
|
|
1308
|
+
* key={account.homeAccountId}
|
|
1309
|
+
* onClick={() => switchAccount(account)}
|
|
1310
|
+
* >
|
|
1311
|
+
* {account.name}
|
|
1312
|
+
* </button>
|
|
1313
|
+
* ))}
|
|
1314
|
+
* </div>
|
|
1315
|
+
* )}
|
|
1316
|
+
*
|
|
1317
|
+
* <button onClick={() => addAccount()}>
|
|
1318
|
+
* Add Another Account
|
|
1319
|
+
* </button>
|
|
1320
|
+
* </div>
|
|
1321
|
+
* );
|
|
1322
|
+
* }
|
|
1323
|
+
* ```
|
|
1324
|
+
*/
|
|
1325
|
+
declare function useMultiAccount(defaultScopes?: string[]): UseMultiAccountReturn;
|
|
1326
|
+
|
|
1070
1327
|
declare function createMsalConfig(config: MsalAuthConfig): Configuration;
|
|
1071
1328
|
|
|
1072
1329
|
interface WithAuthOptions extends Omit<AuthGuardProps, 'children'> {
|
|
@@ -1548,4 +1805,4 @@ interface ServerSession {
|
|
|
1548
1805
|
accessToken?: string;
|
|
1549
1806
|
}
|
|
1550
1807
|
|
|
1551
|
-
export { AuthGuard, type AuthGuardProps, type AuthMiddlewareConfig, type AuthProtectionConfig, AuthStatus, type AuthStatusProps, type CustomTokenClaims, type DebugLoggerConfig, ErrorBoundary, type ErrorBoundaryProps, type GraphApiOptions, MSALProvider, MicrosoftSignInButton, type MicrosoftSignInButtonProps, type MsalAuthConfig, MsalAuthProvider, type MsalAuthProviderProps, MsalError, type PageAuthConfig, ProtectedPage, type RetryConfig, type ServerSession, SignOutButton, type SignOutButtonProps, type UseGraphApiReturn, type UseMsalAuthReturn, type UseRolesReturn, type UseTokenRefreshOptions, type UseTokenRefreshReturn, type UseUserProfileReturn, UserAvatar, type UserAvatarProps, type UserProfile, type ValidatedAccountData, type ValidationError, type ValidationResult, type ValidationWarning, type WithAuthOptions, createAuthMiddleware, createMissingEnvVarError, createMsalConfig, createRetryWrapper, createScopedLogger, displayValidationResults, getDebugLogger, getMsalInstance, isValidAccountData, isValidRedirectUri, isValidScope, retryWithBackoff, safeJsonParse, sanitizeError, useGraphApi, useMsalAuth, useRoles, useTokenRefresh, useUserProfile, validateConfig, validateScopes, withAuth, withPageAuth, wrapMsalError };
|
|
1808
|
+
export { AccountList, type AccountListProps, AccountSwitcher, type AccountSwitcherProps, AuthGuard, type AuthGuardProps, type AuthMiddlewareConfig, type AuthProtectionConfig, AuthStatus, type AuthStatusProps, type CustomTokenClaims, type DebugLoggerConfig, ErrorBoundary, type ErrorBoundaryProps, type GraphApiOptions, MSALProvider, MicrosoftSignInButton, type MicrosoftSignInButtonProps, type MsalAuthConfig, MsalAuthProvider, type MsalAuthProviderProps, MsalError, type PageAuthConfig, ProtectedPage, type RetryConfig, type ServerSession, SignOutButton, type SignOutButtonProps, type UseGraphApiReturn, type UseMsalAuthReturn, type UseMultiAccountReturn, type UseRolesReturn, type UseTokenRefreshOptions, type UseTokenRefreshReturn, type UseUserProfileReturn, UserAvatar, type UserAvatarProps, type UserProfile, type ValidatedAccountData, type ValidationError, type ValidationResult, type ValidationWarning, type WithAuthOptions, createAuthMiddleware, createMissingEnvVarError, createMsalConfig, createRetryWrapper, createScopedLogger, displayValidationResults, getDebugLogger, getMsalInstance, isValidAccountData, isValidRedirectUri, isValidScope, retryWithBackoff, safeJsonParse, sanitizeError, useGraphApi, useMsalAuth, useMultiAccount, useRoles, useTokenRefresh, useUserProfile, validateConfig, validateScopes, withAuth, withPageAuth, wrapMsalError };
|