@arcblock/ux 3.0.10 → 3.0.12

package/lib/Datatable/CustomToolbar.js

@@ -1,86 +1,86 @@
 import { jsx as t, jsxs as r, Fragment as S } from "react/jsx-runtime";
 import { useState as T, useRef as V, isValidElement as v } from "react";
 import i from "prop-types";
-import { TableFilter as ue, TableViewCol as pe } from "mui-datatables";
-import he, { PrintContextConsumer as me } from "react-to-print";
-import { MoreVert as fe, CloudDownload as be, ViewColumn as Ce, FilterList as ge, Print as $ } from "@mui/icons-material";
-import { Popover as xe, Tooltip as D, IconButton as R, ListItemIcon as L, ListItemText as j, MenuItem as U, Menu as we, LinearProgress as ye, useTheme as Te, useMediaQuery as ve } from "@mui/material";
-import { useDeepCompareEffect as Re } from "ahooks";
-import { handleCSVDownload as ke } from "./utils.js";
-import Fe from "./TableSearch.js";
-import { useDatatableContext as Pe } from "./DatatableContext.js";
-import { styled as z } from "../Theme/index.js";
-function Ie() {
-  const s = Te();
-  return ve(s.breakpoints.down("sm"));
+import { TableFilter as pe, TableViewCol as he } from "mui-datatables";
+import me, { PrintContextConsumer as fe } from "react-to-print";
+import { MoreVert as be, CloudDownload as Ce, ViewColumn as xe, FilterList as ge, Print as $ } from "@mui/icons-material";
+import { Box as z, Popover as we, Tooltip as D, IconButton as R, ListItemIcon as L, ListItemText as j, MenuItem as U, Menu as ye, LinearProgress as Te, useTheme as ve, useMediaQuery as Re } from "@mui/material";
+import { useDeepCompareEffect as ke } from "ahooks";
+import { handleCSVDownload as Fe } from "./utils.js";
+import Pe from "./TableSearch.js";
+import { useDatatableContext as Ie } from "./DatatableContext.js";
+import { styled as N } from "../Theme/index.js";
+function Be() {
+  const s = ve();
+  return Re(s.breakpoints.down("sm"));
 }
-function Be({ ...s }) {
-  const [f, d] = T(null), k = V(null), F = Ie(), N = V(Math.random().toString(32).slice(2)), [O, A] = T(!1), { customPreButtons: b, customButtons: C, loading: u, disabled: g } = Pe(), {
-    data: Q = [],
+function qe({ ...s }) {
+  const [f, d] = T(null), k = V(null), F = Be(), O = V(Math.random().toString(32).slice(2)), [A, Q] = T(!1), { customPreButtons: b, customButtons: C, loading: u, disabled: x } = Ie(), {
+    data: G = [],
     options: o,
     components: p = {},
     columns: P,
-    filterList: G = [],
-    filterData: H = [],
-    filterUpdate: J,
-    resetFilters: K,
-    updateFilterByType: W,
-    toggleViewColumn: X,
-    updateColumns: Y,
+    filterList: H = [],
+    filterData: J = [],
+    filterUpdate: K,
+    resetFilters: W,
+    updateFilterByType: X,
+    toggleViewColumn: Y,
+    updateColumns: Z,
     title: I = "",
-    searchText: Z = null,
-    searchTextUpdate: _,
-    searchClose: ee
-  } = s, [B, h] = T({}), te = o.customToolbar ? o.customToolbar(s) : "", { search: oe, downloadCsv: ie, print: m, viewColumns: ne, filterTable: le } = o.textLabels.toolbar, re = o.search === !1 || o.search === "false", x = o.print === !1 || o.print === "false", se = p.TableFilter || ue, ae = p.TableViewCol || pe;
-  Re(() => {
-    (u || g) && h({});
-  }, [u, g]);
-  const q = (e) => /* @__PURE__ */ t(he, { content: () => s.tableRef(), children: /* @__PURE__ */ t(me, { children: e }) }), w = (e) => `toolbar-pop-${N.current}-${e}`, a = [];
+    searchText: _ = null,
+    searchTextUpdate: ee,
+    searchClose: te
+  } = s, [B, h] = T({}), oe = o.customToolbar ? o.customToolbar(s) : "", { search: ie, downloadCsv: ne, print: m, viewColumns: le, filterTable: re } = o.textLabels.toolbar, se = o.search === !1 || o.search === "false", g = o.print === !1 || o.print === "false", ae = p.TableFilter || pe, ce = p.TableViewCol || he;
+  ke(() => {
+    (u || x) && h({});
+  }, [u, x]);
+  const q = (e) => /* @__PURE__ */ t(me, { content: () => s.tableRef(), children: /* @__PURE__ */ t(fe, { children: e }) }), w = (e) => `toolbar-pop-${O.current}-${e}`, a = [];
   o.download === !1 || o.download === "false" || a.push({
-    icon: /* @__PURE__ */ t(be, {}),
-    title: ie,
+    icon: /* @__PURE__ */ t(Ce, {}),
+    title: ne,
     onClick: () => {
-      ke(s);
+      Fe(s);
     }
   }), o.viewColumns === !1 || o.viewColumns === "false" || a.push({
-    icon: /* @__PURE__ */ t(Ce, {}),
-    title: ne,
+    icon: /* @__PURE__ */ t(xe, {}),
+    title: le,
     // eslint-disable-next-line react/no-unstable-nested-components
     popRender() {
       return /* @__PURE__ */ t(
-        ae,
+        ce,
         {
-          data: Q,
+          data: G,
           columns: P,
           options: o,
-          onColumnUpdate: X,
-          updateColumns: Y,
+          onColumnUpdate: Y,
+          updateColumns: Z,
           components: p
         }
       );
     }
   }), o.filter === !1 || o.filter === "false" || a.push({
     icon: /* @__PURE__ */ t(ge, {}),
-    title: le,
+    title: re,
     // eslint-disable-next-line react/no-unstable-nested-components
     popRender() {
       return /* @__PURE__ */ t(
-        se,
+        ae,
         {
           customFooter: o.customFilterDialogFooter,
           columns: P,
           options: o,
-          filterList: G,
-          filterData: H,
-          onFilterUpdate: J,
-          onFilterReset: K,
-          updateFilterByType: W,
+          filterList: H,
+          filterData: J,
+          onFilterUpdate: K,
+          onFilterReset: W,
+          updateFilterByType: X,
           components: p
         }
       );
     }
   });
-  const E = [...b, !x, ...a, ...C].filter((e) => !!e).length > 1 && F, M = [], ce = [...b, ...a, ...C].map((e, c) => {
+  const E = [...b, !g, ...a, ...C].filter((e) => !!e).length > 1 && F, M = [], de = [...b, ...a, ...C].map((e, c) => {
     if (v(e))
       return e;
     const n = w(c);
@@ -88,7 +88,7 @@ function Be({ ...s }) {
       const { popRender: l, icon: y } = e;
       return l && M.push(
         /* @__PURE__ */ t(
-          xe,
+          we,
           {
             open: !!B[n],
             anchorEl: () => B[n],
@@ -119,7 +119,7 @@ function Be({ ...s }) {
       ) }, n);
     }
     return e;
-  }), de = [...b, ...a, ...C].map((e, c) => {
+  }), ue = [...b, ...a, ...C].map((e, c) => {
     const n = w(c);
     let l;
     if (v(e))
@@ -145,28 +145,28 @@ function Be({ ...s }) {
     );
   });
   return /* @__PURE__ */ r("div", { children: [
-    /* @__PURE__ */ r(qe, { children: [
+    /* @__PURE__ */ r(Ee, { children: [
       /* @__PURE__ */ t(
         "div",
         {
-          className: `custom-toobar-title ${F && O && v(I) ? "toobar-title-hidden" : ""}`,
+          className: `custom-toobar-title ${F && A && v(I) ? "toobar-title-hidden" : ""}`,
           children: /* @__PURE__ */ t("div", { className: "custom-toobar-title-inner", children: /* @__PURE__ */ t("span", { children: I }) })
         }
       ),
-      /* @__PURE__ */ r("div", { className: `custom-toobar-btns ${u || g ? "toobar-btns-disabled" : ""}`, children: [
-        !re && /* @__PURE__ */ t(
-          Fe,
+      /* @__PURE__ */ r("div", { className: `custom-toobar-btns ${u || x ? "toobar-btns-disabled" : ""}`, children: [
+        !se && /* @__PURE__ */ t(
+          Pe,
           {
-            search: oe,
+            search: ie,
             options: o,
-            searchText: Z,
-            searchTextUpdate: _,
-            searchClose: ee,
-            onSearchOpen: A
+            searchText: _,
+            searchTextUpdate: ee,
+            searchClose: te,
+            onSearchOpen: Q
           }
         ),
         !E && /* @__PURE__ */ r(S, { children: [
-          !x && q(({ handlePrint: e }) => /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(D, { title: m, children: /* @__PURE__ */ t(
+          !g && q(({ handlePrint: e }) => /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(D, { title: m, children: /* @__PURE__ */ t(
             R,
             {
               "data-testid": `${m}-iconButton`,
@@ -176,7 +176,7 @@ function Be({ ...s }) {
               children: /* @__PURE__ */ t($, {})
             }
           ) }) })),
-          ce
+          de
         ] }),
         E && /* @__PURE__ */ t(
           R,
@@ -186,14 +186,14 @@ function Be({ ...s }) {
             "aria-expanded": f ? "true" : void 0,
             onClick: (e) => d(e.currentTarget),
             style: { flexShrink: 0 },
-            children: /* @__PURE__ */ t(fe, {})
+            children: /* @__PURE__ */ t(be, {})
           }
         )
       ] }),
-      te
+      oe
     ] }),
     /* @__PURE__ */ r(
-      we,
+      ye,
       {
         anchorEl: f,
         open: !!f,
@@ -204,7 +204,7 @@ function Be({ ...s }) {
           }
         },
         children: [
-          !x && q(({ handlePrint: e }) => /* @__PURE__ */ r(
+          !g && q(({ handlePrint: e }) => /* @__PURE__ */ r(
             U,
             {
               onClick: () => {
@@ -216,15 +216,15 @@ function Be({ ...s }) {
               ]
             }
           )),
-          de
+          ue
         ]
       }
     ),
     M.map((e, c) => /* @__PURE__ */ t("div", { children: e }, w(c))),
-    /* @__PURE__ */ t(Ee, { children: u && /* @__PURE__ */ t(ye, { className: "toolbar-progress" }) })
+    /* @__PURE__ */ t(Me, { children: u && /* @__PURE__ */ t(Te, { className: "toolbar-progress" }) })
   ] });
 }
-Be.propTypes = {
+qe.propTypes = {
   data: i.array,
   options: i.object.isRequired,
   components: i.object,
@@ -242,7 +242,7 @@ Be.propTypes = {
   searchClose: i.func.isRequired,
   tableRef: i.func.isRequired
 };
-const qe = z("div")`
+const Ee = N(z)`
   display: flex;
   align-items: center;
   height: 56px;
@@ -302,7 +302,7 @@ const qe = z("div")`
     opacity: 0;
     cursor: none;
   }
-`, Ee = z("div")`
+`, Me = N(z)`
   width: 100%;
   height: 2px;
   .toolbar-progress {
@@ -310,5 +310,5 @@ const qe = z("div")`
   }
 `;
 export {
-  Be as default
+  qe as default
 };

package/lib/Datatable/TableSearch.js

@@ -1,21 +1,21 @@
 import { jsxs as f, jsx as e } from "react/jsx-runtime";
 import { useState as x, useRef as I } from "react";
 import o from "prop-types";
-import { Tooltip as N, IconButton as w, TextField as g } from "@mui/material";
-import { Search as v, Clear as R } from "@mui/icons-material";
-import q from "clsx";
+import { Box as N, Tooltip as R, IconButton as w, TextField as g } from "@mui/material";
+import { Search as v, Clear as q } from "@mui/icons-material";
+import B from "clsx";
 import E from "lodash/noop";
-import { useDatatableContext as B } from "./DatatableContext.js";
-import { styled as D } from "../Theme/index.js";
-function M({
+import { useDatatableContext as D } from "./DatatableContext.js";
+import { styled as M } from "../Theme/index.js";
+function O({
   search: t = "",
-  options: s,
+  options: i,
   searchText: a = "",
   searchTextUpdate: c,
   searchClose: C,
   onSearchOpen: d = E
 }) {
-  const { searchOpen: T, searchPlaceholder: y, searchAlwaysOpen: r } = s, [k, h] = x(!!a || T || !1), [p, m] = x(a), u = I(null), { loading: b } = B(), { searchDebounceTime: n } = s, i = r || k, S = () => {
+  const { searchOpen: T, searchPlaceholder: y, searchAlwaysOpen: r } = i, [k, h] = x(!!a || T || !1), [p, m] = x(a), u = I(null), { loading: b } = D(), { searchDebounceTime: n } = i, s = r || k, S = () => {
     h(!0), d(!0);
   }, F = (j) => {
     const { value: l } = j.currentTarget;
@@ -26,24 +26,24 @@ function M({
     h(!1), C(), m(""), d(!1);
   };
   return /* @__PURE__ */ f(
-    O,
+    P,
     {
-      className: q({
+      className: B({
         "search-always-open": r
       }),
       children: [
-        i ? /* @__PURE__ */ e("div", { className: "toolbar-search-icon-placeholder", children: /* @__PURE__ */ e(v, {}) }) : /* @__PURE__ */ e(N, { title: t, disableFocusListener: !0, children: /* @__PURE__ */ e(
+        s ? /* @__PURE__ */ e("div", { className: "toolbar-search-icon-placeholder", children: /* @__PURE__ */ e(v, {}) }) : /* @__PURE__ */ e(R, { title: t, disableFocusListener: !0, children: /* @__PURE__ */ e(
           w,
           {
             "aria-label": t,
             "data-testid": `${t}-iconButton`,
-            disabled: s.search === "disabled",
+            disabled: i.search === "disabled",
             onClick: S,
             children: /* @__PURE__ */ e(v, {})
           }
         ) }),
-        /* @__PURE__ */ f("div", { className: `toolbar-search-area ${i ? "toolbar-btn-show" : ""}`, children: [
-          i && !b && /* @__PURE__ */ e(
+        /* @__PURE__ */ f("div", { className: `toolbar-search-area ${s ? "toolbar-btn-show" : ""}`, children: [
+          s && !b && /* @__PURE__ */ e(
             g,
             {
               variant: "standard",
@@ -64,12 +64,12 @@ function M({
             }
           )
         ] }),
-        !r && /* @__PURE__ */ e("div", { className: `toolbar-search-close ${i ? "toolbar-btn-show" : ""}`, children: /* @__PURE__ */ e(w, { onClick: $, "aria-label": "click to close the search box", children: /* @__PURE__ */ e(R, {}) }) })
+        !r && /* @__PURE__ */ e("div", { className: `toolbar-search-close ${s ? "toolbar-btn-show" : ""}`, children: /* @__PURE__ */ e(w, { onClick: $, "aria-label": "click to close the search box", children: /* @__PURE__ */ e(q, {}) }) })
       ]
     }
   );
 }
-M.propTypes = {
+O.propTypes = {
   search: o.string,
   searchText: o.string,
   onSearchOpen: o.func,
@@ -77,7 +77,7 @@ M.propTypes = {
   searchTextUpdate: o.func.isRequired,
   searchClose: o.func.isRequired
 };
-const O = D("div")`
+const P = M(N)`
   display: flex;
   align-items: center;
   .toolbar-search-area {
@@ -129,5 +129,5 @@ const O = D("div")`
   }
 `;
 export {
-  M as default
+  O as default
 };

package/lib/Datatable/index.js

@@ -1,20 +1,20 @@
-import { jsx as i, jsxs as te } from "react/jsx-runtime";
-import { useRef as oe, isValidElement as re } from "react";
+import { jsx as i, jsxs as oe } from "react/jsx-runtime";
+import { useRef as re, isValidElement as ae } from "react";
 import o from "prop-types";
-import ae, { TableFilterList as le, TableFooter as ie } from "mui-datatables";
-import { TableFilterList as Ie, TableFooter as Ue } from "mui-datatables";
-import { css as H } from "@emotion/react";
-import F from "lodash/isObject";
-import se from "lodash/cloneDeep";
-import ne from "lodash/get";
+import le, { TableFilterList as ie, TableFooter as se } from "mui-datatables";
+import { TableFilterList as Ue, TableFooter as Ee } from "mui-datatables";
+import { css as N } from "@emotion/react";
+import R from "lodash/isObject";
+import ne from "lodash/cloneDeep";
+import de from "lodash/get";
 import P from "clsx";
-import { useCreation as de, useDeepCompareEffect as h } from "ahooks";
-import { CircularProgress as ce } from "@mui/material";
-import R from "../Empty/index.js";
-import pe from "./CustomToolbar.js";
-import { DatatableProvider as ue, useDatatableContext as M } from "./DatatableContext.js";
-import { styled as $ } from "../Theme/index.js";
-const fe = $("div")`
+import { useCreation as ce, useDeepCompareEffect as h } from "ahooks";
+import { Box as M, CircularProgress as pe } from "@mui/material";
+import k from "../Empty/index.js";
+import ue from "./CustomToolbar.js";
+import { DatatableProvider as fe, useDatatableContext as $ } from "./DatatableContext.js";
+import { styled as D } from "../Theme/index.js";
+const be = D(M)`
   display: flex;
   align-items: center;
   .toolbar-filter-content {
@@ -25,21 +25,21 @@ const fe = $("div")`
     font-size: 14px;
   }
 `;
-function N({ ...e }) {
-  const { filterLabel: a } = M(), r = !!(e.filterList ?? []).filter((n) => n.length).length;
-  return r ? /* @__PURE__ */ te(fe, { children: [
+function A({ ...e }) {
+  const { filterLabel: a } = $(), r = !!(e.filterList ?? []).filter((n) => n.length).length;
+  return r ? /* @__PURE__ */ oe(be, { children: [
     r && /* @__PURE__ */ i("div", { className: "toolbar-filter-title", children: a }),
-    /* @__PURE__ */ i("div", { className: "toolbar-filter-content", children: /* @__PURE__ */ i(le, { ...e }) })
+    /* @__PURE__ */ i("div", { className: "toolbar-filter-content", children: /* @__PURE__ */ i(ie, { ...e }) })
   ] }) : "";
 }
-N.propTypes = {
+A.propTypes = {
   filterList: o.array
 };
-function be(e) {
-  const { loading: a, disabled: r } = M();
-  return /* @__PURE__ */ i(he, { children: /* @__PURE__ */ i("div", { className: `datatable-footer ${a || r ? "datatable-footer-disabled" : ""}`, children: /* @__PURE__ */ i(ie, { ...e }) }) });
+function ge(e) {
+  const { loading: a, disabled: r } = $();
+  return /* @__PURE__ */ i(Te, { children: /* @__PURE__ */ i("div", { className: `datatable-footer ${a || r ? "datatable-footer-disabled" : ""}`, children: /* @__PURE__ */ i(se, { ...e }) }) });
 }
-const ge = (e) => {
+const me = (e) => {
   const a = `datatable-durable-${e}`;
   let r = localStorage[a];
   if (r)
@@ -50,14 +50,14 @@ const ge = (e) => {
     }
   return r || {};
 };
-function He(e) {
-  return /* @__PURE__ */ i(ue, { children: /* @__PURE__ */ i(A, { ...e }) });
+function Ne(e) {
+  return /* @__PURE__ */ i(fe, { children: /* @__PURE__ */ i(I, { ...e }) });
 }
-const k = (e, a) => {
+const L = (e, a) => {
   const r = {};
   e.align && (a.className = P(a.className, `pc-align-${e.align}`)), e.verticalKeyAlign && (a.className = P(a.className, `vertical-align-${e.verticalKeyAlign}`)), e.minWidth && (r.minWidth = e.minWidth), a.style = Object.assign({}, a.style, r);
 };
-function A({
+function I({
   data: e,
   columns: a,
   locale: r = "en",
@@ -69,27 +69,27 @@ function A({
   onChange: m = "",
   loading: c = !1,
   disabled: C = !1,
-  stripped: I = !1,
-  verticalKeyWidth: U = "",
-  hideTableHeader: E = !1,
+  stripped: U = !1,
+  verticalKeyWidth: E = "",
+  hideTableHeader: B = !1,
   components: _ = {},
   emptyNode: T = "",
-  durable: v = "",
+  durable: x = "",
   durableKeys: j = ["page", "rowsPerPage", "searchText", "sortOrder"],
-  bgColor: B = "transparent",
-  hoverColor: O = "",
-  stripColor: W = "",
-  ...z
+  bgColor: O = "transparent",
+  hoverColor: W = "",
+  stripColor: z = "",
+  ...K
 }) {
-  const D = oe(null), { setCustomPreButtons: K, setCustomButtons: J, setFilterLabel: V, setLoading: q, setDisabled: G } = M(), Q = {
+  const S = re(null), { setCustomPreButtons: J, setCustomButtons: V, setFilterLabel: q, setLoading: G, setDisabled: Q } = $(), X = {
     cursor: "not-allowed",
     pointerEvents: "none"
-  }, x = [], X = a.map((s) => {
+  }, v = [], Y = a.map((s) => {
     let t;
-    F(s) ? t = se(s) : t = {
+    R(s) ? t = ne(s) : t = {
       label: s,
       name: s
-    }, x.push(t.name), t.align || (t.align = "left"), t.options || (t.options = {});
+    }, v.push(t.name), t.align || (t.align = "left"), t.options || (t.options = {});
     const { setCellHeaderProps: d, setCellProps: u } = t.options;
     return t.options.setCellHeaderProps = (...f) => {
       let l = {
@@ -98,7 +98,7 @@ function A({
       return d && !d.__innerFunc && (l = {
         ...l,
         ...d(...f) || {}
-      }), (c || C) && (l = { ...l, style: Q }), t.width && (l.width = t.width), k(t, l), l;
+      }), (c || C) && (l = { ...l, style: X }), t.width && (l.width = t.width), L(t, l), l;
     }, t.options.setCellHeaderProps.__innerFunc = 1, (t.align || t.style) && (t.options.setCellProps = (...f) => {
       let l = {
         className: ""
@@ -106,12 +106,12 @@ function A({
       return u && !u.__innerFunc && (l = {
         ...l,
         ...u(...f) || {}
-      }), k(t, l), l;
+      }), L(t, l), l;
     }, t.options.setCellProps.__innerFunc = 1), t;
-  }), Y = de(() => e.map((s) => !Array.isArray(s) && F(s) ? x.map((t) => ne(s, t)) : s), [e, x]);
-  h(() => J(g || []), [g]), h(() => K(b || []), [b]), h(() => q(c), [c]), h(() => G(C), [C]);
+  }), Z = ce(() => e.map((s) => !Array.isArray(s) && R(s) ? v.map((t) => de(s, t)) : s), [e, v]);
+  h(() => V(g || []), [g]), h(() => J(b || []), [b]), h(() => G(c), [c]), h(() => Q(C), [C]);
   let p;
-  c ? p = /* @__PURE__ */ i(ce, { color: "primary" }) : re(T) ? p = T : r === "zh" ? p = /* @__PURE__ */ i(R, { children: T || "没有找到匹配的记录" }) : p = /* @__PURE__ */ i(R, { children: T || "No matching records found" });
+  c ? p = /* @__PURE__ */ i(pe, { color: "primary" }) : ae(T) ? p = T : r === "zh" ? p = /* @__PURE__ */ i(k, { children: T || "没有找到匹配的记录" }) : p = /* @__PURE__ */ i(k, { children: T || "No matching records found" });
   let y = {
     body: {
       noMatch: p,
@@ -154,13 +154,13 @@ function A({
     filter: { all: "全部", title: "筛选器", reset: "重置" },
     viewColumns: { title: "显示的列", titleAria: "显示/隐藏 表格的列" },
     selectedRows: { text: "个已选项目", delete: "删除", deleteAria: "删除所选项目" }
-  }), h(() => V(y.filter.title), [y.filter.title]);
-  const Z = ge(v), S = {
+  }), h(() => q(y.filter.title), [y.filter.title]);
+  const ee = me(x), F = {
     selectableRows: "none",
     textLabels: y,
     rowsPerPage: 10,
     rowsPerPageOptions: [10, 20, 50],
-    ...Z,
+    ...ee,
     ...n,
     // Wrap the more friendly onChange callback by listening to onTableChange,
     // which will only be triggered when the table key state changes
@@ -176,44 +176,44 @@ function A({
         //
         filterList: t.filterList
       };
-      if (v) {
+      if (x) {
         const f = {};
         j.forEach((l) => {
           f[l] = d[l];
-        }), localStorage.setItem(`datatable-durable-${v}`, JSON.stringify(f));
+        }), localStorage.setItem(`datatable-durable-${x}`, JSON.stringify(f));
       }
       const u = JSON.stringify(d);
-      u !== D.current && (D.current = u, m && m(d, s));
+      u !== S.current && (S.current = u, m && m(d, s));
     }
   };
-  m && (S.serverSide = !0);
-  const ee = {
-    options: S,
-    ...z,
+  m && (F.serverSide = !0);
+  const te = {
+    options: F,
+    ...K,
     components: {
-      TableToolbar: pe,
-      TableFooter: be,
-      TableFilterList: N,
+      TableToolbar: ue,
+      TableFooter: ge,
+      TableFilterList: A,
       ..._
     }
   };
   return /* @__PURE__ */ i(
-    me,
+    he,
     {
-      verticalKeyWidth: U,
-      bgColor: B,
-      hoverColor: O,
-      stripColor: W,
+      verticalKeyWidth: E,
+      bgColor: O,
+      hoverColor: W,
+      stripColor: z,
       className: P({
-        "datatable-stripped": I,
-        "datatable-hide-header": E
+        "datatable-stripped": U,
+        "datatable-hide-header": B
       }),
       style: w,
-      children: /* @__PURE__ */ i(ae, { data: Y, columns: X, ...ee })
+      children: /* @__PURE__ */ i(le, { data: Z, columns: Y, ...te })
     }
   );
 }
-A.propTypes = {
+I.propTypes = {
   data: o.array.isRequired,
   columns: o.array.isRequired,
   options: o.object,
@@ -235,7 +235,7 @@ A.propTypes = {
   hoverColor: o.string,
   stripColor: o.string
 };
-const L = H`
+const H = N`
   .MuiTableCell-head {
     [class*='MUIDataTableHeadCell-toolButton'] {
       width: 100%;
@@ -268,7 +268,7 @@ const L = H`
       text-align: right;
     }
   }
-`, me = $("div", {
+`, he = D(M, {
   shouldForwardProp: (e) => !["verticalKeyWidth", "bgColor", "hoverColor", "stripColor"].includes(e)
 })(({ theme: e, verticalKeyWidth: a, bgColor: r, hoverColor: n, stripColor: w }) => {
   const b = e.palette.text.primary, g = e.palette.action.hover, m = e.palette.grey[50], c = a ? `
@@ -286,7 +286,7 @@ const L = H`
         }
       }
     ` : "";
-  return H`
+  return N`
     &.datatable-hide-header {
       thead.MuiTableHead-root {
         display: none;
@@ -341,11 +341,11 @@ const L = H`
       }
     }
     ${e.breakpoints.up("md")} {
-      ${L}
+      ${H}
     }
     ${e.breakpoints.up("sm")} {
       [class*='responsiveSimple'] {
-        ${L}
+        ${H}
       }
     }
 
@@ -385,7 +385,7 @@ const L = H`
       }
     }
   `;
-}), he = $("div")`
+}), Te = D(M)`
   display: flex;
   align-items: center;
   .datatable-footer {
@@ -427,8 +427,8 @@ const L = H`
   }
 `;
 export {
-  Ie as TableFilterList,
-  Ue as TableFooter,
-  He as default,
-  ge as getDurableData
+  Ue as TableFilterList,
+  Ee as TableFooter,
+  Ne as default,
+  me as getDurableData
 };