phx-uikit 1.0.255 → 1.0.257

package/dist/cjs/components/MainWrapV4/components/quick-action.js

@@ -0,0 +1,98 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = QuickAction;
+var tslib_1 = require("tslib");
+var react_1 = require("@headlessui/react");
+var outline_1 = require("@heroicons/react/24/outline");
+var react_2 = require("react");
+var icon_v3_1 = require("../assets/icon-v3");
+var helper_1 = require("../helper");
+var react_3 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../../types");
+var Skeleton_1 = require("../../Skeleton");
+var eventBus_1 = require("../utils/eventBus");
+var getCookieSession_1 = tslib_1.__importDefault(require("../../Func/getCookieSession"));
+function QuickAction(_a) {
+    var perCodes = _a.perCodes;
+    var session = (0, getCookieSession_1.default)();
+    var actionPermisstions = session === null || session === void 0 ? void 0 : session.action_permission;
+    var _b = (0, react_2.useState)(false), show = _b[0], setShow = _b[1];
+    var _c = (0, react_2.useState)(), selectedQuickAction = _c[0], setSelectedQuickAction = _c[1];
+    var data = [
+        {
+            name: 'Thư viện tiểu học',
+            code: 'LIBRARY_TIEU_HOC',
+            moduleCode: 'LIBRARY',
+            quickActions: [
+                {
+                    name: 'Mượn sách',
+                    code: 'LIBRARY_TIEU_HOC_BORROW_TICKET_CREATE',
+                    icon: 'LIBRARY_BORROW_TICKET_CREATE',
+                },
+                {
+                    name: 'Trả sách',
+                    code: 'LIBRARY_TIEU_HOC_BORROW_TICKET_RETURN',
+                    icon: 'LIBRARY_BORROW_TICKET_RETURN',
+                },
+            ],
+        },
+        {
+            name: 'Thư viện trung học',
+            code: 'LIBRARY_TRUNG_HOC',
+            moduleCode: 'LIBRARY',
+            quickActions: [
+                {
+                    name: 'Mượn sách',
+                    code: 'LIBRARY_TRUNG_HOC_BORROW_TICKET_CREATE',
+                    icon: 'LIBRARY_BORROW_TICKET_CREATE',
+                },
+                {
+                    name: 'Trả sách',
+                    code: 'LIBRARY_TRUNG_HOC_BORROW_TICKET_RETURN',
+                    icon: 'LIBRARY_BORROW_TICKET_RETURN',
+                },
+            ],
+        },
+    ];
+    return perCodes.length > 0 && actionPermisstions ? (react_3.default.createElement(react_3.default.Fragment, null,
+        react_3.default.createElement("div", { className: '-ml-3 hidden h-8 gap-1.5 lg:flex' }, data.map(function (item) {
+            // disabled khi ko có quyền module hoặc ko có quyền ở tất cả các action
+            var isDisabled = !(0, helper_1.enablePer)(item.code, perCodes) || item.quickActions.every(function (action) { return !actionPermisstions[action.code]; });
+            // @ts-ignore
+            var Icon = icon_v3_1.IconV3[item.code];
+            return (react_3.default.createElement("button", { key: item.code, className: (0, types_1.classNames)('flex h-6 items-center gap-x-1 rounded-lg px-2 text-xxs font-[450]', isDisabled
+                    ? 'cursor-not-allowed bg-[#F1F1F1] text-gray-400'
+                    : 'cursor-pointer bg-[#F1F1F1] text-gray-600 hover:bg-white hover:text-gray-900'), onClick: function () {
+                    if (!isDisabled) {
+                        setSelectedQuickAction(item);
+                        setShow(true);
+                    }
+                }, type: 'button' },
+                react_3.default.createElement("span", { className: 'flex h-[0.875rem] w-[0.875rem] items-center justify-center' },
+                    react_3.default.createElement(Icon, null)),
+                react_3.default.createElement("span", null, item.name)));
+        })),
+        react_3.default.createElement("div", { "aria-live": 'assertive', className: 'pointer-events-none absolute inset-0 flex items-center sm:items-start sm:px-4 sm:py-6' },
+            react_3.default.createElement("div", { className: 'fixed bottom-10 left-0 z-[50] mr-8 hidden w-full flex-col items-center lg:flex' },
+                react_3.default.createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transform ease-out duration-300 transition', enterFrom: 'translate-y-2 opacity-0 sm:translate-y-0 sm:translate-y-10', enterTo: 'translate-y-0 opacity-300 sm:translate-y-0', leave: 'transition ease-in duration-100', leaveFrom: 'translate-y-0 opacity-100 sm:translate-y-0', leaveTo: 'translate-y-2 opacity-0 sm:translate-y-0 sm:translate-y-10', show: show },
+                    react_3.default.createElement("div", { className: 'pointer-events-auto flex items-center gap-x-10 rounded-xl bg-indigo-800 p-2.5 text-[12px] sm:min-w-[30rem] sm:justify-between sm:gap-x-20 sm:text-xs' },
+                        react_3.default.createElement("button", { className: 'flex items-center gap-x-2 rounded-lg border border-gray-600 p-1.5 text-gray-300 hover:bg-white hover:bg-opacity-10 hover:text-white', onClick: function () { return setShow(false); }, type: 'button' },
+                            react_3.default.createElement("p", { className: 'font-normal' }, selectedQuickAction === null || selectedQuickAction === void 0 ? void 0 : selectedQuickAction.name),
+                            react_3.default.createElement(outline_1.XMarkIcon, { className: 'mt-0.5 h-4 w-4' })),
+                        react_3.default.createElement("div", { className: 'flex items-center gap-x-1' }, selectedQuickAction === null || selectedQuickAction === void 0 ? void 0 : selectedQuickAction.quickActions.map(function (action) {
+                            // @ts-ignore
+                            var IconAction = icon_v3_1.IconV3[action.icon];
+                            // chỉ hiển thị những action có quyền
+                            if (actionPermisstions[action.code]) {
+                                return (react_3.default.createElement("button", { key: action.code, className: 'flex items-center gap-x-1.5 rounded-lg px-2.5 py-1.5 text-xs text-gray-300 hover:bg-white hover:bg-opacity-10 hover:text-white', onClick: function () {
+                                        eventBus_1.eventBus.emit(selectedQuickAction.moduleCode, action);
+                                        setShow(false);
+                                    }, type: 'button' },
+                                    react_3.default.createElement("span", { className: 'h-[1.125ren] w-[1.125rem]' },
+                                        react_3.default.createElement(IconAction, null)),
+                                    react_3.default.createElement("span", null, action.name)));
+                            }
+                            return null;
+                        })))))))) : (react_3.default.createElement("div", { className: '-ml-3 hidden h-8 items-center gap-1.5 lg:flex' }, data.map(function (_, index) { return (react_3.default.createElement(Skeleton_1.PHXSkeleton, { key: index, className: '!h-5 w-[150px]', type: 'only-header' })); })));
+}
+//# sourceMappingURL=quick-action.js.map

