Merge pull request #1 from iview/2.0

pr

.github/ISSUE_TEMPLATE.md

@@ -1,5 +1,9 @@
 <!--
-注意：请使用下面的链接来新建 issue：
+注意：关于用法、咨询等问题，请到 iView Developer 提问：
+  
+  https://dev.iviewui.com
+  
+  Bug 反馈、新功能请求，请到下面提交 issues：
   
   https://www.iviewui.com/new-issue
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,3 +1,3 @@
-
+<!-- 目前仍然需要提交 PR 到 2.0 分支 | Please send PR to 2.0 branch -->
 <!-- 请先运行 npm install 和 npm test，通过测试后再提交您的 pr -->
 <!-- Please run `npm install` and `npm test` to test your changes before submitting a pull request -->

README.md

@@ -19,11 +19,7 @@
 
 ## Docs
 
-### [3.0](https://www.iviewui.com)
-
-[2.0](http://v2.iviewui.com)
-
-[1.0](http://v1.iviewui.com)
+**[3.x](https://www.iviewui.com)** | [2.x](http://v2.iviewui.com) | [1.x](http://v1.iviewui.com)
 
 ## Features
 
@@ -35,7 +31,7 @@
 
 ## Who's using iView
 
-- [TalkingData](http://www.talkingdata.com/)
+- [TalkingData 腾云天下](http://www.talkingdata.com/)
 - [Alibaba 阿里巴巴](http://www.alibaba.com/)
 - [Baidu 百度](https://www.baidu.com/)
 - [Tencent 腾讯](https://www.tencent.com/)
@@ -44,6 +40,8 @@
 - [DiDi 滴滴](http://www.didichuxing.com/)
 - [Meituan 美团](http://www.meituan.com/)
 - [Sina 新浪](http://www.sina.com.cn/)
+- [iFLYTEK 科大讯飞](http://www.iflytek.com/)
+- [LY 同程艺龙](https://www.ly.com/)
 
 > If your company or products use iView, welcome to click [here](https://github.com/iview/iview/issues/2143) to leave a message.
 
@@ -98,8 +96,9 @@ import 'iview/dist/styles/iview.css';
 - Supports Vue.js 1.x - [visit 1.0 docs](http://v1.iviewui.com/)
 - Supports SSR
 - Supports [Nuxt.js](https://nuxtjs.org/)
+- Supports TypeScript
 - Supports [Electron](http://electron.atom.io/)
-- iView does not support IE8 or below since [Vue.js](https://vuejs.org/v2/guide/reactivity.html) uses `Object.defineProperty` to track changes which is not supported by these browsers.
+- Most components and features support IE9 and above browsers, some components and features do not support IE
 
 ## Community
 
@@ -115,7 +114,7 @@ If you want to contribute or have questions or bugs to report:
 |[Aresn](https://github.com/icarusion) |  ![](https://avatars3.githubusercontent.com/u/5370542?v=3&s=60)  |[jingsam](https://github.com/jingsam) |  ![](https://avatars3.githubusercontent.com/u/1522494?v=3&s=60)  | [rijn](https://github.com/rijn)       |  ![](https://avatars2.githubusercontent.com/u/6976367?v=3&s=60)  |
 |[lcx960324](https://github.com/lcx960324)           |  ![](https://avatars3.githubusercontent.com/u/9768245?v=3&s=60)  |[GITleonine1989](https://github.com/GITleonine1989) |  ![](https://avatars1.githubusercontent.com/u/7582490?v=3&s=60)  |[huixisheng](https://github.com/huixisheng)         |  ![](https://avatars1.githubusercontent.com/u/1518967?v=3&s=60)  |
 |[Sergio Crisostomo](https://github.com/SergioCrisostomo)           |  ![](https://avatars3.githubusercontent.com/u/5614559?v=3&s=60)  |  [lison16](https://github.com/lison16)           |  ![](https://avatars3.githubusercontent.com/u/20942571?v=3&s=60) |  [Xotic750](https://github.com/Xotic750)    | ![](https://avatars3.githubusercontent.com/u/216041?v=3&s=60)   | 
-[huanghong1125](https://github.com/huanghong1125) | ![](https://avatars3.githubusercontent.com/u/12794817?v=3&s=60) |
+[huanghong1125](https://github.com/huanghong1125) | ![](https://avatars3.githubusercontent.com/u/12794817?v=3&s=60) | [yangdan8](https://github.com/yangdan8) | ![](https://avatars2.githubusercontent.com/u/16515026?v=3&s=60) |
 
 ### All Contributors
 

build/webpack.dist.prod.config.js

@@ -4,6 +4,7 @@ const merge = require('webpack-merge');
 const webpackBaseConfig = require('./webpack.base.config.js');
 const CompressionPlugin = require('compression-webpack-plugin');
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 
 process.env.NODE_ENV = 'production';
 
@@ -35,7 +36,7 @@ module.exports = merge(webpackBaseConfig, {
         }),
         new UglifyJsPlugin({
             parallel: true,
-            sourceMap: true,
+            sourceMap: true
         }),
         new CompressionPlugin({
             asset: '[path].gz[query]',
@@ -43,6 +44,12 @@ module.exports = merge(webpackBaseConfig, {
             test: /\.(js|css)$/,
             threshold: 10240,
             minRatio: 0.8
-        })
+        }),
+        new CopyWebpackPlugin([
+            {
+                from: path.resolve(__dirname, './../types'),
+                to: path.resolve(__dirname, './../dist/types')
+            }
+        ])
     ]
 });

dist/types/affix.d.ts

@@ -0,0 +1,22 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Affix extends Vue {
+  /**
+   * 距离窗口顶部达到指定偏移量后触发
+   * @default 0
+   */
+  'offset-top'?: number;
+  /**
+   * 距离窗口底部达到指定偏移量后触发
+   */
+  'offset-bottom'?: number;
+  /**
+   * 在固定状态发生改变时触发
+   * @param value true | false
+   */
+  $emit(eventName: 'on-change', value: boolean): this;
+}

dist/types/alert.d.ts

@@ -0,0 +1,48 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Alert extends Vue {
+  /**
+   * 警告提示样式，可选值为info、success、warning、error
+   * @default info
+   */
+  type?: 'info' | 'success' | 'warning' | 'error';
+  /**
+   * 是否可关闭
+   * @default false
+   */
+  closable?: boolean;
+  /**
+   * 是否显示图标
+   * @default false
+   */
+  'show-icon'?: boolean;
+  /**
+   * 关闭时触发
+   */
+  $emit(eventName: 'on-close', event: HTMLElement): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 警告提示内容
+     */
+    '': VNode[];
+    /**
+     * 警告提示辅助性文字介绍
+     */
+    desc: VNode[];
+    /**
+     * 自定义图标内容
+     */
+    icon: VNode[];
+    /**
+     * 自定义关闭内容
+     */
+    close: VNode[];
+  };
+}

dist/types/anchor.d.ts

@@ -0,0 +1,67 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Anchor extends Vue {
+  /**
+   * 固定模式
+   * @default true
+   */
+  affix?: boolean;
+  /**
+   * 距离窗口顶部达到指定偏移量后触发
+   * @default 0
+   */
+  'offset-top'?: number;
+  /**
+   * 距离窗口底部达到指定偏移量后触发
+   */
+  'offset-bottom'?: number;
+  /**
+   * 锚点区域边界，单位：px
+   * @default 5
+   */
+  bounds?: number;
+  /**
+   * 点击滚动的额外距离
+   * @default 0
+   */
+  'scroll-offset'?: number;
+  /**
+   * 指定滚动的容器
+   */
+  container?: string | HTMLElement;
+  /**
+   * 是否显示小圆点
+   * @default false
+   */
+  'show-ink'?: boolean;
+  /**
+   * 点击锚点时触发，返回链接
+   */
+  $emit(eventName: 'on-select', href: string): this;
+  /**
+   * 链接改变时触发，返回新链接和旧链接	
+   */
+  $emit(eventName: 'on-change', []): this;
+}
+
+export declare interface AnchorLink extends Vue {
+  /**
+   * 锚点链接
+   * @default 
+   */
+  href?: string;
+  /**
+   * 文字内容
+   * @default 
+   */
+  title?: string;
+  /**
+   * 点击滚动的额外距离
+   * @default 0
+   */
+  'scroll-offset'?: number;
+}

dist/types/auto-complete.d.ts

@@ -0,0 +1,75 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface AutoComplete extends Vue {
+  /**
+   * 绑定的值，可使用 v-model 双向绑定
+   */
+  value?: string | number;
+  /**
+   * 自动完成的数据源
+   * @default []
+   */
+  data?: string[] | number[];
+  /**
+   * 是否可以清空选项
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * 是否禁用
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 占位文本
+   */
+  placeholder?: string;
+  /**
+   * 输入框尺寸，可选值为 large、small、default 或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 输入框尾部图标
+   */
+  icon?: string;
+  /**
+   * 是否根据输入项进行筛选。当其为一个函数时，会接收 value 和 option 两个参数，
+   * 当 option 符合筛选条件时，应返回 true，反之则返回 false,
+   * @default false
+   */
+  'filter-method'?: boolean | (() => boolean);
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果,
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 选中 option，或 input 的 value 变化时，调用此函数
+   */
+  $emit(eventName: 'on-change', value: string | number): this;
+  /**
+   * 被选中时调用，参数为选中项的 value 值
+   */
+  $emit(eventName: 'on-select', value: string | number): this;
+  /**
+   * 搜索补全项的时候调用
+   */
+  $emit(eventName: 'on-search', query: string): this;
+  /**
+   * 搜索补全项的时候调用
+   */
+  $emit(eventName: 'on-focus', event: KeyboardEvent): this;
+  /**
+   * 搜索补全项的时候调用
+   */
+  $emit(eventName: 'on-blur', event: KeyboardEvent): this;
+}

dist/types/avatar.d.ts

@@ -0,0 +1,30 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Avatar extends Vue {
+  /**
+   * 指定头像的形状，可选值为 circle、square
+   * @default circle
+   */
+  shape?: 'circle' | 'square';
+  /**
+   * 设置头像的大小，可选值为 large、small、default
+   * @default default
+   */
+  size?: 'large'|'small'|'default';
+  /**
+   * 图片类头像的资源地址
+   */
+  src?: string;
+  /**
+   * 设置头像的图标类型，参考 Icon 组件
+   */
+  icon?: string;
+  /**
+   * 自定义图标
+   */
+  'custom-icon'?: string;
+}

dist/types/back-top.d.ts

@@ -0,0 +1,32 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface BackTop extends Vue {
+  /**
+   * 页面滚动高度达到该值时才显示BackTop组件
+   * @default 400
+   */
+  height?: number;
+  /**
+   * 组件距离底部的距离
+   * @default 30
+   */
+  bottom?: number;
+  /**
+   * 组件距离右部的距离
+   * @default 30
+   */
+  right?: number;
+  /**
+   * 滚动动画持续时间，单位 毫秒
+   * @default 1000
+   */
+  duration?: number;
+  /**
+   * 点击按钮时触发
+   */
+  $emit(eventName: 'on-click'): this;
+}

dist/types/badge.d.ts

@@ -0,0 +1,47 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Badge extends Vue {
+  /**
+   * 显示的数字，大于overflowCount时，显示${overflowCount}+，为 0 时隐藏
+   */
+  count?: number | string;
+  /**
+   * 展示封顶的数字值
+   * @default 99
+   */
+  'overflow-count'?: number | string;
+  /**
+   * 不展示数字，只有一个小红点，如需隐藏 dot ，需要设置count为 0
+   * @default false
+   */
+  dot?: boolean
+  /**
+   * 自定义的class名称，dot 模式下无效
+   */
+  'class-name'?: string;
+  /**
+   * 使用预设的颜色，可选值为 success、primary、normal、error、warning、info
+   */
+  type?: 'success' | 'primary' | 'normal' | 'error' | 'warning' | 'info';
+  /**
+   * 当数值为 0 时，是否展示 Badge
+   * @default false
+   */
+  'show-zero'?: boolean;
+  /**
+   * 设置 Badge 为状态点，可选值为 success、processing、default、error、warning
+   */
+  status?: 'success' | 'processing' | 'default' | 'error' | 'warning';
+  /**
+   * 自定义内容，如果设置了 status，则为状态点的文本
+   */
+  text?: string;
+  /**
+   * 设置状态点的位置偏移，格式为 [x, y]
+   */
+  offset?: number[];
+}

dist/types/breadcrumb.d.ts

@@ -0,0 +1,30 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Breadcrumb extends Vue {
+  /**
+   * 自定义分隔符
+   * @default /
+   */
+  separator?: string;
+}
+
+export declare interface BreadcrumbItem extends Vue {
+  /**
+   * 链接，不传则没有链接
+   */
+  to?: string | object;
+  /**
+   * 路由跳转时，开启 replace 将不会向 history 添加新记录
+   * @default false
+   */
+  replace?: boolean;
+  /**
+   * 相当于 a 链接的 target 属性
+     * @default _self
+   */
+  target?: '_blank' | '_self' | '_parent' | '_top';
+}

dist/types/button.d.ts

@@ -0,0 +1,86 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Button extends Vue {
+  /**
+   * 按钮类型，可选值为 default、primary、dashed、text、info、success、warning、error或者不设置
+   * @default default
+   */
+  type?: '' | 'default' | 'primary' | 'dashed' | 'text' | 'info' | 'success' | 'warning' | 'error';
+  /**
+   * 幽灵属性，使按钮背景透明
+   * @default false
+   */
+  ghost?: boolean;
+  /**
+   * 按钮大小，可选值为large、small、default或者不设置
+   * @default default
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 按钮形状，可选值为circle或者不设置
+   */
+  shape?: '' | 'circle';
+  /**
+   * 开启后，按钮的长度为 100%
+   * @default false
+   */
+  long?: boolean;
+  /**
+   * 设置button原生的type，可选值为button、submit、reset
+   * @default button
+   */
+  'html-type'?: 'button' | 'submit' | 'reset';
+  /**
+   * 设置按钮为禁用状态
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 设置按钮为加载中状态
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 设置按钮的图标类型
+   */
+  icon?: string;
+  /**
+   * 设置按钮的自定义图标
+   */
+  'custom-icon'?: string;
+  /**
+   * 跳转的链接，支持 vue-router 对象
+   */
+  to?: string | object;
+  /**
+   * 路由跳转时，开启 replace 将不会向 history 添加新记录
+   * @default false
+   */
+  replace?: boolean;
+  /**
+   * 相当于 a 链接的 target 属性
+   * @default _self
+   */
+  target?: '_blank' | '_self' | '_parent' | '_top';
+}
+
+export declare interface ButtonGroup extends Vue {
+  /**
+   * 按钮组合大小，可选值为large、small、default或者不设置
+   * @default default
+   */
+  size?: 'large' | 'small' | 'default';
+  /**
+   * 按钮组合形状，可选值为circle或者不设置
+   */
+  shape?: '' | 'circle';
+  /**
+   * 是否纵向排列按钮组
+   * @default false
+   */
+  vertical?: boolean;
+}

dist/types/card.d.ts

@@ -0,0 +1,53 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Card extends Vue {
+  /**
+   * 是否显示边框，建议在灰色背景下使用
+   * @default true
+   */
+  'bordered'?: boolean;
+  /**
+   * 禁用鼠标悬停显示阴影
+   * @default false
+   */
+  'dis-hover'?: boolean;
+  /**
+   * 卡片阴影，建议在灰色背景下使用
+   * @default false
+   */
+  'shadow'?: boolean;
+  /**
+   * 卡片内部间距，单位 px
+   * @default 16
+   */
+  'padding'?: number;
+  /**
+   * 标题，2.12.0 新增
+   */
+  title?: string;
+  /**
+   * 标题前的图标，2.12.0 新增
+   */
+  icon?: string;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义卡片标题，如果是简单文字，可以使用<p>标签包裹
+     */
+    title: VNode[];
+    /**
+     * 额外显示的内容，默认位置在右上角
+     */
+    extra: VNode[];
+    /**
+     * 卡片主体内容
+     */
+    '': VNode[];
+  };
+}

dist/types/carousel.d.ts

@@ -0,0 +1,65 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Carousel extends Vue {
+  /**
+   * 幻灯片的索引，从 0 开始，可以使用 v-model 双向绑定数据
+   * @default 0
+   */
+  value?: number;
+  /**
+   * 走马灯的高度，可填 auto 或具体高度数值，单位 px
+   * @default auto
+   */
+  height?: string | number;
+  /**
+   * 是否开启循环
+   * @default false
+   */
+  loop?: boolean;
+  /**
+   * 是否自动切换
+   */
+  autoplay?: boolean;
+  /**
+   * 自动切换的时间间隔，单位为毫秒
+   * @default 2000
+   */
+  'autoplay-speed'?: number;
+  /**
+   * 指示器的位置，可选值为 inside （内部），outside（外部），none（不显示）
+   * @default inside
+   */
+  dots?: 'inside' | 'outside' | 'none';
+  /**
+   * 是否显示圆形指示器
+   * @default false
+   */
+  'radius-dot'?: boolean;
+  /**
+   * 指示器的触发方式，可选值为 click（点击），hover（悬停）
+   * @default click
+   */
+  trigger?: 'click' | 'hover';
+  /**
+   * 切换箭头的显示时机，可选值为 hover（悬停），always（一直显示），never（不显示）
+   * @default hover
+   */
+  arrow?: 'hover' | 'always' | 'never';
+  /**
+   * 动画效果
+   * @default ease
+   */
+  easing?: string;
+  /**
+   * 幻灯片切换时触发，目前激活的幻灯片的索引，原幻灯片的索引
+   */
+  $emit(eventName: 'on-change', oldValue: number, value: number): this;
+}
+
+export declare interface CarouselItem extends Vue {
+
+}

dist/types/cascader.d.ts

@@ -0,0 +1,84 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Cascader extends Vue {
+  /**
+   * 可选项的数据源，格式参照示例说明
+   * @default []
+   */
+  data?: object[];
+  /**
+   * 当前已选项的数据，格式参照示例说明
+   * @default []
+   */
+  value?: object[];
+  /**
+   * 选择后展示的函数，用于自定义显示格式
+   * @default label => label.join(' / ')
+   */
+  'render-format'?: (label?: string[]) => string
+  /**
+   * 是否禁用选择器
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否支持清除
+   * @default true
+   */
+  clearable?: boolean;
+  /**
+   * 输入框占位符
+   * @default 请选择
+   */
+  placeholder?: string;
+  /**
+   * 次级菜单展开方式，可选值为 click 或 hover
+   * @default click
+   */
+  trigger?: 'click' | 'hover';
+  /**
+   * 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的示例
+   * @default false
+   */
+  'change-on-select'?: boolean;
+  /**
+   * 输入框大小，可选值为large和small或者不填
+   */
+  size?: '' | 'large' | 'small';
+  /**
+   * 动态获取数据，数据源需标识 loading
+   */
+  'load-data'?: () => void;
+  /**
+   * 是否支持搜索
+   * @default false
+   */
+  filterable?: boolean;
+  /**
+   * 当搜索列表为空时显示的内容
+   * @default 无匹配数据
+   */
+  'not-found-text'?: string;
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 选择完成后的回调，返回值 value 即已选值 value，selectedData 为已选项的具体数据	
+   */
+  $emit(eventName: 'on-change', value: object, selectedData: object[]): this;
+  /**
+   * 展开和关闭弹窗时触发
+   */
+  $emit(eventName: 'on-visible-change', status: boolean): this;
+}

dist/types/cell.d.ts

@@ -0,0 +1,81 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Cell extends Vue {
+  /**
+   * 用来标识这一项
+   */
+  name?: string | number;
+  /**
+   * 左侧标题
+   */
+  title?: string;
+  /**
+   * 标题下方的描述信息
+   */
+  label?: string;
+  /**
+   * 右侧额外内容
+   */
+  extra?: string;
+  /**
+   * 禁用该项
+     * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 标记该项为选中状态
+     * @default false
+   */
+  selected?: boolean;
+  /**
+   * 跳转的链接，支持 vue-router 对象
+   */
+  to?: string | object;
+  /**
+   * 路由跳转时，开启 replace 将不会向 history 添加新记录
+     * @default false
+   */
+  replace?: boolean;
+  /**
+   * 相当于 a 链接的 target 属性
+     * @default _self
+   */
+  target?: '_blank' | '_self' | '_parent' | '_top';
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 相当于 title
+     */
+    '': VNode[];
+    /**
+     * 标题前的 Icon
+     */
+    icon: VNode[];
+    /**
+     * 相当于 label
+     */
+    label: VNode[];
+    /**
+     * 相当于 extra
+     */
+    extra: VNode[];
+    /**
+     * 有链接时，可自定义右侧箭头
+     */
+    arrow: VNode[];
+  }
+}
+
+export declare interface CellGroup extends Vue {
+  /**
+   * 点击单元格时触发
+   * 
+   */
+  $emit(eventName: 'on-click', name: string): this;
+}

dist/types/checkbox.d.ts

@@ -0,0 +1,61 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Checkbox extends Vue {
+  /**
+   * 只在单独使用时有效。可以使用 v-model 双向绑定数据
+   * @default false
+   */
+  value?: boolean;
+  /**
+   * 只在组合使用时有效。指定当前选项的 value 值，组合会自动判断是否选中
+   */
+  label?: string | number | boolean;
+  /**
+   * 是否禁用当前项
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 设置 indeterminate 状态，只负责样式控制
+   * @default false
+   */
+  indeterminate?: boolean;
+  /**
+   * 多选框的尺寸，可选值为 large、small、default 或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default true
+   */
+  'true-value'?: string | number | boolean;
+  /**
+   * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default false
+   */
+  'false-value'?: string | number | boolean;
+  /**
+   * 只在单独使用时有效。在选项状态发生改变时触发，通过修改外部的数据改变时不会触发
+   */
+  $emit(eventName: 'on-change', value: boolean): this;
+}
+
+export declare interface CheckboxGroup extends Vue {
+  /**
+   * 指定选中项目的集合，可以使用 v-model 双向绑定数据
+   * @default []
+   */
+  value?: string[] | number[] | boolean[];
+  /**
+   * 多选框组的尺寸，可选值为 large、small、default 或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 在选项状态发生改变时触发，返回已选中的数组。通过修改外部的数据改变时不会触发
+   */
+  $emit(eventName: 'on-change', values: Array<string | number | boolean>): this;
+}

dist/types/circle.d.ts

@@ -0,0 +1,57 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Circle extends Vue {
+  /**
+   * 百分比
+   * @default 0
+   */
+  percent?: number;
+  /**
+   * 图表的宽度和高度，单位 px
+   * @default 120
+   */
+  size?: number;
+  /**
+   * 进度环顶端的形状，可选值为square（方）和round（圆）
+   * @default round
+   */
+  'stroke-linecap'?: 'square' | 'round';
+  /**
+   * 进度环的线宽，单位 px
+   * @default 6
+   */
+  'stroke-width'?: number;
+  /**
+   * 进度环的颜色
+   * @default #2db7f5
+   */
+  'stroke-color'?: string
+  /**
+   * 进度环背景的线宽，单位 px
+   * @default 5
+   */
+  'trail-width'?: number;
+  /**
+   * 进度环背景的颜色
+   * @default #eaeef2
+   */
+  'trail-color'?: string;
+  /**
+   * 是否显示为仪表盘
+   * @default false
+   */
+  dashboard?: boolean;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义显示中间内容，内容默认垂直居中
+     */
+    '': VNode[];
+  };
+}

dist/types/collapse.d.ts

@@ -0,0 +1,53 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Collapse extends Vue {
+  /**
+   * 当前激活的面板的 name，可以使用 v-model 双向绑定
+   */
+  value?: string[] | string;
+  /**
+   * 是否开启手风琴模式，开启后每次至多展开一个面板
+   * @default false
+   */
+  accordion?: boolean;
+  /**
+   * 是否开启简洁模式
+   * @default false
+   */
+  simple?: boolean;
+  /**
+   * 切换面板时触发，返回当前已展开的面板的 key，格式为数组
+   * @default []
+   */
+  $emit(eventName: 'on-change', []): this;
+}
+
+export declare interface CollapsePanel extends Vue {
+  /**
+   * 当前面板的 name，与 Collapse的value对应，不填为索引值
+   * @default index的值
+   */
+  name?: string;
+  /**
+   * 隐藏箭头
+   * @default false
+   */
+  'hide-arrow'?: boolean;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 面板头内容
+     */
+    '': VNode[];
+    /**
+     * 描素内容
+     */
+    content: VNode[];
+  };
+}

dist/types/color-picker.d.ts

@@ -0,0 +1,64 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface ColorPicker extends Vue {
+  /**
+   * 绑定的值，可使用 v-model 双向绑定
+   */
+  value?: string;
+  /**
+   * 是否禁用
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否可以输入色值
+   * @default false
+   */
+  editable?: boolean;
+  /**
+   * 是否支持透明度选择
+   * @default false
+   */
+  alpha?: boolean;
+  /**
+   * 是否支持色彩选择
+   * @default true
+   */
+  hue?: boolean;
+  /**
+   * 是否支持透明度选择
+   * @default false
+   */
+  recommend?: boolean;
+  /**
+   * 自定义颜色预设
+   */
+  colors?: string[];
+  /**
+   * 颜色的格式，可选值为 hsl、hsv、hex、rgb
+   * @default 开启 alpha 时为 rgb，其它为 hex
+   */
+  format?: 'hsl' | 'hsv' | 'hex' | 'rgb';
+  /**
+   * 尺寸，可选值为large、small、default或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 当绑定值变化时触发
+   * @default 当前值
+   */
+  $emit(eventName: 'on-change', value: string): this;
+  /**
+   * 面板中当前显示的颜色发生改变时触发
+   * @default 当前显示的颜色值
+   */
+  $emit(eventName: 'on-active-change', value: string): this;
+  /**
+   * 下拉框展开或收起时触发
+   */
+  $emit(eventName: 'on-open-change', value: boolean): this;
+}

dist/types/content.d.ts

@@ -0,0 +1,8 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Content extends Vue {
+}

dist/types/date-picker.d.ts

@@ -0,0 +1,153 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface DatePicker extends Vue {
+  /**
+   * 显示类型，可选值为 date、daterange、datetime、datetimerange、year、month'|'默认值date
+   */
+  type?: 'date' | 'daterange' | 'datetime' | 'datetimerange' | 'year' | 'month';
+  /**
+   * 日期，可以是 JavaScript 的 Date，例如 new Date()，也可以是标准的日期格式，点击右边查看
+   * 注意：value 使用 v-model 时，值是 Date 类型，可以配合 @on-change 使用
+   */
+  value?: Date;
+  /**
+   * 展示的日期格式
+   * date | daterange?: yyyy-MM-dd
+   * datetime | datetimerange：yyyy-MM-dd HH:mm:ss
+   * year：yyyy
+   * month：yyyy-MM
+   */
+  format?: string;
+  /**
+   * 日期选择器出现的位置，
+   * 可选值为top,top-start,top-end,
+   * bottom,bottom-start,bottom-end,
+   * left,left-start,left-end,
+   * right,right-start,right-end
+   * 2.12.0 版本开始支持自动识别
+   * @default bottom-start
+   */
+  placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'
+  /**
+   * 占位文本默认值空
+   * @default 空
+   */
+  placeholder?: string;
+  /**
+   * 选择器额外配置，比如不可选日期与快捷选项，具体项详见下表
+   */
+  options?: DatePickerOptions;
+  /**
+   * 开启后，左右面板不联动，仅在 daterange 和 datetimerange 下可用。
+   * @default false
+   */
+  'split-panels'?: boolean;
+  /**
+   * 开启后，可以选择多个日期，仅在 date 下可用。
+   * @default false
+   */
+  multiple?: boolean;
+  /**
+   * 开启后，可以显示星期数。
+   * @default false
+   */
+  'show-week-numbers': boolean;
+  /**
+   * 设置默认显示的起始日期。
+   */
+  'start-date'?: Date;
+  /**
+   * 是否显示底部控制栏，开启后，选择完日期，选择器不会主动关闭，需用户确认后才可关闭,
+   * @default false
+   */
+  confirm?: boolean;
+  /**
+   * 手动控制日期选择器的显示状态，true 为显示，false 为收起。使用该属性后，选择器不会主动关闭。
+   * 建议配合 slot 及 confirm 和相关事件一起使用
+   * @default null
+   */
+  open?: boolean;
+  /**
+   * 尺寸，可选值为large、small、default或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 是否禁用选择器
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否显示清除按钮
+   * @default true
+   */
+  clearable?: boolean;
+  /**
+   * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效
+   * @default false
+   */
+  readonly?: boolean;
+  /**
+   * 文本框是否可以输入，只在没有使用 slot 时有效
+   * @default true
+   */
+  editable?: boolean;
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果,
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 可以在 type 为 datetime 和 datetimerange 下，配置 TimePicker 的属性，
+   * 比如时间间隔 steps：:time-picker-options="{steps: [1, 10, 10]}"
+   * @default {}
+   */
+  'time-picker-options'?: object;
+  /**
+   * 日期发生变化时触发	已经格式化后的日期，比如 2016-01-01
+   */
+  $emit(eventName: 'on-change', value: string): this;
+  /**
+   * 弹出日历和关闭日历时触发
+   */
+  $emit(eventName: 'on-open-change', value: boolean): this;
+  /**
+   * 在 confirm 模式下有效，点击确定按钮时触发
+   */
+  $emit(eventName: 'on-ok'): this;
+  /**
+   * 在 confirm 模式或 clearable = true 时有效，在清空日期时触发
+   */
+  $emit(eventName: 'on-clear'): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义选择器的显示内容，建议与 open 等参数一起使用，详见示例
+     */
+    '': VNode[];
+  };
+}
+
+export declare interface DatePickerOptions {
+  /**
+   * 设置快捷选项，每项内容：
+   * text：显示的文案
+   * value?: 返回指定的日期，如需自己控制逻辑，可不设置，并使用 onClick 回调
+   * onClick?: 点击时的回调，参数为当前日期选择器的 Vue 实例，当需要自定义复杂操作时，可以使用
+   */
+  shortcuts?: { text?: string, value?: () => void, onClick?: () => void }[];
+  /**
+   * 设置不可选择的日期，参数为当前的日期，需要返回 Boolean 是否禁用这天
+   */
+  disabledDate(): boolean;
+}

dist/types/divider.d.ts

@@ -0,0 +1,23 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Divider extends Vue {
+  /**
+   * 水平还是垂直类型，可选值为 horizontal 或 vertical
+   * @default horizontal
+   */
+  type?: 'horizontal' | 'vertical';
+  /**
+   * 分割线标题的位置，可选值为 left、right 或 center
+   * @default center
+   */
+  orientation?: 'left' | 'right' | 'center';
+  /**
+   * 是否虚线
+   * @default false
+   */
+  dashed?: boolean;
+}

dist/types/drawer.d.ts

@@ -0,0 +1,95 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Drawer extends Vue {
+    /**
+     * 抽屉是否显示，可使用 v-model 双向绑定数据
+     * @default false
+     */
+    value?: boolean;
+    /**
+     * 抽屉标题，如果使用 slot 自定义了页头，则 title 无效
+     * @default center
+     */
+    title?: string;
+    /**
+     * 抽屉宽度。当其值不大于 100 时以百分比显示，大于 100 时为像素
+     * @default 256
+     */
+    width?: number | string;
+    /**
+     * 是否显示右上角的关闭按钮
+     * @default true
+     */
+    closable?: boolean;
+    /**
+     * 是否允许点击遮罩层关闭
+     * @default true
+     */
+    'mask-closable'?: boolean;
+    /**
+     * 是否显示遮罩层
+     * @default true
+     */
+    mask?: boolean;
+    /**
+     * 遮罩层样式
+     */
+    'mask-style'?: object;
+    /**
+     * 抽屉中间层的样式
+     */
+    styles?: object;
+    /**
+     * 页面是否可以滚动
+     * @default false
+     */
+    scrollable?: boolean;
+    /**
+     * 抽屉的方向，可选值为 left 或 right
+     * @default right
+     */
+    placement?: 'left' | 'right';
+    /**
+     * 抽屉中间层的样式
+     * @default true
+     */
+    transfer?: boolean;
+    /**
+     * 抽屉中间层的样式
+     */
+    'class-name'?: string;
+    /**
+     * 是否设置抽屉在某个元素内打开，开启此属性时，应当关闭 transfer 属性
+     * @default false
+     */
+    'inner'?: boolean;
+    /**
+     * 关闭抽屉时触发
+     */
+    $emit(eventName: 'on-close'): this;
+    /**
+     * 显示状态发生变化时触发
+     */
+    $emit(eventName: 'on-visible-change', value: boolean): this;
+    /**
+     * slot插槽对象
+     */
+    $slots: {
+        /**
+         * 抽屉主体内容
+         */
+        '': VNode[];
+        /**
+         * 抽屉主体内容
+         */
+        header: VNode[];
+        /**
+         * 抽屉主体内容
+         */
+        close: VNode[];
+    };
+}

dist/types/dropdown.d.ts

@@ -0,0 +1,82 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Dropdown extends Vue {
+  /**
+   * 触发方式，可选值为 hover（悬停）click（点击）contextMenu（右键）custom（自定义），使用 custom 时，需配合 visible 一起使用
+   * @default hover
+   */
+  trigger?: 'hover'|'click'|'custom'|'contextMenu';
+  /**
+   * 手动控制下拉框的显示，在 trigger = 'custom' 时使用
+   * @default false
+   */
+  visible?: boolean;
+  /**
+   * 下拉菜单出现的位置，可选值为
+   * top，top-start，top-end，bottom，bottom-start，bottom-end，
+   * left，left-start，left-end，right，right-start，right-end
+   * 2.12.0 版本开始支持自动识别
+   * @default bottom
+   */
+  placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 点击菜单项时触发
+   * 
+   */
+  $emit(eventName: 'on-click', value: string): this;
+  /**
+   * 菜单显示状态改变时调用
+   */
+  $emit(eventName: 'on-visible-change', value: boolean): this;
+  /**
+   * 点击外部关闭下拉菜单时触发
+   */
+  $emit(eventName: 'on-clickoutside', event: object): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 主体内容
+     */
+    '': VNode[];
+    /**
+     * 列表内容，一般由 DropdownMenu 承担
+     */
+    list: VNode[];
+  };
+}
+
+export declare interface DropdownMenu extends Vue {
+}
+
+export declare interface DropdownItem extends Vue {
+  /**
+   * 用来标识这一项
+   */
+  name?: string;
+  /**
+   * 禁用该项
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 显示分割线
+   * @default false
+   */
+  divided?: boolean;
+  /**
+   * 标记该项为选中状态
+   * @default false
+   */
+  selected?: boolean;
+}

dist/types/footer.d.ts

@@ -0,0 +1,8 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Footer extends Vue {
+}

dist/types/form.d.ts

@@ -0,0 +1,100 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Form extends Vue {
+  /**
+   * 表单数据对象
+   */
+  model?: object;
+  /**
+   * 表单验证规则，具体配置查看 async-validator
+   */
+  rules?: object;
+  /**
+   * 是否开启行内表单模式
+   * @default false
+   */
+  inline?: boolean;
+  /**
+   * 表单域标签的位置，可选值为 left、right、top
+   * @default right
+   */
+  'label-position'?: 'left'|'right'|'top';
+  /**
+   * 表单域标签的宽度，所有的 FormItem 都会继承 Form 组件的 label-width 的值
+   */
+  'label-width'?: number;
+  /**
+   * 是否显示校验错误信息
+   * @default true
+   */
+  'show-message'?: boolean;
+  /**
+   * 对整个表单进行校验，参数为检验完的回调，会返回一个 Boolean 表示成功与失败
+   */
+  validate(callback?: (valid?: boolean) => void): void;
+  /**
+   * 对部分表单字段进行校验的方法，参数1为需校验的 prop，参数2为检验完回调，返回错误信息
+   */
+  validateField(prop?: string, callback?: (valid?: boolean) => void): void;
+  /**
+   * 对整个表单进行重置，将所有字段值重置为空并移除校验结果
+   */
+  resetFields(): void;
+}
+
+export declare interface FormItem extends Vue {
+  /**
+   * 对应表单域 model 里的字段
+   */
+  prop?: string;
+  /**
+   * 标签文本
+   */
+  label?: string;
+  /**
+   * 表单域标签的的宽度
+   */
+  'label-width'?: number;
+  /**
+   * 指定原生的 label 标签的 for 属性，配合控件的 element-id 属性，可以点击 label 时聚焦控件。
+   */
+  'label-for'?: string;
+  /**
+   * 是否必填，如不设置，则会根据校验规则自动生成
+   */
+  required?: boolean;
+  /**
+   * 表单验证规则
+   */
+  rules?: object | Array<any>;
+  /**
+   * 表单域验证错误信息, 设置该值会使表单验证状态变为error，并显示该错误信息
+   */
+  error?: string;
+  /**
+   * 是否显示校验错误信息
+   * @default true
+   */
+  'show-message'?: boolean;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 内容
+     */
+    '': VNode[];
+    /**
+     * label 内容
+     */
+    label: VNode[];
+  };
+}
+
+
+
+

dist/types/grid.d.ts

@@ -0,0 +1,72 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Row extends Vue {
+  /**
+   * 栅格间距，单位 px，左右平分
+   * @default 0
+   */
+  gutter?: number;
+  /**
+   * 布局模式，可选值为flex或不选，在现代浏览器下有效
+   */
+  type?: string;
+  /**
+   * lex 布局下的垂直对齐方式，可选值为top、middle、bottom
+   */
+  align?: 'top'|'middle'|'bottom';
+  /**
+   * flex 布局下的水平排列方式，可选值为start、end、center、space-around、space-between
+   */
+  justify?: 'start'|'end'|'center'|'space-around'|'space-between';
+  /**
+   * 自定义的class名称
+   */
+  'class-name'?: string;
+}
+
+export declare interface Col extends Vue {
+  /**
+   * 栅格的占位格数，可选值为0~24的整数，为 0 时，相当于display:none
+   */
+  span?: number | string;
+  /**
+   * 栅格的顺序，在flex布局模式下有效
+   */
+  order?: number | string;
+  /**
+   * 栅格左侧的间隔格数，间隔内不可以有栅格
+   */
+  offset?: number | string;
+  /**
+   * 栅格向右移动格数
+   */
+  push?: number | string;
+  /**
+   * 栅格向左移动格数
+   */
+  pull?: number | string;
+  /**
+   * 自定义的class名称
+   */
+  'class-name'?: string;
+  /**
+   * <768px 响应式栅格，可为栅格数或一个包含其他属性的对象
+   */
+  xs?: number | object;
+  /**
+   * ≥768px 响应式栅格，可为栅格数或一个包含其他属性的对象
+   */
+  sm?: number | object;
+  /**
+   * ≥992px 响应式栅格，可为栅格数或一个包含其他属性的对象
+   */
+  md?: number | object;
+  /**
+   * ≥1200px 响应式栅格，可为栅格数或一个包含其他属性的对象
+   */
+  lg?: number | object;
+}

dist/types/header.d.ts

@@ -0,0 +1,8 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Header extends Vue {
+}

dist/types/icon.d.ts

@@ -0,0 +1,20 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Icon extends Vue {
+  /**
+   * 图标的名称
+   */
+  type?: string;
+  /**
+   * 图标的大小，单位是 px
+   */
+  size?: number | string;
+  /**
+   * 图标的颜色
+   */
+  color?: string;
+}

dist/types/index.d.ts

@@ -0,0 +1,10 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import iView from './iview';
+
+export default iView;
+export as namespace iView;
+
+export * from './iview.components';

dist/types/input-number.d.ts

@@ -0,0 +1,80 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface InputNumber extends Vue {
+  /**
+   * 最大值，默认值Infinity
+   */
+  max?: number;
+  /**
+   * 最小值，默认值-Infinity
+   */
+  min?: number;
+  /**
+   * 当前值，可以使用 v-model 双向绑定数据，默认值1
+   */
+  value?: number;
+  /**
+   * 每次改变的步伐，可以是小数，默认值1
+   */
+  step?: number;
+  /**
+   * 输入框尺寸，可选值为large、small、default或者不填
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 设置禁用状态，默认值false
+   */
+  disabled?: boolean;
+  /**
+   * 输入框占位符
+   * @default 请选择
+   */
+  placeholder?: string;
+  /**
+   * 指定输入框展示值的格式
+   */
+  formatter?: () => void;
+  /**
+   * 指定从 formatter 里转换回数字的方式，和 formatter 搭配使用
+   */
+  parser?: () => void;
+  /**
+   * 是否设置为只读
+   * @default false
+   */
+  readonly?: boolean;
+  /**
+   * 是否可编辑
+   * @default true
+   */
+  editable?: boolean;
+  /**
+   * 数值精度
+   */
+  precision?: number;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 是否实时响应数据，设置为 false 时，只会在失焦时更改数据
+   * @default true
+   */
+  'active-change'?: boolean;
+  /**
+   * 数值改变时的回调，返回当前值，默认值当前值
+   */
+  $emit(eventName: 'on-change', value: number): this;
+  /**
+   * 聚焦时触发
+   */
+  $emit(eventName: 'on-focus', event: KeyboardEvent): this;
+  /**
+   * 失焦时触发
+   */
+  $emit(eventName: 'on-blur', event: KeyboardEvent): this;
+}

dist/types/input.d.ts

@@ -0,0 +1,168 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Input extends Vue {
+  /**
+   * 输入框类型，可选值为 text、password、textarea、url、email、date
+   * @default text
+   */
+  type?: 'text' | 'password' | 'textarea' | 'url' | 'email' | 'date';
+  /**
+   * 绑定的值，可使用 v-model 双向绑定
+   * @default 空
+   */
+  value?: string | number;
+  /**
+   * 输入框尺寸，可选值为large、small、default或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 占位文本
+   */
+  placeholder?: string;
+  /**
+   * 是否显示清空按钮
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * 设置输入框为禁用状态
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 设置输入框为只读
+   * @default false
+   */
+  readonly?: boolean;
+  /**
+   * 最大输入长度
+   */
+  maxlength?: number;
+  /**
+   * 输入框尾部图标，仅在 text 类型下有效
+   */
+  icon?: string;
+  /**
+   * 输入框头部图标
+   * @default false
+   */
+  prefix?: string;
+  /**
+   * 输入框尾部图标
+   * @default false
+   */
+  suffix?: String;
+  /**
+   * 是否显示为搜索型输入框
+   * @default false
+   */
+  search?: boolean;
+  /**
+   * 开启 search 时可用，是否有确认按钮，可设为按钮文字
+   * @default false
+   */
+  'enter-button'?: boolean | string;
+  /**
+   * 文本域默认行数，仅在 textarea 类型下有效
+   * @default 2
+   */
+  rows?: number;
+  /**
+   * 自适应内容高度，仅在 textarea 类型下有效，可传入对象，如 { minRows: 2, maxRows: 6 }
+   * @default false
+   */
+  autosize?: boolean | { minRows?: number, maxRows?: number };
+  /**
+   * 将用户的输入转换为 number 类型
+   * @default false
+   */
+  number?: boolean;
+  /**
+   * 自动获取焦点
+   * @default false
+   */
+  autofocus?: boolean;
+  /**
+   * 原生的自动完成功能，可选值为 off 和 on,off
+   */
+  autocomplete?: string;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 原生的 spellcheck 属性
+   * @default false
+   */
+  spellcheck?: boolean;
+  /**
+   * 原生的 wrap 属性，可选值为 hard 和 soft，仅在 textarea 下生效
+   * @default soft
+   */
+  wrap?: 'hard' | 'soft';
+  /**
+   * 按下回车键时触发
+   */
+  $emit(eventName: 'on-enter'): this;
+  /**
+   * 设置 icon 属性后，点击图标时触发
+   */
+  $emit(eventName: 'on-click'): this;
+  /**
+   * 数据改变时触发
+   */
+  $emit(eventName: 'on-change', event: string): this;
+  /**
+   * 输入框聚焦时触发
+   */
+  $emit(eventName: 'on-focus'): this;
+  /**
+   * 输入框失去焦点时触发
+   */
+  $emit(eventName: 'on-blur'): this;
+  /**
+   * 原生的 keyup 事件
+   */
+  $emit(eventName: 'on-keyup', event: KeyboardEvent): this;
+  /**
+   * 原生的 keydown 事件
+   */
+  $emit(eventName: 'on-keydown', event: KeyboardEvent): this;
+  /**
+   * 原生的 keypress 事件
+   */
+  $emit(eventName: 'on-keypress', event: KeyboardEvent): this;
+  /**
+   * 开启 search 时可用，点击搜索或按下回车键时触发
+   */
+  $emit(eventName: 'on-search', value: string): this;
+  /**
+   * 手动聚焦输入框
+   */
+  focus(): void;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 前置内容，仅在 text 类型下有效
+     */
+    prepend: VNode[];
+    /**
+     * 后置内容，仅在 text 类型下有效
+     */
+    append: VNode[];
+    /**
+     * 输入框头部图标
+     */
+    prefix: VNode[];
+    /**
+     * 输入框尾部图标
+     */
+    suffix: VNode[];
+  };
+}

dist/types/iview.components.d.ts

@@ -0,0 +1,91 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export { Affix } from './affix';
+export { Alert } from './alert';
+export { Anchor, AnchorLink } from './anchor';
+export { AutoComplete } from './auto-complete';
+export { Avatar } from './avatar';
+export { BackTop } from './back-top';
+export { Badge } from './badge';
+export { Breadcrumb, BreadcrumbItem } from './breadcrumb';
+export { Button, ButtonGroup } from './button';
+export { Card } from './card';
+export { Carousel, CarouselItem } from './carousel';
+export { Cascader } from './cascader';
+export { Cell, CellGroup } from './cell';
+export { Checkbox, CheckboxGroup } from './checkbox';
+export { Circle, Circle as ICircle } from './circle';
+export { Collapse, CollapsePanel } from './collapse';
+export { ColorPicker } from './color-picker';
+export { Content } from './content';
+export { DatePicker, DatePickerOptions } from './date-picker';
+export { Divider } from './divider';
+export { Drawer } from './drawer';
+export { Dropdown, DropdownMenu, DropdownItem } from './dropdown';
+export { Footer } from './footer';
+export { Form, FormItem } from './form';
+export { Row, Col } from './grid';
+export { Header } from './header';
+export { Icon } from './icon';
+export { Input } from './input';
+export { InputNumber } from './input-number';
+export { Scroll } from './scroll';
+export { Split } from './split';
+export { Layout } from './layout';
+export { LoadingBar, LoadingBarConfig } from './loading-bar';
+export { Menu, MenuGroup, MenuItem, MenuSub } from './menu';
+export { Message, MessageConfig } from './message';
+export { Modal, ModalInstance, ModalConfig } from './modal';
+export { Notice, NoticeConfig, NoticeGlobalConfig } from './notice';
+export { Page } from './page';
+export { Poptip } from './poptip';
+export { Progress } from './progress';
+export { Radio, RadioGroup } from './radio';
+export { Rate } from './rate';
+export { Select, Option, OptionGroup } from './select';
+export { Sider } from './sider';
+export { Slider } from './slider';
+export { Spin } from './spin';
+export { Steps, StepsStep } from './steps';
+export { Switch, Switch as ISwitch } from './switch';
+export { Table, TableColumn, TableRenderCreateElementData, TableColumnRenderParams, TableRenderCreateElementResult, TableColumnRenderHeadParams, TableExportCsvParams } from './table';
+export { Tabs, TabsPane } from './tabs';
+export { Tag } from './tag';
+export { Time } from './time';
+export { Timeline, TimelineItem } from './timeline';
+export { TimePicker } from './time-picker';
+export { Tooltip } from './tooltip';
+export { Transfer } from './transfer';
+export { Tree, TreeChild } from './tree';
+export { Upload } from './upload';
+
+declare const API: {
+    version: string;
+    locale: (l) => void;
+    i18n: (fn) => void;
+    install: (
+        Vue: Vue,
+        opts: {
+            locale?: any;
+            i18n?: any;
+            size?: any;
+            transfer?: any;
+        }
+    ) => void;
+    lang: (code: string) => void;
+};
+
+export default API;
+
+declare module 'vue/types/vue' {
+    interface Vue {
+        $IVIEW: {
+            size?: string;
+            transfer?: string;
+        };
+    }
+}

dist/types/iview.d.ts

@@ -0,0 +1,6 @@
+import { PluginFunction } from 'vue';
+
+interface IView extends PluginFunction<any> {}
+
+declare const iView: IView;
+export default iView;

dist/types/layout.d.ts

@@ -0,0 +1,72 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Layout extends Vue {
+  /**
+   * 触发响应式布局的断点，可选值为xs,sm,md,lg,xl或xxl，若不设此属性则不会触发响应式布局。
+   * {
+   *    xs?: '480px',
+   *    sm?: '768px',
+   *    md?: '992px',
+   *    lg?: '1200px',
+   *    xl?: '1600px'
+   * }
+   */
+  breakpoint?: string;
+  /**
+   * 	侧边栏是否收起，可使用 v-model 双向绑定数据。
+   * @default false
+   */
+  value?: boolean;
+  /**
+   * 宽度
+   * @default 200
+   */
+  width?: number;
+  /**
+   * 是否可收起，设为false后，默认触发器会隐藏，且响应式布局不会触发
+   * @default false
+   */
+  collapsible?: boolean;
+  /**
+   * 收缩宽度，设置为 0 会出现特殊 trigger
+   * @default 64
+   */
+  'collapsed-width'?: number;
+  /**
+   * 隐藏默认触发器
+   * @default false
+   */
+  'hide-trigger'?: boolean;
+  /**
+   * 是否默认收起，设置了collapsible后设置此属性侧边栏仍会收起。
+   * @default false
+   */
+  'default-collapsed'?: boolean;
+  /**
+   * 改变侧边栏触发器箭头方向，和改变侧边栏收起方向，当Sider在右边时可以使用。
+   * @default false
+   */
+  'reverse-arrow'?: boolean;
+  /**
+   * 展开-收起时的回调true/false
+   */
+  $emit(eventName: 'on-collapse', []): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义触发器
+     * @default 
+     */
+    trigger: VNode[];
+  };
+  /**
+   * methods, 改变Sider展开-收起状态。
+   */
+  toggleCollapse(): void;
+}

dist/types/loading-bar.d.ts

@@ -0,0 +1,61 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface LoadingBar {
+  /**
+   * 开始从 0 显示进度条，并自动加载进度
+   */
+  start(): void;
+  /**
+   * 结束进度条，自动补全剩余进度
+   */
+  finish(): void;
+  /**
+   * 以错误的类型结束进度条，自动补全剩余进度
+   */
+  error(): void;
+  /**
+   * 精确加载到指定的进度
+   * @param percent 指定的进度百分比
+   */
+  update(percent?: number): void;
+  /**
+   * 全局配置
+   * @param options 配置对象
+   */
+  config(options?: LoadingBarConfig): void;
+  /**
+   * 全局销毁
+   */
+  destroy(): void;
+}
+
+export declare interface LoadingBarConfig {
+  /**
+   * 进度条的颜色，默认为 iView 主色 
+   * @default primary
+   */
+  color?: string;
+  /**
+   * 失败时的进度条颜色，默认为 iView 主色 
+   * @default error
+   */
+  failedColor?: string;
+  /**
+   * 进度条高度，单位 px 
+   * @default 2
+   */
+  height?: number;
+}
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    /**
+     * 加载进度条
+     */
+    $Loading: LoadingBar;
+  }
+}

dist/types/menu.d.ts

@@ -0,0 +1,102 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Menu extends Vue {
+  /**
+   * 菜单类型，可选值为 horizontal（水平） 和 vertical（垂直）
+   * @default vertical
+   */
+  mode?: 'horizontal' | 'vertical';
+  /**
+   * 主题，可选值为 light、dark、primary，其中 primary 只适用于 mode="horizontal"
+   * @default light
+   */
+  theme?: 'light' | 'dark' | 'primary';
+  /**
+   * 激活菜单的 name 值
+   */
+  'active-name'?: string | number;
+  /**
+   * 展开的 Submenu 的 name 集合
+   */
+  'open-names'?: string[] | number[];
+  /**
+   * 是否开启手风琴模式，开启后每次至多展开一个子菜单
+   * @default false
+   */
+  accordion?: boolean;
+  /**
+   * 导航菜单的宽度，只在 mode="vertical" 时有效，如果使用 Col 等布局，建议设置为 auto
+   * @default 240px
+   */
+  width?: string;
+  /**
+   * 选择菜单（MenuItem）时触发
+   */
+  $emit(eventName: 'on-select', name?: string | number): this;
+  /**
+   * 当 展开/收起 子菜单时触发	
+   * @default 当前展开的 Submenu 的 name 值数组
+   */
+  $emit(eventName: 'on-open-change', names: string[] | number[]): this;
+  /**
+   * 手动更新展开的子目录，注意要在 $nextTick 里调用
+   */
+  updateOpened(): void;
+  /**
+   * 手动更新当前选择项，注意要在 $nextTick 里调用
+   */
+  updateActiveName(): void;
+}
+
+export declare interface MenuItem extends Vue {
+  /**
+   * 菜单项的唯一标识，必填
+   */
+  name?: string | number;
+  /**
+   * 跳转的链接，支持 vue-router 对象
+   */
+  to?: string | object;
+  /**
+   * 路由跳转时，开启 replace 将不会向 history 添加新记录
+   * @default false
+   */
+  replace?: boolean;
+  /**
+   * 相当于 a 链接的 target 属性
+   * @default _self
+   */
+  target?: '_blank' | '_self' | '_parent' | '_top';
+}
+
+export declare interface MenuSub extends Vue {
+  /**
+   * 子菜单的唯一标识，必填
+   */
+  name?: string | number;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 菜单项
+     */
+    '': VNode[];
+    /**
+     * 子菜单标题
+     */
+    title: VNode[];
+  };
+}
+
+export declare interface MenuGroup extends Vue {
+  /**
+   * 分组标题
+   * @default 空
+   */
+  title?: string;
+}

dist/types/message.d.ts

@@ -0,0 +1,84 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode, CreateElement } from "vue";
+
+export declare interface Message {
+  /**
+   * 消息
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  info(config?: MessageConfig | string): void;
+  /**
+   * 成功
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  success(config?: MessageConfig | string): void;
+  /**
+   * 警告
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  warning(config?: MessageConfig | string): void;
+  /**
+   * 错误
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  error(config?: MessageConfig | string): void;
+  /**
+   * 配置
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  loading(options?: MessageConfig | string): void;
+  /**
+   * 配置
+   * @param config MessageConfig为相关配置,string为待显示的内容
+   */
+  config(options?: MessageConfig): void;
+  /**
+   * 销毁
+   */
+  destroy(): void;
+}
+
+export declare interface MessageConfig {
+  /**
+   * 提示内容
+   */
+  content?: string;
+  /**
+   * 自定义描述内容，使用 Vue 的 Render 函数
+   */
+  render?: (h: CreateElement) => VNode;
+  /**
+   * 关闭时的回调
+   */
+  onClose?: () => void;
+  /**
+   * 页面是否可以滚动
+   * @default false
+   */
+  closable?: boolean;
+  /**
+   * 提示组件距离顶端的距离，单位像素
+   * @default 24
+   */
+  top?: number;
+  /**
+   * 默认自动关闭的延时，单位秒
+   * @default 1.5
+   */
+  duration?: number;
+}
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    /**
+     * 全局提示
+     */
+    $Message: Message;
+  }
+}
+
+
+

dist/types/modal.d.ts

@@ -0,0 +1,223 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Modal {
+  /**
+   * 对话框是否显示，可使用 v-model 双向绑定数据。
+   * @default false
+   */
+  value?: boolean;
+  /**
+   * 对话框标题，如果使用 slot 自定义了页头，则 title 无效
+   */
+  title?: string;
+  /**
+   * 是否显示右上角的关闭按钮，关闭后 Esc 按键也将关闭,
+   * @default true
+   */
+  closable?: boolean;
+  /**
+   * 是否允许点击遮罩层关闭
+   * @default true
+   */
+  'mask-closable'?: boolean;
+  /**
+   * 点击确定按钮时，确定按钮是否显示 loading 状态，开启则需手动设置visible来关闭对话框,
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 页面是否可以滚动
+   * @default false
+   */
+  scrollable?: boolean;
+  /**
+   * 是否全屏显示
+   * @default false
+   */
+  fullscreen?: boolean;
+  /**
+   * 是否可以拖拽移动
+   * @default false
+   */
+  draggable?: boolean;
+  /**
+   * 是否显示遮罩层，开启 draggable 时，强制不显示
+   * @default true
+   */
+  mask?: boolean;
+  /**
+   * 确定按钮文字
+   * @default 确定
+   */
+  'ok-text'?: string;
+  /**
+   * 取消按钮文字
+   * @default 取消
+   */
+  'cancel-text'?: string;
+  /**
+   * 对话框宽度，单位 px。
+   * 对话框的宽度是响应式的，当屏幕尺寸小于 768px 时，宽度会变为自动auto,
+   * @default 	520
+   */
+  width?: number | string;
+  /**
+   * 不显示底部
+   * @default false
+   */
+  'footer-hide'?: boolean;
+  /**
+   * 设置浮层样式，调整浮层位置等，该属性设置的是.ivu-modal的样式
+   */
+  style?: object;
+  /**
+   * 设置对话框容器.ivu-modal-wrap的类名，可辅助实现垂直居中等自定义效果
+   */
+  'class-name'?: string;
+  /**
+   * 层级
+   * @default 1000
+   */
+  'z-index'?: number;
+  /**
+   * 自定义显示动画，第一项是模态框，第二项是背景,
+   * @default ['ease', 'fade']
+   */
+  'transition-names'?: Array<string>;
+  /**
+   * 是否将弹层放置于 body 内，默认值true
+   * @default true
+   */
+  transfer?: boolean;
+  /**
+   * 点击确定的回调
+   */
+  $emit(eventName: 'on-ok'): this;
+  /**
+   * 开关变化时触发，返回当前的状态
+   */
+  $emit(eventName: 'on-cancel'): this;
+  /**
+   * 开关变化时触发，返回当前的状态
+   */
+  $emit(eventName: 'on-visible-change', visible: boolean): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 对话框主体内容
+     */
+    '': VNode[];
+    /**
+     * 自定义页头
+     */
+    header: VNode[];
+    /**
+     * 自定义页脚内容
+     */
+    footer: VNode[];
+    /**
+     * 自定义右上角关闭内容
+     */
+    close: VNode[];
+  };
+}
+
+export declare interface ModalInstance {
+  /**
+   * 消息
+   * @param config ModalConfig为相关配置,string为待显示的内容
+   */
+  info(config?: ModalConfig | string): void;
+  /**
+   * 成功
+   * @param config ModalConfig为相关配置,string为待显示的内容
+   */
+  success(config?: ModalConfig | string): void;
+  /**
+   * 警告
+   * @param config ModalConfig为相关配置,string为待显示的内容
+   */
+  warning(config?: ModalConfig | string): void;
+  /**
+   * 错误
+   * @param config ModalConfig为相关配置,string为待显示的内容
+   */
+  error(config?: ModalConfig | string): void;
+  /**
+   * 对话框
+   * @param config ModalConfig为相关配置,string为待显示的内容
+   */
+  confirm(config?: ModalConfig | string): void;
+  /**
+   * 移除
+   */
+  remove(): void;
+}
+
+export declare interface ModalConfig {
+  /**
+   * 标题或者Element选择器字符串
+   */
+  title?: string;
+  /**
+   * 内容或者Element选择器字符串
+   */
+  content?: string;
+  /**
+   * 自定义内容，使用后不再限制类型， content 也无效。
+   */
+  render?: () => void;
+  /**
+   * 宽度，单位 px
+   * @default 416
+   */
+  width?: number | string;
+  /**
+   * 确定按钮的文字
+   * @default 确定
+   */
+  okText?: string;
+  /**
+   * 取消按钮的文字，只在Modal.confirm()下有效
+   * @default 取消
+   */
+  cancelText?: string;
+  /**
+   * 点击确定按钮时，确定按钮是否显示 loading 状态，开启则需手动调用Modal.remove()来关闭对话框
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 页面是否可以滚动
+   * @default false
+   */
+  scrollable?: boolean;
+  /**
+   * 页面是否可以滚动
+   * @default false
+   */
+  closable?: boolean;
+  /**
+   * 点击确定的回调
+   */
+  onOk?: () => void;
+  /**
+   * 点击取消的回调，只在Modal.confirm()下有效
+   */
+  onCancel?: () => void;
+}
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    /**
+     * 对话框
+     */
+    $Modal: ModalInstance;
+  }
+}

dist/types/notice.d.ts

@@ -0,0 +1,92 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode, CreateElement } from "vue";
+
+export declare interface Notice {
+  /**
+   * 打开
+   * @param config NoticeConfig为相关配置,string为待显示的内容
+   */
+  open(config?: NoticeConfig | string): void;
+  /**
+   * 信息
+   * @param config NoticeConfig为相关配置,string为待显示的内容
+   */
+  info(config?: NoticeConfig | string): void;
+  /**
+   * 成功
+   * @param config NoticeConfig为相关配置,string为待显示的内容
+   */
+  success(config?: NoticeConfig | string): void;
+  /**
+   * 警告
+   * @param config NoticeConfig为相关配置,string为待显示的内容
+   */
+  warning(config?: NoticeConfig | string): void;
+  /**
+   * 错误
+   * @param config NoticeConfig为相关配置,string为待显示的内容
+   */
+  error(config?: NoticeConfig): void;
+  /**
+   * 全局配置
+   */
+  config(options?: NoticeGlobalConfig): void;
+  /**
+   * 全局关闭某个通知
+   */
+  close(name?: string): void;
+  /**
+   * 全局销毁
+   */
+  destroy(): void;
+}
+
+export declare interface NoticeConfig {
+  /**
+   * 通知提醒的标题
+   */
+  title?: string;
+  /**
+   * 通知提醒的内容，为空或不填时，自动应用仅标题模式下的样式
+   */
+  desc?: string;
+  /**
+   * 自定义描述内容，使用 Vue 的 Render 函数
+   */
+  render?: (h: CreateElement) => VNode;
+  /**
+   * 自动关闭的延时，单位秒，不关闭可以写 0 默认4.5
+   */
+  duration?: number;
+  /**
+   * 当前通知的唯一标识
+   */
+  name?: string;
+  /**
+   * 关闭时的回调
+   */
+  onClose?: Function;
+}
+
+export declare interface NoticeGlobalConfig {
+  /**
+   * 通知组件距离顶端的距离，单位像素 默认24
+   */
+  top?: number;
+  /**
+   * 默认自动关闭的延时，单位秒 默认4.5
+   */
+  duration?: number;
+}
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    /**
+     * 通知提醒
+     */
+    $Notice: Notice;
+  }
+}

