@genesislcap/foundation-login 10.3.1 → 11.3.1

package/dist/esm/routes/config.js

@@ -1,16 +1,16 @@
 import { __awaiter, __decorate, __param } from "tslib";
+import { Auth, Session, FoundationAnalytics, FoundationAnalyticsEventType, } from '@genesislcap/foundation-comms';
 import { Container, optional } from '@microsoft/fast-foundation';
 import { RouterConfiguration, Route } from '@microsoft/fast-router';
-import { Auth, Session, FoundationAnalytics, FoundationAnalyticsEventType, } from '@genesislcap/foundation-comms';
 import { defaultLayout } from '../layouts';
-import { LoginForm } from './login-form/login-form';
+import { defaultLoginConfig, LoginConfig } from '../main';
 import { ForgotPassword } from './forgot-password/forgot-password';
+import { LoginForm } from './login-form/login-form';
 import { NotFound } from './not-found/not-found';
-import { RequestAccount } from './request-account/request-account';
-import { Verify } from './verify/verify';
 import { Protected } from './protected/protected';
+import { RequestAccount } from './request-account/request-account';
 import { ResetPassword } from './reset-password/reset-password';
-import { defaultLoginConfig, LoginConfig } from '../main';
+import { Verify } from './verify/verify';
 /**
  * Base implementation of a routing used with the Login class
  *
@@ -166,4 +166,3 @@ MainRouterConfig = __decorate([
     __param(4, optional(LoginConfig))
 ], MainRouterConfig);
 export { MainRouterConfig };
-//# sourceMappingURL=config.js.map

package/dist/esm/routes/forgot-password/forgot-password.js

@@ -1,10 +1,10 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
+import { hostEnv } from '../../main/config';
 import { commonLoginRouteStyles } from '../../styles';
-import { ForgotPasswordTemplate as template } from './forgot-password.template';
 import { logger } from '../../utils';
-import { hostEnv } from '../../main/config';
+import { BaseRoute } from '../base';
+import { ForgotPasswordTemplate as template } from './forgot-password.template';
 let ForgotPassword = class ForgotPassword extends BaseRoute {
     connectedCallback() {
         const _super = Object.create(null, {
@@ -25,7 +25,7 @@ let ForgotPassword = class ForgotPassword extends BaseRoute {
             /**
              * Example url from email: https://public-foundation.genesislab.global/reset-password?password=nc_cbGrlgCkZeJHAF043oqEidnk
              */
-            const returnUrl = `${location.protocol}//${hostEnv}/reset-password`;
+            const returnUrl = `${location.protocol}//${hostEnv}/${this.getSubRoutePath('reset-password')}`;
             const message = this.messageBuilder.createForgotPasswordMessage(this.orgUsername, returnUrl);
             yield this.sendMessage(message, 'Please check your inbox for reset instructions.');
         });
@@ -39,4 +39,3 @@ ForgotPassword = __decorate([
     })
 ], ForgotPassword);
 export { ForgotPassword };
-//# sourceMappingURL=forgot-password.js.map

package/dist/esm/routes/forgot-password/forgot-password.template.js

@@ -24,4 +24,3 @@ export const ForgotPasswordTemplate = html `
     </div>
   </login-background>
 `;
-//# sourceMappingURL=forgot-password.template.js.map

package/dist/esm/routes/index.js

@@ -1,4 +1,3 @@
 export * from './base';
 export * from './config';
 export * from './types';
-//# sourceMappingURL=index.js.map

package/dist/esm/routes/login-form/login-form.js

@@ -4,24 +4,20 @@ import { inIFrame, inSymphonyDesktop, openPopup } from '@genesislcap/foundation-
 import { customElement, DOM, observable, volatile } from '@microsoft/fast-element';
 import { Route } from '@microsoft/fast-router';
 import { logger } from '../../utils';
+import { BaseRoute } from '../base';
 import { LoginFormStyles as styles } from './login-form.styles';
 import { LoginFormTemplate as template } from './login-form.template';
