organify-ui 0.3.11 → 0.3.13

package/dist/index.js

@@ -1,19 +1,19 @@
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-SAYB3NN2.js';
-export { NotificationBell, NotificationItem, NotificationList, OrganifyNotifications, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PresenceAvatarStack, PresenceIndicator, useNotifications, usePresence } from './chunk-SAYB3NN2.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-W2Z7VRCR.js';
+export { NotificationBell, NotificationItem, NotificationList, OrganifyNotifications, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PresenceAvatarStack, PresenceIndicator, useNotifications, usePresence } from './chunk-W2Z7VRCR.js';
 export { createAiClient, useAiChat, useAiCommand, useAiSuggest, useAiUsage } from './chunk-NV4RWAQ2.js';
 export { I18nProvider, createTranslator, useI18n } from './chunk-FQA33MF4.js';
 export { ThemeProvider, useTheme } from './chunk-RFOKENE3.js';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerDescription, Separator, ResponsiveDialog, Label, Input, Textarea, Button, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-HFX2XZKZ.js';
-export { AiChatSidebar, Alert, Button, ChatMessages, ChatSidebar, CommandBar, CreateRoomDialog, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, InlineAiButton, Input, Label, MOCK_PROJECTS, MOCK_USERS, OrgLoader, OrgLoaderInline, OrganifyChat, ResponsiveDialog, RoomManagementPanel, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TypingIndicatorMock, alertVariants, buttonVariants, generateAutoReplies, getMockMentionOptions, getRoomPermissions, inputVariants, orgLoaderVariants, typingIndicator, useAiInline, useChat } from './chunk-HFX2XZKZ.js';
-import { cn, Avatar, AvatarImage, AvatarFallback, TooltipProvider, Tooltip, TooltipTrigger, TooltipContent, Skeleton, useOrganify, useOrganifyGql, ScrollArea, useOrganifyUser, useOrganifyApi, Badge, useOrganifyWorkspace, useOrganifyNavigation, useOrganifyProject } from './chunk-VHQZS77G.js';
-export { Avatar, AvatarFallback, AvatarImage, Badge, OrganifyContext, OrganifyProvider, ScrollArea, ScrollBar, Skeleton, SkeletonCard, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, avatarVariants, badgeVariants, cn, useOrganify, useOrganifyApi, useOrganifyGql, useOrganifyNavigation, useOrganifyProject, useOrganifyRest, useOrganifyUser, useOrganifyWorkspace } from './chunk-VHQZS77G.js';
-import { OrgDiamond, OrgPlus, OrgComment, OrgEdit, OrgTrash, OrgCheckCircle, OrgAttachment, OrgCalendar, OrgMail, OrgBoard, OrgSprint, OrgRocket, OrgWarning, OrgFlag, OrgShield, OrgZap, OrgStar } from './chunk-MZKEDV5W.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, ResponsiveDialog, Separator, Label, Input, Textarea, Button, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-UMUOHUGU.js';
+export { AiChatSidebar, Alert, Button, ChatMessages, ChatSidebar, CommandBar, CreateRoomDialog, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, InlineAiButton, Input, Label, MOCK_PROJECTS, MOCK_USERS, OrgLoader, OrgLoaderInline, OrganifyChat, ResponsiveDialog, RoomManagementPanel, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TypingIndicatorMock, alertVariants, buttonVariants, generateAutoReplies, getMockMentionOptions, getRoomPermissions, inputVariants, orgLoaderVariants, typingIndicator, useAiInline, useChat } from './chunk-UMUOHUGU.js';
+import { cn, Avatar, AvatarImage, AvatarFallback, TooltipProvider, Tooltip, TooltipTrigger, TooltipContent, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerDescription, Skeleton, useOrganify, useOrganifyGql, useOrganifyUser, useOrganifyApi, Badge, ScrollArea, useOrganifyWorkspace, useOrganifyNavigation, useOrganifyProject } from './chunk-XTMS6DXV.js';
+export { Avatar, AvatarFallback, AvatarImage, Badge, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, OrganifyContext, OrganifyProvider, ScrollArea, ScrollBar, Skeleton, SkeletonCard, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, avatarVariants, badgeVariants, cn, useOrganify, useOrganifyApi, useOrganifyGql, useOrganifyNavigation, useOrganifyProject, useOrganifyRest, useOrganifyUser, useOrganifyWorkspace } from './chunk-XTMS6DXV.js';
+import { OrgDiamond, OrgPlus, OrgComment, OrgEdit, OrgTrash, OrgSprint, OrgCheckCircle, OrgAttachment, OrgCalendar, OrgMail, OrgBoard, OrgRocket, OrgWarning, OrgFlag, OrgShield, OrgZap, OrgStar } from './chunk-MZKEDV5W.js';
 export { OrgAI, OrgActivity, OrgArrowLeft, OrgArrowRight, OrgAttachment, OrgBell, OrgBoard, OrgCalendar, OrgCelebrate, OrgChart, OrgChat, OrgCheck, OrgCheckCircle, OrgChevronDown, OrgChevronLeft, OrgChevronRight, OrgChevronUp, OrgClock, OrgClose, OrgComment, OrgCopy, OrgCreditCard, OrgDeveloper, OrgDiamond, OrgDoor, OrgDownload, OrgEdit, OrgError, OrgExecutive, OrgEye, OrgEyeOff, OrgFile, OrgFilter, OrgFlag, OrgFolder, OrgGauge, OrgGlobe, OrgGrid, OrgHeart, OrgHome, OrgInfo, OrgIntegration, OrgLink, OrgList, OrgLock, OrgLogo, OrgLogout, OrgMail, OrgMention, OrgMenu, OrgMoon, OrgPMO, OrgPause, OrgPlay, OrgPlus, OrgProjectManager, OrgReport, OrgRocket, OrgSearch, OrgSettings, OrgShield, OrgSort, OrgSprint, OrgStakeholder, OrgStar, OrgSun, OrgTag, OrgTarget, OrgTeam, OrgTrash, OrgTutorial, OrgUnlock, OrgUpload, OrgUser, OrgWarning, OrgWave, OrgWordmark, OrgWorkflow, OrgWorkspace, OrgZap } from './chunk-MZKEDV5W.js';
 import * as React5 from 'react';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