dist/types/page.d.ts

@@ -0,0 +1,99 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Page extends Vue {
+  /**
+   * 当前页码，支持 .sync 修饰符
+   * @default 1
+   */
+  current?: number;
+  /**
+   * 数据总数
+   * @default 0
+   */
+  total?: number;
+  /**
+   * 每页条数
+   * @default 10
+   */
+  'page-size'?: number;
+  /**
+   * 每页条数切换的配置
+   * @default [10, 20, 30, 40]
+   */
+  'page-size-opts'?: number[];
+  /**
+   * 条数切换弹窗的展开方向，可选值为 bottom 和 top
+   * @default bottom
+   */
+  placement?: string;
+  /**
+   * 可选值为small（迷你版）或不填（默认）
+   */
+  size?: string;
+  /**
+   * 简洁版
+   * @default false
+   */
+  simple?: boolean;
+  /**
+   * 显示总数
+   * @default false
+   */
+  'show-total'?: boolean;
+  /**
+   * 显示电梯，可以快速切换到某一页
+   * @default false
+   */
+  'show-elevator'?: boolean;
+  /**
+   * 显示分页，用来改变page-size
+   * @default false
+   */
+  'show-sizer'?: boolean;
+  /**
+   * 自定义 class 名称
+   */
+  'class-name'?: string;
+  /**
+   * 自定义 style 样式
+   */
+  styles?: object;
+  /**
+   * 是否将弹层放置于 body 内，
+   * 在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，
+   * 它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 替代图标显示的上一页文字
+   */
+  'prev-text'?: string;
+  /**
+   * 替代图标显示的下一页文字
+   */
+  'next-text'?: string;
+  /**
+   * 页码改变的回调，返回改变后的页码
+   * @param pageNum 页码
+   */
+  $emit(eventName: 'on-change', pageNum: number): this;
+  /**
+   * 切换每页条数时的回调，返回切换后的每页条数
+   * @param pageSize 每页条数
+   */
+  $emit(eventName: 'on-page-size-change', pageSize: number): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义显示总数的内容
+     */
+    '': VNode[];
+  };
+}

