@kong-ui-public/table-data-grid 0.7.3 → 0.7.4-pr.3892.c83ecea95.0

package/dist/table-data-grid.es.js

@@ -1,719 +0,0 @@
-import { computed as m, watch as M, ref as L, shallowRef as q, readonly as J, shallowReadonly as Ce, defineComponent as ie, onMounted as ue, onUnmounted as ge, nextTick as pe, resolveComponent as ce, openBlock as K, createElementBlock as _, normalizeClass as de, createElementVNode as H, createBlock as te, resolveDynamicComponent as oe, withCtx as le, createVNode as ae, toDisplayString as ne, createCommentVNode as Q, normalizeStyle as he, h as ye, renderSlot as X, useSlots as be, useTemplateRef as Se, onBeforeUnmount as ke, toRef as $, unref as D } from "vue";
-import { AgGridVue as we } from "ag-grid-vue3";
-import { ModuleRegistry as De, AllCommunityModule as Re, ClientSideRowModelModule as Oe, InfiniteRowModelModule as Te, themeQuartz as Ee } from "ag-grid-community";
-import { createI18n as xe, i18nTComponent as Ke } from "@kong-ui-public/i18n";
-var j = /* @__PURE__ */ ((e) => (e.PENDING = "PENDING", e.LOADING = "LOADING", e.SUCCESS = "SUCCESS", e.ERROR = "ERROR", e))(j || {});
-const Ie = (e) => !!e?.length;
-function Fe(e, a, t, l = Ie) {
-  const o = m(() => l(e.value)), n = m(() => {
-    const u = e.value !== void 0, r = a.value !== void 0 && a.value !== null;
-    return t.value ? "LOADING" : o.value ? "SUCCESS" : r ? "ERROR" : u ? "SUCCESS" : "PENDING";
-  });
-  return {
-    fetchState: j,
-    hasData: o,
-    state: n
-  };
-}
-const Ge = ({
-  emitState: e,
-  fetchLifecycleState: a,
-  hasData: t
-}) => {
-  M(
-    () => ({
-      hasData: t.value,
-      state: a.value
-    }),
-    ({ hasData: l, state: o }) => {
-      if (o !== j.PENDING) {
-        if (o === j.LOADING) {
-          e({
-            hasData: l,
-            state: "loading"
-          });
-          return;
-        }
-        if (o === j.ERROR) {
-          e({
-            hasData: l,
-            state: "error"
-          });
-          return;
-        }
-        e({
-          hasData: l,
-          state: "success"
-        });
-      }
-    }
-  );
-}, ze = ({ startRow: e, endRow: a }) => {
-  const t = a - e;
-  return {
-    blockIndex: t > 0 ? Math.floor(e / t) : 0,
-    pageSize: t
-  };
-}, Ne = ({
-  startRow: e,
-  rowsLength: a,
-  pageSize: t,
-  total: l,
-  hasMore: o
-}) => {
-  if (typeof l == "number")
-    return l;
-  if (o !== !0 && (o === !1 || a < t))
-    return e + a;
-}, _e = ({
-  fetcher: e,
-  resetKey: a,
-  sort: t
-}) => {
-  const l = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), n = L(0), g = L(0), u = q(), r = q(), f = q(), b = L(0), w = L(!1);
-  let p, R, B = t?.value?.sortColumnKey, s = t?.value?.sortColumnOrder;
-  const v = (c) => c === n.value && p === e.value && R === a?.value, S = (c, d) => v(c) && d === g.value && B === t?.value?.sortColumnKey && s === t?.value?.sortColumnOrder, A = (c) => {
-    if (!t)
-      return !0;
-    const d = t.value;
-    return !d?.sortColumnKey || !d.sortColumnOrder ? c.length === 0 : c.length === 1 && c[0].colId === d.sortColumnKey && c[0].sort === d.sortColumnOrder;
-  }, T = () => {
-    w.value = b.value > 0;
-  }, E = () => {
-    g.value += 1, B = t?.value?.sortColumnKey, s = t?.value?.sortColumnOrder;
-    for (const c of o.values())
-      c.resolve(!1);
-    l.clear(), o.clear(), r.value = void 0, f.value = void 0, b.value = 0, T();
-  }, I = () => {
-    f.value = void 0, b.value += 1, T();
-  }, P = () => {
-    b.value = Math.max(0, b.value - 1), T();
-  }, F = (c) => {
-    const d = o.get(c);
-    if (d)
-      return d;
-    let C;
-    const y = {
-      promise: new Promise((k) => {
-        C = k;
-      }),
-      resolve: (k) => C(k)
-    };
-    return o.set(c, y), y;
-  }, O = (c, d) => {
-    d.resolve(!1), o.get(c) === d && o.delete(c);
-  }, U = async ({
-    blockIndex: c,
-    currentBlockCompletion: d,
-    datasourceId: C,
-    requestGeneration: y
-  }) => {
-    if (c === 0)
-      return "ready";
-    const k = o.get(c - 1);
-    if (!k)
-      return O(c, d), "failed";
-    const z = await k.promise;
-    return S(C, y) ? z ? "ready" : (O(c, d), "failed") : (O(c, d), "stale");
-  }, h = ({
-    blockIndex: c,
-    currentBlockCompletion: d,
-    getRowsParams: C,
-    pageSize: y,
-    result: k
-  }) => {
-    k.cursor !== void 0 && l.set(c, k.cursor), C.successCallback(k.data, Ne({
-      startRow: C.startRow,
-      rowsLength: k.data.length,
-      pageSize: y,
-      total: k.total,
-      hasMore: k.hasMore
-    })), C.startRow === 0 && (r.value = k.data), d.resolve(!0);
-  }, x = ({
-    blockIndex: c,
-    currentBlockCompletion: d,
-    fetchError: C,
-    getRowsParams: y
-  }) => {
-    f.value = C, y.failCallback(), O(c, d);
-  }, G = () => {
-    const c = e.value;
-    if (!c)
-      throw new Error("TableDataGrid requires a fetcher in infinite mode");
-    p = c, R = a?.value;
-    const d = n.value + 1;
-    return n.value = d, E(), {
-      async getRows(C) {
-        if (!v(d) || !A(C.sortModel)) {
-          C.failCallback();
-          return;
-        }
-        const {
-          blockIndex: y,
-          pageSize: k
-        } = ze({
-          startRow: C.startRow,
-          endRow: C.endRow
-        });
-        y === 0 && o.has(0) && E();
-        const z = g.value, i = F(y);
-        if (await U({
-          blockIndex: y,
-          currentBlockCompletion: i,
-          datasourceId: d,
-          requestGeneration: z
-        }) !== "ready" || !S(d, z)) {
-          C.failCallback(), O(y, i);
-          return;
-        }
-        I();
-        try {
-          const N = y > 0 ? l.get(y - 1) : void 0, Z = await c({
-            mode: "infinite",
-            pageSize: k,
-            cursor: N,
-            // Always read the latest sort, not a stale one.
-            sort: t?.value
-          });
-          if (!S(d, z)) {
-            C.failCallback(), O(y, i);
-            return;
-          }
-          h({
-            blockIndex: y,
-            currentBlockCompletion: i,
-            getRowsParams: C,
-            pageSize: k,
-            result: Z
-          });
-        } catch (N) {
-          if (!S(d, z)) {
-            C.failCallback(), O(y, i);
-            return;
-          }
-          x({
-            blockIndex: y,
-            currentBlockCompletion: i,
-            fetchError: N,
-            getRowsParams: C
-          });
-        } finally {
-          S(d, z) && P();
-        }
-      }
-    };
-  }, W = () => {
-    u.value = G();
-  };
-  return M(
-    [e, () => a?.value],
-    () => {
-      W();
-    },
-    { immediate: !0 }
-  ), M(
-    [() => t?.value?.sortColumnKey, () => t?.value?.sortColumnOrder],
-    () => E()
-  ), {
-    datasource: J(u),
-    data: Ce(r),
-    error: J(f),
-    isFetching: J(w)
-  };
-}, Me = { title: "No Data", message: "There is no data to display." }, Be = { title: "An error occurred", message: "Data cannot be displayed due to an error." }, Ae = {
-  emptyState: Me,
-  errorState: Be
-};
-function ve() {
-  const e = xe("en-us", Ae);
-  return {
-    i18n: e,
-    i18nT: Ke(e)
-    // Translation component <i18n-t>
-  };
-}
-const { i18n: Ve } = ve(), me = (e, a) => {
-  const t = Reflect.get(a, e.key);
-  return e.valueFormatter ? e.valueFormatter(t, a) : String(t ?? "");
-}, Y = (e) => typeof e != "number" ? null : Number.isFinite(e) ? e : null, $e = (e, a) => e.reduce(
-  (t, l) => {
-    const o = Y(Reflect.get(l, a.key));
-    return o === null ? t : {
-      sum: t.sum + o,
-      max: Math.max(t.max, o)
-    };
-  },
-  { sum: 0, max: 0 }
-), Le = (e, a) => {
-  const t = (a ?? []).filter((n) => Number.isFinite(n.value) && e >= n.value);
-  if (!t.length)
-    return;
-  const l = Math.max(...t.map((n) => n.value));
-  return t.filter((n) => n.value === l).some((n) => n.type === "error") ? "error" : "warning";
-}, Pe = (e, a, t) => {
-  if (e === null)
-    return 0;
-  const l = t === "relative" ? a.sum : a.max;
-  return l > 0 ? Math.min(Math.max(e / l, 0), 1) : 0;
-}, Ue = (e) => {
-  const a = (t) => Ve.formatNumber(t, { maximumFractionDigits: 2 });
-  return e > 0 && e < 0.01 ? `< ${a(0.01)} %` : `${a(e)} %`;
-}, fe = ({
-  value: e,
-  stats: a,
-  header: t
-}) => {
-  if (e === null || a.sum <= 0)
-    return;
-  const l = e / a.sum * 100;
-  return t.percentageFormatter?.(l) ?? Ue(l);
-}, re = (e, a) => a !== void 0 && a.length > (e?.length ?? -1) ? a : e, We = ({
-  rows: e,
-  header: a,
-  stats: t
-}) => e.reduce(
-  (l, o) => ({
-    value: re(l.value, me(a, o)) ?? "",
-    relative: a.showPercentage ? re(l.relative, fe({
-      value: Y(Reflect.get(o, a.key)),
-      stats: t,
-      header: a
-    })) : void 0
-  }),
-  { value: "" }
-), qe = ["data-threshold"], He = { class: "table-data-grid-cell-label-track" }, je = { class: "table-data-grid-cell-label" }, Qe = {
-  key: 0,
-  class: "table-data-grid-cell-relative",
-  "data-testid": "table-data-grid-cell-relative"
-}, Je = {
-  key: 0,
-  "aria-hidden": "true",
-  class: "table-data-grid-cell-label table-data-grid-cell-label-sizer"
-}, Xe = ["data-text"], Ye = ["data-text"], Ze = ["data-threshold"], et = /* @__PURE__ */ ie({
-  name: "TableDataGridCellRenderer",
-  __name: "TableDataGridCellRenderer",
-  props: {
-    params: {}
-  },
-  setup(e, { expose: a }) {
-    const t = q(e.params), l = L(null), o = L(!1), n = m(() => t.value.headerDef ?? {
-      key: "",
-      label: ""
-    }), g = m(() => t.value.context?.presentation), u = m(() => t.value.context?.cells?.tooltipTarget?.value ?? "body"), r = m(() => t.value.valueFormatted ?? String(t.value.value ?? "")), f = m(() => t.value.value), b = m(() => Y(f.value)), w = m(() => g.value?.stats[n.value.key]), p = m(() => n.value.showPercentage && w.value ? fe({
-      value: b.value,
-      stats: w.value,
-      header: n.value
-    }) : void 0), R = m(() => !!n.value.bar && !!w.value && (b.value !== null || f.value === null || f.value === void 0)), B = m(() => R.value && w.value ? Pe(b.value, w.value, n.value.bar) * 100 : 0), s = m(() => R.value ? g.value?.labelSizers[n.value.key] : void 0), v = m(() => n.value.thresholds?.length && b.value !== null ? Le(b.value, n.value.thresholds) : void 0), S = m(() => ({
-      column: n.value,
-      refreshCell: () => {
-        const h = t.value.node;
-        h && t.value.api.refreshCells({ force: !0, rowNodes: [h] });
-      },
-      row: t.value.data ?? {},
-      rowIndex: t.value.node?.rowIndex ?? 0,
-      rowValue: t.value.value,
-      selected: t.value.node?.isSelected() ?? !1
-    })), A = (h, { slots: x }) => {
-      const G = t.value.colDef?.colId, W = t.value.context?.cells?.slots;
-      return !G || G === "cell-icon" || !W?.[G] ? x.default?.() : ye(
-        "span",
-        { class: "table-data-grid-cell-slot-content" },
-        X(W, G, S.value, () => x.default?.() ?? [])
-      );
-    }, T = () => {
-      const h = t.value.context?.cells?.slots;
-      return h?.["cell-icon"] ? X(h, "cell-icon", S.value) : null;
-    };
-    let E, I, P = !1;
-    const F = () => {
-      const h = l.value;
-      o.value = !!h && h.scrollWidth > h.clientWidth;
-    }, O = () => {
-      P || (I !== void 0 && cancelAnimationFrame(I), I = requestAnimationFrame(() => {
-        I = void 0, F();
-      }));
-    }, U = (h) => {
-      if (E?.disconnect(), h) {
-        E?.observe(h);
-        const x = h.closest(".ag-cell");
-        x && E?.observe(x);
-      }
-      O();
-    };
-    return ue(() => {
-      E = new ResizeObserver(O), U(l.value);
-    }), M(l, U), ge(() => {
-      P = !0, E?.disconnect(), I !== void 0 && cancelAnimationFrame(I);
-    }), a({
-      refresh(h) {
-        return t.value = h, pe(O), !0;
-      }
-    }), (h, x) => {
-      const G = ce("KTooltip");
-      return K(), _("span", {
-        class: de(["table-data-grid-cell-renderer", {
-          "table-data-grid-cell-renderer--bar": R.value,
-          "table-data-grid-cell-renderer--percentage": !!p.value,
-          [`table-data-grid-cell-renderer--text-${v.value}`]: !R.value && !!v.value
-        }]),
-        "data-threshold": v.value
-      }, [
-        H("span", He, [
-          H("span", je, [
-            (K(), te(oe(T))),
-            (K(), te(oe(A), null, {
-              default: le(() => [
-                ae(G, {
-                  class: "table-data-grid-cell-tooltip",
-                  disabled: !o.value,
-                  "kpop-attributes": { popoverDelay: 400 },
-                  "max-width": "300",
-                  placement: "bottom-start",
-                  target: u.value,
-                  text: r.value
-                }, {
-                  default: le(() => [
-                    H("span", {
-                      ref_key: "contentElement",
-                      ref: l,
-                      class: "table-data-grid-cell-content"
-                    }, ne(r.value), 513)
-                  ]),
-                  _: 1
-                }, 8, ["disabled", "target", "text"])
-              ]),
-              _: 1
-            })),
-            p.value ? (K(), _("span", Qe, "(" + ne(p.value) + ")", 1)) : Q("", !0)
-          ]),
-          s.value ? (K(), _("span", Je, [
-            H("span", {
-              class: "table-data-grid-cell-sizer-value",
-              "data-text": s.value.value
-            }, null, 8, Xe),
-            s.value.relative ? (K(), _("span", {
-              key: 0,
-              class: "table-data-grid-cell-sizer-relative",
-              "data-text": `(${s.value.relative})`
-            }, null, 8, Ye)) : Q("", !0)
-          ])) : Q("", !0)
-        ]),
-        R.value ? (K(), _("span", {
-          key: 0,
-          class: "table-data-grid-cell-bar",
-          "data-testid": "table-data-grid-cell-bar",
-          "data-threshold": v.value
-        }, [
-          H("span", {
-            class: "table-data-grid-cell-bar-fill",
-            "data-testid": "table-data-grid-cell-bar-fill",
-            style: he({ width: `${B.value}%` })
-          }, null, 4)
-        ], 8, Ze)) : Q("", !0)
-      ], 10, qe);
-    };
-  }
-}), tt = ({
-  headers: e,
-  slots: a,
-  initialSort: t,
-  mode: l,
-  rows: o,
-  tooltipTarget: n
-}) => {
-  const g = l ?? "infinite", u = /* @__PURE__ */ new Set(), r = (s) => !!(s.showPercentage || s.bar || s.thresholds?.length);
-  M([e, () => o?.value], () => {
-    e.value.forEach((s) => {
-      if (!r(s))
-        return;
-      let v;
-      if (g === "infinite" && (s.showPercentage || s.bar) ? v = "percentage and bar presentation is only supported in unpaginated mode" : g === "unpaginated" && o?.value?.some((A) => {
-        const T = Reflect.get(A, s.key);
-        return T != null && Y(T) === null;
-      }) && (v = "contains non-finite or nonnumeric values; numeric presentation skips those values"), !v)
-        return;
-      const S = `${s.key}:${v}`;
-      u.has(S) || (u.add(S), console.warn(`[TableDataGrid] Column "${s.key}" ${v}.`));
-    });
-  }, { immediate: !0 });
-  const b = m(() => {
-    if (g !== "unpaginated")
-      return {};
-    const s = o?.value ?? [];
-    return Object.fromEntries(
-      e.value.filter((v) => v.showPercentage || v.bar).map((v) => [v.key, $e(s, v)])
-    );
-  }), w = m(() => {
-    if (g !== "unpaginated")
-      return {};
-    const s = o?.value ?? [];
-    return Object.fromEntries(
-      e.value.filter((v) => v.bar).map((v) => [v.key, We({
-        rows: s,
-        header: v,
-        stats: b.value[v.key]
-      })])
-    );
-  }), p = m(() => ({
-    cells: { slots: a, tooltipTarget: n },
-    presentation: {
-      stats: b.value,
-      labelSizers: w.value
-    }
-  })), R = (s) => {
-    const v = t?.sortColumnKey === s.key;
-    return {
-      colId: s.key,
-      // Columns with no explicit width constraint share remaining space equally.
-      flex: !s.width && !s.maxWidth ? 1 : void 0,
-      headerName: s.label,
-      maxWidth: s.maxWidth,
-      minWidth: s.minWidth,
-      sortable: s.sortable ?? !1,
-      unSortIcon: s.showSortIcon,
-      ...v ? { initialSort: t?.sortColumnOrder, initialSortIndex: 0 } : {},
-      valueGetter: (S) => S.data?.[s.key],
-      valueFormatter: (S) => S.data ? me(s, S.data) : String(S.value ?? ""),
-      width: s.width,
-      cellRenderer: et,
-      // custom params passed to the cell renderer.
-      cellRendererParams: { headerDef: s }
-    };
-  };
-  return {
-    columnDefs: m(() => e.value.map(R)),
-    gridContext: p
-  };
-}, ee = ({
-  config: e,
-  headers: a,
-  pageSize: t
-}) => {
-  const l = new Set(a.filter((n) => n.sortable).map((n) => n.key)), o = e?.sortColumnKey && l.has(e.sortColumnKey) ? e.sortColumnKey : void 0;
-  return {
-    sortColumnKey: o,
-    sortColumnOrder: o ? e?.sortColumnOrder : void 0,
-    pageSize: e?.pageSize ?? t,
-    ...e?.fitToContent !== void 0 ? { fitToContent: e.fitToContent } : {}
-  };
-}, se = (e, a) => e.sortColumnKey === a.sortColumnKey && e.sortColumnOrder === a.sortColumnOrder && e.pageSize === a.pageSize && e.fitToContent === a.fitToContent, at = ({
-  headers: e,
-  pageSize: a,
-  tableConfig: t,
-  emitSort: l,
-  emitTableConfigUpdate: o,
-  onExternalConfigChange: n
-}) => {
-  const g = m(() => t.value ? ee({ config: t.value, headers: e.value, pageSize: a.value }) : void 0), u = L(
-    g.value ?? ee({ config: void 0, headers: e.value, pageSize: a.value })
-  );
-  M(g, (w) => {
-    w && !se(w, u.value) && (u.value = w, n?.(w));
-  });
-  const r = (w) => {
-    const p = ee({
-      config: { ...u.value, ...w },
-      headers: e.value,
-      pageSize: a.value
-    });
-    se(p, u.value) || ((p.sortColumnKey !== u.value.sortColumnKey || p.sortColumnOrder !== u.value.sortColumnOrder) && l({ sortColumnKey: p.sortColumnKey, sortColumnOrder: p.sortColumnOrder }), u.value = p, o(p));
-  };
-  M(e, () => {
-    t.value || r({});
-  }, { deep: !0 });
-  const f = m(() => ({
-    sortColumnKey: u.value.sortColumnKey,
-    sortColumnOrder: u.value.sortColumnOrder
-  })), b = m(() => t.value?.pageSize ?? a.value);
-  return {
-    activeTableConfig: J(u),
-    activeSort: f,
-    activePageSize: b,
-    patchTableConfig: r
-  };
-}, ot = ({
-  cellClick: e,
-  headers: a,
-  rowClick: t
-}) => {
-  const l = m(() => new Set(
-    a.value.filter((r) => r.disableRowClick).map((r) => r.key)
-  )), o = (r) => {
-    const f = r.event?.target;
-    return f instanceof Element ? f.closest(".ag-cell")?.getAttribute("col-id") ?? void 0 : void 0;
-  }, n = (r) => {
-    const f = o(r);
-    return !!(f && l.value.has(f));
-  };
-  return {
-    onCellClick: (r) => {
-      const f = r.colDef.colId;
-      !r.data || !f || e({
-        columnKey: f,
-        row: r.data,
-        value: r.value
-      });
-    },
-    onRowClick: (r) => {
-      r.data && !n(r) && t(r.data, r);
-    }
-  };
-}, lt = ({
-  activeSort: e,
-  patchTableConfig: a
-}) => {
-  const t = (o, n) => {
-    o.applyColumnState({
-      state: n.sortColumnKey ? [{ colId: n.sortColumnKey, sort: n.sortColumnOrder ?? null, sortIndex: 0 }] : [],
-      defaultState: { sort: null, sortIndex: null }
-    });
-  };
-  return { onSortChanged: (o) => {
-    const n = o.api.getColumnState().filter((r) => r.sort).sort((r, f) => (r.sortIndex ?? 0) - (f.sortIndex ?? 0)), g = n[n.length - 1], u = g ? { sortColumnKey: g.colId, sortColumnOrder: g.sort } : { sortColumnKey: void 0, sortColumnOrder: void 0 };
-    (u.sortColumnKey !== e.value.sortColumnKey || u.sortColumnOrder !== e.value.sortColumnOrder) && a(u), n.length > 1 && t(o.api, u);
-  }, applySortToGrid: t };
-}, nt = {
-  key: 0,
-  class: "table-error-state",
-  "data-testid": "table-error-state"
-}, rt = {
-  key: 1,
-  class: "table-empty-state",
-  "data-testid": "table-empty-state"
-}, st = /* @__PURE__ */ ie({
-  __name: "TableDataGrid",
-  props: {
-    headers: {},
-    error: { type: Boolean, default: !1 },
-    tableConfig: {},
-    fetcher: { type: Function },
-    mode: {},
-    pageSize: { default: 25 },
-    refreshKey: { type: [String, Number, Boolean] },
-    rows: {}
-  },
-  emits: ["grid:ready", "state", "row:click", "cell:click", "sort", "update:tableConfig"],
-  setup(e, { emit: a }) {
-    De.registerModules([Re, Oe, Te]);
-    const t = e.mode ?? "infinite", l = a, { i18n: o } = ve(), { t: n } = o, g = be(), u = q(), r = Se("rootElement"), f = q("body"), b = () => {
-      const i = document.fullscreenElement;
-      f.value = i instanceof HTMLElement && i.contains(r.value ?? null) ? i : "body";
-    };
-    ue(() => {
-      b(), document.addEventListener("fullscreenchange", b);
-    }), ke(() => {
-      document.removeEventListener("fullscreenchange", b);
-    });
-    const { activeTableConfig: w, activeSort: p, activePageSize: R, patchTableConfig: B } = at({
-      headers: $(() => e.headers),
-      pageSize: $(() => e.pageSize),
-      tableConfig: $(() => e.tableConfig),
-      emitSort: (i) => l("sort", i),
-      emitTableConfigUpdate: (i) => l("update:tableConfig", i),
-      onExternalConfigChange: (i) => {
-        u.value && v(u.value, i);
-      }
-    }), { onSortChanged: s, applySortToGrid: v } = lt({
-      activeSort: p,
-      patchTableConfig: B
-    }), S = m(() => t === "unpaginated" && !!w.value.fitToContent), A = Ee.withParams({ autoHeightMinBodyHeight: 0 }), { onCellClick: T, onRowClick: E } = ot({
-      cellClick: (i) => l("cell:click", i),
-      headers: $(() => e.headers),
-      rowClick: (i, V) => l("row:click", i, V)
-    }), I = {
-      resizable: !1,
-      sortable: !1,
-      suppressMovable: !0
-    }, P = m(() => [R.value, e.refreshKey]), F = t === "infinite" ? _e({
-      fetcher: $(() => e.fetcher),
-      resetKey: P,
-      sort: p
-    }) : void 0, O = F?.datasource, U = m(() => F ? F.data.value : e.rows), h = m(() => F?.isFetching.value ?? !1), x = m(() => e.rows ? Array.from(e.rows) : void 0), { columnDefs: G, gridContext: W } = tt({
-      headers: $(() => e.headers),
-      mode: t,
-      rows: x,
-      slots: g,
-      tooltipTarget: f,
-      initialSort: p.value
-    }), {
-      fetchState: c,
-      hasData: d,
-      state: C
-    } = Fe(
-      U,
-      $(() => F?.error.value),
-      h
-    ), y = m(() => C.value === c.SUCCESS && !d.value);
-    F && Ge({
-      emitState: (i) => l("state", i),
-      fetchLifecycleState: C,
-      hasData: d
-    });
-    const k = () => {
-      const i = u.value;
-      if (!i || i.isDestroyed())
-        return;
-      const V = p.value, N = i.getColumnState().find((Z) => Z.sort);
-      N?.colId === V.sortColumnKey && (N?.sort ?? void 0) === V.sortColumnOrder || v(i, V);
-    };
-    M([u, p], k);
-    const z = (i) => {
-      u.value = i.api, l("grid:ready", i.api);
-    };
-    return (i, V) => {
-      const N = ce("KEmptyState");
-      return K(), _("div", {
-        ref_key: "rootElement",
-        ref: r,
-        class: de(["kong-ui-public-table-data-grid", { "fit-to-content": S.value }]),
-        "data-testid": "table-data-grid"
-      }, [
-        e.error ? (K(), _("div", nt, [
-          X(i.$slots, "error-state", {}, () => [
-            ae(N, {
-              "icon-variant": "error",
-              message: D(n)("errorState.message"),
-              title: D(n)("errorState.title")
-            }, null, 8, ["message", "title"])
-          ], !0)
-        ])) : y.value ? (K(), _("div", rt, [
-          X(i.$slots, "empty-state", {}, () => [
-            ae(N, {
-              message: D(n)("emptyState.message"),
-              title: D(n)("emptyState.title")
-            }, null, 8, ["message", "title"])
-          ], !0)
-        ])) : (K(), te(D(we), {
-          key: 2,
-          "cache-block-size": D(t) === "infinite" ? D(R) : void 0,
-          class: "table-data-grid-grid",
-          "column-defs": D(G),
-          context: D(W),
-          datasource: D(t) === "infinite" ? D(O) : void 0,
-          "default-col-def": I,
-          "dom-layout": S.value ? "autoHeight" : "normal",
-          "infinite-initial-row-count": D(t) === "infinite" ? 1 : void 0,
-          loading: h.value,
-          "row-data": D(t) === "unpaginated" ? x.value : void 0,
-          "row-model-type": D(t) === "unpaginated" ? "clientSide" : "infinite",
-          "suppress-cell-focus": !0,
-          "suppress-multi-sort": !0,
-          theme: D(A),
-          onCellClicked: D(T),
-          onGridReady: z,
-          onNewColumnsLoaded: k,
-          onRowClicked: D(E),
-          onSortChanged: D(s)
-        }, null, 8, ["cache-block-size", "column-defs", "context", "datasource", "dom-layout", "infinite-initial-row-count", "loading", "row-data", "row-model-type", "theme", "onCellClicked", "onRowClicked", "onSortChanged"]))
-      ], 2);
-    };
-  }
-}), it = (e, a) => {
-  const t = e.__vccOpts || e;
-  for (const [l, o] of a)
-    t[l] = o;
-  return t;
-}, mt = /* @__PURE__ */ it(st, [["__scopeId", "data-v-01cd8bcd"]]);
-export {
-  mt as TableDataGrid
-};