4e:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 4f:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 50:T1bdc,import { useState } from 'react' import { Card, RowCard } from '../surface' import { Stack, Row, Grid } from '../layout' import { Heading, Text, Eyebrow } from '../text' import { Stat } from '../readout' import { Badge, Blob } from '../media' import { Progress } from '../progress' import { Button } from '../Button' import { Table } from '../table' import { Icon } from '../Icon' const OTHER_LEADERS = [ { id: '1', name: 'PixelWizard', score: 48210 }, { id: '3', name: 'Bouncer', score: 38455 }, { id: '4', name: 'ClayFace', score: 30102 }, ] // One uniform shape across every slot (unused numbers default to 0) so an // item's stats read directly off `ITEMS.find(...)` with no per-slot narrowing. const ITEMS = [ { id: 'sword', name: 'Iron Sword', desc: '+15 dmg · costs 12 HP', icon: 'sword', tone: 'orange' as const, slot: 'weapon' as const, atk: 15, hpCost: 12, block: 0, heal: 0, xpBoost: 0 }, { id: 'wand', name: 'Clay Wand', desc: '+24 dmg · costs 20 HP', icon: 'wand', tone: 'purple' as const, slot: 'weapon' as const, atk: 24, hpCost: 20, block: 0, heal: 0, xpBoost: 0 }, { id: 'shield', name: 'Oak Shield', desc: 'Blocks 10 HP of recoil', icon: 'shield', tone: 'blue' as const, slot: 'armor' as const, atk: 0, hpCost: 0, block: 10, heal: 0, xpBoost: 0 }, { id: 'potion', name: 'Health Potion', desc: 'Restores 30 HP · single use', icon: 'drop', tone: 'pink' as const, slot: 'consumable' as const, atk: 0, hpCost: 0, block: 0, heal: 30, xpBoost: 0 }, { id: 'charm', name: 'XP Charm', desc: '+10 XP per spell cast', icon: 'sparkle', tone: 'yellow' as const, slot: 'accessory' as const, atk: 0, hpCost: 0, block: 0, heal: 0, xpBoost: 10 }, ] /** An example game HUD: score, health and XP bars, an inventory, and a * leaderboard. Equipping a weapon or armor changes what Attack costs and * deals, the potion and charm act directly on the bars, and the score you * earn updates your own live rank in the leaderboard below. */ export function GameBlock() { const [hp, setHp] = useState(72) const [xp, setXp] = useState(40) const [score, setScore] = useState(41980) const [weapon, setWeapon] = useState('sword') const [armor, setArmor] = useState(null) const [accessory, setAccessory] = useState(null) const [potionUsed, setPotionUsed] = useState(false) const equippedWeapon = ITEMS.find((i) => i.id === weapon) const equippedArmor = ITEMS.find((i) => i.id === armor) const equippedAccessory = ITEMS.find((i) => i.id === accessory) function attack() { const cost = Math.max(4, (equippedWeapon?.hpCost ?? 10) - (equippedArmor?.block ?? 0)) setHp((h) => Math.max(0, h - cost)) setScore((s) => s + (equippedWeapon?.atk ?? 8) * 10) } function cast() { setXp((x) => Math.min(100, x + 20 + (equippedAccessory?.xpBoost ?? 0))) } function heal() { setHp((h) => Math.min(100, h + 25)) } function toggleItem(item: (typeof ITEMS)[number]) { if (item.slot === 'weapon') setWeapon((w) => (w === item.id ? null : item.id)) else if (item.slot === 'armor') setArmor((a) => (a === item.id ? null : item.id)) else if (item.slot === 'accessory') setAccessory((a) => (a === item.id ? null : item.id)) else if (!potionUsed) { setHp((h) => Math.min(100, h + item.heal)) setPotionUsed(true) } } // "You" carries the live score, so a good Attack visibly moves your rank. const leaders = [...OTHER_LEADERS, { id: '2', name: 'You', score }] .sort((a, b) => b.score - a.score) .map((l, i) => ({ ...l, rank: String(i + 1) })) return (

Level 7 · Cushion Caverns Boss fight 1,240 Health {hp} / 100 XP to next level {xp} / 100 Inventory {ITEMS.map((item) => { const equipped = item.slot === 'weapon' ? weapon === item.id : item.slot === 'armor' ? armor === item.id : item.slot === 'accessory' ? accessory === item.id : potionUsed const disabled = item.slot === 'consumable' && potionUsed return ( toggleItem(item)}> {item.name} {item.desc} {item.slot === 'consumable' ? (potionUsed ? 'Used' : 'Use') : equipped ? 'Equipped' : 'Equip'} ) })} Leaderboard r.id} columns={[ { key: 'rank', header: '#', render: (r) => {r.rank} }, { key: 'name', header: 'Player', render: (r) => {r.name} }, { key: 'score', header: 'Score', align: 'right', mono: true, render: (r) => {r.score.toLocaleString()} }, ]} /> ) } 4d:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4e",null,{"namespace":"@1st-pouf","registryDependencies":["https://1st-pouf.worksonmy.dev/r/base.json","https://1st-pouf.worksonmy.dev/r/button.json","https://1st-pouf.worksonmy.dev/r/icon.json","https://1st-pouf.worksonmy.dev/r/layout.json","https://1st-pouf.worksonmy.dev/r/media.json","https://1st-pouf.worksonmy.dev/r/progress.json","https://1st-pouf.worksonmy.dev/r/readout.json","https://1st-pouf.worksonmy.dev/r/surface.json","https://1st-pouf.worksonmy.dev/r/table.json","https://1st-pouf.worksonmy.dev/r/text.json"]}]]}],null]}],["$","$L4f",null,{"files":[{"path":"registry/pouf/blocks/game.tsx","content":"$50","type":"registry:block","target":"components/pouf/blocks/game.tsx"}],"className":"h-[70svh] min-h-80"}]]}]