impact-ui 3.7.34-alpha.2 → 3.7.34-alpha.3

package/dist/components/Loader/index.js

@@ -0,0 +1,98 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".ia-styles.ia-loader-container{align-items:center;display:flex;flex-direction:column;position:relative;z-index:99999}.ia-styles.ia-loader-container .ia-loader-outer{border-radius:50%;border-style:solid;position:relative}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.ia-styles.ia-loader-container .ia-loader-outer{animation:spin 1s linear infinite}.ia-styles.ia-loader-container .ia-loader-outer .ia-loader-inner{align-items:center;animation:spin 1s linear infinite;animation-direction:reverse;background-color:#fff;border-radius:50%;display:flex;font-family:Manrope,sans-serif;font-size:12px;font-weight:500;justify-content:center;line-height:16.39px;position:absolute;text-align:center}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-small{height:24px;width:24px}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-small .ia-loader-inner{height:20px;left:2px;top:2px;width:20px}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-medium{height:48px;width:48px}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-medium .ia-loader-inner{height:40px;left:4px;top:4px;width:40px}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-large{height:72px;width:72px}.ia-styles.ia-loader-container .ia-loader-outer.ia-loader-large .ia-loader-inner{height:60px;left:6px;top:6px;width:60px}.ia-styles.ia-loader-container .ia-loader-outer{background:conic-gradient(from 180deg at 50% 50%,#4259ee00,#4259ee 1turn)}.ia-styles.ia-loader-container .ia-loaderText{font-family:Manrope,sans-serif;font-size:12px;font-weight:500;line-height:16.39px;margin-top:4px;text-align:left}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+
+import Box from "../../node_modules/@mui/material/Box/Box.js";
+import Skeleton from "../../node_modules/@mui/material/Skeleton/Skeleton.js";
+function getSkeletonDimensions(size) {
+  switch (size) {
+    case "small":
+      return { circular: 20, rectangularWidth: 200, rectangularHeight: 10 };
+    case "medium":
+      return { circular: 25, rectangularWidth: 250, rectangularHeight: 12 };
+    case "large":
+    default:
+      return { circular: 30, rectangularWidth: 268, rectangularHeight: 12 };
+  }
+}
+function Loader({
+  size = "large",
+  progress = "",
+  showSkeleton = false,
+  text = "Loading...",
+  className,
+  id,
+  "data-testid": dataTestId,
+  "aria-label": ariaLabel = "Loading",
+  role = "status",
+  boxProps,
+  skeletonProps
+}) {
+  const skeletonDimensions = useMemo(() => getSkeletonDimensions(size), [size]);
+  if (showSkeleton) {
+    return /* @__PURE__ */ jsxs(
+      Box,
+      {
+        alignItems: "center",
+        "aria-label": ariaLabel,
+        className,
+        "data-testid": dataTestId,
+        display: "flex",
+        id,
+        role,
+        ...boxProps,
+        children: [
+          /* @__PURE__ */ jsx(
+            Skeleton,
+            {
+              height: skeletonDimensions.circular,
+              sx: { borderRadius: 1 },
+              variant: "rectangular",
+              width: skeletonDimensions.circular,
+              ...skeletonProps
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box, { display: "flex", flexDirection: "column", justifyContent: "space-between", ml: 2, children: [
+            /* @__PURE__ */ jsx(
+              Skeleton,
+              {
+                height: skeletonDimensions.rectangularHeight,
+                style: { marginBottom: 4 },
+                variant: "rectangular",
+                width: skeletonDimensions.rectangularWidth,
+                ...skeletonProps
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Skeleton,
+              {
+                height: skeletonDimensions.rectangularHeight,
+                variant: "rectangular",
+                width: skeletonDimensions.rectangularWidth,
+                ...skeletonProps
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-label": ariaLabel,
+      className: `ia-styles ia-loader-container ${className ?? ""}`.trim(),
+      "data-testid": dataTestId,
+      id,
+      role,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: `ia-styles ia-loader-outer ia-loader-${size}`, children: /* @__PURE__ */ jsx("div", { className: "ia-loader ia-loader-inner", children: size !== "small" && progress }) }),
+        (progress || text) && /* @__PURE__ */ jsx("div", { className: "ia-loaderText", children: text })
+      ]
+    }
+  );
+}
+Loader.displayName = "Loader";
+export {
+  Loader
+};

package/dist/components/Menu/IconMenuItem.d.ts

@@ -0,0 +1,21 @@
+import { MenuOption } from './Menu.types';
+
+export interface IconMenuItemProps {
+    item: MenuOption;
+    icon?: React.ReactNode;
+    label?: string;
+    renderLabel?: (item: MenuOption) => React.ReactNode;
+    withCheckbox?: boolean;
+    selectedItems?: string[];
+    selected?: {
+        value?: string;
+    };
+    handleSelect?: (item: MenuOption, event: React.MouseEvent) => void;
+    onClick?: (event: React.MouseEvent, item: MenuOption) => void;
+    childOpen?: boolean;
+    className?: string;
+    MenuItemProps?: Record<string, unknown>;
+    children?: React.ReactNode;
+}
+export declare const IconMenuItem: import('react').ForwardRefExoticComponent<IconMenuItemProps & import('react').RefAttributes<HTMLLIElement>>;
+//# sourceMappingURL=IconMenuItem.d.ts.map

package/dist/components/Menu/IconMenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconMenuItem.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/IconMenuItem.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,oBAAoB,CAAC;AAE5B,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,UAAU,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,KAAK,CAAC,SAAS,CAAC;IACpD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACnE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,YAAY,6GA2FxB,CAAC"}

package/dist/components/Menu/IconMenuItem.js

@@ -0,0 +1,84 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".ia-styles.ia-menu .MuiPaper-root{background:#fff;border:1px solid #f0f0f0;border-radius:16px;box-shadow:0 1px 6px #0000001f;margin-top:4px;padding:0 6px}.ia-styles.ia-menu .MuiList-root{display:flex;flex-direction:column;gap:4px}.ia-styles.ia-menu .MuiButtonBase-root{align-items:center;color:#1f2b4d;display:flex;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;gap:6px;height:35px;justify-content:space-between;line-height:20px;padding:0 12px}.ia-styles.ia-menu .MuiButtonBase-root.Mui-focusVisible{background-color:initial}.ia-styles.ia-menu .MuiButtonBase-root:hover{background:#f5f6fa;border-radius:8px;color:#1f2b4d}.ia-styles.ia-menu .css-kk1bwy-MuiButtonBase-root-MuiMenuItem-root:has(.ia-list-sublabel){min-height:56px!important}.ia-styles.ia-menu .css-kk1bwy-MuiButtonBase-root-MuiMenuItem-root.Mui-selected{background-color:#eceefd;border-radius:8px}.ia-styles.ia-menu .ia-list-body:has(.menu-section-header){border-top:1px solid #f5f6fa;gap:6px;padding-top:4px}.ia-styles.ia-menu li:first-of-type :has(.menu-section-header){border-top:none}.ia-styles.ia-menu li:has(.menu-section-header){cursor:default;pointer-events:none}.ia-styles.ia-menu .css-kk1bwy-MuiButtonBase-root-MuiMenuItem-root.child-hover{background:#f5f6fa;border-radius:8px;color:#1f2b4d}.ia-styles.ia-menu .ia-vertical-line{align-self:stretch;border:1px solid #f5f6fa;flex:none;flex-grow:0;height:0;min-width:228px}.ia-styles.ia-menu .ia-menu-action-button-container{align-items:center;display:flex;gap:12px;justify-content:flex-end;padding:8px 8px 4px}.ia-styles.ia-menu .ia-menu-action-button-container .ia-styles.ia-btn{font-weight:400;height:32px;padding:8px}.ia-styles.ia-menu .ia-menu-action-button-container .ia-btn-contained{color:#fff}.ia-styles.ia-menu .ia-menu-action-button-container .ia-btn-contained:hover{background-color:#3649c6;color:#fff}.ia-styles.ia-menu .ia-menu-action-button-container .ia-btn-tertiary:hover{background-color:#eceefd;border-color:#3649c6;border-width:1px;color:#3649c6}.ia-styles.ia-menu .menu-scroll-area{display:flex;flex-direction:column;gap:4px;max-height:300px;overflow-y:auto}.ia-styles.ia-menu .menu-item-selected{background:#f5f6fa;border-radius:8px;color:#1f2b4d}.ia-menu-checkbox .MuiCheckbox-root.impact-checkbox-container{height:16px;margin-right:0;width:16px}.ia-menu-checkbox .MuiCheckbox-root.impact-checkbox-container:hover{background:#fff;border-radius:4px!important}.ia-menu-checkbox .MuiCheckbox-root.default-variant.Mui-checked:hover{background:#eceefd url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/tick.svg) no-repeat;background-position:50%;background-size:10px;border:1px solid #4259ee}.menu-section-header{align-items:center;color:#b4bac7;display:flex;font-size:12px;font-weight:700;height:35px;justify-content:flex-start;line-height:20px}.ia-list-icon{min-width:auto!important}.ia-section-icon{min-width:32px!important}.ia-list-label-container{display:flex;flex-direction:column;justify-content:center;overflow:hidden}.ia-list-sublabel{color:#7a8294;font-size:12px;font-weight:400;max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ia-list-body{align-items:center;display:flex;flex-grow:1;gap:8px}.bottom_action{background:#fff;border-top:1px solid #f0f0f0;bottom:0;padding:0;position:sticky}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, createElement } from "react";
+import default_1 from "../../node_modules/@mui/icons-material/ChevronRight.js";
+import { Checkbox } from "../Checkbox/index.js";
+
+import MenuItem from "../../node_modules/@mui/material/MenuItem/MenuItem.js";
+import ListItemIcon from "../../node_modules/@mui/material/ListItemIcon/ListItemIcon.js";
+const IconMenuItem = forwardRef(
+  ({
+    MenuItemProps,
+    className,
+    item,
+    handleSelect,
+    onClick: externalOnClick,
+    // icon,
+    renderLabel,
+    withCheckbox = false,
+    selectedItems = [],
+    selected,
+    children,
+    childOpen = false,
+    ...props
+  }, ref) => {
+    const internalOnClick = (e) => {
+      item.onClick ? item.onClick(item, e) : void 0;
+    };
+    const composedOnClick = (e) => {
+      if (item.disabled) return;
+      if (withCheckbox) {
+        if (typeof handleSelect === "function") {
+          handleSelect(item, e);
+          return;
+        }
+        if (typeof externalOnClick === "function") {
+          externalOnClick(e, item);
+          return;
+        }
+        internalOnClick(e);
+        return;
+      }
+      if (typeof externalOnClick === "function") {
+        externalOnClick(e, item);
+        return;
+      }
+      internalOnClick(e);
+    };
+    return /* @__PURE__ */ createElement(
+      MenuItem,
+      {
+        ...props,
+        key: item.label,
+        ref,
+        disableRipple: true,
+        disableTouchRipple: true,
+        disabled: item.disabled,
+        selected: withCheckbox ? selectedItems.includes(item.value ?? "") : (selected == null ? void 0 : selected.value) === item.value,
+        onClick: composedOnClick,
+        ...MenuItemProps,
+        className: className ? `${className} ${childOpen ? "child-hover" : ""}`.trim() : childOpen ? "child-hover" : void 0
+      },
+      /* @__PURE__ */ jsxs("div", { className: "ia-list-body", children: [
+        withCheckbox && !item.section && /* @__PURE__ */ jsx("div", { className: "ia-menu-checkbox", children: /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            checked: selectedItems.includes(item.value ?? ""),
+            disabled: item.disabled,
+            variant: "default"
+          }
+        ) }),
+        item.icon != null && /* @__PURE__ */ jsx(ListItemIcon, { className: "ia-list-icon", children: item.icon }),
+        item.section ? /* @__PURE__ */ jsx("div", { className: "menu-section-header", children: item.section }) : /* @__PURE__ */ jsxs("div", { className: "ia-list-label-container", children: [
+          /* @__PURE__ */ jsx("div", { className: "ia-list-label", children: renderLabel ? renderLabel(item) : item.label }),
+          item.subLabel != null && /* @__PURE__ */ jsx("div", { className: "ia-list-sublabel", children: item.subLabel })
+        ] })
+      ] }),
+      item.rightIcon != null ? item.rightIcon : children != null ? /* @__PURE__ */ jsx(default_1, {}) : null
+    );
+  }
+);
+IconMenuItem.displayName = "IconMenuItem";
+export {
+  IconMenuItem
+};

package/dist/components/Menu/Menu.types.d.ts

@@ -0,0 +1,118 @@
+import { ReactNode } from 'react';
+import { BaseComponentProps } from '../../types';
+import { MenuProps as MuiMenuProps } from '@mui/material/Menu';
+
+/**
+ * Option for the dropdown menu (flat or nested).
+ * When `children` is present, renders a nested submenu.
+ */
+export interface MenuOption {
+    label: string;
+    value?: string;
+    /** Optional click handler (may receive the option as argument) */
+    onClick?: (opt?: MenuOption, event?: React.MouseEvent) => unknown;
+    /** Legacy: callback(event, item) for leaf items */
+    callback?: (event: React.MouseEvent, item: MenuOption) => void;
+    /** When true, the item is not clickable */
+    disabled?: boolean;
+    /** Optional icon or element to show before the label */
+    icon?: ReactNode;
+    /** Optional element to show after the label (e.g. ChevronRight for nested) */
+    rightIcon?: ReactNode;
+    /** Section header label (non-clickable row) */
+    section?: string;
+    /** Secondary label below main label */
+    subLabel?: string;
+    /** Nested menu options */
+    children?: MenuOption[];
+    /** Delay in ms before opening submenu on hover */
+    delay?: number;
+    /** MUI sx prop for the item */
+    sx?: unknown;
+}
+/**
+ * Custom header render props (search, select all, etc.)
+ */
+export interface MenuCustomHeaderProps {
+    options: MenuOption[];
+    selectedItems: string[];
+    searchQuery?: string;
+    onSearchChange?: (value: string) => void;
+    onSelectAll?: () => void;
+    onClearSelection?: () => void;
+    [key: string]: unknown;
+}
+/**
+ * Primary action button at bottom of menu (e.g. Apply)
+ */
+export interface MenuPrimaryButtonProps {
+    loading?: boolean;
+    label?: string;
+    disabled?: boolean;
+}
+/**
+ * Simple menu props (anchor, open, onClose, options).
+ * Extends MUI Menu props for pass-through where needed.
+ * Supports nested options, checkbox multi-select, custom header, and action buttons.
+ */
+export interface MenuProps extends BaseComponentProps {
+    /** Anchor element for menu position */
+    anchorEl: HTMLElement | null;
+    /** Whether the menu is open */
+    open: boolean;
+    /** Called when menu should close */
+    onClose?: () => void;
+    /** Menu items (flat or nested via children); supports label, value, onClick, disabled, icon, section, subLabel */
+    options?: MenuOption[];
+    /** Menu-level click handler: (option, newSelectedItems, itemResult) */
+    onClick?: (option: MenuOption, newSelectedItems: string[], itemResult?: unknown) => void;
+    /** MUI Menu props (anchorOrigin, transformOrigin, etc.) */
+    MenuProps?: Partial<MuiMenuProps>;
+    /** Unused in current impl; kept for API compat */
+    ButtonProps?: Record<string, unknown>;
+    /** Icon position: 'left' (default) or 'top' affects menu anchor/transform origin */
+    iconPlacement?: 'left' | 'top';
+    /** When true, show checkboxes and multi-select; does not close menu on item click */
+    withCheckbox?: boolean;
+    /** When true (and withCheckbox), show Cancel/Apply buttons at bottom */
+    withActionButtons?: boolean;
+    /** Called when Apply is clicked */
+    onPrimaryButtonClick?: () => void;
+    /** Called when the tertiary (left) action button is clicked */
+    onTertiaryButtonClick?: () => void;
+    /** Label for the tertiary action button (defaults to "Cancel") */
+    tertiaryButtonLabel?: string;
+    /** Unused; kept for API compat */
+    withSection?: boolean;
+    /** Single selected value (highlights one item when withCheckbox is false) */
+    selected?: {
+        value?: string;
+    };
+    /** Custom header component (search, select all, etc.) */
+    renderCustomHeader?: (props: MenuCustomHeaderProps) => ReactNode;
+    /** Props passed to custom header and selection state */
+    customHeaderProps?: {
+        selectedItems?: string[];
+        onSelectionChange?: (items: string[]) => void;
+        isLoading?: boolean;
+        isSearching?: boolean;
+        [key: string]: unknown;
+    };
+    /** Filtered options when using search (shown in header); falls back to options */
+    filteredOptions?: MenuOption[];
+    /** Current search query (controlled) */
+    searchQuery?: string;
+    /** Search input change handler */
+    onSearchChange?: (value: string) => void;
+    /** Select all handler (for custom header) */
+    onSelectAll?: (values: string[]) => void;
+    /** Clear selection handler (for custom header) */
+    onClearSelection?: () => void;
+    /** Apply button props (loading, label, disabled) */
+    primaryButtonProps?: MenuPrimaryButtonProps;
+    /** Class name for the MUI Menu paper container */
+    menuContainerClassName?: string;
+    /** When true, close menu after clicking a leaf item (default: false to match old behavior) */
+    closeOnItemClick?: boolean;
+}
+//# sourceMappingURL=Menu.types.d.ts.map

package/dist/components/Menu/Menu.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/Menu.types.ts"],"names":[],"mappings":"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"}

package/dist/components/Menu/MenuHeaderInfo.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { MenuHeaderInfoProps } from './MenuHeaderInfo.types';
+
+export declare const MenuHeaderInfo: React.MemoExoticComponent<({ options, selectedItems, onSearchChange, onSelectAll, searchQuery, onClearSelection, onRadioButtonChange, radioButtonOptions, selectedRadioButton, showRadioButton, isSearchable, isSelectAllAllowed, customHeaderProps, externalHandlers, overrideConfig, }: MenuHeaderInfoProps) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=MenuHeaderInfo.d.ts.map

package/dist/components/Menu/MenuHeaderInfo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuHeaderInfo.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/MenuHeaderInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAK1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,8BAA8B,CAAC;AAiRtC,eAAO,MAAM,cAAc,4RAlPxB,mBAAmB,6CAkPqC,CAAC"}

package/dist/components/Menu/MenuHeaderInfo.js

@@ -0,0 +1,263 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".ia-menu .menu-header{background:#fff;border-radius:16px 16px 0 0;padding-bottom:0;position:sticky;top:0;width:260px;z-index:10}.ia-menu .menu-header .MuiRadioGroup-row{margin-bottom:8px}.ia-menu .menu-header .MuiTextField-root .MuiInputBase-root{background-color:#f5f5f5;border-radius:8px}.ia-menu .menu-header .MuiTextField-root .MuiInputBase-root .MuiInputAdornment-root{color:#b4bac7}.ia-menu .menu-header .menu-header-search-container{align-items:center;display:flex;gap:8px;padding:0 16px}.ia-menu .menu-header .menu-header-search-container .menu-header-search-icon{width:14px}.ia-menu .menu-header .menu-header-search-container .menu-header-search-input{border:none;border-radius:8px;font-size:14px;outline:none;padding:8px 0;width:100%}.ia-menu .menu-header .menu-header-search-container .menu-header-search-input::placeholder{color:#b4bac7}.ia-menu .menu-header .menu-header-radio-group-container{border-bottom:1px solid #f0f0f0;margin-bottom:8px}.ia-menu .menu-header .menu-header-radio-group-container .MuiFormGroup-root.orientation-row{padding:2px 12px}.ia-menu .menu-header .menu-header-radio-group{display:flex;justify-content:space-between}.ia-menu .menu-header .MuiButtonBase-root,.ia-menu .menu-header .MuiFormGroup-root.orientation-row{padding:0 8px}.ia-menu .menu-header .select-all-option{margin-right:12px;padding:0 12px}.ia-menu .select-all-option{display:flex;justify-content:space-between}.ia-menu .select-all-option .MuiCheckbox-root{margin-right:8px;padding:0}.ia-menu .select-all-option .select-all-text{color:#0d152c!important;flex-grow:1;font-weight:500}.ia-menu .select-all-option .clear-text{color:#60697d;cursor:pointer;font-weight:500}.ia-menu .menu-list-container{max-height:250px;overflow-y:auto;padding-bottom:0;padding-top:0}.ia-menu .menu-option{align-items:center;display:flex;padding:8px 16px}.ia-menu .menu-option.selected{background-color:#e2f4ff}.ia-menu .menu-option .MuiCheckbox-root{margin-right:8px;padding:0}.ia-menu .menu-option .menu-option-label{flex-grow:1}.ia-menu .ia-menu-action-button-container{display:flex;gap:8px;justify-content:flex-end}")),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+import { jsxs, jsx } from "react/jsx-runtime";
+import { memo, useState, useRef, useEffect, useMemo } from "react";
+import { getAssetUrl } from "../../utils/assetBase.js";
+import { Checkbox } from "../Checkbox/index.js";
+import { RadioButtonGroup } from "../RadioButtonGroup/index.js";
+
+import MenuItem from "../../node_modules/@mui/material/MenuItem/MenuItem.js";
+const SearchIcon = getAssetUrl("icons/searchIconTable.svg");
+function debounce(func, wait) {
+  let timeout = null;
+  return function executedFunction(value) {
+    if (timeout) clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      timeout = null;
+      func(value);
+    }, wait);
+  };
+}
+const MenuHeaderInfoComponent = ({
+  options,
+  selectedItems,
+  onSearchChange,
+  onSelectAll,
+  searchQuery,
+  onClearSelection,
+  onRadioButtonChange,
+  radioButtonOptions = [],
+  selectedRadioButton,
+  showRadioButton = false,
+  isSearchable = true,
+  isSelectAllAllowed = true,
+  customHeaderProps = {},
+  externalHandlers = {},
+  overrideConfig = {}
+}) => {
+  const config = {
+    radioButtonOptions: overrideConfig.radioButtonOptions ?? radioButtonOptions,
+    selectedRadioButton: overrideConfig.selectedRadioButton ?? selectedRadioButton,
+    showRadioButton: overrideConfig.showRadioButton ?? showRadioButton,
+    isSearchable: overrideConfig.isSearchable ?? isSearchable,
+    isSelectAllAllowed: overrideConfig.isSelectAllAllowed ?? isSelectAllAllowed
+  };
+  const [selectedRadioOption, setSelectedRadioOption] = useState(config.selectedRadioButton ?? "");
+  const [internalSearchQuery, setInternalSearchQuery] = useState(searchQuery ?? "");
+  const inputRef = useRef(null);
+  const isUserTyping = useRef(false);
+  useEffect(() => {
+    if (isUserTyping.current && inputRef.current && document.activeElement !== inputRef.current) {
+      inputRef.current.focus();
+    }
+  });
+  useEffect(() => {
+    if (searchQuery === void 0 || searchQuery === "") {
+      setInternalSearchQuery("");
+    }
+  }, [searchQuery]);
+  const debouncedExternalHandler = useMemo(
+    () => debounce((value) => {
+      if (externalHandlers.onSearchChange) {
+        externalHandlers.onSearchChange(value);
+      } else {
+        onSearchChange == null ? void 0 : onSearchChange(value);
+      }
+    }, 500),
+    [externalHandlers, onSearchChange]
+  );
+  const handleSearchChange = (event) => {
+    const value = event.target.value;
+    isUserTyping.current = true;
+    setInternalSearchQuery(value);
+    debouncedExternalHandler(value);
+    setTimeout(() => {
+      isUserTyping.current = false;
+    }, 50);
+  };
+  const handleKeyDown = (event) => {
+    if (event.ctrlKey || event.metaKey) {
+      const allowedKeys = ["c", "v", "x", "a", "z", "y"];
+      if (allowedKeys.includes(event.key.toLowerCase())) {
+        event.stopPropagation();
+        event.nativeEvent.stopImmediatePropagation();
+        isUserTyping.current = true;
+        return;
+      }
+    }
+    const navigationKeys = [
+      "ArrowLeft",
+      "ArrowRight",
+      "ArrowUp",
+      "ArrowDown",
+      "Home",
+      "End",
+      "PageUp",
+      "PageDown",
+      "Tab",
+      "Escape",
+      "Enter"
+    ];
+    if (navigationKeys.includes(event.key)) {
+      event.stopPropagation();
+      event.nativeEvent.stopImmediatePropagation();
+      return;
+    }
+    event.stopPropagation();
+    event.preventDefault();
+    event.nativeEvent.stopImmediatePropagation();
+    isUserTyping.current = true;
+    if (event.key.length === 1 || event.key === "Backspace" || event.key === "Delete") {
+      const input = event.currentTarget;
+      const start = input.selectionStart ?? 0;
+      const end = input.selectionEnd ?? 0;
+      const currentValue = input.value;
+      let newValue;
+      let newCursorPos;
+      if (event.key === "Backspace") {
+        if (start === end && start > 0) {
+          newValue = currentValue.slice(0, start - 1) + currentValue.slice(start);
+          newCursorPos = start - 1;
+        } else if (start !== end) {
+          newValue = currentValue.slice(0, start) + currentValue.slice(end);
+          newCursorPos = start;
+        }
+      } else if (event.key === "Delete") {
+        if (start === end && start < currentValue.length) {
+          newValue = currentValue.slice(0, start) + currentValue.slice(start + 1);
+          newCursorPos = start;
+        } else if (start !== end) {
+          newValue = currentValue.slice(0, start) + currentValue.slice(end);
+          newCursorPos = start;
+        }
+      } else if (event.key.length === 1) {
+        newValue = currentValue.slice(0, start) + event.key + currentValue.slice(end);
+        newCursorPos = start + 1;
+      }
+      if (newValue !== void 0) {
+        setInternalSearchQuery(newValue);
+        debouncedExternalHandler(newValue);
+        setTimeout(() => {
+          if (newCursorPos !== void 0) {
+            input.setSelectionRange(newCursorPos, newCursorPos);
+          }
+        }, 0);
+      }
+    }
+  };
+  const isAllSelected = selectedItems.length === options.length && options.length > 0;
+  const isIndeterminate = selectedItems.length > 0 && selectedItems.length < options.length;
+  const onSelectRadioButton = (_e, value) => {
+    setSelectedRadioOption(value);
+    if (externalHandlers.onRadioButtonChange) {
+      externalHandlers.onRadioButtonChange(value);
+    } else {
+      onRadioButtonChange == null ? void 0 : onRadioButtonChange(value);
+    }
+  };
+  const handleSelectAll = () => {
+    if (isAllSelected) {
+      if (externalHandlers.onClearSelection) {
+        externalHandlers.onClearSelection();
+      } else {
+        onClearSelection == null ? void 0 : onClearSelection();
+      }
+    } else {
+      const allValues = options.map((opt) => opt.value).filter((v) => v != null);
+      if (externalHandlers.onSelectAll) {
+        externalHandlers.onSelectAll(allValues);
+      } else {
+        onSelectAll == null ? void 0 : onSelectAll(allValues);
+      }
+    }
+  };
+  const handleClearSelection = () => {
+    if (externalHandlers.onClearSelection) {
+      externalHandlers.onClearSelection();
+    } else {
+      onClearSelection == null ? void 0 : onClearSelection();
+    }
+  };
+  const {
+    searchPlaceholder,
+    selectAllLabel,
+    clearButtonText,
+    radioButtonProps,
+    searchInputProps,
+    checkboxProps,
+    clearButtonProps,
+    ...restCustomProps
+  } = customHeaderProps;
+  return /* @__PURE__ */ jsxs("div", { className: "menu-header menu-header-fixed", ...restCustomProps, children: [
+    config.showRadioButton && config.radioButtonOptions.length > 0 ? /* @__PURE__ */ jsx("div", { className: "menu-header-radio-group-container", children: /* @__PURE__ */ jsx(
+      RadioButtonGroup,
+      {
+        name: "menu-header-radio-group",
+        options: config.radioButtonOptions,
+        orientation: "row",
+        selectedOption: selectedRadioOption,
+        onChange: onSelectRadioButton,
+        ...radioButtonProps ?? {}
+      }
+    ) }) : null,
+    config.isSearchable ? /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "aria-label": "Search input container",
+        className: "menu-header-search-container",
+        role: "search",
+        children: [
+          /* @__PURE__ */ jsx("img", { alt: "search", className: "menu-header-search-icon", src: SearchIcon }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: inputRef,
+              autoComplete: "off",
+              className: "menu-header-search-input",
+              placeholder: searchPlaceholder ?? "Search here...",
+              tabIndex: 0,
+              type: "text",
+              value: internalSearchQuery,
+              onChange: handleSearchChange,
+              onKeyDown: handleKeyDown,
+              ...searchInputProps ?? {}
+            }
+          )
+        ]
+      }
+    ) : null,
+    config.isSelectAllAllowed ? /* @__PURE__ */ jsxs(MenuItem, { className: "select-all-option", children: [
+      /* @__PURE__ */ jsx("div", { className: "ia-menu-checkbox", children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          checked: isAllSelected,
+          indeterminate: isIndeterminate,
+          label: selectAllLabel ?? "Select all",
+          variant: "default",
+          onChange: () => {
+            handleSelectAll();
+          },
+          ...checkboxProps ?? {}
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "clear-text",
+          role: "button",
+          tabIndex: 0,
+          onClick: handleClearSelection,
+          onKeyDown: (e) => {
+            if (e.key === "Enter") handleClearSelection();
+          },
+          ...clearButtonProps ?? {},
+          children: clearButtonText ?? "Clear"
+        }
+      )
+    ] }) : null
+  ] });
+};
+const MenuHeaderInfo = memo(MenuHeaderInfoComponent);
+MenuHeaderInfo.displayName = "MenuHeaderInfo";
+export {
+  MenuHeaderInfo
+};