@greatapps/common 1.1.2 → 1.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,78 @@
1
+ "use client";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { useState } from "react";
4
+ import { Bell } from "lucide-react";
5
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
6
+ import { Popover } from "../ui/overlay/Popover";
7
+ import { Button } from "../ui/buttons/Button";
8
+ import { NotificationItem } from "./NotificationItem";
9
+ import { cn } from "../../infra/utils/clsx";
10
+ function NotificationsPopover({
11
+ notifications = [],
12
+ onViewAll,
13
+ side,
14
+ align,
15
+ contentClassName,
16
+ badgeClassName = "bg-pages-400"
17
+ }) {
18
+ const [open, setOpen] = useState(false);
19
+ const [hasNewNotifications, setHasNewNotifications] = useState(true);
20
+ const handleOpenChange = (isOpen) => {
21
+ setOpen(isOpen);
22
+ if (isOpen) setHasNewNotifications(false);
23
+ };
24
+ return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
25
+ /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { className: "cursor-pointer", children: /* @__PURE__ */ jsxs(
26
+ "div",
27
+ {
28
+ className: `relative rounded-full p-2.5 ${open ? "bg-gray-100" : "hover:bg-gray-100"}`,
29
+ children: [
30
+ /* @__PURE__ */ jsx(Bell, { size: 20, className: "text-gray-500" }),
31
+ hasNewNotifications && /* @__PURE__ */ jsx("span", { className: cn("absolute top-2 right-2 size-2.5 rounded-full", badgeClassName) })
32
+ ]
33
+ }
34
+ ) }),
35
+ /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
36
+ PopoverPrimitive.Content,
37
+ {
38
+ className: cn(
39
+ "absolute bottom-2 left-[26px] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200",
40
+ contentClassName
41
+ ),
42
+ side,
43
+ align,
44
+ sideOffset: 8,
45
+ children: [
46
+ /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950 px-4", children: "\xDAltimas notifica\xE7\xF5es" }),
47
+ notifications.length > 0 ? notifications.map((notification, index) => /* @__PURE__ */ jsx(
48
+ NotificationItem,
49
+ {
50
+ icon: notification.icon,
51
+ iconBgColor: notification.iconBgColor,
52
+ title: notification.title,
53
+ time: notification.time,
54
+ showBorder: index < notifications.length - 1
55
+ },
56
+ index
57
+ )) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]", children: [
58
+ /* @__PURE__ */ jsx("div", { className: "bg-gray-50 rounded-md p-2.5", children: /* @__PURE__ */ jsx(Bell, { size: 20, color: "var(--color-gray-950)" }) }),
59
+ /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-gray-950", children: "Sem notifica\xE7\xF5es por enquanto" })
60
+ ] }),
61
+ onViewAll && /* @__PURE__ */ jsx(
62
+ Button,
63
+ {
64
+ variant: "secondary",
65
+ className: "h-8! mt-2 mb-4 mx-4 paragraph-small-semibold",
66
+ onClick: onViewAll,
67
+ children: "Todas as notifica\xE7\xF5es"
68
+ }
69
+ )
70
+ ]
71
+ }
72
+ ) })
73
+ ] });
74
+ }
75
+ export {
76
+ NotificationsPopover
77
+ };
78
+ //# sourceMappingURL=NotificationsPopover.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/layouts/NotificationsPopover.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { ReactNode, useState } from 'react';\r\nimport { Bell } from 'lucide-react';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { Popover } from '../ui/overlay/Popover';\r\nimport { Button } from '../ui/buttons/Button';\r\nimport { NotificationItem } from './NotificationItem';\r\nimport { cn } from '../../infra/utils/clsx';\r\n\r\nexport interface NotificationData {\r\n icon: ReactNode;\r\n iconBgColor: string;\r\n title: string;\r\n time: string;\r\n}\r\n\r\nexport interface NotificationsPopoverProps {\r\n notifications?: NotificationData[];\r\n onViewAll?: () => void;\r\n side?: 'top' | 'bottom' | 'left' | 'right';\r\n align?: 'start' | 'center' | 'end';\r\n contentClassName?: string;\r\n badgeClassName?: string;\r\n}\r\n\r\nfunction NotificationsPopover({\r\n notifications = [],\r\n onViewAll,\r\n side,\r\n align,\r\n contentClassName,\r\n badgeClassName = 'bg-pages-400',\r\n}: NotificationsPopoverProps) {\r\n const [open, setOpen] = useState(false);\r\n const [hasNewNotifications, setHasNewNotifications] = useState(true);\r\n\r\n const handleOpenChange = (isOpen: boolean) => {\r\n setOpen(isOpen);\r\n if (isOpen) setHasNewNotifications(false);\r\n };\r\n\r\n return (\r\n <Popover open={open} onOpenChange={handleOpenChange}>\r\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\r\n <div\r\n className={`relative rounded-full p-2.5 ${open ? 'bg-gray-100' : 'hover:bg-gray-100'}`}\r\n >\r\n <Bell size={20} className=\"text-gray-500\" />\r\n {hasNewNotifications && (\r\n <span className={cn('absolute top-2 right-2 size-2.5 rounded-full', badgeClassName)} />\r\n )}\r\n </div>\r\n </PopoverPrimitive.Trigger>\r\n <PopoverPrimitive.Portal>\r\n <PopoverPrimitive.Content\r\n className={cn(\r\n 'absolute bottom-2 left-[26px] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200',\r\n contentClassName\r\n )}\r\n side={side}\r\n align={align}\r\n sideOffset={8}\r\n >\r\n <span className=\"paragraph-small-semibold text-gray-950 px-4\">Últimas notificações</span>\r\n\r\n {notifications.length > 0 ? (\r\n notifications.map((notification, index) => (\r\n <NotificationItem\r\n key={index}\r\n icon={notification.icon}\r\n iconBgColor={notification.iconBgColor}\r\n title={notification.title}\r\n time={notification.time}\r\n showBorder={index < notifications.length - 1}\r\n />\r\n ))\r\n ) : (\r\n <div className=\"flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]\">\r\n <div className=\"bg-gray-50 rounded-md p-2.5\">\r\n <Bell size={20} color=\"var(--color-gray-950)\" />\r\n </div>\r\n <span className=\"paragraph-small-medium text-gray-950\">Sem notificações por enquanto</span>\r\n </div>\r\n )}\r\n\r\n {onViewAll && (\r\n <Button\r\n variant=\"secondary\"\r\n className=\"h-8! mt-2 mb-4 mx-4 paragraph-small-semibold\"\r\n onClick={onViewAll}\r\n >\r\n Todas as notificações\r\n </Button>\r\n )}\r\n </PopoverPrimitive.Content>\r\n </PopoverPrimitive.Portal>\r\n </Popover>\r\n );\r\n}\r\n\r\nexport { NotificationsPopover };\r\n"],"mappings":";AA6CQ,SAGE,KAHF;AA3CR,SAAoB,gBAAgB;AACpC,SAAS,YAAY;AACrB,YAAY,sBAAsB;AAClC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,wBAAwB;AACjC,SAAS,UAAU;AAkBnB,SAAS,qBAAqB;AAAA,EAC5B,gBAAgB,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AACnB,GAA8B;AAC5B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,IAAI;AAEnE,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,YAAQ,MAAM;AACd,QAAI,OAAQ,wBAAuB,KAAK;AAAA,EAC1C;AAEA,SACE,qBAAC,WAAQ,MAAY,cAAc,kBACjC;AAAA,wBAAC,iBAAiB,SAAjB,EAAyB,WAAU,kBAClC;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,+BAA+B,OAAO,gBAAgB,mBAAmB;AAAA,QAEpF;AAAA,8BAAC,QAAK,MAAM,IAAI,WAAU,iBAAgB;AAAA,UACzC,uBACC,oBAAC,UAAK,WAAW,GAAG,gDAAgD,cAAc,GAAG;AAAA;AAAA;AAAA,IAEzF,GACF;AAAA,IACA,oBAAC,iBAAiB,QAAjB,EACD;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,YAAY;AAAA,QAEZ;AAAA,8BAAC,UAAK,WAAU,+CAA8C,2CAAoB;AAAA,UAEjF,cAAc,SAAS,IACtB,cAAc,IAAI,CAAC,cAAc,UAC/B;AAAA,YAAC;AAAA;AAAA,cAEC,MAAM,aAAa;AAAA,cACnB,aAAa,aAAa;AAAA,cAC1B,OAAO,aAAa;AAAA,cACpB,MAAM,aAAa;AAAA,cACnB,YAAY,QAAQ,cAAc,SAAS;AAAA;AAAA,YALtC;AAAA,UAMP,CACD,IAED,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,SAAI,WAAU,+BACb,8BAAC,QAAK,MAAM,IAAI,OAAM,yBAAwB,GAChD;AAAA,YACA,oBAAC,UAAK,WAAU,wCAAuC,iDAA6B;AAAA,aACtF;AAAA,UAGD,aACC;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,SAAS;AAAA,cACV;AAAA;AAAA,UAED;AAAA;AAAA;AAAA,IAEJ,GACA;AAAA,KACF;AAEJ;","names":[]}
@@ -2,7 +2,8 @@
2
2
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
3
  import { useState } from "react";
4
4
  import { useRouter } from "next/navigation";
5
- import { Popover, PopoverContent, PopoverTrigger } from "../ui/overlay/Popover";
5
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
6
+ import { Popover } from "../ui/overlay/Popover";
6
7
  import { Button } from "../ui/buttons/Button";
