"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = NavMobile;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const nav_mobile_content_1 = tslib_1.__importDefault(require("./nav-mobile-content"));
const react_2 = require("@headlessui/react");
const outline_1 = require("@heroicons/react/24/outline");
function NavMobile({ path, menu, router, permission, setSidebarOpen, hiddenSideBar, sidebarOpen, pathNameWithBasePath, }) {
    return (react_1.default.createElement(react_2.Transition.Root, { as: react_1.Fragment, show: sidebarOpen },
        react_1.default.createElement(react_2.Dialog, { as: 'div', className: 'relative z-40 lg:hidden', onClose: setSidebarOpen },
            react_1.default.createElement(react_2.Transition.Child, { as: react_1.Fragment, enter: 'transition-opacity ease-linear duration-300', enterFrom: 'opacity-0', enterTo: 'opacity-100', leave: 'transition-opacity ease-linear duration-300', leaveFrom: 'opacity-100', leaveTo: 'opacity-0' },
                react_1.default.createElement("div", { className: 'fixed inset-0 bg-gray-600 bg-opacity-75' })),
            react_1.default.createElement("div", { className: 'fixed inset-0 z-40 flex' },
                react_1.default.createElement(react_2.Transition.Child, { as: react_1.Fragment, enter: 'transition ease-in-out duration-300 transform', enterFrom: '-translate-x-full', enterTo: 'translate-x-0', leave: 'transition ease-in-out duration-300 transform', leaveFrom: 'translate-x-0', leaveTo: '-translate-x-full' },
                    react_1.default.createElement(react_2.Dialog.Panel, { className: 'relative flex w-full max-w-xs flex-1 flex-col bg-gray-200' },
                        react_1.default.createElement(react_2.Transition.Child, { as: react_1.Fragment, enter: 'ease-in-out duration-300', enterFrom: 'opacity-0', enterTo: 'opacity-100', leave: 'ease-in-out duration-300', leaveFrom: 'opacity-100', leaveTo: 'opacity-0' },
                            react_1.default.createElement("div", { className: 'absolute right-0 top-0 -mr-12 pt-2' },
                                react_1.default.createElement("button", { className: 'ml-1 flex h-10 w-10 items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white', onClick: () => setSidebarOpen(false), type: 'button' },
                                    react_1.default.createElement("span", { className: 'sr-only' }, "Close sidebar"),
                                    react_1.default.createElement(outline_1.XMarkIcon, { "aria-hidden": 'true', className: 'h-6 w-6 text-white' })))),
                        react_1.default.createElement("div", { className: 'mt-8 h-0 flex-1 overflow-y-auto pb-4 pt-5' },
                            react_1.default.createElement("nav", { className: 'mt-5 space-y-1 px-2' },
                                react_1.default.createElement(nav_mobile_content_1.default, { hiddenSideBar: hiddenSideBar, pathName: path, menu: menu, router: router, permission: permission, pathNameWithBasePath: pathNameWithBasePath }))))),
                react_1.default.createElement("div", { "aria-hidden": 'true', className: 'w-14 flex-shrink-0' })))));
}
//# sourceMappingURL=nav-mobile.js.map