@wealthx/shadcn 1.3.0 → 1.3.2
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.
- package/.turbo/turbo-build.log +53 -53
- package/CHANGELOG.md +12 -0
- package/dist/chunk-N6TNTQL6.mjs +446 -0
- package/dist/{chunk-FNQXOAYJ.mjs → chunk-Q2BGOAMG.mjs} +61 -28
- package/dist/components/ui/advisor-card.js +61 -28
- package/dist/components/ui/advisor-card.mjs +5 -3
- package/dist/components/ui/sidebar-nav.js +269 -176
- package/dist/components/ui/sidebar-nav.mjs +2 -1
- package/dist/index.js +516 -428
- package/dist/index.mjs +5 -3
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/src/components/index.tsx +2 -1
- package/src/components/ui/advisor-card.tsx +111 -54
- package/src/components/ui/sidebar-nav.tsx +195 -141
- package/src/styles/styles-css.ts +1 -1
- package/dist/chunk-ZC45IGZO.mjs +0 -388
|
@@ -0,0 +1,446 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Tooltip,
|
|
3
|
+
TooltipContent,
|
|
4
|
+
TooltipProvider,
|
|
5
|
+
TooltipTrigger
|
|
6
|
+
} from "./chunk-6JQFUE5I.mjs";
|
|
7
|
+
import {
|
|
8
|
+
formatCurrency
|
|
9
|
+
} from "./chunk-MN5NYQCL.mjs";
|
|
10
|
+
import {
|
|
11
|
+
Accordion,
|
|
12
|
+
AccordionContent,
|
|
13
|
+
AccordionItem
|
|
14
|
+
} from "./chunk-MARPPFOJ.mjs";
|
|
15
|
+
import {
|
|
16
|
+
Button
|
|
17
|
+
} from "./chunk-XREGSKX3.mjs";
|
|
18
|
+
import {
|
|
19
|
+
cn
|
|
20
|
+
} from "./chunk-VLQZANBF.mjs";
|
|
21
|
+
|
|
22
|
+
// src/components/ui/sidebar-nav.tsx
|
|
23
|
+
import * as React from "react";
|
|
24
|
+
import {
|
|
25
|
+
ChevronDown,
|
|
26
|
+
ChevronRight,
|
|
27
|
+
Info,
|
|
28
|
+
LogOut,
|
|
29
|
+
PanelLeftClose,
|
|
30
|
+
PanelLeftOpen
|
|
31
|
+
} from "lucide-react";
|
|
32
|
+
import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
|
|
33
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
34
|
+
function getInitials(name) {
|
|
35
|
+
return name.split(" ").filter(Boolean).map((word) => word[0]).join("").toUpperCase().slice(0, 2);
|
|
36
|
+
}
|
|
37
|
+
function navIconCn(isActive) {
|
|
38
|
+
return cn(
|
|
39
|
+
"shrink-0 transition-colors",
|
|
40
|
+
isActive ? "text-primary" : "text-brand-secondary-foreground/50 group-hover:text-brand-secondary-foreground"
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
function NavTooltip({ label, collapsed, children }) {
|
|
44
|
+
if (!collapsed) return children;
|
|
45
|
+
return /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
46
|
+
/* @__PURE__ */ jsx(TooltipTrigger, { render: children }),
|
|
47
|
+
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: label })
|
|
48
|
+
] });
|
|
49
|
+
}
|
|
50
|
+
function MetricsGroup({ group }) {
|
|
51
|
+
return /* @__PURE__ */ jsx("div", { className: "border-b border-white/15 py-4 px-5 flex flex-col gap-1.5", children: group.items.map((item) => /* @__PURE__ */ jsxs(
|
|
52
|
+
"div",
|
|
53
|
+
{
|
|
54
|
+
className: "flex items-center justify-between gap-2",
|
|
55
|
+
children: [
|
|
56
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 min-w-0", children: [
|
|
57
|
+
/* @__PURE__ */ jsx(
|
|
58
|
+
"span",
|
|
59
|
+
{
|
|
60
|
+
className: cn(
|
|
61
|
+
"text-sm truncate text-brand-secondary-foreground/80",
|
|
62
|
+
item.isNetItem && "font-semibold text-brand-secondary-foreground border-b-2 border-primary pb-px"
|
|
63
|
+
),
|
|
64
|
+
children: item.name
|
|
65
|
+
}
|
|
66
|
+
),
|
|
67
|
+
item.info && /* @__PURE__ */ jsx(
|
|
68
|
+
Info,
|
|
69
|
+
{
|
|
70
|
+
size: 11,
|
|
71
|
+
strokeWidth: 2,
|
|
72
|
+
className: "shrink-0 text-brand-secondary-foreground/50"
|
|
73
|
+
}
|
|
74
|
+
)
|
|
75
|
+
] }),
|
|
76
|
+
/* @__PURE__ */ jsx(
|
|
77
|
+
"span",
|
|
78
|
+
{
|
|
79
|
+
className: cn(
|
|
80
|
+
"text-sm font-semibold tabular-nums shrink-0 text-brand-secondary-foreground",
|
|
81
|
+
item.isNetItem && item.value < 0 && "text-destructive"
|
|
82
|
+
),
|
|
83
|
+
children: formatCurrency(item.value, { showSign: item.isNetItem })
|
|
84
|
+
}
|
|
85
|
+
)
|
|
86
|
+
]
|
|
87
|
+
},
|
|
88
|
+
item.name
|
|
89
|
+
)) });
|
|
90
|
+
}
|
|
91
|
+
function SidebarNavItemView({
|
|
92
|
+
item,
|
|
93
|
+
collapsed,
|
|
94
|
+
onNavigate
|
|
95
|
+
}) {
|
|
96
|
+
var _a;
|
|
97
|
+
const Icon = item.icon;
|
|
98
|
+
return /* @__PURE__ */ jsx(NavTooltip, { label: item.title, collapsed, children: /* @__PURE__ */ jsxs(
|
|
99
|
+
Button,
|
|
100
|
+
{
|
|
101
|
+
type: "button",
|
|
102
|
+
variant: "ghost",
|
|
103
|
+
onClick: () => onNavigate == null ? void 0 : onNavigate(item.href),
|
|
104
|
+
className: cn(
|
|
105
|
+
"group h-auto w-full items-center gap-3 py-2.5 text-base font-medium transition-colors",
|
|
106
|
+
"text-brand-secondary-foreground/70 hover:bg-white/10 hover:text-brand-secondary-foreground",
|
|
107
|
+
collapsed ? "justify-center px-2" : cn(
|
|
108
|
+
"justify-start px-3 border-l-4",
|
|
109
|
+
item.isActive ? "bg-white/15 text-brand-secondary-foreground border-primary" : "border-transparent"
|
|
110
|
+
)
|
|
111
|
+
),
|
|
112
|
+
children: [
|
|
113
|
+
/* @__PURE__ */ jsx(
|
|
114
|
+
Icon,
|
|
115
|
+
{
|
|
116
|
+
className: navIconCn((_a = item.isActive) != null ? _a : false),
|
|
117
|
+
size: 24,
|
|
118
|
+
strokeWidth: 1.75
|
|
119
|
+
}
|
|
120
|
+
),
|
|
121
|
+
!collapsed && /* @__PURE__ */ jsx("span", { className: "truncate", children: item.title })
|
|
122
|
+
]
|
|
123
|
+
}
|
|
124
|
+
) });
|
|
125
|
+
}
|
|
126
|
+
function CollapsibleNavItem({
|
|
127
|
+
item,
|
|
128
|
+
collapsed,
|
|
129
|
+
onNavigate
|
|
130
|
+
}) {
|
|
131
|
+
var _a, _b;
|
|
132
|
+
const Icon = item.icon;
|
|
133
|
+
const hasActiveChild = (_b = (_a = item.subItems) == null ? void 0 : _a.some((sub) => sub.isActive)) != null ? _b : false;
|
|
134
|
+
const [open, setOpen] = React.useState(hasActiveChild);
|
|
135
|
+
React.useEffect(() => {
|
|
136
|
+
if (hasActiveChild) setOpen(true);
|
|
137
|
+
}, [hasActiveChild]);
|
|
138
|
+
if (collapsed) {
|
|
139
|
+
return /* @__PURE__ */ jsx(NavTooltip, { label: item.title, collapsed, children: /* @__PURE__ */ jsx(
|
|
140
|
+
Button,
|
|
141
|
+
{
|
|
142
|
+
type: "button",
|
|
143
|
+
variant: "ghost",
|
|
144
|
+
onClick: () => onNavigate == null ? void 0 : onNavigate(item.href),
|
|
145
|
+
className: cn(
|
|
146
|
+
"group h-auto w-full justify-center px-2 py-2.5 transition-colors",
|
|
147
|
+
"text-brand-secondary-foreground/70 hover:bg-white/10 hover:text-brand-secondary-foreground",
|
|
148
|
+
hasActiveChild && "bg-white/15 text-brand-secondary-foreground"
|
|
149
|
+
),
|
|
150
|
+
children: /* @__PURE__ */ jsx(
|
|
151
|
+
Icon,
|
|
152
|
+
{
|
|
153
|
+
className: navIconCn(hasActiveChild),
|
|
154
|
+
size: 24,
|
|
155
|
+
strokeWidth: 1.75
|
|
156
|
+
}
|
|
157
|
+
)
|
|
158
|
+
}
|
|
159
|
+
) });
|
|
160
|
+
}
|
|
161
|
+
return /* @__PURE__ */ jsx(
|
|
162
|
+
Accordion,
|
|
163
|
+
{
|
|
164
|
+
value: open ? [item.href] : [],
|
|
165
|
+
onValueChange: (values) => setOpen(values.length > 0),
|
|
166
|
+
children: /* @__PURE__ */ jsxs(AccordionItem, { className: "border-none", value: item.href, children: [
|
|
167
|
+
/* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
|
|
168
|
+
AccordionPrimitive.Trigger,
|
|
169
|
+
{
|
|
170
|
+
className: cn(
|
|
171
|
+
"group flex h-auto w-full items-center justify-start gap-3 px-3 py-2.5 text-base font-medium transition-colors",
|
|
172
|
+
"text-brand-secondary-foreground/70 hover:bg-white/10 hover:text-brand-secondary-foreground",
|
|
173
|
+
"border-l-4 border-transparent",
|
|
174
|
+
hasActiveChild && "bg-white/15 text-brand-secondary-foreground border-primary"
|
|
175
|
+
),
|
|
176
|
+
children: [
|
|
177
|
+
/* @__PURE__ */ jsx(
|
|
178
|
+
Icon,
|
|
179
|
+
{
|
|
180
|
+
className: navIconCn(hasActiveChild),
|
|
181
|
+
size: 24,
|
|
182
|
+
strokeWidth: 1.75
|
|
183
|
+
}
|
|
184
|
+
),
|
|
185
|
+
/* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-left", children: item.title }),
|
|
186
|
+
/* @__PURE__ */ jsx(
|
|
187
|
+
ChevronDown,
|
|
188
|
+
{
|
|
189
|
+
className: cn(
|
|
190
|
+
"ml-auto shrink-0 text-brand-secondary-foreground/40 transition-transform duration-200",
|
|
191
|
+
"group-data-[panel-open]:rotate-180"
|
|
192
|
+
),
|
|
193
|
+
size: 14,
|
|
194
|
+
strokeWidth: 2
|
|
195
|
+
}
|
|
196
|
+
)
|
|
197
|
+
]
|
|
198
|
+
}
|
|
199
|
+
) }),
|
|
200
|
+
item.subItems && /* @__PURE__ */ jsx(AccordionContent, { className: "p-0 text-inherit", children: /* @__PURE__ */ jsx("div", { className: "ml-9 border-l border-white/15 pl-3", children: item.subItems.map((sub) => /* @__PURE__ */ jsxs(
|
|
201
|
+
Button,
|
|
202
|
+
{
|
|
203
|
+
type: "button",
|
|
204
|
+
variant: "ghost",
|
|
205
|
+
onClick: () => onNavigate == null ? void 0 : onNavigate(sub.href),
|
|
206
|
+
className: cn(
|
|
207
|
+
"h-auto w-full justify-start gap-2 py-1.5 pl-1 text-sm transition-colors",
|
|
208
|
+
"text-brand-secondary-foreground/50 hover:text-brand-secondary-foreground",
|
|
209
|
+
sub.isActive && "text-primary font-medium"
|
|
210
|
+
),
|
|
211
|
+
children: [
|
|
212
|
+
/* @__PURE__ */ jsx(
|
|
213
|
+
ChevronRight,
|
|
214
|
+
{
|
|
215
|
+
size: 11,
|
|
216
|
+
strokeWidth: 2,
|
|
217
|
+
className: cn(
|
|
218
|
+
"shrink-0",
|
|
219
|
+
sub.isActive ? "text-primary" : "text-brand-secondary-foreground/30"
|
|
220
|
+
)
|
|
221
|
+
}
|
|
222
|
+
),
|
|
223
|
+
/* @__PURE__ */ jsx("span", { className: "truncate", children: sub.title })
|
|
224
|
+
]
|
|
225
|
+
},
|
|
226
|
+
sub.href
|
|
227
|
+
)) }) })
|
|
228
|
+
] })
|
|
229
|
+
}
|
|
230
|
+
);
|
|
231
|
+
}
|
|
232
|
+
function SidebarNav({
|
|
233
|
+
items,
|
|
234
|
+
userName = "Anonymous User",
|
|
235
|
+
collapsed = false,
|
|
236
|
+
logo,
|
|
237
|
+
logoCollapsed,
|
|
238
|
+
metricsGroups,
|
|
239
|
+
onNavigate,
|
|
240
|
+
onLogout,
|
|
241
|
+
onCollapsedChange,
|
|
242
|
+
className
|
|
243
|
+
}) {
|
|
244
|
+
const [userMenuOpen, setUserMenuOpen] = React.useState(false);
|
|
245
|
+
const navScrollRef = React.useRef(null);
|
|
246
|
+
const expandedScrollRef = React.useRef(0);
|
|
247
|
+
React.useEffect(() => {
|
|
248
|
+
if (collapsed) setUserMenuOpen(false);
|
|
249
|
+
}, [collapsed]);
|
|
250
|
+
React.useLayoutEffect(() => {
|
|
251
|
+
const nav = navScrollRef.current;
|
|
252
|
+
if (!nav) return;
|
|
253
|
+
if (!collapsed) {
|
|
254
|
+
nav.scrollTop = expandedScrollRef.current;
|
|
255
|
+
}
|
|
256
|
+
return () => {
|
|
257
|
+
if (!collapsed && nav) {
|
|
258
|
+
expandedScrollRef.current = nav.scrollTop;
|
|
259
|
+
}
|
|
260
|
+
};
|
|
261
|
+
}, [collapsed]);
|
|
262
|
+
return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(
|
|
263
|
+
"nav",
|
|
264
|
+
{
|
|
265
|
+
"data-slot": "sidebar-nav",
|
|
266
|
+
"data-collapsed": collapsed,
|
|
267
|
+
className: cn(
|
|
268
|
+
"flex h-full flex-col bg-brand-secondary text-brand-secondary-foreground",
|
|
269
|
+
"transition-all duration-200 ease-in-out",
|
|
270
|
+
collapsed ? "w-14" : "w-[279px]",
|
|
271
|
+
className
|
|
272
|
+
),
|
|
273
|
+
children: [
|
|
274
|
+
(logo || logoCollapsed) && /* @__PURE__ */ jsxs("div", { className: "relative flex items-center border-b border-white/15 py-4 overflow-hidden", children: [
|
|
275
|
+
logo && /* @__PURE__ */ jsx(
|
|
276
|
+
"img",
|
|
277
|
+
{
|
|
278
|
+
src: logo,
|
|
279
|
+
alt: "Logo",
|
|
280
|
+
className: cn(
|
|
281
|
+
"h-8 w-auto object-contain object-left px-5 transition-opacity duration-200",
|
|
282
|
+
collapsed ? "opacity-0" : "opacity-100"
|
|
283
|
+
),
|
|
284
|
+
style: { filter: "brightness(0) invert(1)" }
|
|
285
|
+
}
|
|
286
|
+
),
|
|
287
|
+
logoCollapsed && /* @__PURE__ */ jsx(
|
|
288
|
+
"img",
|
|
289
|
+
{
|
|
290
|
+
src: logoCollapsed,
|
|
291
|
+
alt: "Logo",
|
|
292
|
+
className: cn(
|
|
293
|
+
"absolute inset-y-0 left-0 right-0 m-auto h-8 w-8 object-contain transition-opacity duration-200",
|
|
294
|
+
collapsed ? "opacity-100" : "opacity-0"
|
|
295
|
+
),
|
|
296
|
+
style: { filter: "brightness(0) invert(1)" }
|
|
297
|
+
}
|
|
298
|
+
)
|
|
299
|
+
] }),
|
|
300
|
+
/* @__PURE__ */ jsxs("div", { className: "relative border-b border-white/15", children: [
|
|
301
|
+
/* @__PURE__ */ jsx(
|
|
302
|
+
"div",
|
|
303
|
+
{
|
|
304
|
+
className: cn(
|
|
305
|
+
collapsed ? "opacity-0 pointer-events-none" : "opacity-100"
|
|
306
|
+
),
|
|
307
|
+
children: /* @__PURE__ */ jsx(
|
|
308
|
+
Accordion,
|
|
309
|
+
{
|
|
310
|
+
value: userMenuOpen ? ["user-menu"] : [],
|
|
311
|
+
onValueChange: (values) => setUserMenuOpen(values.length > 0),
|
|
312
|
+
children: /* @__PURE__ */ jsxs(AccordionItem, { className: "border-none", value: "user-menu", children: [
|
|
313
|
+
/* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
|
|
314
|
+
AccordionPrimitive.Trigger,
|
|
315
|
+
{
|
|
316
|
+
className: cn(
|
|
317
|
+
"group flex h-auto w-full items-center justify-start gap-3 px-5 py-5 text-base transition-colors",
|
|
318
|
+
"text-brand-secondary-foreground hover:bg-white/10"
|
|
319
|
+
),
|
|
320
|
+
children: [
|
|
321
|
+
/* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center font-semibold text-xs bg-primary text-primary-foreground", children: getInitials(userName) }),
|
|
322
|
+
/* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-left font-medium text-brand-secondary-foreground", children: userName }),
|
|
323
|
+
/* @__PURE__ */ jsx(
|
|
324
|
+
ChevronDown,
|
|
325
|
+
{
|
|
326
|
+
className: "ml-auto shrink-0 text-brand-secondary-foreground/50 transition-transform duration-200 group-data-[panel-open]:rotate-180",
|
|
327
|
+
size: 16,
|
|
328
|
+
strokeWidth: 2
|
|
329
|
+
}
|
|
330
|
+
)
|
|
331
|
+
]
|
|
332
|
+
}
|
|
333
|
+
) }),
|
|
334
|
+
/* @__PURE__ */ jsx(AccordionContent, { className: "p-0 text-inherit", children: /* @__PURE__ */ jsx("div", { className: "border-t border-white/15 bg-black/20", children: /* @__PURE__ */ jsxs(
|
|
335
|
+
Button,
|
|
336
|
+
{
|
|
337
|
+
type: "button",
|
|
338
|
+
variant: "ghost",
|
|
339
|
+
onClick: onLogout,
|
|
340
|
+
className: cn(
|
|
341
|
+
"h-auto w-full justify-start gap-3 px-5 py-3 text-base",
|
|
342
|
+
"text-brand-secondary-foreground/70 hover:bg-white/10 hover:text-brand-secondary-foreground transition-colors"
|
|
343
|
+
),
|
|
344
|
+
children: [
|
|
345
|
+
/* @__PURE__ */ jsx(
|
|
346
|
+
LogOut,
|
|
347
|
+
{
|
|
348
|
+
size: 16,
|
|
349
|
+
strokeWidth: 1.75,
|
|
350
|
+
className: "shrink-0 text-destructive"
|
|
351
|
+
}
|
|
352
|
+
),
|
|
353
|
+
/* @__PURE__ */ jsx("span", { children: "Logout" })
|
|
354
|
+
]
|
|
355
|
+
}
|
|
356
|
+
) }) })
|
|
357
|
+
] })
|
|
358
|
+
}
|
|
359
|
+
)
|
|
360
|
+
}
|
|
361
|
+
),
|
|
362
|
+
/* @__PURE__ */ jsx(NavTooltip, { label: userName, collapsed, children: /* @__PURE__ */ jsx(
|
|
363
|
+
"div",
|
|
364
|
+
{
|
|
365
|
+
className: cn(
|
|
366
|
+
"absolute inset-0 flex items-center justify-center transition-opacity duration-200",
|
|
367
|
+
collapsed ? "opacity-100" : "opacity-0 pointer-events-none"
|
|
368
|
+
),
|
|
369
|
+
children: /* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center font-semibold text-xs bg-primary text-primary-foreground", children: getInitials(userName) })
|
|
370
|
+
}
|
|
371
|
+
) })
|
|
372
|
+
] }),
|
|
373
|
+
!!(metricsGroups == null ? void 0 : metricsGroups.length) && /* @__PURE__ */ jsx(
|
|
374
|
+
Accordion,
|
|
375
|
+
{
|
|
376
|
+
value: !collapsed ? ["metrics"] : [],
|
|
377
|
+
onValueChange: () => {
|
|
378
|
+
},
|
|
379
|
+
children: /* @__PURE__ */ jsx(AccordionItem, { className: "border-none", value: "metrics", children: /* @__PURE__ */ jsx(AccordionContent, { className: "p-0 text-inherit", children: metricsGroups.map((group, i) => /* @__PURE__ */ jsx(MetricsGroup, { group }, i)) }) })
|
|
380
|
+
}
|
|
381
|
+
),
|
|
382
|
+
/* @__PURE__ */ jsx("div", { ref: navScrollRef, className: "flex flex-col overflow-y-auto py-3", children: items.map(
|
|
383
|
+
(item) => item.isCollapsible ? /* @__PURE__ */ jsx(
|
|
384
|
+
CollapsibleNavItem,
|
|
385
|
+
{
|
|
386
|
+
item,
|
|
387
|
+
collapsed,
|
|
388
|
+
onNavigate
|
|
389
|
+
},
|
|
390
|
+
item.href
|
|
391
|
+
) : /* @__PURE__ */ jsx(
|
|
392
|
+
SidebarNavItemView,
|
|
393
|
+
{
|
|
394
|
+
item,
|
|
395
|
+
collapsed,
|
|
396
|
+
onNavigate
|
|
397
|
+
},
|
|
398
|
+
item.href
|
|
399
|
+
)
|
|
400
|
+
) }),
|
|
401
|
+
onCollapsedChange && /* @__PURE__ */ jsx("div", { className: "mt-auto border-t border-white/15 bg-white/8", children: /* @__PURE__ */ jsx(
|
|
402
|
+
NavTooltip,
|
|
403
|
+
{
|
|
404
|
+
label: collapsed ? "Expand" : "Collapse",
|
|
405
|
+
collapsed,
|
|
406
|
+
children: /* @__PURE__ */ jsxs(
|
|
407
|
+
Button,
|
|
408
|
+
{
|
|
409
|
+
type: "button",
|
|
410
|
+
variant: "ghost",
|
|
411
|
+
onClick: () => onCollapsedChange(!collapsed),
|
|
412
|
+
className: cn(
|
|
413
|
+
"h-12 w-full justify-start gap-3 px-3 py-3 transition-colors",
|
|
414
|
+
"text-brand-secondary-foreground/80 hover:bg-white/10 hover:text-brand-secondary-foreground",
|
|
415
|
+
collapsed && "justify-center px-2"
|
|
416
|
+
),
|
|
417
|
+
children: [
|
|
418
|
+
collapsed ? /* @__PURE__ */ jsx(
|
|
419
|
+
PanelLeftOpen,
|
|
420
|
+
{
|
|
421
|
+
size: 24,
|
|
422
|
+
strokeWidth: 1.75,
|
|
423
|
+
className: "shrink-0"
|
|
424
|
+
}
|
|
425
|
+
) : /* @__PURE__ */ jsx(
|
|
426
|
+
PanelLeftClose,
|
|
427
|
+
{
|
|
428
|
+
size: 24,
|
|
429
|
+
strokeWidth: 1.75,
|
|
430
|
+
className: "shrink-0"
|
|
431
|
+
}
|
|
432
|
+
),
|
|
433
|
+
!collapsed && /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Collapse" })
|
|
434
|
+
]
|
|
435
|
+
}
|
|
436
|
+
)
|
|
437
|
+
}
|
|
438
|
+
) })
|
|
439
|
+
]
|
|
440
|
+
}
|
|
441
|
+
) });
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
export {
|
|
445
|
+
SidebarNav
|
|
446
|
+
};
|
|
@@ -14,13 +14,15 @@ import {
|
|
|
14
14
|
} from "./chunk-XREGSKX3.mjs";
|
|
15
15
|
|
|
16
16
|
// src/components/ui/advisor-card.tsx
|
|
17
|
+
import React from "react";
|
|
17
18
|
import {
|
|
18
19
|
Calendar,
|
|
19
20
|
CalendarCheck,
|
|
20
21
|
ChevronRight,
|
|
21
22
|
Mail,
|
|
22
23
|
MoreVertical,
|
|
23
|
-
Phone
|
|
24
|
+
Phone,
|
|
25
|
+
Plus
|
|
24
26
|
} from "lucide-react";
|
|
25
27
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
26
28
|
var STATUS_VARIANT = {
|
|
@@ -46,31 +48,34 @@ function AdvisorCard({
|
|
|
46
48
|
role,
|
|
47
49
|
phone,
|
|
48
50
|
email,
|
|
51
|
+
companyName,
|
|
49
52
|
companyLogoUrl,
|
|
50
53
|
avatarInitials,
|
|
51
54
|
isPrimary = false,
|
|
52
|
-
|
|
55
|
+
appointments,
|
|
53
56
|
onRefer,
|
|
54
57
|
onMoreOptions,
|
|
55
58
|
onBookAppointment,
|
|
56
59
|
onViewAppointment
|
|
57
60
|
}) {
|
|
61
|
+
const hasAppointments = appointments !== void 0;
|
|
62
|
+
const appointmentList = appointments === null || Array.isArray(appointments) && appointments.length === 0 ? null : appointments;
|
|
58
63
|
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col border border-border bg-card", children: [
|
|
59
64
|
/* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4 p-4", children: [
|
|
60
65
|
/* @__PURE__ */ jsxs(Avatar, { className: "h-10 w-10 shrink-0", children: [
|
|
61
66
|
companyLogoUrl && /* @__PURE__ */ jsx(AvatarImage, { src: companyLogoUrl, alt: `${name} company logo` }),
|
|
62
|
-
/* @__PURE__ */ jsx(AvatarFallback, { className: "text-sm", children: avatarInitials != null ? avatarInitials : name.slice(0, 2).toUpperCase() })
|
|
67
|
+
/* @__PURE__ */ jsx(AvatarFallback, { className: "text-sm", children: avatarInitials != null ? avatarInitials : companyName ? companyName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() : name.slice(0, 2).toUpperCase() })
|
|
63
68
|
] }),
|
|
64
69
|
/* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
|
|
65
70
|
/* @__PURE__ */ jsx("p", { className: "text-sm font-semibold leading-tight", children: name }),
|
|
66
71
|
/* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: role }),
|
|
67
72
|
/* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-col gap-1", children: [
|
|
68
|
-
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-
|
|
69
|
-
/* @__PURE__ */ jsx(Phone, { className: "h-
|
|
73
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-sm text-muted-foreground", children: [
|
|
74
|
+
/* @__PURE__ */ jsx(Phone, { className: "h-4 w-4 shrink-0" }),
|
|
70
75
|
/* @__PURE__ */ jsx("span", { children: phone })
|
|
71
76
|
] }),
|
|
72
|
-
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-
|
|
73
|
-
/* @__PURE__ */ jsx(Mail, { className: "h-
|
|
77
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-sm text-muted-foreground", children: [
|
|
78
|
+
/* @__PURE__ */ jsx(Mail, { className: "h-4 w-4 shrink-0" }),
|
|
74
79
|
/* @__PURE__ */ jsx("span", { children: email })
|
|
75
80
|
] })
|
|
76
81
|
] })
|
|
@@ -90,14 +95,14 @@ function AdvisorCard({
|
|
|
90
95
|
)
|
|
91
96
|
] })
|
|
92
97
|
] }),
|
|
93
|
-
|
|
98
|
+
hasAppointments && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
94
99
|
/* @__PURE__ */ jsx(Separator, {}),
|
|
95
|
-
|
|
96
|
-
/*
|
|
100
|
+
appointmentList ? appointmentList.map((appt, i) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
101
|
+
i > 0 && /* @__PURE__ */ jsx(Separator, {}),
|
|
97
102
|
/* @__PURE__ */ jsxs(
|
|
98
103
|
"div",
|
|
99
104
|
{
|
|
100
|
-
className: `flex items-center gap-3 px-4 py-3 ${STRIP_BG[
|
|
105
|
+
className: `flex items-center gap-3 px-4 py-3 ${STRIP_BG[appt.status]}`,
|
|
101
106
|
children: [
|
|
102
107
|
/* @__PURE__ */ jsx(CalendarCheck, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
|
|
103
108
|
/* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
|
|
@@ -105,19 +110,19 @@ function AdvisorCard({
|
|
|
105
110
|
/* @__PURE__ */ jsx(
|
|
106
111
|
Badge,
|
|
107
112
|
{
|
|
108
|
-
variant: STATUS_VARIANT[
|
|
113
|
+
variant: STATUS_VARIANT[appt.status],
|
|
109
114
|
className: "text-[10px]",
|
|
110
|
-
children: STATUS_LABEL[
|
|
115
|
+
children: STATUS_LABEL[appt.status]
|
|
111
116
|
}
|
|
112
117
|
),
|
|
113
|
-
|
|
118
|
+
appt.appointmentType && /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-semibold", children: appt.appointmentType })
|
|
114
119
|
] }),
|
|
115
|
-
/* @__PURE__ */ jsxs("p", { className: "text-
|
|
116
|
-
|
|
120
|
+
/* @__PURE__ */ jsxs("p", { className: "whitespace-nowrap text-sm text-muted-foreground", children: [
|
|
121
|
+
appt.date,
|
|
117
122
|
" \xB7 ",
|
|
118
|
-
|
|
123
|
+
appt.timeStart,
|
|
119
124
|
"\u2013",
|
|
120
|
-
|
|
125
|
+
appt.timeEnd
|
|
121
126
|
] })
|
|
122
127
|
] }),
|
|
123
128
|
onViewAppointment && /* @__PURE__ */ jsxs(
|
|
@@ -126,7 +131,7 @@ function AdvisorCard({
|
|
|
126
131
|
variant: "ghost",
|
|
127
132
|
size: "sm",
|
|
128
133
|
className: "h-7 shrink-0 gap-1 px-2 text-xs",
|
|
129
|
-
onClick: onViewAppointment,
|
|
134
|
+
onClick: () => onViewAppointment(i),
|
|
130
135
|
children: [
|
|
131
136
|
"View",
|
|
132
137
|
/* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3" })
|
|
@@ -136,8 +141,8 @@ function AdvisorCard({
|
|
|
136
141
|
]
|
|
137
142
|
}
|
|
138
143
|
)
|
|
139
|
-
) : (
|
|
140
|
-
/*
|
|
144
|
+
] }, i)) : (
|
|
145
|
+
/* Empty state */
|
|
141
146
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 px-4 py-3", children: [
|
|
142
147
|
/* @__PURE__ */ jsx(Calendar, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
|
|
143
148
|
/* @__PURE__ */ jsx("p", { className: "flex-1 text-xs text-muted-foreground", children: "No upcoming appointments" })
|
|
@@ -145,25 +150,53 @@ function AdvisorCard({
|
|
|
145
150
|
)
|
|
146
151
|
] }),
|
|
147
152
|
/* @__PURE__ */ jsx(Separator, {}),
|
|
148
|
-
/* @__PURE__ */ jsxs("div", { className: "flex
|
|
153
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 px-4 py-3", children: [
|
|
149
154
|
onBookAppointment && /* @__PURE__ */ jsx(
|
|
150
155
|
Button,
|
|
151
156
|
{
|
|
152
157
|
variant: "outline-primary",
|
|
153
158
|
size: "sm",
|
|
159
|
+
className: "w-full",
|
|
154
160
|
onClick: onBookAppointment,
|
|
155
161
|
children: "Book Appointment"
|
|
156
162
|
}
|
|
157
163
|
),
|
|
158
|
-
onRefer && /* @__PURE__ */ jsxs(
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
164
|
+
onRefer && /* @__PURE__ */ jsxs(
|
|
165
|
+
Button,
|
|
166
|
+
{
|
|
167
|
+
variant: "outline",
|
|
168
|
+
size: "sm",
|
|
169
|
+
className: "w-full",
|
|
170
|
+
onClick: onRefer,
|
|
171
|
+
children: [
|
|
172
|
+
"Refer ",
|
|
173
|
+
name,
|
|
174
|
+
" to Others"
|
|
175
|
+
]
|
|
176
|
+
}
|
|
177
|
+
)
|
|
163
178
|
] })
|
|
164
179
|
] });
|
|
165
180
|
}
|
|
181
|
+
function AdvisorInviteCard({ onInvite }) {
|
|
182
|
+
return /* @__PURE__ */ jsxs(
|
|
183
|
+
Button,
|
|
184
|
+
{
|
|
185
|
+
variant: "ghost",
|
|
186
|
+
onClick: onInvite,
|
|
187
|
+
className: "flex h-auto w-full flex-col items-center justify-center gap-3 border border-dashed border-border bg-card p-8 text-center transition-colors hover:bg-muted/40",
|
|
188
|
+
children: [
|
|
189
|
+
/* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center border border-dashed border-muted-foreground/40", children: /* @__PURE__ */ jsx(Plus, { className: "h-5 w-5 text-muted-foreground" }) }),
|
|
190
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
191
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Add Another Advisor" }),
|
|
192
|
+
/* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Connect more advisors to your account" })
|
|
193
|
+
] })
|
|
194
|
+
]
|
|
195
|
+
}
|
|
196
|
+
);
|
|
197
|
+
}
|
|
166
198
|
|
|
167
199
|
export {
|
|
168
|
-
AdvisorCard
|
|
200
|
+
AdvisorCard,
|
|
201
|
+
AdvisorInviteCard
|
|
169
202
|
};
|