@ironsource/shared-ui 2.2.0-test.3 → 2.2.0-test.5

package/components/chart/ChartHeader.vue.js

@@ -1,7 +1,7 @@
 import e from "./ChartHeader.vue2.js";
 /* empty css                  */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartHeader.vue_vue_type_style_index_0_scoped_d90c583e_lang.css"; //*');
-const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-d90c583e"]]);
+// import "../../ChartHeader.vue_vue_type_style_index_0_scoped_9a603520_lang.css"; //*');
+const r = /* @__PURE__ */ o(e, [["__scopeId", "data-v-9a603520"]]);
 export {
-  s as default
+  r as default
 };

package/components/chart/ChartHeader.vue2.js

@@ -1,93 +1,117 @@
- import "../../ChartHeader.vue_vue_type_style_index_0_scoped_d90c583e_lang.css"; import { defineComponent as I, computed as p, openBlock as o, createElementBlock as S, mergeProps as u, unref as t, createElementVNode as c, createVNode as T, createSlots as w, withCtx as y, renderSlot as x, createTextVNode as B, toDisplayString as E, createBlock as d, normalizeProps as b, createCommentVNode as l, isRef as D } from "vue";
-import H from "../typography/v4/Typography.vue.js";
+ import "../../ChartHeader.vue_vue_type_style_index_0_scoped_9a603520_lang.css"; import { defineComponent as g, computed as c, openBlock as r, createElementBlock as B, mergeProps as h, unref as t, createElementVNode as n, createVNode as m, createSlots as E, withCtx as d, renderSlot as H, createBlock as l, createTextVNode as b, toDisplayString as v, createCommentVNode as i, normalizeProps as V, isRef as D } from "vue";
+import k from "../typography/v4/Typography.vue.js";
 import N from "../switch/v4/SwitchV4.vue.js";
