@greatapps/common 1.1.173 → 1.1.175

package/dist/components/navigation/ProjectSelectorPopover.mjs

@@ -0,0 +1,128 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import Image from "next/image";
+import {
+  Button,
+  Command,
+  CommandEmpty,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger
+} from "../../index";
+import { CheckIcon, ChevronDown, FolderOpen, Plus, Settings } from "lucide-react";
+function ProjectItemSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-2 py-1.5 gap-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1", children: [
+      /* @__PURE__ */ jsx("div", { className: "skeleton size-8 rounded-lg shrink-0" }),
+      /* @__PURE__ */ jsx("div", { className: "skeleton h-3.5 w-32 rounded" })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "skeleton size-4 rounded-full shrink-0" })
+  ] });
+}
+function ProjectSelectorPopover({
+  open,
+  setOpen,
+  titleRef,
+  projects,
+  selectedProject,
+  onSelectProject,
+  onAddProject,
+  onManageProjects
+}) {
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { className: "cursor-pointer", children: /* @__PURE__ */ jsx(
+      ChevronDown,
+      {
+        size: 20,
+        className: `transition-transform duration-200 ${open ? "rotate-180 text-gray-950" : "text-gray-400"}`
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      PopoverContent,
+      {
+        className: "absolute right-[-158px] top-2.5 w-[296px] p-0 bg-white rounded-2xl shadow-md border border-gray-200",
+        sideOffset: 8,
+        onOpenAutoFocus: (e) => e.preventDefault(),
+        onInteractOutside: (event) => {
+          if (titleRef?.current?.contains(event.target)) {
+            event.preventDefault();
+          }
+        },
+        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-3 gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: "Projetos" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "secondary",
+                  className: "h-8! paragraph-small-semibold text-gray-950",
+                  onClick: onAddProject,
+                  children: [
+                    /* @__PURE__ */ jsx(Plus, { size: 16 }),
+                    "Adicionar"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(Tooltip, { children: [
+                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", className: "p-0 size-8", onClick: onManageProjects, children: /* @__PURE__ */ jsx(Settings, { size: 18 }) }) }),
+                /* @__PURE__ */ jsx(TooltipContent, { children: "Visualizar todos projetos" })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(Command, { className: "gap-2", children: [
+            /* @__PURE__ */ jsx(CommandInput, { placeholder: "Busque aqui" }),
+            /* @__PURE__ */ jsx(CommandList, { className: "custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]", children: projects.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-2 h-full text-gray-400 py-4", children: [
+              /* @__PURE__ */ jsx(FolderOpen, { size: 28, className: "text-gray-300" }),
+              /* @__PURE__ */ jsxs("span", { className: "paragraph-small-medium text-center text-gray-500", children: [
+                "Nenhum projeto encontrado.",
+                /* @__PURE__ */ jsx("br", {}),
+                "Crie um projeto para come\xE7ar."
+              ] })
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(CommandEmpty, { children: "Nenhum resultado encontrado." }),
+              projects.map((project) => {
+                const isSelected = selectedProject?.id === project.id;
+                return /* @__PURE__ */ jsx(
+                  CommandItem,
+                  {
+                    value: project.title,
+                    className: isSelected ? "bg-gray-50" : "",
+                    onSelect: () => onSelectProject(project),
+                    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between w-full cursor-pointer", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 w-full", children: [
+                        /* @__PURE__ */ jsx(
+                          Image,
+                          {
+                            alt: "Icon Project",
+                            src: project.photo ? `${process.env.NEXT_PUBLIC_STORAGE_URL}/${project.photo}` : "/images/Logomark.png",
+                            width: 32,
+                            height: 32,
+                            className: "rounded-lg"
+                          }
+                        ),
+                        project.title
+                      ] }),
+                      isSelected && /* @__PURE__ */ jsx(CheckIcon, { className: "size-4 text-gray-950" })
+                    ] })
+                  },
+                  project.id
+                );
+              })
+            ] }) })
+          ] })
+        ] })
+      }
+    )
+  ] });
+}
+export {
+  ProjectSelectorPopover
+};
+//# sourceMappingURL=ProjectSelectorPopover.mjs.map

