@blocknote/mantine 0.41.1 → 0.42.0

package/dist/blocknote-mantine.js

@@ -1,19 +1,19 @@
 import { jsx as s, jsxs as v } from "react/jsx-runtime";
-import { assertEmpty as d, isSafari as R, mergeCSSClasses as E, COLORS_DEFAULT as ie, COLORS_DARK_MODE_DEFAULT as ae } from "@blocknote/core";
-import { mergeRefs as U, useDictionary as le, useBlockNoteContext as W, FormattingToolbarController as ce, getFormattingToolbarItems as ue, FormattingToolbar as de, elementOverflow as q, usePrefersColorScheme as me, ComponentsContext as fe, BlockNoteViewRaw as ge } from "@blocknote/react";
-import { Button as T, ActionIcon as L, Tooltip as Z, Stack as z, Text as C, Group as h, Chip as be, Divider as he, Card as J, Skeleton as _, Avatar as pe, TextInput as Q, Menu as p, CheckIcon as B, Tabs as P, LoadingOverlay as ve, FileInput as Se, PopoverDropdown as ye, PopoverTarget as we, Popover as xe, Badge as Ce, Loader as X, Flex as Ne, MantineContext as Te, MantineProvider as ke } from "@mantine/core";
-import N, { forwardRef as m, useState as Y, useRef as j, useEffect as $, useContext as ee, createContext as Pe, useCallback as Fe } from "react";
-import { useHover as Me, useFocusWithin as te, mergeRefs as A, useFocusTrap as Oe } from "@mantine/hooks";
-const ne = (e, n, t = !1) => {
+import { assertEmpty as u, isSafari as R, mergeCSSClasses as B, COLORS_DEFAULT as re, COLORS_DARK_MODE_DEFAULT as se } from "@blocknote/core";
+import { mergeRefs as ie, useDictionary as ae, useBlockNoteContext as H, FormattingToolbarController as le, getFormattingToolbarItems as ce, FormattingToolbar as de, elementOverflow as K, usePrefersColorScheme as ue, ComponentsContext as me, BlockNoteViewRaw as ge } from "@blocknote/react";
+import { Button as T, ActionIcon as E, Tooltip as U, Stack as L, Text as C, Group as h, Chip as fe, Divider as be, Card as W, Skeleton as $, Avatar as he, TextInput as q, Menu as p, CheckIcon as z, Tabs as k, LoadingOverlay as pe, FileInput as ve, PopoverDropdown as Se, PopoverTarget as ye, Popover as we, Badge as xe, Loader as Z, Flex as Ce, MantineContext as Ne, MantineProvider as Te } from "@mantine/core";
+import N, { forwardRef as m, useState as J, useContext as Q, createContext as Pe, useRef as X, useEffect as Y, useCallback as ke } from "react";
+import { useHover as Fe, mergeRefs as j, useFocusWithin as Me, useFocusTrap as Oe } from "@mantine/hooks";
+const ee = (e, n, t = !1) => {
   const o = [];
   function r(i, a = "--bn") {
     for (const l in i) {
-      const c = l.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(), u = `${a}-${c}`;
-      typeof i[l] != "object" ? (typeof i[l] == "number" && (i[l] = `${i[l]}px`), t ? n.style.removeProperty(u) : n.style.setProperty(u, i[l].toString())) : r(i[l], u);
+      const c = l.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(), d = `${a}-${c}`;
+      typeof i[l] != "object" ? (typeof i[l] == "number" && (i[l] = `${i[l]}px`), t ? n.style.removeProperty(d) : n.style.setProperty(d, i[l].toString())) : r(i[l], d);
     }
   }
   return r(e), o;
-}, V = (e, n) => ne(e, n), De = {
+}, A = (e, n) => ee(e, n), De = {
   colors: {
     editor: {
       text: void 0,
@@ -83,7 +83,7 @@ const ne = (e, n, t = !1) => {
   },
   borderRadius: void 0,
   fontFamily: void 0
-}, Ie = (e) => ne(De, e, !0), oe = (e) => /* @__PURE__ */ v(z, { gap: 0, className: "bn-tooltip", children: [
+}, Ie = (e) => ee(De, e, !0), te = (e) => /* @__PURE__ */ v(L, { gap: 0, className: "bn-tooltip", children: [
   /* @__PURE__ */ s(C, { size: "sm", lineClamp: 5, children: e.mainTooltip }),
   e.secondaryTooltip && /* @__PURE__ */ s(C, { size: "xs", lineClamp: 5, children: e.secondaryTooltip })
 ] }), O = m(
@@ -96,22 +96,22 @@ const ne = (e, n, t = !1) => {
       icon: a,
       isSelected: l,
       isDisabled: c,
-      onClick: u,
-      label: g,
+      onClick: d,
+      label: f,
       variant: b,
       ...S
     } = e;
-    d(S, !1);
-    const [x, y] = Y(!1), k = o ? /* @__PURE__ */ s(
+    u(S, !1);
+    const [x, y] = J(!1), P = o ? /* @__PURE__ */ s(
       T,
       {
-        "aria-label": g,
+        "aria-label": f,
         className: t,
         onMouseDown: (w) => {
           R() && w.currentTarget.focus();
         },
         onClick: (w) => {
-          y(!0), u == null || u(w);
+          y(!0), d == null || d(w);
         },
         onPointerLeave: () => y(!1),
         "aria-pressed": l,
@@ -124,15 +124,15 @@ const ne = (e, n, t = !1) => {
         children: o
       }
     ) : /* @__PURE__ */ s(
-      L,
+      E,
       {
         className: t,
-        "aria-label": g,
+        "aria-label": f,
         onMouseDown: (w) => {
           R() && w.currentTarget.focus();
         },
         onClick: (w) => {
-          y(!0), u == null || u(w);
+          y(!0), d == null || d(w);
         },
         onPointerLeave: () => y(!1),
         "aria-pressed": l,
@@ -146,20 +146,20 @@ const ne = (e, n, t = !1) => {
       }
     );
     return r ? /* @__PURE__ */ s(
-      Z,
+      U,
       {
         disabled: x,
         withinPortal: !1,
         label: /* @__PURE__ */ s(
-          oe,
+          te,
           {
             mainTooltip: r,
             secondaryTooltip: i
           }
         ),
-        children: k
+        children: P
       }
-    ) : k;
+    ) : P;
   }
 ), Re = m((e, n) => {
   const {
@@ -170,17 +170,17 @@ const ne = (e, n, t = !1) => {
     mainTooltip: a,
     secondaryTooltip: l,
     onClick: c,
-    onMouseEnter: u,
-    ...g
+    onMouseEnter: d,
+    ...f
   } = e;
-  d(g, !1);
-  const [b, S] = Y(!1), x = /* @__PURE__ */ v(
-    be,
+  u(f, !1);
+  const [b, S] = J(!1), x = /* @__PURE__ */ v(
+    fe,
     {
       className: t,
       checked: i === !0,
       wrapperProps: {
-        onMouseEnter: u,
+        onMouseEnter: d,
         onMouseLeave: () => S(!1),
         onClick: (y) => {
           S(!0), c == null || c(y);
@@ -196,12 +196,12 @@ const ne = (e, n, t = !1) => {
     }
   );
   return !a || b ? x : /* @__PURE__ */ s(
-    Z,
+    U,
     {
       refProp: "rootRef",
       withinPortal: !1,
       label: /* @__PURE__ */ s(
-        oe,
+        te,
         {
           mainTooltip: a,
           secondaryTooltip: l
@@ -210,10 +210,10 @@ const ne = (e, n, t = !1) => {
       children: x
     }
   );
-}), Be = m((e, n) => {
+}), ze = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: o });
-}), Ee = m((e, n) => {
+  return u(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: o });
+}), Be = m((e, n) => {
   const {
     className: t,
     children: o,
@@ -222,37 +222,29 @@ const ne = (e, n, t = !1) => {
     onFocus: a,
     onBlur: l,
     tabIndex: c,
-    ...u
+    ...d
   } = e;
-  d(u, !1);
-  const g = j(null);
-  return $(() => {
-    var b;
-    i && ((b = g.current) == null || b.scrollIntoView({
-      behavior: "smooth",
-      block: "center"
-    }));
-  }, [i]), /* @__PURE__ */ v(
-    J,
+  return u(d, !1), /* @__PURE__ */ v(
+    W,
     {
-      className: E(t, i ? "selected" : ""),
+      className: B(t, i ? "selected" : ""),
       onFocus: a,
       onBlur: l,
       tabIndex: c,
-      ref: U([n, g]),
+      ref: n,
       children: [
         r && /* @__PURE__ */ s(C, { className: "bn-header-text", children: r }),
         o
       ]
     }
   );
-}), Le = m((e, n) => {
+}), Ee = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r, !1), /* @__PURE__ */ s(J.Section, { className: t, ref: n, children: o });
-}), ze = m((e, n) => {
+  return u(r, !1), /* @__PURE__ */ s(W.Section, { className: t, ref: n, children: o });
+}), Le = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r, !1), /* @__PURE__ */ s(
-    he,
+  return u(r, !1), /* @__PURE__ */ s(
+    be,
     {
       className: t,
       label: /* @__PURE__ */ s(C, { children: o }),
@@ -260,13 +252,13 @@ const ne = (e, n, t = !1) => {
     }
   );
 }), je = m((e, n) => {
-  const { authorInfo: t, timeString: o, edited: r, ...i } = e, a = le();
-  return d(i, !1), t === "loading" ? /* @__PURE__ */ v(h, { children: [
-    /* @__PURE__ */ s(_, { height: 24, width: 24 }),
-    /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s(_, { height: 12, width: 100 }) })
+  const { authorInfo: t, timeString: o, edited: r, ...i } = e, a = ae();
+  return u(i, !1), t === "loading" ? /* @__PURE__ */ v(h, { children: [
+    /* @__PURE__ */ s($, { height: 24, width: 24 }),
+    /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s($, { height: 12, width: 100 }) })
   ] }) : /* @__PURE__ */ v(h, { children: [
     /* @__PURE__ */ s(
-      pe,
+      he,
       {
         src: t.avatarUrl,
         alt: t.username,
@@ -292,14 +284,14 @@ const ne = (e, n, t = !1) => {
     timeString: i,
     edited: a,
     actions: l,
-    children: c,
-    ...u
-  } = e, { hovered: g, ref: b } = Me(), { focused: S, ref: x } = te(), y = U([n, b]);
-  return d(u, !1), /* @__PURE__ */ v(h, { pos: "relative", ref: y, className: t, children: [
-    l && (o === !0 || o === void 0 || o === "hover" && g || S) ? /* @__PURE__ */ s(
+    emojiPickerOpen: c,
+    children: d,
+    ...f
+  } = e, { hovered: b, ref: S } = Fe(), x = ie([n, S]);
+  return u(f, !1), /* @__PURE__ */ v(h, { pos: "relative", ref: x, className: t, children: [
+    l && (o === !0 || o === void 0 || o === "hover" && b || c) ? /* @__PURE__ */ s(
       h,
       {
-        ref: x,
         style: {
           position: "absolute",
           right: 0,
@@ -310,12 +302,12 @@ const ne = (e, n, t = !1) => {
       }
     ) : null,
     /* @__PURE__ */ s(je, { ...e }),
-    c
+    d
   ] });
 }), Ae = m((e, n) => {
   const { className: t, autoFocus: o, onFocus: r, onBlur: i, editor: a, editable: l, ...c } = e;
-  d(c, !1);
-  const u = W();
+  u(c, !1);
+  const d = H();
   return /* @__PURE__ */ s(
     Ft,
     {
@@ -328,12 +320,12 @@ const ne = (e, n, t = !1) => {
       filePanel: !1,
       formattingToolbar: !1,
       editable: l,
-      theme: u == null ? void 0 : u.colorSchemePreference,
+      theme: d == null ? void 0 : d.colorSchemePreference,
       ref: n,
       onFocus: r,
       onBlur: i,
       children: /* @__PURE__ */ s(
-        ce,
+        le,
         {
           formattingToolbar: _e
         }
@@ -341,7 +333,7 @@ const ne = (e, n, t = !1) => {
     }
   );
 }), _e = () => {
-  const e = ue([]).filter(
+  const e = ce([]).filter(
     (n) => n.key !== "nestBlockButton" && n.key !== "unnestBlockButton"
   );
   return /* @__PURE__ */ s(de, { blockTypeSelectItems: [], children: e });
@@ -354,20 +346,20 @@ const ne = (e, n, t = !1) => {
     icon: a,
     value: l,
     autoFocus: c,
-    placeholder: u,
-    disabled: g,
+    placeholder: d,
+    disabled: f,
     onKeyDown: b,
     onChange: S,
     onSubmit: x,
     autoComplete: y,
-    rightSection: k,
+    rightSection: P,
     ...w
   } = e;
-  return d(w), /* @__PURE__ */ s(
-    Q,
+  return u(w), /* @__PURE__ */ s(
+    q,
     {
       size: "xs",
-      className: E(
+      className: B(
         t || "",
         i === "large" ? "bn-mt-input-large" : ""
       ),
@@ -378,9 +370,9 @@ const ne = (e, n, t = !1) => {
       value: l,
       autoFocus: c,
       "data-autofocus": c ? "true" : void 0,
-      rightSection: k,
-      placeholder: u,
-      disabled: g,
+      rightSection: P,
+      placeholder: d,
+      disabled: f,
       onKeyDown: b,
       onChange: S,
       onSubmit: x,
@@ -389,7 +381,7 @@ const ne = (e, n, t = !1) => {
   );
 }), Ge = Pe(void 0), He = (e) => {
   const { children: n, onOpenChange: t, position: o, sub: r, ...i } = e;
-  return d(i), r ? /* @__PURE__ */ s(
+  return u(i), r ? /* @__PURE__ */ s(
     p.Sub,
     {
       transitionProps: { duration: 250, exitDelay: 250 },
@@ -411,13 +403,13 @@ const ne = (e, n, t = !1) => {
   );
 }, Ke = m((e, n) => {
   const { className: t, children: o, icon: r, checked: i, subTrigger: a, onClick: l, ...c } = e;
-  return d(c, !1), a ? /* @__PURE__ */ s(
+  return u(c, !1), a ? /* @__PURE__ */ s(
     p.Sub.Item,
     {
       className: t,
       ref: n,
       leftSection: r,
-      rightSection: i ? /* @__PURE__ */ s(B, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
+      rightSection: i ? /* @__PURE__ */ s(z, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
       onClick: l,
       ...c,
       children: o
@@ -428,7 +420,7 @@ const ne = (e, n, t = !1) => {
       className: t,
       ref: n,
       leftSection: r,
-      rightSection: i ? /* @__PURE__ */ s(B, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
+      rightSection: i ? /* @__PURE__ */ s(z, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
       onClick: l,
       ...c,
       children: o
@@ -441,7 +433,7 @@ const ne = (e, n, t = !1) => {
     // unused
     ...o
   } = e;
-  return d(o), t ? /* @__PURE__ */ s(p.Sub.Target, { children: n }) : /* @__PURE__ */ s(p.Target, { children: n });
+  return u(o), t ? /* @__PURE__ */ s(p.Sub.Target, { children: n }) : /* @__PURE__ */ s(p.Target, { children: n });
 }, We = m((e, n) => {
   const {
     className: t,
@@ -450,8 +442,8 @@ const ne = (e, n, t = !1) => {
     //unused
     ...i
   } = e;
-  d(i);
-  const a = ee(Ge);
+  u(i);
+  const a = Q(Ge);
   return r ? /* @__PURE__ */ s(
     p.Sub.Dropdown,
     {
@@ -473,10 +465,10 @@ const ne = (e, n, t = !1) => {
   );
 }), qe = m((e, n) => {
   const { className: t, ...o } = e;
-  return d(o), /* @__PURE__ */ s(p.Divider, { className: t, ref: n });
+  return u(o), /* @__PURE__ */ s(p.Divider, { className: t, ref: n });
 }), Ze = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s(p.Label, { className: t, ref: n, children: o });
+  return u(r), /* @__PURE__ */ s(p.Label, { className: t, ref: n, children: o });
 }), Je = m((e, n) => {
   const {
     className: t,
@@ -486,11 +478,11 @@ const ne = (e, n, t = !1) => {
     onDragEnd: a,
     onDragStart: l,
     draggable: c,
-    label: u,
-    ...g
+    label: d,
+    ...f
   } = e;
-  return d(g, !1), r ? /* @__PURE__ */ s(
-    L,
+  return u(f, !1), r ? /* @__PURE__ */ s(
+    E,
     {
       size: 24,
       className: t,
@@ -499,8 +491,8 @@ const ne = (e, n, t = !1) => {
       onDragEnd: a,
       onDragStart: l,
       draggable: c,
-      "aria-label": u,
-      ...g,
+      "aria-label": d,
+      ...f,
       children: r
     }
   ) : /* @__PURE__ */ s(
@@ -512,8 +504,8 @@ const ne = (e, n, t = !1) => {
       onDragEnd: a,
       onDragStart: l,
       draggable: c,
-      "aria-label": u,
-      ...g,
+      "aria-label": d,
+      ...f,
       children: o
     }
   );
@@ -527,30 +519,30 @@ const ne = (e, n, t = !1) => {
     loading: l,
     ...c
   } = e;
-  return d(c), /* @__PURE__ */ s(h, { className: t, ref: n, children: /* @__PURE__ */ v(
-    P,
+  return u(c), /* @__PURE__ */ s(h, { className: t, ref: n, children: /* @__PURE__ */ v(
+    k,
     {
       value: i,
       defaultValue: r,
       onChange: a,
       children: [
-        l && /* @__PURE__ */ s(ve, { visible: l }),
-        /* @__PURE__ */ s(P.List, { children: o.map((u) => /* @__PURE__ */ s(
-          P.Tab,
+        l && /* @__PURE__ */ s(pe, { visible: l }),
+        /* @__PURE__ */ s(k.List, { children: o.map((d) => /* @__PURE__ */ s(
+          k.Tab,
           {
-            "data-test": `${u.name.toLowerCase()}-tab`,
-            value: u.name,
-            children: u.name
+            "data-test": `${d.name.toLowerCase()}-tab`,
+            value: d.name,
+            children: d.name
           },
-          u.name
+          d.name
         )) }),
-        o.map((u) => /* @__PURE__ */ s(P.Panel, { value: u.name, children: u.tabPanel }, u.name))
+        o.map((d) => /* @__PURE__ */ s(k.Panel, { value: d.name, children: d.tabPanel }, d.name))
       ]
     }
   ) });
 }), Xe = m((e, n) => {
   const { className: t, children: o, onClick: r, label: i, ...a } = e;
-  return d(a), /* @__PURE__ */ s(
+  return u(a), /* @__PURE__ */ s(
     T,
     {
       size: "xs",
@@ -564,8 +556,8 @@ const ne = (e, n, t = !1) => {
   );
 }), Ye = m((e, n) => {
   const { className: t, accept: o, value: r, placeholder: i, onChange: a, ...l } = e;
-  return d(l), /* @__PURE__ */ s(
-    Se,
+  return u(l), /* @__PURE__ */ s(
+    ve,
     {
       size: "xs",
       className: t,
@@ -579,11 +571,11 @@ const ne = (e, n, t = !1) => {
   );
 }), et = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s("div", { className: t, ref: n, children: o });
+  return u(r), /* @__PURE__ */ s("div", { className: t, ref: n, children: o });
 }), tt = m((e, n) => {
   const { className: t, value: o, placeholder: r, onKeyDown: i, onChange: a, ...l } = e;
-  return d(l), /* @__PURE__ */ s(
-    Q,
+  return u(l), /* @__PURE__ */ s(
+    q,
     {
       size: "xs",
       "data-test": "embed-input",
@@ -597,10 +589,20 @@ const ne = (e, n, t = !1) => {
   );
 }), nt = (e) => {
   const { opened: n, position: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s(xe, { withinPortal: !1, opened: n, position: t, children: o });
+  return u(r), /* @__PURE__ */ s(
+    we,
+    {
+      middlewares: { size: { padding: 20 } },
+      withinPortal: !1,
+      opened: n,
+      position: t,
+      zIndex: 1e4,
+      children: o
+    }
+  );
 }, ot = (e) => {
   const { children: n, ...t } = e;
-  return d(t), /* @__PURE__ */ s(we, { children: n });
+  return u(t), /* @__PURE__ */ s(ye, { children: n });
 }, rt = m((e, n) => {
   const {
     className: t,
@@ -609,10 +611,10 @@ const ne = (e, n, t = !1) => {
     // unused
     ...i
   } = e;
-  return d(i), /* @__PURE__ */ s(ye, { className: t, ref: n, children: o });
+  return u(i), /* @__PURE__ */ s(Se, { className: t, ref: n, children: o });
 }), st = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r, !1), /* @__PURE__ */ s(
+  return u(r, !1), /* @__PURE__ */ s(
     h,
     {
       align: "center",
@@ -632,11 +634,11 @@ const ne = (e, n, t = !1) => {
     onDragEnd: a,
     onDragStart: l,
     draggable: c,
-    label: u,
-    ...g
+    label: d,
+    ...f
   } = e;
-  return d(g, !1), r ? /* @__PURE__ */ s(
-    L,
+  return u(f, !1), r ? /* @__PURE__ */ s(
+    E,
     {
       size: 24,
       className: t,
@@ -645,8 +647,8 @@ const ne = (e, n, t = !1) => {
       onDragEnd: a,
       onDragStart: l,
       draggable: c,
-      "aria-label": u,
-      ...g,
+      "aria-label": d,
+      ...f,
       children: r
     }
   ) : /* @__PURE__ */ s(
@@ -658,15 +660,15 @@ const ne = (e, n, t = !1) => {
       onDragEnd: a,
       onDragStart: l,
       draggable: c,
-      "aria-label": u,
-      ...g,
+      "aria-label": d,
+      ...f,
       children: o
     }
   );
 }), at = m((e, n) => {
   const { className: t, children: o, id: r, ...i } = e;
-  return d(i), /* @__PURE__ */ s(
-    z,
+  return u(i), /* @__PURE__ */ s(
+    L,
     {
       gap: 0,
       className: t,
@@ -678,29 +680,29 @@ const ne = (e, n, t = !1) => {
   );
 }), lt = m((e, n) => {
   const { className: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: /* @__PURE__ */ s(h, { className: "bn-mt-suggestion-menu-item-title", children: o }) });
+  return u(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: /* @__PURE__ */ s(h, { className: "bn-mt-suggestion-menu-item-title", children: o }) });
 }), ct = m((e, n) => {
   const { className: t, isSelected: o, onClick: r, item: i, id: a, ...l } = e;
-  d(l);
-  const c = j(null);
-  return $(() => {
+  u(l);
+  const c = X(null);
+  return Y(() => {
     if (!c.current || !o)
       return;
-    const u = q(
+    const d = K(
       c.current,
       document.querySelector(".bn-suggestion-menu, #ai-suggestion-menu")
       // TODO
     );
-    u === "top" ? c.current.scrollIntoView(!0) : u === "bottom" && c.current.scrollIntoView(!1);
+    d === "top" ? c.current.scrollIntoView(!0) : d === "bottom" && c.current.scrollIntoView(!1);
   }, [o]), /* @__PURE__ */ v(
     h,
     {
       gap: 0,
       className: t,
-      ref: A(n, c),
+      ref: j(n, c),
       id: a,
       role: "option",
-      onMouseDown: (u) => u.preventDefault(),
+      onMouseDown: (d) => d.preventDefault(),
       onClick: r,
       "aria-selected": o || void 0,
       children: [
@@ -712,7 +714,7 @@ const ne = (e, n, t = !1) => {
             children: i.icon
           }
         ),
-        /* @__PURE__ */ v(z, { gap: 0, className: "bn-mt-suggestion-menu-item-body", children: [
+        /* @__PURE__ */ v(L, { gap: 0, className: "bn-mt-suggestion-menu-item-body", children: [
           /* @__PURE__ */ s(C, { className: "bn-mt-suggestion-menu-item-title", children: i.title }),
           /* @__PURE__ */ s(C, { className: "bn-mt-suggestion-menu-item-subtitle", children: i.subtext })
         ] }),
@@ -721,21 +723,21 @@ const ne = (e, n, t = !1) => {
           {
             "data-position": "right",
             className: "bn-mt-suggestion-menu-item-section",
-            children: /* @__PURE__ */ s(Ce, { size: "xs", children: i.badge })
+            children: /* @__PURE__ */ s(xe, { size: "xs", children: i.badge })
           }
         )
       ]
     }
   );
-}), ut = m((e, n) => {
-  const { className: t, children: o, ...r } = e;
-  return d(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: o });
 }), dt = m((e, n) => {
+  const { className: t, children: o, ...r } = e;
+  return u(r), /* @__PURE__ */ s(h, { className: t, ref: n, children: o });
+}), ut = m((e, n) => {
   const { className: t, ...o } = e;
-  return d(o), /* @__PURE__ */ s(X, { className: t, type: "dots", size: 16, ref: n });
+  return u(o), /* @__PURE__ */ s(Z, { className: t, type: "dots", size: 16, ref: n });
 }), mt = m((e, n) => {
   const { className: t, children: o, id: r, columns: i, ...a } = e;
-  return d(a), /* @__PURE__ */ s(
+  return u(a), /* @__PURE__ */ s(
     "div",
     {
       className: t,
@@ -746,9 +748,9 @@ const ne = (e, n, t = !1) => {
       children: o
     }
   );
-}), ft = m((e, n) => {
+}), gt = m((e, n) => {
   const { className: t, children: o, columns: r, ...i } = e;
-  return d(i), /* @__PURE__ */ s(
+  return u(i), /* @__PURE__ */ s(
     h,
     {
       className: t,
@@ -757,23 +759,23 @@ const ne = (e, n, t = !1) => {
       children: /* @__PURE__ */ s(h, { className: "bn-mt-suggestion-menu-item-title", children: o })
     }
   );
-}), gt = m((e, n) => {
+}), ft = m((e, n) => {
   const { className: t, isSelected: o, onClick: r, item: i, id: a, ...l } = e;
-  d(l);
-  const c = j(null);
-  return $(() => {
+  u(l);
+  const c = X(null);
+  return Y(() => {
     if (!c.current || !o)
       return;
-    const u = q(
+    const d = K(
       c.current,
       document.querySelector(".bn-grid-suggestion-menu")
     );
-    u === "top" ? c.current.scrollIntoView(!0) : u === "bottom" && c.current.scrollIntoView(!1);
+    d === "top" ? c.current.scrollIntoView(!0) : d === "bottom" && c.current.scrollIntoView(!1);
   }, [o]), /* @__PURE__ */ s(
     "div",
     {
       className: t,
-      ref: A(n, c),
+      ref: j(n, c),
       id: a,
       role: "option",
       onClick: r,
@@ -789,8 +791,8 @@ const ne = (e, n, t = !1) => {
     columns: r,
     ...i
   } = e;
-  return d(i), /* @__PURE__ */ s(
-    X,
+  return u(i), /* @__PURE__ */ s(
+    Z,
     {
       className: t,
       style: { gridColumn: `1 / ${r + 1}` },
@@ -800,7 +802,7 @@ const ne = (e, n, t = !1) => {
   );
 }), ht = m((e, n) => {
   const { children: t, className: o, onMouseDown: r, onClick: i, ...a } = e;
-  return d(a, !1), /* @__PURE__ */ s(
+  return u(a, !1), /* @__PURE__ */ s(
     T,
     {
       className: o,
@@ -820,9 +822,9 @@ const ne = (e, n, t = !1) => {
     onDragEnd: a,
     style: l,
     label: c,
-    ...u
+    ...d
   } = e;
-  return d(u, !1), /* @__PURE__ */ s(
+  return u(d, !1), /* @__PURE__ */ s(
     T,
     {
       className: t,
@@ -832,7 +834,7 @@ const ne = (e, n, t = !1) => {
       onDragStart: i,
       onDragEnd: a,
       style: l,
-      ...u,
+      ...d,
       children: o
     }
   );
@@ -846,10 +848,10 @@ const ne = (e, n, t = !1) => {
       variant: a,
       ...l
     } = e;
-    d(l);
-    const { ref: c, focused: u } = te(), g = Oe(u), b = A(n, c, g);
+    u(l);
+    const { ref: c, focused: d } = Me(), f = Oe(d), b = j(n, c, f);
     return /* @__PURE__ */ s(
-      Ne,
+      Ce,
       {
         className: t,
         ref: b,
@@ -862,13 +864,13 @@ const ne = (e, n, t = !1) => {
     );
   }
 );
-var re = {
+var ne = {
   color: void 0,
   size: void 0,
   className: void 0,
   style: void 0,
   attr: void 0
-}, G = N.createContext && /* @__PURE__ */ N.createContext(re), vt = ["attr", "size", "title"];
+}, _ = N.createContext && /* @__PURE__ */ N.createContext(ne), vt = ["attr", "size", "title"];
 function St(e, n) {
   if (e == null) return {};
   var t = yt(e, n), o, r;
@@ -899,7 +901,7 @@ function F() {
     return e;
   }, F.apply(this, arguments);
 }
-function H(e, n) {
+function V(e, n) {
   var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e);
@@ -912,9 +914,9 @@ function H(e, n) {
 function M(e) {
   for (var n = 1; n < arguments.length; n++) {
     var t = arguments[n] != null ? arguments[n] : {};
-    n % 2 ? H(Object(t), !0).forEach(function(o) {
+    n % 2 ? V(Object(t), !0).forEach(function(o) {
       wt(e, o, t[o]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : H(Object(t)).forEach(function(o) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : V(Object(t)).forEach(function(o) {
       Object.defineProperty(e, o, Object.getOwnPropertyDescriptor(t, o));
     });
   }
@@ -937,15 +939,15 @@ function Ct(e, n) {
   }
   return (n === "string" ? String : Number)(e);
 }
-function se(e) {
+function oe(e) {
   return e && e.map((n, t) => /* @__PURE__ */ N.createElement(n.tag, M({
     key: t
-  }, n.attr), se(n.child)));
+  }, n.attr), oe(n.child)));
 }
 function Nt(e) {
   return (n) => /* @__PURE__ */ N.createElement(Tt, F({
     attr: M({}, e.attr)
-  }, n), se(e.child));
+  }, n), oe(e.child));
 }
 function Tt(e) {
   var n = (t) => {
@@ -968,14 +970,14 @@ function Tt(e) {
       xmlns: "http://www.w3.org/2000/svg"
     }), i && /* @__PURE__ */ N.createElement("title", null, i), e.children);
   };
-  return G !== void 0 ? /* @__PURE__ */ N.createElement(G.Consumer, null, (t) => n(t)) : n(re);
+  return _ !== void 0 ? /* @__PURE__ */ N.createElement(_.Consumer, null, (t) => n(t)) : n(ne);
 }
-function kt(e) {
+function Pt(e) {
   return Nt({ attr: { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true" }, child: [{ tag: "path", attr: { fillRule: "evenodd", d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", clipRule: "evenodd" }, child: [] }] })(e);
 }
 const I = m((e, n) => {
   const { className: t, items: o, isDisabled: r, ...i } = e;
-  d(i);
+  u(i);
   const a = o.filter((l) => l.isSelected)[0];
   return a ? /* @__PURE__ */ v(
     p,
@@ -994,7 +996,7 @@ const I = m((e, n) => {
               R() && l.currentTarget.focus();
             },
             leftSection: a.icon,
-            rightSection: /* @__PURE__ */ s(kt, {}),
+            rightSection: /* @__PURE__ */ s(Pt, {}),
             size: "xs",
             variant: "subtle",
             disabled: r,
@@ -1006,7 +1008,7 @@ const I = m((e, n) => {
           {
             onClick: l.onClick,
             leftSection: l.icon,
-            rightSection: l.isSelected ? /* @__PURE__ */ s(B, { size: 10, className: "bn-tick-icon" }) : (
+            rightSection: l.isSelected ? /* @__PURE__ */ s(z, { size: 10, className: "bn-tick-icon" }) : (
               // Ensures space for tick even if item isn't currently selected.
               /* @__PURE__ */ s("div", { className: "bn-tick-space" })
             ),
@@ -1018,7 +1020,7 @@ const I = m((e, n) => {
       ]
     }
   ) : null;
-}), Pt = {
+}), kt = {
   FormattingToolbar: {
     Root: D,
     Button: O,
@@ -1033,8 +1035,8 @@ const I = m((e, n) => {
   },
   GridSuggestionMenu: {
     Root: mt,
-    Item: gt,
-    EmptyItem: ft,
+    Item: ft,
+    EmptyItem: gt,
     Loader: bt
   },
   LinkToolbar: {
@@ -1050,8 +1052,8 @@ const I = m((e, n) => {
     Root: at,
     Item: ct,
     EmptyItem: lt,
-    Label: ut,
-    Loader: dt
+    Label: dt,
+    Loader: ut
   },
   TableHandle: {
     Root: pt,
@@ -1060,7 +1062,7 @@ const I = m((e, n) => {
   Generic: {
     Badge: {
       Root: Re,
-      Group: Be
+      Group: ze
     },
     Form: {
       Root: (e) => /* @__PURE__ */ s("div", { children: e.children }),
@@ -1089,46 +1091,46 @@ const I = m((e, n) => {
   Comments: {
     Comment: $e,
     Editor: Ae,
-    Card: Ee,
-    CardSection: Le,
-    ExpandSectionsPrompt: ze
+    Card: Be,
+    CardSection: Ee,
+    ExpandSectionsPrompt: Le
   }
 }, Ft = (e) => {
-  const { className: n, theme: t, ...o } = e, r = W(), i = me(), a = (r == null ? void 0 : r.colorSchemePreference) || i, l = Fe(
+  const { className: n, theme: t, ...o } = e, r = H(), i = ue(), a = (r == null ? void 0 : r.colorSchemePreference) || i, l = ke(
     (b) => {
       if (b && (Ie(b), typeof t == "object")) {
         if ("light" in t && "dark" in t) {
-          V(
+          A(
             t[a === "dark" ? "dark" : "light"],
             b
           );
           return;
         }
-        V(t, b);
+        A(t, b);
         return;
       }
     },
     [a, t]
-  ), c = ee(Te), u = typeof t == "string" ? t : a !== "no-preference" ? a : "light", g = /* @__PURE__ */ s(fe.Provider, { value: Pt, children: /* @__PURE__ */ s(
+  ), c = Q(Ne), d = typeof t == "string" ? t : a !== "no-preference" ? a : "light", f = /* @__PURE__ */ s(me.Provider, { value: kt, children: /* @__PURE__ */ s(
     ge,
     {
-      "data-mantine-color-scheme": u,
-      className: E("bn-mantine", n || ""),
+      "data-mantine-color-scheme": d,
+      className: B("bn-mantine", n || ""),
       theme: typeof t == "object" ? void 0 : t,
       ...o,
       ref: l
     }
   ) });
-  return c ? g : /* @__PURE__ */ s(
-    ke,
+  return c ? f : /* @__PURE__ */ s(
+    Te,
     {
       withCssVariables: !1,
       getRootElement: () => {
       },
-      children: g
+      children: f
     }
   );
-}, f = [
+}, g = [
   "#FFFFFF",
   "#EFEFEF",
   "#CFCFCF",
@@ -1139,80 +1141,80 @@ const I = m((e, n) => {
   "#161616",
   "#0F0F0F",
   "#000000"
-], K = {
+], G = {
   colors: {
     editor: {
-      text: f[5],
-      background: f[0]
+      text: g[5],
+      background: g[0]
     },
     menu: {
-      text: f[5],
-      background: f[0]
+      text: g[5],
+      background: g[0]
     },
     tooltip: {
-      text: f[5],
-      background: f[1]
+      text: g[5],
+      background: g[1]
     },
     hovered: {
-      text: f[5],
-      background: f[1]
+      text: g[5],
+      background: g[1]
     },
     selected: {
-      text: f[0],
-      background: f[5]
+      text: g[0],
+      background: g[5]
     },
     disabled: {
-      text: f[3],
-      background: f[1]
+      text: g[3],
+      background: g[1]
     },
-    shadow: f[2],
-    border: f[1],
-    sideMenu: f[2],
-    highlights: ie
+    shadow: g[2],
+    border: g[1],
+    sideMenu: g[2],
+    highlights: re
   },
   borderRadius: 6,
   fontFamily: '"Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Open Sans", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif'
-}, Et = {
+}, Bt = {
   colors: {
     editor: {
-      text: f[2],
-      background: f[6]
+      text: g[2],
+      background: g[6]
     },
     menu: {
-      text: f[2],
-      background: f[6]
+      text: g[2],
+      background: g[6]
     },
     tooltip: {
-      text: f[2],
-      background: f[7]
+      text: g[2],
+      background: g[7]
     },
     hovered: {
-      text: f[2],
-      background: f[7]
+      text: g[2],
+      background: g[7]
     },
     selected: {
-      text: f[2],
-      background: f[8]
+      text: g[2],
+      background: g[8]
     },
     disabled: {
-      text: f[5],
-      background: f[7]
+      text: g[5],
+      background: g[7]
     },
-    shadow: f[8],
-    border: f[7],
-    sideMenu: f[4],
-    highlights: ae
+    shadow: g[8],
+    border: g[7],
+    sideMenu: g[4],
+    highlights: se
   },
-  borderRadius: K.borderRadius,
-  fontFamily: K.fontFamily
+  borderRadius: G.borderRadius,
+  fontFamily: G.fontFamily
 };
 export {
   Ft as BlockNoteView,
-  V as applyBlockNoteCSSVariablesFromTheme,
-  Pt as components,
-  Et as darkDefaultTheme,
-  f as defaultColorScheme,
-  K as lightDefaultTheme,
+  A as applyBlockNoteCSSVariablesFromTheme,
+  kt as components,
+  Bt as darkDefaultTheme,
+  g as defaultColorScheme,
+  G as lightDefaultTheme,
   Ie as removeBlockNoteCSSVariables
 };
 //# sourceMappingURL=blocknote-mantine.js.map