ant-design/components/avatar/__tests__/__snapshots__/demo.test.tsx.snap

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

exports[`renders components/avatar/demo/badge.tsx correctly 1`] = `
<div
  class="ant-space ant-space-horizontal ant-space-align-center"
  style="column-gap:24px;row-gap:24px"
>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-badge"
    >
      <span
        class="ant-avatar ant-avatar-square ant-avatar-icon"
      >
        <span
          aria-label="user"
          class="anticon anticon-user"
          role="img"
        >
          <svg
            aria-hidden="true"
            data-icon="user"
            fill="currentColor"
            focusable="false"
            height="1em"
            viewBox="64 64 896 896"
            width="1em"
          >
            <path
              d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
            />
          </svg>
        </span>
      </span>
      <sup
        class="ant-scroll-number ant-badge-count"
        data-show="true"
        title="1"
      >
        <bdi>
          <span
            class="ant-scroll-number-only"
            style="transition:none"
          >
            <span
              class="ant-scroll-number-only-unit current"
            >
              1
            </span>
          </span>
        </bdi>
      </sup>
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-badge"
    >
      <span
        class="ant-avatar ant-avatar-square ant-avatar-icon"
      >
        <span
          aria-label="user"
          class="anticon anticon-user"
          role="img"
        >
          <svg
            aria-hidden="true"
            data-icon="user"
            fill="currentColor"
            focusable="false"
            height="1em"
            viewBox="64 64 896 896"
            width="1em"
          >
            <path
              d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
            />
          </svg>
        </span>
      </span>
      <sup
        class="ant-scroll-number ant-badge-dot"
        data-show="true"
      />
    </span>
  </div>
</div>
`;

exports[`renders components/avatar/demo/basic.tsx correctly 1`] = `
<div
  class="ant-space ant-space-vertical"
  style="column-gap:16px;row-gap:16px"
>
  <div
    class="ant-space-item"
  >
    <div
      class="ant-space ant-space-horizontal ant-space-align-center"
      style="flex-wrap:wrap;column-gap:16px;row-gap:16px"
    >
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-circle ant-avatar-icon"
          style="width:64px;height:64px;font-size:32px"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-circle ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-sm ant-avatar-circle ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-circle ant-avatar-icon"
          style="width:14px;height:14px;font-size:7px"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
    </div>
  </div>
  <div
    class="ant-space-item"
  >
    <div
      class="ant-space ant-space-horizontal ant-space-align-center"
      style="flex-wrap:wrap;column-gap:16px;row-gap:16px"
    >
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-square ant-avatar-icon"
          style="width:64px;height:64px;font-size:32px"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-lg ant-avatar-square ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-square ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-sm ant-avatar-square ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
      <div
        class="ant-space-item"
      >
        <span
          class="ant-avatar ant-avatar-square ant-avatar-icon"
          style="width:14px;height:14px;font-size:7px"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
      </div>
    </div>
  </div>
</div>
`;

exports[`renders components/avatar/demo/component-token.tsx correctly 1`] = `
Array [
  <div
    class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
  >
    <div
      class="ant-space-item"
    >
      <span
        class="ant-avatar ant-avatar-circle ant-avatar-image"
      >
        <img
          src="http://abc.com/not-exist.jpg"
        />
      </span>
    </div>
  </div>,
  <div
    class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
  >
    <div
      class="ant-space-item"
    >
      <div
        class="ant-avatar-group"
      >
        <span
          class="ant-avatar ant-avatar-circle ant-avatar-image"
        >
          <img
            src="https://api.dicebear.com/7.x/miniavs/svg?seed=2"
          />
        </span>
        <span
          class="ant-avatar ant-avatar-circle"
          style="background-color:#f56a00"
        >
          <span
            class="ant-avatar-string"
            style="opacity:0"
          >
            K
          </span>
        </span>
        <span
          class="ant-avatar ant-avatar-circle"
          style="color:#f56a00;background-color:#fde3cf"
        >
          <span
            class="ant-avatar-string"
            style="opacity:0"
          >
            +2
          </span>
        </span>
      </div>
    </div>
  </div>,
  <div
    class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
  >
    <div
      class="ant-space-item"
    >
      <span
        class="ant-badge"
      >
        <span
          class="ant-avatar ant-avatar-square ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
        <sup
          class="ant-scroll-number ant-badge-count"
          data-show="true"
          title="1"
        >
          <bdi>
            <span
              class="ant-scroll-number-only"
              style="transition:none"
            >
              <span
                class="ant-scroll-number-only-unit current"
              >
                1
              </span>
            </span>
          </bdi>
        </sup>
      </span>
    </div>
    <div
      class="ant-space-item"
    >
      <span
        class="ant-badge"
      >
        <span
          class="ant-avatar ant-avatar-square ant-avatar-icon"
        >
          <span
            aria-label="user"
            class="anticon anticon-user"
            role="img"
          >
            <svg
              aria-hidden="true"
              data-icon="user"
              fill="currentColor"
              focusable="false"
              height="1em"
              viewBox="64 64 896 896"
              width="1em"
            >
              <path
                d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
              />
            </svg>
          </span>
        </span>
        <sup
          class="ant-scroll-number ant-badge-dot"
          data-show="true"
        />
      </span>
    </div>
  </div>,
]
`;