-import P from "../chip/v4/ChipV4.vue.js";
-import { ChartType as n, TrendDirection as $ } from "./types.js";
-import V from "./ChartHeaderTrend.vue.js";
-import g from "./SubHeader.vue.js";
-import { useTestIdAttrs as A } from "../../utils/testIds.js";
-import { ChartTestIdModifiers as s } from "../../testids/index.js";
-const L = { class: "header-texts" }, R = { class: "header-row" }, U = { class: "header-actions" }, J = /* @__PURE__ */ I({
+import P from "../tooltip/v4/TooltipV4.vue.js";
+import $ from "../chip/v4/ChipV4.vue.js";
+import { ChartType as u, TrendDirection as A } from "./types.js";
+import C from "./ChartHeaderTrend.vue.js";
+import L from "./SubHeader.vue.js";
+import { useTestIdAttrs as R } from "../../utils/testIds.js";
+import { ChartTestIdModifiers as p } from "../../testids/index.js";
+const U = { class: "header-texts" }, z = { class: "header-row" }, M = { class: "header-tooltip" }, O = { class: "header-actions" }, Z = /* @__PURE__ */ g({
   __name: "ChartHeader",
   props: {
-    chartType: { default: n.Line },
+    chartType: { default: u.Line },
     typeSwitcher: { type: Boolean, default: !0 },
     header: { default: "" },
+    headerTooltip: { default: null },
     subheader: { default: "" },
     subheaderTooltip: { default: null },
     trendTooltip: { default: null },
     compact: { type: Boolean, default: !1 },
     trendValue: { default: null },
-    trendDirection: { default: $.UP },
+    trendDirection: { default: A.UP },
     noteText: { default: "" },
     testId: { default: "" }
   },
   emits: ["update:chartType"],
-  setup(e, { emit: v }) {
-    const a = e, h = [
-      { id: n.Line, icon: "chart-line-up" },
-      { id: n.Bar, icon: "chart-bar" },
-      { id: n.StackedLine, icon: "chart-line" }
-    ], i = p({
+  setup(e, { emit: I }) {
+    const a = e, f = [
+      { id: u.Line, icon: "chart-line-up" },
+      { id: u.Bar, icon: "chart-bar" },
+      { id: u.StackedLine, icon: "chart-line" }
+    ], S = c(() => a.headerTooltip?.length > 0), s = c({
       get() {
-        return h.find(({ id: r }) => r === a.chartType);
+        return f.find(({ id: o }) => o === a.chartType);
       },
-      set(r) {
-        v("update:chartType", r.id);
+      set(o) {
+        I("update:chartType", o.id);
       }
-    }), m = p(() => ({
+    }), T = c(() => ({
       value: a.trendValue,
       direction: a.trendDirection,
       trendTooltip: a.trendTooltip,
       testId: a.testId
-    })), k = A(a.testId, s);
-    return (r, f) => (o(), S("div", u({
+    })), x = R(a.testId, p);
+    return (o, y) => (r(), B("div", h({
       class: ["chart-header", { "chart-header--compact": e.compact }]
-    }, t(k)[t(s).HEADER]), [
-      c("div", L, [
-        T(g, {
+    }, t(x)[t(p).HEADER]), [
+      n("div", U, [
+        m(L, {
           subheader: e.subheader,
           "subheader-tooltip": e.subheaderTooltip,
           "show-separator": e.compact && (!!e.header || !!e.trendValue)
-        }, w({ _: 2 }, [
-          r.$slots["subheader-tooltip"] ? {
+        }, E({ _: 2 }, [
+          o.$slots["subheader-tooltip"] ? {
             name: "subheader-tooltip",
-            fn: y(() => [
-              x(r.$slots, "subheader-tooltip", {}, void 0, !0)
+            fn: d(() => [
+              H(o.$slots, "subheader-tooltip", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0
         ]), 1032, ["subheader", "subheader-tooltip", "show-separator"]),
-        c("div", R, [
-          T(t(H), {
-            class: "header-text",
-            variant: e.compact ? "h5" : "chart2"
+        n("div", z, [
+          m(t(P), {
+            placement: "right",
+            disabled: !t(S)
           }, {
-            default: y(() => [
-              B(E(e.header), 1)
+            tooltip: d(() => [
+              n("div", M, [
+                e.headerTooltip ? (r(), l(t(k), {
+                  key: 0,
+                  variant: "body2",
+                  class: "header-tooltip__text"
+                }, {
+                  default: d(() => [
+                    b(v(e.headerTooltip), 1)
+                  ]),
+                  _: 1
+                })) : i("", !0)
+              ])
+            ]),
+            default: d(() => [
+              m(t(k), {
+                class: "header-text",
+                variant: e.compact ? "h5" : "chart2"
+              }, {
+                default: d(() => [
+                  b(v(e.header), 1)
+                ]),
+                _: 1
+              }, 8, ["variant"])
             ]),
             _: 1
-          }, 8, ["variant"]),
-          !e.compact && e.trendValue !== null ? (o(), d(V, b(u({ key: 0 }, t(m))), null, 16)) : l("", !0)
+          }, 8, ["disabled"]),
+          !e.compact && e.trendValue !== null ? (r(), l(C, V(h({ key: 0 }, t(T))), null, 16)) : i("", !0)
         ]),
-        e.compact && e.trendValue !== null ? (o(), d(V, b(u({ key: 0 }, t(m))), null, 16)) : l("", !0)
+        e.compact && e.trendValue !== null ? (r(), l(C, V(h({ key: 0 }, t(T))), null, 16)) : i("", !0)
       ]),
-      c("div", U, [
-        e.noteText ? (o(), d(t(P), {
+      n("div", O, [
+        e.noteText ? (r(), l(t($), {
           key: 0,
           label: `Note: ${e.noteText}`
-        }, null, 8, ["label"])) : l("", !0),
-        e.typeSwitcher ? (o(), d(t(N), {
+        }, null, 8, ["label"])) : i("", !0),
+        e.typeSwitcher ? (r(), l(t(N), {
           key: 1,
-          modelValue: t(i),
-          "onUpdate:modelValue": f[0] || (f[0] = (C) => D(i) ? i.value = C : null),
-          options: h,
-          "test-id": `${e.testId}-${t(s).TYPE_SWITCHER}`
-        }, null, 8, ["modelValue", "test-id"])) : l("", !0)
+          modelValue: t(s),
+          "onUpdate:modelValue": y[0] || (y[0] = (w) => D(s) ? s.value = w : null),
+          options: f,
+          "test-id": `${e.testId}-${t(p).TYPE_SWITCHER}`
+        }, null, 8, ["modelValue", "test-id"])) : i("", !0)
       ])
     ], 16));
   }
 });
 export {
-  J as default
+  Z as default
 };

package/components/chart/ChartPlane.vue.d.ts

@@ -12,6 +12,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     tickCount?: number;
     truncateTickLabels?: boolean;
     header?: string;
+    headerTooltip?: string;
     subheader?: string;
     subheaderTooltip?: {
         header?: string;
@@ -58,6 +59,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     tickCount: number;
     truncateTickLabels: boolean;
     header: string;
+    headerTooltip: any;
     subheader: string;
     subheaderTooltip: any;
     keepSubheaderVisible: boolean;
@@ -99,6 +101,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     tickCount?: number;
     truncateTickLabels?: boolean;
     header?: string;
+    headerTooltip?: string;
     subheader?: string;
     subheaderTooltip?: {
         header?: string;
@@ -145,6 +148,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     tickCount: number;
     truncateTickLabels: boolean;
     header: string;
+    headerTooltip: any;
     subheader: string;
     subheaderTooltip: any;
     keepSubheaderVisible: boolean;
@@ -193,6 +197,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     subheader: string;
     subheaderTooltip: any;
     typeSwitcher: boolean;
+    headerTooltip: string;
     trendValue: string | number;
     trendDirection: TrendDirection;
     noteText: string;

package/components/chart/ChartPlane.vue.js

@@ -1,7 +1,7 @@
 import e from "./ChartPlane.vue2.js";
 /* empty css                 */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartPlane.vue_vue_type_style_index_0_scoped_3c887f7e_lang.css"; //*');
-const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-3c887f7e"]]);
+// import "../../ChartPlane.vue_vue_type_style_index_0_scoped_6de5cddb_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-6de5cddb"]]);
 export {
-  a as default
+  s as default
 };

package/components/chart/ChartPlane.vue2.js

@@ -1,9 +1,9 @@
- import "../../ChartPlane.vue_vue_type_style_index_0_scoped_3c887f7e_lang.css"; import { defineComponent as ne, useCssVars as se, unref as n, computed as i, ref as E, onMounted as de, watch as v, nextTick as ce, openBlock as p, createElementBlock as S, createVNode as ue, isRef as fe, createSlots as pe, withCtx as he, renderSlot as me, createCommentVNode as L, createElementVNode as R, normalizeStyle as Te, createBlock as I, mergeProps as ve } from "vue";
+ import "../../ChartPlane.vue_vue_type_style_index_0_scoped_6de5cddb_lang.css"; import { defineComponent as ne, useCssVars as se, unref as n, computed as i, ref as E, onMounted as de, watch as v, nextTick as ue, openBlock as p, createElementBlock as S, createVNode as ce, isRef as fe, createSlots as pe, withCtx as he, renderSlot as me, createCommentVNode as L, createElementVNode as R, normalizeStyle as Te, createBlock as I, mergeProps as ve } from "vue";
 import { Chart as V, ArcElement as ye, LineElement as Ce, BarElement as ge, PointElement as be, LineController as xe, BarController as Ae, PieController as ke, ScatterController as Ee, CategoryScale as Se, LinearScale as Le, Filler as Re, Tooltip as Ie } from "chart.js";
 import { HoverVerticalLine as De } from "./plugins/HoverVerticalLine.js";
 import { prepareTickLabel as Be, formatValue as Oe } from "./utils/utils.js";
-import { DEFAULT_TICK_COUNT as Pe, TOTALS_HELPER_KEY as F, LINE_DASH_STYLE as Ne, BASE_COLOR_KEY as M, CHART_PADDING as He, POINT_BORDER_COLOR as we, TICK_LABEL_COLOR as Y, TICK_LABEL_FONT as K, TICKS_EXTRA_PADDING as Ve, GRID_LINE_COLOR as U, HEADER_HEIGHT as Fe, COMPACT_HEADER_HEIGHT as Me, HOVER_AREA_TRANSPARENCY as Ye, HOVER_TRANSPARENCY as y, CHART_ITEM_TRANSPARENCY as Ke, INCOMPLETE_DATA_BAR_TRANSPARENCY as Ue, STACKED_LINE_TRANSPARENCY as _e } from "./consts.js";
-import { ChartType as d, DateInterval as Ge, TooltipOrder as _, TrendDirection as $e } from "./types.js";
+import { DEFAULT_TICK_COUNT as Pe, TOTALS_HELPER_KEY as F, LINE_DASH_STYLE as Ne, BASE_COLOR_KEY as M, CHART_PADDING as He, POINT_BORDER_COLOR as we, TICK_LABEL_COLOR as Y, TICK_LABEL_FONT as K, TICKS_EXTRA_PADDING as Ve, GRID_LINE_COLOR as U, HEADER_HEIGHT as Fe, COMPACT_HEADER_HEIGHT as Me, HOVER_AREA_TRANSPARENCY as Ye, HOVER_TRANSPARENCY as y, CHART_ITEM_TRANSPARENCY as Ke, INCOMPLETE_DATA_BAR_TRANSPARENCY as Ue, STACKED_LINE_TRANSPARENCY as Ge } from "./consts.js";
+import { ChartType as d, DateInterval as _e, TooltipOrder as G, TrendDirection as $e } from "./types.js";
 import { useTooltipPosition as ze } from "./composables/useTooltipPosition.js";
 import We from "./ChartTooltip.vue.js";
 import { hexColorToRgba as h } from "../../utils/color.js";
@@ -12,7 +12,7 @@ import { useMemoize as Xe, useVModel as je } from "@vueuse/core";
 import qe from "../emptyState/v4/EmptyStateV4.vue.js";
 import Je from "./ChartLoader.vue.js";
 import { DEFAULT_CHART_COLOR as Qe } from "./colorPalette.js";
-import { TotalType as G, calculateTotal as et } from "../../utils/totals.js";
+import { TotalType as _, calculateTotal as et } from "../../utils/totals.js";
 import { isNullOrUndefined as tt } from "../../utils/utils.js";
 import { storeOriginalDatasetColors as at, restoreOriginalDatasetColors as ot } from "./utils/highlightUtils.js";
 import { useTestIdAttrs as lt } from "../../utils/testIds.js";
@@ -33,10 +33,11 @@ const rt = { class: "chart-plane-container" }, it = {
     parsing: { default: void 0 },
     xAxisFormat: { default: "string" },
     yAxisFormat: { default: "number" },
-    xAxisDateInterval: { default: Ge.DAILY },
+    xAxisDateInterval: { default: _e.DAILY },
     tickCount: { default: Pe },
     truncateTickLabels: { type: Boolean, default: !1 },
     header: { default: "" },
+    headerTooltip: { default: null },
     subheader: { default: "" },
     subheaderTooltip: { default: null },
     keepSubheaderVisible: { type: Boolean, default: !1 },
@@ -51,9 +52,9 @@ const rt = { class: "chart-plane-container" }, it = {
     compactHeader: { type: Boolean, default: !1 },
     noteText: { default: "" },
     tooltipRespectsTopEdge: { type: Boolean, default: !0 },
-    tooltipTotalType: { default: G.Total },
+    tooltipTotalType: { default: _.Total },
     tooltipTotalCalcFn: { type: Function, default: et },
-    tooltipOrder: { default: _.Legend },
+    tooltipOrder: { default: G.Legend },
     trendValue: { default: null },
     trendDirection: { default: $e.UP },
     trendTooltip: { default: null },
@@ -69,8 +70,8 @@ const rt = { class: "chart-plane-container" }, it = {
   setup(o, { emit: z }) {
     const e = o;
     se((t) => ({
-      "4efc2842": n(oe),
-      "60310e6c": o.height
+      f01f0522: n(oe),
+      "77889a5a": o.height
     }));
     const W = Xe(Be);
     V.register(
@@ -92,13 +93,13 @@ const rt = { class: "chart-plane-container" }, it = {
       () => e.withAnimation ? "" : "none"
     ), T = E(null);
     let s = null;
-    const D = i(() => e.empty || e.dataSets.length === 0), u = i(() => !e.loading && !D.value), g = () => {
+    const D = i(() => e.empty || e.dataSets.length === 0), c = i(() => !e.loading && !D.value), g = () => {
       T.value && (s && s.destroy(), s = new V(T.value, P.value));
     }, X = () => {
       s && (s.data.datasets = O.value, s.options = P.value.options, s.update(Z.value));
     };
-    de(g), v(() => e.chartType, g), v(u, async (t) => {
-      t && (await ce(), g());
+    de(g), v(() => e.chartType, g), v(c, async (t) => {
+      t && (await ue(), g());
     }), v(
       [
         () => e.visibleIds,
@@ -127,7 +128,7 @@ const rt = { class: "chart-plane-container" }, it = {
     ), Q = (t) => (r) => {
       const a = r.chart.data.labels.length - 1;
       let l = Ke;
-      return e.chartType === d.Bar && e.indicateIncompleteData && r.index === a ? l = Ue : e.chartType === d.StackedLine && (l = _e), h(t, l);
+      return e.chartType === d.Bar && e.indicateIncompleteData && r.index === a ? l = Ue : e.chartType === d.StackedLine && (l = Ge), h(t, l);
     }, O = i(() => A.value.map((t, r) => {
       const a = J(t.id), l = b.value ? r !== 0 ? "-1" : "start" : void 0, m = e.indicateIncompleteData ? {
         borderDash: (w) => {
@@ -152,7 +153,7 @@ const rt = { class: "chart-plane-container" }, it = {
         // store base color for later use
       };
     })), ee = i(
-      () => e.tooltipTotalType === G.Total ? "Total" : "Mean"
+      () => e.tooltipTotalType === _.Total ? "Total" : "Mean"
     ), te = (t) => t.filter(
       (r) => !r.dataset.isTotal
     ), P = i(() => ({
@@ -179,7 +180,7 @@ const rt = { class: "chart-plane-container" }, it = {
             enabled: !1,
             position: "average",
             external: ({ tooltip: t }) => {
-              c.value = { ...t };
+              u.value = { ...t };
             },
             callbacks: {
               footer: (t) => {
@@ -191,7 +192,7 @@ const rt = { class: "chart-plane-container" }, it = {
               }
             },
             itemSort: (t, r) => {
-              if (e.tooltipOrder === _.YAxis) {
+              if (e.tooltipOrder === G.YAxis) {
                 const a = t.parsed.y || 0, l = r.parsed.y || 0;
                 return a === l ? 0 : a > l ? -1 : 1;
               }
@@ -283,15 +284,15 @@ const rt = { class: "chart-plane-container" }, it = {
           }
         }
       }
-    })), N = E(null), c = E(null), { position: H } = ze(
+    })), N = E(null), u = E(null), { position: H } = ze(
       T,
       N,
-      c,
+      u,
       e.tooltipRespectsTopEdge
     ), ae = i(() => ({
       left: `${H.value.left}px`,
       top: `${H.value.top}px`,
-      opacity: c.value?.opacity || 0
+      opacity: u.value?.opacity || 0
     })), oe = i(
       () => (e.compactHeader ? Me : Fe) + "px"
     );
@@ -314,17 +315,18 @@ const rt = { class: "chart-plane-container" }, it = {
       (s?.data.datasets || []).forEach(ot);
     }, ie = lt(e.testId, $);
     return (t, r) => (p(), S("div", rt, [
-      n(u) || o.keepSubheaderVisible ? (p(), S("div", it, [
-        ue(Ze, {
+      n(c) || o.keepSubheaderVisible ? (p(), S("div", it, [
+        ce(Ze, {
           "chart-type": n(C),
           "onUpdate:chart-type": r[0] || (r[0] = (a) => fe(C) ? C.value = a : null),
-          "type-switcher": n(u) ? o.typeSwitcher : !1,
-          header: n(u) ? o.header : null,
+          "type-switcher": n(c) ? o.typeSwitcher : !1,
+          header: n(c) ? o.header : null,
           subheader: o.subheader,
           "subheader-tooltip": o.subheaderTooltip,
+          "header-tooltip": o.headerTooltip,
           "trend-tooltip": o.trendTooltip,
           compact: o.compactHeader,
-          "trend-value": n(u) ? o.trendValue : null,
+          "trend-value": n(c) ? o.trendValue : null,
           "trend-direction": o.trendDirection,
           "note-text": o.noteText,
           "test-id": o.testId
@@ -336,9 +338,9 @@ const rt = { class: "chart-plane-container" }, it = {
             ]),
             key: "0"
           } : void 0
-        ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction", "note-text", "test-id"])
+        ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "header-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction", "note-text", "test-id"])
       ])) : L("", !0),
-      n(u) ? (p(), S("section", nt, [
+      n(c) ? (p(), S("section", nt, [
         R("div", st, [
           R("canvas", {
             ref_key: "chartRef",
@@ -351,16 +353,16 @@ const rt = { class: "chart-plane-container" }, it = {
             class: "chart__tooltip",
             style: Te(n(ae))
           }, [
-            c.value ? (p(), I(We, {
+            u.value ? (p(), I(We, {
               key: 0,
               "totals-chart": n(f),
-              title: String(c.value.title),
-              "data-points": c.value.dataPoints,
+              title: String(u.value.title),
+              "data-points": u.value.dataPoints,
               "x-axis-format": o.xAxisFormat,
               "y-axis-format": o.yAxisFormat,
               "x-axis-date-interval": o.xAxisDateInterval,
-              "total-label": c.value.footer?.[0],
-              "total-value": Number(c.value.footer?.[1]),
+              "total-label": u.value.footer?.[0],
+              "total-value": Number(u.value.footer?.[1]),
               "value-suffix": o.valueSuffix,
               "value-prefix": o.valuePrefix,
               "test-id": o.testId

package/components/chart/ChartStoryArgs.d.ts

@@ -68,6 +68,12 @@ export declare const chartStoryArgs: {
             category: string;
         };
     };
+    headerTooltip: {
+        table: {
+            category: string;
+        };
+        description: string;
+    };
     subheader: {
         table: {
             category: string;

package/components/chart/index.d.ts

@@ -27,6 +27,7 @@ declare const ChartTypes: () => ({
             trendTooltip: any;
             subheader: string;
             subheaderTooltip: any;
+            headerTooltip: string;
             trendValue: string | number;
             trendDirection: TrendDirection;
             noteText: string;
@@ -146,6 +147,10 @@ declare const ChartTypes: () => ({
                 }>;
                 default: any;
             };
+            headerTooltip: {
+                type: import("vue").PropType<string>;
+                default: any;
+            };
             trendValue: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -239,7 +244,7 @@ declare const ChartTypes: () => ({
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:sortSelected"?: (sortOption: unknown) => any;
             "onUpdate:chartType"?: (chartType: ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "testId" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "noteText" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "indicateIncompleteData" | "tooltipExcludeTotalItem" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts" | "colorVariant">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "testId" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "headerTooltip" | "trendValue" | "trendDirection" | "noteText" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "indicateIncompleteData" | "tooltipExcludeTotalItem" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts" | "colorVariant">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -350,6 +355,10 @@ declare const ChartTypes: () => ({
                 }>;
                 default: any;
             };
+            headerTooltip: {
+                type: import("vue").PropType<string>;
+                default: any;
+            };
             trendValue: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -470,6 +479,7 @@ declare const ChartTypes: () => ({
             trendTooltip: any;
             subheader: string;
             subheaderTooltip: any;
+            headerTooltip: string;
             trendValue: string | number;
             trendDirection: TrendDirection;
             noteText: string;
@@ -609,6 +619,10 @@ declare const ChartTypes: () => ({
             }>;
             default: any;
         };
+        headerTooltip: {
+            type: import("vue").PropType<string>;
+            default: any;
+        };
         trendValue: {
             type: import("vue").PropType<string | number>;
             default: any;
@@ -803,6 +817,10 @@ declare const ChartTypes: () => ({
         }>;
         default: any;
     };
+    headerTooltip: {
+        type: import("vue").PropType<string>;
+        default: any;
+    };
     trendValue: {
         type: import("vue").PropType<string | number>;
         default: any;
@@ -923,6 +941,7 @@ declare const ChartTypes: () => ({
     trendTooltip: any;
     subheader: string;
     subheaderTooltip: any;
+    headerTooltip: string;
     trendValue: string | number;
     trendDirection: TrendDirection;
     noteText: string;

package/components/emptyState/v3/EmptyState.vue.d.ts

@@ -5,7 +5,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     isHorizontal?: boolean;
     hasIcon?: boolean;
     isBordered?: boolean;
-    iconName?: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "frame" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
+    iconName?: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "frame" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
     fontSize?: string;
     size?: "sm" | "lg";
     iconWidth: number;
@@ -31,7 +31,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     isHorizontal?: boolean;
     hasIcon?: boolean;
     isBordered?: boolean;
-    iconName?: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "frame" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
+    iconName?: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "frame" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
     fontSize?: string;
     size?: "sm" | "lg";
     iconWidth: number;
@@ -56,7 +56,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     iconWidth: number;
     iconHeight: number;
     fontSize: string;
-    iconName: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "frame" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
+    iconName: "filter" | "a" | "b" | "link" | "style" | "image" | "switch" | "search" | "ab-test" | "help" | "block" | "add" | "rotate" | "visibility" | "border-color" | "info" | "success" | "warning" | "error" | "close" | "check-circle" | "warning-octagon" | "cancel" | "pause" | "frame" | "android" | "ios" | "FiltersSearch" | "a-2" | "ab-test-2" | "a-circle" | "account-balance-wallet" | "account-circle" | "account-circle-outline" | "analytics" | "angle-down" | "angle-left" | "angle-right" | "angle-up" | "app-store" | "area-chart" | "arrow-back" | "arrow-downward" | "arrow-forward" | "arrow-left" | "arrow-right" | "arrow-sort-down" | "arrow-sort-up" | "arrow-upward" | "auto-awesome" | "auto-mode" | "hammer" | "autorenew" | "b-2" | "b-circle" | "banner" | "bidding" | "bidding-2" | "bug" | "bullhorn" | "bullseye-arrow" | "cached" | "calendar" | "calendar-today" | "chart-bar" | "chart-line" | "chart-mixed" | "check" | "check-bold" | "close-bold" | "computer-mouse" | "copy-to-clipboard" | "widgets-flat-squares" | "adjust" | "copy-to-clipboard-filled" | "cube" | "cube-background" | "marketing" | "create" | "creative" | "cross" | "crown-fill" | "cup" | "cup-a" | "cup-b" | "delete" | "diamond" | "dots" | "download" | "download-2" | "download-done" | "drag-indicator" | "duplicate" | "ecpi" | "email" | "email-envelope" | "eye" | "favorite-border" | "filter-list" | "fullscreen" | "fullscreen-exit" | "functions" | "gamepad-alt" | "games" | "gavel" | "gift" | "git-hub" | "globe-stand" | "google-play" | "group" | "hand-pointer" | "hands" | "heartbeat" | "help-outline" | "history" | "image-not-supported" | "image-slash" | "import-export" | "import-export-2" | "importent" | "info-outline" | "insights" | "interstitial" | "ios-14" | "js" | "landscape" | "launch" | "levelplay" | "limit-circle" | "limit-octagon" | "loading-clean" | "lock" | "lock-open" | "login" | "logout" | "military-tech" | "mix" | "mix-2" | "mobile-landscape" | "mobile-portrait" | "money-check" | "more-horiz" | "more-vert" | "mouse" | "mouse-pointer" | "moving-up" | "notifications-none" | "offerwall" | "palyable" | "paper-plane-off" | "paper-plane" | "pause-circle-filled" | "pause-circle-outline" | "phone-iphone" | "photo" | "photo-2" | "play-arrow" | "play-circle-filled-white" | "play-circle-outline" | "qrcode" | "quick-ab" | "quick-ab-2" | "react" | "redo" | "refresh" | "remove" | "replay" | "rewarded-video" | "rocket-launch" | "route" | "sack-dollar" | "schedule" | "search-bold" | "share" | "slack" | "sports-esports" | "star" | "star-fill" | "status-banner" | "status-interstitial" | "status-offerwall" | "status-rewarded-video" | "stop-circle-filled" | "stop-circle-outline" | "success-full" | "table-edit" | "tablet-landscape" | "tablet-mac" | "tablet-portrait" | "texture" | "theme-dark" | "theme-light" | "timelapse" | "timeline" | "trending-down" | "trending-flat" | "trending-up" | "tune" | "two-tone-banner" | "two-tone-interstitial" | "two-tone-offerwall" | "two-tone-rewarded-video" | "undo" | "unfold-less" | "unfold-more" | "vertical-align-top" | "vertical-align-top-2" | "vibration" | "video-round" | "view-carousel" | "visibility-off" | "visibility-off-strok" | "visibility-strok" | "volume-off" | "volume-up" | "warning-2" | "web-app" | "widgets" | "widgets-fill" | "widgetsz" | "wifi-protected-setup" | "native-ad" | "status-native-ad" | "two-tone-native-ad" | "question" | "info-v4" | "check-v4" | "warning-circle" | "eye-v4" | "eye-slash" | "warning-v4";
     subtitle: string;
     buttonText: string;
     isHorizontal: boolean;