@thoughtspot/visual-embed-sdk 1.24.0-dev → 1.24.0-preRender.0

package/dist/tsembed-react.js

@@ -361,6 +361,24 @@
 	    return typeof domSelector === 'string' ? document.querySelector(domSelector) : domSelector;
 	}
 	const deepMerge = (target, source) => merge(target, source);
+	/**
+	 *
+	 * @param obj
+	 */
+	function removeTypename(obj) {
+	    if (!obj || typeof obj !== 'object')
+	        return obj;
+	    // eslint-disable-next-line no-restricted-syntax
+	    for (const key in obj) {
+	        if (key === '__typename') {
+	            delete obj[key];
+	        }
+	        else if (typeof obj[key] === 'object') {
+	            removeTypename(obj[key]);
+	        }
+	    }
+	    return obj;
+	}
 	const setStyleProperties = (element, styleProperties) => {
 	    if (!element || !styleProperties)
 	        return;
@@ -374,6 +392,11 @@
 	    styleProperties.forEach((styleProperty) => {
 	        element.style.removeProperty(styleProperty);
 	    });
+	};
+	const getOperationNameFromQuery = (query) => {
+	    const regex = /(?:query|mutation)\s+(\w+)/;
+	    const matches = query.match(regex);
+	    return matches === null || matches === void 0 ? void 0 : matches[1];
 	};
 
 	/**
@@ -626,27 +649,27 @@
 	    /**
 	     * Search bar
 	     */
-	    HomepageModule["Search"] = "search";
+	    HomepageModule["Search"] = "SEARCH";
 	    /**
 	     * kPI watchlist module
 	     */
-	    HomepageModule["Watchlist"] = "watchlist";
+	    HomepageModule["Watchlist"] = "WATCHLIST";
 	    /**
 	     * favorite objects
 	     */
-	    HomepageModule["Favorite"] = "favorite";
+	    HomepageModule["Favorite"] = "FAVORITE";
 	    /**
 	     * List of answers and liveboards
 	     */
-	    HomepageModule["MyLibrary"] = "mylibrary";
+	    HomepageModule["MyLibrary"] = "MY_LIBRARY";
 	    /**
 	     * Trending list
 	     */
-	    HomepageModule["Trending"] = "trending";
+	    HomepageModule["Trending"] = "TRENDING";
 	    /**
 	     * Learning videos
 	     */
-	    HomepageModule["Learning"] = "learning";
+	    HomepageModule["Learning"] = "LEARNING";
 	})(exports.HomepageModule || (exports.HomepageModule = {}));
 	(function (EmbedEvent) {
 	    /**
@@ -2719,12 +2742,6 @@
 	     */
 	    Action["PersonalisedViewsDropdown"] = "personalisedViewsDropdown";
 	})(exports.Action || (exports.Action = {}));
