@devalok/shilp-sutra 0.34.0 → 0.34.1

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 (172) hide show
  1. package/dist/_chunks/badge-group.js +306 -246
  2. package/dist/_chunks/chat.js +513 -0
  3. package/dist/_chunks/date-picker.js +748 -0
  4. package/dist/_chunks/document-preview.js +109 -90
  5. package/dist/_chunks/file-preview.js +492 -504
  6. package/dist/_chunks/framer.js +5564 -5613
  7. package/dist/_chunks/image-preview.js +127 -88
  8. package/dist/_chunks/keybinding.js +12 -14
  9. package/dist/_chunks/link-context.js +19 -16
  10. package/dist/_chunks/mention-suggestion.js +353 -350
  11. package/dist/_chunks/motion-provider.js +26 -20
  12. package/dist/_chunks/popover.js +127 -0
  13. package/dist/_chunks/primitives.js +7584 -6425
  14. package/dist/_chunks/rich-chat-input.js +2070 -0
  15. package/dist/_chunks/rolldown-runtime.js +21 -0
  16. package/dist/_chunks/shared.js +126 -0
  17. package/dist/_chunks/sonner.js +605 -734
  18. package/dist/_chunks/stat-row.js +418 -440
  19. package/dist/_chunks/tiptap.js +15850 -19964
  20. package/dist/_chunks/tree-view.js +231 -290
  21. package/dist/_chunks/use-calendar.js +161 -208
  22. package/dist/_chunks/vendor-client.js +314 -2199
  23. package/dist/_chunks/vendor-utils.js +1721 -2978
  24. package/dist/ai/ai-command-provider.js +23 -17
  25. package/dist/ai/block-renderer.js +68 -51
  26. package/dist/ai/blocks/index.js +2 -12
  27. package/dist/ai/command-bar.js +470 -519
  28. package/dist/ai/conversation.js +241 -227
  29. package/dist/ai/index.js +181 -167
  30. package/dist/ai/types.js +0 -1
  31. package/dist/composed/activity-feed.js +232 -202
  32. package/dist/composed/avatar-group.js +164 -222
  33. package/dist/composed/bulk-action-bar.js +174 -165
  34. package/dist/composed/command-palette.js +290 -308
  35. package/dist/composed/confirm-dialog.js +28 -48
  36. package/dist/composed/content-card.js +69 -108
  37. package/dist/composed/date-picker/index.js +3 -13
  38. package/dist/composed/deadline-indicator.js +68 -74
  39. package/dist/composed/emoji-picker.js +83 -110
  40. package/dist/composed/empty-state.js +64 -103
  41. package/dist/composed/error-boundary.js +129 -127
  42. package/dist/composed/file-preview.js +2 -12
  43. package/dist/composed/filter-bar.js +98 -130
  44. package/dist/composed/form-section.js +61 -45
  45. package/dist/composed/global-loading.js +34 -47
  46. package/dist/composed/index.js +34 -92
  47. package/dist/composed/inline-edit.js +92 -107
  48. package/dist/composed/lib/string-utils.js +8 -8
  49. package/dist/composed/loading-skeleton.js +103 -171
  50. package/dist/composed/markdown-viewer.js +187 -139
  51. package/dist/composed/master-detail.js +147 -156
  52. package/dist/composed/member-picker.js +46 -49
  53. package/dist/composed/multi-select-popover.js +181 -179
  54. package/dist/composed/page-header.js +54 -76
  55. package/dist/composed/page-skeletons.js +143 -127
  56. package/dist/composed/priority-indicator.js +105 -111
  57. package/dist/composed/responsive-overlay.js +36 -41
  58. package/dist/composed/rich-chat-input.js +2 -1860
  59. package/dist/composed/rich-text-editor.js +561 -424
  60. package/dist/composed/schedule-view.js +134 -185
  61. package/dist/composed/simple-tooltip.js +21 -21
  62. package/dist/composed/status-badge.js +133 -137
  63. package/dist/hooks/index.js +7 -12
  64. package/dist/hooks/use-color-mode.js +28 -25
  65. package/dist/hooks/use-mobile.js +13 -13
  66. package/dist/hooks/use-toast.js +2 -4
  67. package/dist/hooks/use-touch-device.js +9 -11
  68. package/dist/hooks/use-viewport-height.js +14 -14
  69. package/dist/motion/index.js +3 -11
  70. package/dist/motion/primitives-index.js +226 -186
  71. package/dist/shell/app-command-palette.js +203 -234
  72. package/dist/shell/bottom-navbar.js +150 -190
  73. package/dist/shell/command-registry.js +13 -14
  74. package/dist/shell/index.js +10 -20
  75. package/dist/shell/link-context.js +2 -5
  76. package/dist/shell/notification-center.js +238 -259
  77. package/dist/shell/notification-preferences.js +241 -184
  78. package/dist/shell/sidebar.js +251 -281
  79. package/dist/shell/top-bar.js +203 -237
  80. package/dist/tailwind/index.cjs +426 -442
  81. package/dist/tailwind/index.js +2 -4
  82. package/dist/tailwind/preset.js +443 -459
  83. package/dist/ui/accordion.js +52 -60
  84. package/dist/ui/alert-dialog.js +111 -156
  85. package/dist/ui/alert.js +177 -99
  86. package/dist/ui/aspect-ratio.js +13 -16
  87. package/dist/ui/autocomplete.js +112 -148
  88. package/dist/ui/avatar.js +196 -169
  89. package/dist/ui/badge-group.js +2 -7
  90. package/dist/ui/badge-indicator.js +42 -51
  91. package/dist/ui/badge.js +2 -15
  92. package/dist/ui/banner.js +76 -68
  93. package/dist/ui/breadcrumb.js +65 -84
  94. package/dist/ui/button-group.js +109 -102
  95. package/dist/ui/button-processing.js +69 -73
  96. package/dist/ui/button.js +393 -279
  97. package/dist/ui/card.js +151 -157
  98. package/dist/ui/charts/index.js +1002 -1319
  99. package/dist/ui/chat/index.js +2 -11
  100. package/dist/ui/checkbox.js +77 -100
  101. package/dist/ui/code.js +18 -32
  102. package/dist/ui/collapsible.js +21 -29
  103. package/dist/ui/color-input.js +453 -372
  104. package/dist/ui/color-swatch.js +60 -90
  105. package/dist/ui/combobox.js +244 -293
  106. package/dist/ui/container.js +18 -24
  107. package/dist/ui/context-menu.js +154 -203
  108. package/dist/ui/data-table-body.js +116 -213
  109. package/dist/ui/data-table-bulk-actions.js +43 -59
  110. package/dist/ui/data-table-card.js +84 -71
  111. package/dist/ui/data-table-context.js +39 -42
  112. package/dist/ui/data-table-header.js +98 -139
  113. package/dist/ui/data-table-pagination.js +69 -82
  114. package/dist/ui/data-table-toolbar.js +104 -130
  115. package/dist/ui/data-table.js +278 -354
  116. package/dist/ui/devalok-grain.js +77 -66
  117. package/dist/ui/dialog.js +122 -151
  118. package/dist/ui/dropdown-menu.js +152 -203
  119. package/dist/ui/file-upload.js +242 -266
  120. package/dist/ui/form.js +60 -56
  121. package/dist/ui/hover-card.js +54 -54
  122. package/dist/ui/icon-button.js +21 -26
  123. package/dist/ui/icon-context.js +17 -17
  124. package/dist/ui/icon-group.js +22 -29
  125. package/dist/ui/icon.js +201 -121
  126. package/dist/ui/index.js +74 -350
  127. package/dist/ui/input-otp.js +44 -48
  128. package/dist/ui/input.js +92 -169
  129. package/dist/ui/label.js +17 -22
  130. package/dist/ui/lib/date-utils.js +14 -11
  131. package/dist/ui/lib/motion.js +77 -36
  132. package/dist/ui/lib/utils.js +39 -16
  133. package/dist/ui/link.js +13 -24
  134. package/dist/ui/menubar.js +132 -210
  135. package/dist/ui/navigation-menu.js +163 -193
  136. package/dist/ui/number-input.js +72 -95
  137. package/dist/ui/pagination.js +122 -159
  138. package/dist/ui/popover.js +2 -131
  139. package/dist/ui/progress-ring.js +133 -143
  140. package/dist/ui/progress.js +51 -95
  141. package/dist/ui/radio.js +41 -50
  142. package/dist/ui/search-input.js +51 -53
  143. package/dist/ui/segmented-control.js +93 -114
  144. package/dist/ui/select.js +131 -157
  145. package/dist/ui/separator.js +15 -25
  146. package/dist/ui/sheet.js +135 -163
  147. package/dist/ui/sidebar.js +357 -600
  148. package/dist/ui/skeleton.js +179 -231
  149. package/dist/ui/slider.js +24 -34
  150. package/dist/ui/spinner.js +226 -205
  151. package/dist/ui/split-button.js +227 -276
  152. package/dist/ui/stack.js +56 -70
  153. package/dist/ui/stat-card.js +259 -251
  154. package/dist/ui/status-dot.js +67 -63
  155. package/dist/ui/stepper.js +119 -168
  156. package/dist/ui/switch.js +51 -54
  157. package/dist/ui/table.js +57 -90
  158. package/dist/ui/tabs.js +139 -156
  159. package/dist/ui/text.js +52 -59
  160. package/dist/ui/textarea.js +40 -57
  161. package/dist/ui/toast-types.js +0 -1
  162. package/dist/ui/toast.js +554 -536
  163. package/dist/ui/toaster.js +23 -33
  164. package/dist/ui/toggle-group.js +37 -41
  165. package/dist/ui/toggle.js +36 -40
  166. package/dist/ui/tooltip.js +80 -65
  167. package/dist/ui/tree-view/index.js +2 -6
  168. package/dist/ui/visually-hidden.js +12 -10
  169. package/llms-full.txt +1 -1
  170. package/package.json +1 -1
  171. package/dist/_chunks/date-time-picker.js +0 -851
  172. package/dist/_chunks/typing-indicator.js +0 -565