package/dist/cjs/components/MainWrapV4/components/quick-action.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quick-action.js","sourceRoot":"","sources":["../../../../../src/components/MainWrapV4/components/quick-action.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/MainWrapV4/components/search/SearchBarDesktop.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { INavItem, TSidebarType } from '../../types';
+export default function SearchBarHeaderDesktop({ menu, perCode, sideBarType, userId, }: {
+    menu: Array<INavItem>;
+    userId: number;
+    perCode: Array<string>;
+    sideBarType: TSidebarType;
+}): React.JSX.Element;

package/dist/cjs/components/MainWrapV4/components/search/SearchBarDesktop.js

@@ -0,0 +1,226 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = SearchBarHeaderDesktop;
+var tslib_1 = require("tslib");
+var react_1 = require("@headlessui/react");
+var outline_1 = require("@heroicons/react/24/outline");
+var solid_1 = require("@heroicons/react/24/solid");
+var image_1 = tslib_1.__importDefault(require("next/image"));
+var react_2 = tslib_1.__importStar(require("react"));
+var Icon_1 = require("../../assets/Icon");
+var constant_1 = require("../../constant");
+var helper_1 = require("../../helper");
+var use_save_menu_config_1 = tslib_1.__importDefault(require("../../hooks/use-save-menu-config"));
+var types_1 = require("../../../types");
+var Loading_1 = require("../../../Loading");
+function ListItem(_a) {
+    var _this = this;
+    var activeIndex = _a.activeIndex, currentActive = _a.currentActive, list = _a.list, onClickItem = _a.onClickItem, title = _a.title;
+    var handleRedirectByEnter = function (item) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+        return tslib_1.__generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    onClickItem(item);
+                    return [4 /*yield*/, (0, helper_1.delay)(200)];
+                case 1:
+                    _a.sent();
+                    window.location.href = item.path;
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    (0, react_2.useEffect)(function () {
+        if (!currentActive)
+            return;
+        var handleEnterPress = function (e) {
+            if (e.key !== 'Enter')
+                return;
+            var activeItem = list[activeIndex];
+            if (activeItem) {
+                handleRedirectByEnter(activeItem);
+            }
+        };
+        window.addEventListener('keydown', handleEnterPress);
+        return function () { return window.removeEventListener('keydown', handleEnterPress); };
+    }, [activeIndex, currentActive, list.length]);
+    return (react_2.default.createElement("div", { className: 'mt-4 px-4' },
+        react_2.default.createElement("p", { className: 'mb-1.5 text-xxs font-[450] text-gray-500' }, title),
+        react_2.default.createElement("div", null, list.map(function (item, index) {
+            var isActive = activeIndex === index && currentActive;
+            return (react_2.default.createElement("a", { key: item.id, className: (0, types_1.classNames)('group -ml-2 flex items-center gap-x-2 px-2 py-1.5', isActive ? 'rounded-lg bg-gray-50' : 'hover:rounded-lg  hover:bg-gray-50'), href: item.path, onClick: function (e) {
+                    e.preventDefault();
+                    handleRedirectByEnter(item);
+                } },
+                react_2.default.createElement(image_1.default, { alt: 'icon', height: 32, quality: 100, 
+                    // @ts-ignore
+                    src: Icon_1.IconV2["".concat(item.code, "_OTHER_MENU")], width: 32 }),
+                react_2.default.createElement("p", { className: 'text-xs font-[450] text-gray-600 group-hover:text-gray-900' }, item.name)));
+        }))));
+}
+function SearchBarHeaderDesktop(_a) {
+    var _this = this;
+    var menu = _a.menu, perCode = _a.perCode, sideBarType = _a.sideBarType, userId = _a.userId;
+    var keyHistory = "global_search_history_".concat(userId);
+    var _b = (0, use_save_menu_config_1.default)(), getSavedMenuConfig = _b.getSavedMenuConfig, handleSaveMenuConfig = _b.handleSaveMenuConfig;
+    var _c = (0, react_2.useState)(false), show = _c[0], setShow = _c[1];
+    var _d = (0, react_2.useState)(''), searchValue = _d[0], setSearchValue = _d[1];
+    var _e = (0, react_2.useState)([]), result = _e[0], setResult = _e[1];
+    var _f = (0, react_2.useState)([]), flattenMenu = _f[0], setFlattenMenu = _f[1];
+    var _g = (0, react_2.useState)([]), history = _g[0], setHistory = _g[1];
+    var _h = (0, react_2.useState)(false), loading = _h[0], setLoading = _h[1];
+    var _j = (0, react_2.useState)(false), isEmptyResult = _j[0], setIsEmptyResult = _j[1];
+    var _k = (0, react_2.useState)(-1), activeIndexByArrowKey = _k[0], setActiveIndexByArrowKey = _k[1];
+    function onHide() {
+        setShow(false);
+        setSearchValue('');
+        setActiveIndexByArrowKey(-1);
+    }
+    function getHistory() {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
+            var listHistory, e_1;
+            return tslib_1.__generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        return [4 /*yield*/, getSavedMenuConfig({ key: keyHistory })];
+                    case 1:
+                        listHistory = (_a.sent()).listHistory;
+                        setHistory(listHistory || []);
+                        return [2 /*return*/, null];
+                    case 2:
+                        e_1 = _a.sent();
+                        console.error(e_1);
+                        return [2 /*return*/, null];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        });
+    }
+    var saveHistory = function (data) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+        return tslib_1.__generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, handleSaveMenuConfig({
+                        key: keyHistory,
+                        data: { listHistory: data },
+                    })];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleSearch = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+        var filteredData;
+        return tslib_1.__generator(this, function (_a) {
+            setLoading(true);
+            try {
+                if (!searchValue) {
+                    setResult([]);
+                    setIsEmptyResult(false);
+                    return [2 /*return*/];
+                }
+                filteredData = flattenMenu
+                    .filter(function (item) {
+                    return (0, helper_1.normalizeString)(item.name).includes((0, helper_1.normalizeString)(searchValue)) && perCode.includes(item.pathCode);
+                })
+                    .slice(0, 10);
+                setResult(filteredData);
+                setIsEmptyResult(filteredData.length === 0);
+                setActiveIndexByArrowKey(-1);
+            }
+            catch (e) {
+                console.error(e);
+            }
+            finally {
+                setLoading(false);
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var handleSaveHistory = function (item) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+        var filtereds;
+        return tslib_1.__generator(this, function (_a) {
+            filtereds = history.filter(function (curr) { return curr.id !== item.id; });
+            saveHistory(tslib_1.__spreadArray([item], filtereds, true).slice(0, 5));
+            onHide();
+            return [2 /*return*/];
+        });
+    }); };
+    (0, react_2.useEffect)(function () {
+        var timerId = setTimeout(function () {
+            handleSearch();
+        }, 300);
+        return function () { return clearTimeout(timerId); };
+    }, [searchValue]);
+    (0, react_2.useEffect)(function () {
+        setFlattenMenu((0, helper_1.flattenMenuTree)(menu));
+    }, [menu.length]);
+    (0, react_2.useEffect)(function () {
+        getHistory();
+        var handlerOpenModalSearchByShortcut = function (e) {
+            var isMac = navigator.platform.toUpperCase().includes('MAC');
+            // Cmd + K (Mac) hoặc Ctrl + K (Win)
+            if ((isMac && e.metaKey && e.key === 'k') || (!isMac && e.ctrlKey && e.key === 'k')) {
+                e.preventDefault(); // chặn trình duyệt mở search
+                setShow(true);
+            }
+        };
+        window.addEventListener('keydown', handlerOpenModalSearchByShortcut);
+        return function () { return window.removeEventListener('keydown', handlerOpenModalSearchByShortcut); };
+    }, []);
+    (0, react_2.useEffect)(function () {
+        if (!show)
+            return;
+        var handleSelectItemByKeyArrow = function (e) {
+            var totalItem = history.length + result.length;
+            if (!totalItem)
+                return;
+            if (e.key === 'ArrowDown') {
+                setActiveIndexByArrowKey(function (prev) {
+                    // backup nếu prev bị lệch so với số lượng mới
+                    var safePrev = prev >= totalItem ? 0 : prev;
+                    return safePrev === totalItem - 1 ? 0 : safePrev + 1;
+                });
+            }
+            if (e.key === 'ArrowUp') {
+                setActiveIndexByArrowKey(function (prev) {
+                    var safePrev = prev >= totalItem ? 0 : prev;
+                    return safePrev === 0 ? totalItem - 1 : safePrev - 1;
+                });
+            }
+        };
+        window.addEventListener('keydown', handleSelectItemByKeyArrow);
+        return function () {
+            window.removeEventListener('keydown', handleSelectItemByKeyArrow);
+        };
+        // không cần phụ thuộc vào activeIndex nữa
+    }, [show, history.length, result.length]);
+    return (react_2.default.createElement("div", { className: 'hidden lg:block' },
+        react_2.default.createElement("button", { className: (0, types_1.classNames)('flex h-8 w-[29rem] items-center overflow-hidden rounded-2xl border border-gray-300 px-2', sideBarType === constant_1.SIDEBAR_TYPE.ICON_AND_LABEL_HORIZONTAL ? 'bg-[#F7F7F7]' : 'bg-[#EBEBEB]'), onClick: function () { return setShow(true); }, type: 'button' },
+            react_2.default.createElement(image_1.default, { alt: 'icon', height: 16, quality: 100, src: Icon_1.IconV2.SEARCH, width: 16 }),
+            react_2.default.createElement("p", { className: 'ml-0.5 flex-1 border-none text-left text-xxs text-gray-500' }, "G\u00F5 \u0111\u1EC3 truy c\u1EADp nhanh\u2026")),
+        react_2.default.createElement(react_1.Transition.Root, { as: react_2.Fragment, show: show },
+            react_2.default.createElement(react_1.Dialog, { as: 'div', className: 'relative z-50 hidden lg:block', onClose: onHide, static: true },
+                react_2.default.createElement("div", { className: 'fixed inset-0 z-50 overflow-y-auto' },
+                    react_2.default.createElement(react_1.Transition.Child, { as: react_2.Fragment, enter: 'transform ease-out duration-300 transition', enterFrom: 'opacity-0 scale-95', enterTo: 'opacity-100 scale-100', leave: 'transition ease-in duration-200', leaveFrom: 'opacity-100 scale-100', leaveTo: 'opacity-0 scale-95' },
+                        react_2.default.createElement(react_1.Dialog.Panel, { className: 'mx-auto mt-16  max-h-[calc(100vh-9rem)] max-w-2xl transform overflow-hidden overflow-y-auto rounded-xl bg-white pb-4 outline outline-1 outline-black/5 drop-shadow-2xl' },
+                            react_2.default.createElement("div", { className: 'sticky top-0 flex h-[3.25rem] items-center justify-between gap-x-4 border-b border-gray-100  bg-white px-4' },
+                                react_2.default.createElement("div", { className: 'flex flex-1 items-center gap-x-2 overflow-hidden' },
+                                    loading ? (react_2.default.createElement(Loading_1.PHXSpinner, { className: ' h-[1.125rem] w-[1.125rem] !text-gray-500' })) : (react_2.default.createElement(solid_1.MagnifyingGlassIcon, { "aria-hidden": 'true', className: 'pointer-events-none col-start-1 row-start-1 h-[1.125rem] w-[1.125rem] self-center text-gray-400 dark:text-gray-500' })),
+                                    react_2.default.createElement("input", { autoFocus: show, className: 'flex-1 border-none bg-transparent !p-0 text-xs text-gray-900 placeholder:text-gray-400 focus:ring-0', onChange: function (e) { return setSearchValue(e.target.value); }, placeholder: 'G\u00F5 \u0111\u1EC3 truy c\u1EADp nhanh\u2026', type: 'text', value: searchValue })),
+                                searchValue && (react_2.default.createElement("button", { className: 'flex h-7 w-7 items-center justify-center rounded-lg hover:bg-gray-100', onClick: function () { return setSearchValue(''); }, type: 'button' },
+                                    react_2.default.createElement(solid_1.XMarkIcon, { className: 'h-[1.125rem] w-[1.125rem] text-gray-600' })))),
+                            result.length === 0 ? (react_2.default.createElement(react_2.default.Fragment, null, isEmptyResult ? (react_2.default.createElement("div", { className: 'flex h-[11.25rem] w-full items-center justify-center' },
+                                react_2.default.createElement("div", { className: 'flex flex-col items-center text-gray-500' },
+                                    react_2.default.createElement(outline_1.FaceFrownIcon, { className: 'mb-4 h-8 w-8' }),
+                                    react_2.default.createElement("p", { className: 'mb-2 text-sm font-semibold text-gray-900' }, "Kh\u00F4ng t\u00ECm th\u1EA5y"),
+                                    react_2.default.createElement("p", { className: 'line-clamp-2 w-[60ch] truncate text-center text-sm text-gray-500' },
+                                        "Kh\u00F4ng c\u00F3 k\u1EBFt qu\u1EA3 cho \u201C",
+                                        react_2.default.createElement("span", { className: 'font-medium text-gray-900' }, searchValue),
+                                        "\u201D")))) : (react_2.default.createElement("div", { className: 'flex h-[8.75rem] w-full items-center justify-center' },
+                                react_2.default.createElement("div", { className: 'flex flex-col items-center gap-y-2 text-gray-500' },
+                                    react_2.default.createElement(solid_1.MagnifyingGlassIcon, { "aria-hidden": 'true', className: 'h-8 w-8' }),
+                                    react_2.default.createElement("p", { className: 'text-xs' }, "T\u00ECm ki\u1EBFm menu / ch\u1EE9c n\u0103ng...")))))) : (react_2.default.createElement(ListItem, { key: 'result', activeIndex: activeIndexByArrowKey, currentActive: activeIndexByArrowKey < result.length && show, list: result, onClickItem: handleSaveHistory, title: 'K\u1EBFt qu\u1EA3 t\u00ECm ki\u1EBFm' })),
+                            history.length > 0 && (react_2.default.createElement(ListItem, { key: 'recently', activeIndex: activeIndexByArrowKey - result.length, currentActive: activeIndexByArrowKey > result.length - 1 && show, list: history, onClickItem: handleSaveHistory, title: 'G\u1EA7n \u0111\u00E2y' })))))))));
+}
+//# sourceMappingURL=SearchBarDesktop.js.map

