@douyinfe/semi-ui 2.19.0-alpha.5 → 2.19.0-alpha.6

package/lib/cjs/button/buttonGroup.d.ts

@@ -25,6 +25,5 @@ export default class ButtonGroup extends BaseComponent<ButtonGroupProps> {
     static defaultProps: {
         size: string;
     };
-    getInnerWithLine(inner: any): any;
     render(): JSX.Element;
 }

package/lib/cjs/button/buttonGroup.js

@@ -18,22 +18,12 @@ var _indexOf = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-st
 
 var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
 
-var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
-var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
-
-var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
-
-var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 
 var _isArray = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/is-array"));
 
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
 
-var _get2 = _interopRequireDefault(require("lodash/get"));
-
 var _react = _interopRequireWildcard(require("react"));
 
 var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
@@ -65,47 +55,6 @@ const prefixCls = _constants.cssClasses.PREFIX;
 const btnSizes = _constants.strings.sizes;
 
 class ButtonGroup extends _baseComponent.default {
-  getInnerWithLine(inner) {
-    const innerWithLine = [];
-    let lineCls = "".concat(prefixCls, "-group-line");
-
-    if (inner.length > 1) {
-      var _context;
-
-      (0, _forEach.default)(_context = (0, _slice.default)(inner).call(inner, 0, -1)).call(_context, item => {
-        var _context2;
-
-        const isButtonType = (0, _includes.default)(_context2 = [(0, _get2.default)(item, 'type.displayName'), (0, _get2.default)(item, 'type.name')]).call(_context2, 'Button');
-        const buttonProps = (0, _get2.default)(item, 'props');
-
-        if (buttonProps) {
-          var _context3, _context4;
-
-          const {
-            type,
-            theme,
-            disabled
-          } = buttonProps;
-          lineCls = (0, _classnames.default)("".concat(prefixCls, "-group-line"), (0, _concat.default)(_context3 = "".concat(prefixCls, "-group-line-")).call(_context3, theme !== null && theme !== void 0 ? theme : 'light'), (0, _concat.default)(_context4 = "".concat(prefixCls, "-group-line-")).call(_context4, type !== null && type !== void 0 ? type : 'primary'), {
-            ["".concat(prefixCls, "-group-line-disabled")]: disabled
-          });
-        }
-
-        if (isButtonType) {
-          innerWithLine.push(item, /*#__PURE__*/_react.default.createElement("span", {
-            className: lineCls
-          }));
-        } else {
-          innerWithLine.push(item);
-        }
-      });
-      innerWithLine.push((0, _slice.default)(inner).call(inner, -1));
-      return innerWithLine;
-    } else {
-      return inner;
-    }
-  }
-
   render() {
     const _a = this.props,
           {
@@ -119,27 +68,25 @@ class ButtonGroup extends _baseComponent.default {
           rest = __rest(_a, ["children", "disabled", "size", "type", "className", 'aria-label']);
 
     let inner;
-    let innerWithLine = [];
     const cls = (0, _classnames.default)("".concat(prefixCls, "-group"), className);
 
     if (children) {
-      var _context5;
+      var _context;
 
-      inner = (0, _map.default)(_context5 = (0, _isArray.default)(children) ? children : [children]).call(_context5, (itm, index) => /*#__PURE__*/(0, _react.isValidElement)(itm) ? /*#__PURE__*/(0, _react.cloneElement)(itm, (0, _assign.default)((0, _assign.default)((0, _assign.default)({
+      inner = (0, _map.default)(_context = (0, _isArray.default)(children) ? children : [children]).call(_context, (itm, index) => /*#__PURE__*/(0, _react.isValidElement)(itm) ? /*#__PURE__*/(0, _react.cloneElement)(itm, (0, _assign.default)((0, _assign.default)((0, _assign.default)({
         disabled,
         size,
         type
       }, itm.props), rest), {
         key: index
       })) : itm);
-      innerWithLine = this.getInnerWithLine(inner);
     }
 
     return /*#__PURE__*/_react.default.createElement("div", {
       className: cls,
       role: "group",
       "aria-label": ariaLabel
-    }, innerWithLine);
+    }, inner);
   }
 
 }

package/lib/cjs/radio/radio.js

@@ -228,16 +228,26 @@ class Radio extends _baseComponent.default {
       ["".concat(prefix, "-focus")]: focusVisible && isButtonRadio
     }, addonClassName);
 
-    const renderContent = () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children ? /*#__PURE__*/_react.default.createElement("span", {
-      className: addonCls,
-      style: addonStyle,
-      id: addonId,
-      "x-semi-prop": "children"
-    }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefix, "-extra"),
-      id: extraId,
-      "x-semi-prop": "extra"
-    }, extra) : null);
+    const renderContent = () => {
+      if (!children && !extra) {
+        return null;
+      }
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _classnames.default)(["".concat(prefix, "-content"), {
+          ["".concat(prefix, "-isCardRadioGroup_content")]: isCardRadioGroup
+        }])
+      }, children ? /*#__PURE__*/_react.default.createElement("span", {
+        className: addonCls,
+        style: addonStyle,
+        id: addonId,
+        "x-semi-prop": "children"
+      }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/_react.default.createElement("div", {
+        className: "".concat(prefix, "-extra"),
+        id: extraId,
+        "x-semi-prop": "extra"
+      }, extra) : null);
+    };
 
     return /*#__PURE__*/_react.default.createElement("label", {
       style: style,
@@ -258,9 +268,7 @@ class Radio extends _baseComponent.default {
       focusInner: focusVisible && !focusOuter,
       onInputFocus: this.handleFocusVisible,
       onInputBlur: this.handleBlur
-    })), isCardRadioGroup ? /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefix, "-isCardRadioGroup_content")
-    }, renderContent()) : renderContent());
+    })), renderContent());
   }
 
 }

