@wealthx/shadcn 1.5.12 → 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 (32) hide show
  1. package/.turbo/turbo-build.log +74 -74
  2. package/CHANGELOG.md +6 -0
  3. package/dist/{chunk-CPM6P63C.mjs → chunk-BF5FKUF6.mjs} +53 -24
  4. package/dist/chunk-KICT4VQL.mjs +508 -0
  5. package/dist/chunk-V23CBULF.mjs +432 -0
  6. package/dist/components/ui/appointment-calendar-view.js +177 -176
  7. package/dist/components/ui/appointment-calendar-view.mjs +1 -1
  8. package/dist/components/ui/bank-statement-generate-dialog.js +163 -76
  9. package/dist/components/ui/bank-statement-generate-dialog.mjs +2 -1
  10. package/dist/components/ui/resource-center/index.js +1030 -0
  11. package/dist/components/ui/resource-center/index.mjs +29 -0
  12. package/dist/index.js +540 -364
  13. package/dist/index.mjs +15 -13
  14. package/dist/styles.css +1 -1
  15. package/package.json +4 -4
  16. package/src/components/index.tsx +2 -0
  17. package/src/components/ui/appointment-calendar-view.tsx +211 -199
  18. package/src/components/ui/bank-statement-generate-dialog.tsx +125 -97
  19. package/src/components/ui/resource-center/index.tsx +35 -0
  20. package/src/components/ui/resource-center/resource-cards.tsx +218 -0
  21. package/src/components/ui/resource-center/resource-carousel.tsx +122 -0
  22. package/src/components/ui/resource-center/resource-center-header.tsx +95 -0
  23. package/src/components/ui/resource-center/resource-email-editor-dialog.tsx +131 -0
  24. package/src/components/ui/resource-center/resource-modal.tsx +76 -0
  25. package/src/components/ui/resource-center/types.ts +81 -0
  26. package/src/styles/styles-css.ts +1 -1
  27. package/tsup.config.ts +1 -1
  28. package/dist/chunk-IODGRCQG.mjs +0 -438
  29. package/dist/chunk-XYWEGBAA.mjs +0 -348
  30. package/dist/components/ui/resource-center.js +0 -748
  31. package/dist/components/ui/resource-center.mjs +0 -24
  32. package/src/components/ui/resource-center.tsx +0 -539