exports[`renders components/avatar/demo/dynamic.tsx correctly 1`] = `
Array [
  <span
    class="ant-avatar ant-avatar-lg ant-avatar-circle"
    style="background-color:#f56a00;vertical-align:middle"
  >
    <span
      class="ant-avatar-string"
      style="opacity:0"
    >
      U
    </span>
  </span>,
  <button
    class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-sm"
    style="margin:0 16px;vertical-align:middle"
    type="button"
  >
    <span>
      ChangeUser
    </span>
  </button>,
  <button
    class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-sm"
    style="vertical-align:middle"
    type="button"
  >
    <span>
      changeGap
    </span>
  </button>,
]
`;

exports[`renders components/avatar/demo/fallback.tsx correctly 1`] = `
<div
  class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        src="http://abc.com/not-exist.jpg"
      />
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        src="http://abc.com/not-exist.jpg"
      />
    </span>
  </div>
</div>
`;

exports[`renders components/avatar/demo/group.tsx correctly 1`] = `
Array [
  <div
    class="ant-avatar-group"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        src="https://api.dicebear.com/7.x/miniavs/svg?seed=1"
      />
    </span>
    <a
      href="https://ant.design"
    >
      <span
        class="ant-avatar ant-avatar-circle"
        style="background-color:#f56a00"
      >
        <span
          class="ant-avatar-string"
          style="opacity:0"
        >
          K
        </span>
      </span>
    </a>
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-icon"
      style="background-color:#87d068"
    >
      <span
        aria-label="user"
        class="anticon anticon-user"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="user"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
          />
        </svg>
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-icon"
      style="background-color:#1677ff"
    >
      <span
        aria-label="ant-design"
        class="anticon anticon-ant-design"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="ant-design"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-20.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"
          />
        </svg>
      </span>
    </span>
  </div>,
  <div
    class="ant-divider ant-divider-horizontal"
    role="separator"
  />,
  <div
    class="ant-avatar-group"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        src="https://api.dicebear.com/7.x/miniavs/svg?seed=2"
      />
    </span>
    <span
      class="ant-avatar ant-avatar-circle"
      style="background-color:#f56a00"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        K
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-circle"
      style="color:#f56a00;background-color:#fde3cf"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        +2
      </span>
    </span>
  </div>,
  <div
    class="ant-divider ant-divider-horizontal"
    role="separator"
  />,
  <div
    class="ant-avatar-group"
  >
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
    >
      <img
        src="https://api.dicebear.com/7.x/miniavs/svg?seed=3"
      />
    </span>
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle"
      style="background-color:#f56a00"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        K
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle"
      style="color:#f56a00;background-color:#fde3cf"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        +2
      </span>
    </span>
  </div>,
  <div
    class="ant-divider ant-divider-horizontal"
    role="separator"
  />,
  <div
    class="ant-avatar-group"
  >
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
    >
      <img
        src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"
      />
    </span>
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle"
      style="background-color:#f56a00"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        K
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle"
      style="color:#f56a00;background-color:#fde3cf;cursor:pointer"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        +2
      </span>
    </span>
  </div>,
  <div
    class="ant-divider ant-divider-horizontal"
    role="separator"
  />,
  <div
    class="ant-avatar-group"
  >
    <span
      class="ant-avatar ant-avatar-square"
      style="background-color:#fde3cf"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        A
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-square"
      style="background-color:#f56a00"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        K
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-square ant-avatar-icon"
      style="background-color:#87d068"
    >
      <span
        aria-label="user"
        class="anticon anticon-user"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="user"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
          />
        </svg>
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-square ant-avatar-icon"
      style="background-color:#1677ff"
    >
      <span
        aria-label="ant-design"
        class="anticon anticon-ant-design"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="ant-design"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-20.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"
          />
        </svg>
      </span>
    </span>
  </div>,
]
`;

