Documentation

Ae2DriveScreen

176×201 ME drive: 2×5 storage cell slots, priority tab and player inventory.

ME 驱动器

物品栏

import type { ScreenSlot } from "@tennantite/ui";
import { Ae2DriveScreen } from "./index";

const STORAGE_ITEMS: ScreenSlot[] = [
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
  { count: 1, icon: "emerald", tooltip: "存储元件" },
];

/**
 * Ae2DriveScreen 预览用例：10 个存储元件槽。
 */
export function Ae2DriveScreenDemo() {
  return (
    <Ae2DriveScreen
      items={STORAGE_ITEMS}
      mainItems={[
        { count: 64, icon: "stone-block", tooltip: "石头" },
        { count: 16, icon: "emerald", tooltip: "绿宝石" },
      ]}
    />
  );
}

Install

$pnpm add @tennantite/ae2

npm installs the compiled package; use the CLI copy above to adapt the source.

Source

packages/ae2/src/ae2-drive-screen/index.tsx

The npm package keeps the source tree, so you can copy and adapt it directly.