<div class="row">
  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-http1MaxPendingRequests"}}"
    >
      {{t "cruDestinationRule.connectionPool.http1MaxPendingRequests.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.http.http1MaxPendingRequests
    }}
      {{input-integer
        min=0
        value=model.http.http1MaxPendingRequests
        id=(concat elementId "-input-http1MaxPendingRequests")
        placeholder=(t "cruDestinationRule.connectionPool.http1MaxPendingRequests.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.http1MaxPendingRequests.help"}}
      </p>
    {{/input-or-display}}
  </div>

  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-http2MaxRequests"}}"
    >
      {{t "cruDestinationRule.connectionPool.http2MaxRequests.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.http.http2MaxRequests
    }}
      {{input-integer
        min=0
        value=model.http.http2MaxRequests
        id=(concat elementId "-input-http2MaxRequests")
        placeholder=(t "cruDestinationRule.connectionPool.http2MaxRequests.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.http2MaxRequests.help"}}
      </p>
    {{/input-or-display}}
  </div>

  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-maxRequestsPerConnection"}}"
    >
      {{t "cruDestinationRule.connectionPool.maxRequestsPerConnection.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.http.maxRequestsPerConnection
    }}
      {{input-integer
        min=0
        value=model.http.maxRequestsPerConnection
        id=(concat elementId "-input-maxRequestsPerConnection")
        placeholder=(t "cruDestinationRule.connectionPool.maxRequestsPerConnection.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.maxRequestsPerConnection.help"}}
      </p>
    {{/input-or-display}}
  </div>
</div>

<div class="row">
  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-maxRetries"}}"
    >
      {{t "cruDestinationRule.connectionPool.maxRetries.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.http.maxRetries
    }}
      {{input-integer
        min=0
        value=model.http.maxRetries
        id=(concat elementId "-input-maxRetries")
        placeholder=(t "cruDestinationRule.connectionPool.maxRetries.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.maxRetries.help"}}
      </p>
    {{/input-or-display}}
  </div>

  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-connectTimeout"}}"
    >
      {{t "cruDestinationRule.connectionPool.connectTimeout.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.tcp.connectTimeout
    }}
      {{input
        type="text"
        value=model.tcp.connectTimeout
        id=(concat elementId "-input-connectTimeout")
        placeholder=(t "cruDestinationRule.connectionPool.connectTimeout.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.connectTimeout.help"}}
      </p>
    {{/input-or-display}}
  </div>

  <div class="col span-4">
    <label
      class="acc-label"
      for="{{concat elementId "-input-maxConnections"}}"
    >
      {{t "cruDestinationRule.connectionPool.maxConnections.label"}}
    </label>
    {{#input-or-display
      editable=editing
      value=model.tcp.maxConnections
    }}
      {{input-integer
        min=0
        value=model.tcp.maxConnections
        id=(concat elementId "-input-maxConnections")
        placeholder=(t "cruDestinationRule.connectionPool.maxConnections.placeholder")
      }}
      <p class="help-block">
        {{t "cruDestinationRule.connectionPool.maxConnections.help"}}
      </p>
    {{/input-or-display}}
  </div>
</div>