package/dist/cjs/components/MainWrapV4/components/search/SearchBarDesktop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBarDesktop.js","sourceRoot":"","sources":["../../../../../../src/components/MainWrapV4/components/search/SearchBarDesktop.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/MainWrapV4/components/search/SearchBarMobile.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { INavItem } from '../../types';
+export default function SearchBarMobile({ menu, perCode }: {
+    menu: Array<INavItem>;
+    perCode: Array<string>;
+}): React.JSX.Element;

package/dist/cjs/components/MainWrapV4/components/search/SearchBarMobile.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = SearchBarMobile;
+var tslib_1 = require("tslib");
+var solid_1 = require("@heroicons/react/24/solid");
+var image_1 = tslib_1.__importDefault(require("next/image"));
+var react_1 = tslib_1.__importStar(require("react"));
+var Icon_1 = require("../../assets/Icon");
+var helper_1 = require("../../helper");
+function SearchBarMobile(_a) {
+    var menu = _a.menu, perCode = _a.perCode;
+    var _b = (0, react_1.useState)([]), flattenMenu = _b[0], setFlattenMenu = _b[1];
+    var _c = (0, react_1.useState)([]), searchResult = _c[0], setSearchResult = _c[1];
+    var _d = (0, react_1.useState)(false), show = _d[0], setShow = _d[1];
+    var _e = (0, react_1.useState)(''), searchValue = _e[0], setSearchValue = _e[1];
+    var handleSearch = function () {
+        try {
+            if (!searchValue) {
+                setSearchResult([]);
+                return;
+            }
+            var filteredData = flattenMenu.filter(function (item) { return (0, helper_1.normalizeString)(item.name).includes((0, helper_1.normalizeString)(searchValue)) && perCode.includes(item.pathCode); });
+            setSearchResult(filteredData);
+        }
+        catch (e) {
+            console.error(e);
+        }
+    };
+    (0, react_1.useEffect)(function () {
+        setFlattenMenu((0, helper_1.flattenMenuTree)(menu));
+    }, [menu.length]);
+    (0, react_1.useEffect)(function () {
+        var timerId = setTimeout(function () {
+            handleSearch();
+        }, 200);
+        return function () { return clearTimeout(timerId); };
+    }, [searchValue]);
+    return (react_1.default.createElement("div", { className: 'lg:hidden' },
+        !show && (react_1.default.createElement("button", { className: 'absolute right-12 top-4 z-50', onClick: function () { return setShow(true); }, type: 'button' },
+            react_1.default.createElement(solid_1.MagnifyingGlassIcon, { className: 'h-4 w-4 text-gray-900' }))),
+        react_1.default.createElement("div", { className: "absolute left-2 right-2 top-1.5 flex items-center gap-x-2 bg-[#dedede] transition-all ".concat(show ? 'z-50 opacity-100' : '-z-10 opacity-0') },
+            react_1.default.createElement("div", { className: 'flex flex-1 items-center overflow-hidden rounded-2xl border-[0.66px] border-gray-900 bg-[#EBEBEB] px-3' },
+                react_1.default.createElement(image_1.default, { alt: 'icon', height: 20, quality: 100, src: Icon_1.IconV2.SEARCH, width: 20 }),
+                react_1.default.createElement("input", { className: '-ml-1.5 flex-1 border-none bg-transparent text-xs focus:ring-0', onChange: function (e) { return setSearchValue(e.target.value); }, placeholder: 'T\u00ECm ki\u1EBFm ph\u00E2n h\u1EC7', type: 'text', value: searchValue })),
+            react_1.default.createElement("button", { onClick: function () {
+                    setShow(false);
+                    setSearchValue('');
+                }, type: 'button' },
+                react_1.default.createElement(solid_1.XMarkIcon, { className: 'h-6 w-6' }))),
+        searchResult.length > 0 && (react_1.default.createElement("div", { className: 'absolute left-0 right-0 top-12 h-[calc(100vh-3rem)] overflow-y-auto bg-[#EBEBEB] px-4 pb-3 pt-3' }, searchResult.map(function (item) { return (react_1.default.createElement("a", { key: item.id, className: '-ml-2 flex gap-x-2 p-2 hover:rounded-lg hover:bg-gray-100', href: item.path },
+            react_1.default.createElement(image_1.default, { alt: 'icon', height: 20, quality: 100, 
+                // @ts-ignore
+                src: Icon_1.IconV2["".concat(item.code, "_OTHER_MENU")], width: 20 }),
+            react_1.default.createElement("p", { className: 'text-xs font-[450] text-gray-900' }, item.name))); })))));
+}
+//# sourceMappingURL=SearchBarMobile.js.map

