@frontegg/types 4.42.2 → 4.43.0-dashboard
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/Common.d.ts +3 -0
- package/ContextOptions.d.ts +1 -1
- package/FronteggAppInstance.d.ts +1 -0
- package/FronteggAppOptions.d.ts +4 -0
- package/FronteggMetadata.d.ts +5 -0
- package/Localizations/AdminPortalLocalizations/navigation.d.ts +4 -0
- package/Localizations/AdminPortalLocalizations/sso.d.ts +27 -0
- package/Localizations/LocalizationOverrides.d.ts +1 -0
- package/Localizations/LocalizationType.d.ts +1 -0
- package/Localizations/LoginBoxLocalization/acceptInvitation.d.ts +4 -0
- package/Localizations/LoginBoxLocalization/activateAccount.d.ts +4 -0
- package/Localizations/LoginBoxLocalization/forgetPassword.d.ts +8 -0
- package/Localizations/LoginBoxLocalization/index.d.ts +8 -0
- package/Localizations/LoginBoxLocalization/login.d.ts +16 -0
- package/Localizations/LoginBoxLocalization/resetPassword.d.ts +8 -0
- package/Localizations/LoginBoxLocalization/signup.d.ts +8 -0
- package/Metadata/index.d.ts +2 -0
- package/ThemeOptions/ComponentsOptions.d.ts +63 -0
- package/ThemeOptions/LoginBoxTheme/AcceptInvitationTheme.d.ts +21 -0
- package/ThemeOptions/LoginBoxTheme/ActivateAccountPageTheme.d.ts +52 -0
- package/ThemeOptions/LoginBoxTheme/CustomLoginComponents.d.ts +12 -0
- package/ThemeOptions/LoginBoxTheme/ForgotPasswordTheme.d.ts +46 -0
- package/ThemeOptions/LoginBoxTheme/LoaderTheme.d.ts +7 -0
- package/ThemeOptions/LoginBoxTheme/LoginBoxCommon.d.ts +171 -0
- package/ThemeOptions/LoginBoxTheme/LoginPageTheme.d.ts +119 -0
- package/ThemeOptions/LoginBoxTheme/ResetPasswordTheme.d.ts +48 -0
- package/ThemeOptions/LoginBoxTheme/SignupPageTheme.d.ts +46 -0
- package/ThemeOptions/LoginBoxTheme/SocialLoginsTheme.d.ts +36 -0
- package/ThemeOptions/LoginBoxTheme/index.d.ts +51 -0
- package/ThemeOptions/LoginBoxThemeOptions.d.ts +3 -8
- package/ThemeOptions/helpers.d.ts +0 -0
- package/ThemeOptions/index.d.ts +6 -190
- package/index.js +16 -5
- package/node/index.js +16 -5
- package/package.json +2 -2
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { LoginBoxCommonTheme, LoginBoxCommonThemeOptions } from '../index';
|
|
2
|
+
import { ExtendedCSSProperties } from '../../Common';
|
|
3
|
+
import { CustomComponent } from '../ComponentsOptions';
|
|
4
|
+
import { ReactNode } from 'react';
|
|
5
|
+
interface TitleProps {
|
|
6
|
+
title: string;
|
|
7
|
+
}
|
|
8
|
+
interface MessageProps {
|
|
9
|
+
message: ReactNode;
|
|
10
|
+
}
|
|
11
|
+
export interface GoToSignupMessageProps {
|
|
12
|
+
goToSignup: () => void;
|
|
13
|
+
goToSignupMessage: string;
|
|
14
|
+
goToSignupButtonText: string;
|
|
15
|
+
}
|
|
16
|
+
export interface ResendOTCProps {
|
|
17
|
+
haventReceiveOTCMessage: string;
|
|
18
|
+
resendOTCMessage: string;
|
|
19
|
+
resendOTC: () => void;
|
|
20
|
+
}
|
|
21
|
+
export interface LoginPageComponentsTheme {
|
|
22
|
+
/**
|
|
23
|
+
* Login page container style
|
|
24
|
+
*/
|
|
25
|
+
containerStyle?: ExtendedCSSProperties;
|
|
26
|
+
/**
|
|
27
|
+
* Login page form container style
|
|
28
|
+
*/
|
|
29
|
+
formContainerStyle?: ExtendedCSSProperties;
|
|
30
|
+
/**
|
|
31
|
+
* Login page title default is 'Sign In'
|
|
32
|
+
* displayed in login screen (login with password, pre-login)
|
|
33
|
+
* passing 'null' will hide the title
|
|
34
|
+
*/
|
|
35
|
+
title?: CustomComponent<TitleProps>;
|
|
36
|
+
/**
|
|
37
|
+
* Direct css style for Login Page title
|
|
38
|
+
*/
|
|
39
|
+
titleStyle?: ExtendedCSSProperties;
|
|
40
|
+
/**
|
|
41
|
+
* Go to signup component displayed under box title default is 'Don't have an account? Sign up'
|
|
42
|
+
* displayed in login screen (login with password, pre-login)
|
|
43
|
+
* passing 'null' will hide the signup message
|
|
44
|
+
*/
|
|
45
|
+
signupMessage?: CustomComponent<GoToSignupMessageProps>;
|
|
46
|
+
/**
|
|
47
|
+
* Direct css style for 'Go to signup component'
|
|
48
|
+
*/
|
|
49
|
+
signupMessageStyle?: ExtendedCSSProperties;
|
|
50
|
+
/**
|
|
51
|
+
* Recover Multi-factor page title default is 'Recover MFA'
|
|
52
|
+
* displayed in recover mfa screen
|
|
53
|
+
* passing 'null' will hide the title
|
|
54
|
+
*/
|
|
55
|
+
recoverMfaTitle?: CustomComponent<TitleProps>;
|
|
56
|
+
/**
|
|
57
|
+
* Direct css style for Recover Multi-factor title
|
|
58
|
+
*/
|
|
59
|
+
recoverMfaTitleStyle?: ExtendedCSSProperties;
|
|
60
|
+
/**
|
|
61
|
+
* One time code login title default is 'Check your email'
|
|
62
|
+
* displayed after pre-login with OTC enabled
|
|
63
|
+
* passing 'null' will hide the title
|
|
64
|
+
*/
|
|
65
|
+
otcTitle?: CustomComponent<TitleProps>;
|
|
66
|
+
/**
|
|
67
|
+
* Direct css style for One time code
|
|
68
|
+
*/
|
|
69
|
+
otcTitleStyle?: ExtendedCSSProperties;
|
|
70
|
+
/**
|
|
71
|
+
* One time code login message component default is 'We have sent an six-digit code to smaple@email.com'
|
|
72
|
+
* displayed after pre-login with OTC enabled
|
|
73
|
+
* passing 'null' will hide the title
|
|
74
|
+
*/
|
|
75
|
+
otcMessage?: CustomComponent<MessageProps>;
|
|
76
|
+
/**
|
|
77
|
+
* Direct css style for One time code login message
|
|
78
|
+
*/
|
|
79
|
+
otcMessageStyle?: ExtendedCSSProperties;
|
|
80
|
+
/**
|
|
81
|
+
* Resend OTC container component, displaye after otc submit button,
|
|
82
|
+
* passing 'null' will hide the otc resend button
|
|
83
|
+
*/
|
|
84
|
+
resendOTC?: ExtendedCSSProperties;
|
|
85
|
+
/**
|
|
86
|
+
* Direct css style for Resent OTC container
|
|
87
|
+
*/
|
|
88
|
+
resendOTCStyle?: ExtendedCSSProperties;
|
|
89
|
+
/**
|
|
90
|
+
* Direct style for the text displayed before resend otc button,
|
|
91
|
+
* default is 'Haven’t received it?'
|
|
92
|
+
*/
|
|
93
|
+
resendOTCMessageStyle?: ExtendedCSSProperties;
|
|
94
|
+
/**
|
|
95
|
+
* MagicLink success login title default is 'Check your email'
|
|
96
|
+
* displayed after pre-login if MagicLink enabled
|
|
97
|
+
* passing 'null' will hide the title
|
|
98
|
+
*/
|
|
99
|
+
magicLinkTitle?: CustomComponent<TitleProps>;
|
|
100
|
+
/**
|
|
101
|
+
* Direct css style for MagicLink title
|
|
102
|
+
*/
|
|
103
|
+
magicLinkTitleStyle?: ExtendedCSSProperties;
|
|
104
|
+
/**
|
|
105
|
+
* MagicLink login message component default is 'We have sent an email to smaple@email.com'
|
|
106
|
+
* displayed after pre-login with MagicLink enabled
|
|
107
|
+
* passing 'null' will hide the title
|
|
108
|
+
*/
|
|
109
|
+
magicLinkMessage?: CustomComponent<MessageProps>;
|
|
110
|
+
/**
|
|
111
|
+
* Direct css style for MagicLink message
|
|
112
|
+
*/
|
|
113
|
+
magicLinkMessageStyle?: ExtendedCSSProperties;
|
|
114
|
+
}
|
|
115
|
+
export interface LoginPageThemeOptions extends LoginBoxCommonThemeOptions, LoginPageComponentsTheme {
|
|
116
|
+
}
|
|
117
|
+
export interface LoginPageTheme extends LoginBoxCommonTheme, LoginPageComponentsTheme {
|
|
118
|
+
}
|
|
119
|
+
export {};
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { CustomComponent, LoginBoxCommonTheme, LoginBoxCommonThemeOptions } from '../index';
|
|
2
|
+
import { ExtendedCSSProperties } from '../../Common';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
interface TitleProps {
|
|
5
|
+
title: string;
|
|
6
|
+
}
|
|
7
|
+
interface MessageProps {
|
|
8
|
+
message: ReactNode;
|
|
9
|
+
}
|
|
10
|
+
interface ResetPasswordComponentsTheme {
|
|
11
|
+
/**
|
|
12
|
+
* Forgot password page container style
|
|
13
|
+
*/
|
|
14
|
+
containerStyle?: ExtendedCSSProperties;
|
|
15
|
+
/**
|
|
16
|
+
* Forgot password page form container style
|
|
17
|
+
*/
|
|
18
|
+
formContainerStyle?: ExtendedCSSProperties;
|
|
19
|
+
/**
|
|
20
|
+
* Reset password page success container style
|
|
21
|
+
*/
|
|
22
|
+
successContainerStyle?: ExtendedCSSProperties;
|
|
23
|
+
/**
|
|
24
|
+
* Reset password page title default is 'Reset Password'
|
|
25
|
+
* displayed in forgot password form screen
|
|
26
|
+
* passing 'null' will hide the title
|
|
27
|
+
*/
|
|
28
|
+
title?: CustomComponent<TitleProps>;
|
|
29
|
+
/**
|
|
30
|
+
* Direct css style for Forgot password Page title
|
|
31
|
+
*/
|
|
32
|
+
titleStyle?: ExtendedCSSProperties;
|
|
33
|
+
/**
|
|
34
|
+
* Reset password page message default is hidden
|
|
35
|
+
* displayed in forgot password form screen
|
|
36
|
+
* passing 'null' will hide the message
|
|
37
|
+
*/
|
|
38
|
+
message?: CustomComponent<MessageProps>;
|
|
39
|
+
/**
|
|
40
|
+
* Direct css style for Forgot password Page message
|
|
41
|
+
*/
|
|
42
|
+
messageStyle?: ExtendedCSSProperties;
|
|
43
|
+
}
|
|
44
|
+
export interface ResetPasswordPageThemeOptions extends LoginBoxCommonThemeOptions, ResetPasswordComponentsTheme {
|
|
45
|
+
}
|
|
46
|
+
export interface ResetPasswordPageTheme extends LoginBoxCommonTheme, ResetPasswordComponentsTheme {
|
|
47
|
+
}
|
|
48
|
+
export {};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { LoginBoxCommonTheme, LoginBoxCommonThemeOptions } from '../index';
|
|
2
|
+
import { ExtendedCSSProperties } from '../../Common';
|
|
3
|
+
import { CustomComponent } from '../ComponentsOptions';
|
|
4
|
+
interface TitleProps {
|
|
5
|
+
title: string;
|
|
6
|
+
}
|
|
7
|
+
export interface GoToLoginMessageProps {
|
|
8
|
+
goToLogin: () => void;
|
|
9
|
+
goToLoginMessage: string;
|
|
10
|
+
goToLoginButtonText: string;
|
|
11
|
+
}
|
|
12
|
+
export interface SignupPageComponentsTheme {
|
|
13
|
+
/**
|
|
14
|
+
* Login page container style
|
|
15
|
+
*/
|
|
16
|
+
containerStyle?: ExtendedCSSProperties;
|
|
17
|
+
/**
|
|
18
|
+
* Login page form container style
|
|
19
|
+
*/
|
|
20
|
+
formContainerStyle?: ExtendedCSSProperties;
|
|
21
|
+
/**
|
|
22
|
+
* Login page title default is 'Sign In'
|
|
23
|
+
* displayed in login screen (login with password, pre-login)
|
|
24
|
+
* passing 'null' will hide the title
|
|
25
|
+
*/
|
|
26
|
+
title?: CustomComponent<TitleProps>;
|
|
27
|
+
/**
|
|
28
|
+
* Direct css style for Login Page title
|
|
29
|
+
*/
|
|
30
|
+
titleStyle?: ExtendedCSSProperties;
|
|
31
|
+
/**
|
|
32
|
+
* Go to login component displayed under box title default is 'Already have an account?'
|
|
33
|
+
* displayed in login screen (login with password, pre-login)
|
|
34
|
+
* passing 'null' will hide the signup message
|
|
35
|
+
*/
|
|
36
|
+
loginMessage?: CustomComponent<GoToLoginMessageProps>;
|
|
37
|
+
/**
|
|
38
|
+
* Direct css style for 'Go to Login'
|
|
39
|
+
*/
|
|
40
|
+
loginMessageStyle?: ExtendedCSSProperties;
|
|
41
|
+
}
|
|
42
|
+
export interface SignupPageThemeOptions extends LoginBoxCommonThemeOptions, SignupPageComponentsTheme {
|
|
43
|
+
}
|
|
44
|
+
export interface SignupPageTheme extends LoginBoxCommonTheme, SignupPageComponentsTheme {
|
|
45
|
+
}
|
|
46
|
+
export {};
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { ExtendedCSSProperties } from '../../Common';
|
|
2
|
+
import { BaseTheme, BaseThemeOptions, ButtonThemeOptions } from '../index';
|
|
3
|
+
export interface SocialLoginComponentKeyRender {
|
|
4
|
+
divider: {
|
|
5
|
+
text: string;
|
|
6
|
+
};
|
|
7
|
+
googleIcon: {};
|
|
8
|
+
microsoftIcon: {};
|
|
9
|
+
facebookIcon: {};
|
|
10
|
+
githubIcon: {};
|
|
11
|
+
}
|
|
12
|
+
export declare type SocialLoginCustomComponent<T extends keyof SocialLoginComponentKeyRender> = string | ((props?: SocialLoginComponentKeyRender[T]) => string | any);
|
|
13
|
+
export interface SocialLoginsThemeOptions extends BaseThemeOptions {
|
|
14
|
+
divider?: SocialLoginCustomComponent<'divider'>;
|
|
15
|
+
dividerStyle?: ExtendedCSSProperties;
|
|
16
|
+
dividerTextStyle?: ExtendedCSSProperties;
|
|
17
|
+
containerStyle?: ExtendedCSSProperties;
|
|
18
|
+
buttonStyle?: Omit<ButtonThemeOptions, 'disabled'>;
|
|
19
|
+
iconsOnly?: boolean;
|
|
20
|
+
googleIcon?: SocialLoginCustomComponent<'googleIcon'>;
|
|
21
|
+
microsoftIcon?: SocialLoginCustomComponent<'microsoftIcon'>;
|
|
22
|
+
facebookIcon?: SocialLoginCustomComponent<'facebookIcon'>;
|
|
23
|
+
githubIcon?: SocialLoginCustomComponent<'githubIcon'>;
|
|
24
|
+
}
|
|
25
|
+
export interface SocialLoginsTheme extends BaseTheme {
|
|
26
|
+
dividerStyle?: ExtendedCSSProperties;
|
|
27
|
+
dividerTextStyle?: ExtendedCSSProperties;
|
|
28
|
+
divider?: SocialLoginCustomComponent<'divider'>;
|
|
29
|
+
containerStyle?: ExtendedCSSProperties;
|
|
30
|
+
buttonStyle?: Omit<ButtonThemeOptions, 'disabled'>;
|
|
31
|
+
iconsOnly?: boolean;
|
|
32
|
+
googleIcon?: SocialLoginCustomComponent<'googleIcon'>;
|
|
33
|
+
microsoftIcon?: SocialLoginCustomComponent<'microsoftIcon'>;
|
|
34
|
+
facebookIcon?: SocialLoginCustomComponent<'facebookIcon'>;
|
|
35
|
+
githubIcon?: SocialLoginCustomComponent<'githubIcon'>;
|
|
36
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { AcceptInvitationPageTheme, AcceptInvitationPageThemeOptions } from './AcceptInvitationTheme';
|
|
2
|
+
import { ActivateAccountPageTheme, ActivateAccountPageThemeOptions } from './ActivateAccountPageTheme';
|
|
3
|
+
import { BaseThemeOptions, LoginBoxCommonTheme, LoginBoxCommonThemeOptions, SignupPageThemeOptions } from '../index';
|
|
4
|
+
import { CSSProperties, ExtendedCSSProperties } from '../../Common';
|
|
5
|
+
import { AuthPageCustomComponents } from '../../CustomComponents';
|
|
6
|
+
import { ForgotPasswordPageTheme, ForgotPasswordPageThemeOptions } from './ForgotPasswordTheme';
|
|
7
|
+
import { ResetPasswordPageTheme, ResetPasswordPageThemeOptions } from './ResetPasswordTheme';
|
|
8
|
+
import { LoginPageTheme, LoginPageThemeOptions } from './LoginPageTheme';
|
|
9
|
+
import { SocialLoginsTheme, SocialLoginsThemeOptions } from './SocialLoginsTheme';
|
|
10
|
+
import { LoaderTheme, LoaderThemeOptions } from './LoaderTheme';
|
|
11
|
+
import { SignupPageTheme } from './SignupPageTheme';
|
|
12
|
+
export * from './LoginBoxCommon';
|
|
13
|
+
export * from './LoginPageTheme';
|
|
14
|
+
export * from './SignupPageTheme';
|
|
15
|
+
export * from './CustomLoginComponents';
|
|
16
|
+
export * from './SocialLoginsTheme';
|
|
17
|
+
export * from './ForgotPasswordTheme';
|
|
18
|
+
export * from './ResetPasswordTheme';
|
|
19
|
+
export * from './ActivateAccountPageTheme';
|
|
20
|
+
export * from './AcceptInvitationTheme';
|
|
21
|
+
export interface AuthPageThemeOptions extends BaseThemeOptions, AuthPageCustomComponents {
|
|
22
|
+
style?: ExtendedCSSProperties;
|
|
23
|
+
layout?: {
|
|
24
|
+
width?: CSSProperties['width'];
|
|
25
|
+
marginLeft?: CSSProperties['marginLeft'];
|
|
26
|
+
outerCustomBackground?: any;
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
export interface LoginBoxThemeOptions extends LoginBoxCommonThemeOptions {
|
|
30
|
+
themeName?: 'classic' | 'modern' | 'vivid' | 'dark';
|
|
31
|
+
poweredByPlacement?: 'box' | 'page';
|
|
32
|
+
acceptInvitation?: AcceptInvitationPageThemeOptions;
|
|
33
|
+
activateAccount?: ActivateAccountPageThemeOptions;
|
|
34
|
+
forgotPassword?: ForgotPasswordPageThemeOptions;
|
|
35
|
+
resetPassword?: ResetPasswordPageThemeOptions;
|
|
36
|
+
login?: LoginPageThemeOptions;
|
|
37
|
+
signup?: SignupPageThemeOptions;
|
|
38
|
+
socialLogins?: SocialLoginsThemeOptions;
|
|
39
|
+
loader?: LoaderThemeOptions;
|
|
40
|
+
}
|
|
41
|
+
export interface LoginBoxTheme extends LoginBoxCommonTheme {
|
|
42
|
+
themeName: 'classic' | 'modern' | 'vivid' | 'dark';
|
|
43
|
+
acceptInvitation: AcceptInvitationPageTheme;
|
|
44
|
+
activateAccount: ActivateAccountPageTheme;
|
|
45
|
+
forgotPassword: ForgotPasswordPageTheme;
|
|
46
|
+
resetPassword: ResetPasswordPageTheme;
|
|
47
|
+
login: LoginPageTheme;
|
|
48
|
+
signup: SignupPageTheme;
|
|
49
|
+
socialLogins: SocialLoginsTheme;
|
|
50
|
+
loader: LoaderTheme;
|
|
51
|
+
}
|
|
@@ -22,6 +22,9 @@ export declare type SocialLogins = BaseThemeOptions & {
|
|
|
22
22
|
iconWidth?: string;
|
|
23
23
|
} & Record<SocialLoginTypes, SocialLoginButton>;
|
|
24
24
|
export interface AuthPageThemeOptions extends BaseThemeOptions, AuthPageCustomComponents {
|
|
25
|
+
style?: CSSProperties & {
|
|
26
|
+
[k in string]: CSSProperties;
|
|
27
|
+
};
|
|
25
28
|
layout?: {
|
|
26
29
|
width?: CSSProperties['width'];
|
|
27
30
|
marginLeft?: CSSProperties['marginLeft'];
|
|
@@ -41,11 +44,3 @@ export interface LoginFormThemeOptions extends AuthPageThemeOptions {
|
|
|
41
44
|
loginWithSsoFailed?: AuthPageThemeOptions;
|
|
42
45
|
forceEnrollMfa?: AuthPageThemeOptions;
|
|
43
46
|
}
|
|
44
|
-
export interface LoginBoxThemeOptions extends AuthPageThemeOptions {
|
|
45
|
-
login?: LoginFormThemeOptions;
|
|
46
|
-
signup?: AuthPageThemeOptions;
|
|
47
|
-
acceptInvitation?: AuthPageThemeOptions;
|
|
48
|
-
activateAccount?: AuthPageThemeOptions;
|
|
49
|
-
forgetPassword?: AuthPageThemeOptions;
|
|
50
|
-
resetPassword?: AuthPageThemeOptions;
|
|
51
|
-
}
|
|
File without changes
|
package/ThemeOptions/index.d.ts
CHANGED
|
@@ -6,8 +6,10 @@ import { Transitions, TransitionsOptions } from './TransitionsOptions';
|
|
|
6
6
|
import { Breakpoints, BreakpointsOptions } from './BreakpointsOptions';
|
|
7
7
|
import { ComponentsOptions } from './ComponentsOptions';
|
|
8
8
|
import { TypographyOptions, Typography } from './TypographyOptions';
|
|
9
|
-
import { AdminPortalThemeOptions } from './AdminPortalThemeOptions';
|
|
10
|
-
import { LoginBoxThemeOptions } from './
|
|
9
|
+
import { AdminPortalTheme, AdminPortalThemeOptions } from './AdminPortalThemeOptions';
|
|
10
|
+
import { LoginBoxTheme, LoginBoxThemeOptions } from './LoginBoxTheme';
|
|
11
|
+
export * from './LoginBoxTheme';
|
|
12
|
+
export * from './ComponentsOptions';
|
|
11
13
|
export declare type Direction = 'ltr' | 'rtl';
|
|
12
14
|
export interface FronteggThemeOptions {
|
|
13
15
|
palette?: ThemePaletteOptions;
|
|
@@ -21,107 +23,7 @@ export interface FronteggThemeOptions {
|
|
|
21
23
|
typography?: TypographyOptions;
|
|
22
24
|
adminPortal?: AdminPortalThemeOptions;
|
|
23
25
|
loginBox?: LoginBoxThemeOptions;
|
|
24
|
-
navigation?: {
|
|
25
|
-
groupTitleColor?: CSSProperties['color'];
|
|
26
|
-
groupTitleSize?: CSSProperties['fontSize'];
|
|
27
|
-
headerColor?: CSSProperties['color'];
|
|
28
|
-
subHeaderColor?: CSSProperties['color'];
|
|
29
|
-
background?: CSSProperties['background'];
|
|
30
|
-
default: {
|
|
31
|
-
color?: CSSProperties['color'];
|
|
32
|
-
borderColor?: CSSProperties['borderColor'];
|
|
33
|
-
avatarBgColor?: CSSProperties['background'];
|
|
34
|
-
avatarColor?: CSSProperties['color'];
|
|
35
|
-
};
|
|
36
|
-
hover: {
|
|
37
|
-
color?: CSSProperties['color'];
|
|
38
|
-
background?: CSSProperties['background'];
|
|
39
|
-
borderColor?: CSSProperties['borderColor'];
|
|
40
|
-
avatarColor?: CSSProperties['color'];
|
|
41
|
-
avatarBgColor?: CSSProperties['backgroundColor'];
|
|
42
|
-
};
|
|
43
|
-
selected: {
|
|
44
|
-
color?: CSSProperties['color'];
|
|
45
|
-
background?: CSSProperties['background'];
|
|
46
|
-
borderColor?: CSSProperties['borderColor'];
|
|
47
|
-
avatarColor?: CSSProperties['color'];
|
|
48
|
-
avatarBgColor?: CSSProperties['backgroundColor'];
|
|
49
|
-
};
|
|
50
|
-
};
|
|
51
|
-
dialog?: {
|
|
52
|
-
headerBackground?: CSSProperties['background'];
|
|
53
|
-
headerTextColor?: CSSProperties['color'];
|
|
54
|
-
bodyBackground?: CSSProperties['background'];
|
|
55
|
-
footerBackground?: CSSProperties['background'];
|
|
56
|
-
};
|
|
57
|
-
socialLogins?: {
|
|
58
|
-
rowLayout?: boolean;
|
|
59
|
-
google?: socialLogin;
|
|
60
|
-
github?: socialLogin;
|
|
61
|
-
facebook?: socialLogin;
|
|
62
|
-
microsoft?: socialLogin;
|
|
63
|
-
};
|
|
64
|
-
rightPanel?: {
|
|
65
|
-
headerBackground?: CSSProperties['background'];
|
|
66
|
-
pageBackground?: CSSProperties['background'];
|
|
67
|
-
elementBackground?: CSSProperties['color'];
|
|
68
|
-
profileHeader?: CSSProperties['background'];
|
|
69
|
-
tableHeaderBackground?: CSSProperties['background'];
|
|
70
|
-
tableBodyBackground?: CSSProperties['background'];
|
|
71
|
-
};
|
|
72
|
-
authPage?: {
|
|
73
|
-
loginBox: {
|
|
74
|
-
width?: CSSProperties['width'];
|
|
75
|
-
padding?: CSSProperties['padding'];
|
|
76
|
-
border?: CSSProperties['border'];
|
|
77
|
-
borderRadius?: CSSProperties['borderRadius'];
|
|
78
|
-
boxShadow?: CSSProperties['boxShadow'];
|
|
79
|
-
backgroundCard?: CSSProperties['background'];
|
|
80
|
-
};
|
|
81
|
-
loginSignupSwitch?: {
|
|
82
|
-
color?: CSSProperties['color'];
|
|
83
|
-
fontSize?: CSSProperties['fontSize'];
|
|
84
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
85
|
-
textAlign?: CSSProperties['textAlign'];
|
|
86
|
-
padding?: CSSProperties['padding'];
|
|
87
|
-
margin?: CSSProperties['margin'];
|
|
88
|
-
link?: {
|
|
89
|
-
color?: CSSProperties['color'];
|
|
90
|
-
decoration?: CSSProperties['textDecoration'];
|
|
91
|
-
fontWeight?: CSSProperties['fontWeight'];
|
|
92
|
-
};
|
|
93
|
-
};
|
|
94
|
-
inputError?: {
|
|
95
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
96
|
-
fontSize?: CSSProperties['fontSize'];
|
|
97
|
-
fontWeight?: CSSProperties['fontWeight'];
|
|
98
|
-
padding?: CSSProperties['padding'];
|
|
99
|
-
};
|
|
100
|
-
};
|
|
101
|
-
subHeaderMsg?: {
|
|
102
|
-
color?: CSSProperties['color'];
|
|
103
|
-
fontSize?: CSSProperties['fontSize'];
|
|
104
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
105
|
-
textAlign?: CSSProperties['textAlign'];
|
|
106
|
-
padding?: CSSProperties['padding'];
|
|
107
|
-
margin?: CSSProperties['margin'];
|
|
108
|
-
textDecoration?: CSSProperties['textDecoration'];
|
|
109
|
-
};
|
|
110
26
|
}
|
|
111
|
-
export declare type socialLogin = {
|
|
112
|
-
background?: CSSProperties['background'];
|
|
113
|
-
default: {
|
|
114
|
-
color?: CSSProperties['color'];
|
|
115
|
-
};
|
|
116
|
-
hover: {
|
|
117
|
-
color?: CSSProperties['color'];
|
|
118
|
-
background?: CSSProperties['background'];
|
|
119
|
-
};
|
|
120
|
-
selected: {
|
|
121
|
-
color?: CSSProperties['color'];
|
|
122
|
-
background?: CSSProperties['background'];
|
|
123
|
-
};
|
|
124
|
-
};
|
|
125
27
|
export interface FronteggTheme {
|
|
126
28
|
palette: ThemePalette;
|
|
127
29
|
typographyStyleOptions: CSSProperties;
|
|
@@ -132,94 +34,8 @@ export interface FronteggTheme {
|
|
|
132
34
|
direction: Direction;
|
|
133
35
|
components: ComponentsOptions;
|
|
134
36
|
typography: Typography;
|
|
135
|
-
adminPortal
|
|
136
|
-
loginBox
|
|
137
|
-
navigation: {
|
|
138
|
-
groupTitleColor: CSSProperties['color'];
|
|
139
|
-
groupTitleSize: CSSProperties['fontSize'];
|
|
140
|
-
headerColor: CSSProperties['color'];
|
|
141
|
-
subHeaderColor: CSSProperties['color'];
|
|
142
|
-
background: CSSProperties['background'];
|
|
143
|
-
default: {
|
|
144
|
-
color?: CSSProperties['color'];
|
|
145
|
-
borderColor?: CSSProperties['borderColor'];
|
|
146
|
-
avatarBgColor?: CSSProperties['background'];
|
|
147
|
-
avatarColor?: CSSProperties['color'];
|
|
148
|
-
};
|
|
149
|
-
hover: {
|
|
150
|
-
color?: CSSProperties['color'];
|
|
151
|
-
background?: CSSProperties['background'];
|
|
152
|
-
borderColor?: CSSProperties['borderColor'];
|
|
153
|
-
avatarColor?: CSSProperties['color'];
|
|
154
|
-
avatarBgColor?: CSSProperties['backgroundColor'];
|
|
155
|
-
};
|
|
156
|
-
selected: {
|
|
157
|
-
color?: CSSProperties['color'];
|
|
158
|
-
background?: CSSProperties['background'];
|
|
159
|
-
borderColor?: CSSProperties['borderColor'];
|
|
160
|
-
avatarColor?: CSSProperties['color'];
|
|
161
|
-
avatarBgColor?: CSSProperties['backgroundColor'];
|
|
162
|
-
};
|
|
163
|
-
};
|
|
164
|
-
dialog: {
|
|
165
|
-
headerBackground?: CSSProperties['background'];
|
|
166
|
-
headerTextColor?: CSSProperties['color'];
|
|
167
|
-
bodyBackground?: CSSProperties['background'];
|
|
168
|
-
footerBackground?: CSSProperties['background'];
|
|
169
|
-
};
|
|
170
|
-
socialLogins: {
|
|
171
|
-
rowLayout?: boolean;
|
|
172
|
-
google?: socialLogin;
|
|
173
|
-
github?: socialLogin;
|
|
174
|
-
facebook?: socialLogin;
|
|
175
|
-
microsoft?: socialLogin;
|
|
176
|
-
};
|
|
177
|
-
rightPanel: {
|
|
178
|
-
headerBackground?: CSSProperties['background'];
|
|
179
|
-
pageBackground?: CSSProperties['background'];
|
|
180
|
-
elementBackground?: CSSProperties['color'];
|
|
181
|
-
profileHeader?: CSSProperties['background'];
|
|
182
|
-
tableHeaderBackground?: CSSProperties['background'];
|
|
183
|
-
tableBodyBackground?: CSSProperties['background'];
|
|
184
|
-
};
|
|
185
|
-
authPage: {
|
|
186
|
-
loginBox: {
|
|
187
|
-
width?: CSSProperties['width'];
|
|
188
|
-
padding?: CSSProperties['padding'];
|
|
189
|
-
border?: CSSProperties['border'];
|
|
190
|
-
borderRadius?: CSSProperties['borderRadius'];
|
|
191
|
-
boxShadow?: CSSProperties['boxShadow'];
|
|
192
|
-
backgroundCard?: CSSProperties['background'];
|
|
193
|
-
};
|
|
194
|
-
loginSignupSwitch?: {
|
|
195
|
-
color?: CSSProperties['color'];
|
|
196
|
-
fontSize?: CSSProperties['fontSize'];
|
|
197
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
198
|
-
textAlign?: CSSProperties['textAlign'];
|
|
199
|
-
padding?: CSSProperties['padding'];
|
|
200
|
-
margin?: CSSProperties['margin'];
|
|
201
|
-
link?: {
|
|
202
|
-
color?: CSSProperties['color'];
|
|
203
|
-
decoration?: CSSProperties['textDecoration'];
|
|
204
|
-
fontWeight?: CSSProperties['fontWeight'];
|
|
205
|
-
};
|
|
206
|
-
};
|
|
207
|
-
inputError: {
|
|
208
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
209
|
-
fontSize?: CSSProperties['fontSize'];
|
|
210
|
-
fontWeight?: CSSProperties['fontWeight'];
|
|
211
|
-
padding?: CSSProperties['padding'];
|
|
212
|
-
};
|
|
213
|
-
};
|
|
214
|
-
subHeaderMsg: {
|
|
215
|
-
color?: CSSProperties['color'];
|
|
216
|
-
fontSize?: CSSProperties['fontSize'];
|
|
217
|
-
fontFamily?: CSSProperties['fontFamily'];
|
|
218
|
-
textAlign?: CSSProperties['textAlign'];
|
|
219
|
-
padding?: CSSProperties['padding'];
|
|
220
|
-
margin?: CSSProperties['margin'];
|
|
221
|
-
textDecoration?: CSSProperties['textDecoration'];
|
|
222
|
-
};
|
|
37
|
+
adminPortal: AdminPortalTheme;
|
|
38
|
+
loginBox: LoginBoxTheme;
|
|
223
39
|
}
|
|
224
40
|
export declare type BaseThemeOptions = Omit<FronteggThemeOptions, 'adminPortal' | 'loginBox'>;
|
|
225
41
|
export declare type BaseTheme = Omit<FronteggTheme, 'adminPortal' | 'loginBox'>;
|
package/index.js
CHANGED
|
@@ -327,6 +327,7 @@ const getPalette = (theme, defaultTheme) => {
|
|
|
327
327
|
|
|
328
328
|
const defaultMetadata = {
|
|
329
329
|
theme: {},
|
|
330
|
+
themeV2: {},
|
|
330
331
|
navigation: {
|
|
331
332
|
usage: {
|
|
332
333
|
visibility: 'hidden',
|
|
@@ -334,7 +335,7 @@ const defaultMetadata = {
|
|
|
334
335
|
featureFlag: 'fe-usage-page',
|
|
335
336
|
},
|
|
336
337
|
webhooks: {
|
|
337
|
-
visibility: '
|
|
338
|
+
visibility: 'hidden',
|
|
338
339
|
permissions: ['fe.connectivity.read.webhooks'],
|
|
339
340
|
},
|
|
340
341
|
roles: {
|
|
@@ -350,10 +351,10 @@ const defaultMetadata = {
|
|
|
350
351
|
},
|
|
351
352
|
},
|
|
352
353
|
personalApiTokens: {
|
|
353
|
-
visibility: '
|
|
354
|
+
visibility: 'hidden',
|
|
354
355
|
},
|
|
355
356
|
apiTokens: {
|
|
356
|
-
visibility: '
|
|
357
|
+
visibility: 'hidden',
|
|
357
358
|
permissions: ['fe.secure.read.tenantApiTokens'],
|
|
358
359
|
},
|
|
359
360
|
profile: {
|
|
@@ -370,7 +371,10 @@ const defaultMetadata = {
|
|
|
370
371
|
permissions: ['fe.secure.read.securityPolicy'],
|
|
371
372
|
},
|
|
372
373
|
sso: {
|
|
373
|
-
visibility: '
|
|
374
|
+
visibility: 'hidden',
|
|
375
|
+
},
|
|
376
|
+
multipleSSO: {
|
|
377
|
+
visibility: 'hidden',
|
|
374
378
|
permissions: ['fe.secure.read.samlConfiguration'],
|
|
375
379
|
},
|
|
376
380
|
audits: {
|
|
@@ -386,6 +390,7 @@ const defaultMetadata = {
|
|
|
386
390
|
class Metadata {
|
|
387
391
|
constructor() {
|
|
388
392
|
this._theme = defaultMetadata.theme;
|
|
393
|
+
this._themeV2 = defaultMetadata.themeV2;
|
|
389
394
|
this._navigation = defaultMetadata.navigation;
|
|
390
395
|
}
|
|
391
396
|
static getInstance(name = 'default') {
|
|
@@ -403,19 +408,25 @@ class Metadata {
|
|
|
403
408
|
var _a;
|
|
404
409
|
return (_a = this._theme) !== null && _a !== void 0 ? _a : {};
|
|
405
410
|
}
|
|
411
|
+
get themeV2() {
|
|
412
|
+
var _a;
|
|
413
|
+
return (_a = this._themeV2) !== null && _a !== void 0 ? _a : {};
|
|
414
|
+
}
|
|
406
415
|
get navigation() {
|
|
407
416
|
var _a;
|
|
408
417
|
return (_a = this._navigation) !== null && _a !== void 0 ? _a : {};
|
|
409
418
|
}
|
|
410
419
|
set(metadata) {
|
|
411
|
-
var _a, _b, _c;
|
|
420
|
+
var _a, _b, _c, _d, _e;
|
|
412
421
|
try {
|
|
413
422
|
this._navigation = deepMerge.all([(_a = defaultMetadata.navigation) !== null && _a !== void 0 ? _a : {}, (_b = metadata === null || metadata === void 0 ? void 0 : metadata.navigation) !== null && _b !== void 0 ? _b : {}]);
|
|
414
423
|
this._theme = deepMerge.all([(_c = defaultMetadata.theme) !== null && _c !== void 0 ? _c : {}, getPalette(metadata === null || metadata === void 0 ? void 0 : metadata.theme, defaultMetadata.theme)]);
|
|
424
|
+
this._themeV2 = deepMerge.all([(_d = defaultMetadata.themeV2) !== null && _d !== void 0 ? _d : {}, (_e = metadata === null || metadata === void 0 ? void 0 : metadata.themeV2) !== null && _e !== void 0 ? _e : {}]);
|
|
415
425
|
}
|
|
416
426
|
catch (e) {
|
|
417
427
|
this._navigation = defaultMetadata.navigation;
|
|
418
428
|
this._theme = defaultMetadata.theme;
|
|
429
|
+
this._themeV2 = defaultMetadata.themeV2;
|
|
419
430
|
}
|
|
420
431
|
}
|
|
421
432
|
}
|