Documentation

IfSlot

IF slot: Titanium 18×18 frame plus the SidedInventory two-tone mask (20×20 α.25 / 16×16 α.5); filter slots use firework colors.

import { IfSlot } from "./index";

export function IfSlotDemo() {
  return (
    <div className="relative h-40 w-64">
      <IfSlot color="orange" item={{ count: 3, icon: "diamond" }} label="demo-slot" left={8} top={8} />
      <IfSlot color="cyan" label="demo-empty" left={40} top={8} />
      <IfSlot color="lime" frame="filter" item={{ icon: "wheat" }} label="demo-filter" left={8} top={40} />
    </div>
  );
}

Install

$pnpm add @tennantite/industrialforegoing

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

Source

packages/industrialforegoing/src/if-slot/index.tsx

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