@thoughtspot/visual-embed-sdk 1.32.7 → 1.32.9

package/dist/visual-embed-sdk-react-full.d.ts

@@ -1664,21 +1664,22 @@ export declare const renderInQueue: (fn: (next?: (val?: any) => void) => Promise
 /**
     * Imports TML representation of the metadata objects into ThoughtSpot.
     * @param data
+    * @returns imports TML data into ThoughtSpot
     * @example
     * ```js
-    *   executeTML({
-    * //Array of metadata Tmls
-                metadata_tmls: [
-                        "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
-                        \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
-                ],
-                import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
-                create_new: false, // If selected, creates TML objects with new GUIDs.
-        }).then(result => {
-                console.log(result);
-        }).catch(error => {
-                console.error(error);
-        });
+    *  executeTML({
+    * //Array of metadata Tmls in string format
+    *      metadata_tmls: [
+    *          "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
+    *          \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
+    *      ],
+    *      import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
+    *      create_new: false, // If selected, creates TML objects with new GUIDs.
+    *  }).then(result => {
+    *      console.log(result);
+    *  }).catch(error => {
+    *      console.error(error);
+    *  });
     *```
     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
     * @group Global methods
@@ -1688,27 +1689,28 @@ export declare const executeTML: (data: executeTMLInput) => Promise<any>;
     * Exports TML representation of the metadata objects from ThoughtSpot in JSON or YAML
     * format.
     * @param data
+    * @returns exports TML data
     * @example
     * ```js
-    exportTML({
-        metadata: [
-            {
-                type: "LIVEBOARD", //Metadata Type
-                identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
-            }
-        ],
-        export_associated: false,//indicates whether to export associated metadata objects
-        export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
-                                             //exporting a Liveboard and its associated objects, the API
-                                             //returns the Liveboard TML data with the FQNs of the referenced
-                                             //worksheet. If the exported TML data includes FQNs, you don't need
-                                             //to manually add FQNs of the referenced objects during TML import.
-        edoc_format: "JSON" //It takes JSON or YAML value
-    }).then(result => {
-        console.log(result);
-    }).catch(error => {
-        console.error(error);
-    });
+    * exportTML({
+    *   metadata: [
+    *     {
+    *       type: "LIVEBOARD", //Metadata Type
+    *       identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
+    *     }
+    *   ],
+    *   export_associated: false,//indicates whether to export associated metadata objects
+    *   export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
+    *                      //exporting a Liveboard and its associated objects, the API
+    *                      //returns the Liveboard TML data with the FQNs of the referenced
+    *                      //worksheet. If the exported TML data includes FQNs, you don't need
+    *                      //to manually add FQNs of the referenced objects during TML import.
+    *   edoc_format: "JSON" //It takes JSON or YAML value
+    * }).then(result => {
+    *   console.log(result);
+    * }).catch(error => {
+    *   console.error(error);
+    * });
     * ```
     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
     * @group Global methods
@@ -2204,6 +2206,7 @@ export interface customCssInterface {
     * Styles within the {@link CustomisationsInterface}.
     */
 export interface CustomStyles {
+        customCSSUrl?: string;
         customCSS?: customCssInterface;
 }
 /**
@@ -2637,11 +2640,12 @@ export interface ViewConfig {
             */
         visibleActions?: Action[];
         /**
-            * Show alert messages and toast messages in the embedded view.
+            * Show alert messages and toast messages in the embedded
+            * view in full app embed.
             * @version SDK: 1.11.0 | ThoughtSpot: 8.3.0.cl, 8.4.1.sw
             * @example
             * ```js
-            * const embed = new LiveboardEmbed('#embed-container', {
+            * const embed = new AppEmbed('#embed-container', {
             *    ... // other options
             *    showAlerts:true,
             * })
@@ -3171,6 +3175,28 @@ export interface RuntimeParameter {
     *   console.log('Drilldown event', drilldown);
     * }));
     * ```
+    *
+    * If you are using React components for embedding, you can register to any
+    * events from the `EmbedEvent` list by using the `on<EventName>` convention.
+    * For example,`onAlert`, `onCopyToClipboard` and so on.
+    *
+    *  @example
+    * ```js
+    * // ...
+    * const MyComponent = ({ dataSources }) => {
+    *      const onLoad = () => {
+    *      console.log(EmbedEvent.Load, {});
+    *      };
+    *
+    *      return (
+    *          <SearchEmbed
+    *              dataSources={dataSources}
+    *              onLoad = {logEvent("Load")}
+    *          />
+    *     );
+    * };
+    * ```
+    *
     * @group Events
     */
 export declare enum EmbedEvent {
@@ -4045,8 +4071,8 @@ export declare enum EmbedEvent {
             * Prerequisite: Set isOnBeforeGetVizDataInterceptEnabled : true
             * for this embed event to get emitted.
             *
-            * Parameter: payload
-            * Parameter: responder
+            * @param: payload
+            * @param: responder
             * Contains elements that lets developers define whether ThoughtSpot
             * will run the search or not, and if not, which error message to provide.
             *
@@ -4058,6 +4084,7 @@ export declare enum EmbedEvent {
             *
             * @version SDK : 1.29.0 | Thoughtspot : 10.2.0.cl
             *
+            * @example
             *```js
             * .on(EmbedEvent.OnBeforeGetVizDataIntercept,
             * (payload, responder) => {
@@ -4093,7 +4120,6 @@ export declare enum EmbedEvent {
             *  }})
             * })
             *```
-            *
             */
         OnBeforeGetVizDataIntercept = "onBeforeGetVizDataIntercept",
         /**
@@ -4111,7 +4137,7 @@ export declare enum EmbedEvent {
 }
 /**
     * Event types that can be triggered by the host application
-    * to the embedded ThoughtSpot app
+    * to the embedded ThoughtSpot app.
     *
     * To trigger an event use the corresponding
     * {@link LiveboardEmbed.trigger} or {@link AppEmbed.trigger} or {@link
@@ -4128,6 +4154,40 @@ export declare enum EmbedEvent {
     *   { columnName: 'state, operator: RuntimeFilterOp.EQ, values: ['california']}
     * ]);
     * ```
+    * @example
+    * If using React components to embed, use the format shown in this example:
+    *
+    * ```js
+    *  const selectVizs = () => {
+    *      embedRef.current.trigger(HostEvent.SetVisibleVizs, [
+    *         "715e4613-c891-4884-be44-aa8d13701c06",
+    *         "3f84d633-e325-44b2-be25-c6650e5a49cf"
+    *      ]);
+    *    };
+    * ```
+    *
+    *
+    * You can also attach an Embed event to a Host event to trigger
+    * a specific action as shown in this example:
+    *
+    * @example
+    * ```js
+    *  const EmbeddedComponent = () => {
+    *       const embedRef = useRef(null); // import { useRef } from react
+    *       const onLiveboardRendered = () => {
+    *          embedRef.current.trigger(HostEvent.SetVisibleVizs, ['viz1', 'viz2']);
+    *      };
+    *
+    *      return (
+    *          <LiveboardEmbed
+    *              ref={embedRef}
+    *              liveboardId="<liveboard-guid>"
+    *              onLiveboardRendered={onLiveboardRendered}
+    *          />
+    *      );
+    *  }
+    * ```
+    *
     * @group Events
     */
 export declare enum HostEvent {
@@ -4821,10 +4881,23 @@ export declare enum HostEvent {
             *     filter: {
             *         column: "item type",
             *         oper: "IN",
-            *         values: ["bags","shirts"],
+            *         values: ["bags","shirts"]
+            *        }
+            *    });
+            * ```
+            * @example
+            * ```js
+            *
+            * liveboardEmbed.trigger(HostEvent.UpdateFilters, {
+            *     filter: {
+            *         column: "date",
+            *         oper: "EQ",
+            *         values: ["JULY","2023"],
+            *         type: "MONTH_YEAR"
             *        }
             *    });
             * ```
+            *
             * @example
             *
             * ```js
@@ -4842,7 +4915,8 @@ export declare enum HostEvent {
             *    {
             *      column: "Date",
             *      oper: 'EQ',
-            *      values: ["1656680400"]
+            *      values: ["2023-07-31"],
+            *      types: "EXACT_DATE"
             *    }]
             * });
             * ```
@@ -6283,9 +6357,12 @@ export interface CustomCssVariables {
             */
         '--ts-var-root-text-transform'?: string;
         /**
-            * application color, it replaces #2770EF which is rd-color(blue,base) and
-            * its similar colors like rd-color(blue,60), rd-color(accent, base) and
-            * rd-color(text, accent) in the app.
+            * Font color of the text on toggle buttons such as
+            * **All**, **Answers**, and **Liveboards** on the Home page (Classic experience),
+            * the text color of the chart and table tiles on Home page (New modular Homepage experience),
+            * and title text on the AI-generated charts and tables.
+            * The default color code is #2770EF.
+            *
             */
         '--ts-var-application-color'?: string;
         /**
@@ -6396,6 +6473,10 @@ export interface CustomCssVariables {
             * Background color of the primary buttons on hover.
             */
         '--ts-var-button--primary--hover-background'?: string;
+        /**
+            * Backgroud color of the primary buttons when active.
+            */
+        '--ts-var-button--primary--active-background'?: string;
         /**
             * Font color of the text on the secondary buttons.
             */
@@ -6412,6 +6493,10 @@ export interface CustomCssVariables {
             * Background color of the secondary button on hover.
             */
         '--ts-var-button--secondary--hover-background'?: string;
+        /**
+            * Backgroud color of the secondary buttons when active.
+            */
+        '--ts-var-button--secondary--active-background'?: string;
         /**
             * Font color of the tertiary button. For example, the *Undo*, *Redo*, and *Reset*
             * buttons on the *Search* page.
@@ -6425,6 +6510,10 @@ export interface CustomCssVariables {
             * Background color of the tertiary button when a user hovers over these buttons.
             */
         '--ts-var-button--tertiary--hover-background'?: string;
+        /**
+            * Backgroud color of the tertiary buttons when active.
+            */
+        '--ts-var-button--tertiary--active-background'?: string;
         /**
             * Font color of the title text of a visualization or Answer.
             */

package/dist/visual-embed-sdk-react.d.ts

@@ -1836,6 +1836,7 @@ export interface customCssInterface {
     * Styles within the {@link CustomisationsInterface}.
     */
 export interface CustomStyles {
+        customCSSUrl?: string;
         customCSS?: customCssInterface;
 }
 /**
@@ -2269,11 +2270,12 @@ export interface ViewConfig {
             */
         visibleActions?: Action[];
         /**
-            * Show alert messages and toast messages in the embedded view.
+            * Show alert messages and toast messages in the embedded
+            * view in full app embed.
             * @version SDK: 1.11.0 | ThoughtSpot: 8.3.0.cl, 8.4.1.sw
             * @example
             * ```js
-            * const embed = new LiveboardEmbed('#embed-container', {
+            * const embed = new AppEmbed('#embed-container', {
             *    ... // other options
             *    showAlerts:true,
             * })
@@ -2803,6 +2805,28 @@ export interface RuntimeParameter {
     *   console.log('Drilldown event', drilldown);
     * }));
     * ```
+    *
+    * If you are using React components for embedding, you can register to any
+    * events from the `EmbedEvent` list by using the `on<EventName>` convention.
+    * For example,`onAlert`, `onCopyToClipboard` and so on.
+    *
+    *  @example
+    * ```js
+    * // ...
+    * const MyComponent = ({ dataSources }) => {
+    *      const onLoad = () => {
+    *      console.log(EmbedEvent.Load, {});
+    *      };
+    *
+    *      return (
+    *          <SearchEmbed
+    *              dataSources={dataSources}
+    *              onLoad = {logEvent("Load")}
+    *          />
+    *     );
+    * };
+    * ```
+    *
     * @group Events
     */
 export declare enum EmbedEvent {
@@ -3677,8 +3701,8 @@ export declare enum EmbedEvent {
             * Prerequisite: Set isOnBeforeGetVizDataInterceptEnabled : true
             * for this embed event to get emitted.
             *
-            * Parameter: payload
-            * Parameter: responder
+            * @param: payload
+            * @param: responder
             * Contains elements that lets developers define whether ThoughtSpot
             * will run the search or not, and if not, which error message to provide.
             *
@@ -3690,6 +3714,7 @@ export declare enum EmbedEvent {
             *
             * @version SDK : 1.29.0 | Thoughtspot : 10.2.0.cl
             *
+            * @example
             *```js
             * .on(EmbedEvent.OnBeforeGetVizDataIntercept,
             * (payload, responder) => {
@@ -3725,7 +3750,6 @@ export declare enum EmbedEvent {
             *  }})
             * })
             *```
-            *
             */
         OnBeforeGetVizDataIntercept = "onBeforeGetVizDataIntercept",
         /**
@@ -3743,7 +3767,7 @@ export declare enum EmbedEvent {
 }
 /**
     * Event types that can be triggered by the host application
-    * to the embedded ThoughtSpot app
+    * to the embedded ThoughtSpot app.
     *
     * To trigger an event use the corresponding
     * {@link LiveboardEmbed.trigger} or {@link AppEmbed.trigger} or {@link
@@ -3760,6 +3784,40 @@ export declare enum EmbedEvent {
     *   { columnName: 'state, operator: RuntimeFilterOp.EQ, values: ['california']}
     * ]);
     * ```
