1. Notion original

2. Notion API

{
  "object": "block",
  …
  "type": "quote",
  "quote": {
    "text": [
      {
        "type": "text",
        "text": {
          "content": "Never tell a joke if you’ve got to look around before telling it.",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "Never tell a joke if you’ve got to look around before telling it.",
        "href": null
      }
    ]
  },
  "blocks": [
    {
      "object": "block",
      …
      "paragraph": {
        "text": [
          {
            "type": "text",
            "text": {
              "content": "—Jimmy Carr",
              "link": null
            },
            "annotations": {
              "bold": false,
              "italic": false,
              "strikethrough": false,
              "underline": false,
              "code": false,
              "color": "default"
            },
            "plain_text": "—Jimmy Carr",
            "href": null
          }
        ]
      }
    }
  ]
}
  javascript

3. Svelte output

<Quote>
  Never tell a joke if you’ve got to look around before telling it.
  <span slot="children">
    <Paragraph
      blockProps={{
        pageId: 'aa1322ce4c004737ac1eb3015f393fe5',
        id: '2266f93f-0222-487d-8723-2dc72e09f32c',
        created_time: '2022-01-26T09:32:00.000Z',
        last_edited_time: '2022-01-26T09:33:00.000Z'
      }}
    >
      —Jimmy Carr
    </Paragraph>
  </span>
</Quote>
  html

4. Example rendering

🏠 Browse the docs ⚘