@@ -1,431 +1,568 @@
1
1
  "use client";
2
- import { jsxs as y, jsx as e } from "react/jsx-runtime";
3
- import * as d from "react";
4
- import { u as j, i as q, P as Q, a as D, L as U, b as M, c as O, d as K, E as $, e as V } from "../_chunks/tiptap.js";
5
- import { F as W, E as X, a as Y, c as Z, l as G, b as F } from "../_chunks/mention-suggestion.js";
6
- import { useColorMode as ee } from "../hooks/use-color-mode.js";
7
- import { cn as L } from "../ui/lib/utils.js";
8
- import { IconBold as te, IconItalic as ie, IconUnderline as se, IconStrikethrough as ne, IconHighlight as re, IconH2 as oe, IconH3 as le, IconBlockquote as ce, IconList as ae, IconListNumbers as de, IconListCheck as ue, IconCode as fe, IconPhoto as he, IconPaperclip as ge, IconLineDashed as me, IconAlignLeft as be, IconAlignCenter as pe, IconAlignRight as ke, IconMoodSmile as ve, IconArrowBackUp as xe, IconArrowForwardUp as _e, IconLink as Ae } from "@tabler/icons-react";
9
- import { Icon as l } from "../ui/icon.js";
10
- const J = [
11
- "prose prose-sm max-w-none",
12
- "font-body text-ds-md leading-relaxed text-surface-fg",
13
- "[&_h2]:text-ds-xl [&_h2]:mb-ds-03 [&_h2]:mt-ds-05 [&_h2]:text-surface-fg",
14
- "[&_h3]:text-ds-base [&_h3]:font-semibold [&_h3]:mb-ds-02b [&_h3]:mt-ds-04 [&_h3]:text-surface-fg",
15
- "[&_p]:mb-ds-02b [&_p]:text-surface-fg-muted",
16
- "[&_ul]:ml-ds-05 [&_ul]:list-disc [&_ol]:ml-ds-05 [&_ol]:list-decimal",
17
- "[&_li]:text-surface-fg-muted",
18
- "[&_code]:rounded [&_code]:bg-surface-raised [&_code]:px-ds-02b [&_code]:py-ds-01 [&_code]:text-ds-md [&_code]:text-accent-11",
19
- "[&_pre]:rounded-ds-lg [&_pre]:bg-surface-raised [&_pre]:p-ds-04",
20
- "[&_strong]:font-semibold [&_strong]:text-surface-fg",
21
- "[&_blockquote]:border-l-[3px] [&_blockquote]:border-accent-6 [&_blockquote]:pl-ds-04 [&_blockquote]:italic [&_blockquote]:text-surface-fg-subtle",
22
- "[[&_mark]:rounded-sm_mark]:rounded-xs [&_mark]:bg-warning-3 [&_mark]:px-[2px]",
23
- '[&_ul[data-type="taskList"]]:ml-0 [&_ul[data-type="taskList"]]:list-none [&_li[data-type="taskItem"]]:flex [&_li[data-type="taskItem"]]:items-start [&_li[data-type="taskItem"]]:gap-ds-02',
24
- "[&_hr]:my-ds-04 [&_hr]:border-surface-border-strong",
25
- "[&_a]:text-accent-11 [&_a]:underline [&_a]:decoration-accent-6 hover:[&_a]:decoration-accent-11",
26
- "[&_img]:max-w-full [&_img]:rounded-ds-md [&_img]:my-ds-03",
27
- "[&_.mention]:rounded-ds-sm [&_.mention]:bg-accent-2 [&_.mention]:px-ds-02 [&_.mention]:py-[1px] [&_.mention]:font-medium [&_.mention]:text-accent-11"
2
+ import { cn as e } from "../ui/lib/utils.js";
3
+ import { Icon as t } from "../ui/icon.js";
4
+ import { a as n, d as r, h as i, i as a, l as o, m as s, n as c, o as l, s as u, u as d } from "../_chunks/tiptap.js";
5
+ import { a as f, i as p, n as m, o as h, r as g, t as _ } from "../_chunks/mention-suggestion.js";
6
+ import { useColorMode as v } from "../hooks/use-color-mode.js";
7
+ import * as y from "react";
8
+ import { jsx as b, jsxs as x } from "react/jsx-runtime";
9
+ import { IconAlignCenter as S, IconAlignLeft as C, IconAlignRight as w, IconArrowBackUp as T, IconArrowForwardUp as E, IconBlockquote as D, IconBold as O, IconCode as k, IconH2 as A, IconH3 as j, IconHighlight as M, IconItalic as N, IconLineDashed as P, IconLink as F, IconList as I, IconListCheck as L, IconListNumbers as R, IconMoodSmile as z, IconPaperclip as B, IconPhoto as V, IconStrikethrough as H, IconUnderline as U } from "@tabler/icons-react";
10
+ //#region src/composed/rich-text-editor.tsx
11
+ var W = [
12
+ "prose prose-sm max-w-none",
13
+ "font-body text-ds-md leading-relaxed text-surface-fg",
14
+ "[&_h2]:text-ds-xl [&_h2]:mb-ds-03 [&_h2]:mt-ds-05 [&_h2]:text-surface-fg",
15
+ "[&_h3]:text-ds-base [&_h3]:font-semibold [&_h3]:mb-ds-02b [&_h3]:mt-ds-04 [&_h3]:text-surface-fg",
16
+ "[&_p]:mb-ds-02b [&_p]:text-surface-fg-muted",
17
+ "[&_ul]:ml-ds-05 [&_ul]:list-disc [&_ol]:ml-ds-05 [&_ol]:list-decimal",
18
+ "[&_li]:text-surface-fg-muted",
19
+ "[&_code]:rounded [&_code]:bg-surface-raised [&_code]:px-ds-02b [&_code]:py-ds-01 [&_code]:text-ds-md [&_code]:text-accent-11",
20
+ "[&_pre]:rounded-ds-lg [&_pre]:bg-surface-raised [&_pre]:p-ds-04",
21
+ "[&_strong]:font-semibold [&_strong]:text-surface-fg",
22
+ "[&_blockquote]:border-l-[3px] [&_blockquote]:border-accent-6 [&_blockquote]:pl-ds-04 [&_blockquote]:italic [&_blockquote]:text-surface-fg-subtle",
23
+ "[[&_mark]:rounded-sm_mark]:rounded-xs [&_mark]:bg-warning-3 [&_mark]:px-[2px]",
24
+ "[&_ul[data-type=\"taskList\"]]:ml-0 [&_ul[data-type=\"taskList\"]]:list-none [&_li[data-type=\"taskItem\"]]:flex [&_li[data-type=\"taskItem\"]]:items-start [&_li[data-type=\"taskItem\"]]:gap-ds-02",
25
+ "[&_hr]:my-ds-04 [&_hr]:border-surface-border-strong",
26
+ "[&_a]:text-accent-11 [&_a]:underline [&_a]:decoration-accent-6 hover:[&_a]:decoration-accent-11",
27
+ "[&_img]:max-w-full [&_img]:rounded-ds-md [&_img]:my-ds-03",
28
+ "[&_.mention]:rounded-ds-sm [&_.mention]:bg-accent-2 [&_.mention]:px-ds-02 [&_.mention]:py-[1px] [&_.mention]:font-medium [&_.mention]:text-accent-11"
28
29
  ];
29
- function c({
30
- onClick: i,
31
- isActive: u = !1,
32
- disabled: f = !1,
33
- title: h,
34
- children: g
35
- }) {
36
- return /* @__PURE__ */ e(
37
- "button",
38
- {
39
- type: "button",
40
- onClick: i,
41
- disabled: f,
42
- title: h,
43
- "aria-label": h,
44
- "aria-pressed": u,
45
- className: L(
46
- "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors duration-fast-01 ease-productive-standard",
47
- "hover:bg-surface-raised-hover",
48
- "disabled:pointer-events-none disabled:opacity-action-disabled",
49
- u ? "bg-surface-raised-hover text-accent-11" : "text-surface-fg-subtle"
50
- ),
51
- children: g
52
- }
53
- );
30
+ function G({ onClick: t, isActive: n = !1, disabled: r = !1, title: i, children: a }) {
31
+ return /* @__PURE__ */ b("button", {
32
+ type: "button",
33
+ onClick: t,
34
+ disabled: r,
35
+ title: i,
36
+ "aria-label": i,
37
+ "aria-pressed": n,
38
+ className: e("inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors duration-fast-01 ease-productive-standard", "hover:bg-surface-raised-hover", "disabled:pointer-events-none disabled:opacity-action-disabled", n ? "bg-surface-raised-hover text-accent-11" : "text-surface-fg-subtle"),
39
+ children: a
40
+ });
54
41
  }
55
- function Le({ editor: i }) {
56
- const [u, f] = d.useState(!1), [h, g] = d.useState(""), n = d.useRef(null), { isLink: t } = V({
57
- editor: i,
58
- selector: ({ editor: m }) => ({ isLink: m.isActive("link") })
59
- });
60
- return /* @__PURE__ */ y("div", { className: "relative", children: [
61
- /* @__PURE__ */ e(c, { onClick: () => {
62
- if (t) {
63
- i.chain().focus().unsetLink().run();
64
- return;
65
- }
66
- const m = i.getAttributes("link").href || "";
67
- g(m), f(!0), setTimeout(() => n.current?.focus(), 0);
68
- }, isActive: t, title: "Link", children: /* @__PURE__ */ e(l, { icon: Ae, size: "sm" }) }),
69
- u && /* @__PURE__ */ y(
70
- "form",
71
- {
72
- onSubmit: (m) => {
73
- m.preventDefault(), h.trim() && i.chain().focus().setLink({ href: h.trim() }).run(), f(!1), g("");
74
- },
75
- "aria-label": "Edit link URL",
76
- className: "absolute left-0 top-full z-popover mt-ds-01 flex items-center gap-ds-02 rounded-ds-md border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised-hover",
77
- children: [
78
- /* @__PURE__ */ e(
79
- "input",
80
- {
81
- ref: n,
82
- type: "url",
83
- value: h,
84
- onChange: (m) => g(m.target.value),
85
- onKeyDown: (m) => {
86
- m.key === "Escape" && (f(!1), g(""), i.commands.focus());
87
- },
88
- placeholder: "https://...",
89
- className: "h-ds-sm w-[240px] rounded-ds-sm border border-surface-border-strong bg-surface-overlay px-ds-03 text-ds-sm text-surface-fg focus:border-accent-7 focus:outline-hidden"
90
- }
91
- ),
92
- /* @__PURE__ */ e("button", { type: "submit", className: "h-ds-sm rounded-ds-sm bg-accent-9 px-ds-03 text-ds-sm text-accent-fg hover:bg-accent-10", children: "Apply" })
93
- ]
94
- }
95
- )
96
- ] });
42
+ function K({ editor: e }) {
43
+ let [n, r] = y.useState(!1), [a, o] = y.useState(""), s = y.useRef(null), { isLink: c } = i({
44
+ editor: e,
45
+ selector: ({ editor: e }) => ({ isLink: e.isActive("link") })
46
+ });
47
+ return /* @__PURE__ */ x("div", {
48
+ className: "relative",
49
+ children: [/* @__PURE__ */ b(G, {
50
+ onClick: () => {
51
+ if (c) {
52
+ e.chain().focus().unsetLink().run();
53
+ return;
54
+ }
55
+ o(e.getAttributes("link").href || ""), r(!0), setTimeout(() => s.current?.focus(), 0);
56
+ },
57
+ isActive: c,
58
+ title: "Link",
59
+ children: /* @__PURE__ */ b(t, {
60
+ icon: F,
61
+ size: "sm"
62
+ })
63
+ }), n && /* @__PURE__ */ x("form", {
64
+ onSubmit: (t) => {
65
+ t.preventDefault(), a.trim() && e.chain().focus().setLink({ href: a.trim() }).run(), r(!1), o("");
66
+ },
67
+ "aria-label": "Edit link URL",
68
+ className: "absolute left-0 top-full z-popover mt-ds-01 flex items-center gap-ds-02 rounded-ds-md border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised-hover",
69
+ children: [/* @__PURE__ */ b("input", {
70
+ ref: s,
71
+ type: "url",
72
+ value: a,
73
+ onChange: (e) => o(e.target.value),
74
+ onKeyDown: (t) => {
75
+ t.key === "Escape" && (r(!1), o(""), e.commands.focus());
76
+ },
77
+ placeholder: "https://...",
78
+ className: "h-ds-sm w-[240px] rounded-ds-sm border border-surface-border-strong bg-surface-overlay px-ds-03 text-ds-sm text-surface-fg focus:border-accent-7 focus:outline-hidden"
79
+ }), /* @__PURE__ */ b("button", {
80
+ type: "submit",
81
+ className: "h-ds-sm rounded-ds-sm bg-accent-9 px-ds-03 text-ds-sm text-accent-fg hover:bg-accent-10",
82
+ children: "Apply"
83
+ })]
84
+ })]
85
+ });
97
86
  }
98
- function A() {
99
- return /* @__PURE__ */ e("div", { className: "mx-ds-02 h-[16px] w-px bg-surface-border" });
87
+ function q() {
88
+ return /* @__PURE__ */ b("div", { className: "mx-ds-02 h-[16px] w-px bg-surface-border" });
100
89
  }
101
- function ye({ editor: i, toolbar: u, onImageClick: f, onFileClick: h, onEmojiClick: g }) {
102
- const n = V({
103
- editor: i,
104
- selector: ({ editor: o }) => ({
105
- isBold: o.isActive("bold"),
106
- isItalic: o.isActive("italic"),
107
- isUnderline: o.isActive("underline"),
108
- isStrike: o.isActive("strike"),
109
- isHighlight: o.isActive("highlight"),
110
- isH2: o.isActive("heading", { level: 2 }),
111
- isH3: o.isActive("heading", { level: 3 }),
112
- isBlockquote: o.isActive("blockquote"),
113
- isBulletList: o.isActive("bulletList"),
114
- isOrderedList: o.isActive("orderedList"),
115
- isTaskList: o.isActive("taskList"),
116
- isCodeBlock: o.isActive("codeBlock"),
117
- isLink: o.isActive("link"),
118
- isAlignLeft: o.isActive({ textAlign: "left" }),
119
- isAlignCenter: o.isActive({ textAlign: "center" }),
120
- isAlignRight: o.isActive({ textAlign: "right" }),
121
- canUndo: o.can().undo(),
122
- canRedo: o.can().redo()
123
- })
124
- }), t = (o) => !u || u.includes(o), _ = t("bold") || t("italic") || t("underline") || t("strike") || t("highlight"), p = t("h2") || t("h3") || t("blockquote"), k = t("bulletList") || t("orderedList") || t("taskList") || t("codeBlock"), m = t("link") || !!f && t("image") || !!h && t("file") || t("hr"), C = t("alignLeft") || t("alignCenter") || t("alignRight"), v = !!g && t("emoji"), R = t("undo") || t("redo");
125
- return /* @__PURE__ */ y("div", { role: "toolbar", "aria-label": "Text formatting", className: "flex flex-wrap items-center gap-ds-01 border-b border-surface-border-strong px-ds-04 py-ds-02b", children: [
126
- t("bold") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleBold().run(), isActive: n.isBold, title: "Bold", children: /* @__PURE__ */ e(l, { icon: te, size: "sm", stroke: "bold" }) }),
127
- t("italic") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleItalic().run(), isActive: n.isItalic, title: "Italic", children: /* @__PURE__ */ e(l, { icon: ie, size: "sm", stroke: "bold" }) }),
128
- t("underline") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleUnderline().run(), isActive: n.isUnderline, title: "Underline", children: /* @__PURE__ */ e(l, { icon: se, size: "sm", stroke: "bold" }) }),
129
- t("strike") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleStrike().run(), isActive: n.isStrike, title: "Strikethrough", children: /* @__PURE__ */ e(l, { icon: ne, size: "sm", stroke: "bold" }) }),
130
- t("highlight") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleHighlight().run(), isActive: n.isHighlight, title: "Highlight", children: /* @__PURE__ */ e(l, { icon: re, size: "sm", stroke: "bold" }) }),
131
- _ && p && /* @__PURE__ */ e(A, {}),
132
- t("h2") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleHeading({ level: 2 }).run(), isActive: n.isH2, title: "Heading 2", children: /* @__PURE__ */ e(l, { icon: oe, size: "sm", stroke: "bold" }) }),
133
- t("h3") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleHeading({ level: 3 }).run(), isActive: n.isH3, title: "Heading 3", children: /* @__PURE__ */ e(l, { icon: le, size: "sm", stroke: "bold" }) }),
134
- t("blockquote") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleBlockquote().run(), isActive: n.isBlockquote, title: "Blockquote", children: /* @__PURE__ */ e(l, { icon: ce, size: "sm", stroke: "bold" }) }),
135
- p && k && /* @__PURE__ */ e(A, {}),
136
- t("bulletList") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleBulletList().run(), isActive: n.isBulletList, title: "Bullet list", children: /* @__PURE__ */ e(l, { icon: ae, size: "sm", stroke: "bold" }) }),
137
- t("orderedList") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleOrderedList().run(), isActive: n.isOrderedList, title: "Ordered list", children: /* @__PURE__ */ e(l, { icon: de, size: "sm", stroke: "bold" }) }),
138
- t("taskList") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleTaskList().run(), isActive: n.isTaskList, title: "Task list", children: /* @__PURE__ */ e(l, { icon: ue, size: "sm", stroke: "bold" }) }),
139
- t("codeBlock") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().toggleCodeBlock().run(), isActive: n.isCodeBlock, title: "Code block", children: /* @__PURE__ */ e(l, { icon: fe, size: "sm", stroke: "bold" }) }),
140
- k && m && /* @__PURE__ */ e(A, {}),
141
- t("link") && /* @__PURE__ */ e(Le, { editor: i }),
142
- f && t("image") && /* @__PURE__ */ e(c, { onClick: f, title: "Insert image", children: /* @__PURE__ */ e(l, { icon: he, size: "sm" }) }),
143
- h && t("file") && /* @__PURE__ */ e(c, { onClick: h, title: "Attach file", children: /* @__PURE__ */ e(l, { icon: ge, size: "sm" }) }),
144
- t("hr") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().setHorizontalRule().run(), title: "Horizontal rule", children: /* @__PURE__ */ e(l, { icon: me, size: "sm" }) }),
145
- m && C && /* @__PURE__ */ e(A, {}),
146
- t("alignLeft") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().setTextAlign("left").run(), isActive: n.isAlignLeft, title: "Align left", children: /* @__PURE__ */ e(l, { icon: be, size: "sm" }) }),
147
- t("alignCenter") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().setTextAlign("center").run(), isActive: n.isAlignCenter, title: "Align center", children: /* @__PURE__ */ e(l, { icon: pe, size: "sm" }) }),
148
- t("alignRight") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().setTextAlign("right").run(), isActive: n.isAlignRight, title: "Align right", children: /* @__PURE__ */ e(l, { icon: ke, size: "sm" }) }),
149
- C && (v || R) && /* @__PURE__ */ e(A, {}),
150
- g && t("emoji") && /* @__PURE__ */ e(c, { onClick: g, title: "Emoji", children: /* @__PURE__ */ e(l, { icon: ve, size: "sm" }) }),
151
- t("undo") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().undo().run(), disabled: !n.canUndo, title: "Undo", children: /* @__PURE__ */ e(l, { icon: xe, size: "sm" }) }),
152
- t("redo") && /* @__PURE__ */ e(c, { onClick: () => i.chain().focus().redo().run(), disabled: !n.canRedo, title: "Redo", children: /* @__PURE__ */ e(l, { icon: _e, size: "sm" }) })
153
- ] });
90
+ function J({ editor: e, toolbar: n, onImageClick: r, onFileClick: a, onEmojiClick: o }) {
91
+ let s = i({
92
+ editor: e,
93
+ selector: ({ editor: e }) => ({
94
+ isBold: e.isActive("bold"),
95
+ isItalic: e.isActive("italic"),
96
+ isUnderline: e.isActive("underline"),
97
+ isStrike: e.isActive("strike"),
98
+ isHighlight: e.isActive("highlight"),
99
+ isH2: e.isActive("heading", { level: 2 }),
100
+ isH3: e.isActive("heading", { level: 3 }),
101
+ isBlockquote: e.isActive("blockquote"),
102
+ isBulletList: e.isActive("bulletList"),
103
+ isOrderedList: e.isActive("orderedList"),
104
+ isTaskList: e.isActive("taskList"),
105
+ isCodeBlock: e.isActive("codeBlock"),
106
+ isLink: e.isActive("link"),
107
+ isAlignLeft: e.isActive({ textAlign: "left" }),
108
+ isAlignCenter: e.isActive({ textAlign: "center" }),
109
+ isAlignRight: e.isActive({ textAlign: "right" }),
110
+ canUndo: e.can().undo(),
111
+ canRedo: e.can().redo()
112
+ })
113
+ }), c = (e) => !n || n.includes(e), l = c("bold") || c("italic") || c("underline") || c("strike") || c("highlight"), u = c("h2") || c("h3") || c("blockquote"), d = c("bulletList") || c("orderedList") || c("taskList") || c("codeBlock"), f = c("link") || !!r && c("image") || !!a && c("file") || c("hr"), p = c("alignLeft") || c("alignCenter") || c("alignRight"), m = !!o && c("emoji"), h = c("undo") || c("redo");
114
+ return /* @__PURE__ */ x("div", {
115
+ role: "toolbar",
116
+ "aria-label": "Text formatting",
117
+ className: "flex flex-wrap items-center gap-ds-01 border-b border-surface-border-strong px-ds-04 py-ds-02b",
118
+ children: [
119
+ c("bold") && /* @__PURE__ */ b(G, {
120
+ onClick: () => e.chain().focus().toggleBold().run(),
121
+ isActive: s.isBold,
122
+ title: "Bold",
123
+ children: /* @__PURE__ */ b(t, {
124
+ icon: O,
125
+ size: "sm",
126
+ stroke: "bold"
127
+ })
128
+ }),
129
+ c("italic") && /* @__PURE__ */ b(G, {
130
+ onClick: () => e.chain().focus().toggleItalic().run(),
131
+ isActive: s.isItalic,
132
+ title: "Italic",
133
+ children: /* @__PURE__ */ b(t, {
134
+ icon: N,
135
+ size: "sm",
136
+ stroke: "bold"
137
+ })
138
+ }),
139
+ c("underline") && /* @__PURE__ */ b(G, {
140
+ onClick: () => e.chain().focus().toggleUnderline().run(),
141
+ isActive: s.isUnderline,
142
+ title: "Underline",
143
+ children: /* @__PURE__ */ b(t, {
144
+ icon: U,
145
+ size: "sm",
146
+ stroke: "bold"
147
+ })
148
+ }),
149
+ c("strike") && /* @__PURE__ */ b(G, {
150
+ onClick: () => e.chain().focus().toggleStrike().run(),
151
+ isActive: s.isStrike,
152
+ title: "Strikethrough",
153
+ children: /* @__PURE__ */ b(t, {
154
+ icon: H,
155
+ size: "sm",
156
+ stroke: "bold"
157
+ })
158
+ }),
159
+ c("highlight") && /* @__PURE__ */ b(G, {
160
+ onClick: () => e.chain().focus().toggleHighlight().run(),
161
+ isActive: s.isHighlight,
162
+ title: "Highlight",
163
+ children: /* @__PURE__ */ b(t, {
164
+ icon: M,
165
+ size: "sm",
166
+ stroke: "bold"
167
+ })
168
+ }),
169
+ l && u && /* @__PURE__ */ b(q, {}),
170
+ c("h2") && /* @__PURE__ */ b(G, {
171
+ onClick: () => e.chain().focus().toggleHeading({ level: 2 }).run(),
172
+ isActive: s.isH2,
173
+ title: "Heading 2",
174
+ children: /* @__PURE__ */ b(t, {
175
+ icon: A,
176
+ size: "sm",
177
+ stroke: "bold"
178
+ })
179
+ }),
180
+ c("h3") && /* @__PURE__ */ b(G, {
181
+ onClick: () => e.chain().focus().toggleHeading({ level: 3 }).run(),
182
+ isActive: s.isH3,
183
+ title: "Heading 3",
184
+ children: /* @__PURE__ */ b(t, {
185
+ icon: j,
186
+ size: "sm",
187
+ stroke: "bold"
188
+ })
189
+ }),
190
+ c("blockquote") && /* @__PURE__ */ b(G, {
191
+ onClick: () => e.chain().focus().toggleBlockquote().run(),
192
+ isActive: s.isBlockquote,
193
+ title: "Blockquote",
194
+ children: /* @__PURE__ */ b(t, {
195
+ icon: D,
196
+ size: "sm",
197
+ stroke: "bold"
198
+ })
199
+ }),
200
+ u && d && /* @__PURE__ */ b(q, {}),
201
+ c("bulletList") && /* @__PURE__ */ b(G, {
202
+ onClick: () => e.chain().focus().toggleBulletList().run(),
203
+ isActive: s.isBulletList,
204
+ title: "Bullet list",
205
+ children: /* @__PURE__ */ b(t, {
206
+ icon: I,
207
+ size: "sm",
208
+ stroke: "bold"
209
+ })
210
+ }),
211
+ c("orderedList") && /* @__PURE__ */ b(G, {
212
+ onClick: () => e.chain().focus().toggleOrderedList().run(),
213
+ isActive: s.isOrderedList,
214
+ title: "Ordered list",
215
+ children: /* @__PURE__ */ b(t, {
216
+ icon: R,
217
+ size: "sm",
218
+ stroke: "bold"
219
+ })
220
+ }),
221
+ c("taskList") && /* @__PURE__ */ b(G, {
222
+ onClick: () => e.chain().focus().toggleTaskList().run(),
223
+ isActive: s.isTaskList,
224
+ title: "Task list",
225
+ children: /* @__PURE__ */ b(t, {
226
+ icon: L,
227
+ size: "sm",
228
+ stroke: "bold"
229
+ })
230
+ }),
231
+ c("codeBlock") && /* @__PURE__ */ b(G, {
232
+ onClick: () => e.chain().focus().toggleCodeBlock().run(),
233
+ isActive: s.isCodeBlock,
234
+ title: "Code block",
235
+ children: /* @__PURE__ */ b(t, {
236
+ icon: k,
237
+ size: "sm",
238
+ stroke: "bold"
239
+ })
240
+ }),
241
+ d && f && /* @__PURE__ */ b(q, {}),
242
+ c("link") && /* @__PURE__ */ b(K, { editor: e }),
243
+ r && c("image") && /* @__PURE__ */ b(G, {
244
+ onClick: r,
245
+ title: "Insert image",
246
+ children: /* @__PURE__ */ b(t, {
247
+ icon: V,
248
+ size: "sm"
249
+ })
250
+ }),
251
+ a && c("file") && /* @__PURE__ */ b(G, {
252
+ onClick: a,
253
+ title: "Attach file",
254
+ children: /* @__PURE__ */ b(t, {
255
+ icon: B,
256
+ size: "sm"
257
+ })
258
+ }),
259
+ c("hr") && /* @__PURE__ */ b(G, {
260
+ onClick: () => e.chain().focus().setHorizontalRule().run(),
261
+ title: "Horizontal rule",
262
+ children: /* @__PURE__ */ b(t, {
263
+ icon: P,
264
+ size: "sm"
265
+ })
266
+ }),
267
+ f && p && /* @__PURE__ */ b(q, {}),
268
+ c("alignLeft") && /* @__PURE__ */ b(G, {
269
+ onClick: () => e.chain().focus().setTextAlign("left").run(),
270
+ isActive: s.isAlignLeft,
271
+ title: "Align left",
272
+ children: /* @__PURE__ */ b(t, {
273
+ icon: C,
274
+ size: "sm"
275
+ })
276
+ }),
277
+ c("alignCenter") && /* @__PURE__ */ b(G, {
278
+ onClick: () => e.chain().focus().setTextAlign("center").run(),
279
+ isActive: s.isAlignCenter,
280
+ title: "Align center",
281
+ children: /* @__PURE__ */ b(t, {
282
+ icon: S,
283
+ size: "sm"
284
+ })
285
+ }),
286
+ c("alignRight") && /* @__PURE__ */ b(G, {
287
+ onClick: () => e.chain().focus().setTextAlign("right").run(),
288
+ isActive: s.isAlignRight,
289
+ title: "Align right",
290
+ children: /* @__PURE__ */ b(t, {
291
+ icon: w,
292
+ size: "sm"
293
+ })
294
+ }),
295
+ p && (m || h) && /* @__PURE__ */ b(q, {}),
296
+ o && c("emoji") && /* @__PURE__ */ b(G, {
297
+ onClick: o,
298
+ title: "Emoji",
299
+ children: /* @__PURE__ */ b(t, {
300
+ icon: z,
301
+ size: "sm"
302
+ })
303
+ }),
304
+ c("undo") && /* @__PURE__ */ b(G, {
305
+ onClick: () => e.chain().focus().undo().run(),
306
+ disabled: !s.canUndo,
307
+ title: "Undo",
308
+ children: /* @__PURE__ */ b(t, {
309
+ icon: T,
310
+ size: "sm"
311
+ })
312
+ }),
313
+ c("redo") && /* @__PURE__ */ b(G, {
314
+ onClick: () => e.chain().focus().redo().run(),
315
+ disabled: !s.canRedo,
316
+ title: "Redo",
317
+ children: /* @__PURE__ */ b(t, {
318
+ icon: E,
319
+ size: "sm"
320
+ })
321
+ })
322
+ ]
323
+ });
154
324
  }