package/dist/components/navigation/ProjectSelectorPopover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/navigation/ProjectSelectorPopover.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Dispatch, RefObject, SetStateAction } from 'react';\r\nimport Image from 'next/image';\r\nimport {\r\n  Button,\r\n  Command,\r\n  CommandEmpty,\r\n  CommandInput,\r\n  CommandItem,\r\n  CommandList,\r\n  Popover,\r\n  PopoverContent,\r\n  PopoverTrigger,\r\n  Tooltip,\r\n  TooltipContent,\r\n  TooltipTrigger,\r\n} from '../../index';\r\nimport { CheckIcon, ChevronDown, FolderOpen, Plus, Settings } from 'lucide-react';\r\nimport type { NavigationProject } from './types';\r\n\r\ninterface ProjectSelectorPopoverProps {\r\n  open: boolean;\r\n  setOpen: Dispatch<SetStateAction<boolean>>;\r\n  titleRef?: RefObject<HTMLSpanElement | null>;\r\n  projects: NavigationProject[];\r\n  selectedProject: NavigationProject | null;\r\n  onSelectProject: (project: NavigationProject) => void;\r\n  onAddProject: () => void;\r\n  onManageProjects: () => void;\r\n}\r\n\r\nfunction ProjectItemSkeleton() {\r\n  return (\r\n    <div className=\"flex items-center justify-between px-2 py-1.5 gap-2\">\r\n      <div className=\"flex items-center gap-2 flex-1\">\r\n        <div className=\"skeleton size-8 rounded-lg shrink-0\" />\r\n        <div className=\"skeleton h-3.5 w-32 rounded\" />\r\n      </div>\r\n      <div className=\"skeleton size-4 rounded-full shrink-0\" />\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function ProjectSelectorPopover({\r\n  open,\r\n  setOpen,\r\n  titleRef,\r\n  projects,\r\n  selectedProject,\r\n  onSelectProject,\r\n  onAddProject,\r\n  onManageProjects,\r\n}: ProjectSelectorPopoverProps) {\r\n  return (\r\n    <Popover open={open} onOpenChange={setOpen}>\r\n      <PopoverTrigger className=\"cursor-pointer\">\r\n        <ChevronDown\r\n          size={20}\r\n          className={`transition-transform duration-200 ${open ? 'rotate-180 text-gray-950' : 'text-gray-400'}`}\r\n        />\r\n      </PopoverTrigger>\r\n      <PopoverContent\r\n        className=\"absolute right-[-158px] top-2.5 w-[296px] p-0 bg-white rounded-2xl shadow-md border border-gray-200\"\r\n        sideOffset={8}\r\n        onOpenAutoFocus={(e: Event) => e.preventDefault()}\r\n        onInteractOutside={(event: Event) => {\r\n          if (titleRef?.current?.contains(event.target as Node)) {\r\n            event.preventDefault();\r\n          }\r\n        }}\r\n      >\r\n        <div className=\"flex flex-col p-3 gap-2\">\r\n          <div className=\"flex items-center justify-between\">\r\n            <span className=\"paragraph-small-semibold\">Projetos</span>\r\n            <div className=\"flex items-center gap-1.5\">\r\n              <Button\r\n                variant=\"secondary\"\r\n                className=\"h-8! paragraph-small-semibold text-gray-950\"\r\n                onClick={onAddProject}\r\n              >\r\n                <Plus size={16} />\r\n                Adicionar\r\n              </Button>\r\n              <Tooltip>\r\n                <TooltipTrigger asChild>\r\n                  <Button variant=\"secondary\" className=\"p-0 size-8\" onClick={onManageProjects}>\r\n                    <Settings size={18} />\r\n                  </Button>\r\n                </TooltipTrigger>\r\n                <TooltipContent>Visualizar todos projetos</TooltipContent>\r\n              </Tooltip>\r\n            </div>\r\n          </div>\r\n          <Command className=\"gap-2\">\r\n            <CommandInput placeholder=\"Busque aqui\" />\r\n            <CommandList className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]\">\r\n              {projects.length === 0 ? (\r\n                <div className=\"flex flex-col items-center justify-center gap-2 h-full text-gray-400 py-4\">\r\n                  <FolderOpen size={28} className=\"text-gray-300\" />\r\n                  <span className=\"paragraph-small-medium text-center text-gray-500\">\r\n                    Nenhum projeto encontrado.\r\n                    <br />\r\n                    Crie um projeto para começar.\r\n                  </span>\r\n                </div>\r\n              ) : (\r\n                <>\r\n                  <CommandEmpty>Nenhum resultado encontrado.</CommandEmpty>\r\n                  {projects.map((project) => {\r\n                    const isSelected = selectedProject?.id === project.id;\r\n                    return (\r\n                      <CommandItem\r\n                        key={project.id}\r\n                        value={project.title}\r\n                        className={isSelected ? 'bg-gray-50' : ''}\r\n                        onSelect={() => onSelectProject(project)}\r\n                      >\r\n                        <div className=\"flex items-center justify-between w-full cursor-pointer\">\r\n                          <div className=\"flex items-center gap-2 w-full\">\r\n                            <Image\r\n                              alt=\"Icon Project\"\r\n                              src={\r\n                                project.photo\r\n                                  ? `${process.env.NEXT_PUBLIC_STORAGE_URL}/${project.photo}`\r\n                                  : '/images/Logomark.png'\r\n                              }\r\n                              width={32}\r\n                              height={32}\r\n                              className=\"rounded-lg\"\r\n                            />\r\n                            {project.title}\r\n                          </div>\r\n                          {isSelected && (\r\n                            <CheckIcon className=\"size-4 text-gray-950\" />\r\n                          )}\r\n                        </div>\r\n                      </CommandItem>\r\n                    );\r\n                  })}\r\n                </>\r\n              )}\r\n            </CommandList>\r\n          </Command>\r\n        </div>\r\n      </PopoverContent>\r\n    </Popover>\r\n  );\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/components/navigation/shells/DesktopShell.mjs

@@ -0,0 +1,11 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { SideBarNavigation } from "../../layouts/SideBarNavigation";
+import { AppNavigationContext } from "../AppNavigationContext";
+function DesktopShell({ children }) {
+  return /* @__PURE__ */ jsx(AppNavigationContext.Provider, { value: { breakpoint: "desktop" }, children: /* @__PURE__ */ jsx(SideBarNavigation, { className: "justify-between gap-5", children }) });
+}
+export {
+  DesktopShell
+};
+//# sourceMappingURL=DesktopShell.mjs.map

package/dist/components/navigation/shells/DesktopShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/shells/DesktopShell.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { ReactNode } from 'react';\r\nimport { SideBarNavigation } from '../../layouts/SideBarNavigation';\r\nimport { AppNavigationContext } from '../AppNavigationContext';\r\n\r\nexport function DesktopShell({ children }: { children: ReactNode }) {\r\n  return (\r\n    <AppNavigationContext.Provider value={{ breakpoint: 'desktop' }}>\r\n      <SideBarNavigation className=\"justify-between gap-5\">\r\n        {children}\r\n      </SideBarNavigation>\r\n    </AppNavigationContext.Provider>\r\n  );\r\n}\r\n"],"mappings":";AASM;AANN,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AAE9B,SAAS,aAAa,EAAE,SAAS,GAA4B;AAClE,SACE,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,YAAY,UAAU,GAC5D,8BAAC,qBAAkB,WAAU,yBAC1B,UACH,GACF;AAEJ;","names":[]}

package/dist/components/navigation/shells/MdShell.mjs

@@ -0,0 +1,11 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { MdSideBarNavigation } from "../../layouts/MdSideBarNavigation";
+import { AppNavigationContext } from "../AppNavigationContext";
+function MdShell({ children }) {
+  return /* @__PURE__ */ jsx(AppNavigationContext.Provider, { value: { breakpoint: "md" }, children: /* @__PURE__ */ jsx(MdSideBarNavigation, { className: "justify-between gap-5", children }) });
+}
+export {
+  MdShell
+};
+//# sourceMappingURL=MdShell.mjs.map

package/dist/components/navigation/shells/MdShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/shells/MdShell.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { ReactNode } from 'react';\r\nimport Image from 'next/image';\r\nimport { MdSideBarNavigation } from '../../layouts/MdSideBarNavigation';\r\nimport { AppNavigationContext } from '../AppNavigationContext';\r\n\r\nexport function MdShell({ children }: { children: ReactNode }) {\r\n  return (\r\n    <AppNavigationContext.Provider value={{ breakpoint: 'md' }}>\r\n      <MdSideBarNavigation className=\"justify-between gap-5\">\r\n        {children}\r\n      </MdSideBarNavigation>\r\n    </AppNavigationContext.Provider>\r\n  );\r\n}\r\n"],"mappings":";AAUM;AANN,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AAE9B,SAAS,QAAQ,EAAE,SAAS,GAA4B;AAC7D,SACE,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,YAAY,KAAK,GACvD,8BAAC,uBAAoB,WAAU,yBAC5B,UACH,GACF;AAEJ;","names":[]}

package/dist/components/navigation/shells/MobileShell.mjs

@@ -0,0 +1,27 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMobileNavbarSheet } from "../../../store/useMobileNavbarSheet";
+import { AppNavigationContext } from "../AppNavigationContext";
+function MobileShell({ children }) {
+  const { isOpen, close } = useMobileNavbarSheet();
+  return /* @__PURE__ */ jsxs(AppNavigationContext.Provider, { value: { breakpoint: "mobile" }, children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `md:hidden fixed inset-0 top-[72px] bg-black/50 z-30 transition-opacity duration-300 ${isOpen ? "opacity-100" : "opacity-0 pointer-events-none"}`,
+        onClick: close
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `md:hidden fixed top-[72px] left-0 right-0 z-40 bg-white rounded-b-xl shadow-[0px_6px_12px_0px_rgba(26,26,26,0.12)] border-b border-gray-200 p-4 flex flex-col gap-5 transition-all duration-300 overflow-y-auto max-h-[calc(100dvh-72px)] ${isOpen ? "translate-y-0 opacity-100" : "-translate-y-full opacity-0 pointer-events-none"}`,
+        children
+      }
+    )
+  ] });
+}
+export {
+  MobileShell
+};
+//# sourceMappingURL=MobileShell.mjs.map

