ant-design/components/skeleton/__tests__/__snapshots__/demo-extend.test.ts.snap

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

exports[`renders ./components/skeleton/demo/active.md extend context correctly 1`] = `
<div
  class="ant-skeleton ant-skeleton-active"
>
  <div
    class="ant-skeleton-content"
  >
    <h3
      class="ant-skeleton-title"
      style="width:38%"
    />
    <ul
      class="ant-skeleton-paragraph"
    >
      <li />
      <li />
      <li
        style="width:61%"
      />
    </ul>
  </div>
</div>
`;

exports[`renders ./components/skeleton/demo/basic.md extend context correctly 1`] = `
<div
  class="ant-skeleton"
>
  <div
    class="ant-skeleton-content"
  >
    <h3
      class="ant-skeleton-title"
      style="width:38%"
    />
    <ul
      class="ant-skeleton-paragraph"
    >
      <li />
      <li />
      <li
        style="width:61%"
      />
    </ul>
  </div>
</div>
`;

exports[`renders ./components/skeleton/demo/children.md extend context correctly 1`] = `
<div
  class="article"
>
  <div>
    <h4>
      Ant Design, a design language
    </h4>
    <p>
      We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.
    </p>
  </div>
  <button
    class="ant-btn"
    type="button"
  >
    <span>
      Show Skeleton
    </span>
  </button>
</div>
`;

exports[`renders ./components/skeleton/demo/complex.md extend context correctly 1`] = `
<div
  class="ant-skeleton ant-skeleton-with-avatar"
>
  <div
    class="ant-skeleton-header"
  >
    <span
      class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
    />
  </div>
  <div
    class="ant-skeleton-content"
  >
    <h3
      class="ant-skeleton-title"
      style="width:50%"
    />
    <ul
      class="ant-skeleton-paragraph"
    >
      <li />
      <li />
      <li />
      <li />
    </ul>
  </div>
</div>
`;

exports[`renders ./components/skeleton/demo/element.md extend context correctly 1`] = `
Array [
  <div
    class="ant-space ant-space-horizontal ant-space-align-center"
  >
    <div
      class="ant-space-item"
      style="margin-right:8px"
    >
      <div
        class="ant-skeleton ant-skeleton-element"
      >
        <span
          class="ant-skeleton-button"
        />
      </div>
    </div>
    <div
      class="ant-space-item"
      style="margin-right:8px"
    >
      <div
        class="ant-skeleton ant-skeleton-element"
      >
        <span
          class="ant-skeleton-avatar ant-skeleton-avatar-circle"
        />
      </div>
    </div>
    <div
      class="ant-space-item"
    >
      <div
        class="ant-skeleton ant-skeleton-element"
      >
        <span
          class="ant-skeleton-input"
          style="width:200px"
        />
      </div>
    </div>
  </div>,
  <br />,
  <br />,
  <div
    class="ant-skeleton ant-skeleton-element"
  >
    <span
      class="ant-skeleton-button"
    />
  </div>,
  <br />,
  <br />,
  <div
    class="ant-skeleton ant-skeleton-element"
  >
    <div
      class="ant-skeleton-image"
    >
      <svg
        class="ant-skeleton-image-svg"
        viewBox="0 0 1098 1024"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          class="ant-skeleton-image-path"
          d="M365.714286 329.142857q0 45.714286-32.036571 77.677714t-77.677714 32.036571-77.677714-32.036571-32.036571-77.677714 32.036571-77.677714 77.677714-32.036571 77.677714 32.036571 32.036571 77.677714zM950.857143 548.571429l0 256-804.571429 0 0-109.714286 182.857143-182.857143 91.428571 91.428571 292.571429-292.571429zM1005.714286 146.285714l-914.285714 0q-7.460571 0-12.873143 5.412571t-5.412571 12.873143l0 694.857143q0 7.460571 5.412571 12.873143t12.873143 5.412571l914.285714 0q7.460571 0 12.873143-5.412571t5.412571-12.873143l0-694.857143q0-7.460571-5.412571-12.873143t-12.873143-5.412571zM1097.142857 164.571429l0 694.857143q0 37.741714-26.843429 64.585143t-64.585143 26.843429l-914.285714 0q-37.741714 0-64.585143-26.843429t-26.843429-64.585143l0-694.857143q0-37.741714 26.843429-64.585143t64.585143-26.843429l914.285714 0q37.741714 0 64.585143 26.843429t26.843429 64.585143z"
        />
      </svg>
    </div>
  </div>,
  <div
    class="ant-divider ant-divider-horizontal"
    role="separator"
  />,
  <form
    class="ant-form ant-form-inline"
    style="margin:16px 0"
  >
    <div
      class="ant-row ant-form-item"
    >
      <div
        class="ant-col ant-form-item-label"
      >
        <label
          class=""
          title="Active"
        >
          Active
        </label>
      </div>
      <div
        class="ant-col ant-form-item-control"
      >
        <div
          class="ant-form-item-control-input"
        >
          <div
            class="ant-form-item-control-input-content"
          >
            <button
              aria-checked="false"
              class="ant-switch"
              role="switch"
              type="button"
            >
              <div
                class="ant-switch-handle"
              />
              <span
                class="ant-switch-inner"
              />
            </button>
          </div>
        </div>
      </div>
    </div>
    <div
      class="ant-row ant-form-item"
    >
      <div
        class="ant-col ant-form-item-label"
      >
        <label
          class=""
          title="Button Block"
        >
          Button Block
        </label>
      </div>
      <div
        class="ant-col ant-form-item-control"
      >
        <div
          class="ant-form-item-control-input"
        >
          <div
            class="ant-form-item-control-input-content"
          >
            <button
              aria-checked="false"
              class="ant-switch"
              role="switch"
              type="button"
            >
              <div
                class="ant-switch-handle"
              />
              <span
                class="ant-switch-inner"
              />
            </button>
          </div>
        </div>
      </div>
    </div>
    <div
      class="ant-row ant-form-item"
    >
      <div
        class="ant-col ant-form-item-label"
      >
        <label
          class=""
          title="Size"
        >
          Size
        </label>
      </div>
      <div
        class="ant-col ant-form-item-control"
      >
        <div
          class="ant-form-item-control-input"
        >
          <div
            class="ant-form-item-control-input-content"
          >
            <div
              class="ant-radio-group ant-radio-group-outline"
            >
              <label
                class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
              >
                <span
                  class="ant-radio-button ant-radio-button-checked"
                >
                  <input
                    checked=""
                    class="ant-radio-button-input"
                    type="radio"
                    value="default"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Default
                </span>
              </label>
              <label
                class="ant-radio-button-wrapper"
              >
                <span
                  class="ant-radio-button"
                >
                  <input
                    class="ant-radio-button-input"
                    type="radio"
                    value="large"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Large
                </span>
              </label>
              <label
                class="ant-radio-button-wrapper"
              >
                <span
                  class="ant-radio-button"
                >
                  <input
                    class="ant-radio-button-input"
                    type="radio"
                    value="small"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Small
                </span>
              </label>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      class="ant-row ant-form-item"
    >
      <div
        class="ant-col ant-form-item-label"
      >
        <label
          class=""
          title="Button Shape"
        >
          Button Shape
        </label>
      </div>
      <div
        class="ant-col ant-form-item-control"
      >
        <div
          class="ant-form-item-control-input"
        >
          <div
            class="ant-form-item-control-input-content"
          >
            <div
              class="ant-radio-group ant-radio-group-outline"
            >
              <label
                class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
              >
                <span
                  class="ant-radio-button ant-radio-button-checked"
                >
                  <input
                    checked=""
                    class="ant-radio-button-input"
                    type="radio"
                    value="default"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Default
                </span>
              </label>
              <label
                class="ant-radio-button-wrapper"
              >
                <span
                  class="ant-radio-button"
                >
                  <input
                    class="ant-radio-button-input"
                    type="radio"
                    value="round"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Round
                </span>
              </label>
              <label
                class="ant-radio-button-wrapper"
              >
                <span
                  class="ant-radio-button"
                >
                  <input
                    class="ant-radio-button-input"
                    type="radio"
                    value="circle"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Circle
                </span>
              </label>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      class="ant-row ant-form-item"
    >
      <div
        class="ant-col ant-form-item-label"
      >
        <label
          class=""
          title="Avatar Shape"
        >
          Avatar Shape
        </label>
      </div>
      <div
        class="ant-col ant-form-item-control"
      >
        <div
          class="ant-form-item-control-input"
        >
          <div
            class="ant-form-item-control-input-content"
          >
            <div
              class="ant-radio-group ant-radio-group-outline"
            >
              <label
                class="ant-radio-button-wrapper"
              >
                <span
                  class="ant-radio-button"
                >
                  <input
                    class="ant-radio-button-input"
                    type="radio"
                    value="square"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Square
                </span>
              </label>
              <label
                class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
              >
                <span
                  class="ant-radio-button ant-radio-button-checked"
                >
                  <input
                    checked=""
                    class="ant-radio-button-input"
                    type="radio"
                    value="circle"
                  />
                  <span
                    class="ant-radio-button-inner"
                  />
                </span>
                <span>
                  Circle
                </span>
              </label>
            </div>
          </div>
        </div>
      </div>
    </div>
  </form>,
]
`;

