Skip to content
/ cup Public

Cup πŸ«– β€” A lightweight Cascading Markup language that fuses HTML, nested CSS, and JavaScript into one elegant file to craft dynamic interfaces.

License

Notifications You must be signed in to change notification settings

siguici/cup

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

17 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Cup πŸ«– β€” The Cascading Markup Language

Cup is a lightweight, flexible, and elegant templating engine written in V. It combines the structure of HTML, the cascading power of CSS, and the interactivity of JavaScript/TypeScript into a single, clean, and expressive syntax β€” without sacrificing compatibility.

✨ Write once. Render fast. See clearly.


πŸš€ Features

  • βœ… HTML/CSS/JS-inspired syntax β€” fully compatible with standard tags and attributes
  • πŸ’‘ Cascading and nested blocks β€” like CSS, but across markup and logic
  • 🧠 Scoped styles and inline logic β€” embed behavior within elements
  • πŸ”„ Dynamic templating β€” simple conditionals, loops, and reactive variables (planned)
  • βš™οΈ Transpiles to pure HTML/CSS/JS β€” no runtime dependencies
  • πŸ¦• Built in V β€” minimal, blazing fast, cross-platform

πŸ“¦ Installation

Using VPM (V Package Manager)

v install siguici.cup

Or directly from GitHub:

v install github.com/siguici/cup

πŸ§ͺ Quick Example

button {
  Click me
  style {
    @import './global.css';

    background: var(--primary-color);
    color: white;
    padding: 1em;
    border-radius: 8px;

    &:hover {
      background: var(--secondary-color);
    }
  }
  script {
    this.addEventListener('click', () => {
      alert("Hello from Cup!")
    })
  }
}

Compiles to:

<button onclick="alert('Hello from Cup!')" style="background:#7878ff;color:white;padding:1em;border-radius:8px;">
  Click me
</button>

πŸ”§ Usage in V

import siguici.cup

fn main() {
  html := cup.render_file('examples/hello.cup') or {
    eprintln('Error: $err')
    return
  }
  println(html)
}

πŸ—ΊοΈ Roadmap

  • Basic lexer/parser
  • Embedded style and script blocks
  • HTML transpilation
  • Conditionals (@if, @else)
  • Loops (@for, @each)
  • Reactive variables (@var, @watch)
  • Live preview / runtime renderer (optional)
  • Plugin system

🀝 Contributing

Pull requests, feedback, ideas, and questions are welcome!

To contribute:

  1. Fork this repo
  2. Clone locally and create a new branch
  3. Make your changes
  4. Open a pull request

πŸ“œ License

MIT Β© Sigui KessΓ© Emmanuel

About

Cup πŸ«– β€” A lightweight Cascading Markup language that fuses HTML, nested CSS, and JavaScript into one elegant file to craft dynamic interfaces.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

Packages

No packages published

Languages