@frontify/fondue
Version:
Design system of Frontify
41 lines (40 loc) • 1.5 kB
JavaScript
import { jsx as e, jsxs as c, Fragment as g } from "react/jsx-runtime";
import { offset as y, flip as k } from "@udecode/plate-floating";
import { useFloatingLinkInsertState as b, useFloatingLinkInsert as F, useFloatingLinkEditState as L, useFloatingLinkEdit as P } from "@udecode/plate-link";
import { createPortal as s } from "react-dom";
import { InsertLinkModal as h } from "./InsertLinkModal/InsertLinkModal.es.js";
import { EditModal as E } from "./EditLinkModal/EditModal.es.js";
const d = {
placement: "bottom-start",
strategy: "absolute",
middleware: [
y(12),
k({
padding: 12,
fallbackPlacements: ["bottom-end", "top-start", "top-end"]
})
]
}, B = () => {
const n = b({
floatingOptions: d
}), { props: o, ref: a, hidden: l } = F(n), t = L({
floatingOptions: d
}), { props: i, ref: p, editButtonProps: m, unlinkButtonProps: u } = P(t);
if (l)
return null;
const r = /* @__PURE__ */ e(h, {}), f = t.isEditing ? r : /* @__PURE__ */ e(E, { editButtonProps: m, unlinkButtonProps: u });
return /* @__PURE__ */ c(g, { children: [
n.isOpen && !t.isOpen && s(
/* @__PURE__ */ e("div", { "data-is-underlay": !0, ref: a, ...o, style: o.style, children: r }),
document.body
),
t.isOpen && s(
/* @__PURE__ */ e("div", { "data-is-underlay": !0, ref: p, ...i, style: i.style, children: f }),
document.body
)
] });
};
export {
B as CustomFloatingLink
};
//# sourceMappingURL=CustomFloatingLink.es.js.map