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

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

@@ -1,26 +1,28 @@
-import { jsx as r, Fragment as c, jsxs as s } from "react/jsx-runtime";
-import U from "../../../../../assets/icons/chevronRight.svg.js";
-import { forwardRef as z, useState as W } from "react";
-import t from "styled-components";
-import { BodyCaption as _ } from "../../../../TypographyStyle.js";
-import { COLORS as m, DEFAULT_THEME as F } from "../../../../../constants/Theme.js";
-import { FreeFormContainer as q } from "./FreeFormMenu.styled.js";
-import { Tooltip as G } from "../../../../tooltips/Tooltip.js";
-import { CheckBox as k } from "../../../../checkBox/CheckBox.js";
-import { ListItem as J } from "../../../../list-item/ListItem.js";
-const $ = t(J)`
+import { jsx as r, Fragment as m, jsxs as p } from "react/jsx-runtime";
+import J from "../../../../../assets/icons/chevronDownOutline.svg.js";
+import K from "../../../../../assets/icons/chevronRight.svg.js";
+import P from "../../../../../assets/icons/chevronUpOutline.svg.js";
+import { forwardRef as Q, useState as X } from "react";
+import n from "styled-components";
+import { BodyCaption as Y } from "../../../../TypographyStyle.js";
+import { COLORS as d, DEFAULT_THEME as D } from "../../../../../constants/Theme.js";
+import { FreeFormContainer as Z } from "./FreeFormMenu.styled.js";
+import { Tooltip as ee } from "../../../../tooltips/Tooltip.js";
+import { CheckBox as O } from "../../../../checkBox/CheckBox.js";
+import { ListItem as re } from "../../../../list-item/ListItem.js";
+const F = n(re)`
 	padding: ${(e) => e.version === "3.0" ? "8px" : e.version === "2.0" ? "8px 12px" : "14px 16px"} !important;
 	cursor: pointer;
 	margin-top: ${(e) => e.brandSelectedRow ? "0" : e.version === "2.0" ? "2px" : "0"};
-`, K = t.div`
+`, te = n.div`
 	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
 	border-radius: ${({ version: e }) => e === "1.0" ? "0" : "8px"};
 	padding: ${({ version: e }) => e === "1.0" ? "0" : "4px"};
 	min-width: 148px;
-	border: ${({ version: e }) => e === "1.0" ? `1px solid ${F.colorsV2.stroke.primary}` : "none"};
+	border: ${({ version: e }) => e === "1.0" ? `1px solid ${D.colorsV2.stroke.primary}` : "none"};
 	max-height: 248px;
 	overflow-y: auto;
-`, N = t.div`
+`, ne = n.div`
 	display: grid;
 	grid-template-columns: repeat(2, 2.86px);
 	grid-template-rows: repeat(3, 2.86px);
