[release] 2.0.6

[build] 2.0.6
Changelog: update for 2.0.6
2025-12-19 12:04:02 +08:00 · 2017-11-29 14:32:44 +08:00 · 2017-11-29 14:32:44 +08:00 · 2017-11-29 14:26:16 +08:00 · 2017-11-29 13:52:44 +08:00 · 2017-11-27 18:35:49 +08:00
53 changed files with 667 additions and 208 deletions
--- a/.github/CONTRIBUTING.es.md
+++ b/.github/CONTRIBUTING.es.md
@@ -0,0 +1,76 @@
+# Guía para Contribuidores a `Element UI`
+
+¡Hola! Gracias por elegir [Element UI](http://element.eleme.io/#/en-US).
+
+`Element UI` es un archivo de componentes para desarrolladores y para gerentes de productos ‘web’ basado en [Vue 2.0](https://vuejs.org/)
+
+Estamos orgullosos de que usted esta interesado en contribuir al proyecto `Element`. Antes de someter sus contribuciones, por favor tome un momentito para leer estas simples guías para contribuidores.
+
+
+## Guía Para Reportar Problemas (“Issues”)
+
+- [“Issues”]( https://elementui.github.io/issue-generator) son exclusivamente para informar de errores, sugerencias o solicitaciones para funcionalidad adicional referente a diseño. Preguntas de otro tipo corren el riesgo de ser cerradas inmediatamente. Sí tiene preguntas sobre el uso de `Element`, vea [Gitter](https://gitter.im/element-en/Lobby) para más ayuda.
+
+- Antes de someter un informe sobre algún problema, sírvase de revisar  sí ya hubo un informe.
+
+- Por favor especifique que versión de `Element` y `Vue` que esta utilizando, y que versión de sistema operativo y que versión de navegador web que está utilizando. [JSFiddle](https://jsfiddle.net/) esta recomendado para crear un entorno para reproducir el problema claramente.
+
+
+## Guías para un “Pull Request (PR)”
+
+- Crea una bifurcación (“fork”) del repositorio a su propia cuenta en github.com. Por favor no crea ramas nuevas aquí.
+
+- Cuando cometa su cambio, formatea en esta forma: `[Nombre de componente]: Datos sobre el “commit”.` (por ejemplo. `Button: Reparación de xxx error`)
+
+- **DE NINGUNA MANERA** incluya archivos dentro del directorio `lib`.
+
+- Asegúrese de que el comando `npm run dist` produzca los archivos correctos.
+
+- Para asegurar compatibilidad y reducir tamaño de los archivos, nuestra configuración de `babel` solo importa `preset-2015`, así que IPAs como  Array.prototype.find` y `Object.assign` en `ES2015` no son recomendados. Puede importar “polyfills” terceros, sí es necesario.
+
+- “Rebase” antes de crear un “pull request (PR)” para mantener la historia de “commits” limpia.
+
+- Asegúrese que sus PRs se refrieran a la rama `dev`  y no a la rama  `master`.
+
+- Si su PR arregla un error técnico, por favor, haga referencia al error especifico.
+
+- Fusión de un PR requiere dos mantenedores: el primero aprueba los cambios después de revisar, y entonces el segundo mantenedor revisa los cambios y hace la fusión.
+
+
+## Requerimientos Técnicos 
+`Node.js 4+` y `NPM 3+` son requisitos
+.
+```shell
+git clone git@github.com:ElemeFE/element.git
+npm run dev
+
+# abra http://localhost:8085
+```
+
+Para usuarios chinos, [yarn](https://github.com/yarnpkg/yarn) con `taobao registry` es recomendado, sí la instalación de dependencias es lenta.
+
+```shell
+npm i yarn -g
+yarn config set registry https://registry.npm.taobao.org
+yarn
+npm run dev
+
+# abra http://localhost:8085
+```
+
+Para armar:
+
+```
+shell
+npm run dist
+```
+
+## Guía Para Desarrollo de Componentes
+- Corra el comando `make new <component-name>` para crear el directorio de su proyecto para un componente nuevo. Verifique su código fuente test, configuración para armar, documentación y `package.json` están incluidos.
+- Refiérase al `Button` para componentes anidados.
+- Refiérase al `Select` para componentes que dependen de otros componentes.
+
+
+## Estilo de Desarrollo
+Por favor acate a este estilo [ESLint](https://github.com/ElemeFE/eslint-config-elemefe) configuración de [ElemeFE](https://github.com/elemefe).
+
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -1,5 +1,5 @@
 Please make sure these boxes are checked before submitting your PR, thank you!

-* [ ] Make sure you follow Element's contributing guide ([中文](https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.zh-CN.md) | [English](https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.en-US.md)).
+* [ ] Make sure you follow Element's contributing guide ([中文](https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.zh-CN.md) | [English](https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.en-US.md) | [Español](https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.es.md)).
 * [ ] Make sure you are merging your commits to `dev` branch.
 * [ ] Add some descriptions and refer relative issues for you PR.
--- a/CHANGELOG.en-US.md
+++ b/CHANGELOG.en-US.md
@@ -1,5 +1,16 @@
 ## Changelog

+### 2.0.6
+
+*2017-11-29*
+
+- Fixed style bug of Table's sorting icons, #8405
+- Fixed trigger mechanism for Popover when its `trigger` is manual, #8467
+- Added `prefix-icon` and `suffix-icon` attributes for Autocomplete, #8446 (by @liyanlong)
+- Added `separator` attribute for Cascader, #8501
+- Added `clearable` attribute for Input, #8509 (by @lbogdan)
+- Added `background` attribute for Pagination, #8553
+
 ### 2.0.5

 *2017-11-17*
--- a/CHANGELOG.zh-CN.md
+++ b/CHANGELOG.zh-CN.md
@@ -1,5 +1,16 @@
 ## 更新日志

+### 2.0.6
+
+*2017-11-29*
+
+- 修复 Table 排序图标的样式问题，#8405
+- 修复 `trigger` 为 manual 的 Popover 的触发问题，#8467
+- 新增 Autocomplete 的 `prefix-icon` 和 `suffix-icon` 属性，#8446（by @liyanlong）
+- 新增 Cascader 的 `separator` 属性，#8501
+- 新增 Input 的 `clearable` 属性，#8509（by @lbogdan）
+- 新增 Pagination 的 `background` 属性，#8553
+
 ### 2.0.5

 *2017-11-17*
--- a/FAQ.md
+++ b/FAQ.md
@@ -1,143 +1,217 @@
 ## 常见问题

 <details>
-<summary>给组件绑定的事件为什么无法触发？</summary>
-
-在 Vue 2.0 中，为**自定义**组件绑定**原生**事件必须使用 `.native` 修饰符：
-```html
-<my-component @click.native="handleClick">Click Me</my-component>
-```
-
-从易用性的角度出发，我们对 `Button` 组件进行了处理，使它可以监听 `click` 事件：
-```html
-<el-button @click="handleButtonClick">Click Me</el-button>
-```
-
-但是对于其他组件，还是需要添加 `.native` 修饰符。
-</details>
-
-<details>
-<summary>如何在 Table 组件的每一行添加操作该行数据的按钮？</summary>
-
-使用 [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots) 即可：
-```html
-<el-table-column label="操作">
-  <template slot-scope="props">
-    <el-button @click.native="showDetail(props.row)">查看详情</el-button>
-  </template>
-</el-table-column>
-```
-参数 `row` 即为对应行的数据。
-</details>
-
-<details>
-<summary>Tree 组件的 `render-content` 和 Table 组件的 `render-header` 怎么用？</summary>
-
-请阅读 Vue 文档 [Render Function](http://vuejs.org/v2/guide/render-function.html) 的相关内容。注意，使用 JSX 来写 Render Function 的话，需要安装 `babel-plugin-transform-vue-jsx`，并参照其[文档](https://github.com/vuejs/babel-plugin-transform-vue-jsx)进行配置。
-</details>
-
-<details>
-<summary>所有组件的任意属性都支持 `.sync` 修饰符吗？</summary>
+  <summary>给组件绑定的事件为什么无法触发？</summary>
  
-不是。对于支持 `.sync` 修饰符的属性，我们会在文档的 API 表格中注明。更多 `.sync` 的用法请查看 [Vue 文档](https://vuejs.org/v2/guide/components.html#sync-Modifier)。
+  在 Vue 2.0 中，为**自定义**组件绑定**原生**事件必须使用 `.native` 修饰符：
+  ```html
+  <my-component @click.native="handleClick">Click Me</my-component>
+  ```
+  
+  从易用性的角度出发，我们对 `Button` 组件进行了处理，使它可以监听 `click` 事件：
+  ```html
+  <el-button @click="handleButtonClick">Click Me</el-button>
+  ```
+  
+  但是对于其他组件，还是需要添加 `.native` 修饰符。
 </details>

 <details>
-<summary>你们的文档怎么偷偷更新了？</summary>
-
-我们只会在 Element 发布新版本时同步更新文档，以体现最新的变化。详细的更新内容可以查看 [changelog](https://github.com/ElemeFE/element/blob/master/CHANGELOG.zh-CN.md)。
+  <summary>如何在 Table 组件的每一行添加操作该行数据的按钮？</summary>
+  
+  使用 [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots) 即可：
+  ```html
+  <el-table-column label="操作">
+    <template slot-scope="props">
+      <el-button @click.native="showDetail(props.row)">查看详情</el-button>
+    </template>
+  </el-table-column>
+  ```
+  参数 `row` 即为对应行的数据。
 </details>

 <details>
-<summary>在项目中引入 Element，但是 CSS 报错/字体文件报错/组件没有样式是什么原因？</summary>
-
-请参考我们提供的 [starter kit](https://github.com/ElementUI/element-starter)，在 webpack 的 loaders 中正确配置 file-loader、css-loader 和 style-loader。此外，我们还提供了基于 [cooking](https://github.com/ElementUI/element-cooking-starter) 和 [laravel](https://github.com/ElementUI/element-in-laravel-starter) 的项目模板。
+  <summary>Tree 组件的 `render-content` 和 Table 组件的 `render-header` 怎么用？</summary>
+  
+  请阅读 Vue 文档 [Render Function](http://vuejs.org/v2/guide/render-function.html) 的相关内容。注意，使用 JSX 来写 Render Function 的话，需要安装 `babel-plugin-transform-vue-jsx`，并参照其[文档](https://github.com/vuejs/babel-plugin-transform-vue-jsx)进行配置。
 </details>

 <details>
-<summary>将 Element 克隆至本地，运行时为何会报错/跑不起来？</summary>
+  <summary>所有组件的任意属性都支持 `.sync` 修饰符吗？</summary>
+  
+  不是。对于支持 `.sync` 修饰符的属性，我们会在文档的 API 表格中注明。更多 `.sync` 的用法请查看 [Vue 文档](https://vuejs.org/v2/guide/components.html#sync-Modifier)。
+</details>

-首先，确保克隆的是 master 分支的最新代码，并且文件完整。其次，确保本地的 node 版本在 4.0 以上，npm 版本在 3.0 以上。最后，可以启动开发环境：
+<details>
+  <summary>你们的文档怎么偷偷更新了？</summary>
+  
+  我们只会在 Element 发布新版本时同步更新文档，以体现最新的变化。详细的更新内容可以查看 [changelog](https://github.com/ElemeFE/element/blob/master/CHANGELOG.zh-CN.md)。
+</details>

-```bash
-npm run dev
-```
+<details>
+  <summary>在项目中引入 Element，但是 CSS 报错/字体文件报错/组件没有样式是什么原因？</summary>
+  
+  请参考我们提供的 [starter kit](https://github.com/ElementUI/element-starter)，在 webpack 的 loaders 中正确配置 file-loader、css-loader 和 style-loader。此外，我们还提供了基于 [cooking](https://github.com/ElementUI/element-cooking-starter) 和 [laravel](https://github.com/ElementUI/element-in-laravel-starter) 的项目模板。
+</details>

-或是直接打包：
-
-```bash
-npm run dist
-```
+<details>
+  <summary>将 Element 克隆至本地，运行时为何会报错/跑不起来？</summary>
+  
+  首先，确保克隆的是 master 分支的最新代码，并且文件完整。其次，确保本地的 node 版本在 4.0 以上，npm 版本在 3.0 以上。最后，可以启动开发环境：
+  
+  ```bash
+  npm run dev
+  ```
+  
+  或是直接打包：
+  
+  ```bash
+  npm run dist
+  ```
 </details>

 ## FAQ

 <details>
-<summary>Why are my event listeners not working?</summary>
-
-In Vue 2.0, adding **native** event handlers in **custom** components requires a `.native` modifier:
-```html
-<my-component @click.native="handleClick">Click Me</my-component>
-```
-
-For the sake of usability, we processed `Button` so it can listen to `click` events:
-```html
-<el-button @click="handleButtonClick">Click Me</el-button>
-```
-
-For other components, the `.native` modifier is still mandatory.
-</details>
-
-<details>
-<summary>How do I add buttons in each row of Table to operate data of that row?</summary>
-
-Just use [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots):
-```html
-<el-table-column label="Operations">
-  <template slot-scope="props">
-    <el-button @click.native="showDetail(props.row)">Details</el-button>
-  </template>
-</el-table-column>
-```
-The parameter `row` is the data object of corresponding row.
-</details>
-
-<details>
-<summary>How do `render-content` of Tree and `render-header` of Table work?</summary>
-
-Please refer to [Render Function](http://vuejs.org/v2/guide/render-function.html) in Vue's documentation. In addition, if you are writing render functions with JSX, `babel-plugin-transform-vue-jsx` is required. See [here](https://github.com/vuejs/babel-plugin-transform-vue-jsx) for its configurations.
-</details>
-
-<details>
-<summary>Can I use `.sync` modifier on every attribute?</summary>
+  <summary>Why are my event listeners not working?</summary>
  
-No, only a few attributes supports the `.sync` modifier, and we have explicitly marked them on the documentation's API table. For more information about `.sync`, please refer to [Vue documentation](https://vuejs.org/v2/guide/components.html#sync-Modifier).
+  In Vue 2.0, adding **native** event handlers in **custom** components requires a `.native` modifier:
+  ```html
+  <my-component @click.native="handleClick">Click Me</my-component>
+  ```
+  
+  For the sake of usability, we processed `Button` so it can listen to `click` events:
+  ```html
+  <el-button @click="handleButtonClick">Click Me</el-button>
+  ```
+  
+  For other components, the `.native` modifier is still mandatory.
 </details>

 <details>
-<summary>When do you update documentations of Element?</summary>
-
-We update documentations only when a new version of Element is published so that it reflects all the changes introduced in that version. Updated changed can be found in the [changelog](https://github.com/ElemeFE/element/blob/master/CHANGELOG.en-US.md)。
+  <summary>How do I add buttons in each row of Table to operate data of that row?</summary>
+  
+  Just use [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots):
+  ```html
+  <el-table-column label="Operations">
+    <template slot-scope="props">
+      <el-button @click.native="showDetail(props.row)">Details</el-button>
+    </template>
+  </el-table-column>
+  ```
+  The parameter `row` is the data object of corresponding row.
 </details>

 <details>
-<summary>I imported Element in my project, but why does it report CSS error/font file error/components have no style?</summary>
-
-Please refer to our [starter kit](https://github.com/ElementUI/element-starter) and correctly configure file-loader, css-loader and style-loader in webpack config file. Besides, we also provide templated based on [cooking](https://github.com/ElementUI/element-cooking-starter) and [laravel](https://github.com/ElementUI/element-in-laravel-starter).
+  <summary>How do `render-content` of Tree and `render-header` of Table work?</summary>
+  
+  Please refer to [Render Function](http://vuejs.org/v2/guide/render-function.html) in Vue's documentation. In addition, if you are writing render functions with JSX, `babel-plugin-transform-vue-jsx` is required. See [here](https://github.com/vuejs/babel-plugin-transform-vue-jsx) for its configurations.
 </details>

 <details>
-<summary>I cloned Element's repo, but failed to run it. How do I solve it?</summary>
-
-First, please make sure to clone the latest code in master branch and cloned files are intact. Then, note that the version of Nodejs should be 4.0+ and npm 3.0+. Finally, activate development:
-
-```bash
-npm run dev
-```
-
-or build it:
-
-```bash
-npm run dist
-```
+  <summary>Can I use `.sync` modifier on every attribute?</summary>
+  
+  No, only a few attributes supports the `.sync` modifier, and we have explicitly marked them on the documentation's API table. For more information about `.sync`, please refer to [Vue documentation](https://vuejs.org/v2/guide/components.html#sync-Modifier).
+</details>
+
+<details>
+  <summary>When do you update documentations of Element?</summary>
+  
+  We update documentations only when a new version of Element is published so that it reflects all the changes introduced in that version. Updated changed can be found in the [changelog](https://github.com/ElemeFE/element/blob/master/CHANGELOG.en-US.md)。
+</details>
+
+<details>
+  <summary>I imported Element in my project, but why does it report CSS error/font file error/components have no style?</summary>
+  
+  Please refer to our [starter kit](https://github.com/ElementUI/element-starter) and correctly configure file-loader, css-loader and style-loader in webpack config file. Besides, we also provide templated based on [cooking](https://github.com/ElementUI/element-cooking-starter) and [laravel](https://github.com/ElementUI/element-in-laravel-starter).
+</details>
+
+<details>
+  <summary>I cloned Element's repo, but failed to run it. How do I solve it?</summary>
+  
+  First, please make sure to clone the latest code in master branch and cloned files are intact. Then, note that the version of Nodejs should be 4.0+ and npm 3.0+. Finally, activate development:
+  
+  ```bash
+  npm run dev
+  ```
+  
+  or build it:
+  
+  ```bash
+  npm run dist
+  ```
+</details>
+
+## Preguntas más frecuentes
+
+<details>
+  <summary>¿Porque mis receptores de eventos no funcionan?</summary>
+  
+  En Vue 2.0, agregando **nativos** receptores de evento **a medida** componentes requiere el modificador `.native`:
+  ```
+  html
+  <mi-componente @click.native="handleClick">Haga Clic Aquí</mi-componente>
+  ```
+  
+  Para conveniencia, hemos ya procesado eventos para el componente `Button` para que el interfaz sea consistente con `clic` eventos de otros componentes:
+  
+  ```html
+  <el-button @click="handleButtonClick">Haga Clic Aquí</el-button>
+  ```
+  
+  Para otros componentes el uso del modificador `.native` sigue siendo obligatorio.
+</details>
+
+<details>
+  <summary>¿Como agrego botones en cada linea de una tabla para que operen en los datos de esa linea?</summary>
+  
+  Simplemente agregue [“Scoped slot”](https://vuejs.org/v2/guide/components.html#Scoped-Slots):
+  ```html
+  <el-table-column label="Operaciones">
+    <template slot-scope="props">
+      <el-button @click.native="verDetalles(props.row)">Detalles</el-button>
+    </template>
+  </el-table-column>
+  ```
+  El parámetro `row` contiene los datos de la linea correspondiente de la tabla.
+</details>
+
+<details>
+  <summary>¿Como funcionan `render-content` de `Tree` y `render-header` de `Table`?</summary>
+  
+  Por favor refiérase a [Función de representación](http://vuejs.org/v2/guide/render-function.html) en la documentación de `Vue`. Adicionalmente, sí usted está escribiendo funciones de representar con JSX, se requiere el componente `babel-plugin-transform-vue-jsx`. Más información [aquí](https://github.com/vuejs/babel-plugin-transform-vue-jsx) para su uso y configuración.
+</details>
+
+<details>
+  <summary>¿Puedo usar el modificador `.sync` con cada atributo?</summary>
+  
+  No, solamente un grupo pequeño de atributos apoyan el modificador `.sync`, y están anotados claramente en la documentación del IPA. Para información adicional sobre `.sync`, por favor refiérase a [documentación de Vue](https://vuejs.org/v2/guide/components.html#sync-Modifier).
+</details>
+
+<details>
+  <summary>¿Cuando añaden a la documentación de `Element`?</summary>
+  
+  Añadamos la documentación con cada versión nueva de `Element` y los cambios reflejan los cambios del software de esa versión. Los cambios actuales y históricos se encuentran [aquí](https://github.com/ElemeFE/element/blob/master/CHANGELOG.en-US.md).
+</details>
+
+<details>
+  <summary>¿Importé `Element` a mi proyecto pero tengo errores con `CSS` y/o fuentes y mis componentes no tienen ningún estilo?</summary>
+  
+  Refiérase a [nuestro ‘kit’ de inicio](https://github.com/ElementUI/element-starter) y configure correctamente `file-loader`, `css-loader` y `style-loader` en el archivo `webpack config`. Además, proveemos un ejemplar para [cooking](https://github.com/ElementUI/element-cooking-starter) y para [laravel](https://github.com/ElementUI/element-in-laravel-starter).
+</details>
+
+<details>
+  <summary>Hice un clon del repositorio de `Element` pero no arranca. ¿Como lo resuelvo?</summary>
+  
+  Primero, pro favor, asegúrese de usar la versión más corriente en la rama  `master` y que los archivos están en orden. Después, revise sí la versión de `Nodejs` es 4.0+ y `npm` debe ser 3.0+. Finalmente active el modo desarrollo:
+  
+  ```bash
+  npm run dev
+  ```
+  
+  O arme su aplicación así:
+  
+  ```bash
+  npm run dist
+  ```
 </details>
--- a/README.md
+++ b/README.md
@@ -18,10 +18,6 @@

 > A Vue.js 2.0 UI Toolkit for Web.

-<!--<a target='_blank' rel='nofollow' href='https://app.codesponsor.io/link/bD3dKbdDE2F7Ky9LUN1kjTFK/ElemeFE/element'>-->
-  <!--<img alt='Sponsor' width='888' height='68' src='https://app.codesponsor.io/embed/bD3dKbdDE2F7Ky9LUN1kjTFK/ElemeFE/element.svg' />-->
-<!--</a >-->
-
 ## Links
 - Homepage and documentation
  - International users: http://element.eleme.io/
--- a/build/bin/version.js
+++ b/build/bin/version.js
@@ -1,6 +1,6 @@
 var fs = require('fs');
 var path = require('path');
 var version = process.env.VERSION || require('../../package.json').version;
-var content = { '1.0.9': '1.0', '1.1.6': '1.1', '1.2.9': '1.2', '1.3.7': '1.3', '1.4.10': '1.4' };
+var content = { '1.0.9': '1.0', '1.1.6': '1.1', '1.2.9': '1.2', '1.3.7': '1.3', '1.4.11': '1.4' };
 if (!content[version]) content[version] = '2.0';
 fs.writeFileSync(path.resolve(__dirname, '../../examples/versions.json'), JSON.stringify(content));
--- a/examples/docs/en-US/cascader.md
+++ b/examples/docs/en-US/cascader.md
@@ -1669,6 +1669,7 @@ Search and select options with a keyword.
 | options   | data of the options | array | — | — |
 | props | configuration options, see the following table | object | — | — |
 | value | selected value | array | — | — |
+| separator | option separator | string | — | / |
 | popper-class | custom class name for Cascader's dropdown | string | — | — |
 | placeholder | input placeholder | string | — | Select |
 | disabled  | whether Cascader is disabled | boolean |  — | false |
--- a/examples/docs/en-US/i18n.md
+++ b/examples/docs/en-US/i18n.md
@@ -207,6 +207,7 @@ Currently Element ships with the following languages:
  <li>Slovenian (sl)</li>
  <li>Arabic (ar)</li>
  <li>Hebrew (he)</li>
+  <li>Lithuanian (lt)</li>
 </ul>

 If your target language is not included, you are more than welcome to contribute: just add another language config [here](https://github.com/ElemeFE/element/tree/master/src/locale/lang) and create a pull request.
--- a/examples/docs/en-US/input.md
+++ b/examples/docs/en-US/input.md
@@ -16,6 +16,7 @@
        input7: '',
        input8: '',
        input9: '',
+        input10: '',
        textarea: '',
        textarea2: '',
        textarea3: '',
@@ -188,6 +189,29 @@ export default {
 ```
 :::

+### Clearable
+
+::: demo Make the Input clearable with the `clearable` attribute.
+
+```html
+<el-input
+  placeholder="Please input"
+  v-model="input10"
+  clearable>
+</el-input>
+
+<script>
+export default {
+  data() {
+    return {
+      input10: ''
+    }
+  }
+}
+</script>
+```
+:::
+
 ### Input with icon

 Add an icon to indicate input type.
@@ -639,6 +663,7 @@ Search data from server-side.
 |autofocus | same as `autofocus` in native input | boolean | — | false |
 |form | same as `form` in native input | string | — | — |
 | label | label text | string | — | — |
+| clearable | whether to show clear button | boolean | — | false |

 ### Input slots

@@ -674,6 +699,8 @@ Attribute | Description | Type | Options | Default
 | name | same as `name` in native input | string | — | — |
 | select-when-unmatched | whether to emit a `select` event on enter when there is no autocomplete match | boolean | — | false |
 | label | label text | string | — | — |
+| prefix-icon | prefix icon class | string | — | — |
+| suffix-icon | suffix icon class | string | — | — |

 ### Autocomplete slots

--- a/examples/docs/en-US/message-box.md
+++ b/examples/docs/en-US/message-box.md
@@ -380,6 +380,7 @@ The corresponding methods are: `MessageBox`, `MessageBox.alert`, `MessageBox.con
 | type | message type, used for icon display | string | success / info / warning / error | — |
 | customClass | custom class name for MessageBox | string | — | — |
 | callback | MessageBox closing callback if you don't prefer Promise | function(action), where action can be 'confirm' or 'cancel', and `instance` is the MessageBox instance. You can access to that instance's attributes and methods | — | — |
+| showClose | whether to show close icon of MessageBox | boolean | — | true |
 | beforeClose | callback before MessageBox closes, and it will prevent MessageBox from closing | function(action, instance, done), where `action` can be 'confirm' or 'cancel'; `instance` is the MessageBox instance, and you can access to that instance's attributes and methods; `done` is for closing the instance | — | — |
 | lockScroll | whether to lock body scroll when MessageBox prompts | boolean | — | true |
 | showCancelButton | whether to show a cancel button | boolean | — | false (true when called with confirm and prompt) |
@@ -399,4 +400,4 @@ The corresponding methods are: `MessageBox`, `MessageBox.alert`, `MessageBox.con
 | inputValidator | validation function for the input. Should returns a boolean or string. If a string is returned, it will be assigned to inputErrorMessage | function | — | — |
 | inputErrorMessage | error message when validation fails | string | — | Illegal input |
 | center | whether to align the content in center | boolean | — | false |
-| roundButton | whether to use round button | boolean | — | false |
+| roundButton | whether to use round button | boolean | — | false |
--- a/examples/docs/en-US/pagination.md
+++ b/examples/docs/en-US/pagination.md
@@ -73,6 +73,18 @@ If you have too much data to display in one page, use pagination.
 ```
 :::

+### Buttons with background color
+
+:::demo Set the `background` attribute and the buttons will have a background color.
+```html
+<el-pagination
+  background
+  layout="prev, pager, next"
+  :total="1000">
+</el-pagination>
+```
+:::
+
 ### Small Pagination

 Use small pagination in the case of limited space.
@@ -199,6 +211,7 @@ Add more modules based on your scenario.
 | Attribute      | Description          | Type      | Accepted Values       | Default  |
 |--------------------|----------------------------------------------------------|-------------------|-------------|--------|
 | small              |   whether to use small pagination    | boolean |      —       | false |
+| background | whether the buttons have a background color | Boolean | — | false |
 | page-size              | item count of each page  | number |      —       | 10 |
 | total | total item count | number | — | — |
 | page-count | total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required | number | — | — |
--- a/examples/docs/en-US/quickstart.md
+++ b/examples/docs/en-US/quickstart.md
@@ -176,6 +176,7 @@ Vue.use(Radio)
 Vue.use(RadioGroup)
 Vue.use(RadioButton)
 Vue.use(Checkbox)
+Vue.use(CheckboxButton)
 Vue.use(CheckboxGroup)
 Vue.use(Switch)
 Vue.use(Select)
--- a/examples/docs/en-US/select.md
+++ b/examples/docs/en-US/select.md
@@ -368,7 +368,8 @@ Multiple select uses tags to display selected options.
          value: 'Option5',
          label: 'Option5'
        }],
-        value5: []
+        value5: [],
+        value11: []
      }
    }
  }
--- a/examples/docs/zh-CN/cascader.md
+++ b/examples/docs/zh-CN/cascader.md
@@ -1669,6 +1669,7 @@
 | options | 可选项数据源，键名可通过 `props` 属性配置 | array | — | — |
 | props | 配置选项，具体见下表 | object | — | — |
 | value | 选中项绑定值   | array | — | — |
+| separator | 选项分隔符 | string | — | 斜杠'/' |
 | popper-class | 自定义浮层类名   | string | —  | — |
 | placeholder | 输入框占位文本 | string | — | 请选择 |
 | disabled | 是否禁用 | boolean | — | false |
--- a/examples/docs/zh-CN/i18n.md
+++ b/examples/docs/zh-CN/i18n.md
@@ -219,6 +219,7 @@ ElementLocale.i18n((key, value) => i18n.t(key, value))
  <li>斯洛文尼亚语（sl）</li>
  <li>阿拉伯语（ar）</li>
  <li>希伯来语（he）</li>
+  <li>立陶宛语（lt）</li>
 </ul>

 如果你需要使用其他的语言，欢迎贡献 PR：只需在 [这里](https://github.com/ElemeFE/element/tree/master/src/locale/lang) 添加一个语言配置文件即可。
--- a/examples/docs/zh-CN/input.md
+++ b/examples/docs/zh-CN/input.md
@@ -831,6 +831,8 @@ export default {
 | name | 原生属性 | string | — | — |
 | select-when-unmatched | 在输入没有任何匹配建议的情况下，按下回车是否触发 `select` 事件 | boolean | — | false |
 | label | 输入框关联的label文字 | string | — | — |
+| prefix-icon | 输入框头部图标 | string | — | — |
+| suffix-icon | 输入框尾部图标 | string | — | — |

 ### Autocomplete slots
 | name | 说明 |
--- a/examples/docs/zh-CN/message-box.md
+++ b/examples/docs/zh-CN/message-box.md
@@ -378,6 +378,7 @@ import { MessageBox } from 'element-ui';
 | type | 消息类型，用于显示图标 | string | success / info / warning / error | — |
 | customClass | MessageBox 的自定义类名 | string | — | — |
 | callback | 若不使用 Promise，可以使用此参数指定 MessageBox 关闭后的回调 | function(action, instance)，action 的值为'confirm'或'cancel', instance 为 MessageBox 实例，可以通过它访问实例上的属性和方法 | — | — |
+| showClose | MessageBox 是否显示右上角关闭按钮 | boolean | — | true |
 | beforeClose | MessageBox 关闭前的回调，会暂停实例的关闭 | function(action, instance, done)，action 的值为'confirm'或'cancel'；instance 为 MessageBox 实例，可以通过它访问实例上的属性和方法；done 用于关闭 MessageBox 实例 | — | — |
 | lockScroll | 是否在 MessageBox 出现时将 body 滚动锁定 | boolean | — | true |
 | showCancelButton | 是否显示取消按钮 | boolean | — | false（以 confirm 和 prompt 方式调用时为 true） |
--- a/examples/docs/zh-CN/pagination.md
+++ b/examples/docs/zh-CN/pagination.md
@@ -23,6 +23,18 @@
 ```
 :::

+### 带有背景色的分页
+
+:::demo 设置`background`属性可以为分页按钮添加背景色。
+```html
+<el-pagination
+  background
+  layout="prev, pager, next"
+  :total="1000">
+</el-pagination>
+```
+:::
+
 ### 小型分页

 在空间有限的情况下，可以使用简单的小型分页。
@@ -199,6 +211,7 @@
 | 参数               | 说明                                                     | 类型              | 可选值      | 默认值 |
 |--------------------|----------------------------------------------------------|-------------------|-------------|--------|
 | small | 是否使用小型分页样式 | Boolean | — | false |
+| background | 是否为分页按钮添加背景色 | Boolean | — | false |
 | page-size | 每页显示条目个数 | Number | — | 10 |
 | total | 总条目数 | Number | — | — |
 | page-count | 总页数，total 和 page-count 设置任意一个就可以达到显示页码的功能；如果要支持 page-sizes 的更改，则需要使用 total 属性 | Number | — | — |
--- a/examples/docs/zh-CN/quickstart.md
+++ b/examples/docs/zh-CN/quickstart.md
@@ -176,6 +176,7 @@ Vue.use(Radio)
 Vue.use(RadioGroup)
 Vue.use(RadioButton)
 Vue.use(Checkbox)
+Vue.use(CheckboxButton)
 Vue.use(CheckboxGroup)
 Vue.use(Switch)
 Vue.use(Select)
--- a/examples/docs/zh-CN/select.md
+++ b/examples/docs/zh-CN/select.md
@@ -367,7 +367,8 @@
          value: '选项5',
          label: '北京烤鸭'
        }],
-        value5: []
+        value5: [],
+        value11: []
      }
    }
  }
