@thoughtspot/visual-embed-sdk 1.37.1-spotter-embed → 1.38.0-alpha.1

package/lib/src/visual-embed-sdk.d.ts

@@ -11,13 +11,13 @@ declare module '@thoughtspot/visual-embed-sdk' {
       * @summary ThoughtSpot Visual Embed SDK
       * @author Ayon Ghosh <ayon.ghosh@thoughtspot.com>
       */
-    import { AppEmbed, Page, AppViewConfig, HomePageSearchBarMode } from '@thoughtspot/visual-embed-sdk/embed/app';
+    import { AppEmbed, Page, AppViewConfig, HomePageSearchBarMode, PrimaryNavbarVersion, HomePage } from '@thoughtspot/visual-embed-sdk/embed/app';
     import { init, prefetch, logout, executeTML, exportTML, executeTMLInput, exportTMLInput } from '@thoughtspot/visual-embed-sdk/embed/base';
     import { PinboardEmbed, LiveboardViewConfig, LiveboardEmbed } from '@thoughtspot/visual-embed-sdk/embed/liveboard';
     import { SearchEmbed, SearchViewConfig } from '@thoughtspot/visual-embed-sdk/embed/search';
     import { SearchBarEmbed, SearchBarViewConfig } from '@thoughtspot/visual-embed-sdk/embed/search-bar';
-    import { SpotterAgentEmbed, SpotterAgentEmbedViewConfig, SpotterAgentEmbed as BodylessConversation, SpotterAgentEmbedViewConfig as BodylessConversationViewConfig } from '@thoughtspot/visual-embed-sdk/embed/bodyless-conversation';
-    import { SpotterEmbed, SpotterEmbedViewConfig, SpotterEmbed as ConversationEmbed, SpotterEmbedViewConfig as ConversationViewConfig } from '@thoughtspot/visual-embed-sdk/embed/conversation';
+    import { SpotterAgentEmbed, SpotterAgentEmbedViewConfig, BodylessConversation, BodylessConversationViewConfig } from '@thoughtspot/visual-embed-sdk/embed/bodyless-conversation';
+    import { SpotterEmbed, SpotterEmbedViewConfig, ConversationEmbed, ConversationViewConfig } from '@thoughtspot/visual-embed-sdk/embed/conversation';
     import { AuthFailureType, AuthStatus, AuthEvent, AuthEventEmitter } from '@thoughtspot/visual-embed-sdk/auth';
     import { getSessionInfo } from '@thoughtspot/visual-embed-sdk/utils/sessionInfoService';
     import { AuthType, RuntimeFilter, RuntimeFilterOp, EmbedEvent, HostEvent, DataSourceVisualMode, Action, EmbedConfig, PrefetchFeatures, FrameParams, DOMSelector, HomeLeftNavItem, HomepageModule, MessageOptions, MessageCallback, MessagePayload, CustomisationsInterface, CustomStyles, customCssInterface, ContextMenuTriggerOptions, RuntimeParameter, LogLevel, VizPoint, CustomActionPayload, ListPageColumns } from '@thoughtspot/visual-embed-sdk/types';
@@ -30,7 +30,7 @@ declare module '@thoughtspot/visual-embed-sdk' {
     import { getAnswerFromQuery } from '@thoughtspot/visual-embed-sdk/utils/graphql/nlsService/nls-answer-service';
     import { createLiveboardWithAnswers } from '@thoughtspot/visual-embed-sdk/utils/liveboardService/liveboardService';
     import { UIPassthroughEvent } from '@thoughtspot/visual-embed-sdk/embed/hostEventClient/contracts';
-    export { init, logout, prefetch, executeTML, exportTML, executeTMLInput, exportTMLInput, getEmbedConfig as getInitConfig, getSessionInfo, tokenizedFetch, getAnswerFromQuery, createLiveboardWithAnswers, SearchEmbed, SearchBarEmbed, PinboardEmbed, LiveboardEmbed, SageEmbed, AppEmbed, SpotterAgentEmbed, SpotterAgentEmbedViewConfig, BodylessConversationViewConfig, BodylessConversation, SpotterEmbed, SpotterEmbedViewConfig, ConversationViewConfig, ConversationEmbed, AuthFailureType, AuthStatus, AuthEvent, AuthEventEmitter, AnswerService, SessionInterface, UnderlyingDataPoint, Page, AuthType, RuntimeFilter, RuntimeFilterOp, EmbedEvent, HostEvent, DataSourceVisualMode, Action, ContextMenuTriggerOptions, EmbedConfig, SearchViewConfig, SearchBarViewConfig, LiveboardViewConfig, SageViewConfig, AppViewConfig, PrefetchFeatures, FrameParams, HomeLeftNavItem, HomepageModule, DOMSelector, MessageOptions, MessageCallback, MessagePayload, CustomisationsInterface, CustomStyles, customCssInterface, CustomCssVariables, RuntimeParameter, LogLevel, uploadMixpanelEvent, MIXPANEL_EVENT, HomePageSearchBarMode, VizPoint, CustomActionPayload, UIPassthroughEvent, ListPageColumns, };
+    export { init, logout, prefetch, executeTML, exportTML, executeTMLInput, exportTMLInput, getEmbedConfig as getInitConfig, getSessionInfo, tokenizedFetch, getAnswerFromQuery, createLiveboardWithAnswers, SearchEmbed, SearchBarEmbed, PinboardEmbed, LiveboardEmbed, SageEmbed, AppEmbed, SpotterAgentEmbed, SpotterAgentEmbedViewConfig, BodylessConversationViewConfig, BodylessConversation, SpotterEmbed, SpotterEmbedViewConfig, ConversationViewConfig, ConversationEmbed, AuthFailureType, AuthStatus, AuthEvent, AuthEventEmitter, AnswerService, SessionInterface, UnderlyingDataPoint, Page, AuthType, RuntimeFilter, RuntimeFilterOp, EmbedEvent, HostEvent, DataSourceVisualMode, Action, ContextMenuTriggerOptions, EmbedConfig, SearchViewConfig, SearchBarViewConfig, LiveboardViewConfig, SageViewConfig, AppViewConfig, PrefetchFeatures, FrameParams, HomeLeftNavItem, HomepageModule, DOMSelector, MessageOptions, MessageCallback, MessagePayload, CustomisationsInterface, CustomStyles, customCssInterface, CustomCssVariables, RuntimeParameter, LogLevel, uploadMixpanelEvent, MIXPANEL_EVENT, HomePageSearchBarMode, PrimaryNavbarVersion, HomePage, VizPoint, CustomActionPayload, UIPassthroughEvent, ListPageColumns, };
     export { resetCachedAuthToken } from '@thoughtspot/visual-embed-sdk/authToken';
 }
 
@@ -106,6 +106,43 @@ declare module '@thoughtspot/visual-embed-sdk/embed/app' {
             AI_ANSWER = "aiAnswer",
             NONE = "none"
     }
+    /**
+        * Define the version of the primary navbar
+        * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+        */
+    export enum PrimaryNavbarVersion {
+            /**
+                * Sliding (v3) introduces a new left-side navigation hub featuring a tab switcher,
+                * along with updates to the top navigation bar.
+                * It serves as the foundational version of the PrimaryNavBar.
+                */
+            Sliding = "v3"
+    }
+    /**
+        * Define the version of the home page
+        * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+        */
+    export enum HomePage {
+            /**
+                * Modular (v2) introduces the updated Modular Home Experience.
+                * It serves as the foundational version of the home page.
+                */
+            Modular = "v2"
+    }
+    /**
+        * Define the discovery experience
+        * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+        */
+    export interface DiscoveryExperience {
+            /**
+                * primaryNavbarVersion determines the version of the navigation version.
+                */
+            primaryNavbarVersion?: PrimaryNavbarVersion;
+            /**
+                * homePage determines the version of the home page.
+                */
+            homePage?: HomePage;
+    }
     /**
         * The view configuration for full app embedding.
         * @group Embed components
@@ -413,7 +450,7 @@ declare module '@thoughtspot/visual-embed-sdk/embed/app' {
                 */
             modularHomeExperience?: boolean;
             /**
-                * Flag to control new navigation v3 home experience.
+                * To configure the top-left navigation and home page experience
                 *
                 * @default false
                 * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
@@ -421,11 +458,14 @@ declare module '@thoughtspot/visual-embed-sdk/embed/app' {
                 * ```js
                 * const embed = new AppEmbed('#tsEmbed', {
                 *    ... // other options
-                *    modularHomeExperienceV3 : true,
+                *    discoveryExperience : {
+                *      primaryNavbarVersion: PrimaryNavbarVersion.Sliding,
+                *      homePage: HompePage.Modular,
+                *    },
                 * })
                 * ```
                 */
-            modularHomeExperienceV3?: boolean;
+            discoveryExperience?: DiscoveryExperience;
             /**
                 * Boolean to control if Liveboard header is sticky or not.
                 * @example
@@ -1616,10 +1656,15 @@ declare module '@thoughtspot/visual-embed-sdk/embed/bodyless-conversation' {
                 * The ID of the worksheet to use for the conversation.
                 */
             worksheetId: string;
+            /**
+                * Optional CSS class name to add to the container div.
+                */
+            containerClassName?: string;
     }
     /**
         * Configuration for conversation options.
-        * @deprecated Renamed to SpotterAgentEmbedViewConfig
+        * @deprecated from SDK: 1.38.0 | ThoughtSpot: 10.10.0.cl
+        * Use {@link SpotterAgentEmbedViewConfig} instead
         * @group Embed components
         */
     export interface BodylessConversationViewConfig extends SpotterAgentEmbedViewConfig {
@@ -1670,7 +1715,8 @@ declare module '@thoughtspot/visual-embed-sdk/embed/bodyless-conversation' {
     /**
         * Create a conversation embed, which can be integrated inside
         * chatbots or other conversational interfaces.
-        * @deprecated Renamed to SpotterAgentEmbed
+        * @deprecated from SDK: 1.38.0 | ThoughtSpot: 10.10.0.cl
+        * Use {@link SpotterAgentEmbed} instead
         * @example
         * ```js
         * import { SpotterAgentEmbed } from '@thoughtspot/visual-embed-sdk';
@@ -1685,7 +1731,6 @@ declare module '@thoughtspot/visual-embed-sdk/embed/bodyless-conversation' {
         * document.body.appendChild(container); // or to any other element
         * ```
         * @group Embed components
-        * @version SDK: 1.37.0 | ThoughtSpot: 10.9.0.cl
         */
     export class BodylessConversation extends SpotterAgentEmbed {
             constructor(viewConfig: BodylessConversationViewConfig);
@@ -1786,7 +1831,8 @@ declare module '@thoughtspot/visual-embed-sdk/embed/conversation' {
     }
     /**
         * The configuration for the embedded spotterEmbed options.
-        * @deprecated Renamed to SpotterEmbedViewConfig
+        * @deprecated from SDK: 1.38.0 | ThoughtSpot: 10.10.0.cl
+        * Use {@link SpotterEmbedViewConfig} instead
         * @group Embed components
         */
     export interface ConversationViewConfig extends SpotterEmbedViewConfig {
@@ -1804,7 +1850,7 @@ declare module '@thoughtspot/visual-embed-sdk/embed/conversation' {
         * });
         * conversation.render();
         * ```
-        * @version SDK: 1.38.0 | ThoughtSpot: 10.10.0.cl
+        * @version SDK: 1.37.0 | ThoughtSpot: 10.9.0.cl
         */
     export class SpotterEmbed extends TsEmbed {
             protected viewConfig: SpotterEmbedViewConfig;
@@ -1814,7 +1860,8 @@ declare module '@thoughtspot/visual-embed-sdk/embed/conversation' {
     }
     /**
         * Embed ThoughtSpot AI Conversation.
-        * @deprecated Renamed to SpotterEmbed
+        * @deprecated from SDK: 1.38.0 | ThoughtSpot: 10.10.0.cl
+        * Use {@link SpotterEmbed} instead
         * @group Embed components
         * @example
         * ```js
@@ -4752,9 +4799,12 @@ declare module '@thoughtspot/visual-embed-sdk/types' {
                 * @example
                 * ```js
                 * searchEmbed.trigger(HostEvent.OpenFilter,
-                * { columnId: '<column-GUID>', name: 'column name', type: 'INT64', dataType: 'ATTRIBUTE'})
+                *  {column: { columnId: '<column-GUID>', name: 'column name', type: 'INT64', dataType: 'ATTRIBUTE'}})
+                * ```
+                * @example
+                * ```js
                 * LiveboardEmbed.trigger(HostEvent.OpenFilter,
-                *  { columnId: '<column-GUID>'})
+                *   { column: {columnId: '<column-GUID>'}})
                 * ```
                 * @version SDK: 1.21.0 | ThoughtSpot: 9.2.0.cl
                 */
@@ -5363,6 +5413,25 @@ declare module '@thoughtspot/visual-embed-sdk/types' {
                 *    }]
                 * });
                 * ```
+                * If there are multiple columns with the same name, consider
+                * using `WORKSHEET_NAME::COLUMN_NAME` format.
+                *
+                * @example
+                *
+                * ```js
+                * liveboardEmbed.trigger(HostEvent.UpdateFilters, {
+                *  filters: [{
+                *      column: "(Sample) Retail - Apparel::city",
+                *      oper: 'IN',
+                *      values: ["atlanta"]
+                *  },
+                *  {
+                *      column: "(Sample) Retail - Apparel::Region",
+                *      oper: 'IN',
+                *      values: ["West","Midwest"]
+                *  }]
+                * });
+                * ```
                 * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
                 */
             UpdateFilters = "updateFilters",
@@ -5571,55 +5640,7 @@ declare module '@thoughtspot/visual-embed-sdk/types' {
                 * ```
                 * @version SDK: 1.37.0 | ThoughtSpot: 10.8.0.cl
                 */
-            TransformTableVizData = "TransformTableVizData",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            SpotterSearch = "SpotterSearch",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            EditLastPrompt = "EditLastPrompt",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            PreviewSpotterData = "PreviewSpotterData",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            ResetSpotterConversation = "ResetSpotterConversation",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            DeleteLastPrompt = "DeleteLastPrompt",
-            /**
-                * Triggers the table visualization re-render with the updated data.
-                * Includes the following properties:
-                * @param - `columnDataLite` - an array of object containing the
-                * data value modifications retrieved from the `EmbedEvent.TableVizRendered`
-                * payload.For example, { columnDataLite: []}`.
-                */
-            AnswerChartSwitcher = "answerChartSwitcher"
+            TransformTableVizData = "TransformTableVizData"
     }
     /**
         * The different visual modes that the data sources panel within

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thoughtspot/visual-embed-sdk",
-    "version": "1.37.1-spotter-embed",
+    "version": "1.38.0-alpha.1",
     "description": "ThoughtSpot Embed SDK",
     "module": "lib/src/index.js",
     "main": "dist/tsembed.js",
@@ -57,7 +57,7 @@
         "test": "npm run test-sdk",
         "posttest": "cat ./coverage/sdk/lcov.info | coveralls",
         "is-publish-allowed": "node scripts/is-publish-allowed.js",
-        "prepublishOnly": "npm run is-publish-allowed && npm run tsc && npm run bundle-dts-file && npm run bundle-dts && npm run bundle-dts-react && npm run bundle-dts-react-full && npm run build",
+        "prepublishOnly": "npm run is-publish-allowed && npm run test && npm run tsc && npm run bundle-dts-file && npm run bundle-dts && npm run bundle-dts-react && npm run bundle-dts-react-full && npm run build",
         "check-size": "npm run build && size-limit",
         "publish-dev": "npm publish --tag dev",
         "publish-prod": "npm publish --tag latest",

package/src/embed/app.spec.ts

@@ -4,6 +4,8 @@ import {
     DataPanelCustomColumnGroupsAccordionState,
     Page,
     HomePageSearchBarMode,
+    PrimaryNavbarVersion,
+    HomePage,
 } from './app';
 import { init } from '../index';
 import {
@@ -528,32 +530,54 @@ describe('App embed tests', () => {
         });
     });
 
-    test('Should add navigationVersion=v3 when modularHomeExperienceV3 is true to the iframe src', async () => {
+    test('Should add navigationVersion=v3 when primaryNavbarVersion is Sliding to the iframe src', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
-            modularHomeExperienceV3: true,
+            discoveryExperience: {
+                primaryNavbarVersion: PrimaryNavbarVersion.Sliding,
+                homePage: HomePage.Modular,
+            },
         } as AppViewConfig);
 
         appEmbed.render();
         await executeAfterWait(() => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
-                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=false&navigationVersion=v3${defaultParams}${defaultParamsPost}#/home`,
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=true&navigationVersion=v3${defaultParams}${defaultParamsPost}#/home`,
             );
         });
     });
 
-    test('Should not add navigationVersion when modularHomeExperienceV3 is false to the iframe src', async () => {
+    test('Should not add navigationVersion=v3 when primaryNavbarVersion is not added to the iframe src', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
-            modularHomeExperienceV3: false,
+            discoveryExperience: {
+                homePage: HomePage.Modular,
+            },
         } as AppViewConfig);
 
         appEmbed.render();
         await executeAfterWait(() => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
-                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=false${defaultParams}${defaultParamsPost}#/home`,
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=true${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should add navigationVersion=v3 & modularHomeExperience=false when primaryNavbarVersion is Sliding to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            discoveryExperience: {
+                primaryNavbarVersion: PrimaryNavbarVersion.Sliding,
+            },
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=false&navigationVersion=v3${defaultParams}${defaultParamsPost}#/home`,
             );
         });
     });

package/src/embed/app.ts

@@ -83,6 +83,47 @@ export enum HomePageSearchBarMode {
     AI_ANSWER = 'aiAnswer',
     NONE = 'none'
 }
+
+/**
+ * Define the version of the primary navbar
+ * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+ */
+export enum PrimaryNavbarVersion {
+    /**
+     * Sliding (v3) introduces a new left-side navigation hub featuring a tab switcher,
+     * along with updates to the top navigation bar.
+     * It serves as the foundational version of the PrimaryNavBar.
+     */
+    Sliding = 'v3',
+}
+
+/**
+ * Define the version of the home page
+ * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+ */
+export enum HomePage {
+    /**
+     * Modular (v2) introduces the updated Modular Home Experience.
+     * It serves as the foundational version of the home page.
+     */
+    Modular = 'v2',
+}
+
+/**
+ * Define the discovery experience
+ * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
+ */
+export interface DiscoveryExperience {
+    /**
+     * primaryNavbarVersion determines the version of the navigation version.
+     */
+    primaryNavbarVersion?: PrimaryNavbarVersion;
+    /**
+     * homePage determines the version of the home page.
+     */
+    homePage?: HomePage;
+}
+
 /**
  * The view configuration for full app embedding.
  * @group Embed components
@@ -390,7 +431,7 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      */
     modularHomeExperience?: boolean;
     /**
-     * Flag to control new navigation v3 home experience.
+     * To configure the top-left navigation and home page experience
      *
      * @default false
      * @version SDK: 1.39.0 | Thoughtspot: 10.10.0.cl
@@ -398,11 +439,14 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      * ```js
      * const embed = new AppEmbed('#tsEmbed', {
      *    ... // other options
-     *    modularHomeExperienceV3 : true,
+     *    discoveryExperience : {
+     *      primaryNavbarVersion: PrimaryNavbarVersion.Sliding,
+     *      homePage: HompePage.Modular,
+     *    },
      * })
      * ```
      */
