Component showcase

A typical mining trip earns a stack of <McIcon id="iron_ingot" />,
plus the occasional <McIcon id="diamond" /> if you're lucky.
At <McIcon id="netherite_ingot" size={32} /> you've made it.

Press <Keys keys="Shift + F3" /> for chunk borders.
Hold <Keys keys={['Ctrl', 'Click']} /> to multi-select.

Spawn is in the <DimensionTag dim="overworld" />.
Fortresses live in the <DimensionTag dim="nether" />.
End-game floats in the <DimensionTag dim="end" />.

Spawn portal: <Coords x={100} y={64} z={-200} dim="overworld" />
End-city marker: <Coords x={1280} y={75} z={-960} dim="end" />

- <RankBadge rank="visitor" /> Day-one — gray gradient
- <RankBadge rank="member" /> 20h played — green gradient
- <RankBadge rank="citizen" /> 100h played — cyan gradient
- <RankBadge rank="myth" /> 500h played — purple gradient
- <RankBadge rank="legend" /> 1000h played — gold gradient
- <RankBadge rank="helper" /> staff — yellow gradient
- <RankBadge rank="moderator" /> staff — magenta gradient
- <RankBadge rank="admin" /> staff — red gradient
- <RankBadge rank="owner" /> Mothra — deep red gradient
- <RankBadge name="Beta Tester" from="#7785ff" to="#3a4ebd" /> custom gradient

`/pay` carries a <Cooldown duration="5s" /> cooldown.
Mob kills pay out coins, capped at <Cooldown duration="3-8s" />.
PvP kills pay coins with <Cooldown duration="10 min/victim" /> per target.
`/balance` is <Cooldown duration="instant" />.

Last Call kicks in below <HealthBar value={5} max={20} />.
Mending sips XP — keep <XpBar level={30} progress={0.4} /> minimum on hand.

<Enchant
  name="Last Call"
  maxLevel={3}
  appliesTo={['sword', 'axe']}
  signature
  conflictsWith={['Sharpness V']}
>
  Damage scales up as your HP drops. Below 25% HP, every hit lands at +60% (Lvl I), +90% (II), or +120% (III). Built for the "I'm cooked anyway" comeback swing.
</Enchant>

<Command
  cmd="/pay"
  description="Send coins to another player. Coins move instantly; the recipient gets a chat notification."
  args={[
    { name: 'player', desc: 'recipient name (case-insensitive)' },
    { name: 'amount', desc: 'coins to send' },
    { name: 'reason', desc: 'optional message attached to the transfer', optional: true },
  ]}
  examples={['/pay Mothra 500', '/pay Mothra 100 thanks for the help']}
  permission="member"
/>

<ChatExample>
  <ChatLine rank="legend" name="Mothra">just hit max vault slots — 810 grid is unreal</ChatLine>
  <ChatLine rank="member" name="Frank">how many hours to unlock that?</ChatLine>
  <ChatLine rank="legend" name="Mothra">200hrs gets you Legend, vault slots come with it</ChatLine>
  <ChatLine system>★ Mothra has reached the Legend rank.</ChatLine>
</ChatExample>

<GearSet
  name="Nether Affinity"
  pieces={['netherite_helmet', 'netherite_chestplate', 'netherite_leggings', 'netherite_boots']}
  bonuses={[
    { count: 2, effect: 'Fire Resistance while in the Nether' },
    { count: 4, effect: '+25% damage dealt, −15% damage taken in Nether' },
  ]}
  description="Drops piecewise from Nether fortresses; assemble all four to unlock the full kit."
/>

<RankComparison
  ranks={['visitor', 'member', 'citizen', 'myth', 'legend']}
  features={[
    { label: 'Hours required', values: { visitor: '0h', member: '20h', citizen: '100h', myth: '500h', legend: '1000h' } },
    { label: 'Vault slots',     values: { visitor: '54', member: '162', citizen: '324', myth: '486', legend: '810' } },
    { label: 'Recovery window',  values: { visitor: '5 min', member: '10 min', citizen: '15 min', myth: '30 min', legend: '60 min' } },
    { label: 'Brand chat color', values: { visitor: false, member: true, citizen: true, myth: true, legend: true } },
    { label: 'Pet teleport',    values: { visitor: false, member: false, citizen: false, myth: false, legend: true } },
  ]}
/>

<CommandSequence>
  <Step cmd="/shop create" note="Stand on the chest you want to sell from before running this." />
  <Step cmd="/shop price 64 100" desc="Set 64 items per stack, 100 coins each." />
  <Step cmd="/balance" desc="Check what you've earned so far." />
  <Step cmd="/withdraw 1000" desc="Pull 1000 coins out as a banknote you can carry or trade." />
</CommandSequence>

<EnchantConflicts
  groups={[
    ['Sharpness', 'Smite', 'Bane of Arthropods'],
    ['Protection', 'Fire Protection', 'Blast Protection', 'Projectile Protection'],
    ['Infinity', 'Mending'],
    ['Riptide', 'Loyalty', 'Channeling'],
  ]}
  caption="Pick one per row — the rest go on a different item or get re-rolled."
/>

<MobCard
  name="Pillager Captain"
  id="pillager_spawn_egg"
  hp={24}
  damage={5}
  drops={['emerald', 'crossbow', 'ominous_banner']}
  spawns="Pillager Outposts"
  description="The banner-bearing leader. Killing one triggers a Raid in any nearby village within 100 blocks."
/>

