"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("react");
const Icons = require("../components/Icons/Icons.js");
const useAppState = require("../lib/useAppState.js");
const emotionReactJsxRuntime_browser_esm = require("../node_modules/.pnpm/@emotion_react@11.10.4_q4mq7tnhdumujvomvw24zx33y4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js");
const Sidebar = ({
  data = {}
}) => {
  var _a, _b, _c, _d, _e;
  const {
    Link,
    NavLink
  } = useAppState.useAppState();
  return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("div", {
    className: "flex flex-col justify-between h-screen overflow-y-auto transition-all duration-300 ease-in-out bg-white border-r ",
    children: /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsxs("div", {
      className: "py-6",
      children: [data.logo && /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsxs(Link, {
        to: ((_a = data.logo) == null ? void 0 : _a.path) || "/",
        className: "flex items-center h-12 pl-4",
        children: [((_b = data.logo) == null ? void 0 : _b.image) && /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("img", {
          src: (_c = data.logo) == null ? void 0 : _c.image,
          className: "h-12 mr-3 rounded",
          alt: "Logo"
        }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
          className: "self-center text-xl font-semibold text-gray-600 whitespace-nowrap dark:text-white",
          children: (_d = data.logo) == null ? void 0 : _d.name
        })]
      }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("nav", {
        className: "relative flex flex-col mt-6 space-y-2",
        children: data.routes && data.routes.map((item, index) => {
          if (item.type === "line") {
            return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("hr", {
              className: "!my-4 border-gray-200 dark:border-gray-600 mx-4"
            }, `a-${index}`);
          }
          if (item.type === "title") {
            return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("h2", {
              className: "flex items-center px-4 pt-3 font-medium text-gray-400",
              children: item.name
            }, `a-${index}`);
          }
          if (NavLink) {
            return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(Nav, {
              ...item,
              NavLink
            }, `a-${index}`);
          }
        })
      }), data && data.more ? /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("nav", {
        className: "flex flex-col pt-4 mt-6 space-y-1 border-t border-gray-200 dark:border-gray-700",
        children: (_e = data.more) == null ? void 0 : _e.map((item, index) => /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(Nav, {
          ...item,
          NavLink
        }, index))
      }) : ""]
    })
  });
};
const Nav = ({
  path,
  name,
  icon,
  label,
  children,
  type,
  NavLink
}) => {
  if (!NavLink)
    return null;
  if (!children || type === "nav") {
    return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(NavItem, {
      path,
      name,
      icon,
      label,
      NavLink
    });
  }
  return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(emotionReactJsxRuntime_browser_esm.Fragment, {
    children: /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsxs("details", {
      className: "group",
      children: [/* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsxs("summary", {
        className: "flex items-center border-l-[3px] border-transparent px-4 py-2 text-gray-500 rounded-lg cursor-pointer hover:border-gray-100 hover:bg-gray-50 hover:text-gray-700",
        children: [icon && /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
          className: `text-gray-400`,
          children: typeof icon === "string" ? /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(Icons.Icons, {
            name: icon
          }) : icon
        }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
          className: "ml-3 font-medium",
          children: name
        }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
          className: "ml-auto transition duration-300 shrink-0 group-open:-rotate-180",
          children: /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("svg", {
            xmlns: "http://www.w3.org/2000/svg",
            className: "w-5 h-5",
            viewBox: "0 0 20 20",
            fill: "currentColor",
            children: /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("path", {
              fillRule: "evenodd",
              d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",
              clipRule: "evenodd"
            })
          })
        })]
      }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("nav", {
        className: "mt-1.5 ml-8 flex flex-col",
        children: children == null ? void 0 : children.map((item, index) => /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(NavItem, {
          ...item,
          NavLink
        }, `c-${index}`))
      })]
    })
  });
};
const NavItem = ({
  path,
  name,
  icon,
  label,
  NavLink
}) => {
  if (!NavLink)
    return null;
  return /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(NavLink, {
    to: path,
    className: ({
      isActive
    }) => `
        ${isActive ? "bg-sky-50 border-sky-600 text-sky-700 " : "hover:border-gray-100 hover:bg-gray-50 hover:text-gray-700 "}
        flex items-center border-l-[3px] border-transparent px-4 py-3 text-gray-500
      `,
    children: ({
      isActive
    }) => /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsxs(emotionReactJsxRuntime_browser_esm.Fragment, {
      children: [icon && /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
        className: `${isActive ? "text-sky-600" : "text-gray-400"}`,
        children: typeof icon === "string" ? /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx(Icons.Icons, {
          name: icon
        }) : icon
      }), /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
        className: `${isActive ? "text-sky-600 font-bold" : ""} ml-3 font-medium`,
        children: name
      }), label && /* @__PURE__ */ emotionReactJsxRuntime_browser_esm.jsx("span", {
        className: "inline-flex items-center justify-center px-2 ml-3 text-sm font-medium text-gray-800 bg-gray-200 rounded-full dark:bg-gray-700 dark:text-gray-300",
        children: label
      })]
    })
  });
};
exports.NavItem = NavItem;
exports.Sidebar = Sidebar;
//# sourceMappingURL=Sidebar.js.map
