Horizontal Flow

A diagram can go from left to right or from top to bottom, but you can also create mixed ones. For controlling the direction of a diagram you can adjust the handle positions of a node with the sourcePosition and targetPosition props.

<script lang="ts">
const data: string = "world";
</script>

<h1>Hello {data}</h1>

<style>
h1 {
  font-size: 1.5rem;
}
</style>