dist/types/poptip.d.ts

@@ -0,0 +1,123 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Poptip extends Vue {
+  /**
+   * 触发方式，可选值为hover（悬停）click（点击）focus（聚焦）,
+   * 在 confirm 模式下，只有 click 有效
+   * @default click
+   */
+  trigger?: string;
+  /**
+   * 显示的标题
+   */
+  title?: string | number;
+  /**
+   * 显示的正文内容，只在非 confirm 模式下有效\
+   * @default 空
+   */
+  content?: string | number;
+  /**
+   * 提示框出现的位置，可选值为
+   * top，top-start，top-end，bottom，bottom-start，bottom-end，
+   * left，left-start，left-end，right，right-start，right-end
+   * 2.12.0 版本开始支持自动识别
+   * @default top
+   */
+  placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+  /**
+   * 宽度，最小宽度为 150px，在 confirm 模式下，默认最大宽度为 300px
+   */
+  width?: string | number;
+  /**
+   * 是否开启对话框模式
+   * @default false
+   */
+  confirm?: boolean;
+  /**
+   * 确定按钮的文字，只在 confirm 模式下有效
+   * @default 确定
+   */
+  'ok-text'?: string;
+  /**
+   * 取消按钮的文字，只在 confirm 模式下有效
+   * @default 取消
+   */
+  'cancel-text'?: string;
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 给 Poptip 设置 class-name，在使用 transfer 时会很有用
+   * @default false
+   */
+  'popper-class'?: string;
+  /**
+   * 开启后，超出指定宽度文本将自动换行，并两端对齐
+   * @default false
+   */
+  'word-wrap'?: boolean;
+  /**
+   * 自定义间距值
+   * @default 8px 16px
+   */
+  padding?: string;
+  /**
+   * 出现位置的偏移量
+   * @default false
+   */
+  offset?: string;
+  /**
+   * 自定义 popper.js 的配置项，具体配置见 popper.js 文档
+   * @default {
+        modifiers: {
+            computeStyle:{
+                gpuAcceleration: false,
+            },
+            preventOverflow :{
+                boundariesElement: 'window'
+            }
+        }
+      }
+   */
+  options?: object;
+  /**
+   * 在提示框显示时触发
+   */
+  $emit(eventName: 'on-popper-show'): this;
+  /**
+   * 在提示框消失时触发
+   */
+  $emit(eventName: 'on-popper-hide'): this;
+  /**
+   * 点击确定的回调，只在 confirm 模式下有效
+   */
+  $emit(eventName: 'on-ok'): this;
+  /**
+   * 点击取消的回调，只在 confirm 模式下有效
+   */
+  $emit(eventName: 'on-cancel'): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 主体内容
+     */
+    '': VNode[];
+    /**
+     * 提示框标题，定义此 slot 时，会覆盖 props title
+     */
+    title: VNode[];
+    /**
+     * 提示框内容，定义此 slot 时，会覆盖 props content，只在非 confirm 模式下有效
+     */
+    content: VNode[];
+  }
+}