--- a/examples/index.tpl
+++ b/examples/index.tpl
@@ -9,7 +9,6 @@
  </head>
  <body>
    <div id="app"></div><% if (process.env.NODE_ENV === 'production') { %>
-    <!--<script src="https://app.codesponsor.io/scripts/qFcVkt4f3DQEg4zrwINGVg?theme=light&height=250&width=240"></script>-->
    <script>
      if (!window.Promise) {
        document.write('<script src="//shadow.elemecdn.com/npm/es6-promise@4.1.1/dist/es6-promise.min.js"><\/script><script>ES6Promise.polyfill()<\/script>')
--- a/examples/versions.json
+++ b/examples/versions.json
@@ -1 +1 @@
-{"1.0.9":"1.0","1.1.6":"1.1","1.2.9":"1.2","1.3.7":"1.3","1.4.10":"1.4","2.0.5":"2.0"}
+{"1.0.9":"1.0","1.1.6":"1.1","1.2.9":"1.2","1.3.7":"1.3","1.4.11":"1.4","2.0.6":"2.0"}
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "element-ui",
-  "version": "2.0.5",
+  "version": "2.0.6",
  "description": "A Component Library for Vue.js.",
  "main": "lib/element-ui.common.js",
  "files": [
--- a/packages/autocomplete/src/autocomplete.vue
+++ b/packages/autocomplete/src/autocomplete.vue
@@ -103,6 +103,8 @@
        type: Boolean,
        default: false
      },
+      prefixIcon: String,
+      suffixIcon: String,
      label: String,
      debounce: {
        type: Number,
--- a/packages/cascader/src/main.vue
+++ b/packages/cascader/src/main.vue
@@ -46,7 +46,7 @@
      <template v-if="showAllLevels">
        <template v-for="(label, index) in currentLabels">
          {{ label }}
-          <span v-if="index < currentLabels.length - 1"> / </span>
+          <span v-if="index < currentLabels.length - 1"> {{ separator }} </span>
        </template>
      </template>
      <template v-else>
@@ -123,6 +123,10 @@ export default {
        return [];
      }
    },
+    separator: {
+      type: String,
+      default: '/'
+    },
    placeholder: {
      type: String,
      default() {
--- a/packages/date-picker/src/panel/date-range.vue
+++ b/packages/date-picker/src/panel/date-range.vue
@@ -22,6 +22,7 @@
              <span class="el-date-range-picker__time-picker-wrap">
                <el-input
                  size="small"
+                  :disabled="rangeState.selecting"
                  ref="minInput"
                  :placeholder="t('el.datepicker.startDate')"
                  class="el-date-range-picker__editor"
@@ -32,6 +33,7 @@
              <span class="el-date-range-picker__time-picker-wrap">
                <el-input
                  size="small"
+                  :disabled="rangeState.selecting"
                  :placeholder="t('el.datepicker.startTime')"
                  class="el-date-range-picker__editor"
                  :value="minVisibleTime"
@@ -51,6 +53,7 @@
              <span class="el-date-range-picker__time-picker-wrap">
                <el-input
                  size="small"
+                  :disabled="rangeState.selecting"
                  :placeholder="t('el.datepicker.endDate')"
                  class="el-date-range-picker__editor"
                  :value="maxVisibleDate"
@@ -61,6 +64,7 @@
              <span class="el-date-range-picker__time-picker-wrap">
                <el-input
                  size="small"
+                  :disabled="rangeState.selecting"
                  ref="maxInput"
                  :placeholder="t('el.datepicker.endTime')"
                  class="el-date-range-picker__editor"
@@ -508,7 +512,7 @@
          this.minTimePickerVisible = visible;
        }

-        if (this.maxDate && this.maxDate.getTime() < this.minDate.getTime()) {
+        if (!this.maxDate || this.maxDate && this.maxDate.getTime() < this.minDate.getTime()) {
          this.maxDate = new Date(this.minDate);
        }
      },
--- a/packages/dialog/src/component.vue
+++ b/packages/dialog/src/component.vue
@@ -107,7 +107,6 @@

    watch: {
      visible(val) {
-        this.$emit('update:visible', val);
        if (val) {
          this.closed = false;
          this.$emit('open');
--- a/packages/dropdown/src/dropdown-menu.vue
+++ b/packages/dropdown/src/dropdown-menu.vue
@@ -24,7 +24,7 @@

    data() {
      return {
-        size: this.dropdown.size
+        size: this.dropdown.dropdownSize
      };
    },

--- a/packages/form/src/form-item.vue
+++ b/packages/form/src/form-item.vue
@@ -176,6 +176,11 @@
        this.validateState = 'validating';

        var descriptor = {};
+        if (rules && rules.length > 0) {
+          rules.forEach(rule => {
+            delete rule.trigger;
+          });
+        }
        descriptor[this.prop] = rules;

        var validator = new AsyncValidator(descriptor);
--- a/packages/input/src/input.vue
+++ b/packages/input/src/input.vue
@@ -10,7 +10,10 @@
      'el-input--prefix': $slots.prefix || prefixIcon,
      'el-input--suffix': $slots.suffix || suffixIcon
    }
-  ]">
+    ]"
+    @mouseenter="hovering = true"
+    @mouseleave="hovering = false"
+  >
    <template v-if="type !== 'textarea'">
      <!-- 前置元素 -->
      <div class="el-input-group__prepend" v-if="$slots.prepend"  tabindex="0">
@@ -40,14 +43,20 @@
      <!-- 后置内容 -->
      <span
        class="el-input__suffix"
-        v-if="$slots.suffix || suffixIcon || validateState && needStatusIcon"
+        v-if="$slots.suffix || suffixIcon || showClear || validateState && needStatusIcon"
        :style="suffixOffset">
        <span class="el-input__suffix-inner">
-          <slot name="suffix"></slot>
-          <i class="el-input__icon"
-            v-if="suffixIcon"
-            :class="suffixIcon">
-          </i>
+          <template v-if="!showClear">
+            <slot name="suffix"></slot>
+            <i class="el-input__icon"
+              v-if="suffixIcon"
+              :class="suffixIcon">
+            </i>
+          </template>
+          <i v-else
+            class="el-input__icon el-icon-circle-close el-input__clear"
+            @click="clear"
+          ></i>
        </span>
        <i class="el-input__icon"
          v-if="validateState"
@@ -102,7 +111,9 @@
        currentValue: this.value,
        textareaCalcStyle: {},
        prefixOffset: null,
-        suffixOffset: null
+        suffixOffset: null,
+        hovering: false,
+        focused: false
      };
    },

@@ -144,7 +155,11 @@
      },
      suffixIcon: String,
      prefixIcon: String,