7
8
  import { Progress } from "../ui/feedback/Progress";
8
9
  import { Separator } from "../ui/data-display/Separator";
@@ -13,7 +14,7 @@ import { cn } from "../../infra/utils/clsx";
13
14
  function ProfilePopover({
14
15
  side = "top",
15
16
  align = "start",
16
- contentClassName,
17
+ contentClassName = "absolute bottom-2 left-[26px]",
17
18
  onEditProfile,
18
19
  credits,
19
20
  onCreditsClick,
@@ -40,7 +41,7 @@ function ProfilePopover({
40
41
  return /* @__PURE__ */ jsxs(Fragment, { children: [
41
42
  isLoggingOut && logoutOverlay,
42
43
  /* @__PURE__ */ jsxs(Popover, { children: [
43
- /* @__PURE__ */ jsx(PopoverTrigger, { className: "cursor-pointer", children: user && /* @__PURE__ */ jsx(
44
+ /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { className: "cursor-pointer", children: user && /* @__PURE__ */ jsx(
44
45
  UserAvatar,
45
46
  {
46
47
  photo: user.photo,
@@ -50,8 +51,8 @@ function ProfilePopover({
50
51
  },
51
52
  user.id
52
53
  ) }),
53
- /* @__PURE__ */ jsxs(
54
- PopoverContent,
54
+ /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
55
+ PopoverPrimitive.Content,
55
56
  {
56
57
  className: cn(
57
58
  "w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99",
@@ -131,7 +132,7 @@ function ProfilePopover({
131
132
  ] })
132
133
  ]
133
134
  }
134
- )
135
+ ) })
135
136
  ] })
136
137
  ] });
137
138
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { useState } from 'react';\r\nimport { useRouter } from 'next/navigation';\r\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/overlay/Popover';\r\nimport { Button } from '../ui/buttons/Button';\r\nimport { Progress } from '../ui/feedback/Progress';\r\nimport { Separator } from '../ui/data-display/Separator';\r\nimport { NavBarItem } from './NavBarItem';\r\nimport { UserAvatar } from '../ui/data-display/UserAvatar';\r\nimport { useAuth } from '../../providers/auth.provider';\r\nimport { cn } from '../../infra/utils/clsx';\r\n\r\nexport interface ProfileMenuItem {\r\n icon?: React.ReactNode;\r\n label: string;\r\n onClick: () => void;\r\n}\r\n\r\nexport interface ProfilePopoverProps {\r\n side?: 'top' | 'bottom' | 'left' | 'right';\r\n align?: 'start' | 'center' | 'end';\r\n contentClassName?: string;\r\n onEditProfile?: () => void;\r\n credits?: { used: number; total: number };\r\n onCreditsClick?: () => void;\r\n menuItems?: ProfileMenuItem[];\r\n logoutRedirect?: string;\r\n storageUrl?: string;\r\n logoutOverlay?: React.ReactNode;\r\n}\r\n\r\nfunction ProfilePopover({\r\n side = 'top',\r\n align = 'start',\r\n contentClassName,\r\n onEditProfile,\r\n credits,\r\n onCreditsClick,\r\n menuItems = [],\r\n logoutRedirect = '/login',\r\n storageUrl,\r\n logoutOverlay,\r\n}: ProfilePopoverProps) {\r\n const router = useRouter();\r\n const { user, logout } = useAuth();\r\n const [isLoggingOut, setIsLoggingOut] = useState(false);\r\n\r\n const handleLogout = async () => {\r\n try {\r\n setIsLoggingOut(true);\r\n await logout();\r\n router.push(logoutRedirect);\r\n } catch (error) {\r\n console.error('Erro ao fazer logout:', error);\r\n } finally {\r\n setIsLoggingOut(false);\r\n }\r\n };\r\n\r\n const creditsPercentage =\r\n credits && credits.total > 0\r\n ? (credits.used / credits.total) * 100\r\n : 0;\r\n\r\n return (\r\n <>\r\n {isLoggingOut && logoutOverlay}\r\n <Popover>\r\n <PopoverTrigger className=\"cursor-pointer\">\r\n {user && (\r\n <UserAvatar\r\n key={user.id}\r\n photo={user.photo}\r\n name={user.name}\r\n size={40}\r\n storageUrl={storageUrl}\r\n />\r\n )}\r\n </PopoverTrigger>\r\n\r\n <PopoverContent\r\n className={cn(\r\n 'w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99',\r\n contentClassName\r\n )}\r\n side={side}\r\n align={align}\r\n sideOffset={8}\r\n >\r\n <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\r\n {user && (\r\n <UserAvatar\r\n key={user.id}\r\n photo={user.photo}\r\n name={user.name}\r\n size={32}\r\n storageUrl={storageUrl}\r\n />\r\n )}\r\n\r\n <div className=\"flex flex-col gap-0.5 min-w-0\">\r\n <span className=\"paragraph-small-semibold text-gray-950 truncate\">\r\n {user?.name || ''}\r\n </span>\r\n <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\r\n {user?.email || ''}\r\n </span>\r\n </div>\r\n\r\n {onEditProfile && (\r\n <Button\r\n variant=\"secondary\"\r\n className=\"paragraph-small-semibold h-8! whitespace-nowrap px-3 w-fit\"\r\n onClick={onEditProfile}\r\n >\r\n Editar Perfil\r\n </Button>\r\n )}\r\n </div>\r\n\r\n <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\r\n {credits && (\r\n <div\r\n className={cn(\r\n 'flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors',\r\n onCreditsClick && 'cursor-pointer hover:bg-gray-900'\r\n )}\r\n onClick={onCreditsClick}\r\n >\r\n <div className=\"flex items-center justify-between gap-2\">\r\n <span className=\"paragraph-xsmall-semibold text-white truncate\">\r\n Créditos usados\r\n </span>\r\n <span className=\"paragraph-xsmall-medium text-white/50\">\r\n {credits.used.toLocaleString('pt-BR')}/\r\n {credits.total.toLocaleString('pt-BR')}\r\n </span>\r\n </div>\r\n <Progress\r\n className=\"bg-white/10\"\r\n indicatorColor=\"bg-white\"\r\n value={creditsPercentage}\r\n />\r\n </div>\r\n )}\r\n\r\n <div className=\"flex flex-col gap-2\">\r\n {menuItems.length > 0 && (\r\n <div className=\"flex flex-col\">\r\n {menuItems.map((item, index) => (\r\n <NavBarItem\r\n key={index}\r\n icon={item.icon}\r\n label={item.label}\r\n onClick={item.onClick}\r\n />\r\n ))}\r\n </div>\r\n )}\r\n <Separator />\r\n <NavBarItem label=\"Sair\" onClick={handleLogout} />\r\n </div>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n </>\r\n );\r\n}\r\n\r\nexport { ProfilePopover };\r\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { useState } from 'react';\r\nimport { useRouter } from 'next/navigation';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { Popover } from '../ui/overlay/Popover';\r\nimport { Button } from '../ui/buttons/Button';\r\nimport { Progress } from '../ui/feedback/Progress';\r\nimport { Separator } from '../ui/data-display/Separator';\r\nimport { NavBarItem } from './NavBarItem';\r\nimport { UserAvatar } from '../ui/data-display/UserAvatar';\r\nimport { useAuth } from '../../providers/auth.provider';\r\nimport { cn } from '../../infra/utils/clsx';\r\n\r\nexport interface ProfileMenuItem {\r\n icon?: React.ReactNode;\r\n label: string;\r\n onClick: () => void;\r\n}\r\n\r\nexport interface ProfilePopoverProps {\r\n side?: 'top' | 'bottom' | 'left' | 'right';\r\n align?: 'start' | 'center' | 'end';\r\n contentClassName?: string;\r\n onEditProfile?: () => void;\r\n credits?: { used: number; total: number };\r\n onCreditsClick?: () => void;\r\n menuItems?: ProfileMenuItem[];\r\n logoutRedirect?: string;\r\n storageUrl?: string;\r\n logoutOverlay?: React.ReactNode;\r\n}\r\n\r\nfunction ProfilePopover({\r\n side = 'top',\r\n align = 'start',\r\n contentClassName = 'absolute bottom-2 left-[26px]',\r\n onEditProfile,\r\n credits,\r\n onCreditsClick,\r\n menuItems = [],\r\n logoutRedirect = '/login',\r\n storageUrl,\r\n logoutOverlay,\r\n}: ProfilePopoverProps) {\r\n const router = useRouter();\r\n const { user, logout } = useAuth();\r\n const [isLoggingOut, setIsLoggingOut] = useState(false);\r\n\r\n const handleLogout = async () => {\r\n try {\r\n setIsLoggingOut(true);\r\n await logout();\r\n router.push(logoutRedirect);\r\n } catch (error) {\r\n console.error('Erro ao fazer logout:', error);\r\n } finally {\r\n setIsLoggingOut(false);\r\n }\r\n };\r\n\r\n const creditsPercentage =\r\n credits && credits.total > 0\r\n ? (credits.used / credits.total) * 100\r\n : 0;\r\n\r\n return (\r\n <>\r\n {isLoggingOut && logoutOverlay}\r\n <Popover>\r\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\r\n {user && (\r\n <UserAvatar\r\n key={user.id}\r\n photo={user.photo}\r\n name={user.name}\r\n size={40}\r\n storageUrl={storageUrl}\r\n />\r\n )}\r\n </PopoverPrimitive.Trigger>\r\n\r\n <PopoverPrimitive.Portal>\r\n <PopoverPrimitive.Content\r\n className={cn(\r\n 'w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99',\r\n contentClassName\r\n )}\r\n side={side}\r\n align={align}\r\n sideOffset={8}\r\n >\r\n <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\r\n {user && (\r\n <UserAvatar\r\n key={user.id}\r\n photo={user.photo}\r\n name={user.name}\r\n size={32}\r\n storageUrl={storageUrl}\r\n />\r\n )}\r\n\r\n <div className=\"flex flex-col gap-0.5 min-w-0\">\r\n <span className=\"paragraph-small-semibold text-gray-950 truncate\">\r\n {user?.name || ''}\r\n </span>\r\n <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\r\n {user?.email || ''}\r\n </span>\r\n </div>\r\n\r\n {onEditProfile && (\r\n <Button\r\n variant=\"secondary\"\r\n className=\"paragraph-small-semibold h-8! whitespace-nowrap px-3 w-fit\"\r\n onClick={onEditProfile}\r\n >\r\n Editar Perfil\r\n </Button>\r\n )}\r\n </div>\r\n\r\n <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\r\n {credits && (\r\n <div\r\n className={cn(\r\n 'flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors',\r\n onCreditsClick && 'cursor-pointer hover:bg-gray-900'\r\n )}\r\n onClick={onCreditsClick}\r\n >\r\n <div className=\"flex items-center justify-between gap-2\">\r\n <span className=\"paragraph-xsmall-semibold text-white truncate\">\r\n Créditos usados\r\n </span>\r\n <span className=\"paragraph-xsmall-medium text-white/50\">\r\n {credits.used.toLocaleString('pt-BR')}/\r\n {credits.total.toLocaleString('pt-BR')}\r\n </span>\r\n </div>\r\n <Progress\r\n className=\"bg-white/10\"\r\n indicatorColor=\"bg-white\"\r\n value={creditsPercentage}\r\n />\r\n </div>\r\n )}\r\n\r\n <div className=\"flex flex-col gap-2\">\r\n {menuItems.length > 0 && (\r\n <div className=\"flex flex-col\">\r\n {menuItems.map((item, index) => (\r\n <NavBarItem\r\n key={index}\r\n icon={item.icon}\r\n label={item.label}\r\n onClick={item.onClick}\r\n />\r\n ))}\r\n </div>\r\n )}\r\n <Separator />\r\n <NavBarItem label=\"Sair\" onClick={handleLogout} />\r\n </div>\r\n </div>\r\n </PopoverPrimitive.Content>\r\n </PopoverPrimitive.Portal>\r\n </Popover>\r\n </>\r\n );\r\n}\r\n\r\nexport { ProfilePopover };\r\n"],"mappings":";AAmEI,mBAKQ,KA+BA,YApCR;AAjEJ,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,YAAY,sBAAsB;AAClC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AACxB,SAAS,UAAU;AAqBnB,SAAS,eAAe;AAAA,EACtB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AAAA,EACb,iBAAiB;AAAA,EACjB;AAAA,EACA;AACF,GAAwB;AACtB,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,MAAM,OAAO,IAAI,QAAQ;AACjC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,QAAM,eAAe,YAAY;AAC/B,QAAI;AACF,sBAAgB,IAAI;AACpB,YAAM,OAAO;AACb,aAAO,KAAK,cAAc;AAAA,IAC5B,SAAS,OAAO;AACd,cAAQ,MAAM,yBAAyB,KAAK;AAAA,IAC9C,UAAE;AACA,sBAAgB,KAAK;AAAA,IACvB;AAAA,EACF;AAEA,QAAM,oBACJ,WAAW,QAAQ,QAAQ,IACtB,QAAQ,OAAO,QAAQ,QAAS,MACjC;AAEN,SACE,iCACG;AAAA,oBAAgB;AAAA,IACjB,qBAAC,WACC;AAAA,0BAAC,iBAAiB,SAAjB,EAAyB,WAAU,kBACjC,kBACC;AAAA,QAAC;AAAA;AAAA,UAEC,OAAO,KAAK;AAAA,UACZ,MAAM,KAAK;AAAA,UACX,MAAM;AAAA,UACN;AAAA;AAAA,QAJK,KAAK;AAAA,MAKZ,GAEJ;AAAA,MAEA,oBAAC,iBAAiB,QAAjB,EACD;AAAA,QAAC,iBAAiB;AAAA,QAAjB;AAAA,UACC,WAAW;AAAA,YACT;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UAEZ;AAAA,iCAAC,SAAI,WAAU,gEACZ;AAAA,sBACC;AAAA,gBAAC;AAAA;AAAA,kBAEC,OAAO,KAAK;AAAA,kBACZ,MAAM,KAAK;AAAA,kBACX,MAAM;AAAA,kBACN;AAAA;AAAA,gBAJK,KAAK;AAAA,cAKZ;AAAA,cAGF,qBAAC,SAAI,WAAU,iCACb;AAAA,oCAAC,UAAK,WAAU,mDACb,gBAAM,QAAQ,IACjB;AAAA,gBACA,oBAAC,UAAK,WAAU,kDACb,gBAAM,SAAS,IAClB;AAAA,iBACF;AAAA,cAEC,iBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,SAAS;AAAA,kBACV;AAAA;AAAA,cAED;AAAA,eAEJ;AAAA,YAEA,qBAAC,SAAI,WAAU,kEACZ;AAAA,yBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW;AAAA,oBACT;AAAA,oBACA,kBAAkB;AAAA,kBACpB;AAAA,kBACA,SAAS;AAAA,kBAET;AAAA,yCAAC,SAAI,WAAU,2CACb;AAAA,0CAAC,UAAK,WAAU,iDAAgD,gCAEhE;AAAA,sBACA,qBAAC,UAAK,WAAU,yCACb;AAAA,gCAAQ,KAAK,eAAe,OAAO;AAAA,wBAAE;AAAA,wBACrC,QAAQ,MAAM,eAAe,OAAO;AAAA,yBACvC;AAAA,uBACF;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV,gBAAe;AAAA,wBACf,OAAO;AAAA;AAAA,oBACT;AAAA;AAAA;AAAA,cACF;AAAA,cAGF,qBAAC,SAAI,WAAU,uBACZ;AAAA,0BAAU,SAAS,KAClB,oBAAC,SAAI,WAAU,iBACZ,oBAAU,IAAI,CAAC,MAAM,UACpB;AAAA,kBAAC;AAAA;AAAA,oBAEC,MAAM,KAAK;AAAA,oBACX,OAAO,KAAK;AAAA,oBACZ,SAAS,KAAK;AAAA;AAAA,kBAHT;AAAA,gBAIP,CACD,GACH;AAAA,gBAEF,oBAAC,aAAU;AAAA,gBACX,oBAAC,cAAW,OAAM,QAAO,SAAS,cAAc;AAAA,iBAClD;AAAA,eACF;AAAA;AAAA;AAAA,MACF,GACA;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
@@ -0,0 +1,142 @@
1
+ "use client";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { useState } from "react";
4
+ import { Plus, Settings, User } from "lucide-react";
5
+ import Image from "next/image";
6
+ import { useRouter } from "next/navigation";
7
+ import { Popover, PopoverContent, PopoverTrigger } from "../ui/overlay/Popover";
8
+ import { Button } from "../ui/buttons/Button";
9
+ import { Command, CommandEmpty, CommandInput, CommandItem, CommandList } from "../ui/overlay/Command";
10
+ import { Checkbox } from "../ui/form/Checkbox";
11
+ import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/overlay/Tooltip";
12
+ import { cn } from "../../infra/utils/clsx";
13
+ function UsersSelectorPopover({
14
+ users: externalUsers,
15
+ onToggleUser,
16
+ addRoute = "/my-teams?createNew=true",
17
+ manageRoute = "/my-teams",
18
+ userCount = 5,
19
+ side,
20
+ align,
21
+ contentClassName
22
+ }) {
23
+ const route = useRouter();
24
+ const [open, setOpen] = useState(false);
25
+ const [internalUsers, setInternalUsers] = useState(externalUsers ?? []);
26
+ const [hoveredId, setHoveredId] = useState(null);
27
+ const users = externalUsers ?? internalUsers;
28
+ const toggleUser = (id) => {
29
+ if (onToggleUser) {
30
+ onToggleUser(id);
31
+ } else {
32
+ setInternalUsers(
33
+ (prev) => prev.map((u) => u.id === id ? { ...u, checked: !u.checked } : u)
34
+ );
35
+ }
36
+ };
37
+ return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
38
+ /* @__PURE__ */ jsx(PopoverTrigger, { className: "cursor-pointer", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-gray-950 px-3 py-2 border border-gray-200 rounded-full hover:border-gray-950", children: [
39
+ /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: userCount }),
40
+ /* @__PURE__ */ jsx(User, { size: 16 })
41
+ ] }) }),
42
+ /* @__PURE__ */ jsx(
43
+ PopoverContent,
44
+ {
45
+ className: cn(
46
+ "absolute right-[-88px] w-[273px] p-0 bg-white rounded-2xl shadow-md border border-gray-200",
47
+ contentClassName
48
+ ),
49
+ side,
50
+ align,
51
+ sideOffset: 8,
52
+ children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-3 gap-2", children: [
53
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
54
+ /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: "Usu\xE1rios" }),
55
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
56
+ /* @__PURE__ */ jsxs(
57
+ Button,
58
+ {
59
+ variant: "secondary",
60
+ className: "h-8 paragraph-small-semibold text-gray-950",
61
+ onClick: () => route.push(addRoute),
62
+ children: [
63
+ /* @__PURE__ */ jsx(Plus, { size: 16 }),
64
+ "Adicionar"
65
+ ]
66
+ }
67
+ ),
68
+ /* @__PURE__ */ jsxs(Tooltip, { children: [
69
+ /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
70
+ Button,
71
+ {
72
+ variant: "secondary",
73
+ className: "p-0 size-8",
74
+ onClick: () => route.push(manageRoute),
75
+ children: /* @__PURE__ */ jsx(Settings, { size: 18 })
76
+ }
77
+ ) }),
78
+ /* @__PURE__ */ jsx(TooltipContent, { children: "Visualizar todos usu\xE1rios" })
79
+ ] })
80
+ ] })
81
+ ] }),
82
+ /* @__PURE__ */ jsxs(Command, { className: "gap-2", value: "", children: [
83
+ /* @__PURE__ */ jsx(CommandInput, { placeholder: "Busque aqui" }),
84
+ /* @__PURE__ */ jsxs(CommandList, { className: "custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]", children: [
85
+ /* @__PURE__ */ jsx(CommandEmpty, { children: "No results found." }),
86
+ users.map((user) => /* @__PURE__ */ jsx(
87
+ CommandItem,
88
+ {
89
+ autoFocus: false,
90
+ onPointerEnter: () => setHoveredId(user.id),
91
+ onPointerLeave: () => setHoveredId(null),
92
+ onFocus: () => setHoveredId(user.id),
93
+ onBlur: () => setHoveredId(null),
94
+ onSelect: () => toggleUser(user.id),
95
+ className: "cursor-pointer",
96
+ children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between w-full", children: [
97
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
98
+ /* @__PURE__ */ jsx(
99
+ Image,
100
+ {
101
+ alt: "Avatar",
102
+ src: user.avatar,
103
+ width: 32,
104
+ height: 32,
105
+ className: "rounded-full"
106
+ }
107
+ ),
108
+ user.name
109
+ ] }),
110
+ /* @__PURE__ */ jsxs(Tooltip, { open: hoveredId === user.id, children: [
111
+ /* @__PURE__ */ jsx(
112
+ TooltipTrigger,
113
+ {
114
+ onClick: (e) => e.stopPropagation(),
115
+ onPointerDown: (e) => e.stopPropagation(),
116
+ children: /* @__PURE__ */ jsx(
117
+ Checkbox,
118
+ {
119
+ checked: user.checked,
120
+ onCheckedChange: () => toggleUser(user.id),
121
+ className: hoveredId === user.id ? "border-gray-950" : ""
122
+ }
123
+ )
124
+ }
125
+ ),
126
+ /* @__PURE__ */ jsx(TooltipContent, { children: user.checked ? "Remover do projeto" : "Adicionar ao projeto" })
127
+ ] })
128
+ ] })
129
+ },
130
+ user.id
131
+ ))
132
+ ] })
133
+ ] })
134
+ ] })
135
+ }
136
+ )
137
+ ] });
138
+ }
139
+ export {
140
+ UsersSelectorPopover
141
+ };
142
+ //# sourceMappingURL=UsersSelectorPopover.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/layouts/UsersSelectorPopover.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { useState } from 'react';\r\nimport { Plus, Settings, User } from 'lucide-react';\r\nimport Image from 'next/image';\r\nimport { useRouter } from 'next/navigation';\r\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/overlay/Popover';\r\nimport { Button } from '../ui/buttons/Button';\r\nimport { Command, CommandEmpty, CommandInput, CommandItem, CommandList } from '../ui/overlay/Command';\r\nimport { Checkbox } from '../ui/form/Checkbox';\r\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/overlay/Tooltip';\r\nimport { cn } from '../../infra/utils/clsx';\r\n\r\nexport interface UserSelectorItem {\r\n id: number;\r\n name: string;\r\n avatar: string;\r\n checked: boolean;\r\n}\r\n\r\nexport interface UsersSelectorPopoverProps {\r\n users?: UserSelectorItem[];\r\n onToggleUser?: (id: number) => void;\r\n addRoute?: string;\r\n manageRoute?: string;\r\n userCount?: number;\r\n side?: 'top' | 'bottom' | 'left' | 'right';\r\n align?: 'start' | 'center' | 'end';\r\n contentClassName?: string;\r\n}\r\n\r\nfunction UsersSelectorPopover({\r\n users: externalUsers,\r\n onToggleUser,\r\n addRoute = '/my-teams?createNew=true',\r\n manageRoute = '/my-teams',\r\n userCount = 5,\r\n side,\r\n align,\r\n contentClassName,\r\n}: UsersSelectorPopoverProps) {\r\n const route = useRouter();\r\n const [open, setOpen] = useState(false);\r\n const [internalUsers, setInternalUsers] = useState<UserSelectorItem[]>(externalUsers ?? []);\r\n const [hoveredId, setHoveredId] = useState<number | null>(null);\r\n\r\n const users = externalUsers ?? internalUsers;\r\n\r\n const toggleUser = (id: number) => {\r\n if (onToggleUser) {\r\n onToggleUser(id);\r\n } else {\r\n setInternalUsers((prev) =>\r\n prev.map((u) => (u.id === id ? { ...u, checked: !u.checked } : u))\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <Popover open={open} onOpenChange={setOpen}>\r\n <PopoverTrigger className=\"cursor-pointer\">\r\n <div className=\"flex items-center gap-2 text-gray-950 px-3 py-2 border border-gray-200 rounded-full hover:border-gray-950\">\r\n <span className=\"paragraph-small-semibold\">{userCount}</span>\r\n <User size={16} />\r\n </div>\r\n </PopoverTrigger>\r\n\r\n <PopoverContent\r\n className={cn(\r\n 'absolute right-[-88px] w-[273px] p-0 bg-white rounded-2xl shadow-md border border-gray-200',\r\n contentClassName\r\n )}\r\n side={side}\r\n align={align}\r\n sideOffset={8}\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\">Usuários</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={() => route.push(addRoute)}\r\n >\r\n <Plus size={16} />\r\n Adicionar\r\n </Button>\r\n\r\n <Tooltip>\r\n <TooltipTrigger asChild>\r\n <Button\r\n variant=\"secondary\"\r\n className=\"p-0 size-8\"\r\n onClick={() => route.push(manageRoute)}\r\n >\r\n <Settings size={18} />\r\n </Button>\r\n </TooltipTrigger>\r\n <TooltipContent>Visualizar todos usuários</TooltipContent>\r\n </Tooltip>\r\n </div>\r\n </div>\r\n\r\n <Command className=\"gap-2\" value=\"\">\r\n <CommandInput placeholder=\"Busque aqui\" />\r\n <CommandList className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]\">\r\n <CommandEmpty>No results found.</CommandEmpty>\r\n {users.map((user) => (\r\n <CommandItem\r\n key={user.id}\r\n autoFocus={false}\r\n onPointerEnter={() => setHoveredId(user.id)}\r\n onPointerLeave={() => setHoveredId(null)}\r\n onFocus={() => setHoveredId(user.id)}\r\n onBlur={() => setHoveredId(null)}\r\n onSelect={() => toggleUser(user.id)}\r\n className=\"cursor-pointer\"\r\n >\r\n <div className=\"flex items-center justify-between w-full\">\r\n <div className=\"flex items-center gap-2\">\r\n <Image\r\n alt=\"Avatar\"\r\n src={user.avatar}\r\n width={32}\r\n height={32}\r\n className=\"rounded-full\"\r\n />\r\n {user.name}\r\n </div>\r\n\r\n <Tooltip open={hoveredId === user.id}>\r\n <TooltipTrigger\r\n onClick={(e) => e.stopPropagation()}\r\n onPointerDown={(e) => e.stopPropagation()}\r\n >\r\n <Checkbox\r\n checked={user.checked}\r\n onCheckedChange={() => toggleUser(user.id)}\r\n className={hoveredId === user.id ? 'border-gray-950' : ''}\r\n />\r\n </TooltipTrigger>\r\n <TooltipContent>\r\n {user.checked ? 'Remover do projeto' : 'Adicionar ao projeto'}\r\n </TooltipContent>\r\n </Tooltip>\r\n </div>\r\n </CommandItem>\r\n ))}\r\n </CommandList>\r\n </Command>\r\n </div>\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n}\r\n\r\nexport { UsersSelectorPopover };\r\n"],"mappings":";AA6DQ,SACE,KADF;AA3DR,SAAS,gBAAgB;AACzB,SAAS,MAAM,UAAU,YAAY;AACrC,OAAO,WAAW;AAClB,SAAS,iBAAiB;AAC1B,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,cAAc;AACvB,SAAS,SAAS,cAAc,cAAc,aAAa,mBAAmB;AAC9E,SAAS,gBAAgB;AACzB,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,UAAU;AAoBnB,SAAS,qBAAqB;AAAA,EAC5B,OAAO;AAAA,EACP;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,QAAQ,UAAU;AACxB,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAA6B,iBAAiB,CAAC,CAAC;AAC1F,QAAM,CAAC,WAAW,YAAY,IAAI,SAAwB,IAAI;AAE9D,QAAM,QAAQ,iBAAiB;AAE/B,QAAM,aAAa,CAAC,OAAe;AACjC,QAAI,cAAc;AAChB,mBAAa,EAAE;AAAA,IACjB,OAAO;AACL;AAAA,QAAiB,CAAC,SAChB,KAAK,IAAI,CAAC,MAAO,EAAE,OAAO,KAAK,EAAE,GAAG,GAAG,SAAS,CAAC,EAAE,QAAQ,IAAI,CAAE;AAAA,MACnE;AAAA,IACF;AAAA,EACF;AAEA,SACE,qBAAC,WAAQ,MAAY,cAAc,SACjC;AAAA,wBAAC,kBAAe,WAAU,kBACxB,+BAAC,SAAI,WAAU,6GACb;AAAA,0BAAC,UAAK,WAAU,4BAA4B,qBAAU;AAAA,MACtD,oBAAC,QAAK,MAAM,IAAI;AAAA,OAClB,GACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,YAAY;AAAA,QAEZ,+BAAC,SAAI,WAAU,2BACb;AAAA,+BAAC,SAAI,WAAU,qCACb;AAAA,gCAAC,UAAK,WAAU,4BAA2B,yBAAQ;AAAA,YACnD,qBAAC,SAAI,WAAU,6BACb;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,SAAS,MAAM,MAAM,KAAK,QAAQ;AAAA,kBAElC;AAAA,wCAAC,QAAK,MAAM,IAAI;AAAA,oBAAE;AAAA;AAAA;AAAA,cAEpB;AAAA,cAEA,qBAAC,WACC;AAAA,oCAAC,kBAAe,SAAO,MACrB;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAQ;AAAA,oBACR,WAAU;AAAA,oBACV,SAAS,MAAM,MAAM,KAAK,WAAW;AAAA,oBAErC,8BAAC,YAAS,MAAM,IAAI;AAAA;AAAA,gBACtB,GACF;AAAA,gBACA,oBAAC,kBAAe,0CAAyB;AAAA,iBAC3C;AAAA,eACF;AAAA,aACF;AAAA,UAEA,qBAAC,WAAQ,WAAU,SAAQ,OAAM,IAC/B;AAAA,gCAAC,gBAAa,aAAY,eAAc;AAAA,YACxC,qBAAC,eAAY,WAAU,mEACrB;AAAA,kCAAC,gBAAa,+BAAiB;AAAA,cAC9B,MAAM,IAAI,CAAC,SACV;AAAA,gBAAC;AAAA;AAAA,kBAEC,WAAW;AAAA,kBACX,gBAAgB,MAAM,aAAa,KAAK,EAAE;AAAA,kBAC1C,gBAAgB,MAAM,aAAa,IAAI;AAAA,kBACvC,SAAS,MAAM,aAAa,KAAK,EAAE;AAAA,kBACnC,QAAQ,MAAM,aAAa,IAAI;AAAA,kBAC/B,UAAU,MAAM,WAAW,KAAK,EAAE;AAAA,kBAClC,WAAU;AAAA,kBAEV,+BAAC,SAAI,WAAU,4CACb;AAAA,yCAAC,SAAI,WAAU,2BACb;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,KAAI;AAAA,0BACJ,KAAK,KAAK;AAAA,0BACV,OAAO;AAAA,0BACP,QAAQ;AAAA,0BACR,WAAU;AAAA;AAAA,sBACZ;AAAA,sBACC,KAAK;AAAA,uBACR;AAAA,oBAEA,qBAAC,WAAQ,MAAM,cAAc,KAAK,IAChC;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,0BAClC,eAAe,CAAC,MAAM,EAAE,gBAAgB;AAAA,0BAExC;AAAA,4BAAC;AAAA;AAAA,8BACC,SAAS,KAAK;AAAA,8BACd,iBAAiB,MAAM,WAAW,KAAK,EAAE;AAAA,8BACzC,WAAW,cAAc,KAAK,KAAK,oBAAoB;AAAA;AAAA,0BACzD;AAAA;AAAA,sBACF;AAAA,sBACA,oBAAC,kBACE,eAAK,UAAU,uBAAuB,wBACzC;AAAA,uBACF;AAAA,qBACF;AAAA;AAAA,gBApCK,KAAK;AAAA,cAqCZ,CACD;AAAA,eACH;AAAA,aACF;AAAA,WACF;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;","names":[]}
package/dist/index.mjs CHANGED
@@ -17,11 +17,89 @@ import { NavBar } from "./components/layouts/NavBar";
17
17
  import { SideBarNavigation } from "./components/layouts/SideBarNavigation";