@@ -0,0 +1,1030 @@
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/index.tsx
60
+ var resource_center_exports = {};
61
+ __export(resource_center_exports, {
62
+ ResourceCarousel: () => ResourceCarousel,
63
+ ResourceCenterHeader: () => ResourceCenterHeader,
64
+ ResourceDocumentCard: () => ResourceDocumentCard,
65
+ ResourceEmailEditorDialog: () => ResourceEmailEditorDialog,
66
+ ResourceEmailTemplateCard: () => ResourceEmailTemplateCard,
67
+ ResourceModal: () => ResourceModal,
68
+ ResourceVideoCard: () => ResourceVideoCard
69
+ });
70
+ module.exports = __toCommonJS(resource_center_exports);
71
+
72
+ // src/components/ui/resource-center/resource-carousel.tsx
73
+ var import_react = require("react");
74
+ var import_lucide_react = require("lucide-react");
75
+
76
+ // src/lib/utils.ts
77
+ var import_clsx = require("clsx");
78
+ var import_tailwind_merge = require("tailwind-merge");
79
+ var twMerge = (0, import_tailwind_merge.extendTailwindMerge)({
80
+ extend: {
81
+ classGroups: {
82
+ "font-size": [
83
+ {
84
+ text: [
85
+ "display-large",
86
+ "display-medium",
87
+ "display-small",
88
+ "h1",
89
+ "h2",
90
+ "h3",
91
+ "h4",
92
+ "h5",
93
+ "h6",
94
+ "body-large",
95
+ "body-medium",
96
+ "body-small",
97
+ "label-large",
98
+ "label-medium",
99
+ "label-small",
100
+ "button",
101
+ "button-xs",
102
+ "caption",
103
+ "overline",
104
+ "code"
105
+ ]
106
+ }
107
+ ]
108
+ }
109
+ }
110
+ });
111
+ function cn(...inputs) {
112
+ return twMerge((0, import_clsx.clsx)(inputs));
113
+ }
114
+
115
+ // src/components/ui/toggle-group.tsx
116
+ var React = __toESM(require("react"));
117
+ var import_toggle_group = require("@base-ui/react/toggle-group");
118
+ var import_toggle2 = require("@base-ui/react/toggle");
119
+
120
+ // src/components/ui/toggle.tsx
121
+ var import_class_variance_authority = require("class-variance-authority");
122
+ var import_toggle = require("@base-ui/react/toggle");
123
+ var import_jsx_runtime = require("react/jsx-runtime");
124
+ var toggleVariants = (0, import_class_variance_authority.cva)(
125
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap transition-[color,box-shadow] 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 data-pressed:bg-primary/10 data-pressed:inset-ring data-pressed:inset-ring-primary data-pressed:text-foreground data-pressed:hover:bg-primary/10 data-pressed:hover:text-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
126
+ {
127
+ variants: {
128
+ variant: {
129
+ default: "bg-transparent hover:bg-muted hover:text-muted-foreground",
130
+ outline: "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground"
131
+ },
132
+ size: {
133
+ default: "h-9 min-w-9 px-2 text-label-large",
134
+ sm: "h-8 min-w-8 px-1.5 text-label-medium",
135
+ lg: "h-10 min-w-10 px-2.5 text-h5"
136
+ }
137
+ },
138
+ defaultVariants: {
139
+ variant: "default",
140
+ size: "default"
141
+ }
142
+ }
143
+ );
144
+
145
+ // src/components/ui/toggle-group.tsx
146
+ var import_jsx_runtime2 = require("react/jsx-runtime");
147
+ var ToggleGroupContext = React.createContext({
148
+ size: "default",
149
+ variant: "default",
150
+ spacing: 0
151
+ });
152
+ function ToggleGroup(_a) {
153
+ var _b = _a, {
154
+ className,
155
+ variant,
156
+ size,
157
+ spacing = 0,
158
+ type,
159
+ children
160
+ } = _b, props = __objRest(_b, [
161
+ "className",
162
+ "variant",
163
+ "size",
164
+ "spacing",
165
+ "type",
166
+ "children"
167
+ ]);
168
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
169
+ import_toggle_group.ToggleGroup,
170
+ __spreadProps(__spreadValues({
171
+ className: cn(
172
+ // WealthX: removed rounded-md (sharp corners) and shadow-xs (flat panels)
173
+ "group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))]",
174
+ className
175
+ ),
176
+ "data-size": size,
177
+ "data-slot": "toggle-group",
178
+ "data-spacing": spacing,
179
+ "data-variant": variant,
180
+ multiple: type === "multiple",
181
+ style: { "--gap": spacing }
182
+ }, props), {
183
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ToggleGroupContext.Provider, { value: { variant, size, spacing }, children })
184
+ })
185
+ );
186
+ }
187
+ function ToggleGroupItem(_a) {
188
+ var _b = _a, {
189
+ className,
190
+ children,
191
+ variant,
192
+ size
193
+ } = _b, props = __objRest(_b, [
194
+ "className",
195
+ "children",
196
+ "variant",
197
+ "size"
198
+ ]);
199
+ const context = React.useContext(ToggleGroupContext);
200
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
201
+ import_toggle2.Toggle,
202
+ __spreadProps(__spreadValues({
203
+ className: cn(
204
+ toggleVariants({
205
+ variant: context.variant || variant,
206
+ size: context.size || size
207
+ }),
208
+ "w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10",
209
+ // WealthX: no rounded corners on grouped items
210
+ "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l",
211
+ className
212
+ ),
213
+ "data-size": context.size || size,
214
+ "data-slot": "toggle-group-item",
215
+ "data-spacing": context.spacing,
216
+ "data-variant": context.variant || variant
217
+ }, props), {
218
+ children
219
+ })
220
+ );
221
+ }
222
+
223
+ // src/components/ui/resource-center/resource-carousel.tsx
224
+ var import_jsx_runtime3 = require("react/jsx-runtime");
225
+ function ResourceCarousel({
226
+ title,
227
+ items,
228
+ headerAction,
229
+ onViewModeChange,
230
+ className
231
+ }) {
232
+ const scrollRef = (0, import_react.useRef)(null);
233
+ const [viewMode, setViewMode] = (0, import_react.useState)("compact");
234
+ function scrollLeft() {
235
+ var _a;
236
+ (_a = scrollRef.current) == null ? void 0 : _a.scrollBy({ left: -380, behavior: "smooth" });
237
+ }
238
+ function scrollRight() {
239
+ var _a;
240
+ (_a = scrollRef.current) == null ? void 0 : _a.scrollBy({ left: 380, behavior: "smooth" });
241
+ }
242
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: cn("flex flex-col gap-4", className), children: [
243
+ (title || headerAction) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
244
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex flex-1 items-center gap-4 min-w-0", children: [
245
+ title && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h2", { className: "text-h3 text-foreground", children: title }),
246
+ headerAction && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex-1 flex justify-end", children: headerAction })
247
+ ] }),
248
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
249
+ ToggleGroup,
250
+ {
251
+ type: "single",
252
+ variant: "outline",
253
+ value: [viewMode],
254
+ onValueChange: (v) => {
255
+ if (v.length > 0) {
256
+ const mode = v[0];
257
+ setViewMode(mode);
258
+ onViewModeChange == null ? void 0 : onViewModeChange(mode);
259
+ }
260
+ },
261
+ "aria-label": "View mode",
262
+ children: [
263
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ToggleGroupItem, { value: "compact", "aria-label": "Compact view", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.GalleryHorizontal, { className: "size-4" }) }),
264
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ToggleGroupItem, { value: "grid", "aria-label": "Grid view", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.LayoutGrid, { className: "size-4" }) })
265
+ ]
266
+ }
267
+ )
268
+ ] }),
269
+ items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "py-8 text-center text-body-small text-muted-foreground", children: "No items available" }) : viewMode === "grid" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "grid grid-cols-4 gap-6 max-[1280px]:grid-cols-3 max-[900px]:grid-cols-2 max-[600px]:grid-cols-1", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { children: item }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "group/track relative", children: [
270
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
271
+ "button",
272
+ {
273
+ type: "button",
274
+ onClick: scrollLeft,
275
+ "aria-label": "Scroll left",
276
+ className: cn(
277
+ "absolute left-0 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2",
278
+ "flex size-9 items-center justify-center",
279
+ "border border-border bg-background shadow-sm",
280
+ "opacity-0 transition-opacity duration-200 group-hover/track:opacity-100",
281
+ "hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
282
+ ),
283
+ children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ChevronLeft, { className: "size-4 text-foreground" })
284
+ }
285
+ ),
286
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
287
+ "div",
288
+ {
289
+ ref: scrollRef,
290
+ className: "flex gap-4 overflow-x-auto scroll-smooth pb-2",
291
+ style: { scrollbarWidth: "none" },
292
+ children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "w-[360px] shrink-0", children: item }, i))
293
+ }
294
+ ),
295
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
296
+ "button",
297
+ {
298
+ type: "button",
299
+ onClick: scrollRight,
300
+ "aria-label": "Scroll right",
301
+ className: cn(
302
+ "absolute right-0 top-1/2 z-10 translate-x-1/2 -translate-y-1/2",
303
+ "flex size-9 items-center justify-center",
304
+ "border border-border bg-background shadow-sm",
305
+ "opacity-0 transition-opacity duration-200 group-hover/track:opacity-100",
306
+ "hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
307
+ ),
308
+ children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ChevronRight, { className: "size-4 text-foreground" })
309
+ }
310
+ )
311
+ ] })
312
+ ] });
313
+ }
314
+
315
+ // src/components/ui/resource-center/resource-center-header.tsx
316
+ var import_react4 = require("react");
317
+ var import_lucide_react5 = require("lucide-react");
318
+
319
+ // src/components/ui/button.tsx
320
+ var import_react2 = require("react");
321
+ var import_class_variance_authority2 = require("class-variance-authority");
322
+ var import_lucide_react2 = require("lucide-react");
323
+
324
+ // src/lib/slot.tsx
325
+ var React3 = __toESM(require("react"));
326
+ function mergeRefs(...refs) {
327
+ return (value) => {
328
+ for (const ref of refs) {
329
+ if (typeof ref === "function") ref(value);
330
+ else if (ref !== null)
331
+ ref.current = value;
332
+ }
333
+ };
334
+ }
335
+ var Slot = React3.forwardRef(
336
+ (_a, forwardedRef) => {
337
+ var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
338
+ const child = React3.Children.only(children);
339
+ if (!React3.isValidElement(child)) return null;
340
+ const childProps = child.props;
341
+ const merged = __spreadValues({}, props);
342
+ for (const key of Object.keys(childProps)) {
343
+ if (key === "className") {
344
+ merged.className = [props.className, childProps.className].filter(Boolean).join(" ");
345
+ } else if (key === "style") {
346
+ merged.style = __spreadValues(__spreadValues({}, props.style), childProps.style);
347
+ } else if (key.startsWith("on") && typeof childProps[key] === "function") {
348
+ const parentHandler = props[key];
349
+ if (typeof parentHandler === "function") {
350
+ merged[key] = (...args) => {
351
+ childProps[key](...args);
352
+ parentHandler(...args);
353
+ };
354
+ } else {
355
+ merged[key] = childProps[key];
356
+ }
357
+ } else {
358
+ merged[key] = childProps[key];
359
+ }
360
+ }
361
+ const childRef = child.ref;
362
+ merged.ref = forwardedRef ? mergeRefs(forwardedRef, childRef) : childRef;
363
+ return React3.cloneElement(
364
+ child,
365
+ merged
366
+ );
367
+ }
368
+ );
369
+ Slot.displayName = "Slot";
370
+
371
+ // src/components/ui/button.tsx
372
+ var import_jsx_runtime4 = require("react/jsx-runtime");
373
+ var buttonVariants = (0, import_class_variance_authority2.cva)(
374
+ "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",
375
+ {
376
+ variants: {
377
+ variant: {
378
+ default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
379
+ secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
380
+ 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",
381
+ 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",
382
+ "outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
383
+ "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",
384
+ ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs focus-visible:ring-border/50 dark:hover:bg-accent/50",
385
+ link: "text-primary underline-offset-4 hover:underline"
386
+ },
387
+ size: {
388
+ default: "h-9 px-4 py-2 has-[>svg]:px-3",
389
+ xs: "h-6 gap-1 px-2 text-button-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
390
+ sm: "h-8 gap-1.5 px-3 has-[>svg]:px-2.5",
391
+ lg: "h-10 px-6 has-[>svg]:px-4",
392
+ icon: "size-9",
393
+ "icon-xs": "size-6 [&_svg:not([class*='size-'])]:size-3",
394
+ "icon-sm": "size-8",
395
+ "icon-lg": "size-10"
396
+ }
397
+ },
398
+ defaultVariants: {
399
+ variant: "default",
400
+ size: "default"
401
+ }
402
+ }
403
+ );
404
+ var Button = (0, import_react2.forwardRef)(function Button2(_a, ref) {
405
+ var _b = _a, {
406
+ className,
407
+ variant,
408
+ size,
409
+ asChild = false,
410
+ loading = false,
411
+ disabled,
412
+ type = "button",
413
+ children
414
+ } = _b, props = __objRest(_b, [
415
+ "className",
416
+ "variant",
417
+ "size",
418
+ "asChild",
419
+ "loading",
420
+ "disabled",
421
+ "type",
422
+ "children"
423
+ ]);
424
+ const Comp = asChild ? Slot : "button";
425
+ const isIconOnly = size === "icon" || size === "icon-xs" || size === "icon-sm" || size === "icon-lg";
426
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
427
+ Comp,
428
+ __spreadProps(__spreadValues({
429
+ className: cn(buttonVariants({ variant, size, className })),
430
+ "data-size": size,
431
+ "data-slot": "button",
432
+ "data-variant": variant,
433
+ disabled: loading || disabled,
434
+ ref,
435
+ type
436
+ }, props), {
437
+ children: loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
438
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.Loader2, { "aria-hidden": "true", className: "animate-spin" }),
439
+ !isIconOnly && children
440
+ ] }) : children
441
+ })
442
+ );
443
+ });
444
+
445
+ // src/components/ui/resource-center/resource-modal.tsx
446
+ var import_lucide_react4 = require("lucide-react");
447
+
448
+ // src/components/ui/badge.tsx
449
+ var import_class_variance_authority3 = require("class-variance-authority");
450
+ var import_jsx_runtime5 = require("react/jsx-runtime");
451
+ var badgeVariants = (0, import_class_variance_authority3.cva)(
452
+ "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",
453
+ {
454
+ variants: {
455
+ variant: {
456
+ default: "border-primary/40 bg-primary/10 text-foreground [a&]:hover:bg-primary/15",
457
+ secondary: "border-border bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
458
+ 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",
459
+ success: "border-success/40 bg-success/10 text-success-text [a&]:hover:bg-success/15",
460
+ warning: "border-warning/40 bg-warning/10 text-warning-text [a&]:hover:bg-warning/15",
461
+ info: "border-info/40 bg-info/10 text-info-text [a&]:hover:bg-info/15",
462
+ outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
463
+ ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
464
+ link: "text-primary underline-offset-4 [a&]:hover:underline"
465
+ }
466
+ },
467
+ defaultVariants: {
468
+ variant: "default"
469
+ }
470
+ }
471
+ );
472
+ function Badge(_a) {
473
+ var _b = _a, {
474
+ className,
475
+ variant = "default",
476
+ asChild = false
477
+ } = _b, props = __objRest(_b, [
478
+ "className",
479
+ "variant",
480
+ "asChild"
481
+ ]);
482
+ const Comp = asChild ? Slot : "span";
483
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
484
+ Comp,
485
+ __spreadValues({
486
+ className: cn(badgeVariants({ variant }), className),
487
+ "data-slot": "badge",
488
+ "data-variant": variant
489
+ }, props)
490
+ );
491
+ }
492
+
493
+ // src/components/ui/dialog.tsx
494
+ var import_lucide_react3 = require("lucide-react");
495
+ var import_dialog = require("@base-ui/react/dialog");
496
+
497
+ // src/lib/theme-provider.tsx
498
+ var import_react3 = require("react");
499
+ var import_jsx_runtime6 = require("react/jsx-runtime");
500
+ var ThemeVarsContext = (0, import_react3.createContext)({});
501
+ function useThemeVars() {
502
+ return (0, import_react3.useContext)(ThemeVarsContext);
503
+ }
504
+
505
+ // src/components/ui/dialog.tsx
506
+ var import_jsx_runtime7 = require("react/jsx-runtime");
507
+ function Dialog(_a) {
508
+ var props = __objRest(_a, []);
509
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_dialog.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
510
+ }
511
+ function DialogPortal(_a) {
512
+ var props = __objRest(_a, []);
513
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_dialog.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
514
+ }
515
+ function DialogOverlay(_a) {
516
+ var _b = _a, {
517
+ className
518
+ } = _b, props = __objRest(_b, [
519
+ "className"
520
+ ]);
521
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
522
+ import_dialog.Dialog.Backdrop,
523
+ __spreadValues({
524
+ className: cn(
525
+ // WealthX: foreground/50 scrim (matches Figma — foreground token at 50% opacity)
526
+ "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",
527
+ className
528
+ ),
529
+ "data-slot": "dialog-overlay"
530
+ }, props)
531
+ );
532
+ }
533
+ var DIALOG_MAX_WIDTHS = {
534
+ sm: "24rem",
535
+ md: "28rem",
536
+ lg: "32rem",
537
+ xl: "36rem",
538
+ "2xl": "42rem",
539
+ "3xl": "48rem",
540
+ "4xl": "56rem",
541
+ full: "100%"
542
+ };
543
+ var DIALOG_AUTO_MIN_WIDTH = "20rem";
544
+ function DialogContent(_a) {
545
+ var _b = _a, {
546
+ className,
547
+ children,
548
+ showCloseButton = true,
549
+ style,
550
+ container,
551
+ align = "top",
552
+ size = "lg",
553
+ minWidth
554
+ } = _b, props = __objRest(_b, [
555
+ "className",
556
+ "children",
557
+ "showCloseButton",
558
+ "style",
559
+ "container",
560
+ "align",
561
+ "size",
562
+ "minWidth"
563
+ ]);
564
+ const themeVars = useThemeVars();
565
+ const isAuto = size === "auto";
566
+ const sizeStyle = isAuto ? { minWidth: minWidth != null ? minWidth : DIALOG_AUTO_MIN_WIDTH } : { maxWidth: DIALOG_MAX_WIDTHS[size] };
567
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(DialogPortal, { container: container != null ? container : void 0, children: [
568
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogOverlay, { style: themeVars }),
569
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
570
+ import_dialog.Dialog.Popup,
571
+ __spreadProps(__spreadValues({
572
+ className: cn(
573
+ // WealthX: removed rounded-lg (sharp corners), shadow-lg (flat panels)
574
+ // max-w-[calc(100%-2rem)] acts as a viewport-edge guard on all sizes.
575
+ // Fixed max-width is applied via inline style (sizeStyle) to avoid
576
+ // Tailwind v4 class-scanning gaps with dynamic class lookups.
577
+ "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",
578
+ // "auto" → hug content (with min-width floor); fixed sizes → fill to max-width
579
+ isAuto ? "w-auto" : "w-full",
580
+ align === "center" ? "top-[50%] translate-y-[-50%]" : "top-4 translate-y-0",
581
+ className
582
+ ),
583
+ "data-slot": "dialog-content",
584
+ style: __spreadValues(__spreadValues(__spreadValues({}, themeVars), sizeStyle), style)
585
+ }, props), {
586
+ children: [
587
+ children,
588
+ showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
589
+ import_dialog.Dialog.Close,
590
+ {
591
+ 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",
592
+ "data-slot": "dialog-close",
593
+ children: [
594
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react3.XIcon, {}),
595
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "sr-only", children: "Close" })
596
+ ]
597
+ }
598
+ ) : null
599
+ ]
600
+ })
601
+ )
602
+ ] });
603
+ }
604
+ function DialogHeader(_a) {
605
+ var _b = _a, {
606
+ className
607
+ } = _b, props = __objRest(_b, [
608
+ "className"
609
+ ]);
610
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
611
+ "div",
612
+ __spreadValues({
613
+ className: cn("flex flex-col gap-1.5", className),
614
+ "data-slot": "dialog-header"
615
+ }, props)
616
+ );
617
+ }
618
+ function DialogTitle(_a) {
619
+ var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
620
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
621
+ import_dialog.Dialog.Title,
622
+ __spreadValues({
623
+ className: cn("text-h5 leading-none", className),
624
+ "data-slot": "dialog-title"
625
+ }, props)
626
+ );
627
+ }
628
+
629
+ // src/components/ui/resource-center/resource-modal.tsx
630
+ var import_jsx_runtime8 = require("react/jsx-runtime");
631
+ function ResourceModal({
632
+ open,
633
+ onClose,
634
+ title,
635
+ videoUrl,
636
+ tags,
637
+ attachments
638
+ }) {
639
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Dialog, { open, onOpenChange: (v) => !v && onClose(), children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
640
+ DialogContent,
641
+ {
642
+ size: "2xl",
643
+ className: "flex flex-col gap-4 p-0 overflow-hidden",
644
+ children: [
645
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(DialogHeader, { className: "px-6 pt-6 pb-0", children: [
646
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DialogTitle, { className: "text-h5", children: title }),
647
+ tags && tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex flex-wrap gap-1.5 pt-1", children: tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Badge, { variant: "secondary", children: tag }, tag)) })
648
+ ] }),
649
+ videoUrl && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "aspect-video w-full bg-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
650
+ "iframe",
651
+ {
652
+ src: videoUrl,
653
+ title,
654
+ className: "h-full w-full",
655
+ allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
656
+ allowFullScreen: true
657
+ }
658
+ ) }),
659
+ attachments && attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-col gap-2 px-6 pb-6", children: [
660
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-body-small font-medium text-foreground", children: "Attachments" }),
661
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex flex-col gap-1", children: attachments.map((attachment, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
662
+ "a",
663
+ {
664
+ href: attachment.url,
665
+ download: true,
666
+ className: "flex items-center gap-2 text-body-small text-primary hover:underline",
667
+ children: [
668
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.Download, { className: "size-3.5 shrink-0" }),
669
+ attachment.name
670
+ ]
671
+ },
672
+ i
673
+ )) })
674
+ ] }),
675
+ (!attachments || attachments.length === 0) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "pb-2" })
676
+ ]
677
+ }
678
+ ) });
679
+ }
680
+
681
+ // src/components/ui/resource-center/resource-center-header.tsx
682
+ var import_jsx_runtime9 = require("react/jsx-runtime");
683
+ function ResourceCenterHeader({
684
+ title,
685
+ description,
686
+ backgroundImageUrl,
687
+ backgroundVideoUrl,
688
+ watchVideoUrl
689
+ }) {
690
+ const [watchModalOpen, setWatchModalOpen] = (0, import_react4.useState)(false);
691
+ const hasBackground = !!backgroundImageUrl || !!backgroundVideoUrl;
692
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
693
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
694
+ "div",
695
+ {
696
+ className: cn(
697
+ "relative flex min-h-[480px] w-full items-center overflow-hidden max-[900px]:min-h-[360px] max-[600px]:min-h-[260px]"
698
+ ),
699
+ children: [
700
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
701
+ "div",
702
+ {
703
+ className: cn(
704
+ "absolute inset-0 z-[0]",
705
+ hasBackground ? "bg-foreground" : "bg-gradient-to-br from-primary to-foreground"
706
+ )
707
+ }
708
+ ),
709
+ backgroundImageUrl && !backgroundVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
710
+ "img",
711
+ {
712
+ src: backgroundImageUrl,
713
+ alt: "",
714
+ "aria-hidden": "true",
715
+ className: "absolute inset-0 h-full w-full object-cover z-[1]"
716
+ }
717
+ ),
718
+ backgroundVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
719
+ "video",
720
+ {
721
+ className: "absolute inset-0 h-full w-full object-cover z-[1]",
722
+ src: backgroundVideoUrl,
723
+ autoPlay: true,
724
+ muted: true,
725
+ loop: true,
726
+ playsInline: true
727
+ }
728
+ ),
729
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
730
+ "div",
731
+ {
732
+ className: cn(
733
+ "absolute inset-0 z-[2]",
734
+ hasBackground ? "bg-black/50" : "bg-black/20"
735
+ )
736
+ }
737
+ ),
738
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "relative z-[3] flex flex-col gap-4 px-8 py-12 md:px-16 max-w-3xl", children: [
739
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { className: "text-[56px] font-bold text-white leading-none max-[900px]:text-[40px] max-[600px]:text-[32px]", children: title }),
740
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-body-medium text-white/80 leading-relaxed", children: description }),
741
+ watchVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Button, { variant: "default", onClick: () => setWatchModalOpen(true), children: [
742
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.Play, { className: "mr-2 size-4" }),
743
+ "Watch Now"
744
+ ] }) })
745
+ ] })
746
+ ]
747
+ }
748
+ ),
749
+ watchVideoUrl && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
750
+ ResourceModal,
751
+ {
752
+ open: watchModalOpen,
753
+ onClose: () => setWatchModalOpen(false),
754
+ title,
755
+ videoUrl: watchVideoUrl
756
+ }
757
+ )
758
+ ] });
759
+ }
760
+
761
+ // src/components/ui/resource-center/resource-cards.tsx
762
+ var import_react5 = require("react");
763
+ var import_lucide_react6 = require("lucide-react");
764
+ var import_jsx_runtime10 = require("react/jsx-runtime");
765
+ function ResourceVideoCard({ video }) {
766
+ const [modalOpen, setModalOpen] = (0, import_react5.useState)(false);
767
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
768
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
769
+ "button",
770
+ {
771
+ type: "button",
772
+ onClick: () => setModalOpen(true),
773
+ className: "group relative flex w-full flex-col gap-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
774
+ children: [
775
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "relative w-full overflow-hidden bg-muted aspect-video", children: [
776
+ video.thumbnailUrl ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
777
+ "img",
778
+ {
779
+ src: video.thumbnailUrl,
780
+ alt: video.title,
781
+ className: "h-full w-full object-cover transition-transform duration-200 group-hover:scale-105"
782
+ }
783
+ ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react6.Play, { className: "size-10 text-muted-foreground opacity-40" }) }),
784
+ /* @__PURE__ */ (0, import_jsx_runtime10.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_runtime10.jsx)("div", { className: "flex size-12 items-center justify-center bg-background/90", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react6.Play, { className: "size-5 text-foreground" }) }) }),
785
+ video.duration && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "absolute bottom-2 right-2 bg-black/70 px-1.5 py-0.5 text-caption text-white", children: video.duration })
786
+ ] }),
787
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-body-medium font-semibold text-foreground leading-snug line-clamp-2", children: video.title })
788
+ ]
789
+ }
790
+ ),
791
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
792
+ ResourceModal,
793
+ {
794
+ open: modalOpen,
795
+ onClose: () => setModalOpen(false),
796
+ title: video.title,
797
+ videoUrl: video.videoUrl,
798
+ tags: video.tags,
799
+ attachments: video.attachments
800
+ }
801
+ )
802
+ ] });
803
+ }
804
+ function ResourceEmailTemplateCard({
805
+ template,
806
+ onClick
807
+ }) {
808
+ if (template.isAddTemplate) {
809
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
810
+ "button",
811
+ {
812
+ type: "button",
813
+ onClick,
814
+ className: cn(
815
+ "flex w-full flex-col items-center justify-center gap-3",
816
+ "border-2 border-dashed border-border bg-muted/40",
817
+ "aspect-video hover:border-primary hover:bg-muted/70 transition-colors",
818
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
819
+ ),
820
+ children: [
821
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex size-10 items-center justify-center border-2 border-dashed border-muted-foreground/40", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-2xl text-muted-foreground/60", children: "+" }) }),
822
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-body-small font-medium text-muted-foreground", children: "Add Template" })
823
+ ]
824
+ }
825
+ );
826
+ }
827
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
828
+ "button",
829
+ {
830
+ type: "button",
831
+ onClick,
832
+ className: "group relative flex w-full flex-col gap-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
833
+ children: [
834
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "relative w-full overflow-hidden border border-border bg-background aspect-video", children: [
835
+ template.htmlContent ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
836
+ "iframe",
837
+ {
838
+ srcDoc: template.htmlContent,
839
+ title: template.title,
840
+ className: "h-full w-full pointer-events-none",
841
+ style: {
842
+ transform: "scale(0.5)",
843
+ transformOrigin: "top left",
844
+ width: "200%",
845
+ height: "200%"
846
+ },
847
+ sandbox: "allow-same-origin"
848
+ }
849
+ ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex h-full w-full items-center justify-center bg-muted", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-caption text-muted-foreground", children: "No preview available" }) }),
850
+ /* @__PURE__ */ (0, import_jsx_runtime10.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_runtime10.jsx)("span", { className: "text-body-small font-medium text-white", children: "Use Template" }) })
851
+ ] }),
852
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
853
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-body-small font-medium text-foreground leading-snug line-clamp-1", children: template.title }),
854
+ template.type && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Badge, { variant: "secondary", className: "shrink-0", children: template.type === "system" ? "System" : "Company" })
855
+ ] })
856
+ ]
857
+ }
858
+ );
859
+ }
860
+ function ResourceDocumentCard({
861
+ document,
862
+ onClick
863
+ }) {
864
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
865
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
866
+ "button",
867
+ {
868
+ type: "button",
869
+ onClick,
870
+ 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-video",
871
+ children: [
872
+ document.pdfUrl ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
873
+ "iframe",
874
+ {
875
+ src: document.pdfUrl,
876
+ title: document.title,
877
+ className: "h-full w-full pointer-events-none"
878
+ }
879
+ ) : document.thumbnailUrl ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
880
+ "img",
881
+ {
882
+ src: document.thumbnailUrl,
883
+ alt: document.title,
884
+ className: "h-full w-full object-cover"
885
+ }
886
+ ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex h-full w-full flex-col items-center justify-center gap-2", children: [
887
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex items-center justify-center bg-muted-foreground/10 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react6.Download, { className: "size-8 text-muted-foreground opacity-50" }) }),
888
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-caption text-muted-foreground", children: document.title })
889
+ ] }),
890
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "absolute inset-0 bg-foreground/40 opacity-0 transition-opacity duration-200 group-hover:opacity-100" })
891
+ ]
892
+ }
893
+ ),
894
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
895
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-1 min-w-0", children: [
896
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-body-small font-medium text-foreground leading-snug line-clamp-1", children: document.title }),
897
+ document.tags && document.tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-wrap gap-1", children: document.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Badge, { variant: "secondary", children: tag }, tag)) })
898
+ ] }),
899
+ document.downloadUrl && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
900
+ "a",
901
+ {
902
+ href: document.downloadUrl,
903
+ download: true,
904
+ onClick: (e) => e.stopPropagation(),
905
+ className: "shrink-0",
906
+ "aria-label": `Download ${document.title}`,
907
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Button, { variant: "outline", size: "icon", className: "size-8", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react6.Download, { className: "size-4" }) })
908
+ }
909
+ )
910
+ ] })
911
+ ] });
912
+ }
913
+
914
+ // src/components/ui/resource-center/resource-email-editor-dialog.tsx
915
+ var import_react6 = require("react");
916
+
917
+ // src/components/ui/input.tsx
918
+ var import_jsx_runtime11 = require("react/jsx-runtime");
919
+ function Input(_a) {
920
+ var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
921
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
922
+ "input",
923
+ __spreadValues({
924
+ className: cn(
925
+ "h-9 w-full min-w-0 border border-input bg-transparent px-3 py-1 text-body-medium font-sans shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-label-medium file:text-foreground placeholder:font-normal placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30",
926
+ "focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20",
927
+ "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
928
+ className
929
+ ),
930
+ "data-slot": "input",
931
+ type
932
+ }, props)
933
+ );
934
+ }
935
+
936
+ // src/components/ui/resource-center/resource-email-editor-dialog.tsx
937
+ var import_jsx_runtime12 = require("react/jsx-runtime");
938
+ var EDITOR_CONTENT_TYPES = [
939
+ "Columns",
940
+ "Button",
941
+ "Divider",
942
+ "Heading",
943
+ "Paragraph",
944
+ "Image",
945
+ "Social",
946
+ "Menu",
947
+ "HTML"
948
+ ];
949
+ function ResourceEmailEditorDialog({
950
+ open,
951
+ onClose,
952
+ onSave,
953
+ editorSlot
954
+ }) {
955
+ const [templateName, setTemplateName] = (0, import_react6.useState)("");
956
+ function handleSave() {
957
+ onSave(templateName);
958
+ }
959
+ function handleClose() {
960
+ setTemplateName("");
961
+ onClose();
962
+ }
963
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Dialog, { open, onOpenChange: (v) => !v && handleClose(), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
964
+ DialogContent,
965
+ {
966
+ size: "4xl",
967
+ className: "flex flex-col gap-0 p-0 overflow-hidden h-[90vh]",
968
+ children: [
969
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "shrink-0 border-b border-border px-6 py-4", children: [
970
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-label-small text-muted-foreground mb-1", children: "Template Name" }),
971
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
972
+ Input,
973
+ {
974
+ placeholder: "Enter template name",
975
+ value: templateName,
976
+ onChange: (e) => setTemplateName(e.target.value),
977
+ className: "border-none shadow-none px-0 text-body-medium h-auto focus-visible:ring-0 bg-transparent"
978
+ }
979
+ )
980
+ ] }),
981
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex-1 overflow-hidden", children: editorSlot != null ? editorSlot : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(EditorPlaceholder, {}) }),
982
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "shrink-0 flex items-center justify-between border-t border-border px-6 py-4", children: [
983
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Button, { variant: "outline", onClick: handleClose, children: "Back" }),
984
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Button, { variant: "default", onClick: handleSave, children: "Save Email" })
985
+ ] })
986
+ ]
987
+ }
988
+ ) });
989
+ }
990
+ function EditorPlaceholder() {
991
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex h-full", children: [
992
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex flex-1 items-center justify-center bg-[#f4f4f4]", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "max-w-[500px] w-full border-2 border-dashed border-[#9ecbf0] bg-[#e8f4ff] px-16 py-10 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-body-small text-[#5c9fd8]", children: "No content here. Drag content from right." }) }) }),
993
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "w-[280px] shrink-0 flex flex-col border-l border-border bg-background", children: [
994
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex border-b border-border", children: ["Content", "Blocks", "Body"].map((tab, i) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
995
+ "button",
996
+ {
997
+ type: "button",
998
+ className: cn(
999
+ "flex flex-1 flex-col items-center gap-1 py-3 text-caption",
1000
+ i === 0 ? "text-foreground border-b-2 border-foreground" : "text-muted-foreground"
1001
+ ),
1002
+ children: tab
1003
+ },
1004
+ tab
1005
+ )) }),
1006
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "grid grid-cols-3 gap-2 p-3", children: EDITOR_CONTENT_TYPES.map((item) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1007
+ "div",
1008
+ {
1009
+ className: "flex flex-col items-center gap-1.5 border border-border p-2 hover:bg-muted transition-colors cursor-grab",
1010
+ children: [
1011
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "size-6 bg-foreground/10 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-[10px] text-foreground/40", children: "\u25A4" }) }),
1012
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-[11px] text-foreground leading-none text-center", children: item })
1013
+ ]
1014
+ },
1015
+ item
1016
+ )) }),
1017
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mt-auto border-t border-border py-2.5 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-caption text-muted-foreground", children: "\u26A1 by Unlayer Editor" }) })
1018
+ ] })
1019
+ ] });
1020
+ }
1021
+ // Annotate the CommonJS export names for ESM import in node:
1022
+ 0 && (module.exports = {
1023
+ ResourceCarousel,
1024
+ ResourceCenterHeader,
1025
+ ResourceDocumentCard,
1026
+ ResourceEmailEditorDialog,
1027
+ ResourceEmailTemplateCard,
1028
+ ResourceModal,
1029
+ ResourceVideoCard
1030
+ });