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