@open-mercato/ui 0.5.1-develop.2953.6647bb2c43 → 0.5.1-develop.2964.d5ac4a6ebb

package/dist/backend/DataTable.js

@@ -8,6 +8,13 @@ import { RefreshCw, Loader2, SlidersHorizontal, MoreHorizontal, Circle, Filter,
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../primitives/table.js";
 import { Button } from "../primitives/button.js";
 import { Checkbox } from "../primitives/checkbox.js";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "../primitives/select.js";
 import { Spinner } from "../primitives/spinner.js";
 import { TooltipProvider } from "../primitives/tooltip.js";
 import { TruncatedCell } from "./TruncatedCell.js";
@@ -1407,17 +1414,26 @@ function DataTable({
       [pagination.pageSize, ...pagination.pageSizeOptions].filter((size) => typeof size === "number" && Number.isFinite(size) && size > 0).map((size) => Math.max(1, Math.floor(size)))
     )).sort((left, right) => left - right) : [];
     const pageSizeSelect = pageSizeOptions.length > 0 && pagination.onPageSizeChange ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx(
-        "select",
+      /* @__PURE__ */ jsxs(
+        Select,
         {
-          className: "rounded border bg-background pl-2 pr-7 py-0.5 text-sm min-w-[3.5rem]",
-          value: pagination.pageSize,
-          onChange: (event) => {
-            pagination.onPageSizeChange(Number(event.target.value));
+          value: String(pagination.pageSize),
+          onValueChange: (value) => {
+            pagination.onPageSizeChange(Number(value));
             scrollTableIntoView();
           },
-          "aria-label": t("ui.dataTable.pagination.rowsPerPage", "Rows per page"),
-          children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx("option", { value: size, children: size }, size))
+          children: [
+            /* @__PURE__ */ jsx(
+              SelectTrigger,
+              {
+                size: "sm",
+                className: "min-w-[4rem]",
+                "aria-label": t("ui.dataTable.pagination.rowsPerPage", "Rows per page"),
+                children: /* @__PURE__ */ jsx(SelectValue, {})
+              }
+            ),
+            /* @__PURE__ */ jsx(SelectContent, { children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx(SelectItem, { value: String(size), children: size }, size)) })
+          ]
         }
       ),
       /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: t("ui.dataTable.pagination.perPage", "per page") })
@@ -1714,13 +1730,15 @@ function DataTable({
     ) : null;
     const fieldsetSelector = supportsCustomFieldFilterFieldsets && resolvedEntityIds.length === 1 ? /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
       /* @__PURE__ */ jsx("div", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.dataTable.fieldset.label", "Fieldset") }),
-      /* @__PURE__ */ jsx(
-        "select",
+      /* @__PURE__ */ jsxs(
+        Select,
         {
-          className: "w-full rounded border bg-background px-2 py-2 text-sm",
-          value: activeCustomFieldFilterFieldset ?? "",
-          onChange: (event) => handleCustomFieldFilterFieldsetChange(event.target.value),
-          children: (cfFilterFieldsetsByEntity[resolvedEntityIds[0]] ?? []).map((fieldset) => /* @__PURE__ */ jsx("option", { value: fieldset.code, children: fieldset.label }, fieldset.code))
+          value: activeCustomFieldFilterFieldset || void 0,
+          onValueChange: (value) => handleCustomFieldFilterFieldsetChange(value),
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: (cfFilterFieldsetsByEntity[resolvedEntityIds[0]] ?? []).map((fieldset) => /* @__PURE__ */ jsx(SelectItem, { value: fieldset.code, children: fieldset.label }, fieldset.code)) })
+          ]
         }
       )
     ] }) : null;