@stereopt/data-table 0.1.9 → 0.1.10

package/dist/index.js

@@ -1,3 +1,9 @@
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
 // src/lib/utils.ts
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
@@ -84,6 +90,401 @@ function TableCell({ className, ...props }) {
   );
 }
 
+// src/components/ui/button.tsx
+import { cva } from "class-variance-authority";
+
+// node_modules/@radix-ui/react-slot/dist/index.mjs
+var dist_exports = {};
+__export(dist_exports, {
+  Root: () => Slot,
+  Slot: () => Slot,
+  Slottable: () => Slottable,
+  createSlot: () => createSlot,
+  createSlottable: () => createSlottable
+});
+import * as React2 from "react";
+
+// node_modules/@radix-ui/react-compose-refs/dist/index.mjs
+import * as React from "react";
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    return ref(value);
+  } else if (ref !== null && ref !== void 0) {
+    ref.current = value;
+  }
+}
+function composeRefs(...refs) {
+  return (node) => {
+    let hasCleanup = false;
+    const cleanups = refs.map((ref) => {
+      const cleanup = setRef(ref, node);
+      if (!hasCleanup && typeof cleanup == "function") {
+        hasCleanup = true;
+      }
+      return cleanup;
+    });
+    if (hasCleanup) {
+      return () => {
+        for (let i = 0; i < cleanups.length; i++) {
+          const cleanup = cleanups[i];
+          if (typeof cleanup == "function") {
+            cleanup();
+          } else {
+            setRef(refs[i], null);
+          }
+        }
+      };
+    }
+  };
+}
+
+// node_modules/@radix-ui/react-slot/dist/index.mjs
+import { Fragment as Fragment2, jsx as jsx2 } from "react/jsx-runtime";
+// @__NO_SIDE_EFFECTS__
+function createSlot(ownerName) {
+  const SlotClone = /* @__PURE__ */ createSlotClone(ownerName);
+  const Slot2 = React2.forwardRef((props, forwardedRef) => {
+    const { children, ...slotProps } = props;
+    const childrenArray = React2.Children.toArray(children);
+    const slottable = childrenArray.find(isSlottable);
+    if (slottable) {
+      const newElement = slottable.props.children;
+      const newChildren = childrenArray.map((child) => {
+        if (child === slottable) {
+          if (React2.Children.count(newElement) > 1) return React2.Children.only(null);
+          return React2.isValidElement(newElement) ? newElement.props.children : null;
+        } else {
+          return child;
+        }
+      });
+      return /* @__PURE__ */ jsx2(SlotClone, { ...slotProps, ref: forwardedRef, children: React2.isValidElement(newElement) ? React2.cloneElement(newElement, void 0, newChildren) : null });
+    }
+    return /* @__PURE__ */ jsx2(SlotClone, { ...slotProps, ref: forwardedRef, children });
+  });
+  Slot2.displayName = `${ownerName}.Slot`;
+  return Slot2;
+}
+var Slot = /* @__PURE__ */ createSlot("Slot");
+// @__NO_SIDE_EFFECTS__
+function createSlotClone(ownerName) {
+  const SlotClone = React2.forwardRef((props, forwardedRef) => {
+    const { children, ...slotProps } = props;
+    if (React2.isValidElement(children)) {
+      const childrenRef = getElementRef(children);
+      const props2 = mergeProps(slotProps, children.props);
+      if (children.type !== React2.Fragment) {
+        props2.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
+      }
+      return React2.cloneElement(children, props2);
+    }
+    return React2.Children.count(children) > 1 ? React2.Children.only(null) : null;
+  });
+  SlotClone.displayName = `${ownerName}.SlotClone`;
+  return SlotClone;
+}
+var SLOTTABLE_IDENTIFIER = /* @__PURE__ */ Symbol("radix.slottable");
+// @__NO_SIDE_EFFECTS__
+function createSlottable(ownerName) {
+  const Slottable2 = ({ children }) => {
+    return /* @__PURE__ */ jsx2(Fragment2, { children });
+  };
+  Slottable2.displayName = `${ownerName}.Slottable`;
+  Slottable2.__radixId = SLOTTABLE_IDENTIFIER;
+  return Slottable2;
+}
+var Slottable = /* @__PURE__ */ createSlottable("Slottable");
+function isSlottable(child) {
+  return React2.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER;
+}
+function mergeProps(slotProps, childProps) {
+  const overrideProps = { ...childProps };
+  for (const propName in childProps) {
+    const slotPropValue = slotProps[propName];
+    const childPropValue = childProps[propName];
+    const isHandler = /^on[A-Z]/.test(propName);
+    if (isHandler) {
+      if (slotPropValue && childPropValue) {
+        overrideProps[propName] = (...args) => {
+          const result = childPropValue(...args);
+          slotPropValue(...args);
+          return result;
+        };
+      } else if (slotPropValue) {
+        overrideProps[propName] = slotPropValue;
+      }
+    } else if (propName === "style") {
+      overrideProps[propName] = { ...slotPropValue, ...childPropValue };
+    } else if (propName === "className") {
+      overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
+    }
+  }
+  return { ...slotProps, ...overrideProps };
+}
+function getElementRef(element) {
+  let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
+  let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+  if (mayWarn) {
+    return element.ref;
+  }
+  getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
+  mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+  if (mayWarn) {
+    return element.props.ref;
+  }
+  return element.props.ref || element.ref;
+}
+
+// src/components/ui/button.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+        outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        icon: "size-8",
+        "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+        "icon-lg": "size-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? dist_exports.Root : "button";
+  return /* @__PURE__ */ jsx3(
+    Comp,
+    {
+      className: cn(buttonVariants({ variant, size, className })),
+      "data-size": size,
+      "data-slot": "button",
+      "data-variant": variant,
+      ...props
+    }
+  );
+}
+
+// node_modules/lucide-react/dist/esm/createLucideIcon.js
+import { forwardRef as forwardRef3, createElement as createElement2 } from "react";
+
+// node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.js
+var mergeClasses = (...classes) => classes.filter((className, index, array) => {
+  return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
+}).join(" ").trim();
+
+// node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.js
+var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+
+// node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.js
+var toCamelCase = (string) => string.replace(
+  /^([A-Z])|[\s-_]+(\w)/g,
+  (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase()
+);
+
+// node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.js
+var toPascalCase = (string) => {
+  const camelCase = toCamelCase(string);
+  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
+};
+
+// node_modules/lucide-react/dist/esm/Icon.js
+import { forwardRef as forwardRef2, createElement } from "react";
+
+// node_modules/lucide-react/dist/esm/defaultAttributes.js
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+
+// node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.js
+var hasA11yProp = (props) => {
+  for (const prop in props) {
+    if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
+      return true;
+    }
+  }
+  return false;
+};
+
+// node_modules/lucide-react/dist/esm/Icon.js
+var Icon = forwardRef2(
+  ({
+    color = "currentColor",
+    size = 24,
+    strokeWidth = 2,
+    absoluteStrokeWidth,
+    className = "",
+    children,
+    iconNode,
+    ...rest
+  }, ref) => createElement(
+    "svg",
+    {
+      ref,
+      ...defaultAttributes,
+      width: size,
+      height: size,
+      stroke: color,
+      strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
+      className: mergeClasses("lucide", className),
+      ...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
+      ...rest
+    },
+    [
+      ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
+      ...Array.isArray(children) ? children : [children]
+    ]
+  )
+);
+
+// node_modules/lucide-react/dist/esm/createLucideIcon.js
+var createLucideIcon = (iconName, iconNode) => {
+  const Component = forwardRef3(
+    ({ className, ...props }, ref) => createElement2(Icon, {
+      ref,
+      iconNode,
+      className: mergeClasses(
+        `lucide-${toKebabCase(toPascalCase(iconName))}`,
+        `lucide-${iconName}`,
+        className
+      ),
+      ...props
+    })
+  );
+  Component.displayName = toPascalCase(iconName);
+  return Component;
+};
+
+// node_modules/lucide-react/dist/esm/icons/chevron-left.js
+var __iconNode = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
+var ChevronLeft = createLucideIcon("chevron-left", __iconNode);
+
+// node_modules/lucide-react/dist/esm/icons/chevron-right.js
+var __iconNode2 = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+var ChevronRight = createLucideIcon("chevron-right", __iconNode2);
+
+// node_modules/lucide-react/dist/esm/icons/chevrons-left.js
+var __iconNode3 = [
+  ["path", { d: "m11 17-5-5 5-5", key: "13zhaf" }],
+  ["path", { d: "m18 17-5-5 5-5", key: "h8a8et" }]
+];
+var ChevronsLeft = createLucideIcon("chevrons-left", __iconNode3);
+
+// node_modules/lucide-react/dist/esm/icons/chevrons-right.js
+var __iconNode4 = [
+  ["path", { d: "m6 17 5-5-5-5", key: "xnjwq" }],
+  ["path", { d: "m13 17 5-5-5-5", key: "17xmmf" }]
+];
+var ChevronsRight = createLucideIcon("chevrons-right", __iconNode4);
+
+// src/dataTable/pagination/DataTablePagination.tsx
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+function DataTablePagination({
+  table
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-2 pt-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex-1 text-sm", children: [
+      table.getFilteredRowModel().rows.length,
+      " rows"
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-6 lg:space-x-8", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: [
+        "Page ",
+        table.getState().pagination.pageIndex + 1,
+        " of",
+        " ",
+        table.getPageCount() || 1
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            className: "hidden size-8 lg:flex",
+            disabled: !table.getCanPreviousPage(),
+            onClick: () => table.setPageIndex(0),
+            size: "icon",
+            variant: "outline",
+            children: [
+              /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Go to first page" }),
+              /* @__PURE__ */ jsx4(ChevronsLeft, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            className: "size-8",
+            disabled: !table.getCanPreviousPage(),
+            onClick: () => table.previousPage(),
+            size: "icon",
+            variant: "outline",
+            children: [
+              /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Go to previous page" }),
+              /* @__PURE__ */ jsx4(ChevronLeft, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            className: "size-8",
+            disabled: !table.getCanNextPage(),
+            onClick: () => table.nextPage(),
+            size: "icon",
+            variant: "outline",
+            children: [
+              /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Go to next page" }),
+              /* @__PURE__ */ jsx4(ChevronRight, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            className: "hidden size-8 lg:flex",
+            disabled: !table.getCanNextPage(),
+            onClick: () => table.setPageIndex(table.getPageCount() - 1),
+            size: "icon",
+            variant: "outline",
+            children: [
+              /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Go to last page" }),
+              /* @__PURE__ */ jsx4(ChevronsRight, {})
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+
 // src/dataTable/DataTable.tsx
 import {
   flexRender,
@@ -94,7 +495,7 @@ import {
   getPaginationRowModel,
   useReactTable
 } from "@tanstack/react-table";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 function DataTable({
   columns,
   data,
@@ -113,42 +514,67 @@ function DataTable({
       columnVisibility: config?.columnVisibility
     }
   });
-  return /* @__PURE__ */ jsx2("div", { className: "w-full", children: /* @__PURE__ */ jsx2("div", { className: "rounded-md border overflow-hidden", children: /* @__PURE__ */ jsxs(Table, { children: [
-    /* @__PURE__ */ jsx2(TableHeader, { className: "bg-muted", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx2(TableRow, { children: headerGroup.headers.map((header) => {
-      return /* @__PURE__ */ jsx2(
-        TableHead,
+  return /* @__PURE__ */ jsxs2("div", { className: "w-full", children: [
+    /* @__PURE__ */ jsx5("div", { className: "rounded-md border overflow-hidden", children: /* @__PURE__ */ jsxs2(Table, { children: [
+      /* @__PURE__ */ jsx5(TableHeader, { className: "bg-muted", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx5(TableRow, { children: headerGroup.headers.map((header) => {
+        return /* @__PURE__ */ jsx5(
+          TableHead,
+          {
+            colSpan: header.colSpan,
+            style: { width: header.getSize() },
+            children: header.isPlaceholder ? null : flexRender(
+              header.column.columnDef.header,
+              header.getContext()
+            )
+          },
+          header.id
+        );
+      }) }, headerGroup.id)) }),
+      /* @__PURE__ */ jsx5(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx5(
+        TableRow,
         {
-          colSpan: header.colSpan,
-          style: { width: header.getSize() },
-          children: header.isPlaceholder ? null : flexRender(
-            header.column.columnDef.header,
-            header.getContext()
-          )
+          "data-state": row.getIsSelected() && "selected",
+          children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx5(TableCell, { className: "truncate max-w-0", children: flexRender(
+            cell.column.columnDef.cell,
+            cell.getContext()
+          ) }, cell.id))
         },
-        header.id
-      );
-    }) }, headerGroup.id)) }),
-    /* @__PURE__ */ jsx2(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx2(
-      TableRow,
-      {
-        "data-state": row.getIsSelected() && "selected",
-        children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx2(TableCell, { className: "truncate max-w-0", children: flexRender(
-          cell.column.columnDef.cell,
-          cell.getContext()
-        ) }, cell.id))
-      },
-      row.id
-    )) : /* @__PURE__ */ jsx2(TableRow, { children: /* @__PURE__ */ jsx2(
-      TableCell,
-      {
-        className: "h-24 text-center",
-        colSpan: columns.length,
-        children: "No results."
-      }
-    ) }) })
-  ] }) }) });
+        row.id
+      )) : /* @__PURE__ */ jsx5(TableRow, { children: /* @__PURE__ */ jsx5(
+        TableCell,
+        {
+          className: "h-24 text-center",
+          colSpan: columns.length,
+          children: "No results."
+        }
+      ) }) })
+    ] }) }),
+    /* @__PURE__ */ jsx5(DataTablePagination, { table })
+  ] });
 }
 export {
   DataTable,
   DataTable as default
 };
+/*! Bundled license information:
+
+lucide-react/dist/esm/shared/src/utils/mergeClasses.js:
+lucide-react/dist/esm/shared/src/utils/toKebabCase.js:
+lucide-react/dist/esm/shared/src/utils/toCamelCase.js:
+lucide-react/dist/esm/shared/src/utils/toPascalCase.js:
+lucide-react/dist/esm/defaultAttributes.js:
+lucide-react/dist/esm/shared/src/utils/hasA11yProp.js:
+lucide-react/dist/esm/Icon.js:
+lucide-react/dist/esm/createLucideIcon.js:
+lucide-react/dist/esm/icons/chevron-left.js:
+lucide-react/dist/esm/icons/chevron-right.js:
+lucide-react/dist/esm/icons/chevrons-left.js:
+lucide-react/dist/esm/icons/chevrons-right.js:
+lucide-react/dist/esm/lucide-react.js:
+  (**
+   * @license lucide-react v0.574.0 - ISC
+   *
+   * This source code is licensed under the ISC license.
+   * See the LICENSE file in the root directory of this source tree.
+   *)
+*/