@difizen/libro-core 0.2.35-next.0 → 0.2.35

package/es/add-cell/libro-add-cell-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"libro-add-cell-view.d.ts","sourceRoot":"","sources":["../../src/add-cell/libro-add-cell-view.tsx"],"names":[],"mappings":";AACA,OAAO,EAKL,QAAQ,EAIT,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,cAAc,CAAC;AAOtB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAqChC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mFAO9B,CAAC;AAEH,qBAEa,gBAAiB,SAAQ,QAAQ;IAC5C,MAAM,EAAE,SAAS,GAAG,SAAS,CAAa;IACjC,IAAI,oFAAuB;IAGpC,OAAO,EAAE,QAAQ,EAAE,CAAM;IAEzB,WAAW,EAAE,WAAW,CAAC;gBAEQ,WAAW,EAAE,WAAW;IAKhD,WAAW;IAIX,aAAa;IAIb,YAAY;IAIrB,aAAa,aAAc,QAAQ,aAA6B;IAEhE,WAAW,CAAC,MAAM,kCAAqB;CAGxC"}
+{"version":3,"file":"libro-add-cell-view.d.ts","sourceRoot":"","sources":["../../src/add-cell/libro-add-cell-view.tsx"],"names":[],"mappings":";AACA,OAAO,EAKL,QAAQ,EAIT,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,cAAc,CAAC;AAOtB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EA4BhC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mFAO9B,CAAC;AAEH,qBAEa,gBAAiB,SAAQ,QAAQ;IAC5C,MAAM,EAAE,SAAS,GAAG,SAAS,CAAa;IACjC,IAAI,oFAAuB;IAGpC,OAAO,EAAE,QAAQ,EAAE,CAAM;IAEzB,WAAW,EAAE,WAAW,CAAC;gBAEQ,WAAW,EAAE,WAAW;IAKhD,WAAW;IAIX,aAAa;IAIb,YAAY;IAIrB,aAAa,aAAc,QAAQ,aAA6B;IAEhE,WAAW,CAAC,MAAM,kCAAqB;CAGxC"}

package/es/add-cell/libro-add-cell-view.js

