@uiw/react-radio - npm Package Compare versions

Comparing version 4.17.0 to 4.18.0

cjs/index.d.ts

 export * from './Radio';
 export * from './RadioGroup';
 export * from './RadioAbstract';
+export * from './RadioButton';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as RadioButton } from './RadioButton';

cjs/index.js

@@ -10,3 +10,4 @@ "use strict";
   Radio: true,
-  RadioGroup: true
+  RadioGroup: true,
+  RadioButton: true
 };
@@ -19,2 +20,8 @@ Object.defineProperty(exports, "Radio", {
 });
+Object.defineProperty(exports, "RadioButton", {
+  enumerable: true,
+  get: function get() {
+    return _RadioButton["default"];
+  }
+});
 Object.defineProperty(exports, "RadioGroup", {
@@ -68,2 +75,16 @@ enumerable: true,
 });
+
+var _RadioButton = _interopRequireWildcard(require("./RadioButton"));
+
+Object.keys(_RadioButton).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _RadioButton[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _RadioButton[key];
+    }
+  });
+});
 //# sourceMappingURL=index.js.map

cjs/RadioGroup.js

@@ -16,2 +16,4 @@ "use strict";
 
+var _reactButtonGroup = _interopRequireDefault(require("@uiw/react-button-group"));
+
 var _jsxRuntime = require("react/jsx-runtime");
@@ -33,10 +35,12 @@
     className: [prefixCls, className].filter(Boolean).join(' ').trim(),
-    children: _react["default"].Children.toArray(children).map(function (child) {
-      if (!child) return;
-      if (! /*#__PURE__*/_react["default"].isValidElement(child)) return child;
-      return /*#__PURE__*/_react["default"].cloneElement(child, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, child.props || {}), {
-        checked: child.props.value === value,
-        name: name,
-        onChange: onChange
-      }));
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactButtonGroup["default"], {
+      children: _react["default"].Children.toArray(children).map(function (child) {
+        if (!child) return;
+        if (! /*#__PURE__*/_react["default"].isValidElement(child)) return child;
+        return /*#__PURE__*/_react["default"].cloneElement(child, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, child.props || {}), {
+          checked: child.props.value === value,
+          name: name,
+          onChange: onChange
+        }));
+      })
     })
@@ -43,0 +47,0 @@ }));

esm/index.d.ts

 export * from './Radio';
 export * from './RadioGroup';
 export * from './RadioAbstract';
+export * from './RadioButton';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as RadioButton } from './RadioButton';

esm/index.js

 export * from './Radio';
 export * from './RadioGroup';
 export * from './RadioAbstract';
+export * from './RadioButton';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as RadioButton } from './RadioButton';
 //# sourceMappingURL=index.js.map

esm/RadioGroup.js

@@ -5,2 +5,3 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import ButtonGroup from '@uiw/react-button-group';
 import "./style/group.css";
@@ -22,10 +23,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
     className: [prefixCls, className].filter(Boolean).join(' ').trim(),
-    children: React.Children.toArray(children).map(child => {
-      if (!child) return;
-      if (! /*#__PURE__*/React.isValidElement(child)) return child;
-      return /*#__PURE__*/React.cloneElement(child, _extends({}, child.props || {}, {
-        checked: child.props.value === value,
-        name,
-        onChange
-      }));
+    children: /*#__PURE__*/_jsx(ButtonGroup, {
+      children: React.Children.toArray(children).map(child => {
+        if (!child) return;
+        if (! /*#__PURE__*/React.isValidElement(child)) return child;
+        return /*#__PURE__*/React.cloneElement(child, _extends({}, child.props || {}, {
+          checked: child.props.value === value,
+          name,
+          onChange
+        }));
+      })
     })
@@ -32,0 +35,0 @@ }));

package.json

 {
   "name": "@uiw/react-radio",
-  "version": "4.17.0",
+  "version": "4.18.0",
   "description": "Radio component",
@@ -47,4 +47,6 @@ "author": "Kenny Wong <[e-mail]>",
   "dependencies": {
-    "@uiw/utils": "^4.17.0"
+    "@uiw/react-button": "^4.18.0",
+    "@uiw/react-button-group": "^4.18.0",
+    "@uiw/utils": "^4.18.0"
   }
 }

README.md

@@ -11,5 +11,5 @@ Radio 单选框
 ```jsx
-import { Radio, RadioGroup } from 'uiw';
+import { Radio, RadioButton, RadioGroup } from 'uiw';
 // or
-import { Radio, RadioGroup } from '@uiw/react-radio';
+import { Radio, RadioButton, RadioGroup } from '@uiw/react-radio';
 ```
@@ -24,3 +24,3 @@
 import ReactDOM from 'react-dom';
-import { Radio } from 'uiw';
+import { Radio, RadioButton } from 'uiw';
 
