@ironsource/shared-ui 2.1.6-rc.35 → 2.1.6-rc.36

package/DataGrid.vue_vue_type_style_index_0_scoped_ac14037f_lang.css

@@ -0,0 +1 @@
+.sticky[data-v-ac14037f]{position:sticky}.table-container[data-v-ac14037f]{width:100%;position:relative;display:flex;flex-direction:column}.table-header[data-v-ac14037f]{display:flex;align-items:center;height:calc(var(--spacing-800) - 1px);border-bottom:1px solid var(--common-divider);background-color:var(--background-paper-elevation-0);position:sticky;left:0;padding:var(--spacing-300)}.table-header .table-title[data-v-ac14037f]{display:flex;flex:1;align-items:center;justify-content:flex-start;height:100%;color:var(--text-primary)}.table-header .table-header-right[data-v-ac14037f]{display:flex;align-items:center;height:100%}.table-header .search-wrapper[data-v-ac14037f]{width:13.75rem}.table-header.isStickyHeader[data-v-ac14037f]{z-index:calc(var(--27aa1cb6) + 3);top:0}.table-head-container[data-v-ac14037f]{display:flex;align-items:center;white-space:nowrap;color:var(--text-primary)}.table-footer[data-v-ac14037f]{color:var(--text-primary);background-color:var(--background-paper-elevation-0);padding:0 var(--spacing-300);display:flex;align-items:center;min-height:var(--spacing-600);border:1px solid var(--common-divider);border-radius:var(--border-radius-md);border-top-right-radius:0;border-top-left-radius:0}.table-body-wrapper[data-v-ac14037f]{display:inline-table}.table-header-actions[data-v-ac14037f]{margin-left:var(--spacing-100);display:flex;align-items:center}.table-row[data-v-ac14037f]{position:relative}.table-row.loading[data-v-ac14037f]{opacity:.7}.table-row:not(.expanded):last-child>td[data-v-ac14037f]{border-bottom:none}.table-row.expanded:last-child>.expanded-row[data-v-ac14037f]{border-bottom:none}.expanded-row[data-v-ac14037f]{grid-column:var(--db2e22ac);border-bottom:1px solid var(--common-divider);background-color:var(--background-default)}table[data-v-ac14037f]{position:relative;display:block;overflow:auto;background:var(--background-paper-elevation-0);border:1px solid var(--common-divider);color:var(--text-primary);text-align:left;table-layout:fixed;width:100%;max-height:100%;border-radius:var(--border-radius-md);border-collapse:collapse;border-spacing:0}table.hasFooter[data-v-ac14037f]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none}table td[data-v-ac14037f],table th[data-v-ac14037f]{line-height:normal;padding:0 var(--spacing-200)}table td[data-v-ac14037f]:first-of-type,table th[data-v-ac14037f]:first-of-type{padding-left:var(--spacing-300)}table td[data-v-ac14037f]:last-of-type,table th[data-v-ac14037f]:last-of-type{padding-right:var(--spacing-300)}table td.expand-toggle-cell[data-v-ac14037f],table th.expand-toggle-cell[data-v-ac14037f]{padding-left:var(--spacing-150);padding-right:var(--spacing-75)}table>thead[data-v-ac14037f]{border-bottom:none;z-index:calc(var(--27aa1cb6) + 1);display:inline-table;min-width:100%}table>thead>tr[data-v-ac14037f]{color:var(--text-primary);border-bottom:1px solid var(--common-divider);height:var(--spacing-500);display:grid;grid-template-columns:var(--63b3ff23)}table>thead>tr>th[data-v-ac14037f]{background:var(--background-paper-elevation-0);width:100%;display:flex;align-items:center;cursor:default}table>thead>tr>th.bordered[data-v-ac14037f]{border-right:1px solid var(--common-divider)}table>thead>tr>th.bordered.isStickyRight[data-v-ac14037f]{border-right:none;border-left:1px solid var(--common-divider)}table>thead>tr>th.isTextRight[data-v-ac14037f]{justify-content:flex-end}table>thead>tr>th.isSortable[data-v-ac14037f]{cursor:pointer}table>thead.sticky[data-v-ac14037f]{position:sticky;top:0;background:white}table>thead.isStickyHeader[data-v-ac14037f]{z-index:calc(var(--27aa1cb6) + 2);top:calc(var(--spacing-800) - 1px)}table>tbody[data-v-ac14037f]{display:block}table>tbody>*>tr[data-v-ac14037f]{background-color:var(--background-default);min-height:var(--41c9b22a);height:auto;display:grid;align-items:center;grid-template-columns:var(--63b3ff23)}table>tbody>*>tr:nth-of-type(2n)>td[data-v-ac14037f]{background-color:var(--background-default)}table>tbody>*>tr:hover:not(.loading)>td[data-v-ac14037f],table>tbody>*>tr.activeMenu>td[data-v-ac14037f]{background-color:var(--background-paper-elevation-1)}table>tbody td[data-v-ac14037f]{background-color:var(--background-default);border:none;min-width:0;display:flex;min-height:var(--41c9b22a);height:auto;width:100%;place-items:center;border-bottom:1px solid var(--common-divider);justify-content:start}table>tbody td.bordered[data-v-ac14037f]{border-right:1px solid var(--common-divider)}table>tbody td.bordered.isStickyRight[data-v-ac14037f]{border-right:none;border-left:1px solid var(--common-divider)}table>tbody td.isTextRight[data-v-ac14037f]{justify-content:flex-end;text-align:right}.section-container[data-v-ac14037f]{left:0}.sections[data-v-ac14037f]{display:flex}.section[data-v-ac14037f]{padding:0 1.5rem;background:var(--background-default);left:0;height:32px;display:flex;align-items:flex-end;border-right:1px solid var(--common-divider)}.table-cell[data-v-ac14037f]{width:100%}.empty-state[data-v-ac14037f]{min-height:250px}