package/dist/components/navigation/shells/MobileShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/shells/MobileShell.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { ReactNode } from 'react';\r\nimport { useMobileNavbarSheet } from '../../../store/useMobileNavbarSheet';\r\nimport { AppNavigationContext } from '../AppNavigationContext';\r\n\r\nexport function MobileShell({ children }: { children: ReactNode }) {\r\n  const { isOpen, close } = useMobileNavbarSheet();\r\n\r\n  return (\r\n    <AppNavigationContext.Provider value={{ breakpoint: 'mobile' }}>\r\n      {/* Backdrop overlay */}\r\n      <div\r\n        className={`md:hidden fixed inset-0 top-[72px] bg-black/50 z-30 transition-opacity duration-300 ${\r\n          isOpen ? 'opacity-100' : 'opacity-0 pointer-events-none'\r\n        }`}\r\n        onClick={close}\r\n      />\r\n      {/* Menu panel */}\r\n      <div\r\n        className={`md:hidden fixed top-[72px] left-0 right-0 z-40 bg-white rounded-b-xl shadow-[0px_6px_12px_0px_rgba(26,26,26,0.12)] border-b border-gray-200 p-4 flex flex-col gap-5 transition-all duration-300 overflow-y-auto max-h-[calc(100dvh-72px)] ${\r\n          isOpen ? 'translate-y-0 opacity-100' : '-translate-y-full opacity-0 pointer-events-none'\r\n        }`}\r\n      >\r\n        {children}\r\n      </div>\r\n    </AppNavigationContext.Provider>\r\n  );\r\n}\r\n"],"mappings":";AAUI,SAEE,KAFF;AAPJ,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AAE9B,SAAS,YAAY,EAAE,SAAS,GAA4B;AACjE,QAAM,EAAE,QAAQ,MAAM,IAAI,qBAAqB;AAE/C,SACE,qBAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,YAAY,SAAS,GAE3D;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,uFACT,SAAS,gBAAgB,+BAC3B;AAAA,QACA,SAAS;AAAA;AAAA,IACX;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,6OACT,SAAS,8BAA8B,iDACzC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/navigation/shells/TabsMobileShell.mjs

