@lunora/studio 1.0.0-alpha.59 → 1.0.0-alpha.60

package/dist/packem_shared/table-list-sidebar-gCE17v9B.js

@@ -1,842 +0,0 @@
-import { c } from 'react/compiler-runtime';
-import { useT } from './DEFAULT_LOCALE-CiX4W7Kr.js';
-import { jsxDEV } from 'react/jsx-dev-runtime';
-import { useState, useRef, useMemo } from 'react';
-import { f as fireAndForget, e as errorMessage } from './internal-DzHCc2Rq.js';
-import { useVirtualizer } from '@tanstack/react-virtual';
-import { c as cn } from './utils-B05Dmz_H.js';
-import { f as flooredRectObserver } from './virtual-rect-CVMUskSm.js';
-
-const formatValue = (value) => {
-  if (value === null || value === void 0) {
-    return "∅";
-  }
-  if (value === "") {
-    return "(empty)";
-  }
-  if (typeof value === "object") {
-    return JSON.stringify(value);
-  }
-  return String(value);
-};
-const FacetSection = (t0) => {
-  const $ = c(32);
-  const {
-    column,
-    onFacetFilter,
-    state
-  } = t0;
-  const t = useT();
-  let t1;
-  if ($[0] !== column || $[1] !== onFacetFilter || $[2] !== state.result?.values) {
-    t1 = (event) => {
-      const index = Number(event.currentTarget.dataset.index);
-      const entry = state.result?.values[index];
-      if (entry !== void 0) {
-        onFacetFilter(column, entry.value);
-      }
-    };
-    $[0] = column;
-    $[1] = onFacetFilter;
-    $[2] = state.result?.values;
-    $[3] = t1;
-  } else {
-    t1 = $[3];
-  }
-  const onValueClick = t1;
-  const t2 = `db-facet-${column}`;
-  let t3;
-  if ($[4] !== column) {
-    t3 = /* @__PURE__ */ jsxDEV("span", {
-      className: "font-medium text-foreground",
-      children: column
-    }, void 0, false);
-    $[4] = column;
-    $[5] = t3;
-  } else {
-    t3 = $[5];
-  }
-  let t4;
-  if ($[6] !== state.loading || $[7] !== state.result || $[8] !== t) {
-    t4 = state.loading && state.result === null && /* @__PURE__ */ jsxDEV("span", {
-      className: "text-muted-foreground",
-      children: t("Loading…")
-    }, void 0, false);
-    $[6] = state.loading;
-    $[7] = state.result;
-    $[8] = t;
-    $[9] = t4;
-  } else {
-    t4 = $[9];
-  }
-  let t5;
-  if ($[10] !== state.error) {
-    t5 = state.error !== null && /* @__PURE__ */ jsxDEV("span", {
-      className: "text-destructive",
-      role: "alert",
-      children: state.error
-    }, void 0, false);
-    $[10] = state.error;
-    $[11] = t5;
-  } else {
-    t5 = $[11];
-  }
-  let t6;
-  if ($[12] !== state.result?.values) {
-    t6 = state.result?.values ?? [];
-    $[12] = state.result?.values;
-    $[13] = t6;
-  } else {
-    t6 = $[13];
-  }
-  let t7;
-  if ($[14] !== column || $[15] !== onValueClick || $[16] !== t6) {
-    let t82;
-    if ($[18] !== column || $[19] !== onValueClick) {
-      t82 = (entry_0, index_0) => /* @__PURE__ */ jsxDEV("button", {
-        className: "flex items-center justify-between gap-2 rounded px-1 py-0.5 text-left text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
-        "data-index": index_0,
-        "data-testid": `db-facet-value-${column}`,
-        onClick: onValueClick,
-        type: "button",
-        children: [/* @__PURE__ */ jsxDEV("span", {
-          className: "truncate",
-          children: formatValue(entry_0.value)
-        }, void 0, false), /* @__PURE__ */ jsxDEV("span", {
-          className: "shrink-0 tabular-nums text-foreground/70",
-          children: entry_0.count
-        }, void 0, false)]
-      }, formatValue(entry_0.value), true);
-      $[18] = column;
-      $[19] = onValueClick;
-      $[20] = t82;
-    } else {
-      t82 = $[20];
-    }
-    t7 = t6.map(t82);
-    $[14] = column;
-    $[15] = onValueClick;
-    $[16] = t6;
-    $[17] = t7;
-  } else {
-    t7 = $[17];
-  }
-  let t8;
-  if ($[21] !== column || $[22] !== state.result || $[23] !== t) {
-    t8 = state.result?.truncated === true && /* @__PURE__ */ jsxDEV("span", {
-      className: "text-muted-foreground",
-      "data-testid": `db-facet-truncated-${column}`,
-      children: t("Showing the {n} most common values.", {
-        n: state.result.values.length
-      })
-    }, void 0, false);
-    $[21] = column;
-    $[22] = state.result;
-    $[23] = t;
-    $[24] = t8;
-  } else {
-    t8 = $[24];
-  }
-  let t9;
-  if ($[25] !== t2 || $[26] !== t3 || $[27] !== t4 || $[28] !== t5 || $[29] !== t7 || $[30] !== t8) {
-    t9 = /* @__PURE__ */ jsxDEV("section", {
-      className: "flex flex-col gap-1",
-      "data-testid": t2,
-      children: [t3, t4, t5, t7, t8]
-    }, void 0, true);
-    $[25] = t2;
-    $[26] = t3;
-    $[27] = t4;
-    $[28] = t5;
-    $[29] = t7;
-    $[30] = t8;
-    $[31] = t9;
-  } else {
-    t9 = $[31];
-  }
-  return t9;
-};
-const DataFacets = (t0) => {
-  const $ = c(26);
-  const {
-    columns,
-    facets,
-    onFacetFilter,
-    onToggleFacet
-  } = t0;
-  const t = useT();
-  let t1;
-  if ($[0] !== onToggleFacet) {
-    t1 = (event) => {
-      const {
-        column
-      } = event.currentTarget.dataset;
-      if (column !== void 0) {
-        onToggleFacet(column);
-      }
-    };
-    $[0] = onToggleFacet;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  const toggle = t1;
-  if (columns.length === 0) {
-    return null;
-  }
-  let t2;
-  if ($[2] !== t) {
-    t2 = t("Facets");
-    $[2] = t;
-    $[3] = t2;
-  } else {
-    t2 = $[3];
-  }
-  let t3;
-  if ($[4] !== t2) {
-    t3 = /* @__PURE__ */ jsxDEV("span", {
-      className: "font-mono text-[11px] tracking-wide uppercase text-muted-foreground",
-      children: t2
-    }, void 0, false);
-    $[4] = t2;
-    $[5] = t3;
-  } else {
-    t3 = $[5];
-  }
-  let t4;
-  if ($[6] !== columns || $[7] !== facets || $[8] !== toggle) {
-    let t52;
-    if ($[10] !== facets || $[11] !== toggle) {
-      t52 = (column_0) => /* @__PURE__ */ jsxDEV("button", {
-        "aria-pressed": column_0 in facets,
-        className: "rounded border border-border px-1.5 py-0.5 text-muted-foreground transition-colors hover:bg-accent aria-pressed:bg-accent aria-pressed:text-accent-foreground",
-        "data-column": column_0,
-        "data-testid": `db-facet-toggle-${column_0}`,
-        onClick: toggle,
-        type: "button",
-        children: column_0
-      }, column_0, false);
-      $[10] = facets;
-      $[11] = toggle;
-      $[12] = t52;
-    } else {
-      t52 = $[12];
-    }
-    t4 = columns.map(t52);
-    $[6] = columns;
-    $[7] = facets;
-    $[8] = toggle;
-    $[9] = t4;
-  } else {
-    t4 = $[9];
-  }
-  let t5;
-  if ($[13] !== t4) {
-    t5 = /* @__PURE__ */ jsxDEV("div", {
-      className: "flex flex-wrap gap-1",
-      children: t4
-    }, void 0, false);
-    $[13] = t4;
-    $[14] = t5;
-  } else {
-    t5 = $[14];
-  }
-  let t6;
-  if ($[15] !== t3 || $[16] !== t5) {
-    t6 = /* @__PURE__ */ jsxDEV("div", {
-      className: "flex flex-col gap-1.5",
-      children: [t3, t5]
-    }, void 0, true);
-    $[15] = t3;
-    $[16] = t5;
-    $[17] = t6;
-  } else {
-    t6 = $[17];
-  }
-  let t7;
-  if ($[18] !== facets) {
-    t7 = Object.entries(facets);
-    $[18] = facets;
-    $[19] = t7;
-  } else {
-    t7 = $[19];
-  }
-  let t8;
-  if ($[20] !== onFacetFilter || $[21] !== t7) {
-    t8 = t7.map((t92) => {
-      const [column_1, state] = t92;
-      return /* @__PURE__ */ jsxDEV(FacetSection, {
-        column: column_1,
-        onFacetFilter,
-        state
-      }, column_1, false);
-    });
-    $[20] = onFacetFilter;
-    $[21] = t7;
-    $[22] = t8;
-  } else {
-    t8 = $[22];
-  }
-  let t9;
-  if ($[23] !== t6 || $[24] !== t8) {
-    t9 = /* @__PURE__ */ jsxDEV("aside", {
-      className: "flex w-56 shrink-0 flex-col gap-3 overflow-auto border-l border-border p-3 text-xs",
-      "data-testid": "db-facets",
-      children: [t6, t8]
-    }, void 0, true);
-    $[23] = t6;
-    $[24] = t8;
-    $[25] = t9;
-  } else {
-    t9 = $[25];
-  }
-  return t9;
-};
-
-const PAGE_SIZE_OPTIONS = [25, 50, 100, 250];
-const PageSizeSelect = (t0) => {
-  const $ = c(18);
-  const {
-    onChange,
-    options,
-    prefix,
-    value
-  } = t0;
-  const t = useT();
-  let t1;
-  if ($[0] !== onChange) {
-    t1 = (event) => {
-      onChange(Number.parseInt(event.target.value, 10));
-    };
-    $[0] = onChange;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  const onSelect = t1;
-  const t2 = `${prefix}-page-size`;
-  let t3;
-  if ($[2] !== t) {
-    t3 = t("Rows per page");
-    $[2] = t;
-    $[3] = t3;
-  } else {
-    t3 = $[3];
-  }
-  let t4;
-  if ($[4] !== t3) {
-    t4 = /* @__PURE__ */ jsxDEV("span", {
-      children: t3
-    }, void 0, false);
-    $[4] = t3;
-    $[5] = t4;
-  } else {
-    t4 = $[5];
-  }
-  const t5 = `${prefix}-page-size`;
-  const t6 = `${prefix}-page-size`;
-  let t7;
-  if ($[6] !== options) {
-    t7 = options.map(_temp);
-    $[6] = options;
-    $[7] = t7;
-  } else {
-    t7 = $[7];
-  }
-  let t8;
-  if ($[8] !== onSelect || $[9] !== t5 || $[10] !== t6 || $[11] !== t7 || $[12] !== value) {
-    t8 = /* @__PURE__ */ jsxDEV("select", {
-      className: "h-6 rounded-md border border-border bg-background px-1 tabular-nums outline-none focus-visible:border-ring",
-      "data-testid": t5,
-      id: t6,
-      onChange: onSelect,
-      value,
-      children: t7
-    }, void 0, false);
-    $[8] = onSelect;
-    $[9] = t5;
-    $[10] = t6;
-    $[11] = t7;
-    $[12] = value;
-    $[13] = t8;
-  } else {
-    t8 = $[13];
-  }
-  let t9;
-  if ($[14] !== t2 || $[15] !== t4 || $[16] !== t8) {
-    t9 = /* @__PURE__ */ jsxDEV("label", {
-      className: "flex items-center gap-1.5",
-      htmlFor: t2,
-      children: [t4, t8]
-    }, void 0, true);
-    $[14] = t2;
-    $[15] = t4;
-    $[16] = t8;
-    $[17] = t9;
-  } else {
-    t9 = $[17];
-  }
-  return t9;
-};
-const PageJump = (t0) => {
-  const $ = c(25);
-  const {
-    onJump,
-    page,
-    pages,
-    prefix
-  } = t0;
-  const t = useT();
-  let t1;
-  if ($[0] !== onJump || $[1] !== pages) {
-    t1 = (raw) => {
-      const next = Number.parseInt(raw, 10);
-      if (!Number.isNaN(next)) {
-        onJump(Math.min(Math.max(1, next), Math.max(1, pages)));
-      }
-    };
-    $[0] = onJump;
-    $[1] = pages;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  const commit = t1;
-  let t2;
-  if ($[3] !== commit) {
-    t2 = (event) => {
-      if (event.key === "Enter") {
-        commit(event.currentTarget.value);
-      }
-    };
-    $[3] = commit;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  const onKeyDown = t2;
-  let t3;
-  if ($[5] !== commit) {
-    t3 = (event_0) => {
-      commit(event_0.currentTarget.value);
-    };
-    $[5] = commit;
-    $[6] = t3;
-  } else {
-    t3 = $[6];
-  }
-  const onBlur = t3;
-  let t4;
-  if ($[7] !== t) {
-    t4 = t("Page");
-    $[7] = t;
-    $[8] = t4;
-  } else {
-    t4 = $[8];
-  }
-  let t5;
-  if ($[9] !== t) {
-    t5 = t("Page");
-    $[9] = t;
-    $[10] = t5;
-  } else {
-    t5 = $[10];
-  }
-  const t6 = `${prefix}-page-jump`;
-  const t7 = Math.max(1, pages);
-  let t8;
-  if ($[11] !== onBlur || $[12] !== onKeyDown || $[13] !== page || $[14] !== t5 || $[15] !== t6 || $[16] !== t7) {
-    t8 = /* @__PURE__ */ jsxDEV("input", {
-      "aria-label": t5,
-      className: "h-6 w-12 rounded-md border border-border bg-background px-1 text-center tabular-nums outline-none focus-visible:border-ring",
-      "data-testid": t6,
-      defaultValue: page,
-      max: t7,
-      min: 1,
-      onBlur,
-      onKeyDown,
-      type: "number"
-    }, page, false);
-    $[11] = onBlur;
-    $[12] = onKeyDown;
-    $[13] = page;
-    $[14] = t5;
-    $[15] = t6;
-    $[16] = t7;
-    $[17] = t8;
-  } else {
-    t8 = $[17];
-  }
-  let t9;
-  if ($[18] !== pages || $[19] !== t) {
-    t9 = t("of {pages}", {
-      pages
-    });
-    $[18] = pages;
-    $[19] = t;
-    $[20] = t9;
-  } else {
-    t9 = $[20];
-  }
-  let t10;
-  if ($[21] !== t4 || $[22] !== t8 || $[23] !== t9) {
-    t10 = /* @__PURE__ */ jsxDEV("span", {
-      className: "flex items-center gap-1.5 tabular-nums",
-      children: [t4, t8, t9]
-    }, void 0, true);
-    $[21] = t4;
-    $[22] = t8;
-    $[23] = t9;
-    $[24] = t10;
-  } else {
-    t10 = $[24];
-  }
-  return t10;
-};
-const GridPagination = ({
-  hasNext,
-  hasPrevious,
-  onJumpToPage,
-  onNext,
-  onPageSizeChange,
-  onPrevious,
-  pageSize,
-  pageSizeOptions = PAGE_SIZE_OPTIONS,
-  prefix,
-  rangeEnd,
-  rangeStart,
-  total
-}) => {
-  const t = useT();
-  const buttonClass = "rounded-md border border-border px-2.5 py-1 text-xs font-medium text-foreground outline-none transition-colors hover:bg-accent focus-visible:bg-accent disabled:pointer-events-none disabled:opacity-50";
-  const pages = pageSize !== void 0 && pageSize > 0 ? Math.max(1, Math.ceil(total / pageSize)) : 1;
-  const page = pageSize !== void 0 && pageSize > 0 ? Math.floor(Math.max(0, rangeStart - 1) / pageSize) + 1 : 1;
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "flex w-full items-center justify-between gap-3 text-xs text-muted-foreground",
-    children: [/* @__PURE__ */ jsxDEV("div", {
-      className: "flex items-center gap-3",
-      children: [pageSize !== void 0 && onPageSizeChange !== void 0 && /* @__PURE__ */ jsxDEV(PageSizeSelect, {
-        onChange: onPageSizeChange,
-        options: pageSizeOptions,
-        prefix,
-        value: pageSize
-      }, void 0, false), /* @__PURE__ */ jsxDEV("span", {
-        className: "tabular-nums",
-        "data-testid": `${prefix}-page-info`,
-        children: t("{rangeStart}-{rangeEnd} of {total}", {
-          rangeEnd,
-          rangeStart,
-          total
-        })
-      }, void 0, false)]
-    }, void 0, true), /* @__PURE__ */ jsxDEV("div", {
-      className: "flex items-center gap-3",
-      children: [/* @__PURE__ */ jsxDEV("button", {
-        className: buttonClass,
-        "data-testid": `${prefix}-prev`,
-        disabled: !hasPrevious,
-        onClick: onPrevious,
-        type: "button",
-        children: t("Previous")
-      }, void 0, false), pageSize !== void 0 && onJumpToPage !== void 0 && /* @__PURE__ */ jsxDEV(PageJump, {
-        onJump: onJumpToPage,
-        page,
-        pages,
-        prefix
-      }, void 0, false), /* @__PURE__ */ jsxDEV("button", {
-        className: buttonClass,
-        "data-testid": `${prefix}-next`,
-        disabled: !hasNext,
-        onClick: onNext,
-        type: "button",
-        children: t("Next")
-      }, void 0, false)]
-    }, void 0, true)]
-  }, void 0, true);
-};
-function _temp(option) {
-  return /* @__PURE__ */ jsxDEV("option", {
-    value: option,
-    children: option
-  }, option, false);
-}
-
-const useFacets = () => {
-  const [facets, setFacets] = useState({});
-  const facetsRef = useRef(facets);
-  facetsRef.current = facets;
-  const fetchSeq = useRef({});
-  const fetchFacet = async (column, fetcher) => {
-    const seq = (fetchSeq.current[column] ?? 0) + 1;
-    fetchSeq.current[column] = seq;
-    setFacets((current) => column in current ? {
-      ...current,
-      [column]: {
-        error: null,
-        loading: true,
-        result: current[column]?.result ?? null
-      }
-    } : current);
-    try {
-      const result = await fetcher(column);
-      if (fetchSeq.current[column] !== seq) {
-        return;
-      }
-      setFacets((current_1) => column in current_1 ? {
-        ...current_1,
-        [column]: {
-          error: null,
-          loading: false,
-          result
-        }
-      } : current_1);
-    } catch (error) {
-      if (fetchSeq.current[column] !== seq) {
-        return;
-      }
-      setFacets((current_0) => column in current_0 ? {
-        ...current_0,
-        [column]: {
-          error: errorMessage(error),
-          loading: false,
-          result: null
-        }
-      } : current_0);
-    }
-  };
-  const toggleFacet = (column_0, fetcher_0) => {
-    if (column_0 in facetsRef.current) {
-      setFacets((current_2) => Object.fromEntries(Object.entries(current_2).filter(([name]) => name !== column_0)));
-      return;
-    }
-    setFacets((current_3) => {
-      return {
-        ...current_3,
-        [column_0]: {
-          error: null,
-          loading: true,
-          result: null
-        }
-      };
-    });
-    if (fetcher_0 !== null) {
-      fireAndForget(fetchFacet(column_0, fetcher_0));
-    }
-  };
-  const refetchFacets = (fetcher_1) => {
-    for (const column_1 of Object.keys(facetsRef.current)) {
-      fireAndForget(fetchFacet(column_1, fetcher_1));
-    }
-  };
-  const clearFacets = () => {
-    setFacets({});
-    facetsRef.current = {};
-  };
-  return {
-    clearFacets,
-    facets,
-    facetsRef,
-    refetchFacets,
-    toggleFacet
-  };
-};
-
-const TABLE_ROW_HEIGHT = 34;
-const TABLE_LIST_VIEWPORT = 600;
-const TableListButton = (t0) => {
-  const $ = c(21);
-  const {
-    item,
-    onSelect,
-    prefix,
-    selected,
-    start
-  } = t0;
-  let t1;
-  if ($[0] !== item.name || $[1] !== onSelect) {
-    t1 = () => {
-      onSelect(item.name);
-    };
-    $[0] = item.name;
-    $[1] = onSelect;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  const onClick = t1;
-  const t2 = `translateY(${String(start)}px)`;
-  let t3;
-  if ($[3] !== t2) {
-    t3 = {
-      insetInline: 0,
-      position: "absolute",
-      top: 0,
-      transform: t2
-    };
-    $[3] = t2;
-    $[4] = t3;
-  } else {
-    t3 = $[4];
-  }
-  const style = t3;
-  const t4 = selected ? "bg-accent font-medium text-accent-foreground" : "text-foreground";
-  let t5;
-  if ($[5] !== t4) {
-    t5 = cn("flex w-full items-center justify-between gap-2 rounded-md px-2 py-1.5 text-start text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent", t4);
-    $[5] = t4;
-    $[6] = t5;
-  } else {
-    t5 = $[6];
-  }
-  const t6 = `${prefix}-table-${item.name}`;
-  let t7;
-  if ($[7] !== item.name) {
-    t7 = /* @__PURE__ */ jsxDEV("span", {
-      className: "truncate",
-      children: item.name
-    }, void 0, false);
-    $[7] = item.name;
-    $[8] = t7;
-  } else {
-    t7 = $[8];
-  }
-  let t8;
-  if ($[9] !== item.rowCount) {
-    t8 = /* @__PURE__ */ jsxDEV("span", {
-      className: "shrink-0 rounded bg-muted px-1.5 text-xs tabular-nums text-muted-foreground",
-      children: item.rowCount
-    }, void 0, false);
-    $[9] = item.rowCount;
-    $[10] = t8;
-  } else {
-    t8 = $[10];
-  }
-  let t9;
-  if ($[11] !== onClick || $[12] !== selected || $[13] !== t5 || $[14] !== t6 || $[15] !== t7 || $[16] !== t8) {
-    t9 = /* @__PURE__ */ jsxDEV("button", {
-      "aria-pressed": selected,
-      className: t5,
-      "data-testid": t6,
-      onClick,
-      type: "button",
-      children: [t7, t8]
-    }, void 0, true);
-    $[11] = onClick;
-    $[12] = selected;
-    $[13] = t5;
-    $[14] = t6;
-    $[15] = t7;
-    $[16] = t8;
-    $[17] = t9;
-  } else {
-    t9 = $[17];
-  }
-  let t10;
-  if ($[18] !== style || $[19] !== t9) {
-    t10 = /* @__PURE__ */ jsxDEV("li", {
-      style,
-      children: t9
-    }, void 0, false);
-    $[18] = style;
-    $[19] = t9;
-    $[20] = t10;
-  } else {
-    t10 = $[20];
-  }
-  return t10;
-};
-const TableListSidebar = ({
-  header,
-  onReload,
-  onSelect,
-  prefix,
-  reloadLabel,
-  selected,
-  tables
-}) => {
-  const t = useT();
-  const [query, setQuery] = useState("");
-  const scrollRef = useRef(null);
-  const onQueryChange = (event) => {
-    setQuery(event.target.value);
-  };
-  const filtered = useMemo(() => {
-    const needle = query.trim().toLowerCase();
-    return needle === "" ? tables : tables.filter((item) => item.name.toLowerCase().includes(needle));
-  }, [query, tables]);
-  const virtualizer = useVirtualizer({
-    count: filtered.length,
-    estimateSize: () => TABLE_ROW_HEIGHT,
-    getScrollElement: () => scrollRef.current,
-    initialRect: {
-      height: TABLE_LIST_VIEWPORT,
-      width: 240
-    },
-    observeElementRect: (instance, callback) => flooredRectObserver(instance, callback, TABLE_LIST_VIEWPORT),
-    overscan: 12
-  });
-  const virtualRows = virtualizer.getVirtualItems();
-  const trackStyle = {
-    height: filtered.length * TABLE_ROW_HEIGHT
-  };
-  return /* @__PURE__ */ jsxDEV("aside", {
-    className: "flex h-full w-60 shrink-0 flex-col border-e border-border bg-sidebar",
-    "data-testid": `${prefix}-table-list`,
-    children: [header, /* @__PURE__ */ jsxDEV("div", {
-      className: "flex h-9 shrink-0 items-center justify-between gap-2 border-b border-border px-3",
-      children: [/* @__PURE__ */ jsxDEV("span", {
-        className: "font-mono text-[11px] tracking-wide uppercase text-muted-foreground",
-        children: t("Tables")
-      }, void 0, false), onReload !== void 0 && /* @__PURE__ */ jsxDEV("button", {
-        "aria-label": reloadLabel ?? t("Refresh"),
-        className: "flex size-6 items-center justify-center rounded-md text-muted-foreground outline-none transition-colors hover:bg-accent hover:text-foreground focus-visible:bg-accent",
-        "data-testid": `${prefix}-load-tables`,
-        onClick: onReload,
-        title: reloadLabel ?? t("Refresh"),
-        type: "button",
-        children: /* @__PURE__ */ jsxDEV("svg", {
-          "aria-hidden": "true",
-          className: "size-3.5",
-          fill: "none",
-          stroke: "currentColor",
-          strokeLinecap: "round",
-          strokeLinejoin: "round",
-          strokeWidth: 1.6,
-          viewBox: "0 0 24 24",
-          children: /* @__PURE__ */ jsxDEV("path", {
-            d: "M4 12a8 8 0 0 1 13.7-5.6L20 8M20 4v4h-4M20 12a8 8 0 0 1-13.7 5.6L4 16m0 4v-4h4"
-          }, void 0, false)
-        }, void 0, false)
-      }, void 0, false)]
-    }, void 0, true), /* @__PURE__ */ jsxDEV("div", {
-      className: "shrink-0 border-b border-border p-2",
-      children: /* @__PURE__ */ jsxDEV("input", {
-        className: "h-7 w-full rounded-md border border-border bg-background px-2 text-xs outline-none placeholder:text-muted-foreground focus-visible:border-ring",
-        "data-testid": `${prefix}-table-search`,
-        onChange: onQueryChange,
-        placeholder: t("search table…"),
-        type: "search",
-        value: query
-      }, void 0, false)
-    }, void 0, false), /* @__PURE__ */ jsxDEV("ul", {
-      className: "relative flex-1 overflow-y-auto p-1.5",
-      "data-testid": `${prefix}-table-list-rows`,
-      ref: scrollRef,
-      children: [/* @__PURE__ */ jsxDEV("li", {
-        "aria-hidden": "true",
-        style: trackStyle
-      }, void 0, false), virtualRows.map((vrow) => {
-        const item_0 = filtered[vrow.index];
-        return item_0 === void 0 ? null : /* @__PURE__ */ jsxDEV(TableListButton, {
-          item: item_0,
-          onSelect,
-          prefix,
-          selected: selected === item_0.name,
-          start: vrow.start
-        }, item_0.name, false);
-      })]
-    }, void 0, true)]
-  }, void 0, true);
-};
-
-export { DataFacets as D, GridPagination as G, TableListSidebar as T, useFacets as u };