-	// eslint-disable-next-line no-shadow
-	var OperationType;
-	(function (OperationType) {
-	    OperationType["GetChartWithData"] = "GetChartWithData";
-	    OperationType["GetTableWithHeadlineData"] = "GetTableWithHeadlineData";
-	})(OperationType || (OperationType = {}));
 	var PrefetchFeatures;
 	(function (PrefetchFeatures) {
 	    PrefetchFeatures["FullApp"] = "FullApp";
@@ -8840,6 +8857,7 @@
 	 * @param sessionInfo
 	 */
 	function initMixpanel(sessionInfo) {
+	    var _a;
 	    if (!sessionInfo || !sessionInfo.mixpanelToken) {
 	        return;
 	    }
@@ -8857,6 +8875,7 @@
 	                clusterId: sessionInfo.clusterId,
 	                clusterName: sessionInfo.clusterName,
 	                releaseVersion: sessionInfo.releaseVersion,
+	                hostAppUrl: ((_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.host) || '',
 	            });
 	            isMixpanelInitialized = true;
 	            emptyQueue();
@@ -10118,58 +10137,351 @@
 
 	/**
 	 *
-	 * @param session
-	 * @param query
-	 * @param operation
+	 * @param root0
+	 * @param root0.query
+	 * @param root0.variables
+	 * @param root0.thoughtSpotHost
+	 * @param root0.isCompositeQuery
+	 */
+	async function graphqlQuery({ query, variables, thoughtSpotHost, isCompositeQuery = false, }) {
+	    const operationName = getOperationNameFromQuery(query);
+	    try {
+	        const response = await fetch(`${thoughtSpotHost}/prism/?op=${operationName}`, {
+	            method: 'POST',
+	            headers: {
+	                'content-type': 'application/json;charset=UTF-8',
+	                'x-requested-by': 'ThoughtSpot',
+	                accept: '*/*',
+	                'accept-language': 'en-us',
+	            },
+	            body: JSON.stringify({
+	                operationName,
+	                query,
+	                variables,
+	            }),
+	            credentials: 'include',
+	        });
+	        const result = await response.json();
+	        const dataValues = Object.values(result.data);
+	        return (isCompositeQuery) ? result.data : dataValues[0];
+	    }
+	    catch (error) {
+	        return error;
+	    }
+	}
+
+	const getSourceDetailQuery = `
+    query GetSourceDetail($ids: [GUID!]!) {
+        getSourceDetailById(ids: $ids, type: LOGICAL_TABLE) {
+        id
+        name
+        description
+        authorName
+        authorDisplayName
+        isExternal
+        type
+        created
+        modified
+        columns {
+            id
+            name
+            author
+            authorDisplayName
+            description
+            dataType
+            type
+            modified
+            ownerName
+            owner
+            dataRecency
+            sources {
+            tableId
+            tableName
+            columnId
+            columnName
+            __typename
+            }
+            synonyms
+            cohortAnswerId
+            __typename
+        }
+        relationships
+        destinationRelationships
+        dataSourceId
+        __typename
+        }
+    }  
+`;
+	const sourceDetailCache = new Map();
+	/**
+	 *
 	 * @param thoughtSpotHost
+	 * @param sourceId
 	 */
-	function getAnswerServiceInstance(session, query, operation, thoughtSpotHost) {
-	    let variable;
-	    const fetchQuery = async (variables) => {
-	        try {
-	            const response = await fetch(`${thoughtSpotHost}/prism/?op=${operation}`, {
-	                method: 'POST',
-	                headers: {
-	                    'content-type': 'application/json;charset=UTF-8',
-	                    'x-requested-by': 'ThoughtSpot',
-	                    accept: '*/*',
-	                    'accept-language': 'en-us',
-	                },
-	                body: JSON.stringify({
-	                    operationName: operation,
-	                    query,
-	                    variables,
-	                }),
-	                credentials: 'include',
-	            });
-	            const result = await response.json();
-	            return result.data;
+	async function getSourceDetail(thoughtSpotHost, sourceId) {
+	    if (sourceDetailCache.has(sourceId)) {
+	        return sourceDetailCache.get(sourceId);
+	    }
+	    const details = await graphqlQuery({
+	        query: getSourceDetailQuery,
+	        variables: {
+	            ids: [sourceId],
+	        },
+	        thoughtSpotHost,
+	    });
+	    const souceDetails = details[0];
+	    sourceDetailCache.set(sourceId, souceDetails);
+	    return souceDetails;
+	}
+
+	const bachSessionId = `
+id {
+    sessionId
+    genNo
+    acSession {
+        sessionId
+        genNo
+    }
+}
+`;
+	const getUnaggregatedAnswerSession = `
+mutation GetUnAggregatedAnswerSession($session: BachSessionIdInput!, $columns: [UserPointSelectionInput!]!) {
+    Answer__getUnaggregatedAnswer(session: $session, columns: $columns) {
+        ${bachSessionId}
+        answer {
+            visualizations {
+                ... on TableViz {
+                    columns {
+                        column {
+                            id
+                            name
+                            referencedColumns {
+                                guid
+                                displayName
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}  
+`;
+	const removeColumns = `
+mutation RemoveColumns($session: BachSessionIdInput!, $logicalColumnIds: [GUID!], $columnIds: [GUID!]) {
+    Answer__removeColumns(
+        session: $session
+        logicalColumnIds: $logicalColumnIds
+        columnIds: $columnIds
+        ) {
+            ${bachSessionId}
+    }
+}
+    `;
+	const addColumns = `
+    mutation AddColumns($session: BachSessionIdInput!, $columns: [AnswerColumnInfo!]!) {
+        Answer__addColumn(session: $session, columns: $columns) {
+            ${bachSessionId}
+        }
+    }
+    `;
+	const getAnswerData = `
+    query GetTableWithHeadlineData($session: BachSessionIdInput!, $deadline: Int!, $dataPaginationParams: DataPaginationParamsInput!) {
+        getAnswer(session: $session) {
+            ${bachSessionId}
+            answer {
+                id
+                visualizations {
+                    id
+                    ... on TableViz {
+                        columns {
+                            column {
+                                id
+                                name
+                                type
+                                aggregationType
+                                dataType
+                            }
+                        }
+                        data(deadline: $deadline, pagination: $dataPaginationParams)
+                    }          
+                }
+            }
+        }
+    }
+`;
+
+	// eslint-disable-next-line no-shadow
+	var OperationType;
+	(function (OperationType) {
+	    OperationType["GetChartWithData"] = "GetChartWithData";
+	    OperationType["GetTableWithHeadlineData"] = "GetTableWithHeadlineData";
+	})(OperationType || (OperationType = {}));
+	/**
+	 * Class representing the answer service provided with the
+	 * custom action payload. This service could be used to run
+	 * graphql queries in the context of the answer on which the
+	 * custom action was triggered.
+	 *
+	 * @example
+	 * ```js
+	 *  embed.on(EmbedEvent.CustomAction, e => {
+	 *     const underlying = await e.answerService.getUnderlyingDataForPoint([
+	 *       'col name 1'
+	 *     ]);
+	 *     const data = await underlying.fetchData(0, 100);
+	 *  })
+	 * ```
+	 * @version
+	 * ThoughtSpot: 9.9.0.cl / SDK: 1.25.0
+	 */
+	class AnswerService {
+	    constructor(session, answer, thoughtSpotHost, selectedPoints) {
+	        this.session = session;
+	        this.answer = answer;
+	        this.thoughtSpotHost = thoughtSpotHost;
+	        this.selectedPoints = selectedPoints;
+	        this.session = removeTypename(session);
+	    }
+	    async getSourceDetail() {
+	        const sourceId = this.answer.sources[0].header.guid;
+	        return getSourceDetail(this.thoughtSpotHost, sourceId);
+	    }
+	    async removeColumns(columnIds) {
+	        return this.executeQuery(removeColumns, {
+	            logicalColumnIds: columnIds,
+	        });
+	    }
+	    async addColumns(columnIds) {
+	        return this.executeQuery(addColumns, {
+	            columns: columnIds.map((colId) => ({ logicalColumnId: colId })),
+	        });
+	    }
+	    async fetchData(offset = 0, size = 1000) {
+	        const { answer } = await this.executeQuery(getAnswerData, {
+	            deadline: 0,
+	            dataPaginationParams: {
+	                isClientPaginated: true,
+	                offset,
+	                size,
+	            },
+	        });
+	        const { columns, data } = answer.visualizations[0];
+	        return {
+	            columns,
+	            data,
+	        };
+	    }
+	    /**
+	     *
+	     * @param userLocale
+	     * @param omitInfo Omit the download Info on top of the CSV
+	     * @returns Response
+	     */
+	    async fetchCSVBlob(userLocale = 'en-us', omitInfo = false) {
+	        if (omitInfo) {
+	            console.warn('omitInfo not supported yet.');
 	        }
-	        catch (error) {
-	            return error;
+	        const fetchUrl = `${this.thoughtSpotHost}/prism/download/answer/csv?sessionId=${this.session.sessionId}&genNo=${this.session.genNo}&userLocale=${userLocale}&exportFileName=data&omitInfo=${omitInfo}`;
+	        return fetch(fetchUrl, {
+	            credentials: 'include',
+	        });
+	    }
+	    async getUnderlyingDataForPoint(outputColumnNames, selectedPoints) {
+	        if (!selectedPoints && !this.selectedPoints) {
+	            throw new Error('Needs to be triggered in context of a point');
 	        }
-	    };
-	    const fetchData = (offset, batchSize) => {
-	        if (operation === OperationType.GetChartWithData) {
-	            variable = { batchSize, offset: offset * batchSize };
+	        if (!selectedPoints) {
+	            selectedPoints = getSelectedPointsForUnderlyingDataQuery(this.selectedPoints);
+	        }
+	        const sourceDetail = await this.getSourceDetail();
+	        const ouputColumnGuids = getGuidsFromColumnNames(sourceDetail, outputColumnNames);
+	        const unAggAnswer = await graphqlQuery({
+	            query: getUnaggregatedAnswerSession,
+	            variables: {
+	                session: this.session,
+	                columns: selectedPoints,
+	            },
+	            thoughtSpotHost: this.thoughtSpotHost,
+	        });
+	        const unaggAnswerSession = new AnswerService(unAggAnswer.id, unAggAnswer.answer, this.thoughtSpotHost);
+	        const currentColumns = new Set(unAggAnswer.answer.visualizations[0].columns
+	            .map((c) => c.column.referencedColumns[0].guid));
+	        const columnsToAdd = [...ouputColumnGuids].filter((col) => !currentColumns.has(col));
+	        if (columnsToAdd.length) {
+	            await unaggAnswerSession.addColumns(columnsToAdd);
+	        }
+	        const columnsToRemove = [...currentColumns].filter((col) => !ouputColumnGuids.has(col));
+	        if (columnsToRemove.length) {
+	            await unaggAnswerSession.removeColumns(columnsToRemove);
+	        }
+	        return unaggAnswerSession;
+	    }
+	    async executeQuery(query, variables) {
+	        const data = await graphqlQuery({
+	            query,
+	            variables: {
+	                session: this.session,
+	                ...variables,
+	            },
+	            thoughtSpotHost: this.thoughtSpotHost,
+	            isCompositeQuery: false,
+	        });
+	        this.session = deepMerge(this.session, (data === null || data === void 0 ? void 0 : data.id) || {});
+	        return data;
+	    }
+	    getSession() {
+	        return this.session;
+	    }
+	}
+	/**
+	 *
+	 * @param sourceDetail
+	 * @param colNames
+	 */
+	function getGuidsFromColumnNames(sourceDetail, colNames) {
+	    const cols = sourceDetail.columns.reduce((colSet, col) => {
+	        colSet[col.name] = col;
+	        return colSet;
+	    }, {});
+	    return new Set(colNames.map((colName) => {
+	        const col = cols[colName];
+	        return col.id;
+	    }));
+	}
+	/**
+	 *
+	 * @param selectedPoints
+	 */
+	function getSelectedPointsForUnderlyingDataQuery(selectedPoints) {
+	    const underlyingDataPoint = [];
+	    /**
+	     *
+	     * @param colVal
+	     */
+	    function addPointFromColVal(colVal) {
+	        const dataType = colVal.column.dataType;
+	        const id = colVal.column.id;
+	        let dataValue;
+	        if (dataType === 'DATE') {
+	            dataValue = [{
+	                    epochRange: {
+	                        startEpoch: colVal.value,
+	                    },
+	                }];
 	        }
 	        else {
-	            variable = {
-	                dataPaginationParams: {
-	                    isClientPaginated: true,
-	                    offset: offset * batchSize,
-	                    size: batchSize,
-	                },
-	            };
+	            dataValue = [{ value: colVal.value }];
 	        }
-	        return fetchQuery({
-	            session,
-	            ...variable,
+	        underlyingDataPoint.push({
+	            columnId: colVal.column.id,
+	            dataValue,
 	        });
-	    };
-	    return {
-	        fetchData,
-	    };
+	    }
+	    selectedPoints.forEach((p) => {
+	        p.selectedAttributes.forEach(addPointFromColVal);
+	    });
+	    return underlyingDataPoint;
 	}
 
 	/**
@@ -10178,16 +10490,12 @@
 	 * @param thoughtSpotHost
 	 */
 	function processCustomAction(e, thoughtSpotHost) {
-	    var _a;
-	    if ([OperationType.GetChartWithData, OperationType.GetTableWithHeadlineData].includes((_a = e.data) === null || _a === void 0 ? void 0 : _a.operation)) {
-	        const { session, query, operation } = e.data;
-	        const answerService = getAnswerServiceInstance(session, query, operation, thoughtSpotHost);
-	        return {
-	            ...e,
-	            answerService,
-	        };
-	    }
-	    return e;
+	    const { session, embedAnswerData, contextMenuPoints } = e.data;
+	    const answerService = new AnswerService(session, embedAnswerData, thoughtSpotHost, contextMenuPoints === null || contextMenuPoints === void 0 ? void 0 : contextMenuPoints.selectedPoints);
+	    return {
+	        ...e,
+	        answerService,
+	    };
 	}
 	/**
 	 *
@@ -10332,7 +10640,7 @@
 	    });
 	}
 
-	var name="@thoughtspot/visual-embed-sdk";var version="1.24.0-dev";var description="ThoughtSpot Embed SDK";var module="lib/src/index.js";var main="dist/tsembed.js";var types="lib/src/index.d.ts";var files=["dist/**","lib/**","src/**","cjs/**"];var exports$1={".":{"import":"./lib/src/index.js",require:"./cjs/src/index.js",types:"./lib/src/index.d.ts"},"./react":{"import":"./lib/src/react/all-types-export.js",require:"./cjs/src/react/all-types-export.js",types:"./lib/src/react/all-types-export.d.ts"},"./lib/src/react":{"import":"./lib/src/react/all-types-export.js",require:"./cjs/src/react/all-types-export.js",types:"./lib/src/react/all-types-export.d.ts"}};var typesVersions={"*":{react:["./lib/src/react/all-types-export.d.ts"]}};var scripts={lint:"eslint 'src/**'","lint:fix":"eslint 'src/**/*.*' --fix",tsc:"tsc -p . --incremental false; tsc -p . --incremental false --module commonjs --outDir cjs",start:"gatsby develop","build:gatsby":"npm run clean:gatsby && gatsby build --prefix-paths","build:gatsby:noprefix":"npm run clean:gatsby && gatsby build","serve:gatsby":"gatsby serve","clean:gatsby":"gatsby clean","build-and-publish":"npm run build:gatsby && npm run publish","bundle-dts-file":"dts-bundle --name @thoughtspot/visual-embed-sdk --out visual-embed-sdk.d.ts --main lib/src/index.d.ts","bundle-dts":"dts-bundle --name ../../dist/visual-embed-sdk --main lib/src/index.d.ts --outputAsModuleFolder=true","bundle-dts-react":"dts-bundle --name ../../../dist/visual-embed-sdk-react --main lib/src/react/index.d.ts --outputAsModuleFolder=true","bundle-dts-react-full":"dts-bundle --name ../../../dist/visual-embed-sdk-react-full --main lib/src/react/all-types-export.d.ts --outputAsModuleFolder=true",build:"rollup -c",watch:"rollup -cw","docs-cmd":"node scripts/gatsby-commands.js",docgen:"typedoc --tsconfig tsconfig.json --theme typedoc-theme","test-sdk":"jest -c jest.config.sdk.js --runInBand","test-docs":"jest -c jest.config.docs.js",test:"npm run test-sdk && npm run test-docs",posttest:"cat ./coverage/sdk/lcov.info | coveralls","is-publish-allowed":"node scripts/is-publish-allowed.js",prepublishOnly:"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"};var peerDependencies={react:"> 16.8.0","react-dom":"> 16.8.0"};var dependencies={algoliasearch:"^4.10.5",classnames:"^2.3.1",dompurify:"^2.3.4","eslint-plugin-comment-length":"^0.9.2","eslint-plugin-jsdoc":"^40.1.0",eventemitter3:"^4.0.7","gatsby-plugin-vercel":"^1.0.3","html-react-parser":"^1.4.12",lodash:"^4.17.21","mixpanel-browser":"^2.45.0","ts-deepmerge":"^6.0.2",tslib:"^2.5.3","use-deep-compare-effect":"^1.8.1"};var devDependencies={"@mdx-js/mdx":"^1.6.22","@mdx-js/react":"^1.6.22","@react-icons/all-files":"^4.1.0","@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-json":"^4.1.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^5.0.2","@size-limit/preset-big-lib":"^8.2.6","@testing-library/dom":"^7.31.0","@testing-library/jest-dom":"^5.14.1","@testing-library/react":"^11.2.7","@testing-library/user-event":"^13.1.8","@types/jest":"^22.2.3","@types/mixpanel-browser":"^2.35.6","@types/react-test-renderer":"^17.0.1","@typescript-eslint/eslint-plugin":"^4.6.0","@typescript-eslint/parser":"^4.6.0",asciidoctor:"^2.2.1","babel-jest":"^26.6.3","babel-preset-gatsby":"^1.10.0","command-line-args":"^5.1.1",coveralls:"^3.1.0","current-git-branch":"^1.1.0","dts-bundle":"^0.7.3",eslint:"^7.12.1","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.15.0","eslint-import-resolver-typescript":"^2.3.0","eslint-plugin-import":"^2.22.1","eslint-plugin-prettier":"^3.1.4","eslint-plugin-react-hooks":"^4.2.0","fs-extra":"^10.0.0",gatsby:"3.13.1","gatsby-plugin-algolia":"^0.22.2","gatsby-plugin-catch-links":"^3.1.0","gatsby-plugin-env-variables":"^2.1.0","gatsby-plugin-intl":"^0.3.3","gatsby-plugin-manifest":"^3.2.0","gatsby-plugin-output":"^0.1.3","gatsby-plugin-sass":"6.7.0","gatsby-plugin-sitemap":"^4.10.0","gatsby-source-filesystem":"3.1.0","gatsby-transformer-asciidoc":"2.1.0","gatsby-transformer-rehype":"2.0.0","gh-pages":"^3.1.0","highlight.js":"^10.6.0","html-to-text":"^8.0.0","identity-obj-proxy":"^3.0.0","istanbul-merge":"^1.1.1",jest:"^26.6.3","jest-puppeteer":"^4.4.0",jsdom:"^17.0.0","node-sass":"^8.0.0",prettier:"2.1.2",puppeteer:"^7.0.1",react:"^16.14.0","react-dom":"^16.14.0","react-resizable":"^1.11.0","react-resize-detector":"^6.6.0","react-test-renderer":"^17.0.2","react-use-flexsearch":"^0.1.1",rollup:"2.30.0","rollup-plugin-typescript2":"0.27.3","ts-jest":"^26.5.5","ts-loader":"8.0.4",typedoc:"0.21.6","typedoc-plugin-toc-group":"thoughtspot/typedoc-plugin-toc-group",typescript:"^4.9.4","url-search-params-polyfill":"^8.1.0",util:"^0.12.4"};var author="ThoughtSpot";var email="support@thoughtspot.com";var license="ThoughtSpot Development Tools End User License Agreement";var directories={lib:"lib"};var repository={type:"git",url:"git+https://github.com/thoughtspot/visual-embed-sdk.git"};var publishConfig={registry:"https://registry.npmjs.org"};var keywords=["thoughtspot","everywhere","embed","sdk","analytics"];var bugs={url:"https://github.com/thoughtspot/visual-embed-sdk/issues"};var homepage="https://github.com/thoughtspot/visual-embed-sdk#readme";var globals={window:{}};var pkgInfo = {name:name,version:version,description:description,module:module,main:main,types:types,files:files,exports:exports$1,typesVersions:typesVersions,"size-limit":[{path:"dist/tsembed.js",limit:"40 kB"}],scripts:scripts,peerDependencies:peerDependencies,dependencies:dependencies,devDependencies:devDependencies,author:author,email:email,license:license,directories:directories,repository:repository,publishConfig:publishConfig,keywords:keywords,bugs:bugs,homepage:homepage,globals:globals};
+	var name="@thoughtspot/visual-embed-sdk";var version="1.24.0-preRender.0";var description="ThoughtSpot Embed SDK";var module="lib/src/index.js";var main="dist/tsembed.js";var types="lib/src/index.d.ts";var files=["dist/**","lib/**","src/**","cjs/**"];var exports$1={".":{"import":"./lib/src/index.js",require:"./cjs/src/index.js",types:"./lib/src/index.d.ts"},"./react":{"import":"./lib/src/react/all-types-export.js",require:"./cjs/src/react/all-types-export.js",types:"./lib/src/react/all-types-export.d.ts"},"./lib/src/react":{"import":"./lib/src/react/all-types-export.js",require:"./cjs/src/react/all-types-export.js",types:"./lib/src/react/all-types-export.d.ts"}};var typesVersions={"*":{react:["./lib/src/react/all-types-export.d.ts"]}};var scripts={lint:"eslint 'src/**'","lint:fix":"eslint 'src/**/*.*' --fix",tsc:"tsc -p . --incremental false; tsc -p . --incremental false --module commonjs --outDir cjs",start:"gatsby develop","build:gatsby":"npm run clean:gatsby && gatsby build --prefix-paths","build:gatsby:noprefix":"npm run clean:gatsby && gatsby build","serve:gatsby":"gatsby serve","clean:gatsby":"gatsby clean","build-and-publish":"npm run build:gatsby && npm run publish","bundle-dts-file":"dts-bundle --name @thoughtspot/visual-embed-sdk --out visual-embed-sdk.d.ts --main lib/src/index.d.ts","bundle-dts":"dts-bundle --name ../../dist/visual-embed-sdk --main lib/src/index.d.ts --outputAsModuleFolder=true","bundle-dts-react":"dts-bundle --name ../../../dist/visual-embed-sdk-react --main lib/src/react/index.d.ts --outputAsModuleFolder=true","bundle-dts-react-full":"dts-bundle --name ../../../dist/visual-embed-sdk-react-full --main lib/src/react/all-types-export.d.ts --outputAsModuleFolder=true",build:"rollup -c",watch:"rollup -cw","docs-cmd":"node scripts/gatsby-commands.js",docgen:"typedoc --tsconfig tsconfig.json --theme typedoc-theme","test-sdk":"jest -c jest.config.sdk.js --runInBand","test-docs":"jest -c jest.config.docs.js",test:"npm run test-sdk && npm run test-docs",posttest:"cat ./coverage/sdk/lcov.info | coveralls","is-publish-allowed":"node scripts/is-publish-allowed.js",prepublishOnly:"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"};var peerDependencies={react:"> 16.8.0","react-dom":"> 16.8.0"};var dependencies={algoliasearch:"^4.10.5",classnames:"^2.3.1",dompurify:"^2.3.4","eslint-plugin-comment-length":"^0.9.2","eslint-plugin-jsdoc":"^40.1.0",eventemitter3:"^4.0.7","gatsby-plugin-vercel":"^1.0.3","html-react-parser":"^1.4.12",lodash:"^4.17.21","mixpanel-browser":"^2.45.0","ts-deepmerge":"^6.0.2",tslib:"^2.5.3","use-deep-compare-effect":"^1.8.1"};var devDependencies={"@mdx-js/mdx":"^1.6.22","@mdx-js/react":"^1.6.22","@react-icons/all-files":"^4.1.0","@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-json":"^4.1.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^5.0.2","@size-limit/preset-big-lib":"^8.2.6","@testing-library/dom":"^7.31.0","@testing-library/jest-dom":"^5.14.1","@testing-library/react":"^11.2.7","@testing-library/user-event":"^13.1.8","@types/jest":"^22.2.3","@types/mixpanel-browser":"^2.35.6","@types/react-test-renderer":"^17.0.1","@typescript-eslint/eslint-plugin":"^4.6.0","@typescript-eslint/parser":"^4.6.0",asciidoctor:"^2.2.1","babel-jest":"^26.6.3","babel-preset-gatsby":"^1.10.0","command-line-args":"^5.1.1",coveralls:"^3.1.0","current-git-branch":"^1.1.0","dts-bundle":"^0.7.3",eslint:"^7.12.1","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.15.0","eslint-import-resolver-typescript":"^2.3.0","eslint-plugin-import":"^2.22.1","eslint-plugin-prettier":"^3.1.4","eslint-plugin-react-hooks":"^4.2.0","fs-extra":"^10.0.0",gatsby:"3.13.1","gatsby-plugin-algolia":"^0.22.2","gatsby-plugin-catch-links":"^3.1.0","gatsby-plugin-env-variables":"^2.1.0","gatsby-plugin-intl":"^0.3.3","gatsby-plugin-manifest":"^3.2.0","gatsby-plugin-output":"^0.1.3","gatsby-plugin-sass":"6.7.0","gatsby-plugin-sitemap":"^4.10.0","gatsby-source-filesystem":"3.1.0","gatsby-transformer-asciidoc":"2.1.0","gatsby-transformer-rehype":"2.0.0","gh-pages":"^3.1.0","highlight.js":"^10.6.0","html-to-text":"^8.0.0","identity-obj-proxy":"^3.0.0","istanbul-merge":"^1.1.1",jest:"^26.6.3","jest-fetch-mock":"^3.0.3",jsdom:"^17.0.0","node-sass":"^8.0.0",prettier:"2.1.2",react:"^16.14.0","react-dom":"^16.14.0","react-resizable":"^1.11.0","react-resize-detector":"^6.6.0","react-test-renderer":"^17.0.2","react-use-flexsearch":"^0.1.1",rollup:"2.30.0","rollup-plugin-typescript2":"0.27.3","ts-jest":"^26.5.5","ts-loader":"8.0.4",typedoc:"0.21.6","typedoc-plugin-toc-group":"thoughtspot/typedoc-plugin-toc-group",typescript:"^4.9.4","url-search-params-polyfill":"^8.1.0",util:"^0.12.4"};var author="ThoughtSpot";var email="support@thoughtspot.com";var license="ThoughtSpot Development Tools End User License Agreement";var directories={lib:"lib"};var repository={type:"git",url:"git+https://github.com/thoughtspot/visual-embed-sdk.git"};var publishConfig={registry:"https://registry.npmjs.org"};var keywords=["thoughtspot","everywhere","embed","sdk","analytics"];var bugs={url:"https://github.com/thoughtspot/visual-embed-sdk/issues"};var homepage="https://github.com/thoughtspot/visual-embed-sdk#readme";var globals={window:{}};var pkgInfo = {name:name,version:version,description:description,module:module,main:main,types:types,files:files,exports:exports$1,typesVersions:typesVersions,"size-limit":[{path:"dist/tsembed.js",limit:"40 kB"}],scripts:scripts,peerDependencies:peerDependencies,dependencies:dependencies,devDependencies:devDependencies,author:author,email:email,license:license,directories:directories,repository:repository,publishConfig:publishConfig,keywords:keywords,bugs:bugs,homepage:homepage,globals:globals};
 
 	/**
 	 * Copyright (c) 2022
@@ -10364,6 +10672,7 @@
 	class TsEmbed {
 	    constructor(domSelector, viewConfig) {
 	        this.isAppInitialized = false;
+	        this.embedComponentType = 'TsEmbed';
 	        /**
 	         * Should we encode URL Query Params using base64 encoding which thoughtspot
 	         * will generate for embedding. This provides additional security to
@@ -10373,6 +10682,7 @@
 	         */
 	        this.shouldEncodeUrlQueryParams = false;
 	        this.defaultHiddenActions = [exports.Action.ReportError];
+	        this.subscribedListeners = {};
 	        /**
 	         * Send Custom style as part of payload of APP_INIT
 	         *
@@ -10395,6 +10705,7 @@
 	                        ? getRuntimeFilters(this.viewConfig.runtimeFilters)
 	                        : null,
 	                    hiddenHomepageModules: this.viewConfig.hiddenHomepageModules || [],
+	                    reorderedHomepageModules: this.viewConfig.reorderedHomepageModules || [],
 	                    hostConfig: this.embedConfig.hostConfig,
 	                    hiddenHomeLeftNavItems: ((_a = this.viewConfig) === null || _a === void 0 ? void 0 : _a.hiddenHomeLeftNavItems)
 	                        ? (_b = this.viewConfig) === null || _b === void 0 ? void 0 : _b.hiddenHomeLeftNavItems
@@ -10444,6 +10755,7 @@
 	        this.registerAppInit();
 	        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE, {
 	            ...viewConfig,
+	            embedComponentType: this.embedComponentType,
 	        });
 	    }
 	    /**
@@ -10512,23 +10824,36 @@
 	     * and executes the registered callbacks accordingly.
 	     */
 	    subscribeToEvents() {
-	        window.addEventListener('message', (event) => {
+	        const messageEventListener = (event) => {
 	            const eventType = this.getEventType(event);
 	            const eventPort = this.getEventPort(event);
 	            const eventData = this.formatEventData(event, eventType);
 	            if (event.source === this.iFrame.contentWindow) {
 	                this.executeCallbacks(eventType, processEventData(eventType, eventData, this.thoughtSpotHost, this.el), eventPort);
 	            }
-	        });
-	        window.addEventListener('online', (e) => {
+	        };
+	        window.addEventListener('message', messageEventListener);
+	        const onlineEventListener = (e) => {
 	            this.trigger(exports.HostEvent.Reload);
-	        });
-	        window.addEventListener('offline', (e) => {
+	        };
+	        window.addEventListener('online', onlineEventListener);
+	        const offlineEventListener = (e) => {
 	            const offlineWarning = 'Network not Detected. Embed is offline. Please reconnect and refresh';
 	            this.executeCallbacks(exports.EmbedEvent.Error, {
 	                offlineWarning,
 	            });
 	            console.warn(offlineWarning);
+	        };
+	        window.addEventListener('offline', offlineEventListener);
+	        this.subscribedListeners = {
+	            message: messageEventListener,
+	            online: onlineEventListener,
+	            offline: offlineEventListener,
+	        };
+	    }
+	    unsubscribeToEvents() {
+	        Object.keys(this.subscribedListeners).forEach((key) => {
+	            window.removeEventListener(key, this.subscribedListeners[key]);
 	        });
 	    }
 	    /**
@@ -10706,8 +11031,10 @@
 	     *
 	     * @param url
 	     * @param frameOptions
+	     * @param showPreRender
+	     * @param showPreRenderByDefault
 	     */
-	    async renderIFrame(url) {
+	    async renderIFrame(url, showPreRenderByDefault = false) {
 	        if (this.isError) {
 	            return null;
 	        }
@@ -10756,6 +11083,9 @@
 	                });
 	                if (this.isPreRendered) {
 	                    this.insertIntoDOMForPreRender(this.iFrame);
+	                    if (showPreRenderByDefault) {
+	                        this.showPreRender();
+	                    }
 	                }
 	                else {
 	                    this.insertIntoDOM(this.iFrame);
@@ -10794,11 +11124,10 @@
 	            throw new Error('Pre render id is required');
 	        }
 	        const preRenderIds = this.getPreRenderIds();
-	        const stalePreRenderWrapper = document.getElementById(preRenderIds.wrapper);
-	        if (stalePreRenderWrapper) {
-	            console.log('Found stale wrapper , removing');
-	            stalePreRenderWrapper.remove();
-	        }
+	        [preRenderIds.wrapper, preRenderIds.shield, preRenderIds.child]
+	            .map((id) => document.getElementById(id))
+	            .filter((element) => element)
+	            .forEach((existingElement) => existingElement.remove());
 	        const preRenderWrapper = document.createElement('div');
 	        preRenderWrapper.id = preRenderIds.wrapper;
 	        setStyleProperties(preRenderWrapper, { position: 'absolute', width: '100vw', height: '100vh' });
@@ -10813,7 +11142,7 @@
 	        this.preRenderChild = child;
 	        return preRenderWrapper;
 	    }
-	    isPreRenderAvailable() {
+	    connectPreRendered() {
 	        const preRenderIds = this.getPreRenderIds();
 	        this.preRenderWrapper = this.preRenderWrapper
 	            || document.getElementById(preRenderIds.wrapper);
@@ -10821,6 +11150,10 @@
 	            || document.getElementById(preRenderIds.shield);
 	        this.preRenderChild = this.preRenderChild
 	            || document.getElementById(preRenderIds.child);
+	        this.iFrame = this.preRenderChild;
+	        return this.isPreRenderAvailable();
+	    }
+	    isPreRenderAvailable() {
 	        return !!this.preRenderWrapper && !!this.preRenderShield
 	            && !!this.preRenderChild;
 	    }
@@ -10863,18 +11196,23 @@
 	            top: '0',
 	            left: '0',
 	        });
+	        this.unsubscribeToEvents();
 	    }
 	    showPreRender() {
 	        if (!this.isPreRenderAvailable()) {
-	            // if the Embed component is nor preRendered , Render it now and
-	            // show it (hide is defalt behaviour)
-	            console.log('No preRender found, creating new ');
-	            this.render();
-	            return;
+	            const isAvailable = this.connectPreRendered();
+	            if (!isAvailable) {
+	                // if the Embed component is nor preRendered , Render it now and
+	                // show it (hide is defalt behaviour)
+	                console.log('No preRender found, creating new ');
+	                this.preRender(true);
+	                return;
+	            }
 	        }
 	        this.syncPreRenderStyle();
 	        removeStyleProperties(this.preRenderWrapper, ['z-index', 'opacity', 'pointer-events']);
 	        setStyleProperties(this.preRenderShield, { zIndex: '-1' });
+	        this.subscribeToEvents();
 	    }
 	    syncPreRenderStyle() {
 	        if (!this.el) {
@@ -11102,7 +11440,7 @@
 	    /**
 	     * Creates the preRender shell
 	     */
-	    preRender() {
+	    preRender(showPreRenderByDefault = false) {
 	        this.isPreRendered = true;
 	        return this;
 	    }
@@ -11179,8 +11517,8 @@
 	     *
 	     * @param iframeSrc
 	     */
-	    renderV1Embed(iframeSrc) {
-	        return this.renderIFrame(iframeSrc);
+	    renderV1Embed(iframeSrc, showPreRenderByDefault = false) {
+	        return this.renderIFrame(iframeSrc, showPreRenderByDefault);
 	    }
 	    getRootIframeSrc() {
 	        const queryParams = this.getEmbedParams();
@@ -11226,6 +11564,7 @@
 	class SearchBarEmbed extends TsEmbed {
 	    constructor(domSelector, viewConfig) {
 	        super(domSelector);
+	        this.embedComponentType = 'SearchBarEmbed';
 	        this.viewConfig = viewConfig;
 	    }
 	    /**
@@ -11304,6 +11643,7 @@
 	    // eslint-disable-next-line no-useless-constructor
 	    constructor(domSelector, viewConfig) {
 	        super(domSelector, viewConfig);
+	        this.embedComponentType = 'SageEmbed';
 	    }
 	    /**
 	     * Constructs a map of parameters to be passed on to the
@@ -11355,12 +11695,18 @@
 	    /**
 	     * Render the embedded ThoughtSpot Sage
 	     *
+	     * @param showPreRenderByDefault
 	     * @returns {SageEmbed} Eureka/Sage embed
 	     */
-	    render() {
+	    render(showPreRenderByDefault = false) {
 	        super.render();
 	        const src = this.getIFrameSrc();
-	        this.renderV1Embed(src);
+	        this.renderV1Embed(src, showPreRenderByDefault);
+	        return this;
+	    }
+	    preRender(showPreRenderByDefault = false) {
+	        super.preRender(showPreRenderByDefault);
+	        this.render(showPreRenderByDefault);
 	        return this;
 	    }
 	}
@@ -11388,6 +11734,7 @@
 	class SearchEmbed extends TsEmbed {
 	    constructor(domSelector, viewConfig) {
 	        super(domSelector);
+	        this.embedComponentType = 'SearchEmbed';
 	        this.viewConfig = viewConfig;
 	    }
 	    /**
@@ -11468,12 +11815,14 @@
 	    }
 	    /**
 	     * Render the embedded ThoughtSpot search
+	     *
+	     * @param showPreRenderByDefault
 	     */
-	    render() {
+	    render(showPreRenderByDefault = false) {
 	        super.render();
 	        const { answerId } = this.viewConfig;
 	        const src = this.getIFrameSrc(answerId);
-	        this.renderIFrame(src);
+	        this.renderIFrame(src, showPreRenderByDefault);
 	        getAuthPromise().then(() => {
 	            if (checkReleaseVersionInBeta(getReleaseVersion(), getEmbedConfig().suppressSearchEmbedBetaWarning)) {
 	                alert(ERROR_MESSAGE.SEARCHEMBED_BETA_WRANING_MESSAGE);
@@ -11481,6 +11830,11 @@
 	        });
 	        return this;
 	    }
+	    preRender(showPreRenderByDefault = false) {
+	        super.preRender(showPreRenderByDefault);
+	        this.render(showPreRenderByDefault);
+	        return this;
+	    }
 	}
 
 	/**
@@ -11533,6 +11887,7 @@
 	    constructor(domSelector, viewConfig) {
 	        super(domSelector, viewConfig);
 	        this.defaultHeight = '100%';
+	        this.embedComponentType = 'AppEmbed';
 	        /**
 	         * Set the iframe height as per the computed height received
 	         * from the ThoughtSpot app.
@@ -11684,10 +12039,15 @@
 	     * @param renderOptions An object containing the page ID
 	     * to be embedded.
 	     */
-	    render() {
+	    render(showPreRenderByDefault = false) {
 	        super.render();
 	        const src = this.getIFrameSrc();
-	        this.renderV1Embed(src);
+	        this.renderV1Embed(src, showPreRenderByDefault);
+	        return this;
+	    }
+	    preRender(showPreRenderByDefault = false) {
+	        super.preRender(showPreRenderByDefault);
+	        this.render(showPreRenderByDefault);
 	        return this;
 	    }
 	}
@@ -11722,6 +12082,7 @@
 	    constructor(domSelector, viewConfig) {
 	        super(domSelector, viewConfig);
 	        this.defaultHeight = 500;
+	        this.embedComponentType = 'LiveboardEmbed';
 	        /**
 	         * Set the iframe height as per the computed height received
 	         * from the ThoughtSpot app.
@@ -11843,15 +12204,15 @@
 	     * @param renderOptions An object specifying the Liveboard ID,
 	     * visualization ID and the runtime filters.
 	     */
-	    render() {
+	    render(showPreRenderByDefault = false) {
 	        super.render();
 	        const src = this.getIFrameSrc();
-	        this.renderV1Embed(src);
+	        this.renderV1Embed(src, showPreRenderByDefault);
 	        return this;
 	    }
-	    preRender() {
-	        super.preRender();
-	        this.render();
+	    preRender(showPreRenderByDefault = false) {
+	        super.preRender(showPreRenderByDefault);
+	        this.render(showPreRenderByDefault);
 	        return this;
 	    }
 	    navigateToLiveboard(liveboardId, vizId, activeTabId) {
@@ -11896,9 +12257,7 @@
 	        const tsEmbed = new EmbedConstructor(ref.current, deepMerge({
 	            insertAsSibling: viewConfig.insertAsSibling,
 	            frameParams: {
-	                class: viewConfig.insertAsSibling
-	                    ? className || ''
-	                    : '',
+	                class: viewConfig.insertAsSibling ? className || '' : '',
 	            },
 	        }, viewConfig));
 	        Object.keys(listeners).forEach((eventName) => {
@@ -11926,9 +12285,7 @@
 	            }
 	        };
 	    }, [viewConfig, listeners]);
-	    return ((viewConfig.insertAsSibling)
-	        ? React__default['default'].createElement("span", { "data-testid": "tsEmbed", ref: ref, style: { position: 'absolute' } })
-	        : React__default['default'].createElement("div", { "data-testid": "tsEmbed", ref: ref, className: className }));
+	    return viewConfig.insertAsSibling ? (React__default['default'].createElement("span", { "data-testid": "tsEmbed", ref: ref, style: { position: 'absolute' } })) : (React__default['default'].createElement("div", { "data-testid": "tsEmbed", ref: ref, className: className }));
 	});
 	/**
 	 * React component for Search Embed.
@@ -11959,6 +12316,7 @@
 	 * ```
 	 */
 	const AppEmbed$1 = componentFactory(AppEmbed);
+	const PreRenderedAppEmbed = componentFactory(AppEmbed, true);
 	/**
 	 * React component for Liveboard embed.
 	 *
@@ -11976,6 +12334,8 @@
 	 */
 	const LiveboardEmbed$1 = componentFactory(LiveboardEmbed);
 	const PinboardEmbed = LiveboardEmbed$1;
+	const PreRenderedLiveboardEmbed = componentFactory(LiveboardEmbed, true);
+	const PreRenderedPinboardEmbed = PreRenderedLiveboardEmbed;
 	/**
 	 * React component for Search bar embed.
 	 *
@@ -11990,6 +12350,7 @@
 	 * ```
 	 */
 	const SearchBarEmbed$1 = componentFactory(SearchBarEmbed);
+	const PreRenderedSearchBarEmbed = componentFactory(SearchBarEmbed, true);
 	/**
 	 * React component for LLM based search Sage embed.
 	 *
@@ -12004,6 +12365,7 @@
 	 * ```
 	 */
 	const SageEmbed$1 = componentFactory(SageEmbed);
+	const PreRenderedSageEmbed = componentFactory(SageEmbed, true);
 	/**
 	 * Get a reference to the embed component to trigger events on the component.
 	 *
@@ -12023,13 +12385,16 @@
 	 */
 	function useEmbedRef() {
 	    return React__default['default'].useRef(null);
-	}
-	const PreRenderedLiveboardEmbed = componentFactory(LiveboardEmbed, true);
+	}
 
 	exports.AppEmbed = AppEmbed$1;
 	exports.LiveboardEmbed = LiveboardEmbed$1;
 	exports.PinboardEmbed = PinboardEmbed;
+	exports.PreRenderedAppEmbed = PreRenderedAppEmbed;
 	exports.PreRenderedLiveboardEmbed = PreRenderedLiveboardEmbed;
+	exports.PreRenderedPinboardEmbed = PreRenderedPinboardEmbed;
+	exports.PreRenderedSageEmbed = PreRenderedSageEmbed;
+	exports.PreRenderedSearchBarEmbed = PreRenderedSearchBarEmbed;
 	exports.SageEmbed = SageEmbed$1;
 	exports.SearchBarEmbed = SearchBarEmbed$1;
 	exports.SearchEmbed = SearchEmbed$1;