@@ -0,0 +1,59 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+import { AppNavigationContext } from "../AppNavigationContext";
+import { useNavItemsContext } from "../NavItemsContext";
+function InternalTabsBar({ topOffset = "72px" }) {
+  const { navItems } = useNavItemsContext();
+  const tabsListRef = useRef(null);
+  const activeTabRef = useRef(null);
+  const activeLabel = navItems.find((i) => i.isActive)?.label;
+  useEffect(() => {
+    if (activeTabRef.current && tabsListRef.current) {
+      const tabsList = tabsListRef.current;
+      const activeTabElement = activeTabRef.current;
+      const tabsListRect = tabsList.getBoundingClientRect();
+      const activeTabRect = activeTabElement.getBoundingClientRect();
+      const scrollLeft = activeTabElement.offsetLeft - tabsListRect.width / 2 + activeTabRect.width / 2;
+      tabsList.scrollTo({ left: Math.max(0, scrollLeft), behavior: "smooth" });
+    }
+  }, [activeLabel]);
+  if (!navItems.length) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: tabsListRef,
+      className: "md:hidden fixed left-0 right-0 z-40 bg-white border-b border-gray-200 flex overflow-x-auto scrollbar-hide",
+      style: { top: topOffset },
+      children: navItems.map((item) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          ref: item.isActive ? activeTabRef : void 0,
+          onClick: item.onClick,
+          className: `flex items-center gap-2 px-4 py-3 shrink-0 border-b-2 transition-colors ${item.isActive ? "border-gray-950 text-gray-950" : "border-transparent text-gray-500 hover:text-gray-900"}`,
+          children: [
+            item.icon && /* @__PURE__ */ jsx(item.icon, { size: 16, className: "shrink-0" }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: item.isActive ? "paragraph-small-semibold" : "paragraph-small-medium",
+                children: item.label
+              }
+            )
+          ]
+        },
+        item.label
+      ))
+    }
+  );
+}
+function TabsMobileShell({ children, topOffset }) {
+  return /* @__PURE__ */ jsxs(AppNavigationContext.Provider, { value: { breakpoint: "mobile" }, children: [
+    /* @__PURE__ */ jsx("div", { className: "hidden", children }),
+    /* @__PURE__ */ jsx(InternalTabsBar, { topOffset })
+  ] });
+}
+export {
+  TabsMobileShell
+};
+//# sourceMappingURL=TabsMobileShell.mjs.map

