@react-email/editor 0.0.0-experimental.38 → 0.0.0-experimental.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  const require_event_bus = require('./event-bus-fb8U7hrl.cjs');
2
2
  const require_extensions = require('./extensions-aMMnHcs9.cjs');
3
3
  const require_extension = require('./extension-dGpPpEvD.cjs');
4
- const require_root = require('./root-CNVO39XG.cjs');
4
+ const require_root = require('./root-Gu08xybW.cjs');
5
5
  let _tiptap_extensions = require("@tiptap/extensions");
6
6
  let _tiptap_react = require("@tiptap/react");
7
7
  let react = require("react");
@@ -58,12 +58,12 @@ const EmailEditor = (0, react.forwardRef)(({ content, onChange, onUploadImage, o
58
58
  children: [
59
59
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RefBridge, { editorRef: ref }),
60
60
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.BubbleMenuDefault, {
61
- excludeNodes: bubbleMenu?.excludeNodes ?? ["button"],
62
- excludeMarks: bubbleMenu?.excludeMarks ?? ["link"]
61
+ hideWhenActiveNodes: bubbleMenu?.hideWhenActiveNodes ?? ["button"],
62
+ hideWhenActiveMarks: bubbleMenu?.hideWhenActiveMarks ?? ["link"]
63
63
  }),
64
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.LinkBubbleMenuDefault, {}),
65
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.ButtonBubbleMenuDefault, {}),
66
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.ImageBubbleMenuDefault, {}),
64
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.BubbleMenuLinkDefault, {}),
65
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.BubbleMenuButtonDefault, {}),
66
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.BubbleMenuImageDefault, {}),
67
67
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_root.SlashCommandRoot, {})
68
68
  ]
69
69
  }, theme);
package/dist/index.css CHANGED
@@ -145,22 +145,14 @@
145
145
  height: 0.875rem;
146
146
  }
147
147
 
148
- /* Minimal functional styles for LinkBubbleMenu compound components.
149
- * Layout and positioning only - no visual design.
150
- * Import optionally: import '@react-email/editor/styles/link-bubble-menu.css';
151
- */
148
+ /* Button bubble menu */
152
149
 
