文档目录
Mod 图标按钮
Mod 图标按钮:几何由调用方给出,图标走纹理类或节点;悬停态走 CSS。
import { ae2SpriteMeta } from "@tennantite/textures";
import { ModSprite } from "../mod-sprite/index";
import { ModIconButton } from "./index";
const ICON = { height: 16, width: 16, x: 0, y: 0 };
export function ModIconButtonDemo() {
return (
<div className="relative h-16 w-32">
<ModIconButton
icon={<ModSprite sprite={ae2SpriteMeta.states} src={ICON} />}
label="设置"
left={0}
top={0}
/>
<ModIconButton
icons={[
<ModSprite key="a" sprite={ae2SpriteMeta.states} src={ICON} />,
<ModSprite key="b" sprite={ae2SpriteMeta.states} src={{ ...ICON, x: 16 }} />,
]}
label="多态"
left={28}
state={1}
top={0}
/>
</div>
);
}
安装
$pnpm add @tennantite/commonnpm 方式安装编译产物;需要改造源码请用上方的 CLI 拷贝安装。
源码
packages/mods-core/src/shared/mod-icon-button/index.tsxnpm 包保留源码目录,可直接复制改造。