@zvndev/yable-react 0.1.1 → 0.2.0

package/dist/index.cjs

@@ -69,6 +69,8 @@ function useTable(options) {
     prevOptionsRef.current = options;
     return options;
   }, [options]);
+  const onStateChangeRef = React3.useRef(options.onStateChange);
+  onStateChangeRef.current = options.onStateChange;
   const resolvedState = React3.useMemo(
     () => ({
       ...state,
@@ -78,13 +80,14 @@ function useTable(options) {
   );
   const onStateChange = React3.useCallback(
     (updater) => {
-      if (stableOptions.onStateChange) {
-        stableOptions.onStateChange(updater);
+      const latest = onStateChangeRef.current;
+      if (latest) {
+        latest(updater);
       } else {
         setState((prev) => yableCore.functionalUpdate(updater, prev));
       }
     },
-    [stableOptions.onStateChange]
+    []
   );
   const resolvedOptions = React3.useMemo(
     () => ({
@@ -1720,19 +1723,20 @@ function Spinner() {
 function LoadingOverlay({
   loading,
   loadingComponent,
-  loadingText = "Loading..."
+  loadingText
 }) {
   if (!loading) return null;
+  const resolvedText = loadingText ?? yableCore.getDefaultLocale().loadingText;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       className: "yable-overlay-loading",
       role: "alert",
       "aria-busy": "true",
-      "aria-label": loadingText,
+      "aria-label": resolvedText,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "yable-overlay-loading-content", children: loadingComponent ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(Spinner, {}),
-        loadingText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "yable-overlay-loading-text", children: loadingText })
+        resolvedText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "yable-overlay-loading-text", children: resolvedText })
       ] }) })
     }
   );
@@ -1850,8 +1854,9 @@ function NoRowsOverlay({
   if (emptyComponent) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "yable-overlay-empty", children: emptyComponent });
   }
-  const defaultMessage = isFiltered ? "No results found" : "No data";
-  const defaultDetail = isFiltered ? "Try adjusting your search or filter criteria." : "There are no rows to display.";
+  const locale = yableCore.getDefaultLocale();
+  const defaultMessage = isFiltered ? locale.emptyNoResults : locale.emptyNoData;
+  const defaultDetail = isFiltered ? locale.emptyNoResultsDetail : locale.emptyNoDataDetail;
   const icon = emptyIcon ?? (isFiltered ? /* @__PURE__ */ jsxRuntime.jsx(DefaultFilteredIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(DefaultEmptyIcon, {}));
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "yable-overlay-empty", role: "status", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "yable-overlay-empty-icon-wrapper", children: icon }),
@@ -2840,7 +2845,7 @@ function Table({
   loading,
   loadingComponent,
   loadingText,
-  emptyMessage = "No data",
+  emptyMessage,
   emptyComponent,
   emptyIcon,
   emptyDetail,
@@ -2992,9 +2997,10 @@ function Pagination({
   const to = Math.min((pageIndex + 1) * pageSize, totalRows);
   const canPrev = table.getCanPreviousPage();
   const canNext = table.getCanNextPage();
+  const locale = yableCore.getDefaultLocale();
   return /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "yable-pagination", role: "navigation", "aria-label": "Table pagination", children: [
     showInfo && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "yable-pagination-info", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "yable-pagination-info-text", children: totalRows > 0 ? `${from}\u2013${to} of ${totalRows}` : "No results" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "yable-pagination-info-text", children: totalRows > 0 ? `${from}\u2013${to} ${locale.paginationOf} ${totalRows}` : locale.paginationNoResults }),
       showPageSize && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "yable-pagination-select-wrapper", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "select",
@@ -3007,7 +3013,8 @@ function Pagination({
             "aria-label": "Rows per page",
             children: pageSizes.map((size) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: size, children: [
               size,
-              " rows"
+              " ",
+              locale.paginationRows
             ] }, size))
           }
         ),
@@ -3022,8 +3029,8 @@ function Pagination({
           className: "yable-pagination-btn yable-pagination-btn--nav",
           onClick: () => table.setPageIndex(0),
           disabled: !canPrev,
-          "aria-label": "First page",
-          title: "First page",
+          "aria-label": locale.paginationFirstPage,
+          title: locale.paginationFirstPage,
           children: /* @__PURE__ */ jsxRuntime.jsx(ChevronFirstIcon, {})
         }
       ),
@@ -3034,8 +3041,8 @@ function Pagination({
           className: "yable-pagination-btn yable-pagination-btn--nav",
           onClick: () => table.previousPage(),
           disabled: !canPrev,
-          "aria-label": "Previous page",
-          title: "Previous page",
+          "aria-label": locale.paginationPreviousPage,
+          title: locale.paginationPreviousPage,
           children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeftIcon, {})
         }
       ),
