@m4l/components 9.50.0 → 9.51.0-beta-m4lcom-764-device-picker.0

package/hooks/useDynamicFilterAndSort/useDynamicFilterAndSort.js

@@ -1,165 +1,165 @@
-import { jsxs as H, jsx as f, Fragment as be } from "@emotion/react/jsx-runtime";
-import { useEnvironment as Te, useModuleDictionary as _e } from "@m4l/core";
-import { useState as g, useRef as F, useCallback as l, useEffect as Ie, useMemo as h, useReducer as Oe } from "react";
-import { DynamicFilter as ke } from "../../components/DynamicFilter/DynamicFilter.js";
-import { DynamicSort as Ee } from "../../components/DynamicSort/DynamicSort.js";
-import { ToggleIconButton as fe } from "../../components/extended/mui/ToggleIconButton/ToggleIconButton.js";
-import { getPropDataTestId as V } from "../../test/getNameDataTestId.js";
-import { COOKIE_APPLIED_FILTERS as $, COOKIE_APPLIED_SORTS as P, M4LDYNAMIC_KEY_FILTER_AND_SORT as z, STACK_NARROW_BREAKPOINT_PX as xe } from "./constants.js";
-import { ICON_PATH_FILTER as $e, ICON_PATH_SORT as Pe, ASSETS as Ke } from "./icons.js";
-import { DynamicFilterAndSortSlots as Y } from "./slots/DynamicFilterAndSortEnum.js";
-import { StackLeftActionsStyled as Le, StackRightActionsStyled as Ne, ActionRefreshStyled as me, SeparatorStyled as Me, StackCustomHeaderStyled as Be } from "./slots/DynamicFilterAndSortSlots.js";
-import { deepEqual as de } from "fast-equals";
-import { getPurgedCookie as ge } from "./helpers.js";
+import { jsxs as $, jsx as f, Fragment as we } from "@emotion/react/jsx-runtime";
+import { useModuleDictionary as De } from "@m4l/core";
+import { useState as g, useRef as F, useCallback as l, useEffect as be, useMemo as h, useReducer as Ie } from "react";
+import { DynamicFilter as Te } from "../../components/DynamicFilter/DynamicFilter.js";
+import { DynamicSort as _e } from "../../components/DynamicSort/DynamicSort.js";
+import { ToggleIconButton as ae } from "../../components/extended/mui/ToggleIconButton/ToggleIconButton.js";
+import { getPropDataTestId as M } from "../../test/getNameDataTestId.js";
+import { COOKIE_APPLIED_FILTERS as E, COOKIE_APPLIED_SORTS as x, M4LDYNAMIC_KEY_FILTER_AND_SORT as B, STACK_NARROW_BREAKPOINT_PX as Oe } from "./constants.js";
+import { ICON_PATH_FILTER as ke, ICON_PATH_SORT as Ee, ICON_PATH_REFRESH as xe } from "./icons.js";
+import { DynamicFilterAndSortSlots as V } from "./slots/DynamicFilterAndSortEnum.js";
+import { StackLeftActionsStyled as Pe, StackRightActionsStyled as Ke, ActionRefreshStyled as ue, SeparatorStyled as Le, StackCustomHeaderStyled as Ne } from "./slots/DynamicFilterAndSortSlots.js";
+import { deepEqual as fe } from "fast-equals";
+import { getPurgedCookie as me } from "./helpers.js";
 import { useWindowToolsMF as He } from "../../components/WindowBase/hooks/useWindowToolsMF/index.js";