18
18
  import { MdSideBarNavigation } from "./components/layouts/MdSideBarNavigation";
19
19
  import { NotificationItem } from "./components/layouts/NotificationItem";
20
+ import { NotificationsPopover } from "./components/layouts/NotificationsPopover";
21
+ import { UsersSelectorPopover } from "./components/layouts/UsersSelectorPopover";
20
22
  import { ProfilePopover } from "./components/layouts/ProfilePopover";
21
23
  import { NavBarItem } from "./components/layouts/NavBarItem";
24
+ import { Button, buttonVariants } from "./components/ui/buttons/Button";
25
+ import { CopyButton } from "./components/ui/buttons/CopyButton";
26
+ import { default as default2 } from "./components/ui/buttons/CancelButton";
27
+ import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "./components/ui/data-display/Accordion";
28
+ import { Badge, badgeVariants } from "./components/ui/data-display/Badge";
29
+ import { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent } from "./components/ui/data-display/Card";
30
+ import { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis } from "./components/ui/data-display/Pagination";
31
+ import { ScrollArea, ScrollBar } from "./components/ui/data-display/ScrollArea";
32
+ import { Separator } from "./components/ui/data-display/Separator";
33
+ import { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption } from "./components/ui/data-display/Table";
34
+ import { Tabs, TabsList, TabsTrigger, TabsContent } from "./components/ui/data-display/Tabs";
22
35
  import { UserAvatar } from "./components/ui/data-display/UserAvatar";