package/dist/cjs/components/MainWrapV4/components/search/SearchBarMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBarMobile.js","sourceRoot":"","sources":["../../../../../../src/components/MainWrapV4/components/search/SearchBarMobile.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/MainWrapV4/components/search/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { INavItem, TSidebarType } from '../../types';
+export default function SearchBarHeader({ menu, perCode, sideBarType, userId, }: {
+    menu: Array<INavItem>;
+    userId: number | undefined;
+    perCode: Array<string>;
+    sideBarType: TSidebarType;
+}): React.JSX.Element;

package/dist/cjs/components/MainWrapV4/components/search/index.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = SearchBarHeader;
+var tslib_1 = require("tslib");
+var dynamic_1 = tslib_1.__importDefault(require("next/dynamic"));
+var react_1 = tslib_1.__importStar(require("react"));
+var SearchBarHeaderDesktop = (0, dynamic_1.default)(function () { return Promise.resolve().then(function () { return tslib_1.__importStar(require('./SearchBarDesktop')); }); }, {
+    ssr: false,
+});
+var SearchBarMobile = (0, dynamic_1.default)(function () { return Promise.resolve().then(function () { return tslib_1.__importStar(require('./SearchBarMobile')); }); }, {
+    ssr: false,
+});
+function SearchBarHeader(_a) {
+    var menu = _a.menu, perCode = _a.perCode, sideBarType = _a.sideBarType, userId = _a.userId;
+    var _b = (0, react_1.useState)(false), isDesktop = _b[0], setIsDesktop = _b[1];
+    (0, react_1.useEffect)(function () {
+        var mq = window.matchMedia('(min-width: 768px)'); // Tailwind md = 768px
+        var handler = function (e) {
+            setIsDesktop(e.matches);
+        };
+        handler(mq); // initial run
+        mq.addEventListener('change', handler);
+        return function () { return mq.removeEventListener('change', handler); };
+    }, []);
+    return (react_1.default.createElement(react_1.default.Fragment, null, userId && menu.length > 0 && perCode.length > 0 && (react_1.default.createElement(react_1.default.Fragment, null, isDesktop ? (react_1.default.createElement(SearchBarHeaderDesktop, { menu: menu, perCode: perCode, sideBarType: sideBarType, userId: userId })) : (react_1.default.createElement(SearchBarMobile, { menu: menu, perCode: perCode }))))));
+}
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/MainWrapV4/components/search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/MainWrapV4/components/search/index.tsx"],"names":[],"mappings":";;AAWA,kCAuCC;;AAlDD,iEAAkC;AAClC,qDAAkD;AAGlD,IAAM,sBAAsB,GAAG,IAAA,iBAAO,EAAC,cAAM,gFAAO,oBAAoB,QAA3B,CAA4B,EAAE;IACzE,GAAG,EAAE,KAAK;CACX,CAAC,CAAA;AACF,IAAM,eAAe,GAAG,IAAA,iBAAO,EAAC,cAAM,gFAAO,mBAAmB,QAA1B,CAA2B,EAAE;IACjE,GAAG,EAAE,KAAK;CACX,CAAC,CAAA;AAEF,SAAwB,eAAe,CAAC,EAUvC;QATC,IAAI,UAAA,EACJ,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,MAAM,YAAA;IAOA,IAAA,KAA4B,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAA;IAEjD,IAAA,iBAAS,EAAC;QACR,IAAM,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAA,CAAC,sBAAsB;QAEzE,IAAM,OAAO,GAAG,UAAC,CAAuC;YACtD,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAA;QACzB,CAAC,CAAA;QAED,OAAO,CAAC,EAAE,CAAC,CAAA,CAAC,cAAc;QAC1B,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;QAEtC,OAAO,cAAM,OAAA,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,EAAzC,CAAyC,CAAA;IACxD,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,8DACG,MAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CAClD,8DACG,SAAS,CAAC,CAAC,CAAC,CACX,8BAAC,sBAAsB,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,GAAI,CACnG,CAAC,CAAC,CAAC,CACF,8BAAC,eAAe,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,GAAI,CAClD,CACA,CACJ,CACA,CACJ,CAAA;AACH,CAAC"}

package/dist/cjs/components/MainWrapV4/components/side-bar.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { DataInitMainWrap } from '../MainWrapV4';
+import { INavItem, TSidebarType } from '../types';
+interface ISideBarProps {
+    showSubMenu: boolean;
+    setShowSubMenu(show: boolean): void;
+    isSettings: boolean;
+    isActivityHistory: boolean;
+    dataInitMain: DataInitMainWrap;
+    navigation: Array<INavItem>;
+    currentMenuCode: string;
+    userId: number | undefined;
+    onChangeSideBarType(type: TSidebarType): void;
+    sideBarType: TSidebarType;
+}
+export default function SideBarDesktop({ currentMenuCode, dataInitMain, isActivityHistory, isSettings, navigation, onChangeSideBarType, setShowSubMenu, showSubMenu, sideBarType, userId, }: ISideBarProps): React.JSX.Element;
+export {};