package/components/table/v4/DataGrid.vue.d.ts

@@ -64,6 +64,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     loadMore: () => void;
     selectAll: (value: boolean) => void;
     selectRow: (value: boolean) => void;
+    clickRow: (rowIndex: number) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title?: string;
     columns: Column[];
@@ -129,6 +130,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     "onUpdate:selection"?: (selection: unknown[]) => any;
     onOnClearSearch?: () => any;
     onSelectRow?: (value: boolean) => any;
+    onClickRow?: (rowIndex: number) => any;
 }, {
     sort: Sort;
     title: string;

package/components/table/v4/DataGrid.vue.js

@@ -1,7 +1,7 @@
 import o from "./DataGrid.vue2.js";
-/* empty css               */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../DataGrid.vue_vue_type_style_index_0_scoped_b5729ec6_lang.css"; //*');
-const a = /* @__PURE__ */ e(o, [["__scopeId", "data-v-b5729ec6"]]);
+/* empty css               */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../DataGrid.vue_vue_type_style_index_0_scoped_ac14037f_lang.css"; //*');
+const s = /* @__PURE__ */ _(o, [["__scopeId", "data-v-ac14037f"]]);
 export {
-  a as default
+  s as default
 };

package/components/table/v4/DataGrid.vue2.js

@@ -1,11 +1,11 @@
- import "../../../DataGrid.vue_vue_type_style_index_0_scoped_b5729ec6_lang.css"; import { defineComponent as se, useCssVars as ae, unref as t, useSlots as le, computed as g, openBlock as l, createElementBlock as d, createElementVNode as h, normalizeStyle as x, normalizeClass as f, renderSlot as c, createVNode as y, withCtx as T, createTextVNode as C, toDisplayString as E, isRef as ie, createCommentVNode as u, Fragment as w, renderList as B, createBlock as z, mergeProps as de } from "vue";
+ import "../../../DataGrid.vue_vue_type_style_index_0_scoped_ac14037f_lang.css"; import { defineComponent as se, useCssVars as ae, unref as t, useSlots as le, computed as g, openBlock as l, createElementBlock as d, createElementVNode as h, normalizeStyle as x, normalizeClass as f, renderSlot as r, createVNode as y, withCtx as C, createTextVNode as T, toDisplayString as E, isRef as ie, createCommentVNode as u, Fragment as w, renderList as B, createBlock as z, mergeProps as de } from "vue";
 import I from "../../typography/v4/Typography.vue.js";
 import oe from "../../skeleton/v4/SkeletonV4.vue.js";
 import ne from "../../emptyState/v4/EmptyStateV4.vue.js";
 import D from "../../checkbox/v4/CheckboxV4.vue.js";
 import { TableTestIdModifiers as S } from "../../../testids/index.js";
-import { tableCommon as re } from "../common/Table.common.js";
-import ce from "./SortIcon.vue.js";
+import { tableCommon as ce } from "../common/Table.common.js";
+import re from "./SortIcon.vue.js";
 import ue from "./HelpIcon.vue.js";
 import he from "./ExpandRowToggle.vue.js";
 import ye from "../../search/v4/SearchV4.vue.js";
@@ -13,10 +13,10 @@ import { useVModel as fe } from "@vueuse/core";
 const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["data-testid"], ve = ["data-testid"], be = { class: "search-wrapper" }, $e = ["data-testid"], Re = ["data-testid"], xe = {
   key: 0,
   class: "checkbox-cell"
-}, Te = {
+}, Ce = {
   key: 1,
   class: "expand-toggle-cell"
-}, Ce = ["onClick"], Ee = { class: "table-head-container" }, we = ["data-testid"], Be = ["onMouseenter"], Ie = {
+}, Te = ["onClick"], Ee = { class: "table-head-container" }, we = ["data-testid"], Be = ["onMouseenter", "onClick"], Ie = {
   key: 0,
   class: "checkbox-cell"
 }, pe = {
@@ -37,8 +37,8 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
     sections: { default: null },
     sort: { default: null },
     selection: { default: null },
-    getRowId: { type: Function, default: (s, r) => r },
-    selectedMatcher: { type: Function, default: (s, r) => s === r },
+    getRowId: { type: Function, default: (s, c) => c },
+    selectedMatcher: { type: Function, default: (s, c) => s === c },
     isSticky: { type: Boolean, default: !0 },
     isStickyHeader: { type: Boolean, default: !1 },
     isLoading: { type: Boolean, default: !1 },
@@ -57,14 +57,14 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
     searchAutoFocus: { type: Boolean, default: !1 },
     zIndexBase: { default: 100 }
   },
-  emits: ["update:sort", "update:search", "update:selection", "onScroll", "onClearSearch", "saveRow", "loadMore", "selectAll", "selectRow"],
-  setup(s, { emit: r }) {
+  emits: ["update:sort", "update:search", "update:selection", "onScroll", "onClearSearch", "saveRow", "loadMore", "selectAll", "selectRow", "clickRow"],
+  setup(s, { emit: c }) {
     const o = s;
     ae((a) => ({
-      "1d168568": s.zIndexBase,
-      "40a246c0": t(J),
-      "68f7a9b9": t(V),
-      "60bffa01": t(q)
+      "27aa1cb6": s.zIndexBase,
+      db2e22ac: t(J),
+      "63b3ff23": t(V),
+      "41c9b22a": t(q)
     }));
     const v = le(), {
       list: P,
@@ -85,7 +85,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
       isRowExpanded: A,
       hasCheckboxes: F,
       activeMenuRow: K
-    } = re(o, r), O = g(() => !!v.footer), k = fe(o, "search", r), X = g(() => o.selection.length || 0), M = g(() => {
+    } = ce(o, c), O = g(() => !!v.footer), m = fe(o, "search", c), X = g(() => o.selection.length || 0), M = g(() => {
       const a = o.rows.map((i, e) => o.getRowId(i, e));
       return a.length && a.every((i) => $(i));
     }), $ = (a) => o.selection.findIndex((i) => o.selectedMatcher(a, i)) !== -1, Z = (a) => {
@@ -93,20 +93,20 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
         o.selection.filter(
           (i) => !o.selectedMatcher(a, i)
         )
-      ), r("selectRow", !1)) : (R([...o.selection, a]), r("selectRow", !0));
+      ), c("selectRow", !1)) : (R([...o.selection, a]), c("selectRow", !0));
     }, _ = () => {
       if (M.value)
-        R([]), r("selectAll", !1);
+        R([]), c("selectAll", !1);
       else {
         const a = o.rows.map((i, e) => o.getRowId(i, e)).filter((i) => !$(i));
-        R([...o.selection, ...a]), r("selectAll", !0);
+        R([...o.selection, ...a]), c("selectAll", !0);
       }
     }, R = (a) => {
-      r("update:selection", a);
+      c("update:selection", a);
     }, ee = g(
-      () => o.emptyStateVariant ?? (k.value ? "no-results" : "no-data")
+      () => o.emptyStateVariant ?? (m.value ? "no-results" : "no-data")
     ), te = g(
-      () => o.emptyStateSubtitle ? o.emptyStateSubtitle : k.value ? "Search again with different filters" : void 0
+      () => o.emptyStateSubtitle ? o.emptyStateSubtitle : m.value ? "Search again with different filters" : void 0
     );
     return (a, i) => (l(), d("div", {
       class: "table-container",
@@ -132,10 +132,10 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
             class: "table-title",
             "data-testid": `${s.testId}-${t(S).TITLE}`
           }, [
-            c(a.$slots, "title", {}, () => [
+            r(a.$slots, "title", {}, () => [
               y(t(I), { variant: "h3" }, {
-                default: T(() => [
-                  C(E(s.title), 1)
+                default: C(() => [
+                  T(E(s.title), 1)
                 ]),
                 _: 1
               })
@@ -145,15 +145,15 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
             class: "table-header-right",
             "data-testid": `${s.testId}-${t(S).HEADER_RIGHT}`
           }, [
-            s.showSearch ? c(a.$slots, "search", { key: 0 }, () => [
+            s.showSearch ? r(a.$slots, "search", { key: 0 }, () => [
               h("div", be, [
                 y(t(ye), {
-                  modelValue: t(k),
-                  "onUpdate:modelValue": i[0] || (i[0] = (e) => ie(k) ? k.value = e : null),
+                  modelValue: t(m),
+                  "onUpdate:modelValue": i[0] || (i[0] = (e) => ie(m) ? m.value = e : null),
                   placeholder: s.searchPlaceholder,
                   "auto-focus": s.searchAutoFocus,
                   "test-id": s.testId,
-                  onOnClear: i[1] || (i[1] = (e) => r("onClearSearch"))
+                  onOnClear: i[1] || (i[1] = (e) => c("onClearSearch"))
                 }, null, 8, ["modelValue", "placeholder", "auto-focus", "test-id"])
               ])
             ], !0) : u("", !0)
@@ -163,7 +163,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
             class: "table-header-actions",
             "data-testid": `${s.testId}-${t(S).ACTIONS}`
           }, [
-            c(a.$slots, "table-header-actions", {}, void 0, !0)
+            r(a.$slots, "table-header-actions", {}, void 0, !0)
           ], 8, $e)) : u("", !0)
         ], 10, me)) : u("", !0),
         h("thead", {
@@ -177,14 +177,14 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
               key: e.id,
               class: f(["section-container", { sticky: e.isSticky }])
             }, [
-              c(a.$slots, `section-${e.id}`, {}, () => [
+              r(a.$slots, `section-${e.id}`, {}, () => [
                 h("div", {
                   style: x({ width: e.width + "px" }),
                   class: f({ section: !0 })
                 }, [
                   y(t(I), { variant: "body2" }, {
-                    default: T(() => [
-                      C(E(e.title), 1)
+                    default: C(() => [
+                      T(E(e.title), 1)
                     ]),
                     _: 2
                   }, 1024)
@@ -194,7 +194,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
           ], 8, Re),
           h("tr", null, [
             t(F) ? (l(), d("th", xe, [
-              c(a.$slots, "select-all-checkbox", {}, () => [
+              r(a.$slots, "select-all-checkbox", {}, () => [
                 y(t(D), {
                   disabled: s.isLoading,
                   "is-checked": t(M),
@@ -203,7 +203,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                 }, null, 8, ["disabled", "is-checked", "is-indeterminate"])
               ], !0)
             ])) : u("", !0),
-            t(b) ? (l(), d("th", Te)) : u("", !0),
+            t(b) ? (l(), d("th", Ce)) : u("", !0),
             (l(!0), d(w, null, B(s.columns, (e) => (l(), d("th", {
               key: e.id,
               class: f({
@@ -215,13 +215,13 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                 [`column-${e.id}`]: !0
               }),
               style: x(e.isSticky ? t(H)[e.id] : null),
-              onClick: (m) => e.isSortable ? t(Y)(e) : null
+              onClick: (k) => e.isSortable ? t(Y)(e) : null
             }, [
               h("div", Ee, [
-                c(a.$slots, `header-${e.id}`, { column: e }, () => [
+                r(a.$slots, `header-${e.id}`, { column: e }, () => [
                   y(t(I), { variant: "tableLabel" }, {
-                    default: T(() => [
-                      C(E(e.title), 1)
+                    default: C(() => [
+                      T(E(e.title), 1)
                     ]),
                     _: 2
                   }, 1024)
@@ -231,12 +231,12 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                   "hover-help-text": e.helpText,
                   "hover-help-text-placement": e.helpTextPlacement
                 }, null, 8, ["hover-help-text", "hover-help-text-placement"])) : u("", !0),
-                e.isSortable && e.id === s.sort?.sortBy ? (l(), z(ce, {
+                e.isSortable && e.id === s.sort?.sortBy ? (l(), z(re, {
                   key: 1,
                   "sort-order": s.sort.sortOrder
                 }, null, 8, ["sort-order"])) : u("", !0)
               ])
-            ], 14, Ce))), 128))
+            ], 14, Te))), 128))
           ])
         ], 2),
         h("tbody", null, [
@@ -253,22 +253,23 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                 activeMenu: t(K) === e.index,
                 expanded: t(b) && t(A)(e.index)
               }]),
-              onMouseenter: (m) => p.value = e.index
+              onMouseenter: (k) => p.value = e.index,
+              onClick: (k) => c("clickRow", e.index)
             }, [
               t(F) ? (l(), d("td", Ie, [
                 y(t(D), {
                   "is-checked": $(s.getRowId(e.data, e.index)),
                   size: "sm",
-                  "onUpdate:isChecked": (m) => Z(s.getRowId(e.data, e.index))
+                  "onUpdate:isChecked": (k) => Z(s.getRowId(e.data, e.index))
                 }, null, 8, ["is-checked", "onUpdate:isChecked"])
               ])) : u("", !0),
               t(b) ? (l(), d("td", pe, [
                 y(he, {
                   expanded: t(A)(e.index),
-                  onClick: (m) => t(j)(e.index, m)
+                  onClick: (k) => t(j)(e.index, k)
                 }, null, 8, ["expanded", "onClick"])
               ])) : u("", !0),
-              (l(!0), d(w, null, B(s.columns, (m, n) => (l(), d("td", {
+              (l(!0), d(w, null, B(s.columns, (k, n) => (l(), d("td", {
                 key: n,
                 class: f({
                   sticky: s.columns[n].isSticky,
@@ -285,7 +286,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                   key: 0,
                   class: f(["table-cell", { last: n === e.data.length - 1 }])
                 }, [
-                  c(a.$slots, `cell-${s.columns[n].id}`, {
+                  r(a.$slots, `cell-${s.columns[n].id}`, {
                     cell: e.data[n],
                     isLoading: t(N).includes(e.index),
                     cellIndex: n,
@@ -293,25 +294,25 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
                     rowIndex: e.index
                   }, () => [
                     y(t(I), { variant: "body1" }, {
-                      default: T(() => [
-                        C(E(e.data[n]), 1)
+                      default: C(() => [
+                        T(E(e.data[n]), 1)
                       ]),
                       _: 2
                     }, 1024)
                   ], !0)
-                ], 2)) : c(a.$slots, "loader", { key: 1 }, () => [
+                ], 2)) : r(a.$slots, "loader", { key: 1 }, () => [
                   y(t(oe), { round: "" })
                 ], !0)
               ], 6))), 128)),
               t(b) && t(A)(e.index) ? (l(), d("div", Ae, [
-                c(a.$slots, "expanded", {
+                r(a.$slots, "expanded", {
                   row: e,
                   gridColumnTemplate: t(V)
                 }, void 0, !0)
               ])) : u("", !0)
             ], 42, Be))), 128))
           ], 16, we)) : (l(), d("div", Me, [
-            c(a.$slots, "empty-state", {}, () => [
+            r(a.$slots, "empty-state", {}, () => [
               y(t(ne), {
                 class: "empty-state",
                 title: s.emptyStateTitle,
@@ -324,7 +325,7 @@ const Se = ["data-testid"], ke = ["data-testid"], me = ["data-testid"], ge = ["d
         ])
       ], 46, ke),
       t(O) ? (l(), d("div", Pe, [
-        c(a.$slots, "footer", {}, void 0, !0)
+        r(a.$slots, "footer", {}, void 0, !0)
       ])) : u("", !0)
     ], 40, Se));
   }

package/components/table/v4/index.d.ts

@@ -145,6 +145,7 @@ declare const DataGridTypes: () => (({
             "onUpdate:selection"?: (selection: unknown[]) => any;
             onOnClearSearch?: () => any;
             onSelectRow?: (value: boolean) => any;
+            onClickRow?: (rowIndex: number) => any;
         } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "sort" | "title" | "search" | "testId" | "isLoading" | "searchAutoFocus" | "searchPlaceholder" | "selection" | "isSticky" | "sections" | "isStickyHeader" | "emptyStateTitle" | "emptyStateSubtitle" | "isInfiniteScroll" | "infiniteScrollThreshold" | "rowHeight" | "loadingRowCount" | "defaultScrollPosition" | "getRowId" | "selectedMatcher" | "emptyStateVariant" | "showSearch" | "zIndexBase">;
         $attrs: {
             [x: string]: unknown;
@@ -162,7 +163,7 @@ declare const DataGridTypes: () => (({
             confirm: () => void;
             rowIndex: number;
             cellIndex: number;
-        }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void);
+        }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void) & ((event: "clickRow", rowIndex: number) => void);
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
             sort: {
@@ -280,6 +281,7 @@ declare const DataGridTypes: () => (({
             "onUpdate:selection"?: (selection: unknown[]) => any;
             onOnClearSearch?: () => any;
             onSelectRow?: (value: boolean) => any;
+            onClickRow?: (rowIndex: number) => any;
         }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             "update:sort": (newSort: import("../common/Table.types").Sort) => void;
             "update:search": (query: string) => void;
@@ -295,6 +297,7 @@ declare const DataGridTypes: () => (({
             loadMore: () => void;
             selectAll: (value: boolean) => void;
             selectRow: (value: boolean) => void;
+            clickRow: (rowIndex: number) => void;
         }, string, {
             sort: import("../common/Table.types").Sort;
             title: string;
@@ -455,6 +458,7 @@ declare const DataGridTypes: () => (({
         "onUpdate:selection"?: (selection: unknown[]) => any;
         onOnClearSearch?: () => any;
         onSelectRow?: (value: boolean) => any;
+        onClickRow?: (rowIndex: number) => any;
     } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
@@ -575,6 +579,7 @@ declare const DataGridTypes: () => (({
     "onUpdate:selection"?: (selection: unknown[]) => any;
     onOnClearSearch?: () => any;
     onSelectRow?: (value: boolean) => any;
+    onClickRow?: (rowIndex: number) => any;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:sort": (newSort: import("../common/Table.types").Sort) => void;
     "update:search": (query: string) => void;
@@ -590,6 +595,7 @@ declare const DataGridTypes: () => (({
     loadMore: () => void;
     selectAll: (value: boolean) => void;
     selectRow: (value: boolean) => void;
+    clickRow: (rowIndex: number) => void;
 }, string, {
     sort: import("../common/Table.types").Sort;
     title: string;

package/index.d.ts

@@ -2883,6 +2883,7 @@ declare const _default: {
                 "onUpdate:selection"?: (selection: unknown[]) => any;
                 onOnClearSearch?: () => any;
                 onSelectRow?: (value: boolean) => any;
+                onClickRow?: (rowIndex: number) => any;
             } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "sort" | "title" | "search" | "testId" | "isLoading" | "searchAutoFocus" | "searchPlaceholder" | "selection" | "isSticky" | "sections" | "isStickyHeader" | "emptyStateTitle" | "emptyStateSubtitle" | "isInfiniteScroll" | "infiniteScrollThreshold" | "rowHeight" | "loadingRowCount" | "defaultScrollPosition" | "getRowId" | "selectedMatcher" | "emptyStateVariant" | "showSearch" | "zIndexBase">;
             $attrs: {
                 [x: string]: unknown;
@@ -2900,7 +2901,7 @@ declare const _default: {
                 confirm: () => void;
                 rowIndex: number;
                 cellIndex: number;
-            }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void);
+            }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void) & ((event: "clickRow", rowIndex: number) => void);
             $el: any;
             $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
                 sort: {
@@ -3018,6 +3019,7 @@ declare const _default: {
                 "onUpdate:selection"?: (selection: unknown[]) => any;
                 onOnClearSearch?: () => any;
                 onSelectRow?: (value: boolean) => any;
+                onClickRow?: (rowIndex: number) => any;
             }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
                 "update:sort": (newSort: tableV3.Sort) => void;
                 "update:search": (query: string) => void;
@@ -3033,6 +3035,7 @@ declare const _default: {
                 loadMore: () => void;
                 selectAll: (value: boolean) => void;
                 selectRow: (value: boolean) => void;
+                clickRow: (rowIndex: number) => void;
             }, string, {
                 sort: tableV3.Sort;
                 title: string;
@@ -3193,6 +3196,7 @@ declare const _default: {
             "onUpdate:selection"?: (selection: unknown[]) => any;
             onOnClearSearch?: () => any;
             onSelectRow?: (value: boolean) => any;
+            onClickRow?: (rowIndex: number) => any;
         } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
         __isFragment?: never;
         __isTeleport?: never;
@@ -3313,6 +3317,7 @@ declare const _default: {
         "onUpdate:selection"?: (selection: unknown[]) => any;
         onOnClearSearch?: () => any;
         onSelectRow?: (value: boolean) => any;
+        onClickRow?: (rowIndex: number) => any;
     }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         "update:sort": (newSort: tableV3.Sort) => void;
         "update:search": (query: string) => void;
@@ -3328,6 +3333,7 @@ declare const _default: {
         loadMore: () => void;
         selectAll: (value: boolean) => void;
         selectRow: (value: boolean) => void;
+        clickRow: (rowIndex: number) => void;
     }, string, {
         sort: tableV3.Sort;
         title: string;
@@ -3596,6 +3602,7 @@ declare const _default: {
                 "onUpdate:selection"?: (selection: unknown[]) => any;
                 onOnClearSearch?: () => any;
                 onSelectRow?: (value: boolean) => any;
+                onClickRow?: (rowIndex: number) => any;
             } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "sort" | "title" | "search" | "testId" | "isLoading" | "searchAutoFocus" | "searchPlaceholder" | "selection" | "isSticky" | "sections" | "isStickyHeader" | "emptyStateTitle" | "emptyStateSubtitle" | "isInfiniteScroll" | "infiniteScrollThreshold" | "rowHeight" | "loadingRowCount" | "defaultScrollPosition" | "getRowId" | "selectedMatcher" | "emptyStateVariant" | "showSearch" | "zIndexBase">;
             $attrs: {
                 [x: string]: unknown;
@@ -3613,7 +3620,7 @@ declare const _default: {
                 confirm: () => void;
                 rowIndex: number;
                 cellIndex: number;
-            }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void);
+            }) => void) & ((event: "loadMore") => void) & ((event: "update:search", query: string) => void) & ((event: "update:selection", selection: unknown[]) => void) & ((event: "onClearSearch") => void) & ((event: "selectRow", value: boolean) => void) & ((event: "clickRow", rowIndex: number) => void);
             $el: any;
             $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
                 sort: {
@@ -3731,6 +3738,7 @@ declare const _default: {
                 "onUpdate:selection"?: (selection: unknown[]) => any;
                 onOnClearSearch?: () => any;
                 onSelectRow?: (value: boolean) => any;
+                onClickRow?: (rowIndex: number) => any;
             }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
                 "update:sort": (newSort: tableV3.Sort) => void;
                 "update:search": (query: string) => void;
@@ -3746,6 +3754,7 @@ declare const _default: {
                 loadMore: () => void;
                 selectAll: (value: boolean) => void;
                 selectRow: (value: boolean) => void;
+                clickRow: (rowIndex: number) => void;
             }, string, {
                 sort: tableV3.Sort;
                 title: string;
@@ -3906,6 +3915,7 @@ declare const _default: {
             "onUpdate:selection"?: (selection: unknown[]) => any;
             onOnClearSearch?: () => any;
             onSelectRow?: (value: boolean) => any;
+            onClickRow?: (rowIndex: number) => any;
         } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
         __isFragment?: never;
         __isTeleport?: never;
@@ -4026,6 +4036,7 @@ declare const _default: {
         "onUpdate:selection"?: (selection: unknown[]) => any;
         onOnClearSearch?: () => any;
         onSelectRow?: (value: boolean) => any;
+        onClickRow?: (rowIndex: number) => any;
     }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         "update:sort": (newSort: tableV3.Sort) => void;
         "update:search": (query: string) => void;
@@ -4041,6 +4052,7 @@ declare const _default: {
         loadMore: () => void;
         selectAll: (value: boolean) => void;
         selectRow: (value: boolean) => void;
+        clickRow: (rowIndex: number) => void;
     }, string, {
         sort: tableV3.Sort;
         title: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ironsource/shared-ui",
-  "version": "2.1.6-rc.35",
+  "version": "2.1.6-rc.36",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"

package/DataGrid.vue_vue_type_style_index_0_scoped_b5729ec6_lang.css

@@ -1 +0,0 @@
-.sticky[data-v-b5729ec6]{position:sticky}.table-container[data-v-b5729ec6]{width:100%;position:relative;display:flex;flex-direction:column}.table-header[data-v-b5729ec6]{display:flex;align-items:center;height:calc(var(--spacing-800) - 1px);border-bottom:1px solid var(--common-divider);background-color:var(--background-paper-elevation-0);position:sticky;left:0;padding:var(--spacing-300)}.table-header .table-title[data-v-b5729ec6]{display:flex;flex:1;align-items:center;justify-content:flex-start;height:100%;color:var(--text-primary)}.table-header .table-header-right[data-v-b5729ec6]{display:flex;align-items:center;height:100%}.table-header .search-wrapper[data-v-b5729ec6]{width:13.75rem}.table-header.isStickyHeader[data-v-b5729ec6]{z-index:calc(var(--1d168568) + 3);top:0}.table-head-container[data-v-b5729ec6]{display:flex;align-items:center;white-space:nowrap;color:var(--text-primary)}.table-footer[data-v-b5729ec6]{color:var(--text-primary);background-color:var(--background-paper-elevation-0);padding:0 var(--spacing-300);display:flex;align-items:center;min-height:var(--spacing-600);border:1px solid var(--common-divider);border-radius:var(--border-radius-md);border-top-right-radius:0;border-top-left-radius:0}.table-body-wrapper[data-v-b5729ec6]{display:inline-table}.table-header-actions[data-v-b5729ec6]{margin-left:var(--spacing-100);display:flex;align-items:center}.table-row[data-v-b5729ec6]{position:relative}.table-row.loading[data-v-b5729ec6]{opacity:.7}.table-row:not(.expanded):last-child>td[data-v-b5729ec6]{border-bottom:none}.table-row.expanded:last-child>.expanded-row[data-v-b5729ec6]{border-bottom:none}.expanded-row[data-v-b5729ec6]{grid-column:var(--40a246c0);border-bottom:1px solid var(--common-divider);background-color:var(--background-default)}table[data-v-b5729ec6]{position:relative;display:block;overflow:auto;background:var(--background-paper-elevation-0);border:1px solid var(--common-divider);color:var(--text-primary);text-align:left;table-layout:fixed;width:100%;max-height:100%;border-radius:var(--border-radius-md);border-collapse:collapse;border-spacing:0}table.hasFooter[data-v-b5729ec6]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none}table td[data-v-b5729ec6],table th[data-v-b5729ec6]{line-height:normal;padding:0 var(--spacing-200)}table td[data-v-b5729ec6]:first-of-type,table th[data-v-b5729ec6]:first-of-type{padding-left:var(--spacing-300)}table td[data-v-b5729ec6]:last-of-type,table th[data-v-b5729ec6]:last-of-type{padding-right:var(--spacing-300)}table td.expand-toggle-cell[data-v-b5729ec6],table th.expand-toggle-cell[data-v-b5729ec6]{padding-left:var(--spacing-150);padding-right:var(--spacing-75)}table>thead[data-v-b5729ec6]{border-bottom:none;z-index:calc(var(--1d168568) + 1);display:inline-table;min-width:100%}table>thead>tr[data-v-b5729ec6]{color:var(--text-primary);border-bottom:1px solid var(--common-divider);height:var(--spacing-500);display:grid;grid-template-columns:var(--68f7a9b9)}table>thead>tr>th[data-v-b5729ec6]{background:var(--background-paper-elevation-0);width:100%;display:flex;align-items:center;cursor:default}table>thead>tr>th.bordered[data-v-b5729ec6]{border-right:1px solid var(--common-divider)}table>thead>tr>th.bordered.isStickyRight[data-v-b5729ec6]{border-right:none;border-left:1px solid var(--common-divider)}table>thead>tr>th.isTextRight[data-v-b5729ec6]{justify-content:flex-end}table>thead>tr>th.isSortable[data-v-b5729ec6]{cursor:pointer}table>thead.sticky[data-v-b5729ec6]{position:sticky;top:0;background:white}table>thead.isStickyHeader[data-v-b5729ec6]{z-index:calc(var(--1d168568) + 2);top:calc(var(--spacing-800) - 1px)}table>tbody[data-v-b5729ec6]{display:block}table>tbody>*>tr[data-v-b5729ec6]{background-color:var(--background-default);min-height:var(--60bffa01);height:auto;display:grid;align-items:center;grid-template-columns:var(--68f7a9b9)}table>tbody>*>tr:nth-of-type(2n)>td[data-v-b5729ec6]{background-color:var(--background-default)}table>tbody>*>tr:hover:not(.loading)>td[data-v-b5729ec6],table>tbody>*>tr.activeMenu>td[data-v-b5729ec6]{background-color:var(--background-paper-elevation-1)}table>tbody td[data-v-b5729ec6]{background-color:var(--background-default);border:none;min-width:0;display:flex;min-height:var(--60bffa01);height:auto;width:100%;place-items:center;border-bottom:1px solid var(--common-divider);justify-content:start}table>tbody td.bordered[data-v-b5729ec6]{border-right:1px solid var(--common-divider)}table>tbody td.bordered.isStickyRight[data-v-b5729ec6]{border-right:none;border-left:1px solid var(--common-divider)}table>tbody td.isTextRight[data-v-b5729ec6]{justify-content:flex-end;text-align:right}.section-container[data-v-b5729ec6]{left:0}.sections[data-v-b5729ec6]{display:flex}.section[data-v-b5729ec6]{padding:0 1.5rem;background:var(--background-default);left:0;height:32px;display:flex;align-items:flex-end;border-right:1px solid var(--common-divider)}.table-cell[data-v-b5729ec6]{width:100%}.empty-state[data-v-b5729ec6]{min-height:250px}