-      label: String
+      label: String,
+      clearable: {
+        type: Boolean,
+        default: false
+      }
    },

    computed: {
@@ -172,6 +187,9 @@
      },
      isGroup() {
        return this.$slots.prepend || this.$slots.append;
+      },
+      showClear() {
+        return this.clearable && this.currentValue !== '' && (this.focused || this.hovering);
      }
    },

@@ -197,6 +215,7 @@
        };
      },
      handleBlur(event) {
+        this.focused = false;
        this.$emit('blur', event);
        if (this.validateEvent) {
          this.dispatch('ElFormItem', 'el.form.blur', [this.currentValue]);
@@ -221,6 +240,7 @@
        this.textareaCalcStyle = calcTextareaHeight(this.$refs.textarea, minRows, maxRows);
      },
      handleFocus(event) {
+        this.focused = true;
        this.$emit('focus', event);
      },
      handleInput(event) {
@@ -252,6 +272,12 @@
        if (this.$slots[pendant]) {
          return { transform: `translateX(${place === 'suf' ? '-' : ''}${this.$el.querySelector(`.el-input-group__${pendant}`).offsetWidth}px)` };
        }
+      },
+      clear() {
+        this.$emit('input', '');
+        this.$emit('change', '');
+        this.setCurrentValue('');
+        this.focus();
      }
    },