-import { X, XIcon, GripVertical, Check, ChevronRight, Circle, Search, MoreHorizontal, AlertCircle, AlertTriangle, CheckCircle2, Info, Sparkles, Plus, Trash2, Calendar } from 'lucide-react';
+import { X, XIcon, GripVertical, Check, ChevronRight, Circle, Search, MoreHorizontal, AlertCircle, AlertTriangle, CheckCircle2, Info, Sparkles, Plus, Zap, Trash2, Calendar } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
@@ -33,7 +33,7 @@ var Toggle = React5.forwardRef(({ className, label, description, ...props }, ref
       "div",
       {
         className: cn(
-          "flex items-center justify-between border border-white/10 bg-white/[0.03] rounded-xl p-4 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)]",
+          "flex items-center justify-between border border-primary/15 bg-white/[0.03] rounded-xl p-4 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)]",
           className
         ),
         children: [
@@ -46,9 +46,9 @@ var Toggle = React5.forwardRef(({ className, label, description, ...props }, ref
             {
               id,
               ref,
-              className: "peer inline-flex h-5 w-10 shrink-0 cursor-pointer items-center rounded-full border border-white/10 bg-black/40 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)] data-[state=checked]:border-primary-light data-[state=checked]:bg-primary/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-light",
+              className: "peer inline-flex h-5 w-10 shrink-0 cursor-pointer items-center rounded-full border border-primary/15 bg-black/40 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)] data-[state=checked]:border-primary-light data-[state=checked]:bg-primary/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-light",
               ...props,
-              children: /* @__PURE__ */ jsx(SwitchPrimitive.Thumb, { className: "pointer-events-none block h-4 w-4 border border-white/10 bg-white/20 transition-transform data-[state=checked]:translate-x-5 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=unchecked]:translate-x-0" })
+              children: /* @__PURE__ */ jsx(SwitchPrimitive.Thumb, { className: "pointer-events-none block h-4 w-4 border border-primary/15 bg-white/20 transition-transform data-[state=checked]:translate-x-5 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=unchecked]:translate-x-0" })
             }
           )
         ]
@@ -60,11 +60,11 @@ var Toggle = React5.forwardRef(({ className, label, description, ...props }, ref
     {
       ref,
       className: cn(
-        "peer inline-flex h-5 w-10 shrink-0 cursor-pointer items-center rounded-full border border-white/10 bg-black/40 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)] data-[state=checked]:border-primary-light data-[state=checked]:bg-primary/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-light",
+        "peer inline-flex h-5 w-10 shrink-0 cursor-pointer items-center rounded-full border border-primary/15 bg-black/40 transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)] data-[state=checked]:border-primary-light data-[state=checked]:bg-primary/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-light",
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx(SwitchPrimitive.Thumb, { className: "pointer-events-none block h-4 w-4 border border-white/10 bg-white/20 transition-transform data-[state=checked]:translate-x-5 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=unchecked]:translate-x-0" })
+      children: /* @__PURE__ */ jsx(SwitchPrimitive.Thumb, { className: "pointer-events-none block h-4 w-4 border border-primary/15 bg-white/20 transition-transform data-[state=checked]:translate-x-5 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=unchecked]:translate-x-0" })
     }
   );
 });
@@ -378,7 +378,7 @@ function TaskDetailPanel({
       {
         className: cn(
           "max-w-2xl max-h-[85vh] overflow-y-auto",
-          "border border-white/20 bg-white/[0.03] backdrop-blur-[40px]",
+          "border border-primary/25 bg-white/[0.03] backdrop-blur-[40px]",
           "shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)] rounded-2xl"
         ),
         children: [
@@ -396,7 +396,7 @@ function TaskDetailPanel({
     {
       className: cn(
         "max-h-[90vh]",
-        "border-t border-white/20 bg-white/[0.03] backdrop-blur-[40px]"
+        "border-t border-primary/25 bg-white/[0.03] backdrop-blur-[40px]"
       ),
       children: [
         (title || subtitle) && /* @__PURE__ */ jsxs(DrawerHeader, { className: "text-left", children: [
@@ -667,7 +667,7 @@ function Dock({ items, position = "bottom", className, ...props }) {
         "nav",
         {
           className: cn(
-            "flex items-center gap-1 rounded-2xl border border-white/20",
+            "flex items-center gap-1 rounded-2xl border border-primary/25",
             "bg-white/[0.03] px-3 py-2 shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)] backdrop-blur-[40px]",
             "transition-shadow duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)]"
           ),
@@ -745,7 +745,7 @@ function isSeparator(entry) {
   return "type" in entry && entry.type === "separator";
 }
 var sidebarVariants = cva(
-  "fixed left-0 top-0 z-40 flex h-full flex-col border-r border-white/10 bg-white/[0.02] backdrop-blur-[40px] motion-safe:transition-all motion-safe:duration-[400ms] ease-in-out",
+  "fixed left-0 top-0 z-40 flex h-full flex-col border-r border-primary/15 bg-white/[0.02] backdrop-blur-[40px] motion-safe:transition-all motion-safe:duration-[400ms] ease-in-out",
   {
     variants: {
       state: {
@@ -759,6 +759,7 @@ var sidebarVariants = cva(
 function DockSidebar({
   items,
   bottomItems,
+  bottomExtra,
   header,
   expanded = false,
   onExpandedChange,
@@ -811,51 +812,58 @@ function DockSidebar({
         onMouseLeave: () => hoverExpand && onExpandedChange?.(false),
         ...props,
         children: [
-          /* @__PURE__ */ jsxs("div", { className: cn(
-            "flex items-center px-3 h-16 border-b border-white/10",
-            expanded || mobileOpen ? "justify-between" : "justify-center"
-          ), children: [
-            header,
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
-              mobileOpen && /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: onMobileClose,
-                  "aria-label": "Fechar menu",
-                  className: "flex h-7 w-7 items-center justify-center rounded-xl text-org-text-muted hover:bg-white/[0.05] hover:text-org-text sm:hidden",
-                  children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M4 4L12 12M12 4L4 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
-                }
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "data-tour": "workspace-switcher",
+              className: cn(
+                "flex items-center px-3 h-16 border-b border-primary/15",
+                expanded || mobileOpen ? "justify-between" : "justify-center"
               ),
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: handleToggle,
-                  "aria-label": expanded ? "Collapse sidebar" : "Expand sidebar",
-                  className: cn(
-                    "hidden sm:flex h-7 w-7 items-center justify-center rounded-xl",
-                    "text-org-text-muted transition-all hover:bg-white/[0.05] hover:text-org-text"
+              children: [
+                header,
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+                  mobileOpen && /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: onMobileClose,
+                      "aria-label": "Fechar menu",
+                      className: "flex h-7 w-7 items-center justify-center rounded-xl text-org-text-muted hover:bg-white/[0.05] hover:text-org-text sm:hidden",
+                      children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M4 4L12 12M12 4L4 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
+                    }
                   ),
-                  children: /* @__PURE__ */ jsx(
-                    "svg",
+                  /* @__PURE__ */ jsx(
+                    "button",
                     {
-                      width: "16",
-                      height: "16",
-                      viewBox: "0 0 16 16",
-                      fill: "none",
+                      type: "button",
+                      onClick: handleToggle,
+                      "aria-label": expanded ? "Collapse sidebar" : "Expand sidebar",
                       className: cn(
-                        "transition-transform duration-[400ms]",
-                        expanded ? "rotate-0" : "rotate-180"
+                        "hidden sm:flex h-7 w-7 items-center justify-center rounded-xl",
+                        "text-org-text-muted transition-all hover:bg-white/[0.05] hover:text-org-text"
                       ),
-                      children: /* @__PURE__ */ jsx("path", { d: "M10 12L6 8L10 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+                      children: /* @__PURE__ */ jsx(
+                        "svg",
+                        {
+                          width: "16",
+                          height: "16",
+                          viewBox: "0 0 16 16",
+                          fill: "none",
+                          className: cn(
+                            "transition-transform duration-[400ms]",
+                            expanded ? "rotate-0" : "rotate-180"
+                          ),
+                          children: /* @__PURE__ */ jsx("path", { d: "M10 12L6 8L10 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+                        }
+                      )
                     }
                   )
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx("nav", { className: "flex-1 overflow-y-auto overflow-x-hidden py-2 px-2 space-y-0.5", children: items.map((entry, i) => /* @__PURE__ */ jsx(
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("nav", { "data-tour": "main-nav", className: "flex-1 overflow-y-auto overflow-x-hidden py-2 px-2 space-y-0.5", children: items.map((entry, i) => /* @__PURE__ */ jsx(
             SidebarEntry,
             {
               entry,
@@ -865,16 +873,19 @@ function DockSidebar({
             },
             isSeparator(entry) ? `sep-${i}` : entry.id
           )) }),
-          bottomItems && bottomItems.length > 0 && /* @__PURE__ */ jsx("div", { className: "border-t border-white/10 py-2 px-2 space-y-0.5", children: bottomItems.map((entry, i) => /* @__PURE__ */ jsx(
-            SidebarEntry,
-            {
-              entry,
-              expanded: expanded || mobileOpen,
-              renderLink,
-              onNavigate: mobileOpen ? onMobileClose : void 0
-            },
-            isSeparator(entry) ? `bsep-${i}` : entry.id
-          )) })
+          (bottomExtra || bottomItems && bottomItems.length > 0) && /* @__PURE__ */ jsxs("div", { className: "border-t border-primary/15 py-2 px-2 space-y-0.5", children: [
+            bottomExtra && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-1", children: bottomExtra }),
+            bottomItems && bottomItems.map((entry, i) => /* @__PURE__ */ jsx(
+              SidebarEntry,
+              {
+                entry,
+                expanded: expanded || mobileOpen,
+                renderLink,
+                onNavigate: mobileOpen ? onMobileClose : void 0
+              },
+              isSeparator(entry) ? `bsep-${i}` : entry.id
+            ))
+          ] })
         ]
       }
     )
@@ -908,7 +919,7 @@ function SidebarButton({
   renderLink,
   onNavigate
 }) {
-  const { icon, label, href, onClick, active, badge, disabled } = item;
+  const { icon, label, href, onClick, active, badge, disabled, id } = item;
   const handleClick = () => {
     onClick?.();
     onNavigate?.();
@@ -1010,6 +1021,17 @@ var DELETE_WORKSPACE_MUTATION = `
     }
   }
 `;
+function useMediaQuery2(query) {
+  const [matches, setMatches] = React5.useState(false);
+  React5.useEffect(() => {
+    const mql = window.matchMedia(query);
+    setMatches(mql.matches);
+    const handler = (e) => setMatches(e.matches);
+    mql.addEventListener("change", handler);
+    return () => mql.removeEventListener("change", handler);
+  }, [query]);
+  return matches;
+}
 function WorkspaceSwitcher({ compact = false, onCreateWorkspace, className }) {
   const {
     workspace,
@@ -1026,7 +1048,9 @@ function WorkspaceSwitcher({ compact = false, onCreateWorkspace, className }) {
   const [editingWorkspace, setEditingWorkspace] = React5.useState(null);
   const [deletingWorkspace, setDeletingWorkspace] = React5.useState(null);
   const dropdownRef = React5.useRef(null);
+  const isMobile = useMediaQuery2("(max-width: 767px)");
   React5.useEffect(() => {
+    if (isMobile) return;
     function handleClickOutside(event) {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         setIsOpen(false);
@@ -1034,7 +1058,7 @@ function WorkspaceSwitcher({ compact = false, onCreateWorkspace, className }) {
     }
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, []);
+  }, [isMobile]);
   const handleCreateWorkspace = React5.useCallback(
     async (data) => {
       const optimisticId = `temp-${Date.now()}`;
@@ -1158,7 +1182,7 @@ function WorkspaceSwitcher({ compact = false, onCreateWorkspace, className }) {
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ jsx(
+    isOpen && !isMobile && /* @__PURE__ */ jsx(
       SwitcherDropdown,
       {
         workspaces,
@@ -1180,6 +1204,37 @@ function WorkspaceSwitcher({ compact = false, onCreateWorkspace, className }) {
         }
       }
     ),
+    isMobile && /* @__PURE__ */ jsx(
+      ResponsiveDialog,
+      {
+        open: isOpen,
+        onOpenChange: setIsOpen,
+        contentClassName: "max-w-full sm:max-w-full",
+        children: /* @__PURE__ */ jsx(
+          SwitcherDropdown,
+          {
+            mobile: true,
+            workspaces,
+            currentSlug: workspace?.slug,
+            loading: workspacesLoading,
+            renderLink,
+            onClose: () => setIsOpen(false),
+            onCreateClick: () => {
+              setIsOpen(false);
+              setCreateDialogOpen(true);
+            },
+            onEditClick: (ws) => {
+              setIsOpen(false);
+              setEditingWorkspace(ws);
+            },
+            onDeleteClick: (ws) => {
+              setIsOpen(false);
+              setDeletingWorkspace(ws);
+            }
+          }
+        )
+      }
+    ),
     /* @__PURE__ */ jsx(
       CreateWorkspaceInlineDialog,
       {
@@ -1235,6 +1290,7 @@ function SwitcherChevron({ open }) {
   );
 }
 function SwitcherDropdown({
+  mobile = false,
   workspaces,
   currentSlug,
   loading,
@@ -1244,52 +1300,61 @@ function SwitcherDropdown({
   onEditClick,
   onDeleteClick
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: "absolute top-full left-0 mt-1 w-64 rounded-xl border border-white/20 bg-white/[0.03] backdrop-blur-[40px] shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)] z-50 overflow-hidden", children: [
-    /* @__PURE__ */ jsx("div", { className: "px-3 py-2 text-xs font-medium uppercase tracking-wider text-theme-muted border-b border-white/10", children: "Workspaces" }),
-    /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-64", children: /* @__PURE__ */ jsx("div", { className: "py-1", children: loading ? /* @__PURE__ */ jsx("div", { className: "space-y-1 px-3 py-2", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 py-2", children: [
-      /* @__PURE__ */ jsx(Skeleton, { className: "w-7 h-7", variant: "rounded" }),
-      /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-1.5", children: [
-        /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-24" }),
-        /* @__PURE__ */ jsx(Skeleton, { className: "h-2.5 w-16" })
-      ] })
-    ] }, i)) }) : workspaces.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "px-3 py-6 text-center", children: [
-      /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Nenhum workspace encontrado" }),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          onClick: onCreateClick,
-          className: "inline-flex items-center gap-1.5 text-xs font-medium text-primary-light hover:text-primary transition-colors",
-          children: [
-            /* @__PURE__ */ jsx(OrgPlus, { className: "w-3.5 h-3.5" }),
-            "Criar primeiro workspace"
-          ]
-        }
-      )
-    ] }) : workspaces.map((ws) => /* @__PURE__ */ jsx(
-      SwitcherItem,
-      {
-        ws,
-        isActive: ws.slug === currentSlug,
-        renderLink,
-        onClose,
-        onEdit: () => onEditClick?.(ws),
-        onDelete: () => onDeleteClick?.(ws)
-      },
-      ws.id
-    )) }) }),
-    /* @__PURE__ */ jsx(Separator, {}),
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        onClick: onCreateClick,
-        className: "flex items-center gap-2 px-3 py-2.5 text-sm text-primary-light transition-colors hover:bg-theme-subtle w-full text-left",
-        children: [
-          /* @__PURE__ */ jsx(OrgPlus, { className: "w-4 h-4" }),
-          /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Criar workspace" })
-        ]
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "rounded-xl border border-primary/20 bg-[linear-gradient(165deg,rgba(22,26,40,0.92),rgba(11,14,24,0.94))] backdrop-blur-[40px] shadow-[0_24px_80px_-15px_rgba(0,0,0,0.55)] overflow-hidden",
+        mobile ? "w-full" : "absolute top-full left-0 mt-1 w-64 z-50"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "px-3 py-2 text-xs font-medium uppercase tracking-wider text-theme-muted border-b border-primary/15", children: "Workspaces" }),
+        /* @__PURE__ */ jsx("div", { className: "max-h-64 overflow-y-auto overscroll-contain scrollbar-thin scrollbar-thumb-white/15 scrollbar-track-transparent", children: /* @__PURE__ */ jsx("div", { className: "py-1", children: loading ? /* @__PURE__ */ jsx("div", { className: "space-y-1 px-3 py-2", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 py-2", children: [
+          /* @__PURE__ */ jsx(Skeleton, { className: "w-7 h-7", variant: "rounded" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-24" }),
+            /* @__PURE__ */ jsx(Skeleton, { className: "h-2.5 w-16" })
+          ] })
+        ] }, i)) }) : workspaces.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "px-3 py-6 text-center", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Nenhum workspace encontrado" }),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: onCreateClick,
+              className: "inline-flex items-center gap-1.5 text-xs font-medium text-primary-light hover:text-primary transition-colors",
+              children: [
+                /* @__PURE__ */ jsx(OrgPlus, { className: "w-3.5 h-3.5" }),
+                "Criar primeiro workspace"
+              ]
+            }
+          )
+        ] }) : workspaces.map((ws) => /* @__PURE__ */ jsx(
+          SwitcherItem,
+          {
+            ws,
+            isActive: ws.slug === currentSlug,
+            renderLink,
+            onClose,
+            onEdit: () => onEditClick?.(ws),
+            onDelete: () => onDeleteClick?.(ws)
+          },
+          ws.id
+        )) }) }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: onCreateClick,
+            className: "flex items-center gap-2 px-3 py-2.5 text-sm text-primary-light transition-colors hover:bg-theme-subtle w-full text-left",
+            children: [
+              /* @__PURE__ */ jsx(OrgPlus, { className: "w-4 h-4" }),
+              /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Criar workspace" })
+            ]
+          }
+        )
+      ]
+    }
+  );
 }
 function SwitcherItem({
   ws,
@@ -5261,7 +5326,7 @@ var statusColors = {
   BLOCKED: "bg-rose-500/15 text-rose-400 border-rose-500/30",
   DONE: "bg-emerald-500/15 text-emerald-400 border-emerald-500/30"
 };
-function useMediaQuery2(query) {
+function useMediaQuery3(query) {
   const [matches, setMatches] = React5.useState(false);
   React5.useEffect(() => {
     const mql = window.matchMedia(query);
@@ -5379,6 +5444,68 @@ function EditableDate({ value, onSave, placeholder = "Adicionar data" }) {
     }
   );
 }
+function EditableStoryPoints({ value, onSave }) {
+  const [editing, setEditing] = React5.useState(false);
+  const [localValue, setLocalValue] = React5.useState(value !== void 0 ? String(value) : "");
+  const inputRef = React5.useRef(null);
+  React5.useEffect(() => {
+    setLocalValue(value !== void 0 ? String(value) : "");
+  }, [value]);
+  React5.useEffect(() => {
+    if (editing && inputRef.current) {
+      inputRef.current.focus();
+      inputRef.current.select();
+    }
+  }, [editing]);
+  const handleSave = () => {
+    setEditing(false);
+    const parsed = localValue === "" ? void 0 : parseFloat(localValue);
+    if (parsed !== value) {
+      onSave(isNaN(parsed) ? void 0 : parsed);
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      handleSave();
+    }
+    if (e.key === "Escape") {
+      setLocalValue(value !== void 0 ? String(value) : "");
+      setEditing(false);
+    }
+  };
+  if (editing) {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: inputRef,
+        type: "number",
+        min: 0,
+        step: 0.5,
+        value: localValue,
+        onChange: (e) => setLocalValue(e.target.value),
+        onBlur: handleSave,
+        onKeyDown: handleKeyDown,
+        placeholder: "0",
+        className: "w-28 bg-theme-subtle backdrop-blur-md border border-theme-subtle px-3 py-1.5 text-sm font-light text-theme transition-all rounded-xl focus:outline-none focus:shadow-[0_0_0_3px_rgba(99,102,241,0.10),0_0_20px_rgba(99,102,241,0.08)] focus:border-primary-light/50"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      onClick: () => setEditing(true),
+      className: cn(
+        "flex items-center gap-2 px-2 py-1 -mx-2 rounded hover:bg-theme-highlight transition-colors text-sm",
+        value == null && "text-theme-muted italic"
+      ),
+      children: value != null ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 font-semibold", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-primary-light", children: value }),
+        /* @__PURE__ */ jsx("span", { className: "text-theme-muted text-xs", children: "pts" })
+      ] }) : /* @__PURE__ */ jsx("span", { className: "text-theme-muted italic", children: "Adicionar" })
+    }
+  );
+}
 function LabelItem({ label, onRemove, showDelete = true }) {
   return /* @__PURE__ */ jsxs("div", { className: "group relative inline-flex", children: [
     /* @__PURE__ */ jsx(
@@ -5875,6 +6002,22 @@ function TaskDetailContent({
         )
       ] })
     ] }),
+    task.storyPoints !== void 0 || onUpdate ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Separator, { className: "bg-theme-subtle" }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxs("label", { className: "text-xs font-medium text-theme-muted uppercase tracking-wide flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx(Zap, { className: "w-3 h-3" }),
+          "Story Points"
+        ] }),
+        /* @__PURE__ */ jsx(
+          EditableStoryPoints,
+          {
+            value: task.storyPoints,
+            onSave: (v) => handleFieldUpdate("storyPoints", v)
+          }
+        )
+      ] })
+    ] }) : null,
     /* @__PURE__ */ jsx(Separator, { className: "bg-theme-subtle" }),
     /* @__PURE__ */ jsx(
       SubtaskSection,
@@ -5972,7 +6115,7 @@ function TaskDetailSheet({
   availableStatuses = defaultStatuses,
   availablePriorities = defaultPriorities
 }) {
-  const isDesktop = useMediaQuery2("(min-width: 768px)");
+  const isDesktop = useMediaQuery3("(min-width: 768px)");
   const content = loading ? /* @__PURE__ */ jsx(TaskDetailSkeleton2, {}) : task ? /* @__PURE__ */ jsx(
     TaskDetailContent,
     {
@@ -6218,7 +6361,8 @@ function TaskCard({
               "#",
               task.number
             ] }),
-            task.storyPoints != null && task.storyPoints > 0 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-theme-subtle/50", children: [
+            task.storyPoints != null && task.storyPoints > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-0.5 text-[10px] px-1.5 py-0.5 rounded-md bg-primary/10 text-primary-light border border-primary/25 font-medium", children: [
+              /* @__PURE__ */ jsx(OrgSprint, { className: "w-2.5 h-2.5" }),
               task.storyPoints,
               "pt"
             ] }),
@@ -6263,14 +6407,14 @@ function TaskCard({
                   src: assignee.avatarUrl,
                   size: "sm",
                   showHoverInfo: true,
-                  className: "h-5 w-5 border border-white/10"
+                  className: "h-5 w-5 border border-primary/20"
                 },
                 assignee.id
               )),
               task.assignees.length > 2 && /* @__PURE__ */ jsxs(
                 "div",
                 {
-                  className: "w-5 h-5 rounded-full bg-white/[0.05] flex items-center justify-center text-[10px] font-bold text-theme-muted border border-white/10",
+                  className: "w-5 h-5 rounded-full bg-primary/10 flex items-center justify-center text-[10px] font-bold text-primary-light border border-primary/20",
                   title: task.assignees.slice(2).map((a) => a.name).join(", "),
                   children: [
                     "+",
@@ -6285,7 +6429,7 @@ function TaskCard({
             /* @__PURE__ */ jsx("span", { className: "text-xs text-theme-muted truncate max-w-24", children: task.assignee.name })
           ] }) : null,
           !compact && task.dueDate && /* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx(DueDateBadge, { date: task.dueDate }) }),
-          /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-white/20" })
+          /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-primary/20" })
         ]
       }
     ),
@@ -6326,7 +6470,7 @@ function DueDateBadge({ date }) {
         "inline-flex items-center gap-1 text-[10px] px-1.5 py-0.5 border",
         isOverdue && "bg-rose-500/15 text-rose-400 border-rose-500/30",
         isSoon && !isOverdue && "bg-amber-500/15 text-amber-400 border-amber-500/30",
-        !isOverdue && !isSoon && "bg-white/[0.05] text-theme-muted border-white/10"
+        !isOverdue && !isSoon && "bg-theme-subtle text-theme-muted border-theme-subtle"
       ),
       children: [
         /* @__PURE__ */ jsx(OrgCalendar, { className: "w-3 h-3" }),
@@ -6343,7 +6487,7 @@ function TaskCardSkeleton({ compact, className }) {
     {
       className: cn(
         "relative flex flex-col gap-2 animate-pulse",
-        "bg-white/[0.02] backdrop-blur-md border border-white/10 rounded-xl",
+        "bg-theme-subtle/50 backdrop-blur-md border border-primary/10 rounded-xl",
         compact ? "p-2" : "p-3",
         className
       ),
@@ -6363,7 +6507,7 @@ function TaskCardSkeleton({ compact, className }) {
             /* @__PURE__ */ jsx("div", { className: "h-3 w-16 rounded bg-glass-border/50" })
           ] })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-white/20" })
+        /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-primary/20" })
       ]
     }
   );
@@ -6641,11 +6785,28 @@ function TaskCard2({
             `${label}-${i}`
           ))
         ] }),
+        (task.storyPoints != null || task.subtaskCount != null || task.commentCount != null) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-theme-muted", children: [
+          task.storyPoints != null && task.storyPoints > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-0.5 text-[10px] px-1.5 py-0.5 rounded-md bg-primary/10 text-primary-light border border-primary/25 font-medium", children: [
+            /* @__PURE__ */ jsx(OrgSprint, { className: "w-2.5 h-2.5" }),
+            task.storyPoints,
+            "pt"
+          ] }),
+          task.subtaskCount != null && task.subtaskCount > 0 && /* @__PURE__ */ jsxs("span", { className: "text-[10px]", children: [
+            task.subtaskDone ?? 0,
+            "/",
+            task.subtaskCount,
+            " \u2713"
+          ] }),
+          task.commentCount != null && task.commentCount > 0 && /* @__PURE__ */ jsxs("span", { className: "text-[10px]", children: [
+            task.commentCount,
+            " \u{1F4AC}"
+          ] })
+        ] }),
         task.assignee && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-1", children: [
           /* @__PURE__ */ jsx("div", { className: "w-5 h-5 rounded-full bg-primary/20 flex items-center justify-center text-[10px] font-semibold text-primary-light", children: task.assignee.name.charAt(0) }),
           /* @__PURE__ */ jsx("span", { className: "text-xs text-theme-muted", children: task.assignee.name })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-theme" })
