ywana-core8 0.1.45 → 0.1.46

package/dist/index.cjs

@@ -490,65 +490,34 @@ var ActionButton = function ActionButton(props) {
 var CheckBox = function CheckBox(props) {
   var id = props.id,
     label = props.label,
-    placeholder = props.placeholder,
-    value = props.value,
+    _props$value = props.value,
+    value = _props$value === void 0 ? false : _props$value,
     _props$readOnly = props.readOnly,
     readOnly = _props$readOnly === void 0 ? false : _props$readOnly,
     onChange = props.onChange;
+  var _React$useState = React__default["default"].useState(value),
+    checked = _React$useState[0],
+    setChecked = _React$useState[1];
+  React.useEffect(function () {
+    setChecked(value);
+  }, [value]);
   function change(event) {
     event.stopPropagation();
-    event.preventDefault();
-    var value = event.target.checked;
-    if (onChange) onChange(id, value);
-  }
-  var labelTxt = /*#__PURE__*/React__default["default"].createElement(Text, null, label);
-  var placeholderTxt = /*#__PURE__*/React__default["default"].createElement(Text, null, placeholder);
-  if (readOnly === true) {
-    return value === true ? /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "checkbox",
-      key: id + "1"
-    }, /*#__PURE__*/React__default["default"].createElement(Icon, {
-      id: id,
-      icon: "check",
-      size: "small"
-    }), /*#__PURE__*/React__default["default"].createElement("span", {
-      className: "checkmark"
-    }), /*#__PURE__*/React__default["default"].createElement("label", {
-      htmlFor: id
-    }, labelTxt)) : /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "checkbox",
-      key: id + "0"
-    }, /*#__PURE__*/React__default["default"].createElement("span", {
-      className: "checkmark"
-    }), /*#__PURE__*/React__default["default"].createElement("label", {
-      htmlFor: id
-    }, labelTxt));
+    var nextValue = event.target.checked;
+    setChecked(nextValue);
+    if (onChange) onChange(id, nextValue);
   }
-  return value === true ? /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "checkbox",
+  var labelTxt = label && /*#__PURE__*/React__default["default"].createElement(Text, null, label);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "checkbox " + (readOnly ? "readonly" : ""),
     key: id + "1"
   }, /*#__PURE__*/React__default["default"].createElement("input", {
     id: id,
+    key: id + "_" + checked,
     type: "checkbox",
-    placeholder: placeholderTxt,
-    checked: true,
-    value: value,
+    checked: checked,
     onChange: change,
-    readOnly: true
-  }), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "checkmark"
-  }), /*#__PURE__*/React__default["default"].createElement("label", {
-    htmlFor: id
-  }, labelTxt)) : /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "checkbox",
-    key: id + "0"
-  }, /*#__PURE__*/React__default["default"].createElement("input", {
-    id: id,
-    type: "checkbox",
-    placeholder: placeholderTxt,
-    value: value,
-    onChange: change,
-    readOnly: true
+    disabled: readOnly
   }), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "checkmark"
   }), /*#__PURE__*/React__default["default"].createElement("label", {