mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-19 03:54:28 +08:00
1754 lines
43 KiB
Plaintext
1754 lines
43 KiB
Plaintext
exports[`test renders ./components/form/demo/advanced-search.md correctly 1`] = `
|
||
<div>
|
||
<form
|
||
class="ant-form ant-form-horizontal ant-advanced-search-form">
|
||
<div
|
||
class="ant-row"
|
||
style="margin-left:-20px;margin-right:-20px;">
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-0">
|
||
Field 0
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-0"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-1">
|
||
Field 1
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-1"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-2">
|
||
Field 2
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-2"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-3">
|
||
Field 3
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-3"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-4">
|
||
Field 4
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-4"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-8"
|
||
style="padding-left:20px;padding-right:20px;">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="field-5">
|
||
Field 5
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-19">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="field-5"
|
||
placeholder="placeholder"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row">
|
||
<div
|
||
class="ant-col-24"
|
||
style="text-align:right;">
|
||
<button
|
||
class="ant-btn ant-btn-primary"
|
||
type="submit">
|
||
<span>
|
||
Search
|
||
</span>
|
||
</button>
|
||
<button
|
||
class="ant-btn"
|
||
style="margin-left:8px;"
|
||
type="button">
|
||
<span>
|
||
Clear
|
||
</span>
|
||
</button>
|
||
<a
|
||
style="margin-left:8px;font-size:12px;">
|
||
Collapse
|
||
<i
|
||
class="anticon anticon-down " />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<div
|
||
class="search-result-list">
|
||
Search Result List
|
||
</div>
|
||
</div>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/customized-form-controls.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-inline">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="price">
|
||
Price
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control has-success">
|
||
<span>
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
style="width:65%;margin-right:3%;"
|
||
type="text"
|
||
value="0" />
|
||
</span>
|
||
<div
|
||
class="ant-select-lg ant-select ant-select-enabled"
|
||
style="width:32%;">
|
||
<div
|
||
aria-autocomplete="list"
|
||
aria-expanded="false"
|
||
aria-haspopup="true"
|
||
class="ant-select-selection
|
||
ant-select-selection--single"
|
||
role="combobox"
|
||
tabindex="0">
|
||
<div
|
||
class="ant-select-selection__rendered">
|
||
<div
|
||
class="ant-select-selection-selected-value"
|
||
style="display:block;opacity:1;"
|
||
title="RMB">
|
||
RMB
|
||
</div>
|
||
</div>
|
||
<span
|
||
class="ant-select-arrow"
|
||
style="user-select:none;-webkit-user-select:none;"
|
||
unselectable="unselectable">
|
||
<b />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg"
|
||
type="submit">
|
||
<span>
|
||
Submit
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/dynamic-form-item.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-4 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="names-0">
|
||
Passengers
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-20">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="names-0"
|
||
placeholder="passenger name"
|
||
style="width:60%;margin-right:8px;"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
<i
|
||
class="anticon anticon-minus-circle-o dynamic-delete-button"
|
||
disabled="" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-20 ant-col-offset-4">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-dashed ant-btn-lg"
|
||
style="width:60%;"
|
||
type="button">
|
||
<i
|
||
class="anticon anticon-plus " />
|
||
<span>
|
||
Add
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/form-in-modal.md correctly 1`] = `
|
||
<div>
|
||
<button
|
||
class="ant-btn ant-btn-primary"
|
||
type="button">
|
||
<span>
|
||
New Collection
|
||
</span>
|
||
</button>
|
||
</div>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/global-state.md correctly 1`] = `
|
||
<div>
|
||
<form
|
||
class="ant-form ant-form-inline">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="username">
|
||
Username
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control has-success">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="username"
|
||
type="text"
|
||
value="BENJYCUI" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<pre
|
||
class="language-bash">
|
||
{
|
||
\"username\": {
|
||
\"value\": \"benjycui\"
|
||
}
|
||
}
|
||
</pre>
|
||
</div>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/horizontal-login.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-inline">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper ant-input-group">
|
||
<span
|
||
class="ant-input-group-addon">
|
||
<i
|
||
class="anticon anticon-user " />
|
||
</span>
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="userName"
|
||
placeholder="Username"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper ant-input-group">
|
||
<span
|
||
class="ant-input-group-addon">
|
||
<i
|
||
class="anticon anticon-lock " />
|
||
</span>
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="password"
|
||
placeholder="Password"
|
||
type="password"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg"
|
||
type="submit">
|
||
<span>
|
||
Log in
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/normal-login.md correctly 1`] = `
|
||
<form
|
||
class="ant-form login-form">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper ant-input-group">
|
||
<span
|
||
class="ant-input-group-addon">
|
||
<i
|
||
class="anticon anticon-user " />
|
||
</span>
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="userName"
|
||
placeholder="Username"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper ant-input-group">
|
||
<span
|
||
class="ant-input-group-addon">
|
||
<i
|
||
class="anticon anticon-lock " />
|
||
</span>
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="password"
|
||
placeholder="Password"
|
||
type="password"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control has-success">
|
||
<label
|
||
class="ant-checkbox-wrapper">
|
||
<span
|
||
class="ant-checkbox ant-checkbox-checked ant-checkbox-checked-1">
|
||
<span
|
||
class="ant-checkbox-inner" />
|
||
<input
|
||
checked=""
|
||
class="ant-checkbox-input"
|
||
type="checkbox" />
|
||
</span>
|
||
<span>
|
||
Remember me
|
||
</span>
|
||
</label>
|
||
<a
|
||
class="login-form-forgot">
|
||
Forgot password
|
||
</a>
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg login-form-button"
|
||
type="submit">
|
||
<span>
|
||
Log in
|
||
</span>
|
||
</button>
|
||
Or
|
||
<a>
|
||
register now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/register.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="email">
|
||
E-mail
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="email"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="password">
|
||
Password
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="password"
|
||
type="password"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="confirm">
|
||
Confirm Password
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="confirm"
|
||
type="password"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="nickname">
|
||
<span>
|
||
Nickname
|
||
<i
|
||
class="anticon anticon-question-circle-o " />
|
||
</span>
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="nickname"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="residence">
|
||
Habitual Residence
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control has-success">
|
||
<span
|
||
class="ant-cascader-picker">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
autocomplete="off"
|
||
class="ant-input ant-cascader-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="residence"
|
||
readonly=""
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
<span
|
||
class="ant-cascader-picker-label">
|
||
Zhejiang / Hangzhou / West Lake
|
||
</span>
|
||
<i
|
||
class="anticon anticon-cross-circle ant-cascader-picker-clear" />
|
||
<i
|
||
class="anticon anticon-down ant-cascader-picker-arrow" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="phone">
|
||
Phone Number
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-input-wrapper ant-input-group">
|
||
<span
|
||
class="ant-input-group-addon">
|
||
<div
|
||
class="icp-selector ant-select ant-select-enabled">
|
||
<div
|
||
aria-autocomplete="list"
|
||
aria-expanded="false"
|
||
aria-haspopup="true"
|
||
class="ant-select-selection
|
||
ant-select-selection--single"
|
||
role="combobox"
|
||
tabindex="0">
|
||
<div
|
||
class="ant-select-selection__rendered">
|
||
<div
|
||
class="ant-select-selection-selected-value"
|
||
style="display:block;opacity:1;"
|
||
title="+86">
|
||
+86
|
||
</div>
|
||
</div>
|
||
<span
|
||
class="ant-select-arrow"
|
||
style="user-select:none;-webkit-user-select:none;"
|
||
unselectable="unselectable">
|
||
<b />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="phone"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="captcha">
|
||
Captcha
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-row"
|
||
style="margin-left:-4px;margin-right:-4px;">
|
||
<div
|
||
class="ant-col-12"
|
||
style="padding-left:4px;padding-right:4px;">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
data-__meta="[object Object]"
|
||
id="captcha"
|
||
type="text"
|
||
value="" />
|
||
</span>
|
||
</div>
|
||
<div
|
||
class="ant-col-12"
|
||
style="padding-left:4px;padding-right:4px;">
|
||
<button
|
||
class="ant-btn ant-btn-lg"
|
||
type="button">
|
||
<span>
|
||
Get captcha
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<span
|
||
class="ant-form-extra">
|
||
We must make sure that your are a human.
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item"
|
||
style="margin-bottom:8px;">
|
||
<div
|
||
class="ant-col-14 ant-col-offset-6">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<label
|
||
class="ant-checkbox-wrapper">
|
||
<span
|
||
class="ant-checkbox">
|
||
<span
|
||
class="ant-checkbox-inner" />
|
||
<input
|
||
class="ant-checkbox-input"
|
||
type="checkbox" />
|
||
</span>
|
||
<span>
|
||
I had read the
|
||
<a>
|
||
agreement
|
||
</a>
|
||
</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-14 ant-col-offset-6">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg"
|
||
type="submit">
|
||
<span>
|
||
Register
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/time-related-controls.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="date-picker">
|
||
DatePicker
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span>
|
||
<input
|
||
class="ant-calendar-range-picker ant-input ant-input-lg"
|
||
placeholder="请选择日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="date-time-picker">
|
||
DatePicker[showTime]
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span>
|
||
<input
|
||
class="ant-calendar-range-picker ant-input ant-input-lg"
|
||
placeholder="请选择日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="month-picker">
|
||
MonthPicker
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span>
|
||
<input
|
||
class="ant-calendar-range-picker ant-input ant-input-lg"
|
||
placeholder="请选择日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="range-picker">
|
||
RangePicker
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span
|
||
class="ant-calendar-range-picker ant-input ant-input-lg">
|
||
<input
|
||
class="ant-calendar-range-picker-input"
|
||
placeholder="开始日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-range-picker-separator">
|
||
~
|
||
</span>
|
||
<input
|
||
class="ant-calendar-range-picker-input"
|
||
placeholder="结束日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="range-time-picker">
|
||
RangePicker[showTime]
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span
|
||
class="ant-calendar-range-picker ant-input ant-input-lg">
|
||
<input
|
||
class="ant-calendar-range-picker-input"
|
||
placeholder="开始日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-range-picker-separator">
|
||
~
|
||
</span>
|
||
<input
|
||
class="ant-calendar-range-picker-input"
|
||
placeholder="结束日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-8 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="time-picker">
|
||
TimePicker
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-16">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-time-picker ant-time-picker-large">
|
||
<input
|
||
class="ant-time-picker-input"
|
||
placeholder="请选择时间"
|
||
readonly=""
|
||
type="text"
|
||
value="" />
|
||
<span
|
||
class="ant-time-picker-icon" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-16 ant-col-offset-8">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg"
|
||
type="submit">
|
||
<span>
|
||
Submit
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/validate-other.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="select">
|
||
Select
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-select-lg ant-select ant-select-enabled">
|
||
<div
|
||
aria-autocomplete="list"
|
||
aria-expanded="false"
|
||
aria-haspopup="true"
|
||
class="ant-select-selection
|
||
ant-select-selection--single"
|
||
role="combobox"
|
||
tabindex="0">
|
||
<div
|
||
class="ant-select-selection__rendered">
|
||
<div
|
||
class="ant-select-selection__placeholder"
|
||
style="display:block;user-select:none;-webkit-user-select:none;"
|
||
unselectable="unselectable">
|
||
Please select a country
|
||
</div>
|
||
</div>
|
||
<span
|
||
class="ant-select-arrow"
|
||
style="user-select:none;-webkit-user-select:none;"
|
||
unselectable="unselectable">
|
||
<b />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class="ant-form-item-required"
|
||
for="select-multiple">
|
||
Select[multiple]
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-select-lg ant-select ant-select-enabled">
|
||
<div
|
||
aria-autocomplete="list"
|
||
aria-expanded="false"
|
||
aria-haspopup="true"
|
||
class="ant-select-selection
|
||
ant-select-selection--multiple"
|
||
role="combobox">
|
||
<div
|
||
class="ant-select-selection__rendered">
|
||
<div
|
||
class="ant-select-selection__placeholder"
|
||
style="display:block;user-select:none;-webkit-user-select:none;"
|
||
unselectable="unselectable">
|
||
Please select favourite colors
|
||
</div>
|
||
<ul>
|
||
<li
|
||
class="ant-select-search ant-select-search--inline">
|
||
<div
|
||
class="ant-select-search__field__wrap">
|
||
<input
|
||
class="ant-select-search__field"
|
||
value="" />
|
||
<span
|
||
class="ant-select-search__field__mirror" />
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="input-number">
|
||
InputNumber
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control has-success">
|
||
<div
|
||
class="ant-input-number ant-input-number-lg">
|
||
<div
|
||
class="ant-input-number-handler-wrap">
|
||
<span
|
||
class="ant-input-number-handler ant-input-number-handler-up "
|
||
unselectable="unselectable">
|
||
<span
|
||
class="ant-input-number-handler-up-inner"
|
||
unselectable="unselectable" />
|
||
</span>
|
||
<span
|
||
class="ant-input-number-handler ant-input-number-handler-down "
|
||
unselectable="unselectable">
|
||
<span
|
||
class="ant-input-number-handler-down-inner"
|
||
unselectable="unselectable" />
|
||
</span>
|
||
</div>
|
||
<div
|
||
class="ant-input-number-input-wrap">
|
||
<input
|
||
autocomplete="off"
|
||
class="ant-input-number-input"
|
||
max="10"
|
||
min="1"
|
||
value="3" />
|
||
</div>
|
||
</div>
|
||
<span
|
||
class="ant-form-text">
|
||
machines
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="switch">
|
||
Switch
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-switch"
|
||
data-__meta="[object Object]"
|
||
id="switch"
|
||
tabindex="0">
|
||
<span
|
||
class="ant-switch-inner" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="slider">
|
||
Slider
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-slider ant-slider-with-marks">
|
||
<div
|
||
class="ant-slider-rail" />
|
||
<div
|
||
class="ant-slider-track ant-slider-track-1"
|
||
style="visibility:visible;left:0%;width:0%;" />
|
||
<div
|
||
class="ant-slider-step">
|
||
<span
|
||
class="ant-slider-dot ant-slider-dot-active"
|
||
style="left:0%;" />
|
||
<span
|
||
class="ant-slider-dot"
|
||
style="left:20%;" />
|
||
<span
|
||
class="ant-slider-dot"
|
||
style="left:40%;" />
|
||
<span
|
||
class="ant-slider-dot"
|
||
style="left:60%;" />
|
||
<span
|
||
class="ant-slider-dot"
|
||
style="left:80%;" />
|
||
<span
|
||
class="ant-slider-dot"
|
||
style="left:100%;" />
|
||
</div>
|
||
<div
|
||
class="ant-slider-handle ant-slider-handle-2 ant-slider-handle-upper"
|
||
style="left:0%;" />
|
||
<div
|
||
class="ant-slider-mark">
|
||
<span
|
||
class="ant-slider-mark-text ant-slider-mark-text-active"
|
||
style="width:18%;margin-left:-9%;left:0%;">
|
||
A
|
||
</span>
|
||
<span
|
||
class="ant-slider-mark-text"
|
||
style="width:18%;margin-left:-9%;left:20%;">
|
||
B
|
||
</span>
|
||
<span
|
||
class="ant-slider-mark-text"
|
||
style="width:18%;margin-left:-9%;left:40%;">
|
||
C
|
||
</span>
|
||
<span
|
||
class="ant-slider-mark-text"
|
||
style="width:18%;margin-left:-9%;left:60%;">
|
||
D
|
||
</span>
|
||
<span
|
||
class="ant-slider-mark-text"
|
||
style="width:18%;margin-left:-9%;left:80%;">
|
||
E
|
||
</span>
|
||
<span
|
||
class="ant-slider-mark-text"
|
||
style="width:18%;margin-left:-9%;left:100%;">
|
||
F
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="radio-group">
|
||
Radio.Group
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-radio-group ant-radio-group-large">
|
||
<label
|
||
class="ant-radio-button-wrapper">
|
||
<span
|
||
class="ant-radio-button">
|
||
<span
|
||
class="ant-radio-button-inner" />
|
||
<input
|
||
class="ant-radio-button-input"
|
||
type="radio" />
|
||
</span>
|
||
<span>
|
||
item 1
|
||
</span>
|
||
</label>
|
||
<label
|
||
class="ant-radio-button-wrapper">
|
||
<span
|
||
class="ant-radio-button">
|
||
<span
|
||
class="ant-radio-button-inner" />
|
||
<input
|
||
class="ant-radio-button-input"
|
||
type="radio" />
|
||
</span>
|
||
<span>
|
||
item 2
|
||
</span>
|
||
</label>
|
||
<label
|
||
class="ant-radio-button-wrapper">
|
||
<span
|
||
class="ant-radio-button">
|
||
<span
|
||
class="ant-radio-button-inner" />
|
||
<input
|
||
class="ant-radio-button-input"
|
||
type="radio" />
|
||
</span>
|
||
<span>
|
||
item 3
|
||
</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-6 ant-form-item-label">
|
||
<label
|
||
class=""
|
||
for="upload">
|
||
Upload
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-14">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="">
|
||
<div
|
||
class="ant-upload ant-upload-select ant-upload-select-picture"
|
||
style="display:;" />
|
||
<div
|
||
class="ant-upload-list ant-upload-list-picture" />
|
||
</span>
|
||
<span
|
||
class="ant-form-extra">
|
||
longgggggggggggggggggggggggggggggggggg
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-12 ant-col-offset-6">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<button
|
||
class="ant-btn ant-btn-primary ant-btn-lg"
|
||
type="submit">
|
||
<span>
|
||
Submit
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/validate-static.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Fail
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-error">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="error"
|
||
placeholder="unavailable choice"
|
||
type="text" />
|
||
</span>
|
||
<div
|
||
class="ant-form-explain">
|
||
Should be combination of numbers & alphabets
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Warning
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-warning">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="warning"
|
||
placeholder="Warning"
|
||
type="text" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Validating
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-feedback is-validating">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="validating"
|
||
placeholder="I\'m the content is being validated"
|
||
type="text" />
|
||
</span>
|
||
<div
|
||
class="ant-form-explain">
|
||
The information is being validated...
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Success
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-feedback has-success">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="success"
|
||
placeholder="I\'m the content"
|
||
type="text" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Warning
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-feedback has-warning">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="warning"
|
||
placeholder="Warning"
|
||
type="text" />
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Fail
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control has-feedback has-error">
|
||
<span
|
||
class="ant-input-wrapper">
|
||
<input
|
||
class="ant-input ant-input-lg"
|
||
id="error"
|
||
placeholder="unavailable choice"
|
||
type="text" />
|
||
</span>
|
||
<div
|
||
class="ant-form-explain">
|
||
Should be combination of numbers & alphabets
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="ant-col-5 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
inline
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-col-6">
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control has-error">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span>
|
||
<input
|
||
class="ant-calendar-range-picker ant-input ant-input-lg"
|
||
placeholder="请选择日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
<div
|
||
class="ant-form-explain">
|
||
Please select the correct date
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-col-1">
|
||
<p
|
||
class="ant-form-split">
|
||
-
|
||
</p>
|
||
</div>
|
||
<div
|
||
class="ant-col-6">
|
||
<div
|
||
class="ant-row ant-form-item">
|
||
<div
|
||
class="">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<span
|
||
class="ant-calendar-picker">
|
||
<span>
|
||
<input
|
||
class="ant-calendar-range-picker ant-input ant-input-lg"
|
||
placeholder="请选择日期"
|
||
readonly=""
|
||
value="" />
|
||
<span
|
||
class="ant-calendar-picker-icon" />
|
||
</span>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-form-explain" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|
||
|
||
exports[`test renders ./components/form/demo/without-form-create.md correctly 1`] = `
|
||
<form
|
||
class="ant-form ant-form-horizontal">
|
||
<div
|
||
class="ant-row ant-form-item ant-form-item-with-help">
|
||
<div
|
||
class="ant-col-7 ant-form-item-label">
|
||
<label
|
||
class="">
|
||
Prime between 8 & 12
|
||
</label>
|
||
</div>
|
||
<div
|
||
class="ant-col-12">
|
||
<div
|
||
class="ant-form-item-control ">
|
||
<div
|
||
class="ant-input-number ant-input-number-lg">
|
||
<div
|
||
class="ant-input-number-handler-wrap">
|
||
<span
|
||
class="ant-input-number-handler ant-input-number-handler-up "
|
||
unselectable="unselectable">
|
||
<span
|
||
class="ant-input-number-handler-up-inner"
|
||
unselectable="unselectable" />
|
||
</span>
|
||
<span
|
||
class="ant-input-number-handler ant-input-number-handler-down "
|
||
unselectable="unselectable">
|
||
<span
|
||
class="ant-input-number-handler-down-inner"
|
||
unselectable="unselectable" />
|
||
</span>
|
||
</div>
|
||
<div
|
||
class="ant-input-number-input-wrap">
|
||
<input
|
||
autocomplete="off"
|
||
class="ant-input-number-input"
|
||
max="12"
|
||
min="8"
|
||
value="11" />
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="ant-form-explain">
|
||
A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
`;
|