@@ -32,191 +34,223 @@ const $ = t(J)`
 	align-self: center;
 	height: fit-content;
 	min-height: 18px;
-`, l = t.div`
+`, o = n.div`
 	width: 2.86px;
 	height: 2.86px;
 	border-radius: 50%;
-	background-color: ${m.content.inactive};
+	background-color: ${d.content.inactive};
 	flex-shrink: 0;
-`, w = t.div`
+`, S = n.div`
 	display: flex;
 	align-content: center;
 	justify-content: center;
 	gap: 8px;
-`, P = t.div`
+`, le = n.span`
+	align-self: flex-start;
+	flex-shrink: 0;
+	width: 11px;
+	height: 9px;
+	margin-left: 4px;
+	border-left: 1px solid ${d.content.placeholder};
+	border-bottom: 1px solid ${d.content.placeholder};
+	border-bottom-left-radius: 4px;
+`, oe = n.span`
+	display: flex;
+	align-items: center;
+	cursor: pointer;
+`, de = n.div`
 	margin-right: -4px;
-`, Q = t.div`
+`, ie = n.div`
 	display: flex;
 	align-items: center;
 	flex-direction: column;
 	flex: 1;
-`, g = ({ onDragStart: e, onDragEnd: i }) => /* @__PURE__ */ s(
-  N,
+`, x = ({ onDragStart: e, onDragEnd: i }) => /* @__PURE__ */ p(
+  ne,
   {
     draggable: !0,
     onDragStart: e,
     onDragEnd: i,
     children: [
-      /* @__PURE__ */ r(l, {}),
-      /* @__PURE__ */ r(l, {}),
-      /* @__PURE__ */ r(l, {}),
-      /* @__PURE__ */ r(l, {}),
-      /* @__PURE__ */ r(l, {}),
-      /* @__PURE__ */ r(l, {})
+      /* @__PURE__ */ r(o, {}),
+      /* @__PURE__ */ r(o, {}),
+      /* @__PURE__ */ r(o, {}),
+      /* @__PURE__ */ r(o, {}),
+      /* @__PURE__ */ r(o, {}),
+      /* @__PURE__ */ r(o, {})
     ]
   }
-), oe = z(
+), Ce = Q(
   ({
     option: e,
     isMultiSelect: i,
-    showDescription: x,
+    showDescription: v,
     onSelect: H,
-    last: O,
-    version: d,
-    onDropdownItemClick: M,
-    useDefaultCursor: S,
-    isFocused: A = !1,
-    dataIndex: h = -1,
-    isDraggable: o = !1,
-    onDragStart: u,
-    onDragOver: D,
-    onDrop: B,
-    onDragEnd: p,
-    isDraggedOver: v = !1,
-    showCheckboxForCustomElement: C = !1,
-    checkboxActiveColor: b,
-    brandSelectedRow: I
-  }, V) => {
-    const [j, y] = W(
+    last: M,
+    version: l,
+    onDropdownItemClick: A,
+    useDefaultCursor: B,
+    isFocused: E = !1,
+    dataIndex: b = -1,
+    isDraggable: a = !1,
+    onDragStart: f,
+    onDragOver: U,
+    onDrop: V,
+    onDragEnd: h,
+    isDraggedOver: C = !1,
+    showCheckboxForCustomElement: I = !1,
+    checkboxActiveColor: y,
+    brandSelectedRow: $,
+    childrenLayout: j = "flyout",
+    isChildRow: R = !1,
+    isPartiallyChecked: w = !1,
+    isCollapsible: z = !1,
+    isCollapsed: u = !1,
+    onToggleCollapse: N
+  }, W) => {
+    const [_, L] = X(
       e.selected
-    ), L = (n, a) => {
-      if (!n.children) {
-        f(!n.selected);
-        const R = a ? { ...n, parent: a } : n;
-        M?.(R);
+    ), s = j === "nested", T = (t, c) => {
+      if (!t.children || s) {
+        g(!t.selected);
+        const G = c ? { ...t, parent: c } : t;
+        A?.(G);
       }
-    }, f = (n) => {
-      e.disabled || H({ ...e, selected: n });
-    }, E = () => {
-      e.description ? x(e.label, e.description) : x();
-    }, T = S ? { cursor: "default" } : {};
-    return /* @__PURE__ */ r(c, { children: /* @__PURE__ */ r(
-      G,
+    }, g = (t) => {
+      e.disabled || H({ ...e, selected: t });
+    }, q = () => {
+      e.description ? v(e.label, e.description) : v();
+    }, k = B ? { cursor: "default" } : {};
+    return /* @__PURE__ */ r(m, { children: /* @__PURE__ */ r(
+      ee,
       {
         body: "",
-        tooltipContent: e.children ? /* @__PURE__ */ r(
+        tooltipContent: e.children && !s ? /* @__PURE__ */ r(
           "div",
           {
             style: {
-              backgroundColor: F.colorsV2.surface.standard
+              backgroundColor: D.colorsV2.surface.standard
             },
-            ref: V,
-            onMouseEnter: () => y(!0),
-            onMouseLeave: () => y(!1),
-            children: /* @__PURE__ */ r(K, { version: d ?? "2.0", children: e.children.map((n) => /* @__PURE__ */ r(
-              $,
+            ref: W,
+            onMouseEnter: () => L(!0),
+            onMouseLeave: () => L(!1),
+            children: /* @__PURE__ */ r(te, { version: l ?? "2.0", children: e.children.map((t) => /* @__PURE__ */ r(
+              F,
               {
-                version: d,
-                brandSelectedRow: I,
-                style: d !== "1.0" && (e?.children ?? []).length - 1 ? { borderBottom: 0 } : {},
-                onClick: (a) => {
-                  a.preventDefault(), L(n, e);
+                version: l,
+                brandSelectedRow: $,
+                style: l !== "1.0" && (e?.children ?? []).length - 1 ? { borderBottom: 0 } : {},
+                onClick: (c) => {
+                  c.preventDefault(), T(t, e);
                 },
-                listItem: { value: n.value, label: n.label },
-                subText: n.subText,
-                leadingIcon: n.leadingIcon || void 0,
-                customComponent: n.customComponent,
-                trailingIcon: n.trailingIcon || void 0,
-                variant: e.disabled ? "inactive" : n.selected ? "selected" : "default"
+                listItem: { value: t.value, label: t.label },
+                subText: t.subText,
+                leadingIcon: t.leadingIcon || void 0,
+                customComponent: t.customComponent,
+                trailingIcon: t.trailingIcon || void 0,
+                variant: e.disabled ? "inactive" : t.selected ? "selected" : "default"
               },
-              n.value
+              t.value
             )) })
           }
-        ) : /* @__PURE__ */ r(c, {}),
+        ) : /* @__PURE__ */ r(m, {}),
         placement: "right-start",
         hideArrow: !0,
         children: /* @__PURE__ */ r(
-          $,
+          F,
           {
-            version: d,
-            brandSelectedRow: I,
-            style: O ? {
+            version: l,
+            brandSelectedRow: $,
+            style: M ? {
               borderBottom: 0,
-              ...T,
-              ...v ? {
-                borderTop: `2px solid ${m.content.brand}`,
+              ...k,
+              ...C ? {
+                borderTop: `2px solid ${d.content.brand}`,
                 opacity: 0.5
               } : {}
             } : {
-              ...T,
-              ...v ? {
-                borderTop: `2px solid ${m.content.brand}`,
+              ...k,
+              ...C ? {
+                borderTop: `2px solid ${d.content.brand}`,
                 opacity: 0.5
               } : {}
             },
-            onClick: (n) => {
-              n.preventDefault(), L(e);
+            onClick: (t) => {
+              t.preventDefault(), T(e);
             },
-            onMouseOver: E,
+            onMouseOver: q,
             listItem: { value: e.value, label: e.label },
             subText: e.subText,
-            "data-option-index": h,
+            "data-option-index": b,
             role: "option",
-            id: `dropdown-option-${h}`,
+            id: `dropdown-option-${b}`,
             "aria-selected": !!e.selected,
-            onDragOver: o ? D : void 0,
-            onDrop: o ? B : void 0,
-            leadingIcon: i && !(C && e.customComponent) ? /* @__PURE__ */ s(w, { children: [
-              o && /* @__PURE__ */ r(
-                g,
+            onDragOver: a ? U : void 0,
+            onDrop: a ? V : void 0,
+            leadingIcon: i && !(I && e.customComponent) ? /* @__PURE__ */ p(S, { children: [
+              R && /* @__PURE__ */ r(le, {}),
+              a && /* @__PURE__ */ r(
+                x,
                 {
-                  onDragStart: u,
-                  onDragEnd: p
+                  onDragStart: f,
+                  onDragEnd: h
                 }
               ),
               /* @__PURE__ */ r(
-                k,
+                O,
                 {
-                  size: d === "2.0" ? "SMALL" : "DEFAULT",
+                  size: l === "2.0" ? "SMALL" : "DEFAULT",
                   isDisabled: e.disabled ?? !1,
-                  isChecked: !!e.selected,
-                  onValueChange: f,
-                  activeColor: b
+                  isChecked: !!e.selected || w,
+                  isPartiallyChecked: w,
+                  onValueChange: g,
+                  activeColor: y
                 }
               ),
-              /* @__PURE__ */ r(P, { children: e.leadingIcon })
-            ] }) : o ? /* @__PURE__ */ s(Q, { children: [
+              /* @__PURE__ */ r(de, { children: e.leadingIcon })
+            ] }) : a ? /* @__PURE__ */ p(ie, { children: [
               /* @__PURE__ */ r(
-                g,
+                x,
                 {
-                  onDragStart: u,
-                  onDragEnd: p
+                  onDragStart: f,
+                  onDragEnd: h
                 }
               ),
               e.leadingIcon && /* @__PURE__ */ r("div", { children: e.leadingIcon })
-            ] }) : e.leadingIcon ? /* @__PURE__ */ r(c, { children: e.leadingIcon }) : void 0,
-            customComponent: i && C && e.customComponent ? /* @__PURE__ */ s(w, { children: [
-              o && /* @__PURE__ */ r(
-                g,
+            ] }) : e.leadingIcon ? /* @__PURE__ */ r(m, { children: e.leadingIcon }) : void 0,
+            customComponent: i && I && e.customComponent ? /* @__PURE__ */ p(S, { children: [
+              a && /* @__PURE__ */ r(
+                x,
                 {
-                  onDragStart: u,
-                  onDragEnd: p
+                  onDragStart: f,
+                  onDragEnd: h
                 }
               ),
               /* @__PURE__ */ r(
-                k,
+                O,
                 {
-                  size: d === "2.0" ? "SMALL" : "DEFAULT",
+                  size: l === "2.0" ? "SMALL" : "DEFAULT",
                   isDisabled: e.disabled ?? !1,
                   isChecked: !!e.selected,
-                  onValueChange: f,
-                  activeColor: b
+                  onValueChange: g,
+                  activeColor: y
                 }
               ),
               e.customComponent
             ] }) : e.customComponent,
-            trailingIcon: e.isFreeForm ? /* @__PURE__ */ r(q, { children: /* @__PURE__ */ r(_, { style: { color: m.content.secondary }, children: "Freeform" }) }) : e.children ? /* @__PURE__ */ r(U, { width: 12, height: 12 }) : e.trailingIcon ? /* @__PURE__ */ r(c, { children: e.trailingIcon }) : void 0,
-            variant: e.disabled ? "inactive" : e.selected || !i && j ? "selected" : A ? "focused" : "default"
+            trailingIcon: e.isFreeForm ? /* @__PURE__ */ r(Z, { children: /* @__PURE__ */ r(Y, { style: { color: d.content.secondary }, children: "Freeform" }) }) : e.children && s && z ? /* @__PURE__ */ r(
+              oe,
+              {
+                role: "button",
+                "aria-expanded": !u,
+                "aria-label": `${u ? "Expand" : "Collapse"} ${e.label}`,
+                onClick: (t) => {
+                  t.preventDefault(), t.stopPropagation(), N?.();
+                },
+                children: u ? /* @__PURE__ */ r(J, { width: 16, height: 16 }) : /* @__PURE__ */ r(P, { width: 16, height: 16 })
+              }
+            ) : e.children && !s ? /* @__PURE__ */ r(K, { width: 12, height: 12 }) : e.trailingIcon ? /* @__PURE__ */ r(m, { children: e.trailingIcon }) : void 0,
+            variant: e.disabled ? "inactive" : e.selected || !i && _ ? "selected" : E ? "focused" : "default"
           }
         )
       }
@@ -224,6 +258,6 @@ const $ = t(J)`
   }
 );
 export {
-  oe as MenuItem
+  Ce as MenuItem
 };
 //# sourceMappingURL=MenuItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/MenuItem.tsx"],"sourcesContent":["import ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport { forwardRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { CheckBox } from '@src/components/checkBox';\nimport { ListItem } from '@src/components/list-item';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption } from '@src/components/TypographyStyle';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { MultiSelectOption, SingleOption } from '../../../type';\nimport { FreeFormContainer } from './FreeFormMenu.styled';\n\nconst StyledListItem = styled(ListItem)<{\n\tversion?: '1.0' | '2.0' | '3.0';\n\tbrandSelectedRow?: boolean;\n}>`\n\tpadding: ${(props) =>\n\t\tprops.version === '3.0'\n\t\t\t? '8px'\n\t\t\t: props.version === '2.0'\n\t\t\t? '8px 12px'\n\t\t\t: '14px 16px'} !important;\n\tcursor: pointer;\n\tmargin-top: ${(props) =>\n\t\tprops.brandSelectedRow ? '0' : props.version === '2.0' ? '2px' : '0'};\n`;\n\nconst StyledChildDropdownContainer = styled.div<{ version: string }>`\n\tbox-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);\n\tborder-radius: ${({ version }) => (version === '1.0' ? '0' : '8px')};\n\tpadding: ${({ version }) => (version === '1.0' ? '0' : '4px')};\n\tmin-width: 148px;\n\tborder: ${({ version }) =>\n\t\tversion === '1.0'\n\t\t\t? `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`\n\t\t\t: 'none'};\n\tmax-height: 248px;\n\toverflow-y: auto;\n`;\n\nconst DragHandleContainer = styled.div`\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, 2.86px);\n\tgrid-template-rows: repeat(3, 2.86px);\n\tcolumn-gap: 3.8px;\n\trow-gap: 4px;\n\tmargin-right: 8px;\n\tcursor: move;\n\tflex-shrink: 0;\n\talign-self: center;\n\theight: fit-content;\n\tmin-height: 18px;\n`;\n\nconst DragDot = styled.div`\n\twidth: 2.86px;\n\theight: 2.86px;\n\tborder-radius: 50%;\n\tbackground-color: ${COLORS.content.inactive};\n\tflex-shrink: 0;\n`;\n\nconst MultiSelectLeadingContainer = styled.div`\n\tdisplay: flex;\n\talign-content: center;\n\tjustify-content: center;\n\tgap: 8px;\n`;\n\nconst LeadingIconWrapper = styled.div`\n\tmargin-right: -4px;\n`;\n\nconst SingleSelectDragContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tflex: 1;\n`;\n\ninterface DragHandleIconProps {\n\tonDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;\n}\n\nconst DragHandleIcon = ({ onDragStart, onDragEnd }: DragHandleIconProps) => (\n\t<DragHandleContainer\n\t\tdraggable\n\t\tonDragStart={onDragStart}\n\t\tonDragEnd={onDragEnd}\n\t>\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t</DragHandleContainer>\n);\n\ninterface MenuItemProps {\n\toption: SingleOption | MultiSelectOption;\n\tisMultiSelect?: boolean;\n\tshowDescription: (title?: string, description?: string) => void;\n\tonSelect: (option: SingleOption) => void;\n\tonDropdownItemClick?: (option: SingleOption) => void;\n\tlast?: boolean;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tuseDefaultCursor?: boolean;\n\tisFocused?: boolean;\n\tdataIndex?: number;\n\tisDraggable?: boolean;\n\tonDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragOver?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDrop?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tisDraggedOver?: boolean;\n\tshowCheckboxForCustomElement?: boolean;\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n}\n// eslint-disable-next-line react/display-name\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n\t(\n\t\t{\n\t\t\toption,\n\t\t\tisMultiSelect,\n\t\t\tshowDescription,\n\t\t\tonSelect,\n\t\t\tlast,\n\t\t\tversion,\n\t\t\tonDropdownItemClick,\n\t\t\tuseDefaultCursor,\n\t\t\tisFocused = false,\n\t\t\tdataIndex = -1,\n\t\t\tisDraggable = false,\n\t\t\tonDragStart,\n\t\t\tonDragOver,\n\t\t\tonDrop,\n\t\t\tonDragEnd,\n\t\t\tisDraggedOver = false,\n\t\t\tshowCheckboxForCustomElement = false,\n\t\t\tcheckboxActiveColor,\n\t\t\tbrandSelectedRow,\n\t\t},\n\t\tchildRef,\n\t) => {\n\t\tconst [isChildOptionHovered, setIsChildOptionHovered] = useState(\n\t\t\toption.selected,\n\t\t);\n\n\t\tconst handleOptionClick = (option: SingleOption, parent?: SingleOption) => {\n\t\t\tif (!option.children) {\n\t\t\t\tonCheckHandler(!option.selected);\n\t\t\t\tconst updatedOption = parent ? { ...option, parent } : option;\n\t\t\t\tonDropdownItemClick?.(updatedOption);\n\t\t\t}\n\t\t};\n\n\t\tconst onCheckHandler = (checked: boolean) => {\n\t\t\tif (!option.disabled) {\n\t\t\t\tonSelect({ ...option, selected: checked });\n\t\t\t}\n\t\t};\n\n\t\tconst onHoverIn = () => {\n\t\t\tif (option.description) {\n\t\t\t\tshowDescription(option.label, option.description);\n\t\t\t} else {\n\t\t\t\tshowDescription();\n\t\t\t}\n\t\t};\n\n\t\tconst cursorConfig = useDefaultCursor ? { cursor: 'default' } : {};\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Tooltip\n\t\t\t\t\tbody={''}\n\t\t\t\t\ttooltipContent={\n\t\t\t\t\t\toption.children ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.surface.standard,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tref={childRef}\n\t\t\t\t\t\t\t\tonMouseEnter={() => setIsChildOptionHovered(true)}\n\t\t\t\t\t\t\t\tonMouseLeave={() => setIsChildOptionHovered(false)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<StyledChildDropdownContainer version={version ?? '2.0'}>\n\t\t\t\t\t\t\t\t\t{option.children.map((child) => (\n\t\t\t\t\t\t\t\t\t\t<StyledListItem\n\t\t\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t\t\t\tkey={child.value}\n\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\tversion !== '1.0' && (option?.children ?? []).length - 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t? { borderBottom: 0 }\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}\n\t\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\thandleOptionClick(child, option);\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\tlistItem={{ value: child.value, label: child.label }}\n\t\t\t\t\t\t\t\t\t\t\tsubText={child.subText}\n\t\t\t\t\t\t\t\t\t\t\tleadingIcon={child.leadingIcon || undefined}\n\t\t\t\t\t\t\t\t\t\t\tcustomComponent={child.customComponent}\n\t\t\t\t\t\t\t\t\t\t\ttrailingIcon={child.trailingIcon || undefined}\n\t\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\t\toption.disabled\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'inactive'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: child.selected\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 'default'\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</StyledChildDropdownContainer>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\tplacement={'right-start'}\n\t\t\t\t\thideArrow={true}\n\t\t\t\t>\n\t\t\t\t\t<StyledListItem\n\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tlast\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tborderBottom: 0,\n\t\t\t\t\t\t\t\t\t\t...cursorConfig,\n\t\t\t\t\t\t\t\t\t\t...(isDraggedOver\n\t\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderTop: `2px solid ${COLORS.content.brand}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0.5,\n\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  }\n\t\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\t\t...cursorConfig,\n\t\t\t\t\t\t\t\t\t\t...(isDraggedOver\n\t\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderTop: `2px solid ${COLORS.content.brand}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0.5,\n\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  }\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\thandleOptionClick(option);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonMouseOver={onHoverIn}\n\t\t\t\t\t\tlistItem={{ value: option.value, label: option.label }}\n\t\t\t\t\t\tsubText={option.subText}\n\t\t\t\t\t\tdata-option-index={dataIndex}\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\tid={`dropdown-option-${dataIndex}`}\n\t\t\t\t\t\taria-selected={!!option.selected}\n\t\t\t\t\t\tonDragOver={isDraggable ? onDragOver : undefined}\n\t\t\t\t\t\tonDrop={isDraggable ? onDrop : undefined}\n\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\tisMultiSelect &&\n\t\t\t\t\t\t\t!(showCheckboxForCustomElement && option.customComponent) ? (\n\t\t\t\t\t\t\t\t<MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t\t\t{isDraggable && (\n\t\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\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\t<CheckBox\n\t\t\t\t\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\t\t\t\t\tisDisabled={option.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\tisChecked={!!option.selected}\n\t\t\t\t\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<LeadingIconWrapper>{option.leadingIcon}</LeadingIconWrapper>\n\t\t\t\t\t\t\t\t</MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t) : isDraggable ? (\n\t\t\t\t\t\t\t\t<SingleSelectDragContainer>\n\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{option.leadingIcon && <div>{option.leadingIcon}</div>}\n\t\t\t\t\t\t\t\t</SingleSelectDragContainer>\n\t\t\t\t\t\t\t) : option.leadingIcon ? (\n\t\t\t\t\t\t\t\t<>{option.leadingIcon}</>\n\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcustomComponent={\n\t\t\t\t\t\t\tisMultiSelect &&\n\t\t\t\t\t\t\tshowCheckboxForCustomElement &&\n\t\t\t\t\t\t\toption.customComponent ? (\n\t\t\t\t\t\t\t\t<MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t\t\t{isDraggable && (\n\t\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\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\t<CheckBox\n\t\t\t\t\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\t\t\t\t\tisDisabled={option.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\tisChecked={!!option.selected}\n\t\t\t\t\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{option.customComponent}\n\t\t\t\t\t\t\t\t</MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\toption.customComponent\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttrailingIcon={\n\t\t\t\t\t\t\toption.isFreeForm ? (\n\t\t\t\t\t\t\t\t<FreeFormContainer>\n\t\t\t\t\t\t\t\t\t<BodyCaption style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\t\t\t\t\t\tFreeform\n\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t</FreeFormContainer>\n\t\t\t\t\t\t\t) : option.children ? (\n\t\t\t\t\t\t\t\t<ChevronRightIcon width={12} height={12} />\n\t\t\t\t\t\t\t) : option.trailingIcon ? (\n\t\t\t\t\t\t\t\t<>{option.trailingIcon}</>\n\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\toption.disabled\n\t\t\t\t\t\t\t\t? 'inactive'\n\t\t\t\t\t\t\t\t: option.selected || (!isMultiSelect && isChildOptionHovered)\n\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t: isFocused\n\t\t\t\t\t\t\t\t? 'focused'\n\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</Tooltip>\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["StyledListItem","styled","ListItem","props","StyledChildDropdownContainer","version","DEFAULT_THEME","DragHandleContainer","DragDot","COLORS","MultiSelectLeadingContainer","LeadingIconWrapper","SingleSelectDragContainer","DragHandleIcon","onDragStart","onDragEnd","jsxs","jsx","MenuItem","forwardRef","option","isMultiSelect","showDescription","onSelect","last","onDropdownItemClick","useDefaultCursor","isFocused","dataIndex","isDraggable","onDragOver","onDrop","isDraggedOver","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","childRef","isChildOptionHovered","setIsChildOptionHovered","useState","handleOptionClick","parent","onCheckHandler","updatedOption","checked","onHoverIn","cursorConfig","Fragment","Tooltip","child","e","CheckBox","FreeFormContainer","BodyCaption","ChevronRightIcon"],"mappings":"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"}
