brainrotscript/examples/VibeCounter.jsx

🧠 A brainrot programming language that compiles to JavaScript - because why write normal code when you can write code that's absolutely sending you? 💀

// 🧠 BrainrotScript React Component Example
import React, { useState } from 'react';

function VibeCounter() {
    const [vibes, setVibes] = useState(0);
    const [isLit, setIsLit] = useState(false);

    const addVibes = () => {
        const newVibes = vibes + 1;
        setVibes(newVibes);
        
        if (newVibes > 10) {
            setIsLit(true);
        }
    };

    const subtractVibes = () => {
        const newVibes = Math.max(0, vibes - 1);
        setVibes(newVibes);
        
        if (newVibes <= 10) {
            setIsLit(false);
        }
    };

    const getVibeMessage = () => {
        if (vibes === 0) {
            return "Down bad fr 😭";
        } else if (vibes < 5) {
            return "Mid energy 😐";
        } else if (vibes < 10) {
            return "Getting fire 🔥";
        } else {
            return "ABSOLUTELY SENDING ME! 💀";
        }
    };

    return (
        <div className={`vibe-counter ${isLit ? 'lit' : 'default'}`}>
            <h1>🧠 BrainrotScript React App</h1>
            <div className="vibe-display">
                <h2>Current Vibes: {vibes}</h2>
                <p className="vibe-message">{getVibeMessage()}</p>
                <div className="vibe-status">
                    {isLit ? "🔥 IT'S LIT!" : "😴 Still loading..."}
                </div>
            </div>
            
            <div className="controls">
                <button onClick={addVibes} className="add-vibes">
                    Add Vibes 📈
                </button>
                <button onClick={subtractVibes} className="subtract-vibes">
                    Remove Vibes 📉
                </button>
            </div>

            <div className="stats">
                <p>Status: {isLit ? "Absolutely sending! 💀" : "Not quite there yet 🤔"}</p>
                <p>Vibe Level: {vibes > 15 ? "LEGENDARY" : vibes > 10 ? "ELITE" : vibes > 5 ? "DECENT" : "NEEDS WORK"}</p>
            </div>
        </div>
    );
}

export default VibeCounter;