diff --git a/components/input-number/demo/basic.md b/components/input-number/demo/basic.md
new file mode 100644
index 0000000000000000000000000000000000000000..c4c68ae72943628e00586c9c169b41ad17e8b2ef
--- /dev/null
+++ b/components/input-number/demo/basic.md
@@ -0,0 +1,20 @@
+# 基本
+
+- order: 0
+
+数字输入框
+
+---
+
+````jsx
+var InputNumber = antd.InputNumber;
+
+function onChange(v){
+ console.log('changed',v);
+}
+
+React.render(
+
+, document.getElementById('components-inputnumber-demo-basic'));
+````
+
diff --git a/components/input-number/index.jsx b/components/input-number/index.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..de1f043bf6d54486798cacde002ff903ea637855
--- /dev/null
+++ b/components/input-number/index.jsx
@@ -0,0 +1,15 @@
+var InputNumber = require('rc-input-number');
+var React = require('react');
+
+var AntInputNumber = React.createClass({
+ getDefaultProps() {
+ return {
+ prefixCls: 'ant-input-number'
+ };
+ },
+ render() {
+ return ;
+ }
+});
+
+module.exports = AntInputNumber;
diff --git a/components/input-number/index.md b/components/input-number/index.md
new file mode 100644
index 0000000000000000000000000000000000000000..0301a843ebbc88d118f4c0ac4897af883d23a797
--- /dev/null
+++ b/components/input-number/index.md
@@ -0,0 +1,26 @@
+# InputNumber
+
+- category: Components
+- chinese: 数字输入框
+
+---
+
+通过鼠标或键盘,输入范围内的数值。
+
+## 何时使用
+
+- 当需要获取标准数值时。
+
+## API
+
+属性如下
+
+| 成员 | 说明 | 类型 | 默认值 |
+|-------------|----------------|--------------------|--------------|
+| min | 最小值 | Number | -Infinity |
+| max | 最大值 | Number | Infinity |
+| value | 当前值 | Number | |
+| defaultValue | 初始值 | Number | |
+| onChange | 变化回调 | Function | |
+| disabled | 禁用 | Boolean | |
+| style | 根节点样式 | Object |
\ No newline at end of file
diff --git a/components/inputNumber/index.jsx b/components/inputNumber/index.jsx
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/components/inputNumber/index.md b/components/inputNumber/index.md
deleted file mode 100644
index 0eb9790d89134e4ff4f326478f73e51a66967be9..0000000000000000000000000000000000000000
--- a/components/inputNumber/index.md
+++ /dev/null
@@ -1,12 +0,0 @@
-# InputNumber
-
-- category: Components
-- chinese: 数字输入框
-
----
-
-通过鼠标或键盘,输入范围内的数值。
-
-## 何时使用
-
-- 当需要获取标准数值时。
diff --git a/index.js b/index.js
index c6869ef5d2cf273a362d6088e207e0393bfdfac4..d9fa5516c6f7d00e33d2f816e5078d14701c7f08 100644
--- a/index.js
+++ b/index.js
@@ -12,7 +12,8 @@ var antd = {
Select: require('./components/select'),
Popconfirm: require('./components/popconfirm'),
confirm: require('./components/modal/confirm'),
- Steps: require('./components/steps')
+ Steps: require('./components/steps'),
+ InputNumber: require('./components/input-number')
};
module.exports = window.antd = antd;
diff --git a/package.json b/package.json
index 118e4fda326396674416d8d2f75de0eef37e2374..12af22a387871edc3640169a7675d998f4b02155 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
"rc-calendar": "~3.9.0",
"rc-dialog": "~4.3.5",
"rc-dropdown": "~1.1.1",
+ "rc-input-number": "~2.0.0",
"rc-menu": "~3.4.0",
"rc-progress": "~1.0.0",
"rc-select": "~4.0.0",
diff --git a/site/templates/layout.html b/site/templates/layout.html
index ea3b3e2a83d3b8691c6d017a478f061ff631c368..68d6a80b55e3bcb376522aa01d0ef2bf89763dc2 100644
--- a/site/templates/layout.html
+++ b/site/templates/layout.html
@@ -13,7 +13,7 @@
{% block styles %}{% endblock %}
-
+
{% block scripts %}{% endblock %}
diff --git a/style/components/index.less b/style/components/index.less
index f92e210bc3a02d3e5babb1b37b1e85de83d57064..f59b92499a7293f63b32428bb73601d4d98f5652 100644
--- a/style/components/index.less
+++ b/style/components/index.less
@@ -11,4 +11,5 @@
@import "form";
@import "loading";
@import "progress";
-@import "steps";
\ No newline at end of file
+@import "steps";
+@import "inputNumber";
\ No newline at end of file
diff --git a/style/components/inputNumber.less b/style/components/inputNumber.less
new file mode 100644
index 0000000000000000000000000000000000000000..8a13d9f2249cdb882852e39b7b88adc31b63b6e3
--- /dev/null
+++ b/style/components/inputNumber.less
@@ -0,0 +1,115 @@
+@inputNumberPrefixCls: ant-input-number;
+
+@import "../mixins/iconfont";
+
+.@{inputNumberPrefixCls} {
+ margin: 0;
+ padding: 0;
+ line-height: 26px;
+ font-size: 12px;
+ height: 26px;
+ display: inline-block;
+ vertical-align: middle;
+ border: 1px solid #D9D9D9;
+ border-radius: 5px;
+
+ &-handler {
+ text-align: center;
+ line-height: 12px;
+ height: 12px;
+ overflow: hidden;
+ }
+
+ &-handler-up-inner, &-handler-down-inner {
+ color: #666666;
+ user-select: none;
+ -webkit-user-select: none;
+ }
+
+ &:hover {
+ border-color: #23c0fa;
+
+ .@{inputNumberPrefixCls}-handler-up, .@{inputNumberPrefixCls}-handler-wrap {
+ border-color: #23c0fa;
+ }
+ }
+
+ &-disabled:hover {
+ border-color: #d9d9d9;
+
+ .@{inputNumberPrefixCls}-handler-up, .@{inputNumberPrefixCls}-handler-wrap {
+ border-color: #d9d9d9;
+ }
+ }
+
+ &-input-wrap {
+ overflow: hidden;
+ height: 26px;
+ }
+
+ &-input {
+ width: 100%;
+ text-align: center;
+ outline: 0;
+ -moz-appearance: textfield;
+ line-height: 26px;
+ height: 24px;
+ transition: all 0.3s ease;
+ color: #666666;
+ border: 0;
+ border-radius: 5px;
+ padding: 0;
+ }
+
+ &-handler-wrap {
+ float: right;
+ border-left: 1px solid #D9D9D9;
+ width: 20px;
+ height: 26px;
+ }
+
+ &-handler-up {
+ border-bottom: 1px solid #D9D9D9;
+ &-inner {
+ .iconfont-mixin();
+ top:-2px;
+ &:before {
+ content: "\e611";
+ transform: rotate(270deg) scale(0.8);
+ }
+ }
+ }
+
+ &-handler-down {
+ &-inner {
+ .iconfont-mixin();
+ &:before {
+ content: "\e611";
+ transform: rotate(90deg) scale(0.8);
+ }
+ }
+ }
+
+ .handler-disabled() {
+ opacity: 0.72;
+ &:hover {
+ color: #999;
+ border-color: #d9d9d9;
+ }
+ }
+
+ &-handler-down-disabled, &-handler-up-disabled {
+ .handler-disabled();
+ }
+
+ &-disabled {
+ .@{inputNumberPrefixCls}-input {
+ opacity: 0.72;
+ cursor: not-allowed;
+ background-color: #f3f3f3;
+ }
+ .@{inputNumberPrefixCls}-handler {
+ .handler-disabled();
+ }
+ }
+}
diff --git a/style/core/iconfont.less b/style/core/iconfont.less
index d6b75137b84709920cecf43248ba59892b354f70..078552dbb2743a4f1c86e470011e27b7d7cb6a01 100644
--- a/style/core/iconfont.less
+++ b/style/core/iconfont.less
@@ -1,3 +1,5 @@
+@import "../mixins/iconfont";
+
// font-face
// @icon-url: 字体源文件的地址
@font-face {
@@ -10,22 +12,7 @@
}
.@{iconfont-css-prefix} {
- position: relative;
- display: inline-block;
- font-style: normal;
- vertical-align: baseline;
- text-align: center;
- text-transform: none;
- text-rendering: auto;
- // 更好地渲染字体
- -webkit-font-smoothing: antialiased;
- -webkit-text-stroke-width: 0px;
- -moz-osx-font-smoothing: grayscale;
-
- &:before {
- display: block;
- font-family: "anticon" !important;
- }
+ .iconfont-mixin();
}
// 方向性图标
.@{iconfont-css-prefix}-step-backward:before {content:"\e662";}
diff --git a/style/mixins/iconfont.less b/style/mixins/iconfont.less
new file mode 100644
index 0000000000000000000000000000000000000000..cbd64bef823b3abe134dfe2dc6cb3c214d7ccbe1
--- /dev/null
+++ b/style/mixins/iconfont.less
@@ -0,0 +1,18 @@
+.iconfont-mixin() {
+ position: relative;
+ display: inline-block;
+ font-style: normal;
+ vertical-align: baseline;
+ text-align: center;
+ text-transform: none;
+ text-rendering: auto;
+ // 更好地渲染字体
+ -webkit-font-smoothing: antialiased;
+ -webkit-text-stroke-width: 0px;
+ -moz-osx-font-smoothing: grayscale;
+
+ &:before {
+ display: block;
+ font-family: "anticon" !important;
+ }
+}
\ No newline at end of file