@@ -48,13 +48,7 @@ export var LibroAddCell = function LibroAddCell() {
   }();
   return /*#__PURE__*/_jsx("div", {
     className: "libro-add-cell-container default-add-cell-container",
-    children: instance.getCellList().sort(function (a, b) {
-      if (a.order < b.order) {
-        return -1;
-      } else {
-        return 1;
-      }
-    }).map(function (item) {
+    children: instance.getCellList().map(function (item) {
       return /*#__PURE__*/_jsx(Button, {
         className: "libro-add-cell-container-item ",
         onClick: function onClick() {

package/es/cell/libro-cell-service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"libro-cell-service.d.ts","sourceRoot":"","sources":["../../src/cell/libro-cell-service.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EAAE,uBAAuB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGzE,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEnD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EACL,WAAW,EAEX,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,0BAA0B,CAAC;AAElC,qBACa,gBAAiB,YAAW,WAAW,EAAE,uBAAuB;IAE3E,SAAS,EAAE,QAAQ,EAAE,CAAM;IAE3B,SAAS,CAAC,QAAQ,CAAC,aAAa,EAAE,YAAY,CAAC,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IAC/E,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;IAC7E,SAAS,CAAC,2BAA2B,EAAE,GAAG,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAa;IACtF,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC;IAC5C,SAAS,CAAC,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAa;IAEtE,YAAY,EAAE,YAAY,CAAC;gBAGzB,WAAW,EAAE,WAAW,EACF,YAAY,EAAE,YAAY,EAEhD,aAAa,EAAE,YAAY,CAAC,QAAQ,CAAC,qBAAqB,CAAC,EAE3D,YAAY,EAAE,YAAY,CAAC,QAAQ,CAAC,oBAAoB,CAAC;IAQ3D,SAAS,CAAC,gCAAgC,CAAC,GAAG,EAAE,qBAAqB,GAAG,WAAW;IAOnF,UAAU;IAYV,oBAAoB,CAAC,QAAQ,EAAE,MAAM;IAQrC,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG,WAAW;IAIzD,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;IAK5C,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,SAAK,GAAG,OAAO,CAAC,SAAS,CAAC;IAqB7E,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,QAAQ,CAAC;IAqBhF,gBAAgB,CAAC,OAAO,EAAE,WAAW,GAAG,oBAAoB,GAAG,SAAS;IASxE,iBAAiB,CAAC,OAAO,EAAE,WAAW,GAAG,qBAAqB,GAAG,SAAS;IAS1E,SAAS,CAAC,4CAA4C,IAAI,qBAAqB,EAAE;IAWjF,SAAS,CAAC,eAAe,CACvB,GAAG,EAAE,qBAAqB,GAAG,oBAAoB,EACjD,OAAO,EAAE,WAAW;CAIvB"}
+{"version":3,"file":"libro-cell-service.d.ts","sourceRoot":"","sources":["../../src/cell/libro-cell-service.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EAAE,uBAAuB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGzE,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEnD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EACL,WAAW,EAEX,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,0BAA0B,CAAC;AAElC,qBACa,gBAAiB,YAAW,WAAW,EAAE,uBAAuB;IAE3E,SAAS,EAAE,QAAQ,EAAE,CAAM;IAE3B,SAAS,CAAC,QAAQ,CAAC,aAAa,EAAE,YAAY,CAAC,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IAC/E,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;IAC7E,SAAS,CAAC,2BAA2B,EAAE,GAAG,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAa;IACtF,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC;IAC5C,SAAS,CAAC,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAa;IAEtE,YAAY,EAAE,YAAY,CAAC;gBAGzB,WAAW,EAAE,WAAW,EACF,YAAY,EAAE,YAAY,EAEhD,aAAa,EAAE,YAAY,CAAC,QAAQ,CAAC,qBAAqB,CAAC,EAE3D,YAAY,EAAE,YAAY,CAAC,QAAQ,CAAC,oBAAoB,CAAC;IAQ3D,SAAS,CAAC,gCAAgC,CAAC,GAAG,EAAE,qBAAqB,GAAG,WAAW;IAOnF,UAAU;IAaV,oBAAoB,CAAC,QAAQ,EAAE,MAAM;IAQrC,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG,WAAW;IAIzD,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;IAK5C,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,SAAK,GAAG,OAAO,CAAC,SAAS,CAAC;IAqB7E,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,QAAQ,CAAC;IAqBhF,gBAAgB,CAAC,OAAO,EAAE,WAAW,GAAG,oBAAoB,GAAG,SAAS;IASxE,iBAAiB,CAAC,OAAO,EAAE,WAAW,GAAG,qBAAqB,GAAG,SAAS;IAS1E,SAAS,CAAC,4CAA4C,IAAI,qBAAqB,EAAE;IAWjF,SAAS,CAAC,eAAe,CACvB,GAAG,EAAE,qBAAqB,GAAG,oBAAoB,EACjD,OAAO,EAAE,WAAW;CAIvB"}

package/es/cell/libro-cell-service.js

@@ -60,6 +60,9 @@ export var LibroCellService = (_dec = singleton({
           metas.push(item.cellMeta);
         }
       });
+      metas.sort(function (a, b) {
+        return a.order.localeCompare(b.order);
+      });
       this.cellsMeta = metas;
     }
   }, {

package/es/components/cell-protocol.d.ts

@@ -8,6 +8,10 @@ export type CellInputBottonBlankProvider = FC<{
     cell: CellView;
 }>;
 export declare const CellInputBottonBlankProvider: unique symbol;
+export type CellOutputBottomBlankProvider = FC<{
+    cell: CellView;
+}>;
+export declare const CellOutputBottomBlankProvider: unique symbol;
 export type CellOutputVisulizationProvider = FC<{
     cell: CellView;
 }>;

package/es/components/cell-protocol.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cell-protocol.d.ts","sourceRoot":"","sources":["../../src/components/cell-protocol.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAElE,MAAM,MAAM,yBAAyB,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAE/D,eAAO,MAAM,yBAAyB,eAAsC,CAAC;AAE7E,MAAM,MAAM,4BAA4B,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAElE,eAAO,MAAM,4BAA4B,eAAyC,CAAC;AAEnF,MAAM,MAAM,8BAA8B,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAEpE,eAAO,MAAM,8BAA8B,eAA2C,CAAC;AAEvF,MAAM,MAAM,mBAAmB,GAAG,EAAE,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChF,CAAC,CAAC;AAEH,eAAO,MAAM,mBAAmB,eAAgC,CAAC"}
+{"version":3,"file":"cell-protocol.d.ts","sourceRoot":"","sources":["../../src/components/cell-protocol.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAElE,MAAM,MAAM,yBAAyB,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAE/D,eAAO,MAAM,yBAAyB,eAAsC,CAAC;AAE7E,MAAM,MAAM,4BAA4B,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAElE,eAAO,MAAM,4BAA4B,eAAyC,CAAC;AAEnF,MAAM,MAAM,6BAA6B,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAEnE,eAAO,MAAM,6BAA6B,eAA0C,CAAC;AAErF,MAAM,MAAM,8BAA8B,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAC,CAAC;AAEpE,eAAO,MAAM,8BAA8B,eAA2C,CAAC;AAEvF,MAAM,MAAM,mBAAmB,GAAG,EAAE,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChF,CAAC,CAAC;AAEH,eAAO,MAAM,mBAAmB,eAAgC,CAAC"}

package/es/components/cell-protocol.js

@@ -1,4 +1,5 @@
 export var CellExecutionTimeProvider = Symbol('CellExecutionTimeProvider');
 export var CellInputBottonBlankProvider = Symbol('CellInputBottonBlankProvider');
+export var CellOutputBottomBlankProvider = Symbol('CellOutputBottomBlankProvider');
 export var CellOutputVisulizationProvider = Symbol('CellOutputVisulizationProvider');
 export var BetweenCellProvider = Symbol('BetweenCellProvider');

package/es/components/dnd-cell-item-render.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
 import '../index.less';
 import type { CellView, DndItemProps } from '../libro-protocol.js';
+import { CellOutputBottomBlankProvider } from './cell-protocol.js';
 import { CellExecutionTimeProvider, CellInputBottonBlankProvider, CellOutputVisulizationProvider } from './cell-protocol.js';
 export declare const CellOutputContent: React.FC<{
     cell: CellView;
 }>;
 export declare const LibroCellExecutionTime: CellExecutionTimeProvider;
 export declare const LibroCellInputBottonBlank: CellInputBottonBlankProvider;
+export declare const LibroCellOutputBottomBlank: CellOutputBottomBlankProvider;
 export declare const LibroCellVisualization: CellOutputVisulizationProvider;
 export declare const DndCellItemContent: React.NamedExoticComponent<{
     cell: CellView;

package/es/components/dnd-cell-item-render.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dnd-cell-item-render.d.ts","sourceRoot":"","sources":["../../src/components/dnd-cell-item-render.tsx"],"names":[],"mappings":"AAcA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAUlF,OAAO,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAkBnE,OAAO,EACL,yBAAyB,EACzB,4BAA4B,EAC5B,8BAA8B,EAC/B,MAAM,oBAAoB,CAAC;AA4E5B,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAoC1D,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,yBAIpC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,4BAIvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,8BAIpC,CAAC;AAgKF,eAAO,MAAM,kBAAkB;UACvB,QAAQ;EA+Bd,CAAC;AAEH,eAAO,MAAM,oBAAoB,0CAgD/B,CAAC;AAyCH,eAAO,MAAM,iBAAiB,gHAA+B,CAAC"}
+{"version":3,"file":"dnd-cell-item-render.d.ts","sourceRoot":"","sources":["../../src/components/dnd-cell-item-render.tsx"],"names":[],"mappings":"AAcA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAUlF,OAAO,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAkBnE,OAAO,EAAE,6BAA6B,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EACL,yBAAyB,EACzB,4BAA4B,EAC5B,8BAA8B,EAC/B,MAAM,oBAAoB,CAAC;AAuE5B,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CA4C1D,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,yBAIpC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,4BAIvC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,6BAIxC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,8BAIpC,CAAC;AAyJF,eAAO,MAAM,kBAAkB;UACvB,QAAQ;EA+Bd,CAAC;AAEH,eAAO,MAAM,oBAAoB,0CAgD/B,CAAC;AAyCH,eAAO,MAAM,iBAAiB,gHAA+B,CAAC"}

package/es/components/dnd-cell-item-render.js

@@ -17,6 +17,7 @@ import { isCellView, LibroToolbarArea } from "../libro-protocol.js";
 import { CellSideToolbarVisible, CellTopToolbarSetting, CollapserClickActive, OutputScrollBtnVisiable } from "../libro-setting.js";
 import { ArrowDown, ArrowRight, ContentMore, DisableOutputScroll, EnableOutputScroll } from "../material-from-designer.js";
 import { hasErrorOutput } from "../output/index.js";
+import { CellOutputBottomBlankProvider } from "./cell-protocol.js";
 import { CellExecutionTimeProvider, CellInputBottonBlankProvider, CellOutputVisulizationProvider } from "./cell-protocol.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -24,7 +25,6 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
 var CellInputContent = /*#__PURE__*/memo(function CellInputContent(props) {
   var cell = props.cell;
   var observableCell = useObserve(cell);
-  var CellExecutionTime = useInject(CellExecutionTimeProvider);
   var CellInputBottonBlank = useInject(CellInputBottonBlankProvider);
   if (!(observableCell !== null && observableCell !== void 0 && observableCell.view) || !isCellView(observableCell)) {
     return null;
@@ -38,9 +38,7 @@ var CellInputContent = /*#__PURE__*/memo(function CellInputContent(props) {
   }
   return /*#__PURE__*/_jsxs("div", {
     className: "libro-cell-input-content",
-    children: [/*#__PURE__*/_jsx(CellExecutionTime, {
-      cell: cell
-    }), /*#__PURE__*/_jsx(ViewRender, {
+    children: [/*#__PURE__*/_jsx(ViewRender, {
       view: observableCell
     }), /*#__PURE__*/_jsx(CellInputBottonBlank, {
       cell: cell
@@ -83,6 +81,8 @@ export var CellOutputContent = /*#__PURE__*/memo(function CellOutputContent(prop
   var cell = props.cell;
   var observableCell = useObserve(cell);
   var CellOutputVisulization = useInject(CellOutputVisulizationProvider);
+  var CellOutputBottomBlank = useInject(CellOutputBottomBlankProvider);
+  var CellExecutionTime = useInject(CellExecutionTimeProvider);
   if (!ExecutableCellView.is(cell) || !ExecutableCellView.is(observableCell)) {
     return null;
   }
@@ -99,10 +99,14 @@ export var CellOutputContent = /*#__PURE__*/memo(function CellOutputContent(prop
   }
   return /*#__PURE__*/_jsxs("div", {
     className: "libro-cell-output-content ".concat(hasOutputsScrolled ? 'scrolled' : '', " "),
-    children: [/*#__PURE__*/_jsx(CellOutputVisulization, {
+    children: [/*#__PURE__*/_jsx(CellExecutionTime, {
+      cell: cell
+    }), /*#__PURE__*/_jsx(CellOutputVisulization, {
       cell: cell
-    }), /*#__PURE__*/_jsx(ViewRender, {
+    }), observableCell.outputArea.length > 0 && /*#__PURE__*/_jsx(ViewRender, {
       view: cell.outputArea
+    }), /*#__PURE__*/_jsx(CellOutputBottomBlank, {
+      cell: cell
     })]
   });
 });
@@ -112,11 +116,13 @@ export var LibroCellExecutionTime = /*#__PURE__*/forwardRef(function LibroCellEx
 export var LibroCellInputBottonBlank = /*#__PURE__*/forwardRef(function LibroCellInputBottonBlank() {
   return null;
 });
+export var LibroCellOutputBottomBlank = /*#__PURE__*/forwardRef(function LibroCellOutputBottomBlank() {
+  return null;
+});
 export var LibroCellVisualization = /*#__PURE__*/forwardRef(function LibroCellVisualization() {
   return null;
 });
 var CellOutput = /*#__PURE__*/forwardRef(function CellOutput(props, ref) {
-  var _cell$outputArea;
   var cell = props.cell;
   var outputRef = useRef(null);
   var outputCollapserRef = useRef(null);
@@ -160,10 +166,7 @@ var CellOutput = /*#__PURE__*/forwardRef(function CellOutput(props, ref) {
   //   };
   // }, [outputRef.current, cell, isExecutingRef]);
 
-  if (!ExecutableCellView.is(cell)) {
-    return null;
-  }
-  if (!isCellView(cell) || !ExecutableCellModel.is(cell.model) || !((_cell$outputArea = cell.outputArea) !== null && _cell$outputArea !== void 0 && _cell$outputArea.length)) {
+  if (!ExecutableCellView.is(cell) || !ExecutableCellModel.is(cell.model)) {
     return null;
   }
   var handleCellOutputCollapser = function handleCellOutputCollapser() {
@@ -190,7 +193,7 @@ var CellOutput = /*#__PURE__*/forwardRef(function CellOutput(props, ref) {
         className: 'libro-cell-output-collapser',
         ref: outputCollapserRef,
         onClick: handleCellOutputCollapser
-      }), outputScrollBtnVisiable && /*#__PURE__*/_jsx("div", {
+      }), outputScrollBtnVisiable && cell.outputArea.length > 0 && /*#__PURE__*/_jsx("div", {
         className: "libro-cell-output-scroll",
         children: /*#__PURE__*/_jsx(Tooltip, {
           title: "".concat(cell.model.hasOutputsScrolled ? '取消固定 Output 高度' : '固定 Output 高度'),

package/es/components/dnd-component/index.less

@@ -6,3 +6,7 @@
   //   overflow: auto !important;
   // }
 }
+
+.libro-dnd-cells-container {
+  padding-top: 8px;
+}

package/es/index.less

@@ -40,6 +40,7 @@
   height: 100%;
   padding: 0;
   overflow-y: auto;
+  scrollbar-gutter: stable;
 
   .libro-dnd-list-container {
     height: 100%;
@@ -83,6 +84,7 @@
 
     .mana-toolbar {
       .mana-toolbar-item {
+        height: 24px;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -408,6 +410,7 @@
   height: 41px;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
+  border-top: 1px solid var(--mana-libro-code-border-color);
 
   svg {
     position: absolute;
@@ -667,6 +670,11 @@
   .mana-menu-item {
     button {
       display: block;
+      padding: 0 12px;
+
+      .mana-menu-item-icon {
+        display: none;
+      }
     }
   }
 
@@ -758,7 +766,7 @@
 }
 
 .libro-side-tooltip {
-  text-align: start;
+  text-align: center;
 }
 
 .libro-tooltip-text {

package/es/module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAyC/C,eAAO,MAAM,WAAW,YAuErB,CAAC"}
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AA2C/C,eAAO,MAAM,WAAW,YA2ErB,CAAC"}

package/es/module.js

@@ -4,7 +4,7 @@ import { ManaModule } from '@difizen/mana-app';
 import { LibroCellModule } from "./cell/libro-cell-module.js";
 import { CollapseService, CollapseServiceFactory, CollapseServiceOption, DefaultCollapseService } from "./collapse-service.js";
 import { LibroCommandModule } from "./command/index.js";
-import { BetweenCellProvider, CellExecutionTimeProvider, CellInputBottonBlankProvider, CellOutputVisulizationProvider, LibroBetweenCellContent, LibroCellExecutionTime, LibroCellInputBottonBlank, LibroCellVisualization } from "./components/index.js";
+import { BetweenCellProvider, CellExecutionTimeProvider, CellInputBottonBlankProvider, CellOutputBottomBlankProvider, CellOutputVisulizationProvider, LibroBetweenCellContent, LibroCellExecutionTime, LibroCellInputBottonBlank, LibroCellOutputBottomBlank, LibroCellVisualization } from "./components/index.js";
 import { LibroContentModule } from "./content/index.js";
 import { LibroFormatterModule } from "./formatter/index.js";
 import { LibroContextKey } from "./libro-context-key.js";
@@ -62,6 +62,9 @@ export var LibroModule = ManaModule.create().register(BaseWorkspaceService, Virt
 }, {
   token: CellInputBottonBlankProvider,
   useValue: LibroCellInputBottonBlank
+}, {
+  token: CellOutputBottomBlankProvider,
+  useValue: LibroCellOutputBottomBlank
 }, {
   token: CellOutputVisulizationProvider,
   useValue: LibroCellVisualization

package/es/toolbar/hide-all-selector.js

@@ -59,11 +59,11 @@ export var HideAllSelectInner = function HideAllSelectInner() {
     onClick: handleChange,
     items: [{
       key: 'hideAllInputs',
-      label: l10n.t('隐藏全部Code'),
+      label: l10n.t('隐藏全部 Code'),
       disabled: !isCodeVisiable
     }, {
       key: 'hideAllOutputs',
-      label: l10n.t('隐藏全部Output'),
+      label: l10n.t('隐藏全部 Output'),
       disabled: !isOutputVisible
     }, {
       key: 'hideAll',
@@ -71,11 +71,11 @@ export var HideAllSelectInner = function HideAllSelectInner() {
       disabled: !isCodeVisiable || !isOutputVisible
     }, {
       key: 'showAllInputs',
-      label: l10n.t('显示全部Code'),
+      label: l10n.t('显示全部 Code'),
       disabled: !isCodeHidden
     }, {
       key: 'showAllOutputs',
-      label: l10n.t('显示全部Output'),
+      label: l10n.t('显示全部 Output'),
       disabled: !isOutputHidden
     }, {
       key: 'showAll',

package/es/toolbar/libro-toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"libro-toolbar.d.ts","sourceRoot":"","sources":["../../src/toolbar/libro-toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAEL,YAAY,EAEZ,mBAAmB,EAEpB,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AA0BnD,qBACa,wBAAyB,YAAW,mBAAmB;IAC5C,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC;IAC9C,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC;IAEpE,oBAAoB,CAAC,QAAQ,EAAE,eAAe,GAAG,IAAI;CA2LtD"}
+{"version":3,"file":"libro-toolbar.d.ts","sourceRoot":"","sources":["../../src/toolbar/libro-toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAEL,YAAY,EAEZ,mBAAmB,EAEpB,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AA0BnD,qBACa,wBAAyB,YAAW,mBAAmB;IAC5C,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC;IAC9C,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAC;IAEpE,oBAAoB,CAAC,QAAQ,EAAE,eAAe,GAAG,IAAI;CA2LtD"}

package/es/toolbar/libro-toolbar.js

@@ -8,6 +8,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) { var desc = {}; Object.keys(descriptor).forEach(function (key) { desc[key] = descriptor[key]; }); desc.enumerable = !!desc.enumerable; desc.configurable = !!desc.configurable; if ('value' in desc || desc.initializer) { desc.writable = true; } desc = decorators.slice().reverse().reduce(function (desc, decorator) { return decorator(target, property, desc) || desc; }, desc); if (context && desc.initializer !== void 0) { desc.value = desc.initializer ? desc.initializer.call(context) : void 0; desc.initializer = undefined; } if (desc.initializer === void 0) { Object.defineProperty(target, property, desc); desc = null; } return desc; }
 function _initializerWarningHelper(descriptor, context) { throw new Error('Decorating class property failed. Please ensure that ' + 'transform-class-properties is enabled and runs after the decorators transform.'); }
+import { isMacintosh } from '@difizen/mana-app';
 import { inject, ModalService, singleton, ToolbarContribution, useObserve } from '@difizen/mana-app';
 import { l10n } from '@difizen/mana-l10n';
 import { DocumentCommands, NotebookCommands } from "../command/index.js";
@@ -55,7 +56,7 @@ export var LibroToolbarContribution = (_dec = singleton({
             children: l10n.t('保存')
           }), /*#__PURE__*/_jsx("span", {
             className: "libro-tooltip-keybind",
-            children: "Cmd + S"
+            children: "".concat(isMacintosh ? 'Cmd' : 'Ctrl', " + S")
           })]
         }),
         group: ['group1'],
@@ -113,7 +114,7 @@ export var LibroToolbarContribution = (_dec = singleton({
             children: l10n.t('格式化代码')
           }), /*#__PURE__*/_jsx("span", {
             className: "libro-tooltip-keybind",
-            children: "Shift+Option+F"
+            children: "Shift+".concat(isMacintosh ? 'Option' : 'Alt', "+F")
           })]
         }),
         group: ['sidetoolbar1'],

package/es/toolbar/side-toolar-more-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"side-toolar-more-select.d.ts","sourceRoot":"","sources":["../../src/toolbar/side-toolar-more-select.tsx"],"names":[],"mappings":";AA2FA,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAkE5C,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAazC,CAAC"}
+{"version":3,"file":"side-toolar-more-select.d.ts","sourceRoot":"","sources":["../../src/toolbar/side-toolar-more-select.tsx"],"names":[],"mappings":";AAgGA,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAkE5C,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAazC,CAAC"}

package/es/toolbar/side-toolar-more-select.js

@@ -4,6 +4,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { isMacintosh } from '@difizen/mana-app';
 import { CommandRegistry, getOrigin, ToolbarInstance, useInject, useObserve } from '@difizen/mana-app';
 import { l10n } from '@difizen/mana-l10n';
 import { Menu, MenuContext } from '@difizen/mana-react';
@@ -12,17 +13,17 @@ import { ExecutableCellModel, ExecutableCellView } from "../cell/index.js";
 import { NotebookCommands } from "../command/index.js";
 import { MoreOutlined } from "../material-from-designer.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var codeItems = [{
   id: NotebookCommands['HideCellCode'].id,
   label: /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx("span", {
       className: "libro-menu-item-label",
       children: l10n.t('隐藏 Code')
-    }), /*#__PURE__*/_jsx("span", {
+    }), /*#__PURE__*/_jsxs("span", {
       className: "libro-menu-item-keybind",
-      children: "Cmd + '"
+      children: ["".concat(isMacintosh ? 'Cmd' : 'Ctrl', " + "), "'"]
     })]
   })
 }, {
@@ -31,9 +32,9 @@ var codeItems = [{
     children: [/*#__PURE__*/_jsx("span", {
       className: "libro-menu-item-label",
       children: l10n.t('显示 Code')
-    }), /*#__PURE__*/_jsx("span", {
+    }), /*#__PURE__*/_jsxs("span", {
       className: "libro-menu-item-keybind",
-      children: "Cmd + '"
+      children: ["".concat(isMacintosh ? 'Cmd' : 'Ctrl', " + "), "'"]
     })]
   })
 }];
@@ -45,7 +46,7 @@ var outputItems = [{
       children: l10n.t('隐藏 Output')
     }), /*#__PURE__*/_jsx("span", {
       className: "libro-menu-item-keybind",
-      children: "Cmd + O"
+      children: "".concat(isMacintosh ? 'Cmd' : 'Ctrl', " + O")
     })]
   })
 }, {
@@ -56,7 +57,7 @@ var outputItems = [{
       children: l10n.t('显示 Output')
     }), /*#__PURE__*/_jsx("span", {
       className: "libro-menu-item-keybind",
-      children: "Cmd + O"
+      children: "".concat(isMacintosh ? 'Cmd' : 'Ctrl', " + O")
     })]
   })
 }];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@difizen/libro-core",
-  "version": "0.2.35-next.0",
+  "version": "0.2.35",
   "description": "",
   "keywords": [
     "libro",
@@ -34,10 +34,10 @@
   ],
   "dependencies": {
     "@ant-design/icons": "^5.1.0",
-    "@difizen/libro-code-editor": "^0.2.35-next.0",
-    "@difizen/libro-common": "^0.2.35-next.0",
-    "@difizen/libro-shared-model": "^0.2.35-next.0",
-    "@difizen/libro-virtualized": "^0.2.35-next.0",
+    "@difizen/libro-code-editor": "^0.2.35",
+    "@difizen/libro-common": "^0.2.35",
+    "@difizen/libro-shared-model": "^0.2.35",
+    "@difizen/libro-virtualized": "^0.2.35",
     "@difizen/mana-app": "latest",
     "@difizen/mana-l10n": "latest",
     "@difizen/mana-react": "latest",

package/src/add-cell/libro-add-cell-view.tsx

@@ -36,29 +36,20 @@ export const LibroAddCell: React.FC = () => {
   };
   return (
     <div className="libro-add-cell-container default-add-cell-container">
-      {instance
-        .getCellList()
-        .sort((a, b) => {
-          if (a.order < b.order) {
-            return -1;
-          } else {
-            return 1;
-          }
-        })
-        .map((item: AddType) => {
-          return (
-            <Button
-              className="libro-add-cell-container-item "
-              key={item.name}
-              onClick={() => {
-                addCell(item.type);
-              }}
-              icon={<PlusOutlined className="libro-add-cell-icon" />}
-            >
-              {item.name}
-            </Button>
-          );
-        })}
+      {instance.getCellList().map((item: AddType) => {
+        return (
+          <Button
+            className="libro-add-cell-container-item "
+            key={item.name}
+            onClick={() => {
+              addCell(item.type);
+            }}
+            icon={<PlusOutlined className="libro-add-cell-icon" />}
+          >
+            {item.name}
+          </Button>
+        );
+      })}
     </div>
   );
 };

package/src/cell/libro-cell-service.ts

@@ -57,6 +57,7 @@ export class LibroCellService implements CellService, ApplicationContribution {
         metas.push(item.cellMeta);
       }
     });
+    metas.sort((a, b) => a.order.localeCompare(b.order));
     this.cellsMeta = metas;
   }
 

package/src/components/cell-protocol.ts

@@ -10,6 +10,10 @@ export type CellInputBottonBlankProvider = FC<{ cell: CellView }>;
 
 export const CellInputBottonBlankProvider = Symbol('CellInputBottonBlankProvider');
 
+export type CellOutputBottomBlankProvider = FC<{ cell: CellView }>;
+
+export const CellOutputBottomBlankProvider = Symbol('CellOutputBottomBlankProvider');
+
 export type CellOutputVisulizationProvider = FC<{ cell: CellView }>;
 
 export const CellOutputVisulizationProvider = Symbol('CellOutputVisulizationProvider');

package/src/components/dnd-cell-item-render.tsx

@@ -41,6 +41,7 @@ import {
 } from '../material-from-designer.js';
 import { hasErrorOutput } from '../output/index.js';
 
+import { CellOutputBottomBlankProvider } from './cell-protocol.js';
 import {
   CellExecutionTimeProvider,
   CellInputBottonBlankProvider,
@@ -50,10 +51,6 @@ import {
 const CellInputContent = memo(function CellInputContent(props: { cell: CellView }) {
   const { cell } = props;
   const observableCell = useObserve(cell);
-
-  const CellExecutionTime = useInject<CellExecutionTimeProvider>(
-    CellExecutionTimeProvider,
-  );
   const CellInputBottonBlank = useInject<CellInputBottonBlankProvider>(
     CellInputBottonBlankProvider,
   );
@@ -71,7 +68,6 @@ const CellInputContent = memo(function CellInputContent(props: { cell: CellView
   }
   return (
     <div className="libro-cell-input-content">
-      <CellExecutionTime cell={cell} />
       <ViewRender view={observableCell} />
       <CellInputBottonBlank cell={cell} />
     </div>
@@ -129,6 +125,12 @@ export const CellOutputContent: React.FC<{ cell: CellView }> = memo(
     const CellOutputVisulization = useInject<CellOutputVisulizationProvider>(
       CellOutputVisulizationProvider,
     );
+    const CellOutputBottomBlank = useInject<CellOutputBottomBlankProvider>(
+      CellOutputBottomBlankProvider,
+    );
+    const CellExecutionTime = useInject<CellExecutionTimeProvider>(
+      CellExecutionTimeProvider,
+    );
 
     if (!ExecutableCellView.is(cell) || !ExecutableCellView.is(observableCell)) {
       return null;
@@ -152,8 +154,10 @@ export const CellOutputContent: React.FC<{ cell: CellView }> = memo(
       <div
         className={`libro-cell-output-content ${hasOutputsScrolled ? 'scrolled' : ''} `}
       >
+        <CellExecutionTime cell={cell} />
         <CellOutputVisulization cell={cell} />
-        <ViewRender view={cell.outputArea} />
+        {observableCell.outputArea.length > 0 && <ViewRender view={cell.outputArea} />}
+        <CellOutputBottomBlank cell={cell} />
       </div>
     );
   },
@@ -171,6 +175,12 @@ export const LibroCellInputBottonBlank: CellInputBottonBlankProvider = forwardRe
   },
 );
 
+export const LibroCellOutputBottomBlank: CellOutputBottomBlankProvider = forwardRef(
+  function LibroCellOutputBottomBlank() {
+    return null;
+  },
+);
+
 export const LibroCellVisualization: CellOutputVisulizationProvider = forwardRef(
   function LibroCellVisualization() {
     return null;
@@ -225,14 +235,7 @@ const CellOutput: React.FC<{ cell: CellView }> = forwardRef(function CellOutput(
   //   };
   // }, [outputRef.current, cell, isExecutingRef]);
 
-  if (!ExecutableCellView.is(cell)) {
-    return null;
-  }
-  if (
-    !isCellView(cell) ||
-    !ExecutableCellModel.is(cell.model) ||
-    !cell.outputArea?.length
-  ) {
+  if (!ExecutableCellView.is(cell) || !ExecutableCellModel.is(cell.model)) {
     return null;
   }
   const handleCellOutputCollapser = () => {
@@ -259,7 +262,7 @@ const CellOutput: React.FC<{ cell: CellView }> = forwardRef(function CellOutput(
           ref={outputCollapserRef}
           onClick={handleCellOutputCollapser}
         />
-        {outputScrollBtnVisiable && (
+        {outputScrollBtnVisiable && cell.outputArea.length > 0 && (
           <div className="libro-cell-output-scroll">
             <Tooltip
               title={`${

package/src/components/dnd-component/index.less

@@ -6,3 +6,7 @@
   //   overflow: auto !important;
   // }
 }
+
+.libro-dnd-cells-container {
+  padding-top: 8px;
+}

package/src/index.less

@@ -40,6 +40,7 @@
   height: 100%;
   padding: 0;
   overflow-y: auto;
+  scrollbar-gutter: stable;
 
   .libro-dnd-list-container {
     height: 100%;
@@ -83,6 +84,7 @@
 
     .mana-toolbar {
       .mana-toolbar-item {
+        height: 24px;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -408,6 +410,7 @@
   height: 41px;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
+  border-top: 1px solid var(--mana-libro-code-border-color);
 
   svg {
     position: absolute;
@@ -667,6 +670,11 @@
   .mana-menu-item {
     button {
       display: block;
+      padding: 0 12px;
+
+      .mana-menu-item-icon {
+        display: none;
+      }
     }
   }
 
@@ -758,7 +766,7 @@
 }
 
 .libro-side-tooltip {
-  text-align: start;
+  text-align: center;
 }
 
 .libro-tooltip-text {

package/src/module.ts

@@ -14,10 +14,12 @@ import {
   BetweenCellProvider,
   CellExecutionTimeProvider,
   CellInputBottonBlankProvider,
+  CellOutputBottomBlankProvider,
   CellOutputVisulizationProvider,
   LibroBetweenCellContent,
   LibroCellExecutionTime,
   LibroCellInputBottonBlank,
+  LibroCellOutputBottomBlank,
   LibroCellVisualization,
 } from './components/index.js';
 import { LibroContentModule } from './content/index.js';
@@ -93,6 +95,10 @@ export const LibroModule = ManaModule.create()
       token: CellInputBottonBlankProvider,
       useValue: LibroCellInputBottonBlank,
     },
+    {
+      token: CellOutputBottomBlankProvider,
+      useValue: LibroCellOutputBottomBlank,
+    },
     {
       token: CellOutputVisulizationProvider,
       useValue: LibroCellVisualization,

package/src/toolbar/hide-all-selector.tsx

@@ -78,12 +78,12 @@ export const HideAllSelectInner: React.FC = () => {
       items={[
         {
           key: 'hideAllInputs',
-          label: l10n.t('隐藏全部Code'),
+          label: l10n.t('隐藏全部 Code'),
           disabled: !isCodeVisiable,
         },
         {
           key: 'hideAllOutputs',
-          label: l10n.t('隐藏全部Output'),
+          label: l10n.t('隐藏全部 Output'),
           disabled: !isOutputVisible,
         },
         {
@@ -93,12 +93,12 @@ export const HideAllSelectInner: React.FC = () => {
         },
         {
           key: 'showAllInputs',
-          label: l10n.t('显示全部Code'),
+          label: l10n.t('显示全部 Code'),
           disabled: !isCodeHidden,
         },
         {
           key: 'showAllOutputs',
-          label: l10n.t('显示全部Output'),
+          label: l10n.t('显示全部 Output'),
           disabled: !isOutputHidden,
         },
         {

package/src/toolbar/libro-toolbar.tsx

@@ -1,4 +1,5 @@
 import type { ToolbarRegistry } from '@difizen/mana-app';
+import { isMacintosh } from '@difizen/mana-app';
 import {
   inject,
   ModalService,
@@ -48,7 +49,7 @@ export class LibroToolbarContribution implements ToolbarContribution {
       tooltip: (
         <div className="libro-tooltip">
           <span className="libro-tooltip-text">{l10n.t('保存')}</span>
-          <span className="libro-tooltip-keybind">Cmd + S</span>
+          <span className="libro-tooltip-keybind">{`${isMacintosh ? 'Cmd' : 'Ctrl'} + S`}</span>
         </div>
       ),
 
@@ -100,7 +101,7 @@ export class LibroToolbarContribution implements ToolbarContribution {
       tooltip: (
         <div className="libro-side-tooltip">
           <span className="libro-tooltip-text">{l10n.t('格式化代码')}</span>
-          <span className="libro-tooltip-keybind">Shift+Option+F</span>
+          <span className="libro-tooltip-keybind">{`Shift+${isMacintosh ? 'Option' : 'Alt'}+F`}</span>
         </div>
       ),
 

package/src/toolbar/side-toolar-more-select.tsx

@@ -1,4 +1,5 @@
 import type { Toolbar } from '@difizen/mana-app';
+import { isMacintosh } from '@difizen/mana-app';
 import {
   CommandRegistry,
   getOrigin,
@@ -23,7 +24,9 @@ const codeItems: LibroSideToolbarMenuItemType[] = [
     label: (
       <>
         <span className="libro-menu-item-label">{l10n.t('隐藏 Code')}</span>
-        <span className="libro-menu-item-keybind">Cmd + &apos;</span>
+        <span className="libro-menu-item-keybind">
+          {`${isMacintosh ? 'Cmd' : 'Ctrl'} + `}&apos;
+        </span>
       </>
     ),
   },
@@ -32,7 +35,9 @@ const codeItems: LibroSideToolbarMenuItemType[] = [
     label: (
       <>
         <span className="libro-menu-item-label">{l10n.t('显示 Code')}</span>
-        <span className="libro-menu-item-keybind">Cmd + &apos;</span>
+        <span className="libro-menu-item-keybind">
+          {`${isMacintosh ? 'Cmd' : 'Ctrl'} + `}&apos;
+        </span>
       </>
     ),
   },
@@ -44,7 +49,7 @@ const outputItems: LibroSideToolbarMenuItemType[] = [
     label: (
       <>
         <span className="libro-menu-item-label">{l10n.t('隐藏 Output')}</span>
-        <span className="libro-menu-item-keybind">Cmd + O</span>
+        <span className="libro-menu-item-keybind">{`${isMacintosh ? 'Cmd' : 'Ctrl'} + O`}</span>
       </>
     ),
   },
@@ -53,7 +58,7 @@ const outputItems: LibroSideToolbarMenuItemType[] = [
     label: (
       <>
         <span className="libro-menu-item-label">{l10n.t('显示 Output')}</span>
-        <span className="libro-menu-item-keybind">Cmd + O</span>
+        <span className="libro-menu-item-keybind">{`${isMacintosh ? 'Cmd' : 'Ctrl'} + O`}</span>
       </>
     ),
   },