@frontegg/types 5.61.0 → 6.0.1-alpha.2

package/ThemeOptions/LoginBoxTheme/LoginBoxCommon.d.ts

@@ -1,226 +1,226 @@
-import { ExtendedCSSProperties } from '../../Common';
-import { BaseTheme, BaseThemeOptions, SocialLoginsThemeOptions } from '../index';
-import { SideElement, ButtonThemeOptions, CustomComponent, InputThemeOptions, ILogosComponent, ITestimonialComponent } from '../ComponentsOptions';
-/**
- *   @RootElement
- *   - @WrapperElement
- *   | - Header
- *   | - Box
- *   |  | - Header
- *   |  | - Content
- *   |  | - SocialLogin
- *   |  |  | - Divider
- *   |  |  | - Google
- *   |  |  | - Microsoft
- *   |  |  | - Footer
- *   |  | - Footer
- *   | - Footer
- */
-interface LogoComponent {
-    /**
-     * Company logo Url or native html element as string
-     */
-    image?: string | any | CustomComponent;
-    /**
-     * Company logo placement in Login Pages
-     * box = inside the login box element
-     * page = displayed at the top of the page
-     */
-    placement?: 'box' | 'page';
-    alignment?: 'left' | 'right' | 'center';
-    /**
-     *  Direct css styling for Company Logo container component
-     */
-    style?: ExtendedCSSProperties;
-}
-export interface LayoutOptions {
-    /**
-     * Layout type for login box page, Default is Center login box elements
-     * By choosing Side type you can provide HTML element for the other
-     * side, floating right will display login box at the right element
-     * with default width equal to 50% of the window width
-     */
-    type: 'float-right' | 'center' | 'float-left';
-    /**
-     * splitSize is for the side element to setup how much % of the window side elements wi'll take
-     * default is 50 = 50%;
-     */
-    splitSize: number;
-    /**
-     * Will be displayed if type is 'float-right' or 'float-left',
-     * Accepts:
-     *  - html element as string
-     *  - function that return html element as string
-     *  - ReactElement will be rendered inside LoginBox VirtualTree
-     */
-    sideElement?: CustomComponent;
-    sideElementStyle?: ExtendedCSSProperties;
-    /**
-     * Will be displayed if type is 'float-right' or 'float-left',
-     * Accepts:
-     *  - values, testimonials, titleDescription, logos
-     * only two elements can be active together
-     */
-    splitModeElements?: {
-        logos?: ILogosComponent;
-        testimonials?: ITestimonialComponent;
-        showDivider?: boolean;
-        showTitleDivider?: boolean;
-        activeElements?: {
-            titleDescription?: boolean;
-            element1: SideElement;
-            element2?: SideElement;
-        };
-    };
-    splitModeStyles?: {
-        dividerStyle?: ExtendedCSSProperties;
-        splitContainerStyle?: ExtendedCSSProperties;
-        logos?: {
-            logoStyle?: ExtendedCSSProperties;
-            logosContainerStyle?: ExtendedCSSProperties;
-        };
-        values?: {
-            valuesIconStyle?: ExtendedCSSProperties;
-            valuesContainerStyle?: ExtendedCSSProperties;
-            valuesTextStyle?: ExtendedCSSProperties;
-        };
-        testimonials?: {
-            testimonialsContainerStyle?: ExtendedCSSProperties;
-            testimonialsTitleStyle?: ExtendedCSSProperties;
-            testtomonialsSubtitleStyle?: ExtendedCSSProperties;
-            testimonialsTextStyle?: ExtendedCSSProperties;
-            testimonialsIndicatorStyle?: ExtendedCSSProperties;
-            testimonialsActiveIndicatorStyle?: ExtendedCSSProperties;
-            testimonialsIndicatorContainerStyle?: ExtendedCSSProperties;
-        };
-        titleDescription?: {
-            titleDescriptionContainerStyle?: ExtendedCSSProperties;
-            titleDescriptionTitleStyle?: ExtendedCSSProperties;
-            titleDescriptionCompanyNameStyle?: ExtendedCSSProperties;
-            titleDescriptionDescriptionStyle?: ExtendedCSSProperties;
-        };
-    };
-}
-interface LoginBoxOptionalCommon {
-    /**
-     * Options to specify the login box page structure
-     * Ex. split screen and display login in the left/right side
-     */
-    layout?: LayoutOptions;
-    /**
-     * Header component placed in before section content.
-     * Mostly used for Company Logo or Page title
-     * Accepts:
-     *  - string as url for rendering image element with src='url'
-     *  - string as base64 for rendering image as base64 content
-     *  - ReactElement will be rendered inside LoginBox VirtualTree
-     */
-    pageHeader?: CustomComponent;
-    /**
-     * Footer component placed in before section content
-     * Mostly used for Disclaimers or Back buttons
-     * Accepts:
-     *  - string as url for rendering image element with src='url'
-     *  - string as base64 for rendering image as base64 content
-     *  - ReactElement will be rendered inside LoginBox VirtualTree
-     */
-    pageFooter?: CustomComponent;
-    /**
-     * Company logo Url or native html element as string
-     */
-    logo?: LogoComponent;
-    /**
-     * Powered by frontegg placement
-     * box = inside the login box element
-     * page = displayed at the bottom of the page
-     */
-    poweredByPlacement?: 'box' | 'page' | 'leftBottomCorner';
-    /**
-     * BoxElement
-     * It is a Card component placed inside the [WrapperElement]{@link pageStyle}
-     * The purpose of this element is to contain page field
-     * By default it's have flex display and justify content center
-     */
-    boxStyle?: ExtendedCSSProperties;
-    /**
-     * Header component placed in inside the login box and before login inputs.
-     * Accepts:
-     *  - string as url for rendering image element with src='url'
-     *  - string as base64 for rendering image as base64 content
-     *  - ReactElement will be rendered inside LoginBox VirtualTree  (should be pure component without hooks and HOC)
-     */
-    boxHeader?: CustomComponent;
-    /**
-     * Direct css styling for applying css for all (Box title) in LoginBox pages
-     */
-    boxTitleStyle?: ExtendedCSSProperties;
-    /**
-     * Direct css styling for applying css for all (Box message or Box subtitle) in LoginBox pages
-     */
-    boxMessageStyle?: ExtendedCSSProperties;
-    /**
-     * Footer component placed in inside the login box and after login inputs.
-     * Mostly used for Disclaimers or Back buttons
-     * Accepts:
-     *  - string as url for rendering image element with src='url'
-     *  - string as base64 for rendering image as base64 content
-     *  - ReactElement will be rendered inside LoginBox VirtualTree
-     */
-    boxFooter?: CustomComponent;
-    /**
-     * Option to customize login box inputs by providing
-     * css style for every state (base, hover, focus, disabled, etc...)
-     */
-    inputTheme?: InputThemeOptions;
-    /**
-     * Option to customize login box standard buttons by providing
-     * css style for every state (base, hover, focus, disabled, etc...)
-     */
-    buttonTheme?: ButtonThemeOptions;
-    /**
-     * Option to customize login box link buttons by providing
-     * css style for every state (base, hover, focus, disabled, etc...)
-     */
-    linkButtonTheme?: ButtonThemeOptions;
-    /**
-     * Option to customize login box submit buttons by providing
-     * css style for every state (base, hover, focus, disabled, etc...)
-     */
-    submitButtonTheme?: ButtonThemeOptions;
-    /**
-     * Option to customize login box social logins buttons by providing
-     * layous options for every button and element
-     */
-    socialLogins?: SocialLoginsThemeOptions;
-}
-export interface LoginBoxCommonTheme extends BaseTheme, LoginBoxOptionalCommon {
-    /**
-     * RootElement
-     * The root DIV element of specific login box page
-     * By default it's have fixed and full width/height size
-     */
-    rootStyle: ExtendedCSSProperties;
-    /**
-     * PageElement
-     * It is DIV element placed inside the [RootElement]{@link rootStyle}
-     * The purpose of this element is to wrapper the Box Component and other custom components
-     * By default it's have flex display and justify content center
-     */
-    pageStyle: ExtendedCSSProperties;
-}
-export interface LoginBoxCommonThemeOptions extends BaseThemeOptions, LoginBoxOptionalCommon {
-    /**
-     * RootElement
-     * The root DIV element of specific login box page
-     * By default it's have fixed and full width/height size
-     */
-    rootStyle?: ExtendedCSSProperties;
-    /**
-     * PageElement
-     * It is DIV element placed inside the [RootElement]{@link rootStyle}
-     * The purpose of this element is to wrapper the Box Component and other custom components
-     * By default it's have flex display and justify content center
-     */
-    pageStyle?: ExtendedCSSProperties;
-}
-export {};
+import { ExtendedCSSProperties } from '../../Common';
+import { BaseTheme, BaseThemeOptions, SocialLoginsThemeOptions } from '../index';
+import { SideElement, ButtonThemeOptions, CustomComponent, InputThemeOptions, ILogosComponent, ITestimonialComponent } from '../ComponentsOptions';
+/**
+ *   @RootElement
+ *   - @WrapperElement
+ *   | - Header
+ *   | - Box
+ *   |  | - Header
+ *   |  | - Content
+ *   |  | - SocialLogin
+ *   |  |  | - Divider
+ *   |  |  | - Google
+ *   |  |  | - Microsoft
+ *   |  |  | - Footer
+ *   |  | - Footer
+ *   | - Footer
+ */
+interface LogoComponent {
+    /**
+     * Company logo Url or native html element as string
+     */
+    image?: string | any | CustomComponent;
+    /**
+     * Company logo placement in Login Pages
+     * box = inside the login box element
+     * page = displayed at the top of the page
+     */
+    placement?: 'box' | 'page';
+    alignment?: 'left' | 'right' | 'center';
+    /**
+     *  Direct css styling for Company Logo container component
+     */
+    style?: ExtendedCSSProperties;
+}
+export interface LayoutOptions {
+    /**
+     * Layout type for login box page, Default is Center login box elements
+     * By choosing Side type you can provide HTML element for the other
+     * side, floating right will display login box at the right element
+     * with default width equal to 50% of the window width
+     */
+    type: 'float-right' | 'center' | 'float-left';
+    /**
+     * splitSize is for the side element to setup how much % of the window side elements wi'll take
+     * default is 50 = 50%;
+     */
+    splitSize: number;
+    /**
+     * Will be displayed if type is 'float-right' or 'float-left',
+     * Accepts:
+     *  - html element as string
+     *  - function that return html element as string
+     *  - ReactElement will be rendered inside LoginBox VirtualTree
+     */
+    sideElement?: CustomComponent;
+    sideElementStyle?: ExtendedCSSProperties;
+    /**
+     * Will be displayed if type is 'float-right' or 'float-left',
+     * Accepts:
+     *  - values, testimonials, titleDescription, logos
+     * only two elements can be active together
+     */
+    splitModeElements?: {
+        logos?: ILogosComponent;
+        testimonials?: ITestimonialComponent;
+        showDivider?: boolean;
+        showTitleDivider?: boolean;
+        activeElements?: {
+            titleDescription?: boolean;
+            element1: SideElement;
+            element2?: SideElement;
+        };
+    };
+    splitModeStyles?: {
+        dividerStyle?: ExtendedCSSProperties;
+        splitContainerStyle?: ExtendedCSSProperties;
+        logos?: {
+            logoStyle?: ExtendedCSSProperties;
+            logosContainerStyle?: ExtendedCSSProperties;
+        };
+        values?: {
+            valuesIconStyle?: ExtendedCSSProperties;
+            valuesContainerStyle?: ExtendedCSSProperties;
+            valuesTextStyle?: ExtendedCSSProperties;
+        };
+        testimonials?: {
+            testimonialsContainerStyle?: ExtendedCSSProperties;
+            testimonialsTitleStyle?: ExtendedCSSProperties;
+            testtomonialsSubtitleStyle?: ExtendedCSSProperties;
+            testimonialsTextStyle?: ExtendedCSSProperties;
+            testimonialsIndicatorStyle?: ExtendedCSSProperties;
+            testimonialsActiveIndicatorStyle?: ExtendedCSSProperties;
+            testimonialsIndicatorContainerStyle?: ExtendedCSSProperties;
+        };
+        titleDescription?: {
+            titleDescriptionContainerStyle?: ExtendedCSSProperties;
+            titleDescriptionTitleStyle?: ExtendedCSSProperties;
+            titleDescriptionCompanyNameStyle?: ExtendedCSSProperties;
+            titleDescriptionDescriptionStyle?: ExtendedCSSProperties;
+        };
+    };
+}
+interface LoginBoxOptionalCommon {
+    /**
+     * Options to specify the login box page structure
+     * Ex. split screen and display login in the left/right side
+     */
+    layout?: LayoutOptions;
+    /**
+     * Header component placed in before section content.
+     * Mostly used for Company Logo or Page title
+     * Accepts:
+     *  - string as url for rendering image element with src='url'
+     *  - string as base64 for rendering image as base64 content
+     *  - ReactElement will be rendered inside LoginBox VirtualTree
+     */
+    pageHeader?: CustomComponent;
+    /**
+     * Footer component placed in before section content
+     * Mostly used for Disclaimers or Back buttons
+     * Accepts:
+     *  - string as url for rendering image element with src='url'
+     *  - string as base64 for rendering image as base64 content
+     *  - ReactElement will be rendered inside LoginBox VirtualTree
+     */
+    pageFooter?: CustomComponent;
+    /**
+     * Company logo Url or native html element as string
+     */
+    logo?: LogoComponent;
+    /**
+     * Powered by frontegg placement
+     * box = inside the login box element
+     * page = displayed at the bottom of the page
+     */
+    poweredByPlacement?: 'box' | 'page' | 'leftBottomCorner';
+    /**
+     * BoxElement
+     * It is a Card component placed inside the [WrapperElement]{@link pageStyle}
+     * The purpose of this element is to contain page field
+     * By default it's have flex display and justify content center
+     */
+    boxStyle?: ExtendedCSSProperties;
+    /**
+     * Header component placed in inside the login box and before login inputs.
+     * Accepts:
+     *  - string as url for rendering image element with src='url'
+     *  - string as base64 for rendering image as base64 content
+     *  - ReactElement will be rendered inside LoginBox VirtualTree  (should be pure component without hooks and HOC)
+     */
+    boxHeader?: CustomComponent;
+    /**
+     * Direct css styling for applying css for all (Box title) in LoginBox pages
+     */
+    boxTitleStyle?: ExtendedCSSProperties;
+    /**
+     * Direct css styling for applying css for all (Box message or Box subtitle) in LoginBox pages
+     */
+    boxMessageStyle?: ExtendedCSSProperties;
+    /**
+     * Footer component placed in inside the login box and after login inputs.
+     * Mostly used for Disclaimers or Back buttons
+     * Accepts:
+     *  - string as url for rendering image element with src='url'
+     *  - string as base64 for rendering image as base64 content
+     *  - ReactElement will be rendered inside LoginBox VirtualTree
+     */
+    boxFooter?: CustomComponent;
+    /**
+     * Option to customize login box inputs by providing
+     * css style for every state (base, hover, focus, disabled, etc...)
+     */
+    inputTheme?: InputThemeOptions;
+    /**
+     * Option to customize login box standard buttons by providing
+     * css style for every state (base, hover, focus, disabled, etc...)
+     */
+    buttonTheme?: ButtonThemeOptions;
+    /**
+     * Option to customize login box link buttons by providing
+     * css style for every state (base, hover, focus, disabled, etc...)
+     */
+    linkButtonTheme?: ButtonThemeOptions;
+    /**
+     * Option to customize login box submit buttons by providing
+     * css style for every state (base, hover, focus, disabled, etc...)
+     */
+    submitButtonTheme?: ButtonThemeOptions;
+    /**
+     * Option to customize login box social logins buttons by providing
+     * layous options for every button and element
+     */
+    socialLogins?: SocialLoginsThemeOptions;
+}
+export interface LoginBoxCommonTheme extends BaseTheme, LoginBoxOptionalCommon {
+    /**
+     * RootElement
+     * The root DIV element of specific login box page
+     * By default it's have fixed and full width/height size
+     */
+    rootStyle: ExtendedCSSProperties;
+    /**
+     * PageElement
+     * It is DIV element placed inside the [RootElement]{@link rootStyle}
+     * The purpose of this element is to wrapper the Box Component and other custom components
+     * By default it's have flex display and justify content center
+     */
+    pageStyle: ExtendedCSSProperties;
+}
+export interface LoginBoxCommonThemeOptions extends BaseThemeOptions, LoginBoxOptionalCommon {
+    /**
+     * RootElement
+     * The root DIV element of specific login box page
+     * By default it's have fixed and full width/height size
+     */
+    rootStyle?: ExtendedCSSProperties;
+    /**
+     * PageElement
+     * It is DIV element placed inside the [RootElement]{@link rootStyle}
+     * The purpose of this element is to wrapper the Box Component and other custom components
+     * By default it's have flex display and justify content center
+     */
+    pageStyle?: ExtendedCSSProperties;
+}
+export {};

package/ThemeOptions/LoginBoxTheme/LoginBoxCommon.js

@@ -0,0 +1 @@
+export {};