dist/types/progress.d.ts

@@ -0,0 +1,47 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Progress extends Vue {
+  /**
+   * 百分比
+   * @default 0
+   */
+  percent?: number;
+  /**
+   * 状态，可选值为normal、active、wrong、success
+   * @default normal
+   */
+  status?: 'normal'|'active'|'wrong'|'success';
+  /**
+   * 进度条的线宽，单位 px
+   * @default 10
+   */
+  'stroke-width'?: number;
+  /**
+   * 隐藏数值或状态图标
+   * @default false
+   */
+  'hide-info'?: boolean;
+  /**
+   * 是否在垂直方向显示
+   * @default false
+   */
+  vertical?: boolean;
+  /**
+   * 已完成的分段百分比
+   * @default 0
+   */
+  'success-percent'?: number;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义显示状态内容
+     */
+    '': VNode[];
+  };
+}

dist/types/radio.d.ts

@@ -0,0 +1,64 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Radio extends Vue {
+  /**
+   * 只在单独使用时有效。可以使用 v-model 双向绑定数据
+   * @default false
+   */
+  value?: boolean;
+  /**
+   * 只在组合使用时有效。指定当前选项的 value 值，组合会自动判断当前选择的项目
+   */
+  label?: string | number;
+  /**
+   * 是否禁用当前项
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 单选框的尺寸，可选值为 large、small、default 或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default true
+   */
+  'true-value'?: string | number | boolean;
+  /**
+   * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default false
+   */
+  'false-value'?: string | number | boolean;
+  /**
+   * 在选项状态发生改变时触发，返回当前状态。通过修改外部的数据改变时不会触发
+   */
+  $emit(eventName: 'on-change', arg: string | number | boolean): this;
+}
+
+export declare interface RadioGroup extends Vue {
+  /**
+   * 指定当前选中的项目数据。可以使用 v-model 双向绑定数据
+   */
+  value?: string | number;
+  /**
+   * 可选值为 button 或不填，为 button 时使用按钮样式
+   */
+  type?: string;
+  /**
+   * 尺寸，可选值为large、small、default或者不设置
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 是否垂直排列，按钮样式下无效
+   * @default false
+   */
+  vertical?: boolean;
+  /**
+   * 在选项状态发生改变时触发，返回当前选中的项。通过修改外部的数据改变时不会触发
+   */
+  $emit(eventName: 'on-change', ...args: Array<string | number | boolean>): this;
+}

dist/types/rate.d.ts

@@ -0,0 +1,54 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Rate extends Vue {
+  /**
+   * star总数
+   * @default 5
+   */
+  count?: number;
+  /**
+   * 当前 star 数，可以使用 v-model 双向绑定数据
+   * @default 0
+   */
+  value?: number;
+  /**
+   * 是否允许半选
+   * @default false
+   */
+  'allow-half'?: boolean;
+  /**
+   * 是否只读，无法进行交互
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否显示提示文字
+   * @default false
+   */
+  'show-text'?: boolean;
+  /**
+   * 是否可以取消选择
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * 自定义字符
+   */
+  character?: string;
+  /**
+   * 使用图标
+   */
+  icon?: string;
+  /**
+   * 使用自定义图标
+   */
+  'custom-icon'?: string;
+  /**
+   * 评分改变时触发
+   */
+  $emit(eventName: 'on-change', value: number): this;
+}

dist/types/scroll.d.ts

@@ -0,0 +1,35 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Scroll extends Vue {
+  /**
+   * 滚动区域的高度，单位像素
+   * @default 300
+   */
+  height?: string | number;
+  /**
+   * 加载中的文案
+   * @default 加载中
+   */
+  'loading-text'?: string;
+  /**
+   * 滚动至顶部时触发，需返回Promise
+   */
+  'on-reach-top'?: () => void;
+  /**
+   * 滚动至底部时触发，需返回Promise
+   */
+  'on-reach-bottom'?: () => void;
+  /**
+   * 滚动至顶部或底部时触发，需返回Promise
+   */
+  'on-reach-edge'?: () => void;
+  /**
+   * 从边缘到触发回调的距离。如果是负的，回调将在到达边缘之前触发。值最好在 24 以下。
+   * @default [20, 20]
+   */
+  'distance-to-edge'?: number | number[];
+}

dist/types/select.d.ts

@@ -0,0 +1,141 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Select extends Vue {
+  /**
+   * 指定选中项目的 value 值，可以使用 v-model 双向绑定数据。
+   * 单选时只接受 String 或 Number，多选时只接受 Array
+   * @default 空
+   */
+  value?: string | number | string[] | number[];
+  /**
+   * 是否支持多选
+   * @default false
+   */
+  multiple?: boolean;
+  /**
+   * 是否禁用
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否可以清空选项，只在单选时有效
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * 是否支持搜索
+   * @default false
+   */
+  filterable?: boolean;
+  /**
+   * 是否使用远程搜索
+   * @default false
+   */
+  remote?: boolean;
+  /**
+   * 远程搜索的方法
+   */
+  'remote-method'?: () => void;
+  /**
+   * 当前是否正在远程搜索
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 远程搜索中的文字提示
+   * @default 加载中
+   */
+  'loading-text'?: string;
+  /**
+   * 仅在 remote 模式下，初始化时使用。因为仅通过 value 无法得知选项的 label，需手动设置。默认值空
+   */
+  label?: string | number | string[] | number[];
+  /**
+   * 选择框大小，可选值为large、small、default或者不填
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 选择框默认文字
+   * @default 请选择
+   */
+  placeholder?: string;
+  /**
+   * 当下拉列表为空时显示的内容
+   * @default 无匹配数据
+   */
+  'not-found-text'?: string;
+  /**
+   * 在返回选项时，是否将 label 和 value 一并返回，默认只返回
+   * @default false
+   */
+  'label-in-value'?: boolean;
+  /**
+   * 弹窗的展开方向，可选值为 top、bottom、top-start、bottom-start、top-end、bottom-end
+   * @default bottom-start
+   */
+  placement?: 'bottom' | 'top' | 'top-start' | 'bottom-start' | 'top-end' | 'bottom-end';
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 给表单元素设置 id，详见 Form 用法。
+   */
+  'element-id'?: string;
+  /**
+   * 选中的Option变化时触发，默认返回 value，如需返回 label，详见 label-in-value 属性	当前选中项
+   */
+  $emit(eventName: 'on-change'): this;
+  /**
+   * 搜索词改变时触发,query
+   */
+  $emit(eventName: 'on-query-change', query: string): this;
+  /**
+   * 搜索词改变时触发,query
+   */
+  $emit(eventName: 'on-clear'): this;
+  /**
+   * 搜索词改变时触发,query
+   */
+  $emit(eventName: 'on-open-change', params: boolean): this;
+  /**
+   * 设置搜索词，为空时清空，仅在 filterable="true" 时有效
+   */
+  setQuery(query: string): void;
+  /**
+   * 清空单选项，仅在 clearable="true" 时有效
+   */
+  clearSingleSelect(): void;
+}
+
+export declare interface Option extends Vue {
+  /**
+   * 选项值，默认根据此属性值进行筛选，必填
+   */
+  value?: string | number;
+  /**
+   * 选项显示的内容，默认会读取 slot，无 slot 时，优先读取该 label 值，
+   * 无 label 时，读取 value。当选中时，选择器会显示 label 为已选文案。
+   * 大部分情况不需要配置此项，直接写入 slot 即可，在自定义选项时，该属性非常有用。
+   */
+  label?: string;
+  /**
+   * 是否禁用当前项
+   * @default false
+   */
+  disabled?: boolean;
+}
+
+export declare interface OptionGroup extends Vue {
+  /**
+   * 分组的组名
+   * @default 空
+   */
+  label?: string;
+}

dist/types/sider.d.ts

@@ -0,0 +1,8 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Sider extends Vue {
+}

dist/types/slider.d.ts

@@ -0,0 +1,70 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Slider extends Vue {
+  /**
+   * 滑块选定的值，可以使用 v-model 双向绑定数据。普通模式下，数据格式为数字，
+   * 在双滑块模式下，数据格式为长度是2的数组，且每项都为数字,
+   * @default 0
+   */
+  value?: number | number[];
+  /**
+   * 最小值
+   * @default 0
+   */
+  min?: number;
+  /**
+   * 最大值
+   * @default 100
+   */
+  max?: number;
+  /**
+   * 步长，取值建议能被（max - min）整除
+   * @default 1
+   */
+  step?: number;
+  /**
+   * 是否禁用滑块
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否开启双滑块模式
+   * @default false
+   */
+  range?: boolean;
+  /**
+   * 是否显示数字输入框，仅在单滑块模式下有效
+   * @default false
+   */
+  'show-input'?: boolean;
+  /**
+   * 是否显示间断点，建议在 step 不密集时使用
+   * @default false
+   */
+  'show-stops'?: boolean;
+  /**
+   * 提示的显示控制，可选值为 hover（悬停，默认）、always（总是可见）、never（不可见）
+   * @default false
+   */
+  'show-tip'?: boolean;
+  /**
+   * 会把当前值传给 tip-format，并在 Tooltip 中显示 tip-format 的返回值，若为 null，则隐藏 Tooltip
+   */
+  'tip-format'?: (value?: number | number[]) => void;
+  /**
+   * 数字输入框的尺寸，可选值为large、small、default或者不填，仅在开启 show-input 时有效
+   */
+  'input-size'?: '' | 'large' | 'small' | 'default';
+  /**
+   * 在松开滑动时触发，返回当前的选值，在滑动过程中不会触发
+   */
+  $emit(eventName: 'on-change', value: number | number[]): this;
+  /**
+   * 滑动条数据变化时触发，返回当前的选值，在滑动过程中实时触发
+   */
+  $emit(eventName: 'on-input', value: number | number[]): this;
+}

dist/types/spin.d.ts

@@ -0,0 +1,35 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Spin extends Vue {
+  /**
+   * Spin尺寸，可选值为large和small或者不设置
+   */
+  size?: 'large' | 'small';
+  /**
+   * 是否固定，需要父级有relative或absolute
+   * @default false
+   */
+  fix?: boolean;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义 Spin 的内容，设置slot后，默认的样式不生效
+     */
+    '': VNode[];
+  };
+}
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    /**
+     * 
+     */
+    $Spin: Spin;
+  }
+}

dist/types/split.d.ts

@@ -0,0 +1,68 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Split extends Vue {
+  /**
+   * 面板位置，可以是 0~1 代表百分比，或具体数值的像素，可用 v-model 双向绑定
+   * @default 0.5
+   */
+  value?: number | string;
+  /**
+   * 类型，可选值为 horizontal 或 vertical
+   * @default horizontal
+   */
+  mode?: 'horizontal' | 'vertical';
+  /**
+   * 最小阈值
+   * @default 40px
+   */
+  min?: number | string;
+  /**
+   * 最大阈值
+   * @default 40px
+   */
+  max?: number | string;
+  /**
+   * 拖拽开始	-
+   * @default false
+   */
+  $emit(eventName: 'on-move-start', []): this;
+  /**
+   * 拖拽中
+   */
+  $emit(eventName: 'on-moving', []): this;
+  /**
+   * 拖拽结束
+   * @default false
+   */
+  $emit(eventName: 'on-move-end', []): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * mode 为 horizontal 时可用，左边面板
+     * @default false
+     */
+    left: VNode[];
+    /**
+     * mode 为 horizontal 时可用，右边面板
+     */
+    right: VNode[];
+    /**
+     * mode 为 vertical 时可用，上边面板
+     */
+    top: VNode[];
+    /**
+     * mode 为 vertical 时可用，下边面板
+     */
+    bottom: VNode[];
+    /**
+     * 自定义分割拖拽节点
+     */
+    trigger: VNode[];
+  }
+}

