@react-email/editor 0.0.0-experimental.10 → 0.0.0-experimental.11
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.d.mts +91 -34
- package/dist/index.d.mts.map +1 -1
- package/dist/index.d.ts +91 -34
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +98 -5
- package/dist/index.mjs +94 -6
- package/dist/index.mjs.map +1 -1
- package/dist/ui/button-bubble-menu/button-bubble-menu.css +29 -0
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -2433,6 +2433,88 @@ const BubbleMenu = {
|
|
|
2433
2433
|
Default: BubbleMenuDefault
|
|
2434
2434
|
};
|
|
2435
2435
|
|
|
2436
|
+
//#endregion
|
|
2437
|
+
//#region src/ui/button-bubble-menu/context.tsx
|
|
2438
|
+
const ButtonBubbleMenuContext = React.createContext(null);
|
|
2439
|
+
function useButtonBubbleMenuContext() {
|
|
2440
|
+
const context = React.useContext(ButtonBubbleMenuContext);
|
|
2441
|
+
if (!context) throw new Error("ButtonBubbleMenu compound components must be used within <ButtonBubbleMenu.Root>");
|
|
2442
|
+
return context;
|
|
2443
|
+
}
|
|
2444
|
+
|
|
2445
|
+
//#endregion
|
|
2446
|
+
//#region src/ui/button-bubble-menu/edit-link.tsx
|
|
2447
|
+
function ButtonBubbleMenuEditLink({ className, children, onClick, onMouseDown,...rest }) {
|
|
2448
|
+
const { setIsEditing } = useButtonBubbleMenuContext();
|
|
2449
|
+
return /* @__PURE__ */ jsx("button", {
|
|
2450
|
+
...rest,
|
|
2451
|
+
type: "button",
|
|
2452
|
+
"aria-label": "Edit link",
|
|
2453
|
+
"data-re-btn-bm-item": "",
|
|
2454
|
+
"data-item": "edit-link",
|
|
2455
|
+
className,
|
|
2456
|
+
onMouseDown: (e) => {
|
|
2457
|
+
e.preventDefault();
|
|
2458
|
+
onMouseDown?.(e);
|
|
2459
|
+
},
|
|
2460
|
+
onClick: (e) => {
|
|
2461
|
+
onClick?.(e);
|
|
2462
|
+
setIsEditing(true);
|
|
2463
|
+
},
|
|
2464
|
+
children: children ?? /* @__PURE__ */ jsx(LinkIcon, {})
|
|
2465
|
+
});
|
|
2466
|
+
}
|
|
2467
|
+
|
|
2468
|
+
//#endregion
|
|
2469
|
+
//#region src/ui/button-bubble-menu/root.tsx
|
|
2470
|
+
function ButtonBubbleMenuRoot({ onHide, placement = "top", offset = 8, className, children }) {
|
|
2471
|
+
const { editor } = useCurrentEditor();
|
|
2472
|
+
const [isEditing, setIsEditing] = React.useState(false);
|
|
2473
|
+
if (!editor) return null;
|
|
2474
|
+
return /* @__PURE__ */ jsx(BubbleMenu$1, {
|
|
2475
|
+
editor,
|
|
2476
|
+
"data-re-btn-bm": "",
|
|
2477
|
+
shouldShow: ({ editor: e, view }) => e.isActive("button") && !view.dom.classList.contains("dragging"),
|
|
2478
|
+
options: {
|
|
2479
|
+
placement,
|
|
2480
|
+
offset,
|
|
2481
|
+
onHide: () => {
|
|
2482
|
+
setIsEditing(false);
|
|
2483
|
+
onHide?.();
|
|
2484
|
+
}
|
|
2485
|
+
},
|
|
2486
|
+
className,
|
|
2487
|
+
children: /* @__PURE__ */ jsx(ButtonBubbleMenuContext.Provider, {
|
|
2488
|
+
value: {
|
|
2489
|
+
editor,
|
|
2490
|
+
isEditing,
|
|
2491
|
+
setIsEditing
|
|
2492
|
+
},
|
|
2493
|
+
children
|
|
2494
|
+
})
|
|
2495
|
+
});
|
|
2496
|
+
}
|
|
2497
|
+
|
|
2498
|
+
//#endregion
|
|
2499
|
+
//#region src/ui/button-bubble-menu/toolbar.tsx
|
|
2500
|
+
function ButtonBubbleMenuToolbar({ className, children }) {
|
|
2501
|
+
const { isEditing } = useButtonBubbleMenuContext();
|
|
2502
|
+
if (isEditing) return null;
|
|
2503
|
+
return /* @__PURE__ */ jsx("div", {
|
|
2504
|
+
"data-re-btn-bm-toolbar": "",
|
|
2505
|
+
className,
|
|
2506
|
+
children
|
|
2507
|
+
});
|
|
2508
|
+
}
|
|
2509
|
+
|
|
2510
|
+
//#endregion
|
|
2511
|
+
//#region src/ui/button-bubble-menu/index.ts
|
|
2512
|
+
const ButtonBubbleMenu = {
|
|
2513
|
+
Root: ButtonBubbleMenuRoot,
|
|
2514
|
+
Toolbar: ButtonBubbleMenuToolbar,
|
|
2515
|
+
EditLink: ButtonBubbleMenuEditLink
|
|
2516
|
+
};
|
|
2517
|
+
|
|
2436
2518
|
//#endregion
|
|
2437
2519
|
//#region src/ui/link-bubble-menu/context.tsx
|
|
2438
2520
|
const LinkBubbleMenuContext = React.createContext(null);
|
|
@@ -2444,7 +2526,7 @@ function useLinkBubbleMenuContext() {
|
|
|
2444
2526
|
|
|
2445
2527
|
//#endregion
|
|
2446
2528
|
//#region src/ui/link-bubble-menu/edit-link.tsx
|
|
2447
|
-
function LinkBubbleMenuEditLink({ className, children, onClick,...rest }) {
|
|
2529
|
+
function LinkBubbleMenuEditLink({ className, children, onClick, onMouseDown,...rest }) {
|
|
2448
2530
|
const { setIsEditing } = useLinkBubbleMenuContext();
|
|
2449
2531
|
return /* @__PURE__ */ jsx("button", {
|
|
2450
2532
|
type: "button",
|
|
@@ -2452,7 +2534,10 @@ function LinkBubbleMenuEditLink({ className, children, onClick,...rest }) {
|
|
|
2452
2534
|
"data-re-link-bm-item": "",
|
|
2453
2535
|
"data-item": "edit-link",
|
|
2454
2536
|
className,
|
|
2455
|
-
onMouseDown: (e) =>
|
|
2537
|
+
onMouseDown: (e) => {
|
|
2538
|
+
e.preventDefault();
|
|
2539
|
+
onMouseDown?.(e);
|
|
2540
|
+
},
|
|
2456
2541
|
onClick: (e) => {
|
|
2457
2542
|
onClick?.(e);
|
|
2458
2543
|
setIsEditing(true);
|
|
@@ -2586,7 +2671,7 @@ function LinkBubbleMenuOpenLink({ className, children,...rest }) {
|
|
|
2586
2671
|
|
|
2587
2672
|
//#endregion
|
|
2588
2673
|
//#region src/ui/link-bubble-menu/root.tsx
|
|
2589
|
-
function LinkBubbleMenuRoot({ onHide, placement = "
|
|
2674
|
+
function LinkBubbleMenuRoot({ onHide, placement = "top", offset = 8, className, children }) {
|
|
2590
2675
|
const { editor } = useCurrentEditor();
|
|
2591
2676
|
const [isEditing, setIsEditing] = React.useState(false);
|
|
2592
2677
|
const linkHref = useEditorState({
|
|
@@ -2633,7 +2718,7 @@ function LinkBubbleMenuToolbar({ className, children }) {
|
|
|
2633
2718
|
|
|
2634
2719
|
//#endregion
|
|
2635
2720
|
//#region src/ui/link-bubble-menu/unlink.tsx
|
|
2636
|
-
function LinkBubbleMenuUnlink({ className, children, onClick,...rest }) {
|
|
2721
|
+
function LinkBubbleMenuUnlink({ className, children, onClick, onMouseDown,...rest }) {
|
|
2637
2722
|
const { editor } = useLinkBubbleMenuContext();
|
|
2638
2723
|
return /* @__PURE__ */ jsx("button", {
|
|
2639
2724
|
type: "button",
|
|
@@ -2641,7 +2726,10 @@ function LinkBubbleMenuUnlink({ className, children, onClick,...rest }) {
|
|
|
2641
2726
|
"data-re-link-bm-item": "",
|
|
2642
2727
|
"data-item": "unlink",
|
|
2643
2728
|
className,
|
|
2644
|
-
onMouseDown: (e) =>
|
|
2729
|
+
onMouseDown: (e) => {
|
|
2730
|
+
e.preventDefault();
|
|
2731
|
+
onMouseDown?.(e);
|
|
2732
|
+
},
|
|
2645
2733
|
onClick: (e) => {
|
|
2646
2734
|
onClick?.(e);
|
|
2647
2735
|
editor.chain().focus().unsetLink().run();
|
|
@@ -2663,5 +2751,5 @@ const LinkBubbleMenu = {
|
|
|
2663
2751
|
};
|
|
2664
2752
|
|
|
2665
2753
|
//#endregion
|
|
2666
|
-
export { AlignmentAttribute, Body, Bold, BubbleMenu, BubbleMenuAlignCenter, BubbleMenuAlignLeft, BubbleMenuAlignRight, BubbleMenuBold, BubbleMenuCode, BubbleMenuDefault, BubbleMenuItalic, BubbleMenuItem, BubbleMenuItemGroup, BubbleMenuLinkSelector, BubbleMenuNodeSelector, BubbleMenuRoot, BubbleMenuSeparator, BubbleMenuStrike, BubbleMenuUnderline, BubbleMenuUppercase, Button, COLUMN_PARENT_TYPES, ClassAttribute, CodeBlockPrism, ColumnsColumn, Div, EmailNode, FourColumns, LinkBubbleMenu, LinkBubbleMenuEditLink, LinkBubbleMenuForm, LinkBubbleMenuOpenLink, LinkBubbleMenuRoot, LinkBubbleMenuToolbar, LinkBubbleMenuUnlink, MAX_COLUMNS_DEPTH, MaxNesting, NodeSelectorContent, NodeSelectorRoot, NodeSelectorTrigger, Placeholder, PreservedStyle, PreviewText, Section, StyleAttribute, Sup, Table, TableCell, TableHeader, TableRow, ThreeColumns, TwoColumns, Uppercase, coreExtensions, editorEventBus, getColumnsDepth, processStylesForUnlink, setTextAlignment, useLinkBubbleMenuContext };
|
|
2754
|
+
export { AlignmentAttribute, Body, Bold, BubbleMenu, BubbleMenuAlignCenter, BubbleMenuAlignLeft, BubbleMenuAlignRight, BubbleMenuBold, BubbleMenuCode, BubbleMenuDefault, BubbleMenuItalic, BubbleMenuItem, BubbleMenuItemGroup, BubbleMenuLinkSelector, BubbleMenuNodeSelector, BubbleMenuRoot, BubbleMenuSeparator, BubbleMenuStrike, BubbleMenuUnderline, BubbleMenuUppercase, Button, ButtonBubbleMenu, ButtonBubbleMenuEditLink, ButtonBubbleMenuRoot, ButtonBubbleMenuToolbar, COLUMN_PARENT_TYPES, ClassAttribute, CodeBlockPrism, ColumnsColumn, Div, EmailNode, FourColumns, LinkBubbleMenu, LinkBubbleMenuEditLink, LinkBubbleMenuForm, LinkBubbleMenuOpenLink, LinkBubbleMenuRoot, LinkBubbleMenuToolbar, LinkBubbleMenuUnlink, MAX_COLUMNS_DEPTH, MaxNesting, NodeSelectorContent, NodeSelectorRoot, NodeSelectorTrigger, Placeholder, PreservedStyle, PreviewText, Section, StyleAttribute, Sup, Table, TableCell, TableHeader, TableRow, ThreeColumns, TwoColumns, Uppercase, coreExtensions, editorEventBus, getColumnsDepth, processStylesForUnlink, setTextAlignment, useButtonBubbleMenuContext, useLinkBubbleMenuContext };
|
|
2667
2755
|
//# sourceMappingURL=index.mjs.map
|