@mendylanda/ui 0.3.2-dev.55.6b71962091a7 → 0.3.2-dev.57.4108694e944d

package/dist/styles.css

@@ -67,6 +67,9 @@
   .mui-cced28c6dc3f:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-start: var(--spacing);
   }
+  .mui-8368bbb62f66:where([data-mendy-ui], [data-mendy-ui] *) {
+    inset-inline-start: calc(var(--spacing) * 0);
+  }
   .mui-207bd0b3f259:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-start: calc(var(--spacing) * 2);
   }
@@ -76,6 +79,9 @@
   .mui-361e48d0308f:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-end: var(--spacing);
   }
+  .mui-aa7bcba08429:where([data-mendy-ui], [data-mendy-ui] *) {
+    inset-inline-end: calc(var(--spacing) * 0);
+  }
   .mui-13422ddc8d83:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-end: calc(var(--spacing) * 1);
   }
@@ -88,9 +94,6 @@
   .mui-4e45f4841abb:where([data-mendy-ui], [data-mendy-ui] *) {
     top: calc(1 / 2 * 100%);
   }
-  .mui-a74c4477017c:where([data-mendy-ui], [data-mendy-ui] *) {
-    right: calc(var(--spacing) * 0);
-  }
   .mui-30150dd033ab:where([data-mendy-ui], [data-mendy-ui] *) {
     bottom: calc(var(--spacing) * 0);
   }
@@ -154,6 +157,9 @@
   .mui-291952c2525a:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-inline-start: -1px;
   }
+  .mui-5cf4ab3b6fa0:where([data-mendy-ui], [data-mendy-ui] *) {
+    margin-inline-start: auto;
+  }
   .mui-8cc46fa87f41:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-inline-end: calc(var(--spacing) * -1.5);
   }
@@ -166,9 +172,6 @@
   .mui-f28fea81a5cd:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-top: calc(var(--spacing) * 2);
   }
-  .mui-cc51bda60e7e:where([data-mendy-ui], [data-mendy-ui] *) {
-    margin-left: auto;
-  }
   .mui-496aca80e4d8:where([data-mendy-ui], [data-mendy-ui] *) {
     display: block;
   }
@@ -537,17 +540,17 @@
   .mui-02e603944040:where([data-mendy-ui], [data-mendy-ui] *) {
     border-radius: max(0px, calc(var(--radius, 0.5rem) - 4px));
   }
+  .mui-7efd3a0ebfc6:where([data-mendy-ui], [data-mendy-ui] *) {
+    border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+    border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+  }
   .mui-b31810dbd8a9:where([data-mendy-ui], [data-mendy-ui] *) {
     border-start-start-radius: 0;
     border-end-start-radius: 0;
   }
-  .mui-10c0bae8cba9:where([data-mendy-ui], [data-mendy-ui] *) {
-    border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-    border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-  }
-  .mui-34bbd346e74c:where([data-mendy-ui], [data-mendy-ui] *) {
-    border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-    border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+  .mui-7f3780751c2e:where([data-mendy-ui], [data-mendy-ui] *) {
+    border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+    border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
   }
   .mui-4f1a55de40bc:where([data-mendy-ui], [data-mendy-ui] *) {
     border-style: var(--mendy-tw-border-style);
@@ -691,12 +694,18 @@
   .mui-96b92a971c95:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-block: calc(var(--spacing) * 5);
   }
+  .mui-6dd4e62564b2:where([data-mendy-ui], [data-mendy-ui] *) {
+    padding-inline-start: calc(var(--spacing) * 2);
+  }
   .mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-start: calc(var(--spacing) * 8);
   }
   .mui-b2100041c585:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-start: calc(var(--spacing) * 9);
   }
+  .mui-b15eee699c4b:where([data-mendy-ui], [data-mendy-ui] *) {
+    padding-inline-end: calc(var(--spacing) * 1);
+  }
   .mui-05d4103bd67f:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-end: calc(var(--spacing) * 2);
   }
@@ -712,12 +721,6 @@
   .mui-0a702d97ed7d:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-top: calc(var(--spacing) * 3);
   }
-  .mui-1a52da5bc88c:where([data-mendy-ui], [data-mendy-ui] *) {
-    padding-right: calc(var(--spacing) * 1);
-  }
-  .mui-f5d8e661d857:where([data-mendy-ui], [data-mendy-ui] *) {
-    padding-left: calc(var(--spacing) * 2);
-  }
   .mui-05ab12448317:where([data-mendy-ui], [data-mendy-ui] *) {
     text-align: center;
   }
@@ -1320,9 +1323,9 @@
       background-color: var(--accent, #f5f5f5);
     }
   }
-  .mui-6fa6a8ade7c4:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-1da7bb9a299c:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-inset] {
-      padding-left: calc(var(--spacing) * 8);
+      padding-inline-start: calc(var(--spacing) * 8);
     }
   }
   .mui-bbaaa5969856:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1343,10 +1346,10 @@
       border-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-  .mui-a55dbe6f3eec:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-35468f495139:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-range-end="true"] {
-      border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
   .mui-714051e55e8e:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1379,10 +1382,10 @@
       border-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-  .mui-ab65911baf1d:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-6143f152715b:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-range-start="true"] {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
   .mui-f5460d79341c:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1740,10 +1743,10 @@
       appearance: none;
     }
   }
-  .mui-74ab31abd804:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-9b9b154fb4bf:where([data-mendy-ui], [data-mendy-ui] *) {
     &:first-child[data-selected=true] button {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
   .mui-13858191ca50:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1773,16 +1776,16 @@
       }
     }
   }
