文档目录

ME 端口界面

IO 端口：io_port.png 211×166 + 3 槽升级条，2×3 输入/输出元件槽与操作模式按钮。

全屏预览预览页不进入搜索引擎索引

IO 端口

物品栏

组成

这些是可直接组合的组件；Block 只是把它们按原版坐标放在一起。

代码

import { Ae2IoPortScreen } from "./index";

/**
 * Ae2IoPortScreen 预览用例：左入右出，附加速卡。
 */
export function Ae2IoPortScreenDemo() {
  return (
    <Ae2IoPortScreen
      hotbarItems={Array.from({ length: 9 }, (_, index) => ({ icon: index % 2 ? "charcoal" : "iron-ingot" }))}
      inputCells={[
        { icon: "emerald", tooltip: "1k 存储元件" },
        { icon: "emerald", tooltip: "4k 存储元件" },
      ]}
      mainItems={Array.from({ length: 15 }, (_, index) => ({ icon: index % 2 ? "gold-ingot" : "iron-ingot" }))}
      onOperationModeClick={() => {}}
      outputCells={[{ icon: "diamond", tooltip: "已清空元件" }]}
      upgrades={[{ icon: "emerald", tooltip: "加速卡" }]}
    />
  );
}