@bikdotai/bik-component-library 0.0.876-beta.1 → 0.0.876-beta.3

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

@@ -1,47 +1,62 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
 import { BodySecondary as C } from "../../../../TypographyStyle.js";
-import { COLORS as b } from "../../../../../constants/Theme.js";
+import { COLORS as T } from "../../../../../constants/Theme.js";
+import { getSelectionLeaves as b } from "../../utils/iterationOnOptions.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,
+import { Button as n } from "../../../../button/Button.js";
+const k = (r) => {
+  const {
+    onClear: l,
+    onApply: i,
+    list: s,
+    buttonText: p,
+    buttonOptions: a,
+    hideClearButton: c,
+    hideSelectedCount: m,
+    childrenLayout: y
+  } = r, {
+    primaryButtonText: u,
     primaryButtonType: d,
     secondaryButtonText: f,
     secondaryButtonType: x
-  } = a ?? {}, r = c.reduce((t, e) => {
-    if (e.options) {
-      const B = e.options.filter(
-        (T) => T.selected === !0
-      ).length;
-      return t + B;
-    }
-    return e.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,
-        {
-          size: "small",
-          buttonType: x || "primary",
-          buttonText: f || "Clear",
-          onClick: s
-        }
-      ),
-      /* @__PURE__ */ o(
-        l,
-        {
-          size: "small",
-          buttonText: m || u || "Apply",
-          buttonType: d || "primary",
-          onClick: () => {
-            p();
-          }
-        }
-      )
-    ] })
+  } = a ?? {}, e = b(s, y === "nested").filter(
+    (B) => B.selected
+  ).length;
+  return /* @__PURE__ */ o(h, { style: { justifyContent: "space-between" }, children: [
+    /* @__PURE__ */ t(C, { style: { flex: 1, color: T.content.primary }, children: e && !m ? `${e} selected` : "" }),
+    /* @__PURE__ */ o(
+      "div",
+      {
+        style: {
+          flexDirection: "row",
+          display: "flex",
+          alignItems: "center",
+          gap: 12
+        },
+        children: [
+          !c && /* @__PURE__ */ t(
+            n,
+            {
+              size: "small",
+              buttonType: x || "primary",
+              buttonText: f || "Clear",
+              onClick: l
+            }
+          ),
+          /* @__PURE__ */ t(
+            n,
+            {
+              size: "small",
+              buttonText: u || p || "Apply",
+              buttonType: d || "primary",
+              onClick: () => {
+                i();
+              }
+            }
+          )
+        ]
+      }
+    )
   ] });
 };
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"MultiSelectDropdownBottomBar.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from '@src/components/button';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tButtonOptions,\n\tDropdownOption,\n\tGroupedOption,\n\tSingleOption,\n} from '../../../type';\nimport { BottomBarContainer } from './MultiSelectDropdownBottomBar.styled';\n\ninterface MultiSelectDropdownBottomBarProps {\n\tonClear?: () => void;\n\tonApply: () => void;\n\tlist: DropdownOption[];\n\tbuttonText?: string;\n\tbuttonOptions?: ButtonOptions;\n\thideClearButton?: boolean;\n}\nconst MultiSelectDropdownBottomBar: React.FC<\n\tMultiSelectDropdownBottomBarProps\n> = (props) => {\n\tconst { onClear, onApply, list, buttonText, buttonOptions, hideClearButton } =\n\t\tprops;\n\tconst {\n\t\tprimaryButtonText,\n\t\tprimaryButtonType,\n\t\tsecondaryButtonText,\n\t\tsecondaryButtonType,\n\t} = buttonOptions ?? {};\n\tconst count = list.reduce((total, option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\tconst groupedTotal = (option as GroupedOption).options.filter(\n\t\t\t\t(op) => op.selected === true,\n\t\t\t).length;\n\t\t\treturn total + groupedTotal;\n\t\t}\n\n\t\treturn (option as SingleOption).selected ? total + 1 : total;\n\t}, 0);\n\n\treturn (\n\t\t<BottomBarContainer style={{ justifyContent: 'space-between' }}>\n\t\t\t<BodySecondary style={{ flex: 1, color: COLORS.content.primary }}>\n\t\t\t\t{count ? `${count} selected` : ''}\n\t\t\t</BodySecondary>\n\n\t\t\t<div style={{ flexDirection: 'row', display: 'flex', gap: 12 }}>\n\t\t\t\t{!hideClearButton && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonType={secondaryButtonType || 'primary'}\n\t\t\t\t\t\tbuttonText={secondaryButtonText || 'Clear'}\n\t\t\t\t\t\tonClick={onClear}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tbuttonText={primaryButtonText || buttonText || 'Apply'}\n\t\t\t\t\tbuttonType={primaryButtonType || 'primary'}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tonApply();\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</BottomBarContainer>\n\t);\n};\n\nexport default MultiSelectDropdownBottomBar;\n"],"names":["MultiSelectDropdownBottomBar","props","onClear","onApply","list","buttonText","buttonOptions","hideClearButton","primaryButtonText","primaryButtonType","secondaryButtonText","secondaryButtonType","count","total","option","groupedTotal","op","BottomBarContainer","jsx","BodySecondary","COLORS","jsxs","Button"],"mappings":";;;;;AAoBA,MAAMA,IAEF,CAACC,MAAU;AACd,QAAM,EAAE,SAAAC,GAAS,SAAAC,GAAS,MAAAC,GAAM,YAAAC,GAAY,eAAAC,GAAe,iBAAAC,MAC1DN,GACK;AAAA,IACL,mBAAAO;AAAA,IACA,mBAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,qBAAAC;AAAA,EAAA,IACGL,KAAiB,CAAA,GACfM,IAAQR,EAAK,OAAO,CAACS,GAAOC,MAAW;AAC5C,QAAKA,EAAyB,SAAS;AACtC,YAAMC,IAAgBD,EAAyB,QAAQ;AAAA,QACtD,CAACE,MAAOA,EAAG,aAAa;AAAA,MAAA,EACvB;AACF,aAAOH,IAAQE;AAAA,IAChB;AAEA,WAAQD,EAAwB,WAAWD,IAAQ,IAAIA;AAAA,EACxD,GAAG,CAAC;AAEJ,2BACEI,GAAA,EAAmB,OAAO,EAAE,gBAAgB,mBAC5C,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAc,OAAO,EAAE,MAAM,GAAG,OAAOC,EAAO,QAAQ,QAAA,GACrD,UAAAR,IAAQ,GAAGA,CAAK,cAAc,IAChC;AAAA,IAEA,gBAAAS,EAAC,OAAA,EAAI,OAAO,EAAE,eAAe,OAAO,SAAS,QAAQ,KAAK,GAAA,GACxD,UAAA;AAAA,MAAA,CAACd,KACD,gBAAAW;AAAA,QAACI;AAAA,QAAA;AAAA,UACA,MAAK;AAAA,UACL,YAAYX,KAAuB;AAAA,UACnC,YAAYD,KAAuB;AAAA,UACnC,SAASR;AAAA,QAAA;AAAA,MAAA;AAAA,MAGX,gBAAAgB;AAAA,QAACI;AAAA,QAAA;AAAA,UACA,MAAK;AAAA,UACL,YAAYd,KAAqBH,KAAc;AAAA,UAC/C,YAAYI,KAAqB;AAAA,UACjC,SAAS,MAAM;AACd,YAAAN,EAAA;AAAA,UACD;AAAA,QAAA;AAAA,MAAA;AAAA,IACD,EAAA,CACD;AAAA,EAAA,GACD;AAEF;"}
+{"version":3,"file":"MultiSelectDropdownBottomBar.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from '@src/components/button';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { ButtonOptions, DropdownOption } from '../../../type';\nimport { getSelectionLeaves } from '../../utils/iterationOnOptions';\nimport { BottomBarContainer } from './MultiSelectDropdownBottomBar.styled';\n\ninterface MultiSelectDropdownBottomBarProps {\n\tonClear?: () => void;\n\tonApply: () => void;\n\tlist: DropdownOption[];\n\tbuttonText?: string;\n\tbuttonOptions?: ButtonOptions;\n\thideClearButton?: boolean;\n\thideSelectedCount?: boolean;\n\tchildrenLayout?: 'flyout' | 'nested';\n}\nconst MultiSelectDropdownBottomBar: React.FC<\n\tMultiSelectDropdownBottomBarProps\n> = (props) => {\n\tconst {\n\t\tonClear,\n\t\tonApply,\n\t\tlist,\n\t\tbuttonText,\n\t\tbuttonOptions,\n\t\thideClearButton,\n\t\thideSelectedCount,\n\t\tchildrenLayout,\n\t} = props;\n\tconst {\n\t\tprimaryButtonText,\n\t\tprimaryButtonType,\n\t\tsecondaryButtonText,\n\t\tsecondaryButtonType,\n\t} = buttonOptions ?? {};\n\tconst count = getSelectionLeaves(list, childrenLayout === 'nested').filter(\n\t\t(leaf) => leaf.selected,\n\t).length;\n\n\treturn (\n\t\t<BottomBarContainer style={{ justifyContent: 'space-between' }}>\n\t\t\t<BodySecondary style={{ flex: 1, color: COLORS.content.primary }}>\n\t\t\t\t{count && !hideSelectedCount ? `${count} selected` : ''}\n\t\t\t</BodySecondary>\n\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tgap: 12,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!hideClearButton && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonType={secondaryButtonType || 'primary'}\n\t\t\t\t\t\tbuttonText={secondaryButtonText || 'Clear'}\n\t\t\t\t\t\tonClick={onClear}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tbuttonText={primaryButtonText || buttonText || 'Apply'}\n\t\t\t\t\tbuttonType={primaryButtonType || 'primary'}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tonApply();\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</BottomBarContainer>\n\t);\n};\n\nexport default MultiSelectDropdownBottomBar;\n"],"names":["MultiSelectDropdownBottomBar","props","onClear","onApply","list","buttonText","buttonOptions","hideClearButton","hideSelectedCount","childrenLayout","primaryButtonText","primaryButtonType","secondaryButtonText","secondaryButtonType","count","getSelectionLeaves","leaf","BottomBarContainer","jsx","BodySecondary","COLORS","jsxs","Button"],"mappings":";;;;;;AAkBA,MAAMA,IAEF,CAACC,MAAU;AACd,QAAM;AAAA,IACL,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA,IACGR,GACE;AAAA,IACL,mBAAAS;AAAA,IACA,mBAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,qBAAAC;AAAA,EAAA,IACGP,KAAiB,CAAA,GACfQ,IAAQC,EAAmBX,GAAMK,MAAmB,QAAQ,EAAE;AAAA,IACnE,CAACO,MAASA,EAAK;AAAA,EAAA,EACd;AAEF,2BACEC,GAAA,EAAmB,OAAO,EAAE,gBAAgB,mBAC5C,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAc,OAAO,EAAE,MAAM,GAAG,OAAOC,EAAO,QAAQ,QAAA,GACrD,eAAS,CAACZ,IAAoB,GAAGM,CAAK,cAAc,IACtD;AAAA,IAEA,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,OAAO;AAAA,UACN,eAAe;AAAA,UACf,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,KAAK;AAAA,QAAA;AAAA,QAGL,UAAA;AAAA,UAAA,CAACd,KACD,gBAAAW;AAAA,YAACI;AAAA,YAAA;AAAA,cACA,MAAK;AAAA,cACL,YAAYT,KAAuB;AAAA,cACnC,YAAYD,KAAuB;AAAA,cACnC,SAASV;AAAA,YAAA;AAAA,UAAA;AAAA,UAGX,gBAAAgB;AAAA,YAACI;AAAA,YAAA;AAAA,cACA,MAAK;AAAA,cACL,YAAYZ,KAAqBL,KAAc;AAAA,cAC/C,YAAYM,KAAqB;AAAA,cACjC,SAAS,MAAM;AACd,gBAAAR,EAAA;AAAA,cACD;AAAA,YAAA;AAAA,UAAA;AAAA,QACD;AAAA,MAAA;AAAA,IAAA;AAAA,EACD,GACD;AAEF;"}

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.d.ts

