components

Prose Components

A list of Prose components currently implemented.

Prose

Here is a list of all the Prose components currently implemented.

To overwrite a prose component, create a component with the same name in your project components/content/ directory (ex: components/content/ProseA.vue)

ProseA

Source

[Link](/components/prose)

ProseBlockquote

Source

> Block quote

ProseCode

Source

  ```js [file.js]{4-6,7} meta-info=val
  export default () => {
    console.log('Code block')
  }
  ```

Component properties will be:

{
  code: "export default () => {\n    console.log('Code block')\n}"
  language: "js"
  filename: "file.js"
  highlights: [4, 5, 6, 7]
  meta: "meta-info=val"
}

Check out the highlight options for more about the syntax highlighting.

If you want to use ] in the filename, you need to escape it with 2 backslashes: \\]. This is necessary since JS will automatically escape the backslash in a string so \] will be resolved as ] breaking our regex.

ProseCodeInline

Source

code inline.

`code inline`.

`const codeInline: string = 'highlighted code inline'`

ProseH1

Source

# H1 Heading

ProseH2

Source

## H2 Heading

ProseH3

Source

### H3 Heading

ProseH4

Source

#### H4 Heading

ProseH5

Source

##### H5 Heading

ProseH6

Source

###### H6 Heading

ProseHr

Source

Divider under.

---

Divider above.

ProseImg

Source

![A Cool Image](/social-card.png)

ProseUl

Source

- Just
- An
- Unordered
- List

ProseLi

Source

- List element

ProseOl

Source

1. Foo
2. Bar
3. Baz

ProseP

Source

Just a paragraph.

ProseStrong

Source

**Just a strong paragraph.**

ProseEm

Source

_Just an italic paragraph._

ProseTable

Source

| Key | Type      | Description |
| --- | --------- | ----------- |
| 1   | Wonderful | Table       |
| 2   | Wonderful | Data        |
| 3   | Wonderful | Website     |

ProseTbody

Source

Included in ProseTable example.

ProseTd

Source

Included in ProseTable example.

ProseTh

Source

Included in ProseTable example.

ProseThead

Source

Included in ProseTable example.

ProseTr

Source

Included in ProseTable example.