-    modularHomeExperienceV3?: boolean;
+    discoveryExperience?: DiscoveryExperience;
     /**
      * Boolean to control if Liveboard header is sticky or not.
      * @example
@@ -587,7 +631,6 @@ export class AppEmbed extends V1Embed {
             showLiveboardDescription = true,
             hideHomepageLeftNav = false,
             modularHomeExperience = false,
-            modularHomeExperienceV3 = false,
             isLiveboardHeaderSticky = true,
             enableAskSage,
             collapseSearchBarInitially = false,
@@ -604,6 +647,7 @@ export class AppEmbed extends V1Embed {
             homePageSearchBarMode,
             isUnifiedSearchExperienceEnabled = true,
             enablePendoHelp = true,
+            discoveryExperience,
         } = this.viewConfig;
 
         let params = {};
@@ -624,10 +668,6 @@ export class AppEmbed extends V1Embed {
 
         params = this.getBaseQueryParams(params);
 
-        if (modularHomeExperienceV3) {
-            params[Param.NavigationVersion] = 'v3';
-        }
-
         if (hideObjectSearch) {
             params[Param.HideObjectSearch] = !!hideObjectSearch;
         }
@@ -700,6 +740,19 @@ export class AppEmbed extends V1Embed {
             params[Param.DataPanelCustomGroupsAccordionInitialState] = DataPanelCustomColumnGroupsAccordionState.EXPAND_ALL;
         }
 
+        if (discoveryExperience) {
+            // primaryNavbarVersion v3 will enabled the new left navigation
+            if (discoveryExperience.primaryNavbarVersion === PrimaryNavbarVersion.Sliding) {
+                params[Param.NavigationVersion] = discoveryExperience.primaryNavbarVersion;
+            }
+
+            // homePage v2 will enable the modular home page
+            // and it will override the modularHomeExperience value
+            if (discoveryExperience.homePage === HomePage.Modular) {
+                params[Param.ModularHomeExperienceEnabled] = true;
+            }
+        }
+
         const queryParams = getQueryParamString(params, true);
 
         return queryParams;
@@ -735,7 +788,7 @@ export class AppEmbed extends V1Embed {
     };
 
     private setIframeHeightForNonEmbedLiveboard = (data: MessagePayload) => {
-        const { height: frameHeight, ...restParams } = this.viewConfig.frameParams || {};
+        const { height: frameHeight } = this.viewConfig.frameParams || {};
 
         const liveboardRelatedRoutes = [
             '/pinboard/',

package/src/embed/base.ts

@@ -137,6 +137,15 @@ export const prefetch = (
                     iFrame.style.width = '0';
                     iFrame.style.height = '0';
                     iFrame.style.border = '0';
+
+                    // Make it 'fixed' to keep it in a different stacking context.
+                    //   This should solve the focus behaviours inside the iframe from
+                    //   interfering with main body.
+                    iFrame.style.position = 'fixed';
+                    // Push it out of viewport.
+                    iFrame.style.top = '100vh';
+                    iFrame.style.left = '100vw';
+
                     iFrame.classList.add('prefetchIframe');
                     iFrame.classList.add(`prefetchIframeNum-${index}`);
                     document.body.appendChild(iFrame);