https://github.com/milancermak/graffiti

A Cairo library for building XML based documents
https://github.com/milancermak/graffiti

cairo html starknet svg xml

Last synced: 27 days ago
JSON representation

A Cairo library for building XML based documents

• Host: GitHub
• URL: https://github.com/milancermak/graffiti
• Owner: milancermak
• License: apache-2.0
• Created: 2023-09-21T15:46:52.000Z (about 1 year ago)
• Default Branch: master
• Last Pushed: 2024-01-27T23:20:48.000Z (11 months ago)
• Last Synced: 2024-05-20T03:18:21.446Z (7 months ago)
• Topics: cairo, html, starknet, svg, xml
• Language: Cairo
• Homepage:
• Size: 133 KB
• Stars: 8
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-cairo - `graffiti` - A Cairo library for building XML based documents (Libraries)
• awesome-starknet - graffiti - Library for building XML based documents (SVG, HTML, RSS). (Additional developer resources)

README

        
# Graffiti

![tests](https://github.com/milancermak/graffiti/actions/workflows/tests.yml/badge.svg)

Graffiti is a Cairo library for building XML based documents - think SVG, HTML, RSS. If it has a ``, you can use Graffiti.

![](./graffiti.png)

## Installation

Add the package as a dependency in Scarb.toml:

```toml

[dependencies]

graffiti = { git = "https://github.com/milancermak/graffiti.git" }

```

## Usage

The main building block of a XML document is a tag. In Graffiti, it's represented by the `Tag` type:

```rust

let div: Tag = TagImpl::new("div");

```

A tag can have any number of `Attributes` assigned to it:

```rust

let div: Tag = TagImpl::new("div").attr("id", "hero").attr("class", "text-center");

```

A tag element can hold textual content:

```rust

let paragraph: Tag = TagImpl::new("p").content("Lorem ipsum dolor sit amet");

```

XML tags can be combined into a tree to get the desired structure:

```rust

let paragraph: Tag = TagImpl::new("p").content("Lorem ipsum dolor sit amet");

let text: Tag: TagImpl::new("text").insert(p);

let h1: Tag = TagImpl::new("h1").content("Graffiti");

let h2: Tag = TagImpl::new("h2").content("An awesome Cairo lib for building XML documents").

let body: Tag = TagImpl::new("body").insert("h1").insert("h2").insert("text");

// the outcome is the following structure:

// 
Graffiti
An awesome Cairo lib for building XML documents
Lorem ipsum dolor sit amet

```


Note that Graffiti does not place any constraints on the names or values of the tags or attributes. Any text (Cairo's `ByteArray` type) is accepted. In future versions, there might be specific submodules for building HTML or SVG that do some kind of type checking to achieve valid output.

To get the `ByteArray` representation of the document built in Graffiti, call the `build` function on it. Following the example above:

```rust

assert(

    body.build() ==

    "
Graffiti
An awesome Cairo lib for building XML documents
Lorem ipsum dolor sit amet
",

    "Nope"

);

```


### TagBuilder trait

The `TagBuilder` trait is the centerpiece of building documents with Graffiti:

```rust

trait TagBuilder {

    fn new(name: ByteArray) -> T;

    fn build(self: T) -> ByteArray;

    fn attr(self: T, name: ByteArray, value: ByteArray) -> T;

    fn content(self: T, content: ByteArray) -> T;

    fn insert(self: T, child: T) -> T;

}

```

`Tag` implements this trait via `TagImpl`. Import both to use Graffiti:

```rust

use graffiti::{Tag, TagImpl};

```

### Examples

Check the [examples](./examples/) folder to see how to build a minimal HTML page, the Starknet logo in SVG or a single Loot bag using this library.