package/lib/cjs/radio/radioGroup.js

@@ -45,7 +45,7 @@ class RadioGroup extends _baseComponent.default {
     this.getFormatName = () => this.props.name || 'default';
 
     this.state = {
-      value: undefined
+      value: props.value || props.defaultValue
     };
     this.foundation = new _radioGroupFoundation.default(this.adapter);
   }

package/lib/es/button/buttonGroup.d.ts

@@ -25,6 +25,5 @@ export default class ButtonGroup extends BaseComponent<ButtonGroupProps> {
     static defaultProps: {
         size: string;
     };
-    getInnerWithLine(inner: any): any;
     render(): JSX.Element;
 }

package/lib/es/button/buttonGroup.js

@@ -1,10 +1,5 @@
-import _get from "lodash/get";
 import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
 import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
-import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
-import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
-import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array";
 import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
@@ -29,49 +24,6 @@ import '@douyinfe/semi-foundation/lib/es/button/button.css';
 const prefixCls = cssClasses.PREFIX;
 const btnSizes = strings.sizes;
 export default class ButtonGroup extends BaseComponent {
-  getInnerWithLine(inner) {
-    const innerWithLine = [];
-    let lineCls = "".concat(prefixCls, "-group-line");
-
-    if (inner.length > 1) {
-      var _context;
-
-      _forEachInstanceProperty(_context = _sliceInstanceProperty(inner).call(inner, 0, -1)).call(_context, item => {
-        var _context2;
-
-        const isButtonType = _includesInstanceProperty(_context2 = [_get(item, 'type.displayName'), _get(item, 'type.name')]).call(_context2, 'Button');
-
-        const buttonProps = _get(item, 'props');
-
-        if (buttonProps) {
-          var _context3, _context4;
-
-          const {
-            type,
-            theme,
-            disabled
-          } = buttonProps;
-          lineCls = classNames("".concat(prefixCls, "-group-line"), _concatInstanceProperty(_context3 = "".concat(prefixCls, "-group-line-")).call(_context3, theme !== null && theme !== void 0 ? theme : 'light'), _concatInstanceProperty(_context4 = "".concat(prefixCls, "-group-line-")).call(_context4, type !== null && type !== void 0 ? type : 'primary'), {
-            ["".concat(prefixCls, "-group-line-disabled")]: disabled
-          });
-        }
-
-        if (isButtonType) {
-          innerWithLine.push(item, /*#__PURE__*/React.createElement("span", {
-            className: lineCls
-          }));
-        } else {
-          innerWithLine.push(item);
-        }
-      });
-
-      innerWithLine.push(_sliceInstanceProperty(inner).call(inner, -1));
-      return innerWithLine;
-    } else {
-      return inner;
-    }
-  }
-
   render() {
     const _a = this.props,
           {
@@ -85,27 +37,25 @@ export default class ButtonGroup extends BaseComponent {
           rest = __rest(_a, ["children", "disabled", "size", "type", "className", 'aria-label']);
 
     let inner;
-    let innerWithLine = [];
     const cls = classNames("".concat(prefixCls, "-group"), className);
 
     if (children) {
-      var _context5;
+      var _context;
 
-      inner = _mapInstanceProperty(_context5 = _Array$isArray(children) ? children : [children]).call(_context5, (itm, index) => /*#__PURE__*/isValidElement(itm) ? /*#__PURE__*/cloneElement(itm, _Object$assign(_Object$assign(_Object$assign({
+      inner = _mapInstanceProperty(_context = _Array$isArray(children) ? children : [children]).call(_context, (itm, index) => /*#__PURE__*/isValidElement(itm) ? /*#__PURE__*/cloneElement(itm, _Object$assign(_Object$assign(_Object$assign({
         disabled,
         size,
         type
       }, itm.props), rest), {
         key: index
       })) : itm);
-      innerWithLine = this.getInnerWithLine(inner);
     }
 
     return /*#__PURE__*/React.createElement("div", {
       className: cls,
       role: "group",
       "aria-label": ariaLabel
-    }, innerWithLine);
+    }, inner);
   }
 
 }

package/lib/es/radio/radio.js

@@ -203,16 +203,26 @@ class Radio extends BaseComponent {
       ["".concat(prefix, "-focus")]: focusVisible && isButtonRadio
     }, addonClassName);
 
-    const renderContent = () => /*#__PURE__*/React.createElement(React.Fragment, null, children ? /*#__PURE__*/React.createElement("span", {
-      className: addonCls,
-      style: addonStyle,
-      id: addonId,
-      "x-semi-prop": "children"
-    }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefix, "-extra"),
-      id: extraId,
-      "x-semi-prop": "extra"
-    }, extra) : null);
+    const renderContent = () => {
+      if (!children && !extra) {
+        return null;
+      }
+
+      return /*#__PURE__*/React.createElement("div", {
+        className: cls(["".concat(prefix, "-content"), {
+          ["".concat(prefix, "-isCardRadioGroup_content")]: isCardRadioGroup
+        }])
+      }, children ? /*#__PURE__*/React.createElement("span", {
+        className: addonCls,
+        style: addonStyle,
+        id: addonId,
+        "x-semi-prop": "children"
+      }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefix, "-extra"),
+        id: extraId,
+        "x-semi-prop": "extra"
+      }, extra) : null);
+    };
 
     return /*#__PURE__*/React.createElement("label", {
       style: style,
@@ -233,9 +243,7 @@ class Radio extends BaseComponent {
       focusInner: focusVisible && !focusOuter,
       onInputFocus: this.handleFocusVisible,
       onInputBlur: this.handleBlur
-    })), isCardRadioGroup ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefix, "-isCardRadioGroup_content")
-    }, renderContent()) : renderContent());
+    })), renderContent());
   }
 
 }