-  .mui-6ee0c74de40c:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-e9494a526550:where([data-mendy-ui], [data-mendy-ui] *) {
     &:last-child[data-selected=true] button {
-      border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-  .mui-6162ab70efb5:where([data-mendy-ui], [data-mendy-ui] *) {
+  .mui-167d036894df:where([data-mendy-ui], [data-mendy-ui] *) {
     &:nth-child(2)[data-selected=true] button {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
   .mui-f157ee6bae99:where([data-mendy-ui], [data-mendy-ui] *) {

package/dist/styles.tailwind3.css

@@ -66,6 +66,9 @@
 .mui-cced28c6dc3f:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-start: var(--spacing);
   }
+.mui-8368bbb62f66:where([data-mendy-ui], [data-mendy-ui] *) {
+    inset-inline-start: calc(var(--spacing) * 0);
+  }
 .mui-207bd0b3f259:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-start: calc(var(--spacing) * 2);
   }
@@ -75,6 +78,9 @@
 .mui-361e48d0308f:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-end: var(--spacing);
   }
+.mui-aa7bcba08429:where([data-mendy-ui], [data-mendy-ui] *) {
+    inset-inline-end: calc(var(--spacing) * 0);
+  }
 .mui-13422ddc8d83:where([data-mendy-ui], [data-mendy-ui] *) {
     inset-inline-end: calc(var(--spacing) * 1);
   }
@@ -87,9 +93,6 @@
 .mui-4e45f4841abb:where([data-mendy-ui], [data-mendy-ui] *) {
     top: calc(1 / 2 * 100%);
   }
-.mui-a74c4477017c:where([data-mendy-ui], [data-mendy-ui] *) {
-    right: calc(var(--spacing) * 0);
-  }
 .mui-30150dd033ab:where([data-mendy-ui], [data-mendy-ui] *) {
     bottom: calc(var(--spacing) * 0);
   }
@@ -153,6 +156,9 @@
 .mui-291952c2525a:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-inline-start: -1px;
   }
+.mui-5cf4ab3b6fa0:where([data-mendy-ui], [data-mendy-ui] *) {
+    margin-inline-start: auto;
+  }
 .mui-8cc46fa87f41:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-inline-end: calc(var(--spacing) * -1.5);
   }
@@ -165,9 +171,6 @@
 .mui-f28fea81a5cd:where([data-mendy-ui], [data-mendy-ui] *) {
     margin-top: calc(var(--spacing) * 2);
   }
-.mui-cc51bda60e7e:where([data-mendy-ui], [data-mendy-ui] *) {
-    margin-left: auto;
-  }
 .mui-496aca80e4d8:where([data-mendy-ui], [data-mendy-ui] *) {
     display: block;
   }
@@ -536,17 +539,17 @@
 .mui-02e603944040:where([data-mendy-ui], [data-mendy-ui] *) {
     border-radius: max(0px, calc(var(--radius, 0.5rem) - 4px));
   }
+.mui-7efd3a0ebfc6:where([data-mendy-ui], [data-mendy-ui] *) {
+    border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+    border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+  }
 .mui-b31810dbd8a9:where([data-mendy-ui], [data-mendy-ui] *) {
     border-start-start-radius: 0;
     border-end-start-radius: 0;
   }
-.mui-10c0bae8cba9:where([data-mendy-ui], [data-mendy-ui] *) {
-    border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-    border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-  }
-.mui-34bbd346e74c:where([data-mendy-ui], [data-mendy-ui] *) {
-    border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-    border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+.mui-7f3780751c2e:where([data-mendy-ui], [data-mendy-ui] *) {
+    border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+    border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
   }
 .mui-4f1a55de40bc:where([data-mendy-ui], [data-mendy-ui] *) {
     border-style: var(--mendy-tw-border-style);
@@ -690,12 +693,18 @@
 .mui-96b92a971c95:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-block: calc(var(--spacing) * 5);
   }
+.mui-6dd4e62564b2:where([data-mendy-ui], [data-mendy-ui] *) {
+    padding-inline-start: calc(var(--spacing) * 2);
+  }
 .mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-start: calc(var(--spacing) * 8);
   }
 .mui-b2100041c585:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-start: calc(var(--spacing) * 9);
   }
+.mui-b15eee699c4b:where([data-mendy-ui], [data-mendy-ui] *) {
+    padding-inline-end: calc(var(--spacing) * 1);
+  }
 .mui-05d4103bd67f:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-inline-end: calc(var(--spacing) * 2);
   }
@@ -711,12 +720,6 @@
 .mui-0a702d97ed7d:where([data-mendy-ui], [data-mendy-ui] *) {
     padding-top: calc(var(--spacing) * 3);
   }
-.mui-1a52da5bc88c:where([data-mendy-ui], [data-mendy-ui] *) {
-    padding-right: calc(var(--spacing) * 1);
-  }
-.mui-f5d8e661d857:where([data-mendy-ui], [data-mendy-ui] *) {
-    padding-left: calc(var(--spacing) * 2);
-  }
 .mui-05ab12448317:where([data-mendy-ui], [data-mendy-ui] *) {
     text-align: center;
   }
@@ -1319,9 +1322,9 @@
       background-color: var(--accent, #f5f5f5);
     }
   }