package/dist/components/navigation/shells/TabsMobileShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/shells/TabsMobileShell.tsx"],"sourcesContent":["'use client';\n\nimport { ReactNode, useRef, useEffect } from 'react';\nimport { AppNavigationContext } from '../AppNavigationContext';\nimport { useNavItemsContext } from '../NavItemsContext';\n\nfunction InternalTabsBar({ topOffset = '72px' }: { topOffset?: string }) {\n  const { navItems } = useNavItemsContext();\n  const tabsListRef = useRef<HTMLDivElement>(null);\n  const activeTabRef = useRef<HTMLButtonElement>(null);\n\n  const activeLabel = navItems.find((i) => i.isActive)?.label;\n\n  // Scroll active tab into center when active item changes\n  useEffect(() => {\n    if (activeTabRef.current && tabsListRef.current) {\n      const tabsList = tabsListRef.current;\n      const activeTabElement = activeTabRef.current;\n      const tabsListRect = tabsList.getBoundingClientRect();\n      const activeTabRect = activeTabElement.getBoundingClientRect();\n      const scrollLeft =\n        activeTabElement.offsetLeft - tabsListRect.width / 2 + activeTabRect.width / 2;\n      tabsList.scrollTo({ left: Math.max(0, scrollLeft), behavior: 'smooth' });\n    }\n  }, [activeLabel]);\n\n  if (!navItems.length) return null;\n\n  return (\n    <div\n      ref={tabsListRef}\n      className=\"md:hidden fixed left-0 right-0 z-40 bg-white border-b border-gray-200 flex overflow-x-auto scrollbar-hide\"\n      style={{ top: topOffset }}\n    >\n      {navItems.map((item) => (\n        <button\n          key={item.label}\n          ref={item.isActive ? activeTabRef : undefined}\n          onClick={item.onClick}\n          className={`flex items-center gap-2 px-4 py-3 shrink-0 border-b-2 transition-colors ${\n            item.isActive\n              ? 'border-gray-950 text-gray-950'\n              : 'border-transparent text-gray-500 hover:text-gray-900'\n          }`}\n        >\n          {item.icon && <item.icon size={16} className=\"shrink-0\" />}\n          <span\n            className={\n              item.isActive ? 'paragraph-small-semibold' : 'paragraph-small-medium'\n            }\n          >\n            {item.label}\n          </span>\n        </button>\n      ))}\n    </div>\n  );\n}\n\nexport function TabsMobileShell({ children, topOffset }: { children: ReactNode; topOffset?: string }) {\n  return (\n    <AppNavigationContext.Provider value={{ breakpoint: 'mobile' }}>\n      {/*\n        Children are hidden visually, but NavItems' useEffect still fires inside\n        display:none — React effects are tied to commit phase, not layout visibility.\n        This registers navItems in NavItemsContext so InternalTabsBar can read them.\n      */}\n      <div className=\"hidden\">{children}</div>\n      <InternalTabsBar topOffset={topOffset} />\n    </AppNavigationContext.Provider>\n  );\n}\n"],"mappings":";AAmCQ,SAUgB,KAVhB;AAjCR,SAAoB,QAAQ,iBAAiB;AAC7C,SAAS,4BAA4B;AACrC,SAAS,0BAA0B;AAEnC,SAAS,gBAAgB,EAAE,YAAY,OAAO,GAA2B;AACvE,QAAM,EAAE,SAAS,IAAI,mBAAmB;AACxC,QAAM,cAAc,OAAuB,IAAI;AAC/C,QAAM,eAAe,OAA0B,IAAI;AAEnD,QAAM,cAAc,SAAS,KAAK,CAAC,MAAM,EAAE,QAAQ,GAAG;AAGtD,YAAU,MAAM;AACd,QAAI,aAAa,WAAW,YAAY,SAAS;AAC/C,YAAM,WAAW,YAAY;AAC7B,YAAM,mBAAmB,aAAa;AACtC,YAAM,eAAe,SAAS,sBAAsB;AACpD,YAAM,gBAAgB,iBAAiB,sBAAsB;AAC7D,YAAM,aACJ,iBAAiB,aAAa,aAAa,QAAQ,IAAI,cAAc,QAAQ;AAC/E,eAAS,SAAS,EAAE,MAAM,KAAK,IAAI,GAAG,UAAU,GAAG,UAAU,SAAS,CAAC;AAAA,IACzE;AAAA,EACF,GAAG,CAAC,WAAW,CAAC;AAEhB,MAAI,CAAC,SAAS,OAAQ,QAAO;AAE7B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAU;AAAA,MACV,OAAO,EAAE,KAAK,UAAU;AAAA,MAEvB,mBAAS,IAAI,CAAC,SACb;AAAA,QAAC;AAAA;AAAA,UAEC,KAAK,KAAK,WAAW,eAAe;AAAA,UACpC,SAAS,KAAK;AAAA,UACd,WAAW,2EACT,KAAK,WACD,kCACA,sDACN;AAAA,UAEC;AAAA,iBAAK,QAAQ,oBAAC,KAAK,MAAL,EAAU,MAAM,IAAI,WAAU,YAAW;AAAA,YACxD;AAAA,cAAC;AAAA;AAAA,gBACC,WACE,KAAK,WAAW,6BAA6B;AAAA,gBAG9C,eAAK;AAAA;AAAA,YACR;AAAA;AAAA;AAAA,QAhBK,KAAK;AAAA,MAiBZ,CACD;AAAA;AAAA,EACH;AAEJ;AAEO,SAAS,gBAAgB,EAAE,UAAU,UAAU,GAAgD;AACpG,SACE,qBAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,YAAY,SAAS,GAM3D;AAAA,wBAAC,SAAI,WAAU,UAAU,UAAS;AAAA,IAClC,oBAAC,mBAAgB,WAAsB;AAAA,KACzC;AAEJ;","names":[]}

package/dist/components/navigation/subcomponents/CreditsCard.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useAppNavigationContext } from "../AppNavigationContext";
+import { Progress } from "../../../index";
+function CreditsCard({ used, total, onClick }) {
+  const { breakpoint } = useAppNavigationContext();
+  if (breakpoint !== "mobile") return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `flex flex-col bg-gray-950 rounded-lg gap-4 w-full px-4 pt-4 pb-[18px] ${onClick ? "cursor-pointer" : ""}`,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white", children: "Cr\xE9ditos usados" }),
+          /* @__PURE__ */ jsxs("span", { className: "paragraph-xsmall-medium text-white/50", children: [
+            used,
+            " / ",
+            total
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Progress, { className: "bg-white/10 h-[6px]", indicatorColor: "bg-white", value: Math.round(used / total * 100) })
+      ]
+    }
+  );
+}
+export {
+  CreditsCard
+};
+//# sourceMappingURL=CreditsCard.mjs.map

package/dist/components/navigation/subcomponents/CreditsCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/subcomponents/CreditsCard.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useAppNavigationContext } from '../AppNavigationContext';\r\nimport { Progress } from '../../../index';\r\n\r\nexport interface CreditsCardProps {\r\n  used: number;\r\n  total: number;\r\n  onClick?: () => void;\r\n}\r\n\r\nexport function CreditsCard({ used, total, onClick }: CreditsCardProps) {\r\n  const { breakpoint } = useAppNavigationContext();\r\n\r\n  // Only renders in mobile overlay\r\n  if (breakpoint !== 'mobile') return null;\r\n\r\n  return (\r\n    <div\r\n      className={`flex flex-col bg-gray-950 rounded-lg gap-4 w-full px-4 pt-4 pb-[18px] ${onClick ? 'cursor-pointer' : ''}`}\r\n      onClick={onClick}\r\n    >\r\n      <div className=\"flex items-center justify-between\">\r\n        <span className=\"paragraph-xsmall-semibold text-white\">Créditos usados</span>\r\n        <span className=\"paragraph-xsmall-medium text-white/50\">{used} / {total}</span>\r\n      </div>\r\n      <Progress className=\"bg-white/10 h-[6px]\" indicatorColor=\"bg-white\" value={Math.round((used / total) * 100)} />\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";AAuBQ,cACA,YADA;AArBR,SAAS,+BAA+B;AACxC,SAAS,gBAAgB;AAQlB,SAAS,YAAY,EAAE,MAAM,OAAO,QAAQ,GAAqB;AACtE,QAAM,EAAE,WAAW,IAAI,wBAAwB;AAG/C,MAAI,eAAe,SAAU,QAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,yEAAyE,UAAU,mBAAmB,EAAE;AAAA,MACnH;AAAA,MAEA;AAAA,6BAAC,SAAI,WAAU,qCACb;AAAA,8BAAC,UAAK,WAAU,wCAAuC,gCAAe;AAAA,UACtE,qBAAC,UAAK,WAAU,yCAAyC;AAAA;AAAA,YAAK;AAAA,YAAI;AAAA,aAAM;AAAA,WAC1E;AAAA,QACA,oBAAC,YAAS,WAAU,uBAAsB,gBAAe,YAAW,OAAO,KAAK,MAAO,OAAO,QAAS,GAAG,GAAG;AAAA;AAAA;AAAA,EAC/G;AAEJ;","names":[]}

package/dist/components/navigation/subcomponents/NavItems.mjs

@@ -0,0 +1,25 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { NavItem } from "../NavItem";
+import { useNavItemsContext } from "../NavItemsContext";
+function NavItems({ items }) {
+  const { setNavItems } = useNavItemsContext();
+  useEffect(() => {
+    setNavItems(items);
+  }, [items, setNavItems]);
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: items.map((item) => /* @__PURE__ */ jsx(
+    NavItem,
+    {
+      label: item.label,
+      icon: item.icon,
+      isActive: item.isActive,
+      onClick: item.onClick
+    },
+    item.label
+  )) });
+}
+export {
+  NavItems
+};
+//# sourceMappingURL=NavItems.mjs.map

