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

MyST schema, testcases, and typescript types

cases:
  - title: Simple figure
    id: container
    mdast:
      type: root
      children:
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/150
          value: |-
            This is the figure caption!

            Something! A legend!?
          children:
            - type: container
              kind: figure
              children:
                - type: image
                  url: https://via.placeholder.com/150
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is the figure caption!
                - type: legend
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: Something! A legend!?

    myst: |-
      ```{figure} https://via.placeholder.com/150
      This is the figure caption!

      Something! A legend!?
      ```
    html: |-
      <figure class="numbered">
        <img src="https://via.placeholder.com/150">
        <figcaption>
          <p>This is the figure caption!</p>
        </figcaption>
        <div class="legend">
          <p>Something! A legend!?</p>
        </div>
      </figure>

  - title: Named figure with a caption in a paragraph
    mdast:
      type: root
      children:
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/150
          options:
            name: myFigure
            alt: Placeholder
          value: This is the figure caption!
          children:
            - type: container
              kind: figure
              identifier: myfigure
              label: myFigure
              children:
                - type: image
                  url: https://via.placeholder.com/150
                  alt: Placeholder
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is the figure caption!
    myst: |-
      ```{figure} https://via.placeholder.com/150
      :name: myFigure
      :alt: Placeholder

      This is the figure caption!
      ```
    html: |-
      <figure id="myfigure" class="numbered">
        <img src="https://via.placeholder.com/150" alt="Placeholder">
        <figcaption>
          <p><span class="caption-number">Figure 1</span>This is the figure caption!</p>
        </figcaption>
      </figure>
    latex: |-
      \begin{figure}[!htbp]
        \centering
        \includegraphics{https://via.placeholder.com/150}
        \caption*{This is the figure caption!}
        \label{fig:myFigure}
      \end{figure}

  - title: Named figure with a caption in a no alt
    mdast:
      type: root
      children:
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/150
          options:
            name: myFigure
          value: This is the figure caption!
          children:
            - type: container
              kind: figure
              identifier: myfigure
              label: myFigure
              children:
                - type: image
                  url: https://via.placeholder.com/150
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is the figure caption!
    myst: |-
      ```{figure} https://via.placeholder.com/150
      :name: myFigure

      This is the figure caption!
      ```
    html: |-
      <figure id="myfigure" class="numbered">
        <img src="https://via.placeholder.com/150">
        <figcaption>
          <p><span class="caption-number">Figure 1</span>This is the figure caption!</p>
        </figcaption>
      </figure>

  - title: Named figure with no space between options in directive
    mdast:
      type: root
      children:
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/150
          options:
            name: myFigure
          value: This is the figure caption!
          children:
            - type: container
              kind: figure
              identifier: myfigure
              label: myFigure
              children:
                - type: image
                  url: https://via.placeholder.com/150
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is the figure caption!
    myst: |-
      ```{figure} https://via.placeholder.com/150
      :name: myFigure
      This is the figure caption!
      ```
    html: |-
      <figure id="myfigure" class="numbered">
        <img src="https://via.placeholder.com/150">
        <figcaption>
          <p><span class="caption-number">Figure 1</span>This is the figure caption!</p>
        </figcaption>
      </figure>

  - title: Two figures
    mdast:
      type: root
      children:
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/150
          options:
            name: myFigure
          value: This is the figure caption!
          children:
            - type: container
              kind: figure
              identifier: myfigure
              label: myFigure
              children:
                - type: image
                  url: https://via.placeholder.com/150
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is the figure caption!
        - type: mystDirective
          name: figure
          args: https://via.placeholder.com/151
          options:
            name: myOtherFigure
          value: This is another caption!
          children:
            - type: container
              kind: figure
              identifier: myotherfigure
              label: myOtherFigure
              children:
                - type: image
                  url: https://via.placeholder.com/151
                - type: caption
                  children:
                    - type: paragraph
                      children:
                        - type: text
                          value: This is another caption!
    myst: |-
      ```{figure} https://via.placeholder.com/150
      :name: myFigure

      This is the figure caption!
      ```
      ```{figure} https://via.placeholder.com/151
      :name: myOtherFigure

      This is another caption!
      ```
    html: |-
      <figure id="myfigure" class="numbered">
        <img src="https://via.placeholder.com/150">
        <figcaption>
          <p><span class="caption-number">Figure 1</span>This is the figure caption!</p>
        </figcaption>
      </figure>
      <figure id="myotherfigure" class="numbered">
        <img src="https://via.placeholder.com/151">
        <figcaption>
          <p><span class="caption-number">Figure 2</span>This is another caption!</p>
        </figcaption>
      </figure>