// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`should render demo and match snapshot 1`] = `
<div>
  <div class="van-circle">
    <svg viewbox="0 0 1040 1040">
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke-width: 41px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      70%
    </div>
  </div>
</div>
<div>
  <div class="van-circle">
    <svg viewbox="0 0 1060 1060">
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 60px;"
        d="M 530 530 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 530 530 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke-width: 61px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Custom Width
    </div>
  </div>
  <div class="van-circle">
    <svg viewbox="0 0 1040 1040">
      <path
        class="van-circle__layer"
        style="fill: none; stroke: #ebedf0; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke: #ee0a24; stroke-width: 41px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
        stroke="#ee0a24"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Custom Color
    </div>
  </div>
  <div class="van-circle">
    <svg viewbox="0 0 1040 1040">
      <defs>
        <linearGradient
          id="van-circle-3"
          x1="100%"
          y1="0%"
          x2="0%"
          y2="0%"
        >
          <stop
            offset="0%"
            stop-color="#3fecff"
          >
          </stop>
          <stop
            offset="100%"
            stop-color="#6149f6"
          >
          </stop>
        </linearGradient>
      </defs>
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke: url(#van-circle-3); stroke-width: 41px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
        stroke="url(#van-circle-3)"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Gradient
    </div>
  </div>
  <div
    class="van-circle"
    style="margin-top: 15px;"
  >
    <svg viewbox="0 0 1040 1040">
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 0 0, 1000 a 500, 500 0 1, 0 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 0 0, 1000 a 500, 500 0 1, 0 0, -1000"
        style="stroke: #07c160; stroke-width: 41px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
        stroke="#07c160"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Counter Clockwise
    </div>
  </div>
  <div
    class="van-circle"
    style="width: 120px; height: 120px; margin-top: 15px;"
  >
    <svg viewbox="0 0 1040 1040">
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 0 0, 1000 a 500, 500 0 1, 0 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 0 0, 1000 a 500, 500 0 1, 0 0, -1000"
        style="stroke: #7232dd; stroke-width: 41px; stroke-dasharray: 2198px 3140px;"
        class="van-circle__hover"
        stroke="#7232dd"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Custom Size
    </div>
  </div>
</div>
<div style="margin-top: 15px;">
  <button
    type="button"
    class="van-button van-button--primary van-button--small"
  >
    <div class="van-button__content">
      <span class="van-button__text">
        Add
      </span>
    </div>
  </button>
  <button
    type="button"
    class="van-button van-button--danger van-button--small"
  >
    <div class="van-button__content">
      <span class="van-button__text">
        Decrease
      </span>
    </div>
  </button>
</div>
<div>
  <div class="van-circle">
    <svg
      viewbox="0 0 1040 1040"
      style="transform: rotate(270deg);"
    >
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke-width: 41px; stroke-dasharray: 2355px 3140px;"
        class="van-circle__hover"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Left
    </div>
  </div>
  <div class="van-circle">
    <svg
      viewbox="0 0 1040 1040"
      style="transform: rotate(90deg);"
    >
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke-width: 41px; stroke-dasharray: 2355px 3140px;"
        class="van-circle__hover"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Right
    </div>
  </div>
  <div class="van-circle">
    <svg
      viewbox="0 0 1040 1040"
      style="transform: rotate(180deg);"
    >
      <path
        class="van-circle__layer"
        style="fill: none; stroke-width: 40px;"
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
      >
      </path>
      <path
        d="M 520 520 m 0, -500 a 500, 500 0 1, 1 0, 1000 a 500, 500 0 1, 1 0, -1000"
        style="stroke-width: 41px; stroke-dasharray: 2355px 3140px;"
        class="van-circle__hover"
      >
      </path>
    </svg>
    <div class="van-circle__text">
      Bottom
    </div>
  </div>
</div>
`;
