dishui 0.0.65 → 0.0.67

package/dist/components/pro/RichTextEditor/extensions/FloatingDialog.js

@@ -1,632 +1,627 @@
-import { useCallback as u, useEffect as E, useRef as m, useState as b } from "react";
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import { Node as j, NodeViewContent as G, NodeViewWrapper as H, ReactNodeViewRenderer as U, mergeAttributes as $ } from "@tiptap/react";
-var K = [
-  {
-    label: "Blue",
-    border: "#3b82f6",
-    bg: "#eff6ff"
-  },
-  {
-    label: "Green",
-    border: "#22c55e",
-    bg: "#f0fdf4"
-  },
-  {
-    label: "Orange",
-    border: "#f97316",
-    bg: "#fff7ed"
-  },
-  {
-    label: "Red",
-    border: "#ef4444",
-    bg: "#fef2f2"
-  },
-  {
-    label: "Purple",
-    border: "#8b5cf6",
-    bg: "#faf5ff"
-  },
-  {
-    label: "Gray",
-    border: "#6b7280",
-    bg: "#f9fafb"
-  }
-], z = [
-  {
-    key: "block",
-    label: "Block",
-    icon: /* @__PURE__ */ r("svg", {
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      children: [
-        /* @__PURE__ */ t("rect", {
-          x: "3",
-          y: "5",
-          width: "18",
-          height: "14",
-          rx: "2"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "3",
-          y1: "3",
-          x2: "21",
-          y2: "3"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "3",
-          y1: "21",
-          x2: "21",
-          y2: "21"
-        })
-      ]
-    })
-  },
-  {
-    key: "wrap-left",
-    label: "Wrap Left",
-    icon: /* @__PURE__ */ r("svg", {
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      children: [
-        /* @__PURE__ */ t("rect", {
-          x: "2",
-          y: "4",
-          width: "10",
-          height: "8",
-          rx: "1"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "15",
-          y1: "5",
-          x2: "22",
-          y2: "5"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "15",
-          y1: "8",
-          x2: "22",
-          y2: "8"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "15",
-          y1: "11",
-          x2: "22",
-          y2: "11"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "15",
-          x2: "22",
-          y2: "15"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "18",
-          x2: "22",
-          y2: "18"
-        })
-      ]
-    })
-  },
-  {
-    key: "wrap-right",
-    label: "Wrap Right",
-    icon: /* @__PURE__ */ r("svg", {
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      children: [
-        /* @__PURE__ */ t("rect", {
-          x: "12",
-          y: "4",
-          width: "10",
-          height: "8",
-          rx: "1"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "5",
-          x2: "9",
-          y2: "5"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "8",
-          x2: "9",
-          y2: "8"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "11",
-          x2: "9",
-          y2: "11"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "15",
-          x2: "22",
-          y2: "15"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "18",
-          x2: "22",
-          y2: "18"
-        })
-      ]
-    })
-  },
-  {
-    key: "float",
-    label: "Float",
-    icon: /* @__PURE__ */ r("svg", {
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      children: [
-        /* @__PURE__ */ t("rect", {
-          x: "6",
-          y: "6",
-          width: "12",
-          height: "12",
-          rx: "2"
-        }),
-        /* @__PURE__ */ t("path", {
-          d: "M2 2h4M18 2h4M2 22h4M18 22h4",
-          strokeDasharray: "2 2"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "2",
-          y1: "12",
-          x2: "6",
-          y2: "12",
-          strokeDasharray: "2 2"
-        }),
-        /* @__PURE__ */ t("line", {
-          x1: "18",
-          y1: "12",
-          x2: "22",
-          y2: "12",
-          strokeDasharray: "2 2"
-        })
-      ]
-    })
-  }
+import { cn as e } from "../../../../utils/cn.js";
+import { useCallback as t, useEffect as n, useRef as r, useState as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Node as s, NodeViewContent as c, NodeViewWrapper as l, ReactNodeViewRenderer as u, mergeAttributes as d } from "@tiptap/react";
+//#region src/components/pro/RichTextEditor/extensions/FloatingDialog.tsx
+var f = [
+	{
+		label: "Blue",
+		border: "#3b82f6",
+		bg: "#eff6ff"
+	},
+	{
+		label: "Green",
+		border: "#22c55e",
+		bg: "#f0fdf4"
+	},
+	{
+		label: "Orange",
+		border: "#f97316",
+		bg: "#fff7ed"
+	},
+	{
+		label: "Red",
+		border: "#ef4444",
+		bg: "#fef2f2"
+	},
+	{
+		label: "Purple",
+		border: "#8b5cf6",
+		bg: "#faf5ff"
+	},
+	{
+		label: "Gray",
+		border: "#6b7280",
+		bg: "#f9fafb"
+	}
+], p = [
+	{
+		key: "block",
+		label: "Block",
+		icon: /* @__PURE__ */ o("svg", {
+			width: "14",
+			height: "14",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			children: [
+				/* @__PURE__ */ a("rect", {
+					x: "3",
+					y: "5",
+					width: "18",
+					height: "14",
+					rx: "2"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "3",
+					y1: "3",
+					x2: "21",
+					y2: "3"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "3",
+					y1: "21",
+					x2: "21",
+					y2: "21"
+				})
+			]
+		})
+	},
+	{
+		key: "wrap-left",
+		label: "Wrap Left",
+		icon: /* @__PURE__ */ o("svg", {
+			width: "14",
+			height: "14",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			children: [
+				/* @__PURE__ */ a("rect", {
+					x: "2",
+					y: "4",
+					width: "10",
+					height: "8",
+					rx: "1"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "15",
+					y1: "5",
+					x2: "22",
+					y2: "5"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "15",
+					y1: "8",
+					x2: "22",
+					y2: "8"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "15",
+					y1: "11",
+					x2: "22",
+					y2: "11"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "15",
+					x2: "22",
+					y2: "15"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "18",
+					x2: "22",
+					y2: "18"
+				})
+			]
+		})
+	},
+	{
+		key: "wrap-right",
+		label: "Wrap Right",
+		icon: /* @__PURE__ */ o("svg", {
+			width: "14",
+			height: "14",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			children: [
+				/* @__PURE__ */ a("rect", {
+					x: "12",
+					y: "4",
+					width: "10",
+					height: "8",
+					rx: "1"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "5",
+					x2: "9",
+					y2: "5"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "8",
+					x2: "9",
+					y2: "8"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "11",
+					x2: "9",
+					y2: "11"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "15",
+					x2: "22",
+					y2: "15"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "18",
+					x2: "22",
+					y2: "18"
+				})
+			]
+		})
+	},
+	{
+		key: "float",
+		label: "Float",
+		icon: /* @__PURE__ */ o("svg", {
+			width: "14",
+			height: "14",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			children: [
+				/* @__PURE__ */ a("rect", {
+					x: "6",
+					y: "6",
+					width: "12",
+					height: "12",
+					rx: "2"
+				}),
+				/* @__PURE__ */ a("path", {
+					d: "M2 2h4M18 2h4M2 22h4M18 22h4",
+					strokeDasharray: "2 2"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "2",
+					y1: "12",
+					x2: "6",
+					y2: "12",
+					strokeDasharray: "2 2"
+				}),
+				/* @__PURE__ */ a("line", {
+					x1: "18",
+					y1: "12",
+					x2: "22",
+					y2: "12",
+					strokeDasharray: "2 2"
+				})
+			]
+		})
+	}
 ];
-function I(a) {
-  const i = [];
-  return a.state.doc.descendants((l) => {
-    l.type.name === "floatingDialog" && l.attrs.layout === "float" && i.push(l.attrs.zIndex ?? 10);
-  }), i;
+function m(e) {
+	let t = [];
+	return e.state.doc.descendants((e) => {
+		e.type.name === "floatingDialog" && e.attrs.layout === "float" && t.push(e.attrs.zIndex ?? 10);
+	}), t;
 }
-var q = ({ node: a, editor: i, updateAttributes: l, deleteNode: x, selected: S }) => {
-  const o = a.attrs, s = o.layout || "block", d = s === "float", c = o.zIndex ?? 10, [W, D] = b(!1), [p, M] = b(o.title), [P, w] = b(!1), [L, v] = b(!1), h = m({
-    mx: 0,
-    my: 0,
-    x: 0,
-    y: 0
-  }), g = m({
-    mx: 0,
-    my: 0,
-    w: 0,
-    h: 0
-  }), k = m(null), _ = m(null);
-  E(() => {
-    M(o.title);
-  }, [o.title]), E(() => {
-    const e = (n) => {
-      k.current && !k.current.contains(n.target) && w(!1), _.current && !_.current.contains(n.target) && v(!1);
-    };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []);
-  const R = u((e) => {
-    if (!d) return;
-    e.preventDefault(), e.stopPropagation(), h.current = {
-      mx: e.clientX,
-      my: e.clientY,
-      x: o.x,
-      y: o.y
-    };
-    const n = (y) => {
-      const C = y.clientX - h.current.mx, N = y.clientY - h.current.my;
-      l({
-        x: h.current.x + C,
-        y: h.current.y + N
-      });
-    }, f = () => {
-      document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", f);
-    };
-    document.addEventListener("mousemove", n), document.addEventListener("mouseup", f);
-  }, [
-    d,
-    o.x,
-    o.y,
-    l
-  ]), T = u((e) => {
-    e.preventDefault(), e.stopPropagation(), g.current = {
-      mx: e.clientX,
-      my: e.clientY,
-      w: o.width,
-      h: o.height
-    };
-    const n = (y) => {
-      const C = y.clientX - g.current.mx, N = y.clientY - g.current.my;
-      l({
-        width: Math.max(160, g.current.w + C),
-        height: Math.max(80, g.current.h + N)
-      });
-    }, f = () => {
-      document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", f);
-    };
-    document.addEventListener("mousemove", n), document.addEventListener("mouseup", f);
-  }, [
-    o.width,
-    o.height,
-    l
-  ]), B = u(() => {
-    l({ title: p }), D(!1);
-  }, [p, l]), F = u(() => {
-    const e = I(i), n = Math.max(...e);
-    c < n && l({ zIndex: n + 1 });
-  }, [
-    i,
-    c,
-    l
-  ]), O = u(() => {
-    const e = I(i), n = Math.min(...e);
-    c > n ? l({ zIndex: n - 1 }) : c > 1 && l({ zIndex: c - 1 });
-  }, [
-    i,
-    c,
-    l
-  ]), V = [
-    "rte-float-dialog",
-    `rte-float-dialog--${s}`,
-    S ? "rte-float-dialog--selected" : ""
-  ].filter(Boolean).join(" "), Y = d ? {
-    position: "absolute",
-    left: o.x,
-    top: o.y,
-    zIndex: c
-  } : {}, Z = {
-    width: s === "block" ? "100%" : o.width,
-    minHeight: o.height,
-    borderColor: o.borderColor,
-    backgroundColor: o.bgColor
-  }, X = z.find((e) => e.key === s)?.icon;
-  return /* @__PURE__ */ t(H, {
-    className: V,
-    style: Y,
-    children: /* @__PURE__ */ r("div", {
-      className: "rte-float-dialog__box",
-      style: Z,
-      children: [
-        /* @__PURE__ */ r("div", {
-          className: "rte-float-dialog__titlebar",
-          style: { borderBottomColor: o.borderColor },
-          onMouseDown: R,
-          contentEditable: !1,
-          children: [
-            d && /* @__PURE__ */ t("span", {
-              className: "rte-float-dialog__drag-icon",
-              children: /* @__PURE__ */ r("svg", {
-                width: "12",
-                height: "12",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                children: [
-                  /* @__PURE__ */ t("circle", {
-                    cx: "9",
-                    cy: "5",
-                    r: "1.5"
-                  }),
-                  /* @__PURE__ */ t("circle", {
-                    cx: "15",
-                    cy: "5",
-                    r: "1.5"
-                  }),
-                  /* @__PURE__ */ t("circle", {
-                    cx: "9",
-                    cy: "12",
-                    r: "1.5"
-                  }),
-                  /* @__PURE__ */ t("circle", {
-                    cx: "15",
-                    cy: "12",
-                    r: "1.5"
-                  }),
-                  /* @__PURE__ */ t("circle", {
-                    cx: "9",
-                    cy: "19",
-                    r: "1.5"
-                  }),
-                  /* @__PURE__ */ t("circle", {
-                    cx: "15",
-                    cy: "19",
-                    r: "1.5"
-                  })
-                ]
-              })
-            }),
-            W ? /* @__PURE__ */ t("input", {
-              className: "rte-float-dialog__title-input",
-              value: p,
-              onChange: (e) => M(e.target.value),
-              placeholder: "Title...",
-              onMouseDown: (e) => e.stopPropagation(),
-              onBlur: B,
-              onKeyDown: (e) => {
-                (e.key === "Enter" || e.key === "Escape") && B();
-              },
-              autoFocus: !0
-            }) : /* @__PURE__ */ t("span", {
-              className: "rte-float-dialog__title",
-              onDoubleClick: () => D(!0),
-              children: o.title || "Dialog"
-            }),
-            /* @__PURE__ */ r("div", {
-              className: "rte-float-dialog__actions",
-              children: [
-                d && /* @__PURE__ */ r("div", {
-                  className: "rte-float-dialog__zorder",
-                  children: [/* @__PURE__ */ t("button", {
-                    type: "button",
-                    className: "rte-float-dialog__action-btn",
-                    onClick: (e) => {
-                      e.stopPropagation(), F();
-                    },
-                    title: "Bring to Front",
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: /* @__PURE__ */ r("svg", {
-                      width: "12",
-                      height: "12",
-                      viewBox: "0 0 24 24",
-                      fill: "none",
-                      stroke: "currentColor",
-                      strokeWidth: "2",
-                      children: [/* @__PURE__ */ t("rect", {
-                        x: "8",
-                        y: "2",
-                        width: "13",
-                        height: "13",
-                        rx: "2"
-                      }), /* @__PURE__ */ t("rect", {
-                        x: "3",
-                        y: "9",
-                        width: "13",
-                        height: "13",
-                        rx: "2",
-                        opacity: "0.4"
-                      })]
-                    })
-                  }), /* @__PURE__ */ t("button", {
-                    type: "button",
-                    className: "rte-float-dialog__action-btn",
-                    onClick: (e) => {
-                      e.stopPropagation(), O();
-                    },
-                    title: "Send to Back",
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: /* @__PURE__ */ r("svg", {
-                      width: "12",
-                      height: "12",
-                      viewBox: "0 0 24 24",
-                      fill: "none",
-                      stroke: "currentColor",
-                      strokeWidth: "2",
-                      children: [/* @__PURE__ */ t("rect", {
-                        x: "3",
-                        y: "9",
-                        width: "13",
-                        height: "13",
-                        rx: "2"
-                      }), /* @__PURE__ */ t("rect", {
-                        x: "8",
-                        y: "2",
-                        width: "13",
-                        height: "13",
-                        rx: "2",
-                        opacity: "0.4"
-                      })]
-                    })
-                  })]
-                }),
-                /* @__PURE__ */ r("div", {
-                  ref: _,
-                  style: { position: "relative" },
-                  children: [/* @__PURE__ */ t("button", {
-                    type: "button",
-                    className: "rte-float-dialog__action-btn",
-                    onClick: (e) => {
-                      e.stopPropagation(), v(!L);
-                    },
-                    title: `Layout: ${s}`,
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: X
-                  }), L && /* @__PURE__ */ t("div", {
-                    className: "rte-float-dialog__layout-dropdown",
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: z.map((e) => /* @__PURE__ */ r("button", {
-                      type: "button",
-                      className: `rte-float-dialog__layout-option ${s === e.key ? "rte-float-dialog__layout-option--active" : ""}`,
-                      onClick: () => {
-                        l({ layout: e.key }), v(!1);
-                      },
-                      title: e.label,
-                      children: [e.icon, /* @__PURE__ */ t("span", { children: e.label })]
-                    }, e.key))
-                  })]
-                }),
-                /* @__PURE__ */ r("div", {
-                  ref: k,
-                  style: { position: "relative" },
-                  children: [/* @__PURE__ */ t("button", {
-                    type: "button",
-                    className: "rte-float-dialog__action-btn",
-                    onClick: (e) => {
-                      e.stopPropagation(), w(!P);
-                    },
-                    title: "Color",
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: /* @__PURE__ */ t("svg", {
-                      width: "12",
-                      height: "12",
-                      viewBox: "0 0 24 24",
-                      fill: o.borderColor,
-                      stroke: o.borderColor,
-                      strokeWidth: "2",
-                      children: /* @__PURE__ */ t("circle", {
-                        cx: "12",
-                        cy: "12",
-                        r: "8"
-                      })
-                    })
-                  }), P && /* @__PURE__ */ t("div", {
-                    className: "rte-float-dialog__color-dropdown",
-                    onMouseDown: (e) => e.stopPropagation(),
-                    children: K.map((e) => /* @__PURE__ */ t("button", {
-                      type: "button",
-                      className: "rte-float-dialog__color-swatch",
-                      style: { backgroundColor: e.border },
-                      onClick: () => {
-                        l({
-                          borderColor: e.border,
-                          bgColor: e.bg
-                        }), w(!1);
-                      },
-                      title: e.label
-                    }, e.label))
-                  })]
-                }),
-                /* @__PURE__ */ t("button", {
-                  type: "button",
-                  className: "rte-float-dialog__action-btn rte-float-dialog__action-btn--danger",
-                  onClick: (e) => {
-                    e.stopPropagation(), x();
-                  },
-                  title: "Delete",
-                  onMouseDown: (e) => e.stopPropagation(),
-                  children: /* @__PURE__ */ r("svg", {
-                    width: "12",
-                    height: "12",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    children: [/* @__PURE__ */ t("line", {
-                      x1: "18",
-                      y1: "6",
-                      x2: "6",
-                      y2: "18"
-                    }), /* @__PURE__ */ t("line", {
-                      x1: "6",
-                      y1: "6",
-                      x2: "18",
-                      y2: "18"
-                    })]
-                  })
-                })
-              ]
-            })
-          ]
-        }),
-        /* @__PURE__ */ t(G, { className: "rte-float-dialog__body" }),
-        /* @__PURE__ */ t("div", {
-          className: "rte-float-dialog__resize-handle",
-          onMouseDown: T,
-          contentEditable: !1,
-          children: /* @__PURE__ */ r("svg", {
-            width: "10",
-            height: "10",
-            viewBox: "0 0 10 10",
-            fill: "currentColor",
-            children: [
-              /* @__PURE__ */ t("circle", {
-                cx: "8",
-                cy: "8",
-                r: "1.2"
-              }),
-              /* @__PURE__ */ t("circle", {
-                cx: "4",
-                cy: "8",
-                r: "1.2"
-              }),
-              /* @__PURE__ */ t("circle", {
-                cx: "8",
-                cy: "4",
-                r: "1.2"
-              })
-            ]
-          })
-        })
-      ]
-    })
-  });
+var h = ({ node: s, editor: u, updateAttributes: d, deleteNode: h, selected: g }) => {
+	let _ = s.attrs, v = _.layout || "block", y = v === "float", b = _.zIndex ?? 10, [x, S] = i(!1), [C, w] = i(_.title), [T, E] = i(!1), [D, O] = i(!1), k = r({
+		mx: 0,
+		my: 0,
+		x: 0,
+		y: 0
+	}), A = r({
+		mx: 0,
+		my: 0,
+		w: 0,
+		h: 0
+	}), j = r(null), M = r(null);
+	n(() => {
+		w(_.title);
+	}, [_.title]), n(() => {
+		let e = (e) => {
+			j.current && !j.current.contains(e.target) && E(!1), M.current && !M.current.contains(e.target) && O(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, []);
+	let N = t((e) => {
+		if (!y) return;
+		e.preventDefault(), e.stopPropagation(), k.current = {
+			mx: e.clientX,
+			my: e.clientY,
+			x: _.x,
+			y: _.y
+		};
+		let t = (e) => {
+			let t = e.clientX - k.current.mx, n = e.clientY - k.current.my;
+			d({
+				x: k.current.x + t,
+				y: k.current.y + n
+			});
+		}, n = () => {
+			document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", n);
+		};
+		document.addEventListener("mousemove", t), document.addEventListener("mouseup", n);
+	}, [
+		y,
+		_.x,
+		_.y,
+		d
+	]), P = t((e) => {
+		e.preventDefault(), e.stopPropagation(), A.current = {
+			mx: e.clientX,
+			my: e.clientY,
+			w: _.width,
+			h: _.height
+		};
+		let t = (e) => {
+			let t = e.clientX - A.current.mx, n = e.clientY - A.current.my;
+			d({
+				width: Math.max(160, A.current.w + t),
+				height: Math.max(80, A.current.h + n)
+			});
+		}, n = () => {
+			document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", n);
+		};
+		document.addEventListener("mousemove", t), document.addEventListener("mouseup", n);
+	}, [
+		_.width,
+		_.height,
+		d
+	]), F = t(() => {
+		d({ title: C }), S(!1);
+	}, [C, d]), I = t(() => {
+		let e = m(u), t = Math.max(...e);
+		b < t && d({ zIndex: t + 1 });
+	}, [
+		u,
+		b,
+		d
+	]), L = t(() => {
+		let e = m(u), t = Math.min(...e);
+		b > t ? d({ zIndex: t - 1 }) : b > 1 && d({ zIndex: b - 1 });
+	}, [
+		u,
+		b,
+		d
+	]), R = e("rte-float-dialog", `rte-float-dialog--${v}`, g && "rte-float-dialog--selected"), z = y ? {
+		position: "absolute",
+		left: _.x,
+		top: _.y,
+		zIndex: b
+	} : {}, B = {
+		width: v === "block" ? "100%" : _.width,
+		minHeight: _.height,
+		borderColor: _.borderColor,
+		backgroundColor: _.bgColor
+	}, V = p.find((e) => e.key === v)?.icon;
+	return /* @__PURE__ */ a(l, {
+		className: R,
+		style: z,
+		children: /* @__PURE__ */ o("div", {
+			className: "rte-float-dialog__box",
+			style: B,
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "rte-float-dialog__titlebar",
+					style: { borderBottomColor: _.borderColor },
+					onMouseDown: N,
+					contentEditable: !1,
+					children: [
+						y && /* @__PURE__ */ a("span", {
+							className: "rte-float-dialog__drag-icon",
+							children: /* @__PURE__ */ o("svg", {
+								width: "12",
+								height: "12",
+								viewBox: "0 0 24 24",
+								fill: "none",
+								stroke: "currentColor",
+								strokeWidth: "2",
+								children: [
+									/* @__PURE__ */ a("circle", {
+										cx: "9",
+										cy: "5",
+										r: "1.5"
+									}),
+									/* @__PURE__ */ a("circle", {
+										cx: "15",
+										cy: "5",
+										r: "1.5"
+									}),
+									/* @__PURE__ */ a("circle", {
+										cx: "9",
+										cy: "12",
+										r: "1.5"
+									}),
+									/* @__PURE__ */ a("circle", {
+										cx: "15",
+										cy: "12",
+										r: "1.5"
+									}),
+									/* @__PURE__ */ a("circle", {
+										cx: "9",
+										cy: "19",
+										r: "1.5"
+									}),
+									/* @__PURE__ */ a("circle", {
+										cx: "15",
+										cy: "19",
+										r: "1.5"
+									})
+								]
+							})
+						}),
+						x ? /* @__PURE__ */ a("input", {
+							className: "rte-float-dialog__title-input",
+							value: C,
+							onChange: (e) => w(e.target.value),
+							placeholder: "Title...",
+							onMouseDown: (e) => e.stopPropagation(),
+							onBlur: F,
+							onKeyDown: (e) => {
+								(e.key === "Enter" || e.key === "Escape") && F();
+							},
+							autoFocus: !0
+						}) : /* @__PURE__ */ a("span", {
+							className: "rte-float-dialog__title",
+							onDoubleClick: () => S(!0),
+							children: _.title || "Dialog"
+						}),
+						/* @__PURE__ */ o("div", {
+							className: "rte-float-dialog__actions",
+							children: [
+								y && /* @__PURE__ */ o("div", {
+									className: "rte-float-dialog__zorder",
+									children: [/* @__PURE__ */ a("button", {
+										type: "button",
+										className: "rte-float-dialog__action-btn",
+										onClick: (e) => {
+											e.stopPropagation(), I();
+										},
+										title: "Bring to Front",
+										onMouseDown: (e) => e.stopPropagation(),
+										children: /* @__PURE__ */ o("svg", {
+											width: "12",
+											height: "12",
+											viewBox: "0 0 24 24",
+											fill: "none",
+											stroke: "currentColor",
+											strokeWidth: "2",
+											children: [/* @__PURE__ */ a("rect", {
+												x: "8",
+												y: "2",
+												width: "13",
+												height: "13",
+												rx: "2"
+											}), /* @__PURE__ */ a("rect", {
+												x: "3",
+												y: "9",
+												width: "13",
+												height: "13",
+												rx: "2",
+												opacity: "0.4"
+											})]
+										})
+									}), /* @__PURE__ */ a("button", {
+										type: "button",
+										className: "rte-float-dialog__action-btn",
+										onClick: (e) => {
+											e.stopPropagation(), L();
+										},
+										title: "Send to Back",
+										onMouseDown: (e) => e.stopPropagation(),
+										children: /* @__PURE__ */ o("svg", {
+											width: "12",
+											height: "12",
+											viewBox: "0 0 24 24",
+											fill: "none",
+											stroke: "currentColor",
+											strokeWidth: "2",
+											children: [/* @__PURE__ */ a("rect", {
+												x: "3",
+												y: "9",
+												width: "13",
+												height: "13",
+												rx: "2"
+											}), /* @__PURE__ */ a("rect", {
+												x: "8",
+												y: "2",
+												width: "13",
+												height: "13",
+												rx: "2",
+												opacity: "0.4"
+											})]
+										})
+									})]
+								}),
+								/* @__PURE__ */ o("div", {
+									ref: M,
+									style: { position: "relative" },
+									children: [/* @__PURE__ */ a("button", {
+										type: "button",
+										className: "rte-float-dialog__action-btn",
+										onClick: (e) => {
+											e.stopPropagation(), O(!D);
+										},
+										title: `Layout: ${v}`,
+										onMouseDown: (e) => e.stopPropagation(),
+										children: V
+									}), D && /* @__PURE__ */ a("div", {
+										className: "rte-float-dialog__layout-dropdown",
+										onMouseDown: (e) => e.stopPropagation(),
+										children: p.map((e) => /* @__PURE__ */ o("button", {
+											type: "button",
+											className: `rte-float-dialog__layout-option ${v === e.key ? "rte-float-dialog__layout-option--active" : ""}`,
+											onClick: () => {
+												d({ layout: e.key }), O(!1);
+											},
+											title: e.label,
+											children: [e.icon, /* @__PURE__ */ a("span", { children: e.label })]
+										}, e.key))
+									})]
+								}),
+								/* @__PURE__ */ o("div", {
+									ref: j,
+									style: { position: "relative" },
+									children: [/* @__PURE__ */ a("button", {
+										type: "button",
+										className: "rte-float-dialog__action-btn",
+										onClick: (e) => {
+											e.stopPropagation(), E(!T);
+										},
+										title: "Color",
+										onMouseDown: (e) => e.stopPropagation(),
+										children: /* @__PURE__ */ a("svg", {
+											width: "12",
+											height: "12",
+											viewBox: "0 0 24 24",
+											fill: _.borderColor,
+											stroke: _.borderColor,
+											strokeWidth: "2",
+											children: /* @__PURE__ */ a("circle", {
+												cx: "12",
+												cy: "12",
+												r: "8"
+											})
+										})
+									}), T && /* @__PURE__ */ a("div", {
+										className: "rte-float-dialog__color-dropdown",
+										onMouseDown: (e) => e.stopPropagation(),
+										children: f.map((e) => /* @__PURE__ */ a("button", {
+											type: "button",
+											className: "rte-float-dialog__color-swatch",
+											style: { backgroundColor: e.border },
+											onClick: () => {
+												d({
+													borderColor: e.border,
+													bgColor: e.bg
+												}), E(!1);
+											},
+											title: e.label
+										}, e.label))
+									})]
+								}),
+								/* @__PURE__ */ a("button", {
+									type: "button",
+									className: "rte-float-dialog__action-btn rte-float-dialog__action-btn--danger",
+									onClick: (e) => {
+										e.stopPropagation(), h();
+									},
+									title: "Delete",
+									onMouseDown: (e) => e.stopPropagation(),
+									children: /* @__PURE__ */ o("svg", {
+										width: "12",
+										height: "12",
+										viewBox: "0 0 24 24",
+										fill: "none",
+										stroke: "currentColor",
+										strokeWidth: "2",
+										children: [/* @__PURE__ */ a("line", {
+											x1: "18",
+											y1: "6",
+											x2: "6",
+											y2: "18"
+										}), /* @__PURE__ */ a("line", {
+											x1: "6",
+											y1: "6",
+											x2: "18",
+											y2: "18"
+										})]
+									})
+								})
+							]
+						})
+					]
+				}),
+				/* @__PURE__ */ a(c, { className: "rte-float-dialog__body" }),
+				/* @__PURE__ */ a("div", {
+					className: "rte-float-dialog__resize-handle",
+					onMouseDown: P,
+					contentEditable: !1,
+					children: /* @__PURE__ */ o("svg", {
+						width: "10",
+						height: "10",
+						viewBox: "0 0 10 10",
+						fill: "currentColor",
+						children: [
+							/* @__PURE__ */ a("circle", {
+								cx: "8",
+								cy: "8",
+								r: "1.2"
+							}),
+							/* @__PURE__ */ a("circle", {
+								cx: "4",
+								cy: "8",
+								r: "1.2"
+							}),
+							/* @__PURE__ */ a("circle", {
+								cx: "8",
+								cy: "4",
+								r: "1.2"
+							})
+						]
+					})
+				})
+			]
+		})
+	});
 };
-function te(a) {
-  let i = 9;
-  return a.state.doc.descendants((l) => {
-    if (l.type.name === "floatingDialog" && l.attrs.layout === "float") {
-      const x = l.attrs.zIndex ?? 10;
-      x > i && (i = x);
-    }
-  }), i + 1;
+function g(e) {
+	let t = 9;
+	return e.state.doc.descendants((e) => {
+		if (e.type.name === "floatingDialog" && e.attrs.layout === "float") {
+			let n = e.attrs.zIndex ?? 10;
+			n > t && (t = n);
+		}
+	}), t + 1;
 }
-var oe = j.create({
-  name: "floatingDialog",
-  group: "block",
-  content: "block+",
-  draggable: !0,
-  isolating: !0,
-  defining: !0,
-  addAttributes() {
-    return {
-      title: { default: "Note" },
-      x: { default: 20 },
-      y: { default: 0 },
-      width: { default: 280 },
-      height: { default: 120 },
-      borderColor: { default: "#3b82f6" },
-      bgColor: { default: "#eff6ff" },
-      layout: { default: "block" },
-      zIndex: { default: 10 }
-    };
-  },
-  parseHTML() {
-    return [{ tag: 'div[data-type="floating-dialog"]' }];
-  },
-  renderHTML({ HTMLAttributes: a }) {
-    return [
-      "div",
-      $(a, { "data-type": "floating-dialog" }),
-      0
-    ];
-  },
-  addNodeView() {
-    return U(q);
-  }
+var _ = s.create({
+	name: "floatingDialog",
+	group: "block",
+	content: "block+",
+	draggable: !0,
+	isolating: !0,
+	defining: !0,
+	addAttributes() {
+		return {
+			title: { default: "Note" },
+			x: { default: 20 },
+			y: { default: 0 },
+			width: { default: 280 },
+			height: { default: 120 },
+			borderColor: { default: "#3b82f6" },
+			bgColor: { default: "#eff6ff" },
+			layout: { default: "block" },
+			zIndex: { default: 10 }
+		};
+	},
+	parseHTML() {
+		return [{ tag: "div[data-type=\"floating-dialog\"]" }];
+	},
+	renderHTML({ HTMLAttributes: e }) {
+		return [
+			"div",
+			d(e, { "data-type": "floating-dialog" }),
+			0
+		];
+	},
+	addNodeView() {
+		return u(h);
+	}
 });
-export {
-  oe as FloatingDialogExtension,
-  oe as default,
-  te as getNextFloatZIndex
-};
+//#endregion
+export { _ as FloatingDialogExtension, _ as default, g as getNextFloatZIndex };
 
 //# sourceMappingURL=FloatingDialog.js.map