feat(Radio): support rtl

src/radio/main.scss

@@ -2,6 +2,7 @@
 
 @import '../core/index-noreset';
 @import "scss/variable";
+@import './rtl.scss';
 
 #{$radio-prefix}-wrapper {
     outline: 0;

src/radio/radio-group.jsx

@@ -18,6 +18,7 @@ class RadioGroup extends Component {
          * 样式类名的品牌前缀
          */
         prefix: PropTypes.string,
+        rtl: PropTypes.bool,
         /**
          * 自定义类名
          */
@@ -135,10 +136,14 @@ class RadioGroup extends Component {
     }
 
     render() {
-        const { className, shape, size, style, prefix, itemDirection } = this.props;
+        const { rtl, className, shape, size, style, prefix, itemDirection } = this.props;
         const others = pickOthers(Object.keys(RadioGroup.propTypes), this.props);
         const disabled = this.props.disabled;
 
+        if (rtl) {
+            others.dir = 'rtl';
+        }
+
         let children;
         if (this.props.children) {
             children = this.props.children;

src/radio/radio.jsx

@@ -204,6 +204,7 @@ class Radio extends UIState {
             <label
                 {...othersData}
                 role="radio"
+                dir={rtl ? 'rtl' : 'ltr'}
                 style={style}
                 tabIndex={tabIndex}
                 aria-checked={checked}

src/radio/rtl.scss

@@ -0,0 +1,81 @@
+#{$radio-prefix}-button-large[dir='rtl'] {
+    > label {
+        &:first-child {
+            margin-left: -1px;
+            border-top-right-radius: $radio-button-corner-large;
+            border-bottom-right-radius: $radio-button-corner-large;
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+        }
+        &:last-child {
+            margin-left: 0;
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            border-top-left-radius: $radio-button-corner-large;
+            border-bottom-left-radius: $radio-button-corner-large;
+        }
+    }
+
+    #{$radio-prefix}-label {
+        height: $radio-button-height-large - 2;
+        line-height: $radio-button-height-large - 2;
+        font-size: $radio-button-font-size-large;
+    }
+}
+
+#{$radio-prefix}-button-medium[dir='rtl'] {
+    > label {
+        &:first-child {
+            margin-left: -1px;
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+            border-top-right-radius: $radio-button-corner-medium;
+            border-bottom-right-radius: $radio-button-corner-medium;
+        }
+        &:last-child {
+            margin-left: 0;
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            border-top-left-radius: $radio-button-corner-medium;
+            border-bottom-left-radius: $radio-button-corner-medium;
+        }
+    }
+}
+
+#{$radio-prefix}-button-small[dir='rtl'] {
+    > label {
+        &:first-child {
+            margin-left: -1px;
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+            border-top-right-radius: $radio-button-corner-small;
+            border-bottom-right-radius: $radio-button-corner-small;
+        }
+        &:last-child {
+            margin-left: 0;
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            border-top-left-radius: $radio-button-corner-small;
+            border-bottom-left-radius: $radio-button-corner-small;
+        }
+    }
+}
+
+
+#{$radio-prefix}-wrapper[dir='rtl'] {
+    #{$radio-prefix}-label {
+        margin-left: 0px;
+        margin-right: 4px;
+    }
+}
+
+
+#{$radio-prefix}-group[dir='rtl'] {
+    #{$radio-prefix}-label {
+        margin-right: 4px;
+        margin-left: 16px;
+    }
+}
+#{$radio-prefix}-button[dir='rtl'] > label #{$radio-prefix}-label {
+    margin: 0;
+}