package/lib/es/radio/radioGroup.js

@@ -22,7 +22,7 @@ class RadioGroup extends BaseComponent {
     this.getFormatName = () => this.props.name || 'default';
 
     this.state = {
-      value: undefined
+      value: props.value || props.defaultValue
     };
     this.foundation = new RadioGroupFoundation(this.adapter);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.19.0-alpha.5",
+    "version": "2.19.0-alpha.6",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -15,11 +15,11 @@
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
         "@douyinfe/semi-animation": "2.12.0",
-        "@douyinfe/semi-animation-react": "2.19.0-alpha.5",
-        "@douyinfe/semi-foundation": "2.19.0-alpha.5",
-        "@douyinfe/semi-icons": "2.19.0-alpha.5",
+        "@douyinfe/semi-animation-react": "2.19.0-alpha.6",
+        "@douyinfe/semi-foundation": "2.19.0-alpha.6",
+        "@douyinfe/semi-icons": "2.19.0-alpha.6",
         "@douyinfe/semi-illustrations": "2.15.0",
-        "@douyinfe/semi-theme-default": "2.19.0-alpha.5",
+        "@douyinfe/semi-theme-default": "2.19.0-alpha.6",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",
@@ -66,13 +66,13 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "f49d77763d9cf17af15945bddd04557e57858b4b",
+    "gitHead": "f131defbb2a909ebb7035eea975bf3466908ac15",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",
         "@babel/preset-react": "^7.14.5",
-        "@douyinfe/semi-scss-compile": "2.19.0-alpha.5",
+        "@douyinfe/semi-scss-compile": "2.19.0-alpha.6",
         "@storybook/addon-knobs": "^6.3.1",
         "@types/lodash": "^4.14.176",
         "@types/react": ">=16.0.0",

package/radio/_story/radio.stories.js

@@ -254,18 +254,18 @@ _RadioGroup.story = {
 
 export const RadioWithVertical = () => {
   return (
-    <Radio.Group>
-      <Radio value="A" displayMode="vertical">
+    <Radio.Group direction="vertical">
+      <Radio value="A">
         无限长的一串字The Storybook webapp UI can be customised with this addon. It can be used to
         change the header, show/hide various UI elements and to enable full-screen mode by default.
       </Radio>
-      <Radio value="C" displayMode="vertical">
+      <Radio value="C">
         C
       </Radio>
-      <Radio value="D" displayMode="vertical">
+      <Radio value="D">
         D
       </Radio>
-      <Radio value="E" displayMode="vertical">
+      <Radio value="E">
         E
       </Radio>
     </Radio.Group>

package/radio/radio.tsx

@@ -268,20 +268,25 @@ class Radio extends BaseComponent<RadioProps, RadioState> {
             [`${prefix}-addon-buttonRadio-${buttonSize}`]: isButtonRadio && buttonSize,
             [`${prefix}-focus`]: focusVisible && isButtonRadio,
         }, addonClassName);
-        const renderContent = () => (
-            <>
-                {children ? (
-                    <span className={addonCls} style={addonStyle} id={addonId} x-semi-prop="children">
-                        {children}
-                    </span>
-                ) : null}
-                {extra && !isButtonRadio ? (
-                    <div className={`${prefix}-extra`} id={extraId} x-semi-prop="extra">
-                        {extra}
-                    </div>
-                ) : null}
-            </>
-        );
+        const renderContent = () => {
+            if (!children && !extra) {
+                return null;
+            }
+            return (
+                <div className={cls([`${prefix}-content`, { [`${prefix}-isCardRadioGroup_content`]: isCardRadioGroup }])}>
+                    {children ? (
+                        <span className={addonCls} style={addonStyle} id={addonId} x-semi-prop="children">
+                            {children}
+                        </span>
+                    ) : null}
+                    {extra && !isButtonRadio ? (
+                        <div className={`${prefix}-extra`} id={extraId} x-semi-prop="extra">
+                            {extra}
+                        </div>
+                    ) : null}
+                </div>
+            );
+        };
 
         return (
             <label
@@ -307,11 +312,7 @@ class Radio extends BaseComponent<RadioProps, RadioState> {
                     onInputFocus={this.handleFocusVisible}
                     onInputBlur={this.handleBlur}
                 />
-                {
-                    isCardRadioGroup ?
-                        <div className={`${prefix}-isCardRadioGroup_content`}>{renderContent()}</div> :
-                        renderContent()
-                }
+                {renderContent()}
             </label>
         );
     }

package/radio/radioGroup.tsx

@@ -88,7 +88,7 @@ class RadioGroup extends BaseComponent<RadioGroupProps, RadioGroupState> {
     constructor(props: RadioGroupProps) {
         super(props);
         this.state = {
-            value: undefined,
+            value: props.value || props.defaultValue,
         };
         this.foundation = new RadioGroupFoundation(this.adapter);
     }