@@ -1,5 +1,6 @@
 import { DropdownOption, SingleOption } from '../../type';
-export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean): ({
+export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean, nestedChildren?: boolean): (SingleOption | {
+    options: SingleOption[];
     label: string;
     value: string;
     description?: string | null | undefined;
@@ -17,24 +18,25 @@ export declare function iterateOnOptions(options: DropdownOption[], newVal: Part
     'data-test'?: string | undefined;
     hasDivider?: boolean | undefined;
 } | {
+    options: SingleOption[];
     label?: string | undefined;
-    value?: string | undefined;
-    description?: string | null | undefined;
-    selected?: boolean | undefined;
-    disabled?: boolean | undefined;
-    isFreeForm?: boolean | undefined;
-    subText?: string | undefined;
-    trailingIcon?: JSX.Element | undefined;
     leadingIcon?: JSX.Element | undefined;
-    customComponent?: JSX.Element | undefined;
-    searchKey?: string | undefined;
-    selectedLabel?: string | undefined;
-    children?: SingleOption[] | undefined;
-    parent?: SingleOption | undefined;
-    'data-test'?: string | undefined;
-    hasDivider?: boolean | undefined;
-    options: SingleOption[];
 })[];
 export declare function iterateOnOptionsRaw(options: DropdownOption[], cb: (option: SingleOption) => void): void;
 export declare function getSelectedOptionsAsText(selectedOption: DropdownOption[]): string | undefined;
 export declare function getSelectedOptionsAsArray(selectedOption: DropdownOption[]): string[];
+export declare function getNestedParentValues(options: DropdownOption[]): string[];
+/**
+ * Selectable rows in the order they are rendered, so keyboard focus indices line
+ * up with the rows MenuList numbers - otherwise arrow keys highlight one option
+ * while Enter toggles another.
+ */
+export declare function flattenSelectableOptions(options: DropdownOption[], nestedChildren?: {
+    collapsedParents: string[];
+}): SingleOption[];
+/**
+ * The rows a selection count is about. Only the nested layout makes children
+ * selectable - in the flyout layout a submenu click marks the parent, so the
+ * parent stays the row that counts. Disabled rows are kept for the caller to filter.
+ */
+export declare function getSelectionLeaves(options: DropdownOption[], nestedChildren?: boolean): SingleOption[];

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.js

@@ -1,36 +1,82 @@
-function o(t, r, n) {
-  return t.map((e) => {
-    if (e.options) {
-      const i = e.options.map((s) => !n || n(s) ? {
-        ...s,
-        ...r
-      } : { ...s });
-      return {
-        ...e,
-        options: [...i]
-      };
-    }
-    return !n || n(e) ? {
-      ...e,
-      ...r
-    } : { ...e };
-  });
+function a(n, s, e) {
+  return !e || !n.children?.length ? { ...n, ...s } : {
+    ...n,
+    ...s,
+    children: n.children.map(
+      (t) => t.disabled ? { ...t } : a(t, s, e)
+    )
+  };
+}
+function u(n, s, e) {
+  const t = (n.children ?? []).map(
+    (r) => !e || e(r) ? a(r, s, !0) : r.children?.length ? u(r, s, e) : { ...r }
+  ), l = t.filter((r) => !r.disabled);
+  return {
+    ...n,
+    children: t,
+    // `every` on an empty list reports selected, so keep what the parent had.
+    selected: l.length ? l.every((r) => r.selected) : n.selected
+  };
 }
-function f(t, r) {
-  t.forEach((n) => {
-    n.options ? n.options.forEach(r) : r(n);
+function i(n, s, e, t = !1) {
+  const l = (r) => !e || e(r) ? a(r, s, t) : t && r.children?.length ? u(r, s, e) : { ...r };
+  return n.map((r) => r.options ? {
+    ...r,
+    options: r.options.map(l)
+  } : l(r));
+}
+function f(n, s) {
+  const e = (t) => {
+    s(t), t.children?.forEach(e);
+  };
+  n.forEach((t) => {
+    t.options ? t.options.forEach(e) : e(t);
   });
 }
-function a(t) {
-  if (!(!t || !t.length))
-    return t.map((r) => {
-      const n = r;
-      return n.selectedLabel ?? n.label;
+function c(n) {
+  if (!(!n || !n.length))
+    return n.map((s) => {
+      const e = s;
+      return e.selectedLabel ?? e.label;
     }).join(", ");
 }
+function h(n) {
+  return n.filter((s) => s.children?.length).map((s) => s.value);
+}
+function d(n, s) {
+  const e = [];
+  return n.forEach((t) => {
+    if (t.options) {
+      t.options.forEach((r) => {
+        r.disabled || e.push(r);
+      });
+      return;
+    }
+    const l = t;
+    l.disabled || e.push(l), !(!s || s.collapsedParents.includes(l.value)) && l.children?.forEach((r) => {
+      r.disabled || e.push(r);
+    });
+  }), e;
+}
+function o(n, s = !1) {
+  const e = [];
+  return n.forEach((t) => {
+    if (t.options) {
+      e.push(...t.options);
+      return;
+    }
+    const l = t;
+    e.push(
+      ...s && l.children?.length ? l.children : [l]
+    );
+  }), e;
+}
 export {
-  a as getSelectedOptionsAsText,
-  o as iterateOnOptions,
+  d as flattenSelectableOptions,
+  h as getNestedParentValues,
+  c as getSelectedOptionsAsText,
+  o as getSelectionLeaves,
+  i as iterateOnOptions,
   f as iterateOnOptionsRaw
 };
 //# sourceMappingURL=iterationOnOptions.js.map

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"iterationOnOptions.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/utils/iterationOnOptions.ts"],"sourcesContent":["import { DropdownOption, GroupedOption, SingleOption } from '../../type';\n\nexport function iterateOnOptions(\n\toptions: DropdownOption[],\n\tnewVal: Partial<SingleOption>,\n\tcheckCB?: (optionForValidation: SingleOption) => boolean,\n) {\n\tconst newOptions = options.map((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\tconst groupedOptions = (option as GroupedOption).options.map((op) => {\n\t\t\t\tif (!checkCB || checkCB(op)) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...op,\n\t\t\t\t\t\t...newVal,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn { ...op };\n\t\t\t});\n\n\t\t\treturn {\n\t\t\t\t...option,\n\t\t\t\toptions: [...groupedOptions],\n\t\t\t};\n\t\t}\n\n\t\tif (!checkCB || checkCB(option as SingleOption)) {\n\t\t\treturn {\n\t\t\t\t...option,\n\t\t\t\t...newVal,\n\t\t\t};\n\t\t}\n\n\t\treturn { ...option };\n\t});\n\n\treturn newOptions;\n}\n\nexport function iterateOnOptionsRaw(\n\toptions: DropdownOption[],\n\tcb: (option: SingleOption) => void,\n) {\n\toptions.forEach((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\t(option as GroupedOption).options.forEach(cb);\n\t\t} else {\n\t\t\tcb(option as SingleOption);\n\t\t}\n\t});\n}\n\nexport function getSelectedOptionsAsText(selectedOption: DropdownOption[]) {\n\tif (!selectedOption || !selectedOption.length) return undefined;\n\treturn selectedOption\n\t\t.map((option) => {\n\t\t\tconst op = option as SingleOption;\n\t\t\treturn op.selectedLabel ?? op.label;\n\t\t})\n\t\t.join(', ');\n}\n\n// get selected options as array of string\nexport function getSelectedOptionsAsArray(selectedOption: DropdownOption[]) {\n\tif (!selectedOption || !selectedOption.length) return [];\n\treturn selectedOption.map((option) => {\n\t\tconst op = option as SingleOption;\n\t\treturn op.selectedLabel ?? op.label;\n\t});\n}\n"],"names":["iterateOnOptions","options","newVal","checkCB","option","groupedOptions","op","iterateOnOptionsRaw","cb","getSelectedOptionsAsText","selectedOption"],"mappings":"AAEO,SAASA,EACfC,GACAC,GACAC,GACC;AA8BD,SA7BmBF,EAAQ,IAAI,CAACG,MAAW;AAC1C,QAAKA,EAAyB,SAAS;AACtC,YAAMC,IAAkBD,EAAyB,QAAQ,IAAI,CAACE,MACzD,CAACH,KAAWA,EAAQG,CAAE,IAClB;AAAA,QACN,GAAGA;AAAA,QACH,GAAGJ;AAAA,MAAA,IAIE,EAAE,GAAGI,EAAA,CACZ;AAED,aAAO;AAAA,QACN,GAAGF;AAAA,QACH,SAAS,CAAC,GAAGC,CAAc;AAAA,MAAA;AAAA,IAE7B;AAEA,WAAI,CAACF,KAAWA,EAAQC,CAAsB,IACtC;AAAA,MACN,GAAGA;AAAA,MACH,GAAGF;AAAA,IAAA,IAIE,EAAE,GAAGE,EAAA;AAAA,EACb,CAAC;AAGF;AAEO,SAASG,EACfN,GACAO,GACC;AACD,EAAAP,EAAQ,QAAQ,CAACG,MAAW;AAC3B,IAAKA,EAAyB,UAC5BA,EAAyB,QAAQ,QAAQI,CAAE,IAE5CA,EAAGJ,CAAsB;AAAA,EAE3B,CAAC;AACF;AAEO,SAASK,EAAyBC,GAAkC;AAC1E,MAAI,GAACA,KAAkB,CAACA,EAAe;AACvC,WAAOA,EACL,IAAI,CAACN,MAAW;AAChB,YAAME,IAAKF;AACX,aAAOE,EAAG,iBAAiBA,EAAG;AAAA,IAC/B,CAAC,EACA,KAAK,IAAI;AACZ;"}
+{"version":3,"file":"iterationOnOptions.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/utils/iterationOnOptions.ts"],"sourcesContent":["import { DropdownOption, GroupedOption, SingleOption } from '../../type';\n\nfunction applyToSubtree(\n\toption: SingleOption,\n\tnewVal: Partial<SingleOption>,\n\tnestedChildren: boolean,\n): SingleOption {\n\tif (!nestedChildren || !option.children?.length) {\n\t\treturn { ...option, ...newVal };\n\t}\n\n\treturn {\n\t\t...option,\n\t\t...newVal,\n\t\tchildren: option.children.map((child) =>\n\t\t\tchild.disabled\n\t\t\t\t? { ...child }\n\t\t\t\t: applyToSubtree(child, newVal, nestedChildren),\n\t\t),\n\t};\n}\n\n/**\n * A parent is selected only when every selectable child is. Disabled children are\n * excluded because applyToSubtree never selects them - counting them would leave\n * the parent stuck on the indeterminate dash.\n */\nfunction walkChildren(\n\toption: SingleOption,\n\tnewVal: Partial<SingleOption>,\n\tcheckCB?: (optionForValidation: SingleOption) => boolean,\n): SingleOption {\n\tconst children = (option.children ?? []).map((child) =>\n\t\t!checkCB || checkCB(child)\n\t\t\t? applyToSubtree(child, newVal, true)\n\t\t\t: child.children?.length\n\t\t\t? walkChildren(child, newVal, checkCB)\n\t\t\t: { ...child },\n\t);\n\n\tconst selectableChildren = children.filter((child) => !child.disabled);\n\n\treturn {\n\t\t...option,\n\t\tchildren,\n\t\t// `every` on an empty list reports selected, so keep what the parent had.\n\t\tselected: selectableChildren.length\n\t\t\t? selectableChildren.every((child) => child.selected)\n\t\t\t: option.selected,\n\t};\n}\n\nexport function iterateOnOptions(\n\toptions: DropdownOption[],\n\tnewVal: Partial<SingleOption>,\n\tcheckCB?: (optionForValidation: SingleOption) => boolean,\n\tnestedChildren = false,\n) {\n\tconst applyToOption = (option: SingleOption): SingleOption => {\n\t\tif (!checkCB || checkCB(option)) {\n\t\t\treturn applyToSubtree(option, newVal, nestedChildren);\n\t\t}\n\n\t\tif (nestedChildren && option.children?.length) {\n\t\t\treturn walkChildren(option, newVal, checkCB);\n\t\t}\n\n\t\treturn { ...option };\n\t};\n\n\treturn options.map((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\treturn {\n\t\t\t\t...option,\n\t\t\t\toptions: (option as GroupedOption).options.map(applyToOption),\n\t\t\t};\n\t\t}\n\n\t\treturn applyToOption(option as SingleOption);\n\t});\n}\n\nexport function iterateOnOptionsRaw(\n\toptions: DropdownOption[],\n\tcb: (option: SingleOption) => void,\n) {\n\tconst visit = (option: SingleOption) => {\n\t\tcb(option);\n\t\toption.children?.forEach(visit);\n\t};\n\n\toptions.forEach((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\t(option as GroupedOption).options.forEach(visit);\n\t\t} else {\n\t\t\tvisit(option as SingleOption);\n\t\t}\n\t});\n}\n\nexport function getSelectedOptionsAsText(selectedOption: DropdownOption[]) {\n\tif (!selectedOption || !selectedOption.length) return undefined;\n\treturn selectedOption\n\t\t.map((option) => {\n\t\t\tconst op = option as SingleOption;\n\t\t\treturn op.selectedLabel ?? op.label;\n\t\t})\n\t\t.join(', ');\n}\n\n// get selected options as array of string\nexport function getSelectedOptionsAsArray(selectedOption: DropdownOption[]) {\n\tif (!selectedOption || !selectedOption.length) return [];\n\treturn selectedOption.map((option) => {\n\t\tconst op = option as SingleOption;\n\t\treturn op.selectedLabel ?? op.label;\n\t});\n}\n\nexport function getNestedParentValues(options: DropdownOption[]): string[] {\n\treturn options\n\t\t.filter((option) => (option as SingleOption).children?.length)\n\t\t.map((option) => (option as SingleOption).value);\n}\n\n/**\n * Selectable rows in the order they are rendered, so keyboard focus indices line\n * up with the rows MenuList numbers - otherwise arrow keys highlight one option\n * while Enter toggles another.\n */\nexport function flattenSelectableOptions(\n\toptions: DropdownOption[],\n\tnestedChildren?: { collapsedParents: string[] },\n): SingleOption[] {\n\tconst flattened: SingleOption[] = [];\n\n\toptions.forEach((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\t(option as GroupedOption).options.forEach((groupedOption) => {\n\t\t\t\tif (!groupedOption.disabled) {\n\t\t\t\t\tflattened.push(groupedOption);\n\t\t\t\t}\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst singleOption = option as SingleOption;\n\t\tif (!singleOption.disabled) {\n\t\t\tflattened.push(singleOption);\n\t\t}\n\n\t\tif (\n\t\t\t!nestedChildren ||\n\t\t\tnestedChildren.collapsedParents.includes(singleOption.value)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tsingleOption.children?.forEach((child) => {\n\t\t\tif (!child.disabled) {\n\t\t\t\tflattened.push(child);\n\t\t\t}\n\t\t});\n\t});\n\n\treturn flattened;\n}\n\n/**\n * The rows a selection count is about. Only the nested layout makes children\n * selectable - in the flyout layout a submenu click marks the parent, so the\n * parent stays the row that counts. Disabled rows are kept for the caller to filter.\n */\nexport function getSelectionLeaves(\n\toptions: DropdownOption[],\n\tnestedChildren = false,\n): SingleOption[] {\n\tconst leaves: SingleOption[] = [];\n\n\toptions.forEach((option) => {\n\t\tif ((option as GroupedOption).options) {\n\t\t\tleaves.push(...(option as GroupedOption).options);\n\t\t\treturn;\n\t\t}\n\n\t\tconst singleOption = option as SingleOption;\n\t\tleaves.push(\n\t\t\t...(nestedChildren && singleOption.children?.length\n\t\t\t\t? singleOption.children\n\t\t\t\t: [singleOption]),\n\t\t);\n\t});\n\n\treturn leaves;\n}\n"],"names":["applyToSubtree","option","newVal","nestedChildren","child","walkChildren","checkCB","children","selectableChildren","iterateOnOptions","options","applyToOption","iterateOnOptionsRaw","cb","visit","getSelectedOptionsAsText","selectedOption","op","getNestedParentValues","flattenSelectableOptions","flattened","groupedOption","singleOption","getSelectionLeaves","leaves"],"mappings":"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"}

package/dist/esm/components/dropdown/hooks/useDropdown.d.ts

@@ -1,6 +1,6 @@
 import { SelectAllCheckboxState } from '../OpenedDropdown/components/menu/SelectAllMenu';
 import { DropdownOption, SingleOption } from '../type';
-export declare const useDropdown: (version: string | undefined, options: DropdownOption[], onSelect: ((option: DropdownOption | DropdownOption[]) => void) | undefined, skipSorting?: boolean, isMultiSelect?: boolean, onSearch?: ((searchKey: string) => Promise<DropdownOption[]>) | undefined, disableOtherSearchedOption?: boolean, disableSearchedOptionExcept?: string[], maxSelections?: number) => {
+export declare const useDropdown: (version: string | undefined, options: DropdownOption[], onSelect: ((option: DropdownOption | DropdownOption[]) => void) | undefined, skipSorting?: boolean, isMultiSelect?: boolean, onSearch?: ((searchKey: string) => Promise<DropdownOption[]>) | undefined, disableOtherSearchedOption?: boolean, disableSearchedOptionExcept?: string[], maxSelections?: number, childrenLayout?: 'flyout' | 'nested') => {
     latestDropdownOptionsRef: import('react').MutableRefObject<DropdownOption[]>;
     dropdownOptions: DropdownOption[];
     search: (searchKey: string) => void;
@@ -8,7 +8,8 @@ export declare const useDropdown: (version: string | undefined, options: Dropdow
     searchedOptions: DropdownOption[];
     searchError: string | undefined;
     retrySearch: () => void;
-    onApplyHandler: (optionSelect: SingleOption, returnOnly?: boolean) => ({
+    onApplyHandler: (optionSelect: SingleOption, returnOnly?: boolean) => (SingleOption | {
+        options: SingleOption[];
         label: string;
         value: string;
         description?: string | null | undefined;
@@ -26,23 +27,9 @@ export declare const useDropdown: (version: string | undefined, options: Dropdow
         'data-test'?: string | undefined;
         hasDivider?: boolean | undefined;
     } | {
+        options: SingleOption[];
         label?: string | undefined;
-        value?: string | undefined;
-        description?: string | null | undefined;
-        selected?: boolean | undefined;
-        disabled?: boolean | undefined;
-        isFreeForm?: boolean | undefined;
-        subText?: string | undefined;
-        trailingIcon?: JSX.Element | undefined;
         leadingIcon?: JSX.Element | undefined;
-        customComponent?: JSX.Element | undefined;
-        searchKey?: string | undefined;
-        selectedLabel?: string | undefined;
-        children?: SingleOption[] | undefined;
-        parent?: SingleOption | undefined;
-        'data-test'?: string | undefined;
-        hasDivider?: boolean | undefined;
-        options: SingleOption[];
     })[] | undefined;
     selectAllHandler: (newState: SelectAllCheckboxState) => void;
     onMultiSelectClear: () => void;