figure
16 cases. Source: tests/figure.json.
#1 canonical
Source
:::figure[Request lifecycle from ingress to response]{#fig-lifecycle width=60%}

:::
Rendered
Downgrade

*Request lifecycle from ingress to response*
#2 image with alt and title, no caption
Source
:::figure

:::
Rendered
Downgrade

#3 table as content
Source
:::figure[Sizes]
| a | b |
|---|---|
| 1 | 2 |
:::
Rendered
| a | b |
|---|---|
| 1 | 2 |
Downgrade
| a | b |
| - | - |
| 1 | 2 |
*Sizes*
#4 code block as content
Source
:::figure[Listing]
```js
let x = 1;
```
:::
Rendered
let x = 1;
Downgrade
```js
let x = 1;
```
*Listing*
#5 caption with inline markup
Source
:::figure[The *fast* path]

:::
Rendered
Downgrade

*The *fast* path*
#6 width bounds
Source
:::figure{width=1%}

:::
:::figure{width=100%}

:::
Rendered
Downgrade


#7 nested inside a card
Source
::::card
:::figure[C]

:::
::::
Rendered
Downgrade

*C*
#8 classes
Source
:::figure{.wide}

:::
Rendered
Downgrade

#9 unclosed fence
Source
:::figure[C]

Rendered
Downgrade

*C*
Diagnostics: DIRECTIVE_UNCLOSED
#10 empty content
invalid
Source
:::figure
:::
Rendered
Downgrade
(empty)Diagnostics: FIGURE_CONTENT
#11 wrong content type: text paragraph
invalid
Source
:::figure
some text
:::
Rendered
some text
Downgrade
some text
Diagnostics: FIGURE_CONTENT
#12 wrong content type: image with trailing text
invalid
Source
:::figure
 caption here
:::
Rendered
caption here
Downgrade
 caption here
Diagnostics: FIGURE_CONTENT
#13 wrong content type: two blocks
invalid
Source
:::figure


:::
Rendered
Downgrade


Diagnostics: FIGURE_CONTENT
#14 width must be a percentage
invalid
Source
:::figure{width=300px}

:::
Rendered
Downgrade

Diagnostics: DIRECTIVE_INVALID_ATTRIBUTE
#15 width out of range
invalid
Source
:::figure{width=150%}

:::
Rendered
Downgrade

Diagnostics: DIRECTIVE_INVALID_ATTRIBUTE
#16 width of zero
invalid
Source
:::figure{width=0%}

:::
Rendered
Downgrade

Diagnostics: DIRECTIVE_INVALID_ATTRIBUTE