package/dist/components/navigation/subcomponents/NavItems.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/subcomponents/NavItems.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { ElementType, useEffect } from 'react';\r\nimport { NavItem } from '../NavItem';\r\nimport { useNavItemsContext } from '../NavItemsContext';\r\n\r\nexport interface NavItemConfig {\r\n  label: string;\r\n  isActive: boolean;\r\n  icon: ElementType;\r\n  onClick: () => void;\r\n}\r\n\r\ninterface NavItemsProps {\r\n  items: NavItemConfig[];\r\n}\r\n\r\nexport function NavItems({ items }: NavItemsProps) {\r\n  const { setNavItems } = useNavItemsContext();\r\n\r\n  useEffect(() => {\r\n    setNavItems(items);\r\n  }, [items, setNavItems]);\r\n\r\n  return (\r\n    <div className=\"flex flex-col\">\r\n      {items.map((item) => (\r\n        <NavItem\r\n          key={item.label}\r\n          label={item.label}\r\n          icon={item.icon}\r\n          isActive={item.isActive}\r\n          onClick={item.onClick}\r\n        />\r\n      ))}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";AA2BQ;AAzBR,SAAsB,iBAAiB;AACvC,SAAS,eAAe;AACxB,SAAS,0BAA0B;AAa5B,SAAS,SAAS,EAAE,MAAM,GAAkB;AACjD,QAAM,EAAE,YAAY,IAAI,mBAAmB;AAE3C,YAAU,MAAM;AACd,gBAAY,KAAK;AAAA,EACnB,GAAG,CAAC,OAAO,WAAW,CAAC;AAEvB,SACE,oBAAC,SAAI,WAAU,iBACZ,gBAAM,IAAI,CAAC,SACV;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO,KAAK;AAAA,MACZ,MAAM,KAAK;AAAA,MACX,UAAU,KAAK;AAAA,MACf,SAAS,KAAK;AAAA;AAAA,IAJT,KAAK;AAAA,EAKZ,CACD,GACH;AAEJ;","names":[]}

package/dist/components/navigation/subcomponents/PlanCard.mjs

@@ -0,0 +1,25 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button, Progress } from "../../../index";
+function PlanCard({ planName, trialLabel, progressValue, onKnowPlans }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col rounded-md p-4 gap-4 bg-gray-50", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950", children: planName }),
+      /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-medium text-gray-600", children: trialLabel })
+    ] }),
+    /* @__PURE__ */ jsx(Progress, { value: progressValue, className: "bg-(--color-progress-track)" }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "secondary",
+        className: "paragraph-small-semibold text-gray-950",
+        onClick: onKnowPlans,
+        children: "Conhe\xE7a os planos"
+      }
+    )
+  ] });
+}
+export {
+  PlanCard
+};
+//# sourceMappingURL=PlanCard.mjs.map

