@blocknote/mantine 0.46.2 → 0.47.0

package/dist/blocknote-mantine.js

@@ -1,19 +1,19 @@
 import { jsx as s, jsxs as v } from "react/jsx-runtime";
-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 b, Chip as fe, Divider as he, Card as W, Skeleton as $, Avatar as be, TextInput as Z, 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 q, 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";
+import { assertEmpty as u, isSafari as R, mergeCSSClasses as B, COLORS_DEFAULT as se, COLORS_DARK_MODE_DEFAULT as ae } from "@blocknote/core";
+import { mergeRefs as ie, useDictionary as le, useBlockNoteContext as V, FormattingToolbarController as ce, getFormattingToolbarItems as de, FormattingToolbar as ue, elementOverflow as K, usePrefersColorScheme as me, ComponentsContext as ge, BlockNoteViewRaw as fe } from "@blocknote/react";
+import { Button as T, ActionIcon as E, Tooltip as U, Stack as L, Text as C, Group as b, Chip as he, Divider as be, Card as W, Skeleton as $, Avatar as pe, TextInput as Z, Menu as p, CheckIcon as z, Tabs as P, LoadingOverlay as ve, FileInput as Se, PopoverDropdown as ye, PopoverTarget as we, Popover as xe, Badge as Ce, Loader as q, Flex as Ne, MantineContext as Te, MantineProvider as ke } 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 Fe } from "react";
+import { useHover as Me, mergeRefs as j, useFocusWithin as Oe, useFocusTrap as De } 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(), 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);
+  function r(a, i = "--bn") {
+    for (const l in a) {
+      const c = l.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(), d = `${i}-${c}`;
+      typeof a[l] != "object" ? (typeof a[l] == "number" && (a[l] = `${a[l]}px`), t ? n.style.removeProperty(d) : n.style.setProperty(d, a[l].toString())) : r(a[l], d);
     }
   }
   return r(e), o;