-import { DICCTIONARY as Ve } from "../../components/DynamicFilter/dictionary.js";
-import { Divider as ze } from "../../components/extended/mui/Divider/Divider.js";
-const st = (he) => {
+import { DICCTIONARY as $e } from "../../components/DynamicFilter/dictionary.js";
+import { Divider as Me } from "../../components/extended/mui/Divider/Divider.js";
+const nt = (de) => {
   const {
     fields: o,
     sorts: r,
     onChangeFilterSort: S,
     dataTestId: p,
-    withAllField: j,
-    rightActions: q,
-    initialFilterToggleed: Se = !0,
-    initialSortToggleed: pe = !0,
+    withAllField: z,
+    rightActions: Y,
+    initialFilterToggleed: ge = !0,
+    initialSortToggleed: he = !0,
     prefixCookie: c,
     setCookie: v,
-    getCookie: W,
+    getCookie: j,
     filterSortAutomatic: m = !0,
-    visibleRefresh: K = !1,
-    withExternalRefresh: U,
-    sortPopoverOrientation: X = "left"
-  } = he, { host_static_assets: R, environment_assets: A } = Te(), [i, w] = g(() => ({
-    filter: Se,
-    sort: pe
-  })), [D] = g(() => ge(
-    W?.(
-      c ? `${c}_${$}` : $
+    visibleRefresh: P = !1,
+    withExternalRefresh: q,
+    sortPopoverOrientation: W = "left"
+  } = de, [i, R] = g(() => ({
+    filter: ge,
+    sort: he
+  })), [A] = g(() => me(
+    j?.(
+      c ? `${c}_${E}` : E
     )
-  )), [b] = g(() => ge(
-    W?.(
-      c ? `${c}_${P}` : P
+  )), [w] = g(() => me(
+    j?.(
+      c ? `${c}_${x}` : x
     )
-  )), T = F(0), a = F(null), s = F(null), [y, Ce] = g(!1), L = F(null), C = F(null), G = l((e) => {
-    if (L.current?.disconnect(), C.current !== null && (cancelAnimationFrame(C.current), C.current = null), !e || typeof ResizeObserver > "u")
+  )), D = F(0), a = F(null), s = F(null), [y, Se] = g(!1), K = F(null), C = F(null), U = l((e) => {
+    if (K.current?.disconnect(), C.current !== null && (cancelAnimationFrame(C.current), C.current = null), !e || typeof ResizeObserver > "u")
       return;
-    const t = (d) => Ce(d > 0 && d < xe);
+    const t = (d) => Se(d > 0 && d < Oe);
     t(e.getBoundingClientRect().width), C.current = requestAnimationFrame(
       () => t(e.getBoundingClientRect().width)
     );
     const u = new ResizeObserver((d) => {
       t(d[0]?.contentRect.width ?? 0);
     });
-    u.observe(e), L.current = u;
+    u.observe(e), K.current = u;
   }, []);
-  Ie(
+  be(
     () => () => {
-      L.current?.disconnect(), C.current !== null && cancelAnimationFrame(C.current);
+      K.current?.disconnect(), C.current !== null && cancelAnimationFrame(C.current);
     },
     []
   );
-  const [_, N] = g(!1), [I, M] = g(!1), { toast: J } = He(), { getLabel: Q } = _e(), [B, O] = g(() => ({
-    filter: D?.length === 0,
-    sort: b?.length === 0
-  })), Fe = h(
+  const [b, L] = g(!1), [I, N] = g(!1), { toast: X } = He(), { getLabel: G } = De(), [H, T] = g(() => ({
+    filter: A?.length === 0,
+    sort: w?.length === 0
+  })), pe = h(
     () => i.filter || i.sort,
     [i]
-  ), k = `${R}/${A}/${Ke.refresh}`, n = F({
-    eventFilters: { filters: D, rawFilters: [] },
-    eventSorts: { sorts: b, rawSorts: [] }
-  }), Z = (e) => {
-    w((t) => ({ ...t, [e]: !t[e] }));
-  }, E = l(() => {
+  ), _ = xe, n = F({
+    eventFilters: { filters: A, rawFilters: [] },
+    eventSorts: { sorts: w, rawSorts: [] }
+  }), J = (e) => {
+    R((t) => ({ ...t, [e]: !t[e] }));
+  }, O = l(() => {
     if (o.some((e) => e.presence === "fixed")) {
       const e = n.current?.eventFilters?.filters;
       return !(!e || e.length === 0);
     }
     return !0;
-  }, [n, o]), [ee, te] = Oe(
+  }, [n, o]), [Q, Z] = Ie(
     (e, t) => ({ ...e, [t]: !e[t] }),
     { filters: !1, sorts: !1 }
-  ), re = l(() => {
-    N(!0);
-  }, [N]), ne = l(
+  ), ee = l(() => {
+    L(!0);
+  }, [L]), te = l(
     (e, t) => {
-      O((u) => ({ ...u, filter: e.length === 0 })), n.current?.eventFilters?.filters && !de(n.current?.eventFilters?.filters, e) && v?.(
-        c ? `${c}_${$}` : $,
+      T((u) => ({ ...u, filter: e.length === 0 })), n.current?.eventFilters?.filters && !fe(n.current?.eventFilters?.filters, e) && v?.(
+        c ? `${c}_${E}` : E,
         "window",
         e
       ), n.current = {
         ...n.current,
         eventFilters: { filters: e, rawFilters: t }
-      }, (T.current > 0 || T.current === 0 && !r) && S(n.current), T.current++, te("filters"), N(!1);
+      }, (D.current > 0 || D.current === 0 && !r) && S(n.current), D.current++, Z("filters"), L(!1);
     },
-    [S, c, v, O, r]
-  ), ie = l(() => {
-    M(!0);
-  }, [M]), oe = l(
+    [S, c, v, T, r]
+  ), re = l(() => {
+    N(!0);
+  }, [N]), ne = l(
     (e, t) => {
-      O((u) => ({ ...u, sort: e.length === 0 })), n.current?.eventSorts?.sorts && !de(n.current?.eventSorts?.sorts, e) && v?.(
-        c ? `${c}_${P}` : P,
+      T((u) => ({ ...u, sort: e.length === 0 })), n.current?.eventSorts?.sorts && !fe(n.current?.eventSorts?.sorts, e) && v?.(
+        c ? `${c}_${x}` : x,
         "window",
         e
       ), n.current = {
         ...n.current,
         eventSorts: { sorts: e, rawSorts: t }
-      }, E() ? S(n.current) : T.current++, M(!1), te("sorts");
+      }, O() ? S(n.current) : D.current++, N(!1), Z("sorts");
     },
     [
       S,
       c,
       v,
-      O,
-      E
+      T,
+      O
     ]
-  ), x = l(() => {
-    m ? E() ? S(n.current) : J(
-      { title: Q(Ve.error_invalid_filters_before) },
+  ), k = l(() => {
+    m ? O() ? S(n.current) : X(
+      { title: G($e.error_invalid_filters_before) },
       { type: "error" }
     ) : (a.current && a.current.fireOnChangeFilter(), s.current && s.current.fireOnChangeSort());
   }, [
     m,
-    Q,
-    E,
+    G,
+    O,
     S,
-    J
-  ]), ye = h(
-    () => /* @__PURE__ */ H(
-      Le,
+    X
+  ]), Ce = h(
+    () => /* @__PURE__ */ $(
+      Pe,
       {
         direction: "row",
-        ...V(
-          z,
-          Y.stackLeftActions,
+        ...M(
+          B,
+          V.stackLeftActions,
           p
         ),
         children: [
           o && o.length > 0 && /* @__PURE__ */ f(
-            fe,
+            ae,
             {
               badgeProps: {
                 variant: "dot",
-                invisible: B.filter,
+                invisible: H.filter,
                 color: "primary"
               },
-              icon: `${R}/${A}/${$e}`,
+              icon: ke,
               isToggled: i.filter,
-              onToggle: () => Z("filter")
+              onToggle: () => J("filter")
             }
           ),
           r && r.length > 0 && /* @__PURE__ */ f(
-            fe,
+            ae,
             {
               badgeProps: {
                 variant: "dot",
-                invisible: B.sort,
+                invisible: H.sort,
                 color: "primary"
               },
-              icon: `${R}/${A}/${Pe}`,
+              icon: Ee,
               isToggled: i.sort,
-              onToggle: () => Z("sort")
+              onToggle: () => J("sort")
             }
           )
         ]
@@ -167,43 +167,41 @@ const st = (he) => {
     ),
     [
       i,
-      B,
-      R,
-      A,
+      H,
       p,
       o,
       r
     ]
-  ), ve = h(
-    () => /* @__PURE__ */ H(
-      Ne,
+  ), Fe = h(
+    () => /* @__PURE__ */ $(
+      Ke,
       {
         direction: "row",
-        ...V(
-          z,
-          Y.stackRightActions,
+        ...M(
+          B,
+          V.stackRightActions,
           p
         ),
         children: [
           /* @__PURE__ */ f(
-            me,
+            ue,
             {
               ownerState: {
-                isDirty: _ || I,
+                isDirty: b || I,
                 automatic: m
               },
-              icon: k,
+              icon: _,
               "aria-label": "refresh",
-              onClick: x,
+              onClick: k,
               variant: "outline"
             }
           ),
-          q
+          Y
         ]
       }
     ),
-    [p, _, I, m, k, x, q]
-  ), se = l(() => s.current ? s.current.getCurrentSorts() : [], [s]), le = l(
+    [p, b, I, m, _, k, Y]
+  ), ie = l(() => s.current ? s.current.getCurrentSorts() : [], [s]), oe = l(
     (e) => {
       if (s.current) {
         const t = r?.find((d) => d.name === e.columnKey), u = t?.presence === "fixed";
@@ -222,7 +220,7 @@ const st = (he) => {
               fieldType: t?.type || "string",
               operator: e.direction
             };
-            w((De) => ({ ...De, sort: !0 })), s.current.addExternalSort(d);
+            R((Ae) => ({ ...Ae, sort: !0 })), s.current.addExternalSort(d);
             break;
           }
           case "remove":
@@ -234,106 +232,106 @@ const st = (he) => {
       }
     },
     [s, r]
-  ), ce = l(
+  ), se = l(
     (e) => {
       if (a.current)
         switch (e.action) {
           case "add":
-            w((t) => ({ ...t, filter: !0 })), a.current.addExternalFilter(e.columnKey);
+            R((t) => ({ ...t, filter: !0 })), a.current.addExternalFilter(e.columnKey);
             break;
           case "openPopoverMenuFields":
-            w((t) => ({ ...t, filter: !0 })), a.current.openPopoverMenuFields();
+            R((t) => ({ ...t, filter: !0 })), a.current.openPopoverMenuFields();
             break;
           default:
             return;
         }
     },
     [a]
-  ), ae = l(() => a.current ? a.current.getCurrentFilters() : [], [a]), ue = h(
-    () => /* @__PURE__ */ H(be, { children: [
+  ), le = l(() => a.current ? a.current.getCurrentFilters() : [], [a]), ce = h(
+    () => /* @__PURE__ */ $(we, { children: [
       /* @__PURE__ */ f(
-        ke,
+        Te,
         {
           ref: a,
-          visibleRefresh: K,
+          visibleRefresh: P,
           automatic: m,
           fields: o,
-          initialAppliedFilters: D,
-          onChangeFilters: ne,
-          withAllField: j,
-          onDirty: re
+          initialAppliedFilters: A,
+          onChangeFilters: te,
+          withAllField: z,
+          onDirty: ee
         }
       ),
       r ? /* @__PURE__ */ f(
-        Ee,
+        _e,
         {
           ref: s,
-          visibleRefresh: K,
+          visibleRefresh: P,
           automatic: m,
           fields: r,
-          initialAppliedSorts: b,
-          onChangeSorts: oe,
-          onDirty: ie,
+          initialAppliedSorts: w,
+          onChangeSorts: ne,
+          onDirty: re,
           leadingSeparator: /* @__PURE__ */ f(
-            Me,
+            Le,
             {
               ownerState: {
                 showDynamicFilter: i.filter,
                 showDynamicSort: i.sort,
                 isNarrow: y
               },
-              children: /* @__PURE__ */ f(ze, { orientation: "vertical", customVariant: "solid" })
+              children: /* @__PURE__ */ f(Me, { orientation: "vertical", customVariant: "solid" })
             }
           ),
-          popoverOrientation: y ? "right" : X
+          popoverOrientation: y ? "right" : W
         }
       ) : null,
-      U && /* @__PURE__ */ f(
-        me,
+      q && /* @__PURE__ */ f(
+        ue,
         {
           ownerState: {
             automatic: m,
-            isDirty: _ || I
+            isDirty: b || I
           },
-          icon: k,
+          icon: _,
           "aria-label": "refresh",
-          onClick: x
+          onClick: k
         }
       )
     ] }),
-    [K, m, o, D, ne, j, re, r, b, oe, ie, X, U, _, I, k, x, i, y]
-  ), Re = h(
+    [P, m, o, A, te, z, ee, r, w, ne, re, W, q, b, I, _, k, i, y]
+  ), ye = h(
     () => /* @__PURE__ */ f(
-      Be,
+      Ne,
       {
-        ref: G,
+        ref: U,
         direction: "row",
         ownerState: {
           showDynamicFilter: i.filter,
           showDynamicSort: i.sort,
           isNarrow: y
         },
-        ...V(
-          z,
-          Y.stackCustomHeader,
+        ...M(
+          B,
+          V.stackCustomHeader,
           p
         ),
-        children: ue
+        children: ce
       }
     ),
-    [i, p, ue, y, G]
-  ), Ae = h(() => {
+    [i, p, ce, y, U]
+  ), ve = h(() => {
     if (!(!r || r.length === 0))
       return {
         sortsColumns: r.map((e) => e.name),
-        sortsApplied: se().map((e) => ({
+        sortsApplied: ie().map((e) => ({
           columnKey: e.field.name,
           removable: !e.fixed,
           direction: e.operator
         })),
-        onChange: le
+        onChange: oe
       };
-  }, [r, ee.sorts, se, le]), we = h(() => {
+  }, [r, Q.sorts, ie, oe]), Re = h(() => {
     if (!(!o || o.length === 0))
       return {
         filterColumns: o.map((e) => ({
@@ -341,22 +339,22 @@ const st = (he) => {
           multiple: e.multiple || !1,
           skipColumnValidation: e.skipColumnValidation || !1
         })),
-        filtersApplied: ae().map((e) => ({
+        filtersApplied: le().map((e) => ({
           columnKey: e.field.name,
           isValid: e.isSet
         })),
-        onChange: ce
+        onChange: se
       };
-  }, [o, ee.filters, ae, ce]);
+  }, [o, Q.filters, le, se]);
   return {
-    leftActions: ye,
-    rightActions: ve,
-    visibleCustomHeader: Fe,
-    customHeaderComponent: Re,
-    externalSortSettings: Ae,
-    externalFilterSettings: we
+    leftActions: Ce,
+    rightActions: Fe,
+    visibleCustomHeader: pe,
+    customHeaderComponent: ye,
+    externalSortSettings: ve,
+    externalFilterSettings: Re
   };
 };
 export {
-  st as useDynamicFilterAndSort
+  nt as useDynamicFilterAndSort
 };