@veritone-ce/design-system 2.8.14-next.2.0 → 2.8.14

package/dist/esm/Table/AutoTable/controlled.js

@@ -0,0 +1,91 @@
+'use strict';
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { flexRender } from '@tanstack/react-table';
+import { Table, TableHead, TableSortLabel, TableBody, TableMessage, TableFooter } from '../index.js';
+import TableRow from '../TableRow/index.js';
+import TableCell from '../TableCell/index.js';
+import React__default from 'react';
+import { visuallyHidden } from '@mui/utils';
+import { useAutoTable, DefaultErrorContainer } from './common.js';
+import TablePagination from '../../TablePagination/index.js';
+import CircularProgress from '../../CircularProgress/index.js';
+import { cx } from '../../styles/cx.js';
+import '../../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import '../../styles/defaultTheme.js';
+import '../../styles/provider.client.js';
+import '../../styles/css-vars.js';
+import styles from './styles.module.scss.js';
+
+function ControlledAutoTable({
+  stickyHeader,
+  loading,
+  zeroStateMessage,
+  error,
+  ErrorContainer = DefaultErrorContainer,
+  style,
+  className,
+  ...options
+}) {
+  const table = useAutoTable(options);
+  const rows = options.data;
+  const manualRowCount = options.manualRowCount ?? rows.length;
+  const showMessage = error || loading || rows.length === 0;
+  return /* @__PURE__ */ jsx("div", { style, className, children: /* @__PURE__ */ jsxs(
+    Table,
+    {
+      className: cx(styles.table, stickyHeader && styles.stickyHeader),
+      style: {
+        ...stickyHeader && typeof stickyHeader === "object" && {
+          "--vt-ce-auto-table-sticky-offset": stickyHeader.offset
+        }
+      },
+      children: [
+        /* @__PURE__ */ jsx(TableHead, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(TableRow, { children: headerGroup.headers.map((header) => {
+          const isSorted = header.column.getIsSorted();
+          return /* @__PURE__ */ jsx(TableCell, { variant: "header", children: header.isPlaceholder ? null : header.column.getCanSort() ? /* @__PURE__ */ jsxs(
+            TableSortLabel,
+            {
+              active: isSorted !== false,
+              direction: isSorted !== false ? isSorted : "asc",
+              onClick: header.column.getToggleSortingHandler(),
+              children: [
+                flexRender(
+                  header.column.columnDef.header,
+                  header.getContext()
+                ),
+                isSorted !== false ? /* @__PURE__ */ jsx("span", { style: visuallyHidden, children: isSorted === "desc" ? "sorted descending" : "sorted ascending" }) : null
+              ]
+            }
+          ) : flexRender(
+            header.column.columnDef.header,
+            header.getContext()
+          ) }, header.id);
+        }) }, headerGroup.id)) }),
+        showMessage ? /* @__PURE__ */ jsx(TableBody, { children: /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: table.getAllFlatColumns().length, children: error ? /* @__PURE__ */ jsx(ErrorContainer, { error }) : loading ? /* @__PURE__ */ jsx("div", { className: styles.loadingContainer, children: /* @__PURE__ */ jsx(CircularProgress, {}) }) : rows.length === 0 ? /* @__PURE__ */ jsx(TableMessage, { children: zeroStateMessage ?? "No data found" }) : null }) }) }) : /* @__PURE__ */ jsx(TableBody, { children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx(TableRow, { children: row.getAllCells().map((cell) => /* @__PURE__ */ jsx(React__default.Fragment, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) }),
+        options.enablePagination && (options.manualPagination ? manualRowCount : options.data.length) > table.initialState.pagination.pageSize && /* @__PURE__ */ jsx(TableFooter, { children: /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx("td", { colSpan: table.getAllFlatColumns().length, children: /* @__PURE__ */ jsx(
+          TablePagination,
+          {
+            count: options.manualPagination ? manualRowCount : table.getFilteredRowModel().rows.length,
+            rowsPerPage: table.getState().pagination.pageSize,
+            page: table.getState().pagination.pageIndex + 1,
+            onChangePage: (newPage) => {
+              table.setPageIndex(newPage - 1);
+              options.onPageChange(newPage - 1);
+            },
+            rowsPerPageOptions: [10, 25, 50, 100],
+            onRowsPerPageChange: (rowsPerPage) => {
+              const size = rowsPerPage ?? 10;
+              table.setPageSize(size);
+              options.onRowsPerPageChange(size);
+            }
+          }
+        ) }) }) })
+      ]
+    }
+  ) });
+}
+
+export { ControlledAutoTable as default };

