Add LocalProvider, ref #1055

components/locale-provider/demo/basic.md

@@ -0,0 +1,29 @@
+# 国际化
+
+- order: 1
+
+用 `LocaleProvider` 包裹你的应用，并引用对应的语言包。
+
+---
+
+````jsx
+import { Pagination, DatePicker, LocaleProvider } from 'antd';
+import enUS from 'antd/lib/locale-provider/en_US';
+
+const App = React.createClass({
+  render() {
+    return (
+      <div>
+        <DatePicker />
+        <Pagination defaultCurrent={1} total={50} showSizeChanger />
+      </div>
+    );
+  }
+});
+
+ReactDOM.render(
+  <LocaleProvider locale={enUS}>
+    <App />
+  </LocaleProvider>
+, mountNode);
+````

components/locale-provider/en_US.js

@@ -0,0 +1,3 @@
+module.exports = {
+  Pagination: require('rc-pagination/lib/locale/en_US'),
+};

components/locale-provider/index.jsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+export default class LocaleProvider extends React.Component {
+  getChildContext() {
+    return {
+      locale: this.props.locale,
+    };
+  }
+  render() {
+    return React.cloneElement(this.props.children);
+  }
+}
+
+LocaleProvider.childContextTypes = {
+  locale: React.PropTypes.object,
+};
+
+LocaleProvider.propTypes = {
+  locale: React.PropTypes.object,
+};

components/locale-provider/index.md

@@ -0,0 +1,21 @@
+# LocaleProvider
+
+- category: Components
+- chinese: 国际化
+- cols: 1
+
+---
+
+为组件文案提供统一的国际化配置功能。
+
+## API
+
+Wrap your App with `LocaleProvider` once.
+
+```jsx
+<LocaleProvider locale={enUS}>
+  <App />
+</LocaleProvider>
+```
+
+### Add a language

components/pagination/demo/locale.md

@@ -7,10 +7,12 @@
 ---
 
 ````jsx
-import { Pagination } from 'antd';
-import enUS from 'antd/lib/pagination/locale/en_US';
+import { Pagination, LocaleProvider } from 'antd';
+import enUS from 'antd/lib/locale-provider/en_US';
 
 ReactDOM.render(
-  <Pagination defaultCurrent={1} total={50} locale={enUS} />,
+  <LocaleProvider locale={enUS}>
+    <Pagination defaultCurrent={1} total={50} />
+  </LocaleProvider>,
  mountNode);
 ````

components/pagination/index.jsx

@@ -16,6 +16,13 @@ class AntPagination extends React.Component {
     let className = this.props.className;
     let selectComponentClass = Select;
 
+    let locale;
+    if (this.context.locale && this.context.locale.Pagination) {
+      locale = this.context.locale.Pagination;
+    } else {
+      locale = this.props.locale;
+    }
+
     if (this.props.size === 'small') {
       className += ' mini';
       selectComponentClass = MiniSelect;
@@ -25,6 +32,7 @@ class AntPagination extends React.Component {
       <Pagination selectComponentClass={selectComponentClass}
         selectPrefixCls="ant-select"
         {...this.props}
+        locale={locale}
         className={className} />
     );
   }
@@ -36,4 +44,8 @@ AntPagination.defaultProps = {
   prefixCls: 'ant-pagination',
 };
 
+AntPagination.contextTypes = {
+  locale: React.PropTypes.object,
+};
+
 export default AntPagination;

index.js

@@ -46,6 +46,7 @@ const antd = {
   Transfer: require('./components/transfer'),
   Cascader: require('./components/cascader'),
   Card: require('./components/card'),
+  LocaleProvider: require('./components/locale-provider'),
 };
 
 module.exports = antd;

scripts/demo.js

@@ -61,6 +61,8 @@ antd.Pagination.locale = {
   zh_CN: require('../components/pagination/locale/zh_CN'),
 };
 
+antd.LocaleProvider['en_US'] = require('../components/locale-provider/en_US'),
+
 InstantClickChangeFns.push(function () {
   // auto complete for components
   var Select = antd.Select;