ywana-core8 0.1.45 → 0.1.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +17 -48
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +22 -9
- package/dist/index.css.map +1 -1
- package/dist/index.modern.js +17 -48
- package/dist/index.modern.js.map +1 -1
- package/dist/index.umd.js +17 -48
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/html/checkbox.css +18 -9
- package/src/html/checkbox.js +30 -38
- package/src/html/textfield.css +4 -0
package/dist/index.modern.js
CHANGED
@@ -481,65 +481,34 @@ var ActionButton = function ActionButton(props) {
|
|
481
481
|
var CheckBox = function CheckBox(props) {
|
482
482
|
var id = props.id,
|
483
483
|
label = props.label,
|
484
|
-
|
485
|
-
value =
|
484
|
+
_props$value = props.value,
|
485
|
+
value = _props$value === void 0 ? false : _props$value,
|
486
486
|
_props$readOnly = props.readOnly,
|
487
487
|
readOnly = _props$readOnly === void 0 ? false : _props$readOnly,
|
488
488
|
onChange = props.onChange;
|
489
|
+
var _React$useState = React.useState(value),
|
490
|
+
checked = _React$useState[0],
|
491
|
+
setChecked = _React$useState[1];
|
492
|
+
useEffect(function () {
|
493
|
+
setChecked(value);
|
494
|
+
}, [value]);
|
489
495
|
function change(event) {
|
490
496
|
event.stopPropagation();
|
491
|
-
event.
|
492
|
-
|
493
|
-
if (onChange) onChange(id,
|
494
|
-
}
|
495
|
-
var labelTxt = /*#__PURE__*/React.createElement(Text, null, label);
|
496
|
-
var placeholderTxt = /*#__PURE__*/React.createElement(Text, null, placeholder);
|
497
|
-
if (readOnly === true) {
|
498
|
-
return value === true ? /*#__PURE__*/React.createElement("div", {
|
499
|
-
className: "checkbox",
|
500
|
-
key: id + "1"
|
501
|
-
}, /*#__PURE__*/React.createElement(Icon, {
|
502
|
-
id: id,
|
503
|
-
icon: "check",
|
504
|
-
size: "small"
|
505
|
-
}), /*#__PURE__*/React.createElement("span", {
|
506
|
-
className: "checkmark"
|
507
|
-
}), /*#__PURE__*/React.createElement("label", {
|
508
|
-
htmlFor: id
|
509
|
-
}, labelTxt)) : /*#__PURE__*/React.createElement("div", {
|
510
|
-
className: "checkbox",
|
511
|
-
key: id + "0"
|
512
|
-
}, /*#__PURE__*/React.createElement("span", {
|
513
|
-
className: "checkmark"
|
514
|
-
}), /*#__PURE__*/React.createElement("label", {
|
515
|
-
htmlFor: id
|
516
|
-
}, labelTxt));
|
497
|
+
var nextValue = event.target.checked;
|
498
|
+
setChecked(nextValue);
|
499
|
+
if (onChange) onChange(id, nextValue);
|
517
500
|
}
|
518
|
-
|
519
|
-
|
501
|
+
var labelTxt = label && /*#__PURE__*/React.createElement(Text, null, label);
|
502
|
+
return /*#__PURE__*/React.createElement("div", {
|
503
|
+
className: "checkbox " + (readOnly ? "readonly" : ""),
|
520
504
|
key: id + "1"
|
521
505
|
}, /*#__PURE__*/React.createElement("input", {
|
522
506
|
id: id,
|
507
|
+
key: id + "_" + checked,
|
523
508
|
type: "checkbox",
|
524
|
-
|
525
|
-
checked: true,
|
526
|
-
value: value,
|
509
|
+
checked: checked,
|
527
510
|
onChange: change,
|
528
|
-
|
529
|
-
}), /*#__PURE__*/React.createElement("span", {
|
530
|
-
className: "checkmark"
|
531
|
-
}), /*#__PURE__*/React.createElement("label", {
|
532
|
-
htmlFor: id
|
533
|
-
}, labelTxt)) : /*#__PURE__*/React.createElement("div", {
|
534
|
-
className: "checkbox",
|
535
|
-
key: id + "0"
|
536
|
-
}, /*#__PURE__*/React.createElement("input", {
|
537
|
-
id: id,
|
538
|
-
type: "checkbox",
|
539
|
-
placeholder: placeholderTxt,
|
540
|
-
value: value,
|
541
|
-
onChange: change,
|
542
|
-
readOnly: true
|
511
|
+
disabled: readOnly
|
543
512
|
}), /*#__PURE__*/React.createElement("span", {
|
544
513
|
className: "checkmark"
|
545
514
|
}), /*#__PURE__*/React.createElement("label", {
|