dist/types/steps.d.ts

@@ -0,0 +1,48 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Steps extends Vue {
+  /**
+   * 当前步骤，从 0 开始计数
+   * @default 0
+   */
+  current?: number;
+  /**
+   * 当前步骤的状态，可选值为wait、process、finish、error
+   * @default process
+   */
+  status?: 'wait' | 'process' | 'finish' | 'error';
+  /**
+   * 步骤条的尺寸，可选值为small或者不写
+   */
+  size?: '' | 'small';
+  /**
+   * 步骤条的方向，可选值为horizontal（水平）或vertical（垂直）
+   * @default horizontal
+   */
+  direction?: 'horizontal' | 'vertical';
+}
+
+export declare interface StepsStep extends Vue {
+  /**
+   * 步骤的状态，可选值为wait、process、finish、error，不设置时自动判断
+   * @default process
+   */
+  status?: 'wait' | 'process' | 'finish' | 'error';
+  /**
+   * 标题
+   * @default 空
+   */
+  title?: string;
+  /**
+   * 步骤的详细描述，可选
+   */
+  content?: string;
+  /**
+   * 步骤的图标，可选
+   */
+  icon?: string;
+}

dist/types/switch.d.ts

@@ -0,0 +1,54 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Switch extends Vue {
+  /**
+   * 指定当前是否选中，可以使用 v-model 双向绑定数据
+   * @default false
+   */
+  value?: boolean;
+  /**
+   * 开关的尺寸，可选值为large、small、default或者不写。建议开关如果使用了2个汉字的文字，使用 large。
+   */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+   * 禁用开关
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default true
+   */
+  'true-value'?: string | number | boolean;
+  /**
+   * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+   * @default false
+   */
+  'false-value'?: string | number | boolean;
+  /**
+   * 加载中的开关
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 开关变化时触发，返回当前的状态
+   */
+  $emit(eventName: 'on-change', value: boolean): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义显示打开时的内容
+     */
+    open: VNode[];
+    /**
+     * 自定义显示关闭时的内容
+     */
+    close: VNode[];
+  };
+}

dist/types/table.d.ts

@@ -0,0 +1,419 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Table extends Vue {
+  /**
+   * 显示的结构化数据，其中，字段 cellClassName 用于设置任意单元格的样式名称，
+   * 因此数据不能使用该字段，详见示例特定样式。
+   * @default []
+   */
+  data?: object[];
+  /**
+   * 表格列的配置描述，具体项见后文
+   * @default []
+   */
+  columns?: object[];
+  /**
+   * 是否显示间隔斑马纹
+   * @default false
+   */
+  stripe?: boolean;
+  /**
+   * 是否显示纵向边框
+   * @default false
+   */
+  border?: boolean;
+  /**
+   * 是否显示表头
+   * @default true
+   */
+  'show-header'?: boolean;
+  /**
+   * 表格宽度，单位 px
+   * @default 自动
+   */
+  width?: number | string;
+  /**
+   * 表格高度，单位 px，设置后，如果表格内容大于此值，会固定表头
+   */
+  height?: number | string;
+  /**
+   * 表格是否加载中
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * 禁用鼠标悬停时的高亮
+   * @default false
+   */
+  'disabled-hover'?: boolean;
+  /**
+   * 是否支持高亮选中的行，即单选
+   * @default false
+   */
+  'highlight-row'?: boolean;
+  /**
+   * 行的 className 的回调方法，传入参数：
+   * row：当前行数据
+   * index：当前行的索引
+   */
+  'row-class-name'?: (row?: object, index?: number) => void;
+  /**
+   * 表格尺寸，可选值为 large、small、default 或者不填
+   */
+  size?: string;
+  /**
+   * 数据为空时显示的提示内容
+   * @default 暂无数据
+   */
+  'no-data-text'?: string;
+  /**
+   * 筛选数据为空时显示的提示内容
+   * @default 暂无筛选结果
+   */
+  'no-filtered-data-text'?: string;
+  /**
+   * 开启 highlight-row 后有效，当表格的当前行发生变化的时候会触发	
+   * currentRow：当前高亮行的数据
+   * oldCurrentRow：上一次高亮的数据
+   */
+  $emit(eventName: 'on-current-change', currentRow: object, oldCurrentRow: object): this;
+  /**
+   * 在多选模式下有效，选中某一项时触发	
+   * selection：已选项数据
+   * row：刚选择的项数据
+   */
+  $emit(eventName: 'on-select', selection: object[], row: object): this;
+  /**
+   * 在多选模式下有效，取消选中某一项时触发	
+   * selection：已选项数据
+   * row：取消选择的项数据
+   */
+  $emit(eventName: 'on-select-cancel', selection: object[], row: object): this;
+  /**
+   * 在多选模式下有效，点击全选时触发	
+   * selection：已选项数据
+   */
+  $emit(eventName: 'on-select-all', selection: object[]): this;
+  /**
+   * 在多选模式下有效，只要选中项发生变化时就会触发	
+   * selection：已选项数据
+   */
+  $emit(eventName: 'on-selection-change', selection: object[]): this;
+  /**
+   * 排序时有效，当点击排序时触发	
+   * column：当前列数据
+   * key：排序依据的指标
+   * order：排序的顺序，值为 asc 或 desc
+   */
+  $emit(eventName: 'on-sort-change', column?: object, key?: string, order?: 'asc' | 'desc'): this;
+  /**
+   * 筛选时有效，筛选条件发生变化时触发	当前列数据
+   */
+  $emit(eventName: 'on-filter-change', value: any): this;
+  /**
+   * 单击某一行时触发
+   * currentRow：当前行的数据
+   * index?: 当前行的索引
+   */
+  $emit(eventName: 'on-row-click', currentRow: object, index: number): this;
+  /**
+   * 双击某一行时触发	
+   * currentRow：当前行的数据
+   * index?: 当前行的索引
+   */
+  $emit(eventName: 'on-row-dblclick', currentRow: object, index: number): this;
+  /**
+   * 展开或收起某一行时触发	
+   * row：当前行的数据
+   * status：当前的状态
+   */
+  $emit(eventName: 'on-expand', row: object, status: string): this;
+  /**
+   * 导出数据
+   */
+  exportCsv(params: TableExportCsvParams): void;
+  /**
+   * 执行改变大小重绘table
+   */
+  handleResize(): void;
+  /**
+   * 清除高亮项，仅在开启 highlight-row 时可用
+   */
+  clearCurrentRow(): void;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 表头
+     */
+    header: VNode[];
+    /**
+     * 页脚
+     */
+    footer: VNode[];
+    /**
+     * 加载中
+     */
+    loading: VNode[];
+  };
+}
+
+export declare interface TableColumn {
+  /**
+   * 列类型，可选值为 index、selection、expand、html
+   */
+  type?: 'index' | 'selection' | 'expand' | 'html';
+  /**
+   * 列头显示文字
+   * @default #
+   */
+  title?: string;
+  /**
+   * 对应列内容的字段名
+   */
+  key?: string;
+  /**
+   * 列宽
+   */
+  width?: number;
+  /**
+   * 最小列宽
+   */
+  minWidth?: number;
+  /**
+   * 最大列宽
+   */
+  maxWidth?: number;
+  /**
+   * 对齐方式，可选值为 left 左对齐、right 右对齐和 center 居中对齐,默认 left
+   * @default left
+   */
+  align?: 'left' | 'right' | 'center';
+  /**
+   * 列的样式名称
+   */
+  className?: string;
+  /**
+   * 列是否固定在左侧或者右侧，可选值为 left 左侧和 right 右侧
+   */
+  fixed?: 'left' | 'right';
+  /**
+   * 开启后，文本将不换行，超出部分显示为省略号
+   * @default false
+   */
+  ellipsis?: boolean;
+  /**
+   * 开启后，文本将不换行，超出部分显示为省略号，并用 Tooltip 组件显示完整内容
+   * @default false
+   */
+  tooltip?: boolean;
+  /**
+   * 自定义渲染列，使用 Vue 的 Render 函数。
+   * 传入两个参数，第一个是 h，第二个为对象，包含 row、column 和 index，
+   * 分别指当前行数据，当前列数据，当前行索引，详见示例。
+   * 学习 Render 函数的内容 从 rc.18 版本开始，我们将不再支持旧的用法。旧的 render 函数已被废弃。
+   */
+  render?: (h?:
+    (
+      el?: string | object | Function,
+      data?: string | TableRenderCreateElementData | TableRenderCreateElementResult | Array<TableRenderCreateElementResult>,
+      vnode?: string | TableRenderCreateElementResult[]
+    ) => TableRenderCreateElementResult,
+    params?: TableColumnRenderParams
+  ) => TableRenderCreateElementResult;
+  /**
+   * 自定义列头显示内容，传入参数有两个，column 和 index，分别为当前列数据和当前列索引，不支持渲染自定义组件
+   */
+  renderHeader?: (h?:
+    (
+      el?: string | object | Function,
+      data?: string | TableRenderCreateElementData | TableRenderCreateElementResult | Array<TableRenderCreateElementResult>,
+      vnode?: string | TableRenderCreateElementResult[]
+    ) => TableRenderCreateElementResult,
+    params?: TableColumnRenderHeadParams
+  ) => TableRenderCreateElementResult;
+  /**
+   * 对应列是否可以排序，如果设置为 custom，则代表用户希望远程排序，
+   * 需要监听 Table 的 on- sort - change 事件,默认false
+   * @default false
+   */
+  sortable?: boolean;
+  /**
+   * 自定义排序使用的方法，接收三个参数 a 、 b 和 type，
+   * 当设置 sortable?: true 时有效。type 值为 asc 和 desc
+   */
+  sortMethod?: (a: any, b: any, type: 'asc' | 'desc') => void;
+  /**
+   * 设置初始化排序。值为 asc 和 desc
+   */
+  sortType?: 'asc' | 'desc';
+  /**
+   * 过滤数据的选项，格式为数组，数组中每项包含 label 和 value 属性，使用过滤，必须同时配置filterMethod
+   */
+  filters?: { label: string, value: string | number | boolean }[];
+  /**
+   * 数据过滤使用的方法，如果是多选的筛选项，对每一条数据会执行多次，任意一次返回 true 就会显示
+   */
+  filterMethod?: () => void;
+  /**
+   * 数据过滤的选项是否多选
+   * @default true
+   */
+  filterMultiple?: boolean;
+  /**
+   * 在初始化时使用过滤，数组，值为需要过滤的 value 集合
+   */
+  filteredValue?: (string | number | boolean)[];
+  /**
+   * 使用远程过滤
+   */
+  filterRemote?: () => void;
+  /**
+   * 表头分组
+   */
+  children?: object[];
+}
+
+export declare interface TableRenderCreateElementData {
+  /**
+   * 和`v-bind:class`一样的 API
+   */
+  'class'?: object;
+  /**
+   * 和`v-bind:style`一样的 API
+   */
+  style?: object;
+  /**
+   * 正常的 HTML 特性
+   */
+  attrs?: object,
+  /**
+   * 组件 props
+   */
+  props?: object;
+  /**
+   * DOM 属性
+   */
+  domProps?: object;
+  /**
+   * 事件监听器基于 "on"
+   * 所以不再支持如 v-on?:keyup.enter 修饰器
+   * 需要手动匹配 keyCode。
+   */
+  on?: object;
+  /**
+   * 仅对于组件，用于监听原生事件，而不是组件使用 vm.$emit 触发的事件。
+   */
+  nativeOn?: object;
+  /**
+   * 自定义指令. 注意事项：不能对绑定的旧值设值
+   * Vue 会为您持续追踨
+   */
+  directives?: object[];
+  /**
+   * 如果子组件有定义 slot 的名称
+   */
+  slot?: string;
+  /**
+   * 其他特殊顶层属性,myKey
+   */
+  key?: string;
+  /**
+   * myRef
+   */
+  ref?: string
+}
+
+export declare interface TableColumnRenderParams {
+  /**
+   * 当前行数据
+   */
+  row?: object;
+  /**
+   * 当前列数据
+   */
+  column?: object;
+  /**
+   * 当前行索引
+   */
+  index?: number;
+}
+
+export declare interface TableRenderCreateElementResult {
+  child?: object;
+  children?: Array<any>;
+  componentInstance?: object;
+  componentOptions?: object;
+  context?: object;
+  data?: object;
+  elm?: object;
+  functionalContext?: object;
+  isCloned?: boolean;
+  isComment?: boolean;
+  isOnce?: boolean;
+  isRootInsert?: boolean;
+  isStatic?: boolean;
+  key?: object;
+  ns?: object;
+  parent?: object;
+  raw?: boolean;
+  tag?: string;
+  text?: object;
+}
+
+export declare interface TableColumnRenderHeadParams {
+  /**
+   * 当前列数据
+   */
+  column?: object;
+  /**
+   * 当前行索引
+   */
+  index?: number;
+}
+
+export declare interface TableExportCsvParams {
+  /**
+   * 文件名，默认为 table.csv
+   */
+  filename?: string;
+  /**
+   * 是否导出为原始数据，默认为 true
+   */
+  original?: boolean;
+  /**
+   * 不显示表头，默认为 false
+   */
+  noHeader?: boolean;
+  /**
+   * 自定义导出的列数据
+   */
+  columns?: any[];
+  /**
+   * 自定义导出的行数据
+   */
+  data?: any[];
+  /**
+   * 添加此函数后，不会下载，而是返回数据
+   */
+  callback?: () => void;
+  /**
+   * 数据分隔符，默认是逗号(,)
+ * @default ,
+   */
+  separator?: string;
+  /**
+   * 每项数据是否加引号
+   * @default false
+   */
+  quoted?: boolean;
+}
+
+
+
+

dist/types/tabs.d.ts

@@ -0,0 +1,85 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Tabs extends Vue {
+  /**
+   * 当前激活 tab 面板的 name，可以使用 v-model 双向绑定数据
+   * @default 默认为第一项的 name
+   */
+  value?: string;
+  /**
+   * 页签的基本样式，可选值为 line 和 card
+   * @default line
+   */
+  type?: 'line' | 'card';
+  /**
+   * 尺寸，可选值为 default 和 small，仅在 type="line" 时有效
+   * @default default
+   */
+  size?: 'default' | 'small';
+  /**
+   * 是否可以关闭页签，仅在 type="card" 时有效
+   * @default false
+   */
+  closable?: boolean;
+  /**
+   * 是否使用 CSS3 动画
+   * @default true
+   */
+  animated?: boolean;
+  /**
+   * Tabs 内的表单类组件是否自动获得焦点
+   * @default false
+   */
+  'capture-focus'?: boolean;
+  /**
+   * 关闭前的函数，返回 Promise 可阻止标签关闭
+   */
+  'before-remove'?: (index: number) => {};
+  /**
+   * tab 被点击时触发
+   */
+  $emit(eventName: 'on-click', name: string): this;
+  /**
+   * tab 被关闭时触发
+   */
+  $emit(eventName: 'on-tab-remove', name: string): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 附加内容
+     */
+    extra: VNode[];
+  };
+}
+
+export declare interface TabsPane extends Vue {
+  /**
+   * 用于标识当前面板，对应 value，默认为其索引值
+   */
+  name?: string | number;
+  /**
+   * 选项卡头显示文字，支持 Render 函数。 
+   * @default 空
+   */
+  label?: string | (() => void);
+  /**
+   * 选项卡图标
+   */
+  icon?: string;
+  /**
+   * 是否禁用该选项卡
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否可以关闭页签，仅在 type="card" 时有效
+   * @default null
+   */
+  closable?: boolean;
+}

dist/types/tag.d.ts

@@ -0,0 +1,48 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Tag extends Vue {
+  /**
+   * 标签是否可以关闭
+   * @default false
+   */
+  closable?: boolean
+  /**
+   * 标签是否可以选择
+   * @default false
+   */
+  checkable?: boolean;
+  /**
+   * 标签的选中状态
+   * @default true
+   */
+  checked?: boolean;
+  /**
+   * 标签的样式类型，可选值为border、dot或不填
+   */
+  type?: '' | 'border' | 'dot';
+  /**
+   * 标签颜色，预设颜色值为
+   * default、primary、success、warning、error、blue、green、
+   * red、yellow、pink、magenta、volcano、orange、gold、
+   * lime、cyan、geekblue、purple
+   * 你也可以自定义颜色值。
+   */
+  color?: 'default' | 'primary' | 'success' | 'warning' | 'error' | 'blue' | 'green' | 'red' | 'yellow' | 'pink' | 'magenta' | 'volcano' | 'orange' | 'gold' | 'lime' | 'cyan' | 'geekblue' | 'purple';
+  /**
+   * 当前标签的名称，使用 v-for，并支持关闭时，会比较有用
+   */
+  name?: string | number;
+  /**
+   * 是否在出现和消失时使用渐变的动画，动画时长可能会引起占位的闪烁
+   * @default true
+   */
+  fade?: boolean;
+  /**
+   * 关闭时触发
+   */
+  $emit(eventName: 'on-close', event: object, name: string): this;
+}

dist/types/time-picker.d.ts

