@wealthx/shadcn 1.5.11 → 1.5.13

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.
Files changed (36) hide show
  1. package/.turbo/turbo-build.log +88 -88
  2. package/CHANGELOG.md +12 -0
  3. package/dist/{chunk-O5CP6VP6.mjs → chunk-BF5FKUF6.mjs} +104 -63
  4. package/dist/{chunk-ZMTCMP2G.mjs → chunk-EB626HVW.mjs} +70 -3
  5. package/dist/chunk-KICT4VQL.mjs +508 -0
  6. package/dist/chunk-V23CBULF.mjs +432 -0
  7. package/dist/components/ui/ai-conversations.js +70 -3
  8. package/dist/components/ui/ai-conversations.mjs +1 -1
  9. package/dist/components/ui/appointment-calendar-view.js +177 -176
  10. package/dist/components/ui/appointment-calendar-view.mjs +1 -1
  11. package/dist/components/ui/bank-statement-generate-dialog.js +209 -107
  12. package/dist/components/ui/bank-statement-generate-dialog.mjs +2 -1
  13. package/dist/components/ui/resource-center/index.js +1030 -0
  14. package/dist/components/ui/resource-center/index.mjs +29 -0
  15. package/dist/index.js +661 -403
  16. package/dist/index.mjs +16 -14
  17. package/dist/styles.css +1 -1
  18. package/package.json +4 -4
  19. package/src/components/index.tsx +2 -0
  20. package/src/components/ui/ai-conversations.tsx +157 -23
  21. package/src/components/ui/appointment-calendar-view.tsx +211 -199
  22. package/src/components/ui/bank-statement-generate-dialog.tsx +147 -96
  23. package/src/components/ui/resource-center/index.tsx +35 -0
  24. package/src/components/ui/resource-center/resource-cards.tsx +218 -0
  25. package/src/components/ui/resource-center/resource-carousel.tsx +122 -0
  26. package/src/components/ui/resource-center/resource-center-header.tsx +95 -0
  27. package/src/components/ui/resource-center/resource-email-editor-dialog.tsx +131 -0
  28. package/src/components/ui/resource-center/resource-modal.tsx +76 -0
  29. package/src/components/ui/resource-center/types.ts +81 -0
  30. package/src/styles/styles-css.ts +1 -1
  31. package/tsup.config.ts +1 -1
  32. package/dist/chunk-IODGRCQG.mjs +0 -438
  33. package/dist/chunk-XYWEGBAA.mjs +0 -348
  34. package/dist/components/ui/resource-center.js +0 -748
  35. package/dist/components/ui/resource-center.mjs +0 -24
  36. package/src/components/ui/resource-center.tsx +0 -539
