@blocknote/shadcn 0.30.0 → 0.31.0

package/dist/blocknote-shadcn.js

@@ -1,62 +1,62 @@
-import { jsx as a, jsxs as g, Fragment as ve } from "react/jsx-runtime";
-import { assertEmpty as m, mergeCSSClasses as Ne } from "@blocknote/core";
-import { elementOverflow as L, mergeRefs as z, useFocusWithin as xe, FormattingToolbarController as we, getFormattingToolbarItems as Ce, FormattingToolbar as ye, ComponentsContext as Se, BlockNoteViewRaw as Te } from "@blocknote/react";
-import * as c from "react";
-import { createContext as Ie, useContext as Me, forwardRef as p, useMemo as E, useRef as V, useEffect as A, useState as De } from "react";
-import { FormProvider as Re, useFormContext as Be, useForm as Fe } from "react-hook-form";
+import { jsx as a, jsxs as g, Fragment as we } from "react/jsx-runtime";
+import { assertEmpty as m, mergeCSSClasses as Ce } from "@blocknote/core";
+import { elementOverflow as z, mergeRefs as E, useFocusWithin as ye, FormattingToolbarController as Se, getFormattingToolbarItems as Te, FormattingToolbar as Me, ComponentsContext as Ie, BlockNoteViewRaw as De } from "@blocknote/react";
+import * as b from "react";
+import { createContext as Re, useContext as ke, forwardRef as p, useMemo as V, useRef as A, useEffect as $, useState as Be } from "react";
+import { FormProvider as Fe, useFormContext as Pe, useForm as Le } from "react-hook-form";
 import * as S from "@radix-ui/react-avatar";
-import { clsx as ke } from "clsx";
-import { extendTailwindMerge as Pe } from "tailwind-merge";
+import { clsx as ze } from "clsx";
+import { extendTailwindMerge as Ee } from "tailwind-merge";
 import { cva as I } from "class-variance-authority";
-import { Slot as $ } from "@radix-ui/react-slot";
+import { Slot as j } from "@radix-ui/react-slot";
 import * as N from "@radix-ui/react-dropdown-menu";
-import { ChevronRight as j, Check as G, Circle as Le, ChevronDown as U, ChevronUp as ze } from "lucide-react";
+import { ChevronRight as q, Check as G, Circle as Ve, ChevronDown as U, ChevronUp as Ae } from "lucide-react";
 import * as H from "@radix-ui/react-label";
-import * as M from "@radix-ui/react-popover";
+import * as D from "@radix-ui/react-popover";
 import * as x from "@radix-ui/react-select";
 import * as y from "@radix-ui/react-tabs";
 import * as O from "@radix-ui/react-toggle";
 import * as T from "@radix-ui/react-tooltip";
-const Ee = Pe({
+const $e = Ee({
   prefix: "bn-"
 });
-function d(...n) {
-  return Ee(ke(n));
+function i(...n) {
+  return $e(ze(n));
 }
-const q = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+const K = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   S.Root,
   {
     ref: e,
-    className: d(
+    className: i(
       "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
       n
     ),
     ...t
   }
 ));
-q.displayName = S.Root.displayName;
-const K = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+K.displayName = S.Root.displayName;
+const Q = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   S.Image,
   {
     ref: e,
-    className: d("aspect-square h-full w-full", n),
+    className: i("aspect-square h-full w-full", n),
     ...t
   }
 ));
-K.displayName = S.Image.displayName;
-const W = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+Q.displayName = S.Image.displayName;
+const W = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   S.Fallback,
   {
     ref: e,
-    className: d(
-      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+    className: i(
+      "bg-muted flex h-full w-full items-center justify-center rounded-full",
       n
     ),
     ...t
   }
 ));
 W.displayName = S.Fallback.displayName;
-const Ve = I(
+const je = I(
   "bn-inline-flex bn-items-center bn-rounded-full bn-border bn-px-2.5 bn-py-0.5 bn-text-xs bn-font-semibold bn-transition-colors focus:bn-outline-none focus:bn-ring-2 focus:bn-ring-ring focus:bn-ring-offset-2",
   {
     variants: {
@@ -72,10 +72,10 @@ const Ve = I(
     }
   }
 );
-function Ae({ className: n, variant: t, ...e }) {
-  return /* @__PURE__ */ a("div", { className: d(Ve({ variant: t }), n), ...e });
+function qe({ className: n, variant: t, ...e }) {
+  return /* @__PURE__ */ a("div", { className: i(je({ variant: t }), n), ...e });
 }
-const $e = I(
+const Ge = I(
   "bn-inline-flex bn-items-center bn-justify-center bn-whitespace-nowrap bn-rounded-md bn-text-sm bn-font-medium bn-ring-offset-background bn-transition-colors focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2 disabled:bn-pointer-events-none disabled:bn-opacity-50",
   {
     variants: {
@@ -99,76 +99,76 @@ const $e = I(
       size: "default"
     }
   }
-), _ = c.forwardRef(
+), Z = b.forwardRef(
   ({ className: n, variant: t, size: e, asChild: o = !1, ...r }, s) => /* @__PURE__ */ a(
-    o ? $ : "button",
+    o ? j : "button",
     {
-      className: d($e({ variant: t, size: e, className: n })),
+      className: i(Ge({ variant: t, size: e, className: n })),
       ref: s,
       type: "button",
       ...r
     }
   )
 );
-_.displayName = "Button";
-const J = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+Z.displayName = "Button";
+const _ = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   "div",
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-rounded-lg bn-border bn-bg-card bn-text-card-foreground bn-shadow-sm",
       n
     ),
     ...t
   }
 ));
-J.displayName = "Card";
-const je = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+_.displayName = "Card";
+const Ue = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   "div",
   {
     ref: e,
-    className: d("bn-flex bn-flex-col bn-space-y-1.5 bn-p-6", n),
+    className: i("bn-flex bn-flex-col bn-space-y-1.5 bn-p-6", n),
     ...t
   }
 ));
-je.displayName = "CardHeader";
-const Ge = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+Ue.displayName = "CardHeader";
+const He = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   "h3",
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-text-2xl bn-font-semibold bn-leading-none bn-tracking-tight",
       n
     ),
     ...t
   }
 ));
-Ge.displayName = "CardTitle";
-const Ue = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+He.displayName = "CardTitle";
+const Oe = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   "p",
   {
     ref: e,
-    className: d("bn-text-sm bn-text-muted-foreground", n),
+    className: i("bn-text-sm bn-text-muted-foreground", n),
     ...t
   }
 ));
-Ue.displayName = "CardDescription";
-const Q = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a("div", { ref: e, className: d("bn-p-6 bn-pt-0", n), ...t }));
-Q.displayName = "CardContent";
-const He = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+Oe.displayName = "CardDescription";
+const J = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a("div", { ref: e, className: i("bn-p-6 bn-pt-0", n), ...t }));
+J.displayName = "CardContent";
+const Ke = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   "div",
   {
     ref: e,
-    className: d("bn-flex bn-items-center bn-p-6 bn-pt-0", n),
+    className: i("bn-flex bn-items-center bn-p-6 bn-pt-0", n),
     ...t
   }
 ));