package/dist/esm/Table/AutoTable/index.js

@@ -0,0 +1,106 @@
+'use strict';
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import React__default from 'react';
+import VirtualControlledAutoTable from './virtual.js';
+import ControlledAutoTable from './controlled.js';
+import '@tanstack/react-table';
+import '../TableCell/index.js';
+
+function AutoTable(props) {
+  const enableSorting = props.enableSorting ?? true;
+  const [managedSorting, setManagedSorting] = useManagedStateSwitch(
+    props.sorting,
+    props.onSortingChange,
+    props.defaultSorting ?? []
+  );
+  const enableRowSelection = props.enableRowSelection ?? props.rowSelection !== void 0;
+  const [managedRowSelection, setManagedRowSelection] = useManagedStateSwitch(
+    props.rowSelection,
+    props.onRowSelectionChange,
+    {}
+  );
+  const enablePagination = props.enablePagination ?? true;
+  const [managedPage, setManagedPage] = useManagedStateSwitch(
+    props.page,
+    props.onPageChange,
+    0
+  );
+  const [managedRowsPerPage, setManagedRowsPerPage] = useManagedStateSwitch(
+    props.rowsPerPage,
+    props.onRowsPerPageChange,
+    10
+  );
+  const options = {
+    data: props.data,
+    columns: props.columns,
+    meta: props.meta,
+    getRowId: props.getRowId,
+    // sorting
+    sorting: managedSorting,
+    enableSorting,
+    onSortingChange: setManagedSorting,
+    manualSorting: props.manualSorting,
+    // selection
+    rowSelection: managedRowSelection,
+    enableRowSelection,
+    onRowSelectionChange: setManagedRowSelection,
+    // pagination
+    pagination: {
+      pageIndex: managedPage,
+      pageSize: enablePagination ? managedRowsPerPage : props.data.length
+    },
+    enablePagination,
+    onPageChange: setManagedPage,
+    onRowsPerPageChange: setManagedRowsPerPage,
+    manualPagination: props.manualRowCount !== void 0,
+    manualRowCount: props.manualRowCount
+  };
+  if (props.virtualizer) {
+    return /* @__PURE__ */ jsx(
+      VirtualControlledAutoTable,
+      {
+        ...options,
+        ...props.virtualizer,
+        stickyHeader: props.stickyHeader,
+        loading: props.loading,
+        zeroStateMessage: props.zeroStateMessage,
+        error: props.error,
+        ErrorContainer: props.ErrorContainer,
+        style: props.style,
+        className: props.className
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    ControlledAutoTable,
+    {
+      ...options,
+      stickyHeader: props.stickyHeader,
+      loading: props.loading,
+      zeroStateMessage: props.zeroStateMessage,
+      error: props.error,
+      ErrorContainer: props.ErrorContainer,
+      style: props.style,
+      className: props.className
+    }
+  );
+}
+function useManagedStateSwitch(controlled, setControlled, uncontrolledDefault) {
+  const [uncontrolled, setUncontrolled] = React__default.useState(uncontrolledDefault);
+  const [managed, setManaged] = controlled !== void 0 ? [
+    controlled,
+    (u) => {
+      setControlled?.(u);
+    }
+  ] : [
+    uncontrolled,
+    (u) => {
+      setUncontrolled(u);
+      setControlled?.(u);
+    }
+  ];
+  return [managed, setManaged];
+}
+
+export { AutoTable as default };

package/dist/esm/Table/AutoTable/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"visuallyHidden":"vt_ce_AutoTable_visuallyHidden__d42457bf","errorContainer":"vt_ce_AutoTable_errorContainer__22629d1a","loadingContainer":"vt_ce_AutoTable_loadingContainer__800e1c5c","table":"vt_ce_AutoTable_table__abdcf037","stickyHeader":"vt_ce_AutoTable_stickyHeader__1fdfff7b","virtualTableBody":"vt_ce_AutoTable_virtualTableBody__1264b0bb"};
+
+export { styles as default };

package/dist/esm/Table/AutoTable/virtual.js

@@ -0,0 +1,168 @@
+'use strict';
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { flexRender } from '@tanstack/react-table';
+import { Table, TableHead, TableSortLabel, TableBody, TableMessage } from '../index.js';
+import TableRow from '../TableRow/index.js';
+import TableCell from '../TableCell/index.js';
+import React__default from 'react';
+import { useAutoTable, DefaultErrorContainer } from './common.js';
+import { useVirtualizer } from '@tanstack/react-virtual';
+import { cx } from '../../styles/cx.js';
+import '../../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import '../../styles/defaultTheme.js';
+import '../../styles/provider.client.js';
+import '../../styles/css-vars.js';
+import styles from './styles.module.scss.js';
+import CircularProgress from '../../CircularProgress/index.js';
+
+const TableMessageMaxHeight = 100;
+function VirtualControlledAutoTable({
+  stickyHeader,
+  loading,
+  zeroStateMessage,
+  error,
+  ErrorContainer = DefaultErrorContainer,
+  scrollOffset,
+  getScrollElement,
+  renderWhenNotVisible = true,
+  rowSize,
+  headerSize = 50,
+  overscan,
+  debug,
+  style,
+  className,
+  ...options
+}) {
+  const table = useAutoTable(options);
+  const { rows } = table.getRowModel();
+  const offsetFromScrollEl = scrollOffset ?? 0;
+  const virtualizer = useVirtualizer({
+    getScrollElement,
+    scrollMargin: offsetFromScrollEl,
+    count: rows.length,
+    overscan: overscan ?? 10,
+    estimateSize: () => rowSize
+  });
+  const showMessage = error || loading || rows.length === 0;
+  const rowsHeight = rows.length * rowSize;
+  const totalHeight = headerSize + (showMessage ? TableMessageMaxHeight : rowsHeight);
+  const visibilityOverscan = virtualizer.options.overscan * rowSize;
+  const visibilityBounds = {
+    lower: offsetFromScrollEl - visibilityOverscan,
+    upper: offsetFromScrollEl + totalHeight + visibilityOverscan
+  };
+  const tableIsVisible = renderWhenNotVisible || virtualizer.scrollOffset + virtualizer.scrollRect.height >= visibilityBounds.lower && virtualizer.scrollOffset <= visibilityBounds.upper;
+  const virtualItems = virtualizer.getVirtualItems();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        height: `${totalHeight}px`,
+        ...style
+      },
+      className,
+      children: [
+        debug && /* @__PURE__ */ jsx("div", { style: { position: "relative" }, children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              color: "red",
+              zIndex: 100,
+              fontSize: 10
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { style: { marginRight: 5 }, children: virtualizer.scrollOffset }),
+              /* @__PURE__ */ jsx("span", { style: { marginRight: 5 }, children: virtualizer.scrollOffset + virtualizer.scrollRect.height }),
+              /* @__PURE__ */ jsx("span", { style: { marginRight: 5 }, children: offsetFromScrollEl }),
+              /* @__PURE__ */ jsx("span", { style: { marginRight: 5 }, children: visibilityBounds.lower }),
+              /* @__PURE__ */ jsx("span", { style: { marginRight: 5 }, children: visibilityBounds.upper })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsxs(
+          Table,
+          {
+            className: cx(styles.table, stickyHeader && styles.stickyHeader),
+            style: {
+              ...stickyHeader && typeof stickyHeader === "object" && {
+                "--vt-ce-auto-table-sticky-offset": stickyHeader.offset
+              }
+            },
+            children: [
+              /* @__PURE__ */ jsx(TableHead, { style: { height: headerSize }, children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(TableRow, { children: headerGroup.headers.map((header) => {
+                const isSorted = header.column.getIsSorted();
+                return /* @__PURE__ */ jsx(TableCell, { variant: "header", children: header.isPlaceholder ? null : header.column.getCanSort() ? /* @__PURE__ */ jsxs(
+                  TableSortLabel,
+                  {
+                    active: isSorted !== false,
+                    direction: isSorted !== false ? isSorted : "asc",
+                    onClick: header.column.getToggleSortingHandler(),
+                    children: [
+                      flexRender(
+                        header.column.columnDef.header,
+                        header.getContext()
+                      ),
+                      isSorted !== false ? /* @__PURE__ */ jsx("span", { className: styles.visuallyHidden, children: isSorted === "desc" ? "sorted descending" : "sorted ascending" }) : null
+                    ]
+                  }
+                ) : flexRender(
+                  header.column.columnDef.header,
+                  header.getContext()
+                ) }, header.id);
+              }) }, headerGroup.id)) }),
+              showMessage ? /* @__PURE__ */ jsx(TableBody, { children: /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(
+                TableCell,
+                {
+                  colSpan: table.getAllFlatColumns().length,
+                  children: /* @__PURE__ */ jsx("div", { children: error ? /* @__PURE__ */ jsx(ErrorContainer, { error }) : loading ? /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      style: {
+                        display: "flex",
+                        justifyContent: "center",
+                        paddingTop: "10px",
+                        paddingBottom: "10px"
+                      },
+                      children: /* @__PURE__ */ jsx(CircularProgress, {})
+                    }
+                  ) : rows.length === 0 ? /* @__PURE__ */ jsx(TableMessage, { children: zeroStateMessage ?? "No data found" }) : null })
+                }
+              ) }) }) : tableIsVisible && /* @__PURE__ */ jsx(
+                TableBody,
+                {
+                  className: styles.virtualTableBody,
+                  style: {
+                    ...{
+                      "--vt-ce-auto-table-virtual-table-body-height": `${(rows.length - virtualItems.length) * rowSize}px`
+                    }
+                  },
+                  children: virtualItems.map((virtualRow) => {
+                    const row = rows[virtualRow.index];
+                    return /* @__PURE__ */ jsx(
+                      TableRow,
+                      {
+                        children: row.getAllCells().map((cell) => /* @__PURE__ */ jsx(React__default.Fragment, { children: flexRender(
+                          cell.column.columnDef.cell,
+                          cell.getContext()
+                        ) }, cell.id))
+                      },
+                      row.id
+                    );
+                  })
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { TableMessageMaxHeight, VirtualControlledAutoTable as default };

package/dist/esm/Table/TableCell/index.js

@@ -0,0 +1,45 @@
+'use strict';
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import React__default, { forwardRef } from 'react';
+import styles from './styles.module.scss.js';
+import { cx } from '../../styles/cx.js';
+import '../../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import '../../styles/defaultTheme.js';
+import '../../styles/provider.client.js';
+import '../../styles/css-vars.js';
+
+const TableCell = forwardRef(
+  ({
+    children,
+    "data-testid": dataTestId,
+    noVerticalPadding,
+    variant = "data",
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const Tag = React__default.useMemo(
+      () => variant === "header" ? "th" : "td",
+      [variant]
+    );
+    return /* @__PURE__ */ jsx(
+      Tag,
+      {
+        ref,
+        ...props,
+        "data-testid": dataTestId,
+        className: cx(styles.tableCell, className),
+        style: {
+          padding: `${noVerticalPadding ? "0px" : "14.25px"} ${"16px"}`,
+          ...style
+        },
+        children
+      }
+    );
+  }
+);
+
+export { TableCell as default };

package/dist/esm/Table/TableCell/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"tableCell":"vt_ce_TableCell_tableCell__a1247ad8"};
+
+export { styles as default };

package/dist/esm/Table/TableRow/index.js

@@ -0,0 +1,29 @@
+'use strict';
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import styles from './styles.module.scss.js';
+import { cx } from '../../styles/cx.js';
+import '../../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import '../../styles/defaultTheme.js';
+import '../../styles/provider.client.js';
+import '../../styles/css-vars.js';
+
+const TableRow = forwardRef(
+  ({ children, "data-testid": dataTestId, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "tr",
+      {
+        ref,
+        ...props,
+        "data-testid": dataTestId,
+        className: cx(styles.tableRow, className),
+        children
+      }
+    );
+  }
+);
+
+export { TableRow as default };

package/dist/esm/Table/TableRow/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"tableRow":"vt_ce_TableRow_tableRow__20cdba2f"};
+
+export { styles as default };

package/dist/esm/Table/index.js

@@ -0,0 +1,69 @@
+'use strict';
+import { jsx } from 'react/jsx-runtime';
+import { Table as Table$1, TableBody as TableBody$1, TableFooter as TableFooter$1, TableHead as TableHead$1, TableSortLabel as TableSortLabel$1 } from '@mui/material';
+import Typography from '../Typography/index.js';
+import styles from './styles.module.scss.js';
+
+const Table = (props) => {
+  return /* @__PURE__ */ jsx(
+    Table$1,
+    {
+      "data-testid": props["data-testid"],
+      stickyHeader: props.stickyHeader,
+      style: props.style,
+      className: props.className,
+      children: props.children
+    }
+  );
+};
+const TableBody = (props) => {
+  return /* @__PURE__ */ jsx(
+    TableBody$1,
+    {
+      "data-testid": props["data-testid"],
+      style: props.style,
+      className: props.className,
+      children: props.children
+    }
+  );
+};
+const TableFooter = (props) => {
+  return /* @__PURE__ */ jsx(
+    TableFooter$1,
+    {
+      "data-testid": props["data-testid"],
+      style: props.style,
+      className: props.className,
+      children: props.children
+    }
+  );
+};
+const TableHead = (props) => {
+  return /* @__PURE__ */ jsx(
+    TableHead$1,
+    {
+      "data-testid": props["data-testid"],
+      style: props.style,
+      className: props.className,
+      children: props.children
+    }
+  );
+};
+const TableSortLabel = (props) => {
+  return /* @__PURE__ */ jsx(
+    TableSortLabel$1,
+    {
+      active: props.active,
+      direction: props.direction,
+      hideSortIcon: props.hideSortIcon,
+      onClick: props.onClick,
+      disabled: props.disabled,
+      children: props.children
+    }
+  );
+};
+const TableMessage = (props) => {
+  return /* @__PURE__ */ jsx("div", { className: styles.tableMessageWrapper, children: /* @__PURE__ */ jsx(Typography, { className: styles.tableMessage, children: props.children }) });
+};
+
+export { Table, TableBody, TableFooter, TableHead, TableMessage, TableSortLabel };

package/dist/esm/Table/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"tableMessageWrapper":"vt_ce_Table_tableMessageWrapper__bd25fe47","tableMessage":"vt_ce_Table_tableMessage__f6316814"};
+
+export { styles as default };

package/dist/esm/TablePagination/index.js

@@ -0,0 +1,114 @@
+'use strict';
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import css from './styles.module.scss.js';
+import IconButton from '../IconButton/index.js';
+import { NavigateBeforeIcon, NavigateNextIcon } from '../Icon/internal.js';
+import '../Select/controlled.js';
+import Select from '../Select/uncontrolled.js';
+import { useState, useEffect } from 'react';
+import Input from '../Input/index.js';
+import FormControl from '../FormControl/index.js';
+
+function TablePagination({
+  page,
+  count,
+  rowsPerPage = 10,
+  rowsPerPageOptions = [10, 50, 100],
+  rowsPerPageLabel = "Rows per page:",
+  rowsPerPageVariant = "normal",
+  showPageNumberInput = false,
+  ...props
+}) {
+  const showPrev = page !== 1;
+  const showNext = page < count / rowsPerPage;
+  const [inputPage, setInputPage] = useState(page.toString());
+  const handlePageInputChange = (e) => {
+    const value = e.target.value;
+    if (/^\d*$/.test(value)) {
+      setInputPage(value);
+    }
+  };
+  const handlePageInputBlur = () => {
+    const newPage = Math.max(
+      1,
+      Math.min(Math.ceil(count / rowsPerPage), Number(inputPage))
+    );
+    if (newPage !== page) {
+      props.onChangePage(newPage);
+    }
+    setInputPage(newPage.toString());
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === "NumpadEnter") {
+      handlePageInputBlur();
+    }
+  };
+  useEffect(() => {
+    setInputPage(page.toString());
+  }, [page]);
+  return /* @__PURE__ */ jsxs("nav", { className: css["container"], children: [
+    /* @__PURE__ */ jsx(FormControl, { label: rowsPerPageLabel, placement: "inline-start", children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        defaultValue: rowsPerPage,
+        clearable: false,
+        size: rowsPerPageOptions.length > 0 ? getDigits(Math.max(...rowsPerPageOptions)) + (rowsPerPageVariant === "tight" ? 0 : 1) : 3,
+        options: rowsPerPageOptions.map((option) => ({
+          label: option.toLocaleString(),
+          value: option
+        })),
+        onChange: (_, newRowsPerPage) => props.onRowsPerPageChange?.(newRowsPerPage),
+        className: css["rows-per-page-select"],
+        "data-pendo": props["data-pendo-select"],
+        tight: rowsPerPageVariant === "tight"
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("span", { className: css["page-counts"], children: [
+      ((page - 1) * rowsPerPage + 1).toLocaleString(),
+      "-",
+      Math.min(page * rowsPerPage, count).toLocaleString(),
+      " of",
+      " ",
+      count.toLocaleString()
+    ] }),
+    showPageNumberInput && /* @__PURE__ */ jsx(
+      Input,
+      {
+        className: css["page-input"],
+        type: "number",
+        value: inputPage,
+        onChange: handlePageInputChange,
+        onBlur: handlePageInputBlur,
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ jsxs("ul", { className: css["btn-list"], children: [
+      /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          type: "button",
+          disabled: !showPrev,
+          onClick: () => props.onChangePage(page - 1),
+          "data-pendo": props["data-pendo-prev"],
+          children: /* @__PURE__ */ jsx(NavigateBeforeIcon, {})
+        }
+      ) }),
+      /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          type: "button",
+          disabled: !showNext,
+          onClick: () => props.onChangePage(page + 1),
+          "data-pendo": props["data-pendo-next"],
+          children: /* @__PURE__ */ jsx(NavigateNextIcon, {})
+        }
+      ) })
+    ] })
+  ] });
+}
+const getDigits = (number) => {
+  return Math.max(Math.floor(Math.log10(Math.abs(number))), 0) + 1;
+};
+
+export { TablePagination as default };

package/dist/esm/TablePagination/styles.module.scss.js

@@ -0,0 +1,3 @@
+var css = {"container":"vt_ce_TablePagination_container__d07bacc1","rows-per-page-select":"vt_ce_TablePagination_rows-per-page-select__b32339ce","page-counts":"vt_ce_TablePagination_page-counts__30c1adb1","btn-list":"vt_ce_TablePagination_btn-list__3718fa45","page-input":"vt_ce_TablePagination_page-input__38c02d9e"};
+
+export { css as default };