mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-16 01:41:02 +08:00
780 lines
22 KiB
Plaintext
780 lines
22 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`renders components/skeleton/demo/active.tsx 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.tsx 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.tsx extend context correctly 1`] = `
|
|
<div
|
|
class="ant-space ant-space-vertical"
|
|
style="width: 100%;"
|
|
>
|
|
<div
|
|
class="ant-space-item"
|
|
style="margin-bottom: 16px;"
|
|
>
|
|
<h4
|
|
style="margin-bottom: 16px;"
|
|
>
|
|
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>
|
|
<div
|
|
class="ant-space-item"
|
|
>
|
|
<button
|
|
class="ant-btn ant-btn-default"
|
|
type="button"
|
|
>
|
|
<span>
|
|
Show Skeleton
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`renders components/skeleton/demo/complex.tsx 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.tsx 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"
|
|
/>
|
|
</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"
|
|
>
|
|
<span
|
|
class="ant-skeleton-input"
|
|
/>
|
|
</div>,
|
|
<br />,
|
|
<br />,
|
|
<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"
|
|
>
|
|
<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>
|
|
<div
|
|
class="ant-space-item"
|
|
>
|
|
<div
|
|
class="ant-skeleton ant-skeleton-element"
|
|
>
|
|
<div
|
|
class="ant-skeleton-image"
|
|
>
|
|
<span
|
|
aria-label="dot-chart"
|
|
class="anticon anticon-dot-chart"
|
|
role="img"
|
|
style="font-size: 40px; color: rgb(191, 191, 191);"
|
|
>
|
|
<svg
|
|
aria-hidden="true"
|
|
data-icon="dot-chart"
|
|
fill="currentColor"
|
|
focusable="false"
|
|
height="1em"
|
|
viewBox="64 64 896 896"
|
|
width="1em"
|
|
>
|
|
<path
|
|
d="M888 792H200V168c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v688c0 4.4 3.6 8 8 8h752c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM288 604a64 64 0 10128 0 64 64 0 10-128 0zm118-224a48 48 0 1096 0 48 48 0 10-96 0zm158 228a96 96 0 10192 0 96 96 0 10-192 0zm148-314a56 56 0 10112 0 56 56 0 10-112 0z"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>,
|
|
<div
|
|
class="ant-divider ant-divider-horizontal"
|
|
role="separator"
|
|
/>,
|
|
<form
|
|
class="ant-form ant-form-inline"
|
|
style="margin: 16px 0px;"
|
|
>
|
|
<div
|
|
class="ant-space ant-space-horizontal ant-space-align-center"
|
|
style="flex-wrap: wrap; margin-bottom: -16px;"
|
|
>
|
|
<div
|
|
class="ant-space-item"
|
|
style="margin-right: 16px; padding-bottom: 16px;"
|
|
>
|
|
<div
|
|
class="ant-form-item"
|
|
>
|
|
<div
|
|
class="ant-row ant-form-item-row"
|
|
>
|
|
<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"
|
|
>
|
|
<span
|
|
class="ant-switch-inner-checked"
|
|
/>
|
|
<span
|
|
class="ant-switch-inner-unchecked"
|
|
/>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="ant-space-item"
|
|
style="margin-right: 16px; padding-bottom: 16px;"
|
|
>
|
|
<div
|
|
class="ant-form-item"
|
|
>
|
|
<div
|
|
class="ant-row ant-form-item-row"
|
|
>
|
|
<div
|
|
class="ant-col ant-form-item-label"
|
|
>
|
|
<label
|
|
class=""
|
|
title="Button and Input Block"
|
|
>
|
|
Button and Input 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"
|
|
>
|
|
<span
|
|
class="ant-switch-inner-checked"
|
|
/>
|
|
<span
|
|
class="ant-switch-inner-unchecked"
|
|
/>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="ant-space-item"
|
|
style="margin-right: 16px; padding-bottom: 16px;"
|
|
>
|
|
<div
|
|
class="ant-form-item"
|
|
>
|
|
<div
|
|
class="ant-row ant-form-item-row"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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>
|
|
</div>
|
|
<div
|
|
class="ant-space-item"
|
|
style="margin-right: 16px; padding-bottom: 16px;"
|
|
>
|
|
<div
|
|
class="ant-form-item"
|
|
>
|
|
<div
|
|
class="ant-row ant-form-item-row"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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-in-form-item"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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>
|
|
</div>
|
|
<div
|
|
class="ant-space-item"
|
|
style="padding-bottom: 16px;"
|
|
>
|
|
<div
|
|
class="ant-form-item"
|
|
>
|
|
<div
|
|
class="ant-row ant-form-item-row"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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 ant-radio-button-wrapper-in-form-item"
|
|
>
|
|
<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>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>,
|
|
]
|
|
`;
|
|
|
|
exports[`renders components/skeleton/demo/list.tsx extend context correctly 1`] = `
|
|
Array [
|
|
<button
|
|
aria-checked="false"
|
|
class="ant-switch"
|
|
role="switch"
|
|
style="margin-bottom: 16px;"
|
|
type="button"
|
|
>
|
|
<div
|
|
class="ant-switch-handle"
|
|
/>
|
|
<span
|
|
class="ant-switch-inner"
|
|
>
|
|
<span
|
|
class="ant-switch-inner-checked"
|
|
/>
|
|
<span
|
|
class="ant-switch-inner-unchecked"
|
|
/>
|
|
</span>
|
|
</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>,
|
|
]
|
|
`;
|