// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Splitter resize can change size with mouse: mouse initial 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(50% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="50"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 50%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with mouse: mouse move to left 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(0% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="0"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle shift-right"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-secondary"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 0%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with mouse: mouse move to middle 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(50% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="50"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 50%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with mouse: mouse move to right 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(100% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="100"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle shift-left"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-secondary"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 100%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with touch: touch initial 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(50% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="50"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 50%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with touch: touch move to left 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(0% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="0"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle shift-right"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-secondary"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 0%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with touch: touch move to middle 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(26% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="26"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 26%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;

exports[`Splitter resize can change size with touch: touch move to right 1`] = `
<div>
  <div
    class="flex-fill flex-row d-flex "
  >
    <div
      class="left"
      id="editor-edit-pane"
      style="width: calc(100% - 5px);"
    >
      <div
        class="inner"
      >
        left
      </div>
    </div>
    <div
      aria-orientation="vertical"
      aria-valuemax="100"
      aria-valuemin="0"
      aria-valuenow="100"
      class="divider"
      data-testid="splitter-divider"
      id="editor-splitter"
      role="separator"
      tabindex="0"
    >
      <div
        class="middle shift-left"
      >
        <div
          class="buttons"
        >
          <button
            class="btn btn-light"
            type="button"
          >
            BootstrapIconMock_ArrowLeft
          </button>
          <span
            class="grabber"
          >
            BootstrapIconMock_ArrowLeftRight
          </span>
          <button
            class="btn btn-secondary"
            type="button"
          >
            BootstrapIconMock_ArrowRight
          </button>
        </div>
      </div>
    </div>
    <div
      class="right"
      id="editor-view-pane"
      style="width: calc(100% - 100%);"
    >
      <div
        class="inner"
      >
        right
      </div>
    </div>
  </div>
</div>
`;
