@codezee/sixtify-brahma 0.2.151 → 0.2.153

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codezee/sixtify-brahma",
-  "version": "0.2.151",
+  "version": "0.2.153",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/hardikranpariya/sixtify-brahma.git"

package/packages/shared-components/dist/AgGrid/AgGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AgGrid.d.ts","sourceRoot":"","sources":["../../src/AgGrid/AgGrid.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAIV,OAAO,EAGR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAOjC,OAAO,yBAAyB,CAAC;AAUjC,eAAO,MAAM,iBAAiB,GAAI,KAAK,OAAO,CAAC,OAAO,CAAC,KAAG,IAczD,CAAC;AAEF,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,eAAO,MAAM,eAAe,UAAqB,CAAC;AAGlD,MAAM,MAAM,WAAW,CAAC,CAAC,GAAG,OAAO,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAAG;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,KAAK,UAAU,GAAG,KAAK,CAAC,yBAAyB,CAAC,WAAW,CAAC,GAC5D,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,WAAW,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;AAElE,eAAO,MAAM,MAAM,EAwPd,UAAU,CAAC"}
+{"version":3,"file":"AgGrid.d.ts","sourceRoot":"","sources":["../../src/AgGrid/AgGrid.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAIV,OAAO,EAGR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAOjC,OAAO,yBAAyB,CAAC;AAWjC,eAAO,MAAM,iBAAiB,GAAI,KAAK,OAAO,CAAC,OAAO,CAAC,KAAG,IAczD,CAAC;AAEF,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,eAAO,MAAM,eAAe,UAAqB,CAAC;AAGlD,MAAM,MAAM,WAAW,CAAC,CAAC,GAAG,OAAO,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAAG;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,KAAK,UAAU,GAAG,KAAK,CAAC,yBAAyB,CAAC,WAAW,CAAC,GAC5D,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,WAAW,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;AAElE,eAAO,MAAM,MAAM,EA6Pd,UAAU,CAAC"}

package/packages/shared-components/dist/AgGrid/AgGrid.js

@@ -11,6 +11,7 @@ const AgGridStyleProvider_1 = require("./AgGridStyleProvider");
 const LoadingOverlay_1 = require("./LoadingOverlay");
 const NoDataOverlay_1 = require("./NoDataOverlay");
 require("./registerAgGridModules");
+const useAgGridFocusManagement_1 = require("./hooks/useAgGridFocusManagement");
 const hideNoRowsOverlay = (api) => {
     if (!api) {
         return;
@@ -146,7 +147,9 @@ exports.AgGrid = (0, react_1.forwardRef)((props, ref) => {
             }
         }
     }, [onFilterChanged, rowModelType, updateNoRowsOverlay]);
-    return ((0, jsx_runtime_1.jsxs)(AgGridStyleProvider_1.AgGridStyleProvider, { className: "ag-theme-quartz ", style: { width: "100%", height, position: "relative" }, children: [(0, jsx_runtime_1.jsx)(ag_grid_react_1.AgGridReact, { ref: ref, theme: "legacy", cacheBlockSize: cacheBlockSize, defaultColDef: {
+    const gridContainerRef = (0, react_1.useRef)(null);
+    (0, useAgGridFocusManagement_1.useAgGridFocusManagement)(gridContainerRef);
+    return ((0, jsx_runtime_1.jsxs)(AgGridStyleProvider_1.AgGridStyleProvider, { ref: gridContainerRef, className: "ag-theme-quartz ", style: { width: "100%", height, position: "relative" }, children: [(0, jsx_runtime_1.jsx)(ag_grid_react_1.AgGridReact, { ref: ref, theme: "legacy", cacheBlockSize: cacheBlockSize, defaultColDef: {
                     ...defaultColumnDef,
                     floatingFilter: enableSecondRowFilter,
                     suppressFloatingFilterButton: enableSecondRowFilter,

package/packages/shared-components/dist/AgGrid/hooks/useAgGridCheckBoxSelection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAgGridCheckBoxSelection.d.ts","sourceRoot":"","sources":["../../../src/AgGrid/hooks/useAgGridCheckBoxSelection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI9E,KAAK,8BAA8B,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IAC9D,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,mBAAmB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACxD,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACtB,gBAAgB,EAAE,MAAM,EAAE,CAAC;CAC5B,CAAC;AAqCF,eAAO,MAAM,0BAA0B,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,uEAKlE,8BAA8B,CAAC,CAAC,CAAC;;6BAyCF,WAAW,CAAC,gBAAgB,CAAC;;;CA4H9D,CAAC"}
+{"version":3,"file":"useAgGridCheckBoxSelection.d.ts","sourceRoot":"","sources":["../../../src/AgGrid/hooks/useAgGridCheckBoxSelection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI9E,KAAK,8BAA8B,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IAC9D,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,mBAAmB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACxD,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACtB,gBAAgB,EAAE,MAAM,EAAE,CAAC;CAC5B,CAAC;AAsCF,eAAO,MAAM,0BAA0B,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,uEAKlE,8BAA8B,CAAC,CAAC,CAAC;;6BAyCF,WAAW,CAAC,gBAAgB,CAAC;;;CAsJ9D,CAAC"}

package/packages/shared-components/dist/AgGrid/hooks/useAgGridCheckBoxSelection.js

@@ -3,24 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useAgGridCheckBoxSelection = void 0;
 const react_1 = require("react");
 const utils_1 = require("../../utils");
-const isDialogOnTop = (gridRef) => {
+const isDialogOnTop = () => {
+    const backdrop = document.querySelector(
+    // eslint-disable-next-line quotes
+    '.MuiBackdrop-root:not([style*="display: none"])');
+    if (backdrop) {
+        return true;
+    }
     const dialogs = document.querySelectorAll(
     // eslint-disable-next-line quotes
     '[role="dialog"], .MuiDialog-root, .MuiModal-root');
     if (dialogs.length === 0) {
         return false;
     }
-    const gridContainer = gridRef.current?.api?.eGridDiv;
-    const gridZIndex = gridContainer ? (0, utils_1.getZIndex)(gridContainer) : 0;
     for (const dialog of Array.from(dialogs)) {
         const dialogElement = dialog;
-        const isVisible = dialogElement.offsetParent !== null ||
-            window.getComputedStyle(dialogElement).display !== "none";
+        const style = window.getComputedStyle(dialogElement);
+        const isVisible = style.display !== "none" &&
+            style.visibility !== "hidden" &&
+            parseFloat(style.opacity) > 0;
         if (isVisible) {
-            const dialogZIndex = (0, utils_1.getZIndex)(dialogElement);
-            if (dialogZIndex > gridZIndex) {
-                return true;
-            }
+            return true;
         }
     }
     return false;
@@ -32,12 +35,12 @@ const useAgGridCheckBoxSelection = ({ gridRef, setSelectedEmployee, currentPageI
             return;
         }
         const api = gridRef.current.api;
-        return currentPageItems.forEach((item) => {
-            api.getRowNode(item.id)?.setSelected(isChecked);
+        return currentPageItems.forEach(({ id }) => {
+            api.getRowNode(id)?.setSelected(isChecked);
         });
     };
     const commonCheckBoxMethod = () => {
-        const currentPageItemsId = currentPageItems.map((item) => item.id);
+        const currentPageItemsId = currentPageItems.map(({ id }) => id);
         if (!isChecked) {
             handleRowCheckBox(true);
             setIsChecked(true);
@@ -57,53 +60,66 @@ const useAgGridCheckBoxSelection = ({ gridRef, setSelectedEmployee, currentPageI
         setIsChecked(event.target.checked);
         commonCheckBoxMethod();
     };
-    (0, utils_1.useGlobalKeyboardShortcut)({
-        key: "a",
-        modifierKeys: "ctrl",
-        onTrigger: () => {
-            if (isDialogOnTop(gridRef)) {
+    (0, react_1.useEffect)(() => {
+        const handleCtrlA = (event) => {
+            if (event.key.toLowerCase() !== "a" ||
+                (!event.ctrlKey && !event.metaKey)) {
                 return;
             }
-            if (!currentPageItems.length) {
+            if (isDialogOnTop()) {
                 return;
             }
-            const currentPageItemsId = currentPageItems.map((item) => item.id);
-            if (!gridRef.current) {
+            const activeElement = document.activeElement;
+            const isInputField = activeElement?.tagName === "INPUT" ||
+                activeElement?.tagName === "TEXTAREA" ||
+                activeElement?.contentEditable === "true";
+            if (isInputField) {
+                return;
+            }
+            if (!currentPageItems.length || !gridRef.current) {
                 return;
             }
+            event.preventDefault();
+            event.stopPropagation();
             const api = gridRef.current.api;
-            currentPageItems.forEach((item) => {
-                api.getRowNode(item.id)?.setSelected(true);
+            const currentPageItemsId = currentPageItems.map(({ id }) => id);
+            currentPageItems.forEach(({ id }) => {
+                api.getRowNode(id)?.setSelected(true);
             });
             setIsChecked(true);
-            setSelectedEmployee((prev) => {
-                const newArray = [...prev];
-                currentPageItemsId.forEach((id) => {
-                    if (!newArray.includes(id)) {
-                        newArray.push(id);
-                    }
-                });
-                return newArray;
-            });
-        },
-    });
+            const existingIds = new Set(selectedEmployee);
+            const idsToAdd = currentPageItemsId.filter((id) => !existingIds.has(id));
+            setSelectedEmployee([...selectedEmployee, ...idsToAdd]);
+        };
+        document.addEventListener("keydown", handleCtrlA, true);
+        return () => {
+            document.removeEventListener("keydown", handleCtrlA, true);
+        };
+    }, [currentPageItems, gridRef, setSelectedEmployee]);
     (0, utils_1.useGlobalKeyboardShortcut)({
         key: "a",
         modifierKeys: "alt",
         onTrigger: () => {
-            if (isDialogOnTop(gridRef)) {
+            if (isDialogOnTop()) {
+                return;
+            }
+            const activeElement = document.activeElement;
+            const isInputField = activeElement?.tagName === "INPUT" ||
+                activeElement?.tagName === "TEXTAREA" ||
+                activeElement?.contentEditable === "true";
+            if (isInputField) {
                 return;
             }
             if (!currentPageItems.length) {
                 return;
             }
-            const currentPageItemsId = currentPageItems.map((item) => item.id);
+            const currentPageItemsId = currentPageItems.map(({ id }) => id);
             if (!gridRef.current) {
                 return;
             }
             const api = gridRef.current.api;
-            currentPageItems.forEach((item) => {
-                api.getRowNode(item.id)?.setSelected(false);
+            currentPageItems.forEach(({ id }) => {
+                api.getRowNode(id)?.setSelected(false);
             });
             setIsChecked(false);
             setSelectedEmployee((prev) => prev.filter((id) => !currentPageItemsId.includes(id)));
@@ -111,7 +127,7 @@ const useAgGridCheckBoxSelection = ({ gridRef, setSelectedEmployee, currentPageI
     });
     (0, react_1.useEffect)(() => {
         const isCurrentPageDataChecked = currentPageItems.length > 0 &&
-            currentPageItems.every((item) => selectedEmployee.includes(item.id));
+            currentPageItems.every(({ id }) => selectedEmployee.includes(id));
         setIsChecked(isCurrentPageDataChecked);
         const handler = (event) => {
             if (event.code !== "Space") {
@@ -130,7 +146,7 @@ const useAgGridCheckBoxSelection = ({ gridRef, setSelectedEmployee, currentPageI
             header?.removeEventListener("keydown", handler);
         };
     }, [currentPageItems, selectedEmployee]);
-    const currentPageSelectedItems = currentPageItems.filter((item) => selectedEmployee.includes(item.id)).length;
+    const currentPageSelectedItems = currentPageItems.filter(({ id }) => selectedEmployee.includes(id)).length;
     const isIndeterminate = (currentPageSelectedItems &&
         currentPageSelectedItems < currentPageItems.length) ||
         false;

package/packages/shared-components/dist/AgGrid/hooks/useAgGridFocusManagement.d.ts

@@ -0,0 +1,2 @@
+export declare const useAgGridFocusManagement: (containerRef: React.RefObject<HTMLElement>) => void;
+//# sourceMappingURL=useAgGridFocusManagement.d.ts.map

package/packages/shared-components/dist/AgGrid/hooks/useAgGridFocusManagement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAgGridFocusManagement.d.ts","sourceRoot":"","sources":["../../../src/AgGrid/hooks/useAgGridFocusManagement.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,wBAAwB,GACnC,cAAc,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,SAuJ3C,CAAC"}

package/packages/shared-components/dist/AgGrid/hooks/useAgGridFocusManagement.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAgGridFocusManagement = void 0;
+/* eslint-disable sonarjs/cognitive-complexity */
+/* eslint-disable sonarjs/no-nested-functions */
+const react_1 = require("react");
+const useAgGridFocusManagement = (containerRef) => {
+    const rafRef = (0, react_1.useRef)(null);
+    const secondHeaderCellRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const container = containerRef.current;
+        if (!container) {
+            return;
+        }
+        const getSecondHeaderCell = () => {
+            const cached = secondHeaderCellRef.current;
+            if (cached && container.contains(cached)) {
+                return cached;
+            }
+            const headerCells = container.querySelectorAll(".ag-header-cell:not(.ag-column-first)");
+            const cell = headerCells.length > 0 ? headerCells[0] : null;
+            secondHeaderCellRef.current = cell ?? null;
+            return cell ?? null;
+        };
+        const preventUnwantedFocus = () => {
+            if (rafRef.current !== null) {
+                return;
+            }
+            rafRef.current = requestAnimationFrame(() => {
+                rafRef.current = null;
+                const firstHeaderCells = container.querySelectorAll(".ag-header-cell.ag-column-first:not(.ag-floating-filter)");
+                firstHeaderCells.forEach((cell) => {
+                    if (cell.tabIndex !== -1) {
+                        cell.tabIndex = -1;
+                    }
+                    const interactiveElements = cell.querySelectorAll("input, button, select, textarea, [tabindex]:not([tabindex='-1'])");
+                    interactiveElements.forEach((el) => {
+                        if (el.tabIndex !== -1) {
+                            el.tabIndex = -1;
+                        }
+                    });
+                });
+                secondHeaderCellRef.current = null;
+            });
+        };
+        const handleFocusRedirect = (e) => {
+            const target = e.target;
+            if (!container.contains(target)) {
+                return;
+            }
+            const isFirstHeader = target.closest(".ag-header-cell.ag-column-first:not(.ag-floating-filter)") !== null;
+            if (!isFirstHeader) {
+                return;
+            }
+            const secondCell = getSecondHeaderCell();
+            if (!secondCell) {
+                return;
+            }
+            e.preventDefault();
+            e.stopPropagation();
+            requestAnimationFrame(() => {
+                secondCell.focus();
+            });
+        };
+        const observer = new MutationObserver((mutations) => {
+            const shouldUpdate = mutations.some((mutation) => {
+                const target = mutation.target;
+                if (target.classList?.contains("ag-header") ||
+                    target.classList?.contains("ag-header-cell") ||
+                    target.classList?.contains("ag-header-row")) {
+                    return true;
+                }
+                const hasHeaderNodes = Array.from(mutation.addedNodes).some((node) => node instanceof HTMLElement &&
+                    (node.classList.contains("ag-header-cell") ||
+                        node.classList.contains("ag-header-row") ||
+                        node.querySelector(".ag-header-cell, .ag-header-row")));
+                return hasHeaderNodes;
+            });
+            if (shouldUpdate) {
+                preventUnwantedFocus();
+            }
+        });
+        const header = container.querySelector(".ag-header");
+        if (header instanceof HTMLElement) {
+            observer.observe(header, {
+                childList: true,
+                subtree: true,
+                attributes: true,
+                attributeFilter: ["class", "tabindex"],
+            });
+        }
+        observer.observe(container, { childList: true });
+        container.addEventListener("focusin", handleFocusRedirect, true);
+        preventUnwantedFocus();
+        return () => {
+            if (rafRef.current !== null) {
+                cancelAnimationFrame(rafRef.current);
+            }
+            observer.disconnect();
+            container.removeEventListener("focusin", handleFocusRedirect, true);
+            secondHeaderCellRef.current = null;
+        };
+    }, [containerRef]);
+};
+exports.useAgGridFocusManagement = useAgGridFocusManagement;

package/packages/shared-components/dist/FormFields/Autocomplete/Autocomplete.d.ts

@@ -34,6 +34,7 @@ export type AutocompleteProps<P extends FieldValues> = UseControllerProps<P> & O
     setValue?: UseFormSetValue<P>;
     containerProps?: StackProps;
     styling?: "custom" | "default";
+    customOnChange?: (selected: any) => void;
 };
-export declare function Autocomplete<P extends FieldValues>({ control, defaultValue, name, required, label, multiple, disabled, options, rules, loading, helperText, error, withLabel, placeholder, freeSolo, isShowOptionsOnType, isShowSelectAll, isShowAvatar, isShowEmployeeData, shouldCloseOnSelect, onAction, renderOption, getOptionLabel, maxLimit, autoFocus, defaultOption, disableClearable, containerProps, setValue, limitTags, styling, ...restProps }: AutocompleteProps<P>): import("react/jsx-runtime").JSX.Element;
+export declare function Autocomplete<P extends FieldValues>({ control, defaultValue, name, required, label, multiple, disabled, options, rules, loading, helperText, error, withLabel, placeholder, freeSolo, isShowOptionsOnType, isShowSelectAll, isShowAvatar, isShowEmployeeData, shouldCloseOnSelect, onAction, renderOption, getOptionLabel, maxLimit, autoFocus, defaultOption, disableClearable, containerProps, setValue, limitTags, styling, customOnChange, ...restProps }: AutocompleteProps<P>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Autocomplete.d.ts.map

package/packages/shared-components/dist/FormFields/Autocomplete/Autocomplete.d.ts.map

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

package/packages/shared-components/dist/FormFields/Autocomplete/Autocomplete.js

@@ -7,19 +7,26 @@ exports.Autocomplete = Autocomplete;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const styles_1 = require("@mui/material/styles");
+const filter_1 = __importDefault(require("lodash/filter"));
+const find_1 = __importDefault(require("lodash/find"));
+const isArray_1 = __importDefault(require("lodash/isArray"));
 const isFunction_1 = __importDefault(require("lodash/isFunction"));
+const isObject_1 = __importDefault(require("lodash/isObject"));
+const isString_1 = __importDefault(require("lodash/isString"));
+const map_1 = __importDefault(require("lodash/map"));
 const react_1 = require("react");
 const react_hook_form_1 = require("react-hook-form");
 const react_i18next_1 = require("react-i18next");
 const Actions_1 = require("../../Actions");
 const Toast_1 = require("../../Toast");
 const Tooltip_1 = require("../../Tooltip");
+const useAutocompleteScrollToSelected_1 = require("../../utils/hooks/useAutocompleteScrollToSelected");
 const CheckBox_styled_1 = require("../CheckBox/CheckBox.styled");
 const commonStyles_1 = require("../commonStyles");
 const ChipV2_styled_1 = require("./ChipV2.styled");
 const Skeleton_1 = require("./Skeleton");
 const Tags_1 = require("./Tags");
-function Autocomplete({ control, defaultValue, name, required = false, label, multiple = false, disabled = false, options = [], rules, loading = false, helperText, error, withLabel = false, placeholder = "", freeSolo, isShowOptionsOnType = false, isShowSelectAll = true, isShowAvatar = false, isShowEmployeeData = false, shouldCloseOnSelect = false, onAction, renderOption, getOptionLabel, maxLimit, autoFocus = false, defaultOption, disableClearable = required ? true : false, containerProps, setValue, limitTags = 0, styling = "custom", ...restProps }) {
+function Autocomplete({ control, defaultValue, name, required = false, label, multiple = false, disabled = false, options = [], rules, loading = false, helperText, error, withLabel = false, placeholder = "", freeSolo, isShowOptionsOnType = false, isShowSelectAll = true, isShowAvatar = false, isShowEmployeeData = false, shouldCloseOnSelect = false, onAction, renderOption, getOptionLabel, maxLimit, autoFocus = false, defaultOption, disableClearable = required ? true : false, containerProps, setValue, limitTags = 0, styling = "custom", customOnChange, ...restProps }) {
     const { field: { onChange, value, ...restField }, } = (0, react_hook_form_1.useController)({
         name,
         control,
@@ -28,15 +35,56 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
     });
     const { t } = (0, react_i18next_1.useTranslation)();
     const [inputValue, setInputValue] = (0, react_1.useState)("");
+    const convertValueToOption = (val) => {
+        const foundOption = (0, find_1.default)(options, (option) => option.value === val);
+        return foundOption || { label: String(val), value: val };
+    };
+    const convertToOption = (item) => {
+        return (0, isString_1.default)(item) ? { label: item, value: item } : item;
+    };
+    const formatValueForCustomOnChange = (newValue, isMultiple, selectedValues) => {
+        if (!customOnChange) {
+            return;
+        }
+        if (isMultiple && (0, isArray_1.default)(selectedValues)) {
+            const formattedValues = (0, filter_1.default)((0, map_1.default)(selectedValues, convertValueToOption), (option) => option.value !== "select-all");
+            customOnChange(formattedValues);
+        }
+        else if (isMultiple && (0, isArray_1.default)(newValue)) {
+            const formattedValues = (0, map_1.default)((0, filter_1.default)(newValue, (option) => (0, isString_1.default)(option) ||
+                ((0, isObject_1.default)(option) && option?.value !== "select-all")), convertToOption);
+            customOnChange(formattedValues);
+        }
+        else if (!isMultiple) {
+            if ((0, isString_1.default)(newValue)) {
+                customOnChange({ label: newValue, value: newValue });
+            }
+            else if ((0, isObject_1.default)(newValue) && !(0, isArray_1.default)(newValue)) {
+                customOnChange(newValue);
+            }
+            else {
+                customOnChange(null);
+            }
+        }
+    };
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const listboxRef = (0, react_1.useRef)(null);
+    const { setLastSelectedValue } = (0, useAutocompleteScrollToSelected_1.useAutocompleteScrollToSelected)(listboxRef, value);
     const handleSelectAll = (isSelected) => {
         const disabledOptions = options.filter((option) => option.disabled);
         const disabledValues = disabledOptions.map((option) => option.value);
         if (isSelected) {
             const allValues = options.map((option) => option.value);
             onChange(allValues);
+            if (customOnChange) {
+                customOnChange([...options]);
+            }
         }
         else {
             onChange(disabledValues);
+            if (customOnChange) {
+                customOnChange([...disabledOptions]);
+            }
         }
     };
     const isAllSelected = (0, react_1.useMemo)(() => {
@@ -91,7 +139,7 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
     const { palette: { app: { color }, }, } = (0, material_1.useTheme)();
     const StyledPaper = (0, styles_1.styled)(material_1.Paper)(({ theme }) => ({
         "& .MuiAutocomplete-listbox": {
-            maxHeight: 300,
+            maxHeight: 150,
             overflowY: "auto",
             marginTop: "0px",
             "&::-webkit-scrollbar": {
@@ -109,6 +157,19 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
             },
         },
     }));
+    const CustomPaperComponent = (0, react_1.useCallback)((props) => {
+        const handlePaperRef = (paperElement) => {
+            if (paperElement) {
+                setTimeout(() => {
+                    const listbox = paperElement.querySelector(".MuiAutocomplete-listbox");
+                    if (listbox) {
+                        listboxRef.current = listbox;
+                    }
+                }, 0);
+            }
+        };
+        return ((0, jsx_runtime_1.jsx)(StyledPaper, { ...props, ref: handlePaperRef, children: props.children }));
+    }, []);
     const GroupHeader = (0, styles_1.styled)("div")(({ theme }) => ({
         position: "sticky",
         padding: "4px 10px",
@@ -123,7 +184,7 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
     if (loading) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label, styling: styling });
     }
-    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "5px", ...containerProps, children: [label && styling === "custom" && ((0, jsx_runtime_1.jsx)(material_1.InputLabel, { sx: { fontSize: { xs: "14px", md: "16px" } }, required: required, disabled: disabled, children: label })), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", justifyContent: "space-between", gap: "10px", alignItems: "start", children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { PopperComponent: material_1.Popper, PaperComponent: StyledPaper, sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "5px", ...containerProps, children: [label && styling === "custom" && ((0, jsx_runtime_1.jsx)(material_1.InputLabel, { sx: { fontSize: { xs: "14px", md: "16px" } }, required: required, disabled: disabled, children: label })), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", justifyContent: "space-between", gap: "10px", alignItems: "start", children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { PopperComponent: material_1.Popper, PaperComponent: CustomPaperComponent, sx: {
                             "& .MuiAutocomplete-tag": {
                                 backgroundColor: (0, styles_1.alpha)(color.iron[700], 0.6),
                                 color: color.black[900],
@@ -136,7 +197,22 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
                                 borderRadius: "50%",
                             },
                             width: "100%",
-                        }, disableCloseOnSelect: multiple || !shouldCloseOnSelect, disabled: disabled, freeSolo: freeSolo, ...restProps, ...restField, disableClearable: disableClearable, renderTags: (value, getTagProps) => {
+                        }, open: open, onOpen: () => setOpen(true), onClose: () => setOpen(false), disableCloseOnSelect: multiple || !shouldCloseOnSelect, disabled: disabled, freeSolo: freeSolo, ...restProps, ...restField, disableClearable: disableClearable, componentsProps: {
+                            popper: {
+                                modifiers: [
+                                    {
+                                        name: "preventOverflow",
+                                        enabled: true,
+                                        options: {
+                                            altAxis: true,
+                                            altBoundary: true,
+                                            tether: true,
+                                            rootBoundary: "document",
+                                        },
+                                    },
+                                ],
+                            },
+                        }, renderTags: (value, getTagProps) => {
                             const visibleTags = limitTags ? value.slice(0, limitTags) : value;
                             const hiddenCount = value.length - visibleTags.length;
                             const hiddenTags = limitTags ? value.slice(limitTags) : value;
@@ -150,7 +226,7 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
                             const { label, avatar, employee_code, punch_code, value } = option;
                             const { key, ...optionProps } = props;
                             const isSelectAll = value === "select-all";
-                            return ((0, jsx_runtime_1.jsx)("li", { ...optionProps, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "5px", children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: "10px", alignItems: "center", children: [multiple && ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { icon: (0, jsx_runtime_1.jsx)(CheckBox_styled_1.BoxStyled, { size: "small" }), checkedIcon: (0, jsx_runtime_1.jsx)(CheckBox_styled_1.CheckStyled, { size: "small" }), indeterminate: !isAllSelected && selectedValue?.length && isSelectAll
+                            return ((0, jsx_runtime_1.jsx)("li", { ...optionProps, "data-option-value": value, tabIndex: -1, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "5px", children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: "10px", alignItems: "center", children: [multiple && ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { icon: (0, jsx_runtime_1.jsx)(CheckBox_styled_1.BoxStyled, { size: "small" }), checkedIcon: (0, jsx_runtime_1.jsx)(CheckBox_styled_1.CheckStyled, { size: "small" }), indeterminate: !isAllSelected && selectedValue?.length && isSelectAll
                                                         ? true
                                                         : false, checked: isAllSelected ? true : selected, sx: {
                                                         marginRight: "8px",
@@ -192,7 +268,9 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
                                 setInputValue("");
                             }
                             if (withLabel) {
-                                return onChange(newValue);
+                                onChange(newValue);
+                                formatValueForCustomOnChange(newValue, false);
+                                return;
                             }
                             if (multiple && Array.isArray(newValue)) {
                                 const disabledSelectedOptions = options.filter(({ disabled, value: disabledValue }) => disabled && value?.includes(disabledValue));
@@ -204,6 +282,8 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
                                 const enabledNewValues = newValue
                                     .map((option) => typeof option === "string" ? option : option.value)
                                     .filter((val) => !disabledSelectedOptions.some((d) => d.value === val));
+                                const lastSelected = enabledNewValues[enabledNewValues.length - 1];
+                                setLastSelectedValue(lastSelected ?? null);
                                 const mergedValues = [
                                     ...disabledSelectedOptions.map(({ value }) => value),
                                     ...enabledNewValues,
@@ -214,12 +294,19 @@ function Autocomplete({ control, defaultValue, name, required = false, label, mu
                                     });
                                     return;
                                 }
-                                return onChange(mergedValues);
+                                onChange(mergedValues);
+                                formatValueForCustomOnChange(newValue, true, mergedValues);
+                                return;
                             }
                             if (typeof newValue === "string") {
-                                return onChange(newValue ?? null);
+                                onChange(newValue ?? null);
+                                formatValueForCustomOnChange(newValue, false);
+                                return;
                             }
-                            onChange(newValue && !Array.isArray(newValue) ? newValue.value : null);
+                            const finalValue = newValue && !Array.isArray(newValue) ? newValue.value : null;
+                            onChange(finalValue);
+                            formatValueForCustomOnChange(newValue, false);
+                            setLastSelectedValue(finalValue);
                         }, groupBy: (option) => option.heading ?? "", renderGroup: (params) => {
                             if (!params.group) {
                                 return (0, jsx_runtime_1.jsx)(material_1.Box, { children: params.children });

package/packages/shared-components/dist/HighlightedText/HighlightedText.d.ts

@@ -0,0 +1,7 @@
+type HighlightedTextProps = {
+    text: string;
+    highlightWords?: string[];
+};
+export declare const HighlightedText: ({ text, highlightWords, }: HighlightedTextProps) => JSX.Element;
+export {};
+//# sourceMappingURL=HighlightedText.d.ts.map

package/packages/shared-components/dist/HighlightedText/HighlightedText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightedText.d.ts","sourceRoot":"","sources":["../../src/HighlightedText/HighlightedText.tsx"],"names":[],"mappings":"AAIA,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,2BAG7B,oBAAoB,KAAG,GAAG,CAAC,OA2C7B,CAAC"}

package/packages/shared-components/dist/HighlightedText/HighlightedText.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HighlightedText = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const regex_1 = require("../utils/regex");
+const HighlightedText = ({ text, highlightWords, }) => {
+    const theme = (0, material_1.useTheme)();
+    const { slate } = theme.palette.app.color;
+    if (!highlightWords?.length) {
+        return (0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", children: text });
+    }
+    const escapedWords = highlightWords.map((w) => w.replace(regex_1.highlightWordsRegex, "\\$&"));
+    const pattern = new RegExp(`(${escapedWords.join("|")})`, "gi");
+    const segments = text.split(pattern);
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", children: segments.map((segment, index) => pattern.test(segment) ? ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: {
+                padding: "2px 4px",
+                backgroundColor: slate[800],
+                border: `1px solid ${slate[700]}`,
+                borderRadius: "5px",
+                fontFamily: "monospace",
+                fontSize: "0.9em",
+            }, children: segment }, `highlight-${index}-${segment}`)) : ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", children: segment }, `text-${index}-${segment}`))) }));
+};
+exports.HighlightedText = HighlightedText;

package/packages/shared-components/dist/HighlightedText/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./HighlightedText";
+//# sourceMappingURL=index.d.ts.map

package/packages/shared-components/dist/HighlightedText/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/HighlightedText/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/packages/shared-components/dist/HighlightedText/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./HighlightedText"), exports);

package/packages/shared-components/dist/index.d.ts

@@ -8,14 +8,15 @@ export * from "./Button";
 export * from "./Card";
 export * from "./CellSelectionTable";
 export * from "./Charts";
-export * from "./codeSnippetBox";
 export * from "./Chips";
+export * from "./codeSnippetBox";
 export * from "./ColumnArranger";
 export * from "./ContentBox";
 export * from "./Dialog";
 export * from "./Drawer";
 export * from "./FilterList";
 export * from "./FormFields";
+export * from "./HighlightedText";
 export * from "./Indicator";
 export * from "./Layouts";
 export * from "./Loader";
@@ -31,7 +32,7 @@ export * from "./TabBar";
 export * from "./Timeline";
 export * from "./Toast";
 export * from "./Tooltip";
+export * from "./Tree";
 export * from "./UserProfileMenu";
 export * from "./utils";
-export * from "./Tree";
 //# sourceMappingURL=index.d.ts.map

package/packages/shared-components/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,sBAAsB,CAAC;AACrC,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,sBAAsB,CAAC;AACrC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC"}

package/packages/shared-components/dist/index.js

@@ -24,14 +24,15 @@ __exportStar(require("./Button"), exports);
 __exportStar(require("./Card"), exports);
 __exportStar(require("./CellSelectionTable"), exports);
 __exportStar(require("./Charts"), exports);
-__exportStar(require("./codeSnippetBox"), exports);
 __exportStar(require("./Chips"), exports);
+__exportStar(require("./codeSnippetBox"), exports);
 __exportStar(require("./ColumnArranger"), exports);
 __exportStar(require("./ContentBox"), exports);
 __exportStar(require("./Dialog"), exports);
 __exportStar(require("./Drawer"), exports);
 __exportStar(require("./FilterList"), exports);
 __exportStar(require("./FormFields"), exports);
+__exportStar(require("./HighlightedText"), exports);
 __exportStar(require("./Indicator"), exports);
 __exportStar(require("./Layouts"), exports);
 __exportStar(require("./Loader"), exports);
@@ -47,6 +48,6 @@ __exportStar(require("./TabBar"), exports);
 __exportStar(require("./Timeline"), exports);
 __exportStar(require("./Toast"), exports);
 __exportStar(require("./Tooltip"), exports);
+__exportStar(require("./Tree"), exports);
 __exportStar(require("./UserProfileMenu"), exports);
 __exportStar(require("./utils"), exports);
-__exportStar(require("./Tree"), exports);

package/packages/shared-components/dist/utils/hooks/useAutocompleteScrollToSelected.d.ts

@@ -0,0 +1,5 @@
+export declare function useAutocompleteScrollToSelected(listboxRef: React.RefObject<HTMLUListElement>, value: string | number | (string | number)[] | null, delay?: number): {
+    lastSelectedValueRef: import("react").MutableRefObject<string | number | null>;
+    setLastSelectedValue: (selectedValue: string | number | null) => void;
+};
+//# sourceMappingURL=useAutocompleteScrollToSelected.d.ts.map

package/packages/shared-components/dist/utils/hooks/useAutocompleteScrollToSelected.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutocompleteScrollToSelected.d.ts","sourceRoot":"","sources":["../../../src/utils/hooks/useAutocompleteScrollToSelected.ts"],"names":[],"mappings":"AAEA,wBAAgB,+BAA+B,CAC7C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAC7C,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,IAAI,EACnD,KAAK,GAAE,MAAY;;0CAyCqB,MAAM,GAAG,MAAM,GAAG,IAAI;EAI/D"}

package/packages/shared-components/dist/utils/hooks/useAutocompleteScrollToSelected.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteScrollToSelected = useAutocompleteScrollToSelected;
+const react_1 = require("react");
+function useAutocompleteScrollToSelected(listboxRef, value, delay = 300) {
+    const lastSelectedValueRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (lastSelectedValueRef.current === null || !listboxRef.current) {
+            return;
+        }
+        const timeoutId = setTimeout(() => {
+            const listbox = listboxRef.current;
+            if (!listbox) {
+                lastSelectedValueRef.current = null;
+                return;
+            }
+            const selector = `[data-option-value="${lastSelectedValueRef.current}"]`;
+            const optionElement = listbox.querySelector(selector);
+            if (optionElement) {
+                requestAnimationFrame(() => {
+                    optionElement.scrollIntoView({
+                        block: "nearest",
+                        behavior: "smooth",
+                    });
+                });
+            }
+            lastSelectedValueRef.current = null;
+        }, delay);
+        return () => {
+            clearTimeout(timeoutId);
+        };
+    }, [value, delay, listboxRef]);
+    return {
+        lastSelectedValueRef,
+        setLastSelectedValue: (selectedValue) => {
+            lastSelectedValueRef.current = selectedValue;
+        },
+    };
+}

package/packages/shared-components/dist/utils/regex.d.ts

@@ -5,4 +5,5 @@ export declare const emailRegex: RegExp;
 export declare const timeRegex: RegExp;
 export declare const accessorFnRegex: RegExp;
 export declare const hslaRegex: RegExp;
+export declare const highlightWordsRegex: RegExp;
 //# sourceMappingURL=regex.d.ts.map

package/packages/shared-components/dist/utils/regex.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"regex.d.ts","sourceRoot":"","sources":["../../src/utils/regex.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,QAAkB,CAAC;AAE9C,eAAO,MAAM,YAAY,QAAwB,CAAC;AAElD,eAAO,MAAM,uBAAuB,QAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,QACmvB,CAAC;AAE3wB,eAAO,MAAM,SAAS,QAA6B,CAAC;AAEpD,eAAO,MAAM,eAAe,QACqD,CAAC;AAElF,eAAO,MAAM,SAAS,QAAqD,CAAC"}
+{"version":3,"file":"regex.d.ts","sourceRoot":"","sources":["../../src/utils/regex.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,QAAkB,CAAC;AAE9C,eAAO,MAAM,YAAY,QAAwB,CAAC;AAElD,eAAO,MAAM,uBAAuB,QAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,QACmvB,CAAC;AAE3wB,eAAO,MAAM,SAAS,QAA6B,CAAC;AAEpD,eAAO,MAAM,eAAe,QACqD,CAAC;AAElF,eAAO,MAAM,SAAS,QAAqD,CAAC;AAE5E,eAAO,MAAM,mBAAmB,QAAwB,CAAC"}

package/packages/shared-components/dist/utils/regex.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.hslaRegex = exports.accessorFnRegex = exports.timeRegex = exports.emailRegex = exports.noSpecialCharacterRegex = exports.isoDateRegex = exports.monthYearRegex = void 0;
+exports.highlightWordsRegex = exports.hslaRegex = exports.accessorFnRegex = exports.timeRegex = exports.emailRegex = exports.noSpecialCharacterRegex = exports.isoDateRegex = exports.monthYearRegex = void 0;
 /* eslint-disable sonarjs/unnecessary-character-escapes */
 /* eslint-disable no-useless-escape */
 /* eslint-disable sonarjs/single-character-alternation */
@@ -16,3 +16,4 @@ exports.emailRegex = /^(((?!.*[^\x00-\x7F])[^<>()[\]\\.,;:\s@"](\.[^<>()[\]\\.,;
 exports.timeRegex = /^\d{1,3}:\d{2}(:\d{2})?$/;
 exports.accessorFnRegex = /([a-zA-Z0-9_$.\[\]]+)\s*!==\s*null\s*&&\s*\1\s*!==\s*void 0\s*\?\s*\1\s*:\s*/g;
 exports.hslaRegex = /hsla?\((\d+),\s*(\d+)%,\s*(\d+)%,?\s*([\d.]+)?\)/;
+exports.highlightWordsRegex = /[.*+?^${}()|[\]\\]/g;