myst-spec/dist/examples/directives.image.yml

MyST schema, testcases, and typescript types

cases:
  - title: Standard markdown image
    id: image
    mdast:
      type: root
      children:
        - type: paragraph
          children:
            - type: image
              url: fun-fish.png
              alt: fishy
    myst: |-
      ![fishy](fun-fish.png)
    html: |-
      <p>
        <img src="fun-fish.png" alt="fishy">
      </p>

  - title: Image directive
    mdast:
      type: root
      children:
        - type: mystDirective
          name: image
          args: fun-fish.png
          options:
            alt: fishy
            class: bg-primary mb-1
            width: 200px
            align: center
          children:
            - type: image
              url: fun-fish.png
              alt: fishy
              class: bg-primary mb-1
              width: 200px
              align: center
    myst: |-
      ```{image} fun-fish.png
      :alt: fishy
      :class: bg-primary mb-1
      :width: 200px
      :align: center
      ```
    html: |-
      <img src="fun-fish.png" alt="fishy" class="align-center bg-primary mb-1" width="200px">
    latex: |-
      \includegraphics{fun-fish.png}

  - title: Image directive, left
    mdast:
      type: root
      children:
        - type: mystDirective
          name: image
          args: fun-fish.png
          options:
            alt: fishy
            align: left
          children:
            - type: image
              url: fun-fish.png
              alt: fishy
              align: left
    myst: |-
      ```{image} fun-fish.png
      :alt: fishy
      :align: left
      ```
    html: |-
      <img src="fun-fish.png" alt="fishy" class="align-left">
    latex: |-
      \includegraphics{fun-fish.png}