-}, A = (e, n) => ee(e, n), De = {
+}, A = (e, n) => ee(e, n), Ie = {
   colors: {
     editor: {
       text: void 0,
@@ -83,7 +83,7 @@ const ee = (e, n, t = !1) => {
   },
   borderRadius: void 0,
   fontFamily: void 0
-}, Ie = (e) => ee(De, e, !0), te = (e) => /* @__PURE__ */ v(L, { gap: 0, className: "bn-tooltip", children: [
+}, Re = (e) => ee(Ie, 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(
@@ -92,8 +92,8 @@ const ee = (e, n, t = !1) => {
       className: t,
       children: o,
       mainTooltip: r,
-      secondaryTooltip: i,
-      icon: a,
+      secondaryTooltip: a,
+      icon: i,
       isSelected: l,
       isDisabled: c,
       onClick: d,
@@ -102,7 +102,7 @@ const ee = (e, n, t = !1) => {
       ...S
     } = e;
     u(S, !1);
-    const [x, y] = J(!1), P = o ? /* @__PURE__ */ s(
+    const [x, y] = J(!1), k = o ? /* @__PURE__ */ s(
       T,
       {
         "aria-label": f,
@@ -142,7 +142,7 @@ const ee = (e, n, t = !1) => {
         disabled: c || !1,
         ref: n,
         ...S,
-        children: a
+        children: i
       }
     );
     return r ? /* @__PURE__ */ s(
@@ -154,20 +154,20 @@ const ee = (e, n, t = !1) => {
           te,
           {
             mainTooltip: r,
-            secondaryTooltip: i
+            secondaryTooltip: a
           }
         ),
-        children: P
+        children: k
       }
-    ) : P;
+    ) : k;
   }
-), Re = m((e, n) => {
+), ze = m((e, n) => {
   const {
     className: t,
     text: o,
     icon: r,
-    isSelected: i,
-    mainTooltip: a,
+    isSelected: a,
+    mainTooltip: i,
     secondaryTooltip: l,
     onClick: c,
     onMouseEnter: d,
@@ -175,10 +175,10 @@ const ee = (e, n, t = !1) => {
   } = e;
   u(f, !1);
   const [h, S] = J(!1), x = /* @__PURE__ */ v(
-    fe,
+    he,
     {
       className: t,
-      checked: i === !0,
+      checked: a === !0,
       wrapperProps: {
         onMouseEnter: d,
         onMouseLeave: () => S(!1),
@@ -195,7 +195,7 @@ const ee = (e, n, t = !1) => {
       ]
     }
   );
-  return !a || h ? x : /* @__PURE__ */ s(
+  return !i || h ? x : /* @__PURE__ */ s(
     U,
     {
       refProp: "rootRef",
@@ -203,23 +203,23 @@ const ee = (e, n, t = !1) => {
       label: /* @__PURE__ */ s(
         te,
         {
-          mainTooltip: a,
+          mainTooltip: i,
           secondaryTooltip: l
         }
       ),
       children: x
     }
   );
-}), ze = m((e, n) => {
+}), Be = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r), /* @__PURE__ */ s(b, { className: t, ref: n, children: o });
-}), Be = m((e, n) => {
+}), Ee = m((e, n) => {
   const {
     className: t,
     children: o,
     headerText: r,
-    selected: i,
-    onFocus: a,
+    selected: a,
+    onFocus: i,
     onBlur: l,
     tabIndex: c,
     ...d
@@ -227,8 +227,8 @@ const ee = (e, n, t = !1) => {
   return u(d, !1), /* @__PURE__ */ v(
     W,
     {
-      className: B(t, i ? "selected" : ""),
-      onFocus: a,
+      className: B(t, a ? "selected" : ""),
+      onFocus: i,
       onBlur: l,
       tabIndex: c,
       ref: n,
@@ -238,27 +238,27 @@ const ee = (e, n, t = !1) => {
       ]
     }
   );
-}), Ee = m((e, n) => {
+}), Le = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r, !1), /* @__PURE__ */ s(W.Section, { className: t, ref: n, children: o });
-}), Le = m((e, n) => {
+}), je = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r, !1), /* @__PURE__ */ s(
-    he,
+    be,
     {
       className: t,
       label: /* @__PURE__ */ s(C, { children: o }),
       ref: n
     }
   );
-}), je = m((e, n) => {
-  const { authorInfo: t, timeString: o, edited: r, ...i } = e, a = ae();
-  return u(i, !1), t === "loading" ? /* @__PURE__ */ v(b, { children: [
+}), $e = m((e, n) => {
+  const { authorInfo: t, timeString: o, edited: r, ...a } = e, i = le();
+  return u(a, !1), t === "loading" ? /* @__PURE__ */ v(b, { children: [
     /* @__PURE__ */ s($, { height: 24, width: 24 }),
     /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s($, { height: 12, width: 100 }) })
   ] }) : /* @__PURE__ */ v(b, { children: [
     /* @__PURE__ */ s(
-      be,
+      pe,
       {
         src: t.avatarUrl,
         alt: t.username,
@@ -272,22 +272,22 @@ const ee = (e, n, t = !1) => {
       /* @__PURE__ */ v(C, { fz: "xs", c: "dimmed", span: !0, ml: "xs", children: [
         o,
         " ",
-        r && `(${a.comments.edited})`
+        r && `(${i.comments.edited})`
       ] })
     ] })
   ] });
-}), $e = m((e, n) => {
+}), Ae = m((e, n) => {
   const {
     className: t,
     showActions: o,
     authorInfo: r,
-    timeString: i,
-    edited: a,
+    timeString: a,
+    edited: i,
     actions: l,
     emojiPickerOpen: c,
     children: d,
     ...f
-  } = e, { hovered: h, ref: S } = Fe(), x = ie([n, S]);
+  } = e, { hovered: h, ref: S } = Me(), x = ie([n, S]);
   return u(f, !1), /* @__PURE__ */ v(b, { pos: "relative", ref: x, className: t, children: [
     l && (o === !0 || o === void 0 || o === "hover" && h || c) ? /* @__PURE__ */ s(
       b,
@@ -301,15 +301,15 @@ const ee = (e, n, t = !1) => {
         children: l
       }
     ) : null,
-    /* @__PURE__ */ s(je, { ...e }),
+    /* @__PURE__ */ s($e, { ...e }),
     d
   ] });
-}), Ae = m((e, n) => {
-  const { className: t, autoFocus: o, onFocus: r, onBlur: i, editor: a, editable: l, ...c } = e;
+}), _e = m((e, n) => {
+  const { className: t, autoFocus: o, onFocus: r, onBlur: a, editor: i, editable: l, ...c } = e;
   u(c, !1);
-  const d = H();
+  const d = V();
   return /* @__PURE__ */ s(
-    Ft,
+    Mt,
     {
       autoFocus: o,
       className: t,
@@ -323,27 +323,27 @@ const ee = (e, n, t = !1) => {
       theme: d == null ? void 0 : d.colorSchemePreference,
       ref: n,
       onFocus: r,
-      onBlur: i,
+      onBlur: a,
       children: /* @__PURE__ */ s(
-        le,
+        ce,
         {
-          formattingToolbar: _e
+          formattingToolbar: Ge
         }
       )
     }
   );
-}), _e = () => {
-  const e = ce([]).filter(
+}), Ge = () => {
+  const e = de([]).filter(
     (n) => n.key !== "nestBlockButton" && n.key !== "unnestBlockButton"
   );
-  return /* @__PURE__ */ s(de, { blockTypeSelectItems: [], children: e });
-}, Ve = m((e, n) => {
+  return /* @__PURE__ */ s(ue, { blockTypeSelectItems: [], children: e });
+}, He = m((e, n) => {
   const {
     className: t,
     name: o,
     label: r,
-    variant: i,
-    icon: a,
+    variant: a,
+    icon: i,
     value: l,
     autoFocus: c,
     placeholder: d,
@@ -352,36 +352,38 @@ const ee = (e, n, t = !1) => {
     onChange: S,
     onSubmit: x,
     autoComplete: y,
-    rightSection: P,
-    ...w
+    "aria-activedescendant": k,
+    rightSection: w,
+    ...re
   } = e;
-  return u(w), /* @__PURE__ */ s(
+  return u(re), /* @__PURE__ */ s(
     Z,
     {
       size: "xs",
       className: B(
         t || "",
-        i === "large" ? "bn-mt-input-large" : ""
+        a === "large" ? "bn-mt-input-large" : ""
       ),
       ref: n,
       name: o,
       label: r,
-      leftSection: a,
+      leftSection: i,
       value: l,
       autoFocus: c,
       "data-autofocus": c ? "true" : void 0,
-      rightSection: P,
+      rightSection: w,
       placeholder: d,
       disabled: f,
       onKeyDown: h,
       onChange: S,
       onSubmit: x,
-      autoComplete: y
+      autoComplete: y,
+      "aria-activedescendant": k
     }
   );
-}), Ge = Pe(void 0), He = (e) => {
-  const { children: n, onOpenChange: t, position: o, sub: r, ...i } = e;
-  return u(i), r ? /* @__PURE__ */ s(
+}), Ve = Pe(void 0), Ke = (e) => {
+  const { children: n, onOpenChange: t, position: o, sub: r, ...a } = e;
+  return u(a), r ? /* @__PURE__ */ s(
     p.Sub,
     {
       transitionProps: { duration: 250, exitDelay: 250 },
@@ -402,15 +404,15 @@ const ee = (e, n, t = !1) => {
       children: n
     }
   );
-}, Ke = m((e, n) => {
-  const { className: t, children: o, icon: r, checked: i, subTrigger: a, onClick: l, ...c } = e;
-  return u(c, !1), a ? /* @__PURE__ */ s(
+}, Ue = m((e, n) => {
+  const { className: t, children: o, icon: r, checked: a, subTrigger: i, onClick: l, ...c } = e;
+  return u(c, !1), i ? /* @__PURE__ */ s(
     p.Sub.Item,
     {
       className: t,
       ref: n,
       leftSection: r,
-      rightSection: i ? /* @__PURE__ */ s(z, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
+      rightSection: a ? /* @__PURE__ */ s(z, { size: 10 }) : a === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
       onClick: l,
       ...c,
       children: o
@@ -421,13 +423,13 @@ const ee = (e, n, t = !1) => {
       className: t,
       ref: n,
       leftSection: r,
-      rightSection: i ? /* @__PURE__ */ s(z, { size: 10 }) : i === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
+      rightSection: a ? /* @__PURE__ */ s(z, { size: 10 }) : a === !1 ? /* @__PURE__ */ s("div", { className: "bn-tick-space" }) : null,
       onClick: l,
       ...c,
       children: o
     }
   );
-}), Ue = (e) => {
+}), We = (e) => {
   const {
     children: n,
     sub: t,
@@ -435,23 +437,23 @@ const ee = (e, n, t = !1) => {
     ...o
   } = e;
   return u(o), t ? /* @__PURE__ */ s(p.Sub.Target, { children: n }) : /* @__PURE__ */ s(p.Target, { children: n });
-}, We = m((e, n) => {
+}, Ze = m((e, n) => {
   const {
     className: t,
     children: o,
     sub: r,
     //unused
-    ...i
+    ...a
   } = e;
-  u(i);
-  const a = Q(Ge);
+  u(a);
+  const i = Q(Ve);
   return r ? /* @__PURE__ */ s(
     p.Sub.Dropdown,
     {
       className: t,
       ref: n,
-      onMouseOver: a == null ? void 0 : a.onMenuMouseOver,
-      onMouseLeave: a == null ? void 0 : a.onMenuMouseLeave,
+      onMouseOver: i == null ? void 0 : i.onMenuMouseOver,
+      onMouseLeave: i == null ? void 0 : i.onMenuMouseLeave,
       children: o
     }
   ) : /* @__PURE__ */ s(
@@ -459,24 +461,24 @@ const ee = (e, n, t = !1) => {
     {
       className: t,
       ref: n,
-      onMouseOver: a == null ? void 0 : a.onMenuMouseOver,
-      onMouseLeave: a == null ? void 0 : a.onMenuMouseLeave,
+      onMouseOver: i == null ? void 0 : i.onMenuMouseOver,
+      onMouseLeave: i == null ? void 0 : i.onMenuMouseLeave,
       children: o
     }
   );
-}), Ze = m((e, n) => {
+}), qe = m((e, n) => {
   const { className: t, ...o } = e;
   return u(o), /* @__PURE__ */ s(p.Divider, { className: t, ref: n });
-}), qe = m((e, n) => {
+}), Je = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r), /* @__PURE__ */ s(p.Label, { className: t, ref: n, children: o });
-}), Je = m((e, n) => {
+}), Qe = m((e, n) => {
   const {
     className: t,
     children: o,
     icon: r,
-    onClick: i,
-    onDragEnd: a,
+    onClick: a,
+    onDragEnd: i,
     onDragStart: l,
     draggable: c,
     label: d,
@@ -488,8 +490,8 @@ const ee = (e, n, t = !1) => {
       size: 24,
       className: t,
       ref: n,
-      onClick: i,
-      onDragEnd: a,
+      onClick: a,
+      onDragEnd: i,
       onDragStart: l,
       draggable: c,
       "aria-label": d,
@@ -501,8 +503,8 @@ const ee = (e, n, t = !1) => {
     {
       className: t,
       ref: n,
-      onClick: i,
-      onDragEnd: a,
+      onClick: a,
+      onDragEnd: i,
       onDragStart: l,
       draggable: c,
       "aria-label": d,
@@ -510,26 +512,26 @@ const ee = (e, n, t = !1) => {
       children: o
     }
   );
-}), Qe = m((e, n) => {
+}), Xe = m((e, n) => {
   const {
     className: t,
     tabs: o,
     defaultOpenTab: r,
-    openTab: i,
-    setOpenTab: a,
+    openTab: a,
+    setOpenTab: i,
     loading: l,
     ...c
   } = e;
   return u(c), /* @__PURE__ */ s(b, { className: t, ref: n, children: /* @__PURE__ */ v(
-    k,
+    P,
     {
-      value: i,
+      value: a,
       defaultValue: r,
-      onChange: a,
+      onChange: i,
       children: [
-        l && /* @__PURE__ */ s(pe, { visible: l }),
-        /* @__PURE__ */ s(k.List, { children: o.map((d) => /* @__PURE__ */ s(
-          k.Tab,
+        l && /* @__PURE__ */ s(ve, { visible: l }),
+        /* @__PURE__ */ s(P.List, { children: o.map((d) => /* @__PURE__ */ s(
+          P.Tab,
           {
             "data-test": `${d.name.toLowerCase()}-tab`,
             value: d.name,
@@ -537,44 +539,44 @@ const ee = (e, n, t = !1) => {
           },
           d.name
         )) }),
-        o.map((d) => /* @__PURE__ */ s(k.Panel, { value: d.name, children: d.tabPanel }, d.name))
+        o.map((d) => /* @__PURE__ */ s(P.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 u(a), /* @__PURE__ */ s(
+}), Ye = m((e, n) => {
+  const { className: t, children: o, onClick: r, label: a, ...i } = e;
+  return u(i), /* @__PURE__ */ s(
     T,
     {
       size: "xs",
-      "aria-label": i,
+      "aria-label": a,
       className: t,
       ref: n,
       onClick: r,
-      ...a,
+      ...i,
       children: o
     }
   );
-}), Ye = m((e, n) => {
-  const { className: t, accept: o, value: r, placeholder: i, onChange: a, ...l } = e;
+}), et = m((e, n) => {
+  const { className: t, accept: o, value: r, placeholder: a, onChange: i, ...l } = e;
   return u(l), /* @__PURE__ */ s(
-    ve,
+    Se,
     {
       size: "xs",
       className: t,
       ref: n,
       accept: o,
       value: r,
-      placeholder: i,
-      onChange: a,
+      placeholder: a,
+      onChange: i,
       ...l
     }
   );
-}), et = m((e, n) => {
+}), tt = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   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;
+}), nt = m((e, n) => {
+  const { className: t, value: o, placeholder: r, onKeyDown: a, onChange: i, ...l } = e;
   return u(l), /* @__PURE__ */ s(
     Z,
     {
@@ -584,14 +586,14 @@ const ee = (e, n, t = !1) => {
       ref: n,
       value: o,
       placeholder: r,
-      onKeyDown: i,
-      onChange: a
+      onKeyDown: a,
+      onChange: i
     }
   );
-}), nt = (e) => {
-  const { open: n, onOpenChange: t, position: o, children: r, ...i } = e;
-  return u(i), /* @__PURE__ */ s(
-    we,
+}), ot = (e) => {
+  const { open: n, onOpenChange: t, position: o, children: r, ...a } = e;
+  return u(a), /* @__PURE__ */ s(
+    xe,
     {
       middlewares: { size: { padding: 20 } },
       withinPortal: !1,
@@ -602,19 +604,19 @@ const ee = (e, n, t = !1) => {
       children: r
     }
   );
-}, ot = (e) => {
+}, rt = (e) => {
   const { children: n, ...t } = e;
-  return u(t), /* @__PURE__ */ s(ye, { children: n });
-}, rt = m((e, n) => {
+  return u(t), /* @__PURE__ */ s(we, { children: n });
+}, st = m((e, n) => {
   const {
     className: t,
     children: o,
     variant: r,
     // unused
-    ...i
+    ...a
   } = e;
-  return u(i), /* @__PURE__ */ s(Se, { className: t, ref: n, children: o });
-}), st = m((e, n) => {
+  return u(a), /* @__PURE__ */ s(ye, { className: t, ref: n, children: o });
+}), at = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r, !1), /* @__PURE__ */ s(
     b,
@@ -632,8 +634,8 @@ const ee = (e, n, t = !1) => {
     className: t,
     children: o,
     icon: r,
-    onClick: i,
-    onDragEnd: a,
+    onClick: a,
+    onDragEnd: i,
     onDragStart: l,
     draggable: c,
     label: d,
@@ -645,8 +647,8 @@ const ee = (e, n, t = !1) => {
       size: 24,
       className: t,
       ref: n,
-      onClick: i,
-      onDragEnd: a,
+      onClick: a,
+      onDragEnd: i,
       onDragStart: l,
       draggable: c,
       "aria-label": d,
@@ -658,8 +660,8 @@ const ee = (e, n, t = !1) => {
     {
       className: t,
       ref: n,
-      onClick: i,
-      onDragEnd: a,
+      onClick: a,
+      onDragEnd: i,
       onDragStart: l,
       draggable: c,
       "aria-label": d,
@@ -667,9 +669,9 @@ const ee = (e, n, t = !1) => {
       children: o
     }
   );
-}), at = m((e, n) => {
-  const { className: t, children: o, id: r, ...i } = e;
-  return u(i), /* @__PURE__ */ s(
+}), lt = m((e, n) => {
+  const { className: t, children: o, id: r, ...a } = e;
+  return u(a), /* @__PURE__ */ s(
     L,
     {
       gap: 0,
@@ -680,77 +682,76 @@ const ee = (e, n, t = !1) => {
       children: o
     }
   );
-}), lt = m((e, n) => {
+}), ct = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r), /* @__PURE__ */ s(b, { className: t, ref: n, children: /* @__PURE__ */ s(b, { 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;
+}), dt = m((e, n) => {
+  const { className: t, isSelected: o, onClick: r, item: a, id: i, ...l } = e;
   u(l);
   const c = X(null);
   return Y(() => {
     if (!c.current || !o)
       return;
-    const d = K(c.current, c.current.closest(
+    K(c.current, c.current.closest(
       ".bn-suggestion-menu, #ai-suggestion-menu"
-    ));
-    d === "top" ? c.current.scrollIntoView(!0) : d === "bottom" && c.current.scrollIntoView(!1);
+    )) !== "none" && c.current.scrollIntoView({ block: "nearest" });
   }, [o]), /* @__PURE__ */ v(
     b,
     {
       gap: 0,
       className: t,
       ref: j(n, c),
-      id: a,
+      id: i,
       role: "option",
       onMouseDown: (d) => d.preventDefault(),
       onClick: r,
       "aria-selected": o || void 0,
       children: [
-        i.icon && /* @__PURE__ */ s(
+        a.icon && /* @__PURE__ */ s(
           b,
           {
             className: "bn-mt-suggestion-menu-item-section",
             "data-position": "left",
-            children: i.icon
+            children: a.icon
           }
         ),
         /* @__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 })
+          /* @__PURE__ */ s(C, { className: "bn-mt-suggestion-menu-item-title", children: a.title }),
+          /* @__PURE__ */ s(C, { className: "bn-mt-suggestion-menu-item-subtitle", children: a.subtext })
         ] }),
-        i.badge && /* @__PURE__ */ s(
+        a.badge && /* @__PURE__ */ s(
           b,
           {
             "data-position": "right",
             className: "bn-mt-suggestion-menu-item-section",
-            children: /* @__PURE__ */ s(xe, { size: "xs", children: i.badge })
+            children: /* @__PURE__ */ s(Ce, { size: "xs", children: a.badge })
           }
         )
       ]
     }
   );
-}), dt = m((e, n) => {
+}), ut = m((e, n) => {
   const { className: t, children: o, ...r } = e;
   return u(r), /* @__PURE__ */ s(b, { className: t, ref: n, children: o });
-}), ut = m((e, n) => {
+}), mt = m((e, n) => {
   const { className: t, ...o } = e;
   return u(o), /* @__PURE__ */ s(q, { className: t, type: "dots", size: 16, ref: n });
-}), mt = m((e, n) => {
-  const { className: t, children: o, id: r, columns: i, ...a } = e;
-  return u(a), /* @__PURE__ */ s(
+}), gt = m((e, n) => {
+  const { className: t, children: o, id: r, columns: a, ...i } = e;
+  return u(i), /* @__PURE__ */ s(
     "div",
     {
       className: t,
-      style: { gridTemplateColumns: `repeat(${i}, 1fr)` },
+      style: { gridTemplateColumns: `repeat(${a}, 1fr)` },
       ref: n,
       id: r,
       role: "grid",
       children: o
     }
   );
-}), gt = m((e, n) => {
-  const { className: t, children: o, columns: r, ...i } = e;
-  return u(i), /* @__PURE__ */ s(
+}), ft = m((e, n) => {
+  const { className: t, children: o, columns: r, ...a } = e;
+  return u(a), /* @__PURE__ */ s(
     b,
     {
       className: t,
@@ -759,39 +760,38 @@ const ee = (e, n, t = !1) => {
       children: /* @__PURE__ */ s(b, { className: "bn-mt-suggestion-menu-item-title", children: o })
     }
   );
-}), ft = m((e, n) => {
-  const { className: t, isSelected: o, onClick: r, item: i, id: a, ...l } = e;
+}), ht = m((e, n) => {
+  const { className: t, isSelected: o, onClick: r, item: a, id: i, ...l } = e;
   u(l);
   const c = X(null);
   return Y(() => {
     if (!c.current || !o)
       return;
-    const d = K(
+    K(
       c.current,
       c.current.closest(".bn-grid-suggestion-menu")
-    );
-    d === "top" ? c.current.scrollIntoView(!0) : d === "bottom" && c.current.scrollIntoView(!1);
+    ) !== "none" && c.current.scrollIntoView({ block: "nearest" });
   }, [o]), /* @__PURE__ */ s(
     "div",
     {
       className: t,
       ref: j(n, c),
-      id: a,
+      id: i,
       role: "option",
       onClick: r,
       "aria-selected": o || void 0,
-      children: i.icon
+      children: a.icon
     }
   );
-}), ht = m((e, n) => {
+}), bt = m((e, n) => {
   const {
     className: t,
     children: o,
     // unused, using "dots" instead
     columns: r,
-    ...i
+    ...a
   } = e;
-  return u(i), /* @__PURE__ */ s(
+  return u(a), /* @__PURE__ */ s(
     q,
     {
       className: t,
@@ -800,26 +800,26 @@ const ee = (e, n, t = !1) => {
       ref: n
     }
   );
-}), bt = m((e, n) => {
-  const { children: t, className: o, onMouseDown: r, onClick: i, ...a } = e;
-  return u(a, !1), /* @__PURE__ */ s(
+}), pt = m((e, n) => {
+  const { children: t, className: o, onMouseDown: r, onClick: a, ...i } = e;
+  return u(i, !1), /* @__PURE__ */ s(
     T,
     {
       className: o,
       ref: n,
       onMouseDown: r,
-      onClick: i,
-      ...a,
+      onClick: a,
+      ...i,
       children: t
     }
   );
-}), pt = m((e, n) => {
+}), vt = m((e, n) => {
   const {
     className: t,
     children: o,
     draggable: r,
-    onDragStart: i,
-    onDragEnd: a,
+    onDragStart: a,
+    onDragEnd: i,
     style: l,
     label: c,
     ...d
@@ -831,8 +831,8 @@ const ee = (e, n, t = !1) => {
       ref: n,
       "aria-label": c,
       draggable: r,
-      onDragStart: i,
-      onDragEnd: a,
+      onDragStart: a,
+      onDragEnd: i,
       style: l,
       ...d,
       children: o
@@ -844,21 +844,21 @@ const ee = (e, n, t = !1) => {
       className: t,
       children: o,
       onMouseEnter: r,
-      onMouseLeave: i,
-      variant: a,
+      onMouseLeave: a,
+      variant: i,
       ...l
     } = e;
     u(l);
-    const { ref: c, focused: d } = Me(), f = Oe(d), h = j(n, c, f);
+    const { ref: c, focused: d } = Oe(), f = De(d), h = j(n, c, f);
     return /* @__PURE__ */ s(
-      Ce,
+      Ne,
       {
         className: t,
         ref: h,
         role: "toolbar",
         onMouseEnter: r,
-        onMouseLeave: i,
-        gap: a === "action-toolbar" ? 2 : void 0,
+        onMouseLeave: a,
+        gap: i === "action-toolbar" ? 2 : void 0,
         children: o
       }
     );
@@ -870,18 +870,18 @@ var ne = {
   className: void 0,
   style: void 0,
   attr: void 0
-}, _ = N.createContext && /* @__PURE__ */ N.createContext(ne), vt = ["attr", "size", "title"];
-function St(e, n) {
+}, _ = N.createContext && /* @__PURE__ */ N.createContext(ne), St = ["attr", "size", "title"];
+function yt(e, n) {
   if (e == null) return {};
-  var t = yt(e, n), o, r;
+  var t = wt(e, n), o, r;
   if (Object.getOwnPropertySymbols) {
-    var i = Object.getOwnPropertySymbols(e);
-    for (r = 0; r < i.length; r++)
-      o = i[r], !(n.indexOf(o) >= 0) && Object.prototype.propertyIsEnumerable.call(e, o) && (t[o] = e[o]);
+    var a = Object.getOwnPropertySymbols(e);
+    for (r = 0; r < a.length; r++)
+      o = a[r], !(n.indexOf(o) >= 0) && Object.prototype.propertyIsEnumerable.call(e, o) && (t[o] = e[o]);
   }
   return t;
 }
-function yt(e, n) {
+function wt(e, n) {
   if (e == null) return {};
   var t = {};
   for (var o in e)
@@ -901,7 +901,7 @@ function F() {
     return e;
   }, F.apply(this, arguments);
 }
-function V(e, n) {
+function G(e, n) {
   var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e);
@@ -914,22 +914,22 @@ function V(e, n) {
 function M(e) {
   for (var n = 1; n < arguments.length; n++) {
     var t = arguments[n] != null ? arguments[n] : {};
-    n % 2 ? V(Object(t), !0).forEach(function(o) {
-      wt(e, o, t[o]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : V(Object(t)).forEach(function(o) {
+    n % 2 ? G(Object(t), !0).forEach(function(o) {
+      xt(e, o, t[o]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : G(Object(t)).forEach(function(o) {
       Object.defineProperty(e, o, Object.getOwnPropertyDescriptor(t, o));
     });
   }
   return e;
 }
-function wt(e, n, t) {
-  return n = xt(n), n in e ? Object.defineProperty(e, n, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[n] = t, e;
+function xt(e, n, t) {
+  return n = Ct(n), n in e ? Object.defineProperty(e, n, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[n] = t, e;
 }
-function xt(e) {
-  var n = Ct(e, "string");
+function Ct(e) {
+  var n = Nt(e, "string");
   return typeof n == "symbol" ? n : n + "";
 }
-function Ct(e, n) {
+function Nt(e, n) {
   if (typeof e != "object" || !e) return e;
   var t = e[Symbol.toPrimitive];
   if (t !== void 0) {
@@ -944,23 +944,23 @@ function oe(e) {
     key: t
   }, n.attr), oe(n.child)));
 }
-function Nt(e) {
-  return (n) => /* @__PURE__ */ N.createElement(Tt, F({
+function Tt(e) {
+  return (n) => /* @__PURE__ */ N.createElement(kt, F({
     attr: M({}, e.attr)
   }, n), oe(e.child));
 }
-function Tt(e) {
+function kt(e) {
   var n = (t) => {
     var {
       attr: o,
       size: r,
-      title: i
-    } = e, a = St(e, vt), l = r || t.size || "1em", c;
+      title: a
+    } = e, i = yt(e, St), l = r || t.size || "1em", c;
     return t.className && (c = t.className), e.className && (c = (c ? c + " " : "") + e.className), /* @__PURE__ */ N.createElement("svg", F({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
-    }, t.attr, o, a, {
+    }, t.attr, o, i, {
       className: c,
       style: M(M({
         color: e.color || t.color
@@ -968,18 +968,18 @@ function Tt(e) {
       height: l,
       width: l,
       xmlns: "http://www.w3.org/2000/svg"
-    }), i && /* @__PURE__ */ N.createElement("title", null, i), e.children);
+    }), a && /* @__PURE__ */ N.createElement("title", null, a), e.children);
   };
   return _ !== void 0 ? /* @__PURE__ */ N.createElement(_.Consumer, null, (t) => n(t)) : n(ne);
 }
 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);
+  return Tt({ 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;
-  u(i);
-  const a = o.filter((l) => l.isSelected)[0];
-  return a ? /* @__PURE__ */ v(
+  const { className: t, items: o, isDisabled: r, ...a } = e;
+  u(a);
+  const i = o.filter((l) => l.isSelected)[0];
+  return i ? /* @__PURE__ */ v(
     p,
     {
       withinPortal: !1,
@@ -995,12 +995,12 @@ const I = m((e, n) => {
             onMouseDown: (l) => {
               R() && l.currentTarget.focus();
             },
-            leftSection: a.icon,
+            leftSection: i.icon,
             rightSection: /* @__PURE__ */ s(Pt, {}),
             size: "xs",
             variant: "subtle",
             disabled: r,
-            children: a.text
+            children: i.text
           }
         ) }),
         /* @__PURE__ */ s(p.Dropdown, { className: t, ref: n, children: o.map((l) => /* @__PURE__ */ s(
@@ -1020,24 +1020,24 @@ const I = m((e, n) => {
       ]
     }
   ) : null;
-}), kt = {
+}), Ft = {
   FormattingToolbar: {
     Root: D,
     Button: O,
     Select: I
   },
   FilePanel: {
-    Root: Qe,
-    Button: Xe,
-    FileInput: Ye,
-    TabPanel: et,
-    TextInput: tt
+    Root: Xe,
+    Button: Ye,
+    FileInput: et,
+    TabPanel: tt,
+    TextInput: nt
   },
   GridSuggestionMenu: {
-    Root: mt,
-    Item: ft,
-    EmptyItem: gt,
-    Loader: ht
+    Root: gt,
+    Item: ht,
+    EmptyItem: ft,
+    Loader: bt
   },
   LinkToolbar: {
     Root: D,
@@ -1045,42 +1045,42 @@ const I = m((e, n) => {
     Select: I
   },
   SideMenu: {
-    Root: st,
+    Root: at,
     Button: it
   },
   SuggestionMenu: {
-    Root: at,
-    Item: ct,
-    EmptyItem: lt,
-    Label: dt,
-    Loader: ut
+    Root: lt,
+    Item: dt,
+    EmptyItem: ct,
+    Label: ut,
+    Loader: mt
   },
   TableHandle: {
-    Root: pt,
-    ExtendButton: bt
+    Root: vt,
+    ExtendButton: pt
   },
   Generic: {
     Badge: {
-      Root: Re,
-      Group: ze
+      Root: ze,
+      Group: Be
     },
     Form: {
       Root: (e) => /* @__PURE__ */ s("div", { children: e.children }),
-      TextInput: Ve
+      TextInput: He
     },
     Menu: {
-      Root: He,
-      Trigger: Ue,
-      Dropdown: We,
-      Divider: Ze,
-      Label: qe,
-      Item: Ke,
-      Button: Je
+      Root: Ke,
+      Trigger: We,
+      Dropdown: Ze,
+      Divider: qe,
+      Label: Je,
+      Item: Ue,
+      Button: Qe
     },
     Popover: {
-      Root: nt,
-      Trigger: ot,
-      Content: rt
+      Root: ot,
+      Trigger: rt,
+      Content: st
     },
     Toolbar: {
       Root: D,
@@ -1089,19 +1089,19 @@ const I = m((e, n) => {
     }
   },
   Comments: {
-    Comment: $e,
-    Editor: Ae,
-    Card: Be,
-    CardSection: Ee,
-    ExpandSectionsPrompt: Le
+    Comment: Ae,
+    Editor: _e,
+    Card: Ee,
+    CardSection: Le,
+    ExpandSectionsPrompt: je
   }
-}, Ft = (e) => {
-  const { className: n, theme: t, ...o } = e, r = H(), i = ue(), a = (r == null ? void 0 : r.colorSchemePreference) || i, l = ke(
+}, Mt = (e) => {
+  const { className: n, theme: t, ...o } = e, r = V(), a = me(), i = (r == null ? void 0 : r.colorSchemePreference) || a, l = Fe(
     (h) => {
-      if (h && (Ie(h), typeof t == "object")) {
+      if (h && (Re(h), typeof t == "object")) {
         if ("light" in t && "dark" in t) {
           A(
-            t[a === "dark" ? "dark" : "light"],
+            t[i === "dark" ? "dark" : "light"],
             h
           );
           return;
@@ -1110,9 +1110,9 @@ const I = m((e, n) => {
         return;
       }
     },
-    [a, t]
-  ), c = Q(Ne), d = typeof t == "string" ? t : a !== "no-preference" ? a : "light", f = /* @__PURE__ */ s(me.Provider, { value: kt, children: /* @__PURE__ */ s(
-    ge,
+    [i, t]
+  ), c = Q(Te), d = typeof t == "string" ? t : i !== "no-preference" ? i : "light", f = /* @__PURE__ */ s(ge.Provider, { value: Ft, children: /* @__PURE__ */ s(
+    fe,
     {
       "data-mantine-color-scheme": d,
       className: B("bn-mantine", n || ""),
@@ -1122,7 +1122,7 @@ const I = m((e, n) => {
     }
   ) });
   return c ? f : /* @__PURE__ */ s(
-    Te,
+    ke,
     {
       withCssVariables: !1,
       getRootElement: () => {
@@ -1141,7 +1141,7 @@ const I = m((e, n) => {
   "#161616",
   "#0F0F0F",
   "#000000"
-], G = {
+], H = {
   colors: {
     editor: {
       text: g[5],
@@ -1170,11 +1170,11 @@ const I = m((e, n) => {
     shadow: g[2],
     border: g[1],
     sideMenu: g[2],
-    highlights: re
+    highlights: se
   },
   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'
-}, Bt = {
+}, Et = {
   colors: {
     editor: {
       text: g[2],
@@ -1203,18 +1203,18 @@ const I = m((e, n) => {
     shadow: g[8],
     border: g[7],
     sideMenu: g[4],
-    highlights: se
+    highlights: ae
   },
-  borderRadius: G.borderRadius,
-  fontFamily: G.fontFamily
+  borderRadius: H.borderRadius,
+  fontFamily: H.fontFamily
 };
 export {
-  Ft as BlockNoteView,
+  Mt as BlockNoteView,
   A as applyBlockNoteCSSVariablesFromTheme,
-  kt as components,
-  Bt as darkDefaultTheme,
+  Ft as components,
+  Et as darkDefaultTheme,
   g as defaultColorScheme,
-  G as lightDefaultTheme,
-  Ie as removeBlockNoteCSSVariables
+  H as lightDefaultTheme,
+  Re as removeBlockNoteCSSVariables
 };
 //# sourceMappingURL=blocknote-mantine.js.map