@@ -0,0 +1,169 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface TimePicker extends Vue {
+  /**
+   * 显示类型，可选值为 time、timerange
+   * @default time
+   */
+  type?: 'time' | 'timerange';
+  /**
+   * 时间，可以是 JavaScript 的 Date，例如 new Date()，也可以是标准的时间格式，点击右边查看
+   * 注意：value 使用 v-model 时，值是 Date 类型，可以配合 @on-change 使用
+   * 名称	  说明	                示例
+   * yyyy   年份（四位）	        2016
+   * yy	    年份（两位）	        16
+   * MM	    月份（两位）	        01
+   * M	    月份（一位）	        1
+   * MMMM   月份（英文）	        January
+   * MMM   月份（英文简写）	      Jan
+   * dd	    日期（两位）	        01
+   * d	    日期（一位）        	1
+   * Do	    日期（简写）        	1st
+   * DD	    星期（两位）        	00
+   * D	    星期（一位）        	0
+   * dddd   星期（英文）        	Monday
+   * ddd  	星期（英文简写）	     Mon
+   * HH	    小时（24小时制两位）   01
+   * H	    小时（24小时制一位）   1
+   * hh	    小时（12小时制两位）   01
+   * h	    小时（12小时制一位）   1
+   * mm	    分钟（两位）          01
+   * m	    分钟（一位）          1
+   * ss	    秒钟（两位）          01
+   * s	    秒钟（一位）          1
+   * SSS    毫秒（三位）          019
+   * SS     毫秒（两位）          01
+   * S	    毫秒（一位）          1
+   * A    	上午与下午（大写）	   AM/PM
+   * a	    上午与下午（小写）    am/pm
+   * ZZ     时区	+0800
+   */
+  value?: Date;
+  /**
+   * 展示的时间格式
+   * @default HH:mm:ss
+   * 名称	  说明	                示例
+   * yyyy   年份（四位）	        2016
+   * yy	    年份（两位）	        16
+   * MM	    月份（两位）	        01
+   * M	    月份（一位）	        1
+   * MMMM   月份（英文）	        January
+   * MMM   月份（英文简写）	      Jan
+   * dd	    日期（两位）	        01
+   * d	    日期（一位）        	1
+   * Do	    日期（简写）        	1st
+   * DD	    星期（两位）        	00
+   * D	    星期（一位）        	0
+   * dddd   星期（英文）        	Monday
+   * ddd  	星期（英文简写）	     Mon
+   * HH	    小时（24小时制两位）   01
+   * H	    小时（24小时制一位）   1
+   * hh	    小时（12小时制两位）   01
+   * h	    小时（12小时制一位）   1
+   * mm	    分钟（两位）          01
+   * m	    分钟（一位）          1
+   * ss	    秒钟（两位）          01
+   * s	    秒钟（一位）          1
+   * SSS    毫秒（三位）          019
+   * SS     毫秒（两位）          01
+   * S	    毫秒（一位）          1
+   * A    	上午与下午（大写）	   AM/PM
+   * a	    上午与下午（小写）    am/pm
+   * ZZ     时区	+0800
+   */
+  format?: string;
+  /**
+   * 下拉列表的时间间隔，数组的三项分别对应小时、分钟、秒。
+   * 例如设置为 [1, 15] 时，分钟会显示：00、15、30、45。
+   * @default []
+   */
+  steps?: any[];
+  /**
+   * 时间选择器出现的位置，可选值为
+   * top,top-start,top-end
+   * bottom,bottom-start,bottom-end
+   * left,left-start,left-end
+   * right,right-start,right-end
+   * @default bottom-start
+   */
+  placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+  /**
+   * 占位文本
+   * @default 空
+   */
+  placeholder?: string;
+  /**
+  * 是否显示底部控制栏
+   * @default false
+  */
+  confirm?: boolean;
+  /**
+  * 手动控制时间选择器的显示状态，true 为显示，false 为收起。
+  * 使用该属性后，选择器不会主动关闭。建议配合 slot 及 confirm 和相关事件一起使用,
+  * @default null
+  */
+  open?: boolean;
+  /**
+  * 尺寸，可选值为large、small、default或者不设置
+  */
+  size?: '' | 'large' | 'small' | 'default';
+  /**
+  * 是否禁用选择器
+   * @default false
+  */
+  disabled?: boolean;
+  /**
+  * 是否显示清除按钮
+   * @default true
+  */
+  clearable?: boolean;
+  /**
+  * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效
+   * @default false
+  */
+  readonly?: boolean;
+  /**
+  * 文本框是否可以输入，只在没有使用 slot 时有效
+   * @default true
+  */
+  editable?: boolean;
+  /**
+  * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+  建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+  */
+  transfer?: boolean;
+  /**
+  * 给表单元素设置 id，详见 Form 用法。
+  */
+  'element-id'?: boolean;
+  /**
+  * 时间发生变化时触发	已经格式化后的时间，比如 09:41:00
+  */
+  $emit(eventName: 'on-change', value: string): this;
+  /**
+  * 弹出浮层和关闭浮层时触发
+  */
+  $emit(eventName: 'on-open-change', value: boolean): this;
+  /**
+  * 点击确定按钮时触发
+  */
+  $emit(eventName: 'on-ok'): this;
+  /**
+  * 在清空日期时触发
+  */
+  $emit(eventName: 'on-clear'): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义选择器的显示内容，建议与 open 等参数一起使用，详见示例
+     */
+    '': VNode[];
+  };
+}

dist/types/time.ts

@@ -0,0 +1,27 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Time extends Vue {
+  /**
+   * 需要对比的时间，可以是时间戳或 Date 类型
+   */
+  time?: number |Date |string;
+  /**
+   * 类型，可选值为 relative、date 或 datetime
+   * @default relative
+   */
+  type?: 'relative'|'date'|'datetime';
+  /**
+   * 自动更新的间隔，单位：秒
+   * @default 60
+   */
+  interval?: number;
+  /**
+   * 填写该值，点击会定位锚点
+   * @default false
+   */
+  hash?: string;
+}

dist/types/timeline.d.ts

@@ -0,0 +1,34 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Timeline extends Vue {
+  /**
+   * 指定是否最后一个节点为幽灵节点
+   * @default false
+   */
+  pending?: boolean;
+}
+
+export declare interface TimelineItem extends Vue {
+  /**
+   * 圆圈颜色，可选值为blue、red、green，或自定义色值
+   * @default blue
+   */
+  color?: 'blue' | 'red' | 'green' | string;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 基本内容
+     */
+    '': VNode[];
+    /**
+     * 自定义时间轴点内容
+     */
+    dot: VNode[];
+  };
+}

dist/types/tooltip.d.ts

@@ -0,0 +1,91 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Tooltip extends Vue {
+  /**
+   * 显示的内容
+   * @default 空
+   */
+  content?: string | number;
+  /**
+   * 提示框出现的位置，可选值为
+   * top，top-start，top-end，bottom，bottom-start，bottom-end，
+   * left，left-start，left-end，right，right-start，right-end
+   * 2.12.0 版本开始支持自动识别
+   * @default bottom
+   */
+  placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+  /**
+   * 是否禁用提示框
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 延迟显示，单位毫秒
+   * @default 0
+   */
+  delay?: number;
+  /**
+   * 是否总是可见
+   * @default false
+   */
+  always?: boolean;
+  /**
+   * 主题，可选值为 dark 或 light
+   * @default dark
+   */
+  theme?: string;
+  /**
+   * 最大宽度，超出最大值后，文本将自动换行，并两端对齐
+   */
+  'max-width'?: string|number;
+  /**
+   * 出现位置的偏移量
+   * @default 0
+   */
+  offset?: number;
+  /**
+   * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，
+   * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+   * @default false
+   */
+  transfer?: boolean;
+  /**
+   * 出现位置的偏移量
+   * @default {
+        modifiers: {
+            computeStyle:{
+                gpuAcceleration: false,
+            },
+            preventOverflow :{
+                boundariesElement: 'window'
+            }
+        }
+      }
+   */
+  options?: object;
+  /**
+   * 在提示框显示时触发
+   */
+  $emit(eventName: 'on-popper-show'): this;
+  /**
+   * 在提示框消失时触发
+   */
+  $emit(eventName: 'on-popper-hide'): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 主体内容
+     */
+    '': VNode[];
+    /**
+     * 提示框的内容，定义此 slot 时，会覆盖 props content。
+     */
+    content: VNode[];
+  };
+}

dist/types/transfer.d.ts

@@ -0,0 +1,80 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Transfer extends Vue {
+  /**
+   * 数据源，其中的数据将会被渲染到左边一栏中，targetKeys 中指定的除外。
+   * @default []
+   */
+  data?: object[];
+  /**
+   * 显示在右侧框数据的key集合
+   * @default []
+   */
+  targetKeys?: string[];
+  /**
+   * 每行数据渲染函数，该函数的入参为 data 中的项	
+   * value?: 默认显示label，没有时显示key
+   */
+  'render-format'?: (value?: string) => void;
+  /**
+   * 设置哪些项应该被选中
+   * @default []
+   */
+  'selected-keys'?: string[];
+  /**
+   * 两个穿梭框的自定义样式
+   * @default {}
+   */
+  'list-style'?: object;
+  /**
+   * 标题集合，顺序从左至右	Array	
+   * @default ['源列表', '目的列表']
+   */
+  titles?: string[];
+  /**
+   * 操作文案集合，顺序从上至下
+   * @default []
+   */
+  operations?: object[];
+  /**
+   * 是否显示搜索框
+   * @default false
+   */
+  filterable?: object[];
+  /**
+   * 搜索框的占位
+   * @default 请输入搜索内容
+   */
+  'filter-placeholder'?: string;
+  /**
+   * 自定义搜索函数，入参为 data 和 query，data 为项，query 为当前输入的搜索词
+   * 默认搜索label
+   */
+  'filter-method'?: (value?: string) => void;
+  /**
+   * 当列表为空时显示的内容
+   * @default 列表为空
+   */
+  'not-found-text'?: string;
+  /**
+   * 选项在两栏之间转移时的回调函数
+   */
+  $emit(eventName: 'on-change', targetKeys: string[], direction: string, moveKeys: string[]): this;
+  /**
+   * 选项在两栏之间转移时的回调函数
+   */
+  $emit(eventName: 'on-selected-change', sourceSelectedKeys: string[], targetSelectedKeys: string[]): this;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义底部内容
+     */
+    '': VNode[];
+  };
+}

dist/types/tree.d.ts

@@ -0,0 +1,103 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Tree extends Vue {
+  /**
+   * 可嵌套的节点属性的数组，生成 tree 的数据
+   */
+  data?: TreeChild[];
+  /**
+   * 是否支持多选
+   * @default false
+   */
+  multiple?: boolean;
+  /**
+   * 是否显示多选框
+   * @default false
+   */
+  'show-checkbox'?: boolean;
+  /**
+   * 没有数据时的提示
+   * @default 暂无数据
+   */
+  'empty-text'?: string;
+  /**
+   * 异步加载数据的方法
+   */
+  'load-data'?: () => void;
+  /**
+   * 自定义渲染内容
+   */
+  render?: () => void;
+  /**
+   * 定义子节点键
+   * @default children
+   */
+  'children-key'?:string;
+  /**
+   * 点击树节点时触发
+   * @default 当前已选中的节点数组
+   */
+  $emit(eventName: 'on-select-change', value: TreeChild[]): this;
+  /**
+   * 点击复选框时触发
+   * @default  当前已勾选节点的数组
+   */
+  $emit(eventName: 'on-check-change', value: TreeChild[]): this;
+  /**
+   * 展开和收起子列表时触发
+   * @default  当前节点的数据
+   */
+  $emit(eventName: 'on-toggle-expand', value: TreeChild): this;
+  /**
+   * 获取被勾选的节点
+   */
+  getCheckedNodes(): void;
+  /**
+   * 获取被选中的节点
+   */
+  getSelectedNodes(): void;
+}
+
+export declare interface TreeChild extends Vue {
+  /**
+   * 标题
+   */
+  title?: string;
+  /**
+   * 是否展开直子节点
+   * @default false
+   */
+  expand?: boolean;
+  /**
+   * 禁掉响应
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 禁掉checkbox
+   * @default false
+   */
+  disableCheckbox?: boolean;
+  /**
+   * 是否选中子节点
+   * @default false
+   */
+  selected?: boolean;
+  /**
+   * 是否勾选(如果勾选，子节点也会全部勾选)
+   * @default false
+   */
+  checked?: boolean;
+  /**
+   * 子节点属性数组
+   */
+  children?: TreeChild[];
+  /**
+   * 自定义当前节点渲染内容，见示例
+   */
+  render(): void;
+}

dist/types/upload.d.ts

@@ -0,0 +1,130 @@
+// Type definitions for iview 3.1.0
+// Project: https://github.com/iview/iview
+// Definitions by: yangdan
+// Definitions: https://github.com/yangdan8/iview.git
+import Vue, { VNode } from 'vue';
+
+export declare interface Upload extends Vue {
+  /**
+   * 上传的地址，必填
+   */
+  action?: string;
+  /**
+   * 设置上传的请求头部
+   * @default {}
+   */
+  headers?: object;
+  /**
+   * 是否支持多选文件
+   * @default false
+   */
+  multiple?: boolean;
+  /**
+   * 是否支持粘贴上传文件
+   * @default false
+   */
+  paste?: boolean;
+  /**
+   * 上传时附带的额外参数
+   */
+  data?: object;
+  /**
+   * 上传的文件字段名
+   * @default file
+   */
+  name?: string;
+  /**
+   * 支持发送 cookie 凭证信息
+   * @default false
+   */
+  'with-credentials'?: boolean;
+  /**
+   * 是否显示已上传文件列表
+   * @default true
+   */
+  'show-upload-list'?: boolean;
+  /**
+   * 上传控件的类型，可选值为 select（点击选择），drag（支持拖拽）
+   * @default select
+   */
+  type?: 'select' | 'drag';
+  /**
+   * 接受上传的文件类型
+   */
+  accept?: string;
+  /**
+   * 支持的文件类型，与 accept 不同的是，
+   * format 是识别文件的后缀名，
+   * accept 为 input 标签原生的 accept 属性，
+   * 会在选择文件时过滤，可以两者结合使用，
+   * @default []
+   */
+  format?: string[];
+  /**
+   * 文件大小限制，单位 kb
+   */
+  'max-size'?: number;
+  /**
+   * 上传文件之前的钩子，参数为上传的文件，若返回 false 或者 Promise 则停止上传
+   */
+  'before-upload'?: Function;
+  /**
+   * 文件上传时的钩子，返回字段为 event, file, fileList
+   */
+  'on-progress'?: Function;
+  /**
+   * 文件上传成功时的钩子，返回字段为 response, file, fileList
+   */
+  'on-success'?: Function;
+  /**
+   * 文件上传失败时的钩子，返回字段为 error, file, fileList
+   */
+  'on-error'?: Function;
+  /**
+   * 点击已上传的文件链接时的钩子，返回字段为 file， 可以通过 file.response 拿到服务端返回数据
+   */
+  'on-preview'?: Function;
+  /**
+   * 文件列表移除文件时的钩子，返回字段为 file, fileList
+   */
+  'on-remove'?: Function;
+  /**
+   * 文件格式验证失败时的钩子，返回字段为 file, fileList
+   */
+  'on-format-error'?: Function;
+  /**
+   * 文件超出指定大小限制时的钩子，返回字段为 file, fileList
+   */
+  'on-exceeded-size'?: Function;
+  /**
+   * 默认已上传的文件列表，例如：
+   * [
+   *     {
+   *         name?: 'img1.jpg',
+   *         url?: 'http://www.xxx.com/img1.jpg'
+   *     },
+   *     {
+   *         name?: 'img2.jpg',
+   *         url?: 'http://www.xxx.com/img2.jpg'
+   *     }
+   * ]
+   */
+  'default-file-list'?: string[];
+  /**
+   * 清空已上传的文件列表
+   */
+  'clearFiles'(): void;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 触发上传组件的控件
+     */
+    '': VNode[];
+    /**
+     * 辅助提示内容
+     */
+    tip: VNode[];
+  };
+}

examples/app.vue

@@ -67,6 +67,7 @@ nav {
                 <li><router-link to="/divider">Divider</router-link></li>
                 <li><router-link to="/time">Time</router-link></li>
                 <li><router-link to="/cell">Cell</router-link></li>
+                <li><router-link to="/drawer">Drawer</router-link></li>
             </ul>
         </nav>
         <router-view></router-view>

examples/main.js

@@ -225,6 +225,10 @@ const router = new VueRouter({
         {
             path: '/cell',
             component: (resolve) => require(['./routers/cell.vue'], resolve)
+        },
+        {
+            path: '/drawer',
+            component: (resolve) => require(['./routers/drawer.vue'], resolve)
         }
     ]
 });

examples/routers/color-picker.vue

@@ -1,152 +1,17 @@
 <template>
     <div style="margin: 100px;">
-        {{color}}
-        <!--<Input placeholder="请输入..." size="large" style="width: 50px;"></Input>-->
-        <color-picker
-            v-model="color"
-            placement="bottom-start"
-            @on-change="c1"
-            @on-active-change="c2"></color-picker>
-        <Input value="hello" style="display: inline-block" />
-        <Date-picker
-            type="date"
-            placeholder="选择日期"
-            style="width: 200px"></Date-picker>
-        <color-picker
-            ref="xxx"
-            v-model="color"
-            :recommend="true"
-            format="rgb"
-            alpha
-            @on-change="onChange"
-            @on-active-change="onActiveChange"></color-picker>
-        <color-picker
-            v-model="color2"
-            :alpha="true"
-            :recommend="false"
-            format="hsv"></color-picker>
-        <!--<Date-picker type="date" placeholder="选择日期" style="width: 200px"></Date-picker>-->
-        <color-picker
-            v-model="color"
-            placement="bottom-start"
-            ></color-picker>
-        <Date-picker
-            type="date"
-            placeholder="选择日期"
-            style="width: 200px"></Date-picker>
-        <color-picker
-            ref="yyy"
-            :colors="colors"
-            v-model="color"
-            format="rgb"
-            alpha></color-picker>
-        <Button @click="setColor">set color</Button>
-
-        <br><br><br><br>
-        {{openState}}
-        <ColorPicker
-            v-model="color7"
-            :hue="false"
-            @on-open-change="onOpenChange"></ColorPicker>
-        <ColorPicker
-            v-model="color7"
-            :hue="false"
-            :hide-drop-down="hideDropDown"
-            @on-open-change="onOpenChange"></ColorPicker>
-
-        <br><br><br><br>
-        <ColorPicker
-            v-model="color7"
-            disabled></ColorPicker>
+        {{ color1 }}
+        <ColorPicker v-model="color1" />
+        <ColorPicker v-model="color2" :editable="false"/>
     </div>
 </template>
-
 <script>
-export default {
-    props: {},
-
-    data() {
+    export default {
+        data () {
             return {
-            color: 'rgba(12,34,255,.85)',
-            color2: '',
-            color7: '#19be6b',
-            openState: false,
-            colors: [
-                '#2d8cf0',
-                '#19be6b',
-                '#ff9900',
-                '#ed3f14',
-                '#00b5ff',
-                '#19c919',
-                '#f9e31c',
-                '#ea1a1a',
-                '#9b1dea',
-                '#00c2b1',
-                '#ac7a33',
-                '#1d35ea',
-                '#8bc34a',
-                '#f16b62',
-                '#ea4ca3',
-                '#0d94aa',
-                '#febd79',
-                '#5d4037',
-                '#00bcd4',
-                '#f06292',
-                '#cddc39',
-                '#607d8b',
-                '#000000',
-                '#ffffff',
-                '#2d8cf0',
-                '#19be6b',
-                '#ff9900',
-                '#ed3f14',
-                '#00b5ff',
-                '#19c919',
-                '#f9e31c',
-                '#ea1a1a',
-                '#9b1dea',
-                '#00c2b1',
-                '#ac7a33',
-                '#1d35ea',
-                '#8bc34a',
-                '#f16b62',
-                '#ea4ca3',
-                '#0d94aa',
-                '#febd79',
-                '#5d4037',
-            ],
-            hideDropDown: false,
+                color1: '#19be6b',
+                color2: ''
+            };
+        }
     };
-    },
-
-    computed: {},
-
-    mounted() {
-        setInterval(this.toggleShowHide, 2000);
-    },
-
-    methods: {
-        setColor() {
-            this.color = '#26bc77';
-        },
-        c1(d) {
-            console.log(d);
-        },
-        c2(d) {
-            console.log(d);
-        },
-        onOpenChange(state) {
-            this.openState = state;
-        },
-        onChange(d) {
-            console.log(d);
-        },
-        onActiveChange(d) {
-            console.log(d);
-        },
-        toggleShowHide() {
-            this.hideDropDown = !this.hideDropDown;
-        },
-    },
-};
 </script>

examples/routers/drawer.vue

@@ -0,0 +1,219 @@
+<template>
+    <div>
+        <Button @click="visible = true">show1</Button>
+        <Button @click="visible2 = true">show2</Button>
+        <Button @click="visible3 = true">show3</Button>
+
+        <div style="width: 500px;height:500px;background: green;position: relative;">
+
+        </div>
+
+        <Drawer v-model="visible" width="70" title="抽屉标题" :styles="styles" @on-close="handleClose">
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <Button @click="visible2 = true">show2</Button>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+        </Drawer>
+
+
+        <Drawer v-model="visible2" title="抽屉标题" placement="right">
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容22</p>
+        </Drawer>
+        <Drawer v-model="visible3" placement="left">
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容</p>
+            <p>一些内容22</p>
+        </Drawer>
+    </div>
+</template>
+
+<script>
+    export default {
+        data () {
+            return {
+                visible: false,
+                visible2: false,
+                visible3: false,
+                styles: {
+                    height: 'calc(100% - 55px)',
+                    paddingBottom: '53px',
+                },
+                ms: {
+                    backgroundColor: 'rgba(255,0,255,0.5)'
+                }
+            };
+        },
+        methods: {
+            handleClose () {
+                this.$Message.info('关闭了');
+            }
+        }
+    };
+</script>
+
+<style>
+body{
+    height: 2000px;
+}
+</style>

