takumi 0.69.2

Render your React components to images.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87

# Takumi

<!-- cargo-rdme start -->

Takumi is a library with different parts to render your React components to images. This crate contains the core logic for layout, rendering.

Checkout the [Quick Start](https://takumi.kane.tw/docs) if you are looking for napi-rs / WASM bindings.

## Example

```rust
use takumi::{
  layout::{
    node::{ContainerNode, TextNode, NodeKind, Node},
    Viewport,
    style::Style,
  },
  rendering::{render, RenderOptionsBuilder},
  GlobalContext,
};

// Create a node tree with `ContainerNode` and `TextNode`
let mut node = NodeKind::Container(ContainerNode {
  children: Some(Box::from([
    NodeKind::Text(TextNode {
      text: "Hello, world!".to_string(),
      style: None, // Construct with `StyleBuilder`
      tw: None, // Tailwind properties
      preset: None,
      tag_name: None,
      class_name: None,
      id: None,
    }),
  ])),
  preset: None,
  style: None,
  tw: None, // Tailwind properties
  tag_name: None,
  class_name: None,
  id: None,
});

// Create a context for storing resources, font caches.
// You should reuse the context to speed up the rendering.
let mut global = GlobalContext::default();

// Load fonts
global.font_context.load_and_store(
  include_bytes!("../../assets/fonts/geist/Geist[wght].woff2").into(),
  None,
  None,
);

// Create a viewport
let viewport = Viewport::new(Some(1200), Some(630));

// Create render options
let options = RenderOptionsBuilder::default()
  .viewport(viewport)
  .node(node)
  .global(&global)
  .build()
  .unwrap();

// Render the layout to an `RgbaImage`
let image = render(options).unwrap();
```

## Feature Flags

- `woff2`: Enable WOFF2 font support.
- `woff`: Enable WOFF font support.
- `svg`: Enable SVG support.
- `rayon`: Enable rayon support.

## Credits

Takumi wouldn't be possible without the following works:

- [taffy](https://github.com/DioxusLabs/taffy) for the flex & grid layout.
- [image](https://github.com/image-rs/image) for the image processing.
- [parley](https://github.com/linebender/parley) for text layout.
- [swash](https://github.com/linebender/swash) for font shaping.
- [wuff](https://github.com/nicoburns/wuff) for woff/woff2 decompression.
- [resvg](https://github.com/linebender/resvg) for SVG parsing & rasterization.

<!-- cargo-rdme end -->