<section id="{{./htmlId}}"
  class="operation operation-{{#if isQuery}}query{{else if isMutation}}mutation{{else if isSubscription}}subscription{{else}}unknown{{/if}}"
  data-traverse-target="{{./htmlId}}">
  {{# unless @first }}
    {{#if parentHtmlId }}
      <div class="operation-group-name">
        <a href="#group-{{./parentHtmlId}}">{{./parentName}}</a>
      </div>
    {{/if}}
  {{/unless}}

  <h2 class="operation-heading {{#if (and isDeprecated (not @root.info.x-hideIsDeprecated)) }}operation-deprecated{{/if}}">
    {{md (codify name) stripParagraph="true"}}
  </h2>

  {{#if (and deprecationReason (not @root.info.x-hideDeprecationReason))}}
    <div class="doc-row">
      <div class="doc-copy">
        <div class="doc-copy-section">
          <div class="deprecation-reason">
            {{ md deprecationReason stripParagraph=true }}
          </div>
        </div>
      </div>
    </div>
  {{/if}}

  {{#if description}}
    <div class="doc-row">
      <div class="doc-copy">
        <div class="operation-description doc-copy-section">
          <h5>Description</h5>
          {{ md (interpolateReferences description) }}
        </div>
      </div>
    </div>
  {{/if}}

  <div class="doc-row">
    <div class="doc-copy">
      {{#if response}}
        <div class="operation-response doc-copy-section">
          <h5>Response</h5>
          <p>
            Returns
            {{! If it's got items, then it's an array, and we don't care about the indefiniteArticle }}
            {{#unless response.isArray }}
              {{ indefiniteArticle response.underlyingType.name }}
            {{/unless}}
            {{~ md (mdTypeLink . codify=true) stripParagraph=true }}
          </p>
        </div>
      {{/if}}
      {{>graphql/_query-or-mutation-arguments}}
    </div>

    <div class="doc-examples">
      {{#if (firstTruthy query mutation subscription)}}
        <h4 class="example-heading">Example</h4>

        <div class="example-section example-section-is-code operation-query-example">
          <h5>Query</h5>
          {{printGraphQL (firstTruthy query mutation subscription)}}
        </div>

        {{#if variables}}
          <div class="example-section example-section-is-code operation-variables-example">
            <h5>Variables</h5>
            {{printJSON variables}}
          </div>
        {{/if}}
        {{#if response.data}}
          <div class="example-section example-section-is-code operation-response-example">
            <h5>Response</h5>
            {{printJSON response.data}}
          </div>
        {{/if}}
      {{/if}}
    </div>
  </div>
</section>