examples/routers/input-number.vue

@@ -54,7 +54,24 @@
         <InputNumber v-model="value3" style="width: 200px" placeholder="Enter something..."></InputNumber> -->
 
         
-        <InputNumber v-model="valueNull" style="width: 200px" :min='0' :max='10000'  :precision='2' ></InputNumber>
+        <InputNumber v-model="valueNull" style="width: 200px" :min='1' :max='10000'  :precision='2' ></InputNumber>
+        <InputNumber v-model="valueNull" style="width: 200px" ></InputNumber>
+        <div style="margin:10px 0px">
+            <InputNumber :activeChange="false" v-model="valueNull" style="width: 200px" :min='1' :max='10000'  :precision='2' ></InputNumber>
+            <InputNumber :activeChange="false" v-model="valueNull" style="width: 200px" ></InputNumber>
+        </div>
+        <div style="margin:10px 0px">
+            <InputNumber
+                :max="10000"
+                v-model="value9"
+                :formatter="value => `$ ${value}`.replace(/B(?=(d{3})+(?!d))/g, ',')"
+                :parser="value => value.replace(/\$s?|(,*)/g, '')"></InputNumber>
+            <InputNumber
+                :max="100"
+                v-model="value10"
+                :formatter="value => `${value}%`"
+                :parser="value => value.replace('%', '')"></InputNumber>
+        </div>
     </div>
 </template>
 <script>
@@ -68,16 +85,18 @@
                 formatter: (value) => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ','),
                 parser: (value) => value.replace(/\$\s?|(,*)/g, ''),
                 formatter2: (value) => `${value}%`,
-                parser2: (value) => value.replace('%', '')
-            }
+                parser2: (value) => value.replace('%', ''),
+                value9: 1000,
+                value10: 100
+            };
         },
         methods: {
             focus (e) {
-                e.target.select()
+                e.target.select();
             },
             change (v) {
-                console.log(v)
-            }
+                console.log(v);
             }
         }
+    };
 </script>

examples/routers/menu.vue

@@ -1,46 +1,45 @@
 <template>
-    <Menu active-name="1-2" :open-names="['1']">
-        <Submenu name="1">
-            <template slot="title">
-                <Icon type="ios-analytics"></Icon>
-                Navigation One
-            </template>
-            <MenuGroup title="Item 1">
-                <MenuItem name="1-1">我是菜单一</MenuItem>
-                <MenuItem name="1-2">我是菜单二</MenuItem>
-            </MenuGroup>
-            <MenuGroup title="Item 2">
-                <MenuItem name="1-3">我是菜单三</MenuItem>
-                <MenuItem name="1-4">我是菜单四</MenuItem>
-            </MenuGroup>
-        </Submenu>
-        <Submenu name="2">
-            <template slot="title">
-                <Icon type="ios-filing"></Icon>
-                Navigation Two
-            </template>
-            <MenuItem name="2-1">我是菜单五</MenuItem>
-            <MenuItem name="2-2">我是菜单六</MenuItem>
+    <Menu mode="horizontal" :theme="theme1" active-name="3-4" @on-select="hs">
+        <MenuItem name="1" to="/button" target="_blank">
+            <Icon type="ios-paper" />
+            内容管理
+        </MenuItem>
+        <MenuItem name="2">
+            <Icon type="ios-people" />
+            用户管理
+        </MenuItem>
         <Submenu name="3">
-                <template slot="title">Submenu</template>
-                <MenuItem name="3-1">我是菜单七</MenuItem>
-                <MenuItem name="3-2">我是菜单八</MenuItem>
-            </Submenu>
-        </Submenu>
-        <Submenu name="4">
             <template slot="title">
-                <Icon type="ios-gear"></Icon>
-                Navigation Three
+                <Icon type="ios-stats" />
+                统计分析
             </template>
-            <MenuItem name="4-1">Option 9</MenuItem>
-            <MenuItem name="4-2">Option 10</MenuItem>
-            <MenuItem name="4-3">Option 11</MenuItem>
-            <MenuItem name="4-4">Option 12</MenuItem>
+            <MenuGroup title="使用">
+                <MenuItem name="3-1">新增和启动</MenuItem>
+                <MenuItem name="3-2">活跃分析</MenuItem>
+                <MenuItem name="3-3">时段分析</MenuItem>
+            </MenuGroup>
+            <MenuGroup title="留存">
+                <MenuItem name="3-4">用户留存</MenuItem>
+                <MenuItem name="3-5">流失用户</MenuItem>
+            </MenuGroup>
         </Submenu>
+        <MenuItem name="4">
+            <Icon type="ios-construct" />
+            综合设置
+        </MenuItem>
     </Menu>
 </template>
 <script>
     export default {
-
+        data () {
+            return {
+                theme1: 'light'
+            }
+        },
+        methods: {
+            hs (n) {
+                console.log(n);
+            }
+        }
     }
 </script>

examples/routers/modal.vue

@@ -1,44 +1,150 @@
 <template>
     <div>
-        <Button @click="instance('info')">Info</Button>
-        <Button @click="instance('success')">Success</Button>
-        <Button @click="instance('warning')">Warning</Button>
-        <Button @click="instance('error')">Error</Button>
+        <Button type="primary" @click="modal1 = true">Display dialog box</Button>
+        <Modal
+                v-model="modal1"
+                title="Common Modal dialog box title"
+                @on-ok="ok"
+                @on-cancel="cancel">
+            <p>Content of dialog</p>
+            <p>Content of dialog</p>
+            <p>Content of dialog</p>
+            <Button @click="openMessage">Message</Button>
+            <Select v-model="model1" style="width:200px" :transfer="false">
+                <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+            </Select>
+            <Select v-model="model1" style="width:200px" :transfer="true">
+                <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+            </Select>
+            <Dropdown transfer>
+                <a href="javascript:void(0)">
+                    下拉菜单
+                    <Icon type="ios-arrow-down"></Icon>
+                </a>
+                <DropdownMenu slot="list">
+                    <DropdownItem>驴打滚</DropdownItem>
+                    <DropdownItem>炸酱面</DropdownItem>
+                    <DropdownItem disabled>豆汁儿</DropdownItem>
+                    <DropdownItem>冰糖葫芦</DropdownItem>
+                    <DropdownItem divided>北京烤鸭</DropdownItem>
+                </DropdownMenu>
+            </Dropdown>
+            <DatePicker type="date" placeholder="Select date" style="width: 200px" transfer></DatePicker>
+            <Cascader :data="data" v-model="value1" transfer></Cascader>
+            <Tooltip content="Here is the prompt text" transfer>
+                A balloon appears when the mouse passes over this text
+            </Tooltip>
+            <Poptip trigger="hover" title="Title" content="content" transfer>
+                <Button>Hover</Button>
+            </Poptip>
+            <Button type="primary" @click="handleSpinShow">整页显示，3秒后关闭</Button>
+        </Modal>
+        <Select v-model="model1" style="width:200px" :transfer="false">
+            <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+        </Select>
+        <Select v-model="model1" style="width:200px" :transfer="true">
+            <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+        </Select>
     </div>
 </template>
 <script>
     export default {
+        data () {
+            return {
+                modal1: false,
+                cityList: [
+                    {
+                        value: 'New York',
+                        label: 'New York'
+                    },
+                    {
+                        value: 'London',
+                        label: 'London'
+                    },
+                    {
+                        value: 'Sydney',
+                        label: 'Sydney'
+                    },
+                    {
+                        value: 'Ottawa',
+                        label: 'Ottawa'
+                    },
+                    {
+                        value: 'Paris',
+                        label: 'Paris'
+                    },
+                    {
+                        value: 'Canberra',
+                        label: 'Canberra'
+                    }
+                ],
+                model1: '',
+                value1: [],
+                data: [{
+                    value: 'beijing',
+                    label: '北京',
+                    children: [
+                        {
+                            value: 'gugong',
+                            label: '故宫'
+                        },
+                        {
+                            value: 'tiantan',
+                            label: '天坛'
+                        },
+                        {
+                            value: 'wangfujing',
+                            label: '王府井'
+                        }
+                    ]
+                }, {
+                    value: 'jiangsu',
+                    label: '江苏',
+                    children: [
+                        {
+                            value: 'nanjing',
+                            label: '南京',
+                            children: [
+                                {
+                                    value: 'fuzimiao',
+                                    label: '夫子庙',
+                                }
+                            ]
+                        },
+                        {
+                            value: 'suzhou',
+                            label: '苏州',
+                            children: [
+                                {
+                                    value: 'zhuozhengyuan',
+                                    label: '拙政园',
+                                },
+                                {
+                                    value: 'shizilin',
+                                    label: '狮子林',
+                                }
+                            ]
+                        }
+                    ],
+                }]
+            }
+        },
         methods: {
-            instance (type) {
-                const title = 'Title';
-                const content = '<p>Content of dialog</p><p>Content of dialog</p>';
-                switch (type) {
-                    case 'info':
-                        this.$Modal.info({
-                            title: title,
-                            content: content
+            ok () {
+//                this.$Message.info('Clicked ok');
+            },
+            cancel () {
+//                this.$Message.info('Clicked cancel');
+            },
+            openMessage () {
+                this.$Message.info({
+                    content: 'hello world',
+                    duration: 2
                 });
-                        break;
-                    case 'success':
-                        this.$Modal.success({
-                            title: title,
-                            content: content
-                        });
-                        break;
-                    case 'warning':
-                        this.$Modal.warning({
-                            title: title,
-                            content: content
-                        });
-                        break;
-                    case 'error':
-                        this.$Modal.error({
-                            title: title,
-                            content: content
-                        });
-                        break;
-                }
-            }
+            },
+            handleSpinShow () {
+                this.$Spin.show();
+            },
         }
     }
 </script>

examples/routers/tabs.vue

@@ -1,77 +1,5 @@
-<!--<template>-->
-    <!--<Tabs value="name1" :animated="false">-->
-        <!--<Tab-pane label="test" name="test">-->
-            <!--<Tabs type="card" v-bind:animated="true">-->
-                <!--<Tab-pane label="标签2一">标签2一的内容</Tab-pane>-->
-                <!--<Tab-pane label="标签2二">标签2二的内容</Tab-pane>-->
-                <!--<Tab-pane label="标签2三">标签2三的内容</Tab-pane>-->
-            <!--</Tabs>-->
-        <!--</Tab-pane>-->
-        <!--<Tab-pane :label="label1" name="name1">-->
-            <!--<Table :columns="columns1" :data="data1"></Table>-->
-        <!--</Tab-pane>-->
-        <!--<Tab-pane label="标签二" name="name2">-->
-            <!--<Table :columns="columns1" :data="data1"></Table>-->
-        <!--</Tab-pane>-->
-        <!--<Tab-pane label="标签三" name="name3">-->
-            <!--<Table :columns="columns1" :data="data1"></Table>-->
-        <!--</Tab-pane>-->
-    <!--</Tabs>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--label1: (h) => {-->
-                    <!--return h('div', [-->
-                        <!--h('span', '标签一'),-->
-                        <!--h('Button', 'button')-->
-                    <!--]);-->
-                <!--},-->
-                <!--columns1: [-->
-                    <!--{-->
-                        <!--title: '姓名',-->
-                        <!--key: 'name'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--title: '年龄',-->
-                        <!--key: 'age'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--title: '地址',-->
-                        <!--key: 'address'-->
-                    <!--}-->
-                <!--],-->
-                <!--data1: [-->
-                    <!--{-->
-                        <!--name: '王小明',-->
-                        <!--age: 18,-->
-                        <!--address: '北京市朝阳区芍药居'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--name: '张小刚',-->
-                        <!--age: 25,-->
-                        <!--address: '北京市海淀区西二旗'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--name: '李小红',-->
-                        <!--age: 30,-->
-                        <!--address: '上海市浦东新区世纪大道'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--name: '周小伟',-->
-                        <!--age: 26,-->
-                        <!--address: '深圳市南山区深南大道'-->
-                    <!--}-->
-                <!--]-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-
-<!-- <template>
-    <Tabs type="card" closable @on-tab-remove="handleTabRemove">
+<template>
+    <Tabs type="card" closable @on-tab-remove="handleTabRemove" :beforeRemove="handleBeforeRemove">
         <TabPane label="标签一" v-if="tab0">标签一的内容</TabPane>
         <TabPane label="标签二" v-if="tab1">标签二的内容</TabPane>
         <TabPane label="标签三" v-if="tab2">标签三的内容</TabPane>
@@ -89,129 +17,23 @@
         methods: {
             handleTabRemove (name) {
                 this['tab' + name] = false;
-            }
-        }
-    }
-</script> -->
-
-<!--<template>-->
-    <!--<div>-->
-    <!--<Button type="ghost" @click="toFirst" size="small">to first</Button>-->
-    <!--<Button type="ghost" @click="toLast" size="small">to last</Button>-->
-    <!--<Tabs type="card" :animated="animated"  v-model="activeTab">-->
-        <!--<TabPane v-for="tab in tabs" :key="tab" :label="'标签' + tab"  :name="tab+''" closable>标签{{ tab }}</TabPane>-->
-        <!--<div slot="extra">-->
-            <!--<Button type="ghost" @click="handleTabsAdd" size="small">增加</Button>-->
-        <!--</div>-->
-    <!--</Tabs>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--tabs: 2,-->
-                <!--activeTab:"2",-->
-                <!--animated:true-->
-            <!--}-->
-        <!--},-->
-        <!--methods: {-->
-            <!--handleTabsAdd () {-->
-                <!--this.tabs ++;-->
-                <!--this.activeTab = this.tabs + '';-->
-            <!--},-->
-            <!--toFirst () {-->
-                <!--this.activeTab = '1';-->
-            <!--},-->
-            <!--toLast () {-->
-                <!--this.activeTab = this.tabs+'';-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-<!--<template>-->
-    <!--<div>-->
-        <!--<Tabs type="card">-->
-            <!--<TabPane v-for="tab in tabs" :key="tab" :label="'标签' + tab">标签{{ tab }}</TabPane>-->
-        <!--</Tabs>-->
-        <!--<Button type="ghost" @click="handleTabsAdd" size="small">增加</Button>-->
-        <!--<Button type="ghost" @click="handleTabsMin" size="small">减少</Button>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--tabs: 2-->
-            <!--}-->
-        <!--},-->
-        <!--methods: {-->
-            <!--handleTabsAdd () {-->
-                <!--this.tabs ++;-->
-            <!--},-->
-            <!--handleTabsMin () {-->
-                <!--this.tabs &#45;&#45;;-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-<template>
-    <div>
-        <i-input></i-input>
-        <Button type="ghost" @click="handleTabsAdd" size="small" slot="extra">增加</Button>
-
-        <hr style="margin: 10px 0;">
-        <Tabs type="card">
-            <TabPane v-for="tab in tabs" :key="tab" :label="'Tab' + tab">
-                <div>
-                    <h3>Some text...</h3>
-                    <i-button>Some focusable content...{{ tab }}</i-button>
-                </div>
-            </TabPane>
-        </Tabs>
-        <Tabs type="card">
-            <TabPane label="标签一">标签一的内容</TabPane>
-            <TabPane label="标签二" disabled>标签二的内容</TabPane>
-            <TabPane label="标签三">标签三的内容</TabPane>
-        </Tabs>
-        <tabs v-model="name" type="card" @on-click="handleClick">
-            <tab-pane name="a" label="标签一">
-                <div>1</div>
-            </tab-pane>
-            <tab-pane name="b" label="标签二">
-                <div>2</div>
-            </tab-pane>
-            <tab-pane name="c" label="标签三">
-                <div>3</div>
-            </tab-pane>
-            <tab-pane name="d" label="标签四">
-                <div>4</div>
-            </tab-pane>
-            <tab-pane name="e" label="标签五">
-                <div>5</div>
-            </tab-pane>
-        </tabs>
-    </div>
-</template>
-<script>
-    export default {
-        data () {
-            return {
-                tabs: 2,
-                name: 'b',
-            }
             },
-        methods: {
-            handleTabsAdd () {
-                this.tabs ++;
+            handleBeforeRemove (index) {
+                console.log(index);
+
+                return new Promise((resolve, reject) => {
+                    this.$Modal.confirm({
+                        title: 'Title',
+                        content: '<p>Content of dialog</p><p>Content of dialog</p>',
+                        onOk: () => {
+                            resolve();
                         },
-            handleClick (name) {
-                console.log(name);
+                        onCancel: () => {
+                            reject();
+                        }
+                    });
+                });
             }
         }
     }
 </script>
-
-

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "iview",
-    "version": "2.14.1",
+    "version": "3.0.1",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {
@@ -2451,6 +2451,64 @@
             "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
             "dev": true
         },
+        "copy-webpack-plugin": {
+            "version": "4.5.2",
+            "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-4.5.2.tgz",
+            "integrity": "sha512-zmC33E8FFSq3AbflTvqvPvBo621H36Afsxlui91d+QyZxPIuXghfnTsa1CuqiAaCPgJoSUWfTFbKJnadZpKEbQ==",
+            "dev": true,
+            "requires": {
+                "cacache": "10.0.4",
+                "find-cache-dir": "1.0.0",
+                "globby": "7.1.1",
+                "is-glob": "4.0.0",
+                "loader-utils": "1.1.0",
+                "minimatch": "3.0.4",
+                "p-limit": "1.2.0",
+                "serialize-javascript": "1.5.0"
+            },
+            "dependencies": {
+                "globby": {
+                    "version": "7.1.1",
+                    "resolved": "https://registry.npmjs.org/globby/-/globby-7.1.1.tgz",
+                    "integrity": "sha1-+yzP+UAfhgCUXfral0QMypcrhoA=",
+                    "dev": true,
+                    "requires": {
+                        "array-union": "1.0.2",
+                        "dir-glob": "2.0.0",
+                        "glob": "7.1.2",
+                        "ignore": "3.3.8",
+                        "pify": "3.0.0",
+                        "slash": "1.0.0"
+                    }
+                },
+                "is-extglob": {
+                    "version": "2.1.1",
+                    "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+                    "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
+                    "dev": true
+                },
+                "is-glob": {
+                    "version": "4.0.0",
+                    "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.0.tgz",
+                    "integrity": "sha1-lSHHaEXMJhCoUgPd8ICpWML/q8A=",
+                    "dev": true,
+                    "requires": {
+                        "is-extglob": "2.1.1"
+                    }
+                },
+                "loader-utils": {
+                    "version": "1.1.0",
+                    "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+                    "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0=",
+                    "dev": true,
+                    "requires": {
+                        "big.js": "3.2.0",
+                        "emojis-list": "2.1.0",
+                        "json5": "0.5.1"
+                    }
+                }
+            }
+        },
         "core-js": {
             "version": "2.5.7",
             "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz",
@@ -3041,6 +3099,27 @@
                 "randombytes": "2.0.6"
             }
         },
+        "dir-glob": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-2.0.0.tgz",
+            "integrity": "sha512-37qirFDz8cA5fimp9feo43fSuRo2gHwaIn6dXL8Ber1dGwUosDrGZeCCXq57WnIqE4aQ+u3eQZzsk1yOzhdwag==",
+            "dev": true,
+            "requires": {
+                "arrify": "1.0.1",
+                "path-type": "3.0.0"
+            },
+            "dependencies": {
+                "path-type": {
+                    "version": "3.0.0",
+                    "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
+                    "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
+                    "dev": true,
+                    "requires": {
+                        "pify": "3.0.0"
+                    }
+                }
+            }
+        },
         "dns-equal": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "iview",
-    "version": "3.0.0",
+    "version": "3.1.1-rc.1",
     "title": "iView",
     "description": "A high quality UI components Library with Vue.js",
     "homepage": "http://www.iviewui.com",
@@ -14,9 +14,11 @@
         "framework"
     ],
     "main": "dist/iview.js",
+    "typings": "dist/types/index.d.ts",
     "files": [
         "dist",
-        "src"
+        "src",
+        "types"
     ],
     "scripts": {
         "dev": "webpack-dev-server --content-base test/ --open --inline --hot --compress --history-api-fallback --port 8081 --config build/webpack.dev.config.js",
@@ -111,7 +113,8 @@
         "vue-template-compiler": "^2.5.16",
         "webpack": "^3.11.0",
         "webpack-dev-server": "^2.11.1",
-        "webpack-merge": "^3.0.0"
+        "webpack-merge": "^3.0.0",
+        "copy-webpack-plugin": "^4.5.2"
     },
     "engines": {
         "node": ">=8.9.1",

src/components/auto-complete/auto-complete.vue

@@ -75,7 +75,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             icon: {

src/components/avatar/avatar.vue

@@ -26,7 +26,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             src: {

src/components/base/notification/notification.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="classes" :style="styles">
+    <div :class="classes" :style="wrapStyles">
         <Notice
             v-for="notice in notices"
             :key="notice.name"
@@ -21,6 +21,8 @@
 <script>
     import Notice from './notice.vue';
 
+    import { transferIndex, transferIncrease } from '../../../utils/transfer-queue';
+
     const prefixCls = 'ivu-notification';
     let seed = 0;
     const now = Date.now();
@@ -54,7 +56,8 @@
         },
         data () {
             return {
-                notices: []
+                notices: [],
+                tIndex: this.handleGetIndex()
             };
         },
         computed: {
@@ -65,6 +68,12 @@
                         [`${this.className}`]: !!this.className
                     }
                 ];
+            },
+            wrapStyles () {
+                let styles = Object.assign({}, this.styles);
+                styles['z-index'] = 1010 + this.tIndex;
+
+                return styles;
             }
         },
         methods: {
@@ -82,6 +91,7 @@
                 }, notice);
 
                 this.notices.push(_notice);