package/dist/components/navigation/subcomponents/PlanCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/subcomponents/PlanCard.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Button, Progress } from '../../../index';\r\n\r\nexport interface PlanCardProps {\r\n  planName: string;\r\n  trialLabel: string;\r\n  progressValue: number;\r\n  onKnowPlans: () => void;\r\n}\r\n\r\nexport function PlanCard({ planName, trialLabel, progressValue, onKnowPlans }: PlanCardProps) {\r\n  return (\r\n    <div className=\"flex flex-col rounded-md p-4 gap-4 bg-gray-50\">\r\n      <div className=\"flex flex-col gap-1\">\r\n        <span className=\"paragraph-small-semibold text-gray-950\">{planName}</span>\r\n        <span className=\"paragraph-xsmall-medium text-gray-600\">{trialLabel}</span>\r\n      </div>\r\n      <Progress value={progressValue} className=\"bg-(--color-progress-track)\" />\r\n      <Button\r\n        variant=\"secondary\"\r\n        className=\"paragraph-small-semibold text-gray-950\"\r\n        onClick={onKnowPlans}\r\n      >\r\n        Conheça os planos\r\n      </Button>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";AAcM,SACE,KADF;AAZN,SAAS,QAAQ,gBAAgB;AAS1B,SAAS,SAAS,EAAE,UAAU,YAAY,eAAe,YAAY,GAAkB;AAC5F,SACE,qBAAC,SAAI,WAAU,iDACb;AAAA,yBAAC,SAAI,WAAU,uBACb;AAAA,0BAAC,UAAK,WAAU,0CAA0C,oBAAS;AAAA,MACnE,oBAAC,UAAK,WAAU,yCAAyC,sBAAW;AAAA,OACtE;AAAA,IACA,oBAAC,YAAS,OAAO,eAAe,WAAU,+BAA8B;AAAA,IACxE;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,SAAS;AAAA,QACV;AAAA;AAAA,IAED;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/navigation/subcomponents/ProjectSelector.mjs

@@ -0,0 +1,130 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import { useMobileNavbarSheet } from "../../../store/useMobileNavbarSheet";
+import Image from "next/image";
+import { useAppNavigationContext } from "../AppNavigationContext";
+import { ProjectSelectorPopover } from "../ProjectSelectorPopover";
+import { UsersSelectorPopover } from "../../layouts/UsersSelectorPopover";
+import { Button, Command, CommandEmpty, CommandInput, CommandItem, CommandList } from "../../../index";
+import { ChevronDown, Plus, Settings } from "lucide-react";
+function ProjectItemSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "skeleton size-8 rounded-lg shrink-0" }),
+    /* @__PURE__ */ jsx("div", { className: "skeleton h-3.5 w-32 rounded" })
+  ] });
+}
+function ProjectSelector({
+  projects,
+  selectedProject,
+  isLoading,
+  onSelectProject,
+  onAddProject,
+  onManageProjects
+}) {
+  const { breakpoint } = useAppNavigationContext();
+  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
+  const [activeSection, setActiveSection] = useState(null);
+  const titleRef = useRef(null);
+  const { openProjectList, clearProjectList } = useMobileNavbarSheet();
+  useEffect(() => {
+    if (openProjectList && breakpoint === "mobile") {
+      setActiveSection("projects");
+      clearProjectList();
+    }
+  }, [openProjectList, breakpoint, clearProjectList]);
+  if (breakpoint === "desktop" || breakpoint === "md") {
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 truncate select-none", ref: titleRef, children: [
+        isLoading ? /* @__PURE__ */ jsx("div", { className: "skeleton h-4 w-32 rounded" }) : /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "cursor-pointer paragraph-medium-semibold text-gray-600 truncate w-[120px] inline-block",
+            onClick: () => setIsPopoverOpen((v) => !v),
+            children: selectedProject?.title
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ProjectSelectorPopover,
+          {
+            open: isPopoverOpen,
+            setOpen: setIsPopoverOpen,
+            titleRef,
+            projects,
+            selectedProject,
+            onSelectProject,
+            onAddProject,
+            onManageProjects
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx(UsersSelectorPopover, { projectId: selectedProject?.id }) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2.5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: selectedProject?.title }),
+        /* @__PURE__ */ jsx(
+          ChevronDown,
+          {
+            size: 20,
+            onClick: () => setActiveSection(activeSection === "projects" ? null : "projects"),
+            className: `transition-transform duration-200 cursor-pointer ${activeSection === "projects" ? "rotate-180 text-gray-950" : "text-gray-400"}`
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(UsersSelectorPopover, { projectId: selectedProject?.id })
+    ] }),
+    activeSection === "projects" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: "Projetos" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsxs(Button, { variant: "secondary", className: "h-8! paragraph-small-semibold text-gray-950", onClick: onAddProject, children: [
+            /* @__PURE__ */ jsx(Plus, { size: 16 }),
+            "Adicionar"
+          ] }),
+          /* @__PURE__ */ jsx(Button, { variant: "secondary", className: "p-0 size-8", onClick: onManageProjects, children: /* @__PURE__ */ jsx(Settings, { size: 18 }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(Command, { className: "gap-2", children: [
+        /* @__PURE__ */ jsx(CommandInput, { placeholder: "Busque aqui" }),
+        /* @__PURE__ */ jsxs(CommandList, { className: "custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]", children: [
+          /* @__PURE__ */ jsx(CommandEmpty, { children: "Nenhum resultado encontrado." }),
+          isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(ProjectItemSkeleton, {}),
+            /* @__PURE__ */ jsx(ProjectItemSkeleton, {})
+          ] }) : projects.map((project) => /* @__PURE__ */ jsxs(
+            CommandItem,
+            {
+              value: project.title,
+              className: selectedProject?.id === project.id ? "bg-gray-50" : "",
+              onSelect: () => {
+                onSelectProject(project);
+                setActiveSection(null);
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  Image,
+                  {
+                    alt: "Icon Project",
+                    src: project.photo ? `${process.env.NEXT_PUBLIC_STORAGE_URL}/${project.photo}` : "/images/Logomark.png",
+                    width: 32,
+                    height: 32,
+                    className: "rounded-lg"
+                  }
+                ),
+                project.title
+              ]
+            },
+            project.id
+          ))
+        ] })
+      ] })
+    ] })
+  ] });
+}
+export {
+  ProjectSelector
+};
+//# sourceMappingURL=ProjectSelector.mjs.map

