Documentation
AnvilScreen
110×16 name input, item / material / result slots and level cost.
修理
1 级
import { useState } from "react";
import { AnvilScreen } from "./index";
/**
* AnvilScreen 预览用例(规格 §6.2)
*/
export function AnvilScreenDemo() {
const [name, setName] = useState("铁剑");
return (
<AnvilScreen
item={{ icon: "sword", tooltip: "铁剑" }}
levelCost={1}
material={{ count: 1, icon: "iron-ingot", tooltip: "铁锭" }}
onNameChange={setName}
result={{ icon: "sword", tooltip: "铁剑(已修复)" }}
title="修理"
value={name}
/>
);
}
Install
CLI copy
$npx shadcn add @tennantite/anvil-screennpm install
$pnpm add @tennantite/uinpm installs the compiled package; use the CLI copy above to adapt the source.
Source
packages/ui/src/screens/containers/anvil-screen/index.tsxThe npm package keeps the source tree, so you can copy and adapt it directly.