@@ -3059,7 +3066,7 @@ function Pagination({
             className: `yable-pagination-btn yable-pagination-btn--page${page === pageIndex ? " yable-pagination-btn--active" : ""}`,
             "data-active": page === pageIndex ? "true" : void 0,
             onClick: () => table.setPageIndex(page),
-            "aria-label": `Page ${page + 1}`,
+            "aria-label": `${locale.paginationPage} ${page + 1}`,
             "aria-current": page === pageIndex ? "page" : void 0,
             children: page + 1
           },
@@ -3073,8 +3080,8 @@ function Pagination({
           className: "yable-pagination-btn yable-pagination-btn--nav",
           onClick: () => table.nextPage(),
           disabled: !canNext,
-          "aria-label": "Next page",
-          title: "Next page",
+          "aria-label": locale.paginationNextPage,
+          title: locale.paginationNextPage,
           children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, {})
         }
       ),
@@ -3085,8 +3092,8 @@ function Pagination({
           className: "yable-pagination-btn yable-pagination-btn--nav",
           onClick: () => table.setPageIndex(pageCount - 1),
           disabled: !canNext,
-          "aria-label": "Last page",
-          title: "Last page",
+          "aria-label": locale.paginationLastPage,
+          title: locale.paginationLastPage,
           children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLastIcon, {})
         }
       )
@@ -3135,10 +3142,12 @@ function ClearIcon() {
 }
 function GlobalFilter({
   table,
-  placeholder = "Search...",
+  placeholder,
   debounce = 300,
   className
 }) {
+  const locale = yableCore.getDefaultLocale();
+  const resolvedPlaceholder = placeholder ?? locale.searchPlaceholder;
   const [value, setValue] = React3.useState(
     table.getState().globalFilter ?? ""
   );
@@ -3195,8 +3204,8 @@ function GlobalFilter({
         value,
         onChange: handleChange,
         onKeyDown: handleKeyDown,
-        placeholder,
-        "aria-label": "Search table",
+        placeholder: resolvedPlaceholder,
+        "aria-label": locale.searchAriaLabel,
         role: "searchbox"
       }
     ),
@@ -3283,10 +3292,25 @@ function CellSelect({
   const isAlwaysEditable = cell.getIsAlwaysEditable();
   const pending = table.getPendingValue(row.id, column.id);
   const currentValue = pending !== void 0 ? pending : cell.getValue();
+  const commitTimerRef = React3.useRef(null);
+  React3.useEffect(() => {
+    return () => {
+      if (commitTimerRef.current !== null) {
+        clearTimeout(commitTimerRef.current);
+        commitTimerRef.current = null;
+      }
+    };
+  }, []);
   const handleChange = (e) => {
     table.setPendingValue(row.id, column.id, e.target.value);
     if (isEditing && !isAlwaysEditable) {
-      setTimeout(() => table.commitEdit(), 0);
+      if (commitTimerRef.current !== null) {
+        clearTimeout(commitTimerRef.current);
+      }
+      commitTimerRef.current = setTimeout(() => {
+        commitTimerRef.current = null;
+        table.commitEdit();
+      }, 0);
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4839,6 +4863,22 @@ Object.defineProperty(exports, "CommitError", {
   enumerable: true,
   get: function () { return yableCore.CommitError; }
 });
+Object.defineProperty(exports, "FormulaEngine", {
+  enumerable: true,
+  get: function () { return yableCore.FormulaEngine; }
+});
+Object.defineProperty(exports, "FormulaError", {
+  enumerable: true,
+  get: function () { return yableCore.FormulaError; }
+});
+Object.defineProperty(exports, "PivotEngine", {
+  enumerable: true,
+  get: function () { return yableCore.PivotEngine; }
+});
+Object.defineProperty(exports, "UndoStack", {
+  enumerable: true,
+  get: function () { return yableCore.UndoStack; }
+});
 Object.defineProperty(exports, "aggregationFns", {
   enumerable: true,
   get: function () { return yableCore.aggregationFns; }
@@ -4851,6 +4891,10 @@ Object.defineProperty(exports, "createLocale", {
   enumerable: true,
   get: function () { return yableCore.createLocale; }
 });
+Object.defineProperty(exports, "createUndoRedoIntegration", {
+  enumerable: true,
+  get: function () { return yableCore.createUndoRedoIntegration; }
+});
 Object.defineProperty(exports, "en", {
   enumerable: true,
   get: function () { return yableCore.en; }
@@ -4859,14 +4903,30 @@ Object.defineProperty(exports, "filterFns", {
   enumerable: true,
   get: function () { return yableCore.filterFns; }
 });
+Object.defineProperty(exports, "formulaFunctions", {
+  enumerable: true,
+  get: function () { return yableCore.formulaFunctions; }
+});
 Object.defineProperty(exports, "functionalUpdate", {
   enumerable: true,
   get: function () { return yableCore.functionalUpdate; }
 });
+Object.defineProperty(exports, "generatePivotColumnDefs", {
+  enumerable: true,
+  get: function () { return yableCore.generatePivotColumnDefs; }
+});
 Object.defineProperty(exports, "getDefaultLocale", {
   enumerable: true,
   get: function () { return yableCore.getDefaultLocale; }
 });
+Object.defineProperty(exports, "getInitialPivotState", {
+  enumerable: true,
+  get: function () { return yableCore.getInitialPivotState; }
+});
+Object.defineProperty(exports, "getPivotRowModel", {
+  enumerable: true,
+  get: function () { return yableCore.getPivotRowModel; }
+});
 Object.defineProperty(exports, "resetLocale", {
   enumerable: true,
   get: function () { return yableCore.resetLocale; }