-import { BaseRoute } from '../base';
 let LoginForm = class LoginForm extends BaseRoute {
     constructor() {
         super(...arguments);
         this.idps = [];
         this.selectedIDP = '';
         this.ssoToggled = false;
+        this.showConnectionIndicator = false;
+        this.submitDisabled = true;
         this.fetchIDPs = () => __awaiter(this, void 0, void 0, function* () {
             var _a, _b;
-            const fixEndpoint = (endpoint) => endpoint.startsWith('ws:')
-                ? endpoint.replace('ws:', 'http:')
-                : endpoint.startsWith('wss:')
-                    ? endpoint.replace('wss:', 'https:')
-                    : endpoint;
-            const host = fixEndpoint(this.host);
-            const ipdsEndpoint = `${host}${(_b = (_a = this.config.sso) === null || _a === void 0 ? void 0 : _a.identityProvidersPath) !== null && _b !== void 0 ? _b : 'sso/list'}`;
+            const ipdsEndpoint = `${(_b = (_a = this.config.sso) === null || _a === void 0 ? void 0 : _a.identityProvidersPath) !== null && _b !== void 0 ? _b : 'sso/list'}`;
             return fetch(ipdsEndpoint)
                 .then((res) => {
                 if (res.ok)
@@ -52,6 +48,21 @@ let LoginForm = class LoginForm extends BaseRoute {
             }
             this.convertHostUrl();
             yield this.autofill();
+            this.sub = this.connect._status.subscribe((status) => {
+                this.status = status;
+                this.connectActionText = status === 'connected' ? 'Disconnect' : 'Connect';
+                this.submitDisabled = !this.connect.httpMode() && status !== 'connected';
+            });
+        });
+    }
+    disconnectedCallback() {
+        const _super = Object.create(null, {
+            disconnectedCallback: { get: () => super.disconnectedCallback }
+        });
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            _super.disconnectedCallback.call(this);
+            (_a = this.sub) === null || _a === void 0 ? void 0 : _a.unsubscribe();
         });
     }
     enter() {
@@ -82,8 +93,8 @@ let LoginForm = class LoginForm extends BaseRoute {
         });
     }
     attemptLoginWhenConnected() {
-        this.connect.isConnectedSubject.subscribe((isConnected) => {
-            if (isConnected) {
+        this.connect._status.subscribe((status) => {
+            if (status === 'connected') {
                 /**
                  * Login preference flow taken from @genesislcap/foundation-login.
                  * We should sit down with Jose and team to cross check this. Reference code is bit hard to follow in places.
@@ -157,9 +168,8 @@ let LoginForm = class LoginForm extends BaseRoute {
     }
     createLoginURL() {
         const selectedIDP = this.idps.find((idp) => idp.id === this.selectedIDP);
-        const appHost = new URL(this.host).host;
         const ssoLoginRoute = `/gwf/${selectedIDP.type}/login`;
-        const ssoLoginUrl = `https://${appHost}${ssoLoginRoute}?idp=${selectedIDP.id}`;
+        const ssoLoginUrl = `${ssoLoginRoute}?idp=${selectedIDP.id}`;
         return ssoLoginUrl;
     }
     convertHostUrl() {
@@ -208,10 +218,12 @@ let LoginForm = class LoginForm extends BaseRoute {
                 if (err instanceof AuthError) {
                     if (err.hasPasswordExpiredError()) {
                         this.storeCredentials();
-                        this.onNavigate('reset-password', { expired: true });
+                        this.onNavigate(this.getSubRoutePath('reset-password?expired'));
                         return;
                     }
-                    if (this.config.fields.organisation && !this.organisation.length) {
+                    if (this.config.fields.organisation &&
+                        this.config.fields.organisation.required !== false &&
+                        !this.organisation.length) {
                         this.setError(err.message + 'Please fill in Comp Id.');
                         return;
                     }
@@ -222,15 +234,9 @@ let LoginForm = class LoginForm extends BaseRoute {
             }
         });
     }
-    get connectActionText() {
-        return this.connect.isConnected ? 'Disconnect' : 'Connect';
-    }
     get submitConnectDisabled() {
         return !this.host;
     }
-    get submitDisabled() {
-        return !this.connect.httpMode() && (this.connect.isWorking || !this.connect.isConnected);
-    }
 };
 __decorate([
     observable
@@ -242,11 +248,20 @@ __decorate([
     observable
 ], LoginForm.prototype, "ssoToggled", void 0);
 __decorate([
-    volatile
-], LoginForm.prototype, "selectedIDPName", null);
+    observable
+], LoginForm.prototype, "showConnectionIndicator", void 0);
+__decorate([
+    observable
+], LoginForm.prototype, "connectActionText", void 0);
+__decorate([
+    observable
+], LoginForm.prototype, "status", void 0);
+__decorate([
+    observable
+], LoginForm.prototype, "submitDisabled", void 0);
 __decorate([
     volatile
-], LoginForm.prototype, "connectActionText", null);
+], LoginForm.prototype, "selectedIDPName", null);
 LoginForm = __decorate([
     customElement({
         name: 'foundation-login-form',
@@ -255,4 +270,3 @@ LoginForm = __decorate([
     })
 ], LoginForm);
 export { LoginForm };
-//# sourceMappingURL=login-form.js.map

package/dist/esm/routes/login-form/login-form.styles.js

@@ -76,4 +76,3 @@ export const LoginFormStyles = css `
     line-height: calc(var(--design-unit) * 6px);
   }
 `;
-//# sourceMappingURL=login-form.styles.js.map

package/dist/esm/routes/login-form/login-form.template.js

@@ -1,6 +1,6 @@
-import { html, repeat, when } from '@microsoft/fast-element';
 import { sync } from '@genesislcap/foundation-utils';
-import { organisationField, passwordField, showPasswordsCheckbox, usernameField, submitButton, } from '../base';
+import { html, repeat, when } from '@microsoft/fast-element';
+import { organisationField, passwordField, showPasswordsCheckbox, submitButton, usernameField, } from '../base';
 const regularLogin = html `
   ${when((login) => !login.ssoToggled, html `
       ${organisationField()} ${usernameField()} ${passwordField()}
@@ -13,7 +13,7 @@ const regularLogin = html `
             ${when((x) => !x.config.omitRoutes.includes('forgot-password'), html `
                 <a
                   class="link-url"
-                  @click=${(x) => x.onNavigate(`forgot-password`)}
+                  @click=${(x) => x.onNavigate(x.getSubRoutePath(`forgot-password`))}
                   data-test-id="forgot-password"
                 >
                   Forgot Password?
@@ -22,7 +22,7 @@ const regularLogin = html `
             ${when((x) => !x.config.omitRoutes.includes('reset-password'), html `
                 <a
                   class="link-url"
-                  @click=${(x) => x.onNavigate(`reset-password`)}
+                  @click=${(x) => x.onNavigate(x.getSubRoutePath(`reset-password`))}
                   data-test-id="reset-password"
                 >
                   Change Password
@@ -33,7 +33,7 @@ const regularLogin = html `
             ${when((x) => !x.config.omitRoutes.includes('request-account'), html `
                 <a
                   class="link-url"
-                  @click=${(x) => x.onNavigate(`request-account`)}
+                  @click=${(x) => x.onNavigate(x.getSubRoutePath(`request-account`))}
                   data-test-id="request-account"
                 >
                   Request Account
@@ -108,7 +108,7 @@ export const LoginFormTemplate = html `
                 type="text"
                 name="host"
                 :value=${sync((x) => x.host)}
-                ?disabled=${(x) => x.connect.isConnected}
+                ?disabled=${(x) => x.status === 'connected'}
                 data-test-id="connect-host"
                 required
               >
@@ -159,4 +159,3 @@ export const LoginFormTemplate = html `
     </div>
   </login-background>
 `;
-//# sourceMappingURL=login-form.template.js.map

package/dist/esm/routes/not-found/not-found.js

@@ -1,7 +1,7 @@
 import { __decorate } from "tslib";
 import { customElement, html } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
 import { commonLoginRouteStyles } from '../../styles';
+import { BaseRoute } from '../base';
 let NotFound = class NotFound extends BaseRoute {
 };
 NotFound = __decorate([
@@ -14,4 +14,3 @@ NotFound = __decorate([
     })
 ], NotFound);
 export { NotFound };
-//# sourceMappingURL=not-found.js.map

package/dist/esm/routes/protected/protected.js

@@ -1,7 +1,7 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
 import { commonLoginRouteStyles } from '../../styles';
+import { BaseRoute } from '../base';
 import { ProtectedTemplate as template } from './protected.template';
 let Protected = class Protected extends BaseRoute {
     onLogout() {
@@ -11,7 +11,7 @@ let Protected = class Protected extends BaseRoute {
                 return;
             }
             yield this.credentialManager.preventSilentAccess();
-            this.onNavigate('login');
+            this.onNavigate('/');
         });
     }
 };
@@ -23,4 +23,3 @@ Protected = __decorate([
     })
 ], Protected);
 export { Protected };
-//# sourceMappingURL=protected.js.map

package/dist/esm/routes/protected/protected.template.js

@@ -11,4 +11,3 @@ export const ProtectedTemplate = html `
     </zero-button>
   </div>
 `;
-//# sourceMappingURL=protected.template.js.map

package/dist/esm/routes/request-account/request-account.js

@@ -1,9 +1,9 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement, observable } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
 import { commonLoginRouteStyles } from '../../styles';
-import { RequestAccountTemplate as template } from './request-account.template';
 import { logger } from '../../utils';
+import { BaseRoute } from '../base';
+import { RequestAccountTemplate as template } from './request-account.template';
 let RequestAccount = class RequestAccount extends BaseRoute {
     constructor() {
         super(...arguments);
@@ -30,4 +30,3 @@ RequestAccount = __decorate([
     })
 ], RequestAccount);
 export { RequestAccount };
-//# sourceMappingURL=request-account.js.map

package/dist/esm/routes/request-account/request-account.template.js

@@ -1,5 +1,5 @@
-import { html } from '@microsoft/fast-element';
 import { sync } from '@genesislcap/foundation-utils';
+import { html } from '@microsoft/fast-element';
 import { backButton, emailField, organisationField, password2Field, passwordField, usernameField, } from '../base';
 export const RequestAccountTemplate = html `
   <login-background>
@@ -35,4 +35,3 @@ export const RequestAccountTemplate = html `
     </div>
   </login-background>
 `;
-//# sourceMappingURL=request-account.template.js.map

package/dist/esm/routes/reset-password/reset-password.js

@@ -1,9 +1,9 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement, observable, volatile } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
 import { commonLoginRouteStyles } from '../../styles';
-import { ResetPasswordTemplate as template } from './reset-password.template';
 import { logger } from '../../utils';
+import { BaseRoute } from '../base';
+import { ResetPasswordTemplate as template } from './reset-password.template';
 let ResetPassword = class ResetPassword extends BaseRoute {
     constructor() {
         super(...arguments);
@@ -76,4 +76,3 @@ ResetPassword = __decorate([
     })
 ], ResetPassword);
 export { ResetPassword };
-//# sourceMappingURL=reset-password.js.map

package/dist/esm/routes/reset-password/reset-password.template.js

@@ -28,4 +28,3 @@ export const ResetPasswordTemplate = html `
     </div>
   </login-background>
 `;
-//# sourceMappingURL=reset-password.template.js.map

package/dist/esm/routes/types.js

@@ -1,2 +1 @@
 export {};
-//# sourceMappingURL=types.js.map

package/dist/esm/routes/verify/verify.js

@@ -1,9 +1,9 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement, observable } from '@microsoft/fast-element';
-import { BaseRoute } from '../base';
 import { commonLoginRouteStyles } from '../../styles';
-import { VerifyTemplate as template } from './verify.template';
 import { logger } from '../../utils';
+import { BaseRoute } from '../base';
+import { VerifyTemplate as template } from './verify.template';
 let Verify = class Verify extends BaseRoute {
     constructor() {
         super(...arguments);
@@ -30,4 +30,3 @@ Verify = __decorate([
     })
 ], Verify);
 export { Verify };
-//# sourceMappingURL=verify.js.map

package/dist/esm/routes/verify/verify.template.js

@@ -36,4 +36,3 @@ export const VerifyTemplate = html `
     </div>
   </login-background>
 `;
-//# sourceMappingURL=verify.template.js.map

package/dist/esm/styles/index.js

@@ -1,3 +1 @@
 export * from './styles';
-export * from './typography';
-//# sourceMappingURL=index.js.map

package/dist/esm/styles/styles.js

@@ -1,6 +1,5 @@
-import { css } from '@microsoft/fast-element';
 import { neutralLayer1 } from '@microsoft/fast-components';
-import { mixinCardTitle } from './typography';
+import { css } from '@microsoft/fast-element';
 export const mixinScreen = (display = 'block') => `
   contain: content;
   display: ${display};
@@ -62,8 +61,7 @@ export const commonLoginStyles = css `
   }
 
   .heading {
-    ${mixinCardTitle};
-
+    font-weight: bold;
     background-color: ${neutralLayer1};
     border-bottom: 1px solid rgba(0, 0, 0, 0.12);
     font-size: 20px;
@@ -72,9 +70,7 @@ export const commonLoginStyles = css `
   }
 
   .heading2 {
-    font-family: Roboto-Medium, sans-serif;
     font-weight: 500;
-    font-style: normal;
     font-size: 16px;
     text-align: center;
     opacity: 80%;
@@ -83,9 +79,7 @@ export const commonLoginStyles = css `
 
   .heading3 {
     text-align: center;
-    font-family: Roboto-Medium, sans-serif;
     font-weight: 500;
-    font-style: normal;
     font-size: 12px;
     opacity: 50%;
     margin-bottom: calc(var(--design-unit) * 5px);
@@ -107,8 +101,6 @@ export const commonLoginStyles = css `
   }
 
   .form-title {
-    font-family: Roboto-Medium, sans-serif;
-    font-style: normal;
     color: var(--neutral-stroke-rest);
   }
 
@@ -142,4 +134,3 @@ export const commonLoginRouteStyles = css `
   ${commonHostStyles}
   ${commonLoginStyles}
 `;
-//# sourceMappingURL=styles.js.map

package/dist/esm/utils/index.js

@@ -1,2 +1 @@
 export * from './logger';
-//# sourceMappingURL=index.js.map

package/dist/esm/utils/logger.js

@@ -1,3 +1,2 @@
 import { createLogger } from '@genesislcap/foundation-utils';
 export const logger = createLogger('foundation-login');
-//# sourceMappingURL=logger.js.map

package/dist/foundation-login.api.json

@@ -175,7 +175,7 @@
         {
           "kind": "Function",
           "canonicalReference": "@genesislcap/foundation-login!configure:function(1)",
-          "docComment": "/**\n * Configure the login micro frontend settings.\n *\n * @remarks\n *\n * This is primarily for general settings, rather than re-defining the element, static templating / style changes.\n *\n * @param container - DI container.\n *\n * @param config - A partial LoginConfig.\n *\n * @example\n *\n * Configuring login on lazy load\n * ```ts\n * name: 'login',\n * path: 'login',\n * title: 'Login',\n * element: async () => {\n *   const { configure, define, defaultLoginConfig } = await import('@genesislcap/foundation-login');\n *   configure(this.container, {\n *     autoConnect: true,\n *     omitRoutes: ['request-account'],\n *     fields: {\n *       ...defaultLoginConfig.fields,\n *       organisation: {\n *         label: 'CompID',\n *       },\n *     },\n *     defaultRedirectUrl: 'dashboard',\n *     logo: loginLogo,\n *     background: loginBG,\n *   });\n *   // You can import and return `Login` directly here or re-define it completely via `define`.\n *   return define({\n *     name: `nexus-login`,\n *   });\n * },\n * layout: loginLayout,\n * settings: { public: true },\n * childRouters: true,\n * ```\n *\n * @public\n */\n",
+          "docComment": "/**\n * Configure the login micro frontend settings.\n *\n * @remarks\n *\n * This is primarily for general settings, rather than re-defining the element, static templating / style changes.\n *\n * @param container - DI container.\n *\n * @param config - A partial LoginConfig.\n *\n * @example\n *\n * Configuring login on lazy load\n * ```ts\n * name: 'login',\n * path: 'login',\n * title: 'Login',\n * element: async () => {\n *   const { configure, define, defaultLoginConfig } = await import('@genesislcap/foundation-login');\n *   configure(this.container, {\n *     autoConnect: true,\n *     omitRoutes: ['request-account'],\n *     fields: {\n *       ...defaultLoginConfig.fields,\n *       organisation: {\n *         label: 'CompID',\n *       },\n *     },\n *     hostPath: 'login',\n *     defaultRedirectUrl: 'dashboard',\n *     logo: loginLogo,\n *     background: loginBG,\n *   });\n *   // You can import and return `Login` directly here or re-define it completely via `define`.\n *   return define({\n *     name: `nexus-login`,\n *   });\n * },\n * layout: loginLayout,\n * settings: { public: true },\n * childRouters: true,\n * ```\n *\n * @public\n */\n",
           "excerptTokens": [
             {
               "kind": "Content",
@@ -487,7 +487,7 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    label: string;\n    value?: any;\n}"
+              "text": "{\n    label: string;\n    value?: any;\n    required?: boolean;\n}"
             },
             {
               "kind": "Content",
@@ -982,6 +982,33 @@
                 "endIndex": 2
               }
             },
+            {
+              "kind": "PropertySignature",
+              "canonicalReference": "@genesislcap/foundation-login!LoginConfig#hostPath:member",
+              "docComment": "/**\n * The `path` of the micro frontend as defined in the parent / host route.\n *\n * @remarks\n *\n * Used to help resolve internal route links. Defaults to an empty string.\n */\n",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "hostPath: "
+                },
+                {
+                  "kind": "Content",
+                  "text": "string"
+                },
+                {
+                  "kind": "Content",
+                  "text": ";"
+                }
+              ],
+              "isReadonly": false,
+              "isOptional": false,
+              "releaseTag": "Public",
+              "name": "hostPath",
+              "propertyTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              }
+            },
             {
               "kind": "PropertySignature",
               "canonicalReference": "@genesislcap/foundation-login!LoginConfig#logo:member",
@@ -1361,7 +1388,7 @@
         {
           "kind": "Variable",
           "canonicalReference": "@genesislcap/foundation-login!styles:var",
-          "docComment": "/**\n * @public\n */\n",
+          "docComment": "/**\n * @example\n *\n * unknown target\n * ```\n * const buttonTag = tagFor(options.button);\n * ...\n * ${buttonTag} {\n *   width: 200px;\n * }\n * ```\n *\n * @public\n */\n",
           "excerptTokens": [
             {
               "kind": "Content",

package/dist/foundation-login.d.ts

@@ -57,8 +57,9 @@ export declare class BaseRoute extends ConfigHostElement {
     setError(message: string): void;
     clearError(): void;
     get orgUsername(): string;
-    onBack: () => Promise<void>;
-    onNavigate: (routeName: Routes, params?: {}) => Promise<void>;
+    getSubRoutePath(routeName: Routes | string): string;
+    onBack: () => void;
+    onNavigate: (path: string) => void;
     queueOnBack(delay?: number): void;
     autofill(): Promise<boolean>;
     storeCredentials(password?: string): void;
@@ -75,8 +76,8 @@ export declare type ConfigHost = {
 /**
  * @internal
  * @privateRemarks
- * For services / constructor injection, using @optional(LoginConfig) config = defaultLoginConfig; works as expected.
- * However, for elements, the @optional decorator isn't viable. This base element provides an alternative approach.
+ * For services / constructor injection, using `@optional(LoginConfig) config = defaultLoginConfig;` works as expected.
+ * However, for elements, the `@optional` decorator isn't viable. This base element provides an alternative approach.
  */
 export declare class ConfigHostElement extends FASTElement implements ConfigHost {
     container: Container;
@@ -117,6 +118,7 @@ export declare const configurableTextField: <T extends ConfigHost>(name: keyof F
  *         label: 'CompID',
  *       },
  *     },
+ *     hostPath: 'login',
  *     defaultRedirectUrl: 'dashboard',
  *     logo: loginLogo,
  *     background: loginBG,
@@ -176,7 +178,7 @@ export declare const defaultSocketExt: string;
  * Hosts should be able to figure out everything they will need to do to fully customise a MF. Currently, they
  * import these `defaultTemplateOptions` and the host dev overrides. Each TemplateComponents key must be a mandatory
  * override, given in hosted mode the MFs won't be registering fallbacks as this would be wasteful, bloat etc.
- * I've added the components list to the package.json > config block for now, but I'm not using it here.
+ * I've added the components list to the package.json \> config block for now, but I'm not using it here.
  */
 export declare const defaultTemplateOptions: TemplateOptions;
 
@@ -236,6 +238,11 @@ export declare type FieldConfig = {
      * Added for now to apply defaults, but I'm not convinced we should do this. Could be made reactive after upgrade.
      */
     value?: any;
+    /**
+     * @privateRemarks
+     * Expect fields to be required by default, but can override in config if they want to make it optional
+     */
+    required?: boolean;
 };
 
 /**
@@ -523,6 +530,13 @@ export declare interface LoginConfig {
      * Show or hide the connection status indicator.
      */
     showConnectionIndicator: boolean;
+    /**
+     * The `path` of the micro frontend as defined in the parent / host route.
+     *
+     * @remarks
+     * Used to help resolve internal route links. Defaults to an empty string.
+     */
+    hostPath: string;
     /**
      * The default URL to route the user to after a successful login.
      *
@@ -700,12 +714,15 @@ export declare const standaloneDefinition: PartialFASTElementDefinition;
 /**
  * @public
  * @privateRemarks
- * Options cam be used to target unknown component tags in the css, such as:
+ * Options can be used to target unknown component tags in the css, such as:
+ * @example unknown target
+ * ```
  * const buttonTag = tagFor(options.button);
  * ...
  * ${buttonTag} {
  *   width: 200px;
  * }
+ * ```
  */
 export declare const styles: (options: TemplateOptions) => ElementStyles;