@underverse-ui/underverse 2.0.13 → 2.0.14

package/dist/index.cjs

@@ -364,7 +364,9 @@ var init_en = __esm({
           imageWidthMd: "Image Width Medium",
           imageWidthLg: "Image Width Large",
           imageResetSize: "Reset Image Size",
-          imageDelete: "Delete Image"
+          imageDelete: "Delete Image",
+          hideMenuBar: "Hide menu bar",
+          showMenuBar: "Show menu bar"
         },
         slashCommand: {
           basicBlocks: "Basic Blocks",
@@ -822,7 +824,9 @@ var init_vi = __esm({
           imageWidthMd: "\u1EA2nh V\u1EEBa",
           imageWidthLg: "\u1EA2nh L\u1EDBn",
           imageResetSize: "\u0110\u1EB7t L\u1EA1i K\xEDch Th\u01B0\u1EDBc \u1EA2nh",
-          imageDelete: "X\xF3a \u1EA2nh"
+          imageDelete: "X\xF3a \u1EA2nh",
+          hideMenuBar: "\u1EA8n thanh menu",
+          showMenuBar: "Hi\u1EC7n thanh menu"
         },
         slashCommand: {
           basicBlocks: "Kh\u1ED1i c\u01A1 b\u1EA3n",
@@ -1280,7 +1284,9 @@ var init_ko = __esm({
           imageWidthMd: "\uC911\uAC04 \uC774\uBBF8\uC9C0",
           imageWidthLg: "\uD070 \uC774\uBBF8\uC9C0",
           imageResetSize: "\uC774\uBBF8\uC9C0 \uD06C\uAE30 \uCD08\uAE30\uD654",
-          imageDelete: "\uC774\uBBF8\uC9C0 \uC0AD\uC81C"
+          imageDelete: "\uC774\uBBF8\uC9C0 \uC0AD\uC81C",
+          hideMenuBar: "\uBA54\uB274 \uBAA8\uC74C \uC228\uAE30\uAE30",
+          showMenuBar: "\uBA54\uB274 \uBAA8\uC74C \uD45C\uC2DC"
         },
         slashCommand: {
           basicBlocks: "\uAE30\uBCF8 \uBE14\uB85D",
@@ -1738,7 +1744,9 @@ var init_ja = __esm({
           imageWidthMd: "\u753B\u50CF\uFF08\u4E2D\uFF09",
           imageWidthLg: "\u753B\u50CF\uFF08\u5927\uFF09",
           imageResetSize: "\u753B\u50CF\u30B5\u30A4\u30BA\u3092\u30EA\u30BB\u30C3\u30C8",
-          imageDelete: "\u753B\u50CF\u3092\u524A\u9664"
+          imageDelete: "\u753B\u50CF\u3092\u524A\u9664",
+          hideMenuBar: "\u30E1\u30CB\u30E5\u30FC\u30D0\u30FC\u3092\u975E\u8868\u793A",
+          showMenuBar: "\u30E1\u30CB\u30E5\u30FC\u30D0\u30FC\u3092\u8868\u793A"
         },
         slashCommand: {
           basicBlocks: "\u57FA\u672C\u30D6\u30ED\u30C3\u30AF",
@@ -7385,6 +7393,8 @@ var init_toolbar = __esm({
     EditorToolbar = ({
       editor,
       variant,
+      isMenuBarVisible,
+      onToggleMenuBar,
       uploadImage,
       imageInsertMode = "base64",
       maxImageFileSize = DEFAULT_UEDITOR_IMAGE_MAX_FILE_SIZE,
@@ -7559,6 +7569,15 @@ var init_toolbar = __esm({
                 )
               ] })
             }
+          ),
+          onToggleMenuBar && /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
+            ToolbarButton,
+            {
+              onClick: onToggleMenuBar,
+              active: isMenuBarVisible,
+              title: t(isMenuBarVisible ? "toolbar.hideMenuBar" : "toolbar.showMenuBar"),
+              children: isMenuBarVisible ? /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_lucide_react52.PanelTopClose, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_lucide_react52.PanelTopOpen, { className: "h-4 w-4" })
+            }
           )
         ] });
       }
@@ -7567,7 +7586,7 @@ var init_toolbar = __esm({
         "div",
         {
           role: "toolbar",
-          className: "flex min-h-9 flex-nowrap items-center gap-0.5 overflow-x-auto border-b border-[rgba(196,197,213,0.6)] bg-[#F4F4F4] px-1.5 py-1 dark:bg-muted/60",
+          className: "flex min-h-9 flex-wrap items-center gap-0.5 border-b border-[rgba(196,197,213,0.6)] bg-[#F4F4F4] px-1.5 py-1 dark:bg-muted/60",
           children: [
             isFull && /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
               DropdownMenu,
@@ -8282,7 +8301,16 @@ var init_toolbar = __esm({
                   children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_lucide_react52.TableCellsMerge, { className: "w-4 h-4" })
                 }
               )
-            ] })
+            ] }),
+            onToggleMenuBar && /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
+              ToolbarButton,
+              {
+                onClick: onToggleMenuBar,
+                active: isMenuBarVisible,
+                title: t(isMenuBarVisible ? "toolbar.hideMenuBar" : "toolbar.showMenuBar"),
+                children: isMenuBarVisible ? /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_lucide_react52.PanelTopClose, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_lucide_react52.PanelTopOpen, { className: "h-4 w-4" })
+              }
+            )
           ]
         }
       );
@@ -48017,6 +48045,10 @@ var UEditor = import_react84.default.forwardRef(({
   const formulaRangePickRef = (0, import_react84.useRef)(null);
   const formulaRangeSurfaceRef = (0, import_react84.useRef)(null);
   const [formulaRangeHighlight, setFormulaRangeHighlight] = import_react84.default.useState(null);
+  const [isMenuBarVisible, setIsMenuBarVisible] = import_react84.default.useState(showMenuBar);
+  (0, import_react84.useEffect)(() => {
+    setIsMenuBarVisible(showMenuBar);
+  }, [showMenuBar]);
   const { flushOutputUpdates, scheduleOutputUpdate } = useUEditorOutput({
     onChange,
     onHtmlChange,
@@ -48275,7 +48307,7 @@ var UEditor = import_react84.default.forwardRef(({
       ),
       children: [
         editable && (showMenuBar || showToolbar || showBubbleMenu) ? /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(EditorUiRenderStateProvider, { editor, children: [
-          showMenuBar && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_react84.default.Suspense, { fallback: null, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+          isMenuBarVisible && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_react84.default.Suspense, { fallback: null, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
             LazyMenuBar,
             {
               editor,
@@ -48296,6 +48328,8 @@ var UEditor = import_react84.default.forwardRef(({
             {
               editor,
               variant,
+              isMenuBarVisible,
+              onToggleMenuBar: () => setIsMenuBarVisible((visible) => !visible),
               uploadImage,
               imageInsertMode,
               maxImageFileSize,