@adatechnology/notification-ui 0.4.0 → 0.5.0
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/dist/{chunk-SFMOFCHV.js → chunk-7A6A4MNA.js} +221 -16
- package/dist/chunk-7A6A4MNA.js.map +1 -0
- package/dist/{headless-03_gfBEI.d.ts → headless--Os4o240.d.ts} +54 -4
- package/dist/headless.d.ts +2 -2
- package/dist/headless.js +5 -1
- package/dist/index.d.ts +30 -4
- package/dist/index.js +507 -339
- package/dist/index.js.map +1 -1
- package/dist/styles.css +169 -0
- package/dist/styles.css.map +1 -1
- package/package.json +3 -3
- package/dist/chunk-SFMOFCHV.js.map +0 -1
package/dist/index.js
CHANGED
|
@@ -17,8 +17,10 @@ import {
|
|
|
17
17
|
useMarkAllAsRead,
|
|
18
18
|
useMarkAsRead,
|
|
19
19
|
useNotificationContext,
|
|
20
|
+
useNotificationPermission,
|
|
20
21
|
useNotificationStream,
|
|
21
22
|
useNotifications,
|
|
23
|
+
useOptionalNotificationContext,
|
|
22
24
|
usePreferences,
|
|
23
25
|
useRestoreTemplateDefault,
|
|
24
26
|
useTemplateEditor,
|
|
@@ -27,7 +29,7 @@ import {
|
|
|
27
29
|
useUnreadCount,
|
|
28
30
|
useUpdatePreferences,
|
|
29
31
|
useUpsertTemplate
|
|
30
|
-
} from "./chunk-
|
|
32
|
+
} from "./chunk-7A6A4MNA.js";
|
|
31
33
|
|
|
32
34
|
// src/components/NotificationBell.tsx
|
|
33
35
|
import { Bell } from "lucide-react";
|
|
@@ -68,14 +70,16 @@ import { CheckCheck, Inbox, RotateCw } from "lucide-react";
|
|
|
68
70
|
import clsx3 from "clsx";
|
|
69
71
|
|
|
70
72
|
// src/components/NotificationItem.tsx
|
|
71
|
-
import { Check, Trash2 } from "lucide-react";
|
|
73
|
+
import { Calendar, Check, Trash2 } from "lucide-react";
|
|
72
74
|
import clsx2 from "clsx";
|
|
75
|
+
import { extractCalendarEvent, generateGoogleCalendarUrl } from "@adatechnology/notification-contracts";
|
|
73
76
|
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
74
77
|
function NotificationItem({ notification, onSelect, className }) {
|
|
75
78
|
const { locale, messages } = useNotificationContext();
|
|
76
79
|
const markAsRead = useMarkAsRead();
|
|
77
80
|
const deleteNotification = useDeleteNotification();
|
|
78
81
|
const isUnread = notification.readAt === void 0;
|
|
82
|
+
const calendarEvent = extractCalendarEvent(notification.payload);
|
|
79
83
|
function handleSelect() {
|
|
80
84
|
if (isUnread) markAsRead.mutate(notification.id);
|
|
81
85
|
onSelect?.(notification);
|
|
@@ -95,7 +99,22 @@ function NotificationItem({ notification, onSelect, className }) {
|
|
|
95
99
|
}
|
|
96
100
|
)
|
|
97
101
|
] }),
|
|
98
|
-
/* @__PURE__ */ jsx2("span", { className: "adn-item__body", children: notification.body })
|
|
102
|
+
/* @__PURE__ */ jsx2("span", { className: "adn-item__body", children: notification.body }),
|
|
103
|
+
calendarEvent ? /* @__PURE__ */ jsx2("span", { className: "adn-item__calendar-wrapper", children: /* @__PURE__ */ jsxs2(
|
|
104
|
+
"a",
|
|
105
|
+
{
|
|
106
|
+
href: generateGoogleCalendarUrl(calendarEvent),
|
|
107
|
+
target: "_blank",
|
|
108
|
+
rel: "noopener noreferrer",
|
|
109
|
+
className: "adn-item__calendar-link",
|
|
110
|
+
onClick: (e) => e.stopPropagation(),
|
|
111
|
+
title: messages["item.addToCalendar"] ?? "Adicionar \xE0 agenda",
|
|
112
|
+
children: [
|
|
113
|
+
/* @__PURE__ */ jsx2(Calendar, { size: 12, "aria-hidden": "true" }),
|
|
114
|
+
/* @__PURE__ */ jsx2("span", { children: messages["item.addToCalendar"] ?? "Adicionar \xE0 agenda" })
|
|
115
|
+
]
|
|
116
|
+
}
|
|
117
|
+
) }) : null
|
|
99
118
|
] }),
|
|
100
119
|
/* @__PURE__ */ jsxs2("div", { className: "adn-item__actions", children: [
|
|
101
120
|
isUnread ? /* @__PURE__ */ jsx2(
|
|
@@ -261,8 +280,154 @@ function PreferencesPanel({ className }) {
|
|
|
261
280
|
] });
|
|
262
281
|
}
|
|
263
282
|
|
|
264
|
-
// src/components/
|
|
283
|
+
// src/components/NotificationPermissionBanner.tsx
|
|
284
|
+
import { Bell as Bell2, BellOff, BellRing, X } from "lucide-react";
|
|
285
|
+
import clsx5 from "clsx";
|
|
265
286
|
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
287
|
+
function NotificationPermissionBanner({
|
|
288
|
+
vapidPublicKey,
|
|
289
|
+
storageKey,
|
|
290
|
+
showWhenGranted = false,
|
|
291
|
+
showWhenDenied = true,
|
|
292
|
+
onSubscribe,
|
|
293
|
+
onUnsubscribe,
|
|
294
|
+
onDismiss,
|
|
295
|
+
className
|
|
296
|
+
}) {
|
|
297
|
+
const context = useOptionalNotificationContext();
|
|
298
|
+
const messages = context?.messages ?? resolveMessages(DEFAULT_LOCALE);
|
|
299
|
+
const theme = context?.theme ?? {};
|
|
300
|
+
const {
|
|
301
|
+
permission,
|
|
302
|
+
isSupported,
|
|
303
|
+
isDismissed,
|
|
304
|
+
isPending,
|
|
305
|
+
requestPermission,
|
|
306
|
+
disableNotifications,
|
|
307
|
+
dismiss
|
|
308
|
+
} = useNotificationPermission({
|
|
309
|
+
vapidPublicKey,
|
|
310
|
+
storageKey,
|
|
311
|
+
onSubscribe,
|
|
312
|
+
onUnsubscribe
|
|
313
|
+
});
|
|
314
|
+
if (!isSupported) {
|
|
315
|
+
return null;
|
|
316
|
+
}
|
|
317
|
+
const handleDismiss = () => {
|
|
318
|
+
dismiss();
|
|
319
|
+
onDismiss?.();
|
|
320
|
+
};
|
|
321
|
+
if (permission === "default") {
|
|
322
|
+
if (isDismissed) return null;
|
|
323
|
+
return /* @__PURE__ */ jsxs5(
|
|
324
|
+
"aside",
|
|
325
|
+
{
|
|
326
|
+
className: clsx5("adn-permission-banner adn-permission-banner--prompt", theme.rootClassName, className),
|
|
327
|
+
role: "region",
|
|
328
|
+
"aria-label": messages["banner.title"],
|
|
329
|
+
children: [
|
|
330
|
+
/* @__PURE__ */ jsx5(Bell2, { className: "adn-permission-banner__icon", "aria-hidden": "true" }),
|
|
331
|
+
/* @__PURE__ */ jsxs5("div", { className: "adn-permission-banner__content", children: [
|
|
332
|
+
/* @__PURE__ */ jsx5("h3", { className: "adn-permission-banner__title", children: messages["banner.title"] }),
|
|
333
|
+
/* @__PURE__ */ jsx5("p", { className: "adn-permission-banner__description", children: messages["banner.description"] }),
|
|
334
|
+
/* @__PURE__ */ jsxs5("div", { className: "adn-permission-banner__actions", children: [
|
|
335
|
+
/* @__PURE__ */ jsx5(
|
|
336
|
+
"button",
|
|
337
|
+
{
|
|
338
|
+
type: "button",
|
|
339
|
+
className: "adn-permission-banner__allow-button",
|
|
340
|
+
onClick: () => void requestPermission(),
|
|
341
|
+
disabled: isPending,
|
|
342
|
+
children: messages["banner.allow"]
|
|
343
|
+
}
|
|
344
|
+
),
|
|
345
|
+
/* @__PURE__ */ jsx5(
|
|
346
|
+
"button",
|
|
347
|
+
{
|
|
348
|
+
type: "button",
|
|
349
|
+
className: "adn-permission-banner__dismiss-button",
|
|
350
|
+
onClick: handleDismiss,
|
|
351
|
+
children: messages["banner.dismiss"]
|
|
352
|
+
}
|
|
353
|
+
)
|
|
354
|
+
] })
|
|
355
|
+
] }),
|
|
356
|
+
/* @__PURE__ */ jsx5(
|
|
357
|
+
"button",
|
|
358
|
+
{
|
|
359
|
+
type: "button",
|
|
360
|
+
className: "adn-permission-banner__close-button",
|
|
361
|
+
onClick: handleDismiss,
|
|
362
|
+
"aria-label": messages["banner.dismiss"],
|
|
363
|
+
children: /* @__PURE__ */ jsx5(X, { className: "adn-permission-banner__close-icon", "aria-hidden": "true" })
|
|
364
|
+
}
|
|
365
|
+
)
|
|
366
|
+
]
|
|
367
|
+
}
|
|
368
|
+
);
|
|
369
|
+
}
|
|
370
|
+
if (permission === "granted") {
|
|
371
|
+
if (!showWhenGranted) return null;
|
|
372
|
+
return /* @__PURE__ */ jsxs5(
|
|
373
|
+
"aside",
|
|
374
|
+
{
|
|
375
|
+
className: clsx5("adn-permission-banner adn-permission-banner--granted", theme.rootClassName, className),
|
|
376
|
+
role: "region",
|
|
377
|
+
"aria-label": messages["banner.activeTitle"],
|
|
378
|
+
children: [
|
|
379
|
+
/* @__PURE__ */ jsx5(BellRing, { className: "adn-permission-banner__icon", "aria-hidden": "true" }),
|
|
380
|
+
/* @__PURE__ */ jsxs5("div", { className: "adn-permission-banner__content", children: [
|
|
381
|
+
/* @__PURE__ */ jsx5("h3", { className: "adn-permission-banner__title", children: messages["banner.activeTitle"] }),
|
|
382
|
+
/* @__PURE__ */ jsx5("p", { className: "adn-permission-banner__description", children: messages["banner.activeDescription"] }),
|
|
383
|
+
/* @__PURE__ */ jsx5("div", { className: "adn-permission-banner__actions", children: /* @__PURE__ */ jsx5(
|
|
384
|
+
"button",
|
|
385
|
+
{
|
|
386
|
+
type: "button",
|
|
387
|
+
className: "adn-permission-banner__disable-button",
|
|
388
|
+
onClick: () => void disableNotifications(),
|
|
389
|
+
disabled: isPending,
|
|
390
|
+
children: isPending ? messages["banner.disabling"] : messages["banner.disable"]
|
|
391
|
+
}
|
|
392
|
+
) })
|
|
393
|
+
] })
|
|
394
|
+
]
|
|
395
|
+
}
|
|
396
|
+
);
|
|
397
|
+
}
|
|
398
|
+
if (permission === "denied") {
|
|
399
|
+
if (!showWhenDenied || isDismissed) return null;
|
|
400
|
+
return /* @__PURE__ */ jsxs5(
|
|
401
|
+
"aside",
|
|
402
|
+
{
|
|
403
|
+
className: clsx5("adn-permission-banner adn-permission-banner--denied", theme.rootClassName, className),
|
|
404
|
+
role: "alert",
|
|
405
|
+
"aria-label": messages["banner.deniedTitle"],
|
|
406
|
+
children: [
|
|
407
|
+
/* @__PURE__ */ jsx5(BellOff, { className: "adn-permission-banner__icon", "aria-hidden": "true" }),
|
|
408
|
+
/* @__PURE__ */ jsxs5("div", { className: "adn-permission-banner__content", children: [
|
|
409
|
+
/* @__PURE__ */ jsx5("h3", { className: "adn-permission-banner__title", children: messages["banner.deniedTitle"] }),
|
|
410
|
+
/* @__PURE__ */ jsx5("p", { className: "adn-permission-banner__description", children: messages["banner.deniedDescription"] })
|
|
411
|
+
] }),
|
|
412
|
+
/* @__PURE__ */ jsx5(
|
|
413
|
+
"button",
|
|
414
|
+
{
|
|
415
|
+
type: "button",
|
|
416
|
+
className: "adn-permission-banner__close-button",
|
|
417
|
+
onClick: handleDismiss,
|
|
418
|
+
"aria-label": messages["banner.dismiss"],
|
|
419
|
+
children: /* @__PURE__ */ jsx5(X, { className: "adn-permission-banner__close-icon", "aria-hidden": "true" })
|
|
420
|
+
}
|
|
421
|
+
)
|
|
422
|
+
]
|
|
423
|
+
}
|
|
424
|
+
);
|
|
425
|
+
}
|
|
426
|
+
return null;
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
// src/components/NotificationsWorkspace.tsx
|
|
430
|
+
import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
266
431
|
function NotificationsWorkspace({
|
|
267
432
|
labels: labelsOverride,
|
|
268
433
|
category,
|
|
@@ -277,20 +442,20 @@ function NotificationsWorkspace({
|
|
|
277
442
|
}) {
|
|
278
443
|
const { messages } = useNotificationContext();
|
|
279
444
|
const label = (key) => labelsOverride?.[key] ?? messages[key] ?? key;
|
|
280
|
-
return /* @__PURE__ */
|
|
281
|
-
renderHeader ? renderHeader() : /* @__PURE__ */
|
|
282
|
-
/* @__PURE__ */
|
|
283
|
-
/* @__PURE__ */
|
|
284
|
-
/* @__PURE__ */
|
|
445
|
+
return /* @__PURE__ */ jsxs6("div", { className: `adn-workspace ${className ?? ""}`, children: [
|
|
446
|
+
renderHeader ? renderHeader() : /* @__PURE__ */ jsxs6("header", { className: "adn-workspace__header", children: [
|
|
447
|
+
/* @__PURE__ */ jsxs6("div", { children: [
|
|
448
|
+
/* @__PURE__ */ jsx6("h1", { className: "adn-workspace__title", children: label("workspace.title") }),
|
|
449
|
+
/* @__PURE__ */ jsx6("p", { className: "adn-workspace__description", children: label("workspace.description") })
|
|
285
450
|
] }),
|
|
286
|
-
/* @__PURE__ */
|
|
451
|
+
/* @__PURE__ */ jsxs6("div", { className: "adn-workspace__actions", children: [
|
|
287
452
|
renderHeaderActions?.(),
|
|
288
|
-
settingsHref && /* @__PURE__ */
|
|
453
|
+
settingsHref && /* @__PURE__ */ jsx6("a", { href: settingsHref, className: "adn-button adn-button--outline", children: label("workspace.settingsLink") })
|
|
289
454
|
] })
|
|
290
455
|
] }),
|
|
291
456
|
renderAboveList?.(),
|
|
292
|
-
/* @__PURE__ */
|
|
293
|
-
/* @__PURE__ */
|
|
457
|
+
/* @__PURE__ */ jsxs6("div", { className: showPreferences ? "adn-workspace__grid" : "adn-workspace__grid--single", children: [
|
|
458
|
+
/* @__PURE__ */ jsx6("section", { className: "adn-workspace__inbox", children: /* @__PURE__ */ jsx6(
|
|
294
459
|
NotificationList,
|
|
295
460
|
{
|
|
296
461
|
...category ? { category } : {},
|
|
@@ -298,13 +463,13 @@ function NotificationsWorkspace({
|
|
|
298
463
|
...renderEmpty ? { renderEmpty } : {}
|
|
299
464
|
}
|
|
300
465
|
) }),
|
|
301
|
-
showPreferences && /* @__PURE__ */
|
|
466
|
+
showPreferences && /* @__PURE__ */ jsx6("aside", { className: "adn-workspace__aside", children: /* @__PURE__ */ jsx6(PreferencesPanel, {}) })
|
|
302
467
|
] })
|
|
303
468
|
] });
|
|
304
469
|
}
|
|
305
470
|
|
|
306
471
|
// src/components/NotificationSettingsWorkspace.tsx
|
|
307
|
-
import { Plus, Trash2 as Trash22, X } from "lucide-react";
|
|
472
|
+
import { Plus, Trash2 as Trash22, X as X2 } from "lucide-react";
|
|
308
473
|
import { useState as useState4 } from "react";
|
|
309
474
|
|
|
310
475
|
// src/components/HtmlCodeField.tsx
|
|
@@ -364,7 +529,7 @@ function push(tokens, kind, text) {
|
|
|
364
529
|
}
|
|
365
530
|
|
|
366
531
|
// src/components/HtmlCodeField.tsx
|
|
367
|
-
import { jsx as
|
|
532
|
+
import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
368
533
|
function HtmlCodeField({ value, rows = 12, onChange, onSelect, onFocus, problems }) {
|
|
369
534
|
const highlightRef = useRef(null);
|
|
370
535
|
function handleScroll(event) {
|
|
@@ -374,15 +539,15 @@ function HtmlCodeField({ value, rows = 12, onChange, onSelect, onFocus, problems
|
|
|
374
539
|
pre.scrollLeft = event.currentTarget.scrollLeft;
|
|
375
540
|
}
|
|
376
541
|
const lineCount = value.split("\n").length;
|
|
377
|
-
return /* @__PURE__ */
|
|
378
|
-
/* @__PURE__ */
|
|
379
|
-
/* @__PURE__ */
|
|
380
|
-
/* @__PURE__ */
|
|
381
|
-
/* @__PURE__ */
|
|
382
|
-
tokenizeHtml(value).map((token, index) => /* @__PURE__ */
|
|
542
|
+
return /* @__PURE__ */ jsxs7("div", { className: "adn-code", children: [
|
|
543
|
+
/* @__PURE__ */ jsxs7("div", { className: "adn-code__editor", children: [
|
|
544
|
+
/* @__PURE__ */ jsx7("div", { className: "adn-code__gutter", "aria-hidden": "true", children: Array.from({ length: lineCount }, (_, index) => /* @__PURE__ */ jsx7("span", { children: index + 1 }, index)) }),
|
|
545
|
+
/* @__PURE__ */ jsxs7("div", { className: "adn-code__surface", children: [
|
|
546
|
+
/* @__PURE__ */ jsxs7("pre", { ref: highlightRef, className: "adn-code__highlight", "aria-hidden": "true", children: [
|
|
547
|
+
tokenizeHtml(value).map((token, index) => /* @__PURE__ */ jsx7("span", { className: `adn-code__token adn-code__token--${token.kind}`, children: token.text }, index)),
|
|
383
548
|
"\n"
|
|
384
549
|
] }),
|
|
385
|
-
/* @__PURE__ */
|
|
550
|
+
/* @__PURE__ */ jsx7(
|
|
386
551
|
"textarea",
|
|
387
552
|
{
|
|
388
553
|
className: "adn-code__input",
|
|
@@ -397,7 +562,7 @@ function HtmlCodeField({ value, rows = 12, onChange, onSelect, onFocus, problems
|
|
|
397
562
|
)
|
|
398
563
|
] })
|
|
399
564
|
] }),
|
|
400
|
-
problems && problems.length > 0 && /* @__PURE__ */
|
|
565
|
+
problems && problems.length > 0 && /* @__PURE__ */ jsx7("ul", { className: "adn-settings__email-report", children: problems.map((problem) => /* @__PURE__ */ jsx7(
|
|
401
566
|
"li",
|
|
402
567
|
{
|
|
403
568
|
className: `adn-settings__email-problem adn-settings__email-problem--${problem.severity}`,
|
|
@@ -504,17 +669,17 @@ var MESSAGE_EMOJI = [
|
|
|
504
669
|
];
|
|
505
670
|
|
|
506
671
|
// src/components/MessageToolbar.tsx
|
|
507
|
-
import { jsx as
|
|
672
|
+
import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
508
673
|
var FORMAT_ICON = {
|
|
509
|
-
[MESSAGE_FORMAT.BOLD]: /* @__PURE__ */
|
|
510
|
-
[MESSAGE_FORMAT.ITALIC]: /* @__PURE__ */
|
|
511
|
-
[MESSAGE_FORMAT.STRIKETHROUGH]: /* @__PURE__ */
|
|
512
|
-
[MESSAGE_FORMAT.MONOSPACE]: /* @__PURE__ */
|
|
674
|
+
[MESSAGE_FORMAT.BOLD]: /* @__PURE__ */ jsx8(Bold, { "aria-hidden": "true", className: "adn-settings__button-icon" }),
|
|
675
|
+
[MESSAGE_FORMAT.ITALIC]: /* @__PURE__ */ jsx8(Italic, { "aria-hidden": "true", className: "adn-settings__button-icon" }),
|
|
676
|
+
[MESSAGE_FORMAT.STRIKETHROUGH]: /* @__PURE__ */ jsx8(Strikethrough, { "aria-hidden": "true", className: "adn-settings__button-icon" }),
|
|
677
|
+
[MESSAGE_FORMAT.MONOSPACE]: /* @__PURE__ */ jsx8(Code, { "aria-hidden": "true", className: "adn-settings__button-icon" })
|
|
513
678
|
};
|
|
514
679
|
function MessageToolbar({ onMark, onInsert, labelOf }) {
|
|
515
680
|
const [isEmojiOpen, setIsEmojiOpen] = useState2(false);
|
|
516
|
-
return /* @__PURE__ */
|
|
517
|
-
MESSAGE_FORMAT_MARKS.map(({ format, delimiter }) => /* @__PURE__ */
|
|
681
|
+
return /* @__PURE__ */ jsxs8("div", { className: "adn-toolbar", children: [
|
|
682
|
+
MESSAGE_FORMAT_MARKS.map(({ format, delimiter }) => /* @__PURE__ */ jsx8(
|
|
518
683
|
"button",
|
|
519
684
|
{
|
|
520
685
|
type: "button",
|
|
@@ -529,9 +694,9 @@ function MessageToolbar({ onMark, onInsert, labelOf }) {
|
|
|
529
694
|
},
|
|
530
695
|
format
|
|
531
696
|
)),
|
|
532
|
-
/* @__PURE__ */
|
|
533
|
-
/* @__PURE__ */
|
|
534
|
-
/* @__PURE__ */
|
|
697
|
+
/* @__PURE__ */ jsx8("span", { className: "adn-toolbar__divider", "aria-hidden": "true" }),
|
|
698
|
+
/* @__PURE__ */ jsxs8("div", { className: "adn-toolbar__emoji", children: [
|
|
699
|
+
/* @__PURE__ */ jsx8(
|
|
535
700
|
"button",
|
|
536
701
|
{
|
|
537
702
|
type: "button",
|
|
@@ -543,10 +708,10 @@ function MessageToolbar({ onMark, onInsert, labelOf }) {
|
|
|
543
708
|
event.preventDefault();
|
|
544
709
|
setIsEmojiOpen((current) => !current);
|
|
545
710
|
},
|
|
546
|
-
children: /* @__PURE__ */
|
|
711
|
+
children: /* @__PURE__ */ jsx8(Smile, { "aria-hidden": "true", className: "adn-settings__button-icon" })
|
|
547
712
|
}
|
|
548
713
|
),
|
|
549
|
-
isEmojiOpen && /* @__PURE__ */
|
|
714
|
+
isEmojiOpen && /* @__PURE__ */ jsx8("div", { className: "adn-toolbar__palette", role: "group", "aria-label": labelOf("toolbar.emoji"), children: MESSAGE_EMOJI.map((emoji) => /* @__PURE__ */ jsx8(
|
|
550
715
|
"button",
|
|
551
716
|
{
|
|
552
717
|
type: "button",
|
|
@@ -565,7 +730,7 @@ function MessageToolbar({ onMark, onInsert, labelOf }) {
|
|
|
565
730
|
}
|
|
566
731
|
|
|
567
732
|
// src/components/MessageBodyField.tsx
|
|
568
|
-
import { jsx as
|
|
733
|
+
import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
569
734
|
function MessageBodyField({ value, rows = 5, onChange, onSelect, onFocus, labelOf }) {
|
|
570
735
|
const textareaRef = useRef2(null);
|
|
571
736
|
const [pendingSelection, setPendingSelection] = useState3();
|
|
@@ -594,9 +759,9 @@ function MessageBodyField({ value, rows = 5, onChange, onSelect, onFocus, labelO
|
|
|
594
759
|
onChange(result.text);
|
|
595
760
|
setPendingSelection([result.selectionStart, result.selectionEnd]);
|
|
596
761
|
}
|
|
597
|
-
return /* @__PURE__ */
|
|
598
|
-
/* @__PURE__ */
|
|
599
|
-
/* @__PURE__ */
|
|
762
|
+
return /* @__PURE__ */ jsxs9("div", { className: "adn-message-field", children: [
|
|
763
|
+
/* @__PURE__ */ jsx9(MessageToolbar, { onMark: handleMark, onInsert: handleInsert, labelOf }),
|
|
764
|
+
/* @__PURE__ */ jsx9(
|
|
600
765
|
"textarea",
|
|
601
766
|
{
|
|
602
767
|
ref: textareaRef,
|
|
@@ -612,23 +777,23 @@ function MessageBodyField({ value, rows = 5, onChange, onSelect, onFocus, labelO
|
|
|
612
777
|
|
|
613
778
|
// src/components/TemplatePreview.tsx
|
|
614
779
|
import { parseWhatsAppFormatting } from "@adatechnology/conversations-ui";
|
|
615
|
-
import { jsx as
|
|
780
|
+
import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
616
781
|
function StatusIcons() {
|
|
617
|
-
return /* @__PURE__ */
|
|
618
|
-
/* @__PURE__ */
|
|
619
|
-
/* @__PURE__ */
|
|
620
|
-
/* @__PURE__ */
|
|
621
|
-
/* @__PURE__ */
|
|
622
|
-
/* @__PURE__ */
|
|
782
|
+
return /* @__PURE__ */ jsxs10("span", { className: "adn-preview-status__icons", children: [
|
|
783
|
+
/* @__PURE__ */ jsxs10("svg", { width: "15", height: "10", viewBox: "0 0 15 10", "aria-hidden": "true", children: [
|
|
784
|
+
/* @__PURE__ */ jsx10("rect", { x: "0", y: "6", width: "2.5", height: "4", rx: "0.6", fill: "currentColor" }),
|
|
785
|
+
/* @__PURE__ */ jsx10("rect", { x: "4", y: "4", width: "2.5", height: "6", rx: "0.6", fill: "currentColor" }),
|
|
786
|
+
/* @__PURE__ */ jsx10("rect", { x: "8", y: "2", width: "2.5", height: "8", rx: "0.6", fill: "currentColor" }),
|
|
787
|
+
/* @__PURE__ */ jsx10("rect", { x: "12", y: "0", width: "2.5", height: "10", rx: "0.6", fill: "currentColor" })
|
|
623
788
|
] }),
|
|
624
|
-
/* @__PURE__ */
|
|
625
|
-
/* @__PURE__ */
|
|
626
|
-
/* @__PURE__ */
|
|
789
|
+
/* @__PURE__ */ jsxs10("svg", { width: "13", height: "10", viewBox: "0 0 13 10", "aria-hidden": "true", children: [
|
|
790
|
+
/* @__PURE__ */ jsx10("path", { d: "M6.5 9.2 1 3.6a7.8 7.8 0 0 1 11 0Z", fill: "none", stroke: "currentColor", strokeWidth: "1.3" }),
|
|
791
|
+
/* @__PURE__ */ jsx10("circle", { cx: "6.5", cy: "8", r: "1", fill: "currentColor" })
|
|
627
792
|
] }),
|
|
628
|
-
/* @__PURE__ */
|
|
629
|
-
/* @__PURE__ */
|
|
630
|
-
/* @__PURE__ */
|
|
631
|
-
/* @__PURE__ */
|
|
793
|
+
/* @__PURE__ */ jsxs10("svg", { width: "20", height: "10", viewBox: "0 0 20 10", "aria-hidden": "true", children: [
|
|
794
|
+
/* @__PURE__ */ jsx10("rect", { x: "0.5", y: "0.5", width: "16", height: "9", rx: "2.5", fill: "none", stroke: "currentColor", opacity: "0.5" }),
|
|
795
|
+
/* @__PURE__ */ jsx10("rect", { x: "2", y: "2", width: "11", height: "6", rx: "1.2", fill: "currentColor" }),
|
|
796
|
+
/* @__PURE__ */ jsx10("rect", { x: "18", y: "3.5", width: "1.6", height: "3", rx: "0.8", fill: "currentColor", opacity: "0.5" })
|
|
632
797
|
] })
|
|
633
798
|
] });
|
|
634
799
|
}
|
|
@@ -636,24 +801,24 @@ function Phone({ children, os, tone, time }) {
|
|
|
636
801
|
const android = os === "android";
|
|
637
802
|
const classes = ["adn-preview-phone", `adn-preview-phone--${android ? "android" : "ios"}`];
|
|
638
803
|
if (tone === "dark") classes.push("adn-preview-phone--dark");
|
|
639
|
-
return /* @__PURE__ */
|
|
640
|
-
/* @__PURE__ */
|
|
641
|
-
/* @__PURE__ */
|
|
642
|
-
/* @__PURE__ */
|
|
643
|
-
/* @__PURE__ */
|
|
644
|
-
/* @__PURE__ */
|
|
645
|
-
/* @__PURE__ */
|
|
646
|
-
/* @__PURE__ */
|
|
647
|
-
android ? /* @__PURE__ */
|
|
648
|
-
/* @__PURE__ */
|
|
804
|
+
return /* @__PURE__ */ jsxs10("div", { className: classes.join(" "), children: [
|
|
805
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__btn adn-preview-phone__btn--mute" }),
|
|
806
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__btn adn-preview-phone__btn--up" }),
|
|
807
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__btn adn-preview-phone__btn--down" }),
|
|
808
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__btn adn-preview-phone__btn--power" }),
|
|
809
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-phone__screen", children: [
|
|
810
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-status", children: [
|
|
811
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-status__time", children: time }),
|
|
812
|
+
android ? /* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__punch" }) : /* @__PURE__ */ jsx10("span", { className: "adn-preview-phone__island" }),
|
|
813
|
+
/* @__PURE__ */ jsx10(StatusIcons, {})
|
|
649
814
|
] }),
|
|
650
|
-
/* @__PURE__ */
|
|
651
|
-
/* @__PURE__ */
|
|
815
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-phone__content", children }),
|
|
816
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-phone__gesture" })
|
|
652
817
|
] })
|
|
653
818
|
] });
|
|
654
819
|
}
|
|
655
820
|
function Icon({ d, size = 16 }) {
|
|
656
|
-
return /* @__PURE__ */
|
|
821
|
+
return /* @__PURE__ */ jsx10(
|
|
657
822
|
"svg",
|
|
658
823
|
{
|
|
659
824
|
width: size,
|
|
@@ -665,7 +830,7 @@ function Icon({ d, size = 16 }) {
|
|
|
665
830
|
strokeLinecap: "round",
|
|
666
831
|
strokeLinejoin: "round",
|
|
667
832
|
"aria-hidden": "true",
|
|
668
|
-
children: /* @__PURE__ */
|
|
833
|
+
children: /* @__PURE__ */ jsx10("path", { d })
|
|
669
834
|
}
|
|
670
835
|
);
|
|
671
836
|
}
|
|
@@ -703,80 +868,80 @@ function EmailDesktop({
|
|
|
703
868
|
labels,
|
|
704
869
|
attachment
|
|
705
870
|
}) {
|
|
706
|
-
return /* @__PURE__ */
|
|
707
|
-
/* @__PURE__ */
|
|
708
|
-
/* @__PURE__ */
|
|
709
|
-
/* @__PURE__ */
|
|
710
|
-
/* @__PURE__ */
|
|
711
|
-
/* @__PURE__ */
|
|
871
|
+
return /* @__PURE__ */ jsxs10("div", { className: "adn-preview-browser", children: [
|
|
872
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-browser__bar", children: [
|
|
873
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-browser__dot" }),
|
|
874
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-browser__dot" }),
|
|
875
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-browser__dot" }),
|
|
876
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-browser__address", children: labels.address })
|
|
712
877
|
] }),
|
|
713
|
-
/* @__PURE__ */
|
|
714
|
-
/* @__PURE__ */
|
|
715
|
-
/* @__PURE__ */
|
|
716
|
-
/* @__PURE__ */
|
|
717
|
-
/* @__PURE__ */
|
|
718
|
-
/* @__PURE__ */
|
|
878
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp", children: [
|
|
879
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp__bar", children: [
|
|
880
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mailapp__menu", "aria-hidden": "true", children: [
|
|
881
|
+
/* @__PURE__ */ jsx10("span", {}),
|
|
882
|
+
/* @__PURE__ */ jsx10("span", {}),
|
|
883
|
+
/* @__PURE__ */ jsx10("span", {})
|
|
719
884
|
] }),
|
|
720
|
-
/* @__PURE__ */
|
|
721
|
-
/* @__PURE__ */
|
|
722
|
-
/* @__PURE__ */
|
|
885
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp__search", children: [
|
|
886
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.search, size: 15 }),
|
|
887
|
+
/* @__PURE__ */ jsx10("span", { children: labels.mailbox })
|
|
723
888
|
] }),
|
|
724
|
-
/* @__PURE__ */
|
|
725
|
-
/* @__PURE__ */
|
|
726
|
-
/* @__PURE__ */
|
|
727
|
-
/* @__PURE__ */
|
|
889
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mailapp__account", children: [
|
|
890
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.help, size: 15 }),
|
|
891
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.settings, size: 15 }),
|
|
892
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-avatar adn-preview-avatar--small", children: senderName.slice(0, 1) })
|
|
728
893
|
] })
|
|
729
894
|
] }),
|
|
730
|
-
/* @__PURE__ */
|
|
731
|
-
/* @__PURE__ */
|
|
732
|
-
/* @__PURE__ */
|
|
733
|
-
/* @__PURE__ */
|
|
734
|
-
/* @__PURE__ */
|
|
895
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp__split", children: [
|
|
896
|
+
/* @__PURE__ */ jsxs10("nav", { className: "adn-preview-mailapp__rail", "aria-hidden": "true", children: [
|
|
897
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__compose", children: /* @__PURE__ */ jsx10(Icon, { d: ICON.pencil, size: 16 }) }),
|
|
898
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__rail-item adn-preview-mailapp__rail-item--active", children: /* @__PURE__ */ jsx10(Icon, { d: ICON.inbox, size: 16 }) }),
|
|
899
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__rail-item", children: /* @__PURE__ */ jsx10(Icon, { d: ICON.star, size: 16 }) })
|
|
735
900
|
] }),
|
|
736
|
-
/* @__PURE__ */
|
|
737
|
-
/* @__PURE__ */
|
|
738
|
-
/* @__PURE__ */
|
|
739
|
-
/* @__PURE__ */
|
|
740
|
-
/* @__PURE__ */
|
|
741
|
-
/* @__PURE__ */
|
|
742
|
-
/* @__PURE__ */
|
|
743
|
-
/* @__PURE__ */
|
|
744
|
-
/* @__PURE__ */
|
|
745
|
-
/* @__PURE__ */
|
|
746
|
-
/* @__PURE__ */
|
|
747
|
-
/* @__PURE__ */
|
|
748
|
-
/* @__PURE__ */
|
|
749
|
-
/* @__PURE__ */
|
|
750
|
-
/* @__PURE__ */
|
|
901
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-browser__viewport", children: [
|
|
902
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp__toolbar", children: [
|
|
903
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.back }),
|
|
904
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__divider" }),
|
|
905
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.archive }),
|
|
906
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.report }),
|
|
907
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.trash }),
|
|
908
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__divider" }),
|
|
909
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.unread }),
|
|
910
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.move }),
|
|
911
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.more }),
|
|
912
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__spacer" }),
|
|
913
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__counter", children: labels.counter }),
|
|
914
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.prev, size: 14 }),
|
|
915
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.next, size: 14 })
|
|
751
916
|
] }),
|
|
752
|
-
/* @__PURE__ */
|
|
753
|
-
/* @__PURE__ */
|
|
754
|
-
/* @__PURE__ */
|
|
755
|
-
/* @__PURE__ */
|
|
756
|
-
/* @__PURE__ */
|
|
757
|
-
/* @__PURE__ */
|
|
758
|
-
/* @__PURE__ */
|
|
917
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail", children: [
|
|
918
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail__subject-row", children: [
|
|
919
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-mail__subject", children: rendered.title }),
|
|
920
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__folder", children: labels.folder }),
|
|
921
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__subject-actions", children: [
|
|
922
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.print, size: 15 }),
|
|
923
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.popout, size: 15 })
|
|
759
924
|
] })
|
|
760
925
|
] }),
|
|
761
|
-
/* @__PURE__ */
|
|
762
|
-
/* @__PURE__ */
|
|
763
|
-
/* @__PURE__ */
|
|
764
|
-
/* @__PURE__ */
|
|
765
|
-
/* @__PURE__ */
|
|
766
|
-
/* @__PURE__ */
|
|
767
|
-
/* @__PURE__ */
|
|
926
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail__from", children: [
|
|
927
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-avatar", children: senderName.slice(0, 1) }),
|
|
928
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__identity", children: [
|
|
929
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__sender-row", children: [
|
|
930
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__sender", children: senderName }),
|
|
931
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__address", children: labels.senderAddress }),
|
|
932
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__unsubscribe", children: labels.unsubscribe })
|
|
768
933
|
] }),
|
|
769
|
-
/* @__PURE__ */
|
|
934
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__to", children: labels.to })
|
|
770
935
|
] }),
|
|
771
|
-
/* @__PURE__ */
|
|
772
|
-
/* @__PURE__ */
|
|
773
|
-
/* @__PURE__ */
|
|
774
|
-
/* @__PURE__ */
|
|
775
|
-
/* @__PURE__ */
|
|
936
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__from-actions", children: [
|
|
937
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__time", children: labels.now }),
|
|
938
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.star, size: 15 }),
|
|
939
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.reply, size: 15 }),
|
|
940
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.more, size: 15 })
|
|
776
941
|
] })
|
|
777
942
|
] }),
|
|
778
|
-
/* @__PURE__ */
|
|
779
|
-
attachment ? /* @__PURE__ */
|
|
943
|
+
/* @__PURE__ */ jsx10(MailBody, { html: emailHtml, text: rendered.body }),
|
|
944
|
+
attachment ? /* @__PURE__ */ jsx10(AttachmentCard, { attachment, block: "adn-preview-attachment--mail" }) : null
|
|
780
945
|
] })
|
|
781
946
|
] })
|
|
782
947
|
] })
|
|
@@ -791,45 +956,45 @@ function EmailMobile({
|
|
|
791
956
|
labels,
|
|
792
957
|
attachment
|
|
793
958
|
}) {
|
|
794
|
-
return /* @__PURE__ */
|
|
795
|
-
/* @__PURE__ */
|
|
796
|
-
/* @__PURE__ */
|
|
797
|
-
/* @__PURE__ */
|
|
798
|
-
/* @__PURE__ */
|
|
799
|
-
/* @__PURE__ */
|
|
800
|
-
/* @__PURE__ */
|
|
801
|
-
/* @__PURE__ */
|
|
959
|
+
return /* @__PURE__ */ jsxs10(Phone, { os, time: labels.time, children: [
|
|
960
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mailapp__actions", children: [
|
|
961
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.back, size: 18 }),
|
|
962
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mailapp__spacer" }),
|
|
963
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.archive, size: 18 }),
|
|
964
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.trash, size: 18 }),
|
|
965
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.unread, size: 18 }),
|
|
966
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.more, size: 18 })
|
|
802
967
|
] }),
|
|
803
|
-
/* @__PURE__ */
|
|
804
|
-
/* @__PURE__ */
|
|
805
|
-
/* @__PURE__ */
|
|
806
|
-
/* @__PURE__ */
|
|
807
|
-
/* @__PURE__ */
|
|
808
|
-
/* @__PURE__ */
|
|
809
|
-
/* @__PURE__ */
|
|
810
|
-
/* @__PURE__ */
|
|
811
|
-
/* @__PURE__ */
|
|
968
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-mailapp__scroll", children: /* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail adn-preview-mail--compact", children: [
|
|
969
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-mail__subject-row", children: /* @__PURE__ */ jsx10("div", { className: "adn-preview-mail__subject", children: rendered.title }) }),
|
|
970
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__folder", children: labels.folder }),
|
|
971
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail__from adn-preview-mail__from--mobile", children: [
|
|
972
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-avatar adn-preview-avatar--large", children: senderName.slice(0, 1) }),
|
|
973
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__identity", children: [
|
|
974
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__sender-row", children: [
|
|
975
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__sender", children: senderName }),
|
|
976
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__time", children: labels.now })
|
|
812
977
|
] }),
|
|
813
|
-
/* @__PURE__ */
|
|
978
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__recipients", children: [
|
|
814
979
|
labels.to,
|
|
815
|
-
/* @__PURE__ */
|
|
980
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.chevron, size: 12 })
|
|
816
981
|
] })
|
|
817
982
|
] }),
|
|
818
|
-
/* @__PURE__ */
|
|
983
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-mail__from-actions", children: /* @__PURE__ */ jsx10(Icon, { d: ICON.star, size: 17 }) })
|
|
819
984
|
] }),
|
|
820
|
-
/* @__PURE__ */
|
|
821
|
-
attachment ? /* @__PURE__ */
|
|
822
|
-
/* @__PURE__ */
|
|
823
|
-
/* @__PURE__ */
|
|
824
|
-
/* @__PURE__ */
|
|
985
|
+
/* @__PURE__ */ jsx10(MailBody, { html: emailHtml, text: rendered.body }),
|
|
986
|
+
attachment ? /* @__PURE__ */ jsx10(AttachmentCard, { attachment, block: "adn-preview-attachment--mail" }) : null,
|
|
987
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-mail__reply", children: [
|
|
988
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__reply-button", children: [
|
|
989
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.reply, size: 14 }),
|
|
825
990
|
labels.reply
|
|
826
991
|
] }),
|
|
827
|
-
/* @__PURE__ */
|
|
828
|
-
/* @__PURE__ */
|
|
992
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__reply-button", children: [
|
|
993
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.replyAll, size: 14 }),
|
|
829
994
|
labels.replyAll
|
|
830
995
|
] }),
|
|
831
|
-
/* @__PURE__ */
|
|
832
|
-
/* @__PURE__ */
|
|
996
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-mail__reply-button", children: [
|
|
997
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.forward, size: 14 }),
|
|
833
998
|
labels.forward
|
|
834
999
|
] })
|
|
835
1000
|
] })
|
|
@@ -843,31 +1008,31 @@ function WhatsAppPreview({
|
|
|
843
1008
|
senderName,
|
|
844
1009
|
attachment
|
|
845
1010
|
}) {
|
|
846
|
-
return /* @__PURE__ */
|
|
847
|
-
/* @__PURE__ */
|
|
848
|
-
/* @__PURE__ */
|
|
849
|
-
/* @__PURE__ */
|
|
850
|
-
/* @__PURE__ */
|
|
851
|
-
/* @__PURE__ */
|
|
852
|
-
/* @__PURE__ */
|
|
1011
|
+
return /* @__PURE__ */ jsxs10(Phone, { os, time: labels.time, children: [
|
|
1012
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-wa__header", children: [
|
|
1013
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.back, size: 18 }),
|
|
1014
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-wa__avatar", children: senderName.slice(0, 1) }),
|
|
1015
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-wa__contact", children: [
|
|
1016
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-wa__name", children: senderName }),
|
|
1017
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-wa__status", children: labels.online })
|
|
853
1018
|
] }),
|
|
854
|
-
/* @__PURE__ */
|
|
855
|
-
/* @__PURE__ */
|
|
856
|
-
/* @__PURE__ */
|
|
857
|
-
/* @__PURE__ */
|
|
1019
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-wa__header-actions", children: [
|
|
1020
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.video, size: 17 }),
|
|
1021
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.call, size: 17 }),
|
|
1022
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.more, size: 17 })
|
|
858
1023
|
] })
|
|
859
1024
|
] }),
|
|
860
|
-
/* @__PURE__ */
|
|
861
|
-
/* @__PURE__ */
|
|
862
|
-
/* @__PURE__ */
|
|
863
|
-
attachment ? /* @__PURE__ */
|
|
864
|
-
/* @__PURE__ */
|
|
865
|
-
/* @__PURE__ */
|
|
1025
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-wa", children: [
|
|
1026
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-wa__day", children: labels.today }),
|
|
1027
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-wa__bubble", children: [
|
|
1028
|
+
attachment ? /* @__PURE__ */ jsx10(AttachmentCard, { attachment, block: "adn-preview-attachment--wa" }) : null,
|
|
1029
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-wa__text", children: parseWhatsAppFormatting(rendered.body) }),
|
|
1030
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-wa__time", children: labels.now })
|
|
866
1031
|
] })
|
|
867
1032
|
] }),
|
|
868
|
-
/* @__PURE__ */
|
|
869
|
-
/* @__PURE__ */
|
|
870
|
-
/* @__PURE__ */
|
|
1033
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-wa__composer", children: [
|
|
1034
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-wa__input", children: labels.compose }),
|
|
1035
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-wa__send", children: /* @__PURE__ */ jsx10(Icon, { d: ICON.mic, size: 16 }) })
|
|
871
1036
|
] })
|
|
872
1037
|
] });
|
|
873
1038
|
}
|
|
@@ -876,7 +1041,7 @@ function SmsPreview({
|
|
|
876
1041
|
os,
|
|
877
1042
|
labels
|
|
878
1043
|
}) {
|
|
879
|
-
return /* @__PURE__ */
|
|
1044
|
+
return /* @__PURE__ */ jsx10(Phone, { os, time: labels.time, children: /* @__PURE__ */ jsx10("div", { className: "adn-preview-sms", children: /* @__PURE__ */ jsx10("div", { className: "adn-preview-sms__bubble", children: rendered.body }) }) });
|
|
880
1045
|
}
|
|
881
1046
|
function PushPreview({
|
|
882
1047
|
rendered,
|
|
@@ -884,37 +1049,37 @@ function PushPreview({
|
|
|
884
1049
|
labels,
|
|
885
1050
|
os
|
|
886
1051
|
}) {
|
|
887
|
-
return /* @__PURE__ */
|
|
888
|
-
/* @__PURE__ */
|
|
889
|
-
/* @__PURE__ */
|
|
890
|
-
/* @__PURE__ */
|
|
891
|
-
/* @__PURE__ */
|
|
1052
|
+
return /* @__PURE__ */ jsx10(Phone, { os, tone: "dark", time: labels.time, children: /* @__PURE__ */ jsx10("div", { className: "adn-preview-push", children: /* @__PURE__ */ jsxs10("div", { className: "adn-preview-push__card", children: [
|
|
1053
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-push__app", children: [
|
|
1054
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-avatar adn-preview-avatar--small", children: senderName.slice(0, 1) }),
|
|
1055
|
+
/* @__PURE__ */ jsx10("span", { children: senderName }),
|
|
1056
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-push__time", children: labels.now })
|
|
892
1057
|
] }),
|
|
893
|
-
/* @__PURE__ */
|
|
894
|
-
/* @__PURE__ */
|
|
1058
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-push__title", children: rendered.title }),
|
|
1059
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-push__body", children: rendered.body })
|
|
895
1060
|
] }) }) });
|
|
896
1061
|
}
|
|
897
1062
|
function InboxPreview({ rendered }) {
|
|
898
|
-
return /* @__PURE__ */
|
|
899
|
-
/* @__PURE__ */
|
|
900
|
-
/* @__PURE__ */
|
|
901
|
-
/* @__PURE__ */
|
|
902
|
-
/* @__PURE__ */
|
|
1063
|
+
return /* @__PURE__ */ jsxs10("div", { className: "adn-preview-inbox", children: [
|
|
1064
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-inbox__dot" }),
|
|
1065
|
+
/* @__PURE__ */ jsxs10("div", { className: "adn-preview-inbox__text", children: [
|
|
1066
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-inbox__title", children: rendered.title }),
|
|
1067
|
+
/* @__PURE__ */ jsx10("div", { className: "adn-preview-inbox__body", children: rendered.body })
|
|
903
1068
|
] })
|
|
904
1069
|
] });
|
|
905
1070
|
}
|
|
906
1071
|
function AttachmentCard({ attachment, block }) {
|
|
907
|
-
return /* @__PURE__ */
|
|
908
|
-
/* @__PURE__ */
|
|
909
|
-
/* @__PURE__ */
|
|
910
|
-
/* @__PURE__ */
|
|
911
|
-
attachment.detail ? /* @__PURE__ */
|
|
1072
|
+
return /* @__PURE__ */ jsxs10("div", { className: `adn-preview-attachment ${block}`, children: [
|
|
1073
|
+
/* @__PURE__ */ jsx10(Icon, { d: ICON.file, size: 18 }),
|
|
1074
|
+
/* @__PURE__ */ jsxs10("span", { className: "adn-preview-attachment__text", children: [
|
|
1075
|
+
/* @__PURE__ */ jsx10("span", { className: "adn-preview-attachment__name", children: attachment.name }),
|
|
1076
|
+
attachment.detail ? /* @__PURE__ */ jsx10("span", { className: "adn-preview-attachment__detail", children: attachment.detail }) : null
|
|
912
1077
|
] })
|
|
913
1078
|
] });
|
|
914
1079
|
}
|
|
915
1080
|
function MailBody({ html, text }) {
|
|
916
|
-
if (!html) return /* @__PURE__ */
|
|
917
|
-
return /* @__PURE__ */
|
|
1081
|
+
if (!html) return /* @__PURE__ */ jsx10("div", { className: "adn-preview-mail__body", children: text });
|
|
1082
|
+
return /* @__PURE__ */ jsx10(
|
|
918
1083
|
"iframe",
|
|
919
1084
|
{
|
|
920
1085
|
className: "adn-preview-mail__body adn-preview-mail__frame",
|
|
@@ -935,14 +1100,14 @@ function TemplatePreview({
|
|
|
935
1100
|
}) {
|
|
936
1101
|
const sender = senderName ?? rendered.title.slice(0, 1).toUpperCase();
|
|
937
1102
|
if (channel === "whatsapp") {
|
|
938
|
-
return /* @__PURE__ */
|
|
1103
|
+
return /* @__PURE__ */ jsx10(WhatsAppPreview, { rendered, labels, os: viewport, senderName: sender, attachment });
|
|
939
1104
|
}
|
|
940
|
-
if (channel === "sms") return /* @__PURE__ */
|
|
1105
|
+
if (channel === "sms") return /* @__PURE__ */ jsx10(SmsPreview, { rendered, os: viewport, labels });
|
|
941
1106
|
if (channel === "push") {
|
|
942
|
-
return /* @__PURE__ */
|
|
1107
|
+
return /* @__PURE__ */ jsx10(PushPreview, { rendered, senderName: sender, labels, os: viewport });
|
|
943
1108
|
}
|
|
944
|
-
if (channel === "inbox") return /* @__PURE__ */
|
|
945
|
-
return viewport === "browser" ? /* @__PURE__ */
|
|
1109
|
+
if (channel === "inbox") return /* @__PURE__ */ jsx10(InboxPreview, { rendered });
|
|
1110
|
+
return viewport === "browser" ? /* @__PURE__ */ jsx10(
|
|
946
1111
|
EmailDesktop,
|
|
947
1112
|
{
|
|
948
1113
|
rendered,
|
|
@@ -951,7 +1116,7 @@ function TemplatePreview({
|
|
|
951
1116
|
labels,
|
|
952
1117
|
attachment
|
|
953
1118
|
}
|
|
954
|
-
) : /* @__PURE__ */
|
|
1119
|
+
) : /* @__PURE__ */ jsx10(
|
|
955
1120
|
EmailMobile,
|
|
956
1121
|
{
|
|
957
1122
|
rendered,
|
|
@@ -965,7 +1130,7 @@ function TemplatePreview({
|
|
|
965
1130
|
}
|
|
966
1131
|
|
|
967
1132
|
// src/components/NotificationSettingsWorkspace.tsx
|
|
968
|
-
import { Fragment as Fragment2, jsx as
|
|
1133
|
+
import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
969
1134
|
function isHtmlBody(body) {
|
|
970
1135
|
return /<\/?[a-zA-Z][\w:-]*(\s|>|\/)/.test(body);
|
|
971
1136
|
}
|
|
@@ -1027,15 +1192,15 @@ function NotificationSettingsWorkspace({
|
|
|
1027
1192
|
if (editor.sort?.field !== field) return "none";
|
|
1028
1193
|
return editor.sort.direction === SORT_DIRECTIONS.ASC ? "ascending" : "descending";
|
|
1029
1194
|
}
|
|
1030
|
-
return /* @__PURE__ */
|
|
1031
|
-
renderHeader ? renderHeader() : /* @__PURE__ */
|
|
1032
|
-
/* @__PURE__ */
|
|
1033
|
-
/* @__PURE__ */
|
|
1034
|
-
/* @__PURE__ */
|
|
1195
|
+
return /* @__PURE__ */ jsxs11("div", { className: `adn-settings ${className ?? ""}`, children: [
|
|
1196
|
+
renderHeader ? renderHeader() : /* @__PURE__ */ jsxs11("header", { className: "adn-settings__header", children: [
|
|
1197
|
+
/* @__PURE__ */ jsxs11("div", { children: [
|
|
1198
|
+
/* @__PURE__ */ jsx11("h1", { className: "adn-settings__title", children: label("settings.title") }),
|
|
1199
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__description", children: label("settings.description") })
|
|
1035
1200
|
] }),
|
|
1036
1201
|
renderHeaderActions?.()
|
|
1037
1202
|
] }),
|
|
1038
|
-
/* @__PURE__ */
|
|
1203
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__tabs", role: "tablist", children: ["messages", "routing"].map((id) => /* @__PURE__ */ jsx11(
|
|
1039
1204
|
"button",
|
|
1040
1205
|
{
|
|
1041
1206
|
type: "button",
|
|
@@ -1047,13 +1212,13 @@ function NotificationSettingsWorkspace({
|
|
|
1047
1212
|
},
|
|
1048
1213
|
id
|
|
1049
1214
|
)) }),
|
|
1050
|
-
tab === "routing" && /* @__PURE__ */
|
|
1051
|
-
/* @__PURE__ */
|
|
1052
|
-
/* @__PURE__ */
|
|
1053
|
-
categories.map((category) => /* @__PURE__ */
|
|
1054
|
-
/* @__PURE__ */
|
|
1055
|
-
/* @__PURE__ */
|
|
1056
|
-
/* @__PURE__ */
|
|
1215
|
+
tab === "routing" && /* @__PURE__ */ jsxs11("section", { className: "adn-settings__policies", children: [
|
|
1216
|
+
/* @__PURE__ */ jsx11("h2", { className: "adn-settings__section-title", children: label("settings.policiesTitle") }),
|
|
1217
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.policiesHint") }),
|
|
1218
|
+
categories.map((category) => /* @__PURE__ */ jsxs11("div", { className: "adn-settings__category", children: [
|
|
1219
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__category-title", children: category.label }),
|
|
1220
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__category-channels", children: channels.map((channel) => /* @__PURE__ */ jsxs11("label", { className: "adn-settings__toggle", children: [
|
|
1221
|
+
/* @__PURE__ */ jsx11(
|
|
1057
1222
|
"input",
|
|
1058
1223
|
{
|
|
1059
1224
|
type: "checkbox",
|
|
@@ -1061,23 +1226,23 @@ function NotificationSettingsWorkspace({
|
|
|
1061
1226
|
onChange: () => policies.toggle({ category: category.id, channel: channel.id })
|
|
1062
1227
|
}
|
|
1063
1228
|
),
|
|
1064
|
-
/* @__PURE__ */
|
|
1229
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__channel-label", children: channel.label })
|
|
1065
1230
|
] }, channel.id)) })
|
|
1066
1231
|
] }, category.id)),
|
|
1067
|
-
policies.error && /* @__PURE__ */
|
|
1068
|
-
/* @__PURE__ */
|
|
1069
|
-
/* @__PURE__ */
|
|
1070
|
-
policies.isDirty && /* @__PURE__ */
|
|
1232
|
+
policies.error && /* @__PURE__ */ jsx11("p", { className: "adn-settings__error", children: policies.error }),
|
|
1233
|
+
/* @__PURE__ */ jsxs11("div", { className: "adn-settings__actions", children: [
|
|
1234
|
+
/* @__PURE__ */ jsx11("button", { type: "button", onClick: policies.save, disabled: !policies.isDirty || policies.isSaving, children: policies.isSaving ? label("settings.saving") : label("settings.savePolicies") }),
|
|
1235
|
+
policies.isDirty && /* @__PURE__ */ jsx11("button", { type: "button", onClick: policies.reset, children: label("settings.discard") })
|
|
1071
1236
|
] })
|
|
1072
1237
|
] }),
|
|
1073
|
-
tab === "routing" && /* @__PURE__ */
|
|
1074
|
-
/* @__PURE__ */
|
|
1075
|
-
/* @__PURE__ */
|
|
1076
|
-
categories.map((category) => /* @__PURE__ */
|
|
1077
|
-
/* @__PURE__ */
|
|
1078
|
-
category.hint && /* @__PURE__ */
|
|
1079
|
-
/* @__PURE__ */
|
|
1080
|
-
/* @__PURE__ */
|
|
1238
|
+
tab === "routing" && /* @__PURE__ */ jsxs11("section", { className: "adn-settings__channels", children: [
|
|
1239
|
+
/* @__PURE__ */ jsx11("h2", { className: "adn-settings__section-title", children: label("settings.channelsTitle") }),
|
|
1240
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.channelsHint") }),
|
|
1241
|
+
categories.map((category) => /* @__PURE__ */ jsxs11("div", { className: "adn-settings__category", children: [
|
|
1242
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__category-label", children: category.label }),
|
|
1243
|
+
category.hint && /* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: category.hint }),
|
|
1244
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__channel-grid", children: channels.map((channel) => /* @__PURE__ */ jsxs11("label", { className: "adn-settings__channel", children: [
|
|
1245
|
+
/* @__PURE__ */ jsx11(
|
|
1081
1246
|
"input",
|
|
1082
1247
|
{
|
|
1083
1248
|
type: "checkbox",
|
|
@@ -1086,19 +1251,19 @@ function NotificationSettingsWorkspace({
|
|
|
1086
1251
|
onChange: () => toggle(category.id, channel.id)
|
|
1087
1252
|
}
|
|
1088
1253
|
),
|
|
1089
|
-
/* @__PURE__ */
|
|
1090
|
-
/* @__PURE__ */
|
|
1091
|
-
channel.hint && /* @__PURE__ */
|
|
1254
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
1255
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__channel-label", children: channel.label }),
|
|
1256
|
+
channel.hint && /* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: channel.hint })
|
|
1092
1257
|
] })
|
|
1093
1258
|
] }, channel.id)) })
|
|
1094
1259
|
] }, category.id))
|
|
1095
1260
|
] }),
|
|
1096
|
-
tab === "messages" && /* @__PURE__ */
|
|
1097
|
-
/* @__PURE__ */
|
|
1098
|
-
/* @__PURE__ */
|
|
1099
|
-
/* @__PURE__ */
|
|
1100
|
-
/* @__PURE__ */
|
|
1101
|
-
/* @__PURE__ */
|
|
1261
|
+
tab === "messages" && /* @__PURE__ */ jsxs11("div", { className: editor.draft ? "adn-settings__templates" : "adn-settings__templates adn-settings__templates--browsing", children: [
|
|
1262
|
+
/* @__PURE__ */ jsxs11("section", { className: "adn-settings__template-list", children: [
|
|
1263
|
+
/* @__PURE__ */ jsx11("header", { className: "adn-settings__list-header", children: /* @__PURE__ */ jsxs11("div", { className: "adn-settings__list-header-row", children: [
|
|
1264
|
+
/* @__PURE__ */ jsx11("h2", { className: "adn-settings__section-title", children: label("settings.templatesTitle") }),
|
|
1265
|
+
/* @__PURE__ */ jsxs11("div", { className: "adn-settings__list-header-actions", children: [
|
|
1266
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__view-switch", role: "group", "aria-label": label("settings.viewLabel"), children: [TEMPLATE_VIEWS.TABLE, TEMPLATE_VIEWS.LIST].map((view) => /* @__PURE__ */ jsx11(
|
|
1102
1267
|
"button",
|
|
1103
1268
|
{
|
|
1104
1269
|
type: "button",
|
|
@@ -1109,16 +1274,16 @@ function NotificationSettingsWorkspace({
|
|
|
1109
1274
|
},
|
|
1110
1275
|
view
|
|
1111
1276
|
)) }),
|
|
1112
|
-
/* @__PURE__ */
|
|
1113
|
-
/* @__PURE__ */
|
|
1277
|
+
/* @__PURE__ */ jsxs11("button", { type: "button", className: "adn-settings__new", onClick: editor.startNew, children: [
|
|
1278
|
+
/* @__PURE__ */ jsx11(Plus, { className: "adn-settings__button-icon", "aria-hidden": "true" }),
|
|
1114
1279
|
label("settings.newTemplate")
|
|
1115
1280
|
] })
|
|
1116
1281
|
] })
|
|
1117
1282
|
] }) }),
|
|
1118
|
-
/* @__PURE__ */
|
|
1119
|
-
/* @__PURE__ */
|
|
1120
|
-
/* @__PURE__ */
|
|
1121
|
-
/* @__PURE__ */
|
|
1283
|
+
/* @__PURE__ */ jsxs11("div", { className: "adn-settings__list-filters", children: [
|
|
1284
|
+
/* @__PURE__ */ jsxs11("label", { className: "adn-settings__search", children: [
|
|
1285
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__field-label adn-settings__visually-hidden", children: label("settings.searchLabel") }),
|
|
1286
|
+
/* @__PURE__ */ jsx11(
|
|
1122
1287
|
"input",
|
|
1123
1288
|
{
|
|
1124
1289
|
type: "search",
|
|
@@ -1128,7 +1293,7 @@ function NotificationSettingsWorkspace({
|
|
|
1128
1293
|
}
|
|
1129
1294
|
)
|
|
1130
1295
|
] }),
|
|
1131
|
-
editor.categories.length > 1 && /* @__PURE__ */
|
|
1296
|
+
editor.categories.length > 1 && /* @__PURE__ */ jsx11("div", { className: "adn-settings__filter-row", children: editor.categories.map((category) => /* @__PURE__ */ jsx11(
|
|
1132
1297
|
"button",
|
|
1133
1298
|
{
|
|
1134
1299
|
type: "button",
|
|
@@ -1139,7 +1304,7 @@ function NotificationSettingsWorkspace({
|
|
|
1139
1304
|
},
|
|
1140
1305
|
category
|
|
1141
1306
|
)) }),
|
|
1142
|
-
/* @__PURE__ */
|
|
1307
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__filter-row", children: channels.map((channel) => /* @__PURE__ */ jsx11(
|
|
1143
1308
|
"button",
|
|
1144
1309
|
{
|
|
1145
1310
|
type: "button",
|
|
@@ -1150,28 +1315,28 @@ function NotificationSettingsWorkspace({
|
|
|
1150
1315
|
},
|
|
1151
1316
|
channel.id
|
|
1152
1317
|
)) }),
|
|
1153
|
-
editor.hasFilters && /* @__PURE__ */
|
|
1318
|
+
editor.hasFilters && /* @__PURE__ */ jsx11("button", { type: "button", className: "adn-settings__clear", onClick: editor.clearFilters, children: label("settings.clearFilters") })
|
|
1154
1319
|
] }),
|
|
1155
|
-
editor.isLoading && /* @__PURE__ */
|
|
1156
|
-
!editor.isLoading && editor.totalCount === 0 && /* @__PURE__ */
|
|
1157
|
-
!editor.isLoading && editor.totalCount > 0 && editor.templates.length === 0 && /* @__PURE__ */
|
|
1320
|
+
editor.isLoading && /* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("list.loading") }),
|
|
1321
|
+
!editor.isLoading && editor.totalCount === 0 && /* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.templatesEmpty") }),
|
|
1322
|
+
!editor.isLoading && editor.totalCount > 0 && editor.templates.length === 0 && /* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.noResults") }),
|
|
1158
1323
|
editor.view === TEMPLATE_VIEWS.TABLE && editor.templates.length > 0 && /* `overflow-x` no contêiner: a página nunca rola na horizontal (web.md §10). */
|
|
1159
|
-
/* @__PURE__ */
|
|
1160
|
-
/* @__PURE__ */
|
|
1324
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__table-scroll", children: /* @__PURE__ */ jsxs11("table", { className: "adn-settings__table", children: [
|
|
1325
|
+
/* @__PURE__ */ jsx11("thead", { children: /* @__PURE__ */ jsx11("tr", { children: TEMPLATE_COLUMNS.map(({ labelKey, field, headerHidden }) => /* @__PURE__ */ jsx11("th", { scope: "col", "aria-sort": field ? ariaSortOf(field) : void 0, children: field ? /* @__PURE__ */ jsxs11("button", { type: "button", onClick: () => editor.toggleSort(field), children: [
|
|
1161
1326
|
label(labelKey),
|
|
1162
|
-
/* @__PURE__ */
|
|
1163
|
-
] }) : /* @__PURE__ */
|
|
1164
|
-
/* @__PURE__ */
|
|
1327
|
+
/* @__PURE__ */ jsx11("span", { "aria-hidden": "true", className: "adn-settings__sort-mark", children: sortMarkOf(field) })
|
|
1328
|
+
] }) : /* @__PURE__ */ jsx11("span", { className: headerHidden ? "adn-settings__visually-hidden" : void 0, children: label(labelKey) }) }, labelKey)) }) }),
|
|
1329
|
+
/* @__PURE__ */ jsx11("tbody", { children: editor.templates.map((template) => (
|
|
1165
1330
|
/* A linha inteira abre o template: na tabela so a celula da chave era clicavel,
|
|
1166
1331
|
e o alvo real de quem varre a lista e a linha. O botao da chave continua
|
|
1167
1332
|
existindo — e ele que recebe o foco pelo teclado. */
|
|
1168
|
-
/* @__PURE__ */
|
|
1333
|
+
/* @__PURE__ */ jsxs11(
|
|
1169
1334
|
"tr",
|
|
1170
1335
|
{
|
|
1171
1336
|
onClick: () => editor.select(template),
|
|
1172
1337
|
className: editor.selected?.id === template.id ? "adn-settings__table-row adn-settings__table-row--active" : "adn-settings__table-row",
|
|
1173
1338
|
children: [
|
|
1174
|
-
/* @__PURE__ */
|
|
1339
|
+
/* @__PURE__ */ jsx11("td", { children: /* @__PURE__ */ jsx11(
|
|
1175
1340
|
"button",
|
|
1176
1341
|
{
|
|
1177
1342
|
type: "button",
|
|
@@ -1180,16 +1345,16 @@ function NotificationSettingsWorkspace({
|
|
|
1180
1345
|
children: templateLabelOf?.(template) ?? template.key
|
|
1181
1346
|
}
|
|
1182
1347
|
) }),
|
|
1183
|
-
/* @__PURE__ */
|
|
1184
|
-
/* @__PURE__ */
|
|
1185
|
-
/* @__PURE__ */
|
|
1348
|
+
/* @__PURE__ */ jsx11("td", { className: "adn-settings__table-body", children: template.body }),
|
|
1349
|
+
/* @__PURE__ */ jsx11("td", { children: /* @__PURE__ */ jsx11("span", { className: `adn-settings__badge adn-settings__badge--${template.channel}`, children: label(`channel.${template.channel}`) }) }),
|
|
1350
|
+
/* @__PURE__ */ jsxs11("td", { className: "adn-settings__version", children: [
|
|
1186
1351
|
label("settings.version"),
|
|
1187
1352
|
template.version
|
|
1188
1353
|
] }),
|
|
1189
|
-
/* @__PURE__ */
|
|
1354
|
+
/* @__PURE__ */ jsx11("td", { children: isStandardEmailKey(template.key) ? (
|
|
1190
1355
|
/* Modelo do sistema não se remove: o servidor recusa e o envio depende dele. */
|
|
1191
|
-
/* @__PURE__ */
|
|
1192
|
-
) : /* @__PURE__ */
|
|
1356
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__badge", children: label("settings.systemTemplate") })
|
|
1357
|
+
) : /* @__PURE__ */ jsxs11(
|
|
1193
1358
|
"button",
|
|
1194
1359
|
{
|
|
1195
1360
|
type: "button",
|
|
@@ -1201,7 +1366,7 @@ function NotificationSettingsWorkspace({
|
|
|
1201
1366
|
editor.deactivate(template.id);
|
|
1202
1367
|
},
|
|
1203
1368
|
children: [
|
|
1204
|
-
/* @__PURE__ */
|
|
1369
|
+
/* @__PURE__ */ jsx11(Trash22, { className: "adn-settings__button-icon", "aria-hidden": "true" }),
|
|
1205
1370
|
label("settings.remove")
|
|
1206
1371
|
]
|
|
1207
1372
|
}
|
|
@@ -1212,32 +1377,32 @@ function NotificationSettingsWorkspace({
|
|
|
1212
1377
|
)
|
|
1213
1378
|
)) })
|
|
1214
1379
|
] }) }),
|
|
1215
|
-
editor.view === TEMPLATE_VIEWS.LIST && editor.groups.map((group) => /* @__PURE__ */
|
|
1216
|
-
/* @__PURE__ */
|
|
1380
|
+
editor.view === TEMPLATE_VIEWS.LIST && editor.groups.map((group) => /* @__PURE__ */ jsxs11("div", { className: "adn-settings__group", children: [
|
|
1381
|
+
/* @__PURE__ */ jsxs11("p", { className: "adn-settings__group-title", children: [
|
|
1217
1382
|
categoryLabelOf?.(group.category) ?? group.category,
|
|
1218
|
-
/* @__PURE__ */
|
|
1383
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__group-count", children: group.templates.length })
|
|
1219
1384
|
] }),
|
|
1220
|
-
/* @__PURE__ */
|
|
1221
|
-
/* @__PURE__ */
|
|
1385
|
+
/* @__PURE__ */ jsx11("ul", { children: group.templates.map((template) => /* @__PURE__ */ jsxs11("li", { className: "adn-settings__row", children: [
|
|
1386
|
+
/* @__PURE__ */ jsxs11(
|
|
1222
1387
|
"button",
|
|
1223
1388
|
{
|
|
1224
1389
|
type: "button",
|
|
1225
1390
|
onClick: () => editor.select(template),
|
|
1226
1391
|
className: editor.selected?.id === template.id ? "adn-settings__row--active" : void 0,
|
|
1227
1392
|
children: [
|
|
1228
|
-
/* @__PURE__ */
|
|
1229
|
-
/* @__PURE__ */
|
|
1230
|
-
/* @__PURE__ */
|
|
1393
|
+
/* @__PURE__ */ jsxs11("span", { className: "adn-settings__row-main", children: [
|
|
1394
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__row-title", children: templateLabelOf?.(template) ?? template.key }),
|
|
1395
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__row-body", children: template.body })
|
|
1231
1396
|
] }),
|
|
1232
|
-
/* @__PURE__ */
|
|
1233
|
-
/* @__PURE__ */
|
|
1397
|
+
/* @__PURE__ */ jsx11("span", { className: `adn-settings__badge adn-settings__badge--${template.channel}`, children: label(`channel.${template.channel}`) }),
|
|
1398
|
+
/* @__PURE__ */ jsxs11("span", { className: "adn-settings__version", children: [
|
|
1234
1399
|
label("settings.version"),
|
|
1235
1400
|
template.version
|
|
1236
1401
|
] })
|
|
1237
1402
|
]
|
|
1238
1403
|
}
|
|
1239
1404
|
),
|
|
1240
|
-
isStandardEmailKey(template.key) ? /* @__PURE__ */
|
|
1405
|
+
isStandardEmailKey(template.key) ? /* @__PURE__ */ jsx11("span", { className: "adn-settings__badge", children: label("settings.systemTemplate") }) : /* @__PURE__ */ jsxs11(
|
|
1241
1406
|
"button",
|
|
1242
1407
|
{
|
|
1243
1408
|
type: "button",
|
|
@@ -1246,7 +1411,7 @@ function NotificationSettingsWorkspace({
|
|
|
1246
1411
|
disabled: editor.isDeactivating,
|
|
1247
1412
|
onClick: () => editor.deactivate(template.id),
|
|
1248
1413
|
children: [
|
|
1249
|
-
/* @__PURE__ */
|
|
1414
|
+
/* @__PURE__ */ jsx11(Trash22, { className: "adn-settings__button-icon", "aria-hidden": "true" }),
|
|
1250
1415
|
label("settings.remove")
|
|
1251
1416
|
]
|
|
1252
1417
|
}
|
|
@@ -1254,14 +1419,14 @@ function NotificationSettingsWorkspace({
|
|
|
1254
1419
|
] }, template.id)) })
|
|
1255
1420
|
] }, group.category))
|
|
1256
1421
|
] }),
|
|
1257
|
-
editor.draft && /* @__PURE__ */
|
|
1258
|
-
/* @__PURE__ */
|
|
1259
|
-
/* @__PURE__ */
|
|
1260
|
-
/* @__PURE__ */
|
|
1422
|
+
editor.draft && /* @__PURE__ */ jsx11("section", { className: "adn-settings__editor", children: /* @__PURE__ */ jsxs11(Fragment2, { children: [
|
|
1423
|
+
/* @__PURE__ */ jsxs11("header", { className: "adn-settings__editor-header", children: [
|
|
1424
|
+
/* @__PURE__ */ jsxs11("div", { children: [
|
|
1425
|
+
/* @__PURE__ */ jsxs11("h2", { className: "adn-settings__section-title", children: [
|
|
1261
1426
|
editor.selected ? templateLabelOf?.(editor.selected) ?? editor.selected.key : "",
|
|
1262
|
-
editor.isStandardEmail && /* @__PURE__ */
|
|
1427
|
+
editor.isStandardEmail && /* @__PURE__ */ jsx11("span", { className: "adn-settings__badge", children: label("settings.systemTemplate") })
|
|
1263
1428
|
] }),
|
|
1264
|
-
/* @__PURE__ */
|
|
1429
|
+
/* @__PURE__ */ jsxs11("p", { className: "adn-settings__hint", children: [
|
|
1265
1430
|
editor.draft.channels.join(" \xB7 "),
|
|
1266
1431
|
" \xB7 ",
|
|
1267
1432
|
editor.draft.locale,
|
|
@@ -1270,9 +1435,9 @@ function NotificationSettingsWorkspace({
|
|
|
1270
1435
|
editor.selected?.version
|
|
1271
1436
|
] })
|
|
1272
1437
|
] }),
|
|
1273
|
-
/* @__PURE__ */
|
|
1438
|
+
/* @__PURE__ */ jsxs11("div", { className: "adn-settings__editor-actions", children: [
|
|
1274
1439
|
editor.selected && renderEditorActions?.({ templateKey: editor.selected.key }),
|
|
1275
|
-
editor.isStandardEmail && editor.selected && /* @__PURE__ */
|
|
1440
|
+
editor.isStandardEmail && editor.selected && /* @__PURE__ */ jsx11(
|
|
1276
1441
|
"button",
|
|
1277
1442
|
{
|
|
1278
1443
|
type: "button",
|
|
@@ -1282,23 +1447,23 @@ function NotificationSettingsWorkspace({
|
|
|
1282
1447
|
children: editor.isRestoring ? label("settings.restoring") : label("settings.restoreDefault")
|
|
1283
1448
|
}
|
|
1284
1449
|
),
|
|
1285
|
-
/* @__PURE__ */
|
|
1286
|
-
/* @__PURE__ */
|
|
1450
|
+
/* @__PURE__ */ jsxs11("button", { type: "button", className: "adn-settings__close", onClick: editor.clear, children: [
|
|
1451
|
+
/* @__PURE__ */ jsx11(X2, { className: "adn-settings__button-icon", "aria-hidden": "true" }),
|
|
1287
1452
|
label("settings.close")
|
|
1288
1453
|
] })
|
|
1289
1454
|
] })
|
|
1290
1455
|
] }),
|
|
1291
|
-
!editor.isIdentityLocked && /* @__PURE__ */
|
|
1292
|
-
/* @__PURE__ */
|
|
1293
|
-
/* @__PURE__ */
|
|
1294
|
-
/* @__PURE__ */
|
|
1295
|
-
/* @__PURE__ */
|
|
1456
|
+
!editor.isIdentityLocked && /* @__PURE__ */ jsxs11("div", { className: "adn-settings__identity", children: [
|
|
1457
|
+
/* @__PURE__ */ jsxs11("label", { className: "adn-settings__field", children: [
|
|
1458
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__field-label", children: label("settings.key") }),
|
|
1459
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: label("settings.keyHint") }),
|
|
1460
|
+
/* @__PURE__ */ jsx11("input", { value: editor.draft.key, onChange: (event) => editor.update({ key: event.target.value }) })
|
|
1296
1461
|
] }),
|
|
1297
|
-
/* @__PURE__ */
|
|
1298
|
-
/* @__PURE__ */
|
|
1299
|
-
/* @__PURE__ */
|
|
1300
|
-
/* @__PURE__ */
|
|
1301
|
-
/* @__PURE__ */
|
|
1462
|
+
/* @__PURE__ */ jsxs11("fieldset", { className: "adn-settings__field adn-settings__field--channels", children: [
|
|
1463
|
+
/* @__PURE__ */ jsx11("legend", { className: "adn-settings__field-label", children: label("settings.channel") }),
|
|
1464
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: label("settings.channelHint") }),
|
|
1465
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__channel-picker", children: channels.map((channel) => /* @__PURE__ */ jsxs11("label", { className: "adn-settings__channel-chip", children: [
|
|
1466
|
+
/* @__PURE__ */ jsx11(
|
|
1302
1467
|
"input",
|
|
1303
1468
|
{
|
|
1304
1469
|
type: "checkbox",
|
|
@@ -1309,12 +1474,12 @@ function NotificationSettingsWorkspace({
|
|
|
1309
1474
|
}
|
|
1310
1475
|
}
|
|
1311
1476
|
),
|
|
1312
|
-
/* @__PURE__ */
|
|
1477
|
+
/* @__PURE__ */ jsx11("span", { children: channel.label })
|
|
1313
1478
|
] }, channel.id)) })
|
|
1314
1479
|
] }),
|
|
1315
|
-
/* @__PURE__ */
|
|
1316
|
-
/* @__PURE__ */
|
|
1317
|
-
/* @__PURE__ */
|
|
1480
|
+
/* @__PURE__ */ jsxs11("label", { className: "adn-settings__field", children: [
|
|
1481
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__field-label", children: label("settings.locale") }),
|
|
1482
|
+
/* @__PURE__ */ jsx11(
|
|
1318
1483
|
"input",
|
|
1319
1484
|
{
|
|
1320
1485
|
value: editor.draft.locale,
|
|
@@ -1323,13 +1488,13 @@ function NotificationSettingsWorkspace({
|
|
|
1323
1488
|
)
|
|
1324
1489
|
] })
|
|
1325
1490
|
] }),
|
|
1326
|
-
editor.variables.length > 0 && /* @__PURE__ */
|
|
1327
|
-
/* @__PURE__ */
|
|
1328
|
-
/* @__PURE__ */
|
|
1329
|
-
/* @__PURE__ */
|
|
1491
|
+
editor.variables.length > 0 && /* @__PURE__ */ jsxs11("div", { className: "adn-settings__variables", children: [
|
|
1492
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__field-label", children: label("settings.variablesTitle") }),
|
|
1493
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.variablesHint") }),
|
|
1494
|
+
/* @__PURE__ */ jsx11("ul", { children: editor.variables.map((variable) => {
|
|
1330
1495
|
const used = editor.variableDiff.used.includes(variable.name);
|
|
1331
1496
|
const missing = editor.variableDiff.missingRequired.includes(variable.name);
|
|
1332
|
-
return /* @__PURE__ */
|
|
1497
|
+
return /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs11(
|
|
1333
1498
|
"button",
|
|
1334
1499
|
{
|
|
1335
1500
|
type: "button",
|
|
@@ -1344,22 +1509,22 @@ function NotificationSettingsWorkspace({
|
|
|
1344
1509
|
channel: cursorChannel ?? editor.draft?.channels[0] ?? ""
|
|
1345
1510
|
}),
|
|
1346
1511
|
children: [
|
|
1347
|
-
/* @__PURE__ */
|
|
1348
|
-
/* @__PURE__ */
|
|
1512
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__variable-name", children: `{{${variable.name}}}` }),
|
|
1513
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: variable.example })
|
|
1349
1514
|
]
|
|
1350
1515
|
}
|
|
1351
1516
|
) }, variable.name);
|
|
1352
1517
|
}) })
|
|
1353
1518
|
] }),
|
|
1354
|
-
editor.variableDiff.unknown.length > 0 && /* @__PURE__ */
|
|
1519
|
+
editor.variableDiff.unknown.length > 0 && /* @__PURE__ */ jsxs11("p", { className: "adn-settings__error", children: [
|
|
1355
1520
|
label("settings.unknownVariables"),
|
|
1356
1521
|
" ",
|
|
1357
1522
|
editor.variableDiff.unknown.join(", ")
|
|
1358
1523
|
] }),
|
|
1359
|
-
/* @__PURE__ */
|
|
1524
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__channel-tabs", role: "tablist", children: channels.filter((channel) => editor.draft?.channels.includes(channel.id)).map((channel) => {
|
|
1360
1525
|
const vazio = (editor.draft?.byChannel[channel.id]?.body ?? "").length === 0;
|
|
1361
1526
|
const ativo = (activeChannel ?? editor.draft?.channels[0]) === channel.id;
|
|
1362
|
-
return /* @__PURE__ */
|
|
1527
|
+
return /* @__PURE__ */ jsxs11(
|
|
1363
1528
|
"button",
|
|
1364
1529
|
{
|
|
1365
1530
|
type: "button",
|
|
@@ -1369,7 +1534,7 @@ function NotificationSettingsWorkspace({
|
|
|
1369
1534
|
onClick: () => setActiveChannel(channel.id),
|
|
1370
1535
|
children: [
|
|
1371
1536
|
channel.label,
|
|
1372
|
-
vazio && /* @__PURE__ */
|
|
1537
|
+
vazio && /* @__PURE__ */ jsx11("span", { className: "adn-settings__tab-dot", "aria-hidden": "true" })
|
|
1373
1538
|
]
|
|
1374
1539
|
},
|
|
1375
1540
|
channel.id
|
|
@@ -1378,15 +1543,15 @@ function NotificationSettingsWorkspace({
|
|
|
1378
1543
|
channels.filter((channel) => editor.draft?.channels.includes(channel.id)).filter((channel) => (activeChannel ?? editor.draft?.channels[0]) === channel.id).map((channel) => {
|
|
1379
1544
|
const content = editor.draft?.byChannel[channel.id];
|
|
1380
1545
|
const frames = editor.previews.filter((frame) => frame.channel === channel.id);
|
|
1381
|
-
return /* @__PURE__ */
|
|
1382
|
-
/* @__PURE__ */
|
|
1383
|
-
/* @__PURE__ */
|
|
1384
|
-
channel.hint && /* @__PURE__ */
|
|
1546
|
+
return /* @__PURE__ */ jsxs11("section", { className: "adn-settings__channel-block", children: [
|
|
1547
|
+
/* @__PURE__ */ jsxs11("header", { className: "adn-settings__channel-block-header", children: [
|
|
1548
|
+
/* @__PURE__ */ jsx11("h3", { className: "adn-settings__preview-channel", children: channel.label }),
|
|
1549
|
+
channel.hint && /* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: channel.hint })
|
|
1385
1550
|
] }),
|
|
1386
|
-
editor.isStandardEmail ? /* @__PURE__ */
|
|
1387
|
-
/* @__PURE__ */
|
|
1388
|
-
/* @__PURE__ */
|
|
1389
|
-
/* @__PURE__ */
|
|
1551
|
+
editor.isStandardEmail ? /* @__PURE__ */ jsx11("p", { className: "adn-settings__hint", children: label("settings.standardEmailHint") }) : /* @__PURE__ */ jsxs11("label", { className: "adn-settings__field", children: [
|
|
1552
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__field-label", children: label("settings.subject") }),
|
|
1553
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: label("settings.subjectHint") }),
|
|
1554
|
+
/* @__PURE__ */ jsx11(
|
|
1390
1555
|
"input",
|
|
1391
1556
|
{
|
|
1392
1557
|
value: content?.subject ?? "",
|
|
@@ -1396,9 +1561,9 @@ function NotificationSettingsWorkspace({
|
|
|
1396
1561
|
}
|
|
1397
1562
|
)
|
|
1398
1563
|
] }),
|
|
1399
|
-
/* @__PURE__ */
|
|
1400
|
-
/* @__PURE__ */
|
|
1401
|
-
channel.id === "email" && isHtmlBody(content?.body ?? "") ? /* @__PURE__ */
|
|
1564
|
+
/* @__PURE__ */ jsxs11("label", { className: "adn-settings__field", children: [
|
|
1565
|
+
/* @__PURE__ */ jsx11("span", { className: "adn-settings__field-label", children: label("settings.body") }),
|
|
1566
|
+
channel.id === "email" && isHtmlBody(content?.body ?? "") ? /* @__PURE__ */ jsx11(
|
|
1402
1567
|
HtmlCodeField,
|
|
1403
1568
|
{
|
|
1404
1569
|
value: content?.body ?? "",
|
|
@@ -1407,7 +1572,7 @@ function NotificationSettingsWorkspace({
|
|
|
1407
1572
|
onFocus: () => setCursorChannel(channel.id),
|
|
1408
1573
|
...validateEmailHtml && !editor.isStandardEmail ? { problems: validateEmailHtml(content?.body ?? "").problems } : {}
|
|
1409
1574
|
}
|
|
1410
|
-
) : /* @__PURE__ */
|
|
1575
|
+
) : /* @__PURE__ */ jsx11(
|
|
1411
1576
|
MessageBodyField,
|
|
1412
1577
|
{
|
|
1413
1578
|
value: content?.body ?? "",
|
|
@@ -1418,13 +1583,13 @@ function NotificationSettingsWorkspace({
|
|
|
1418
1583
|
}
|
|
1419
1584
|
)
|
|
1420
1585
|
] }),
|
|
1421
|
-
editor.isStandardEmail && editor.standardAssessment && !editor.standardAssessment.usable && /* @__PURE__ */
|
|
1422
|
-
editor.standardAssessment.missing.length > 0 && /* @__PURE__ */
|
|
1586
|
+
editor.isStandardEmail && editor.standardAssessment && !editor.standardAssessment.usable && /* @__PURE__ */ jsxs11("ul", { className: "adn-settings__email-report", role: "alert", children: [
|
|
1587
|
+
editor.standardAssessment.missing.length > 0 && /* @__PURE__ */ jsxs11("li", { className: "adn-settings__email-problem adn-settings__email-problem--error", children: [
|
|
1423
1588
|
label("settings.standardMissing"),
|
|
1424
1589
|
" ",
|
|
1425
1590
|
editor.standardAssessment.missing.map((name) => `{{${name}}}`).join(", ")
|
|
1426
1591
|
] }),
|
|
1427
|
-
editor.standardAssessment.unsafe.length > 0 && /* @__PURE__ */
|
|
1592
|
+
editor.standardAssessment.unsafe.length > 0 && /* @__PURE__ */ jsxs11("li", { className: "adn-settings__email-problem adn-settings__email-problem--error", children: [
|
|
1428
1593
|
label("settings.standardUnsafe"),
|
|
1429
1594
|
" ",
|
|
1430
1595
|
editor.standardAssessment.unsafe.map((rule) => label(`settings.standardUnsafe.${rule}`)).join(", ")
|
|
@@ -1435,21 +1600,21 @@ function NotificationSettingsWorkspace({
|
|
|
1435
1600
|
value: content?.whatsappTemplateName ?? "",
|
|
1436
1601
|
onChange: (value) => editor.updateChannel(channel.id, { whatsappTemplateName: value })
|
|
1437
1602
|
}),
|
|
1438
|
-
frames.length > 0 && /* @__PURE__ */
|
|
1439
|
-
/* @__PURE__ */
|
|
1440
|
-
/* @__PURE__ */
|
|
1441
|
-
/* @__PURE__ */
|
|
1603
|
+
frames.length > 0 && /* @__PURE__ */ jsxs11("div", { className: "adn-settings__previews", children: [
|
|
1604
|
+
/* @__PURE__ */ jsx11("p", { className: "adn-settings__preview-title", children: label("settings.previewTitle") }),
|
|
1605
|
+
/* @__PURE__ */ jsx11("div", { className: "adn-settings__preview-frames", children: frames.map((frame) => /* @__PURE__ */ jsxs11("figure", { className: "adn-settings__preview", children: [
|
|
1606
|
+
/* @__PURE__ */ jsxs11("figcaption", { className: "adn-settings__hint", children: [
|
|
1442
1607
|
label(`settings.viewport.${frame.viewport}`),
|
|
1443
1608
|
" \xB7 ",
|
|
1444
1609
|
frame.width,
|
|
1445
1610
|
"px"
|
|
1446
1611
|
] }),
|
|
1447
|
-
/* @__PURE__ */
|
|
1612
|
+
/* @__PURE__ */ jsx11(
|
|
1448
1613
|
"div",
|
|
1449
1614
|
{
|
|
1450
1615
|
className: "adn-settings__preview-frame",
|
|
1451
1616
|
style: { "--adn-preview-width": `${frame.width}px` },
|
|
1452
|
-
children: /* @__PURE__ */
|
|
1617
|
+
children: /* @__PURE__ */ jsx11(
|
|
1453
1618
|
TemplatePreview,
|
|
1454
1619
|
{
|
|
1455
1620
|
channel: frame.channel,
|
|
@@ -1478,7 +1643,7 @@ function NotificationSettingsWorkspace({
|
|
|
1478
1643
|
)
|
|
1479
1644
|
}
|
|
1480
1645
|
),
|
|
1481
|
-
frame.rendered.constraints.filter((constraint) => constraint.exceeded).map((constraint) => /* @__PURE__ */
|
|
1646
|
+
frame.rendered.constraints.filter((constraint) => constraint.exceeded).map((constraint) => /* @__PURE__ */ jsxs11("p", { className: "adn-settings__preview-warning", children: [
|
|
1482
1647
|
label(`settings.constraint.${constraint.field}`),
|
|
1483
1648
|
" ",
|
|
1484
1649
|
constraint.actual,
|
|
@@ -1489,10 +1654,10 @@ function NotificationSettingsWorkspace({
|
|
|
1489
1654
|
] })
|
|
1490
1655
|
] }, channel.id);
|
|
1491
1656
|
}),
|
|
1492
|
-
editor.error && /* @__PURE__ */
|
|
1493
|
-
/* @__PURE__ */
|
|
1494
|
-
/* @__PURE__ */
|
|
1495
|
-
!editor.isDirty && /* @__PURE__ */
|
|
1657
|
+
editor.error && /* @__PURE__ */ jsx11("p", { className: "adn-settings__error", children: editor.error }),
|
|
1658
|
+
/* @__PURE__ */ jsxs11("div", { className: "adn-settings__actions", children: [
|
|
1659
|
+
/* @__PURE__ */ jsx11("button", { type: "button", onClick: editor.save, disabled: !editor.isDirty || !editor.canSave || editor.isSaving, children: editor.isSaving ? label("settings.saving") : label("settings.save") }),
|
|
1660
|
+
!editor.isDirty && /* @__PURE__ */ jsx11("span", { className: "adn-settings__hint", children: label("settings.unchanged") })
|
|
1496
1661
|
] })
|
|
1497
1662
|
] }) })
|
|
1498
1663
|
] })
|
|
@@ -1511,6 +1676,7 @@ export {
|
|
|
1511
1676
|
NotificationBell,
|
|
1512
1677
|
NotificationItem,
|
|
1513
1678
|
NotificationList,
|
|
1679
|
+
NotificationPermissionBanner,
|
|
1514
1680
|
NotificationProvider,
|
|
1515
1681
|
NotificationSettingsWorkspace,
|
|
1516
1682
|
NotificationsWorkspace,
|
|
@@ -1533,8 +1699,10 @@ export {
|
|
|
1533
1699
|
useMarkAllAsRead,
|
|
1534
1700
|
useMarkAsRead,
|
|
1535
1701
|
useNotificationContext,
|
|
1702
|
+
useNotificationPermission,
|
|
1536
1703
|
useNotificationStream,
|
|
1537
1704
|
useNotifications,
|
|
1705
|
+
useOptionalNotificationContext,
|
|
1538
1706
|
usePreferences,
|
|
1539
1707
|
useRestoreTemplateDefault,
|
|
1540
1708
|
useTemplateEditor,
|