Kaku - Kaku (write) is my own markup language

# Kaku 書く

Kaku (write) is my own markup language. It's inspired by Markdown with a diferent syntax for quotes, links, images and lists handling, and more. It was created to fit my needs and exists inside my own (link: https://thomasorus.com/ronbun text: CMS).

## Parser

A parser for Kaku built in (link: https://go.dev/ text: Golang) can be found (link: https://git.thomasorus.com/thomasorus/Kaku text: here). It doesn't exists as a go module and must be added into your go project. It can also be built as WASM and used in the browser.

## License

Kaku 書く is a free to use by individuals and organizations that do not operate by capitalist principles. For more information see the (link: LICENSE text: license) file.

----

## Headings

`#` through `######` for heading levels 1 through 6. Each heading gets an auto-generated `id` and a clickable permalink anchor.

```
# Heading level 1
## Heading level 2
###### Heading level 6
```

Renders as:

# Heading level 1
## Heading level 2
###### Heading level 6

```html
<h1 id="heading-level-1">
 Heading level 1
 <a href="#heading-level-1" ...>#</a>
</h1>
```

----

## Basic inline formatting

```
This is *bold*, this is _emphasis_, this is ~strikethrough~, and this is `inline code`.

Or *_~`all at the same time`~_*.
```

Renders as:

This is *bold*, this is _emphasis_, this is ~strikethrough~, and this is `inline code`.

Or *_~`all at the same time`~_*.

```html
This is bold, this is emphasis, this is <del>strikethrough</del>, and this is <code>inline code</code>..

Or <del><code>all at the same time</code></del>.
```

Inline formatting can be combined with links and images (see below).

----

## Horizontal rule

Four dashes on their own line:

```
----
```

Renders as `<hr>`.

----

## Code blocks

Triple backticks, with an optional language right after the opening fence:

```go
func main() {
    fmt.Println("hello")
}
```

Renders as:

```html
<pre><code class="language-go">func main() {
 fmt.Println("hello")
}</code></pre>
```

Content inside a code block is never parsed for other Kaku syntax, everything stays literal.

----

## Lists

### Bullet list

```
- First item
- Second item
- Third item
```

Renders as:

- First item
- Second item
- Third item

```
<ul>
 <li>First item</li>
 <li>Second item</li>
 <li>Third item</li>
</ul>
```

### Ordered list

```
+ First item
+ Second item
+ Third item
```

Renders as:

+ First item
+ Second item
+ Third item

```html
<ol>
 <li>First item</li>
 <li>Second item</li>
 <li>Third item</li>
</ol>
```

### Definition list

```html
? Term one : Its definition
? Term two : Its definition
```

Renders as:

? Term one : Its definition
? Term two : Its definition

```html
<dl>
 <dt>Term one</dt>
 <dd>Its definition</dd>
 <dt>Term two</dt>
 <dd>Its definition</dd>
</dl>
```

Lists text supports inline formatting (bold, links, etc.):

- Check out (link: https://example.com text: this link)

----

## Links

```
(link: https://example.com text: Click here)
(link: https://example.com text: Click here title: Hover tooltip)
(link: https://example.com text: Click here label: Accessible label)
```

Renders as:

(link: https://example.com text: Link 1)
(link: https://example.com text: Link 2 title: Hover tooltip)
(link: https://example.com text: Link 3 label: Accessible label)

```html
<a href="https://example.com">Link 1</a>
<a href="https://example.com" title="Hover tooltip">Link 2</a>
<a href="https://example.com" aria-label="Accessible label">Link 3</a>
```

Fields:

- `link: ` (required)
- `text: ` (optional)
- `label: `(optional)
- `title: ` (optional)

Order doesn't matter.

Links also work inline, inside a paragraph or list item. Check out (link: https://example.com text: this inline link) for more info.

----

## Images

All images are rendered inside a `<figure>` tag and renders a `<figcaption>` with the link to the image.

```
(image: demo.jpg alt: A description of the photo)
```

Renders as:

(image: demo.jpg alt: A description of the photo)

```html
<figure>
 <img src="demo.jpg" alt="A description of the photo">
 <figcaption>
 
 <a href="demo.jpg">Full size</a>
 
 </figcaption>
</figure>
```

An optional caption can be added:

```
(image: demo.jpg alt: A description figcaption: An optional caption)
```
Renders as:

(image: demo.jpg alt: A description figcaption: An optional caption)

```html
<figure>
 <img src="demo.jpg" alt="A description of the photo">
 <figcaption>An optional caption |
 <a href="/demo.jpg">Full size</a>
 
 </figcaption>
</figure>
```

Fields:

- `image: ` (required)
- `alt: ` (optional)
- `figcaption: ` (optional)

Images work inline too, and can be made clickable by nesting inside a link:

```
(link: https://example.com text: (image: demo.jpg alt: A photo))
```

Renders as:

(link: https://example.com text: (image: demo.jpg alt: A photo))

```html
<figure>
 <a href="https://example.com"><img src="demo.jpg" alt="A photo"></a>
 <figcaption><a href="https://example.com"></a><a href="demo.jpg">Full size</a>
 </figcaption>
</figure>
```

----

## Video

Plain video gets standard playback controls.

```
(video: demo.mp4)
```

Renders as:

(video: demo.mp4)

```html
<figure>
 <video controls="" preload="metadata" src="demo.mp4" type="video/mp4"></video>
</figure>
```

Adding `autoplay` makes it behave like a looping, muted, GIF-style clip instead.

```
(video: demo.mp4 autoplay)
```

Renders as:

(video: demo.mp4 autoplay)

```html
<figure>
 <video autoplay="true" playsinline="true" loop="true" muted="true" preload="metadata" src="demo.mp4" type="video/mp4">
 </video>
</figure>
```

----

## Audio

```
(audio: demo.mp3)
```

Renders as :

(audio: demo.mp3)

```html
<audio controls="" preload="metadata" src="demo.mp3" type="audio/mpeg"></audio>
```

----

## Quotes

Simple quote:

```
(quote: A quote can stand on its own.)
```

Renders as:

(quote: A quote can stand on its own.)

```html
<figure>
 <blockquote>A quote can stand on its own.</blockquote>
</figure>
```

A quote can have an author:

```
(quote: With an author. author: Jane Doe)
```

Renders as:

(quote: With an author. author: Jane Doe)

```html
<figure>
 <blockquote>With an author.</blockquote>
 <figcaption>—Jane Doe</figcaption>
</figure>
```

A quote can have an author and a source:

```
(quote: With a source too. author: Jane Doe source: Her Book)
```

Renders as:

(quote: With a source too. author: Jane Doe source: Her Book)

```html
<figure>
 <blockquote>With a source too.</blockquote>
 <figcaption>—Jane Doe, Her Book</figcaption></figure>
```

A quote can have a link on the source.

```
(quote: With a link as well. author: Jane Doe source: Her Book link: https://example.com)
```

Renders as:

(quote: With a link as well. author: Jane Doe source: Her Book link: https://example.com)

```html
<figure>
 <blockquote cite="https://example.com">With a link as well.</blockquote>
 <figcaption>—Jane Doe, <a href="https://example.com">Her Book</a>
 </figcaption>
</figure>
```

Fields:
- `quote :` (required)
- `author :` (optional)
- `source :`(optional)
- `link :`(optional)

----

## Asides

A line wrapped entirely in curly braces becomes a side note:

```
{This is a side note, separate from the main flow of the text.}
```

Renders as:

{This is a side note, separate from the main flow of the text.}

```html
<aside>
 Side note
 This is a side note, separate from the main flow of the text.
</aside>
```

----

## Details / collapsible sections

```
(details: The hidden content goes here. summary: Click to expand)
```

Renders as:

(details: The hidden content goes here. summary: Click to expand)

```html
<details>
 <summary>Click to expand</summary>
The hidden content goes here.
</details>
```

Fields:
- `details` (the hidden content)
- `summary` (the always-visible label)

----

## Todo lists

```
[ ] Not started
[@] In progress
[~] Paused or abandoned
[x] Completed
```

Renders as:

[ ] Not started
[@] In progress
[~] Paused or abandoned
[x] Completed

```html
<ul>
 <li><code aria-hidden="true">[ ]</code>Opened task Not started</li>
 <li><code aria-hidden="true">[@]</code>Ongoing task In progress</li>
 <li><code aria-hidden="true">[~]</code>Paused or abandonned task Paused or abandoned</li>
 <li><code aria-hidden="true">[x]</code>Completed task Completed</li>
</ul>
```

Consecutive todo lines are grouped into a single list. Each state renders with a visually-hidden accessible label.

----

## Paragraphs

```
Any line that isn't one of the above is treated as regular paragraph text.
Consecutive lines are joined into a single paragraph.

A blank line starts a new one.
```

Renders as:

Any line that isn't one of the above is treated as regular paragraph text.
Consecutive lines are joined into a single paragraph.

A blank line starts a new one.