36
+ import { default as default3 } from "./components/ui/feedback/CircularProgress";
37
+ import { default as default4 } from "./components/ui/feedback/DefaultCircularProgress";
38
+ import { Progress } from "./components/ui/feedback/Progress";
39
+ import { Toast, toastVariants, toastIconContainerVariants } from "./components/ui/feedback/Toast";
40
+ import { Calendar, CalendarDayButton } from "./components/ui/form/Calendar";
41
+ import { Checkbox } from "./components/ui/form/Checkbox";
42
+ import { DatePicker } from "./components/ui/form/DatePicker";
43
+ import { DateRangePicker } from "./components/ui/form/DateRangePicker";
44
+ import { Input } from "./components/ui/form/Input";
45
+ import { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } from "./components/ui/form/InputOtp";
46
+ import { RadioGroup, RadioGroupItem } from "./components/ui/form/RadioGroup";
47
+ import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from "./components/ui/form/Select";
48
+ import { Switch } from "./components/ui/form/Switch";
49
+ import { Textarea } from "./components/ui/form/Textarea";
50
+ import { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator } from "./components/ui/overlay/Command";
51
+ import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from "./components/ui/overlay/Dialog";
52
+ import { Popover, PopoverTrigger, PopoverContent, PopoverAnchor } from "./components/ui/overlay/Popover";
53
+ import { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription } from "./components/ui/overlay/Sheet";
54
+ import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from "./components/ui/overlay/Tooltip";
23
55
  import { useMdSidebarStore } from "./store/useMdSidebarStore";