<Recipe
  ingredients={[
    ['iron_ingot', 'iron_ingot', 'iron_ingot'],
    [null,        'stick',       null],
    [null,        'stick',       null],
  ]}
  output="iron_pickaxe"
  caption="Standard iron pickaxe — same as vanilla."
/>

<Recipe
  ingredients={[
    ['oak_planks', 'oak_planks', null],
    ['oak_planks', 'oak_planks', null],
    ['oak_planks', 'oak_planks', null],
  ]}
/>

<BrewRecipe
  ingredients={['wheat:3', 'sugar:1']}
  cookTime="8 min"
  distill={2}
  age={{ wood: 'oak', minutes: 30 }}
  output="potion"
  caption="Signature Pale Ale — 7% ABV in-fiction."
/>

<BrewRecipe
  ingredients={['apple:2', 'sugar:1']}
  cookTime="4 min"
  output="potion"
  caption="Apple cider — fast, no aging required."
/>

<LootTable>
  <LootTier rarity="common">
    <Loot id="iron_ingot" count="2-5" weight={50} />
    <Loot id="bread" count="1-3" weight={30} />
    <Loot id="bone" count="1-2" weight={20} />
  </LootTier>
  <LootTier rarity="uncommon">
    <Loot id="gold_ingot" count="1-2" weight={15} />
    <Loot id="enchanted_golden_apple" weight={3} />
  </LootTier>
  <LootTier rarity="rare">
    <Loot id="diamond" count="1-2" weight={5} />
    <Loot id="enchanted_book" weight={3} />
  </LootTier>
  <LootTier rarity="legendary">
    <Loot id="netherite_ingot" weight={1} />
    <Loot id="totem_of_undying" weight={1} />
  </LootTier>
</LootTable>

<TierLadder>
  <Tier id="wooden_sword" stats={{ Damage: 5, Durability: 60 }} />
  <Tier id="stone_sword"  stats={{ Damage: 6, Durability: 132 }} />
  <Tier id="iron_sword"   stats={{ Damage: 7, Durability: 251 }} />
  <Tier id="diamond_sword" stats={{ Damage: 8, Durability: 1562 }} />
  <Tier id="netherite_sword" stats={{ Damage: 9, Durability: 2032 }} highlight />
</TierLadder>

<Hotbar
  slots={[
    'netherite_sword',
    'netherite_pickaxe',
    'netherite_axe',
    'crossbow',
    'cooked_beef',
    'golden_apple',
    'totem_of_undying',
    'ender_pearl',
    'water_bucket',
  ]}
  selected={0}
/>

<Inventory
  slots={[
    'iron_ingot', 'gold_ingot', 'diamond', null, 'emerald', null, null, null, null,
    'cobblestone', 'oak_planks', 'glass', null, null, null, null, null, null,
    'bread', 'cooked_beef', 'golden_apple', null, null, null, null, null, null,
  ]}
  hotbar={[
    'netherite_sword',
    'netherite_pickaxe',
    'crossbow',
    null,
    'cooked_beef',
    null,
    null,
    null,
    'totem_of_undying',
  ]}
/>

<Trade
  give={[{ id: 'emerald', count: 5 }, { id: 'paper', count: 12 }]}
  receive={{ id: 'enchanted_book' }}
  villager="librarian"
  level="apprentice"
/>

<Trade
  give={[{ id: 'emerald', count: 32 }]}
  receive={{ id: 'diamond_pickaxe' }}
  villager="weaponsmith"
  level="master"
/>

<PortalDiagram overworld={{ x: 1280, y: 64, z: -2048 }} />

<PortalDiagram nether={{ x: 100, y: 64, z: -100 }} />

<YLevelChart>
  <Layer y={-58} label="Diamond peaks" item="diamond" />
  <Layer y={-32} label="Deepslate transition" />
  <Layer y={11}  label="Diorite / granite / andesite" />
  <Layer y={32}  label="Iron + coal common" item="iron_ingot" />
  <Layer y={62}  label="Sea level" item="water_bucket" />
  <Layer y={128} label="Stone caps end" />
</YLevelChart>

<SignBoard wood="oak" lines={[
  'Welcome to',
  "Mothra's Shop",
  '— bring emeralds —',
  '/warp mothra',
]} caption="Front-of-shop sign." />

<SignBoard wood="dark_oak" lines={[
  'TAVERN',
  'open daily',
  '6pm – 2am',
  '/warp tavern',
]} />

<ChestLayout label="Starter kit" slots={[
  'iron_sword', 'iron_pickaxe', 'iron_axe', 'iron_shovel', null, 'cooked_beef', 'bread', 'water_bucket', 'compass',
  'oak_planks', 'crafting_table', 'furnace', null, null, null, null, null, null,
  'oak_log', 'cobblestone', 'torch', null, null, null, null, null, null,
]} />

<TagCloud tags={[
  { label: 'Crossplay',     href: '/wiki/crossplay',     color: 'red' },
  { label: 'Worldgen',      href: '/wiki/worldgen',      color: 'yellow' },
  { label: 'Combat',        href: '/wiki/combat',        color: 'blue' },
  { label: 'Economy',       href: '/wiki/economy',       color: 'red' },
  { label: 'Storage',       href: '/wiki/storage',       color: 'yellow' },
  { label: 'Tavern',        href: '/wiki/tavern',        color: 'blue' },
  { label: 'Enchantments',  href: '/wiki/enchantments' },
  { label: 'Automation',    href: '/wiki/automation' },
  { label: 'Travel',        href: '/wiki/travel' },
]} />