Minecraft button with original textures, glyphs, and click feedback.
Preview
To run this copied example, install these items using the linked CLI or manual instructions:
Usage
Import Button from your installed components/ui/button module. The primary example uses scale 2: its default 200 by 20 logical pixels render at 400 by 40 browser pixels.
Activate a button to hear the original Minecraft click.
Composition
Keep a visible label for the default button. Use the retained playground to change the label and width, activate the button and compare its disabled state.
Installation
Component source
This is the component implementation. Its supporting styles, helpers and resources are also required. See complete manual installation.
"use client";
import { Button as ButtonPrimitive } from "@base-ui/react/button";
import { cva } from "class-variance-authority";
import type { VariantProps } from "class-variance-authority";
// Primitive composition: shadcn-ui/ui apps/v4/registry/bases/base/ui/button.tsx (MIT).
import * as React from "react";
import { isPortal } from "react-is";
import { minecraftGlyphs } from "./minecraft-font";
import {
isMinecraftEmptyChild,Interactive playground
INTERACTIVE
DISABLED
Vanilla button