@@ -33,2 +33,5 @@ const Demo = () => (
     <Radio value="4" checked disabled>选中并禁用</Radio>
+    <Radio value="4" checked disabled>选中并禁用</Radio>
+    <RadioButton value="5" >RadioButton</RadioButton>
+    <RadioButton value="5" checked >RadioButton 选中</RadioButton>
   </div>
@@ -44,3 +47,3 @@ );
 import ReactDOM from 'react-dom';
-import { Form, Radio, RadioGroup, Row, Col, Button, Notify } from 'uiw';
+import { Form, Radio, RadioGroup, RadioButton, Row, Col, Button, Notify } from 'uiw';
 
@@ -82,2 +85,15 @@ const Demo = () => (
       },
+      radioButtonGroup: {
+        value: 'girl',
+        label: '请输入内容',
+        help: '必须选择性别！',
+        children: (
+          <RadioGroup>
+            <RadioButton value="man">男</RadioButton>
+            <RadioButton value="girl">女</RadioButton>
+            <RadioButton value="shemale">中性</RadioButton>
+            <RadioButton value="unknown">未知</RadioButton>
+          </RadioGroup>
+        ),
+      },
       radio: {
@@ -97,2 +113,5 @@ help: '请选择！该选项为必选！',
           <Row>
+            <Col>{fields.radioButtonGroup}</Col>
+          </Row>
+          <Row>
             <Col>{fields.radio}</Col>
@@ -129,3 +148,3 @@ </Row>
 import ReactDOM from 'react-dom';
-import { Radio, RadioGroup } from 'uiw';
+import { Radio, RadioGroup, RadioButton } from 'uiw';
 
@@ -137,4 +156,4 @@ class Demo extends React.Component {
   }
-  onChange(e) {
-    this.setState({ value: e.target.value });
+  onChange(value) {
+    this.setState({ value });
   }
@@ -144,3 +163,3 @@ render() {
       <div>
-        <RadioGroup name="sexs" value={this.state.value} onChange={this.onChange.bind(this)}>
+        <RadioGroup name="sexs" value={this.state.value} onChange={(e)=>this.onChange(e.target.value)}>
           <Radio value="man">男</Radio>
@@ -151,2 +170,8 @@ <Radio value="girl">女</Radio>
         </RadioGroup>
+        <RadioGroup name="sexs" value={this.state.value} onChange={this.onChange.bind(this)} style={{ marginTop: 20 }}>
+          <RadioButton value="man">男</RadioButton>
+          <RadioButton value="girl">女</RadioButton>
+          <RadioButton value="shemale" disabled>中性</RadioButton>
+          <RadioButton value="unknown" disabled>未知</RadioButton>
+        </RadioGroup>
       </div>
@@ -174,4 +199,4 @@ )
   }
-  onChange(e) {
-    this.setState({ value: e.target.value });
+  onChange(value) {
+    this.setState({ value });
   }
@@ -181,3 +206,3 @@ render() {
       <div>
-        <RadioGroup name="other" value={this.state.value} onChange={this.onChange.bind(this)}>
+        <RadioGroup name="other" value={this.state.value} onChange={(e)=>this.onChange(e.target.value)}>
           <div>Group 1</div>
@@ -192,3 +217,10 @@ <Radio value="男">男</Radio>
           <Radio value="F" style={{ display: 'block' }}>Item F</Radio>
+          <div>Group 3</div>
         </RadioGroup>
+
+        <RadioGroup name="other" value={this.state.value} onChange={this.onChange.bind(this)} style={{ marginTop:20 }}>
+          <RadioButton value="男">男</RadioButton>
+          <RadioButton value="女">女</RadioButton>
+          <RadioButton value="未知">未知</RadioButton>
+        </RadioGroup>
         <Divider />
@@ -221,3 +253,3 @@ <Button
 
-## RadioGroup 
+## RadioGroup
 
@@ -224,0 +256,0 @@ | 参数 | 说明 | 类型 | 默认值 |

src/index.ts

 export * from './Radio';
 export * from './RadioGroup';
 export * from './RadioAbstract';
+export * from './RadioButton';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as RadioButton } from './RadioButton';

No alert changes

Improved metrics

Total package byte prevSize

80921

increased by67.66%

Number of package files

48

increased by17.07%

Lines of code

916

increased by49.92%

Number of lines in readme file

247

increased by14.88%

Worsened metrics

Dependency count

5

increased by66.67%

Dependency changes

• + Added@uiw/react-button@^4.18.0

• + Added@uiw/react-button-group@^4.18.0

• + Added@uiw/icons@2.6.10(transitive)

• + Added@uiw/react-button@4.22.3(transitive)

• + Added@uiw/react-button-group@4.22.3(transitive)

• + Added@uiw/react-icon@4.22.3(transitive)

• Updated@uiw/utils@^4.18.0