24
56
  export {
57
+ Accordion,
58
+ AccordionContent,
59
+ AccordionItem,
60
+ AccordionTrigger,
61
+ Badge,
62
+ Button,
63
+ Calendar,
64
+ CalendarDayButton,
65
+ default2 as CancelButton,
66
+ Card,
67
+ CardAction,
68
+ CardContent,
69
+ CardDescription,
70
+ CardFooter,
71
+ CardHeader,
72
+ CardTitle,
73
+ Checkbox,
74
+ default3 as CircularProgress,
75
+ Command,
76
+ CommandDialog,
77
+ CommandEmpty,
78
+ CommandGroup,
79
+ CommandInput,
80
+ CommandItem,
81
+ CommandList,
82
+ CommandSeparator,
83
+ CommandShortcut,
84
+ CopyButton,
85
+ DatePicker,
86
+ DateRangePicker,
87
+ default4 as DefaultCircularProgress,
88
+ Dialog,
89
+ DialogClose,
90
+ DialogContent,
91
+ DialogDescription,
92
+ DialogFooter,
93
+ DialogHeader,
94
+ DialogOverlay,
95
+ DialogPortal,
96
+ DialogTitle,
97
+ DialogTrigger,
98
+ Input,
99
+ InputOTP,
100
+ InputOTPGroup,
101
+ InputOTPSeparator,
102
+ InputOTPSlot,
25
103
  MainLayout,
26
104
  MainLayoutContent,
27
105
  MainLayoutMain,
@@ -30,17 +108,77 @@ export {
30
108
  NavBar,
31
109
  NavBarItem,
32
110
  NotificationItem,
111
+ NotificationsPopover,
112
+ Pagination,
113
+ PaginationContent,
114
+ PaginationEllipsis,
115
+ PaginationItem,
116
+ PaginationLink,
117
+ PaginationNext,
118
+ PaginationPrevious,
119
+ Popover,
120
+ PopoverAnchor,
121
+ PopoverContent,
122
+ PopoverTrigger,
33
123
  ProfilePopover,
124
+ Progress,
34
125
  QueryProvider,
126
+ RadioGroup,
127
+ RadioGroupItem,
128
+ ScrollArea,
129
+ ScrollBar,
130
+ Select,
131
+ SelectContent,
132
+ SelectGroup,
133
+ SelectItem,
134
+ SelectLabel,
135
+ SelectScrollDownButton,
136
+ SelectScrollUpButton,
137
+ SelectSeparator,
138
+ SelectTrigger,
139
+ SelectValue,
140
+ Separator,
141
+ Sheet,
142
+ SheetClose,
143
+ SheetContent,
144
+ SheetDescription,
145
+ SheetFooter,
146
+ SheetHeader,
147
+ SheetTitle,
148
+ SheetTrigger,
35
149
  SideBarNavigation,
150
+ Switch,
151
+ Table,
152
+ TableBody,
153
+ TableCaption,
154
+ TableCell,
155
+ TableFooter,
156
+ TableHead,
157
+ TableHeader,
158
+ TableRow,
159
+ Tabs,
160
+ TabsContent,
161
+ TabsList,
162
+ TabsTrigger,
163
+ Textarea,
164
+ Toast,
165
+ Tooltip,
166
+ TooltipContent,
167
+ TooltipProvider,
168
+ TooltipTrigger,
36
169
  USER_QUERY_KEY,
37
170
  UserAvatar,
171
+ UsersSelectorPopover,
172
+ badgeVariants,
38
173
  buildQueryParams,
174
+ buttonVariants,
39
175
  cn,
40
176
  continueChain,
41
177
  createAuthMiddleware,
42
178
  createMiddlewareChain,
43
179
  stopChain,
180
+ toastIconContainerVariants,
181
+ toastVariants,
44
182
  useInvalidateUser,
45
183
  useMdSidebarStore,
46
184
  useSetUserData,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Types\nexport * from './modules/auth/schema';\nexport * from './modules/users/schema';\nexport * from './modules/whitelabel/schema';\nexport * from './infra/api/types';\n\n// Contexts\nexport * from './providers/query.provider';\nexport * from './providers/auth.provider';\nexport * from './providers/whitelabel.provider';\n\n// Hooks\nexport { useUserQuery, useUserValidateSession, useInvalidateUser, useSetUserData, USER_QUERY_KEY } from './modules/auth/hooks/useUserQuery';\n\n// Providers\nexport { QueryProvider } from './providers/query.provider';\n\n// Middleware\nexport { createAuthMiddleware } from './middlewares/create-auth-middleware';\nexport { createMiddlewareChain } from './middlewares/chain';\nexport { continueChain, stopChain } from './middlewares/types';\nexport type { MiddlewareFunction, MiddlewareConfig, MiddlewareResult } from './middlewares/types';\n\n// Utils\nexport { cn } from './infra/utils/clsx';\nexport { buildQueryParams } from './infra/utils/params';\n\n// Layout\nexport { MainLayout, MainLayoutContent, MainLayoutSpacer, MainLayoutMain } from './components/layouts/MainLayout';\nexport { NavBar } from './components/layouts/NavBar';\nexport type { NavBarProps } from './components/layouts/NavBar';\nexport { SideBarNavigation } from './components/layouts/SideBarNavigation';\nexport { MdSideBarNavigation } from './components/layouts/MdSideBarNavigation';\nexport { NotificationItem } from './components/layouts/NotificationItem';\nexport type { NotificationItemProps } from './components/layouts/NotificationItem';\nexport { ProfilePopover } from './components/layouts/ProfilePopover';\nexport type { ProfilePopoverProps, ProfileMenuItem } from './components/layouts/ProfilePopover';\nexport { NavBarItem } from './components/layouts/NavBarItem';\nexport type { NavBarItemProps } from './components/layouts/NavBarItem';\nexport { UserAvatar } from './components/ui/data-display/UserAvatar';\nexport type { UserAvatarProps } from './components/ui/data-display/UserAvatar';\n\n// Store\nexport { useMdSidebarStore } from './store/useMdSidebarStore';\n"],"mappings":"AACA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AAGd,cAAc;AACd,cAAc;AACd,cAAc;AAGd,SAAS,cAAc,wBAAwB,mBAAmB,gBAAgB,sBAAsB;AAGxG,SAAS,qBAAqB;AAG9B,SAAS,4BAA4B;AACrC,SAAS,6BAA6B;AACtC,SAAS,eAAe,iBAAiB;AAIzC,SAAS,UAAU;AACnB,SAAS,wBAAwB;AAGjC,SAAS,YAAY,mBAAmB,kBAAkB,sBAAsB;AAChF,SAAS,cAAc;AAEvB,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AAEjC,SAAS,sBAAsB;AAE/B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAI3B,SAAS,yBAAyB;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Types\nexport * from './modules/auth/schema';\nexport * from './modules/users/schema';\nexport * from './modules/whitelabel/schema';\nexport * from './infra/api/types';\n\n// Contexts\nexport * from './providers/query.provider';\nexport * from './providers/auth.provider';\nexport * from './providers/whitelabel.provider';\n\n// Hooks\nexport { useUserQuery, useUserValidateSession, useInvalidateUser, useSetUserData, USER_QUERY_KEY } from './modules/auth/hooks/useUserQuery';\n\n// Providers\nexport { QueryProvider } from './providers/query.provider';\n\n// Middleware\nexport { createAuthMiddleware } from './middlewares/create-auth-middleware';\nexport { createMiddlewareChain } from './middlewares/chain';\nexport { continueChain, stopChain } from './middlewares/types';\nexport type { MiddlewareFunction, MiddlewareConfig, MiddlewareResult } from './middlewares/types';\n\n// Utils\nexport { cn } from './infra/utils/clsx';\nexport { buildQueryParams } from './infra/utils/params';\n\n// Layout\nexport { MainLayout, MainLayoutContent, MainLayoutSpacer, MainLayoutMain } from './components/layouts/MainLayout';\nexport { NavBar } from './components/layouts/NavBar';\nexport type { NavBarProps } from './components/layouts/NavBar';\nexport { SideBarNavigation } from './components/layouts/SideBarNavigation';\nexport { MdSideBarNavigation } from './components/layouts/MdSideBarNavigation';\nexport { NotificationItem } from './components/layouts/NotificationItem';\nexport type { NotificationItemProps } from './components/layouts/NotificationItem';\nexport { NotificationsPopover } from './components/layouts/NotificationsPopover';\nexport type { NotificationsPopoverProps, NotificationData } from './components/layouts/NotificationsPopover';\nexport { UsersSelectorPopover } from './components/layouts/UsersSelectorPopover';\nexport type { UsersSelectorPopoverProps, UserSelectorItem } from './components/layouts/UsersSelectorPopover';\nexport { ProfilePopover } from './components/layouts/ProfilePopover';\nexport type { ProfilePopoverProps, ProfileMenuItem } from './components/layouts/ProfilePopover';\nexport { NavBarItem } from './components/layouts/NavBarItem';\nexport type { NavBarItemProps } from './components/layouts/NavBarItem';\n\n// UI - Buttons\nexport { Button, buttonVariants } from './components/ui/buttons/Button';\nexport { CopyButton } from './components/ui/buttons/CopyButton';\nexport { default as CancelButton } from './components/ui/buttons/CancelButton';\n\n// UI - Data Display\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './components/ui/data-display/Accordion';\nexport { Badge, badgeVariants } from './components/ui/data-display/Badge';\nexport { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent } from './components/ui/data-display/Card';\nexport { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis } from './components/ui/data-display/Pagination';\nexport { ScrollArea, ScrollBar } from './components/ui/data-display/ScrollArea';\nexport { Separator } from './components/ui/data-display/Separator';\nexport { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption } from './components/ui/data-display/Table';\nexport { Tabs, TabsList, TabsTrigger, TabsContent } from './components/ui/data-display/Tabs';\nexport { UserAvatar } from './components/ui/data-display/UserAvatar';\nexport type { UserAvatarProps } from './components/ui/data-display/UserAvatar';\n\n// UI - Feedback\nexport { default as CircularProgress } from './components/ui/feedback/CircularProgress';\nexport { default as DefaultCircularProgress } from './components/ui/feedback/DefaultCircularProgress';\nexport { Progress } from './components/ui/feedback/Progress';\nexport { Toast, toastVariants, toastIconContainerVariants } from './components/ui/feedback/Toast';\nexport type { ToastProps } from './components/ui/feedback/Toast';\n\n// UI - Form\nexport { Calendar, CalendarDayButton } from './components/ui/form/Calendar';\nexport { Checkbox } from './components/ui/form/Checkbox';\nexport { DatePicker } from './components/ui/form/DatePicker';\nexport { DateRangePicker } from './components/ui/form/DateRangePicker';\nexport { Input } from './components/ui/form/Input';\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } from './components/ui/form/InputOtp';\nexport { RadioGroup, RadioGroupItem } from './components/ui/form/RadioGroup';\nexport { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from './components/ui/form/Select';\nexport { Switch } from './components/ui/form/Switch';\nexport { Textarea } from './components/ui/form/Textarea';\n\n// UI - Overlay\nexport { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator } from './components/ui/overlay/Command';\nexport { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from './components/ui/overlay/Dialog';\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor } from './components/ui/overlay/Popover';\nexport { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription } from './components/ui/overlay/Sheet';\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from './components/ui/overlay/Tooltip';\n\n// Store\nexport { useMdSidebarStore } from './store/useMdSidebarStore';\n"],"mappings":"AACA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AAGd,cAAc;AACd,cAAc;AACd,cAAc;AAGd,SAAS,cAAc,wBAAwB,mBAAmB,gBAAgB,sBAAsB;AAGxG,SAAS,qBAAqB;AAG9B,SAAS,4BAA4B;AACrC,SAAS,6BAA6B;AACtC,SAAS,eAAe,iBAAiB;AAIzC,SAAS,UAAU;AACnB,SAAS,wBAAwB;AAGjC,SAAS,YAAY,mBAAmB,kBAAkB,sBAAsB;AAChF,SAAS,cAAc;AAEvB,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AAEjC,SAAS,4BAA4B;AAErC,SAAS,4BAA4B;AAErC,SAAS,sBAAsB;AAE/B,SAAS,kBAAkB;AAI3B,SAAS,QAAQ,sBAAsB;AACvC,SAAS,kBAAkB;AAC3B,SAAoB,WAAXA,gBAA+B;AAGxC,SAAS,WAAW,eAAe,kBAAkB,wBAAwB;AAC7E,SAAS,OAAO,qBAAqB;AACrC,SAAS,MAAM,YAAY,YAAY,WAAW,YAAY,iBAAiB,mBAAmB;AAClG,SAAS,YAAY,mBAAmB,gBAAgB,gBAAgB,oBAAoB,gBAAgB,0BAA0B;AACtI,SAAS,YAAY,iBAAiB;AACtC,SAAS,iBAAiB;AAC1B,SAAS,OAAO,aAAa,WAAW,aAAa,WAAW,UAAU,WAAW,oBAAoB;AACzG,SAAS,MAAM,UAAU,aAAa,mBAAmB;AACzD,SAAS,kBAAkB;AAI3B,SAAoB,WAAXA,gBAAmC;AAC5C,SAAoB,WAAXA,gBAA0C;AACnD,SAAS,gBAAgB;AACzB,SAAS,OAAO,eAAe,kCAAkC;AAIjE,SAAS,UAAU,yBAAyB;AAC5C,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,SAAS,UAAU,eAAe,cAAc,yBAAyB;AACzE,SAAS,YAAY,sBAAsB;AAC3C,SAAS,QAAQ,eAAe,aAAa,YAAY,aAAa,wBAAwB,sBAAsB,iBAAiB,eAAe,mBAAmB;AACvK,SAAS,cAAc;AACvB,SAAS,gBAAgB;AAGzB,SAAS,SAAS,eAAe,cAAc,aAAa,cAAc,cAAc,aAAa,iBAAiB,wBAAwB;AAC9I,SAAS,QAAQ,aAAa,eAAe,mBAAmB,cAAc,cAAc,eAAe,cAAc,aAAa,qBAAqB;AAC3J,SAAS,SAAS,gBAAgB,gBAAgB,qBAAqB;AACvE,SAAS,OAAO,cAAc,YAAY,cAAc,aAAa,aAAa,YAAY,wBAAwB;AACtH,SAAS,SAAS,gBAAgB,gBAAgB,uBAAuB;AAGzE,SAAS,yBAAyB;","names":["default"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@greatapps/common",
3
- "version": "1.1.2",
3
+ "version": "1.1.4",
4
4
  "description": "Shared library for GreatApps frontend applications",
5
5
  "main": "./dist/index.mjs",
6
6
  "types": "./src/index.ts",
@@ -0,0 +1,111 @@
1
+ "use client";
2
+
3
+ import { ReactNode, useState } from "react";
4
+ import { Bell } from "lucide-react";
5
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
6
+ import { Popover } from "../ui/overlay/Popover";
7
+ import { Button } from "../ui/buttons/Button";
8
+ import { NotificationItem } from "./NotificationItem";
9
+ import { cn } from "../../infra/utils/clsx";
10
+
11
+ export interface NotificationData {
12
+ icon: ReactNode;
13
+ iconBgColor: string;
14
+ title: string;
15
+ time: string;
16
+ }
17
+
18
+ export interface NotificationsPopoverProps {
19
+ notifications?: NotificationData[];
20
+ onViewAll?: () => void;
21
+ side?: "top" | "bottom" | "left" | "right";
22
+ align?: "start" | "center" | "end";
23
+ contentClassName?: string;
24
+ badgeClassName?: string;
25
+ }
26
+
27
+ function NotificationsPopover({
28
+ notifications = [],
29
+ onViewAll,
30
+ side,
31
+ align,
32
+ contentClassName,
33
+ badgeClassName = "bg-pages-400",
34
+ }: NotificationsPopoverProps) {
35
+ const [open, setOpen] = useState(false);
36
+ const [hasNewNotifications, setHasNewNotifications] = useState(true);
37
+
38
+ const handleOpenChange = (isOpen: boolean) => {
39
+ setOpen(isOpen);
40
+ if (isOpen) setHasNewNotifications(false);
41
+ };
42
+
43
+ return (
44
+ <Popover open={open} onOpenChange={handleOpenChange}>
45
+ <PopoverPrimitive.Trigger className="cursor-pointer">
46
+ <div
47
+ className={`relative rounded-full p-2.5 ${open ? "bg-gray-100" : "hover:bg-gray-100"}`}
48
+ >
49
+ <Bell size={20} className="text-gray-500" />
50
+ {hasNewNotifications && (
51
+ <span
52
+ className={cn(
53
+ "absolute top-2 right-2 size-2.5 rounded-full",
54
+ badgeClassName,
55
+ )}
56
+ />
57
+ )}
58
+ </div>
59
+ </PopoverPrimitive.Trigger>
60
+ <PopoverPrimitive.Portal>
61
+ <PopoverPrimitive.Content
62
+ className={cn(
63
+ "absolute bottom-2 left-[26px] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200",
64
+ contentClassName,
65
+ )}
66
+ side={side}
67
+ align={align}
68
+ sideOffset={8}
69
+ >
70
+ <span className="paragraph-small-semibold text-gray-950 px-4">
71
+ Últimas notificações
72
+ </span>
73
+
74
+ {notifications.length > 0 ? (
75
+ notifications.map((notification, index) => (
76
+ <NotificationItem
77
+ key={index}
78
+ icon={notification.icon}
79
+ iconBgColor={notification.iconBgColor}
80
+ title={notification.title}
81
+ time={notification.time}
82
+ showBorder={index < notifications.length - 1}
83
+ />
84
+ ))
85
+ ) : (
86
+ <div className="flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]">
87
+ <div className="bg-gray-50 rounded-md p-2.5">
88
+ <Bell size={20} color="var(--color-gray-950)" />
89
+ </div>
90
+ <span className="paragraph-small-medium text-gray-950">
91
+ Sem notificações por enquanto
92
+ </span>
93
+ </div>
94
+ )}
95
+
96
+ {onViewAll && (
97
+ <Button
98
+ variant="secondary"
99
+ className="h-8! mt-2 mb-4 mx-4 paragraph-small-semibold"
100
+ onClick={onViewAll}
101
+ >
102
+ Todas as notificações
103
+ </Button>
104
+ )}
105
+ </PopoverPrimitive.Content>
106
+ </PopoverPrimitive.Portal>
107
+ </Popover>
108
+ );
109
+ }
110
+
111
+ export { NotificationsPopover };
@@ -2,7 +2,8 @@
2
2
 
3
3
  import { useState } from 'react';
4
4
  import { useRouter } from 'next/navigation';
5
- import { Popover, PopoverContent, PopoverTrigger } from '../ui/overlay/Popover';
5
+ import * as PopoverPrimitive from '@radix-ui/react-popover';
6
+ import { Popover } from '../ui/overlay/Popover';
6
7
  import { Button } from '../ui/buttons/Button';
7
8
  import { Progress } from '../ui/feedback/Progress';
8
9
  import { Separator } from '../ui/data-display/Separator';
@@ -33,7 +34,7 @@ export interface ProfilePopoverProps {
33
34
  function ProfilePopover({
34
35
  side = 'top',
35
36
  align = 'start',
36
- contentClassName,
37
+ contentClassName = 'absolute bottom-2 left-[26px]',
37
38
  onEditProfile,
38
39
  credits,
39
40
  onCreditsClick,
@@ -67,7 +68,7 @@ function ProfilePopover({
67
68
  <>
68
69
  {isLoggingOut && logoutOverlay}
69
70
  <Popover>
70
- <PopoverTrigger className="cursor-pointer">
71
+ <PopoverPrimitive.Trigger className="cursor-pointer">
71
72
  {user && (
72
73
  <UserAvatar
73
74
  key={user.id}
@@ -77,9 +78,10 @@ function ProfilePopover({
77
78
  storageUrl={storageUrl}
78
79
  />
79
80
  )}
80
- </PopoverTrigger>
81
+ </PopoverPrimitive.Trigger>
81
82
 
82
- <PopoverContent
83
+ <PopoverPrimitive.Portal>
84
+ <PopoverPrimitive.Content
83
85
  className={cn(
84
86
  'w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99',
85
87
  contentClassName
@@ -162,7 +164,8 @@ function ProfilePopover({
162
164
  <NavBarItem label="Sair" onClick={handleLogout} />
163
165
  </div>
164
166
  </div>
165
- </PopoverContent>
167
+ </PopoverPrimitive.Content>
168
+ </PopoverPrimitive.Portal>
166
169
  </Popover>
167
170
  </>
168
171
  );
@@ -0,0 +1,158 @@
1
+ "use client"
2
+
3
+ import { useState } from 'react';
4
+ import { Plus, Settings, User } from 'lucide-react';
5
+ import Image from 'next/image';
6
+ import { useRouter } from 'next/navigation';
7
+ import { Popover, PopoverContent, PopoverTrigger } from '../ui/overlay/Popover';
8
+ import { Button } from '../ui/buttons/Button';
9
+ import { Command, CommandEmpty, CommandInput, CommandItem, CommandList } from '../ui/overlay/Command';
10
+ import { Checkbox } from '../ui/form/Checkbox';
11
+ import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/overlay/Tooltip';
12
+ import { cn } from '../../infra/utils/clsx';
13
+
14
+ export interface UserSelectorItem {
15
+ id: number;
16
+ name: string;
17
+ avatar: string;
18
+ checked: boolean;
19
+ }
20
+
21
+ export interface UsersSelectorPopoverProps {
22
+ users?: UserSelectorItem[];
23
+ onToggleUser?: (id: number) => void;
24
+ addRoute?: string;
25
+ manageRoute?: string;
26
+ userCount?: number;
27
+ side?: 'top' | 'bottom' | 'left' | 'right';
28
+ align?: 'start' | 'center' | 'end';
29
+ contentClassName?: string;
30
+ }
31
+
32
+ function UsersSelectorPopover({
33
+ users: externalUsers,
34
+ onToggleUser,
35
+ addRoute = '/my-teams?createNew=true',
36
+ manageRoute = '/my-teams',
37
+ userCount = 5,
38
+ side,
39
+ align,
40
+ contentClassName,
41
+ }: UsersSelectorPopoverProps) {
42
+ const route = useRouter();
43
+ const [open, setOpen] = useState(false);
44
+ const [internalUsers, setInternalUsers] = useState<UserSelectorItem[]>(externalUsers ?? []);
45
+ const [hoveredId, setHoveredId] = useState<number | null>(null);
46
+
47
+ const users = externalUsers ?? internalUsers;
48
+
49
+ const toggleUser = (id: number) => {
50
+ if (onToggleUser) {
51
+ onToggleUser(id);
52
+ } else {
53
+ setInternalUsers((prev) =>
54
+ prev.map((u) => (u.id === id ? { ...u, checked: !u.checked } : u))
55
+ );
56
+ }
57
+ };
58
+
59
+ return (
60
+ <Popover open={open} onOpenChange={setOpen}>
61
+ <PopoverTrigger className="cursor-pointer">
62
+ <div className="flex items-center gap-2 text-gray-950 px-3 py-2 border border-gray-200 rounded-full hover:border-gray-950">
63
+ <span className="paragraph-small-semibold">{userCount}</span>
64
+ <User size={16} />
65
+ </div>
66
+ </PopoverTrigger>
67
+
68
+ <PopoverContent
69
+ className={cn(
70
+ 'absolute right-[-88px] w-[273px] p-0 bg-white rounded-2xl shadow-md border border-gray-200',
71
+ contentClassName
72
+ )}
73
+ side={side}
74
+ align={align}
75
+ sideOffset={8}
76
+ >
77
+ <div className="flex flex-col p-3 gap-2">
78
+ <div className="flex items-center justify-between">
79
+ <span className="paragraph-small-semibold">Usuários</span>
80
+ <div className="flex items-center gap-1.5">
81
+ <Button
82
+ variant="secondary"
83
+ className="h-8 paragraph-small-semibold text-gray-950"
84
+ onClick={() => route.push(addRoute)}
85
+ >
86
+ <Plus size={16} />
87
+ Adicionar
88
+ </Button>
89
+
90
+ <Tooltip>
91
+ <TooltipTrigger asChild>
92
+ <Button
93
+ variant="secondary"
94
+ className="p-0 size-8"
95
+ onClick={() => route.push(manageRoute)}
96
+ >
97
+ <Settings size={18} />
98
+ </Button>
99
+ </TooltipTrigger>
100
+ <TooltipContent>Visualizar todos usuários</TooltipContent>
101
+ </Tooltip>
102
+ </div>
103
+ </div>
104
+
105
+ <Command className="gap-2" value="">
106
+ <CommandInput placeholder="Busque aqui" />
107
+ <CommandList className="custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]">
108
+ <CommandEmpty>No results found.</CommandEmpty>
109
+ {users.map((user) => (
110
+ <CommandItem
111
+ key={user.id}
112
+ autoFocus={false}
113
+ onPointerEnter={() => setHoveredId(user.id)}
114
+ onPointerLeave={() => setHoveredId(null)}
115
+ onFocus={() => setHoveredId(user.id)}
116
+ onBlur={() => setHoveredId(null)}
117
+ onSelect={() => toggleUser(user.id)}
118
+ className="cursor-pointer"
119
+ >
120
+ <div className="flex items-center justify-between w-full">
121
+ <div className="flex items-center gap-2">
122
+ <Image
123
+ alt="Avatar"
124
+ src={user.avatar}
125
+ width={32}
126
+ height={32}
127
+ className="rounded-full"
128
+ />
129
+ {user.name}
130
+ </div>
131
+
132
+ <Tooltip open={hoveredId === user.id}>
133
+ <TooltipTrigger
134
+ onClick={(e) => e.stopPropagation()}
135
+ onPointerDown={(e) => e.stopPropagation()}
136
+ >
137
+ <Checkbox
138
+ checked={user.checked}
139
+ onCheckedChange={() => toggleUser(user.id)}
140
+ className={hoveredId === user.id ? 'border-gray-950' : ''}
141
+ />
142
+ </TooltipTrigger>
143
+ <TooltipContent>
144
+ {user.checked ? 'Remover do projeto' : 'Adicionar ao projeto'}
145
+ </TooltipContent>
146
+ </Tooltip>
147
+ </div>
148
+ </CommandItem>
149
+ ))}
150
+ </CommandList>
151
+ </Command>
152
+ </div>
153
+ </PopoverContent>
154
+ </Popover>
155
+ );
156
+ }
157
+
158
+ export { UsersSelectorPopover };
package/src/index.ts CHANGED
@@ -33,12 +33,57 @@ export { SideBarNavigation } from './components/layouts/SideBarNavigation';
33
33
  export { MdSideBarNavigation } from './components/layouts/MdSideBarNavigation';
34
34
  export { NotificationItem } from './components/layouts/NotificationItem';
35
35
  export type { NotificationItemProps } from './components/layouts/NotificationItem';
36
+ export { NotificationsPopover } from './components/layouts/NotificationsPopover';
37
+ export type { NotificationsPopoverProps, NotificationData } from './components/layouts/NotificationsPopover';
38
+ export { UsersSelectorPopover } from './components/layouts/UsersSelectorPopover';
39
+ export type { UsersSelectorPopoverProps, UserSelectorItem } from './components/layouts/UsersSelectorPopover';
36
40
  export { ProfilePopover } from './components/layouts/ProfilePopover';
37
41
  export type { ProfilePopoverProps, ProfileMenuItem } from './components/layouts/ProfilePopover';
38
42
  export { NavBarItem } from './components/layouts/NavBarItem';
39
43
  export type { NavBarItemProps } from './components/layouts/NavBarItem';
44
+
45
+ // UI - Buttons
46
+ export { Button, buttonVariants } from './components/ui/buttons/Button';
47
+ export { CopyButton } from './components/ui/buttons/CopyButton';
48
+ export { default as CancelButton } from './components/ui/buttons/CancelButton';
49
+
50
+ // UI - Data Display
51
+ export { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './components/ui/data-display/Accordion';
52
+ export { Badge, badgeVariants } from './components/ui/data-display/Badge';
53
+ export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent } from './components/ui/data-display/Card';
54
+ export { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis } from './components/ui/data-display/Pagination';
55
+ export { ScrollArea, ScrollBar } from './components/ui/data-display/ScrollArea';
56
+ export { Separator } from './components/ui/data-display/Separator';
57
+ export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption } from './components/ui/data-display/Table';
58
+ export { Tabs, TabsList, TabsTrigger, TabsContent } from './components/ui/data-display/Tabs';
40
59
  export { UserAvatar } from './components/ui/data-display/UserAvatar';
41
60
  export type { UserAvatarProps } from './components/ui/data-display/UserAvatar';
42
61
 
62
+ // UI - Feedback
63
+ export { default as CircularProgress } from './components/ui/feedback/CircularProgress';
64
+ export { default as DefaultCircularProgress } from './components/ui/feedback/DefaultCircularProgress';
65
+ export { Progress } from './components/ui/feedback/Progress';
66
+ export { Toast, toastVariants, toastIconContainerVariants } from './components/ui/feedback/Toast';
67
+ export type { ToastProps } from './components/ui/feedback/Toast';
68
+
69
+ // UI - Form
70
+ export { Calendar, CalendarDayButton } from './components/ui/form/Calendar';
71
+ export { Checkbox } from './components/ui/form/Checkbox';
72
+ export { DatePicker } from './components/ui/form/DatePicker';
73
+ export { DateRangePicker } from './components/ui/form/DateRangePicker';
74
+ export { Input } from './components/ui/form/Input';
75
+ export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } from './components/ui/form/InputOtp';
76
+ export { RadioGroup, RadioGroupItem } from './components/ui/form/RadioGroup';
77
+ export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from './components/ui/form/Select';
78
+ export { Switch } from './components/ui/form/Switch';
79
+ export { Textarea } from './components/ui/form/Textarea';
80
+
81
+ // UI - Overlay
82
+ export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator } from './components/ui/overlay/Command';
83
+ export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from './components/ui/overlay/Dialog';
84
+ export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor } from './components/ui/overlay/Popover';
85
+ export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription } from './components/ui/overlay/Sheet';
86
+ export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from './components/ui/overlay/Tooltip';
87
+
43
88
  // Store
44
89
  export { useMdSidebarStore } from './store/useMdSidebarStore';