155
- const Ce = d.lazy(() => import("@emoji-mart/react"));
156
- function we({ set: i = "native", onSelect: u }) {
157
- const [f, h] = d.useState(null), { colorMode: g } = ee();
158
- d.useEffect(() => {
159
- G(i).then((t) => h(t));
160
- }, [i]);
161
- const n = /* @__PURE__ */ e("div", { className: "flex h-[350px] w-[352px] items-center justify-center rounded-ds-lg border border-surface-border-strong bg-surface-overlay shadow-raised-hover", children: /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-subtle", children: "Loading..." }) });
162
- return f ? /* @__PURE__ */ e(d.Suspense, { fallback: n, children: /* @__PURE__ */ e(
163
- Ce,
164
- {
165
- data: f,
166
- set: i,
167
- onEmojiSelect: (t) => u({ id: t.id, native: t.native }),
168
- theme: g === "dark" ? "dark" : "light",
169
- previewPosition: "none",
170
- skinTonePosition: "none"
171
- }
172
- ) }) : n;
325
+ var Y = y.lazy(() => import("@emoji-mart/react"));
326
+ function X({ set: e = "native", onSelect: t }) {
327
+ let [n, r] = y.useState(null), { colorMode: i } = v();
328
+ y.useEffect(() => {
329
+ p(e).then((e) => r(e));
330
+ }, [e]);
331
+ let a = /* @__PURE__ */ b("div", {
332
+ className: "flex h-[350px] w-[352px] items-center justify-center rounded-ds-lg border border-surface-border-strong bg-surface-overlay shadow-raised-hover",
333
+ children: /* @__PURE__ */ b("span", {
334
+ className: "text-ds-sm text-surface-fg-subtle",
335
+ children: "Loading..."
336
+ })
337
+ });
338
+ return n ? /* @__PURE__ */ b(y.Suspense, {
339
+ fallback: a,
340
+ children: /* @__PURE__ */ b(Y, {
341
+ data: n,
342
+ set: e,
343
+ onEmojiSelect: (e) => t({
344
+ id: e.id,
345
+ native: e.native
346
+ }),
347
+ theme: i === "dark" ? "dark" : "light",
348
+ previewPosition: "none",
349
+ skinTonePosition: "none"
350
+ })
351
+ }) : a;
173
352
  }
174
- const Ie = d.forwardRef(
175
- function({
176
- content: u = "",
177
- placeholder: f = "Start writing...",
178
- onChange: h,
179
- className: g,
180
- editable: n = !0,
181
- toolbar: t,
182
- onImageUpload: _,
183
- onFileUpload: p,
184
- mentions: k,
185
- onMentionSearch: m,
186
- onMentionSelect: C,
187
- emojiSet: v = "native",
188
- ...R
189
- }, o) {
190
- const z = d.useRef(null), T = d.useRef(!1), [E, w] = d.useState(!1), B = d.useRef(null), N = d.useRef(null), P = d.useRef(null), H = async (s) => {
191
- const r = z.current;
192
- if (r)
193
- if (_) {
194
- const a = await _(s);
195
- a && /^https?:\/\//i.test(a) && r.chain().focus().setImage({ src: a }).run();
196
- } else {
197
- const a = new FileReader();
198
- a.onload = () => {
199
- r.chain().focus().setImage({ src: a.result }).run();
200
- }, a.readAsDataURL(s);
201
- }
202
- }, S = async (s) => {
203
- const r = z.current;
204
- if (!r || !p) return;
205
- const a = await p(s);
206
- r.chain().focus().insertContent({
207
- type: "fileAttachment",
208
- attrs: { url: a.url, name: a.name, size: a.size }
209
- }).run();
210
- }, b = j({
211
- immediatelyRender: !1,
212
- // SSR-safe — prevents hydration mismatch in Next.js
213
- extensions: [
214
- q.configure({
215
- heading: { levels: [2, 3] },
216
- // v3: Underline + Link are now included in StarterKit
217
- link: {
218
- openOnClick: !1,
219
- protocols: ["http", "https", "mailto"],
220
- validate: (s) => /^(https?:\/\/|mailto:)/i.test(s),
221
- HTMLAttributes: {
222
- rel: "noopener noreferrer",
223
- target: "_blank"
224
- }
225
- }
226
- }),
227
- Q.configure({
228
- placeholder: f,
229
- emptyEditorClass: "before:content-[attr(data-placeholder)] before:text-surface-fg-subtle before:float-left before:h-0 before:pointer-events-none"
230
- }),
231
- D.configure({ multicolor: !1 }),
232
- U.configure({
233
- bulletList: !1,
234
- // Already in StarterKit
235
- orderedList: !1,
236
- // Already in StarterKit
237
- listItem: !1,
238
- // Already in StarterKit
239
- listKeymap: !1,
240
- // Already in StarterKit
241
- taskList: {},
242
- taskItem: { nested: !0 }
243
- }),
244
- M.configure({ types: ["heading", "paragraph"] }),
245
- O.configure({
246
- allowBase64: !0,
247
- HTMLAttributes: {
248
- class: "max-w-full rounded-ds-md"
249
- }
250
- }),
251
- W,
252
- ...k || m ? [
253
- K.configure({
254
- HTMLAttributes: { class: "mention" },
255
- suggestion: {
256
- items: async ({ query: s }) => m ? await m(s) : k ? k.filter((r) => r.label.toLowerCase().includes(s.toLowerCase())).slice(0, 8) : [],
257
- render: Y(C)
258
- }
259
- })
260
- ] : [],
261
- X,
262
- Z(v)
263
- ],
264
- content: u,
265
- editable: n,
266
- editorProps: {
267
- handleDrop: (s, r, a, x) => {
268
- if (x || !r.dataTransfer?.files.length) return !1;
269
- const I = r.dataTransfer.files[0];
270
- return I ? I.type.startsWith("image/") ? (H(I), !0) : p ? (S(I), !0) : !1 : !1;
271
- },
272
- handlePaste: (s, r) => {
273
- const a = r.clipboardData?.files[0];
274
- return a ? a.type.startsWith("image/") ? (H(a), !0) : p ? (S(a), !0) : !1 : !1;
275
- },
276
- attributes: {
277
- class: L(
278
- ...J,
279
- "focus:outline-hidden",
280
- "min-h-[120px] px-ds-04 py-ds-04"
281
- )
282
- }
283
- },
284
- onUpdate: ({ editor: s }) => {
285
- T.current = !0, h?.(s.getHTML()), queueMicrotask(() => {
286
- T.current = !1;
287
- });
288
- }
289
- });
290
- return d.useEffect(() => {
291
- z.current = b;
292
- }, [b]), d.useEffect(() => {
293
- if (!E) return;
294
- const s = (r) => {
295
- B.current && !B.current.contains(r.target) && w(!1);
296
- };
297
- return document.addEventListener("mousedown", s), () => document.removeEventListener("mousedown", s);
298
- }, [E]), d.useEffect(() => {
299
- T.current || b && u !== b.getHTML() && b.commands.setContent(u, { emitUpdate: !1 });
300
- }, [b, u]), b ? /* @__PURE__ */ y("div", { ref: o, ...R, className: L("relative", g), children: [
301
- E && /* @__PURE__ */ e(
302
- "div",
303
- {
304
- ref: B,
305
- className: "absolute bottom-full right-0 z-popover mb-ds-02",
306
- onKeyDown: (s) => {
307
- s.key === "Escape" && (s.stopPropagation(), w(!1));
308
- },
309
- children: /* @__PURE__ */ e(
310
- we,
311
- {
312
- set: v,
313
- onSelect: async ({ id: s, native: r }) => {
314
- const a = await G(v), x = F(a, s);
315
- x ? b.chain().focus().insertContent({
316
- type: "emojiNode",
317
- attrs: { id: s, native: x.native, set: v, x: x.x, y: x.y }
318
- }).run() : b.chain().focus().insertContent(r).run(), w(!1);
319
- }
320
- }
321
- )
322
- }
323
- ),
324
- /* @__PURE__ */ y(
325
- "div",
326
- {
327
- className: L(
328
- "overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-raised",
329
- "transition-colors ease-productive-standard focus-within:border-surface-border-strong"
330
- ),
331
- children: [
332
- /* @__PURE__ */ e(
333
- "input",
334
- {
335
- ref: N,
336
- type: "file",
337
- accept: "image/*",
338
- "aria-label": "Upload image",
339
- className: "hidden",
340
- onChange: (s) => {
341
- const r = s.target.files?.[0];
342
- r && H(r), s.target.value = "";
343
- }
344
- }
345
- ),
346
- p && /* @__PURE__ */ e(
347
- "input",
348
- {
349
- ref: P,
350
- type: "file",
351
- "aria-label": "Upload file",
352
- className: "hidden",
353
- onChange: (s) => {
354
- const r = s.target.files?.[0];
355
- r && S(r), s.target.value = "";
356
- }
357
- }
358
- ),
359
- n && /* @__PURE__ */ e(
360
- ye,
361
- {
362
- editor: b,
363
- toolbar: t,
364
- onImageClick: () => N.current?.click(),
365
- onFileClick: p ? () => P.current?.click() : void 0,
366
- onEmojiClick: () => w((s) => !s)
367
- }
368
- ),
369
- /* @__PURE__ */ e($, { editor: b })
370
- ]
371
- }
372
- )
373
- ] }) : null;
374
- }
375
- );
376
- Ie.displayName = "RichTextEditor";
377
- const Re = d.forwardRef(
378
- function({ content: u, className: f, ...h }, g) {
379
- const n = j({
380
- immediatelyRender: !1,
381
- // SSR-safe — prevents hydration mismatch in Next.js
382
- extensions: [
383
- q.configure({
384
- heading: { levels: [2, 3] },
385
- link: {
386
- openOnClick: !0,
387
- protocols: ["http", "https", "mailto"],
388
- validate: (t) => /^(https?:\/\/|mailto:)/i.test(t),
389
- HTMLAttributes: {
390
- rel: "noopener noreferrer",
391
- target: "_blank"
392
- }
393
- }
394
- }),
395
- D.configure({ multicolor: !1 }),
396
- U.configure({
397
- bulletList: !1,
398
- orderedList: !1,
399
- listItem: !1,
400
- listKeymap: !1,
401
- taskList: {},
402
- taskItem: { nested: !0 }
403
- }),
404
- M.configure({ types: ["heading", "paragraph"] }),
405
- O.configure({
406
- allowBase64: !0,
407
- HTMLAttributes: {
408
- class: "max-w-full rounded-ds-md"
409
- }
410
- }),
411
- W,
412
- K.configure({
413
- HTMLAttributes: { class: "mention" }
414
- })
415
- ],
416
- content: u,
417
- editable: !1,
418
- editorProps: {
419
- attributes: {
420
- class: L(...J)
421
- }
422
- }
423
- });
424
- return n ? /* @__PURE__ */ e("div", { ref: g, ...h, className: f, children: /* @__PURE__ */ e($, { editor: n }) }) : null;
425
- }
426
- );
427
- Re.displayName = "RichTextViewer";
428
- export {
429
- Ie as RichTextEditor,
430
- Re as RichTextViewer
431
- };
353
+ var Z = y.forwardRef(function({ content: t = "", placeholder: i = "Start writing...", onChange: v, className: S, editable: C = !0, toolbar: w, onImageUpload: T, onFileUpload: E, mentions: D, onMentionSearch: O, onMentionSelect: k, emojiSet: A = "native", ...j }, M) {
354
+ let N = y.useRef(null), P = y.useRef(!1), [F, I] = y.useState(!1), L = y.useRef(null), R = y.useRef(null), z = y.useRef(null), B = async (e) => {
355
+ let t = N.current;
356
+ if (t) if (T) {
357
+ let n = await T(e);
358
+ n && /^https?:\/\//i.test(n) && t.chain().focus().setImage({ src: n }).run();
359
+ } else {
360
+ let n = new FileReader();
361
+ n.onload = () => {
362
+ t.chain().focus().setImage({ src: n.result }).run();
363
+ }, n.readAsDataURL(e);
364
+ }
365
+ }, V = async (e) => {
366
+ let t = N.current;
367
+ if (!t || !E) return;
368
+ let n = await E(e);
369
+ t.chain().focus().insertContent({
370
+ type: "fileAttachment",
371
+ attrs: {
372
+ url: n.url,
373
+ name: n.name,
374
+ size: n.size
375
+ }
376
+ }).run();
377
+ }, H = s({
378
+ immediatelyRender: !1,
379
+ extensions: [
380
+ u.configure({
381
+ heading: { levels: [2, 3] },
382
+ link: {
383
+ openOnClick: !1,
384
+ protocols: [
385
+ "http",
386
+ "https",
387
+ "mailto"
388
+ ],
389
+ validate: (e) => /^(https?:\/\/|mailto:)/i.test(e),
390
+ HTMLAttributes: {
391
+ rel: "noopener noreferrer",
392
+ target: "_blank"
393
+ }
394
+ }
395
+ }),
396
+ o.configure({
397
+ placeholder: i,
398
+ emptyEditorClass: "before:content-[attr(data-placeholder)] before:text-surface-fg-subtle before:float-left before:h-0 before:pointer-events-none"
399
+ }),
400
+ l.configure({ multicolor: !1 }),
401
+ d.configure({
402
+ bulletList: !1,
403
+ orderedList: !1,
404
+ listItem: !1,
405
+ listKeymap: !1,
406
+ taskList: {},
407
+ taskItem: { nested: !0 }
408
+ }),
409
+ n.configure({ types: ["heading", "paragraph"] }),
410
+ a.configure({
411
+ allowBase64: !0,
412
+ HTMLAttributes: { class: "max-w-full rounded-ds-md" }
413
+ }),
414
+ h,
415
+ ...D || O ? [c.configure({
416
+ HTMLAttributes: { class: "mention" },
417
+ suggestion: {
418
+ items: async ({ query: e }) => O ? await O(e) : D ? D.filter((t) => t.label.toLowerCase().includes(e.toLowerCase())).slice(0, 8) : [],
419
+ render: _(k)
420
+ }
421
+ })] : [],
422
+ g,
423
+ m(A)
424
+ ],
425
+ content: t,
426
+ editable: C,
427
+ editorProps: {
428
+ handleDrop: (e, t, n, r) => {
429
+ if (r || !t.dataTransfer?.files.length) return !1;
430
+ let i = t.dataTransfer.files[0];
431
+ return i ? i.type.startsWith("image/") ? (B(i), !0) : E ? (V(i), !0) : !1 : !1;
432
+ },
433
+ handlePaste: (e, t) => {
434
+ let n = t.clipboardData?.files[0];
435
+ return n ? n.type.startsWith("image/") ? (B(n), !0) : E ? (V(n), !0) : !1 : !1;
436
+ },
437
+ attributes: { class: e(...W, "focus:outline-hidden", "min-h-[120px] px-ds-04 py-ds-04") }
438
+ },
439
+ onUpdate: ({ editor: e }) => {
440
+ P.current = !0, v?.(e.getHTML()), queueMicrotask(() => {
441
+ P.current = !1;
442
+ });
443
+ }
444
+ });
445
+ return y.useEffect(() => {
446
+ N.current = H;
447
+ }, [H]), y.useEffect(() => {
448
+ if (!F) return;
449
+ let e = (e) => {
450
+ L.current && !L.current.contains(e.target) && I(!1);
451
+ };
452
+ return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
453
+ }, [F]), y.useEffect(() => {
454
+ P.current || H && t !== H.getHTML() && H.commands.setContent(t, { emitUpdate: !1 });
455
+ }, [H, t]), H ? /* @__PURE__ */ x("div", {
456
+ ref: M,
457
+ ...j,
458
+ className: e("relative", S),
459
+ children: [F && /* @__PURE__ */ b("div", {
460
+ ref: L,
461
+ className: "absolute bottom-full right-0 z-popover mb-ds-02",
462
+ onKeyDown: (e) => {
463
+ e.key === "Escape" && (e.stopPropagation(), I(!1));
464
+ },
465
+ children: /* @__PURE__ */ b(X, {
466
+ set: A,
467
+ onSelect: async ({ id: e, native: t }) => {
468
+ let n = f(await p(A), e);
469
+ n ? H.chain().focus().insertContent({
470
+ type: "emojiNode",
471
+ attrs: {
472
+ id: e,
473
+ native: n.native,
474
+ set: A,
475
+ x: n.x,
476
+ y: n.y
477
+ }
478
+ }).run() : H.chain().focus().insertContent(t).run(), I(!1);
479
+ }
480
+ })
481
+ }), /* @__PURE__ */ x("div", {
482
+ className: e("overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-raised", "transition-colors ease-productive-standard focus-within:border-surface-border-strong"),
483
+ children: [
484
+ /* @__PURE__ */ b("input", {
485
+ ref: R,
486
+ type: "file",
487
+ accept: "image/*",
488
+ "aria-label": "Upload image",
489
+ className: "hidden",
490
+ onChange: (e) => {
491
+ let t = e.target.files?.[0];
492
+ t && B(t), e.target.value = "";
493
+ }
494
+ }),
495
+ E && /* @__PURE__ */ b("input", {
496
+ ref: z,
497
+ type: "file",
498
+ "aria-label": "Upload file",
499
+ className: "hidden",
500
+ onChange: (e) => {
501
+ let t = e.target.files?.[0];
502
+ t && V(t), e.target.value = "";
503
+ }
504
+ }),
505
+ C && /* @__PURE__ */ b(J, {
506
+ editor: H,
507
+ toolbar: w,
508
+ onImageClick: () => R.current?.click(),
509
+ onFileClick: E ? () => z.current?.click() : void 0,
510
+ onEmojiClick: () => I((e) => !e)
511
+ }),
512
+ /* @__PURE__ */ b(r, { editor: H })
513
+ ]
514
+ })]
515
+ }) : null;
516
+ });
517
+ Z.displayName = "RichTextEditor";
518
+ var Q = y.forwardRef(function({ content: t, className: i, ...o }, f) {
519
+ let p = s({
520
+ immediatelyRender: !1,
521
+ extensions: [
522
+ u.configure({
523
+ heading: { levels: [2, 3] },
524
+ link: {
525
+ openOnClick: !0,
526
+ protocols: [
527
+ "http",
528
+ "https",
529
+ "mailto"
530
+ ],
531
+ validate: (e) => /^(https?:\/\/|mailto:)/i.test(e),
532
+ HTMLAttributes: {
533
+ rel: "noopener noreferrer",
534
+ target: "_blank"
535
+ }
536
+ }
537
+ }),
538
+ l.configure({ multicolor: !1 }),
539
+ d.configure({
540
+ bulletList: !1,
541
+ orderedList: !1,
542
+ listItem: !1,
543
+ listKeymap: !1,
544
+ taskList: {},
545
+ taskItem: { nested: !0 }
546
+ }),
547
+ n.configure({ types: ["heading", "paragraph"] }),
548
+ a.configure({
549
+ allowBase64: !0,
550
+ HTMLAttributes: { class: "max-w-full rounded-ds-md" }
551
+ }),
552
+ h,
553
+ c.configure({ HTMLAttributes: { class: "mention" } })
554
+ ],
555
+ content: t,
556
+ editable: !1,
557
+ editorProps: { attributes: { class: e(...W) } }
558
+ });
559
+ return p ? /* @__PURE__ */ b("div", {
560
+ ref: f,
561
+ ...o,
562
+ className: i,
563
+ children: /* @__PURE__ */ b(r, { editor: p })
564
+ }) : null;
565
+ });
566
+ Q.displayName = "RichTextViewer";
567
+ //#endregion
568
+ export { Z as RichTextEditor, Q as RichTextViewer };