+    * @example
+    * If using React components to embed, use the format shown in this example:
+    *
+    * ```js
+    *  const selectVizs = () => {
+    *      embedRef.current.trigger(HostEvent.SetVisibleVizs, [
+    *         "715e4613-c891-4884-be44-aa8d13701c06",
+    *         "3f84d633-e325-44b2-be25-c6650e5a49cf"
+    *      ]);
+    *    };
+    * ```
+    *
+    *
+    * You can also attach an Embed event to a Host event to trigger
+    * a specific action as shown in this example:
+    *
+    * @example
+    * ```js
+    *  const EmbeddedComponent = () => {
+    *       const embedRef = useRef(null); // import { useRef } from react
+    *       const onLiveboardRendered = () => {
+    *          embedRef.current.trigger(HostEvent.SetVisibleVizs, ['viz1', 'viz2']);
+    *      };
+    *
+    *      return (
+    *          <LiveboardEmbed
+    *              ref={embedRef}
+    *              liveboardId="<liveboard-guid>"
+    *              onLiveboardRendered={onLiveboardRendered}
+    *          />
+    *      );
+    *  }
+    * ```
+    *
     * @group Events
     */
 export declare enum HostEvent {
@@ -4453,10 +4511,23 @@ export declare enum HostEvent {
             *     filter: {
             *         column: "item type",
             *         oper: "IN",
-            *         values: ["bags","shirts"],
+            *         values: ["bags","shirts"]
+            *        }
+            *    });
+            * ```
+            * @example
+            * ```js
+            *
+            * liveboardEmbed.trigger(HostEvent.UpdateFilters, {
+            *     filter: {
+            *         column: "date",
+            *         oper: "EQ",
+            *         values: ["JULY","2023"],
+            *         type: "MONTH_YEAR"
             *        }
             *    });
             * ```
+            *
             * @example
             *
             * ```js
