@corbado/shared-ui - npm Package Compare versions

Comparing version 0.1.1-alpha.3 to 0.1.1-alpha.4

dist/flowHandler/constants.d.ts

@@ -6,47 +6,26 @@ export declare enum FlowType {
 export declare enum SignUpFlowNames {
-    PasskeySignupWithEmailOTPFallback = "PasskeySignupWithEmailOTPFallback"
+    PasskeySignupWithFallback = "PasskeySignupWithFallback",
+    SignupWithPasskeyAppend = "SignupWithPasskeyAppend"
 }
 export declare enum LoginFlowNames {
-    PasskeyLoginWithEmailOTPFallback = "PasskeyLoginWithEmailOTPFallback"
+    PasskeyLoginWithFallback = "PasskeyLoginWithFallback"
 }
-export declare const FlowNameByFlowStyle: Record<string, {
-    SignUp: SignUpFlowNames;
-    Login: LoginFlowNames;
-}>;
-export declare enum CommonScreens {
+export declare enum ScreenNames {
     Start = "start",
     End = "end",
-    EnterOtp = "enter-otp",
-    PasskeyError = "passkey-error"
-}
-export declare enum EmailOtpSignupScreens {
-    Start = "start",
-    EnterOtp = "enter-otp",
-    PasskeyOption = "passkey-option",
-    PasskeyBenefits = "passkey-benefits",
-    PasskeyWelcome = "passkey-welcome",
+    EmailOTPVerification = "email-otp-verification",
+    EmailLinkSent = "email-link-sent",
+    EmailLinkVerification = "email-link-verification",
     PasskeyError = "passkey-error",
-    End = "end"
-}
-export declare enum PasskeySignupWithEmailOtpFallbackScreens {
-    Start = "start",
-    CreatePasskey = "create-passkey",
-    EnterOtp = "enter-otp",
-    PasskeyBenefits = "passkey-benefits",
-    PasskeyError = "passkey-error",
-    PasskeyWelcome = "passkey-welcome",
     PasskeyAppend = "passkey-append",
-    End = "end"
-}
-export declare enum PasskeyLoginWithEmailOtpFallbackScreens {
-    Start = "start",
-    EnterOtp = "enter-otp",
-    PasskeyError = "passkey-error",
-    PasskeyAppend = "passkey-append",
     PasskeyBenefits = "passkey-benefits",
-    End = "end"
+    PasskeySuccess = "passkey-success",
+    PasskeyCreate = "passkey-create"
 }
 export declare enum FlowHandlerEvents {
     ShowBenefits = "show-benefits",
-    CancelOtp = "cancel-otp",
+    CancelOTP = "cancel-otp",
+    CancelEmailLink = "cancel-email-link",
+    VerifyLink = "verify-link",
+    CancelPasskey = "cancel-passkey",
     ChangeFlow = "change-flow",
@@ -53,0 +32,0 @@ PrimaryButton = "primary-button",

dist/flowHandler/flowHandler.d.ts

@@ -5,3 +5,4 @@ import type { ProjectConfig, SessionUser } from '@corbado/types';
 import type { FlowHandlerEvents } from './constants';
-import type { FlowHandlerEventOptions, FlowNames, ScreenNames, UserState } from './types';
+import { FlowType, ScreenNames } from './constants';
+import type { FlowHandlerEventOptions, FlowHandlerUpdates, FlowTypeText, UserState } from './types';
 /**
@@ -18,3 +19,3 @@ * FlowHandler is a class that manages the navigation flow of the application.
      */
-    constructor(projectConfig: ProjectConfig, onLoggedIn: () => void);
+    constructor(projectConfig: ProjectConfig, onLoggedIn: () => void, initialFlowType?: FlowType);
     /**
@@ -26,21 +27,6 @@ * Initializes the FlowHandler.
     get currentScreenName(): ScreenNames;
-    get currentFlowName(): FlowNames;
+    get currentFlowName(): import("./constants").SignUpFlowNames | import("./constants").LoginFlowNames;
+    get currentFlowTypeText(): FlowTypeText;
+    get currentVerificationMethod(): import("./types").VerificationMethods;
     /**
-     * Method to add a callback function to be called when the current screen changes.
-     * @param cb The callback function to be called when the current screen changes.
-     * @returns The callback id.
-     */
-    onScreenChange(cb: (screen: ScreenNames) => void): number;
-    /**
-     * Method to remove a callback function that was registered with onScreenChange.
-     * @param cbId The callback id returned by onScreenChange.
-     */
-    removeOnScreenChangeCallback(cbId: number): void;
-    /**
-     * Method to replace a callback function that was registered with onScreenChange.
-     * @param cbId The callback id returned by onScreenChange.
-     * @param cb The new callback function.
-     */
-    replaceOnScreenChangeCallback(cbId: number, cb: (screen: ScreenNames) => void): void;
-    /**
      * Method to add a callback function to be called when the current flow changes.
@@ -50,3 +36,3 @@ * @param cb The callback function to be called when the current flow changes.
      */
-    onFlowChange(cb: (flow: FlowNames) => void): number;
+    onFlowChange(cb: (updates: FlowHandlerUpdates) => void): number;
     /**
@@ -58,8 +44,2 @@ * Method to remove a callback function that was registered with onFlowChange.
     /**
-     * Method to replace a callback function that was registered with onFlowChange.
-     * @param cbId The callback id returned by onFlowChange.
-     * @param cb The new callback function.
-     */
-    replaceOnFlowChangeCallback(cbId: number, cb: (flow: FlowNames) => void): void;
-    /**
      * Method to add a callback function to be called when the user state changes.
@@ -66,0 +46,0 @@ * @param cb The callback function to be called when the user state changes.

dist/flowHandler/flowHandlerConfig.d.ts

 import type { ProjectConfig } from '@corbado/types';
-import { FlowType } from './constants';
-import type { FlowNames, FlowOptions } from './types';
+import { FlowType, LoginFlowNames, ScreenNames, SignUpFlowNames } from './constants';
+import type { LoginOptions, SignupOptions, VerificationMethods } from './types';
 export declare class FlowHandlerConfig {
@@ -9,5 +9,7 @@ #private;
     get flowType(): FlowType;
-    get flowName(): FlowNames;
-    get flowOptions(): Partial<FlowOptions>;
+    get flowName(): SignUpFlowNames | LoginFlowNames;
+    get flowOptions(): SignupOptions | LoginOptions;
+    get initialScreenName(): ScreenNames;
+    get verificationMethod(): VerificationMethods;
     update(flowType: FlowType): void;
 }

dist/flowHandler/flowHandlerState.d.ts

@@ -7,2 +7,3 @@ import type { SessionUser } from '@corbado/types';
  * Internal state of the FlowHandler.
+ * This class is responsible for managing the state which is sent to all the flow steps.
  */
@@ -9,0 +10,0 @@ export declare class FlowHandlerState {

dist/flowHandler/flows/index.d.ts

 import type { Flows } from '../types';
 export declare const flows: Flows;
-export * from './signup/passkeySignupWithOtpFlow';
-export * from './login/passkeyLoginWithOtpFlow';
+export * from './signup/passkeySignupWithFallbackFlow';
+export * from './login/passkeyLoginWithFallbackFlow';

dist/flowHandler/flows/login/utils.d.ts

@@ -5,10 +5,13 @@ import type { AuthService } from '@corbado/web-core';
 import { FlowUpdate } from '../../flowUpdate';
-import type { UserState } from '../../types';
+import type { FlowOptions, UserState } from '../../types';
+/********** Validation Utils *********/
 export declare const validateEmail: (userStateIn?: UserState, onStartScreen?: boolean) => Result<string, FlowUpdate>;
 export declare const validateUserAuthState: (state: FlowHandlerState) => Result<undefined, FlowUpdate>;
-export declare const sendEmailOTP: (authService: AuthService, email: string) => Promise<FlowUpdate>;
+export declare const initLoginWithVerificationMethod: (authService: AuthService, flowOptions: FlowOptions, email: string) => Promise<FlowUpdate>;
+export declare const loginWithEmailOTP: (authService: AuthService, userState: UserState, otp?: string) => Promise<Result<undefined, FlowUpdate>>;
+export declare const loginWithEmailLink: (authService: AuthService, userState: UserState) => Promise<Result<undefined, FlowUpdate>>;
+/********** Passkey Utils *********/
 export declare const initPasskeyAppend: (state: FlowHandlerState, email: string) => Promise<FlowUpdate | undefined>;
-export declare const loginWithPasskey: (authService: AuthService, email: string) => Promise<FlowUpdate | undefined>;
-export declare const loginWithEmailOTP: (authService: AuthService, userState: UserState, otp?: string) => Promise<Result<undefined, FlowUpdate>>;
+export declare const loginWithPasskey: (authService: AuthService, flowOptions: FlowOptions, email: string) => Promise<FlowUpdate | undefined>;
 export declare const initConditionalUI: (state: FlowHandlerState) => Promise<FlowUpdate | undefined>;
 export declare const appendPasskey: (authService: AuthService) => Promise<FlowUpdate>;

dist/flowHandler/flows/signup/utils.d.ts

@@ -5,3 +5,4 @@ import type { AppendPasskeyError, CorbadoApp, SignUpWithPasskeyError } from '@corbado/web-core';
 import { FlowUpdate } from '../../flowUpdate';
-import type { UserState } from '../../types';
+import type { FlowOptions, UserState } from '../../types';
+/********** Validation Utils *********/
 export declare const validateEmailAndFullName: (userStateIn?: UserState, onStartScreen?: boolean) => Result<{
@@ -13,5 +14,6 @@ email: string;
 export declare const checkUserExists: (corbadoApp: CorbadoApp, email: string, fullName: string) => Promise<Result<undefined, FlowUpdate>>;
-export declare const sendEmailOTP: (corbadoApp: CorbadoApp, email: string, fullName: string, onStartScreen?: boolean) => Promise<FlowUpdate>;
+export declare const initSignupWithVerificationMethod: (corbadoApp: CorbadoApp, flowOption: FlowOptions, email: string, fullName: string, onStartScreen?: boolean) => Promise<FlowUpdate>;
+export declare const signupWithEmailOTP: (corbadoApp: CorbadoApp, userState: UserState, otp?: string) => Promise<Result<undefined, FlowUpdate>>;
+/********** Passkey Utils *********/
 export declare const createPasskey: (corbadoApp: CorbadoApp, email: string, fullName: string) => Promise<Result<FlowUpdate, SignUpWithPasskeyError | undefined>>;
 export declare const appendPasskey: (corbadoApp: CorbadoApp) => Promise<Result<FlowUpdate, AppendPasskeyError | undefined>>;
-export declare const signupWithEmailOTP: (corbadoApp: CorbadoApp, userState: UserState, otp?: string) => Promise<Result<undefined, FlowUpdate>>;

dist/flowHandler/flowUpdate.d.ts

 import type { FlowType } from './constants';
-import type { ScreenNames, UserState } from './types';
+import type { ScreenNames } from './constants';
+import type { UserState } from './types';
 export declare class FlowUpdate {
@@ -4,0 +5,0 @@ nextFlow: FlowType | null;

dist/flowHandler/types.d.ts

 import type { SessionUser } from '@corbado/types';
 import type { RecoverableError } from '@corbado/web-core';
-import type { CommonScreens, EmailOtpSignupScreens, FlowHandlerEvents, LoginFlowNames, PasskeyLoginWithEmailOtpFallbackScreens, PasskeySignupWithEmailOtpFallbackScreens, SignUpFlowNames } from './constants';
+import type { FlowHandlerEvents, LoginFlowNames, SignUpFlowNames } from './constants';
+import type { ScreenNames } from './constants';
 import type { FlowHandlerState } from './flowHandlerState';
 import type { FlowUpdate } from './flowUpdate';
+export type FlowTypeText = 'signup' | 'login';
+export type VerificationMethods = 'emailLink' | 'emailOtp' | 'smsOtp';
 /**
@@ -12,2 +15,3 @@ * Configuration options for the passkey sign-up with email OTP fallback flow.
     retryPasskeyOnError: boolean;
+    verificationMethod: VerificationMethods;
 }
@@ -20,2 +24,3 @@ /**
     retryPasskeyOnError: boolean;
+    verificationMethod: VerificationMethods;
 }
@@ -31,9 +36,8 @@ /**
 /**
- * Union type of all possible screen names within the authentication flows.
+ * Type definition for a function that represents a step in an authentication flow.
  */
-export type ScreenNames = CommonScreens | EmailOtpSignupScreens | PasskeySignupWithEmailOtpFallbackScreens | PasskeyLoginWithEmailOtpFallbackScreens;
 export interface FlowHandlerEventOptions {
     userHasPasskey?: boolean;
     userStateUpdate?: UserState;
-    emailOTPCode?: string;
+    verificationCode?: string;
 }
@@ -43,3 +47,3 @@ /**
  */
-export type StepFunction = (state: FlowHandlerState, event?: FlowHandlerEvents, eventOptions?: FlowHandlerEventOptions) => Promise<FlowUpdate | undefined>;
+export type StepFunction = (state: FlowHandlerState, event?: FlowHandlerEvents, eventOptions?: FlowHandlerEventOptions) => Promise<FlowUpdate | undefined> | FlowUpdate | undefined;
 /**
@@ -62,3 +66,2 @@ * Type representing a dictionary of step functions for each screen in a flow.
     email?: string;
-    emailOTPState?: EmailOTPState;
     fullName?: string;
@@ -77,4 +80,7 @@ emailError?: RecoverableError;
 };
-export type EmailOTPState = {
-    lastMailSent: Date;
-};
+export interface FlowHandlerUpdates {
+    flowType?: FlowTypeText;
+    flowName?: FlowNames;
+    screenName?: ScreenNames;
+    verificationMethod?: VerificationMethods;
+}

dist/index.d.ts

@@ -7,3 +7,3 @@ import './styles/index.css';
     en: {
-        authenticationFlows: {
+        authentication: {
             signup: {
@@ -18,16 +18,48 @@ start: {
                 };
-                passkey: {
+                emailOtp: {
                     header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_verify: string;
+                    button_sendOtpAgain: string;
+                    button_back: string;
+                };
+                emailLinkSent: {
+                    header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                emailLinkVerification: {
+                    header: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                passkeyCreate: {
+                    header: string;
+                    headerButton_showPasskeyBenefits: string;
                     body: string;
-                    button_showPasskeyBenefits: string;
                     button_start: string;
-                    button_emailOtp: string;
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
                     button_back: string;
                 };
-                passkeyBenefits: {
+                passkeyError: {
                     header: string;
-                    body_introduction: string;
-                    body_loginMethods: string;
-                    button_start: string;
-                    button_skip: string;
+                    body_errorMessage: string;
+                    button_showPasskeyBenefits: string;
+                    body_tryAgainMessage: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_retry: string;
+                    button_back: string;
+                    button_cancel: string;
                 };
@@ -38,17 +70,17 @@ passkeySuccess: {
                     body_text1: string;
-                    body_text2: string;
+                    body_text2: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
                     body_text3: string;
                     button: string;
                 };
-                passkeyError: {
+                passkeyBenefits: {
                     header: string;
-                    body_errorMessage1: string;
-                    body_errorMessage2: string;
-                    button_showPasskeyBenefits: string;
-                    button_retry: string;
-                    button_emailOtp: string;
-                    button_back: string;
-                    button_cancel: string;
+                    body_introduction: string;
+                    body_loginMethods: string;
+                    button_start: string;
+                    button_skip: string;
                 };
-                passkeyPrompt: {
+                passkeyAppend: {
                     header: string;
@@ -59,10 +91,2 @@ button_showPasskeyBenefits: string;
                 };
-                emailOtp: {
-                    header: string;
-                    body_text1: string;
-                    body_text2: string;
-                    button_verify: string;
-                    button_sendOtpAgain: string;
-                    button_back: string;
-                };
             };
@@ -77,10 +101,2 @@ login: {
                 };
-                passkeyError: {
-                    header: string;
-                    body: string;
-                    button_retry: string;
-                    button_emailOtp: string;
-                    button_back: string;
-                    button_cancel: string;
-                };
                 emailOtp: {
@@ -94,4 +110,30 @@ header: string;
                 };
-                passkeyPrompt: {
+                emailLinkSent: {
                     header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                emailLinkVerification: {
+                    header: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                passkeyError: {
+                    header: string;
+                    body: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_retry: string;
+                    button_back: string;
+                    button_cancel: string;
+                };
+                passkeyAppend: {
+                    header: string;
                     button_showPasskeyBenefits: string;
@@ -127,2 +169,4 @@ button_start: string;
             invalidOtp: string;
+            invalidToken: string;
+            noConditionalUiSupport: string;
             unknownError: string;
@@ -153,3 +197,3 @@ };
     de: {
-        authenticationFlows: {
+        authentication: {
             signup: {
@@ -163,20 +207,49 @@ start: {
                     textField_email: string;
-                    validationError_name: string;
-                    validationError_email: string;
-                    validationError_emailExists: string;
                 };
-                passkey: {
+                emailOtp: {
                     header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_verify: string;
+                    button_sendOtpAgain: string;
+                    button_back: string;
+                };
+                emailLinkSent: {
+                    header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                emailLinkVerification: {
+                    header: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                passkeyCreate: {
+                    header: string;
+                    headerButton_showPasskeyBenefits: string;
                     body: string;
-                    button_showPasskeyBenefits: string;
                     button_start: string;
-                    button_emailOtp: string;
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
                     button_back: string;
                 };
-                passkeyBenefits: {
+                passkeyError: {
                     header: string;
-                    body_introduction: string;
-                    body_loginMethods: string;
-                    button_start: string;
-                    button_skip: string;
+                    body_errorMessage: string;
+                    button_showPasskeyBenefits: string;
+                    body_tryAgainMessage: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_retry: string;
+                    button_back: string;
+                    button_cancel: string;
                 };
@@ -187,15 +260,15 @@ passkeySuccess: {
                     body_text1: string;
-                    body_text2: string;
+                    body_text2: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
                     body_text3: string;
                     button: string;
                 };
-                passkeyError: {
+                passkeyBenefits: {
                     header: string;
-                    body_errorMessage1: string;
-                    body_errorMessage2: string;
-                    button_showPasskeyBenefits: string;
-                    button_retry: string;
-                    button_emailOtp: string;
-                    button_back: string;
-                    button_cancel: string;
+                    body_introduction: string;
+                    body_loginMethods: string;
+                    button_start: string;
+                    button_skip: string;
                 };
@@ -208,11 +281,2 @@ passkeyPrompt: {
                 };
-                emailOtp: {
-                    header: string;
-                    body_text1: string;
-                    body_text2: string;
-                    validationError_otp: string;
-                    button_verify: string;
-                    button_sendOtpAgain: string;
-                    button_back: string;
-                };
             };
@@ -226,12 +290,3 @@ login: {
                     textField_email: string;
-                    validationError_email: string;
                 };
-                passkeyError: {
-                    header: string;
-                    body: string;
-                    button_retry: string;
-                    button_emailOtp: string;
-                    button_back: string;
-                    button_cancel: string;
-                };
                 emailOtp: {
@@ -241,3 +296,2 @@ header: string;
                     body_text2: string;
-                    validationError_otp: string;
                     button_verify: string;
@@ -247,4 +301,30 @@ button_sendOtpAgain: string;
                 };
-                passkeyPrompt: {
+                emailLinkSent: {
                     header: string;
+                    body_text1: string;
+                    body_text2: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                emailLinkVerification: {
+                    header: string;
+                    button_sendLinkAgain: string;
+                    button_back: string;
+                };
+                passkeyError: {
+                    header: string;
+                    body: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_switchToAlternate: {
+                        emailOtp: string;
+                        emailLink: string;
+                    };
+                    button_retry: string;
+                    button_back: string;
+                    button_cancel: string;
+                };
+                passkeyAppend: {
+                    header: string;
                     button_showPasskeyBenefits: string;
@@ -275,2 +355,3 @@ button_start: string;
             userAlreadyExists: string;
+            passkeyAlreadyExists: string;
             unknownUser: string;
@@ -280,2 +361,4 @@ noPasskeyAvailable: string;
             invalidOtp: string;
+            invalidToken: string;
+            noConditionalUiSupport: string;
             unknownError: string;
@@ -292,6 +375,13 @@ };
             field_status: string;
-            deleteDialog_header: string;
-            deleteDialog_body: string;
-            deleteDialog_cancelButton: string;
-            deleteDialog_deleteButton: string;
+            dialog_delete: {
+                header: string;
+                body: string;
+                button_cancel: string;
+                button_delete: string;
+            };
+            dialog_passkeyAlreadyExists: {
+                header: string;
+                body: string;
+                button_confirm: string;
+            };
         };
@@ -302,1 +392,10 @@ };
 export * from './flowHandler';
+export declare const assets: {
+    deleteIcon: any;
+    passkeyDefaultIcon: any;
+    yahooIcon: any;
+    gmailIcon: any;
+    outlookIcon: any;
+    fingerprintIcon: any;
+    cancelIcon: any;
+};

dist/utils/index.d.ts

@@ -6,2 +6,1 @@ export * from './themes';
 export * from './helpers';
-export * from './assetsList';

package.json

 {
   "name": "@corbado/shared-ui",
-  "version": "0.1.1-alpha.3",
+  "version": "0.1.1-alpha.4",
   "description": "This package contains shared files for all the complete packages of Corbado for VanillaJS, React, Angular, Vue, etc.",
@@ -35,3 +35,3 @@ "author": "Abdullah Shahbaz <[e-mail]>",
   "devDependencies": {
-    "@corbado/types": "^0.1.1-alpha.3",
+    "@corbado/types": "^0.1.1-alpha.4",
     "@svgr/webpack": "^8.1.0",
@@ -54,6 +54,6 @@ "@types/ua-parser-js": "^0.7.39",
   "dependencies": {
-    "@corbado/web-core": "^0.1.7-alpha.3",
+    "@corbado/web-core": "^0.1.7-alpha.4",
     "ua-parser-js": "^1.0.37"
   },
-  "gitHead": "746086968c769513b83f2c62d3ba4a6488425c92"
+  "gitHead": "3bd63094494204828688170d7461932d5786de53"
 }

README.md

@@ -1,11 +0,28 @@
-# `@corbado/shared-ui`
+<img width="1070" alt="GitHub Repo Cover" src="https://github.com/corbado/corbado-php/assets/18458907/aa4f9df6-980b-4b24-bb2f-d71c0f480971">
 
-> TODO: description
+# @corbado/shared
 
-## Usage
+[![License](https://img.shields.io/badge/license-MIT-green)](https://github.com/corbado/javascript/blob/readme_documentation/LICENSE)
+[![Documentation](https://img.shields.io/badge/documentation-available-brightgreen)](https://docs.corbado.com/overview/welcome)
+[![Slack](https://img.shields.io/badge/slack-community-blueviolet)](https://join.slack.com/t/corbado/shared_invite/zt-1b7867yz8-V~Xr~ngmSGbt7IA~g16ZsQ)
+[![npm version](https://img.shields.io/npm/v/@corbado/shared-ui)](https://www.npmjs.com/package/@corbado/shared-ui)
 
-```
-const sharedUi = require('@corbado/shared-ui');
+---
 
-// TODO: DEMONSTRATE API
-```
+## Overview
+
+This package contains shared files for all the UI component packages of Corbado for VanillaJS, React, Angular, Vue, etc.
+Since, this is an internal package, you don't have to install it separately.
+
+---
+
+## 📄 Documentation & Support
+
+For support and questions please visit our [Slack channel](https://join.slack.com/t/corbado/shared_invite/zt-1b7867yz8-V~Xr~ngmSGbt7IA~g16ZsQ).
+For more detailed information and advanced configuration options, please visit our [Documentation Page](https://docs.corbado.com/overview/welcome).
+
+---
+
+## 🔒 License
+
+This project is licensed under the MIT License - see the [LICENSE](https://github.com/corbado/javascript/blob/readme_documentation/LICENSE) file for details.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

500118

increased by7.08%

Number of package files

32

increased by33.33%

Lines of code

1247

increased by6.13%

Number of lines in readme file

29

increased by141.67%

Worsened metrics

Number of low license alerts

1

increased byInfinity%

Dependency changes

• Updated@corbado/web-core@^0.1.7-alpha.4