import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
import * as __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__ from "@chakra-ui/react";
import * as __WEBPACK_EXTERNAL_MODULE_react_icons_bs__ from "react-icons/bs";
import * as __WEBPACK_EXTERNAL_MODULE_react_router_dom__ from "react-router-dom";
import * as __WEBPACK_EXTERNAL_MODULE__Logo_Logo_mjs__ from "../Logo/Logo.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__Nav_Nav_mjs__ from "../Nav/Nav.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__hooks_useLocalStorage_mjs__ from "../../hooks/useLocalStorage.mjs";
function Sidebar({ previousItem, items = [], groups = [], footerItems = [], isCollapsible = true, isCollapsed: initialIsCollapsed = false, logoOverrides, status, children, footerChildren }) {
    const bg = (0, __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.useColorModeValue)('darkblue.800', 'gray.700');
    const [isCollapsed, setIsCollapsed] = (0, __WEBPACK_EXTERNAL_MODULE__hooks_useLocalStorage_mjs__["default"])('isNavCollapsed', initialIsCollapsed);
    const renderLogo = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Link, {
        as: __WEBPACK_EXTERNAL_MODULE_react_router_dom__.Link,
        to: "/"
    }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Logo_Logo_mjs__["default"], {
        alt: "Redpanda Cloud",
        height: 20,
        isCollapsed: isCollapsed,
        overrides: logoOverrides
    }));
    const padding = 3;
    return /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        as: "aside",
        p: padding,
        bg: bg,
        boxShadow: "xl",
        zIndex: 2,
        position: "sticky",
        top: "0",
        height: "100vh",
        width: isCollapsed ? '58px' : '200px'
    }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        mt: 3.5,
        ml: 3
    }, isCollapsed ? /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Tooltip, {
        label: "Home",
        placement: "right",
        hasArrow: true
    }, renderLogo) : renderLogo), items.length > 0 && /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Nav_Nav_mjs__["default"], {
        status: status,
        items: previousItem ? [
            {
                ...previousItem,
                isPrevious: true
            },
            ...items
        ] : items,
        isCollapsed: isCollapsed
    }), groups.length > 0 && groups.map(({ heading, items }, i)=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Nav_Nav_mjs__["default"], {
            status: status,
            key: i,
            heading: heading,
            items: 0 === i && previousItem ? [
                {
                    ...previousItem,
                    isPrevious: true
                },
                ...items
            ] : items,
            isCollapsed: isCollapsed
        })), children, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        position: "absolute",
        bottom: 0,
        left: "0",
        right: "0",
        padding: padding
    }, !isCollapsed && /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        left: "auto",
        right: "auto",
        margin: "auto",
        padding: padding
    }, footerChildren), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Nav_Nav_mjs__["default"], {
        isCollapsed: isCollapsed,
        status: status,
        items: [
            ...footerItems,
            ...isCollapsible ? [
                {
                    to: 'toggle-sidebar',
                    title: isCollapsed ? 'Expand sidebar' : 'Collapse sidebar',
                    icon: isCollapsed ? __WEBPACK_EXTERNAL_MODULE_react_icons_bs__.BsChevronDoubleRight : __WEBPACK_EXTERNAL_MODULE_react_icons_bs__.BsChevronDoubleLeft,
                    isIconOnly: false,
                    status: 'success',
                    // Note: using 'any' because chakra event omits preventDefault in their type.
                    onClick: (e)=>{
                        e.preventDefault();
                        setIsCollapsed(!isCollapsed);
                    }
                }
            ] : []
        ]
    })));
}
/* ESM default export */ const Sidebar_rslib_entry_ = Sidebar;
export { Sidebar_rslib_entry_ as default };