@@ -4474,7 +4545,8 @@ export declare enum HostEvent {
             *    {
             *      column: "Date",
             *      oper: 'EQ',
-            *      values: ["1656680400"]
+            *      values: ["2023-07-31"],
+            *      types: "EXACT_DATE"
             *    }]
             * });
             * ```
@@ -6258,21 +6330,22 @@ export declare const renderInQueue: (fn: (next?: (val?: any) => void) => Promise
 /**
     * Imports TML representation of the metadata objects into ThoughtSpot.
     * @param data
+    * @returns imports TML data into ThoughtSpot
     * @example
     * ```js
-    *   executeTML({
-    * //Array of metadata Tmls
-                metadata_tmls: [
-                        "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
-                        \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
-                ],
-                import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
-                create_new: false, // If selected, creates TML objects with new GUIDs.
-        }).then(result => {
-                console.log(result);
-        }).catch(error => {
-                console.error(error);
-        });
+    *  executeTML({
+    * //Array of metadata Tmls in string format
+    *      metadata_tmls: [
+    *          "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
+    *          \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
+    *      ],
+    *      import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
+    *      create_new: false, // If selected, creates TML objects with new GUIDs.
+    *  }).then(result => {
+    *      console.log(result);
+    *  }).catch(error => {
+    *      console.error(error);
+    *  });
     *```
     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
     * @group Global methods
@@ -6282,27 +6355,28 @@ export declare const executeTML: (data: executeTMLInput) => Promise<any>;
     * Exports TML representation of the metadata objects from ThoughtSpot in JSON or YAML
     * format.
     * @param data
+    * @returns exports TML data
     * @example
     * ```js