@@ -1,748 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __defProps = Object.defineProperties;
5
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
- var __getOwnPropNames = Object.getOwnPropertyNames;
8
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
- var __getProtoOf = Object.getPrototypeOf;
10
- var __hasOwnProp = Object.prototype.hasOwnProperty;
11
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
12
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
- var __spreadValues = (a, b) => {
14
- for (var prop in b || (b = {}))
15
- if (__hasOwnProp.call(b, prop))
16
- __defNormalProp(a, prop, b[prop]);
17
- if (__getOwnPropSymbols)
18
- for (var prop of __getOwnPropSymbols(b)) {
19
- if (__propIsEnum.call(b, prop))
20
- __defNormalProp(a, prop, b[prop]);
21
- }
22
- return a;
23
- };
24
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
- var __objRest = (source, exclude) => {
26
- var target = {};
27
- for (var prop in source)
28
- if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
- target[prop] = source[prop];
30
- if (source != null && __getOwnPropSymbols)
31
- for (var prop of __getOwnPropSymbols(source)) {
32
- if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
- target[prop] = source[prop];
34
- }
35
- return target;
36
- };
37
- var __export = (target, all) => {
38
- for (var name in all)
39
- __defProp(target, name, { get: all[name], enumerable: true });
40
- };
41
- var __copyProps = (to, from, except, desc) => {
42
- if (from && typeof from === "object" || typeof from === "function") {
43
- for (let key of __getOwnPropNames(from))
44
- if (!__hasOwnProp.call(to, key) && key !== except)
45
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
46
- }
47
- return to;
48
- };
49
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
50
- // If the importer is in node compatibility mode or this is not an ESM
51
- // file that has been converted to a CommonJS file using a Babel-
52
- // compatible transform (i.e. "__esModule" has not been set), then set
53
- // "default" to the CommonJS "module.exports" for node compatibility.
54
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
55
- mod
56
- ));
57
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
58
-
59
- // src/components/ui/resource-center.tsx
60
- var resource_center_exports = {};
61
- __export(resource_center_exports, {
62
- ResourceCarousel: () => ResourceCarousel,
63
- ResourceCenterHeader: () => ResourceCenterHeader,
64
- ResourceDocumentCard: () => ResourceDocumentCard,
65
- ResourceEmailTemplateCard: () => ResourceEmailTemplateCard,
66
- ResourceModal: () => ResourceModal,
67
- ResourceVideoCard: () => ResourceVideoCard
68
- });
69
- module.exports = __toCommonJS(resource_center_exports);
70
- var import_react3 = require("react");
71
- var import_lucide_react3 = require("lucide-react");
72
-
73
- // src/lib/utils.ts
74
- var import_clsx = require("clsx");
75
- var import_tailwind_merge = require("tailwind-merge");
76
- var twMerge = (0, import_tailwind_merge.extendTailwindMerge)({
77
- extend: {
78
- classGroups: {
79
- "font-size": [
80
- {
81
- text: [
82
- "display-large",
83
- "display-medium",
84
- "display-small",
85
- "h1",
86
- "h2",
87
- "h3",
88
- "h4",
89
- "h5",
90
- "h6",
91
- "body-large",
92
- "body-medium",
93
- "body-small",
94
- "label-large",
95
- "label-medium",
96
- "label-small",
97
- "button",
98
- "button-xs",
99
- "caption",
100
- "overline",
101
- "code"
102
- ]
103
- }
104
- ]
105
- }
106
- }
107
- });
108
- function cn(...inputs) {
109
- return twMerge((0, import_clsx.clsx)(inputs));
110
- }
111
-
112
- // src/components/ui/badge.tsx
113
- var import_class_variance_authority = require("class-variance-authority");
114
-
115
- // src/lib/slot.tsx
116
- var React = __toESM(require("react"));
117
- function mergeRefs(...refs) {
118
- return (value) => {
119
- for (const ref of refs) {
120
- if (typeof ref === "function") ref(value);
121
- else if (ref !== null)
122
- ref.current = value;
123
- }
124
- };
125
- }
126
- var Slot = React.forwardRef(
127
- (_a, forwardedRef) => {
128
- var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
129
- const child = React.Children.only(children);
130
- if (!React.isValidElement(child)) return null;
131
- const childProps = child.props;
132
- const merged = __spreadValues({}, props);
133
- for (const key of Object.keys(childProps)) {
134
- if (key === "className") {
135
- merged.className = [props.className, childProps.className].filter(Boolean).join(" ");
136
- } else if (key === "style") {
137
- merged.style = __spreadValues(__spreadValues({}, props.style), childProps.style);
138
- } else if (key.startsWith("on") && typeof childProps[key] === "function") {
139
- const parentHandler = props[key];
140
- if (typeof parentHandler === "function") {
141
- merged[key] = (...args) => {
142
- childProps[key](...args);
143
- parentHandler(...args);
144
- };
145
- } else {
146
- merged[key] = childProps[key];
147
- }
148
- } else {
149
- merged[key] = childProps[key];
150
- }
151
- }
152
- const childRef = child.ref;
153
- merged.ref = forwardedRef ? mergeRefs(forwardedRef, childRef) : childRef;
154
- return React.cloneElement(
155
- child,
156
- merged
157
- );
158
- }
159
- );
160
- Slot.displayName = "Slot";
161
-
162
- // src/components/ui/badge.tsx
163
- var import_jsx_runtime = require("react/jsx-runtime");
164
- var badgeVariants = (0, import_class_variance_authority.cva)(
165
- "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2.5 py-0.5 text-caption whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
166
- {
167
- variants: {
168
- variant: {
169
- default: "border-primary/40 bg-primary/10 text-foreground [a&]:hover:bg-primary/15",
170
- secondary: "border-border bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
171
- destructive: "border-destructive/40 bg-destructive/10 text-destructive-text focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/15",
172
- success: "border-success/40 bg-success/10 text-success-text [a&]:hover:bg-success/15",
173
- warning: "border-warning/40 bg-warning/10 text-warning-text [a&]:hover:bg-warning/15",
174
- info: "border-info/40 bg-info/10 text-info-text [a&]:hover:bg-info/15",
175
- outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
176
- ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
177
- link: "text-primary underline-offset-4 [a&]:hover:underline"
178
- }
179
- },
180
- defaultVariants: {
181
- variant: "default"
182
- }
183
- }
184
- );
185
- function Badge(_a) {
186
- var _b = _a, {
187
- className,
188
- variant = "default",
189
- asChild = false
190
- } = _b, props = __objRest(_b, [
191
- "className",
192
- "variant",
193
- "asChild"
194
- ]);
195
- const Comp = asChild ? Slot : "span";
196
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
197
- Comp,
198
- __spreadValues({
199
- className: cn(badgeVariants({ variant }), className),
200
- "data-slot": "badge",
201
- "data-variant": variant
202
- }, props)
203
- );
204
- }
205
-
206
- // src/components/ui/button.tsx
207
- var import_react = require("react");
208
- var import_class_variance_authority2 = require("class-variance-authority");
209
- var import_lucide_react = require("lucide-react");
210
- var import_jsx_runtime2 = require("react/jsx-runtime");
211
- var buttonVariants = (0, import_class_variance_authority2.cva)(
212
- "inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 font-sans text-button whitespace-nowrap transition-all active:scale-[0.98] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
213
- {
214
- variants: {
215
- variant: {
216
- default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
217
- secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
218
- destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
219
- outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground focus-visible:border-border focus-visible:ring-border/50 dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
220
- "outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
221
- "outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:border-brand-secondary focus-visible:ring-brand-secondary/30",
222
- ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs focus-visible:ring-border/50 dark:hover:bg-accent/50",
223
- link: "text-primary underline-offset-4 hover:underline"
224
- },
225
- size: {
226
- default: "h-9 px-4 py-2 has-[>svg]:px-3",
227
- xs: "h-6 gap-1 px-2 text-button-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
228
- sm: "h-8 gap-1.5 px-3 has-[>svg]:px-2.5",
229
- lg: "h-10 px-6 has-[>svg]:px-4",
230
- icon: "size-9",
231
- "icon-xs": "size-6 [&_svg:not([class*='size-'])]:size-3",
232
- "icon-sm": "size-8",
233
- "icon-lg": "size-10"
234
- }
235
- },
236
- defaultVariants: {
237
- variant: "default",
238
- size: "default"
239
- }
240
- }
241
- );
242
- var Button = (0, import_react.forwardRef)(function Button2(_a, ref) {
243
- var _b = _a, {
244
- className,
245
- variant,
246
- size,
247
- asChild = false,
248
- loading = false,
249
- disabled,
250
- type = "button",
251
- children
252
- } = _b, props = __objRest(_b, [
253
- "className",
254
- "variant",
255
- "size",
256
- "asChild",
257
- "loading",
258
- "disabled",
259
- "type",
260
- "children"
261
- ]);
262
- const Comp = asChild ? Slot : "button";
263
- const isIconOnly = size === "icon" || size === "icon-xs" || size === "icon-sm" || size === "icon-lg";
264
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
265
- Comp,
266
- __spreadProps(__spreadValues({
267
- className: cn(buttonVariants({ variant, size, className })),
268
- "data-size": size,
269
- "data-slot": "button",
270
- "data-variant": variant,
271
- disabled: loading || disabled,
272
- ref,
273
- type
274
- }, props), {
275
- children: loading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
276
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.Loader2, { "aria-hidden": "true", className: "animate-spin" }),
277
- !isIconOnly && children
278
- ] }) : children
279
- })
280
- );
281
- });
282
-
283
- // src/components/ui/dialog.tsx
284
- var import_lucide_react2 = require("lucide-react");
285
- var import_dialog = require("@base-ui/react/dialog");
286
-
287
- // src/lib/theme-provider.tsx
288
- var import_react2 = require("react");
289
- var import_jsx_runtime3 = require("react/jsx-runtime");
290
- var ThemeVarsContext = (0, import_react2.createContext)({});
291
- function useThemeVars() {
292
- return (0, import_react2.useContext)(ThemeVarsContext);
293
- }
294
-
295
- // src/components/ui/dialog.tsx
296
- var import_jsx_runtime4 = require("react/jsx-runtime");
297
- function Dialog(_a) {
298
- var props = __objRest(_a, []);
299
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_dialog.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
300
- }
301
- function DialogPortal(_a) {
302
- var props = __objRest(_a, []);
303
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_dialog.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
304
- }
305
- function DialogOverlay(_a) {
306
- var _b = _a, {
307
- className
308
- } = _b, props = __objRest(_b, [
309
- "className"
310
- ]);
311
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
312
- import_dialog.Dialog.Backdrop,
313
- __spreadValues({
314
- className: cn(
315
- // WealthX: foreground/50 scrim (matches Figma — foreground token at 50% opacity)
316
- "fixed inset-0 z-50 bg-foreground/50 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0",
317
- className
318
- ),
319
- "data-slot": "dialog-overlay"
320
- }, props)
321
- );
322
- }
323
- var DIALOG_MAX_WIDTHS = {
324
- sm: "24rem",
325
- md: "28rem",
326
- lg: "32rem",
327
- xl: "36rem",
328
- "2xl": "42rem",
329
- "3xl": "48rem",
330
- "4xl": "56rem",
331
- full: "100%"
332
- };
333
- var DIALOG_AUTO_MIN_WIDTH = "20rem";
334
- function DialogContent(_a) {
335
- var _b = _a, {
336
- className,
337
- children,
338
- showCloseButton = true,
339
- style,
340
- container,
341
- align = "top",
342
- size = "lg",
343
- minWidth
344
- } = _b, props = __objRest(_b, [
345
- "className",
346
- "children",
347
- "showCloseButton",
348
- "style",
349
- "container",
350
- "align",
351
- "size",
352
- "minWidth"
353
- ]);
354
- const themeVars = useThemeVars();
355
- const isAuto = size === "auto";
356
- const sizeStyle = isAuto ? { minWidth: minWidth != null ? minWidth : DIALOG_AUTO_MIN_WIDTH } : { maxWidth: DIALOG_MAX_WIDTHS[size] };
357
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(DialogPortal, { container: container != null ? container : void 0, children: [
358
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DialogOverlay, { style: themeVars }),
359
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
360
- import_dialog.Dialog.Popup,
361
- __spreadProps(__spreadValues({
362
- className: cn(
363
- // WealthX: removed rounded-lg (sharp corners), shadow-lg (flat panels)
364
- // max-w-[calc(100%-2rem)] acts as a viewport-edge guard on all sizes.
365
- // Fixed max-width is applied via inline style (sizeStyle) to avoid
366
- // Tailwind v4 class-scanning gaps with dynamic class lookups.
367
- "fixed left-[50%] z-50 grid max-w-[calc(100%-2rem)] translate-x-[-50%] gap-4 border bg-background p-6 duration-200 outline-none data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
368
- // "auto" → hug content (with min-width floor); fixed sizes → fill to max-width
369
- isAuto ? "w-auto" : "w-full",
370
- align === "center" ? "top-[50%] translate-y-[-50%]" : "top-4 translate-y-0",
371
- className
372
- ),
373
- "data-slot": "dialog-content",
374
- style: __spreadValues(__spreadValues(__spreadValues({}, themeVars), sizeStyle), style)
375
- }, props), {
376
- children: [
377
- children,
378
- showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
379
- import_dialog.Dialog.Close,
380
- {
381
- className: "absolute top-4 right-4 inline-flex size-7 items-center justify-center transition-colors hover:bg-foreground/5 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-border focus-visible:ring-offset-0 disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
382
- "data-slot": "dialog-close",
383
- children: [
384
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.XIcon, {}),
385
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "sr-only", children: "Close" })
386
- ]
387
- }
388
- ) : null
389
- ]
390
- })
391
- )
392
- ] });
393
- }
394
- function DialogHeader(_a) {
395
- var _b = _a, {
396
- className
397
- } = _b, props = __objRest(_b, [
398
- "className"
399
- ]);
400
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
401
- "div",
402
- __spreadValues({
403
- className: cn("flex flex-col gap-1.5", className),
404
- "data-slot": "dialog-header"
405
- }, props)
406
- );
407
- }
408
- function DialogTitle(_a) {
409
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
410
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
411
- import_dialog.Dialog.Title,
412
- __spreadValues({
413
- className: cn("text-h5 leading-none", className),
414
- "data-slot": "dialog-title"
415
- }, props)
416
- );
417
- }
418
-
419
- // src/components/ui/resource-center.tsx
420
- var import_jsx_runtime5 = require("react/jsx-runtime");
421
- function ResourceModal({
422
- open,
423
- onClose,
424
- title,
425
- videoUrl,
426
- tags,
427
- attachments
428
- }) {
429
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Dialog, { open, onOpenChange: (v) => !v && onClose(), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
430
- DialogContent,
431
- {
432
- size: "2xl",
433
- className: "flex flex-col gap-4 p-0 overflow-hidden",
434
- children: [
435
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(DialogHeader, { className: "px-6 pt-6 pb-0", children: [
436
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogTitle, { className: "text-lg font-semibold", children: title }),
437
- tags && tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex flex-wrap gap-1.5 pt-1", children: tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Badge, { variant: "secondary", className: "text-xs", children: tag }, tag)) })
438
- ] }),
439
- videoUrl && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "aspect-video w-full bg-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
440
- "iframe",
441
- {
442
- src: videoUrl,
443
- title,
444
- className: "h-full w-full",
445
- allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
446
- allowFullScreen: true
447
- }
448
- ) }),
449
- attachments && attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col gap-2 px-6 pb-6", children: [
450
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-medium text-foreground", children: "Attachments" }),
451
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex flex-col gap-1", children: attachments.map((attachment, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
452
- "a",
453
- {
454
- href: attachment.url,
455
- download: true,
456
- className: "flex items-center gap-2 text-sm text-primary hover:underline",
457
- children: [
458
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Download, { className: "size-3.5 shrink-0" }),
459
- attachment.name
460
- ]
461
- },
462
- i
463
- )) })
464
- ] }),
465
- (!attachments || attachments.length === 0) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "pb-2" })
466
- ]
467
- }
468
- ) });
469
- }
470
- function ResourceVideoCard({ video }) {
471
- const [modalOpen, setModalOpen] = (0, import_react3.useState)(false);
472
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
473
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
474
- "button",
475
- {
476
- type: "button",
477
- onClick: () => setModalOpen(true),
478
- className: "group relative flex w-full flex-col gap-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
479
- children: [
480
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "relative w-full overflow-hidden bg-muted aspect-video", children: [
481
- video.thumbnailUrl ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
482
- "img",
483
- {
484
- src: video.thumbnailUrl,
485
- alt: video.title,
486
- className: "h-full w-full object-cover transition-transform duration-200 group-hover:scale-105"
487
- }
488
- ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Play, { className: "size-10 text-muted-foreground opacity-40" }) }),
489
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex size-12 items-center justify-center bg-background/90", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Play, { className: "size-5 text-foreground" }) }) }),
490
- video.duration && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "absolute bottom-2 right-2 bg-black/70 px-1.5 py-0.5 text-xs font-medium text-white", children: video.duration })
491
- ] }),
492
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-medium text-foreground leading-snug line-clamp-2 group-hover:text-primary", children: video.title })
493
- ]
494
- }
495
- ),
496
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
497
- ResourceModal,
498
- {
499
- open: modalOpen,
500
- onClose: () => setModalOpen(false),
501
- title: video.title,
502
- videoUrl: video.videoUrl,
503
- tags: video.tags,
504
- attachments: video.attachments
505
- }
506
- )
507
- ] });
508
- }
509
- function ResourceEmailTemplateCard({
510
- template,
511
- onClick
512
- }) {
513
- if (template.isAddTemplate) {
514
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
515
- "button",
516
- {
517
- type: "button",
518
- onClick,
519
- className: cn(
520
- "flex w-full flex-col items-center justify-center gap-3",
521
- "border-2 border-dashed border-border bg-muted/40",
522
- "aspect-[3/4] hover:border-primary hover:bg-muted/70 transition-colors",
523
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
524
- ),
525
- children: [
526
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex size-10 items-center justify-center border-2 border-dashed border-muted-foreground/40", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-2xl text-muted-foreground/60", children: "+" }) }),
527
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-medium text-muted-foreground", children: "Add Template" })
528
- ]
529
- }
530
- );
531
- }
532
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
533
- "button",
534
- {
535
- type: "button",
536
- onClick,
537
- className: "group relative flex w-full flex-col gap-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
538
- children: [
539
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "relative w-full overflow-hidden border border-border bg-background aspect-[3/4]", children: [
540
- template.htmlContent ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
541
- "iframe",
542
- {
543
- srcDoc: template.htmlContent,
544
- title: template.title,
545
- className: "h-full w-full pointer-events-none",
546
- style: {
547
- transform: "scale(0.5)",
548
- transformOrigin: "top left",
549
- width: "200%",
550
- height: "200%"
551
- },
552
- sandbox: "allow-same-origin"
553
- }
554
- ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex h-full w-full items-center justify-center bg-muted", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-xs text-muted-foreground", children: "No preview available" }) }),
555
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-foreground/60 opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-sm font-medium text-white", children: "Use Template" }) })
556
- ] }),
557
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
558
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-medium text-foreground leading-snug line-clamp-1", children: template.title }),
559
- template.type && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Badge, { variant: "secondary", className: "shrink-0 text-xs", children: template.type === "system" ? "System" : "Company" })
560
- ] })
561
- ]
562
- }
563
- );
564
- }
565
- function ResourceDocumentCard({
566
- document,
567
- onClick
568
- }) {
569
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
570
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
571
- "button",
572
- {
573
- type: "button",
574
- onClick,
575
- className: "group relative w-full overflow-hidden border border-border bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring aspect-[3/4]",
576
- children: [
577
- document.pdfUrl ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
578
- "iframe",
579
- {
580
- src: document.pdfUrl,
581
- title: document.title,
582
- className: "h-full w-full pointer-events-none"
583
- }
584
- ) : document.thumbnailUrl ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
585
- "img",
586
- {
587
- src: document.thumbnailUrl,
588
- alt: document.title,
589
- className: "h-full w-full object-cover"
590
- }
591
- ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex h-full w-full flex-col items-center justify-center gap-2", children: [
592
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex items-center justify-center bg-muted-foreground/10 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Download, { className: "size-8 text-muted-foreground opacity-50" }) }),
593
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-xs text-muted-foreground", children: document.title })
594
- ] }),
595
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 bg-foreground/40 opacity-0 transition-opacity duration-200 group-hover:opacity-100" })
596
- ]
597
- }
598
- ),
599
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
600
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col gap-1 min-w-0", children: [
601
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-medium text-foreground leading-snug line-clamp-1", children: document.title }),
602
- document.tags && document.tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex flex-wrap gap-1", children: document.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Badge, { variant: "secondary", className: "text-xs", children: tag }, tag)) })
603
- ] }),
604
- document.downloadUrl && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
605
- "a",
606
- {
607
- href: document.downloadUrl,
608
- download: true,
609
- onClick: (e) => e.stopPropagation(),
610
- className: "shrink-0",
611
- "aria-label": `Download ${document.title}`,
612
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Button, { variant: "outline", size: "icon", className: "size-8", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Download, { className: "size-4" }) })
613
- }
614
- )
615
- ] })
616
- ] });
617
- }
618
- function ResourceCarousel({
619
- title,
620
- items,
621
- headerAction,
622
- className
623
- }) {
624
- const scrollRef = (0, import_react3.useRef)(null);
625
- function scrollLeft() {
626
- var _a;
627
- (_a = scrollRef.current) == null ? void 0 : _a.scrollBy({ left: -300, behavior: "smooth" });
628
- }
629
- function scrollRight() {
630
- var _a;
631
- (_a = scrollRef.current) == null ? void 0 : _a.scrollBy({ left: 300, behavior: "smooth" });
632
- }
633
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cn("flex flex-col gap-4", className), children: [
634
- (title || headerAction) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
635
- title && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h2", { className: "text-lg font-semibold text-foreground", children: title }),
636
- headerAction && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "shrink-0", children: headerAction })
637
- ] }),
638
- items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "py-8 text-center text-sm text-muted-foreground", children: "No items available" }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "group relative", children: [
639
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
640
- "button",
641
- {
642
- type: "button",
643
- onClick: scrollLeft,
644
- "aria-label": "Scroll left",
645
- className: cn(
646
- "absolute left-0 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2",
647
- "flex size-9 items-center justify-center",
648
- "border border-border bg-background shadow-sm",
649
- "opacity-0 transition-opacity duration-200 group-hover:opacity-100",
650
- "hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
651
- ),
652
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.ChevronLeft, { className: "size-4 text-foreground" })
653
- }
654
- ),
655
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
656
- "div",
657
- {
658
- ref: scrollRef,
659
- className: "flex gap-4 overflow-x-auto scroll-smooth pb-2",
660
- style: { scrollbarWidth: "none" },
661
- children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "w-[220px] shrink-0", children: item }, i))
662
- }
663
- ),
664
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
665
- "button",
666
- {
667
- type: "button",
668
- onClick: scrollRight,
669
- "aria-label": "Scroll right",
670
- className: cn(
671
- "absolute right-0 top-1/2 z-10 translate-x-1/2 -translate-y-1/2",
672
- "flex size-9 items-center justify-center",
673
- "border border-border bg-background shadow-sm",
674
- "opacity-0 transition-opacity duration-200 group-hover:opacity-100",
675
- "hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
676
- ),
677
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.ChevronRight, { className: "size-4 text-foreground" })
678
- }
679
- )
680
- ] })
681
- ] });
682
- }
683
- function ResourceCenterHeader({
684
- title,
685
- description,
686
- backgroundVideoUrl,
687
- watchVideoUrl
688
- }) {
689
- const [watchModalOpen, setWatchModalOpen] = (0, import_react3.useState)(false);
690
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
691
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
692
- "div",
693
- {
694
- className: cn(
695
- "relative flex min-h-[400px] w-full items-center overflow-hidden bg-foreground"
696
- ),
697
- children: [
698
- backgroundVideoUrl ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
699
- "video",
700
- {
701
- className: "absolute inset-0 h-full w-full object-cover opacity-60 z-[1]",
702
- src: backgroundVideoUrl,
703
- autoPlay: true,
704
- muted: true,
705
- loop: true,
706
- playsInline: true
707
- }
708
- ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 bg-foreground z-[1]" }),
709
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 bg-black/40 z-[1]" }),
710
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "relative z-[2] flex flex-col gap-4 px-8 py-12 md:px-16 max-w-3xl", children: [
711
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h1", { className: "text-3xl font-bold text-background md:text-4xl", children: title }),
712
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-base text-background/80 leading-relaxed", children: description }),
713
- watchVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
714
- Button,
715
- {
716
- variant: "outline",
717
- className: "border-background text-background bg-transparent hover:bg-background/10 hover:text-background",
718
- onClick: () => setWatchModalOpen(true),
719
- children: [
720
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.Play, { className: "mr-2 size-4" }),
721
- "Watch Now"
722
- ]
723
- }
724
- ) })
725
- ] })
726
- ]
727
- }
728
- ),
729
- watchVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
730
- ResourceModal,
731
- {
732
- open: watchModalOpen,
733
- onClose: () => setWatchModalOpen(false),
734
- title,
735
- videoUrl: watchVideoUrl
736
- }
737
- )
738
- ] });
739
- }
740
- // Annotate the CommonJS export names for ESM import in node:
741
- 0 && (module.exports = {
742
- ResourceCarousel,
743
- ResourceCenterHeader,
744
- ResourceDocumentCard,
745
- ResourceEmailTemplateCard,
746
- ResourceModal,
747
- ResourceVideoCard
748
- });