-.mui-6fa6a8ade7c4:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-1da7bb9a299c:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-inset] {
-      padding-left: calc(var(--spacing) * 8);
+      padding-inline-start: calc(var(--spacing) * 8);
     }
   }
 .mui-bbaaa5969856:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1342,10 +1345,10 @@
       border-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-.mui-a55dbe6f3eec:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-35468f495139:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-range-end="true"] {
-      border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
 .mui-714051e55e8e:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1378,10 +1381,10 @@
       border-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-.mui-ab65911baf1d:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-6143f152715b:where([data-mendy-ui], [data-mendy-ui] *) {
     &[data-range-start="true"] {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
 .mui-f5460d79341c:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1739,10 +1742,10 @@
       appearance: none;
     }
   }
-.mui-74ab31abd804:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-9b9b154fb4bf:where([data-mendy-ui], [data-mendy-ui] *) {
     &:first-child[data-selected=true] button {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
 .mui-13858191ca50:where([data-mendy-ui], [data-mendy-ui] *) {
@@ -1772,16 +1775,16 @@
       }
     }
   }
-.mui-6ee0c74de40c:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-e9494a526550:where([data-mendy-ui], [data-mendy-ui] *) {
     &:last-child[data-selected=true] button {
-      border-top-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-right-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-end-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
-.mui-6162ab70efb5:where([data-mendy-ui], [data-mendy-ui] *) {
+.mui-167d036894df:where([data-mendy-ui], [data-mendy-ui] *) {
     &:nth-child(2)[data-selected=true] button {
-      border-top-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
-      border-bottom-left-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-start-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
+      border-end-start-radius: max(0px, calc(var(--radius, 0.5rem) - 2px));
     }
   }
 .mui-f157ee6bae99:where([data-mendy-ui], [data-mendy-ui] *) {

package/dist/table/table-column-settings.js

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMendyLocale } from "../locale-context.js";
 import { useId } from "react";
 import { DragDropContext, Draggable, Droppable } from "@hello-pangea/dnd";
 import { GripVertical, Pin, RotateCcw, SlidersHorizontal } from "lucide-react";
@@ -11,6 +12,7 @@ import { cn } from "../utils.js";
 import { applyTablePreferences } from "./use-data-table.js";
 export function TableColumnSettings({ table, children, }) {
     const id = useId();
+    const { t, direction } = useMendyLocale();
     const { portalContainer } = useMendyUI();
     const columns = table.getAllLeafColumns();
     const byId = new Map(columns.map((column) => [column.id, column]));
@@ -22,9 +24,9 @@ export function TableColumnSettings({ table, children, }) {
     const start = columns.filter((column) => column.getIsPinned() === "start").length;
     const end = columns.filter((column) => column.getIsPinned() === "end").length;
     const summary = [
-        hidden && `${hidden} hidden`,
-        start && `${start} pinned left`,
-        end && `${end} pinned right`,
+        hidden && t("hiddenColumns", { count: hidden }),
+        start && t(direction === "rtl" ? "pinnedRight" : "pinnedLeft", { count: start }),
+        end && t(direction === "rtl" ? "pinnedLeft" : "pinnedRight", { count: end }),
     ]
         .filter(Boolean)
         .join(", ");
@@ -36,20 +38,32 @@ export function TableColumnSettings({ table, children, }) {
         next.splice(result.destination.index, 0, moved);
         table.setColumnOrder(next);
     }
-    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon-sm", "aria-label": "Column settings", title: "Column settings", children: _jsx(SlidersHorizontal, { className: "mui-100c22d5776b" }) }) }), _jsxs(PopoverContent, { align: "end", "aria-label": "Column settings", className: "mui-222f930b8752 mui-a4cce7869436 mui-302c0d124a94 mui-04760bcd507f", onCloseAutoFocus: (event) => {
+    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon-sm", "aria-label": t("columnSettings"), title: t("columnSettings"), children: _jsx(SlidersHorizontal, { className: "mui-100c22d5776b" }) }) }), _jsxs(PopoverContent, { align: "end", "aria-label": t("columnSettings"), className: "mui-222f930b8752 mui-a4cce7869436 mui-302c0d124a94 mui-04760bcd507f", onCloseAutoFocus: (event) => {
                     if (document.activeElement?.closest('[role="grid"]'))
                         event.preventDefault();
-                }, children: [_jsxs("div", { className: "mui-27ead27a81df mui-bbe39cfb5cc6 mui-9513b3968002 mui-d3cea061f2f3", children: [_jsx("h4", { className: "mui-c74ab393b96d mui-daaac3fbf55e", children: "Column settings" }), _jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", children: "Drag to reorder, toggle visibility, and pin columns." })] }), children, _jsx(DragDropContext, { onDragEnd: reorder, children: _jsx(Droppable, { droppableId: id, getContainerForClone: () => portalContainer ?? document.body, renderClone: (provided, snapshot, rubric) => (_jsx(ColumnSettingsRow, { column: ordered[rubric.source.index], provided: provided, dragging: snapshot.isDragging })), children: (provided) => (_jsxs("div", { ref: provided.innerRef, ...provided.droppableProps, className: "mui-410da8dfa8ac mui-da0beef015c9 mui-2368e909f3a5 mui-b97db4a9f432", children: [ordered.map((column, index) => (_jsx(Draggable, { draggableId: `${id}-${column.id}`, disableInteractiveElementBlocking: true, index: index, children: (provided, snapshot) => (_jsx(ColumnSettingsRow, { column: column, provided: provided, dragging: snapshot.isDragging })) }, column.id))), provided.placeholder] })) }) }), _jsxs("div", { className: "mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-32c92bb1fde4 mui-074569488cca mui-894c3815a57f mui-9513b3968002 mui-b5edc3ea7c91", children: [_jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", "aria-live": "polite", children: summary || "No changes" }), _jsxs(Button, { variant: "ghost", size: "sm", className: "mui-c8e50836f8a1 mui-e7e01cc7f4df mui-3992de70b033", "aria-label": "Reset columns", onClick: () => applyTablePreferences(table, { version: 1, ...table.initialState }), children: [_jsx(RotateCcw, { className: "mui-5e34f5313859" }), "Reset"] })] })] })] }));
+                }, children: [_jsxs("div", { className: "mui-27ead27a81df mui-bbe39cfb5cc6 mui-9513b3968002 mui-d3cea061f2f3", children: [_jsx("h4", { className: "mui-c74ab393b96d mui-daaac3fbf55e", children: t("columnSettings") }), _jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", children: t("columnSettingsHint") })] }), children, _jsx(DragDropContext, { dragHandleUsageInstructions: t("dragInstructions"), onDragStart: (start, { announce }) => announce(t("dragStart", { index: start.source.index + 1 })), onDragUpdate: (update, { announce }) => announce(t("dragMove", { index: (update.destination ?? update.source).index + 1 })), onDragEnd: (result, { announce }) => {
+                            reorder(result);
+                            announce(result.reason === "CANCEL" || !result.destination
+                                ? t("dragCancel")
+                                : t("dragEnd", { index: result.destination.index + 1 }));
+                        }, children: _jsx(Droppable, { droppableId: id, getContainerForClone: () => portalContainer ?? document.body, renderClone: (provided, snapshot, rubric) => (_jsx(ColumnSettingsRow, { column: ordered[rubric.source.index], provided: provided, dragging: snapshot.isDragging })), children: (provided) => (_jsxs("div", { ref: provided.innerRef, ...provided.droppableProps, className: "mui-410da8dfa8ac mui-da0beef015c9 mui-2368e909f3a5 mui-b97db4a9f432", children: [ordered.map((column, index) => (_jsx(Draggable, { draggableId: `${id}-${column.id}`, disableInteractiveElementBlocking: true, index: index, children: (provided, snapshot) => (_jsx(ColumnSettingsRow, { column: column, provided: provided, dragging: snapshot.isDragging })) }, column.id))), provided.placeholder] })) }) }), _jsxs("div", { className: "mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-32c92bb1fde4 mui-074569488cca mui-894c3815a57f mui-9513b3968002 mui-b5edc3ea7c91", children: [_jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", "aria-live": "polite", children: summary || t("noChanges") }), _jsxs(Button, { variant: "ghost", size: "sm", className: "mui-c8e50836f8a1 mui-e7e01cc7f4df mui-3992de70b033", "aria-label": t("resetColumns"), onClick: () => applyTablePreferences(table, { version: 1, ...table.initialState }), children: [_jsx(RotateCcw, { className: "mui-5e34f5313859" }), t("reset")] })] })] })] }));
 }
 function ColumnSettingsRow({ column, provided, dragging, }) {
     const definition = column.columnDef;
-    const label = definition.label ?? (typeof definition.header === "string" ? definition.header : column.id);
+    const { t, direction, code } = useMendyLocale();
+    const label = (column.id === "_selection" && definition.label === "Select rows"
+        ? t("selectRows")
+        : definition.label) ??
+        (typeof definition.header === "string" ? definition.header : column.id);
     const pin = column.getIsPinned();
-    const next = pin === "start" ? "end" : pin === "end" ? false : "start";
-    const pinLabel = next === "start"
-        ? `Pin ${label} to left`
-        : next === "end"
-            ? `Pin ${label} to right`
-            : `Unpin ${label}`;
-    return (_jsxs("div", { ref: provided.innerRef, ...provided.draggableProps, "data-mendy-ui": "", "data-column-setting": column.id, "data-dragging": dragging, style: provided.draggableProps.style, className: cn("mui-222f930b8752 mui-71556df3b421 mui-074569488cca mui-3fa8c572949b mui-5b272f3c5076 mui-e7e01cc7f4df mui-a8c1dfb1d4ef mui-c74ab393b96d mui-957a109f887f", dragging ? "mui-3eef1ce97dba mui-0d4ca75de41c mui-853be6c11609 mui-fd9d0b696aac" : "mui-5cbdd1b32f1a"), children: [_jsx("button", { type: "button", ...provided.dragHandleProps, "aria-label": `Reorder ${label}`, title: "Drag to reorder. Press Space to move with arrow keys.", className: "mui-222f930b8752 mui-2bd43fb57913 mui-27ead27a81df mui-f2e47d9c52ad mui-71556df3b421 mui-a503dd374cca mui-02e603944040 mui-35f35c41d134 mui-b30fc56058b6 mui-355efe22aedb mui-db549d38ff19 mui-71998ea7a2d0", children: _jsx(GripVertical, { className: "mui-61c000c8a98a" }) }), _jsxs("label", { className: "mui-222f930b8752 mui-184ddc11e5f9 mui-7bd5bab6d7f4 mui-d2fa8848968d mui-71556df3b421 mui-074569488cca", children: [_jsx(Checkbox, { checked: column.getIsVisible(), disabled: !column.getCanHide(), onCheckedChange: (value) => column.toggleVisibility(value === true), "aria-label": `Show ${label}` }), _jsx("span", { className: "mui-5a3a4ee420c2", title: label, children: label })] }), _jsx(Button, { variant: "ghost", size: "icon-sm", disabled: !column.getCanPin(), "aria-label": pinLabel, title: pinLabel, className: cn("mui-0712570dcc9f mui-27ead27a81df", pin && "mui-87ecb59f2d2d"), onClick: () => column.pin(next), children: _jsx(Pin, { className: cn("mui-61c000c8a98a", pin === "start" && "mui-4e3f08588318", pin === "end" && "mui-c80411b7591f", !pin && "mui-35f35c41d134") }) })] }));
+    const { next, message } = pinAction(pin, direction);
+    const pinLabel = t(message, { label });
+    return (_jsxs("div", { ref: provided.innerRef, ...provided.draggableProps, "data-mendy-ui": "", "data-column-setting": column.id, dir: direction, lang: code, "data-dragging": dragging, style: provided.draggableProps.style, className: cn("mui-222f930b8752 mui-71556df3b421 mui-074569488cca mui-3fa8c572949b mui-5b272f3c5076 mui-e7e01cc7f4df mui-a8c1dfb1d4ef mui-c74ab393b96d mui-957a109f887f", dragging ? "mui-3eef1ce97dba mui-0d4ca75de41c mui-853be6c11609 mui-fd9d0b696aac" : "mui-5cbdd1b32f1a"), children: [_jsx("button", { type: "button", ...provided.dragHandleProps, "aria-label": t("reorder", { label }), title: t("dragHint"), className: "mui-222f930b8752 mui-2bd43fb57913 mui-27ead27a81df mui-f2e47d9c52ad mui-71556df3b421 mui-a503dd374cca mui-02e603944040 mui-35f35c41d134 mui-b30fc56058b6 mui-355efe22aedb mui-db549d38ff19 mui-71998ea7a2d0", children: _jsx(GripVertical, { className: "mui-61c000c8a98a" }) }), _jsxs("label", { className: "mui-222f930b8752 mui-184ddc11e5f9 mui-7bd5bab6d7f4 mui-d2fa8848968d mui-71556df3b421 mui-074569488cca", children: [_jsx(Checkbox, { checked: column.getIsVisible(), disabled: !column.getCanHide(), onCheckedChange: (value) => column.toggleVisibility(value === true), "aria-label": t("showColumn", { label }) }), _jsx("span", { className: "mui-5a3a4ee420c2", title: label, children: label })] }), _jsx(Button, { variant: "ghost", size: "icon-sm", disabled: !column.getCanPin(), "aria-label": pinLabel, title: pinLabel, className: cn("mui-0712570dcc9f mui-27ead27a81df", pin && "mui-87ecb59f2d2d"), onClick: () => column.pin(next), children: _jsx(Pin, { className: cn("mui-61c000c8a98a", pin === "start" && "mui-4e3f08588318", pin === "end" && "mui-c80411b7591f", !pin && "mui-35f35c41d134") }) })] }));
+}
+function pinAction(pin, direction) {
+    if (pin === "end")
+        return { next: false, message: "unpin" };
+    if (pin === "start")
+        return { next: "end", message: direction === "rtl" ? "pinLeft" : "pinRight" };
+    return { next: "start", message: direction === "rtl" ? "pinRight" : "pinLeft" };
 }

package/dist/table/table-controls.js

@@ -1,5 +1,6 @@
 "use client";
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMendyLocale } from "../locale-context.js";
 import { useState } from "react";
 import { ChevronLeft, ChevronRight } from "lucide-react";
 import { Button } from "../primitives/button.js";
@@ -8,7 +9,13 @@ import { Input } from "../primitives/input.js";
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, } from "../primitives/dropdown-menu.js";
 export { TableColumnSettings } from "./table-column-settings.js";
 export function TablePagination({ table, loading, }) {
-    return (_jsxs("nav", { "data-mendy-ui": "", "aria-label": "Table pagination", className: "mui-222f930b8752 mui-faa8a23c68f6 mui-71556df3b421 mui-307644c34db6 mui-d7db3451d154 mui-b5edc3ea7c91 mui-c74ab393b96d", children: [_jsxs("span", { children: ["Page ", table.state.pagination.pageIndex + 1, table.getPageCount() >= 0 ? ` of ${Math.max(1, table.getPageCount())}` : ""] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", size: "sm", children: [table.state.pagination.pageSize, " rows"] }) }), _jsx(DropdownMenuContent, { children: [10, 20, 50, 100].map((size) => (_jsxs(DropdownMenuItem, { onSelect: () => table.setPageSize(size), children: [size, " rows"] }, size))) })] }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanPreviousPage(), "aria-label": "Previous page", onClick: () => table.previousPage(), children: _jsx(ChevronLeft, { className: "mui-100c22d5776b" }) }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanNextPage(), "aria-label": "Next page", onClick: () => table.nextPage(), children: _jsx(ChevronRight, { className: "mui-100c22d5776b" }) })] }));
+    const { t } = useMendyLocale();
+    return (_jsxs("nav", { "data-mendy-ui": "", "aria-label": t("pagination"), className: "mui-222f930b8752 mui-faa8a23c68f6 mui-71556df3b421 mui-307644c34db6 mui-d7db3451d154 mui-b5edc3ea7c91 mui-c74ab393b96d", children: [_jsx("span", { children: table.getPageCount() >= 0
+                    ? t("pageOf", {
+                        page: table.state.pagination.pageIndex + 1,
+                        count: Math.max(1, table.getPageCount()),
+                    })
+                    : t("page", { page: table.state.pagination.pageIndex + 1 }) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "sm", children: t("rowsPerPage", { count: table.state.pagination.pageSize }) }) }), _jsx(DropdownMenuContent, { children: [10, 20, 50, 100].map((size) => (_jsx(DropdownMenuItem, { onSelect: () => table.setPageSize(size), children: t("rowsPerPage", { count: size }) }, size))) })] }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanPreviousPage(), "aria-label": t("previousPage"), onClick: () => table.previousPage(), children: _jsx(ChevronLeft, { className: "mui-100c22d5776b mui-36b12e8339c7" }) }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanNextPage(), "aria-label": t("nextPage"), onClick: () => table.nextPage(), children: _jsx(ChevronRight, { className: "mui-100c22d5776b mui-36b12e8339c7" }) })] }));
 }
 export function selectionColumn() {
     return {
@@ -23,17 +30,19 @@ export function selectionColumn() {
         enableCellSelection: false,
         pin: "start",
         exportOptions: false,
-        header: ({ table }) => (_jsx(Checkbox, { "data-mendy-ui": "", "aria-label": "Select loaded rows", checked: table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && "indeterminate"), onCheckedChange: (value) => table.toggleAllPageRowsSelected(value === true) })),
-        cell: ({ row }) => (_jsx(Checkbox, { "data-mendy-ui": "", "aria-label": `Select row ${row.id}`, checked: row.getIsSelected(), disabled: !row.getCanSelect(), onCheckedChange: (value) => row.toggleSelected(value === true) })),
+        header: ({ table }) => (_jsx(SelectionCheckbox, { checked: table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && "indeterminate"), onCheckedChange: (value) => table.toggleAllPageRowsSelected(value === true) })),
+        cell: ({ row }) => (_jsx(SelectionCheckbox, { rowId: row.id, checked: row.getIsSelected(), disabled: !row.getCanSelect(), onCheckedChange: (value) => row.toggleSelected(value === true) })),
     };
 }
 export function TableActionBar({ count, children, onClear, }) {
+    const { t } = useMendyLocale();
     if (!count)
         return null;
-    return (_jsxs("div", { "data-mendy-ui": "", role: "region", "aria-label": "Selected row actions", className: "mui-964a9431ff49 mui-a5c36273c0f0 mui-fbb62f5cb6fe mui-1752f11474a6 mui-222f930b8752 mui-8cfb5a42ef9f mui-81b198a2db84 mui-faa8a23c68f6 mui-71556df3b421 mui-d7db3451d154 mui-3fa8c572949b mui-4f1a55de40bc mui-5b272f3c5076 mui-0f9e6672913a mui-b5edc3ea7c91 mui-94ea94fde25f", children: [_jsxs("span", { className: "mui-c74ab393b96d", children: [count, " selected"] }), children, _jsx(Button, { variant: "ghost", size: "sm", onClick: onClear, children: "Clear selection" })] }));
+    return (_jsxs("div", { "data-mendy-ui": "", role: "region", "aria-label": t("selectedActions"), className: "mui-964a9431ff49 mui-a5c36273c0f0 mui-fbb62f5cb6fe mui-1752f11474a6 mui-222f930b8752 mui-8cfb5a42ef9f mui-81b198a2db84 mui-faa8a23c68f6 mui-71556df3b421 mui-d7db3451d154 mui-3fa8c572949b mui-4f1a55de40bc mui-5b272f3c5076 mui-0f9e6672913a mui-b5edc3ea7c91 mui-94ea94fde25f", children: [_jsx("span", { className: "mui-c74ab393b96d", children: t("selectedCount", { count }) }), children, _jsx(Button, { variant: "ghost", size: "sm", onClick: onClear, children: t("clearSelection") })] }));
 }
 export function TableSavedViews({ views, onApply, onSave, onDelete, }) {
     const [name, setName] = useState("");
+    const { t } = useMendyLocale();
     const [pending, setPending] = useState(false);
     const [error, setError] = useState(null);
     async function run(action) {
@@ -44,15 +53,19 @@ export function TableSavedViews({ views, onApply, onSave, onDelete, }) {
             setName("");
         }
         catch (reason) {
-            setError(reason instanceof Error ? reason.message : "Could not save changes.");
+            setError(reason instanceof Error ? reason.message : t("saveError"));
         }
         finally {
             setPending(false);
         }
     }
-    return (_jsxs("div", { "data-mendy-ui": "", className: "mui-222f930b8752 mui-faa8a23c68f6 mui-71556df3b421 mui-074569488cca", children: [_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { size: "sm", variant: "outline", children: "Saved views" }) }), _jsx(DropdownMenuContent, { children: views.length ? (views.map((view) => (_jsxs(DropdownMenuSub, { children: [_jsx(DropdownMenuSubTrigger, { children: view.name }), _jsxs(DropdownMenuSubContent, { children: [_jsx(DropdownMenuItem, { onSelect: () => onApply(view), children: "Apply" }), onDelete && (_jsx(DropdownMenuItem, { disabled: pending, onSelect: () => void run(() => onDelete(view)), children: "Delete" }))] })] }, view.id)))) : (_jsx(DropdownMenuItem, { disabled: true, children: "No saved views" })) })] }), _jsxs("form", { className: "mui-222f930b8752 mui-71556df3b421 mui-074569488cca", onSubmit: (event) => {
+    return (_jsxs("div", { "data-mendy-ui": "", className: "mui-222f930b8752 mui-faa8a23c68f6 mui-71556df3b421 mui-074569488cca", children: [_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { size: "sm", variant: "outline", children: t("savedViews") }) }), _jsx(DropdownMenuContent, { children: views.length ? (views.map((view) => (_jsxs(DropdownMenuSub, { children: [_jsx(DropdownMenuSubTrigger, { children: view.name }), _jsxs(DropdownMenuSubContent, { children: [_jsx(DropdownMenuItem, { onSelect: () => onApply(view), children: t("apply") }), onDelete && (_jsx(DropdownMenuItem, { disabled: pending, onSelect: () => void run(() => onDelete(view)), children: t("delete") }))] })] }, view.id)))) : (_jsx(DropdownMenuItem, { disabled: true, children: t("noSavedViews") })) })] }), _jsxs("form", { className: "mui-222f930b8752 mui-71556df3b421 mui-074569488cca", onSubmit: (event) => {
                     event.preventDefault();
                     if (name.trim() && !pending)
                         void run(() => onSave(name.trim()));
-                }, children: [_jsx(Input, { "aria-label": "New view name", value: name, onChange: (event) => setName(event.target.value), className: "mui-1fb07b38c63b mui-4ac4ec8dfbce" }), _jsx(Button, { type: "submit", size: "sm", disabled: pending || !name.trim(), children: "Save view" })] }), error && (_jsx("span", { role: "alert", className: "mui-c74ab393b96d mui-887b9502d5c7", children: error }))] }));
+                }, children: [_jsx(Input, { "aria-label": t("newViewName"), value: name, onChange: (event) => setName(event.target.value), className: "mui-1fb07b38c63b mui-4ac4ec8dfbce" }), _jsx(Button, { type: "submit", size: "sm", disabled: pending || !name.trim(), children: t("saveView") })] }), error && (_jsx("span", { role: "alert", className: "mui-c74ab393b96d mui-887b9502d5c7", children: error }))] }));
+}
+function SelectionCheckbox({ rowId, ...props }) {
+    const { t } = useMendyLocale();
+    return (_jsx(Checkbox, { ...props, "aria-label": rowId === undefined ? t("selectLoaded") : t("selectRow", { id: rowId }) }));
 }