153
- [data-re-link-bm] {
154
- display: flex;
155
- align-items: center;
156
- }
157
-
158
- [data-re-link-bm-toolbar] {
150
+ [data-re-btn-bm-toolbar] {
159
151
  display: flex;
160
152
  align-items: center;
161
153
  }
162
154
 
163
- [data-re-link-bm-item] {
155
+ [data-re-btn-bm-item] {
164
156
  display: inline-flex;
165
157
  align-items: center;
166
158
  justify-content: center;
@@ -170,17 +162,12 @@
170
162
  padding: 0.375rem;
171
163
  }
172
164
 
173
- [data-re-link-bm-item] svg {
165
+ [data-re-btn-bm-item] svg {
174
166
  width: 0.875rem;
175
167
  height: 0.875rem;
176
168
  }
177
169
 
178
- a[data-re-link-bm-item] {
179
- text-decoration: none;
180
- color: inherit;
181
- }
182
-
183
- [data-re-link-bm-form] {
170
+ [data-re-btn-bm-form] {
184
171
  display: flex;
185
172
  align-items: center;
186
173
  gap: 0.25rem;
@@ -188,7 +175,7 @@ a[data-re-link-bm-item] {
188
175
  padding: 0.25rem;
189
176
  }
190
177
 
191
- [data-re-link-bm-input] {
178
+ [data-re-btn-bm-input] {
192
179
  flex: 1;
193
180
  border: none;
194
181
  outline: none;
@@ -197,8 +184,8 @@ a[data-re-link-bm-item] {
197
184
  background: transparent;
198
185
  }
199
186
 
200
- [data-re-link-bm-apply],
201
- [data-re-link-bm-unlink] {
187
+ [data-re-btn-bm-apply],
188
+ [data-re-btn-bm-unlink] {
202
189
  display: inline-flex;
203
190
  align-items: center;
204
191
  justify-content: center;
@@ -208,28 +195,20 @@ a[data-re-link-bm-item] {
208
195
  padding: 0.25rem;
209
196
  }
210
197
 
211
- [data-re-link-bm-apply] svg,
212
- [data-re-link-bm-unlink] svg {
198
+ [data-re-btn-bm-apply] svg,
199
+ [data-re-btn-bm-unlink] svg {
213
200
  width: 0.875rem;
214
201
  height: 0.875rem;
215
202
  }
216
203
 
217
- /* Minimal functional styles for ButtonBubbleMenu compound components.
218
- * Layout and positioning only - no visual design.
219
- * Import optionally: import '@react-email/editor/styles/button-bubble-menu.css';
220
- */
204
+ /* Link bubble menu */
221
205
 
222
- [data-re-btn-bm] {
223
- display: flex;
224
- align-items: center;
225
- }
226
-
227
- [data-re-btn-bm-toolbar] {
206
+ [data-re-link-bm-toolbar] {
228
207
  display: flex;
229
208
  align-items: center;
230
209
  }
231
210
 
232
- [data-re-btn-bm-item] {
211
+ [data-re-link-bm-item] {
233
212
  display: inline-flex;
234
213
  align-items: center;
235
214
  justify-content: center;
@@ -239,12 +218,17 @@ a[data-re-link-bm-item] {
239
218
  padding: 0.375rem;
240
219
  }
241
220
 
242
- [data-re-btn-bm-item] svg {
221
+ [data-re-link-bm-item] svg {
243
222
  width: 0.875rem;
244
223
  height: 0.875rem;
245
224
  }
246
225
 
247
- [data-re-btn-bm-form] {
226
+ a[data-re-link-bm-item] {
227
+ text-decoration: none;
228
+ color: inherit;
229
+ }
230
+
231
+ [data-re-link-bm-form] {
248
232
  display: flex;
249
233
  align-items: center;
250
234
  gap: 0.25rem;
@@ -252,7 +236,7 @@ a[data-re-link-bm-item] {
252
236
  padding: 0.25rem;
253
237
  }
254
238
 
255
- [data-re-btn-bm-input] {
239
+ [data-re-link-bm-input] {
256
240
  flex: 1;
257
241
  border: none;
258
242
  outline: none;
@@ -261,8 +245,8 @@ a[data-re-link-bm-item] {
261
245
  background: transparent;
262
246
  }
263
247
 
264
- [data-re-btn-bm-apply],
265
- [data-re-btn-bm-unlink] {
248
+ [data-re-link-bm-apply],
249
+ [data-re-link-bm-unlink] {
266
250
  display: inline-flex;
267
251
  align-items: center;
268
252
  justify-content: center;
@@ -272,21 +256,13 @@ a[data-re-link-bm-item] {
272
256
  padding: 0.25rem;
273
257
  }
274
258
 
275
- [data-re-btn-bm-apply] svg,
276
- [data-re-btn-bm-unlink] svg {
259
+ [data-re-link-bm-apply] svg,
260
+ [data-re-link-bm-unlink] svg {
277
261
  width: 0.875rem;
278
262
  height: 0.875rem;
279
263
  }
280
264
 
281
- /* Minimal functional styles for ImageBubbleMenu compound components.
282
- * Layout and positioning only - no visual design.
283
- * Import optionally: import '@react-email/editor/styles/image-bubble-menu.css';
284
- */
285
-
286
- [data-re-img-bm] {
287
- display: flex;
288
- align-items: center;
289
- }
265
+ /* Image bubble menu */
290
266
 
291
267
  [data-re-img-bm-toolbar] {
292
268
  display: flex;
@@ -428,10 +404,7 @@ a[data-re-link-bm-item] {
428
404
  * Root containers
429
405
  * ---------------------------------------------------------------- */
430
406
 
431
- [data-re-bubble-menu],
432
- [data-re-link-bm],
433
- [data-re-btn-bm],
434
- [data-re-img-bm] {
407
+ [data-re-bubble-menu] {
435
408
  background: var(--re-bg);
436
409
  border: 1px solid var(--re-border);
437
410
  border-radius: var(--re-radius);
@@ -1 +1 @@
1
- {"version":3,"file":"index.css","names":[],"sources":["../src/ui/bubble-menu/bubble-menu.css","../src/ui/link-bubble-menu/link-bubble-menu.css","../src/ui/button-bubble-menu/button-bubble-menu.css","../src/ui/image-bubble-menu/image-bubble-menu.css","../src/ui/slash-command/slash-command.css","../src/ui/themes/default.css"],"sourcesContent":["/* Minimal functional styles for BubbleMenu compound components.\n * This file handles layout and positioning only - no visual design.\n * Import this optionally: import '@react-email/editor/styles/bubble-menu.css';\n */\n\n[data-re-bubble-menu] {\n display: flex;\n align-items: center;\n gap: 0.125rem;\n}\n\n[data-re-bubble-menu-group] {\n display: flex;\n align-items: center;\n gap: 0.125rem;\n padding: 0 0.125rem;\n border: none;\n margin: 0;\n min-width: 0;\n}\n\n[data-re-bubble-menu-separator] {\n align-self: stretch;\n width: 1px;\n margin: 0.25rem 0;\n}\n\n[data-re-bubble-menu-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-bubble-menu-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-node-selector] {\n position: relative;\n}\n\n[data-re-node-selector-trigger] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n cursor: pointer;\n border: none;\n background: none;\n white-space: nowrap;\n font-size: 0.8125rem;\n padding: 0.375rem 0.5rem;\n}\n\n[data-re-node-selector-trigger] svg {\n width: 0.75rem;\n height: 0.75rem;\n opacity: 0.5;\n}\n\n[data-re-node-selector-content] {\n display: flex;\n flex-direction: column;\n min-width: 10rem;\n}\n\n[data-re-node-selector-item] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem 0.5rem;\n font-size: 0.8125rem;\n width: 100%;\n text-align: left;\n}\n\n[data-re-node-selector-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-link-selector] {\n display: flex;\n position: relative;\n}\n\n[data-re-link-selector-trigger] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-link-selector-trigger] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-link-selector-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n position: absolute;\n top: 100%;\n left: 0;\n margin-top: 0.25rem;\n width: max-content;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-link-selector-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-link-selector-apply],\n[data-re-link-selector-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-link-selector-apply] svg,\n[data-re-link-selector-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n","/* Minimal functional styles for LinkBubbleMenu compound components.\n * Layout and positioning only - no visual design.\n * Import optionally: import '@react-email/editor/styles/link-bubble-menu.css';\n */\n\n[data-re-link-bm] {\n display: flex;\n align-items: center;\n}\n\n[data-re-link-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-link-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-link-bm-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\na[data-re-link-bm-item] {\n text-decoration: none;\n color: inherit;\n}\n\n[data-re-link-bm-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-link-bm-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-link-bm-apply],\n[data-re-link-bm-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-link-bm-apply] svg,\n[data-re-link-bm-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n","/* Minimal functional styles for ButtonBubbleMenu compound components.\n * Layout and positioning only - no visual design.\n * Import optionally: import '@react-email/editor/styles/button-bubble-menu.css';\n */\n\n[data-re-btn-bm] {\n display: flex;\n align-items: center;\n}\n\n[data-re-btn-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-btn-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-btn-bm-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-btn-bm-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-btn-bm-apply],\n[data-re-btn-bm-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-apply] svg,\n[data-re-btn-bm-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n","/* Minimal functional styles for ImageBubbleMenu compound components.\n * Layout and positioning only - no visual design.\n * Import optionally: import '@react-email/editor/styles/image-bubble-menu.css';\n */\n\n[data-re-img-bm] {\n display: flex;\n align-items: center;\n}\n\n[data-re-img-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-img-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.5rem;\n}\n\n[data-re-img-bm-item] svg {\n width: 1rem;\n height: 1rem;\n}\n","/* Minimal functional styles for SlashCommand components.\n * Layout and positioning only - no visual design.\n * Import optionally: import '@react-email/editor/styles/slash-command.css';\n */\n\n[data-re-slash-command] {\n max-height: 330px;\n overflow-y: auto;\n width: 256px;\n padding: 0.25rem;\n}\n\n[data-re-slash-command-item] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n width: 100%;\n padding: 0.375rem 0.5rem;\n border: none;\n border-radius: 0.375rem;\n background: none;\n cursor: pointer;\n font-size: 0.875rem;\n line-height: 1.25rem;\n text-align: left;\n}\n\n[data-re-slash-command-item] svg {\n flex-shrink: 0;\n}\n\n[data-re-slash-command-category] {\n font-size: 0.6875rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n padding: 0.5rem 0.5rem 0.25rem;\n}\n\n[data-re-slash-command-empty] {\n padding: 0.75rem 0.5rem;\n font-size: 0.875rem;\n text-align: center;\n}\n","/* Default theme for @react-email/editor bubble menu primitives.\n *\n * Opt-in: import '@react-email/editor/themes/default.css';\n *\n * Override any variable on a parent element:\n * .my-editor { --re-bg: #1a1a1a; --re-border: #333; }\n */\n\n/* Layer 0: layout (inlined at build time via postcss-import) */\n@import \"../bubble-menu/bubble-menu.css\";\n@import \"../link-bubble-menu/link-bubble-menu.css\";\n@import \"../button-bubble-menu/button-bubble-menu.css\";\n@import \"../image-bubble-menu/image-bubble-menu.css\";\n@import \"../slash-command/slash-command.css\";\n\n/* ----------------------------------------------------------------\n * CSS custom properties — light defaults\n * ---------------------------------------------------------------- */\n\n:root {\n --re-bg: #fff;\n --re-border: #e5e5e5;\n --re-text: #1c1c1c;\n --re-text-muted: #6b6b6b;\n --re-hover: rgba(0, 0, 0, 0.04);\n --re-active: rgba(0, 0, 0, 0.06);\n --re-pressed: rgba(0, 0, 0, 0.06);\n --re-separator: #e5e5e5;\n --re-radius: 0.75rem;\n --re-radius-sm: 0.5rem;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --re-danger: #dc2626;\n --re-danger-hover: rgba(220, 38, 38, 0.1);\n}\n\n/* ----------------------------------------------------------------\n * Dark mode — prefers-color-scheme\n * ---------------------------------------------------------------- */\n\n@media (prefers-color-scheme: dark) {\n :root {\n --re-bg: #1c1c1c;\n --re-border: #2e2e2e;\n --re-text: #ececec;\n --re-text-muted: #a0a0a0;\n --re-hover: rgba(255, 255, 255, 0.06);\n --re-active: rgba(255, 255, 255, 0.09);\n --re-pressed: rgba(255, 255, 255, 0.09);\n --re-separator: #2e2e2e;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3);\n --re-danger: #f87171;\n --re-danger-hover: rgba(248, 113, 113, 0.15);\n }\n}\n\n/* ----------------------------------------------------------------\n * Dark mode — .dark class override\n * ---------------------------------------------------------------- */\n\n.dark {\n --re-bg: #1c1c1c;\n --re-border: #2e2e2e;\n --re-text: #ececec;\n --re-text-muted: #a0a0a0;\n --re-hover: rgba(255, 255, 255, 0.06);\n --re-active: rgba(255, 255, 255, 0.09);\n --re-pressed: rgba(255, 255, 255, 0.09);\n --re-separator: #2e2e2e;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3);\n --re-danger: #f87171;\n --re-danger-hover: rgba(248, 113, 113, 0.15);\n}\n\n/* ----------------------------------------------------------------\n * Root containers\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu],\n[data-re-link-bm],\n[data-re-btn-bm],\n[data-re-img-bm] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n z-index: 50;\n padding: 0.125rem;\n font-family: system-ui, -apple-system, sans-serif;\n font-size: 0.8125rem;\n line-height: 1;\n}\n\n/* ----------------------------------------------------------------\n * Toolbars (link, button, image bubble menus)\n * ---------------------------------------------------------------- */\n\n[data-re-img-bm-toolbar] > * + * {\n border-left: 1px solid var(--re-border);\n}\n\n/* ----------------------------------------------------------------\n * Item buttons (all bubble menus)\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu-item],\n[data-re-link-bm-item],\n[data-re-btn-bm-item],\n[data-re-img-bm-item] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-bubble-menu-item]:hover,\n[data-re-link-bm-item]:hover,\n[data-re-btn-bm-item]:hover,\n[data-re-img-bm-item]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-bubble-menu-item]:active,\n[data-re-link-bm-item]:active,\n[data-re-btn-bm-item]:active,\n[data-re-img-bm-item]:active {\n background: var(--re-active);\n}\n\n/* Active / pressed state */\n[data-re-bubble-menu-item][data-active],\n[data-re-bubble-menu-item][aria-pressed=\"true\"] {\n background: var(--re-pressed);\n color: var(--re-text);\n}\n\n/* ----------------------------------------------------------------\n * Separator (text bubble menu)\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu-separator] {\n background: var(--re-separator);\n}\n\n/* ----------------------------------------------------------------\n * Node Selector\n * ---------------------------------------------------------------- */\n\n[data-re-node-selector-trigger] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n font-weight: 500;\n}\n\n[data-re-node-selector-trigger]:hover {\n background: var(--re-hover);\n}\n\n[data-re-node-selector-trigger]:active {\n background: var(--re-active);\n}\n\n[data-re-node-selector-content] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n padding: 0.25rem;\n margin-top: 0.25rem;\n z-index: 50;\n}\n\n[data-re-node-selector-item] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-node-selector-item]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-node-selector-item][data-active] {\n color: var(--re-text);\n}\n\n/* ----------------------------------------------------------------\n * Link Selector (text bubble menu)\n * ---------------------------------------------------------------- */\n\n[data-re-link-selector-trigger] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-link-selector-trigger]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-link-selector-trigger][aria-pressed=\"true\"] {\n background: var(--re-pressed);\n}\n\n[data-re-link-selector-form] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n padding: 0.25rem;\n}\n\n[data-re-link-selector-input] {\n color: var(--re-text);\n}\n\n[data-re-link-selector-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-link-selector-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-selector-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-link-selector-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-selector-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Link Bubble Menu Form\n * ---------------------------------------------------------------- */\n\n[data-re-link-bm-form] {\n background: var(--re-bg);\n padding: 0.25rem;\n}\n\n[data-re-link-bm-input] {\n color: var(--re-text);\n}\n\n[data-re-link-bm-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-link-bm-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-bm-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-link-bm-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-bm-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Button Bubble Menu Form\n * ---------------------------------------------------------------- */\n\n[data-re-btn-bm-form] {\n background: var(--re-bg);\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-input] {\n color: var(--re-text);\n}\n\n[data-re-btn-bm-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-btn-bm-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-btn-bm-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-btn-bm-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-btn-bm-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Slash Command\n * ---------------------------------------------------------------- */\n\n[data-re-slash-command] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n font-family: system-ui, -apple-system, sans-serif;\n}\n\n[data-re-slash-command-item] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-slash-command-item]:hover {\n background: var(--re-hover);\n}\n\n[data-re-slash-command-item][data-selected] {\n background: var(--re-hover);\n}\n\n[data-re-slash-command-item]:active {\n background: var(--re-active);\n}\n\n[data-re-slash-command-item] svg {\n color: var(--re-text-muted);\n}\n\n[data-re-slash-command-category] {\n color: var(--re-text-muted);\n}\n\n[data-re-slash-command-empty] {\n color: var(--re-text-muted);\n}\n\n/* ----------------------------------------------------------------\n * Editor content — alignment attribute\n * ---------------------------------------------------------------- */\n\n.tiptap [alignment=\"left\"] {\n text-align: left;\n}\n\n.tiptap [alignment=\"center\"] {\n text-align: center;\n}\n\n.tiptap [alignment=\"right\"] {\n text-align: right;\n}\n\n.tiptap [alignment=\"justify\"] {\n text-align: justify;\n}\n\n/* ----------------------------------------------------------------\n * Editor content — columns\n * ---------------------------------------------------------------- */\n\n.tiptap .node-columns {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.tiptap .node-column {\n flex: 1;\n min-width: 0;\n}\n\n/* ----------------------------------------------------------------\n * Editor content — base typography\n * ---------------------------------------------------------------- */\n\n.tiptap {\n outline: none;\n color: var(--re-text);\n}\n\n.tiptap p {\n margin: 0.25em 0;\n}\n\n.tiptap h1,\n.tiptap h2,\n.tiptap h3 {\n margin: 0.5em 0 0.25em;\n font-weight: 700;\n}\n\n.tiptap h1 {\n font-size: 2em;\n}\n\n.tiptap h2 {\n font-size: 1.5em;\n}\n\n.tiptap h3 {\n font-size: 1.17em;\n}\n\n.tiptap a:not(.node-button) {\n color: #2563eb;\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: text;\n}\n\n.tiptap .node-button {\n display: inline-block;\n padding: 0.625em 1.25em;\n background-color: #000;\n color: #fff;\n border-radius: 0.375em;\n font-weight: 500;\n font-size: 0.875em;\n text-decoration: none;\n text-align: center;\n cursor: text;\n}\n\n.tiptap blockquote {\n border-left: 3px solid var(--re-border);\n margin: 0.5em 0;\n padding-left: 1em;\n color: var(--re-text-muted);\n}\n\n.tiptap hr {\n border: none;\n border-top: 1px solid var(--re-border);\n margin: 1em 0;\n}\n\n.tiptap code {\n background: var(--re-hover);\n border-radius: 0.25rem;\n padding: 0.125rem 0.375rem;\n font-size: 0.875em;\n}\n\n.tiptap pre {\n background: var(--re-hover);\n border-radius: var(--re-radius-sm);\n padding: 0.75rem 1rem;\n overflow-x: auto;\n}\n\n.tiptap pre code {\n background: none;\n padding: 0;\n border-radius: 0;\n}\n\n.tiptap ul {\n list-style-type: disc;\n padding-left: 1.5em;\n margin: 0.25em 0;\n}\n\n.tiptap ol {\n list-style-type: decimal;\n padding-left: 1.5em;\n margin: 0.25em 0;\n}\n\n.tiptap .node-placeholder::before {\n color: var(--re-text-muted);\n content: attr(data-placeholder);\n float: left;\n height: 0;\n pointer-events: none;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;ACjJA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;ACnEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AC9DA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AC5BA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AC3CA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAOA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA"}
1
+ {"version":3,"file":"index.css","names":[],"sources":["../src/ui/bubble-menu/bubble-menu.css","../src/ui/slash-command/slash-command.css","../src/ui/themes/default.css"],"sourcesContent":["/* Minimal functional styles for BubbleMenu compound components.\n * This file handles layout and positioning only - no visual design.\n * Import this optionally: import '@react-email/editor/styles/bubble-menu.css';\n */\n\n[data-re-bubble-menu] {\n display: flex;\n align-items: center;\n gap: 0.125rem;\n}\n\n[data-re-bubble-menu-group] {\n display: flex;\n align-items: center;\n gap: 0.125rem;\n padding: 0 0.125rem;\n border: none;\n margin: 0;\n min-width: 0;\n}\n\n[data-re-bubble-menu-separator] {\n align-self: stretch;\n width: 1px;\n margin: 0.25rem 0;\n}\n\n[data-re-bubble-menu-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-bubble-menu-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-node-selector] {\n position: relative;\n}\n\n[data-re-node-selector-trigger] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n cursor: pointer;\n border: none;\n background: none;\n white-space: nowrap;\n font-size: 0.8125rem;\n padding: 0.375rem 0.5rem;\n}\n\n[data-re-node-selector-trigger] svg {\n width: 0.75rem;\n height: 0.75rem;\n opacity: 0.5;\n}\n\n[data-re-node-selector-content] {\n display: flex;\n flex-direction: column;\n min-width: 10rem;\n}\n\n[data-re-node-selector-item] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem 0.5rem;\n font-size: 0.8125rem;\n width: 100%;\n text-align: left;\n}\n\n[data-re-node-selector-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-link-selector] {\n display: flex;\n position: relative;\n}\n\n[data-re-link-selector-trigger] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-link-selector-trigger] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-link-selector-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n position: absolute;\n top: 100%;\n left: 0;\n margin-top: 0.25rem;\n width: max-content;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-link-selector-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-link-selector-apply],\n[data-re-link-selector-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-link-selector-apply] svg,\n[data-re-link-selector-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* Button bubble menu */\n\n[data-re-btn-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-btn-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-btn-bm-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n[data-re-btn-bm-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-btn-bm-apply],\n[data-re-btn-bm-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-apply] svg,\n[data-re-btn-bm-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* Link bubble menu */\n\n[data-re-link-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-link-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.375rem;\n}\n\n[data-re-link-bm-item] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\na[data-re-link-bm-item] {\n text-decoration: none;\n color: inherit;\n}\n\n[data-re-link-bm-form] {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n min-width: 16rem;\n padding: 0.25rem;\n}\n\n[data-re-link-bm-input] {\n flex: 1;\n border: none;\n outline: none;\n font-size: 0.8125rem;\n padding: 0.25rem;\n background: transparent;\n}\n\n[data-re-link-bm-apply],\n[data-re-link-bm-unlink] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.25rem;\n}\n\n[data-re-link-bm-apply] svg,\n[data-re-link-bm-unlink] svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* Image bubble menu */\n\n[data-re-img-bm-toolbar] {\n display: flex;\n align-items: center;\n}\n\n[data-re-img-bm-item] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n background: none;\n padding: 0.5rem;\n}\n\n[data-re-img-bm-item] svg {\n width: 1rem;\n height: 1rem;\n}\n","/* Minimal functional styles for SlashCommand components.\n * Layout and positioning only - no visual design.\n * Import optionally: import '@react-email/editor/styles/slash-command.css';\n */\n\n[data-re-slash-command] {\n max-height: 330px;\n overflow-y: auto;\n width: 256px;\n padding: 0.25rem;\n}\n\n[data-re-slash-command-item] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n width: 100%;\n padding: 0.375rem 0.5rem;\n border: none;\n border-radius: 0.375rem;\n background: none;\n cursor: pointer;\n font-size: 0.875rem;\n line-height: 1.25rem;\n text-align: left;\n}\n\n[data-re-slash-command-item] svg {\n flex-shrink: 0;\n}\n\n[data-re-slash-command-category] {\n font-size: 0.6875rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n padding: 0.5rem 0.5rem 0.25rem;\n}\n\n[data-re-slash-command-empty] {\n padding: 0.75rem 0.5rem;\n font-size: 0.875rem;\n text-align: center;\n}\n","/* Default theme for @react-email/editor bubble menu primitives.\n *\n * Opt-in: import '@react-email/editor/themes/default.css';\n *\n * Override any variable on a parent element:\n * .my-editor { --re-bg: #1a1a1a; --re-border: #333; }\n */\n\n/* Layer 0: layout (inlined at build time via postcss-import) */\n@import \"../bubble-menu/bubble-menu.css\";\n@import \"../slash-command/slash-command.css\";\n\n/* ----------------------------------------------------------------\n * CSS custom properties — light defaults\n * ---------------------------------------------------------------- */\n\n:root {\n --re-bg: #fff;\n --re-border: #e5e5e5;\n --re-text: #1c1c1c;\n --re-text-muted: #6b6b6b;\n --re-hover: rgba(0, 0, 0, 0.04);\n --re-active: rgba(0, 0, 0, 0.06);\n --re-pressed: rgba(0, 0, 0, 0.06);\n --re-separator: #e5e5e5;\n --re-radius: 0.75rem;\n --re-radius-sm: 0.5rem;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --re-danger: #dc2626;\n --re-danger-hover: rgba(220, 38, 38, 0.1);\n}\n\n/* ----------------------------------------------------------------\n * Dark mode — prefers-color-scheme\n * ---------------------------------------------------------------- */\n\n@media (prefers-color-scheme: dark) {\n :root {\n --re-bg: #1c1c1c;\n --re-border: #2e2e2e;\n --re-text: #ececec;\n --re-text-muted: #a0a0a0;\n --re-hover: rgba(255, 255, 255, 0.06);\n --re-active: rgba(255, 255, 255, 0.09);\n --re-pressed: rgba(255, 255, 255, 0.09);\n --re-separator: #2e2e2e;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3);\n --re-danger: #f87171;\n --re-danger-hover: rgba(248, 113, 113, 0.15);\n }\n}\n\n/* ----------------------------------------------------------------\n * Dark mode — .dark class override\n * ---------------------------------------------------------------- */\n\n.dark {\n --re-bg: #1c1c1c;\n --re-border: #2e2e2e;\n --re-text: #ececec;\n --re-text-muted: #a0a0a0;\n --re-hover: rgba(255, 255, 255, 0.06);\n --re-active: rgba(255, 255, 255, 0.09);\n --re-pressed: rgba(255, 255, 255, 0.09);\n --re-separator: #2e2e2e;\n --re-shadow:\n 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3);\n --re-danger: #f87171;\n --re-danger-hover: rgba(248, 113, 113, 0.15);\n}\n\n/* ----------------------------------------------------------------\n * Root containers\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n z-index: 50;\n padding: 0.125rem;\n font-family: system-ui, -apple-system, sans-serif;\n font-size: 0.8125rem;\n line-height: 1;\n}\n\n/* ----------------------------------------------------------------\n * Toolbars (link, button, image bubble menus)\n * ---------------------------------------------------------------- */\n\n[data-re-img-bm-toolbar] > * + * {\n border-left: 1px solid var(--re-border);\n}\n\n/* ----------------------------------------------------------------\n * Item buttons (all bubble menus)\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu-item],\n[data-re-link-bm-item],\n[data-re-btn-bm-item],\n[data-re-img-bm-item] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-bubble-menu-item]:hover,\n[data-re-link-bm-item]:hover,\n[data-re-btn-bm-item]:hover,\n[data-re-img-bm-item]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-bubble-menu-item]:active,\n[data-re-link-bm-item]:active,\n[data-re-btn-bm-item]:active,\n[data-re-img-bm-item]:active {\n background: var(--re-active);\n}\n\n/* Active / pressed state */\n[data-re-bubble-menu-item][data-active],\n[data-re-bubble-menu-item][aria-pressed=\"true\"] {\n background: var(--re-pressed);\n color: var(--re-text);\n}\n\n/* ----------------------------------------------------------------\n * Separator (text bubble menu)\n * ---------------------------------------------------------------- */\n\n[data-re-bubble-menu-separator] {\n background: var(--re-separator);\n}\n\n/* ----------------------------------------------------------------\n * Node Selector\n * ---------------------------------------------------------------- */\n\n[data-re-node-selector-trigger] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n font-weight: 500;\n}\n\n[data-re-node-selector-trigger]:hover {\n background: var(--re-hover);\n}\n\n[data-re-node-selector-trigger]:active {\n background: var(--re-active);\n}\n\n[data-re-node-selector-content] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n padding: 0.25rem;\n margin-top: 0.25rem;\n z-index: 50;\n}\n\n[data-re-node-selector-item] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-node-selector-item]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-node-selector-item][data-active] {\n color: var(--re-text);\n}\n\n/* ----------------------------------------------------------------\n * Link Selector (text bubble menu)\n * ---------------------------------------------------------------- */\n\n[data-re-link-selector-trigger] {\n color: var(--re-text-muted);\n border-radius: var(--re-radius-sm);\n transition:\n background-color 0.15s,\n color 0.15s;\n}\n\n[data-re-link-selector-trigger]:hover {\n background: var(--re-hover);\n color: var(--re-text);\n}\n\n[data-re-link-selector-trigger][aria-pressed=\"true\"] {\n background: var(--re-pressed);\n}\n\n[data-re-link-selector-form] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n padding: 0.25rem;\n}\n\n[data-re-link-selector-input] {\n color: var(--re-text);\n}\n\n[data-re-link-selector-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-link-selector-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-selector-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-link-selector-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-selector-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Link Bubble Menu Form\n * ---------------------------------------------------------------- */\n\n[data-re-link-bm-form] {\n background: var(--re-bg);\n padding: 0.25rem;\n}\n\n[data-re-link-bm-input] {\n color: var(--re-text);\n}\n\n[data-re-link-bm-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-link-bm-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-bm-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-link-bm-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-link-bm-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Button Bubble Menu Form\n * ---------------------------------------------------------------- */\n\n[data-re-btn-bm-form] {\n background: var(--re-bg);\n padding: 0.25rem;\n}\n\n[data-re-btn-bm-input] {\n color: var(--re-text);\n}\n\n[data-re-btn-bm-input]::placeholder {\n color: var(--re-text-muted);\n}\n\n[data-re-btn-bm-apply] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-btn-bm-apply]:hover {\n background: var(--re-hover);\n}\n\n[data-re-btn-bm-unlink] {\n color: var(--re-danger);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-btn-bm-unlink]:hover {\n background: var(--re-danger-hover);\n}\n\n/* ----------------------------------------------------------------\n * Slash Command\n * ---------------------------------------------------------------- */\n\n[data-re-slash-command] {\n background: var(--re-bg);\n border: 1px solid var(--re-border);\n border-radius: var(--re-radius);\n box-shadow: var(--re-shadow);\n font-family: system-ui, -apple-system, sans-serif;\n}\n\n[data-re-slash-command-item] {\n color: var(--re-text);\n border-radius: var(--re-radius-sm);\n transition: background-color 0.15s;\n}\n\n[data-re-slash-command-item]:hover {\n background: var(--re-hover);\n}\n\n[data-re-slash-command-item][data-selected] {\n background: var(--re-hover);\n}\n\n[data-re-slash-command-item]:active {\n background: var(--re-active);\n}\n\n[data-re-slash-command-item] svg {\n color: var(--re-text-muted);\n}\n\n[data-re-slash-command-category] {\n color: var(--re-text-muted);\n}\n\n[data-re-slash-command-empty] {\n color: var(--re-text-muted);\n}\n\n/* ----------------------------------------------------------------\n * Editor content — alignment attribute\n * ---------------------------------------------------------------- */\n\n.tiptap [alignment=\"left\"] {\n text-align: left;\n}\n\n.tiptap [alignment=\"center\"] {\n text-align: center;\n}\n\n.tiptap [alignment=\"right\"] {\n text-align: right;\n}\n\n.tiptap [alignment=\"justify\"] {\n text-align: justify;\n}\n\n/* ----------------------------------------------------------------\n * Editor content — columns\n * ---------------------------------------------------------------- */\n\n.tiptap .node-columns {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.tiptap .node-column {\n flex: 1;\n min-width: 0;\n}\n\n/* ----------------------------------------------------------------\n * Editor content — base typography\n * ---------------------------------------------------------------- */\n\n.tiptap {\n outline: none;\n color: var(--re-text);\n}\n\n.tiptap p {\n margin: 0.25em 0;\n}\n\n.tiptap h1,\n.tiptap h2,\n.tiptap h3 {\n margin: 0.5em 0 0.25em;\n font-weight: 700;\n}\n\n.tiptap h1 {\n font-size: 2em;\n}\n\n.tiptap h2 {\n font-size: 1.5em;\n}\n\n.tiptap h3 {\n font-size: 1.17em;\n}\n\n.tiptap a:not(.node-button) {\n color: #2563eb;\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: text;\n}\n\n.tiptap .node-button {\n display: inline-block;\n padding: 0.625em 1.25em;\n background-color: #000;\n color: #fff;\n border-radius: 0.375em;\n font-weight: 500;\n font-size: 0.875em;\n text-decoration: none;\n text-align: center;\n cursor: text;\n}\n\n.tiptap blockquote {\n border-left: 3px solid var(--re-border);\n margin: 0.5em 0;\n padding-left: 1em;\n color: var(--re-text-muted);\n}\n\n.tiptap hr {\n border: none;\n border-top: 1px solid var(--re-border);\n margin: 1em 0;\n}\n\n.tiptap code {\n background: var(--re-hover);\n border-radius: 0.25rem;\n padding: 0.125rem 0.375rem;\n font-size: 0.875em;\n}\n\n.tiptap pre {\n background: var(--re-hover);\n border-radius: var(--re-radius-sm);\n padding: 0.75rem 1rem;\n overflow-x: auto;\n}\n\n.tiptap pre code {\n background: none;\n padding: 0;\n border-radius: 0;\n}\n\n.tiptap ul {\n list-style-type: disc;\n padding-left: 1.5em;\n margin: 0.25em 0;\n}\n\n.tiptap ol {\n list-style-type: decimal;\n padding-left: 1.5em;\n margin: 0.25em 0;\n}\n\n.tiptap .node-placeholder::before {\n color: var(--re-text-muted);\n content: attr(data-placeholder);\n float: left;\n height: 0;\n pointer-events: none;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AC5RA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AC3CA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAIA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA"}
package/dist/index.d.cts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { n as UploadImageHandler } from "./create-paste-handler-B8BtjBk3.cjs";
2
2
  import { Content, Editor, Extensions, JSONContent } from "@tiptap/core";
3
- import * as react0 from "react";
3
+ import * as react21 from "react";
4
4
 
5
5
  //#region src/email-editor/email-editor.d.ts
6
6
  interface EmailEditorRef {
@@ -21,13 +21,13 @@ interface EmailEditorProps {
21
21
  editable?: boolean;
22
22
  placeholder?: string;
23
23
  bubbleMenu?: {
24
- excludeNodes?: string[];
25
- excludeMarks?: string[];
24
+ hideWhenActiveNodes?: string[];
25
+ hideWhenActiveMarks?: string[];
26
26
  };
27
27
  extensions?: Extensions;
28
28
  className?: string;
29
29
  }
30
- declare const EmailEditor: react0.ForwardRefExoticComponent<EmailEditorProps & react0.RefAttributes<EmailEditorRef>>;
30
+ declare const EmailEditor: react21.ForwardRefExoticComponent<EmailEditorProps & react21.RefAttributes<EmailEditorRef>>;
31
31
  //#endregion
32
32
  export { EmailEditor, type EmailEditorProps, type EmailEditorRef };
33
33
  //# sourceMappingURL=index.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.cts","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":[],"mappings":";;;;;UAuBiB,cAAA;gBACD;IADC,IAAA,EAAA,MAAA;IACD,IAAA,EAAA,MAAA;EACC,CAAA,CAAA;EAEP,OAAA,EAAA,GAAA,GAFO,WAEP;EAAM,OAAA,EAAA,GAAA,GAAA,MAAA;EAGC,MAAA,EAHP,MAGO,GAAA,IAAgB;;AAEX,UAFL,gBAAA,CAEK;EACJ,OAAA,CAAA,EAFN,OAEM;EACG,QAAA,CAAA,EAAA,CAAA,MAAA,EAFC,MAED,EAAA,GAAA,IAAA;EAQN,aAAA,CAAA,EATG,kBASH;EAAU,OAAA,CAAA,EAAA,CAAA,MAAA,EARJ,MAQI,EAAA,GAAA,IAAA;EA0BZ,KAAA,CAAA,EAAA,OAmEZ,GAAA,SAAA;EAnEuB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,UAAA,CAAA,EAAA;IAAA,YAAA,CAAA,EAAA,MAAA,EAAA;IAAA,YAAA,CAAA,EAAA,MAAA,EAAA;;eA1BT;;;cA0BF,aAAW,MAAA,CAAA,0BAAA,mBAAA,MAAA,CAAA,cAAA"}
1
+ {"version":3,"file":"index.d.cts","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":[],"mappings":";;;;;UAuBiB,cAAA;gBACD;IADC,IAAA,EAAA,MAAA;IACD,IAAA,EAAA,MAAA;EACC,CAAA,CAAA;EAEP,OAAA,EAAA,GAAA,GAFO,WAEP;EAAM,OAAA,EAAA,GAAA,GAAA,MAAA;EAGC,MAAA,EAHP,MAGO,GAAA,IAAgB;;AAEX,UAFL,gBAAA,CAEK;EACJ,OAAA,CAAA,EAFN,OAEM;EACG,QAAA,CAAA,EAAA,CAAA,MAAA,EAFC,MAED,EAAA,GAAA,IAAA;EAQN,aAAA,CAAA,EATG,kBASH;EAAU,OAAA,CAAA,EAAA,CAAA,MAAA,EARJ,MAQI,EAAA,GAAA,IAAA;EA0BZ,KAAA,CAAA,EAAA,OAmEZ,GAAA,SAAA;EAnEuB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,UAAA,CAAA,EAAA;IAAA,mBAAA,CAAA,EAAA,MAAA,EAAA;IAAA,mBAAA,CAAA,EAAA,MAAA,EAAA;;eA1BT;;;cA0BF,aAAW,OAAA,CAAA,0BAAA,mBAAA,OAAA,CAAA,cAAA"}
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { n as UploadImageHandler } from "./create-paste-handler-CGR738bC.mjs";
2
- import * as react20 from "react";
2
+ import * as react0 from "react";
3
3
  import { Content, Editor, Extensions, JSONContent } from "@tiptap/core";
4
4
 
5
5
  //#region src/email-editor/email-editor.d.ts
@@ -21,13 +21,13 @@ interface EmailEditorProps {
21
21
  editable?: boolean;
22
22
  placeholder?: string;
23
23
  bubbleMenu?: {
24
- excludeNodes?: string[];
25
- excludeMarks?: string[];
24
+ hideWhenActiveNodes?: string[];
25
+ hideWhenActiveMarks?: string[];
26
26
  };
27
27
  extensions?: Extensions;
28
28
  className?: string;
29
29
  }
30
- declare const EmailEditor: react20.ForwardRefExoticComponent<EmailEditorProps & react20.RefAttributes<EmailEditorRef>>;
30
+ declare const EmailEditor: react0.ForwardRefExoticComponent<EmailEditorProps & react0.RefAttributes<EmailEditorRef>>;
31
31
  //#endregion
32
32
  export { EmailEditor, type EmailEditorProps, type EmailEditorRef };
33
33
  //# sourceMappingURL=index.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.mts","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":[],"mappings":";;;;;UAuBiB,cAAA;gBACD;IADC,IAAA,EAAA,MAAA;IACD,IAAA,EAAA,MAAA;EACC,CAAA,CAAA;EAEP,OAAA,EAAA,GAAA,GAFO,WAEP;EAAM,OAAA,EAAA,GAAA,GAAA,MAAA;EAGC,MAAA,EAHP,MAGO,GAAA,IAAgB;;AAEX,UAFL,gBAAA,CAEK;EACJ,OAAA,CAAA,EAFN,OAEM;EACG,QAAA,CAAA,EAAA,CAAA,MAAA,EAFC,MAED,EAAA,GAAA,IAAA;EAQN,aAAA,CAAA,EATG,kBASH;EAAU,OAAA,CAAA,EAAA,CAAA,MAAA,EARJ,MAQI,EAAA,GAAA,IAAA;EA0BZ,KAAA,CAAA,EAAA,OAmEZ,GAAA,SAAA;EAnEuB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,UAAA,CAAA,EAAA;IAAA,YAAA,CAAA,EAAA,MAAA,EAAA;IAAA,YAAA,CAAA,EAAA,MAAA,EAAA;;eA1BT;;;cA0BF,aAAW,OAAA,CAAA,0BAAA,mBAAA,OAAA,CAAA,cAAA"}
1
+ {"version":3,"file":"index.d.mts","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":[],"mappings":";;;;;UAuBiB,cAAA;gBACD;IADC,IAAA,EAAA,MAAA;IACD,IAAA,EAAA,MAAA;EACC,CAAA,CAAA;EAEP,OAAA,EAAA,GAAA,GAFO,WAEP;EAAM,OAAA,EAAA,GAAA,GAAA,MAAA;EAGC,MAAA,EAHP,MAGO,GAAA,IAAgB;;AAEX,UAFL,gBAAA,CAEK;EACJ,OAAA,CAAA,EAFN,OAEM;EACG,QAAA,CAAA,EAAA,CAAA,MAAA,EAFC,MAED,EAAA,GAAA,IAAA;EAQN,aAAA,CAAA,EATG,kBASH;EAAU,OAAA,CAAA,EAAA,CAAA,MAAA,EARJ,MAQI,EAAA,GAAA,IAAA;EA0BZ,KAAA,CAAA,EAAA,OAmEZ,GAAA,SAAA;EAnEuB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,UAAA,CAAA,EAAA;IAAA,mBAAA,CAAA,EAAA,MAAA,EAAA;IAAA,mBAAA,CAAA,EAAA,MAAA,EAAA;;eA1BT;;;cA0BF,aAAW,MAAA,CAAA,0BAAA,mBAAA,MAAA,CAAA,cAAA"}
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { B as createPasteHandler, R as composeReactEmail, V as createDropHandler, t as StarterKit } from "./extensions-DWsu9kwZ.mjs";
2
2
  import { t as EmailTheming } from "./extension-CnC8y63H.mjs";
3
- import { A as ImageBubbleMenuDefault, F as ButtonBubbleMenuDefault, H as BubbleMenuDefault, S as LinkBubbleMenuDefault, t as SlashCommandRoot } from "./root-BMxsq1NF.mjs";
3
+ import { J as BubbleMenuButtonDefault, O as BubbleMenuImageDefault, S as BubbleMenuLinkDefault, j as BubbleMenuDefault, t as SlashCommandRoot } from "./root-CkYaJZpj.mjs";
4
4
  import { UndoRedo } from "@tiptap/extensions";
5
5
  import { EditorProvider, useCurrentEditor } from "@tiptap/react";
6
6
  import { forwardRef, useImperativeHandle, useMemo } from "react";
@@ -57,12 +57,12 @@ const EmailEditor = forwardRef(({ content, onChange, onUploadImage, onReady, the
57
57
  children: [
58
58
  /* @__PURE__ */ jsx(RefBridge, { editorRef: ref }),
59
59
  /* @__PURE__ */ jsx(BubbleMenuDefault, {
60
- excludeNodes: bubbleMenu?.excludeNodes ?? ["button"],
61
- excludeMarks: bubbleMenu?.excludeMarks ?? ["link"]
60
+ hideWhenActiveNodes: bubbleMenu?.hideWhenActiveNodes ?? ["button"],
61
+ hideWhenActiveMarks: bubbleMenu?.hideWhenActiveMarks ?? ["link"]
62
62
  }),
63
- /* @__PURE__ */ jsx(LinkBubbleMenuDefault, {}),
64
- /* @__PURE__ */ jsx(ButtonBubbleMenuDefault, {}),
65
- /* @__PURE__ */ jsx(ImageBubbleMenuDefault, {}),
63
+ /* @__PURE__ */ jsx(BubbleMenuLinkDefault, {}),
64
+ /* @__PURE__ */ jsx(BubbleMenuButtonDefault, {}),
65
+ /* @__PURE__ */ jsx(BubbleMenuImageDefault, {}),
66
66
  /* @__PURE__ */ jsx(SlashCommandRoot, {})
67
67
  ]
68
68
  }, theme);
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":["import type { Content, Editor, Extensions, JSONContent } from '@tiptap/core';\nimport { UndoRedo } from '@tiptap/extensions';\nimport {\n EditorProvider,\n type UseEditorOptions,\n useCurrentEditor,\n} from '@tiptap/react';\nimport { forwardRef, type Ref, useImperativeHandle, useMemo } from 'react';\nimport { createDropHandler } from '../core/create-drop-handler';\nimport {\n createPasteHandler,\n type UploadImageHandler,\n} from '../core/create-paste-handler';\nimport { composeReactEmail } from '../core/serializer/compose-react-email';\nimport { StarterKit } from '../extensions';\nimport { EmailTheming } from '../plugins/email-theming/extension';\nimport { BubbleMenuDefault } from '../ui/bubble-menu/default';\nimport { ButtonBubbleMenuDefault } from '../ui/button-bubble-menu/default';\nimport { ImageBubbleMenuDefault } from '../ui/image-bubble-menu/default';\nimport { LinkBubbleMenuDefault } from '../ui/link-bubble-menu/default';\nimport { SlashCommandRoot } from '../ui/slash-command/root';\nimport '../ui/themes/default.css';\n\nexport interface EmailEditorRef {\n export: () => Promise<{ html: string; text: string }>;\n getJSON: () => JSONContent;\n getHTML: () => string;\n editor: Editor | null;\n}\n\nexport interface EmailEditorProps {\n content?: Content;\n onChange?: (editor: Editor) => void;\n onUploadImage?: UploadImageHandler;\n onReady?: (editor: Editor) => void;\n theme?: 'basic' | 'minimal';\n editable?: boolean;\n placeholder?: string;\n bubbleMenu?: {\n excludeNodes?: string[];\n excludeMarks?: string[];\n };\n extensions?: Extensions;\n className?: string;\n}\n\nfunction RefBridge({ editorRef }: { editorRef: Ref<EmailEditorRef> }) {\n const { editor } = useCurrentEditor();\n\n useImperativeHandle(\n editorRef,\n () => ({\n export: async () => {\n if (!editor) {\n return { html: '', text: '' };\n }\n return composeReactEmail({ editor });\n },\n getJSON: () => editor?.getJSON() ?? { type: 'doc', content: [] },\n getHTML: () => editor?.getHTML() ?? '',\n editor,\n }),\n [editor],\n );\n\n return null;\n}\n\nexport const EmailEditor = forwardRef<EmailEditorRef, EmailEditorProps>(\n (\n {\n content,\n onChange,\n onUploadImage,\n onReady,\n theme = 'basic',\n editable = true,\n placeholder,\n bubbleMenu,\n extensions: extensionsProp,\n className,\n },\n ref,\n ) => {\n const extensions = useMemo(() => {\n if (extensionsProp) {\n return extensionsProp;\n }\n\n return [\n StarterKit.configure({\n Placeholder: placeholder ? { placeholder } : undefined,\n }),\n UndoRedo,\n EmailTheming.configure({ theme }),\n ];\n }, [extensionsProp, theme, placeholder]);\n\n const editorProps: UseEditorOptions['editorProps'] = useMemo(\n () => ({\n handlePaste: createPasteHandler({\n onUploadImage,\n extensions,\n }),\n handleDrop: createDropHandler({\n onUploadImage,\n }),\n }),\n [onUploadImage, extensions],\n );\n\n return (\n <EditorProvider\n key={theme}\n extensions={extensions}\n content={content}\n editable={editable}\n immediatelyRender={false}\n editorProps={editorProps}\n editorContainerProps={{ className }}\n onCreate={({ editor }) => onReady?.(editor)}\n onUpdate={({ editor }) => onChange?.(editor)}\n >\n <RefBridge editorRef={ref} />\n <BubbleMenuDefault\n excludeNodes={bubbleMenu?.excludeNodes ?? ['button']}\n excludeMarks={bubbleMenu?.excludeMarks ?? ['link']}\n />\n <LinkBubbleMenuDefault />\n <ButtonBubbleMenuDefault />\n <ImageBubbleMenuDefault />\n <SlashCommandRoot />\n </EditorProvider>\n );\n },\n);\n\nEmailEditor.displayName = 'EmailEditor';\n"],"mappings":";;;;;;;;;AA8CA,SAAS,UAAU,EAAE,aAAiD;CACpE,MAAM,EAAE,WAAW,kBAAkB;AAErC,qBACE,kBACO;EACL,QAAQ,YAAY;AAClB,OAAI,CAAC,OACH,QAAO;IAAE,MAAM;IAAI,MAAM;IAAI;AAE/B,UAAO,kBAAkB,EAAE,QAAQ,CAAC;;EAEtC,eAAe,QAAQ,SAAS,IAAI;GAAE,MAAM;GAAO,SAAS,EAAE;GAAE;EAChE,eAAe,QAAQ,SAAS,IAAI;EACpC;EACD,GACD,CAAC,OAAO,CACT;AAED,QAAO;;AAGT,MAAa,cAAc,YAEvB,EACE,SACA,UACA,eACA,SACA,QAAQ,SACR,WAAW,MACX,aACA,YACA,YAAY,gBACZ,aAEF,QACG;CACH,MAAM,aAAa,cAAc;AAC/B,MAAI,eACF,QAAO;AAGT,SAAO;GACL,WAAW,UAAU,EACnB,aAAa,cAAc,EAAE,aAAa,GAAG,QAC9C,CAAC;GACF;GACA,aAAa,UAAU,EAAE,OAAO,CAAC;GAClC;IACA;EAAC;EAAgB;EAAO;EAAY,CAAC;AAexC,QACE,qBAAC;EAEa;EACH;EACC;EACV,mBAAmB;EACnB,aApBiD,eAC5C;GACL,aAAa,mBAAmB;IAC9B;IACA;IACD,CAAC;GACF,YAAY,kBAAkB,EAC5B,eACD,CAAC;GACH,GACD,CAAC,eAAe,WAAW,CAC5B;EAUG,sBAAsB,EAAE,WAAW;EACnC,WAAW,EAAE,aAAa,UAAU,OAAO;EAC3C,WAAW,EAAE,aAAa,WAAW,OAAO;;GAE5C,oBAAC,aAAU,WAAW,MAAO;GAC7B,oBAAC;IACC,cAAc,YAAY,gBAAgB,CAAC,SAAS;IACpD,cAAc,YAAY,gBAAgB,CAAC,OAAO;KAClD;GACF,oBAAC,0BAAwB;GACzB,oBAAC,4BAA0B;GAC3B,oBAAC,2BAAyB;GAC1B,oBAAC,qBAAmB;;IAlBf,MAmBU;EAGtB;AAED,YAAY,cAAc"}
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../src/email-editor/email-editor.tsx"],"sourcesContent":["import type { Content, Editor, Extensions, JSONContent } from '@tiptap/core';\nimport { UndoRedo } from '@tiptap/extensions';\nimport {\n EditorProvider,\n type UseEditorOptions,\n useCurrentEditor,\n} from '@tiptap/react';\nimport { forwardRef, type Ref, useImperativeHandle, useMemo } from 'react';\nimport { createDropHandler } from '../core/create-drop-handler';\nimport {\n createPasteHandler,\n type UploadImageHandler,\n} from '../core/create-paste-handler';\nimport { composeReactEmail } from '../core/serializer/compose-react-email';\nimport { StarterKit } from '../extensions';\nimport { EmailTheming } from '../plugins/email-theming/extension';\nimport { BubbleMenuButtonDefault } from '../ui/bubble-menu/button-default';\nimport { BubbleMenuDefault } from '../ui/bubble-menu/default';\nimport { BubbleMenuImageDefault } from '../ui/bubble-menu/image-default';\nimport { BubbleMenuLinkDefault } from '../ui/bubble-menu/link-default';\nimport { SlashCommandRoot } from '../ui/slash-command/root';\nimport '../ui/themes/default.css';\n\nexport interface EmailEditorRef {\n export: () => Promise<{ html: string; text: string }>;\n getJSON: () => JSONContent;\n getHTML: () => string;\n editor: Editor | null;\n}\n\nexport interface EmailEditorProps {\n content?: Content;\n onChange?: (editor: Editor) => void;\n onUploadImage?: UploadImageHandler;\n onReady?: (editor: Editor) => void;\n theme?: 'basic' | 'minimal';\n editable?: boolean;\n placeholder?: string;\n bubbleMenu?: {\n hideWhenActiveNodes?: string[];\n hideWhenActiveMarks?: string[];\n };\n extensions?: Extensions;\n className?: string;\n}\n\nfunction RefBridge({ editorRef }: { editorRef: Ref<EmailEditorRef> }) {\n const { editor } = useCurrentEditor();\n\n useImperativeHandle(\n editorRef,\n () => ({\n export: async () => {\n if (!editor) {\n return { html: '', text: '' };\n }\n return composeReactEmail({ editor });\n },\n getJSON: () => editor?.getJSON() ?? { type: 'doc', content: [] },\n getHTML: () => editor?.getHTML() ?? '',\n editor,\n }),\n [editor],\n );\n\n return null;\n}\n\nexport const EmailEditor = forwardRef<EmailEditorRef, EmailEditorProps>(\n (\n {\n content,\n onChange,\n onUploadImage,\n onReady,\n theme = 'basic',\n editable = true,\n placeholder,\n bubbleMenu,\n extensions: extensionsProp,\n className,\n },\n ref,\n ) => {\n const extensions = useMemo(() => {\n if (extensionsProp) {\n return extensionsProp;\n }\n\n return [\n StarterKit.configure({\n Placeholder: placeholder ? { placeholder } : undefined,\n }),\n UndoRedo,\n EmailTheming.configure({ theme }),\n ];\n }, [extensionsProp, theme, placeholder]);\n\n const editorProps: UseEditorOptions['editorProps'] = useMemo(\n () => ({\n handlePaste: createPasteHandler({\n onUploadImage,\n extensions,\n }),\n handleDrop: createDropHandler({\n onUploadImage,\n }),\n }),\n [onUploadImage, extensions],\n );\n\n return (\n <EditorProvider\n key={theme}\n extensions={extensions}\n content={content}\n editable={editable}\n immediatelyRender={false}\n editorProps={editorProps}\n editorContainerProps={{ className }}\n onCreate={({ editor }) => onReady?.(editor)}\n onUpdate={({ editor }) => onChange?.(editor)}\n >\n <RefBridge editorRef={ref} />\n <BubbleMenuDefault\n hideWhenActiveNodes={bubbleMenu?.hideWhenActiveNodes ?? ['button']}\n hideWhenActiveMarks={bubbleMenu?.hideWhenActiveMarks ?? ['link']}\n />\n <BubbleMenuLinkDefault />\n <BubbleMenuButtonDefault />\n <BubbleMenuImageDefault />\n <SlashCommandRoot />\n </EditorProvider>\n );\n },\n);\n\nEmailEditor.displayName = 'EmailEditor';\n"],"mappings":";;;;;;;;;AA8CA,SAAS,UAAU,EAAE,aAAiD;CACpE,MAAM,EAAE,WAAW,kBAAkB;AAErC,qBACE,kBACO;EACL,QAAQ,YAAY;AAClB,OAAI,CAAC,OACH,QAAO;IAAE,MAAM;IAAI,MAAM;IAAI;AAE/B,UAAO,kBAAkB,EAAE,QAAQ,CAAC;;EAEtC,eAAe,QAAQ,SAAS,IAAI;GAAE,MAAM;GAAO,SAAS,EAAE;GAAE;EAChE,eAAe,QAAQ,SAAS,IAAI;EACpC;EACD,GACD,CAAC,OAAO,CACT;AAED,QAAO;;AAGT,MAAa,cAAc,YAEvB,EACE,SACA,UACA,eACA,SACA,QAAQ,SACR,WAAW,MACX,aACA,YACA,YAAY,gBACZ,aAEF,QACG;CACH,MAAM,aAAa,cAAc;AAC/B,MAAI,eACF,QAAO;AAGT,SAAO;GACL,WAAW,UAAU,EACnB,aAAa,cAAc,EAAE,aAAa,GAAG,QAC9C,CAAC;GACF;GACA,aAAa,UAAU,EAAE,OAAO,CAAC;GAClC;IACA;EAAC;EAAgB;EAAO;EAAY,CAAC;AAexC,QACE,qBAAC;EAEa;EACH;EACC;EACV,mBAAmB;EACnB,aApBiD,eAC5C;GACL,aAAa,mBAAmB;IAC9B;IACA;IACD,CAAC;GACF,YAAY,kBAAkB,EAC5B,eACD,CAAC;GACH,GACD,CAAC,eAAe,WAAW,CAC5B;EAUG,sBAAsB,EAAE,WAAW;EACnC,WAAW,EAAE,aAAa,UAAU,OAAO;EAC3C,WAAW,EAAE,aAAa,WAAW,OAAO;;GAE5C,oBAAC,aAAU,WAAW,MAAO;GAC7B,oBAAC;IACC,qBAAqB,YAAY,uBAAuB,CAAC,SAAS;IAClE,qBAAqB,YAAY,uBAAuB,CAAC,OAAO;KAChE;GACF,oBAAC,0BAAwB;GACzB,oBAAC,4BAA0B;GAC3B,oBAAC,2BAAyB;GAC1B,oBAAC,qBAAmB;;IAlBf,MAmBU;EAGtB;AAED,YAAY,cAAc"}