docs: update docs format

components/affix/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 The simplest usage.
 
-````__react
+````jsx
 import { Affix, Button } from 'antd';
 
 ReactDOM.render(

components/affix/demo/on-change.md

@@ -13,7 +13,7 @@ title:
 
 Callback with affixed state.
 
-````__react
+````jsx
 import { Affix, Button } from 'antd';
 
 ReactDOM.render(

components/affix/demo/target.md

@@ -13,7 +13,7 @@ title:
 
 Set a `target` for 'Affix', which is listen to scroll event of target element (default is `window`).
 
-````__react
+````jsx
 import { Affix, Button } from 'antd';
 
 class Demo extends React.Component {

components/alert/demo/banner.md

@@ -13,7 +13,7 @@ title:
 
 When `Alert` is used as banner, it has particular style, Icon and `type`(warning) are specified by default.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(

components/alert/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 The simplest usage for short messages.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(

components/alert/demo/closable.md

@@ -13,7 +13,7 @@ title:
 
 To show close button.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 const onClose = function (e) {

components/alert/demo/close-text.md

@@ -13,7 +13,7 @@ title:
 
 Replace the default icon with customized text.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(

components/alert/demo/description.md

@@ -13,7 +13,7 @@ title:
 
 Additional description for alert message.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(<div>

components/alert/demo/icon.md

@@ -13,7 +13,7 @@ title:
 
 Decent icon make information more clear and more friendly.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(<div>

components/alert/demo/style.md

@@ -13,7 +13,7 @@ title:
 
 There are 4 types of Alert: `success`, `info`, `warning`, `error`.
 
-````__react
+````jsx
 import { Alert } from 'antd';
 
 ReactDOM.render(<div>

components/anchor/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 The simplest usage.
 
-```__react
+```jsx
 import { Anchor } from 'antd';
 const { Link } = Anchor;
 

components/anchor/demo/fixed.md

@@ -13,7 +13,7 @@ title:
 
 Do not change state when page is scrolling.
 
-```__react
+```jsx
 import { Anchor } from 'antd';
 const { Link } = Anchor;
 

components/auto-complete/__tests__/__snapshots__/demo.test.js.snap

@@ -128,3 +128,63 @@ exports[`test renders ./components/auto-complete/demo/options.md correctly 1`] =
   </div>
 </div>
 `;
+
+exports[`test renders ./components/auto-complete/demo/uncertain-category.md correctly 1`] = `
+<div
+  class="global-search-wrapper"
+  style="width:300px;">
+  <div
+    class="ant-select-lg ant-select-lg global-search ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
+    style="width:100%;">
+    <div
+      aria-autocomplete="list"
+      aria-expanded="false"
+      aria-haspopup="true"
+      class="ant-select-selection
+                ant-select-selection--single"
+      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">
+          input here
+        </div>
+        <ul>
+          <li
+            class="ant-select-search ant-select-search--inline">
+            <div
+              class="ant-select-search__field__wrap">
+              <span
+                class="ant-input-preSuffix-wrapper">
+                <input
+                  class="ant-input ant-input ant-select-search__field"
+                  type="text"
+                  value="" />
+                <span
+                  class="ant-input-suffix">
+                  <button
+                    class="ant-btn ant-btn-primary ant-btn-lg search-btn"
+                    type="button">
+                    <i
+                      class="anticon anticon-search" />
+                  </button>
+                </span>
+              </span>
+              <span
+                class="ant-select-search__field__mirror" />
+            </div>
+          </li>
+        </ul>
+      </div>
+      <span
+        class="ant-select-arrow"
+        style="user-select:none;-webkit-user-select:none;"
+        unselectable="unselectable">
+        <b />
+      </span>
+    </div>
+  </div>
+</div>
+`;

components/auto-complete/demo/antd.md

@@ -13,7 +13,7 @@ title:
 
 Customize Input Component
 
-````__react
+````jsx
 import { AutoComplete } from 'antd';
 
 function onSelect(value) {
@@ -48,7 +48,7 @@ const Complete = React.createClass({
         onChange={this.handleChange}
         placeholder="input here"
       >
-        <textarea onKeyPress={this.handleKeyPress} style={{ height: 50 }}/>
+        <textarea onKeyPress={this.handleKeyPress} style={{ height: 50 }} />
       </AutoComplete>
     );
   },

components/auto-complete/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 Basic Usage, set datasource of autocomplete with `dataSource` property.
 
-````__react
+````jsx
 import { AutoComplete } from 'antd';
 
 function onSelect(value) {

components/auto-complete/demo/options.md

@@ -13,7 +13,7 @@ title:
 
 You could pass `AutoComplete.Option` as children of `AutoComplete`, instead of using `dataSource`。
 
-````__react
+````jsx
 import { AutoComplete } from 'antd';
 
 const Option = AutoComplete.Option;

components/auto-complete/demo/uncertain-category.md

@@ -14,17 +14,16 @@ title:
 Demonstration of [Lookup Patterns: Uncertain Category](https://ant.design/docs/spec/reaction#Lookup-Patterns).
 Basic Usage, set datasource of autocomplete with `dataSource` property.
 
-````__react
+````jsx
 import { Icon, Button, Input, AutoComplete } from 'antd';
 const Option = AutoComplete.Option;
-const InputGroup = Input.Group;
 
 function onSelect(value) {
   console.log('onSelect', value);
 }
 
 function getRandomInt(max, min = 0) {
-    return Math.floor(Math.random() * (max - min + 1)) + min;
+  return Math.floor(Math.random() * (max - min + 1)) + min; // eslint-disable-line no-mixed-operators
 }
 
 function searchResult(query) {
@@ -37,11 +36,20 @@ function searchResult(query) {
 }
 
 function renderOption(item) {
-  return <Option key={item.category} text={item.category}>
-    {item.query} 在
-    <a href={`https://s.taobao.com/search?q=${item.query}`} target="_blank">{item.category}</a> 区块中
-    <span style={{float: 'right'}}>约 {item.count} 个结果</span>
-  </Option>;
+  return (
+    <Option key={item.category} text={item.category}>
+      {item.query} 在
+      <a
+        href={`https://s.taobao.com/search?q=${item.query}`}
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        {item.category}
+      </a>
+      区块中
+      <span style={{ float: 'right' }}>约 {item.count} 个结果</span>
+    </Option>
+  );
 }
 
 const Complete = React.createClass({
@@ -64,16 +72,20 @@ const Complete = React.createClass({
         <AutoComplete
           className="global-search"
           size="large"
-          style={{ width: '100%'}}
+          style={{ width: '100%' }}
           dataSource={dataSource.map(renderOption)}
           onSelect={onSelect}
           onChange={this.handleChange}
           placeholder="input here"
           optionLabelProp="text"
         >
-          <Input suffix={<Button className="search-btn" size="large" type="primary">
-            <Icon type="search" />
-          </Button>} />
+          <Input
+            suffix={(
+              <Button className="search-btn" size="large" type="primary">
+                <Icon type="search" />
+              </Button>
+            )}
+          />
         </AutoComplete>
       </div>
     );
@@ -123,4 +135,4 @@ ReactDOM.render(<Complete />, mountNode);
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
-````
+````

components/back-top/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 The most basic usage.
 
-````__react
+````jsx
 import { BackTop } from 'antd';
 
 ReactDOM.render(

components/back-top/demo/custom.md

@@ -14,7 +14,7 @@ title:
 You can customize the style of the button, just note the size limit: no more than `40px * 40px`.
 
 
-````__react
+````jsx
 import { BackTop } from 'antd';
 
 ReactDOM.render(

components/badge/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 Simplest Usage.
 
-````__react
+````jsx
 import { Badge } from 'antd';
 
 ReactDOM.render(

components/badge/demo/change.md

@@ -13,7 +13,7 @@ title:
 
 The count will be animated as it changes.
 
-````__react
+````jsx
 import { Badge, Button, Icon, Switch } from 'antd';
 const ButtonGroup = Button.Group;
 

components/badge/demo/dot.md

@@ -13,7 +13,7 @@ title:
 
 This will simply display a red badge, without a specific count.
 
-````__react
+````jsx
 import { Badge, Icon } from 'antd';
 
 ReactDOM.render(<div>

components/badge/demo/link.md

@@ -13,7 +13,7 @@ title:
 
 The badge can be wrapped with `a` tag to make it linkable.
 
-````__react
+````jsx
 import { Badge } from 'antd';
 
 ReactDOM.render(

components/badge/demo/no-wrapper.md

@@ -15,7 +15,7 @@ title:
 
 Used in standalone when children is empty.
 
-````__react
+````jsx
 import { Badge } from 'antd';
 
 ReactDOM.render(<div>

components/badge/demo/overflow.md

@@ -13,7 +13,7 @@ title:
 
 `${overflowCount}+` is displayed when count is larger than `overflowCount`. The default value of `overflowCount` is `99`.
 
-````__react
+````jsx
 import { Badge } from 'antd';
 
 ReactDOM.render(<div>

components/badge/demo/status.md

@@ -13,7 +13,7 @@ title:
 
 Standalone badge with status.
 
-````__react
+````jsx
 import { Badge } from 'antd';
 
 ReactDOM.render(

components/breadcrumb/demo/basic.md

@@ -13,7 +13,7 @@ title:
 
 The simplest use
 
-````__react
+````jsx
 import { Breadcrumb } from 'antd';
 
 ReactDOM.render(

components/breadcrumb/demo/router.md

@@ -14,7 +14,7 @@ title:
 
 Used together with `react-router@2+`.
 
-````__react
+````jsx
 import { Router, Route, Link, hashHistory } from 'react-router';
 import { Breadcrumb, Alert } from 'antd';
 

components/breadcrumb/demo/separator.md

@@ -13,7 +13,7 @@ title:
 
 The separator can be customized by setting the separator property: separator=">"
 
-````__react
+````jsx
 import { Breadcrumb } from 'antd';
 
 ReactDOM.render(