--- a/packages/menu/src/menu.vue
+++ b/packages/menu/src/menu.vue
@@ -119,7 +119,7 @@
    data() {
      return {
        activeIndex: this.defaultActive,
-        openedMenus: this.defaultOpeneds ? this.defaultOpeneds.slice(0) : [],
+        openedMenus: (this.defaultOpeneds && !this.collapse) ? this.defaultOpeneds.slice(0) : [],
        items: {},
        submenus: {}
      };
@@ -141,7 +141,9 @@

      },
      defaultOpeneds(value) {
-        this.openedMenus = value;
+        if (!this.collapse) {
+          this.openedMenus = value;
+        }
      },
      collapse(value) {
        if (value) this.openedMenus = [];
--- a/packages/message-box/src/main.js
+++ b/packages/message-box/src/main.js
@@ -204,6 +204,7 @@ MessageBox.prompt = (message, title, options) => {
 };

 MessageBox.close = () => {
+  instance.doClose();
  instance.visible = false;
  msgQueue = [];
  currentMsg = null;
--- a/packages/pagination/src/pagination.js
+++ b/packages/pagination/src/pagination.js
@@ -40,7 +40,9 @@ export default {

    prevText: String,

-    nextText: String
+    nextText: String,
+
+    background: Boolean
  },

  data() {
@@ -51,7 +53,10 @@ export default {
  },

  render(h) {
-    let template = <div class='el-pagination'></div>;
+    let template = <div class={['el-pagination', {
+      'is-background': this.background,
+      'el-pagination--small': this.small
+    }] }></div>;
    const layout = this.layout || '';
    if (!layout) return;
    const TEMPLATE_MAP = {
@@ -67,10 +72,6 @@ export default {
    const rightWrapper = <div class="el-pagination__rightwrapper"></div>;
    let haveRightWrapper = false;

-    if (this.small) {
-      template.data.class += ' el-pagination--small';
-    }
-
    components.forEach(compo => {
      if (compo === '->') {
        haveRightWrapper = true;
@@ -210,23 +211,27 @@ export default {
          this.oldValue = event.target.value;
        },
        handleBlur({ target }) {
-          this.reassignMaxValue(target);
-        },
-        handleKeyUp(event) {
-          const key = event.key || '';
-          const keyCode = event.keyCode || '';
-          if ((key && key === 'Enter') || (keyCode && keyCode === 13)) {
-            this.reassignMaxValue(event.target);
-            this.handleChange(event.target.value);
-          }
+          this.resetValueIfNeed(target.value);
+          this.reassignMaxValue(target.value);
        },
        handleChange(value) {
          this.$parent.internalCurrentPage = this.$parent.getValidCurrentPage(value);
          this.oldValue = null;
+          this.resetValueIfNeed(value);
        },
-        reassignMaxValue(target) {
-          if (+target.value > this.$parent.internalPageCount) {
-            target.value = this.$parent.internalPageCount;
+        resetValueIfNeed(value) {
+          const num = parseInt(value, 10);
+          if (!isNaN(num)) {
+            if (num < 1) {
+              this.$refs.input.$el.querySelector('input').value = 1;
+            } else {
+              this.reassignMaxValue(value);
+            }
+          }
+        },
+        reassignMaxValue(value) {
+          if (+value > this.$parent.internalPageCount) {
+            this.$refs.input.$el.querySelector('input').value = this.$parent.internalPageCount;
          }
        }
      },
@@ -242,10 +247,10 @@ export default {
              value={ this.$parent.internalCurrentPage }
              domPropsValue={ this.$parent.internalCurrentPage }
              type="number"
+              ref="input"
              onChange={ this.handleChange }
              onFocus={ this.handleFocus }
-              onBlur={ this.handleBlur }
-              nativeOnKeyup={ this.handleKeyUp }/>
+              onBlur={ this.handleBlur }/>
            { this.t('el.pagination.pageClassifier') }
          </span>
        );
--- a/packages/popover/src/main.vue
+++ b/packages/popover/src/main.vue
@@ -131,14 +131,14 @@ export default {
    },
    handleFocus() {
      addClass(this.referenceElm, 'focusing');
-      this.showPopper = true;
+      if (this.trigger !== 'manual') this.showPopper = true;
    },
    handleClick() {
      removeClass(this.referenceElm, 'focusing');
    },
    handleBlur() {
      removeClass(this.referenceElm, 'focusing');
-      this.showPopper = false;
+      if (this.trigger !== 'manual') this.showPopper = false;
    },
    handleMouseEnter() {
      clearTimeout(this._timer);
@@ -151,7 +151,7 @@ export default {
      }
    },
    handleKeydown(ev) {
-      if (ev.keyCode === 27) { // esc
+      if (ev.keyCode === 27 && this.trigger !== 'manual') { // esc
        this.doClose();
      }
    },
--- a/packages/select/src/select.vue
+++ b/packages/select/src/select.vue
@@ -11,6 +11,7 @@
      :style="{ 'max-width': inputWidth - 32 + 'px' }">
      <span
        class="el-select__multiple-text"
+        v-show="multipleText"
        v-if="collapseTags">
        {{ multipleText }}
      </span>
@@ -65,8 +66,8 @@
      @blur="handleBlur"
      @mousedown.native="handleMouseDown"
      @keyup.native="debouncedOnInputChange"
-      @keydown.native.down.prevent="navigateOptions('next')"
-      @keydown.native.up.prevent="navigateOptions('prev')"
+      @keydown.native.down.stop.prevent="navigateOptions('next')"
+      @keydown.native.up.stop.prevent="navigateOptions('prev')"
      @keydown.native.enter.prevent="selectOption"
      @keydown.native.esc.stop.prevent="visible = false"
      @keydown.native.tab="visible = false"
@@ -89,6 +90,7 @@
          tag="ul"
          wrap-class="el-select-dropdown__wrap"
          view-class="el-select-dropdown__list"
+          ref="scrollbar"
          :class="{ 'is-empty': !allowCreate && query && filteredOptionsCount === 0 }"
          v-show="options.length > 0 && !loading">
          <el-option
@@ -375,7 +377,8 @@
        });
        this.hoverIndex = -1;
        if (this.multiple && this.filterable) {
-          this.inputLength = this.$refs.input.value.length * 15 + 20;
+          const length = this.$refs.input.value.length * 15 + 20;
+          this.inputLength = this.collapseTags ? Math.min(50, length) : length;
          this.managePlaceholder();
          this.resetInputHeight();
        }
@@ -415,6 +418,7 @@
          const menu = this.$refs.popper.$el.querySelector('.el-select-dropdown__wrap');
          scrollIntoView(menu, target);
        }
+        this.$refs.scrollbar && this.$refs.scrollbar.handleScroll();
      },

      handleMenuEnter() {
@@ -556,7 +560,7 @@
          let input = [].filter.call(inputChildNodes, item => item.tagName === 'INPUT')[0];
          const tags = this.$refs.tags;
          input.style.height = this.selected.length === 0
-            ? sizeMap[this.selectSize] || 40 + 'px'
+            ? (sizeMap[this.selectSize] || 40) + 'px'
            : Math.max(tags ? (tags.clientHeight + 10) : 0, sizeMap[this.selectSize] || 40) + 'px';
          if (this.visible && this.emptyText !== false) {
            this.broadcast('ElSelectDropdown', 'updatePopper');
--- a/packages/table/src/table-body.js
+++ b/packages/table/src/table-body.js
@@ -138,7 +138,8 @@ export default {
      if (!this.store.states.isComplex) return;
      const el = this.$el;
      if (!el) return;
-      const rows = el.querySelectorAll('tbody > tr.el-table__row');
+      const tr = el.querySelector('tbody').children;
+      const rows = [].filter.call(tr, row => hasClass(row, 'el-table__row'));
      const oldRow = rows[oldVal];
      const newRow = rows[newVal];
      if (oldRow) {
@@ -153,7 +154,8 @@ export default {
      const el = this.$el;
      if (!el) return;
      const data = this.store.states.data;
-      const rows = el.querySelectorAll('tbody > tr.el-table__row');
+      const tr = el.querySelector('tbody').children;
+      const rows = [].filter.call(tr, row => hasClass(row, 'el-table__row'));
      const oldRow = rows[data.indexOf(oldVal)];
      const newRow = rows[data.indexOf(newVal)];
      if (oldRow) {
--- a/packages/table/src/table-column.js
+++ b/packages/table/src/table-column.js
@@ -65,8 +65,8 @@ const forced = {
    sortable: false
  },
  expand: {
-    renderHeader: function(h, {}) {
-      return '';
+    renderHeader: function(h, { column }) {
+      return column.label || '';
    },
    renderCell: function(h, { row, store }, proxy) {
      const expanded = store.states.expandRows.indexOf(row) > -1;
--- a/packages/table/src/table.vue
+++ b/packages/table/src/table.vue
@@ -475,7 +475,11 @@
        immediate: true,
        handler(val) {
          this.store.commit('setData', val);
-          if (this.$ready) this.doLayout();
+          if (this.$ready) {
+            this.$nextTick(() => {
+              this.doLayout();
+            });
+          }
        }
      },

--- a/packages/tag/src/tag.vue
+++ b/packages/tag/src/tag.vue
@@ -11,7 +11,7 @@
      <slot></slot>
      <i class="el-tag__close el-icon-close"
        v-if="closable"
-        @click="handleClose"></i>
+        @click.stop="handleClose"></i>
    </span>
  </transition>
 </template>
--- a/packages/theme-chalk/package.json
+++ b/packages/theme-chalk/package.json
@@ -1,6 +1,6 @@
 {
  "name": "element-theme-chalk",
-  "version": "2.0.5",
+  "version": "2.0.6",
  "description": "Element component chalk theme.",
  "main": "lib/index.css",
  "style": "lib/index.css",
--- a/packages/theme-chalk/src/button.scss
+++ b/packages/theme-chalk/src/button.scss
@@ -142,7 +142,7 @@
    @include button-size($--button-mini-padding-vertical, $--button-mini-padding-horizontal, $--button-mini-font-size, $--button-mini-border-radius);
  }
  @include m(text) {
-    border: none;
+    border-color: transparent;
    color: $--color-primary;
    background: transparent;
    padding-left: 0;
--- a/packages/theme-chalk/src/common/var.scss
+++ b/packages/theme-chalk/src/common/var.scss
@@ -329,6 +329,7 @@ $--input-placeholder-color: $--color-text-placeholder !default;
 $--input-max-width: 314px !default;

 $--input-hover-border: $--border-color-hover !default;
+$--input-clear-hover-color: $--color-text-secondary !default;

 $--input-focus-border: $--color-primary !default;
 $--input-focus-fill: $--color-white !default;
--- a/packages/theme-chalk/src/input.scss
+++ b/packages/theme-chalk/src/input.scss
@@ -8,6 +8,18 @@
  width: 100%;
  @include scroll-bar;

+  & .el-input__clear {
+    color: $--input-icon-color;
+    font-size: $--input-font-size;
+    line-height: 16px;
+    cursor: pointer;
+    transition: $--color-transition-base;
+
+    &:hover {
+      color: $--input-clear-hover-color;
+    }
+  }
+
  @include e(inner) {
    -webkit-appearance: none;
    background-color: $--input-fill;
--- a/packages/theme-chalk/src/pagination.scss
+++ b/packages/theme-chalk/src/pagination.scss
@@ -75,6 +75,7 @@
    .el-icon {
      display: block;
      font-size: 12px;
+      font-weight: bold;
    }
  }

@@ -162,6 +163,46 @@
      margin: 0;
    }
  }
+
+  @include when(background) {
+    .btn-prev,
+    .btn-next,
+    .el-pager li {
+      margin: 0 5px;
+      background-color: $--color-info-lighter;
+      color: $--color-text-regular;
+      min-width: 30px;
+      border-radius: 2px;
+    }
+
+    .btn-prev, .btn-next {
+      padding: 0;
+
+      &.disabled {
+        color: $--color-text-placeholder;
+      }
+    }
+
+    .el-pager li {
+      &:hover {
+        color: $--pagination-hover-fill;
+      }
+
+      &.active {
+        background-color: $--color-primary;
+        color: $--color-white;
+      }
+    }
+
+    &.el-pagination--small {
+      .btn-prev,
+      .btn-next,
+      .el-pager li {
+        margin: 0 3px;
+        min-width: 22px;
+      }
+    }
+  }
 }

@include b(pager) {
@@ -173,8 +214,8 @@
  padding: 0;
  margin: 0;

-  .el-icon-more::before {
-    vertical-align: -4px;
+  .more::before {
+    line-height: 30px;
  }

  li {
--- a/packages/theme-chalk/src/select.scss
+++ b/packages/theme-chalk/src/select.scss
@@ -93,7 +93,7 @@
    margin-left: 15px;
    color: $--input-color;
    font-size: $--font-size-base;
-    display: block;
+    display: inline;
    @include utils-ellipsis;
  }

--- a/packages/theme-chalk/src/table.scss
+++ b/packages/theme-chalk/src/table.scss
@@ -426,9 +426,11 @@
  }

  .caret-wrapper {
-    position: absolute;
-    display: inline-block;
-    height: 100%;
+    display: inline-flex;
+    flex-direction: column;
+    align-items: center;
+    height: 34px;
+    width: 24px;
    vertical-align: middle;
    cursor: pointer;
    overflow: initial;
@@ -440,14 +442,13 @@
    overflow: hidden;
    font-size: 15px;
    position: absolute;
-    left: 4px;

    &.ascending {
-      top: 1px;
+      top: 5px;
    }

    &.descending {
-      bottom: 1px;
+      bottom: 7px;
    }
  }

--- a/packages/theme-chalk/src/tag.scss
+++ b/packages/theme-chalk/src/tag.scss
@@ -20,9 +20,9 @@
    position: relative;
    cursor: pointer;
    font-size: 12px;
-    height: 18px;
-    width: 18px;
-    line-height: 18px;
+    height: 16px;
+    width: 16px;
+    line-height: 16px;
    vertical-align: middle;
    top: -1px;
    right: -5px;
--- a/src/index.js
+++ b/src/index.js
@@ -173,7 +173,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 };

 module.exports = {
-  version: '2.0.5',
+  version: '2.0.6',
  locale: locale.use,
  i18n: locale.i18n,
  install,
--- a/src/locale/lang/fa.js
+++ b/src/locale/lang/fa.js
@@ -2,24 +2,24 @@ export default {
  el: {
    colorpicker: {
      confirm: 'باشد',
-      clear: 'خذف'
+      clear: 'حذف'
    },
    datepicker: {
      now: 'اکنون',
      today: 'امروز',
      cancel: 'لغو',
-      clear: 'خذف',
-      confirm: 'باشد',
+      clear: 'حذف',
+      confirm: 'باشه',
      selectDate: 'انتخاب تاریخ',
      selectTime: 'انتخاب زمان',
      startDate: 'تاریخ شروع',
      startTime: 'زمان شروع',
      endDate: 'تاریخ پایان',
      endTime: 'زمان پایان',
-      prevYear: 'Previous Year', // to be translated
-      nextYear: 'Next Year', // to be translated
-      prevMonth: 'Previous Month', // to be translated
-      nextMonth: 'Next Month', // to be translated
+      prevYear: 'سال قبل',
+      nextYear: 'سال بعد',
+      prevMonth: 'ماه قبل',
+      nextMonth: 'ماه بعد',
      year: 'سال',
      month1: 'ژانویه',
      month2: 'فوریه',
@@ -77,7 +77,7 @@ export default {
    },
    messagebox: {
      title: 'پیام',
-      confirm: 'باشد',
+      confirm: 'باشه',
      cancel: 'لغو',
      error: 'ورودی غیر مجاز'
    },
@@ -85,7 +85,7 @@ export default {
      deleteTip: 'press delete to remove', // to be translated
      delete: 'حذف',
      preview: 'پیش‌نمایش',
-      continue: 'ادهمه'
+      continue: 'ادامه'
    },
    table: {
      emptyText: 'اطلاعاتی وجود ندارد',
@@ -101,7 +101,7 @@ export default {
      noMatch: 'هیچ داده‌ای پیدا نشد',
      noData: 'اطلاعاتی وجود ندارد',
      titles: ['List 1', 'List 2'], // to be translated
-      filterPlaceholder: 'Enter keyword', // to be translated
+      filterPlaceholder: 'کلید واژه هارو وارد کن',
      noCheckedFormat: '{total} items', // to be translated
      hasCheckedFormat: '{checked}/{total} checked' // to be translated
    }
--- a/src/locale/lang/lt.js
+++ b/src/locale/lang/lt.js
@@ -0,0 +1,109 @@
+export default {
+  el: {
+    colorpicker: {
+      confirm: 'OK',
+      clear: 'Valyti'
+    },
+    datepicker: {
+      now: 'Dabar',
+      today: 'Šiandien',
+      cancel: 'Atšaukti',
+      clear: 'Vakyti',
+      confirm: 'OK',
+      selectDate: 'Pasirink datą',
+      selectTime: 'Pasirink laiką',
+      startDate: 'Data nuo',
+      startTime: 'Laikas nuo',
+      endDate: 'Data iki',
+      endTime: 'Laikas iki',
+      prevYear: 'Metai atgal',
+      nextYear: 'Metai į priekį',
+      prevMonth: 'Mėn. atgal',
+      nextMonth: 'Mėn. į priekį',
+      year: '',
+      month1: 'Sausis',
+      month2: 'Vasaris',
+      month3: 'Kovas',
+      month4: 'Balandis',
+      month5: 'Gegužė',
+      month6: 'Birželis',
+      month7: 'Liepa',
+      month8: 'Rugpjūtis',
+      month9: 'Rugsėjis',
+      month10: 'Spalis',
+      month11: 'Lapkritis',
+      month12: 'Gruodis',
+      // week: 'savaitė',
+      weeks: {
+        sun: 'S.',
+        mon: 'Pr.',
+        tue: 'A.',
+        wed: 'T.',
+        thu: 'K.',
+        fri: 'Pn.',
+        sat: 'Š.'
+      },
+      months: {
+        jan: 'Sau',
+        feb: 'Vas',
+        mar: 'Kov',
+        apr: 'Bal',
+        may: 'Geg',
+        jun: 'Bir',
+        jul: 'Lie',
+        aug: 'Rugp',
+        sep: 'Rugs',
+        oct: 'Spa',
+        nov: 'Lap',
+        dec: 'Gruo'
+      }
+    },
+    select: {
+      loading: 'Kraunasi',
+      noMatch: 'Duomenų nerasta',
+      noData: 'Nėra duomenų',
+      placeholder: 'Pasirink'
+    },
+    cascader: {
+      noMatch: 'Duomenų nerasta',
+      loading: 'Kraunasi',
+      placeholder: 'Pasirink'
+    },
+    pagination: {
+      goto: 'Eiti į',
+      pagesize: '/p',
+      total: 'Viso {total}',
+      pageClassifier: ''
+    },
+    messagebox: {
+      title: 'Žinutė',
+      confirm: 'OK',
+      cancel: 'Atšaukti',
+      error: 'Klaida įvestuose duomenyse'
+    },
+    upload: {
+      deleteTip: 'spauskite "Trinti" norėdami pašalinti',
+      delete: 'Trinti',
+      preview: 'Peržiūrėti',
+      continue: 'Toliau'
+    },
+    table: {
+      emptyText: 'Duomenų nerasta',
+      confirmFilter: 'Patvirtinti',
+      resetFilter: 'Atstatyti',
+      clearFilter: 'Išvalyti',
+      sumText: 'Suma'
+    },
+    tree: {
+      emptyText: 'Nėra duomenų'
+    },
+    transfer: {
+      noMatch: 'Duomenų nerasta',
+      noData: 'Nėra duomenų',
+      titles: ['Sąrašas 1', 'Sąrašas 2'],
+      filterPlaceholder: 'Įvesk raktažodį',
+      noCheckedFormat: 'Viso: {total}',
+      hasCheckedFormat: 'Pažymėta {checked} iš {total}'
+    }
+  }
+};
--- a/src/utils/popper.js
+++ b/src/utils/popper.js
@@ -909,6 +909,7 @@

        var len         = isVertical ? 'height' : 'width';
        var side        = isVertical ? 'top' : 'left';
+        var translate   = isVertical ? 'translateY' : 'translateX';
        var altSide     = isVertical ? 'left' : 'top';
        var opSide      = isVertical ? 'bottom' : 'right';
        var arrowSize   = getOuterSizes(arrow)[len];
@@ -932,7 +933,7 @@
        var sideValue = center - popper[side];

        // prevent arrow from being placed not contiguously to its popper
-        sideValue = Math.max(Math.min(popper[len] - arrowSize - 3, sideValue), 3);
+        sideValue = Math.max(Math.min(popper[len] - arrowSize - 8, sideValue), 8);
        arrowStyle[side] = sideValue;
        arrowStyle[altSide] = ''; // make sure to remove any old style from the arrow

--- a/test/unit/specs/pagination.spec.js
+++ b/test/unit/specs/pagination.spec.js
@@ -223,20 +223,24 @@ describe('Pagination', () => {
    };

    changeValue(1);
-
    setTimeout(() => {
-      expect(vm.page).to.equal(1);
-
-      changeValue(10000);
-
+      expect(input.value).to.equal(1);
+      // 多次输入不在min-max区间内的数字
+      changeValue(0);
      setTimeout(() => {
-        expect(vm.page).to.equal(10);
-
-        changeValue('我好帅');
-
+        expect(input.value).to.equal(1);
+        changeValue(0);
        setTimeout(() => {
-          expect(vm.page).to.equal(1);
-          done();
+          expect(input.value).to.equal(1);
+          changeValue(1000);
+          setTimeout(() => {
+            expect(input.value).to.equal(10);
+            changeValue(1000);
+            setTimeout(() => {
+              expect(input.value).to.equal(10);
+              done();
+            }, 50);
+          }, 50);
        }, 50);
      }, 50);
    }, 50);
Author	SHA1	Message	Date
Leopoldthecoder	e531b14aa7	[release] 2.0.6	2017-11-29 14:32:44 +08:00
Leopoldthecoder	57f7dc766f	[build] 2.0.6	2017-11-29 14:32:44 +08:00
Leopoldthecoder	b7d6579aca	Changelog: update for 2.0.6	2017-11-29 14:26:16 +08:00
Leopoldthecoder	765e59de6b	Pagination: add background prop	2017-11-29 13:52:44 +08:00
Leopoldthecoder	ace0d05791	Table: expand column supports label	2017-11-27 18:35:49 +08:00
zollero	675253dcb1	MessageBox: Add attribute 'showClose' to doc (#8516 ) * MessageBox: Add attribute 'showClose' to doc Add an attribute 'showClose' to explain whether to show 'close' button on the right top. MessageBox: 文档中添加一个属性：showClose。用来解释是否显示 MessageBox 右上角的关闭按钮。改属性，已经在源码中声明。 * MessageBox: Add attribute 'showClose' to doc Add an attribute 'showClose' to explain whether to show 'close' button on the right top.	2017-11-27 18:04:25 +08:00
Bogdan Luca	6e8f10a556	Input: add clearable (#8509 ) * Added clearable to el-input. * Added en-US example. * Also fire change event on clear. * Used clearable shorthand; added clearable to attribute list. * Added styles.	2017-11-27 10:55:26 +08:00
Leopoldthecoder	9998d13e9c	Popper: increase arrow offset to 8px	2017-11-26 16:57:41 +08:00
Leopoldthecoder	475cc04681	Menu: collapsed menu shouldn't open default indices	2017-11-26 16:57:41 +08:00
Leopoldthecoder	7a4ec97f0d	Chore: misc updates	2017-11-26 16:57:41 +08:00
Daniel Chiang	abd2d7de36	call `doClose()` in the exposed `close` method	2017-11-26 15:38:41 +08:00
Leopoldthecoder	f307f7f428	Cascader: add separator prop	2017-11-25 20:42:13 +08:00
Jason Zoo	6c4006487c	Dropdown: inherit size from global config (#8473 )	2017-11-24 10:42:04 +08:00
liyl	11b3c8bbfd	Autocomplete: support suffixIcon & prefixIcon (#8446 ) * feat: update autocomplete * Feat: update input doc	2017-11-24 10:26:14 +08:00
Leopoldthecoder	0462d9ce1a	DatetimePicker: disable inputs when selecting range	2017-11-23 19:22:16 +08:00
Leopoldthecoder	6a99f03e1f	Select: update scroll bar position	2017-11-23 19:22:16 +08:00
Leopoldthecoder	9cfdc433c3	Popover: fix manual trigger	2017-11-23 19:22:16 +08:00
Decade	7120490d3e	Pagination: reset invalid jumper value (#8408 ) * fix pagination jumper value * fix lint	2017-11-23 19:22:16 +08:00
Leslie	55617e0d1a	DatetimePicker: fix max time error when init value is empty (#8336 ) 1.no init data 2.click start time and comfirm 3.click end time and comfirm(the end time is not change) 4.error reason: not evaluate 'maxDate' value in step1 I will show more details in conversation	2017-11-23 19:15:16 +08:00
Leopoldthecoder	e033313608	Select: fix filter input display in multiple mode	2017-11-23 11:36:48 +08:00
Leon Zhang	d6c35bffaa	remove unnecessary event	2017-11-22 17:05:22 +08:00
hejinming	94d737fb4a	Table: fix el-table-column 'hover-row' class error when expend column embed el-table	2017-11-22 11:44:27 +08:00
Leopoldthecoder	dd8d350b7d	Table: fix sorting arrow style	2017-11-21 11:54:45 +08:00
刘洋	6544134c38	Tag: stop close icon click event propagation (#8396 ) * Tag关闭按钮@click修改为@click.stop防止事件冒泡（Tag添加自定义事件时，点击关闭会触发两次事件） * Button: fix closeEvent bug Tag关闭按钮@click修改为@click.stop防止事件冒泡（Tag添加自定义事件时，点击关闭会触发两次事件）	2017-11-21 11:05:52 +08:00
Leopoldthecoder	8f623b4cc4	Form: required rule shouldn't care about model type	2017-11-20 22:29:01 +08:00
Tadasb	0a23a310e4	Create lt.js Create a Lithuanian translation.	2017-11-20 10:26:18 +08:00
杨奕	2566e48218	Update fa.js	2017-11-19 16:27:47 +08:00
Morteza Dehghani	7dd10da28b	Translate some words ...	2017-11-19 16:27:47 +08:00
Anthony Davie	044d8ef11f	FAQ.md with Spanish translation Added the Spanish translation after the English one.	2017-11-19 16:18:48 +08:00
Anthony Davie	44efc5df35	Update CONTRIBUTING.es.md Added llinks to Issue reporter, Element UI main website and Vuejs website for clarity.	2017-11-19 16:18:48 +08:00
Anthony Davie	6bc4667789	Spanish translation of CONTRUBITING guidelines First version of this translation	2017-11-19 16:18:48 +08:00