@fileverse-dev/ddoc 2.1.4-patch-13 → 2.1.4-patch-14

package/dist/index.es.js

@@ -15640,7 +15640,7 @@ var Qq = { exports: {} };
   })();
 })(Qq);
 var kfe = Qq.exports;
-const zt = /* @__PURE__ */ S2(kfe);
+const Ot = /* @__PURE__ */ S2(kfe);
 var Ag = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function xfe(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
@@ -80214,7 +80214,7 @@ const Z5t = ({
               onClick: () => {
                 i.command();
               },
-              className: zt(
+              className: Ot(
                 "flex items-center justify-between rounded-sm px-2 py-1 text-body-sm hover:color-bg-default-hover transition-all",
                 {
                   "color-bg-brand hover:color-bg-brand-hover dark:text-[#363B3F]": i.isActive()
@@ -80520,7 +80520,7 @@ const l8t = async (t) => {
       /* @__PURE__ */ A.jsx(
         "div",
         {
-          className: zt(
+          className: Ot(
             "flex flex-col gap-4 w-full h-full pb-4 text-base color-text-default",
             i
           ),
@@ -81838,7 +81838,7 @@ const $Q = sn(
           {
             ref: o,
             onKeyDownCapture: v,
-            className: zt("relative", i),
+            className: Ot("relative", i),
             role: "region",
             "aria-roledescription": "carousel",
             ...s,
@@ -81856,7 +81856,7 @@ const eX = sn(({ className: t, ...e }, n) => {
     "div",
     {
       ref: n,
-      className: zt(
+      className: Ot(
         "flex",
         i === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
         t
@@ -81875,7 +81875,7 @@ const yM = sn(
         ref: n,
         role: "group",
         "aria-roledescription": "slide",
-        className: zt(
+        className: Ot(
           "min-w-0 shrink-0 grow-0 basis-full",
           r === "horizontal" ? "pl-4" : "pt-4",
           t
@@ -81905,7 +81905,7 @@ const tX = sn(({ index: t, className: e, ...n }, r) => {
     "button",
     {
       ref: r,
-      className: zt(
+      className: Ot(
         "w-2 h-2 transition-colors duration-200 rounded-full",
         f ? "bg-black" : "bg-[#E8EBEC] hover:bg-black/50",
         e
@@ -81922,7 +81922,7 @@ const W8t = Me.forwardRef(({ className: t, ...e }, n) => {
     "button",
     {
       ref: n,
-      className: zt(
+      className: Ot(
         "btn color-bg-default hover:color-bg-default-hover transition color-text-default flex items-center border-2 rounded h-9 px-4 py-2 text-sm font-medium disabled:bg-[#E8EBEC] disabled:text-[#A1AAB1]",
         t
       ),
@@ -81940,7 +81940,7 @@ const Z8t = Me.forwardRef(({ className: t, ...e }, n) => {
     "button",
     {
       ref: n,
-      className: zt(
+      className: Ot(
         "btn bg-black hover:bg-black color-text-default flex items-center border-2 rounded h-9 px-4 py-2 text-sm font-medium disabled:bg-[#E8EBEC] disabled:text-[#A1AAB1]",
         t
       ),
@@ -97765,7 +97765,7 @@ const tee = async (t, e) => {
           onClick: () => {
             t.chain().focus().toggleHighlight({ color: r.color }).run(), e(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "w-5 rounded-full flex items-center justify-center cursor-pointer ease-in duration-200 hover:scale-[1.05] h-5",
             r.code
           ),
@@ -97773,7 +97773,7 @@ const tee = async (t, e) => {
             Xe,
             {
               name: "Check",
-              className: zt(
+              className: Ot(
                 "w-[14px] aspect-square",
                 t.isActive("textStyle", {
                   color: r.color
@@ -97808,7 +97808,7 @@ const tee = async (t, e) => {
   "div",
   {
     ref: t,
-    className: zt(
+    className: Ot(
       "z-50 h-auto max-h-[330px] w-48 overflow-y-auto scroll-smooth color-bg-default px-1 py-2 shadow-elevation-1 transition-all rounded"
     ),
     children: eC.map((r) => /* @__PURE__ */ A.jsx(
@@ -97820,7 +97820,7 @@ const tee = async (t, e) => {
         style: {
           fontFamily: r.title
         },
-        className: zt(
+        className: Ot(
           "flex w-full items-center space-x-2 rounded px-2 py-1 text-left text-sm color-text-default transition",
           e.isActive("textStyle", { fontFamily: r.value }) ? "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]" : "hover:color-bg-default-hover"
         ),
@@ -97845,7 +97845,7 @@ const tee = async (t, e) => {
           onClick: () => {
             e == null || e.chain().focus().setTextAlign("left").run(), n(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "rounded w-8 h-8 p-1 flex justify-center items-center cursor-pointer transition",
             e.isActive({ textAlign: "left" }) ? "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]" : "hover:color-bg-default-hover"
           ),
@@ -97858,7 +97858,7 @@ const tee = async (t, e) => {
           onClick: () => {
             e == null || e.chain().focus().setTextAlign("center").run(), n(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "rounded w-8 h-8 p-1 flex justify-center items-center cursor-pointer transition",
             e.isActive({ textAlign: "center" }) ? "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]" : "hover:color-bg-default-hover"
           ),
@@ -97871,7 +97871,7 @@ const tee = async (t, e) => {
           onClick: () => {
             e == null || e.chain().focus().setTextAlign("right").run(), n(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "rounded w-8 h-8 p-1 flex justify-center items-center cursor-pointer transition",
             e.isActive({ textAlign: "right" }) ? "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]" : "hover:color-bg-default-hover"
           ),
@@ -97961,7 +97961,7 @@ const tee = async (t, e) => {
       onClick: () => {
         r.command();
       },
-      className: zt(
+      className: Ot(
         "flex items-center justify-between w-full px-2 py-1 text-body-sm",
         r.isActive() && "color-bg-brand hover:!bg-[#B6A02E] dark:text-[#363B3F]"
       ),
@@ -97991,7 +97991,7 @@ const tee = async (t, e) => {
           onClick: () => {
             t.chain().focus().setColor(r.color).run(), e(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "w-5 rounded-full flex justify-center items-center cursor-pointer ease-in duration-200 hover:scale-[1.05] h-5",
             r.code
           ),
@@ -97999,7 +97999,7 @@ const tee = async (t, e) => {
             Xe,
             {
               name: "Check",
-              className: zt(
+              className: Ot(
                 "w-[14px] aspect-square",
                 t.isActive("textStyle", {
                   color: r.color
@@ -98071,7 +98071,7 @@ const tee = async (t, e) => {
     "div",
     {
       ref: n,
-      className: zt(
+      className: Ot(
         "z-50 flex w-48 flex-col overflow-hidden rounded color-bg-default p-1 shadow-elevation-1"
       ),
       children: r.map((i) => /* @__PURE__ */ A.jsxs(
@@ -98080,7 +98080,7 @@ const tee = async (t, e) => {
           onClick: () => {
             i.command(t), e(Ct.NONE);
           },
-          className: zt(
+          className: Ot(
             "flex w-full items-center space-x-2 rounded-md px-2 py-1 text-left text-sm color-text-default transition",
             {
               "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": i.isActive(),
@@ -98268,7 +98268,7 @@ const tee = async (t, e) => {
           "button",
           {
             onClick: () => c.command(t),
-            className: zt(
+            className: Ot(
               "flex w-fit items-center font-medium space-x-2 rounded p-2 text-center text-sm color-text-default transition",
               {
                 "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98284,7 +98284,7 @@ const tee = async (t, e) => {
             "button",
             {
               onClick: () => c.command(t),
-              className: zt(
+              className: Ot(
                 "flex items-center space-x-2 rounded px-4 py-1 color-text-default transition h-9",
                 {
                   "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98299,7 +98299,7 @@ const tee = async (t, e) => {
             "button",
             {
               onClick: () => c.command(t),
-              className: zt(
+              className: Ot(
                 "flex items-center space-x-2 rounded px-4 py-1 color-text-default transition h-9",
                 {
                   "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98316,7 +98316,7 @@ const tee = async (t, e) => {
             "button",
             {
               onClick: () => c.command(t),
-              className: zt(
+              className: Ot(
                 "flex items-center space-x-2 rounded px-4 py-1 color-text-default transition h-9",
                 {
                   "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98331,7 +98331,7 @@ const tee = async (t, e) => {
             "button",
             {
               onClick: () => c.command(t),
-              className: zt(
+              className: Ot(
                 "flex items-center space-x-2 rounded px-4 py-1 color-text-default transition h-9",
                 {
                   "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98347,7 +98347,7 @@ const tee = async (t, e) => {
           "button",
           {
             onClick: () => c.command(t),
-            className: zt(
+            className: Ot(
               "flex items-center space-x-2 rounded px-4 py-1 color-text-default transition h-9",
               {
                 "color-bg-brand xl:hover:brightness-90 dark:text-[#363B3F]": c.isActive(),
@@ -98401,7 +98401,7 @@ const tee = async (t, e) => {
                           onClick: () => {
                             t.chain().setColor(c.color).run();
                           },
-                          className: zt(
+                          className: Ot(
                             "w-6 h-6 mb-1 drop-shadow rounded-full flex justify-center items-center cursor-pointer transition",
                             c.code
                           ),
@@ -98409,7 +98409,7 @@ const tee = async (t, e) => {
                             Xe,
                             {
                               name: "Check",
-                              className: zt(
+                              className: Ot(
                                 "w-[14px] aspect-square",
                                 t.isActive("textStyle", {
                                   color: c.color
@@ -100623,7 +100623,7 @@ const mee = sn(
     className: r,
     ...i
   }, a) => {
-    const s = zt(
+    const s = Ot(
       "color-text-default inline-flex h-full leading-none gap-0.5",
       n ? "flex-col p-2" : "flex-row p-1 items-center",
       r
@@ -100634,7 +100634,7 @@ const mee = sn(
 mee.displayName = "Toolbar";
 const pxt = sn(
   ({ horizontal: t, className: e, ...n }, r) => {
-    const i = zt(
+    const i = Ot(
       "bg-neutral-200",
       t ? "w-full min-w-[1.5rem] h-[1px] my-1 first:mt-0 last:mt-0" : "h-full min-h-[1.5rem] w-[1px] mx-1 first:ml-0 last:mr-0",
       e
@@ -114223,6 +114223,12 @@ const bLt = Cr.create({
     icon: "AlignRight",
     isActive: (t) => t.dataAlign === "end"
   },
+  {
+    tooltip: "Add Caption",
+    icon: "Captions",
+    action: (t) => t({ showCaptionInput: !0 }),
+    isActive: (t) => t.showCaptionInput === !0
+  },
   {
     tooltip: "Delete",
     icon: "Trash2",
@@ -114379,7 +114385,7 @@ const lne = ({
     E2,
     {
       as: "article",
-      className: zt(
+      className: Ot(
         "media-node-view not-prose transition-all ease-in-out w-full",
         V && `f-${t.attrs.dataFloat}`,
         G && `justify-${t.attrs.dataAlign}`
@@ -114389,8 +114395,8 @@ const lne = ({
         {
           draggable: m,
           "data-drag-handle": m,
-          className: zt(
-            "w-fit flex flex-col gap-2 relative group transition-all ease-in-out",
+          className: Ot(
+            "w-fit flex flex-col relative group transition-all ease-in-out",
             m && "opacity-50"
           ),
           onTouchStart: K,
@@ -114398,84 +114404,120 @@ const lne = ({
           onTouchEnd: $,
           onTouchCancel: $,
           children: [
-            i === "img" && /* @__PURE__ */ A.jsx(
-              "img",
-              {
-                src: t.attrs.src,
-                ref: d,
-                className: "rounded-lg",
-                alt: t.attrs.src,
-                width: t.attrs.width,
-                height: t.attrs.height
-              }
-            ),
-            i === "secure-img" && /* @__PURE__ */ A.jsx(
-              DLt,
+            /* @__PURE__ */ A.jsxs(
+              "div",
               {
-                encryptedKey: t.attrs.encryptedKey,
-                url: t.attrs.url,
-                iv: t.attrs.iv,
-                privateKey: t.attrs.privateKey,
-                alt: t.attrs.alt,
-                className: "rounded-lg",
-                width: t.attrs.width,
-                height: t.attrs.height,
-                ref: d
+                className: Ot(
+                  "relative",
+                  t.attrs.dataAlign === "start" && "self-start",
+                  t.attrs.dataAlign === "center" && "self-center",
+                  t.attrs.dataAlign === "end" && "self-end"
+                ),
+                children: [
+                  i === "img" && /* @__PURE__ */ A.jsx(
+                    "img",
+                    {
+                      src: t.attrs.src,
+                      ref: d,
+                      className: "rounded-lg",
+                      alt: t.attrs.src,
+                      width: t.attrs.width,
+                      height: t.attrs.height
+                    }
+                  ),
+                  i === "secure-img" && /* @__PURE__ */ A.jsx(
+                    DLt,
+                    {
+                      encryptedKey: t.attrs.encryptedKey,
+                      url: t.attrs.url,
+                      iv: t.attrs.iv,
+                      privateKey: t.attrs.privateKey,
+                      alt: t.attrs.alt,
+                      className: "rounded-lg",
+                      width: t.attrs.width,
+                      height: t.attrs.height,
+                      ref: d
+                    }
+                  ),
+                  i === "video" && /* @__PURE__ */ A.jsx(
+                    "video",
+                    {
+                      ref: d,
+                      className: "rounded-lg",
+                      controls: !0,
+                      width: t.attrs.width,
+                      height: t.attrs.height,
+                      children: /* @__PURE__ */ A.jsx("source", { src: t.attrs.src })
+                    }
+                  ),
+                  i === "iframe" && /* @__PURE__ */ A.jsx(
+                    "iframe",
+                    {
+                      ref: d,
+                      className: Ot(
+                        "rounded-lg max-w-full",
+                        h && "pointer-events-none"
+                      ),
+                      src: t.attrs.src,
+                      width: t.attrs.width,
+                      height: t.attrs.height
+                    }
+                  ),
+                  !r && /* @__PURE__ */ A.jsx(
+                    "div",
+                    {
+                      className: "horizontal-resize-handle group-hover:bg-[#2E2E2E] group-hover:border-2 group-hover:border-[#E8EBEC]",
+                      title: "Resize",
+                      onClick: ({ clientX: oe }) => C(oe),
+                      onMouseDown: (oe) => R(oe),
+                      onMouseUp: I,
+                      onTouchStart: (oe) => R(oe),
+                      onTouchEnd: I
+                    }
+                  )
+                ]
               }
             ),
-            i === "video" && /* @__PURE__ */ A.jsx(
-              "video",
+            t.attrs.showCaptionInput && /* @__PURE__ */ A.jsx("div", { className: "caption-input-container", children: /* @__PURE__ */ A.jsx(
+              "textarea",
               {
-                ref: d,
-                className: "rounded-lg",
-                controls: !0,
-                width: t.attrs.width,
-                height: t.attrs.height,
-                children: /* @__PURE__ */ A.jsx("source", { src: t.attrs.src })
+                placeholder: "Type image caption or click at any space to close caption adding",
+                value: t.attrs.caption || "",
+                onChange: (oe) => {
+                  const ue = oe.target.value;
+                  ue.length <= 300 && e({ caption: ue });
+                },
+                onBlur: () => {
+                  t.attrs.caption || e({ showCaptionInput: !1 });
+                },
+                onInput: (oe) => {
+                  const ue = oe.target;
+                  ue.style.height = "auto", ue.style.height = `${ue.scrollHeight}px`;
+                },
+                autoFocus: !0,
+                className: Ot("color-text-secondary resize-none", "placeholder-disabled", {
+                  "text-left": t.attrs.dataAlign === "start",
+                  "text-center": t.attrs.dataAlign === "center",
+                  "text-right": t.attrs.dataAlign === "end"
+                })
               }
-            ),
-            i === "iframe" && /* @__PURE__ */ A.jsx(
-              "iframe",
+            ) }),
+            t.attrs.caption && !t.attrs.showCaptionInput && /* @__PURE__ */ A.jsx("div", { className: "caption", children: t.attrs.caption }),
+            !r && /* @__PURE__ */ A.jsx("span", { className: "absolute top-2 right-2 transition-all rounded-md overflow-hidden box-border border color-border-default color-bg-default shadow-elevation-3 opacity-0 group-hover:opacity-100 flex gap-1 p-1", children: Jz.map((oe, ue) => /* @__PURE__ */ A.jsx(
+              Fr,
               {
-                ref: d,
-                className: zt(
-                  "rounded-lg max-w-full",
-                  h && "pointer-events-none"
-                ),
-                src: t.attrs.src,
-                width: t.attrs.width,
-                height: t.attrs.height
-              }
-            ),
-            !r && /* @__PURE__ */ A.jsxs(A.Fragment, { children: [
-              /* @__PURE__ */ A.jsx(
-                "div",
-                {
-                  className: "horizontal-resize-handle group-hover:bg-[#2E2E2E] group-hover:border-2 group-hover:border-[#E8EBEC]",
-                  title: "Resize",
-                  onClick: ({ clientX: oe }) => C(oe),
-                  onMouseDown: (oe) => R(oe),
-                  onMouseUp: I,
-                  onTouchStart: (oe) => R(oe),
-                  onTouchEnd: I
-                }
-              ),
-              /* @__PURE__ */ A.jsx("span", { className: "absolute top-2 right-2 transition-all rounded-md overflow-hidden box-border border color-border-default color-bg-default shadow-elevation-3 opacity-0 group-hover:opacity-100 flex gap-1 p-1", children: Jz.map((oe, ue) => /* @__PURE__ */ A.jsx(
-                Fr,
-                {
-                  tooltip: oe.tooltip,
-                  isActive: u[oe.tooltip],
-                  onClick: () => {
-                    var ie;
-                    return oe.tooltip === "Delete" ? n() : (ie = oe.action) == null ? void 0 : ie.call(oe, e);
-                  },
-                  icon: oe.icon,
-                  classNames: "min-w-6 aspect-square",
-                  size: "sm"
+                tooltip: oe.tooltip,
+                isActive: u[oe.tooltip],
+                onClick: () => {
+                  var ie;
+                  return oe.tooltip === "Delete" ? n() : (ie = oe.action) == null ? void 0 : ie.call(oe, e);
                 },
-                ue
-              )) })
-            ] })
+                icon: oe.icon,
+                classNames: "min-w-6 aspect-square",
+                size: "sm"
+              },
+              ue
+            )) })
           ]
         }
       )
@@ -120172,7 +120214,7 @@ const $Nt = [
           "label",
           {
             tabIndex: 0,
-            className: zt("trigger-button", { hidden: s }),
+            className: Ot("trigger-button", { hidden: s }),
             contentEditable: !1,
             children: /* @__PURE__ */ A.jsx(
               Xe,
@@ -131309,17 +131351,17 @@ T(D, ee, fe, "Z", "ℤ");
 T(Fe, ee, fe, "Z", "ℤ");
 T(D, H, jt, "h", "ℎ");
 T(Fe, H, jt, "h", "ℎ");
-var Ot = "";
+var zt = "";
 for (var Di = 0; Di < N8.length; Di++) {
   var cr = N8.charAt(Di);
-  Ot = String.fromCharCode(55349, 56320 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56372 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56424 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56580 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56684 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56736 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56788 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56840 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56944 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Di < 26 && (Ot = String.fromCharCode(55349, 56632 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot), Ot = String.fromCharCode(55349, 56476 + Di), T(D, H, jt, cr, Ot), T(Fe, H, fe, cr, Ot));
+  zt = String.fromCharCode(55349, 56320 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56372 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56424 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56580 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56684 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56736 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56788 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56840 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56944 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), Di < 26 && (zt = String.fromCharCode(55349, 56632 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt), zt = String.fromCharCode(55349, 56476 + Di), T(D, H, jt, cr, zt), T(Fe, H, fe, cr, zt));
 }
-Ot = "𝕜";
-T(D, H, jt, "k", Ot);
-T(Fe, H, fe, "k", Ot);
+zt = "𝕜";
+T(D, H, jt, "k", zt);
+T(Fe, H, fe, "k", zt);
 for (var O0 = 0; O0 < 10; O0++) {
   var Zc = O0.toString();
-  Ot = String.fromCharCode(55349, 57294 + O0), T(D, H, jt, Zc, Ot), T(Fe, H, fe, Zc, Ot), Ot = String.fromCharCode(55349, 57314 + O0), T(D, H, jt, Zc, Ot), T(Fe, H, fe, Zc, Ot), Ot = String.fromCharCode(55349, 57324 + O0), T(D, H, jt, Zc, Ot), T(Fe, H, fe, Zc, Ot), Ot = String.fromCharCode(55349, 57334 + O0), T(D, H, jt, Zc, Ot), T(Fe, H, fe, Zc, Ot);
+  zt = String.fromCharCode(55349, 57294 + O0), T(D, H, jt, Zc, zt), T(Fe, H, fe, Zc, zt), zt = String.fromCharCode(55349, 57314 + O0), T(D, H, jt, Zc, zt), T(Fe, H, fe, Zc, zt), zt = String.fromCharCode(55349, 57324 + O0), T(D, H, jt, Zc, zt), T(Fe, H, fe, Zc, zt), zt = String.fromCharCode(55349, 57334 + O0), T(D, H, jt, Zc, zt), T(Fe, H, fe, Zc, zt);
 }
 var tA = "ÐÞþ";
 for (var sk = 0; sk < tA.length; sk++) {
@@ -139965,18 +140007,12 @@ const GFt = Cr.create({
         default: null
         // 'left' | 'right'
       },
-      encryptedKey: {
-        default: null
-      },
-      url: {
-        default: null
-      },
-      iv: {
-        default: null
-      },
-      privateKey: {
-        default: null
-      }
+      encryptedKey: { default: null },
+      url: { default: null },
+      iv: { default: null },
+      privateKey: { default: null },
+      caption: { default: null },
+      showCaptionInput: { default: !1 }
       // TODO: For figure caption later
       // caption: {
       //   default: null,
@@ -141120,7 +141156,7 @@ const l_t = cn.create({
   return /* @__PURE__ */ A.jsxs(
     E2,
     {
-      className: zt(
+      className: Ot(
         "flex relative opacity-0 hover:opacity-100 transition-opacity duration-200 w-full h-full justify-center items-center"
       ),
       children: [
@@ -147683,7 +147719,7 @@ const LWt = ({
                     {
                       className: ke(
                         "w-full color-bg-default rounded-lg overflow-hidden relative",
-                        n ? "h-full max-w-none flex items-start justify-center" : "px-8 md:px-0 scale-[0.35] md:scale-[0.75] xl:scale-100 min-w-[1080px] max-w-[1080px] aspect-video py-[48px]"
+                        n ? "h-full max-w-none flex items-start justify-start" : "px-8 md:px-0 scale-[0.35] md:scale-[0.75] xl:scale-100 min-w-[1080px] max-w-[1080px] aspect-video py-[48px]"
                       ),
                       style: {
                         transformOrigin: "center"
@@ -148144,7 +148180,7 @@ const LWt = ({
       onOpenChange: e,
       noOverlay: !0,
       side: "right",
-      className: zt(
+      className: Ot(
         "p-0 !w-screen md:!w-[384px] !z-50 !color-bg-default",
         !l && "!h-screen"
       ),
@@ -148181,7 +148217,7 @@ const LWt = ({
       side: "right",
       rounded: !0,
       dismissible: !0,
-      className: zt(
+      className: Ot(
         "w-[calc(100vw-24px)] !z-40 md:w-[384px] right-0 shadow-elevation-4 rounded-lg border color-border-default",
         t && "right-2 md:!right-4",
         n ? `h-[calc(98vh-140px)] ${a ? "top-[4rem]" : "top-[7.25rem] "}` : "top-[4rem] h-[calc(100vh-90px)] xl:h-[calc(99vh-90px)]",
@@ -148394,14 +148430,14 @@ const LWt = ({
       hasCloseIcon: !0,
       content: /* @__PURE__ */ A.jsxs(Me.Fragment, { children: [
         /* @__PURE__ */ A.jsx("div", { className: "flex justify-between items-center p-4", children: /* @__PURE__ */ A.jsx("h2", { className: "text-heading-sm-bold", children: "Document outline" }) }),
-        /* @__PURE__ */ A.jsx("div", { className: zt("table-of-contents px-4"), children: /* @__PURE__ */ A.jsx(E_, { editor: t, items: n, setItems: r }) })
+        /* @__PURE__ */ A.jsx("div", { className: Ot("table-of-contents px-4"), children: /* @__PURE__ */ A.jsx(E_, { editor: t, items: n, setItems: r }) })
       ] })
     },
     "mobile-toc"
   ) : /* @__PURE__ */ A.jsxs(
     "div",
     {
-      className: zt(
+      className: Ot(
         "flex flex-col gap-4 items-start justify-start absolute left-4",
         (!e || l) && "hidden",
         s ? "top-[4rem]" : "top-[7.3rem]"
@@ -148427,7 +148463,7 @@ const LWt = ({
         /* @__PURE__ */ A.jsx(
           "div",
           {
-            className: zt(
+            className: Ot(
               "table-of-contents animate-in fade-in slide-in-from-left-5",
               i ? "block" : "hidden"
             ),
@@ -148632,7 +148668,7 @@ const LWt = ({
       "div",
       {
         id: "editor-canvas",
-        className: zt(
+        className: Ot(
           "h-[100vh] w-full custom-scrollbar",
           {
             "overflow-x-hidden": V !== "2",
@@ -148646,7 +148682,7 @@ const LWt = ({
             "nav",
             {
               id: "Navbar",
-              className: zt(
+              className: Ot(
                 "h-14 color-bg-default py-2 px-4 flex gap-2 items-center justify-between w-screen fixed left-0 top-0 border-b color-border-default z-50 transition-transform duration-300",
                 {
                   "translate-y-0": K,
@@ -148686,7 +148722,7 @@ const LWt = ({
                   "div",
                   {
                     id: "toolbar",
-                    className: zt(
+                    className: Ot(
                       "z-50 hidden xl:flex items-center justify-center w-full h-[52px] fixed left-0 color-bg-default border-b color-border-default transition-transform duration-300 top-[3.5rem]",
                       {
                         "translate-y-0": K,
@@ -148742,7 +148778,7 @@ const LWt = ({
                 /* @__PURE__ */ A.jsxs(
                   "div",
                   {
-                    className: zt(
+                    className: Ot(
                       "color-bg-default w-full mx-auto rounded",
                       { "mt-4 md:!mt-16 !py-20": t && !vt },
                       { "md:!mt-16": !t },
@@ -148778,7 +148814,7 @@ const LWt = ({
                         "div",
                         {
                           ref: un,
-                          className: zt(
+                          className: Ot(
                             "w-full h-full pt-8 md:pt-0",
                             { "custom-ios-padding": it },
                             { "color-bg-default": V === "1.4" || "1.5" }
@@ -148814,7 +148850,7 @@ const LWt = ({
                                 "div",
                                 {
                                   ref: Mt,
-                                  className: zt(
+                                  className: Ot(
                                     "flex flex-wrap px-4 md:px-[80px] lg:!px-[124px] items-center gap-1 mb-4 mt-4 lg:!mt-0",
                                     { "pt-12": t }
                                   ),
@@ -148895,7 +148931,7 @@ const LWt = ({
                             d == null || d(st);
                           },
                           variant: "ghost",
-                          className: zt(
+                          className: Ot(
                             "absolute w-12 h-12 color-bg-default rounded-full shadow-xl top-[70px] right-[-23px]"
                           ),
                           children: /* @__PURE__ */ A.jsx(Xe, { name: "MessageSquareText", size: "sm" })
@@ -148907,7 +148943,7 @@ const LWt = ({
                 !t && !g && /* @__PURE__ */ A.jsx(
                   "div",
                   {
-                    className: zt(
+                    className: Ot(
                       "flex xl:hidden items-center w-full h-[52px] absolute left-0 z-10 px-4 color-bg-default transition-all duration-300 ease-in-out border-b border-color-default",
                       yt && "hidden",
                       { "top-14": K, "top-0": !K }