+                this.tIndex = this.handleGetIndex();
             },
             close (name) {
                 const notices = this.notices;
@@ -94,7 +104,11 @@
             },
             closeAll () {
                 this.notices = [];
-            }
+            },
+            handleGetIndex () {
+                transferIncrease();
+                return transferIndex;
+            },
         }
     };
 </script>

src/components/base/popper.js

@@ -60,6 +60,7 @@ export default {
         },
         visible(val) {
             if (val) {
+                if (this.handleIndexIncrease) this.handleIndexIncrease();  // just use for Poptip
                 this.updatePopper();
                 this.$emit('on-popper-show');
             } else {

src/components/button/button-group.vue

@@ -16,7 +16,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             shape: {

src/components/button/button.vue

@@ -51,7 +51,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             loading: Boolean,

src/components/cascader/cascader.vue

@@ -26,6 +26,7 @@
                 :class="{ [prefixCls + '-transfer']: transfer }"
                 ref="drop"
                 :data-transfer="transfer"
+                :transfer="transfer"
                 v-transfer-dom>
                 <div>
                     <Caspanel
@@ -100,7 +101,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             trigger: {
@@ -132,7 +133,7 @@
             transfer: {
                 type: Boolean,
                 default () {
-                    return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
+                    return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
                 }
             },
             name: {

src/components/checkbox/checkbox-group.vue

@@ -24,7 +24,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             }
         },

src/components/checkbox/checkbox.vue

@@ -65,7 +65,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             name: {

src/components/color-picker/color-picker.vue

@@ -40,6 +40,7 @@
                 ref="drop"
                 :placement="placement"
                 :data-transfer="transfer"
+                :transfer="transfer"
                 :class="dropClasses"
             >
                 <transition name="fade">
@@ -82,7 +83,12 @@
                                 @picker-color="handleSelectColor"></recommend-colors>
                         </div>
                         <div :class="[prefixCls + '-confirm']">
-                            <span :class="[prefixCls + '-confirm-color']">{{formatColor}}</span>
+                            <span :class="confirmColorClasses">
+                                <template v-if="editable">
+                                    <i-input :value="formatColor" size="small" @on-enter="handleEditColor" @on-blur="handleEditColor"></i-input>
+                                </template>
+                                <template v-else>{{formatColor}}</template>
+                            </span>
                             <i-button
                                 ref="clear"
                                 :tabindex="0"
@@ -118,6 +124,8 @@ import RecommendColors from './recommend-colors.vue';
 import Saturation from './saturation.vue';
 import Hue from './hue.vue';
 import Alpha from './alpha.vue';
+import iInput from '../input/input.vue';
+import iButton from '../button/button.vue';
 import Locale from '../../mixins/locale';
 import {oneOf} from '../../utils/assist';
 import Emitter from '../../mixins/emitter';
@@ -127,7 +135,7 @@ import {changeColor, toRGBAString} from './utils';
 export default {
     name: 'ColorPicker',
 
-    components: {Drop, RecommendColors, Saturation, Hue, Alpha},
+    components: {Drop, RecommendColors, Saturation, Hue, Alpha, iInput, iButton},
 
     directives: {clickOutside, TransferDom},
 
@@ -172,7 +180,7 @@ export default {
                 return oneOf(value, ['small', 'large', 'default']);
             },
             default () {
-                return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
             }
         },
         hideDropDown: {
@@ -202,13 +210,17 @@ export default {
         transfer: {
             type: Boolean,
             default () {
-                return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
+                return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
             }
         },
         name: {
             type: String,
             default: undefined,
         },
+        editable: {
+            type: Boolean,
+            default: true
+        },
     },
 
     data() {
@@ -334,6 +346,14 @@ export default {
 
             return saturationColors.hex;
         },
+        confirmColorClasses () {
+            return [
+                `${this.prefixCls}-confirm-color`,
+                {
+                    [`${this.prefixCls}-confirm-color-editable`]: this.editable
+                }
+            ];
+        }
     },
 
     watch: {
@@ -419,6 +439,10 @@ export default {
             this.val = changeColor(color);
             this.$emit('on-active-change', this.formatColor);
         },
+        handleEditColor (event) {
+            const value = event.target.value;
+            this.handleSelectColor(value);
+        },
         handleFirstTab(event) {
             if (event.shiftKey) {
                 event.preventDefault();

src/components/date-picker/base/date-table.vue

@@ -74,6 +74,9 @@
                 const disabledTestFn = typeof this.disabledDate === 'function' && this.disabledDate;
 
                 return this.calendar(tableYear, tableMonth, (cell) => {
+                    // normalize date offset from the dates provided by jsCalendar
+                    if (cell.date instanceof Date) cell.date.setTime(cell.date.getTime() + cell.date.getTimezoneOffset() * 60000);
+
                     const time = cell.date && clearHours(cell.date);
                     const dateIsInCurrentMonth = cell.date && tableMonth === cell.date.getMonth();
                     return {

src/components/date-picker/panel/Date/date-range.vue

@@ -260,8 +260,8 @@
             },
             setPanelDates(leftPanelDate){
                 this.leftPanelDate = leftPanelDate;
-                const rightPanelDate = new Date(leftPanelDate.getFullYear(), leftPanelDate.getMonth() + 1, leftPanelDate.getDate());
-                this.rightPanelDate = this.splitPanels ? new Date(Math.max(this.dates[1], rightPanelDate)) : rightPanelDate;
+                const rightPanelDate = new Date(leftPanelDate.getFullYear(), leftPanelDate.getMonth() + 1, 1);
+                this.rightPanelDate = this.splitPanels ? new Date(Math.max(this.dates[1].getTime(), rightPanelDate.getTime())) : rightPanelDate;
             },
             panelLabelConfig (direction) {
                 const locale = this.t('i.locale');
@@ -312,9 +312,18 @@
                 } else {
                     // keep the panels together
                     const otherPanel = panel === 'left' ? 'right' : 'left';
-                    const otherCurrent = new Date(this[`${otherPanel}PanelDate`]);
-                    otherCurrent[`set${type}`](otherCurrent[`get${type}`]() + increment);
-                    this[`${otherPanel}PanelDate`] = otherCurrent;
+                    const currentDate = this[`${otherPanel}PanelDate`];
+                    const temp = new Date(currentDate);
+
+                    if (type === 'Month') {
+                        const nextMonthLastDate = new Date(
+                            temp.getFullYear(), temp.getMonth() + increment + 1, 0
+                        ).getDate();
+                        temp.setDate(Math.min(nextMonthLastDate, temp.getDate()));
+                    }
+
+                    temp[`set${type}`](temp[`get${type}`]() + increment);
+                    this[`${otherPanel}PanelDate`] = temp;
                 }
             },
             showYearPicker (panel) {

src/components/date-picker/panel/Date/date.vue

@@ -150,7 +150,8 @@
         watch: {
             value (newVal) {
                 this.dates = newVal;
-                this.panelDate = this.startDate || (this.multiple ? this.dates[this.dates.length - 1] : this.dates[0]) || new Date();
+                const panelDate = this.multiple ? this.dates[this.dates.length - 1] : (this.startDate || this.dates[0]);
+                this.panelDate = panelDate || new Date();
             },
             currentView (currentView) {
                 this.$emit('on-selection-mode-change', currentView);
@@ -170,7 +171,7 @@
                 const isDifferentYear = date.getFullYear() !== this.panelDate.getFullYear();
                 const isDifferentMonth = isDifferentYear || date.getMonth() !== this.panelDate.getMonth();
                 if (isDifferentYear || isDifferentMonth){
-                    this.panelDate = date;
+                    if (!this.multiple) this.panelDate = date;
                 }
             }
         },

src/components/date-picker/picker.vue

@@ -39,6 +39,7 @@
                 :placement="placement"
                 ref="drop"
                 :data-transfer="transfer"
+                :transfer="transfer"
                 v-transfer-dom>
                 <div>
                     <component
@@ -173,7 +174,7 @@
                     return oneOf(value, ['small', 'large', 'default']);
                 },
                 default () {
-                    return this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
+                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                 }
             },
             placeholder: {
@@ -189,7 +190,7 @@
             transfer: {
                 type: Boolean,
                 default () {
-                    return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
+                    return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
                 }
             },
             name: {
@@ -318,7 +319,9 @@
                 if (this.readonly) return;
                 this.isFocused = true;
                 if (e && e.type === 'focus') return; // just focus, don't open yet
+                if(!this.disabled){
                     this.visible = true;
+                }
             },
             handleBlur (e) {
                 if (this.internalFocus){
@@ -653,6 +656,7 @@
                     const timeStamps = allDates.map(date => date.getTime()).filter((ts, i, arr) => arr.indexOf(ts) === i && i !== indexOfPickedDate); // filter away duplicates
                     this.internalValue = timeStamps.map(ts => new Date(ts));
                 } else {
+                    dates = this.parseDate(dates);
                     this.internalValue = Array.isArray(dates) ? dates : [dates];
                 }
 

src/components/date-picker/util.js

@@ -174,7 +174,10 @@ const RANGE_PARSER = function(text, format) {
         const range1 = array[0];
         const range2 = array[1];
 
-        return [parseDate(range1, format), parseDate(range2, format)];
+        return [
+            range1 instanceof Date ? range1 : parseDate(range1, format),
+            range2 instanceof Date ? range2 : parseDate(range2, format),
+        ];
     }
     return [];
 };

src/components/drawer/drawer.vue

@@ -0,0 +1,223 @@
+<template>
+    <div v-transfer-dom :data-transfer="transfer">
+        <transition name="fade">
+            <div :class="maskClasses" :style="maskStyle" v-show="visible" v-if="mask" @click="handleMask"></div>
+        </transition>
+        <div :class="wrapClasses" @click="handleWrapClick">
+            <transition :name="'move-' + placement">
+                <div :class="classes" :style="mainStyles" v-show="visible">
+                    <div :class="contentClasses" ref="content">
+                        <a class="ivu-drawer-close" v-if="closable" @click="close">
+                            <slot name="close">
+                                <Icon type="ios-close"></Icon>
+                            </slot>
+                        </a>
+                        <div :class="[prefixCls + '-header']" v-if="showHead"><slot name="header"><div :class="[prefixCls + '-header-inner']">{{ title }}</div></slot></div>
+                        <div :class="[prefixCls + '-body']" :style="styles"><slot></slot></div>
+                    </div>
+                </div>
+            </transition>
+        </div>
+    </div>
+</template>
+<script>
+    import Icon from '../icon';
+    import { oneOf } from '../../utils/assist';
+    import TransferDom from '../../directives/transfer-dom';
+    import Emitter from '../../mixins/emitter';
+    import ScrollbarMixins from '../modal/mixins-scrollbar';
+
+    const prefixCls = 'ivu-drawer';
+
+    export default {
+        name: 'Drawer',
+        mixins: [ Emitter, ScrollbarMixins ],
+        components: { Icon },
+        directives: { TransferDom },
+        props: {
+            value: {
+                type: Boolean,
+                default: false
+            },
+            title: {
+                type: String
+            },
+            width: {
+                type: [Number, String],
+                default: 256
+            },
+            closable: {
+                type: Boolean,
+                default: true
+            },
+            maskClosable: {
+                type: Boolean,
+                default: true
+            },
+            mask: {
+                type: Boolean,
+                default: true
+            },
+            maskStyle: {
+                type: Object
+            },
+            styles: {
+                type: Object
+            },
+            scrollable: {
+                type: Boolean,
+                default: false
+            },
+            placement: {
+                validator (value) {
+                    return oneOf(value, ['left', 'right']);
+                },
+                default: 'right'
+            },
+            zIndex: {
+                type: Number,
+                default: 1000
+            },
+            transfer: {
+                type: Boolean,
+                default () {
+                    return !this.$IVIEW || this.$IVIEW.transfer === '' ? true : this.$IVIEW.transfer;
+                }
+            },
+            className: {
+                type: String
+            },
+            inner: {
+                type: Boolean,
+                default: false
+            }
+        },
+        data () {
+            return {
+                prefixCls: prefixCls,
+                visible: this.value,
+                wrapShow: false,
+                showHead: true,
+            };
+        },
+        computed: {
+            wrapClasses () {
+                return [
+                    `${prefixCls}-wrap`,
+                    {
+                        [`${prefixCls}-hidden`]: !this.wrapShow,
+                        [`${this.className}`]: !!this.className,
+                        [`${prefixCls}-no-mask`]: !this.mask,
+                        [`${prefixCls}-wrap-inner`]: this.inner
+                    }
+                ];
+            },
+            mainStyles () {
+                let style = {};
+
+                const width = parseInt(this.width);
+
+                const styleWidth = {
+                    width: width <= 100 ? `${width}%` : `${width}px`
+                };
+
+                Object.assign(style, styleWidth);
+
+                return style;
+            },
+            contentClasses () {
+                return [
+                    `${prefixCls}-content`,
+                    {
+                        [`${prefixCls}-content-no-mask`]: !this.mask
+                    }
+                ];
+            },
+            classes () {
+                return [
+                    `${prefixCls}`,
+                    `${prefixCls}-${this.placement}`,
+                    {
+                        [`${prefixCls}-no-header`]: !this.showHead,
+                        [`${prefixCls}-inner`]: this.inner
+                    }
+                ];
+            },
+            maskClasses () {
+                return [
+                    `${prefixCls}-mask`,
+                    {
+                        [`${prefixCls}-mask-inner`]: this.inner
+                    }
+                ];
+            }
+        },
+        methods: {
+            close () {
+                this.visible = false;
+                this.$emit('input', false);
+                this.$emit('on-close');
+            },
+            handleMask () {
+                if (this.maskClosable && this.mask) {
+                    this.close();
+                }
+            },
+            handleWrapClick (event) {
+                // use indexOf,do not use === ,because ivu-modal-wrap can have other custom className
+                const className = event.target.getAttribute('class');
+                if (className && className.indexOf(`${prefixCls}-wrap`) > -1) this.handleMask();
+            },
+        },
+        mounted () {
+            if (this.visible) {
+                this.wrapShow = true;
+            }
+
+            let showHead = true;
+
+            if (this.$slots.header === undefined && !this.title) {
+                showHead = false;
+            }
+
+            this.showHead = showHead;
+        },
+        beforeDestroy () {
+            this.removeScrollEffect();
+        },
+        watch: {
+            value (val) {
+                this.visible = val;
+            },
+            visible (val) {
+                if (val === false) {
+                    this.timer = setTimeout(() => {
+                        this.wrapShow = false;
+                        this.removeScrollEffect();
+                    }, 300);
+                } else {
+                    if (this.timer) clearTimeout(this.timer);
+                    this.wrapShow = true;
+                    if (!this.scrollable) {
+                        this.addScrollEffect();
+                    }
+                }
+                this.broadcast('Table', 'on-visible-change', val);
+                this.broadcast('Slider', 'on-visible-change', val);  // #2852
+                this.$emit('on-visible-change', val);
+            },
+            scrollable (val) {
+                if (!val) {
+                    this.addScrollEffect();
+                } else {
+                    this.removeScrollEffect();
+                }
+            },
+            title (val) {
+                if (this.$slots.header === undefined) {
+                    this.showHead = !!val;
+                }
+            }
+        }
+    };
+</script>

src/components/drawer/index.js

@@ -0,0 +1,3 @@
+import Drawer from './drawer.vue';
+
+export default Drawer;

src/components/dropdown/dropdown.vue

@@ -14,6 +14,7 @@
                 @mouseenter.native="handleMouseenter"
                 @mouseleave.native="handleMouseleave"
                 :data-transfer="transfer"
+                :transfer="transfer"
                 v-transfer-dom><slot name="list"></slot></Drop>
         </transition>
     </div>
@@ -50,7 +51,7 @@
             transfer: {
                 type: Boolean,
                 default () {
-                    return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
+                    return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
                 }
             }
         },

src/components/form/form-item.vue

@@ -90,6 +90,9 @@
             },
             validateStatus (val) {
                 this.validateState = val;
+            },
+            rules (){
+                this.setRules();
             }
         },
         inject: ['form'],
@@ -127,22 +130,36 @@
             },
             labelStyles () {
                 let style = {};
-                const labelWidth = this.labelWidth || this.form.labelWidth;
-                if (labelWidth) {
+                const labelWidth = this.labelWidth === 0 || this.labelWidth ? this.labelWidth : this.form.labelWidth;
+
+                if (labelWidth || labelWidth === 0) {
                     style.width = `${labelWidth}px`;
                 }
                 return style;
             },
             contentStyles () {
                 let style = {};
-                const labelWidth = this.labelWidth || this.form.labelWidth;
-                if (labelWidth) {
+                const labelWidth = this.labelWidth === 0 || this.labelWidth ? this.labelWidth : this.form.labelWidth;
+
+                if (labelWidth || labelWidth === 0) {
                     style.marginLeft = `${labelWidth}px`;
                 }
                 return style;
             }
         },
         methods: {
+            setRules() {
+                let rules = this.getRules();
+                if (rules.length) {
+                    rules.every((rule) => {
+                        this.isRequired = rule.required;
+                    });
+                    this.$off('on-form-blur', this.onFieldBlur);
+                    this.$off('on-form-change', this.onFieldChange);
+                    this.$on('on-form-blur', this.onFieldBlur);
+                    this.$on('on-form-change', this.onFieldChange);
+                }
+            },
             getRules () {
                 let formRules = this.form.rules;
                 const selfRules = this.rules;
@@ -229,18 +246,7 @@
                     value: this.fieldValue
                 });
 
-                let rules = this.getRules();
-
-                if (rules.length) {
-                    rules.every(rule => {
-                        if (rule.required) {
-                            this.isRequired = true;
-                            return false;
-                        }
-                    });
-                    this.$on('on-form-blur', this.onFieldBlur);
-                    this.$on('on-form-change', this.onFieldChange);
-                }
+                this.setRules();
             }
         },
         beforeDestroy () {