package/dist/table/table-feedback.js

@@ -1,18 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMendyLocale } from "../locale-context.js";
 import { Button } from "../primitives/button.js";
 export function TableFeedbackRow({ children, columnCount, rowIndex, className, }) {
     return (_jsx("div", { role: "row", "aria-rowindex": rowIndex, className: className, children: _jsx("div", { role: "gridcell", "aria-colindex": 1, "aria-colspan": Math.max(1, columnCount), children: children }) }));
 }
 export function TableInitialState({ status, hasRows, loadingState, emptyState, error, retry, hasFilters, pageIndex = 0, clearFilters, firstPage, columnCount, }) {
+    const { t } = useMendyLocale();
     if (hasRows)
         return null;
     if (status === "loading")
         return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: 2, children: loadingState }));
     if (status === "error")
-        return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: 2, children: _jsxs("div", { role: "alert", className: "mui-c432836760e3 mui-05ab12448317", children: [error ?? "Could not load rows.", retry && (_jsx(Button, { variant: "outline", size: "sm", onClick: retry, children: "Retry" }))] }) }));
+        return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: 2, children: _jsxs("div", { role: "alert", className: "mui-c432836760e3 mui-05ab12448317", children: [error ?? t("loadRowsError"), retry && (_jsx(Button, { variant: "outline", size: "sm", onClick: retry, children: t("retry") }))] }) }));
     return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: 2, children: _jsx("div", { role: "status", className: "mui-222f930b8752 mui-302c0d124a94 mui-71556df3b421 mui-074569488cca mui-c7902d77ad80 mui-05ab12448317 mui-35f35c41d134", children: emptyState ??
-                (pageIndex > 0 ? (_jsxs(_Fragment, { children: [_jsx("span", { children: "No results on this page." }), _jsx(Button, { variant: "outline", size: "sm", onClick: firstPage, children: "Go to first page" })] })) : hasFilters ? (_jsxs(_Fragment, { children: [_jsx("span", { children: "No results match your filters." }), clearFilters && (_jsx(Button, { variant: "outline", size: "sm", onClick: clearFilters, children: "Clear filters" }))] })) : ("No rows yet.")) }) }));
+                (pageIndex > 0 ? (_jsxs(_Fragment, { children: [_jsx("span", { children: t("noPageResults") }), _jsx(Button, { variant: "outline", size: "sm", onClick: firstPage, children: t("firstPage") })] })) : hasFilters ? (_jsxs(_Fragment, { children: [_jsx("span", { children: t("noFilterResults") }), clearFilters && (_jsx(Button, { variant: "outline", size: "sm", onClick: clearFilters, children: t("clearFilters") }))] })) : (t("noRows"))) }) }));
 }
 export function TableLoadMore({ loadMore, columnCount, rowIndex, onLoad, }) {
-    return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: rowIndex, className: "mui-964a9431ff49 mui-635702706586", children: _jsxs("div", { className: "mui-222f930b8752 mui-71556df3b421 mui-a503dd374cca mui-074569488cca mui-96b92a971c95 mui-c74ab393b96d mui-35f35c41d134", children: [loadMore.loading ? (_jsxs("div", { role: "status", className: "mui-222f930b8752 mui-71556df3b421 mui-074569488cca", children: [_jsx("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className: "mui-2bd43fb57913 mui-27ead27a81df mui-2c14b55d77e6 mui-237747164b60", children: _jsx("path", { d: "M12 3v3m6.366-.366-2.12 2.12M21 12h-3m.366 6.366-2.12-2.12M12 21v-3m-6.366.366 2.12-2.12M3 12h3m-.366-6.366 2.12 2.12" }) }), _jsx("span", { children: "Loading more\u2026" })] })) : (_jsx(Button, { size: "sm", variant: "ghost", onClick: onLoad, children: loadMore.error ? "Retry loading more" : "Load more" })), loadMore.error && _jsx("span", { role: "alert", children: loadMore.error })] }) }));
+    const { t } = useMendyLocale();
+    return (_jsx(TableFeedbackRow, { columnCount: columnCount, rowIndex: rowIndex, className: "mui-964a9431ff49 mui-635702706586", children: _jsxs("div", { className: "mui-222f930b8752 mui-71556df3b421 mui-a503dd374cca mui-074569488cca mui-96b92a971c95 mui-c74ab393b96d mui-35f35c41d134", children: [loadMore.loading ? (_jsxs("div", { role: "status", className: "mui-222f930b8752 mui-71556df3b421 mui-074569488cca", children: [_jsx("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className: "mui-2bd43fb57913 mui-27ead27a81df mui-2c14b55d77e6 mui-237747164b60", children: _jsx("path", { d: "M12 3v3m6.366-.366-2.12 2.12M21 12h-3m.366 6.366-2.12-2.12M12 21v-3m-6.366.366 2.12-2.12M3 12h3m-.366-6.366 2.12 2.12" }) }), _jsx("span", { children: t("loadingMore") })] })) : (_jsx(Button, { size: "sm", variant: "ghost", onClick: onLoad, children: loadMore.error ? t("retryMore") : t("loadMore") })), loadMore.error && _jsx("span", { role: "alert", children: loadMore.error })] }) }));
 }

package/dist/table/table-frame.js

@@ -1,10 +1,12 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMendyLocale } from "../locale-context.js";
 import { cn } from "../utils.js";
 import { useFillLayout } from "./use-fill-layout.js";
 /** Shared sizing for the composed view and the table with built-in controls. */
 export function TableFrame({ layout, stretch = false, slot = "table-view", header, footer, children, }) {
+    const { direction, code, configured } = useMendyLocale();
     const fill = layout === "fill";
     const ref = useFillLayout(fill);
-    return (_jsxs("div", { ref: ref, "data-mendy-ui": "", "data-slot": slot, "data-layout": layout, className: cn("mui-184ddc11e5f9", fill ? "mui-222f930b8752 mui-410da8dfa8ac mui-302c0d124a94 mui-074569488cca" : "mui-267171770524"), style: !fill && stretch ? { height: "100%" } : undefined, children: [header && _jsx("div", { className: "mui-27ead27a81df", children: header }), _jsx("div", { className: fill ? "mui-0f2a693e93e2 mui-410da8dfa8ac mui-7bd5bab6d7f4 mui-b5985369ee35" : undefined, style: !fill && stretch ? { height: "100%" } : undefined, children: children }), footer && _jsx("div", { className: "mui-27ead27a81df mui-267171770524", children: footer })] }));
+    return (_jsxs("div", { ref: ref, "data-mendy-ui": "", "data-slot": slot, dir: configured ? direction : undefined, lang: code, "data-layout": layout, className: cn("mui-184ddc11e5f9", fill ? "mui-222f930b8752 mui-410da8dfa8ac mui-302c0d124a94 mui-074569488cca" : "mui-267171770524"), style: !fill && stretch ? { height: "100%" } : undefined, children: [header && _jsx("div", { className: "mui-27ead27a81df", children: header }), _jsx("div", { className: fill ? "mui-0f2a693e93e2 mui-410da8dfa8ac mui-7bd5bab6d7f4 mui-b5985369ee35" : undefined, style: !fill && stretch ? { height: "100%" } : undefined, children: children }), footer && _jsx("div", { className: "mui-27ead27a81df mui-267171770524", children: footer })] }));
 }

package/dist/table/table-layout.d.ts

@@ -3,7 +3,7 @@ import type { Column } from "@tanstack/react-table";
 import type { DataTableFeatures } from "./features.js";
 import type { DataTableInstance } from "./use-data-table.js";
 /** Keep headers, skeletons, and loaded cells on the same column geometry. */
-export declare function tableLayout<T extends object>(table: DataTableInstance<T>, viewportWidth: number | null, rowHeight: number): {
+export declare function tableLayout<T extends object>(table: DataTableInstance<T>, viewportWidth: number | null, rowHeight: number, direction?: "ltr" | "rtl"): {
     columns: Column<{
         cellSelectionFeature: import("@tanstack/react-table").TableFeature;
         columnResizingFeature: import("@tanstack/react-table").TableFeature;

package/dist/table/table-layout.js

@@ -1,6 +1,6 @@
 import { distributeColumnWidths } from "./column-widths.js";
 /** Keep headers, skeletons, and loaded cells on the same column geometry. */
-export function tableLayout(table, viewportWidth, rowHeight) {
+export function tableLayout(table, viewportWidth, rowHeight, direction = "ltr") {
     const columns = [
         ...table.getStartVisibleLeafColumns(),
         ...table.getCenterVisibleLeafColumns(),
@@ -28,12 +28,12 @@ export function tableLayout(table, viewportWidth, rowHeight) {
     const positions = new Map();
     let offset = 0;
     for (const column of table.getStartVisibleLeafColumns()) {
-        positions.set(column.id, { side: "left", offset });
+        positions.set(column.id, { side: direction === "rtl" ? "right" : "left", offset });
         offset += size(column);
     }
     offset = 0;
     for (const column of [...table.getEndVisibleLeafColumns()].reverse()) {
-        positions.set(column.id, { side: "right", offset });
+        positions.set(column.id, { side: direction === "rtl" ? "left" : "right", offset });
         offset += size(column);
     }
     const styles = new Map();
@@ -54,10 +54,10 @@ export function tableLayout(table, viewportWidth, rowHeight) {
                     [pin.side]: pin.offset,
                     zIndex: 2,
                     ...(column.id === table.getStartVisibleLeafColumns().at(-1)?.id
-                        ? { borderRightWidth: 4 }
+                        ? { [direction === "rtl" ? "borderLeftWidth" : "borderRightWidth"]: 4 }
                         : {}),
                     ...(column.id === table.getEndVisibleLeafColumns()[0]?.id
-                        ? { borderLeftWidth: 4 }
+                        ? { [direction === "rtl" ? "borderRightWidth" : "borderLeftWidth"]: 4 }
                         : {}),
                 }
                 : {}),