<div class="dialog-frame" style="width: 800px;">
  <div class="dialog-header" bind="dialogHeader"></div>
  <div class="dialog-body" bind="dialogBody">
    <div id="schema-alignment-tabs" class="refine-tabs">
      <ul>
          <li><a href="#schema-alignment-tabs-schema" bind="schemaTabHeader"></a></li>
          <li><a href="#schema-alignment-tabs-warnings"><span bind="warningsTabHeader"></span> <span class="schema-alignment-total-warning-count" bind="warningsTabCount"></span></a></li>
          <li><a href="#schema-alignment-tabs-preview-edits" bind="editsPreviewTabHeader"></a></li>
      </ul>
      <div id="schema-alignment-tabs-schema">
          <div bind="schemaHeader">
            <p class="body-text" bind="dialogExplanation"></p>
            <div class="schema-alignment-dialog-columns-area" bind="columnsArea">
            </div>
          </div>
          <div class="schema-alignment-dialog-canvas" bind="canvas">
            <div class="schema-alignment-dialog-statements-area" bind="statementsArea">
                <div id="schema-alignment-statements-container">
                </div>
                <div class="wbs-toolbar"><a class="wbs-add-item" bind="addItemButton"></a></div>
            </div>
          </div>
      </div>
      <div id="schema-alignment-tabs-warnings" style="display: none;">
          <div class="invalid-schema-warning" bind="invalidSchemaWarningIssues"></div>
         <div class="schema-alignment-dialog-warnings" bind="warningsArea"></div>
      </div>
      <div id="schema-alignment-tabs-preview-edits" style="display: none;">
          <p class="body-text" bind="previewExplanation"></p>
          <div class="invalid-schema-warning" bind="invalidSchemaWarningPreview"></div>
          <div class="schema-alignment-dialog-preview"></div>
      </div>
    </div>
  </div>
  <div class="dialog-footer" bind="dialogFooter"><div class="grid-layout layout-normal layout-full"><table><tr>
    <td>
      <button class="button" bind="resetButton"></button>
    </td>
    <td style="text-align:right;">
      <button class="button button-primary" bind="saveButton"></button>
    </td>
    <td style="text-align:center;" width="30%">
      <span class="schema-alignment-status-indicator" bind="statusIndicator"></span>
    </td>
    <td style="text-align:right;" width="1%">
      <button class="button" bind="closeButton"></button>
    </td>
  </tr></table></div></div>
</div>