package/dist/components/navigation/subcomponents/ProjectSelector.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/navigation/subcomponents/ProjectSelector.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useState, useRef, useEffect, RefObject } from 'react';\r\nimport { useMobileNavbarSheet } from '../../../store/useMobileNavbarSheet';\r\nimport Image from 'next/image';\r\nimport { useAppNavigationContext } from '../AppNavigationContext';\r\nimport { ProjectSelectorPopover } from '../ProjectSelectorPopover';\r\nimport { UsersSelectorPopover } from '../../layouts/UsersSelectorPopover';\r\nimport { Button, Command, CommandEmpty, CommandInput, CommandItem, CommandList } from '../../../index';\r\nimport { ChevronDown, Plus, Settings } from 'lucide-react';\r\nimport type { NavigationProject } from '../types';\r\n\r\nexport interface ProjectSelectorProps {\r\n  projects: NavigationProject[];\r\n  selectedProject: NavigationProject | null;\r\n  isLoading?: boolean;\r\n  onSelectProject: (project: NavigationProject) => void;\r\n  onAddProject: () => void;\r\n  onManageProjects: () => void;\r\n}\r\n\r\nfunction ProjectItemSkeleton() {\r\n  return (\r\n    <div className=\"flex items-center gap-2 p-2\">\r\n      <div className=\"skeleton size-8 rounded-lg shrink-0\" />\r\n      <div className=\"skeleton h-3.5 w-32 rounded\" />\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function ProjectSelector({\r\n  projects,\r\n  selectedProject,\r\n  isLoading,\r\n  onSelectProject,\r\n  onAddProject,\r\n  onManageProjects,\r\n}: ProjectSelectorProps) {\r\n  const { breakpoint } = useAppNavigationContext();\r\n  const [isPopoverOpen, setIsPopoverOpen] = useState(false);\r\n  const [activeSection, setActiveSection] = useState<'projects' | null>(null);\r\n  const titleRef = useRef<HTMLDivElement>(null);\r\n  const { openProjectList, clearProjectList } = useMobileNavbarSheet();\r\n\r\n  useEffect(() => {\r\n    if (openProjectList && breakpoint === 'mobile') {\r\n      setActiveSection('projects');\r\n      clearProjectList();\r\n    }\r\n  }, [openProjectList, breakpoint, clearProjectList]);\r\n\r\n  // Desktop and md: title + popover + users selector (same visual as current gpages sidebars)\r\n  if (breakpoint === 'desktop' || breakpoint === 'md') {\r\n    return (\r\n      <div className=\"flex items-center justify-between\">\r\n        <div className=\"flex items-center gap-2 truncate select-none\" ref={titleRef}>\r\n          {isLoading ? (\r\n            <div className=\"skeleton h-4 w-32 rounded\" />\r\n          ) : (\r\n            <span\r\n              className=\"cursor-pointer paragraph-medium-semibold text-gray-600 truncate w-[120px] inline-block\"\r\n              onClick={() => setIsPopoverOpen((v) => !v)}\r\n            >\r\n              {selectedProject?.title}\r\n            </span>\r\n          )}\r\n          <ProjectSelectorPopover\r\n            open={isPopoverOpen}\r\n            setOpen={setIsPopoverOpen}\r\n            titleRef={titleRef as unknown as RefObject<HTMLSpanElement | null>}\r\n            projects={projects}\r\n            selectedProject={selectedProject}\r\n            onSelectProject={onSelectProject}\r\n            onAddProject={onAddProject}\r\n            onManageProjects={onManageProjects}\r\n          />\r\n        </div>\r\n        <div className=\"flex items-center gap-2\">\r\n          <UsersSelectorPopover projectId={selectedProject?.id} />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  // Mobile: inline collapsible accordion\r\n  return (\r\n    <div className=\"flex flex-col gap-2.5\">\r\n      <div className=\"flex items-center justify-between\">\r\n        <div className=\"flex items-center gap-1\">\r\n          <span className=\"paragraph-medium-semibold text-gray-600\">{selectedProject?.title}</span>\r\n          <ChevronDown\r\n            size={20}\r\n            onClick={() => setActiveSection(activeSection === 'projects' ? null : 'projects')}\r\n            className={`transition-transform duration-200 cursor-pointer ${\r\n              activeSection === 'projects' ? 'rotate-180 text-gray-950' : 'text-gray-400'\r\n            }`}\r\n          />\r\n        </div>\r\n        <UsersSelectorPopover projectId={selectedProject?.id} />\r\n      </div>\r\n      {activeSection === 'projects' && (\r\n        <div className=\"flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400\">\r\n          <div className=\"flex items-center justify-between\">\r\n            <span className=\"paragraph-small-semibold\">Projetos</span>\r\n            <div className=\"flex items-center gap-1.5\">\r\n              <Button variant=\"secondary\" className=\"h-8! paragraph-small-semibold text-gray-950\" onClick={onAddProject}>\r\n                <Plus size={16} />\r\n                Adicionar\r\n              </Button>\r\n              <Button variant=\"secondary\" className=\"p-0 size-8\" onClick={onManageProjects}>\r\n                <Settings size={18} />\r\n              </Button>\r\n            </div>\r\n          </div>\r\n          <Command className=\"gap-2\">\r\n            <CommandInput placeholder=\"Busque aqui\" />\r\n            <CommandList className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]\">\r\n              <CommandEmpty>Nenhum resultado encontrado.</CommandEmpty>\r\n              {isLoading ? (\r\n                <>\r\n                  <ProjectItemSkeleton />\r\n                  <ProjectItemSkeleton />\r\n                </>\r\n              ) : (\r\n                projects.map((project) => (\r\n                  <CommandItem\r\n                    key={project.id}\r\n                    value={project.title}\r\n                    className={selectedProject?.id === project.id ? 'bg-gray-50' : ''}\r\n                    onSelect={() => { onSelectProject(project); setActiveSection(null); }}\r\n                  >\r\n                    <Image\r\n                      alt=\"Icon Project\"\r\n                      src={\r\n                        project.photo\r\n                          ? `${process.env.NEXT_PUBLIC_STORAGE_URL}/${project.photo}`\r\n                          : '/images/Logomark.png'\r\n                      }\r\n                      width={32}\r\n                      height={32}\r\n                      className=\"rounded-lg\"\r\n                    />\r\n                    {project.title}\r\n                  </CommandItem>\r\n                ))\r\n              )}\r\n            </CommandList>\r\n          </Command>\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/components/navigation/types.mjs

@@ -0,0 +1 @@
+//# sourceMappingURL=types.mjs.map

package/dist/components/navigation/types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}