-He.displayName = "CardFooter";
-const Oe = N.Root, qe = N.Trigger, Ke = N.Sub, X = c.forwardRef(({ className: n, inset: t, children: e, ...o }, r) => /* @__PURE__ */ g(
+Ke.displayName = "CardFooter";
+const Qe = N.Root, We = N.Trigger, Ze = N.Sub, X = b.forwardRef(({ className: n, inset: t, children: e, ...o }, r) => /* @__PURE__ */ g(
   N.SubTrigger,
   {
     ref: r,
-    className: d(
+    className: i(
       "bn-flex bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-px-2 bn-py-1.5 bn-text-sm bn-outline-none focus:bn-bg-accent data-[state=open]:bn-bg-accent",
       t && "bn-pl-8",
       n
@@ -176,16 +176,16 @@ const Oe = N.Root, qe = N.Trigger, Ke = N.Sub, X = c.forwardRef(({ className: n,
     ...o,
     children: [
       e,
-      /* @__PURE__ */ a(j, { className: "bn-ml-auto bn-h-4 bn-w-4" })
+      /* @__PURE__ */ a(q, { className: "bn-ml-auto bn-h-4 bn-w-4" })
     ]
   }
 ));
 X.displayName = N.SubTrigger.displayName;
-const Y = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+const Y = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   N.SubContent,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-z-50 bn-min-w-[8rem] bn-overflow-hidden bn-rounded-md bn-border bn-bg-popover bn-p-1 bn-text-popover-foreground bn-shadow-lg data-[state=open]:bn-animate-in data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=open]:bn-fade-in-0 data-[state=closed]:bn-zoom-out-95 data-[state=open]:bn-zoom-in-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
       n
     ),
@@ -193,14 +193,14 @@ const Y = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   }
 ));
 Y.displayName = N.SubContent.displayName;
-const Z = c.forwardRef(({ className: n, sideOffset: t = 4, ...e }, o) => (
+const ee = b.forwardRef(({ className: n, sideOffset: t = 4, ...e }, o) => (
   // <DropdownMenuPrimitive.Portal>
   /* @__PURE__ */ a(
     N.Content,
     {
       ref: o,
       sideOffset: t,
-      className: d(
+      className: i(
         "bn-z-50 bn-min-w-[8rem] bn-overflow-hidden bn-rounded-md bn-border bn-bg-popover bn-p-1 bn-text-popover-foreground bn-shadow-md data-[state=open]:bn-animate-in data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=open]:bn-fade-in-0 data-[state=closed]:bn-zoom-out-95 data-[state=open]:bn-zoom-in-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
         n
       ),
@@ -208,12 +208,12 @@ const Z = c.forwardRef(({ className: n, sideOffset: t = 4, ...e }, o) => (
     }
   )
 ));
-Z.displayName = N.Content.displayName;
-const ee = c.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */ a(
+ee.displayName = N.Content.displayName;
+const ne = b.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */ a(
   N.Item,
   {
     ref: o,
-    className: d(
+    className: i(
       "bn-relative bn-flex bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-px-2 bn-py-1.5 bn-text-sm bn-outline-none bn-transition-colors focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
       t && "bn-pl-8",
       n
@@ -221,12 +221,12 @@ const ee = c.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */
     ...e
   }
 ));
-ee.displayName = N.Item.displayName;
-const ne = c.forwardRef(({ className: n, children: t, checked: e, ...o }, r) => /* @__PURE__ */ g(
+ne.displayName = N.Item.displayName;
+const te = b.forwardRef(({ className: n, children: t, checked: e, ...o }, r) => /* @__PURE__ */ g(
   N.CheckboxItem,
   {
     ref: r,
-    className: d(
+    className: i(
       "bn-relative bn-flex bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-py-1.5 bn-pl-8 bn-pr-2 bn-text-sm bn-outline-none bn-transition-colors focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
       n
     ),
@@ -238,28 +238,28 @@ const ne = c.forwardRef(({ className: n, children: t, checked: e, ...o }, r) =>
     ]
   }
 ));
-ne.displayName = N.CheckboxItem.displayName;
-const We = c.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
+te.displayName = N.CheckboxItem.displayName;
+const _e = b.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
   N.RadioItem,
   {
     ref: o,
-    className: d(
+    className: i(
       "bn-relative bn-flex bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-py-1.5 bn-pl-8 bn-pr-2 bn-text-sm bn-outline-none bn-transition-colors focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
       n
     ),
     ...e,
     children: [
-      /* @__PURE__ */ a("span", { className: "bn-absolute bn-left-2 bn-flex bn-h-3.5 bn-w-3.5 bn-items-center bn-justify-center", children: /* @__PURE__ */ a(N.ItemIndicator, { children: /* @__PURE__ */ a(Le, { className: "bn-h-2 bn-w-2 bn-fill-current" }) }) }),
+      /* @__PURE__ */ a("span", { className: "bn-absolute bn-left-2 bn-flex bn-h-3.5 bn-w-3.5 bn-items-center bn-justify-center", children: /* @__PURE__ */ a(N.ItemIndicator, { children: /* @__PURE__ */ a(Ve, { className: "bn-h-2 bn-w-2 bn-fill-current" }) }) }),
       t
     ]
   }
 ));
-We.displayName = N.RadioItem.displayName;
-const te = c.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */ a(
+_e.displayName = N.RadioItem.displayName;
+const oe = b.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */ a(
   N.Label,
   {
     ref: o,
-    className: d(
+    className: i(
       "bn-px-2 bn-py-1.5 bn-text-sm bn-font-semibold",
       t && "bn-pl-8",
       n
@@ -267,31 +267,31 @@ const te = c.forwardRef(({ className: n, inset: t, ...e }, o) => /* @__PURE__ */
     ...e
   }
 ));
-te.displayName = N.Label.displayName;
-const oe = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+oe.displayName = N.Label.displayName;
+const ae = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   N.Separator,
   {
     ref: e,
-    className: d("bn--mx-1 bn-my-1 bn-h-px bn-bg-muted", n),
+    className: i("bn--mx-1 bn-my-1 bn-h-px bn-bg-muted", n),
     ...t
   }
 ));
-oe.displayName = N.Separator.displayName;
-const _e = I(
+ae.displayName = N.Separator.displayName;
+const Je = I(
   "bn-text-sm bn-font-medium bn-leading-none peer-disabled:bn-cursor-not-allowed peer-disabled:bn-opacity-70"
-), P = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+), P = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   H.Root,
   {
     ref: e,
-    className: d(_e(), n),
+    className: i(Je(), n),
     ...t
   }
 ));
 P.displayName = H.Root.displayName;
-const Je = Re, Qe = c.createContext(
+const Xe = Fe, Ye = b.createContext(
   {}
-), D = () => {
-  const n = c.useContext(Qe), t = c.useContext(ae), { getFieldState: e, formState: o } = Be(), r = e(n.name, o);
+), R = () => {
+  const n = b.useContext(Ye), t = b.useContext(re), { getFieldState: e, formState: o } = Pe(), r = e(n.name, o);
   if (!n)
     throw new Error("useFormField should be used within <FormField>");
   const { id: s } = t;
@@ -303,30 +303,30 @@ const Je = Re, Qe = c.createContext(
     formMessageId: `${s}-form-item-message`,
     ...r
   };
-}, ae = c.createContext(
+}, re = b.createContext(
   {}
-), Xe = c.forwardRef(({ className: n, ...t }, e) => {
-  const o = c.useId();
-  return /* @__PURE__ */ a(ae.Provider, { value: { id: o }, children: /* @__PURE__ */ a("div", { ref: e, className: d("bn-space-y-2", n), ...t }) });
+), en = b.forwardRef(({ className: n, ...t }, e) => {
+  const o = b.useId();
+  return /* @__PURE__ */ a(re.Provider, { value: { id: o }, children: /* @__PURE__ */ a("div", { ref: e, className: i("bn-space-y-2", n), ...t }) });
 });
-Xe.displayName = "FormItem";
-const Ye = c.forwardRef(({ className: n, ...t }, e) => {
-  const { error: o, formItemId: r } = D();
+en.displayName = "FormItem";
+const nn = b.forwardRef(({ className: n, ...t }, e) => {
+  const { error: o, formItemId: r } = R();
   return /* @__PURE__ */ a(
     P,
     {
       ref: e,
-      className: d(o && "bn-text-destructive", n),
+      className: i(o && "bn-text-destructive", n),
       htmlFor: r,
       ...t
     }
   );
 });
-Ye.displayName = "FormLabel";
-const Ze = c.forwardRef(({ ...n }, t) => {
-  const { error: e, formItemId: o, formDescriptionId: r, formMessageId: s } = D();
+nn.displayName = "FormLabel";
+const tn = b.forwardRef(({ ...n }, t) => {
+  const { error: e, formItemId: o, formDescriptionId: r, formMessageId: s } = R();
   return /* @__PURE__ */ a(
-    $,
+    j,
     {
       ref: t,
       id: o,
@@ -336,40 +336,40 @@ const Ze = c.forwardRef(({ ...n }, t) => {
     }
   );
 });
-Ze.displayName = "FormControl";
-const en = c.forwardRef(({ className: n, ...t }, e) => {
-  const { formDescriptionId: o } = D();
+tn.displayName = "FormControl";
+const on = b.forwardRef(({ className: n, ...t }, e) => {
+  const { formDescriptionId: o } = R();
   return /* @__PURE__ */ a(
     "p",
     {
       ref: e,
       id: o,
-      className: d("bn-text-sm bn-text-muted-foreground", n),
+      className: i("bn-text-sm bn-text-muted-foreground", n),
       ...t
     }
   );
 });
-en.displayName = "FormDescription";
-const nn = c.forwardRef(({ className: n, children: t, ...e }, o) => {
-  const { error: r, formMessageId: s } = D(), i = r ? String(r == null ? void 0 : r.message) : t;
-  return i ? /* @__PURE__ */ a(
+on.displayName = "FormDescription";
+const an = b.forwardRef(({ className: n, children: t, ...e }, o) => {
+  const { error: r, formMessageId: s } = R(), l = r ? String(r == null ? void 0 : r.message) : t;
+  return l ? /* @__PURE__ */ a(
     "p",
     {
       ref: o,
       id: s,
-      className: d("bn-text-sm bn-font-medium bn-text-destructive", n),
+      className: i("bn-text-sm bn-font-medium bn-text-destructive", n),
       ...e,
-      children: i
+      children: l
     }
   ) : null;
 });
-nn.displayName = "FormMessage";
-const re = c.forwardRef(
+an.displayName = "FormMessage";
+const se = b.forwardRef(
   ({ className: n, type: t, ...e }, o) => /* @__PURE__ */ a(
     "input",
     {
       type: t,
-      className: d(
+      className: i(
         "bn-flex bn-h-10 bn-w-full bn-rounded-md bn-border bn-border-input bn-bg-background bn-px-3 bn-py-2 bn-text-sm bn-ring-offset-background file:bn-border-0 file:bn-bg-transparent file:bn-text-sm file:bn-font-medium placeholder:bn-text-muted-foreground focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2 disabled:bn-cursor-not-allowed disabled:bn-opacity-50",
         n
       ),
@@ -378,16 +378,16 @@ const re = c.forwardRef(
     }
   )
 );
-re.displayName = "Input";
-const tn = M.Root, on = M.Trigger, se = c.forwardRef(({ className: n, align: t = "center", sideOffset: e = 4, ...o }, r) => (
+se.displayName = "Input";
+const rn = D.Root, sn = D.Trigger, ie = b.forwardRef(({ className: n, align: t = "center", sideOffset: e = 4, ...o }, r) => (
   // <PopoverPrimitive.Portal>
   /* @__PURE__ */ a(
-    M.Content,
+    D.Content,
     {
       ref: r,
       align: t,
       sideOffset: e,
-      className: d(
+      className: i(
         "bn-z-50 bn-w-72 bn-rounded-md bn-border bn-bg-popover bn-p-4 bn-text-popover-foreground bn-shadow-md bn-outline-none data-[state=open]:bn-animate-in data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=open]:bn-fade-in-0 data-[state=closed]:bn-zoom-out-95 data-[state=open]:bn-zoom-in-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
         n
       ),
@@ -395,12 +395,12 @@ const tn = M.Root, on = M.Trigger, se = c.forwardRef(({ className: n, align: t =
     }
   )
 ));
-se.displayName = M.Content.displayName;
-const an = x.Root, rn = x.Value, ie = c.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
+ie.displayName = D.Content.displayName;
+const ln = x.Root, dn = x.Value, le = b.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
   x.Trigger,
   {
     ref: o,
-    className: d(
+    className: i(
       "bn-flex bn-h-10 bn-w-full bn-items-center bn-justify-between bn-rounded-md bn-border bn-border-input bn-bg-background bn-px-3 bn-py-2 bn-text-sm bn-ring-offset-background placeholder:bn-text-muted-foreground focus:bn-outline-none focus:bn-ring-2 focus:bn-ring-ring focus:bn-ring-offset-2 disabled:bn-cursor-not-allowed disabled:bn-opacity-50 [&>span]:bn-line-clamp-1",
       n
     ),
@@ -411,25 +411,25 @@ const an = x.Root, rn = x.Value, ie = c.forwardRef(({ className: n, children: t,
     ]
   }
 ));
-ie.displayName = x.Trigger.displayName;
-const de = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+le.displayName = x.Trigger.displayName;
+const de = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   x.ScrollUpButton,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-flex bn-cursor-default bn-items-center bn-justify-center bn-py-1",
       n
     ),
     ...t,
-    children: /* @__PURE__ */ a(ze, { className: "bn-h-4 bn-w-4" })
+    children: /* @__PURE__ */ a(Ae, { className: "bn-h-4 bn-w-4" })
   }
 ));
 de.displayName = x.ScrollUpButton.displayName;
-const le = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+const be = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   x.ScrollDownButton,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-flex bn-cursor-default bn-items-center bn-justify-center bn-py-1",
       n
     ),
@@ -437,14 +437,14 @@ const le = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
     children: /* @__PURE__ */ a(U, { className: "bn-h-4 bn-w-4" })
   }
 ));
-le.displayName = x.ScrollDownButton.displayName;
-const be = c.forwardRef(({ className: n, children: t, position: e = "popper", ...o }, r) => (
+be.displayName = x.ScrollDownButton.displayName;
+const ce = b.forwardRef(({ className: n, children: t, position: e = "popper", ...o }, r) => (
   // <SelectPrimitive.Portal>
   /* @__PURE__ */ g(
     x.Content,
     {
       ref: r,
-      className: d(
+      className: i(
         "bn-relative bn-z-50 bn-max-h-96 bn-min-w-[8rem] bn-overflow-hidden bn-rounded-md bn-border bn-bg-popover bn-text-popover-foreground bn-shadow-md data-[state=open]:bn-animate-in data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=open]:bn-fade-in-0 data-[state=closed]:bn-zoom-out-95 data-[state=open]:bn-zoom-in-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
         e === "popper" && "data-[side=bottom]:bn-translate-y-1 data-[side=left]:bn--translate-x-1 data-[side=right]:bn-translate-x-1 data-[side=top]:bn--translate-y-1",
         n
@@ -456,36 +456,36 @@ const be = c.forwardRef(({ className: n, children: t, position: e = "popper", ..
         /* @__PURE__ */ a(
           x.Viewport,
           {
-            className: d(
+            className: i(
               "bn-p-1",
               e === "popper" && "bn-h-[var(--radix-select-trigger-height)] bn-w-full bn-min-w-[var(--radix-select-trigger-width)]"
             ),
             children: t
           }
         ),
-        /* @__PURE__ */ a(le, {})
+        /* @__PURE__ */ a(be, {})
       ]
     }
   )
 ));
-be.displayName = x.Content.displayName;
-const sn = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+ce.displayName = x.Content.displayName;
+const bn = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   x.Label,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-py-1.5 bn-pl-8 bn-pr-2 bn-text-sm bn-font-semibold",
       n
     ),
     ...t
   }
 ));
-sn.displayName = x.Label.displayName;
-const ce = c.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
+bn.displayName = x.Label.displayName;
+const me = b.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__ */ g(
   x.Item,
   {
     ref: o,
-    className: d(
+    className: i(
       "bn-relative bn-flex bn-w-full bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-py-1.5 bn-pl-8 bn-pr-2 bn-text-sm bn-outline-none focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
       n
     ),
@@ -496,65 +496,65 @@ const ce = c.forwardRef(({ className: n, children: t, ...e }, o) => /* @__PURE__
     ]
   }
 ));
-ce.displayName = x.Item.displayName;
-const dn = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+me.displayName = x.Item.displayName;
+const cn = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   x.Separator,
   {
     ref: e,
-    className: d("bn--mx-1 bn-my-1 bn-h-px bn-bg-muted", n),
+    className: i("bn--mx-1 bn-my-1 bn-h-px bn-bg-muted", n),
     ...t
   }
 ));
-dn.displayName = x.Separator.displayName;
-function ln({
+cn.displayName = x.Separator.displayName;
+function mn({
   className: n,
   ...t
 }) {
   return /* @__PURE__ */ a(
     "div",
     {
-      className: d("animate-pulse rounded-md bg-primary/10", n),
+      className: i("bg-primary/10 animate-pulse rounded-md", n),
       ...t
     }
   );
 }
-const bn = y.Root, me = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+const un = y.Root, ue = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   y.List,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-inline-flex bn-h-10 bn-items-center bn-justify-center bn-rounded-md bn-bg-muted bn-p-1 bn-text-muted-foreground",
       n
     ),
     ...t
   }
 ));
-me.displayName = y.List.displayName;
-const ue = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+ue.displayName = y.List.displayName;
+const pe = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   y.Trigger,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-inline-flex bn-items-center bn-justify-center bn-whitespace-nowrap bn-rounded-sm bn-px-3 bn-py-1.5 bn-text-sm bn-font-medium bn-ring-offset-background bn-transition-all focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2 disabled:bn-pointer-events-none disabled:bn-opacity-50 data-[state=active]:bn-bg-background data-[state=active]:bn-text-foreground data-[state=active]:bn-shadow-sm",
       n
     ),
     ...t
   }
 ));
-ue.displayName = y.Trigger.displayName;
-const pe = c.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
+pe.displayName = y.Trigger.displayName;
+const fe = b.forwardRef(({ className: n, ...t }, e) => /* @__PURE__ */ a(
   y.Content,
   {
     ref: e,
-    className: d(
+    className: i(
       "bn-mt-2 bn-ring-offset-background focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2",
       n
     ),
     ...t
   }
 ));
-pe.displayName = y.Content.displayName;
-const cn = I(
+fe.displayName = y.Content.displayName;
+const pn = I(
   "bn-inline-flex bn-items-center bn-justify-center bn-rounded-md bn-text-sm bn-font-medium bn-ring-offset-background bn-transition-colors hover:bn-bg-muted hover:bn-text-muted-foreground focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2 disabled:bn-pointer-events-none disabled:bn-opacity-50 data-[state=on]:bn-bg-accent data-[state=on]:bn-text-accent-foreground",
   {
     variants: {
@@ -573,152 +573,160 @@ const cn = I(
       size: "default"
     }
   }
-), fe = c.forwardRef(({ className: n, variant: t, size: e, ...o }, r) => /* @__PURE__ */ a(
+), ge = b.forwardRef(({ className: n, variant: t, size: e, ...o }, r) => /* @__PURE__ */ a(
   O.Root,
   {
     ref: r,
-    className: d(cn({ variant: t, size: e, className: n })),
+    className: i(pn({ variant: t, size: e, className: n })),
     ...o
   }
 ));
-fe.displayName = O.Root.displayName;
-const mn = T.Provider, un = T.Root, pn = T.Trigger, ge = c.forwardRef(({ className: n, sideOffset: t = 4, ...e }, o) => /* @__PURE__ */ a(
+ge.displayName = O.Root.displayName;
+const fn = T.Provider, gn = T.Root, hn = T.Trigger, he = b.forwardRef(({ className: n, sideOffset: t = 4, ...e }, o) => /* @__PURE__ */ a(
   T.Content,
   {
     ref: o,
     sideOffset: t,
-    className: d(
+    className: i(
       "bn-z-50 bn-overflow-hidden bn-rounded-md bn-border bn-bg-popover bn-px-3 bn-py-1.5 bn-text-sm bn-text-popover-foreground bn-shadow-md bn-animate-in bn-fade-in-0 bn-zoom-in-95 data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=closed]:bn-zoom-out-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
       n
     ),
     ...e
   }
 ));
-ge.displayName = T.Content.displayName;
-const fn = {
+he.displayName = T.Content.displayName;
+const vn = {
   Avatar: {
-    Avatar: q,
+    Avatar: K,
     AvatarFallback: W,
-    AvatarImage: K
+    AvatarImage: Q
   },
   Badge: {
-    Badge: Ae
+    Badge: qe
   },
   Button: {
-    Button: _
+    Button: Z
   },
   Card: {
-    Card: J,
-    CardContent: Q
+    Card: _,
+    CardContent: J
   },
   DropdownMenu: {
-    DropdownMenu: Oe,
-    DropdownMenuCheckboxItem: ne,
-    DropdownMenuContent: Z,
-    DropdownMenuItem: ee,
-    DropdownMenuLabel: te,
-    DropdownMenuSeparator: oe,
-    DropdownMenuSub: Ke,
+    DropdownMenu: Qe,
+    DropdownMenuCheckboxItem: te,
+    DropdownMenuContent: ee,
+    DropdownMenuItem: ne,
+    DropdownMenuLabel: oe,
+    DropdownMenuSeparator: ae,
+    DropdownMenuSub: Ze,
     DropdownMenuSubContent: Y,
     DropdownMenuSubTrigger: X,
-    DropdownMenuTrigger: qe
+    DropdownMenuTrigger: We
   },
   Form: {
-    Form: Je
+    Form: Xe
   },
   Input: {
-    Input: re
+    Input: se
   },
   Label: {
     Label: P
   },
   Popover: {
-    Popover: tn,
-    PopoverContent: se,
-    PopoverTrigger: on
+    Popover: rn,
+    PopoverContent: ie,
+    PopoverTrigger: sn
   },
   Select: {
-    Select: an,
-    SelectContent: be,
-    SelectItem: ce,
-    SelectTrigger: ie,
-    SelectValue: rn
+    Select: ln,
+    SelectContent: ce,
+    SelectItem: me,
+    SelectTrigger: le,
+    SelectValue: dn
   },
   Skeleton: {
-    Skeleton: ln
+    Skeleton: mn
   },
   Tabs: {
-    Tabs: bn,
-    TabsContent: pe,
-    TabsList: me,
-    TabsTrigger: ue
+    Tabs: un,
+    TabsContent: fe,
+    TabsList: ue,
+    TabsTrigger: pe
   },
   Toggle: {
-    Toggle: fe
+    Toggle: ge
   },
   Tooltip: {
-    Tooltip: un,
-    TooltipContent: ge,
-    TooltipProvider: mn,
-    TooltipTrigger: pn
+    Tooltip: gn,
+    TooltipContent: he,
+    TooltipProvider: fn,
+    TooltipTrigger: hn
   }
-}, he = Ie(void 0);
+}, ve = Re(void 0);
 function h() {
-  return Me(he);
+  return ke(ve);
 }
-const gn = (n) => {
+const Nn = (n) => {
   const { children: t, ...e } = n;
   m(e);
-  const o = h(), r = Fe();
+  const o = h(), r = Le();
   return /* @__PURE__ */ a(o.Form.Form, { ...r, children: t });
-}, hn = p((n, t) => {
+}, xn = p((n, t) => {
   const {
     className: e,
     name: o,
     label: r,
-    icon: s,
+    variant: s,
+    icon: l,
     // TODO: implement
-    value: i,
-    autoFocus: u,
-    placeholder: b,
-    onKeyDown: l,
-    onChange: f,
-    onSubmit: v,
-    ...w
+    value: u,
+    autoFocus: c,
+    placeholder: d,
+    disabled: f,
+    onKeyDown: v,
+    onChange: w,
+    onSubmit: C,
+    autoComplete: M,
+    rightSection: Ne,
+    // TODO: add rightSection
+    ...xe
   } = n;
-  m(w);
-  const C = h();
-  return r ? /* @__PURE__ */ g("div", { children: [
-    /* @__PURE__ */ a(C.Label.Label, { htmlFor: r, children: r }),
-    /* @__PURE__ */ a(
-      C.Input.Input,
-      {
-        className: e,
-        id: r,
-        name: o,
-        autoFocus: u,
-        placeholder: b,
-        value: i,
-        onKeyDown: l,
-        onChange: f,
-        onSubmit: v
-      }
-    )
-  ] }) : /* @__PURE__ */ a(
-    C.Input.Input,
+  m(xe);
+  const L = h();
+  return /* @__PURE__ */ g(
+    "div",
     {
-      "aria-label": o,
-      name: o,
-      autoFocus: u,
-      placeholder: b,
-      value: i,
-      onKeyDown: l,
-      onChange: f,
-      onSubmit: v,
-      ref: t
+      className: i(
+        e,
+        "bn-flex bn-h-10 bn-w-full bn-rounded-md bn-border bn-border-input bn-bg-background bn-px-3 bn-py-2 bn-text-sm bn-ring-offset-background file:bn-border-0 file:bn-bg-transparent file:bn-text-sm file:bn-font-medium placeholder:bn-text-muted-foreground focus-visible:bn-outline-none focus-visible:bn-ring-2 focus-visible:bn-ring-ring focus-visible:bn-ring-offset-2 disabled:bn-cursor-not-allowed disabled:bn-opacity-50",
+        "bn-items-center bn-gap-2 bn-text-foreground"
+      ),
+      children: [
+        l,
+        /* @__PURE__ */ g("div", { className: "bn-flex-1", children: [
+          r && /* @__PURE__ */ a(L.Label.Label, { htmlFor: r, children: r }),
+          /* @__PURE__ */ a(
+            L.Input.Input,
+            {
+              className: i(e, "bn-border-none bn-p-0 bn-h-auto"),
+              id: r,
+              name: o,
+              autoFocus: c,
+              placeholder: d,
+              disabled: f,
+              value: u,
+              onKeyDown: v,
+              onChange: w,
+              onSubmit: C,
+              ref: t
+            }
+          )
+        ] }),
+        Ne
+      ]
     }
   );
-}), vn = (n) => p(
+}), wn = (n) => p(
   (t, e) => /* @__PURE__ */ a(
     n,
     {
@@ -733,7 +741,7 @@ const gn = (n) => {
       ref: e
     }
   )
-), Nn = (n) => {
+), Cn = (n) => {
   const {
     children: t,
     onOpenChange: e,
@@ -743,85 +751,85 @@ const gn = (n) => {
     ...s
   } = n;
   m(s);
-  const i = h();
+  const l = h();
   return r ? /* @__PURE__ */ a(
-    i.DropdownMenu.DropdownMenuSub,
+    l.DropdownMenu.DropdownMenuSub,
     {
       onOpenChange: e,
       children: t
     }
   ) : /* @__PURE__ */ a(
-    i.DropdownMenu.DropdownMenu,
+    l.DropdownMenu.DropdownMenu,
     {
       modal: !1,
       onOpenChange: e,
       children: t
     }
   );
-}, xn = (n) => {
+}, yn = (n) => {
   const { children: t, sub: e, ...o } = n;
   m(o);
-  const r = h(), s = E(
-    () => vn(
+  const r = h(), s = V(
+    () => wn(
       r.DropdownMenu.DropdownMenuTrigger
     ),
     [r.DropdownMenu.DropdownMenuTrigger]
   );
   return e ? /* @__PURE__ */ a(r.DropdownMenu.DropdownMenuSubTrigger, { children: t }) : /* @__PURE__ */ a(s, { asChild: !0, ...o, children: t });
-}, wn = p((n, t) => {
+}, Sn = p((n, t) => {
   const { className: e, children: o, sub: r, ...s } = n;
   m(s);
-  const i = h();
+  const l = h();
   return r ? /* @__PURE__ */ a(
-    i.DropdownMenu.DropdownMenuSubContent,
+    l.DropdownMenu.DropdownMenuSubContent,
     {
       className: e,
       ref: t,
       children: o
     }
   ) : /* @__PURE__ */ a(
-    i.DropdownMenu.DropdownMenuContent,
+    l.DropdownMenu.DropdownMenuContent,
     {
       className: e,
       ref: t,
       children: o
     }
   );
-}), Cn = p((n, t) => {
-  const { className: e, children: o, icon: r, checked: s, subTrigger: i, onClick: u, ...b } = n;
-  m(b);
-  const l = h();
-  return i ? /* @__PURE__ */ g(ve, { children: [
+}), Tn = p((n, t) => {
+  const { className: e, children: o, icon: r, checked: s, subTrigger: l, onClick: u, ...c } = n;
+  m(c);
+  const d = h();
+  return l ? /* @__PURE__ */ g(we, { children: [
     r,
     o
   ] }) : s !== void 0 ? /* @__PURE__ */ g(
-    l.DropdownMenu.DropdownMenuCheckboxItem,
+    d.DropdownMenu.DropdownMenuCheckboxItem,
     {
-      className: d(e, "bn-gap-1", s ? "" : "bn-px-2"),
+      className: i(e, "bn-gap-1", s ? "" : "bn-px-2"),
       ref: t,
       checked: s,
       onClick: u,
-      ...b,
+      ...c,
       children: [
         r,
         o
       ]
     }
   ) : /* @__PURE__ */ g(
-    l.DropdownMenu.DropdownMenuItem,
+    d.DropdownMenu.DropdownMenuItem,
     {
       className: e,
       ref: t,
       onClick: u,
-      ...b,
+      ...c,
       children: [
         r,
         o,
-        i && /* @__PURE__ */ a(j, { className: "bn-ml-auto bn-h-4 bn-w-4" })
+        l && /* @__PURE__ */ a(q, { className: "bn-ml-auto bn-h-4 bn-w-4" })
       ]
     }
   );
-}), yn = p((n, t) => {
+}), Mn = p((n, t) => {
   const { className: e, ...o } = n;
   m(o);
   const r = h();
@@ -832,7 +840,7 @@ const gn = (n) => {
       ref: t
     }
   );
-}), Sn = p((n, t) => {
+}), In = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   m(r);
   const s = h();
@@ -844,16 +852,16 @@ const gn = (n) => {
       children: o
     }
   );
-}), Tn = p((n, t) => {
+}), Dn = p((n, t) => {
   const {
     className: e,
     children: o,
     icon: r,
     onClick: s,
-    onDragEnd: i,
+    onDragEnd: l,
     onDragStart: u,
-    draggable: b,
-    label: l,
+    draggable: c,
+    label: d,
     ...f
   } = n;
   m(f, !1);
@@ -862,13 +870,13 @@ const gn = (n) => {
     v.Button.Button,
     {
       variant: "ghost",
-      className: d(e, "bn-text-gray-400"),
+      className: i(e, "bn-text-gray-400"),
       ref: t,
-      "aria-label": l,
+      "aria-label": d,
       onClick: s,
       onDragStart: u,
-      onDragEnd: i,
-      draggable: b,
+      onDragEnd: l,
+      draggable: c,
       ...f,
       children: [
         r,
@@ -876,39 +884,39 @@ const gn = (n) => {
       ]
     }
   );
-}), In = p((n, t) => {
+}), Rn = p((n, t) => {
   const {
     className: e,
     tabs: o,
     defaultOpenTab: r,
     openTab: s,
-    setOpenTab: i,
+    setOpenTab: l,
     loading: u,
     // TODO: implement loader
-    ...b
+    ...c
   } = n;
-  m(b);
-  const l = h();
+  m(c);
+  const d = h();
   return /* @__PURE__ */ g(
-    l.Tabs.Tabs,
+    d.Tabs.Tabs,
     {
-      className: d(e, "bn-bg-popover bn-p-2 bn-rounded-lg"),
+      className: i(e, "bn-bg-popover bn-p-2 bn-rounded-lg"),
       ref: t,
       value: s,
       defaultValue: r,
-      onValueChange: i,
+      onValueChange: l,
       children: [
-        /* @__PURE__ */ a(l.Tabs.TabsList, { children: o.map((f) => /* @__PURE__ */ a(l.Tabs.TabsTrigger, { value: f.name, children: f.name }, f.name)) }),
-        o.map((f) => /* @__PURE__ */ a(l.Tabs.TabsContent, { value: f.name, children: /* @__PURE__ */ a(l.Card.Card, { children: /* @__PURE__ */ a(l.Card.CardContent, { className: "bn-p-4", children: f.tabPanel }) }) }, f.name))
+        /* @__PURE__ */ a(d.Tabs.TabsList, { children: o.map((f) => /* @__PURE__ */ a(d.Tabs.TabsTrigger, { value: f.name, children: f.name }, f.name)) }),
+        o.map((f) => /* @__PURE__ */ a(d.Tabs.TabsContent, { value: f.name, children: /* @__PURE__ */ a(d.Card.Card, { children: /* @__PURE__ */ a(d.Card.CardContent, { className: "bn-p-4", children: f.tabPanel }) }) }, f.name))
       ]
     }
   );
-}), Mn = p((n, t) => {
+}), kn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   return m(r), /* @__PURE__ */ a(
     "div",
     {
-      className: d(
+      className: i(
         e,
         "bn-flex bn-flex-col bn-gap-2 bn-items-start bn-justify-center"
       ),
@@ -916,23 +924,23 @@ const gn = (n) => {
       children: o
     }
   );
-}), Dn = p((n, t) => {
-  const { className: e, value: o, placeholder: r, onKeyDown: s, onChange: i, ...u } = n;
+}), Bn = p((n, t) => {
+  const { className: e, value: o, placeholder: r, onKeyDown: s, onChange: l, ...u } = n;
   m(u);
-  const b = h();
+  const c = h();
   return /* @__PURE__ */ a(
-    b.Input.Input,
+    c.Input.Input,
     {
       "data-test": "embed-input",
-      className: d(e, "bn-w-80"),
+      className: i(e, "bn-w-80"),
       ref: t,
       value: o,
       placeholder: r,
       onKeyDown: s,
-      onChange: i
+      onChange: l
     }
   );
-}), Rn = (n) => {
+}), Fn = (n) => {
   const {
     children: t,
     opened: e,
@@ -943,22 +951,22 @@ const gn = (n) => {
   m(r);
   const s = h();
   return /* @__PURE__ */ a(s.Popover.Popover, { open: e, children: t });
-}, Bn = p(
+}, Pn = p(
   (n, t) => {
     const { children: e, ...o } = n;
     m(o);
     const r = h();
     return /* @__PURE__ */ a(r.Popover.PopoverTrigger, { ref: t, asChild: !0, children: e });
   }
-), Fn = p((n, t) => {
+), Ln = p((n, t) => {
   const { className: e, variant: o, children: r, ...s } = n;
   m(s);
-  const i = h();
+  const l = h();
   return /* @__PURE__ */ a(
-    i.Popover.PopoverContent,
+    l.Popover.PopoverContent,
     {
       sideOffset: 8,
-      className: d(
+      className: i(
         e,
         "bn-flex bn-flex-col bn-gap-2",
         o === "panel-popover" ? "bn-p-0 bn-border-none bn-shadow-none bn-max-w-none bn-w-fit" : ""
@@ -967,19 +975,19 @@ const gn = (n) => {
       children: r
     }
   );
-}), kn = p((n, t) => {
+}), zn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   return m(r, !1), /* @__PURE__ */ a("div", { className: e, ref: t, ...r, children: o });
-}), Pn = p((n, t) => {
+}), En = p((n, t) => {
   const {
     className: e,
     children: o,
     icon: r,
     onClick: s,
-    onDragEnd: i,
+    onDragEnd: l,
     onDragStart: u,
-    draggable: b,
-    label: l,
+    draggable: c,
+    label: d,
     ...f
   } = n;
   m(f, !1);
@@ -988,13 +996,13 @@ const gn = (n) => {
     v.Button.Button,
     {
       variant: "ghost",
-      className: d(e, "bn-text-gray-400"),
+      className: i(e, "bn-text-gray-400"),
       ref: t,
-      "aria-label": l,
+      "aria-label": d,
       onClick: s,
       onDragStart: u,
-      onDragEnd: i,
-      draggable: b,
+      onDragEnd: l,
+      draggable: c,
       ...f,
       children: [
         r,
@@ -1002,9 +1010,9 @@ const gn = (n) => {
       ]
     }
   );
-}), Ln = p((n, t) => {
-  const { className: e, children: o, id: r, columns: s, ...i } = n;
-  return m(i), /* @__PURE__ */ a(
+}), Vn = p((n, t) => {
+  const { className: e, children: o, id: r, columns: s, ...l } = n;
+  return m(l), /* @__PURE__ */ a(
     "div",
     {
       className: e,
@@ -1015,7 +1023,7 @@ const gn = (n) => {
       children: o
     }
   );
-}), zn = p((n, t) => {
+}), An = p((n, t) => {
   const { className: e, children: o, columns: r, ...s } = n;
   return m(s), /* @__PURE__ */ a(
     "div",
@@ -1026,14 +1034,14 @@ const gn = (n) => {
       children: o
     }
   );
-}), En = p((n, t) => {
+}), $n = p((n, t) => {
   const { className: e, children: o, id: r, ...s } = n;
   return m(s), /* @__PURE__ */ a(
     "div",
     {
       id: r,
       role: "listbox",
-      className: d(
+      className: i(
         "bn-z-50 bn-min-w-[8rem] bn-overflow-auto bn-rounded-md bn-border bn-bg-popover bn-p-1 bn-text-popover-foreground bn-shadow-md data-[state=open]:bn-animate-in data-[state=closed]:bn-animate-out data-[state=closed]:bn-fade-out-0 data-[state=open]:bn-fade-in-0 data-[state=closed]:bn-zoom-out-95 data-[state=open]:bn-zoom-in-95 data-[side=bottom]:bn-slide-in-from-top-2 data-[side=left]:bn-slide-in-from-right-2 data-[side=right]:bn-slide-in-from-left-2 data-[side=top]:bn-slide-in-from-bottom-2",
         e
       ),
@@ -1041,12 +1049,12 @@ const gn = (n) => {
       children: o
     }
   );
-}), Vn = p((n, t) => {
+}), jn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   return m(r), /* @__PURE__ */ a(
     "div",
     {
-      className: d(
+      className: i(
         "bn-relative bn-flex bn-cursor-default bn-select-none bn-items-center bn-rounded-sm bn-px-2 bn-py-1.5 bn-text-sm bn-outline-none bn-transition-colors focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
         e
       ),
@@ -1054,62 +1062,106 @@ const gn = (n) => {
       children: /* @__PURE__ */ a("div", { children: o })
     }
   );
-}), An = p((n, t) => {
-  const e = h(), { className: o, item: r, isSelected: s, onClick: i, id: u, ...b } = n;
-  m(b);
-  const l = V(null);
-  return A(() => {
-    if (!l.current || !s)
+}), qn = p((n, t) => {
+  const e = h(), { className: o, item: r, isSelected: s, onClick: l, id: u, ...c } = n;
+  m(c);
+  const d = A(null);
+  return $(() => {
+    if (!d.current || !s)
       return;
-    const f = L(
-      l.current,
-      document.querySelector(".bn-suggestion-menu")
+    const f = z(
+      d.current,
+      document.querySelector(".bn-suggestion-menu, #ai-suggestion-menu")
+      // TODO
     );
-    f === "top" ? l.current.scrollIntoView(!0) : f === "bottom" && l.current.scrollIntoView(!1);
+    f === "top" ? d.current.scrollIntoView(!0) : f === "bottom" && d.current.scrollIntoView(!1);
   }, [s]), /* @__PURE__ */ g(
     "div",
     {
-      className: d(
+      className: i(
         "bn-relative bn-flex bn-cursor-pointer bn-select-none bn-items-center bn-rounded-sm bn-px-2 bn-py-1.5 bn-text-sm bn-outline-none bn-transition-colors focus:bn-bg-accent focus:bn-text-accent-foreground data-[disabled]:bn-pointer-events-none data-[disabled]:bn-opacity-50",
+        n.item.size === "small" ? "bn-gap-3 bn-py-1" : "",
         o
       ),
-      ref: z([t, l]),
+      ref: E([t, d]),
       id: u,
-      onClick: i,
+      onMouseDown: (f) => f.preventDefault(),
+      onClick: l,
       role: "option",
       "aria-selected": s || void 0,
       children: [
-        r.icon && /* @__PURE__ */ a("div", { className: "bn-p-3", "data-position": "left", children: r.icon }),
+        r.icon && /* @__PURE__ */ a(
+          "div",
+          {
+            className: i(
+              "bn-p-3",
+              n.item.size === "small" ? "bn-p-0" : "",
+              o
+            ),
+            "data-position": "left",
+            children: r.icon
+          }
+        ),
         /* @__PURE__ */ g("div", { className: "bn-flex-1", children: [
-          /* @__PURE__ */ a("div", { className: "bn-text-base", children: r.title }),
-          /* @__PURE__ */ a("div", { className: "bn-text-xs", children: r.subtext })
+          /* @__PURE__ */ a(
+            "div",
+            {
+              className: i(
+                "bn-text-base",
+                n.item.size === "small" ? "bn-text-sm" : "",
+                o
+              ),
+              children: r.title
+            }
+          ),
+          /* @__PURE__ */ a(
+            "div",
+            {
+              className: i(
+                "bn-text-xs",
+                n.item.size === "small" ? "bn-hidden" : "",
+                o
+              ),
+              children: r.subtext
+            }
+          )
         ] }),
         r.badge && /* @__PURE__ */ a("div", { "data-position": "right", className: "bn-text-xs", children: /* @__PURE__ */ a(e.Badge.Badge, { variant: "secondary", children: r.badge }) })
       ]
     }
   );
-}), $n = p((n, t) => {
+}), Gn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   return m(r), /* @__PURE__ */ a(
     "div",
     {
-      className: d("bn-px-2 bn-py-1.5 bn-text-sm bn-font-semibold", e),
+      className: i("bn-px-2 bn-py-1.5 bn-text-sm bn-font-semibold", e),
       ref: t,
       children: o
     }
   );
-}), jn = p((n, t) => {
-  const { className: e, children: o, ...r } = n;
-  return m(r), /* @__PURE__ */ a("div", { className: e, ref: t, children: o });
-}), Gn = p((n, t) => {
-  const { className: e, children: o, onMouseDown: r, onClick: s, ...i } = n;
-  m(i, !1);
+}), Un = p((n, t) => {
+  const { className: e, ...o } = n;
+  return m(o), /* @__PURE__ */ a("div", { className: i(e, "bn-animate-spin"), ref: t, children: /* @__PURE__ */ a(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      height: "1em",
+      viewBox: "0 -960 960 960",
+      width: "1em",
+      fill: "#e8eaed",
+      children: /* @__PURE__ */ a("path", { d: "M480-80q-82 0-155-31.5t-127.5-86Q143-252 111.5-325T80-480q0-83 31.5-155.5t86-127Q252-817 325-848.5T480-880q17 0 28.5 11.5T520-840q0 17-11.5 28.5T480-800q-133 0-226.5 93.5T160-480q0 133 93.5 226.5T480-160q133 0 226.5-93.5T800-480q0-17 11.5-28.5T840-520q17 0 28.5 11.5T880-480q0 82-31.5 155t-86 127.5q-54.5 54.5-127 86T480-80Z" })
+    }
+  ) });
+}), Hn = p((n, t) => {
+  const { className: e, children: o, onMouseDown: r, onClick: s, ...l } = n;
+  m(l, !1);
   const u = h();
   return /* @__PURE__ */ a(
     u.Button.Button,
     {
       variant: "ghost",
-      className: d(
+      className: i(
         e,
         "bn-p-0 bn-h-full bn-w-full bn-text-gray-400",
         e != null && e.includes("bn-extend-button-add-remove-columns") ? "bn-ml-1" : "bn-mt-1",
@@ -1118,57 +1170,57 @@ const gn = (n) => {
       ref: t,
       onClick: s,
       onMouseDown: r,
-      ...i,
+      ...l,
       children: o
     }
   );
-}), Un = p((n, t) => {
+}), On = p((n, t) => {
   const {
     className: e,
     children: o,
     draggable: r,
     onDragStart: s,
-    onDragEnd: i,
+    onDragEnd: l,
     style: u,
-    label: b,
-    ...l
+    label: c,
+    ...d
   } = n;
-  m(l, !1);
+  m(d, !1);
   const f = h();
   return /* @__PURE__ */ a(
     f.Button.Button,
     {
       variant: "ghost",
-      className: d(e, "bn-p-0 bn-h-fit bn-w-fit bn-text-gray-400"),
+      className: i(e, "bn-p-0 bn-h-fit bn-w-fit bn-text-gray-400"),
       ref: t,
-      "aria-label": b,
+      "aria-label": c,
       draggable: r,
       onDragStart: s,
-      onDragEnd: i,
+      onDragEnd: l,
       style: u,
-      ...l,
+      ...d,
       children: o
     }
   );
-}), B = p(
+}), k = p(
   (n, t) => {
     const {
       className: e,
       children: o,
       onMouseEnter: r,
       onMouseLeave: s,
-      variant: i,
+      variant: l,
       ...u
     } = n;
     m(u);
-    const b = h();
-    return /* @__PURE__ */ a(b.Tooltip.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ a(
+    const c = h();
+    return /* @__PURE__ */ a(c.Tooltip.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ a(
       "div",
       {
-        className: d(
+        className: i(
           e,
           "bn-flex bn-gap-1 bn-p-1 bn-bg-popover bn-text-popover-foreground bn-border bn-rounded-lg bn-shadow-md bn-h-fit",
-          i === "action-toolbar" ? "bn-w-fit" : ""
+          l === "action-toolbar" ? "bn-w-fit" : ""
         ),
         ref: t,
         onMouseEnter: r,
@@ -1177,66 +1229,66 @@ const gn = (n) => {
       }
     ) });
   }
-), F = p(
+), B = p(
   (n, t) => {
     const {
       className: e,
       children: o,
       mainTooltip: r,
       secondaryTooltip: s,
-      icon: i,
+      icon: l,
       isSelected: u,
-      isDisabled: b,
-      onClick: l,
+      isDisabled: c,
+      onClick: d,
       label: f,
       variant: v,
       ...w
     } = n;
     m(w, !1);
-    const C = h(), R = u === void 0 ? /* @__PURE__ */ g(
+    const C = h(), M = u === void 0 ? /* @__PURE__ */ g(
       C.Button.Button,
       {
-        className: d(
+        className: i(
           e,
           v === "compact" ? "bn-h-6 bn-min-w-6 bn-p-0" : ""
         ),
         variant: "ghost",
         size: v === "compact" ? "sm" : "default",
-        disabled: b,
-        onClick: l,
+        disabled: c,
+        onClick: d,
         ref: t,
         "aria-label": f,
         ...w,
         children: [
-          i,
+          l,
           o
         ]
       }
     ) : /* @__PURE__ */ g(
       C.Toggle.Toggle,
       {
-        className: d(
+        className: i(
           e,
           "data-[state=open]:bg-accent data-[state=closed]:text-accent-foreground",
           v === "compact" ? "bn-h-6 bn-min-w-6 bn-p-0" : ""
         ),
         size: v === "compact" ? "sm" : "default",
         "aria-label": f,
-        onClick: l,
+        onClick: d,
         pressed: u,
-        disabled: b,
+        disabled: c,
         "data-state": u ? "on" : "off",
-        "data-disabled": b,
+        "data-disabled": c,
         ref: t,
         ...w,
         children: [
-          i,
+          l,
           o
         ]
       }
     );
     return /* @__PURE__ */ g(C.Tooltip.Tooltip, { children: [
-      /* @__PURE__ */ a(C.Tooltip.TooltipTrigger, { asChild: !0, children: R }),
+      /* @__PURE__ */ a(C.Tooltip.TooltipTrigger, { asChild: !0, children: M }),
       /* @__PURE__ */ g(
         C.Tooltip.TooltipContent,
         {
@@ -1249,60 +1301,60 @@ const gn = (n) => {
       )
     ] });
   }
-), k = p((n, t) => {
+), F = p((n, t) => {
   const { className: e, items: o, isDisabled: r, ...s } = n;
   m(s);
-  const i = h(), u = (l) => /* @__PURE__ */ g("div", { className: "bn-flex bn-gap-1 bn-items-center", children: [
-    l.icon,
-    l.text
-  ] }), b = o.filter((l) => l.isSelected)[0];
-  return b ? /* @__PURE__ */ g(
-    i.Select.Select,
+  const l = h(), u = (d) => /* @__PURE__ */ g("div", { className: "bn-flex bn-gap-1 bn-items-center", children: [
+    d.icon,
+    d.text
+  ] }), c = o.filter((d) => d.isSelected)[0];
+  return c ? /* @__PURE__ */ g(
+    l.Select.Select,
     {
-      value: b.text,
-      onValueChange: (l) => {
+      value: c.text,
+      onValueChange: (d) => {
         var f, v;
-        return (v = (f = o.find((w) => w.text === l)).onClick) == null ? void 0 : v.call(f);
+        return (v = (f = o.find((w) => w.text === d)).onClick) == null ? void 0 : v.call(f);
       },
       disabled: r,
       children: [
-        /* @__PURE__ */ a(i.Select.SelectTrigger, { className: "bn-border-none", children: /* @__PURE__ */ a(i.Select.SelectValue, {}) }),
-        /* @__PURE__ */ a(i.Select.SelectContent, { className: e, ref: t, children: o.map((l) => /* @__PURE__ */ a(
-          i.Select.SelectItem,
+        /* @__PURE__ */ a(l.Select.SelectTrigger, { className: "bn-border-none", children: /* @__PURE__ */ a(l.Select.SelectValue, {}) }),
+        /* @__PURE__ */ a(l.Select.SelectContent, { className: e, ref: t, children: o.map((d) => /* @__PURE__ */ a(
+          l.Select.SelectItem,
           {
-            disabled: l.isDisabled,
-            value: l.text,
-            children: /* @__PURE__ */ a(u, { ...l })
+            disabled: d.isDisabled,
+            value: d.text,
+            children: /* @__PURE__ */ a(u, { ...d })
           },
-          l.text
+          d.text
         )) })
       ]
     }
   ) : null;
-}), Hn = p((n, t) => {
+}), Kn = p((n, t) => {
   const {
     className: e,
     children: o,
     selected: r,
     headerText: s,
-    onFocus: i,
+    onFocus: l,
     onBlur: u,
-    tabIndex: b,
-    ...l
+    tabIndex: c,
+    ...d
   } = n;
-  m(l);
+  m(d);
   const f = h();
   return /* @__PURE__ */ g(
     f.Card.Card,
     {
-      className: d(
+      className: i(
         e,
         "bn-w-[300px]",
         r ? "bn-bg-accent bn-text-accent-foreground" : ""
       ),
-      onFocus: i,
+      onFocus: l,
       onBlur: u,
-      tabIndex: b,
+      tabIndex: c,
       ref: t,
       children: [
         s && /* @__PURE__ */ a("div", { className: "bn-px-4 bn-pt-4 bn-italic bn-text-sm", children: s }),
@@ -1310,12 +1362,12 @@ const gn = (n) => {
       ]
     }
   );
-}), On = p((n, t) => {
+}), Qn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   return m(r), /* @__PURE__ */ a(
     "div",
     {
-      className: d(
+      className: i(
         e,
         "bn-p-4",
         e != null && e.includes("bn-thread-comments") ? "bn-flex bn-flex-col bn-gap-6 bn-border-b" : ""
@@ -1324,14 +1376,14 @@ const gn = (n) => {
       children: o
     }
   );
-}), qn = p((n, t) => {
+}), Wn = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   m(r, !1);
   const s = h();
   return /* @__PURE__ */ a(
     s.Button.Button,
     {
-      className: d(
+      className: i(
         e,
         "bn-p-0 bn-w-fit bn-text-foreground bn-bg-transparent hover:bn-bg-transparent"
       ),
@@ -1339,23 +1391,23 @@ const gn = (n) => {
       children: o
     }
   );
-}), Kn = p((n, t) => {
+}), Zn = p((n, t) => {
   const { authorInfo: e, timeString: o, edited: r, ...s } = n;
   m(s, !1);
-  const i = h();
+  const l = h();
   return e === "loading" ? /* @__PURE__ */ g(
     "div",
     {
       className: "bn-flex bn-flex-row bn-flex-nowrap bn-items-center bn-gap-4",
       children: [
         /* @__PURE__ */ a(
-          i.Skeleton.Skeleton,
+          l.Skeleton.Skeleton,
           {
             className: "bn-size-7 bn-rounded-full bn-bg-neutral-400 bn-animate-pulse"
           }
         ),
         /* @__PURE__ */ a(
-          i.Skeleton.Skeleton,
+          l.Skeleton.Skeleton,
           {
             className: "bn-h-3 bn-w-32 bn-rounded-full bn-bg-neutral-400 bn-animate-pulse"
           }
@@ -1367,16 +1419,16 @@ const gn = (n) => {
     {
       className: "bn-flex bn-flex-row bn-flex-nowrap bn-items-center bn-gap-4",
       children: [
-        /* @__PURE__ */ g(i.Avatar.Avatar, { children: [
+        /* @__PURE__ */ g(l.Avatar.Avatar, { children: [
           /* @__PURE__ */ a(
-            i.Avatar.AvatarImage,
+            l.Avatar.AvatarImage,
             {
               src: e.avatarUrl,
               alt: e.username,
               className: "bn-h-7 bn-rounded-full"
             }
           ),
-          /* @__PURE__ */ a(i.Avatar.AvatarFallback, { children: e.username[0] })
+          /* @__PURE__ */ a(l.Avatar.AvatarFallback, { children: e.username[0] })
         ] }),
         /* @__PURE__ */ g(
           "div",
@@ -1395,47 +1447,47 @@ const gn = (n) => {
       ]
     }
   );
-}), Wn = p((n, t) => {
+}), _n = p((n, t) => {
   const {
     className: e,
     showActions: o,
     authorInfo: r,
     timeString: s,
-    actions: i,
+    actions: l,
     edited: u,
-    children: b,
-    ...l
+    children: c,
+    ...d
   } = n;
-  m(l);
-  const [f, v] = De(!1), { focused: w, ref: C } = xe(), R = i && (o === !0 || o === void 0 || o === "hover" && f || w);
+  m(d);
+  const [f, v] = Be(!1), { focused: w, ref: C } = ye(), M = l && (o === !0 || o === void 0 || o === "hover" && f || w);
   return /* @__PURE__ */ g(
     "div",
     {
       ref: t,
-      className: d(e, "bn-relative bn-flex bn-flex-col bn-gap-2"),
+      className: i(e, "bn-relative bn-flex bn-flex-col bn-gap-2"),
       onMouseEnter: () => v(!0),
       onMouseLeave: () => v(!1),
       children: [
-        R ? /* @__PURE__ */ a(
+        M ? /* @__PURE__ */ a(
           "div",
           {
             className: "bn-absolute bn-right-0 bn-top-0 bn-z-10",
             ref: C,
-            children: i
+            children: l
           }
         ) : null,
-        /* @__PURE__ */ a(Kn, { ...n }),
-        b
+        /* @__PURE__ */ a(Zn, { ...n }),
+        c
       ]
     }
   );
-}), _n = p((n, t) => {
-  const { className: e, onFocus: o, onBlur: r, autoFocus: s, editor: i, editable: u, ...b } = n;
-  return m(b), /* @__PURE__ */ a(
-    ot,
+}), Jn = p((n, t) => {
+  const { className: e, onFocus: o, onBlur: r, autoFocus: s, editor: l, editable: u, ...c } = n;
+  return m(c), /* @__PURE__ */ a(
+    st,
     {
       autoFocus: s,
-      className: d(e, ""),
+      className: i(e, ""),
       editor: n.editor,
       sideMenu: !1,
       slashMenu: !1,
@@ -1447,28 +1499,28 @@ const gn = (n) => {
       onFocus: o,
       onBlur: r,
       children: /* @__PURE__ */ a(
-        we,
+        Se,
         {
-          formattingToolbar: Jn
+          formattingToolbar: Xn
         }
       )
     }
   );
-}), Jn = () => {
-  const n = Ce([]).filter(
+}), Xn = () => {
+  const n = Te([]).filter(
     (t) => t.key !== "nestBlockButton" && t.key !== "unnestBlockButton"
   );
-  return /* @__PURE__ */ a(ye, { blockTypeSelectItems: [], children: n });
-}, Qn = p((n, t) => {
+  return /* @__PURE__ */ a(Me, { blockTypeSelectItems: [], children: n });
+}, Yn = p((n, t) => {
   const {
     className: e,
     text: o,
     icon: r,
     isSelected: s,
-    mainTooltip: i,
+    mainTooltip: l,
     secondaryTooltip: u,
-    onClick: b,
-    onMouseEnter: l,
+    onClick: c,
+    onMouseEnter: d,
     ...f
   } = n;
   m(f, !1);
@@ -1476,12 +1528,12 @@ const gn = (n) => {
     v.Button.Button,
     {
       variant: s ? "secondary" : "outline",
-      className: d(
+      className: i(
         e,
         "bn-flex bn-items-center bn-gap-1 bn-rounded-full bn-h-7 bn-px-2.5"
       ),
-      onClick: b,
-      onMouseEnter: l,
+      onClick: c,
+      onMouseEnter: d,
       ref: t,
       children: [
         /* @__PURE__ */ a("span", { children: r }),
@@ -1489,27 +1541,27 @@ const gn = (n) => {
       ]
     }
   );
-  return i ? /* @__PURE__ */ g(v.Tooltip.Tooltip, { children: [
+  return l ? /* @__PURE__ */ g(v.Tooltip.Tooltip, { children: [
     /* @__PURE__ */ a(v.Tooltip.TooltipTrigger, { asChild: !0, children: w }),
     /* @__PURE__ */ g(
       v.Tooltip.TooltipContent,
       {
         className: "bn-flex bn-flex-col bn-items-center bn-whitespace-pre-wrap",
         children: [
-          /* @__PURE__ */ a("span", { children: i }),
+          /* @__PURE__ */ a("span", { children: l }),
           u && /* @__PURE__ */ a("span", { children: u })
         ]
       }
     )
   ] }) : w;
-}), Xn = p((n, t) => {
+}), et = p((n, t) => {
   const { className: e, children: o, ...r } = n;
   m(r);
   const s = h();
   return /* @__PURE__ */ a(s.Tooltip.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ a(
     "div",
     {
-      className: d(
+      className: i(
         e,
         "bn-flex bn-flex-row bn-flex-wrap bn-gap-1 bn-w-full"
       ),
@@ -1517,9 +1569,9 @@ const gn = (n) => {
       children: o
     }
   ) });
-}), Yn = p((n, t) => {
-  const { className: e, children: o, onClick: r, label: s, ...i } = n;
-  m(i);
+}), nt = p((n, t) => {
+  const { className: e, children: o, onClick: r, label: s, ...l } = n;
+  m(l);
   const u = h();
   return /* @__PURE__ */ a(
     u.Button.Button,
@@ -1532,47 +1584,47 @@ const gn = (n) => {
       children: o
     }
   );
-}), Zn = p((n, t) => {
-  const { className: e, accept: o, value: r, placeholder: s, onChange: i, ...u } = n;
+}), tt = p((n, t) => {
+  const { className: e, accept: o, value: r, placeholder: s, onChange: l, ...u } = n;
   m(u);
-  const b = h();
+  const c = h();
   return /* @__PURE__ */ a(
-    b.Input.Input,
+    c.Input.Input,
     {
       type: "file",
       className: e,
       ref: t,
       accept: o,
       value: r ? r.name : void 0,
-      onChange: async (l) => i == null ? void 0 : i(l.target.files[0]),
+      onChange: async (d) => l == null ? void 0 : l(d.target.files[0]),
       placeholder: s
     }
   );
-}), et = p((n, t) => {
-  const { className: e, isSelected: o, onClick: r, item: s, id: i, ...u } = n;
+}), ot = p((n, t) => {
+  const { className: e, isSelected: o, onClick: r, item: s, id: l, ...u } = n;
   m(u);
-  const b = V(null);
-  return A(() => {
-    if (!b.current || !o)
+  const c = A(null);
+  return $(() => {
+    if (!c.current || !o)
       return;
-    const l = L(
-      b.current,
+    const d = z(
+      c.current,
       document.querySelector(".bn-grid-suggestion-menu")
     );
-    l === "top" ? b.current.scrollIntoView(!0) : l === "bottom" && b.current.scrollIntoView(!1);
+    d === "top" ? c.current.scrollIntoView(!0) : d === "bottom" && c.current.scrollIntoView(!1);
   }, [o]), /* @__PURE__ */ a(
     "div",
     {
       className: e,
-      ref: z([t, b]),
-      id: i,
+      ref: E([t, c]),
+      id: l,
       role: "option",
       onClick: r,
       "aria-selected": o || void 0,
       children: s.icon
     }
   );
-}), nt = p((n, t) => {
+}), at = p((n, t) => {
   const {
     className: e,
     children: o,
@@ -1589,96 +1641,96 @@ const gn = (n) => {
       children: o
     }
   );
-}), tt = {
+}), rt = {
   FormattingToolbar: {
-    Root: B,
-    Button: F,
-    Select: k
+    Root: k,
+    Button: B,
+    Select: F
   },
   FilePanel: {
-    Root: In,
-    Button: Yn,
-    FileInput: Zn,
-    TabPanel: Mn,
-    TextInput: Dn
+    Root: Rn,
+    Button: nt,
+    FileInput: tt,
+    TabPanel: kn,
+    TextInput: Bn
   },
   LinkToolbar: {
-    Root: B,
-    Button: F,
-    Select: k
+    Root: k,
+    Button: B,
+    Select: F
   },
   SideMenu: {
-    Root: kn,
-    Button: Pn
+    Root: zn,
+    Button: En
   },
   SuggestionMenu: {
-    Root: En,
-    Item: An,
-    EmptyItem: Vn,
-    Label: $n,
-    Loader: jn
+    Root: $n,
+    Item: qn,
+    EmptyItem: jn,
+    Label: Gn,
+    Loader: Un
   },
   GridSuggestionMenu: {
-    Root: Ln,
-    Item: et,
-    EmptyItem: zn,
-    Loader: nt
+    Root: Vn,
+    Item: ot,
+    EmptyItem: An,
+    Loader: at
   },
   TableHandle: {
-    Root: Un,
-    ExtendButton: Gn
+    Root: On,
+    ExtendButton: Hn
   },
   Comments: {
-    Comment: Wn,
-    Editor: _n,
-    Card: Hn,
-    CardSection: On,
-    ExpandSectionsPrompt: qn
+    Comment: _n,
+    Editor: Jn,
+    Card: Kn,
+    CardSection: Qn,
+    ExpandSectionsPrompt: Wn
   },
   Generic: {
     Badge: {
-      Root: Qn,
-      Group: Xn
+      Root: Yn,
+      Group: et
     },
     Toolbar: {
-      Root: B,
-      Button: F,
-      Select: k
+      Root: k,
+      Button: B,
+      Select: F
     },
     Form: {
-      Root: gn,
-      TextInput: hn
+      Root: Nn,
+      TextInput: xn
     },
     Menu: {
-      Root: Nn,
-      Trigger: xn,
-      Dropdown: wn,
-      Divider: yn,
-      Label: Sn,
-      Item: Cn,
-      Button: Tn
+      Root: Cn,
+      Trigger: yn,
+      Dropdown: Sn,
+      Divider: Mn,
+      Label: In,
+      Item: Tn,
+      Button: Dn
     },
     Popover: {
-      Root: Rn,
-      Trigger: Bn,
-      Content: Fn
+      Root: Fn,
+      Trigger: Pn,
+      Content: Ln
     }
   }
-}, ot = (n) => {
-  const { className: t, shadCNComponents: e, ...o } = n, r = E(() => ({
-    ...fn,
+}, st = (n) => {
+  const { className: t, shadCNComponents: e, ...o } = n, r = V(() => ({
+    ...vn,
     ...e
   }), [e]);
-  return /* @__PURE__ */ a(he.Provider, { value: r, children: /* @__PURE__ */ a(Se.Provider, { value: tt, children: /* @__PURE__ */ a(
-    Te,
+  return /* @__PURE__ */ a(ve.Provider, { value: r, children: /* @__PURE__ */ a(Ie.Provider, { value: rt, children: /* @__PURE__ */ a(
+    De,
     {
-      className: Ne("bn-shadcn", t || ""),
+      className: Ce("bn-shadcn", t || ""),
       ...o
     }
   ) }) });
 };
 export {
-  ot as BlockNoteView,
-  tt as components
+  st as BlockNoteView,
+  rt as components
 };
 //# sourceMappingURL=blocknote-shadcn.js.map