exports[`renders ./components/skeleton/demo/list.md extend context correctly 1`] = `
Array [
  <button
    aria-checked="false"
    class="ant-switch"
    role="switch"
    type="button"
  >
    <div
      class="ant-switch-handle"
    />
    <span
      class="ant-switch-inner"
    />
  </button>,
  <div
    class="ant-list ant-list-vertical ant-list-lg ant-list-split"
  >
    <div
      class="ant-spin-nested-loading"
    >
      <div
        class="ant-spin-container"
      >
        <ul
          class="ant-list-items"
        >
          <li
            class="ant-list-item ant-list-item-no-flex"
          >
            <div
              class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
            >
              <div
                class="ant-skeleton-header"
              >
                <span
                  class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
                />
              </div>
              <div
                class="ant-skeleton-content"
              >
                <h3
                  class="ant-skeleton-title"
                  style="width:50%"
                />
                <ul
                  class="ant-skeleton-paragraph"
                >
                  <li />
                  <li />
                </ul>
              </div>
            </div>
          </li>
          <li
            class="ant-list-item ant-list-item-no-flex"
          >
            <div
              class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
            >
              <div
                class="ant-skeleton-header"
              >
                <span
                  class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
                />
              </div>
              <div
                class="ant-skeleton-content"
              >
                <h3
                  class="ant-skeleton-title"
                  style="width:50%"
                />
                <ul
                  class="ant-skeleton-paragraph"
                >
                  <li />
                  <li />
                </ul>
              </div>
            </div>
          </li>
          <li
            class="ant-list-item ant-list-item-no-flex"
          >
            <div
              class="ant-skeleton ant-skeleton-with-avatar ant-skeleton-active"
            >
              <div
                class="ant-skeleton-header"
              >
                <span
                  class="ant-skeleton-avatar ant-skeleton-avatar-lg ant-skeleton-avatar-circle"
                />
              </div>
              <div
                class="ant-skeleton-content"
              >
                <h3
                  class="ant-skeleton-title"
                  style="width:50%"
                />
                <ul
                  class="ant-skeleton-paragraph"
                >
                  <li />
                  <li />
                </ul>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>,
]
`;