exports[`renders components/avatar/demo/responsive.tsx correctly 1`] = `
<span
  class="ant-avatar ant-avatar-circle ant-avatar-icon"
>
  <span
    aria-label="ant-design"
    class="anticon anticon-ant-design"
    role="img"
  >
    <svg
      aria-hidden="true"
      data-icon="ant-design"
      fill="currentColor"
      focusable="false"
      height="1em"
      viewBox="64 64 896 896"
      width="1em"
    >
      <path
        d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-20.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"
      />
    </svg>
  </span>
</span>
`;

exports[`renders components/avatar/demo/toggle-debug.tsx correctly 1`] = `
Array [
  <div
    class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
    style="flex-wrap:wrap"
  >
    <div
      class="ant-space-item"
    >
      <button
        class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined"
        type="button"
      >
        <span>
          Toggle Avatar visibility
        </span>
      </button>
    </div>
    <div
      class="ant-space-item"
    >
      <button
        class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined"
        type="button"
      >
        <span>
          Toggle Avatar size
        </span>
      </button>
    </div>
    <div
      class="ant-space-item"
    >
      <button
        class="ant-btn ant-btn-default ant-btn-color-default ant-btn-variant-outlined"
        type="button"
      >
        <span>
          Change Avatar scale
        </span>
      </button>
    </div>
  </div>,
  <div
    style="text-align:center;transform:scale(1);margin-top:24px"
  >
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle"
      style="background:#7265e6;display:none"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        Avatar
      </span>
    </span>
    <span
      class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
      style="background:#00a2ae;display:none"
    >
      <img
        src="invalid"
      />
    </span>
    <div
      style="display:none"
    >
      <span
        class="ant-avatar ant-avatar-lg ant-avatar-circle"
        style="background:#7265e6"
      >
        <span
          class="ant-avatar-string"
          style="opacity:0"
        >
          Avatar
        </span>
      </span>
      <span
        class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
        style="background:#00a2ae"
      >
        <img
          src="invalid"
        />
      </span>
    </div>
  </div>,
]
`;

exports[`renders components/avatar/demo/type.tsx correctly 1`] = `
<div
  class="ant-space ant-space-horizontal ant-space-align-center"
  style="flex-wrap:wrap;column-gap:16px;row-gap:16px"
>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-icon"
    >
      <span
        aria-label="user"
        class="anticon anticon-user"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="user"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
          />
        </svg>
      </span>
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        U
      </span>
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle"
      style="width:40px;height:40px;font-size:18px"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        USER
      </span>
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg"
      />
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-image"
    >
      <img
        alt="avatar"
        src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg"
      />
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle"
      style="background-color:#fde3cf;color:#f56a00"
    >
      <span
        class="ant-avatar-string"
        style="opacity:0"
      >
        U
      </span>
    </span>
  </div>
  <div
    class="ant-space-item"
  >
    <span
      class="ant-avatar ant-avatar-circle ant-avatar-icon"
      style="background-color:#87d068"
    >
      <span
        aria-label="user"
        class="anticon anticon-user"
        role="img"
      >
        <svg
          aria-hidden="true"
          data-icon="user"
          fill="currentColor"
          focusable="false"
          height="1em"
          viewBox="64 64 896 896"
          width="1em"
        >
          <path
            d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
          />
        </svg>
      </span>
    </span>
  </div>
</div>
`;