+        /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-0 right-0 h-3 w-3 border-b border-r border-primary/20" })
       ]
     }
   );
@@ -6717,7 +6878,7 @@ function Column({
       } : void 0,
       onDrop: !externalDnD ? (e) => onDrop?.(e, column.id) : void 0,
       className: cn(
-        "flex flex-col w-[280px] sm:w-72 shrink-0 max-h-[calc(100vh-10rem)]",
+        "flex flex-col w-[280px] sm:w-72 shrink-0 max-h-[calc(100dvh-8rem)] sm:max-h-[calc(100vh-10rem)]",
         "bg-theme-glass backdrop-blur-md border border-theme-subtle rounded-xl",
         "transition-all duration-[400ms] ease-[cubic-bezier(0.25,1,0.5,1)]",
         "snap-start",
@@ -6983,8 +7144,8 @@ function KanbanBoard({
     /* @__PURE__ */ jsxs(
       "div",
       {
+        "data-tour": "kanban-board",
         className: cn(
-          "flex gap-3 sm:gap-4 p-3 sm:p-4 overflow-x-auto h-full min-h-[400px]",
           "bg-void snap-x snap-mandatory sm:snap-none",
           "scrollbar-none",
           className
@@ -7394,7 +7555,7 @@ function BoardsSwitcher({
       setIsCreating(false);
     }
   };
-  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, className: cn("relative", className), children: [
+  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, "data-tour": "board-switcher", className: cn("relative z-[10000]", className), children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
@@ -7422,7 +7583,7 @@ function BoardsSwitcher({
       }
     ),
     isOpen && /* @__PURE__ */ jsx("div", { className: cn(
-      "absolute top-full left-0 mt-1 z-[9999] min-w-[240px]",
+      "absolute top-full left-0 mt-1 z-[10001] min-w-[240px]",
       "bg-elevated/95 backdrop-blur-xl border border-theme-subtle rounded-xl shadow-2xl",
       "animate-in fade-in slide-in-from-top-2 duration-200"
     ), children: /* @__PURE__ */ jsxs("div", { className: "p-1.5", children: [
@@ -7504,6 +7665,7 @@ function SprintFilter({
   activeSprint,
   selectedSprintId,
   onSprintChange,
+  compact = false,
   className
 }) {
   const [isOpen, setIsOpen] = React5.useState(false);
@@ -7523,7 +7685,7 @@ function SprintFilter({
     const order = { ACTIVE: 0, PLANNED: 1, COMPLETED: 2 };
     return [...sprints].sort((a, b) => (order[a.status] ?? 9) - (order[b.status] ?? 9));
   }, [sprints]);
-  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, className: cn("relative", className), children: [
+  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, "data-tour": "sprint-switcher", className: cn("relative z-[10000]", className), children: [
     /* @__PURE__ */ jsxs(
       Button,
       {
@@ -7531,19 +7693,21 @@ function SprintFilter({
         size: "sm",
         onClick: () => setIsOpen(!isOpen),
         className: cn(
-          "h-8 gap-2 text-xs font-medium px-3",
+          "h-8 gap-1.5 text-xs font-medium",
+          compact ? "px-2" : "px-3 gap-2",
           "bg-theme-glass border border-theme-subtle",
           "text-theme hover:bg-theme-highlight"
         ),
+        title: compact ? displayLabel : void 0,
         children: [
           /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", className: "shrink-0", children: /* @__PURE__ */ jsx("path", { d: "M3 8h10M5 4h6M7 12h2", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }),
-          /* @__PURE__ */ jsx("span", { className: "truncate max-w-[120px] sm:max-w-[200px]", children: displayLabel }),
-          /* @__PURE__ */ jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", className: cn("transition-transform", isOpen && "rotate-180"), children: /* @__PURE__ */ jsx("path", { d: "M2.5 3.75L5 6.25L7.5 3.75", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round" }) })
+          !compact && /* @__PURE__ */ jsx("span", { className: "truncate max-w-[120px] sm:max-w-[200px]", children: displayLabel }),
+          /* @__PURE__ */ jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", className: cn("transition-transform shrink-0", isOpen && "rotate-180"), children: /* @__PURE__ */ jsx("path", { d: "M2.5 3.75L5 6.25L7.5 3.75", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round" }) })
         ]
       }
     ),
     isOpen && /* @__PURE__ */ jsx("div", { className: cn(
-      "absolute top-full left-0 mt-1 z-[9999] min-w-[220px]",
+      "absolute top-full left-0 mt-1 z-[10001] min-w-[220px]",
       "bg-elevated/95 backdrop-blur-xl border border-theme-subtle rounded-xl shadow-2xl",
       "animate-in fade-in slide-in-from-top-2 duration-200"
     ), children: /* @__PURE__ */ jsxs("div", { className: "p-1.5 max-h-[280px] overflow-y-auto scrollbar-none", children: [
@@ -7899,7 +8063,7 @@ function DropdownMenuSubContent({
     {
       "data-slot": "dropdown-menu-sub-content",
       className: cn(
-        "z-50 min-w-[8rem] overflow-hidden rounded-xl border border-white/20 bg-white/[0.03] backdrop-blur-[40px] p-1 text-theme shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-50 min-w-[8rem] overflow-hidden rounded-xl border border-primary/25 bg-white/[0.03] backdrop-blur-[40px] p-1 text-theme shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         className
       ),
       ...props
@@ -7917,7 +8081,7 @@ function DropdownMenuContent({
       "data-slot": "dropdown-menu-content",
       sideOffset,
       className: cn(
-        "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-xl border border-white/20 bg-white/[0.03] backdrop-blur-[40px] p-1 text-theme shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)]",
+        "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-xl border border-primary/25 bg-white/[0.03] backdrop-blur-[40px] p-1 text-theme shadow-[0_24px_80px_-15px_rgba(0,0,0,0.5)]",
         "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         className
       ),
@@ -8096,7 +8260,7 @@ function CommandInput({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b border-white/10 px-3", "cmdk-input-wrapper": "", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b border-primary/15 px-3", "cmdk-input-wrapper": "", children: [
     /* @__PURE__ */ jsx(Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
     /* @__PURE__ */ jsx(
       Command$1.Input,
@@ -8569,6 +8733,8 @@ var CREATE_WORKSPACE_MUTATION2 = `
       id
       name
       slug
+      description
+      avatarUrl
     }
   }
 `;
@@ -8579,6 +8745,7 @@ function CreateWorkspaceDialog({
 }) {
   const gql = useOrganifyGql();
   const { navigate } = useOrganifyNavigation();
+  const { workspaces, onWorkspacesChange, onWorkspaceChange } = useOrganify();
   const [name, setName] = React5.useState("");
   const [error, setError] = React5.useState("");
   const [loading, setLoading] = React5.useState(false);
@@ -8601,18 +8768,41 @@ function CreateWorkspaceDialog({
     }
     setLoading(true);
     setError("");
+    const optimisticId = `temp-${Date.now()}`;
+    const optimisticSlug = trimmed.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
+    const optimisticWs = {
+      id: optimisticId,
+      name: trimmed,
+      slug: optimisticSlug,
+      description: null,
+      avatarUrl: null,
+      plan: null,
+      _count: { members: 1, teams: 0 }
+    };
+    const prevWorkspaces = [...workspaces];
+    onWorkspacesChange?.([...workspaces, optimisticWs]);
     try {
       const data = await gql(
         "workspaces",
         CREATE_WORKSPACE_MUTATION2,
         { input: { name: trimmed } }
       );
+      const realWs = {
+        ...data.createWorkspace,
+        plan: null,
+        _count: { members: 1, teams: 0 }
+      };
+      onWorkspacesChange?.(
+        [...prevWorkspaces, realWs]
+      );
+      onWorkspaceChange?.(realWs);
       onOpenChange(false);
-      onCreated?.(data.createWorkspace);
+      onCreated?.(realWs);
       if (!onCreated && navigate) {
-        navigate(`/${data.createWorkspace.slug}`);
+        navigate(`/${realWs.slug}`);
       }
     } catch (err) {
+      onWorkspacesChange?.(prevWorkspaces);
       setError(err.message || "Failed to create workspace");
     } finally {
       setLoading(false);
@@ -9058,8 +9248,8 @@ function CreateTaskDialog({
   );
 }
 var INVITE_MEMBER_MUTATION = `
-  mutation InviteMember($input: InviteMemberInput!) {
-    inviteMember(input: $input) {
+  mutation InviteWorkspaceMember($slug: String!, $input: InviteMemberInput!) {
+    inviteWorkspaceMember(slug: $slug, input: $input) {
       id
       email
       role
@@ -9070,12 +9260,13 @@ var INVITE_MEMBER_MUTATION = `
 function InviteMemberDialog({
   open,
   onOpenChange,
-  workspaceId: propWorkspaceId,
+  workspaceSlug: propWorkspaceSlug,
+  workspaceId: _deprecated,
   onInvited
 }) {
   const gql = useOrganifyGql();
   const { workspace } = useOrganifyWorkspace();
-  const effectiveWsId = propWorkspaceId ?? workspace?.id;
+  const effectiveSlug = propWorkspaceSlug ?? workspace?.slug;
   const [email, setEmail] = React5.useState("");
   const [role, setRole] = React5.useState("MEMBER");
   const [error, setError] = React5.useState("");
@@ -9098,7 +9289,7 @@ function InviteMemberDialog({
       setError("Invalid email format");
       return;
     }
-    if (!effectiveWsId) {
+    if (!effectiveSlug) {
       setError("No workspace context");
       return;
     }
@@ -9108,10 +9299,10 @@ function InviteMemberDialog({
       const data = await gql(
         "workspaces",
         INVITE_MEMBER_MUTATION,
-        { input: { email: trimmed, role, workspaceId: effectiveWsId } }
+        { slug: effectiveSlug, input: { email: trimmed, role } }
       );
       onOpenChange(false);
-      onInvited?.(data.inviteMember);
+      onInvited?.(data.inviteWorkspaceMember);
     } catch (err) {
       setError(err.message || "Failed to send invite");
     } finally {