+{"version":3,"file":"MenuItem.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/menu/MenuItem.tsx"],"sourcesContent":["import ChevronDownIcon from '@src/assets/icons/chevronDownOutline.svg';\nimport ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport ChevronUpIcon from '@src/assets/icons/chevronUpOutline.svg';\nimport { forwardRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { CheckBox } from '@src/components/checkBox';\nimport { ListItem } from '@src/components/list-item';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption } from '@src/components/TypographyStyle';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { MultiSelectOption, SingleOption } from '../../../type';\nimport { FreeFormContainer } from './FreeFormMenu.styled';\n\nconst StyledListItem = styled(ListItem)<{\n\tversion?: '1.0' | '2.0' | '3.0';\n\tbrandSelectedRow?: boolean;\n}>`\n\tpadding: ${(props) =>\n\t\tprops.version === '3.0'\n\t\t\t? '8px'\n\t\t\t: props.version === '2.0'\n\t\t\t? '8px 12px'\n\t\t\t: '14px 16px'} !important;\n\tcursor: pointer;\n\tmargin-top: ${(props) =>\n\t\tprops.brandSelectedRow ? '0' : props.version === '2.0' ? '2px' : '0'};\n`;\n\nconst StyledChildDropdownContainer = styled.div<{ version: string }>`\n\tbox-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);\n\tborder-radius: ${({ version }) => (version === '1.0' ? '0' : '8px')};\n\tpadding: ${({ version }) => (version === '1.0' ? '0' : '4px')};\n\tmin-width: 148px;\n\tborder: ${({ version }) =>\n\t\tversion === '1.0'\n\t\t\t? `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`\n\t\t\t: 'none'};\n\tmax-height: 248px;\n\toverflow-y: auto;\n`;\n\nconst DragHandleContainer = styled.div`\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, 2.86px);\n\tgrid-template-rows: repeat(3, 2.86px);\n\tcolumn-gap: 3.8px;\n\trow-gap: 4px;\n\tmargin-right: 8px;\n\tcursor: move;\n\tflex-shrink: 0;\n\talign-self: center;\n\theight: fit-content;\n\tmin-height: 18px;\n`;\n\nconst DragDot = styled.div`\n\twidth: 2.86px;\n\theight: 2.86px;\n\tborder-radius: 50%;\n\tbackground-color: ${COLORS.content.inactive};\n\tflex-shrink: 0;\n`;\n\nconst MultiSelectLeadingContainer = styled.div`\n\tdisplay: flex;\n\talign-content: center;\n\tjustify-content: center;\n\tgap: 8px;\n`;\n\n/** Elbow joining a nested child row back to its parent. */\nconst Connector = styled.span`\n\talign-self: flex-start;\n\tflex-shrink: 0;\n\twidth: 11px;\n\theight: 9px;\n\tmargin-left: 4px;\n\tborder-left: 1px solid ${COLORS.content.placeholder};\n\tborder-bottom: 1px solid ${COLORS.content.placeholder};\n\tborder-bottom-left-radius: 4px;\n`;\n\n/** Hit area for the collapse chevron, so clicking it never toggles selection. */\nconst CollapseToggle = styled.span`\n\tdisplay: flex;\n\talign-items: center;\n\tcursor: pointer;\n`;\n\nconst LeadingIconWrapper = styled.div`\n\tmargin-right: -4px;\n`;\n\nconst SingleSelectDragContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tflex: 1;\n`;\n\ninterface DragHandleIconProps {\n\tonDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;\n}\n\nconst DragHandleIcon = ({ onDragStart, onDragEnd }: DragHandleIconProps) => (\n\t<DragHandleContainer\n\t\tdraggable\n\t\tonDragStart={onDragStart}\n\t\tonDragEnd={onDragEnd}\n\t>\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t\t<DragDot />\n\t</DragHandleContainer>\n);\n\ninterface MenuItemProps {\n\toption: SingleOption | MultiSelectOption;\n\tisMultiSelect?: boolean;\n\tshowDescription: (title?: string, description?: string) => void;\n\tonSelect: (option: SingleOption) => void;\n\tonDropdownItemClick?: (option: SingleOption) => void;\n\tlast?: boolean;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tuseDefaultCursor?: boolean;\n\tisFocused?: boolean;\n\tdataIndex?: number;\n\tisDraggable?: boolean;\n\tonDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragOver?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDrop?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tonDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;\n\tisDraggedOver?: boolean;\n\tshowCheckboxForCustomElement?: boolean;\n\tcheckboxActiveColor?: string;\n\tbrandSelectedRow?: boolean;\n\tchildrenLayout?: 'flyout' | 'nested';\n\t/** Indents the row under its parent and draws the elbow connector. */\n\tisChildRow?: boolean;\n\t/** Tri-state for a nested parent whose children are only partly selected. */\n\tisPartiallyChecked?: boolean;\n\t/** Shows the collapse chevron on a nested parent row. */\n\tisCollapsible?: boolean;\n\tisCollapsed?: boolean;\n\tonToggleCollapse?: () => void;\n}\n// eslint-disable-next-line react/display-name\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n\t(\n\t\t{\n\t\t\toption,\n\t\t\tisMultiSelect,\n\t\t\tshowDescription,\n\t\t\tonSelect,\n\t\t\tlast,\n\t\t\tversion,\n\t\t\tonDropdownItemClick,\n\t\t\tuseDefaultCursor,\n\t\t\tisFocused = false,\n\t\t\tdataIndex = -1,\n\t\t\tisDraggable = false,\n\t\t\tonDragStart,\n\t\t\tonDragOver,\n\t\t\tonDrop,\n\t\t\tonDragEnd,\n\t\t\tisDraggedOver = false,\n\t\t\tshowCheckboxForCustomElement = false,\n\t\t\tcheckboxActiveColor,\n\t\t\tbrandSelectedRow,\n\t\t\tchildrenLayout = 'flyout',\n\t\t\tisChildRow = false,\n\t\t\tisPartiallyChecked = false,\n\t\t\tisCollapsible = false,\n\t\t\tisCollapsed = false,\n\t\t\tonToggleCollapse,\n\t\t},\n\t\tchildRef,\n\t) => {\n\t\tconst [isChildOptionHovered, setIsChildOptionHovered] = useState(\n\t\t\toption.selected,\n\t\t);\n\n\t\t// Nested children are rendered inline by MenuList, so there is no flyout\n\t\t// and — unlike the flyout layout — a parent row is itself selectable.\n\t\tconst isNested = childrenLayout === 'nested';\n\n\t\tconst handleOptionClick = (option: SingleOption, parent?: SingleOption) => {\n\t\t\tif (!option.children || isNested) {\n\t\t\t\tonCheckHandler(!option.selected);\n\t\t\t\tconst updatedOption = parent ? { ...option, parent } : option;\n\t\t\t\tonDropdownItemClick?.(updatedOption);\n\t\t\t}\n\t\t};\n\n\t\tconst onCheckHandler = (checked: boolean) => {\n\t\t\tif (!option.disabled) {\n\t\t\t\tonSelect({ ...option, selected: checked });\n\t\t\t}\n\t\t};\n\n\t\tconst onHoverIn = () => {\n\t\t\tif (option.description) {\n\t\t\t\tshowDescription(option.label, option.description);\n\t\t\t} else {\n\t\t\t\tshowDescription();\n\t\t\t}\n\t\t};\n\n\t\tconst cursorConfig = useDefaultCursor ? { cursor: 'default' } : {};\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Tooltip\n\t\t\t\t\tbody={''}\n\t\t\t\t\ttooltipContent={\n\t\t\t\t\t\toption.children && !isNested ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.surface.standard,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tref={childRef}\n\t\t\t\t\t\t\t\tonMouseEnter={() => setIsChildOptionHovered(true)}\n\t\t\t\t\t\t\t\tonMouseLeave={() => setIsChildOptionHovered(false)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<StyledChildDropdownContainer version={version ?? '2.0'}>\n\t\t\t\t\t\t\t\t\t{option.children.map((child) => (\n\t\t\t\t\t\t\t\t\t\t<StyledListItem\n\t\t\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t\t\t\tkey={child.value}\n\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\tversion !== '1.0' && (option?.children ?? []).length - 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t? { borderBottom: 0 }\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}\n\t\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\thandleOptionClick(child, option);\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\tlistItem={{ value: child.value, label: child.label }}\n\t\t\t\t\t\t\t\t\t\t\tsubText={child.subText}\n\t\t\t\t\t\t\t\t\t\t\tleadingIcon={child.leadingIcon || undefined}\n\t\t\t\t\t\t\t\t\t\t\tcustomComponent={child.customComponent}\n\t\t\t\t\t\t\t\t\t\t\ttrailingIcon={child.trailingIcon || undefined}\n\t\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\t\toption.disabled\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'inactive'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: child.selected\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 'default'\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</StyledChildDropdownContainer>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\tplacement={'right-start'}\n\t\t\t\t\thideArrow={true}\n\t\t\t\t>\n\t\t\t\t\t<StyledListItem\n\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tlast\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tborderBottom: 0,\n\t\t\t\t\t\t\t\t\t\t...cursorConfig,\n\t\t\t\t\t\t\t\t\t\t...(isDraggedOver\n\t\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderTop: `2px solid ${COLORS.content.brand}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0.5,\n\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  }\n\t\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\t\t...cursorConfig,\n\t\t\t\t\t\t\t\t\t\t...(isDraggedOver\n\t\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderTop: `2px solid ${COLORS.content.brand}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0.5,\n\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  }\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\thandleOptionClick(option);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonMouseOver={onHoverIn}\n\t\t\t\t\t\tlistItem={{ value: option.value, label: option.label }}\n\t\t\t\t\t\tsubText={option.subText}\n\t\t\t\t\t\tdata-option-index={dataIndex}\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\tid={`dropdown-option-${dataIndex}`}\n\t\t\t\t\t\taria-selected={!!option.selected}\n\t\t\t\t\t\tonDragOver={isDraggable ? onDragOver : undefined}\n\t\t\t\t\t\tonDrop={isDraggable ? onDrop : undefined}\n\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\tisMultiSelect &&\n\t\t\t\t\t\t\t!(showCheckboxForCustomElement && option.customComponent) ? (\n\t\t\t\t\t\t\t\t<MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t\t\t{isChildRow && <Connector />}\n\t\t\t\t\t\t\t\t\t{isDraggable && (\n\t\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\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\t<CheckBox\n\t\t\t\t\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\t\t\t\t\tisDisabled={option.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\tisChecked={!!option.selected || isPartiallyChecked}\n\t\t\t\t\t\t\t\t\t\tisPartiallyChecked={isPartiallyChecked}\n\t\t\t\t\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<LeadingIconWrapper>{option.leadingIcon}</LeadingIconWrapper>\n\t\t\t\t\t\t\t\t</MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t) : isDraggable ? (\n\t\t\t\t\t\t\t\t<SingleSelectDragContainer>\n\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{option.leadingIcon && <div>{option.leadingIcon}</div>}\n\t\t\t\t\t\t\t\t</SingleSelectDragContainer>\n\t\t\t\t\t\t\t) : option.leadingIcon ? (\n\t\t\t\t\t\t\t\t<>{option.leadingIcon}</>\n\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcustomComponent={\n\t\t\t\t\t\t\tisMultiSelect &&\n\t\t\t\t\t\t\tshowCheckboxForCustomElement &&\n\t\t\t\t\t\t\toption.customComponent ? (\n\t\t\t\t\t\t\t\t<MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t\t\t{isDraggable && (\n\t\t\t\t\t\t\t\t\t\t<DragHandleIcon\n\t\t\t\t\t\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\t\t\t\t\t\tonDragEnd={onDragEnd}\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\t<CheckBox\n\t\t\t\t\t\t\t\t\t\tsize={version === '2.0' ? 'SMALL' : 'DEFAULT'}\n\t\t\t\t\t\t\t\t\t\tisDisabled={option.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\tisChecked={!!option.selected}\n\t\t\t\t\t\t\t\t\t\tonValueChange={onCheckHandler}\n\t\t\t\t\t\t\t\t\t\tactiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{option.customComponent}\n\t\t\t\t\t\t\t\t</MultiSelectLeadingContainer>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\toption.customComponent\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttrailingIcon={\n\t\t\t\t\t\t\toption.isFreeForm ? (\n\t\t\t\t\t\t\t\t<FreeFormContainer>\n\t\t\t\t\t\t\t\t\t<BodyCaption style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\t\t\t\t\t\tFreeform\n\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t</FreeFormContainer>\n\t\t\t\t\t\t\t) : option.children && isNested && isCollapsible ? (\n\t\t\t\t\t\t\t\t<CollapseToggle\n\t\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\t\taria-expanded={!isCollapsed}\n\t\t\t\t\t\t\t\t\taria-label={`${isCollapsed ? 'Expand' : 'Collapse'} ${\n\t\t\t\t\t\t\t\t\t\toption.label\n\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tonToggleCollapse?.();\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\t{isCollapsed ? (\n\t\t\t\t\t\t\t\t\t\t<ChevronDownIcon width={16} height={16} />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<ChevronUpIcon width={16} height={16} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</CollapseToggle>\n\t\t\t\t\t\t\t) : option.children && !isNested ? (\n\t\t\t\t\t\t\t\t<ChevronRightIcon width={12} height={12} />\n\t\t\t\t\t\t\t) : option.trailingIcon ? (\n\t\t\t\t\t\t\t\t<>{option.trailingIcon}</>\n\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\toption.disabled\n\t\t\t\t\t\t\t\t? 'inactive'\n\t\t\t\t\t\t\t\t: option.selected || (!isMultiSelect && isChildOptionHovered)\n\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t: isFocused\n\t\t\t\t\t\t\t\t? 'focused'\n\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</Tooltip>\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["StyledListItem","styled","ListItem","props","StyledChildDropdownContainer","version","DEFAULT_THEME","DragHandleContainer","DragDot","COLORS","MultiSelectLeadingContainer","Connector","CollapseToggle","LeadingIconWrapper","SingleSelectDragContainer","DragHandleIcon","onDragStart","onDragEnd","jsxs","jsx","MenuItem","forwardRef","option","isMultiSelect","showDescription","onSelect","last","onDropdownItemClick","useDefaultCursor","isFocused","dataIndex","isDraggable","onDragOver","onDrop","isDraggedOver","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","childrenLayout","isChildRow","isPartiallyChecked","isCollapsible","isCollapsed","onToggleCollapse","childRef","isChildOptionHovered","setIsChildOptionHovered","useState","isNested","handleOptionClick","parent","onCheckHandler","updatedOption","checked","onHoverIn","cursorConfig","Fragment","Tooltip","child","e","CheckBox","FreeFormContainer","BodyCaption","ChevronDownIcon","ChevronUpIcon","ChevronRightIcon"],"mappings":"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"}

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

@@ -14,6 +14,8 @@ interface MenuListProps {
     showCheckboxForCustomElement?: boolean;
     checkboxActiveColor?: string;
     brandSelectedRow?: boolean;
+    childrenLayout?: 'flyout' | 'nested';
+    collapsibleChildren?: boolean;
 }
 export declare const MenuList: import('react').ForwardRefExoticComponent<MenuListProps & import('react').RefAttributes<HTMLDivElement[]>>;
 export {};