@bikdotai/bik-component-library 0.0.868-beta.1 → 0.0.868-beta.11

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js

@@ -1,143 +1,184 @@
-import { jsx as d, Fragment as V, jsxs as D } from "react/jsx-runtime";
-import { forwardRef as W, useRef as A, useState as B, useCallback as o, useEffect as X } from "react";
-import { MenuItem as H } from "./MenuItem.js";
-import { StyledGroupedLabel as Y, Divider as Z } from "./MenuList.styled.js";
-const ne = W(
+import { jsx as a, Fragment as ne, jsxs as M } from "react/jsx-runtime";
+import { forwardRef as se, useRef as V, useState as N, useCallback as h, useEffect as re } from "react";
+import { MenuItem as q } from "./MenuItem.js";
+import { StyledGroupedLabel as le, Divider as ae } from "./MenuList.styled.js";
+const ie = se(
   ({
-    options: l,
+    options: c,
     isMultiSelect: O,
     showDescription: b,
-    onSelect: y,
-    version: i,
-    onInfiniteScroll: E,
+    onSelect: x,
+    version: o,
+    onInfiniteScroll: z,
     onDropdownItemClick: F,
-    useDefaultCursor: j,
-    focusedIndex: T = -1,
-    isDraggable: s = !1,
-    onOptionsReorder: L,
-    showCheckboxForCustomElement: M = !1,
-    checkboxActiveColor: R,
-    brandSelectedRow: $
-  }, t) => {
-    const u = A(null), g = A(null), [p, m] = B(null), [J, I] = B(
+    useDefaultCursor: D,
+    focusedIndex: E = -1,
+    isDraggable: d = !1,
+    onOptionsReorder: B,
+    showCheckboxForCustomElement: j = !1,
+    checkboxActiveColor: P,
+    brandSelectedRow: T,
+    childrenLayout: R = "flyout",
+    collapsibleChildren: H = !1
+  }, l) => {
+    const f = V(null), I = V(null), [m, $] = N(null), [W, C] = N(
       null
-    ), w = o(() => {
-      u.current && u.current.disconnect(), u.current = new IntersectionObserver((n) => {
-        n[0].isIntersecting && E?.();
-      }), g.current && u.current.observe(g.current);
-    }, [E]);
-    X(() => (w(), () => {
-      u.current && u.current.disconnect();
-    }), [w, l]);
-    const K = o(
-      (n) => (e) => {
-        s && (m(n), e.dataTransfer.effectAllowed = "move");
+    ), J = h(() => {
+      f.current && f.current.disconnect(), f.current = new IntersectionObserver((t) => {
+        t[0].isIntersecting && z?.();
+      }), I.current && f.current.observe(I.current);
+    }, [z]);
+    re(() => (J(), () => {
+      f.current && f.current.disconnect();
+    }), [J, c]);
+    const X = h(
+      (t) => (e) => {
+        d && ($(t), e.dataTransfer.effectAllowed = "move");
       },
-      [s]
-    ), N = o(
-      (n) => (e) => {
-        s && (e.preventDefault(), e.dataTransfer.dropEffect = "move", I(n));
+      [d]
+    ), Y = h(
+      (t) => (e) => {
+        d && (e.preventDefault(), e.dataTransfer.dropEffect = "move", C(t));
       },
-      [s]
-    ), P = o(
-      (n) => (e) => {
-        if (!(!s || p === null)) {
-          if (e.preventDefault(), p !== n) {
-            const c = [...l], [a] = c.splice(p, 1);
-            c.splice(n, 0, a), L?.(c);
+      [d]
+    ), Z = h(
+      (t) => (e) => {
+        if (!(!d || m === null)) {
+          if (e.preventDefault(), m !== t) {
+            const n = [...c], [r] = n.splice(m, 1);
+            n.splice(t, 0, r), B?.(n);
           }
-          m(null), I(null);
+          $(null), C(null);
         }
       },
-      [s, p, l, L]
-    ), Q = o(() => {
-      m(null), I(null);
-    }, []), v = /* @__PURE__ */ new Map();
-    let h = -1;
-    return l.forEach((n) => {
-      if (n.options)
-        n.options.forEach((e) => {
-          e.disabled || (h++, v.set(e, h));
+      [d, m, c, B]
+    ), _ = h(() => {
+      $(null), C(null);
+    }, []), G = R === "nested", [A, w] = N([]), L = (t) => H && A.includes(t), S = (t) => {
+      w(
+        (e) => e.includes(t) ? e.filter((n) => n !== t) : [...e, t]
+      );
+    }, k = (t) => {
+      const e = t.filter((n) => n.selected).length;
+      return e > 0 && e < t.length;
+    }, u = /* @__PURE__ */ new Map();
+    let i = -1;
+    return c.forEach((t) => {
+      if (t.options)
+        t.options.forEach((e) => {
+          e.disabled || (i++, u.set(e, i));
         });
       else {
-        const e = n;
-        e.disabled || (h++, v.set(e, h));
+        const e = t;
+        e.disabled || (i++, u.set(e, i)), G && !L(e.value) && e.children?.forEach((n) => {
+          n.disabled || (i++, u.set(n, i));
+        });
       }
-    }), /* @__PURE__ */ d(V, { children: l.map((n, e) => {
-      const c = e === l.length - 1;
-      if (n.options) {
-        const r = n;
-        return /* @__PURE__ */ D("div", { style: { marginTop: i === "2.0" ? 2 : 0 }, children: [
-          /* @__PURE__ */ D(Y, { version: i, children: [
-            r.leadingIcon ? /* @__PURE__ */ d("span", { style: { marginRight: 8 }, children: r.leadingIcon }) : null,
-            r.label
+    }), /* @__PURE__ */ a(ne, { children: c.map((t, e) => {
+      const n = e === c.length - 1;
+      if (t.options) {
+        const s = t;
+        return /* @__PURE__ */ M("div", { style: { marginTop: o === "2.0" ? 2 : 0 }, children: [
+          /* @__PURE__ */ M(le, { version: o, children: [
+            s.leadingIcon ? /* @__PURE__ */ a("span", { style: { marginRight: 8 }, children: s.leadingIcon }) : null,
+            s.label
           ] }),
-          r.options.map((x, q) => {
-            const z = v.get(x), U = z === T && !x.disabled;
-            return /* @__PURE__ */ d(
-              H,
+          s.options.map((g, p) => {
+            const U = u.get(g), te = U === E && !g.disabled;
+            return /* @__PURE__ */ a(
+              q,
               {
-                version: i,
-                last: q === r.options.length - 1,
-                onSelect: y,
+                version: o,
+                last: p === s.options.length - 1,
+                onSelect: x,
                 showDescription: b,
                 onDropdownItemClick: F,
                 isMultiSelect: O,
-                option: x,
-                useDefaultCursor: j,
-                isFocused: U,
-                dataIndex: z,
+                option: g,
+                useDefaultCursor: D,
+                isFocused: te,
+                dataIndex: U,
                 isDraggable: !1,
-                showCheckboxForCustomElement: M,
-                checkboxActiveColor: R,
-                brandSelectedRow: $,
-                ref: (f) => {
-                  t && typeof t == "object" && t.current && f && f && f && f && (t.current[e] = f);
+                showCheckboxForCustomElement: j,
+                checkboxActiveColor: P,
+                brandSelectedRow: T,
+                ref: (v) => {
+                  l && typeof l == "object" && l.current && v && v && v && v && (l.current[e] = v);
                 }
               },
-              `${e}-${q}`
+              `${e}-${p}`
             );
           }),
-          c ? /* @__PURE__ */ d("span", { ref: g }) : null
+          n ? /* @__PURE__ */ a("span", { ref: I }) : null
         ] }, e);
       }
-      const a = n, G = v.get(a), S = G === T && !a.disabled;
-      return /* @__PURE__ */ D("div", { children: [
-        a.hasDivider && /* @__PURE__ */ d(Z, {}),
-        /* @__PURE__ */ d(
-          H,
+      const r = t, K = u.get(r), ee = K === E && !r.disabled, y = G ? r.children ?? [] : [], Q = L(r.value) ? [] : y;
+      return /* @__PURE__ */ M("div", { children: [
+        r.hasDivider && /* @__PURE__ */ a(ae, {}),
+        /* @__PURE__ */ a(
+          q,
           {
-            version: i,
-            last: c,
-            onSelect: y,
+            version: o,
+            last: n,
+            onSelect: x,
             showDescription: b,
             onDropdownItemClick: F,
             isMultiSelect: O,
-            option: a,
-            useDefaultCursor: j,
-            isFocused: S,
-            dataIndex: G,
-            isDraggable: s,
-            onDragStart: K(e),
-            onDragOver: N(e),
-            onDrop: P(e),
-            onDragEnd: Q,
-            isDraggedOver: J === e,
-            showCheckboxForCustomElement: M,
-            checkboxActiveColor: R,
-            brandSelectedRow: $,
-            ref: (r) => {
-              t && typeof t == "object" && t.current && r && (t.current[e] = r);
+            option: r,
+            useDefaultCursor: D,
+            isFocused: ee,
+            dataIndex: K,
+            isDraggable: d,
+            onDragStart: X(e),
+            onDragOver: Y(e),
+            onDrop: Z(e),
+            onDragEnd: _,
+            isDraggedOver: W === e,
+            showCheckboxForCustomElement: j,
+            checkboxActiveColor: P,
+            brandSelectedRow: T,
+            childrenLayout: R,
+            isPartiallyChecked: y.length ? k(y) : !1,
+            isCollapsible: H && G && !!y.length,
+            isCollapsed: L(r.value),
+            onToggleCollapse: () => S(r.value),
+            ref: (s) => {
+              l && typeof l == "object" && l.current && s && (l.current[e] = s);
             }
           },
-          a.value
+          r.value
         ),
-        c ? /* @__PURE__ */ d("span", { ref: g }) : null
+        Q.map((s, g) => {
+          const p = u.get(s);
+          return /* @__PURE__ */ a(
+            q,
+            {
+              version: o,
+              last: n && g === Q.length - 1,
+              onSelect: x,
+              showDescription: b,
+              onDropdownItemClick: F,
+              isMultiSelect: O,
+              option: s,
+              useDefaultCursor: D,
+              isFocused: p === E && !s.disabled,
+              dataIndex: p,
+              isDraggable: !1,
+              showCheckboxForCustomElement: j,
+              checkboxActiveColor: P,
+              brandSelectedRow: T,
+              childrenLayout: R,
+              isChildRow: !0
+            },
+            s.value
+          );
+        }),
+        n ? /* @__PURE__ */ a("span", { ref: I }) : null
       ] }, e);
     }) });
   }
 );
 export {
-  ne as MenuList
+  ie as MenuList
 };
 //# sourceMappingURL=MenuList.js.map

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuList.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/MenuList.tsx"],"sourcesContent":["import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';\nimport { DropdownOption, GroupedOption, SingleOption } from '../../../type';\nimport { MenuItem } from './MenuItem';\nimport { Divider, StyledGroupedLabel } from './MenuList.styled';\n\ninterface MenuListProps {\n\toptions: DropdownOption[];\n\tisMultiSelect?: boolean;\n\tshowDescription: (title?: string, description?: string) => void;\n\tonSelect: (optionSelect: SingleOption) => void;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tonInfiniteScroll?: () => void;\n\tonDropdownItemClick?: (option: DropdownOption) => void;\n\tuseDefaultCursor?: boolean;\n\tfocusedIndex?: number;\n\tisDraggable?: boolean;\n\tonOptionsReorder?: (reorderedOptions: DropdownOption[]) => void;\n\tshowCheckboxForCustomElement?: boolean;\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n}\n// eslint-disable-next-line react/display-name\nexport const MenuList = forwardRef<HTMLDivElement[], MenuListProps>(\n\t(\n\t\t{\n\t\t\toptions,\n\t\t\tisMultiSelect,\n\t\t\tshowDescription,\n\t\t\tonSelect,\n\t\t\tversion,\n\t\t\tonInfiniteScroll,\n\t\t\tonDropdownItemClick,\n\t\t\tuseDefaultCursor,\n\t\t\tfocusedIndex = -1,\n\t\t\tisDraggable = false,\n\t\t\tonOptionsReorder,\n\t\t\tshowCheckboxForCustomElement = false,\n\t\t\tcheckboxActiveColor,\n\t\t\tbrandSelectedRow,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst observer = useRef<IntersectionObserver | null>(null);\n\t\tconst spanRef = useRef<HTMLSpanElement | null>(null);\n\t\tconst [draggedIndex, setDraggedIndex] = useState<number | null>(null);\n\t\tconst [draggedOverIndex, setDraggedOverIndex] = useState<number | null>(\n\t\t\tnull,\n\t\t);\n\n\t\tconst setupObserver = useCallback(() => {\n\t\t\tif (observer.current) {\n\t\t\t\tobserver.current.disconnect();\n\t\t\t}\n\t\t\tobserver.current = new IntersectionObserver((entries) => {\n\t\t\t\tif (entries[0].isIntersecting) {\n\t\t\t\t\tonInfiniteScroll?.();\n\t\t\t\t}\n\t\t\t});\n\t\t\tif (spanRef.current) {\n\t\t\t\tobserver.current.observe(spanRef.current);\n\t\t\t}\n\t\t}, [onInfiniteScroll]);\n\n\t\tuseEffect(() => {\n\t\t\tsetupObserver();\n\t\t\treturn () => {\n\t\t\t\tif (observer.current) {\n\t\t\t\t\tobserver.current.disconnect();\n\t\t\t\t}\n\t\t\t};\n\t\t}, [setupObserver, options]);\n\n\t\tconst handleDragStart = useCallback(\n\t\t\t(index: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable) return;\n\t\t\t\tsetDraggedIndex(index);\n\t\t\t\te.dataTransfer.effectAllowed = 'move';\n\t\t\t},\n\t\t\t[isDraggable],\n\t\t);\n\n\t\tconst handleDragOver = useCallback(\n\t\t\t(index: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable) return;\n\t\t\t\te.preventDefault();\n\t\t\t\te.dataTransfer.dropEffect = 'move';\n\t\t\t\tsetDraggedOverIndex(index);\n\t\t\t},\n\t\t\t[isDraggable],\n\t\t);\n\n\t\tconst handleDrop = useCallback(\n\t\t\t(dropIndex: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable || draggedIndex === null) return;\n\t\t\t\te.preventDefault();\n\n\t\t\t\tif (draggedIndex !== dropIndex) {\n\t\t\t\t\tconst newOptions = [...options];\n\t\t\t\t\tconst [item] = newOptions.splice(draggedIndex, 1);\n\t\t\t\t\tnewOptions.splice(dropIndex, 0, item);\n\t\t\t\t\tonOptionsReorder?.(newOptions);\n\t\t\t\t}\n\n\t\t\t\tsetDraggedIndex(null);\n\t\t\t\tsetDraggedOverIndex(null);\n\t\t\t},\n\t\t\t[isDraggable, draggedIndex, options, onOptionsReorder],\n\t\t);\n\n\t\tconst handleDragEnd = useCallback(() => {\n\t\t\tsetDraggedIndex(null);\n\t\t\tsetDraggedOverIndex(null);\n\t\t}, []);\n\n\t\t// Calculate flat indices for all options\n\t\tconst flatIndices = new Map<SingleOption, number>();\n\t\tlet currentIndex = -1;\n\t\toptions.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t(option as GroupedOption).options.forEach((menuOption) => {\n\t\t\t\t\tif (!menuOption.disabled) {\n\t\t\t\t\t\tcurrentIndex++;\n\t\t\t\t\t\tflatIndices.set(menuOption, currentIndex);\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\tif (!singleOption.disabled) {\n\t\t\t\t\tcurrentIndex++;\n\t\t\t\t\tflatIndices.set(singleOption, currentIndex);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{options.map((option, i) => {\n\t\t\t\t\tconst last = i === options.length - 1;\n\t\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t\tconst groupedOption = option as GroupedOption;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div key={i} style={{ marginTop: version === '2.0' ? 2 : 0 }}>\n\t\t\t\t\t\t\t\t<StyledGroupedLabel version={version}>\n\t\t\t\t\t\t\t\t\t{groupedOption.leadingIcon ? (\n\t\t\t\t\t\t\t\t\t\t<span style={{ marginRight: 8 }}>\n\t\t\t\t\t\t\t\t\t\t\t{groupedOption.leadingIcon}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t{groupedOption.label}\n\t\t\t\t\t\t\t\t</StyledGroupedLabel>\n\t\t\t\t\t\t\t\t{groupedOption.options.map((menuOption, idx) => {\n\t\t\t\t\t\t\t\t\tconst currentFlatIndex = flatIndices.get(menuOption);\n\t\t\t\t\t\t\t\t\tconst isFocused =\n\t\t\t\t\t\t\t\t\t\tcurrentFlatIndex === focusedIndex && !menuOption.disabled;\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\t\t\tlast={idx === groupedOption.options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\t\t\t\toption={menuOption}\n\t\t\t\t\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\t\t\t\t\tkey={`${i}-${idx}`}\n\t\t\t\t\t\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\t\t\t\t\t\tdataIndex={currentFlatIndex}\n\t\t\t\t\t\t\t\t\t\t\tisDraggable={false}\n\t\t\t\t\t\t\t\t\t\t\tshowCheckboxForCustomElement={\n\t\t\t\t\t\t\t\t\t\t\t\tshowCheckboxForCustomElement\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\t\t\t\t\tif (ref && typeof ref === 'object' && ref.current) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) ref.current[i] = el;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t{last ? <span ref={spanRef} /> : null}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\n\t\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\t\tconst currentFlatIndex = flatIndices.get(singleOption);\n\t\t\t\t\tconst isFocused =\n\t\t\t\t\t\tcurrentFlatIndex === focusedIndex && !singleOption.disabled;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div key={i}>\n\t\t\t\t\t\t\t{singleOption.hasDivider && <Divider />}\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\tlast={last}\n\t\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\toption={singleOption}\n\t\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\t\tkey={singleOption.value}\n\t\t\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\t\t\tdataIndex={currentFlatIndex}\n\t\t\t\t\t\t\t\tisDraggable={isDraggable}\n\t\t\t\t\t\t\t\tonDragStart={handleDragStart(i)}\n\t\t\t\t\t\t\t\tonDragOver={handleDragOver(i)}\n\t\t\t\t\t\t\t\tonDrop={handleDrop(i)}\n\t\t\t\t\t\t\t\tonDragEnd={handleDragEnd}\n\t\t\t\t\t\t\t\tisDraggedOver={draggedOverIndex === i}\n\t\t\t\t\t\t\t\tshowCheckboxForCustomElement={showCheckboxForCustomElement}\n\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\t\tif (ref && typeof ref === 'object' && ref.current && el) {\n\t\t\t\t\t\t\t\t\t\tref.current[i] = el;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{last ? <span ref={spanRef} /> : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["MenuList","forwardRef","options","isMultiSelect","showDescription","onSelect","version","onInfiniteScroll","onDropdownItemClick","useDefaultCursor","focusedIndex","isDraggable","onOptionsReorder","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","ref","observer","useRef","spanRef","draggedIndex","setDraggedIndex","useState","draggedOverIndex","setDraggedOverIndex","setupObserver","useCallback","entries","useEffect","handleDragStart","index","handleDragOver","handleDrop","dropIndex","newOptions","item","handleDragEnd","flatIndices","currentIndex","option","menuOption","singleOption","jsx","Fragment","i","last","groupedOption","jsxs","StyledGroupedLabel","idx","currentFlatIndex","isFocused","MenuItem","el","Divider"],"mappings":"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"}
+{"version":3,"file":"MenuList.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/MenuList.tsx"],"sourcesContent":["import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';\nimport { DropdownOption, GroupedOption, SingleOption } from '../../../type';\nimport { MenuItem } from './MenuItem';\nimport { Divider, StyledGroupedLabel } from './MenuList.styled';\n\ninterface MenuListProps {\n\toptions: DropdownOption[];\n\tisMultiSelect?: boolean;\n\tshowDescription: (title?: string, description?: string) => void;\n\tonSelect: (optionSelect: SingleOption) => void;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tonInfiniteScroll?: () => void;\n\tonDropdownItemClick?: (option: DropdownOption) => void;\n\tuseDefaultCursor?: boolean;\n\tfocusedIndex?: number;\n\tisDraggable?: boolean;\n\tonOptionsReorder?: (reorderedOptions: DropdownOption[]) => void;\n\tshowCheckboxForCustomElement?: boolean;\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n\tchildrenLayout?: 'flyout' | 'nested';\n\tcollapsibleChildren?: boolean;\n}\n// eslint-disable-next-line react/display-name\nexport const MenuList = forwardRef<HTMLDivElement[], MenuListProps>(\n\t(\n\t\t{\n\t\t\toptions,\n\t\t\tisMultiSelect,\n\t\t\tshowDescription,\n\t\t\tonSelect,\n\t\t\tversion,\n\t\t\tonInfiniteScroll,\n\t\t\tonDropdownItemClick,\n\t\t\tuseDefaultCursor,\n\t\t\tfocusedIndex = -1,\n\t\t\tisDraggable = false,\n\t\t\tonOptionsReorder,\n\t\t\tshowCheckboxForCustomElement = false,\n\t\t\tcheckboxActiveColor,\n\t\t\tbrandSelectedRow,\n\t\t\tchildrenLayout = 'flyout',\n\t\t\tcollapsibleChildren = false,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst observer = useRef<IntersectionObserver | null>(null);\n\t\tconst spanRef = useRef<HTMLSpanElement | null>(null);\n\t\tconst [draggedIndex, setDraggedIndex] = useState<number | null>(null);\n\t\tconst [draggedOverIndex, setDraggedOverIndex] = useState<number | null>(\n\t\t\tnull,\n\t\t);\n\n\t\tconst setupObserver = useCallback(() => {\n\t\t\tif (observer.current) {\n\t\t\t\tobserver.current.disconnect();\n\t\t\t}\n\t\t\tobserver.current = new IntersectionObserver((entries) => {\n\t\t\t\tif (entries[0].isIntersecting) {\n\t\t\t\t\tonInfiniteScroll?.();\n\t\t\t\t}\n\t\t\t});\n\t\t\tif (spanRef.current) {\n\t\t\t\tobserver.current.observe(spanRef.current);\n\t\t\t}\n\t\t}, [onInfiniteScroll]);\n\n\t\tuseEffect(() => {\n\t\t\tsetupObserver();\n\t\t\treturn () => {\n\t\t\t\tif (observer.current) {\n\t\t\t\t\tobserver.current.disconnect();\n\t\t\t\t}\n\t\t\t};\n\t\t}, [setupObserver, options]);\n\n\t\tconst handleDragStart = useCallback(\n\t\t\t(index: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable) return;\n\t\t\t\tsetDraggedIndex(index);\n\t\t\t\te.dataTransfer.effectAllowed = 'move';\n\t\t\t},\n\t\t\t[isDraggable],\n\t\t);\n\n\t\tconst handleDragOver = useCallback(\n\t\t\t(index: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable) return;\n\t\t\t\te.preventDefault();\n\t\t\t\te.dataTransfer.dropEffect = 'move';\n\t\t\t\tsetDraggedOverIndex(index);\n\t\t\t},\n\t\t\t[isDraggable],\n\t\t);\n\n\t\tconst handleDrop = useCallback(\n\t\t\t(dropIndex: number) => (e: React.DragEvent<HTMLDivElement>) => {\n\t\t\t\tif (!isDraggable || draggedIndex === null) return;\n\t\t\t\te.preventDefault();\n\n\t\t\t\tif (draggedIndex !== dropIndex) {\n\t\t\t\t\tconst newOptions = [...options];\n\t\t\t\t\tconst [item] = newOptions.splice(draggedIndex, 1);\n\t\t\t\t\tnewOptions.splice(dropIndex, 0, item);\n\t\t\t\t\tonOptionsReorder?.(newOptions);\n\t\t\t\t}\n\n\t\t\t\tsetDraggedIndex(null);\n\t\t\t\tsetDraggedOverIndex(null);\n\t\t\t},\n\t\t\t[isDraggable, draggedIndex, options, onOptionsReorder],\n\t\t);\n\n\t\tconst handleDragEnd = useCallback(() => {\n\t\t\tsetDraggedIndex(null);\n\t\t\tsetDraggedOverIndex(null);\n\t\t}, []);\n\n\t\tconst isNestedLayout = childrenLayout === 'nested';\n\t\tconst [collapsedParents, setCollapsedParents] = useState<string[]>([]);\n\n\t\tconst isCollapsed = (value: string) =>\n\t\t\tcollapsibleChildren && collapsedParents.includes(value);\n\n\t\tconst toggleCollapsed = (value: string) => {\n\t\t\tsetCollapsedParents((previous) =>\n\t\t\t\tprevious.includes(value)\n\t\t\t\t\t? previous.filter((entry) => entry !== value)\n\t\t\t\t\t: [...previous, value],\n\t\t\t);\n\t\t};\n\n\t\t/** A parent is partly checked when some — but not all — children are. */\n\t\tconst isPartiallySelected = (children: SingleOption[]) => {\n\t\t\tconst selectedCount = children.filter((child) => child.selected).length;\n\t\t\treturn selectedCount > 0 && selectedCount < children.length;\n\t\t};\n\n\t\t// Calculate flat indices for all options\n\t\tconst flatIndices = new Map<SingleOption, number>();\n\t\tlet currentIndex = -1;\n\t\toptions.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t(option as GroupedOption).options.forEach((menuOption) => {\n\t\t\t\t\tif (!menuOption.disabled) {\n\t\t\t\t\t\tcurrentIndex++;\n\t\t\t\t\t\tflatIndices.set(menuOption, currentIndex);\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\tif (!singleOption.disabled) {\n\t\t\t\t\tcurrentIndex++;\n\t\t\t\t\tflatIndices.set(singleOption, currentIndex);\n\t\t\t\t}\n\t\t\t\tif (isNestedLayout && !isCollapsed(singleOption.value)) {\n\t\t\t\t\tsingleOption.children?.forEach((child) => {\n\t\t\t\t\t\tif (!child.disabled) {\n\t\t\t\t\t\t\tcurrentIndex++;\n\t\t\t\t\t\t\tflatIndices.set(child, currentIndex);\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{options.map((option, i) => {\n\t\t\t\t\tconst last = i === options.length - 1;\n\t\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t\tconst groupedOption = option as GroupedOption;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div key={i} style={{ marginTop: version === '2.0' ? 2 : 0 }}>\n\t\t\t\t\t\t\t\t<StyledGroupedLabel version={version}>\n\t\t\t\t\t\t\t\t\t{groupedOption.leadingIcon ? (\n\t\t\t\t\t\t\t\t\t\t<span style={{ marginRight: 8 }}>\n\t\t\t\t\t\t\t\t\t\t\t{groupedOption.leadingIcon}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t{groupedOption.label}\n\t\t\t\t\t\t\t\t</StyledGroupedLabel>\n\t\t\t\t\t\t\t\t{groupedOption.options.map((menuOption, idx) => {\n\t\t\t\t\t\t\t\t\tconst currentFlatIndex = flatIndices.get(menuOption);\n\t\t\t\t\t\t\t\t\tconst isFocused =\n\t\t\t\t\t\t\t\t\t\tcurrentFlatIndex === focusedIndex && !menuOption.disabled;\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\t\t\tlast={idx === groupedOption.options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\t\t\t\toption={menuOption}\n\t\t\t\t\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\t\t\t\t\tkey={`${i}-${idx}`}\n\t\t\t\t\t\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\t\t\t\t\t\tdataIndex={currentFlatIndex}\n\t\t\t\t\t\t\t\t\t\t\tisDraggable={false}\n\t\t\t\t\t\t\t\t\t\t\tshowCheckboxForCustomElement={\n\t\t\t\t\t\t\t\t\t\t\t\tshowCheckboxForCustomElement\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\t\t\t\t\tif (ref && typeof ref === 'object' && ref.current) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (el) ref.current[i] = el;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t{last ? <span ref={spanRef} /> : null}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\n\t\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\t\tconst currentFlatIndex = flatIndices.get(singleOption);\n\t\t\t\t\tconst isFocused =\n\t\t\t\t\t\tcurrentFlatIndex === focusedIndex && !singleOption.disabled;\n\t\t\t\t\tconst nestedChildren = isNestedLayout\n\t\t\t\t\t\t? singleOption.children ?? []\n\t\t\t\t\t\t: [];\n\t\t\t\t\t// The tri-state parent still reflects every child, collapsed or not.\n\t\t\t\t\tconst visibleChildren = isCollapsed(singleOption.value)\n\t\t\t\t\t\t? []\n\t\t\t\t\t\t: nestedChildren;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div key={i}>\n\t\t\t\t\t\t\t{singleOption.hasDivider && <Divider />}\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\tlast={last}\n\t\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\toption={singleOption}\n\t\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\t\tkey={singleOption.value}\n\t\t\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\t\t\tdataIndex={currentFlatIndex}\n\t\t\t\t\t\t\t\tisDraggable={isDraggable}\n\t\t\t\t\t\t\t\tonDragStart={handleDragStart(i)}\n\t\t\t\t\t\t\t\tonDragOver={handleDragOver(i)}\n\t\t\t\t\t\t\t\tonDrop={handleDrop(i)}\n\t\t\t\t\t\t\t\tonDragEnd={handleDragEnd}\n\t\t\t\t\t\t\t\tisDraggedOver={draggedOverIndex === i}\n\t\t\t\t\t\t\t\tshowCheckboxForCustomElement={showCheckboxForCustomElement}\n\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\tchildrenLayout={childrenLayout}\n\t\t\t\t\t\t\t\tisPartiallyChecked={\n\t\t\t\t\t\t\t\t\tnestedChildren.length\n\t\t\t\t\t\t\t\t\t\t? isPartiallySelected(nestedChildren)\n\t\t\t\t\t\t\t\t\t\t: false\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisCollapsible={\n\t\t\t\t\t\t\t\t\tcollapsibleChildren &&\n\t\t\t\t\t\t\t\t\tisNestedLayout &&\n\t\t\t\t\t\t\t\t\t!!nestedChildren.length\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisCollapsed={isCollapsed(singleOption.value)}\n\t\t\t\t\t\t\t\tonToggleCollapse={() => toggleCollapsed(singleOption.value)}\n\t\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\t\tif (ref && typeof ref === 'object' && ref.current && el) {\n\t\t\t\t\t\t\t\t\t\tref.current[i] = el;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{visibleChildren.map((child, childIdx) => {\n\t\t\t\t\t\t\t\tconst childFlatIndex = flatIndices.get(child);\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\t\tlast={last && childIdx === visibleChildren.length - 1}\n\t\t\t\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\t\t\toption={child}\n\t\t\t\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\t\t\t\tkey={child.value}\n\t\t\t\t\t\t\t\t\t\tisFocused={\n\t\t\t\t\t\t\t\t\t\t\tchildFlatIndex === focusedIndex && !child.disabled\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tdataIndex={childFlatIndex}\n\t\t\t\t\t\t\t\t\t\tisDraggable={false}\n\t\t\t\t\t\t\t\t\t\tshowCheckboxForCustomElement={showCheckboxForCustomElement}\n\t\t\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t\t\tchildrenLayout={childrenLayout}\n\t\t\t\t\t\t\t\t\t\tisChildRow\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t{last ? <span ref={spanRef} /> : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["MenuList","forwardRef","options","isMultiSelect","showDescription","onSelect","version","onInfiniteScroll","onDropdownItemClick","useDefaultCursor","focusedIndex","isDraggable","onOptionsReorder","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","childrenLayout","collapsibleChildren","ref","observer","useRef","spanRef","draggedIndex","setDraggedIndex","useState","draggedOverIndex","setDraggedOverIndex","setupObserver","useCallback","entries","useEffect","handleDragStart","index","handleDragOver","handleDrop","dropIndex","newOptions","item","handleDragEnd","isNestedLayout","collapsedParents","setCollapsedParents","isCollapsed","value","toggleCollapsed","previous","entry","isPartiallySelected","children","selectedCount","child","flatIndices","currentIndex","option","menuOption","singleOption","jsx","Fragment","i","last","groupedOption","jsxs","StyledGroupedLabel","idx","currentFlatIndex","isFocused","MenuItem","el","nestedChildren","visibleChildren","Divider","childIdx","childFlatIndex"],"mappings":"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"}

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts

@@ -1,21 +1,7 @@
-/// <reference types="react" />
-export declare const Divider: import('styled-components/dist/types').IStyledComponentBase<"web", Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
-    style?: import('react').CSSProperties | import('styled-components/dist/types').CSSPropertiesWithVars | undefined;
-}> & string;
-export declare const StyledGroupedLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Merged<Omit<Omit<import('styled-components').FastOmit<import('styled-components/dist/types').Merged<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
-    style?: import('react').CSSProperties | import('styled-components/dist/types').CSSPropertiesWithVars | undefined;
-}, {
+export declare const Divider: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const StyledGroupedLabel: import('styled-components').StyledComponent<"div", any, {
     numberOfLines?: number | undefined;
     color?: string | undefined;
-}>, "as" | "forwardedAs"> & {
-    as?: import('styled-components').WebTarget | undefined;
-    forwardedAs?: import('styled-components').WebTarget | undefined;
-}, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
-}, "style"> & {
-    style?: import('react').CSSProperties | import('styled-components/dist/types').CSSPropertiesWithVars | (import('react').CSSProperties & {
-        [key: `--${string}`]: string | number | undefined;
-    }) | undefined;
-}, {
+} & {
     version?: "1.0" | "2.0" | "3.0" | undefined;
-}>> & string;
+}, never>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js

@@ -1,44 +1,51 @@
-import { jsx as s } from "react/jsx-runtime";
-import { useState as h, useEffect as u } from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { useState as p, useEffect as u } from "react";
 import { ListItem as S } from "../../../../list-item/ListItem.js";
-import { CheckBox as p } from "../../../../checkBox/CheckBox.js";
-const y = ({
-  options: o,
-  onSelect: a,
-  version: r,
+import { CheckBox as m } from "../../../../checkBox/CheckBox.js";
+const g = ({
+  options: r,
+  onSelect: c,
+  version: d,
   checkboxActiveColor: f,
-  brandSelectedRow: n
+  brandSelectedRow: h
 }) => {
-  const [e, c] = h("notSelected");
-  function d() {
-    e === "partiallySelected" && a("notSelected"), e === "selectAll" && a("notSelected"), e === "notSelected" && a("selectAll");
+  const [t, s] = p("notSelected");
+  function n() {
+    t === "partiallySelected" && c("notSelected"), t === "selectAll" && c("notSelected"), t === "notSelected" && c("selectAll");
   }
   return u(() => {
-    const l = [];
-    o.filter((t) => !t.disabled).forEach((t) => {
-      t.options ? t.options.filter((i) => !i.disabled).forEach((i) => {
-        l.push(i.selected || !1);
-      }) : l.push(t.selected || !1);
-    }), l.every(Boolean) ? c("selectAll") : l.filter(Boolean).length > 0 ? c("partiallySelected") : c("notSelected");
-  }, [o]), /* @__PURE__ */ s(
+    const e = [];
+    r.filter((i) => !i.disabled).forEach((i) => {
+      if (i.options)
+        i.options.filter((l) => !l.disabled).forEach((l) => {
+          e.push(l.selected || !1);
+        });
+      else {
+        const l = i;
+        l.children?.length ? l.children.filter((a) => !a.disabled).forEach((a) => {
+          e.push(a.selected || !1);
+        }) : e.push(l.selected || !1);
+      }
+    }), e.every(Boolean) ? s("selectAll") : e.filter(Boolean).length > 0 ? s("partiallySelected") : s("notSelected");
+  }, [r]), /* @__PURE__ */ o(
     S,
     {
-      version: r,
-      brandSelectedRow: n,
-      onClick: (l) => {
-        l.preventDefault(), d();
+      version: d,
+      brandSelectedRow: h,
+      onClick: (e) => {
+        e.preventDefault(), n();
       },
       listItem: {
         label: "Select All",
         value: "All"
       },
-      leadingIcon: /* @__PURE__ */ s("div", { style: { width: 18, height: 18 }, children: /* @__PURE__ */ s(
-        p,
+      leadingIcon: /* @__PURE__ */ o("div", { style: { width: 18, height: 18 }, children: /* @__PURE__ */ o(
+        m,
         {
-          size: r === "2.0" ? "SMALL" : "DEFAULT",
-          isChecked: e === "selectAll" || e === "partiallySelected",
-          isPartiallyChecked: e === "partiallySelected",
-          onValueChange: d,
+          size: d === "2.0" ? "SMALL" : "DEFAULT",
+          isChecked: t === "selectAll" || t === "partiallySelected",
+          isPartiallyChecked: t === "partiallySelected",
+          onValueChange: n,
           activeColor: f
         }
       ) }),
@@ -47,6 +54,6 @@ const y = ({
   );
 };
 export {
-  y as SelectAllMenu
+  g as SelectAllMenu
 };
 //# sourceMappingURL=SelectAllMenu.js.map

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectAllMenu.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { CheckBox } from '@src/components/checkBox';\nimport { ListItem } from '@src/components/list-item';\nimport { DropdownOption, GroupedOption, SingleOption } from '../../../type';\n\nexport type SelectAllCheckboxState =\n\t| 'notSelected'\n\t| 'selectAll'\n\t| 'partiallySelected';\n\nexport const SelectAllMenu: React.FC<{\n\toptions: DropdownOption[];\n\tonSelect: (newState: SelectAllCheckboxState) => void;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n}> = ({\n\toptions,\n\tonSelect,\n\tversion,\n\tcheckboxActiveColor,\n\tbrandSelectedRow,\n}) => {\n\tconst [checkStatus, setCheckStatus] =\n\t\tuseState<SelectAllCheckboxState>('notSelected');\n\n\tfunction onCheckHandler() {\n\t\tif (checkStatus === 'partiallySelected') {\n\t\t\tonSelect('notSelected');\n\t\t}\n\n\t\tif (checkStatus === 'selectAll') {\n\t\t\tonSelect('notSelected');\n\t\t}\n\n\t\tif (checkStatus === 'notSelected') {\n\t\t\tonSelect('selectAll');\n\t\t}\n\t}\n\n\tuseEffect(() => {\n\t\tconst allOptions: boolean[] = [];\n\n\t\toptions\n\t\t\t.filter((option) => !(option as SingleOption).disabled)\n\t\t\t.forEach((option) => {\n\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t(option as GroupedOption).options\n\t\t\t\t\t\t.filter((op) => !op.disabled)\n\t\t\t\t\t\t.forEach((nestedOption) => {\n\t\t\t\t\t\t\tallOptions.push(nestedOption.selected || false);\n\t\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tallOptions.push((option as SingleOption).selected || false);\n\t\t\t\t}\n\t\t\t});\n\n\t\tif (allOptions.every(Boolean)) {\n\t\t\tsetCheckStatus('selectAll');\n\t\t} else if (allOptions.filter(Boolean).length > 0) {\n\t\t\tsetCheckStatus('partiallySelected');\n\t\t} else {\n\t\t\tsetCheckStatus('notSelected');\n\t\t}\n\t}, [options]);\n\n\treturn (\n\t\t<ListItem\n\t\t\tversion={version}\n\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\tonClick={(e) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tonCheckHandler();\n\t\t\t}}\n\t\t\tlistItem={{\n\t\t\t\tlabel: 'Select All',\n\t\t\t\tvalue: 'All',\n\t\t\t}}\n\t\t\tleadingIcon={\n\t\t\t\t<div style={{ width: 18, height: 18 }}>\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\tisChecked={\n\t\t\t\t\t\t\tcheckStatus === 'selectAll' || checkStatus === 'partiallySelected'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisPartiallyChecked={checkStatus === 'partiallySelected'}\n\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\tvariant={'default'}\n\t\t/>\n\t);\n};\n"],"names":["SelectAllMenu","options","onSelect","version","checkboxActiveColor","brandSelectedRow","checkStatus","setCheckStatus","useState","onCheckHandler","useEffect","allOptions","option","op","nestedOption","jsx","ListItem","e","CheckBox"],"mappings":";;;;AAUO,MAAMA,IAMR,CAAC;AAAA,EACL,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,kBAAAC;AACD,MAAM;AACL,QAAM,CAACC,GAAaC,CAAc,IACjCC,EAAiC,aAAa;AAE/C,WAASC,IAAiB;AACzB,IAAIH,MAAgB,uBACnBJ,EAAS,aAAa,GAGnBI,MAAgB,eACnBJ,EAAS,aAAa,GAGnBI,MAAgB,iBACnBJ,EAAS,WAAW;AAAA,EAEtB;AAEA,SAAAQ,EAAU,MAAM;AACf,UAAMC,IAAwB,CAAA;AAE9B,IAAAV,EACE,OAAO,CAACW,MAAW,CAAEA,EAAwB,QAAQ,EACrD,QAAQ,CAACA,MAAW;AACpB,MAAKA,EAAyB,UAC5BA,EAAyB,QACxB,OAAO,CAACC,MAAO,CAACA,EAAG,QAAQ,EAC3B,QAAQ,CAACC,MAAiB;AAC1B,QAAAH,EAAW,KAAKG,EAAa,YAAY,EAAK;AAAA,MAC/C,CAAC,IAEFH,EAAW,KAAMC,EAAwB,YAAY,EAAK;AAAA,IAE5D,CAAC,GAEED,EAAW,MAAM,OAAO,IAC3BJ,EAAe,WAAW,IAChBI,EAAW,OAAO,OAAO,EAAE,SAAS,IAC9CJ,EAAe,mBAAmB,IAElCA,EAAe,aAAa;AAAA,EAE9B,GAAG,CAACN,CAAO,CAAC,GAGX,gBAAAc;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,SAAAb;AAAA,MACA,kBAAAE;AAAA,MACA,SAAS,CAACY,MAAM;AACf,QAAAA,EAAE,eAAA,GACFR,EAAA;AAAA,MACD;AAAA,MACA,UAAU;AAAA,QACT,OAAO;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAER,+BACE,OAAA,EAAI,OAAO,EAAE,OAAO,IAAI,QAAQ,GAAA,GAChC,UAAA,gBAAAM;AAAA,QAACG;AAAA,QAAA;AAAA,UACA,MAAMf,MAAY,QAAQ,UAAU;AAAA,UACpC,WACCG,MAAgB,eAAeA,MAAgB;AAAA,UAEhD,oBAAoBA,MAAgB;AAAA,UACpC,eAAeG;AAAA,UACf,aAAaL;AAAA,QAAA;AAAA,MAAA,GAEf;AAAA,MAED,SAAS;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
+{"version":3,"file":"SelectAllMenu.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { CheckBox } from '@src/components/checkBox';\nimport { ListItem } from '@src/components/list-item';\nimport { DropdownOption, GroupedOption, SingleOption } from '../../../type';\n\nexport type SelectAllCheckboxState =\n\t| 'notSelected'\n\t| 'selectAll'\n\t| 'partiallySelected';\n\nexport const SelectAllMenu: React.FC<{\n\toptions: DropdownOption[];\n\tonSelect: (newState: SelectAllCheckboxState) => void;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n}> = ({\n\toptions,\n\tonSelect,\n\tversion,\n\tcheckboxActiveColor,\n\tbrandSelectedRow,\n}) => {\n\tconst [checkStatus, setCheckStatus] =\n\t\tuseState<SelectAllCheckboxState>('notSelected');\n\n\tfunction onCheckHandler() {\n\t\tif (checkStatus === 'partiallySelected') {\n\t\t\tonSelect('notSelected');\n\t\t}\n\n\t\tif (checkStatus === 'selectAll') {\n\t\t\tonSelect('notSelected');\n\t\t}\n\n\t\tif (checkStatus === 'notSelected') {\n\t\t\tonSelect('selectAll');\n\t\t}\n\t}\n\n\tuseEffect(() => {\n\t\tconst allOptions: boolean[] = [];\n\n\t\toptions\n\t\t\t.filter((option) => !(option as SingleOption).disabled)\n\t\t\t.forEach((option) => {\n\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t(option as GroupedOption).options\n\t\t\t\t\t\t.filter((op) => !op.disabled)\n\t\t\t\t\t\t.forEach((nestedOption) => {\n\t\t\t\t\t\t\tallOptions.push(nestedOption.selected || false);\n\t\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\t\t// For a nested option the children carry the truth — the parent is\n\t\t\t\t\t// only selected when all of them are, so counting it alone would\n\t\t\t\t\t// read a partly-selected group as nothing selected.\n\t\t\t\t\tif (singleOption.children?.length) {\n\t\t\t\t\t\tsingleOption.children\n\t\t\t\t\t\t\t.filter((child) => !child.disabled)\n\t\t\t\t\t\t\t.forEach((child) => {\n\t\t\t\t\t\t\t\tallOptions.push(child.selected || false);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t} else {\n\t\t\t\t\t\tallOptions.push(singleOption.selected || false);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\n\t\tif (allOptions.every(Boolean)) {\n\t\t\tsetCheckStatus('selectAll');\n\t\t} else if (allOptions.filter(Boolean).length > 0) {\n\t\t\tsetCheckStatus('partiallySelected');\n\t\t} else {\n\t\t\tsetCheckStatus('notSelected');\n\t\t}\n\t}, [options]);\n\n\treturn (\n\t\t<ListItem\n\t\t\tversion={version}\n\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\tonClick={(e) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tonCheckHandler();\n\t\t\t}}\n\t\t\tlistItem={{\n\t\t\t\tlabel: 'Select All',\n\t\t\t\tvalue: 'All',\n\t\t\t}}\n\t\t\tleadingIcon={\n\t\t\t\t<div style={{ width: 18, height: 18 }}>\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\tisChecked={\n\t\t\t\t\t\t\tcheckStatus === 'selectAll' || checkStatus === 'partiallySelected'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisPartiallyChecked={checkStatus === 'partiallySelected'}\n\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\tvariant={'default'}\n\t\t/>\n\t);\n};\n"],"names":["SelectAllMenu","options","onSelect","version","checkboxActiveColor","brandSelectedRow","checkStatus","setCheckStatus","useState","onCheckHandler","useEffect","allOptions","option","op","nestedOption","singleOption","child","jsx","ListItem","CheckBox"],"mappings":";;;;AAUO,MAAMA,IAMR,CAAC;AAAA,EACL,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,kBAAAC;AACD,MAAM;AACL,QAAM,CAACC,GAAaC,CAAc,IACjCC,EAAiC,aAAa;AAE/C,WAASC,IAAiB;AACzB,IAAIH,MAAgB,uBACnBJ,EAAS,aAAa,GAGnBI,MAAgB,eACnBJ,EAAS,aAAa,GAGnBI,MAAgB,iBACnBJ,EAAS,WAAW;AAAA,EAEtB;AAEA,SAAAQ,EAAU,MAAM;AACf,UAAMC,IAAwB,CAAA;AAE9B,IAAAV,EACE,OAAO,CAACW,MAAW,CAAEA,EAAwB,QAAQ,EACrD,QAAQ,CAACA,MAAW;AACpB,UAAKA,EAAyB;AAC5B,QAAAA,EAAyB,QACxB,OAAO,CAACC,MAAO,CAACA,EAAG,QAAQ,EAC3B,QAAQ,CAACC,MAAiB;AAC1B,UAAAH,EAAW,KAAKG,EAAa,YAAY,EAAK;AAAA,QAC/C,CAAC;AAAA,WACI;AACN,cAAMC,IAAeH;AAIrB,QAAIG,EAAa,UAAU,SAC1BA,EAAa,SACX,OAAO,CAACC,MAAU,CAACA,EAAM,QAAQ,EACjC,QAAQ,CAACA,MAAU;AACnB,UAAAL,EAAW,KAAKK,EAAM,YAAY,EAAK;AAAA,QACxC,CAAC,IAEFL,EAAW,KAAKI,EAAa,YAAY,EAAK;AAAA,MAEhD;AAAA,IACD,CAAC,GAEEJ,EAAW,MAAM,OAAO,IAC3BJ,EAAe,WAAW,IAChBI,EAAW,OAAO,OAAO,EAAE,SAAS,IAC9CJ,EAAe,mBAAmB,IAElCA,EAAe,aAAa;AAAA,EAE9B,GAAG,CAACN,CAAO,CAAC,GAGX,gBAAAgB;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,SAAAf;AAAA,MACA,kBAAAE;AAAA,MACA,SAAS,CAAC,MAAM;AACf,UAAE,eAAA,GACFI,EAAA;AAAA,MACD;AAAA,MACA,UAAU;AAAA,QACT,OAAO;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAER,+BACE,OAAA,EAAI,OAAO,EAAE,OAAO,IAAI,QAAQ,GAAA,GAChC,UAAA,gBAAAQ;AAAA,QAACE;AAAA,QAAA;AAAA,UACA,MAAMhB,MAAY,QAAQ,UAAU;AAAA,UACpC,WACCG,MAAgB,eAAeA,MAAgB;AAAA,UAEhD,oBAAoBA,MAAgB;AAAA,UACpC,eAAeG;AAAA,UACf,aAAaL;AAAA,QAAA;AAAA,MAAA,GAEf;AAAA,MAED,SAAS;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts

@@ -7,6 +7,7 @@ interface MultiSelectDropdownBottomBarProps {
     buttonText?: string;
     buttonOptions?: ButtonOptions;
     hideClearButton?: boolean;
+    hideSelectedCount?: boolean;
 }
 declare const MultiSelectDropdownBottomBar: React.FC<MultiSelectDropdownBottomBarProps>;
 export default MultiSelectDropdownBottomBar;

package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js

@@ -1,43 +1,52 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { BodySecondary as C } from "../../../../TypographyStyle.js";
-import { COLORS as b } from "../../../../../constants/Theme.js";
-import { BottomBarContainer as h } from "./MultiSelectDropdownBottomBar.styled.js";
-import { Button as l } from "../../../../button/Button.js";
-const k = (i) => {
-  const { onClear: s, onApply: p, list: c, buttonText: u, buttonOptions: a, hideClearButton: y } = i, {
-    primaryButtonText: m,
-    primaryButtonType: d,
-    secondaryButtonText: f,
-    secondaryButtonType: x
-  } = a ?? {}, r = c.reduce((t, e) => {
+import { jsxs as i, jsx as n } from "react/jsx-runtime";
+import { BodySecondary as b } from "../../../../TypographyStyle.js";
+import { COLORS as g } from "../../../../../constants/Theme.js";
+import { BottomBarContainer as O } from "./MultiSelectDropdownBottomBar.styled.js";
+import { Button as s } from "../../../../button/Button.js";
+const A = (c) => {
+  const {
+    onClear: p,
+    onApply: u,
+    list: d,
+    buttonText: y,
+    buttonOptions: a,
+    hideClearButton: m,
+    hideSelectedCount: f
+  } = c, {
+    primaryButtonText: x,
+    primaryButtonType: B,
+    secondaryButtonText: h,
+    secondaryButtonType: T
+  } = a ?? {}, l = d.reduce((t, e) => {
     if (e.options) {
-      const B = e.options.filter(
-        (T) => T.selected === !0
+      const r = e.options.filter(
+        (C) => C.selected === !0
       ).length;
-      return t + B;
+      return t + r;
     }
-    return e.selected ? t + 1 : t;
+    const o = e;
+    return o.children?.length ? t + o.children.filter((r) => r.selected).length : o.selected ? t + 1 : t;
   }, 0);
-  return /* @__PURE__ */ n(h, { style: { justifyContent: "space-between" }, children: [
-    /* @__PURE__ */ o(C, { style: { flex: 1, color: b.content.primary }, children: r ? `${r} selected` : "" }),
-    /* @__PURE__ */ n("div", { style: { flexDirection: "row", display: "flex", gap: 12 }, children: [
-      !y && /* @__PURE__ */ o(
-        l,
+  return /* @__PURE__ */ i(O, { style: { justifyContent: "space-between" }, children: [
+    /* @__PURE__ */ n(b, { style: { flex: 1, color: g.content.primary }, children: l && !f ? `${l} selected` : "" }),
+    /* @__PURE__ */ i("div", { style: { flexDirection: "row", display: "flex", gap: 12 }, children: [
+      !m && /* @__PURE__ */ n(
+        s,
         {
           size: "small",
-          buttonType: x || "primary",
-          buttonText: f || "Clear",
-          onClick: s
+          buttonType: T || "primary",
+          buttonText: h || "Clear",
+          onClick: p
         }
       ),
-      /* @__PURE__ */ o(
-        l,
+      /* @__PURE__ */ n(
+        s,
         {
           size: "small",
-          buttonText: m || u || "Apply",
-          buttonType: d || "primary",
+          buttonText: x || y || "Apply",
+          buttonType: B || "primary",
           onClick: () => {
-            p();
+            u();
           }
         }
       )
@@ -45,6 +54,6 @@ const k = (i) => {
   ] });
 };
 export {
-  k as default
+  A as default
 };
 //# sourceMappingURL=MultiSelectDropdownBottomBar.js.map