-    exportTML({
-        metadata: [
-            {
-                type: "LIVEBOARD", //Metadata Type
-                identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
-            }
-        ],
-        export_associated: false,//indicates whether to export associated metadata objects
-        export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
-                                             //exporting a Liveboard and its associated objects, the API
-                                             //returns the Liveboard TML data with the FQNs of the referenced
-                                             //worksheet. If the exported TML data includes FQNs, you don't need
-                                             //to manually add FQNs of the referenced objects during TML import.
-        edoc_format: "JSON" //It takes JSON or YAML value
-    }).then(result => {
-        console.log(result);
-    }).catch(error => {
-        console.error(error);
-    });
+    * exportTML({
+    *   metadata: [
+    *     {
+    *       type: "LIVEBOARD", //Metadata Type
+    *       identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
+    *     }
+    *   ],
+    *   export_associated: false,//indicates whether to export associated metadata objects
+    *   export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
+    *                      //exporting a Liveboard and its associated objects, the API
+    *                      //returns the Liveboard TML data with the FQNs of the referenced
+    *                      //worksheet. If the exported TML data includes FQNs, you don't need
+    *                      //to manually add FQNs of the referenced objects during TML import.
+    *   edoc_format: "JSON" //It takes JSON or YAML value
+    * }).then(result => {
+    *   console.log(result);
+    * }).catch(error => {
+    *   console.error(error);
+    * });
     * ```
     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
     * @group Global methods
@@ -6571,9 +6645,12 @@ export interface CustomCssVariables {
             */
         '--ts-var-root-text-transform'?: string;
         /**
-            * application color, it replaces #2770EF which is rd-color(blue,base) and
-            * its similar colors like rd-color(blue,60), rd-color(accent, base) and
-            * rd-color(text, accent) in the app.
+            * Font color of the text on toggle buttons such as
+            * **All**, **Answers**, and **Liveboards** on the Home page (Classic experience),
+            * the text color of the chart and table tiles on Home page (New modular Homepage experience),
+            * and title text on the AI-generated charts and tables.
+            * The default color code is #2770EF.
+            *
             */
         '--ts-var-application-color'?: string;
         /**
@@ -6684,6 +6761,10 @@ export interface CustomCssVariables {
             * Background color of the primary buttons on hover.
             */
         '--ts-var-button--primary--hover-background'?: string;
+        /**
+            * Backgroud color of the primary buttons when active.
+            */
+        '--ts-var-button--primary--active-background'?: string;
         /**
             * Font color of the text on the secondary buttons.
             */
@@ -6700,6 +6781,10 @@ export interface CustomCssVariables {
             * Background color of the secondary button on hover.
             */
         '--ts-var-button--secondary--hover-background'?: string;
+        /**
+            * Backgroud color of the secondary buttons when active.
+            */
+        '--ts-var-button--secondary--active-background'?: string;
         /**
             * Font color of the tertiary button. For example, the *Undo*, *Redo*, and *Reset*
             * buttons on the *Search* page.
@@ -6713,6 +6798,10 @@ export interface CustomCssVariables {
             * Background color of the tertiary button when a user hovers over these buttons.
             */
         '--ts-var-button--tertiary--hover-background'?: string;
+        /**
+            * Backgroud color of the tertiary buttons when active.
+            */
+        '--ts-var-button--tertiary--active-background'?: string;
         /**
             * Font color of the title text of a visualization or Answer.
             */